f9f58a70c4
绘图高级页面代码调整
278 lines
10 KiB
Vue
278 lines
10 KiB
Vue
<template>
|
|
<div>
|
|
<div class="schema" :style="{top: offset+'px'}">
|
|
<el-select v-if="(isScript&&!isScriptCommand) || isDesignPlatform" v-model="swch" size="small" :placeholder="$t('display.schema.selectProduct')" @change="switchMode">
|
|
<el-option v-for="item in swchList" :key="item.value" :label="item.name" :value="item.value" />
|
|
</el-select>
|
|
<!-- ||(isScriptCommand && isLocalStation) -->
|
|
<el-select v-if="showSelectStation&&((!isScriptCommand&&swch=='01')||(isScriptCommand && isLocalStation)) " v-model="showStationContent" style="width: 100px;" size="small" @change="switchStationModeInfo">
|
|
<el-option v-for="item in stationList" :key="item.value" :label="item.name" :value="item.value" />
|
|
</el-select>
|
|
<el-button-group>
|
|
<el-button v-if="isDemon && isDesignPlatform && !dataError" size="small" :disabled="viewDisabled" type="success" @click="viewScriptRoles">{{ $t('display.schema.selectRoles') }}</el-button>
|
|
<!-- 加载剧本 -->
|
|
<el-button v-if="isDemon && !isDesignPlatform && !isScheduling && !dataError" size="small" :disabled="viewDisabled" type="success" @click="viewRunQuest">{{ $t('display.schema.loadScript') }}</el-button>
|
|
<el-button v-if="notScript && runing && !dataError" size="small" :disabled="viewDisabled" @click="viewRunPlan">{{ $t('display.schema.previewRunDiagram') }}</el-button>
|
|
<el-button v-if="!runing && notScript && !dataError" size="small" type="warning" @click="loadRunPlan">{{ $t('display.schema.loadRunDiagram') }}</el-button>
|
|
<el-button v-if="mode==OperateMode.FAULT && !dataError" size="small" type="danger" @click="setFault">自动故障设置</el-button>
|
|
</el-button-group>
|
|
|
|
<el-radio-group v-if="!isScheduling && !dataError" v-model="mode" size="small" @change="changeOperateMode(mode)">
|
|
<el-radio-button class="mode" :label="OperateMode.NORMAL">{{ $t('display.schema.normalOperation') }}</el-radio-button>
|
|
<el-radio-button class="mode" :label="OperateMode.FAULT">故障模式</el-radio-button>
|
|
</el-radio-group>
|
|
</div>
|
|
<fault-choose v-if="isDemon || isScript" ref="faultChoose" :group="group" :offset="offset" />
|
|
<run-plan-Load ref="runPlanLoad" :group="group" />
|
|
<run-plan-view ref="runPlanView" :group="group" />
|
|
<!-- 加载剧本列表弹窗 -->
|
|
<add-quest ref="addQuest" @selectQuest="selectQuest" />
|
|
</div>
|
|
</template>
|
|
<script>
|
|
import RunPlanLoad from './demon/runPlanLoad';
|
|
import RunPlanView from './demon/runPlanView';
|
|
import FaultChoose from './demon/faultChoose';
|
|
import AddQuest from './demon/addQuest';
|
|
import { mapGetters } from 'vuex';
|
|
import { OperateMode } from '@/scripts/ConstDic';
|
|
// import { getStationList } from '@/api/runplan';
|
|
import { getByGroupStationList } from '@/api/jmap/map';
|
|
import {loadDraftScript, loadDraftScriptNew} from '@/api/designPlatform';
|
|
import { getEveryDayRunPlanNew, loadScriptNew } from '@/api/simulation';
|
|
import Vue from 'vue';
|
|
|
|
// 右上角操作
|
|
export default {
|
|
name: 'MenuSchema',
|
|
components: {
|
|
RunPlanLoad,
|
|
RunPlanView,
|
|
FaultChoose,
|
|
AddQuest
|
|
},
|
|
props: {
|
|
offset: {
|
|
type: Number,
|
|
required: true
|
|
},
|
|
showSelectStation: {
|
|
type: Boolean,
|
|
default() {
|
|
return false;
|
|
}
|
|
},
|
|
stationList: {
|
|
type: Array,
|
|
default() {
|
|
return [];
|
|
}
|
|
},
|
|
showStation: {
|
|
type: String,
|
|
default() {
|
|
return '';
|
|
}
|
|
},
|
|
dataError: {
|
|
type: Boolean,
|
|
default() {
|
|
return false;
|
|
}
|
|
}
|
|
},
|
|
data() {
|
|
return {
|
|
mode: OperateMode.NORMAL,
|
|
OperateMode: OperateMode,
|
|
viewDisabled: true,
|
|
runing: false,
|
|
swch: '01',
|
|
showStationContent:'',
|
|
isScriptCommand:false,
|
|
swchList: [
|
|
{ value: '01', name: '现地' },
|
|
{ value: '02', name: '行调' }
|
|
]
|
|
};
|
|
},
|
|
computed: {
|
|
...mapGetters('runPlan', [
|
|
'stations'
|
|
]),
|
|
group() {
|
|
return this.$route.query.group;
|
|
},
|
|
notScript() {
|
|
return this.$route.params.mode !== 'script';
|
|
},
|
|
isScript() {
|
|
return this.$route.params.mode === 'script';
|
|
},
|
|
isDemon() {
|
|
return this.$route.params.mode === 'demon';
|
|
},
|
|
isDesignPlatform() {
|
|
return this.$route.fullPath.includes('design/displayNew/demon');
|
|
},
|
|
isScheduling() {
|
|
return this.$route.query.prdType === '05';
|
|
},
|
|
isLocalStation() {
|
|
return this.$store.state.training.prdType === '01';
|
|
},
|
|
drawWay() {
|
|
const drawWay = this.$route.query.drawWay;
|
|
return drawWay && JSON.parse(drawWay);
|
|
}
|
|
},
|
|
watch: {
|
|
'$store.state.training.started': function (val) {
|
|
this.setRuning(val);
|
|
},
|
|
'$store.state.training.switchcount': async function () {
|
|
if (this.group) {
|
|
const started = this.$store.state.training.started;
|
|
if (started) {
|
|
await this.loadRunData(this.$route.query);
|
|
}
|
|
}
|
|
},
|
|
'$store.state.scriptRecord.bgSet':function (val) {
|
|
this.isScriptCommand = val;
|
|
if (!val) {
|
|
this.swch = '01';
|
|
}
|
|
},
|
|
'showStation':function(val) {
|
|
this.showStationContent = this.showStation;
|
|
},
|
|
'$store.state.training.prdType':function(val) {
|
|
if (val == '02' || val == '') { this.switchModeInner('02'); } else { this.switchModeInner('01'); }
|
|
}
|
|
},
|
|
async mounted() {
|
|
await this.loadRunData(this.$route.query);
|
|
this.isScriptCommand = this.$store.state.scriptRecord.bgSet;
|
|
this.showStationContent = this.showStation;
|
|
},
|
|
methods: {
|
|
loadRunData(opt) {
|
|
this.$store.dispatch('runPlan/clear').then(() => {
|
|
if (opt && opt.mapId) {
|
|
this.viewDisabled = true;
|
|
getByGroupStationList(this.$route.query.group).then(response => {
|
|
// getStationList(opt.mapId).then(response => {
|
|
this.$store.dispatch('runPlan/setStations', response.data).then(() => {
|
|
getEveryDayRunPlanNew(this.group).then(resp => {
|
|
this.$store.dispatch('runPlan/setPlanData', resp.data);
|
|
this.$store.dispatch('runPlan/setInitialPlanData', resp.data);
|
|
this.viewDisabled = false;
|
|
}).catch(error => {
|
|
this.$store.dispatch('runPlan/setPlanData', []);
|
|
if (error.code == 30001) {
|
|
this.$messageBox(this.$t('display.schema.todayRunDiagramNoLoad'));
|
|
} else {
|
|
!this.dataError && this.$messageBox(this.$t('display.schema.getRunDiagramFail'));
|
|
}
|
|
});
|
|
});
|
|
}).catch(() => {
|
|
this.$messageBox(this.$t('display.schema.getStationListFail'));
|
|
});
|
|
}
|
|
});
|
|
},
|
|
changeOperateMode(handle) {
|
|
this.$store.dispatch('training/changeOperateMode', { mode: handle });
|
|
},
|
|
setRuning(run) {
|
|
this.runing = run;
|
|
},
|
|
setFault() {
|
|
this.$refs.faultChoose.doShow();
|
|
},
|
|
loadRunPlan() {
|
|
this.$refs.runPlanLoad.doShow();
|
|
},
|
|
viewRunPlan() {
|
|
this.$refs.runPlanView.doShow();
|
|
},
|
|
viewRunQuest() {
|
|
this.$refs.addQuest.doShow();
|
|
},
|
|
viewScriptRoles() {
|
|
const row = {id: this.$route.query.scriptId, group:this.$route.query.group, drawWay:this.$route.query.drawWay};
|
|
this.$refs.addQuest.handleLoad(1, row);
|
|
},
|
|
async selectQuest(row, id, mapLocation, roleName) {
|
|
try {
|
|
let res;
|
|
if (this.isDesignPlatform) {
|
|
res = this.drawWay ? await loadDraftScriptNew(id, this.group) : await loadDraftScript(row.id, id, this.group);
|
|
} else {
|
|
res = await loadScriptNew(row.id, id, this.group);
|
|
}
|
|
if (res && res.code == 200) {
|
|
this.questId = parseInt(row.id);
|
|
if (mapLocation) {
|
|
const newMapLocation = {'offsetX': mapLocation.x, 'offsetY': mapLocation.y, 'scaleRate': mapLocation.scale};
|
|
Vue.prototype.$jlmap.setOptions(newMapLocation);
|
|
}
|
|
}
|
|
this.$emit('selectQuest', row);
|
|
} catch (error) {
|
|
this.$messageBox(error.message);
|
|
}
|
|
},
|
|
switchMode(swch) {
|
|
this.$emit('switchMode', swch);
|
|
this.switchModeInner(swch);
|
|
},
|
|
switchModeInner(swch) {
|
|
let showMode = '03';
|
|
if (swch == '01') {
|
|
showMode = '03';
|
|
} else if (swch == '02') {
|
|
showMode = '02';
|
|
}
|
|
const nameList = Object.keys(this.$store.state.map.map || {});
|
|
let list = [];
|
|
nameList.forEach(item => {
|
|
if (item !== 'skinVO') {
|
|
const data = this.$store.state.map.map[item];
|
|
if (data && data.constructor === Array) {
|
|
list = [...list, ...data];
|
|
}
|
|
}
|
|
});
|
|
this.$jlmap.updateShowMode(list, showMode);
|
|
if (swch == '02') {
|
|
this.switchStationMode('');
|
|
} else {
|
|
this.switchStationMode(null);
|
|
}
|
|
},
|
|
switchStationModeInfo(val) {
|
|
this.showStationContent = val;
|
|
this.$emit('switchStationMode', val);
|
|
},
|
|
switchStationMode(val) {
|
|
this.$emit('switchStationMode', val);
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
<style rel="stylesheet/scss" lang="scss" scoped>
|
|
.schema {
|
|
z-index: 9;
|
|
display: inline;
|
|
position: absolute;
|
|
right: 15px;
|
|
}
|
|
|
|
/deep/ .el-button+.el-button {
|
|
margin-left: 0px;
|
|
}
|
|
</style>
|