rt-sim-training-client/src/views/newMap/displayNew/menuDemon.vue
2020-05-20 10:50:13 +08:00

341 lines
13 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<div>
<chat-box ref="chatbox" :group="group" />
<div class="display-card" :style="{top: offset+'px'}">
<el-row>
<span v-if="countTime" class="display-score">{{ $t('display.demon.trialTime') }} {{ countTime }}</span>
</el-row>
</div>
<div class="display-draft" :style="{bottom: offsetBottom + 'px'}">
<el-button-group>
<el-button v-if="isShowScheduling && !dataError" type="primary" @click="jumpScheduling">{{ $t('display.demon.dispatchingPlan') }}</el-button>
<el-button v-if="!isShowScheduling && !dataError" type="jl3dpassflow" @click="jumpjl3dpassflow">{{ jl3dpassflow }}</el-button>
<!-- <el-button v-if="!isShowScheduling && !dataError" type="jl3dstation" @click="jumpjl3dstation">{{ jl3dstation }}</el-button> -->
<el-button v-if="!isShowScheduling && !dataError" type="jumpjlmap3d" @click="jumpjlmap3d">{{ jl3dname }}</el-button>
<el-button v-if="isShow3dmodel && !isShowScheduling && !dataError" type="jumpjlmap3dmodel" @click="jumpjlmap3dmodel">{{ jl3dmodel }}</el-button>
<template v-if="isShowQuest">
<!-- && !isDesignPlatform -->
<el-button v-if="!isDesignPlatform && !dataError" type="danger" @click="handleQuitQuest">{{ $t('display.demon.exitScript') }}</el-button>
</template>
<template v-else>
<el-button type="success" :disabled="isDisable || dataError" @click="selectBeginTime">{{ $t('display.demon.drivingByPlan') }}</el-button>
<el-button type="danger" :disabled="!isDisable || dataError" @click="end">{{ $t('display.demon.exitPlan') }}</el-button>
</template>
<el-button type="primary" @click="back">{{ $t('display.demon.back') }}</el-button>
</el-button-group>
</div>
<set-time ref="setTime" @ConfirmSelectBeginTime="start" />
</div>
</template>
<!-- 单人仿真 -->
<script>
import SetTime from './demon/setTime';
import ChatBox from './chatView/chatBox';
import { Notification } from 'element-ui';
import { getGoodsTryUse } from '@/api/management/goods';
import { ranAsPlan, exitRunPlan, clearSimulation, getSimulationInfoNew } from '@/api/simulation';
import { PermissionType } from '@/scripts/ConstDic';
import { getCountTime } from '@/utils/index';
import { quitScriptNew, scriptRePreview } from '@/api/simulation';
export default {
name: 'MenuDemon',
components: {
SetTime,
ChatBox
},
props: {
group: {
type: String,
required: true
},
offset: {
type: Number,
required: true
},
offsetBottom: {
type: Number,
required: true
},
questId: {
type: Number,
default() {
return 0;
}
},
showStation: {
type: String,
default() {
return '';
}
},
dataError: {
type: Boolean,
default() {
return false;
}
}
},
data() {
return {
isDisable: false,
tryTime: 0, // 进入页面多少秒
timeNow: 0, // 进入页面 相对时间
time: null, // 定时器
countTime: 0, // 显示 倒计时
remainingTime: 0,
goodsId: this.$route.query.goodsId,
try: this.$route.query.try, // 是否是试用权限
training: {
id: '',
name: '',
remarks: ''
},
jl3dpassflow:this.$t('display.demon.passengerflow'),
jl3dname: this.$t('display.demon.threeDimensionalView'),
jl3dstation: this.$t('display.demon.threeDimensionalStation'),
jl3dmodel: this.$t('display.demon.deviceView'),
isShow3dmodel :false
};
},
computed: {
isShowQuest() {
return this.questId;
},
isShowScheduling() {
return this.$route.query.prdType == '05';
},
isDesignPlatform() {
return this.$route.fullPath.includes('design/display/demon');
},
isHebLine() {
return this.$route.query.lineCode === '07';
}
},
watch: {
'$store.state.training.subscribeCount': function () {
this.group && this.initLoadPage();
},
'$store.state.socket.tipOperateCount': function (val) {
this.$alert(this.$t('display.demon.taskOperateSuccess'), this.$t('global.tips'), {
confirmButtonText: this.$t('global.confirm'),
callback: action => {
}
});
}
},
beforeDestroy() {
if (this.time) {
this.setTryTime();
clearTimeout(this.time);
}
},
methods: {
async initLoadPage() {
try {
if (this.try != '0') {
this.loadInitData();
}
this.change3dname();
} catch (error) {
console.log(error);
}
},
initPlannedDriving(isDisable) {
this.isDisable = isDisable;
},
loadInitData() {
const data = {
mapId: this.$route.query.mapId,
prdType: this.$route.query.prdType,
permissionType: PermissionType.SIMULATION
};
getGoodsTryUse(data).then(res => {
this.remainingTime = res.data.tryTime;
this.timeNow = Date.parse(new Date()) / 1000 + this.remainingTime;
if (this.try) {
this.time = setInterval(() => {
this.tryTime += 1;
this.countTime = getCountTime(this.timeNow);
if (this.countTime == -1) {
this.back();
}
}, 1000);
}
}).catch(() => {
this.$messageBox(this.$t('display.demon.getTimeFail'));
});
},
selectBeginTime() {
this.$refs.setTime.doShow();
},
start(model) {
this.isDisable = true;
const data = {
time: model.initTime
};
if (this.$route.query.prdType === '04') {
data.loadNumber = model.loadNum;
}
ranAsPlan(data, this.group).then(res => {
this.$store.dispatch('training/simulationStart').then(() => {
this.$store.dispatch('map/setRunPlanStatus', true);
this.$store.dispatch('training/setInitTime', +new Date(`${new Date().getFullYear()} ${model.initTime}`));
this.$store.dispatch('map/setShowCentralizedStationNum');
});
}).catch(error => {
this.isDisable = false;
if (error.code == '5001') {
this.$messageBox(this.$t('error.mapDataError') + '' + this.$t('error.startSimulationFailed'));
} else if (error.code == '5002') {
this.$messageBox(this.$t('error.runningChartDataError') + ',' + this.$t('error.startSimulationFailed'));
} else if (error.code == '5003') {
this.$messageBox(this.$t('error.runningChartIsNotLoaded') + ',' + this.$t('error.startSimulationFailed'));
} else if (error.code == '5004') {
this.$messageBox(this.$t('error.runningDataError') + ',' + this.$t('error.startSimulationFailed'));
} else if (error.code == '5000') {
this.$messageBox(this.$t('error.systemError') + ',' + this.$t('error.startSimulationFailed'));
} else if (error.code == '4000') {
this.$messageBox(this.$t('error.simulationDoesNotExist') + ',' + this.$t('error.startSimulationFailed'));
} else if (error.code == '4001') {
this.$messageBox(this.$t('error.simulationOperationIsNotDefined') + ',' + this.$t('error.startSimulationFailed'));
} else if (error.code == '4002') {
this.$messageBox(this.$t('error.simulationOperationProcessingMethodNotFound') + ',' + this.$t('error.startSimulationFailed'));
} else if (error.code == '4003') {
this.$messageBox(this.$t('error.simulationOperationFailed') + ',' + this.$t('error.startSimulationFailed'));
} else if (error.code == '4004') {
this.$messageBox(this.$t('error.operationConflict') + ',' + this.$t('error.startSimulationFailed'));
}
});
},
end() {
this.isDisable = false;
exitRunPlan(this.group).then(() => {
this.$store.dispatch('training/over').then(() => {
this.$store.dispatch('training/setMapDefaultState').then(() => {
this.$store.dispatch('map/setRunPlanStatus', false);
this.$store.dispatch('map/clearJlmapTrainView');
this.$store.dispatch('map/setTrainWindowShow', false);
});
});
}).catch(() => {
this.isDisable = true;
this.$messageBox(this.$t('display.demon.endSimulationFail'));
});
},
handleQuitQuest() {
if (this.$route.fullPath.includes('design/displayNew/demon') ) {
quitScriptNew(this.group).then(resp => {
scriptRePreview(this.group).then(resp=>{
getSimulationInfoNew(this.group).then(()=>{
this.$emit('quitQuest');
this.initLoadPage();
this.clearAllData();
}).catch(()=>{
this.$messageBox(this.$t('display.demon.exitTaskFail'));
});
}).catch(()=>{
this.$messageBox(this.$t('display.demon.exitTaskFail'));
});
}).catch(() => {
this.$messageBox(this.$t('display.demon.exitTaskFail'));
});
} else {
quitScriptNew(this.group).then(resp => {
getSimulationInfoNew(this.group).then(()=>{
this.$emit('quitQuest');
this.initLoadPage();
this.clearAllData();
}).catch(()=>{
this.$messageBox(this.$t('display.demon.exitTaskFail'));
});
}).catch(() => {
this.$messageBox(this.$t('display.demon.exitTaskFail'));
});
}
},
clearAllData() {
this.$refs.chatbox.clearAllData();
},
async back() {
await clearSimulation(this.group);
this.$store.dispatch('training/over').then(() => {
history.go(-1);
Notification.closeAll();
});
},
jumpjl3dpassflow() {
this.$emit('passflow');
},
jumpjl3dstation() {
this.$emit('jl3dstation');
},
jumpjlmap3d() {
this.$emit('hidepanel');
},
jumpjlmap3dmodel() {
this.$emit('devicemodel');
},
jumpScheduling() {
this.$emit('showScheduling');
},
setTryTime() {
if (this.try) {
this.$emit('tryTime', { time: this.tryTime, goodsId: this.goodsId });
}
},
change3dname() {
if (this.$route.query.prdType == '04') {
this.jl3dname = this.$t('display.demon.driverPerspective');
} else {
this.jl3dname = this.$t('display.demon.threeDimensionalView');
this.isShow3dmodel = true;
}
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "src/styles/mixin.scss";
.display-card {
z-index: 9;
display: inline-block;
position: absolute;
top: 17px;
left: 160px;
height: 32px;
}
.display-card .el-row {
line-height: 32px !important;
}
.display-score {
background-color: black;
display: -moz-inline-box;
display: inline-block;
text-align: left;
height: 32px;
line-height: 24px;
border-radius: 4px;
padding-left: 2px;
margin-left: 10px;
font-family: "Microsoft" !important;
font-size: 18px !important;
color: #fff;
}
</style>
<style lang="scss">
.display-draft {
position: absolute;
float: right;
right: 20px;
bottom: 15px;
}
</style>