冗余代码处理
This commit is contained in:
fan
parent
3024c3d0e0
commit
18da9bb9ea
@ -39,9 +39,7 @@ const Jl3dTrainRescueVr = () => import('@/views/jlmap3d/maintainer/jl3dTrainResc
|
||||
const Jlmap3dOtherVR = () => import('@/views/jlmap3d/maintainer/jl3dothervr');
|
||||
// const Jl3dMaintainer = () => import('@/views/jlmap3d/maintainer/jl3dmaintainer');
|
||||
|
||||
const DisplayBaSiDi = () => import('@/views/newMap/displayBaSiDi/index');
|
||||
|
||||
// const DisplayCity = () => import('@/views/newMap/displayCity/index');
|
||||
// const DesignDisplayNew = () => import('@/views/newMap/displayNew/scriptDisplay/scriptPreview/index');
|
||||
// const DisplayNew = () => import('@/views/newMap/displayNew/index');
|
||||
|
||||
@ -56,7 +54,6 @@ const TestRunplan = () => import('@/views/designPlatform/testRunplan');
|
||||
const PracticeDisplay = () => import('@/views/newMap/displayNew/practiceDisplay');
|
||||
const BigLPFStrategy = () => import('@/views/newMap/displayNew/bigLPFStrategy');
|
||||
|
||||
// const JointTrainingNew = () => import('@/views/newMap/jointTrainingNew/index');
|
||||
const RunPlanViewWindow = () => import('@/views/newMap/displayNew/demon/runPlanViewWindow');
|
||||
const PlanScheduleWicket = () => import('@/views/newMap/displayNew/demon/planSchedule');
|
||||
// const DemoTraining = () => import('@/views/newMap/displayNew/demoTraining');
|
||||
@ -488,16 +485,6 @@ export const publicAsyncRoute = [
|
||||
// hidden: true
|
||||
// },
|
||||
// {
|
||||
// path: '/displayCity/:mode',
|
||||
// component: DisplayCity,
|
||||
// hidden: true
|
||||
// },
|
||||
{
|
||||
path: '/displayBaSiDi/:mode',
|
||||
component: DisplayBaSiDi,
|
||||
hidden: true
|
||||
},
|
||||
// {
|
||||
// path: '/design/displayNew/:mode',
|
||||
// component: DesignDisplayNew,
|
||||
// hidden: true
|
||||
@ -517,11 +504,6 @@ export const publicAsyncRoute = [
|
||||
component: BigSplitScreen,
|
||||
hidden: true
|
||||
},
|
||||
// {
|
||||
// path: '/jointTrainingNew',
|
||||
// component: JointTrainingNew,
|
||||
// hidden: true
|
||||
// },
|
||||
{
|
||||
path: '/jointTrainingNewCCTV',
|
||||
component: jointTrainingNewCCTV,
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@ -1,538 +0,0 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
v-dialogDrag
|
||||
class="haerbin-01__systerm"
|
||||
:title="title"
|
||||
:modal="false"
|
||||
width="600px"
|
||||
:visible.sync="show"
|
||||
:before-close="doClose"
|
||||
>
|
||||
<div style="padding: 0 10px;">
|
||||
<el-row>
|
||||
<span style="color:#000;font-size: 16px;font-weight: bold;">选择列车</span>
|
||||
<hr style="display: inline-block;width: 480px;">
|
||||
</el-row>
|
||||
<el-row style="padding: 5px;">
|
||||
<el-col :span="11" style="height: 28px;line-height: 28px;">
|
||||
<el-radio v-model="train" :disabled="train === 'one'" label="all">所有列车</el-radio>
|
||||
</el-col>
|
||||
<el-col :span="4" style="height: 28px;line-height: 28px;text-align: right;">
|
||||
<div>当前状态：</div>
|
||||
</el-col>
|
||||
<el-col :span="9">
|
||||
<el-input v-model="input" size="mini" :disabled="true" placeholder="请输入内容" />
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row style="padding: 5px;">
|
||||
<el-col :span="4" style="height: 28px;line-height: 28px;">
|
||||
<el-radio v-model="train" :disabled="train === 'all'" label="one">单列车号</el-radio>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-select v-model="trainCode" :disabled="train !== 'one'" style="width: 160px" size="mini" placeholder="请选择">
|
||||
<el-option
|
||||
v-for="item in trainList"
|
||||
:key="item.code"
|
||||
:label="item.code"
|
||||
:value="item.code"
|
||||
/>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="4" style="height: 28px;line-height: 28px;text-align: right;">
|
||||
<div>当前状态：</div>
|
||||
</el-col>
|
||||
<el-col :span="9">
|
||||
<el-input v-model="input" size="mini" :disabled="true" placeholder="请输入内容" />
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row style="padding: 5px 0;">
|
||||
<span style="color:#000;font-size: 16px;font-weight: bold;">选择调度模式</span>
|
||||
<hr style="display: inline-block;width: 170px;">
|
||||
<span style="color:#000;font-size: 16px;font-weight: bold;">调整行车间隔</span>
|
||||
<hr style="display: inline-block;width: 170px;">
|
||||
</el-row>
|
||||
<el-row style="padding: 5px;">
|
||||
<el-col :span="12" style="height: 28px;line-height: 28px;">
|
||||
<el-radio v-model="atrMode" :disabled="!train" label="TIME_TABLE_REGULATION">时刻表调度</el-radio>
|
||||
</el-col>
|
||||
<el-col :span="6" style="height: 28px;line-height: 28px;">
|
||||
<el-radio v-model="intervalMode" :disabled="atrMode !== 'HEADWAY_REGULATION_FRONT'" label="trainNumber">列车个数</el-radio>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-input-number v-model="trainNumber" size="mini" :min="0" :max="999" :disabled="intervalMode !== 'trainNumber'" controls-position="right" label="列车个数" />
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row style="padding: 5px;">
|
||||
<el-col :offset="12" :span="6" style="height: 28px;line-height: 28px;">
|
||||
<el-radio v-model="intervalMode" :disabled="atrMode !== 'HEADWAY_REGULATION_FRONT'" label="trainInterval">间隔时间（秒）</el-radio>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-input-number v-model="trainInterval" size="mini" :disabled="intervalMode !== 'trainInterval'" :min="0" :max="999" controls-position="right" label="间隔时间" />
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row style="padding: 5px;">
|
||||
<el-col :span="12" style="height: 28px;line-height: 28px;">
|
||||
<el-radio v-model="atrMode" :disabled="!train || train === 'one'" label="HEADWAY_REGULATION_FRONT">列车间隔调度-前调</el-radio>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-button :disabled="!intervalMode" style="height: 28px;width: 260px;" @click="computeInterval">计算</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row style="padding: 5px;">
|
||||
<el-col :span="12">
|
||||
<el-radio v-model="atrMode" :disabled="!train || train === 'one'" label="HEADWAY_REGULATION_FRONT_AND_BACK">列车间隔调度-前调+后调</el-radio>
|
||||
</el-col>
|
||||
<el-col :span="2" style="height: 28px;line-height: 28px;">
|
||||
<span>最小</span>
|
||||
</el-col>
|
||||
<el-col :span="5">
|
||||
<el-input v-model="computeName" :disabled="true" size="mini" />
|
||||
</el-col>
|
||||
<el-col :span="4" :offset="1">
|
||||
<el-input v-model="min" :disabled="true" size="mini" />
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row style="padding: 5px;">
|
||||
<el-col :span="2" :offset="12" style="height: 28px;line-height: 28px;">
|
||||
<span>最佳</span>
|
||||
</el-col>
|
||||
<el-col :span="5">
|
||||
<el-input v-model="computeName" size="mini" :disabled="true" />
|
||||
</el-col>
|
||||
<el-col :span="4" :offset="1">
|
||||
<el-input v-model="avg" size="mini" :disabled="true" />
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row style="padding: 5px;">
|
||||
<el-col :span="12" style="height: 28px;line-height: 28px;">
|
||||
<el-radio v-model="atrMode" :disabled="!train" label="REGULATION_OFF">关闭自动调度</el-radio>
|
||||
</el-col>
|
||||
<el-col :span="2" style="height: 28px;line-height: 28px;">
|
||||
<span>最大</span>
|
||||
</el-col>
|
||||
<el-col :span="5">
|
||||
<el-input v-model="computeName" size="mini" :disabled="true" />
|
||||
</el-col>
|
||||
<el-col :span="4" :offset="1">
|
||||
<el-input v-model="max" size="mini" :disabled="true" />
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row style="padding: 5px 0">
|
||||
<span style="color:#000;font-size: 16px;font-weight: bold;">选择时间项（人工调度）</span>
|
||||
<hr style="display: inline-block;width: 370px;">
|
||||
</el-row>
|
||||
<el-row style="padding: 5px;">
|
||||
<el-col :span="4">
|
||||
<el-radio v-model="timeTerm" :disabled="atrMode !== 'REGULATION_OFF'" label="stop" @change="termChange">停站时间</el-radio>
|
||||
<el-radio v-model="timeTerm" :disabled="atrMode !== 'REGULATION_OFF'" label="driving" @change="termChange">行驶时间</el-radio>
|
||||
<el-radio v-model="timeTerm" :disabled="atrMode !== 'REGULATION_OFF'" label="run" @change="termChange">不停/停站</el-radio>
|
||||
</el-col>
|
||||
<el-col :span="20">
|
||||
<el-table v-show="timeTerm === 'stop'" ref="table1" :data="tableData1" style="width: 100%" height="80">
|
||||
<el-table-column prop="direction" label="方向" />
|
||||
<el-table-column prop="name" label="站名" />
|
||||
<!--<el-table-column prop="time" label="时间" />-->
|
||||
<el-table-column label="时间" prop="time1">
|
||||
<template slot-scope="scope">
|
||||
<el-input-number v-model="scope.row.time" size="mini" :min="-1" :controls="false" style="width: 100%" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="timeRange" label="推荐时间" />
|
||||
</el-table>
|
||||
<el-table v-show="timeTerm === 'driving'" ref="table2" :data="tableData2" style="width: 100%" height="80">
|
||||
<el-table-column prop="follow" label="从" />
|
||||
<el-table-column prop="to" label="至" />
|
||||
<!--<el-table-column prop="time" label="时间" />-->
|
||||
<el-table-column label="时间" prop="time2">
|
||||
<template slot-scope="scope">
|
||||
<el-input-number v-model="scope.row.time" size="mini" :min="-1" :controls="false" style="width: 100%" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="timeRange" label="推荐时间" />
|
||||
</el-table>
|
||||
<el-table v-show="timeTerm === 'run'" ref="table3" :data="tableData3" style="width: 100%" height="80">
|
||||
<el-table-column prop="direction" label="方向" />
|
||||
<el-table-column prop="name" label="站名" />
|
||||
<el-table-column label="不停" prop="stop">
|
||||
<template slot-scope="scope">
|
||||
<el-checkbox v-model="scope.row.stop" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-table v-show="!timeTerm" ref="table4">
|
||||
<el-table-column prop="follow" label="从" />
|
||||
<el-table-column prop="to" label="至" />
|
||||
<el-table-column prop="time" label="时间" />
|
||||
<el-table-column prop="timeRange" label="推荐时间" />
|
||||
</el-table>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<div>
|
||||
<el-button style="width: 100px;height: 28px;margin-right: 103px;" @click="showTrainInfo">显示列车信息</el-button>
|
||||
<el-button style="width: 100px;height: 28px;" @click="commit">执行</el-button>
|
||||
<el-button style="width: 100px;height: 28px;" @click="reset">重设</el-button>
|
||||
<el-button style="width: 100px;height: 28px;" @click="doClose">关闭</el-button>
|
||||
</div>
|
||||
<el-dialog
|
||||
width="500px"
|
||||
title="列车信息"
|
||||
:visible.sync="innerVisible"
|
||||
append-to-body
|
||||
>
|
||||
<el-table :data="showTrainList" style="width: 100%" height="500px">
|
||||
<el-table-column label="列车号">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.destinationCode + scope.row.serviceNumber + scope.row.tripNumber.substring(2) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="name" label="所在区段">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ getSectionName(scope.row.code) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
<script>
|
||||
import { mapGetters } from 'vuex';
|
||||
import CMD from '@/scripts/cmdPlugin/CommandEnum';
|
||||
import { OperationEvent } from '@/scripts/cmdPlugin/OperationHandler';
|
||||
export default {
|
||||
name:'ATRDialog',
|
||||
data() {
|
||||
return {
|
||||
train: '',
|
||||
trainCode: '',
|
||||
atrMode: '',
|
||||
intervalMode: '',
|
||||
trainInterval: 90,
|
||||
min: '',
|
||||
max: '',
|
||||
avg: '',
|
||||
trainNumber: 4,
|
||||
tableData: [],
|
||||
tableData1: [],
|
||||
tableData2: [],
|
||||
tableData3: [],
|
||||
tableData4: [],
|
||||
showTrainList: [],
|
||||
input: '',
|
||||
timeTerm: '',
|
||||
sortStationList: [],
|
||||
noStopList: [],
|
||||
dialogShow:false,
|
||||
innerVisible: false
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
show() {
|
||||
return this.dialogShow && !this.$store.state.menuOperation.break;
|
||||
},
|
||||
title() {
|
||||
return '时刻表';
|
||||
},
|
||||
...mapGetters('map', [
|
||||
'trainList',
|
||||
'stationList',
|
||||
'stationStandList'
|
||||
]),
|
||||
computeName() {
|
||||
if (this.intervalMode === 'trainNumber') {
|
||||
return '间隔时间';
|
||||
} else if (this.intervalMode === 'trainInterval') {
|
||||
return '列车数量';
|
||||
} else {
|
||||
return '';
|
||||
}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
train(val) {
|
||||
if (val === 'all') {
|
||||
this.tableData1.forEach(item => {
|
||||
const stand = this.$store.getters['map/getDeviceByCode'](item.code);
|
||||
item.time = stand.parkingTime;
|
||||
});
|
||||
this.trainCode = '';
|
||||
} else if (val === 'one' && this.trainCode) {
|
||||
this.tableData1.forEach(item => {
|
||||
const stand = this.$store.getters['map/getDeviceByCode'](item.code);
|
||||
item.time = stand.parkingTimeMap[this.trainCode];
|
||||
});
|
||||
this.atrMode = 'REGULATION_OFF';
|
||||
}
|
||||
},
|
||||
trainCode(val) {
|
||||
if (this.train === 'one') {
|
||||
this.tableData1.forEach(item => {
|
||||
const stand = this.$store.getters['map/getDeviceByCode'](item.code);
|
||||
item.time = ((stand.parkingTimeMap || {})[val]) || stand.parkingTime;
|
||||
});
|
||||
}
|
||||
},
|
||||
atrMode(val) {
|
||||
this.intervalMode = '';
|
||||
if (val !== 'REGULATION_OFF') {
|
||||
this.timeTerm = '';
|
||||
}
|
||||
},
|
||||
intervalMode(val) {
|
||||
this.min = '';
|
||||
this.max = '';
|
||||
this.avg = '';
|
||||
},
|
||||
'$store.state.map.activeTrainListUpdate': function (val) {
|
||||
if (val) {
|
||||
const activeTrainList = this.$store.state.map.activeTrainList;
|
||||
this.showTrainList = [];
|
||||
activeTrainList.forEach((trainCode)=>{
|
||||
const train = this.$store.getters['map/getDeviceByCode'](trainCode);
|
||||
if (train && train.sectionCode) {
|
||||
this.showTrainList.push(train);
|
||||
}
|
||||
});
|
||||
} else {
|
||||
this.showTrainList = [];
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
|
||||
},
|
||||
methods: {
|
||||
initData() {
|
||||
this.sortStationList = [...this.stationList];
|
||||
this.sortStationList.sort((station1, station2) => {
|
||||
return station1.sn - station2.sn;
|
||||
});
|
||||
const standMap = {};
|
||||
this.stationStandList.forEach(stand => {
|
||||
if (standMap[stand.stationCode]) {
|
||||
standMap[stand.stationCode].push(stand);
|
||||
} else {
|
||||
standMap[stand.stationCode] = [stand];
|
||||
}
|
||||
});
|
||||
for (let i = 0; i < this.sortStationList.length; i++) {
|
||||
const standList = standMap[this.sortStationList[i].code];
|
||||
if (!standList) {
|
||||
continue;
|
||||
}
|
||||
let rightStand = '';
|
||||
let leftStand = '';
|
||||
standList.forEach(stand => {
|
||||
if (stand.right) {
|
||||
rightStand = this.$store.getters['map/getDeviceByCode'](stand.code);
|
||||
} else {
|
||||
leftStand = this.$store.getters['map/getDeviceByCode'](stand.code);
|
||||
}
|
||||
});
|
||||
this.tableData1.push({ direction: '>', name: this.sortStationList[i].name, time: rightStand.parkingTime, timeRange: '020-060', code: rightStand.code });
|
||||
this.tableData1.push({ direction: '<', name: this.sortStationList[i].name, time: leftStand.parkingTime, timeRange: '020-060', code: leftStand.code });
|
||||
this.tableData3.push({ direction: '>', name: this.sortStationList[i].name, stop: false, code: rightStand.code });
|
||||
this.tableData3.push({ direction: '<', name: this.sortStationList[i].name, stop: false, code: leftStand.code });
|
||||
if (i === this.sortStationList.length - 1) {
|
||||
this.tableData2.push({ follow: '>' + this.sortStationList[i].name, to: '<' + this.sortStationList[i].name, time: 0, timeRange: '060-300', code: rightStand.code });
|
||||
this.tableData2.push({ follow: '<' + this.sortStationList[i].name, to: '<' + this.sortStationList[i - 1].name, time: 0, timeRange: '060-300', code: leftStand.code });
|
||||
} else if ( i === 0 ) {
|
||||
this.tableData2.push({ follow: '<' + this.sortStationList[i].name, to: '>' + this.sortStationList[i].name, time: 0, timeRange: '060-300', code: rightStand.code });
|
||||
this.tableData2.push({ follow: '>' + this.sortStationList[i].name, to: '>' + this.sortStationList[i + 1].name, time: 0, timeRange: '060-300', code: leftStand.code });
|
||||
} else {
|
||||
this.tableData2.push({ follow: '<' + this.sortStationList[i].name, to: '<' + this.sortStationList[i - 1].name, time: 0, timeRange: '060-300', code: rightStand.code });
|
||||
this.tableData2.push({ follow: '>' + this.sortStationList[i].name, to: '>' + this.sortStationList[i + 1].name, time: 0, timeRange: '060-300', code: leftStand.code });
|
||||
}
|
||||
}
|
||||
},
|
||||
getSectionName(code) {
|
||||
const train = this.$store.getters['map/getDeviceByCode'](code);
|
||||
const section = this.$store.getters['map/getDeviceByCode'](train.sectionCode);
|
||||
return section ? section.name : '';
|
||||
},
|
||||
computeInterval() {
|
||||
const step = {
|
||||
cmdType: CMD.Train.CMD_TRAIN_CALCULATE_INTERVAL,
|
||||
operate: 'Train_Calculate_Interval',
|
||||
param: { calculateParam: {}},
|
||||
over:true
|
||||
};
|
||||
if (this.intervalMode === 'trainNumber') {
|
||||
step.param.calculateParam.trainNumber = this.trainNumber;
|
||||
} else if (this.intervalMode === 'trainInterval') {
|
||||
step.param.calculateParam.interval = this.trainInterval;
|
||||
}
|
||||
this.$store.dispatch('trainingNew/next', step).then(({valid, response}) => {
|
||||
if (valid) {
|
||||
this.trainInterval = response.data.intervalTime;
|
||||
this.trainNumber = response.data.trainNumber;
|
||||
this.min = response.data.min;
|
||||
this.max = response.data.max;
|
||||
this.avg = response.data.avg;
|
||||
}
|
||||
}).catch((error) => {
|
||||
console.error(error);
|
||||
if (error && error.code == '10017') {
|
||||
this.$message.error(error.message);
|
||||
} else {
|
||||
this.$message.error('命令执行失败');
|
||||
}
|
||||
});
|
||||
},
|
||||
showTrainInfo() {
|
||||
this.innerVisible = true;
|
||||
},
|
||||
doShow() {
|
||||
this.initData();
|
||||
this.dialogShow = true;
|
||||
},
|
||||
doClose() {
|
||||
this.dialogShow = false;
|
||||
this.reset();
|
||||
},
|
||||
reset() {
|
||||
this.train = '';
|
||||
this.atrMode = '';
|
||||
this.timeTerm = '';
|
||||
this.trainCode = '';
|
||||
},
|
||||
commit() {
|
||||
if (!this.train || (this.train === 'one' && !this.trainCode)) {
|
||||
this.$message.error('请选择列车！');
|
||||
return;
|
||||
} else if (!this.atrMode) {
|
||||
this.$message.error('请选择调度模式！');
|
||||
return;
|
||||
} else if (this.atrMode === 'REGULATION_OFF' && !this.timeTerm) {
|
||||
this.$message.error('请选择时间项！');
|
||||
return;
|
||||
}
|
||||
const param = {
|
||||
groupNumber: this.train === 'one' ? this.trainCode : '',
|
||||
parkingAlwaysValid: true,
|
||||
regulationParam: null,
|
||||
regulation: this.atrMode
|
||||
};
|
||||
if (this.atrMode === 'REGULATION_OFF') {
|
||||
if (this.timeTerm === 'stop') {
|
||||
const standParkingTime = {};
|
||||
this.tableData1.forEach(item => {
|
||||
standParkingTime[item.code] = item.time;
|
||||
});
|
||||
param.regulationParam = {
|
||||
parkTimeMap: standParkingTime,
|
||||
runTimeMap: null,
|
||||
skipMap: null
|
||||
};
|
||||
} else if (this.timeTerm === 'driving') {
|
||||
const runTimeMap = {};
|
||||
this.tableData2.forEach(item => {
|
||||
runTimeMap[item.code] = item.time;
|
||||
});
|
||||
param.regulationParam = {
|
||||
parkTimeMap: null,
|
||||
runTimeMap: runTimeMap,
|
||||
skipMap: null
|
||||
};
|
||||
} else if (this.timeTerm === 'run') {
|
||||
const skipMap = {};
|
||||
this.tableData3.forEach(item => {
|
||||
skipMap[item.code] = item.stop;
|
||||
});
|
||||
param.regulationParam = {
|
||||
parkTimeMap: null,
|
||||
runTimeMap: null,
|
||||
skipMap: skipMap
|
||||
};
|
||||
}
|
||||
} else if (this.atrMode === 'HEADWAY_REGULATION_FRONT') {
|
||||
param.regulationParam = {
|
||||
intervalTime: this.trainInterval
|
||||
};
|
||||
}
|
||||
|
||||
const step = {
|
||||
cmdType: CMD.Train.CMD_TRAIN_REGULATION,
|
||||
operate: OperationEvent.StationStand.setStopTime.confirm,
|
||||
param: param,
|
||||
over:true
|
||||
};
|
||||
|
||||
this.$store.dispatch('trainingNew/next', step).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.dialogShow = false;
|
||||
}
|
||||
}).catch((error) => {
|
||||
console.error(error);
|
||||
if (error && error.code == '10017') {
|
||||
this.$message.error(error.message);
|
||||
} else {
|
||||
this.$message.error('命令执行失败');
|
||||
}
|
||||
});
|
||||
},
|
||||
termChange(val) {
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.actualTimetable{padding:0px 15px;}
|
||||
.actualTimetableT{width:100%;position: relative;}
|
||||
.defaultTimetableT{width:100%;position: relative;overflow:hidden;}
|
||||
.actualTimetableTtext,.defaultTimetableTtext{position:absolute;height: 20px;padding-right:5px;font-size:15px;color: #676767;background:#e2e2e2;font-weight: bold;}
|
||||
.actualTimetableTLine,.defaultTimetableTLine{display:inline-block;margin-left:10px;width:100%;border-bottom: 1px #A0A0A0 solid;vertical-align: top;height: 9px;}
|
||||
.actualTimetableForm{}
|
||||
.actualTimeFormEach{margin-top: 10px;}
|
||||
.actualTimeFormEach span{font-size:15px;color: #151515;}
|
||||
.actualTimeFormValue{
|
||||
font-size:15px;
|
||||
color: #151515;
|
||||
display: inline-block;
|
||||
padding: 5px 10px;
|
||||
border: 1px #A2A2A2 solid;
|
||||
width: 810px;
|
||||
}
|
||||
.defaultTimetable{
|
||||
padding:15px 15px 0px 15px;
|
||||
}
|
||||
// .defaultTimetab{
|
||||
// padding: 10px 15px 10px 15px;
|
||||
// }
|
||||
.defaultTimetableM{margin-top:10px;}
|
||||
.defaultTimetableB{display:inline-block;width:100%;margin-top: 10px;}
|
||||
#defaultClearSele{margin-right:10px;width:90px;}
|
||||
#defaultClearAll{width:90px;}
|
||||
#defaultShowTime{float:right;width:90px;}
|
||||
.defaultTimetableBtn{
|
||||
background:transparent;
|
||||
border:1px#9C9C9C solid ;
|
||||
height:auto ;
|
||||
outline:none;
|
||||
text-align:center;
|
||||
display: inline-block;
|
||||
padding:4px 0px;
|
||||
color:#090909;
|
||||
cursor: pointer;
|
||||
}
|
||||
.defaultTimetableBtn.disabled{border:1px #A9A9A9 solid ;color: #A7A7A7; cursor: no-drop;}
|
||||
.ttlButtonGroup{
|
||||
border-top: 1px #6d6d6d solid;
|
||||
margin-top: 10px;
|
||||
padding: 10px 15px;
|
||||
}
|
||||
#changeActual{margin-right:10px;width:120px}
|
||||
#changeDefault{width:120px;margin-right:175px;}
|
||||
#settingTimetable{width:130px;margin-right:10px;}
|
||||
#resetTimetable{width:130px;margin-right:10px;}
|
||||
#closeTimetable{width:130px;}
|
||||
</style>
|
||||
<style lang="scss">
|
||||
.ttl.haerbin-01__systerm .el-dialog .el-dialog__body{
|
||||
background: #E2E2E2;
|
||||
padding:20px 0px 10px 0px;
|
||||
}
|
||||
.defaultTimetab.el-table .cell{
|
||||
padding-top:5px;padding-bottom:5px;
|
||||
}
|
||||
</style>
|
||||
@ -1,353 +0,0 @@
|
||||
<template>
|
||||
<div v-dialogDrag>
|
||||
<div style="height: 130px;width: 100%;" class="el-dialog">
|
||||
<div class="el-dialog__header" />
|
||||
<div class="haerbin-01__systerm nav el-dialog__body">
|
||||
<el-row style="padding: 3px;">
|
||||
<el-col :span="20">
|
||||
<div style="width: calc(100% - 10px);border: 2px solid #DDD9CA;border-radius: 1px;height: 132px;">
|
||||
<el-row style="padding: 4px;">
|
||||
<div class="tip-content-box">
|
||||
<div v-if="tipContent[0]">{{ `${tipContent[0].level}` }}</div>
|
||||
<div v-if="tipContent[0]">{{ `${tipContent[0].time}` }}</div>
|
||||
<div v-if="tipContent[0]">{{ `${tipContent[0].confirm ? '确认': '未确认'}` }}</div>
|
||||
</div>
|
||||
<div class="tip-content-box">
|
||||
<div v-if="tipContent[1]">{{ `${tipContent[1].level}` }}</div>
|
||||
<div v-if="tipContent[1]">{{ `${tipContent[1].time}` }}</div>
|
||||
<div v-if="tipContent[1]">{{ `${tipContent[1].confirm ? '确认': '未确认'}` }}</div>
|
||||
</div>
|
||||
<div class="tip-content-box">
|
||||
<div v-if="tipContent[2]">{{ `${tipContent[2].level}` }}</div>
|
||||
<div v-if="tipContent[2]">{{ `${tipContent[2].time}` }}</div>
|
||||
<div v-if="tipContent[2]">{{ `${tipContent[2].confirm ? '确认': '未确认'}` }}</div>
|
||||
</div>
|
||||
</el-row>
|
||||
<div style="padding: 5px;height:20px;line-height: 20px;border-top: 2px solid #DDD9CA;display: flex;justify-content: space-between;">
|
||||
<div>
|
||||
<div class="div-simulate-button" style="width: 40px;" @click="handleDialogShow('rpsDialog')">背投</div>
|
||||
<div class="div-simulate-button" style="width: 40px;" @click="handleDialogShow('carPack')">车场</div>
|
||||
<div class="div-simulate-button" style="width: 40px;" @click="handleDialogShow('troDialog')">轨道</div>
|
||||
<div class="div-simulate-button" style="width: 40px;">系统</div>
|
||||
<div class="div-simulate-button" style="width: 40px;" @click="handleDialogShow('traDialog')">列车</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="div-simulate-button" style="width: 40px;">联锁</div>
|
||||
<div class="div-simulate-button" style="width: 40px;" @click="handleDialogShow('tmtDialog')">列监</div>
|
||||
<div class="div-simulate-button" style="width: 40px;">运图</div>
|
||||
<div class="div-simulate-button" style="width: 55px;" @click="handleDialogShow('ttlDialog')">时刻表</div>
|
||||
<div class="div-simulate-button" style="width: 40px;">编表</div>
|
||||
<div class="div-simulate-button" style="width: 40px;" @click="handleDialogShow('atrDialog')">调度</div>
|
||||
<div class="div-simulate-button" style="width: 40px;">站控</div>
|
||||
<div class="div-simulate-button" style="width: 40px;">计划</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="div-simulate-button" style="width: 40px;">SDM</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="div-simulate-button" style="width: 55px;">管理员</div>
|
||||
<div class="div-simulate-button" style="width: 40px;">职权</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="div-simulate-button" style="width: 40px;">拷屏</div>
|
||||
<div class="div-simulate-button" style="width: 40px;">录放</div>
|
||||
<div class="div-simulate-button" style="width: 40px;">布局</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="2">
|
||||
<div style="width: calc(100% - 10px);border: 2px solid #DDD9CA;border-radius: 1px;">
|
||||
<el-row style="margin-top: 20px;margin-bottom: 18px;">
|
||||
<el-col :span="16">
|
||||
<el-row class="button-row">
|
||||
<div style="width: 25px;" class="div-simulate-button" :style="{background:isNoRecoverLevelA || isNoConfirmLevelA?'#F00':'#DDD' }" :class="{'headerBox' :isNoConfirmLevelA}" @click="showHimAlarm('A')">A</div>
|
||||
<div style="width: 25px;" class="div-simulate-button" :style="{background:isNoRecoverLevelB || isNoConfirmLevelB?'#F00':'#DDD' }" :class="{'headerBox' :isNoConfirmLevelB}" @click="showHimAlarm('B')">B</div>
|
||||
<div style="width: 25px;" class="div-simulate-button" :style="{background:isNoRecoverLevelC?'#F00':'#DDD' }" @click="showHimAlarm('C')">C</div>
|
||||
</el-row>
|
||||
<el-row class="button-row" style="margin-top: 20px;">
|
||||
<div style="width: 40px;" class="div-simulate-button" @click="showDiary">日记</div>
|
||||
<div style="width: 40px;" class="div-simulate-button" @click="showDiary">命令</div>
|
||||
</el-row>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<div style="width: 40px;height: 60px;line-height: 60px;" class="div-simulate-button" @click="controlAudio(false)">静音</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row class="button-row" style="margin: 10px 0;">
|
||||
<div style="width: 40px;" class="div-simulate-button" @click="undeveloped">档案</div>
|
||||
<div style="width: 40px;" class="div-simulate-button" @click="undeveloped">归档</div>
|
||||
<div style="width: 40px;" class="div-simulate-button" @click="undeveloped">统计</div>
|
||||
</el-row>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="2" style="border: 2px solid #DDD9CA;border-radius: 1px;">
|
||||
<el-row style="height: 88px;">
|
||||
<div style="font-size: 15px;color: #000;display: flex;justify-content: space-around;align-items: center;margin-top: 40px;">
|
||||
<span>{{ dateString }}</span>
|
||||
<span>{{ time }}</span>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-row class="button-row" style="margin: 10px 0;">
|
||||
<div style="width: 40px;" class="div-simulate-button" @click="undeveloped">锁屏</div>
|
||||
<div style="width: 40px;" class="div-simulate-button" @click="undeveloped">退出</div>
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
<alarm-table-hmi ref="alarmTableHmi" />
|
||||
<log-detail ref="logDetail" />
|
||||
<audio id="buzzer" controls loop="loop" style="width: 0;height: 0">
|
||||
<source :src="buzzerAudio" type="audio/mpeg">
|
||||
</audio>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapGetters } from 'vuex';
|
||||
import BuzzerAudio from '@/assets/buzzer.mp3';
|
||||
import AlarmTableHmi from '@/jmapNew/theme/nanjing_02/menus/menuDialog/alarmTableHmi';
|
||||
import LogDetail from '@/jmapNew/theme/nanjing_02/menus/menuDialog/logDetail';
|
||||
import { timestampFormat } from '@/utils/date';
|
||||
export default {
|
||||
name: 'BaSiDi',
|
||||
components: {
|
||||
AlarmTableHmi,
|
||||
LogDetail
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogVisible: true,
|
||||
tipContent: [],
|
||||
buzzerAudio: BuzzerAudio,
|
||||
sound: false,
|
||||
noConfirmMapA: {},
|
||||
noConfirmMapB: {},
|
||||
confirmNoRecoverMapA: {},
|
||||
confirmNoRecoverMapB: {},
|
||||
confirmNoRecoverMapC: {},
|
||||
noConfirmMapAString: '{}',
|
||||
noConfirmMapBString: '{}',
|
||||
confirmNoRecoverMapAString: '{}',
|
||||
confirmNoRecoverMapBString: '{}',
|
||||
confirmNoRecoverMapCString: '{}',
|
||||
time: '00:00:00',
|
||||
dateString: '00.00.0000'
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapGetters('training', [
|
||||
'mode',
|
||||
'started',
|
||||
'steps',
|
||||
'order'
|
||||
]),
|
||||
...mapGetters('map', [
|
||||
'stationList',
|
||||
'trainList'
|
||||
]),
|
||||
userId() {
|
||||
return this.$store.state.user ? this.$store.state.user.id : '';
|
||||
},
|
||||
isNoConfirmLevelA() {
|
||||
return this.noConfirmMapAString !== '{}';
|
||||
},
|
||||
isNoConfirmLevelB() {
|
||||
return this.noConfirmMapBString !== '{}';
|
||||
},
|
||||
isNoRecoverLevelA() {
|
||||
return this.confirmNoRecoverMapAString !== '{}';
|
||||
},
|
||||
isNoRecoverLevelB() {
|
||||
return this.confirmNoRecoverMapBString !== '{}';
|
||||
},
|
||||
isNoRecoverLevelC() {
|
||||
return this.confirmNoRecoverMapCString !== '{}';
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'$store.state.training.initTime': function (initTime) {
|
||||
this.initDate(initTime);
|
||||
},
|
||||
'$store.state.socket.simulationTimeSync': function (time) { // 仿真时间更新
|
||||
this.$store.dispatch('training/setInitTime', time);
|
||||
},
|
||||
'$store.state.socket.simulationAlarmInfo': function(val) {
|
||||
(val || []).forEach(item => {
|
||||
if (!item.confirmed) {
|
||||
this.tipContent.push(item);
|
||||
// this.handleAlarm(item);
|
||||
if (this.tipContent.length > 3) {
|
||||
this.tipContent.shift();
|
||||
}
|
||||
if (item.level === 'A') {
|
||||
this.noConfirmMapA[item.code] = item;
|
||||
this.noConfirmMapAString = JSON.stringify(this.noConfirmMapA);
|
||||
} else if (item.level === 'B') {
|
||||
this.noConfirmMapB[item.code] = item;
|
||||
this.noConfirmMapBString = JSON.stringify(this.noConfirmMapB);
|
||||
}
|
||||
} else if (!item.recovered) {
|
||||
if (item.level === 'A') {
|
||||
delete this.noConfirmMapA[item.code];
|
||||
this.confirmNoRecoverMapA[item.code] = item;
|
||||
this.noConfirmMapAString = JSON.stringify(this.noConfirmMapA);
|
||||
this.confirmNoRecoverMapAString = JSON.stringify(this.confirmNoRecoverMapA);
|
||||
} else if (item.level === 'B') {
|
||||
delete this.noConfirmMapB[item.code];
|
||||
this.confirmNoRecoverMapB[item.code] = item;
|
||||
this.noConfirmMapBString = JSON.stringify(this.noConfirmMapB);
|
||||
this.confirmNoRecoverMapBString = JSON.stringify(this.confirmNoRecoverMapB);
|
||||
} else if (item.level === 'C') {
|
||||
this.confirmNoRecoverMapC[item.code] = item;
|
||||
this.confirmNoRecoverMapCString = JSON.stringify(this.confirmNoRecoverMapC);
|
||||
}
|
||||
} else {
|
||||
if (item.level === 'A') {
|
||||
delete this.noConfirmMapA[item.code];
|
||||
delete this.confirmNoRecoverMapA[item.code];
|
||||
this.noConfirmMapAString = JSON.stringify(this.noConfirmMapA);
|
||||
this.confirmNoRecoverMapAString = JSON.stringify(this.confirmNoRecoverMapA);
|
||||
} else if (item.level === 'B') {
|
||||
delete this.noConfirmMapB[item.code];
|
||||
delete this.confirmNoRecoverMapB[item.code];
|
||||
this.noConfirmMapBString = JSON.stringify(this.noConfirmMapB);
|
||||
this.confirmNoRecoverMapBString = JSON.stringify(this.confirmNoRecoverMapB);
|
||||
} else if (item.level === 'C') {
|
||||
delete this.confirmNoRecoverMapC[item.code];
|
||||
this.confirmNoRecoverMapCString = JSON.stringify(this.confirmNoRecoverMapC);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
undeveloped() {
|
||||
this.doClose();
|
||||
this.$alert(this.$t('menu.menuBar.implemented'), this.$t('global.tips'), {
|
||||
confirmButtonText: this.$t('global.confirm'),
|
||||
callback: action => {
|
||||
}
|
||||
});
|
||||
},
|
||||
showHimAlarm(level) {
|
||||
this.$refs.alarmTableHmi.doShow(level);
|
||||
},
|
||||
showDiary() {
|
||||
this.$refs.logDetail.doShow();
|
||||
},
|
||||
controlAudio(val) {
|
||||
const audio = document.getElementById('buzzer');
|
||||
this.sound = val;
|
||||
if (audio !== null) {
|
||||
if (val) {
|
||||
audio.play();
|
||||
} else if (val === false) {
|
||||
audio.pause();
|
||||
}
|
||||
}
|
||||
},
|
||||
handleDialogShow(type) {
|
||||
this.$emit('handleDialogShow', type);
|
||||
},
|
||||
selectBeginTime() {
|
||||
this.$emit('selectBeginTime');
|
||||
},
|
||||
end() {
|
||||
this.$emit('end');
|
||||
},
|
||||
back() {
|
||||
this.$emit('back');
|
||||
},
|
||||
initDate(date) {
|
||||
this.time = timestampFormat('HH:mm:ss', date)
|
||||
this.dateString = timestampFormat('YYYY.MM.DD', date)
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped rel="stylesheet/scss" lang="scss">
|
||||
@import "src/styles/mixin.scss";
|
||||
$width: 30px;
|
||||
$height: 90px;
|
||||
$menuPadding: 10px;
|
||||
$menuItemHeight: 30px;
|
||||
$menuItemWidth: 190px;
|
||||
$menuItemPadding: 5px;
|
||||
|
||||
.nav {
|
||||
display: block;
|
||||
cursor: pointer;
|
||||
color: #0000;
|
||||
background: -webkit-linear-gradient(#FDFDFE, #DEE3F3);
|
||||
background: -o-linear-gradient(#FDFDFE, #DEE3F3);
|
||||
background: -moz-linear-gradient(#FDFDFE, #DEE3F3);
|
||||
background: linear-gradient(#FDFDFE, #DEE3F3);
|
||||
border: 1px solid #B6BCCC !important;
|
||||
border-bottom: 2px solid #B6BCCC !important;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.div-simulate-button{
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
display: inline-block;
|
||||
font-size: 14px;
|
||||
color: #303030;
|
||||
border: 1px solid #44556D;
|
||||
background: #DDD;
|
||||
text-align: center;
|
||||
border-radius: 1px;
|
||||
width: 80px;
|
||||
}
|
||||
.tip-content-box{
|
||||
height: 30px;
|
||||
width: 100%;
|
||||
line-height: 30px;
|
||||
background: #001528;
|
||||
color: #C20F29;
|
||||
font-size: 14px;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
}
|
||||
.button-row{
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
display: flex;
|
||||
justify-content:space-between;
|
||||
}
|
||||
@keyframes fade {
|
||||
from {
|
||||
opacity: 1.0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.4;
|
||||
}
|
||||
to {
|
||||
opacity: 1.0;
|
||||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes fade {
|
||||
from {
|
||||
opacity: 1.0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.4;
|
||||
}
|
||||
to {
|
||||
opacity: 1.0;
|
||||
}
|
||||
}
|
||||
|
||||
.headerBox {
|
||||
background: #f00;
|
||||
animation: fade 600ms infinite;
|
||||
-webkit-animation: fade 600ms infinite;
|
||||
}
|
||||
/deep/.el-dialog__body{
|
||||
padding: 0;
|
||||
}
|
||||
</style>
|
||||
@ -1,261 +0,0 @@
|
||||
<template>
|
||||
<el-dialog v-dialogDrag class="nanjing-02__systerm route-setting" :title="title" :visible.sync="show" width="900px" label-position="top" :before-close="doClose" :z-index="2000" :modal="false" :close-on-click-modal="false">
|
||||
<div style="padding: 5px;">
|
||||
<div class="content_box">
|
||||
<div class="el-button" :class="activeIndex == 0 ? 'active' : ''" style="width: 49%;" @click="handleSelect(0)">Mileage and inspection</div>
|
||||
<div class="el-button" :class="activeIndex == 1 ? 'active' : ''" style="width: 49%;" @click="handleSelect(1)">Cargroup management</div>
|
||||
</div>
|
||||
<div v-if="activeIndex == 0" class="table">
|
||||
<span>Range of car group number: 401(1/6) - 450(1/6)</span>
|
||||
<el-table
|
||||
ref="tempTable"
|
||||
class="table_content_box"
|
||||
:data="tempData1"
|
||||
border
|
||||
style="width: 100%"
|
||||
header-cell-class-name="table_header_box"
|
||||
size="mini"
|
||||
highlight-current-row
|
||||
:height="340"
|
||||
>
|
||||
<el-table-column prop="firstGroup" label="First car group" style="margin-left:30px" :width="100" />
|
||||
<el-table-column prop="lastGroup" label="Last car group" :width="100" />
|
||||
<el-table-column prop="totalmileage" label="Total mileage" :width="95" />
|
||||
<el-table-column prop="recentDate" label="Recent inspection date" :width="150" />
|
||||
<el-table-column prop="mileageSince" label="Mileage since recent inspection" :width="200" />
|
||||
<el-table-column prop="correction" label="Correction mileage" />
|
||||
<el-table-column label="Carry out inspection" :width="100">
|
||||
<template slot-scope="scope">
|
||||
<el-checkbox v-model="scope.row.carryOut" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div v-if="activeIndex == 1" class="table">
|
||||
<span>Range of car group number: 401(1/6) - 450(1/6)</span>
|
||||
<el-table
|
||||
ref="tempTable"
|
||||
class="table_content_box"
|
||||
:data="tempData"
|
||||
border
|
||||
style="width: 100%"
|
||||
header-cell-class-name="table_header_box"
|
||||
size="mini"
|
||||
highlight-current-row
|
||||
:height="340"
|
||||
>
|
||||
<el-table-column prop="serviceNo" label="Train service No." style="margin-left:30px" :width="90" />
|
||||
<el-table-column prop="trainId" label="Train-ID" :width="80" />
|
||||
<el-table-column prop="firstGroup" label="First car group" :width="70" />
|
||||
<el-table-column prop="lastGroup" label="Last car group" :width="70" />
|
||||
<el-table-column prop="startStation" label="Start station" :width="110">
|
||||
<template slot-scope="scope">
|
||||
<el-select v-model="scope.row.startStation" clearable placeholder="请选择" size="mini">
|
||||
<el-option
|
||||
v-for="item in stationList"
|
||||
:key="item.code"
|
||||
:label="item.name"
|
||||
:value="item.code"
|
||||
/>
|
||||
</el-select>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="startTime" label="Start time">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.startTime }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="terminalStation" label="Terminal station" :width="110">
|
||||
<template slot-scope="scope">
|
||||
<el-select v-model="scope.row.terminalStation" clearable placeholder="请选择" size="mini">
|
||||
<el-option
|
||||
v-for="item in stationList"
|
||||
:key="item.code"
|
||||
:label="item.name"
|
||||
:value="item.code"
|
||||
/>
|
||||
</el-select>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="terminalTime" label="Terminal time">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.terminalTime }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="In service" :width="65">
|
||||
<template slot-scope="scope">
|
||||
<el-checkbox v-model="scope.row.inService" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div style="overflow: hidden;">
|
||||
<el-button style="float: left;" @click="cancel">Refresh</el-button>
|
||||
<el-button style="float: left;" @click="cancel">Load</el-button>
|
||||
<el-button style="float: left;" @click="cancel">Delete</el-button>
|
||||
<el-button style="float: left;" @click="cancel">Insert</el-button>
|
||||
|
||||
<el-button style="float: right;" @click="cancel">Close</el-button>
|
||||
<el-button class="disabled" :loading="loading" style="float: right;" @click="commit">Execute</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapGetters } from 'vuex';
|
||||
import { OperationEvent } from '@/scripts/cmdPlugin/OperationHandler';
|
||||
// import { EventBus } from '@/scripts/event-bus';
|
||||
// import CMD from '@/scripts/cmdPlugin/CommandEnum';
|
||||
|
||||
export default {
|
||||
name: 'RouteCreate',
|
||||
data() {
|
||||
return {
|
||||
dialogShow: false,
|
||||
loading: false,
|
||||
selected: null,
|
||||
activeIndex: 0,
|
||||
tempData1: [
|
||||
{
|
||||
firstGroup: '4011',
|
||||
lastGroup: '4016',
|
||||
totalmileage: '0',
|
||||
recentDate: '01.01.1970',
|
||||
mileageSince: '0',
|
||||
correction: '0',
|
||||
carryOut: false
|
||||
},
|
||||
{
|
||||
firstGroup: '4021',
|
||||
lastGroup: '4026',
|
||||
totalmileage: '0',
|
||||
recentDate: '01.01.1970',
|
||||
mileageSince: '0',
|
||||
correction: '0',
|
||||
carryOut: false
|
||||
}
|
||||
],
|
||||
tempData: [
|
||||
{
|
||||
serviceNo: 47,
|
||||
trainId: '07474807',
|
||||
firstGroup: '',
|
||||
lastGroup: '',
|
||||
startStation: '',
|
||||
startTime: '24.07.2008 22:08:51',
|
||||
terminalStation: '',
|
||||
terminalTime: '24.07.2008 22:08:51',
|
||||
inService: false
|
||||
},
|
||||
{
|
||||
serviceNo: 67,
|
||||
trainId: '07474808',
|
||||
firstGroup: '',
|
||||
lastGroup: '',
|
||||
startStation: '',
|
||||
startTime: '24.07.2008 22:08:51',
|
||||
terminalStation: '',
|
||||
terminalTime: '24.07.2008 22:08:51',
|
||||
inService: false
|
||||
}
|
||||
]
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapGetters('map', [
|
||||
'map',
|
||||
'stationList'
|
||||
]),
|
||||
show() {
|
||||
return this.dialogShow && !this.$store.state.menuOperation.break;
|
||||
},
|
||||
title() {
|
||||
return '[bjdvt1/a1bj]-0-Process/Realtime - Depot Service';
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
loadInitData(map) {
|
||||
console.log(map, 11111);
|
||||
},
|
||||
doShow(operate, selected) {
|
||||
this.dialogShow = true;
|
||||
this.selected = selected;
|
||||
|
||||
this.loadInitData(this.map);
|
||||
|
||||
this.$nextTick(function () {
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
});
|
||||
},
|
||||
doClose() {
|
||||
|
||||
this.loading = false;
|
||||
this.dialogShow = false;
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
},
|
||||
handleSelect(tab) {
|
||||
this.activeIndex = tab;
|
||||
},
|
||||
commit() {
|
||||
// const operate = {
|
||||
// send: true,
|
||||
|
||||
// operation: OperationEvent.Section.newtrain.menu.operation,
|
||||
// cmdType: CMD.Section.CMD_NEW_TRAIN,
|
||||
// val: '' + this.direction + '::' + this.trainCode
|
||||
// };
|
||||
// this.loading = true;
|
||||
// this.$store.dispatch('trainingNew/next', operate).then(({ valid }) => {
|
||||
// this.loading = false;
|
||||
// if (valid) {
|
||||
// this.doClose();
|
||||
// }
|
||||
// }).catch(() => {
|
||||
// this.loading = false;
|
||||
// this.doClose();
|
||||
// EventBus.$emit('sendMsg', {message: '命令执行失败！'});
|
||||
// });
|
||||
},
|
||||
cancel() {
|
||||
const operate = {
|
||||
operation: OperationEvent.Command.cancel.menu.operation
|
||||
};
|
||||
|
||||
this.$store.dispatch('trainingNew/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.doClose();
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style rel="stylesheet/scss" lang="scss" scoped>
|
||||
.route-setting {
|
||||
.content_box {
|
||||
margin-bottom: 10px;
|
||||
.el-button{
|
||||
&.active{
|
||||
background: #969696;
|
||||
}
|
||||
}
|
||||
}
|
||||
.table_content_box{
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
/deep/ {
|
||||
.table{
|
||||
.table_header_box{
|
||||
.cell{
|
||||
text-align: center;
|
||||
word-break: break-word;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,483 +0,0 @@
|
||||
<template>
|
||||
<div class="main" :style="{width: '100%',height:'100%',position:'absolute',overflow:'hidden'}" style="background: #000;">
|
||||
<ba-si-di ref="baSiDi" @handleDialogShow="handleDialogShow" />
|
||||
<rps-dialog ref="rpsDialog" :is-run-plan="isRunPlan" :train-list="trainList" />
|
||||
<tro-dialog ref="troDialog" :is-run-plan="isRunPlan" :train-list="trainList" :station-list="stationList" />
|
||||
<car-pack ref="carPack" />
|
||||
<tro-detail ref="troDetail" :is-run-plan="isRunPlan" :train-list="trainList" :station-list="stationList" @goTroDialog="troClick" />
|
||||
<tra-dialog ref="traDialog" @openTrainTrunkDetail="openTrainTrunkDetail" />
|
||||
<ttl-dialog ref="ttlDialog" />
|
||||
<tmt-dialog ref="tmtDialog" />
|
||||
<atr-dialog ref="atrDialog" />
|
||||
<train-trunk-detail ref="trainTrunkDetail" @openTra="openTra" />
|
||||
<set-time ref="setTime" @ConfirmSelectBeginTime="start" />
|
||||
<div class="display-draft">
|
||||
<el-button-group class="button-group-box">
|
||||
<template v-if="!dataError">
|
||||
<el-button type="success" :disabled="isRunPlan" size="small" @click="selectBeginTime">{{ $t('display.demon.drivingByPlan') }}</el-button>
|
||||
<el-button type="danger" size="small" @click="end">{{ $t('display.demon.initialize') }}</el-button>
|
||||
</template>
|
||||
<el-button type="primary" size="small" @click="back">{{ $t('display.demon.back') }}</el-button>
|
||||
</el-button-group>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { getSessionStorage } from '@/utils/auth';
|
||||
import { mapGetters } from 'vuex';
|
||||
import { OperateMode } from '@/scripts/ConstDic';
|
||||
import { getToken } from '@/utils/auth';
|
||||
import { creatSubscribe, clearSubscribe, displayTopic, getTopic } from '@/utils/stomp';
|
||||
import SetTime from '@/views/newMap/displayNew/demon/setTime';
|
||||
import { clearSimulation, getSimulationInfoNew, ranAsPlan, exitRunPlan } from '@/api/simulation';
|
||||
import { loadMapDataById } from '@/utils/loaddata';
|
||||
import { EventBus } from '@/scripts/event-bus';
|
||||
import { getSimulationMemberList, getAllSimulationUser } from '@/api/simulation';
|
||||
import { getMemberListCommon, getUserListCommon } from '@/api/rtSimulation';
|
||||
import BaSiDi from './baSiDi';
|
||||
import RpsDialog from './rps';
|
||||
import TroDialog from './tro';
|
||||
import CarPack from './carPack';
|
||||
import TroDetail from './troDetail';
|
||||
import TraDialog from './tra';
|
||||
import TtlDialog from './ttl';
|
||||
import TmtDialog from './tmt';
|
||||
import AtrDialog from './atr';
|
||||
import TrainTrunkDetail from './trainTrunkDetail';
|
||||
import parseStatus from '@/utils/parseStatus';
|
||||
|
||||
export default {
|
||||
name: 'DisplayDraft',
|
||||
components: {
|
||||
BaSiDi,
|
||||
SetTime,
|
||||
RpsDialog,
|
||||
CarPack,
|
||||
TroDialog,
|
||||
TroDetail,
|
||||
TraDialog,
|
||||
TtlDialog,
|
||||
TmtDialog,
|
||||
AtrDialog,
|
||||
TrainTrunkDetail
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
offset: 15,
|
||||
offsetBottom: 15,
|
||||
tipBottom: 0,
|
||||
textStatusHeight: 0,
|
||||
planRunning:false,
|
||||
dataError: false,
|
||||
group:''
|
||||
};
|
||||
},
|
||||
computed:{
|
||||
...mapGetters([
|
||||
'canvasWidth'
|
||||
]),
|
||||
...mapGetters('map', [
|
||||
'stationList',
|
||||
'trainList'
|
||||
]),
|
||||
mode() {
|
||||
return this.$route.params.mode;
|
||||
},
|
||||
project() {
|
||||
return getSessionStorage('project');
|
||||
},
|
||||
isDemon() {
|
||||
return this.mode === 'demon' && !this.project.includes('drts');
|
||||
},
|
||||
isContest() {
|
||||
return this.mode === 'demon' && this.project.includes('drts');
|
||||
},
|
||||
mapId() {
|
||||
return this.$route.query.mapId;
|
||||
},
|
||||
width() {
|
||||
return this.$store.state.app.width;
|
||||
},
|
||||
height() {
|
||||
return this.$store.state.app.height;
|
||||
},
|
||||
projectDevice() {
|
||||
return this.$route.query.projectDevice;
|
||||
},
|
||||
isRunPlan() {
|
||||
return this.$store.state.training.started;
|
||||
}
|
||||
},
|
||||
watch:{
|
||||
'$store.state.socket.permissionOver': function () {
|
||||
this.$alert('用户权限已被收回', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
callback: action => {
|
||||
this.back();
|
||||
}
|
||||
});
|
||||
},
|
||||
'$store.state.socket.equipmentStatus': function (val) {
|
||||
if (val.length) {
|
||||
this.statusMessage(val);
|
||||
}
|
||||
},
|
||||
'$store.state.socket.deviceStateMessages': function (val) {
|
||||
if (val) {
|
||||
this.statusMessageNew(val);
|
||||
}
|
||||
},
|
||||
'$store.state.config.menuBarLoadedCount': function (val) { // menuBar加载完成
|
||||
this.setPosition();
|
||||
},
|
||||
'$store.state.app.windowSizeCount': function() { // 窗口缩放
|
||||
this.setWindowSize();
|
||||
},
|
||||
'$store.state.training.prdType': function (val) { // 根据权限类型计算高度
|
||||
this.setPosition();
|
||||
},
|
||||
'$store.state.map.mapViewLoadedCount': function (val) { // 地图视图加载完成标识 开始加载默认状态
|
||||
if (this.planRunning) {
|
||||
this.$store.dispatch('training/simulationStart');
|
||||
}
|
||||
},
|
||||
'$store.state.socket.memberChangeCount': function () { // 仿真成员变更
|
||||
this.initMemberUserInfo();
|
||||
},
|
||||
'$store.state.socket.simulationStart':function(val) {
|
||||
if (val) {
|
||||
this.$store.dispatch('training/simulationStart');
|
||||
}
|
||||
},
|
||||
$route() {
|
||||
if (!this.isLesson && !this.isExam) {
|
||||
this.initLoadData();
|
||||
}
|
||||
},
|
||||
'$store.state.menuOperation.selectedCount':function(em) {
|
||||
const device = this.$store.state.menuOperation.selected;
|
||||
if (device && device._type === 'Station' && this.$store.state.menuOperation.subType === 'troButton') {
|
||||
this.$refs.troDialog.doClose();
|
||||
this.$refs.troDetail.doShow(device.code);
|
||||
}
|
||||
}
|
||||
},
|
||||
beforeDestroy() {
|
||||
this.clearSubscribe();
|
||||
this.clearSubscribeNew();
|
||||
clearSimulation(this.group);
|
||||
this.$store.dispatch('training/reset');
|
||||
},
|
||||
async mounted() {
|
||||
const _that = this;
|
||||
window.onbeforeunload = () => { _that.clearSubscribe(); _that.clearSubscribeNew(); };
|
||||
this.setWindowSize();
|
||||
this.initLoadData();
|
||||
this.initMemberUserInfo(true);
|
||||
this.$store.dispatch('app/animationsClose');
|
||||
this.$refs.troDialog.doClose();
|
||||
},
|
||||
methods:{
|
||||
// 结束加载状态
|
||||
endViewLoading(isSuccess) {
|
||||
if (!isSuccess) {
|
||||
this.$store.dispatch('map/mapClear');
|
||||
}
|
||||
this.$nextTick(() => {
|
||||
EventBus.$emit('viewLoading', false);
|
||||
});
|
||||
},
|
||||
// 仿真错误时，被动退出时调用
|
||||
async back() {
|
||||
this.$router.go(-1);
|
||||
},
|
||||
async statusMessage(list) {
|
||||
if (this.$jlmap) {
|
||||
await this.$store.dispatch('training/updateMapState', list);
|
||||
} else {
|
||||
this.$store.commit('map/updateMapDevice', list);
|
||||
}
|
||||
await this.$store.dispatch('socket/setEquipmentStatus');
|
||||
},
|
||||
async statusMessageNew(deviceStatus) {
|
||||
const list = parseStatus(deviceStatus);
|
||||
await this.$store.dispatch('training/updateMapState', list);
|
||||
await this.$store.dispatch('socket/setDeviceStateMessages');
|
||||
},
|
||||
async subscribe() {
|
||||
this.clearSubscribe();
|
||||
const header = { group: this.$route.query.group || '', 'X-Token': getToken() };
|
||||
creatSubscribe(`${displayTopic}\/${this.$route.query.group}`, header);
|
||||
await this.$store.dispatch('training/setHasSubscribed');
|
||||
},
|
||||
async subscribeNew() {
|
||||
this.clearSubscribeNew();
|
||||
const header = { 'X-Token': getToken() };
|
||||
creatSubscribe(getTopic('ATS', this.$route.query.group), header);
|
||||
creatSubscribe(getTopic('SYSTIME', this.$route.query.group), header);
|
||||
creatSubscribe(getTopic('STATE', this.$route.query.group), header);
|
||||
await this.$store.dispatch('training/setHasSubscribed');
|
||||
},
|
||||
clearSubscribeNew() {
|
||||
clearSubscribe(getTopic('ATS', this.$route.query.group));
|
||||
clearSubscribe(getTopic('SYSTIME', this.$route.query.group));
|
||||
clearSubscribe(getTopic('STATE', this.$route.query.group));
|
||||
},
|
||||
clearSubscribe() {
|
||||
clearSubscribe(`${displayTopic}\/${this.groupModel}`);
|
||||
},
|
||||
openTra() {
|
||||
this.$refs.traDialog.doShow();
|
||||
},
|
||||
initMemberUserInfo(isFirst = false) {
|
||||
if (this.$route.query.newApi + '' === 'true') {
|
||||
getMemberListCommon(this.$route.query.group).then(resp => {
|
||||
this.$store.dispatch('training/setMemberList', { memberList: resp.data, userId: this.$store.state.user.id });
|
||||
getUserListCommon(this.$route.query.group).then(res => {
|
||||
this.$store.dispatch('training/setSimulationUserList', res.data);
|
||||
if (isFirst) { this.subscribeNew(); }
|
||||
}).catch(() => {
|
||||
this.$messageBox('获取所有仿真用户失败！');
|
||||
});
|
||||
}).catch(() => {
|
||||
this.$messageBox('获取仿真成员列表失败！');
|
||||
});
|
||||
} else {
|
||||
// 获取仿真成员列表
|
||||
getSimulationMemberList(this.$route.query.group).then(resp => {
|
||||
this.$store.dispatch('training/setMemberList', { memberList: resp.data, userId: this.$store.state.user.id });
|
||||
getAllSimulationUser(this.$route.query.group).then(res => {
|
||||
this.$store.dispatch('training/setSimulationUserList', res.data);
|
||||
if (isFirst) {
|
||||
this.subscribe();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.$messageBox('获取所有仿真用户失败！');
|
||||
});
|
||||
}).catch(() => {
|
||||
this.$messageBox('获取仿真成员列表失败！');
|
||||
});
|
||||
}
|
||||
},
|
||||
// 设置各个按钮的定位
|
||||
setPosition() {
|
||||
this.$nextTick(() => {
|
||||
this.offset = 10;
|
||||
this.offsetBottom = 15;
|
||||
const menuBar = document.getElementById('menuBar');
|
||||
const menuTool = document.getElementById('menuTool');
|
||||
const menuBottom = document.getElementById('menuButton');
|
||||
const menuButtonsBox = document.getElementById('menuButtons_box');
|
||||
const textStatus = document.getElementById('textStatus');
|
||||
if (menuBar) {
|
||||
this.offset = (menuBar.offsetHeight || 0) + 15;
|
||||
}
|
||||
if (menuTool) {
|
||||
this.offset = (menuTool.offsetHeight || 0) + 15;
|
||||
}
|
||||
const buttonWidth = this.width - 1200; // B box widht
|
||||
if (menuBottom && buttonWidth < 780) {
|
||||
this.offsetBottom = (menuBottom.offsetHeight || 0) + 15;
|
||||
}
|
||||
if (menuButtonsBox) {
|
||||
this.tipBottom = (menuButtonsBox.offsetHeight || 0) + 15;
|
||||
}
|
||||
if (textStatus) {
|
||||
this.textStatusHeight = textStatus.offsetHeight || 0;
|
||||
textStatus.style.top = this.offset - 15 + 'px';
|
||||
}
|
||||
});
|
||||
},
|
||||
// 缩放设置
|
||||
setWindowSize() {
|
||||
const width = this.width;
|
||||
const height = this.height;
|
||||
this.$store.dispatch('config/resize', { width, height });
|
||||
// this.$store.dispatch('training/updateOffsetStationCode', { offsetStationCode: this.offsetStationCode });
|
||||
},
|
||||
// 初始化
|
||||
initLoadData() {
|
||||
this.group = this.$route.query.group;
|
||||
this.$store.dispatch('training/reset');
|
||||
this.loadSimulationInfo();
|
||||
this.loadMapData();
|
||||
},
|
||||
// 新版地图根据仿真group获取仿真基础信息
|
||||
async loadSimulationInfo() {
|
||||
const resp = await getSimulationInfoNew(this.group);
|
||||
if (resp && resp.code == 200 && resp.data) {
|
||||
if (!resp.data.dataError) {
|
||||
this.$store.dispatch('scriptRecord/updateSimulationPause', resp.data.pause); // 是否暂停判断
|
||||
this.$store.dispatch('training/setInitTime', resp.data.systemTime);
|
||||
this.$store.dispatch('training/countTime');
|
||||
this.$store.dispatch('runPlan/setRunPlanInfo', resp.data.runPlan);
|
||||
this.planRunning = resp.data.planRunning;
|
||||
if (resp.data.planRunning) {
|
||||
this.$store.commit('training/start');
|
||||
}
|
||||
} else {
|
||||
this.$messageBox('此地图数据正在维护中,无法运行！');
|
||||
}
|
||||
this.dataError = resp.data.dataError;
|
||||
}
|
||||
},
|
||||
selectBeginTime() {
|
||||
this.$refs.setTime.doShow();
|
||||
},
|
||||
// 加载地图数据
|
||||
loadMapData() {
|
||||
if (parseInt(this.mapId)) {
|
||||
this.$store.dispatch('training/changeOperateMode', { mode: OperateMode.NORMAL }); // 默认为正常模式
|
||||
loadMapDataById(this.mapId, 'simulation');
|
||||
} else {
|
||||
this.endViewLoading();
|
||||
}
|
||||
},
|
||||
start(model) { // 开始仿真
|
||||
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/setInitTime', model.initTime);
|
||||
this.$store.dispatch('training/setInitTime', model.timestamp);
|
||||
}).catch(error => {
|
||||
let message = '';
|
||||
switch (error.code) {
|
||||
case '5001':
|
||||
message = this.$t('error.mapDataError');
|
||||
break;
|
||||
case '5002':
|
||||
message = this.$t('error.runningChartDataError');
|
||||
break;
|
||||
case '5003':
|
||||
message = this.$t('error.runningChartIsNotLoaded');
|
||||
break;
|
||||
case '5004':
|
||||
message = this.$t('error.runningDataError');
|
||||
break;
|
||||
case '5000':
|
||||
message = this.$t('error.systemError');
|
||||
break;
|
||||
case '4000':
|
||||
message = this.$t('error.simulationDoesNotExist');
|
||||
break;
|
||||
case '4001':
|
||||
message = this.$t('error.simulationOperationIsNotDefined');
|
||||
break;
|
||||
case '4002':
|
||||
message = this.$t('error.simulationOperationProcessingMethodNotFound');
|
||||
break;
|
||||
case '4003':
|
||||
message = this.$t('error.simulationOperationFailed');
|
||||
break;
|
||||
case '4004':
|
||||
message = this.$t('error.operationConflict');
|
||||
break;
|
||||
default:
|
||||
message = '按计划行车异常,请退出重试!';
|
||||
// this.$messageBox('按计划行车异常,请退出重试!');
|
||||
break;
|
||||
}
|
||||
this.$messageBox(message + '，' + this.$t('error.startSimulationFailed'));
|
||||
});
|
||||
},
|
||||
end() {
|
||||
exitRunPlan(this.group).then(() => {
|
||||
this.$store.dispatch('training/over').then(() => {
|
||||
this.$store.dispatch('training/setMapDefaultState').then(() => {
|
||||
this.$store.dispatch('map/clearJlmapTrainView');
|
||||
this.$store.dispatch('map/resetActiveTrainList', false);
|
||||
this.$store.dispatch('map/setTrainWindowShow', false);
|
||||
});
|
||||
});
|
||||
}).catch(() => {
|
||||
this.$messageBox(this.$t('display.demon.endSimulationFail'));
|
||||
});
|
||||
},
|
||||
troClick() {
|
||||
this.$refs.troDialog.doShow();
|
||||
},
|
||||
openTrainTrunkDetail(index) {
|
||||
this.$refs.trainTrunkDetail.doShow(index);
|
||||
},
|
||||
handleDialogShow(type) {
|
||||
this.$refs[type].doShow();
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style scoped rel="stylesheet/scss" lang="scss">
|
||||
.display-draft {
|
||||
position: fixed;
|
||||
right: 10px;
|
||||
bottom: 15px;
|
||||
.button-group-box{
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<style>
|
||||
.nanjing-02__systerm .el-dialog {
|
||||
background: #d8d8d8;
|
||||
border: 2px solid rgba(144, 144, 144, 0.8);
|
||||
border-radius: 6px;
|
||||
color: #000;
|
||||
font-size: 14px;
|
||||
}
|
||||
.nanjing-02__systerm .el-dialog .el-dialog__header {
|
||||
padding: 5px;
|
||||
height: 30px;
|
||||
background-image: linear-gradient(#A5A5BA, #FDFEFD);
|
||||
border-radius: 4px 4px 0 0;
|
||||
}
|
||||
.nanjing-02__systerm .el-dialog .el-dialog__title {
|
||||
position: absolute;
|
||||
top: 4px;
|
||||
color: #000;
|
||||
border-radius: 4px;
|
||||
padding: 0px 2px;
|
||||
height: 20px;
|
||||
line-height: 24px;
|
||||
font-size: 15px;
|
||||
}
|
||||
.nanjing-02__systerm .el-dialog .el-dialog__headerbtn {
|
||||
background: linear-gradient(#CD98A0, #C27D6E, #B63022, #C68770);
|
||||
border: 1px solid #fff;
|
||||
border-radius: 4px;
|
||||
top: 6px;
|
||||
right: 5px;
|
||||
line-height: 16px;
|
||||
}
|
||||
.nanjing-02__systerm .el-dialog .el-dialog__headerbtn .el-dialog__close{
|
||||
color: #fff;
|
||||
}
|
||||
.nanjing-02__systerm .el-dialog .el-dialog__body {
|
||||
padding-top: 10px;
|
||||
padding-bottom: 10px;
|
||||
padding-left: 5px;
|
||||
padding-right: 5px;
|
||||
margin: 0px 1px 1px;
|
||||
border: 2px solid rgb(212 212 212);
|
||||
box-shadow: 1px hsla(240, 0%, 100%, 0.5) inset;
|
||||
background: #E6E6E6;
|
||||
opacity: 1;
|
||||
}
|
||||
.nanjing-02__systerm .el-dialog .el-button {
|
||||
height: 26px;
|
||||
line-height: 24px;
|
||||
font-size: 13px;
|
||||
padding: 0px;
|
||||
width: 80px;
|
||||
border: 1px solid #8B958A;
|
||||
border-radius: 0px !important;
|
||||
color: #000;
|
||||
background: #E6E6E6;
|
||||
}
|
||||
.nanjing-02__systerm .el-dialog .el-button.disabled {
|
||||
border: 1px solid #B1B1B1;
|
||||
color: #ABABAB;
|
||||
}
|
||||
</style>
|
||||
@ -1,158 +0,0 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
:modal="false"
|
||||
:title="title"
|
||||
:visible.sync="show"
|
||||
:fullscreen="true"
|
||||
:before-close="doClose"
|
||||
:z-index="2003"
|
||||
>
|
||||
<map-system-draft ref="mapCanvas" :no-menu="true" />
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapGetters } from 'vuex';
|
||||
import MapSystemDraft from '@/views/newMap/mapsystemNew/common/index';
|
||||
import Vue from 'vue';
|
||||
|
||||
export default {
|
||||
name: 'RPS',
|
||||
components: {
|
||||
MapSystemDraft
|
||||
},
|
||||
props: {
|
||||
trainList: {
|
||||
type: Array,
|
||||
required: true
|
||||
},
|
||||
isRunPlan: {
|
||||
type: Boolean,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogShow: false,
|
||||
mapData: null,
|
||||
selfJmap: null
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
show() {
|
||||
return this.dialogShow && !this.$store.state.menuOperation.break;
|
||||
},
|
||||
title() {
|
||||
return '背投系统';
|
||||
},
|
||||
width() {
|
||||
return this.$store.state.app.width - 5;
|
||||
},
|
||||
height() {
|
||||
return this.$store.state.app.height - 50;
|
||||
},
|
||||
...mapGetters('map', [
|
||||
'bigScreenConfig'
|
||||
])
|
||||
},
|
||||
watch: {
|
||||
'$store.state.map.mapViewLoadedCount': function (val) { // 地图视图加载完成标识 开始加载默认状态
|
||||
if (this.dialogShow) {
|
||||
this.handleUpdateScreen();
|
||||
this.$refs.mapCanvas && this.$refs.mapCanvas.mapViewLoaded(false);
|
||||
}
|
||||
},
|
||||
'$store.state.app.windowSizeCount': function() { // 窗口缩放
|
||||
this.$store.dispatch('config/resize', { width:this.width, height: this.height });
|
||||
}
|
||||
},
|
||||
beforeDestroy() {
|
||||
if (this.selfJmap && this.selfJmap._disposeFlag) {
|
||||
this.destroy();
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
doShow() {
|
||||
this.dialogShow = true;
|
||||
if (this.selfJmap) { Vue.prototype.$jlmap = this.selfJmap; }
|
||||
this.$store.dispatch('config/resize', { width:this.width, height: this.height });
|
||||
this.$nextTick(function() {
|
||||
this.$refs.mapCanvas.setMap(this.$store.state.map.map);
|
||||
const mapDevice = this.$store.state.map.mapDevice;
|
||||
const list = [];
|
||||
for (const key in mapDevice) {
|
||||
list.push(mapDevice[key]);
|
||||
}
|
||||
this.$jlmap.updateShowMode(list, '02');
|
||||
this.$store.dispatch('training/updateMapState', list);
|
||||
!this.isRunPlan && this.$jlmap.clearTrainView();
|
||||
});
|
||||
},
|
||||
destroy() {
|
||||
this.selfJmap.dispose();
|
||||
},
|
||||
handleUpdateScreen() {
|
||||
this.maskOpen = false;
|
||||
if (this.bigScreenConfig.bigScreenSplitConfig && this.bigScreenConfig.bigScreenSplitConfig.length) {
|
||||
const offsetList = this.bigScreenConfig.offsetList;
|
||||
const width = this.bigScreenConfig.width;
|
||||
const height = this.bigScreenConfig.height;
|
||||
const size = {
|
||||
width: (this.$store.state.app.width - 2) * width,
|
||||
height: this.$store.state.app.height * height,
|
||||
list: this.bigScreenConfig.bigScreenSplitConfig.map(ele => ele.position),
|
||||
offsetList: offsetList
|
||||
};
|
||||
this.$jlmap.setUpdateScreen(size);
|
||||
const mapDevice = this.$store.state.map.mapDevice;
|
||||
const list = [];
|
||||
for (const key in mapDevice) {
|
||||
list.push(mapDevice[key]);
|
||||
}
|
||||
this.$jlmap.updateShowMode(list, '02');
|
||||
} else {
|
||||
this.maskOpen = true;
|
||||
// this.$messageBox('该线路没有大屏切割位置信息, 请前往地图绘制编辑');
|
||||
}
|
||||
},
|
||||
doClose() {
|
||||
this.loading = false;
|
||||
this.dialogShow = false;
|
||||
// this.$jlmap && this.$jlmap.clearTrainView();
|
||||
this.selfJmap = Vue.prototype.$jlmap;
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style scoped>
|
||||
/deep/ .el-dialog {
|
||||
background: rgba(100, 100, 100, 1);
|
||||
position: relative;
|
||||
border: 2px solid rgba(144, 144, 144, 0.8);
|
||||
border-radius: 6px;
|
||||
font-size: 14px;
|
||||
}
|
||||
/deep/ .el-dialog .el-dialog__body{
|
||||
background: rgba(100, 100, 100, 1);
|
||||
border: 0;
|
||||
padding: 0;
|
||||
}
|
||||
/deep/ .el-dialog .el-dialog__header {
|
||||
padding: 5px;
|
||||
height: 30px;
|
||||
}
|
||||
/deep/ .el-dialog .el-dialog__title {
|
||||
color: #fff;
|
||||
}
|
||||
/deep/ .el-dialog .el-dialog__headerbtn {
|
||||
background: linear-gradient(#CD98A0, #C27D6E, #B63022, #C68770);
|
||||
border: 1px solid #fff;
|
||||
border-radius: 4px;
|
||||
top: 4px;
|
||||
right: 5px;
|
||||
line-height: 16px;
|
||||
}
|
||||
/deep/ .el-dialog__headerbtn .el-dialog__close{
|
||||
color: #fff;
|
||||
}
|
||||
</style>
|
||||
@ -1,675 +0,0 @@
|
||||
<template>
|
||||
<!--<el-dialog-->
|
||||
<!--v-dialogDrag-->
|
||||
<!--class="route-setting"-->
|
||||
<!--:title="title"-->
|
||||
<!--:visible.sync="show"-->
|
||||
<!--width="900px"-->
|
||||
<!--label-position="top"-->
|
||||
<!--:before-close="doClose"-->
|
||||
<!--:z-index="2009"-->
|
||||
<!--:modal="false"-->
|
||||
<!--:close-on-click-modal="false"-->
|
||||
<!-->-->
|
||||
<div v-if="dialogShow" id="faultChoose">
|
||||
<div class="falutChooseTitle">{{ title }}</div>
|
||||
<div class="closeFalutChoose" @click="doClose">
|
||||
<span class="el-icon-close closeFalutChooseIn" />
|
||||
</div>
|
||||
<div class="card" style="padding: 20px;">
|
||||
<div style="padding: 5px;">
|
||||
<el-row>
|
||||
<el-col :span="12"><span>所选位置：</span></el-col>
|
||||
<el-col :span="12"><span>列车号：</span></el-col>
|
||||
</el-row>
|
||||
<el-row style="margin-top: 10px;">
|
||||
<el-col :span="12">
|
||||
<el-input v-model="sectionName" size="mini" style="width: 400px;" :disabled="true" />
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-input v-model="trainCode" :maxlength="8" size="mini" style="width: 310px;" />
|
||||
<el-button size="mini" icon="el-icon-search" @click="trainFind" />
|
||||
<el-button size="mini" icon="el-icon-refresh-left" @click="resetTrainCode" />
|
||||
</el-col>
|
||||
</el-row>
|
||||
<div style="display: flex;justify-content: space-around;margin-top: 20px;">
|
||||
<el-button size="mini" style="width: 280px;" :disabled="operationType === 'show'" @click="changeOperationType('show')">显示列车信息</el-button>
|
||||
<el-button size="mini" style="width: 280px;" :disabled="operationType === 'update'" @click="changeOperationType('update')">修改列车资料</el-button>
|
||||
<el-button size="mini" style="width: 280px;" :disabled="operationType === 'create'" @click="changeOperationType('create')">创建列车号</el-button>
|
||||
</div>
|
||||
<div style="display: flex;justify-content: space-around;margin-top: 10px;">
|
||||
<el-button size="mini" style="width: 280px;" :disabled="operationType === 'delete'" @click="changeOperationType('delete')">删除列车号</el-button>
|
||||
<el-button size="mini" style="width: 280px;" :disabled="operationType === 'move'" @click="changeOperationType('move')">步进列车号</el-button>
|
||||
<el-button size="mini" style="width: 280px;" :disabled="operationType === 'resort'" @click="changeOperationType('resort')">重排列车号</el-button>
|
||||
</div>
|
||||
<div v-if="operationType === 'show'">
|
||||
<el-table :data="tableData" border style="width: 100%;margin-top: 20px;" height="200">
|
||||
<el-table-column prop="date" label="方向">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.right ? '>':'<' }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="name" label="列车号">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ getTrainCode(scope.row) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="address" label="位置">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ getSectionPosition(scope.row.sectionCode) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="address" label="ARS" />
|
||||
<el-table-column prop="address" label="晚点" />
|
||||
</el-table>
|
||||
</div>
|
||||
<div v-else-if="operationType === 'create'" style="display: flex;justify-content: space-between;">
|
||||
<div>
|
||||
<el-table :data="tableData" border style="width: 280px;margin-top: 20px;" height="200">
|
||||
<el-table-column prop="date" label="方向" width="60">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.right ? '>':'<' }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="name" label="列车号" width="157">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ getTrainCode(scope.row) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="address" label="位置" width="60">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ getSectionPosition(scope.row.sectionCode) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div>
|
||||
<div style="margin-top: 20px;display: flex;justify-content: space-between;padding: 5px;align-items: center;">
|
||||
<span>位置：</span>
|
||||
<el-select v-model="nowSectionCode" :disabled="true" :popper-append-to-body="false" size="mini" style="width: 150px">
|
||||
<el-option
|
||||
v-for="item in sectionList"
|
||||
:key="item.code"
|
||||
:label="item.name"
|
||||
:value="item.code"
|
||||
/>
|
||||
</el-select>
|
||||
</div>
|
||||
<div style="display: flex;justify-content: space-between;padding: 5px;align-items: center;margin-top: 5px;">
|
||||
<span>新列车号：</span>
|
||||
<el-input v-model="newTrainCode" :maxlength="8" size="mini" style="width: 150px;" />
|
||||
</div>
|
||||
<div style="display: flex;justify-content: space-between;padding: 5px;margin-top: 5px;">
|
||||
<span>方向：</span>
|
||||
<el-select v-model="direction" :disabled="true" :popper-append-to-body="false" size="mini" style="width: 80px" placeholder="请选择">
|
||||
<el-option
|
||||
v-for="item in directionList"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</div>
|
||||
<div style="display: flex;justify-content: space-between;padding: 5px;margin-top: 5px;">
|
||||
<span>设置该列车为自动排列：</span>
|
||||
<el-radio v-model="autoArrange" :disabled="true" label="true">开启</el-radio>
|
||||
<el-radio v-model="autoArrange" :disabled="true" label="false">关闭</el-radio>
|
||||
</div>
|
||||
<div style="display: flex;justify-content: space-between;padding: 5px;align-items: center;margin-top: 5px;">
|
||||
<span>车组号：</span>
|
||||
<el-input v-model="groupNumber1" :maxlength="4" size="mini" style="width: 60px;" />
|
||||
<div style="border: 1px solid #DCDFE6;padding: 4px 5px;border-radius: 3px;"><></div>
|
||||
<el-input v-model="groupNumber2" :maxlength="4" :disabled="true" size="mini" style="width: 60px;" />
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div style="margin-top: 20px;height: 20px;">插入位置（之前）：</div>
|
||||
<el-table :data="tableData" border style="width: 280px;" height="180">
|
||||
<el-table-column prop="date" label="方向" width="60">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.right ? '>':'<' }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="name" label="列车号" width="157">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ getTrainCode(scope.row) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="address" label="位置" width="60">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ getSectionPosition(scope.row.sectionCode) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else-if="operationType === 'update'" style="display: flex;justify-content: flex-start;">
|
||||
<div>
|
||||
<el-table :data="tableData" border style="width: 280px;margin-top: 20px;" height="200" @current-change="handleCurrentChange">
|
||||
<el-table-column prop="date" label="方向" width="60" />
|
||||
<el-table-column label="列车号" width="157">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ getTrainCode(scope.row) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="位置" width="60">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ getSectionPosition(scope.row.sectionCode) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div>
|
||||
<div style="margin-top: 20px;display: flex;justify-content: space-between;padding: 5px;align-items: center;">
|
||||
<span>位置：</span>
|
||||
<el-select v-model="nowSectionCode" :disabled="true" :popper-append-to-body="false" size="mini" style="width: 150px">
|
||||
<el-option
|
||||
v-for="item in sectionList"
|
||||
:key="item.code"
|
||||
:label="item.name"
|
||||
:value="item.code"
|
||||
/>
|
||||
</el-select>
|
||||
</div>
|
||||
<div style="display: flex;justify-content: space-between;padding: 5px;align-items: center;margin-top: 5px;">
|
||||
<span>新列车号：</span>
|
||||
<el-input v-model="newTrainCode" size="mini" :maxlength="8" style="width: 150px;" />
|
||||
</div>
|
||||
<div style="display: flex;justify-content: space-between;padding: 5px;margin-top: 5px;">
|
||||
<span>方向：</span>
|
||||
<el-select v-model="direction" :disabled="true" :popper-append-to-body="false" size="mini" style="width: 80px">
|
||||
<el-option
|
||||
v-for="item in directionList"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</div>
|
||||
<div style="display: flex;justify-content: space-between;padding: 5px;margin-top: 5px;">
|
||||
<span>设置该列车为自动排列：</span>
|
||||
<el-radio v-model="autoArrange" :disabled="true" label="true">开启</el-radio>
|
||||
<el-radio v-model="autoArrange" :disabled="true" label="false">关闭</el-radio>
|
||||
</div>
|
||||
<div style="display: flex;justify-content: space-between;padding: 5px;align-items: center;margin-top: 5px;">
|
||||
<span>车组号：</span>
|
||||
<el-input v-model="groupNumber1" :disabled="true" :maxlength="4" size="mini" style="width: 60px;" />
|
||||
<div style="border: 1px solid #DCDFE6;padding: 4px 5px;border-radius: 3px;"><></div>
|
||||
<el-input v-model="groupNumber2" :disabled="true" :maxlength="4" size="mini" style="width: 60px;" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else-if="operationType === 'delete'" style="display: flex;">
|
||||
<div>
|
||||
<el-table :data="tableData" border style="width: 280px;margin-top: 20px;" height="200">
|
||||
<el-table-column prop="date" label="方向" width="60" />
|
||||
<el-table-column prop="name" label="列车号" width="157">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ getTrainCode(scope.row) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="address" label="位置" width="60">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ getSectionPosition(scope.row.sectionCode) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div style="width: 250px;display: flex;justify-content: space-between;margin-top: 20px;margin-left: 10px;align-items: center;height: 25px;">
|
||||
<div>所选列车号：</div>
|
||||
<el-input v-model="nowTrainCode" :disabled="true" style="width: 150px;" size="mini" />
|
||||
</div>
|
||||
</div>
|
||||
<div v-else-if="operationType === 'move'" style="display: flex;justify-content: flex-start;">
|
||||
<div>
|
||||
<el-table :data="tableData" border style="width: 280px;margin-top: 20px;" height="200" @current-change="handleCurrentChange">
|
||||
<el-table-column prop="date" label="方向" width="60" />
|
||||
<el-table-column prop="name" label="列车号" width="157">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ getTrainCode(scope.row) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="address" label="位置" width="60" />
|
||||
</el-table>
|
||||
</div>
|
||||
<div>
|
||||
<div style="margin-top: 20px;display: flex;justify-content: space-between;padding: 5px;align-items: center;">
|
||||
<span>所选列车号：</span>
|
||||
<el-input v-model="nowTrainCode" :disabled="true" size="mini" style="width: 150px;" />
|
||||
</div>
|
||||
<div style="display: flex;justify-content: space-between;padding: 5px;align-items: center;">
|
||||
<span>当前位置：</span>
|
||||
<el-select v-model="nowSectionCode" :disabled="true" size="mini" :popper-append-to-body="false" style="width: 150px">
|
||||
<el-option
|
||||
v-for="item in sectionList"
|
||||
:key="item.code"
|
||||
:label="item.name"
|
||||
:value="item.code"
|
||||
/>
|
||||
</el-select>
|
||||
</div>
|
||||
<div style="display: flex;justify-content: space-between;padding: 5px;align-items: center;">
|
||||
<span>新位置：</span>
|
||||
<el-select v-model="newSectionCode" :popper-append-to-body="false" size="mini" style="width: 150px">
|
||||
<el-option
|
||||
v-for="item in sectionList"
|
||||
:key="item.code"
|
||||
:label="item.name"
|
||||
:value="item.code"
|
||||
/>
|
||||
</el-select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="display: flex;justify-content: flex-end;margin-top: 10px;border-top: 1px solid #c0c0c0;padding-top: 10px;">
|
||||
<el-button v-if="operationType === 'update'" size="mini" :disabled="updateDisable" @click="trainCommit">修改</el-button>
|
||||
<el-button v-if="operationType === 'create'" size="mini" :disabled="createDisable" @click="trainCommit">创建</el-button>
|
||||
<el-button v-if="operationType === 'delete'" size="mini" :disabled="deleteDisable" @click="trainCommit">删除</el-button>
|
||||
<el-button v-if="operationType === 'move'" size="mini" :disabled="moveDisable" @click="trainCommit">步进</el-button>
|
||||
<el-button size="mini" @click="doClose">关闭</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<notice-info ref="noticeInfo" pop-class="haerbin-01__systerm" />
|
||||
</div>
|
||||
<!--</el-dialog>-->
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapGetters } from 'vuex';
|
||||
import { OperationEvent } from '@/scripts/cmdPlugin/OperationHandler';
|
||||
import CMD from '@/scripts/cmdPlugin/CommandEnum';
|
||||
import { MouseEvent } from '@/scripts/ConstDic';
|
||||
import NoticeInfo from '@/jmapNew/theme/components/menus/childDialog/noticeInfo';
|
||||
|
||||
export default {
|
||||
name: 'RouteCreate',
|
||||
components: {
|
||||
NoticeInfo
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogShow: false,
|
||||
loading: false,
|
||||
selected: null,
|
||||
tableData: [],
|
||||
sectionName: '',
|
||||
trainCode: '',
|
||||
operationType: 'create',
|
||||
autoArrange: false,
|
||||
nowSectionCode: '',
|
||||
direction: '',
|
||||
newTrainCode: '',
|
||||
groupNumber1: '',
|
||||
groupNumber2: '',
|
||||
nowTrainCode: '',
|
||||
newSectionCode: '',
|
||||
directionList: [{ label: '>', value: 'right' }, { label: '<', value: 'left' }],
|
||||
trainModel: ''
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapGetters('map', [
|
||||
'stationList',
|
||||
'sectionList'
|
||||
]),
|
||||
show() {
|
||||
return this.dialogShow && !this.$store.state.menuOperation.break;
|
||||
},
|
||||
title() {
|
||||
return '列监';
|
||||
},
|
||||
createDisable() {
|
||||
return !(this.groupNumber1 && this.groupNumber1.length === 4 && this.nowSectionCode && this.newTrainCode && this.newTrainCode.length === 8);
|
||||
},
|
||||
updateDisable() {
|
||||
return !(this.newTrainCode && this.newTrainCode.length === 8);
|
||||
},
|
||||
moveDisable() {
|
||||
return !this.newSectionCode;
|
||||
},
|
||||
deleteDisable() {
|
||||
return !this.nowTrainCode;
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'$store.state.menuOperation.selectedCount':function(em) {
|
||||
const device = this.$store.state.menuOperation.selected;
|
||||
if (device && device.code && device._type === 'Section') {
|
||||
// this.deviceSelect(device);
|
||||
this.nowSectionCode = device.code;
|
||||
} else if (device && device.code && device._type === 'Train' && device._event === MouseEvent.Left) {
|
||||
this.doShow(device);
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
doShow(selected) {
|
||||
this.dialogShow = true;
|
||||
if (selected) {
|
||||
this.selected = selected;
|
||||
this.tableData = [selected];
|
||||
this.nowTrainCode = selected.destinationCode + (selected.serviceNumber.substr(1)) + (selected.tripNumber.substr(selected.tripNumber.length - 2));
|
||||
this.nowSectionCode = selected.sectionCode;
|
||||
this.groupNumber1 = selected.code;
|
||||
this.direction = selected.right ? 'right' : 'left';
|
||||
this.operationType = 'show';
|
||||
}
|
||||
|
||||
this.$nextTick(function () {
|
||||
this.dragEvent();
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
});
|
||||
},
|
||||
handleCurrentChange(val) {
|
||||
const train = this.$store.getters['map/getDeviceByCode'](val.code);
|
||||
this.selected = train;
|
||||
this.nowTrainCode = train.destinationCode + (train.serviceNumber.substr(1)) + (train.tripNumber.substr(train.tripNumber.length - 2));
|
||||
this.nowSectionCode = train.sectionCode;
|
||||
this.groupNumber1 = train.code;
|
||||
this.direction = train.right ? 'right' : 'left';
|
||||
},
|
||||
doClose() {
|
||||
this.loading = false;
|
||||
this.dialogShow = false;
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
},
|
||||
trainFind() {
|
||||
// this.$store.state.map.activeTrainList
|
||||
this.tableData = [];
|
||||
if (this.trainCode) {
|
||||
this.$store.state.map.activeTrainList.forEach(item => {
|
||||
const train = this.$store.getters['map/getDeviceByCode'](item);
|
||||
const temp = train.destinationCode + (train.serviceNumber.substr(1)) + (train.tripNumber.substr(train.tripNumber.length - 2));
|
||||
if (temp.includes(this.trainCode)) {
|
||||
this.tableData.push(train);
|
||||
}
|
||||
});
|
||||
} else {
|
||||
this.$store.state.map.activeTrainList.forEach(item => {
|
||||
const train = this.$store.getters['map/getDeviceByCode'](item);
|
||||
this.tableData.push(train);
|
||||
});
|
||||
}
|
||||
this.operationType = 'show';
|
||||
},
|
||||
resetTrainCode() {
|
||||
this.trainCode = '';
|
||||
this.tableData = [];
|
||||
},
|
||||
changeOperationType(type) {
|
||||
if (type === 'create') {
|
||||
this.changeShowMode();
|
||||
}
|
||||
if (type === 'create' || type === 'update' || type === 'move' || type === 'delete') {
|
||||
this.$store.state.map.activeTrainList.forEach(item => {
|
||||
const train = this.$store.getters['map/getDeviceByCode'](item);
|
||||
this.tableData.push(train);
|
||||
});
|
||||
} else if (type === 'show') {
|
||||
this.trainFind();
|
||||
}
|
||||
this.operationType = type;
|
||||
},
|
||||
trainCommit() {
|
||||
const params = {};
|
||||
const step = {
|
||||
over: true
|
||||
};
|
||||
if (this.operationType === 'update') {
|
||||
params.groupNumber = this.groupNumber1;
|
||||
params.serviceNumber = '0' + this.newTrainCode.slice(4, 6);
|
||||
params.tripNumber = '0' + this.newTrainCode.slice(6, 8);
|
||||
step.cmdType = CMD.TrainWindow.CMD_TRAIN_SET_PLAN;
|
||||
step.operation = OperationEvent.Train.setPlanTrainId.menu.operation;
|
||||
step.param = params;
|
||||
} else if (this.operationType === 'create') {
|
||||
params.sectionCode = this.nowSectionCode;
|
||||
params.groupNumber = this.groupNumber1;
|
||||
params.dn = this.newTrainCode.slice(0, 4);
|
||||
params.sn = '0' + this.newTrainCode.slice(4, 6);
|
||||
params.tn = '0' + this.newTrainCode.slice(6, 8);
|
||||
step.cmdType = CMD.TrainWindow.CMD_TRAIN_ADD_TRAIN_TRACE;
|
||||
step.operation = OperationEvent.Train.addTrainId.menu.operation;
|
||||
step.param = params;
|
||||
} else if (this.operationType === 'delete') {
|
||||
params.groupNumber = this.groupNumber1;
|
||||
step.cmdType = CMD.TrainWindow.CMD_TRAIN_REMOVE_TRAIN_TRACE;
|
||||
step.operation = OperationEvent.Train.delTrainId.menu.operation;
|
||||
step.param = params;
|
||||
} else if (this.operationType === 'move') {
|
||||
params.groupNumber = this.groupNumber1;
|
||||
params.sectionCode = this.newSectionCode;
|
||||
step.cmdType = CMD.TrainWindow.CMD_TRAIN_MOVE_TRAIN_TRACE;
|
||||
step.operation = OperationEvent.Train.moveTrainId.menu.operation;
|
||||
step.param = params;
|
||||
}
|
||||
this.$store.dispatch('trainingNew/next', step).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
|
||||
this.changeShowMode();
|
||||
}
|
||||
}).catch((error) => {
|
||||
this.changeShowMode();
|
||||
console.error(error);
|
||||
this.$refs.noticeInfo.doShow(error.message);
|
||||
});
|
||||
},
|
||||
changeShowMode() {
|
||||
this.operationType = 'show';
|
||||
this.nowSectionCode = '';
|
||||
this.newSectionCode = '';
|
||||
this.newTrainCode = '';
|
||||
this.direction = '';
|
||||
this.groupNumber1 = '';
|
||||
this.tableData = [];
|
||||
},
|
||||
cancel() {
|
||||
const operate = {
|
||||
operation: OperationEvent.Command.cancel.menu.operation
|
||||
};
|
||||
this.$store.dispatch('trainingNew/next', operate).then(({ valid }) => {
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
}
|
||||
}).catch(() => {
|
||||
this.doClose();
|
||||
});
|
||||
},
|
||||
getTrainCode(train) {
|
||||
if (train) {
|
||||
return train.destinationCode + (train.serviceNumber.substr(1)) + (train.tripNumber.substr(train.tripNumber.length - 2));
|
||||
}
|
||||
},
|
||||
getSectionPosition(sectionCode) {
|
||||
const section = this.$store.getters['map/getDeviceByCode'](sectionCode);
|
||||
if (section.type === '02') {
|
||||
const parentSection = this.$store.getters['map/getDeviceByCode'](section.parentCode);
|
||||
return parentSection.name + '-' + section.name;
|
||||
} else {
|
||||
return section.name;
|
||||
}
|
||||
},
|
||||
dragEvent() {
|
||||
const offset = this.offset;
|
||||
const dialogHeaderEl = document.querySelector('.falutChooseTitle');
|
||||
const dragDom = document.querySelector('#faultChoose');
|
||||
dialogHeaderEl.style.cursor = 'move';
|
||||
|
||||
/** 获取原有属性 ie dom元素.currentStyle 火狐谷歌 window.getComputedStyle(dom元素, null);*/
|
||||
const sty = dragDom.currentStyle || window.getComputedStyle(dragDom, null);
|
||||
|
||||
dialogHeaderEl.onmousedown = (e) => {
|
||||
/** 鼠标按下，计算当前元素距离可视区的距离*/
|
||||
const disX = e.clientX - dialogHeaderEl.offsetLeft;
|
||||
const disY = e.clientY - dialogHeaderEl.offsetTop;
|
||||
|
||||
/** 获取到的值带px 正则匹配替换*/
|
||||
let styL, styT;
|
||||
|
||||
/** 注意在ie中 第一次获取到的值为组件自带50% 移动之后赋值为px*/
|
||||
if (sty.left.includes('%')) {
|
||||
// eslint-disable-next-line no-useless-escape
|
||||
styL = +document.body.clientWidth * (+sty.left.replace(/\%/g, '') / 100);
|
||||
styT = +document.body.clientHeight * (+sty.top.replace(/\%/g, '') / 100);
|
||||
} else {
|
||||
// eslint-disable-next-line no-useless-escape
|
||||
styL = +sty.left.replace(/\px/g, '');
|
||||
// eslint-disable-next-line no-useless-escape
|
||||
styT = +sty.top.replace(/\px/g, '');
|
||||
}
|
||||
|
||||
document.onmousemove = function (e) {
|
||||
/** 通过事件委托，计算移动的距离*/
|
||||
const l = e.clientX - disX;
|
||||
const t = e.clientY - disY;
|
||||
|
||||
/** 移动当前元素*/
|
||||
// dragDom.style.left = `${l + styL}px`;
|
||||
// dragDom.style.top = `${t + styT}px`;
|
||||
|
||||
/** 移动当前元素*/
|
||||
if (l + styL < 0) {
|
||||
dragDom.style.left = `0px`;
|
||||
} else if (l + styL > document.body.clientWidth - dragDom.clientWidth - 10) {
|
||||
dragDom.style.left = `${document.body.clientWidth - dragDom.clientWidth - 10}px`;
|
||||
} else {
|
||||
dragDom.style.left = `${l + styL}px`;
|
||||
}
|
||||
if (t + styT <= offset) {
|
||||
dragDom.style.top = offset + `px`;
|
||||
} else if (t + styT > document.body.clientHeight - dragDom.clientHeight - 10) {
|
||||
dragDom.style.top = `${document.body.clientHeight - dragDom.clientHeight - 10}px`;
|
||||
} else {
|
||||
dragDom.style.top = `${t + styT}px`;
|
||||
}
|
||||
|
||||
/** 将此时的位置传出去*/
|
||||
// binding.value({ x: e.pageX, y: e.pageY });
|
||||
};
|
||||
|
||||
document.onmouseup = function () {
|
||||
document.onmousemove = null;
|
||||
document.onmouseup = null;
|
||||
};
|
||||
};
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
#faultChoose .card .queryList .el-card .el-card__body .el-table--border .el-table__body-wrapper{
|
||||
height: 135px !important;
|
||||
overflow-y: auto !important;
|
||||
}
|
||||
#faultChoose .el-button--mini {
|
||||
margin-left: 5px;
|
||||
}
|
||||
.triggerFaultListLeft{
|
||||
display: inline-block;
|
||||
float: left;
|
||||
width: 730px;
|
||||
}
|
||||
// 谷歌、safari、qq浏览器、360浏览器滚动条样式
|
||||
// 定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸
|
||||
#faultChoose .el-table__body-wrapper::-webkit-scrollbar {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
// height: 110px;
|
||||
background-color: #FFFFFF;
|
||||
}
|
||||
/*定义滚动条轨道 内阴影+圆角*/
|
||||
#faultChoose .el-table__body-wrapper::-webkit-scrollbar-track {
|
||||
// box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
|
||||
border-radius: 10px;
|
||||
background-color: #FFFFFF;;
|
||||
}
|
||||
/*定义滑块 内阴影+圆角*/
|
||||
#faultChoose .el-table__body-wrapper::-webkit-scrollbar-thumb {
|
||||
border-radius: 10px;
|
||||
// box-shadow: inset 0 0 6px rgba(0,0,0,.3);
|
||||
background-color: #eaeaea;
|
||||
}
|
||||
/*滑块效果*/
|
||||
#faultChoose .el-table__body-wrapper::-webkit-scrollbar-thumb:hover {
|
||||
border-radius: 5px;
|
||||
// box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
|
||||
background: rgba(0,0,0,0.4);
|
||||
}
|
||||
/*IE滚动条颜色*/
|
||||
html {
|
||||
scrollbar-face-color:#bfbfbf;/*滚动条颜色*/
|
||||
scrollbar-highlight-color:#000;
|
||||
scrollbar-3dlight-color:#000;
|
||||
scrollbar-darkshadow-color:#000;
|
||||
scrollbar-Shadow-color:#adadad;/*滑块边色*/
|
||||
scrollbar-arrow-color:rgba(0,0,0,0.4);/*箭头颜色*/
|
||||
scrollbar-track-color:#eeeeee;/*背景颜色*/
|
||||
}
|
||||
</style>
|
||||
<style rel="stylesheet/scss" lang="scss" scoped>
|
||||
.triggerFaultInfo{
|
||||
margin-bottom:10px;
|
||||
padding: 10px 0px 10px 15px;
|
||||
}
|
||||
.triggerFaultList{
|
||||
font-size: 14px;
|
||||
margin-top: 10px;
|
||||
line-height: 20px;
|
||||
}
|
||||
.triggerFaultTitle{
|
||||
font-size: 15px;
|
||||
font-weight: bold;
|
||||
}
|
||||
.falutChooseTitle{
|
||||
cursor: all-scroll;
|
||||
background-color: #c0c0c0;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
color: #000;
|
||||
padding-left: 10px;
|
||||
border-radius: 6px 6px 0 0;
|
||||
}
|
||||
#faultChoose{
|
||||
width: 1000px;
|
||||
position: absolute;
|
||||
left: 30%;
|
||||
top: 20%;
|
||||
padding:0px 0px 15px 0px;
|
||||
// transform: translate3d(-50%,-50%,0);
|
||||
border-radius: 6px;
|
||||
z-index:2009;
|
||||
background-color: #E2E2E2;
|
||||
}
|
||||
.faultChooseFoot{
|
||||
display: inline-block;
|
||||
float: right;
|
||||
margin-right: 20px;
|
||||
margin-top: 20px;
|
||||
}
|
||||
.closeFalutChoose{
|
||||
position: absolute;
|
||||
right: 0px;
|
||||
top: 0px;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
cursor: pointer;
|
||||
line-height: 30px;
|
||||
}
|
||||
.closeFalutChooseIn{
|
||||
font-size: 20px;
|
||||
margin-left: 5px;
|
||||
background-color: #f00;
|
||||
color: #FFF;
|
||||
border: 1px solid #fff;
|
||||
border-radius: 5px;
|
||||
}
|
||||
/deep/ .el-table th{
|
||||
background-color: #E2E2E2;
|
||||
padding: 0;
|
||||
}
|
||||
/deep/.el-table td{
|
||||
padding: 0;
|
||||
}
|
||||
</style>
|
||||
@ -1,165 +0,0 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
class="haerbin-01__systerm"
|
||||
:modal="false"
|
||||
:title="title"
|
||||
:visible.sync="show"
|
||||
:fullscreen="true"
|
||||
:before-close="doClose"
|
||||
:z-index="2000"
|
||||
>
|
||||
<div class="trainOverView">
|
||||
<div v-if="trainViewList.length>0" class="trainViewList">
|
||||
<div v-for="(eachTrainView,index) in trainViewList" :key="index" class="eachTrainView">
|
||||
<div class="eachTrainViewIn">
|
||||
<div class="eachTrainViewInRhom" />
|
||||
<div class="eachTrainTrunkS">{{ 'W'+eachTrainView+'0' }}</div>
|
||||
<div class="eachTrainTrunkD" @click="toTrainTrunkDetail(index)">
|
||||
<img :src="trainTrunkDown" class="trainTrunkDown">
|
||||
</div>
|
||||
<div class="eachTrainTrunkE">{{ 'W'+eachTrainView+'6' }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--<train-trunk-detail ref="trainTrunkDetail" :train-view-list="trainViewList" />-->
|
||||
</el-dialog>
|
||||
</template>
|
||||
<script>
|
||||
import trainTrunkDown from '@/assets/baSiDi/up.png';
|
||||
// import TrainTrunkDetail from '../../../jmapNew/theme/nanjing_02/menus/dialog/trainTrunkDetail.vue';
|
||||
export default {
|
||||
name:'Tra',
|
||||
components:{
|
||||
// TrainTrunkDetail
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogShow: false,
|
||||
trainViewList:[],
|
||||
trainTrunkDown:trainTrunkDown
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
show() {
|
||||
return this.dialogShow && !this.$store.state.menuOperation.break;
|
||||
},
|
||||
title() {
|
||||
return '列车总览';
|
||||
}
|
||||
},
|
||||
watch:{
|
||||
'$store.state.map.activeTrainListChange': function (val) {
|
||||
if (val) {
|
||||
this.activeTrainList = this.$store.state.map.activeTrainList;
|
||||
}
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
doShow() {
|
||||
this.dialogShow = true;
|
||||
this.$nextTick(function () {
|
||||
this.trainViewList = this.$store.state.map.activeTrainList;
|
||||
});
|
||||
},
|
||||
doClose() {
|
||||
this.dialogShow = false;
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
},
|
||||
toTrainTrunkDetail(index) {
|
||||
// this.$refs.trainTrunkDetail.doShow(index);
|
||||
this.$emit('openTrainTrunkDetail', index);
|
||||
this.doClose();
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style scoped>
|
||||
/deep/ .el-dialog {
|
||||
background: rgba(100, 100, 100, 1) !important;
|
||||
position: relative;
|
||||
border: 2px solid rgba(144, 144, 144, 0.8);
|
||||
border-radius: 6px;
|
||||
font-size: 14px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
/deep/ .el-dialog .el-dialog__body{
|
||||
background: rgba(100, 100, 100, 1) !important;
|
||||
border: 0 !important;
|
||||
height: 100%;
|
||||
flex: 1;
|
||||
}
|
||||
.trainOverView{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: #000;
|
||||
display: inline-block;
|
||||
}
|
||||
.trainViewList{
|
||||
width: 1226px;
|
||||
border-left: 1px #f0f0f0 solid;
|
||||
border-top: 1px #f0f0f0 solid;
|
||||
margin-top: 30px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
.eachTrainView{
|
||||
width: 245px;
|
||||
display: inline-block;
|
||||
padding: 10px 10px;
|
||||
border-bottom: 1px #f0f0f0 solid;
|
||||
border-right: 1px #f0f0f0 solid;
|
||||
}
|
||||
.eachTrainViewIn{
|
||||
height: 60px;
|
||||
border-bottom: 1px #484848 solid;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
.eachTrainViewInRhom{
|
||||
width: 224px;
|
||||
height: 60px;
|
||||
border-left: 1px #828282 solid;
|
||||
transform: skew(-30deg, 0deg);
|
||||
-webkit-transform-origin: bottom center;
|
||||
transform-origin: bottom center;
|
||||
border-bottom: 1px #828282 solid;
|
||||
overflow: hidden;
|
||||
}
|
||||
.eachTrainViewInRhom:before{
|
||||
content: '';
|
||||
transform: skew(50deg, 0deg);
|
||||
transform-origin: bottom center;
|
||||
position:absolute;
|
||||
width:100%;
|
||||
height: 100%;
|
||||
border-top: 1px #828282 solid;
|
||||
border-right: 1px #828282 solid;
|
||||
}
|
||||
.eachTrainTrunkS{
|
||||
position: absolute;
|
||||
font-size: 18px;
|
||||
color: #5E5E5E;
|
||||
left: 30px;
|
||||
top: 20px;
|
||||
}
|
||||
.eachTrainTrunkD{
|
||||
position: absolute;
|
||||
left: 99px;
|
||||
top: 16px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.trainTrunkDown{
|
||||
width: 25px;
|
||||
transform-origin: center center;
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
.eachTrainTrunkE{
|
||||
position: absolute;
|
||||
font-size: 18px;
|
||||
color: #5E5E5E;
|
||||
right: 30px;
|
||||
top: 20px;
|
||||
}
|
||||
</style>
|
||||
@ -1,351 +0,0 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
class="haerbin-01__systerm"
|
||||
:width="'1000px'"
|
||||
:modal="false"
|
||||
:close-on-click-modal="false"
|
||||
:title="title"
|
||||
:visible.sync="show"
|
||||
:before-close="doClose"
|
||||
>
|
||||
<!-- :fullscreen="true" -->
|
||||
<div class="trainTrunkView">
|
||||
<div class="trainTrunkViewT">
|
||||
<img :src="trainTrunkUp" class="trainTrunkUp" @click="backTra">
|
||||
<div class="trainTrunkTtext">
|
||||
<div class="trainTrunkTtextIn">OBCU</div>
|
||||
<div class="trainTrunkTtextIn">Overview</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="trainTrunkViewM">
|
||||
<div class="trainTrunkViewMT">
|
||||
<div class="eachTrunkViewInRhom" />
|
||||
<div class="trainTrunkViewMTL">
|
||||
<div class="trainTrunkViewMTL1">
|
||||
<div class="trainTrunkViewMTLEach">ATP</div>
|
||||
<div class="trainTrunkViewMTLEach">ATO</div>
|
||||
</div>
|
||||
<div class="trainTrunkViewMTL2">
|
||||
<div class="trainTrunkViewMTL2L" />
|
||||
<div class="trainTrunkViewMTL2R">
|
||||
<div class="trainTrunkViewLine">
|
||||
<div class="trainTrunkViewDot" style="top: -3px;left: -3px;" />
|
||||
<div class="trainTrunkViewDot" style="top: -3px;left: 103px;" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="trainTrunkViewMTL3">
|
||||
<div class="trainTrunkViewMTLEach">ITF</div>
|
||||
<div class="trainTrunkViewMTLEach">HMI</div>
|
||||
<div class="trainTrunkViewMTLEach">TMS</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="trainTrunkViewMTR">
|
||||
<div class="trainTrunkViewMTR1">
|
||||
<div class="trainTrunkViewMTLEach">ATO</div>
|
||||
<div class="trainTrunkViewMTLEach">ATP</div>
|
||||
</div>
|
||||
<div class="trainTrunkViewMTR2">
|
||||
<div class="trainTrunkViewMTR2L">
|
||||
<div class="trainTrunkViewLine">
|
||||
<div class="trainTrunkViewDot" style="top: -3px;left: -3px;" />
|
||||
<div class="trainTrunkViewDot" style="top: -3px;left: 103px;" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="trainTrunkViewMTR2R" />
|
||||
</div>
|
||||
<div class="trainTrunkViewMTR3">
|
||||
<div class="trainTrunkViewMTLEach">TMS</div>
|
||||
<div class="trainTrunkViewMTLEach">HMI</div>
|
||||
<div class="trainTrunkViewMTLEach">ITF</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="trainTrunkViewMB">
|
||||
<div class="trainTrunkViewMBL">{{ 'W'+trainCode+'0' }}</div>
|
||||
<div class="trainTrunkViewMBR">{{ 'W'+trainCode+'6' }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="trainTrunkViewB">
|
||||
<div v-if="prev" class="trainTrunkViewBL">
|
||||
<img :src="trainTrunkUp" class="trainTrunkLeft" @click="doPrev">
|
||||
<div class="trainTrunkViewBLIn">
|
||||
<div class="trainTrunkViewBLInRhom" />
|
||||
<div class="trainTrunkViewBLInL">{{ 'W'+prev+'0' }}</div>
|
||||
<div class="trainTrunkViewBLInR">{{ 'W'+prev+'6' }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="next" class="trainTrunkViewBB">
|
||||
<div class="trainTrunkViewBRIn">
|
||||
<div class="trainTrunkViewBLInRhom" />
|
||||
<div class="trainTrunkViewBLInL">{{ 'W'+next+'0' }}</div>
|
||||
<div class="trainTrunkViewBLInR">{{ 'W'+next+'6' }}</div>
|
||||
</div>
|
||||
<img :src="trainTrunkUp" class="trainTrunkRight" @click="doNext">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
<script>
|
||||
import trainTrunkUp from '@/assets/baSiDi/up.png';
|
||||
export default {
|
||||
name:'TrainTrunkDetail',
|
||||
props:{
|
||||
// trainViewList:{
|
||||
// type:Array,
|
||||
// required:true
|
||||
// }
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogShow: false,
|
||||
trainCode:'',
|
||||
prev:'',
|
||||
next:'',
|
||||
index:0,
|
||||
trainTrunkUp:trainTrunkUp
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
show() {
|
||||
return this.dialogShow && !this.$store.state.menuOperation.break;
|
||||
},
|
||||
title() {
|
||||
return '列车详览';
|
||||
},
|
||||
trainViewList() {
|
||||
return this.$store.state.map.activeTrainList;
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
doShow(index) {
|
||||
this.index = index;
|
||||
this.dialogShow = true;
|
||||
this.init();
|
||||
},
|
||||
init() {
|
||||
this.trainCode = this.trainViewList[this.index];
|
||||
this.prev = '';
|
||||
if (this.index > 0) {
|
||||
this.prev = this.trainViewList[this.index - 1];
|
||||
}
|
||||
this.next = '';
|
||||
if ((this.index + 1) < this.trainViewList.length) {
|
||||
this.next = this.trainViewList[this.index + 1];
|
||||
}
|
||||
},
|
||||
doClose() {
|
||||
this.dialogShow = false;
|
||||
this.$store.dispatch('training/emitTipFresh');
|
||||
},
|
||||
backTra() {
|
||||
this.$emit('openTra');
|
||||
this.doClose();
|
||||
},
|
||||
doPrev() {
|
||||
this.index--;
|
||||
this.init();
|
||||
},
|
||||
doNext() {
|
||||
this.index++;
|
||||
this.init();
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.trainTrunkView{
|
||||
width: 100%;
|
||||
background: #000;
|
||||
display: inline-block;
|
||||
padding: 20px 30px;
|
||||
}
|
||||
.trainTrunkUp{
|
||||
width: 60px;
|
||||
margin-left: 433px;
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
}
|
||||
.trainTrunkTtext{
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
margin-left: 0px;
|
||||
color: #fff;
|
||||
font-size: 26px;
|
||||
}
|
||||
.trainTrunkTtextIn{margin-bottom:5px;letter-spacing: 2px;}
|
||||
.trainTrunkViewMT{
|
||||
width: 800px;
|
||||
height: 210px;
|
||||
margin-left: 58px;
|
||||
margin-top: 25px;
|
||||
position: relative;
|
||||
}
|
||||
.eachTrunkViewInRhom{
|
||||
width: 800px;
|
||||
height: 210px;
|
||||
border-left: 1px #828282 solid;
|
||||
transform: skew(-30deg, 0deg);
|
||||
-webkit-transform-origin: bottom center;
|
||||
transform-origin: bottom center;
|
||||
border-bottom: 1px #828282 solid;
|
||||
overflow: hidden;
|
||||
}
|
||||
.eachTrunkViewInRhom:before{
|
||||
content: '';
|
||||
transform: skew(50deg, 0deg);
|
||||
transform-origin: bottom center;
|
||||
position:absolute;
|
||||
width:100%;
|
||||
height: 100%;
|
||||
border-top: 1px #828282 solid;
|
||||
border-right: 1px #828282 solid;
|
||||
}
|
||||
.trainTrunkViewMTL{
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 400px;
|
||||
height: 100%;
|
||||
border-right: 1px #fff dashed;
|
||||
font-size:0;
|
||||
}
|
||||
.trainTrunkViewMTR{
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
width: 400px;
|
||||
height: 100%;
|
||||
font-size: 0;
|
||||
}
|
||||
.trainTrunkViewMTL1{margin-left: 177px;margin-top: 28px;font-size: 0;}
|
||||
.trainTrunkViewMTR1{margin-left: 34px;margin-top: 28px;font-size: 0;}
|
||||
.trainTrunkViewMTL2{height: 59px;margin-left:100px;display: inline-block;}
|
||||
.trainTrunkViewMTL2L{
|
||||
width: 117px;
|
||||
border-left: 1px #fff solid;
|
||||
height: 34px;
|
||||
margin-top: 25px;
|
||||
border-top: 1px #fff solid;
|
||||
display: inline-block;
|
||||
}
|
||||
.trainTrunkViewMTR2R{width: 106px;border-top: 1px #fff solid;display: inline-block;margin-top: 25px;border-right: 1px #fff solid;height: 34px;}
|
||||
.trainTrunkViewMTR2{height: 59px;margin-left:75px;display: inline-block;}
|
||||
.trainTrunkViewMTR2L{
|
||||
width: 108px;
|
||||
height: 59px;
|
||||
border-left: 1px #fff solid;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
border-right: 1px #fff solid;
|
||||
}
|
||||
.trainTrunkViewMTL2R{
|
||||
width: 108px;
|
||||
height: 59px;
|
||||
border-left: 1px #fff solid;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
border-right: 1px #fff solid;
|
||||
}
|
||||
.trainTrunkViewMTL3{margin-left: 65px;font-size: 0;}
|
||||
.trainTrunkViewMTR3{margin-left: 34px;font-size: 0;}
|
||||
.trainTrunkViewMTLEach{
|
||||
padding: 10px 0px;
|
||||
width:80px;
|
||||
text-align:center;
|
||||
font-size: 24px;
|
||||
color: #5F5F5F;
|
||||
border: 1px #5F5F5F solid;
|
||||
display: inline-block;
|
||||
letter-spacing: 4px;
|
||||
margin-right: 30px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.trainTrunkViewDot{
|
||||
position:absolute;
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-radius: 5px;
|
||||
background: #fff;
|
||||
}
|
||||
.trainTrunkViewLine{
|
||||
width: 107px;
|
||||
height: 33px;
|
||||
border-top: 1px #fff solid;
|
||||
margin-top: 25px;
|
||||
position: relative;
|
||||
}
|
||||
.trainTrunkViewMB{padding: 20px 123px;}
|
||||
.trainTrunkViewMBL{font-size: 40px;color: #fff;display:inline-block;margin-left: 75px;letter-spacing: 5px;}
|
||||
.trainTrunkViewMBR{font-size: 40px;color: #fff;display:inline-block;float:right;margin-right:75px;letter-spacing: 5px;}
|
||||
.trainTrunkViewBL{display: inline-block;}
|
||||
.trainTrunkLeft{
|
||||
width: 60px;
|
||||
transform-origin: center center;
|
||||
transform: rotate(-90deg);
|
||||
cursor: pointer;
|
||||
}
|
||||
.trainTrunkViewB{margin-top: 20px;}
|
||||
.trainTrunkViewBB{display: inline-block;float: right;}
|
||||
.trainTrunkRight{
|
||||
width: 60px;
|
||||
transform-origin: center center;
|
||||
transform: rotate(90deg);
|
||||
cursor: pointer;
|
||||
}
|
||||
.trainTrunkViewBLIn,.trainTrunkViewBRIn{
|
||||
width: 220px;
|
||||
height: 50px;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
position: relative;
|
||||
}
|
||||
.trainTrunkViewBLIn{margin-left: 20px;}
|
||||
.trainTrunkViewBRIn{margin-right: 20px;}
|
||||
.trainTrunkViewBLInRhom{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-left: 1px #828282 solid;
|
||||
transform: skew(-30deg, 0deg);
|
||||
-webkit-transform-origin: bottom center;
|
||||
transform-origin: bottom center;
|
||||
border-bottom: 1px #828282 solid;
|
||||
overflow: hidden;
|
||||
}
|
||||
.trainTrunkViewBLInRhom:before{
|
||||
content: '';
|
||||
transform: skew(50deg, 0deg);
|
||||
transform-origin: bottom center;
|
||||
position:absolute;
|
||||
width:100%;
|
||||
height: 100%;
|
||||
border-top: 1px #828282 solid;
|
||||
border-right: 1px #828282 solid;
|
||||
}
|
||||
.trainTrunkViewBLInL{
|
||||
position: absolute;
|
||||
width: 110px;
|
||||
height: 100%;
|
||||
left: 0;
|
||||
top: 0;
|
||||
border-right: 1px #fff dashed;
|
||||
font-size: 20px;
|
||||
color: #fff;
|
||||
padding-top: 16px;
|
||||
letter-spacing: 2px;
|
||||
padding-left:27px;
|
||||
}
|
||||
.trainTrunkViewBLInR{
|
||||
position: absolute;
|
||||
width: 110px;
|
||||
height: 100%;
|
||||
right: 0;
|
||||
top: 0;
|
||||
font-size: 20px;
|
||||
color: #fff;
|
||||
padding-top: 16px;
|
||||
letter-spacing: 2px;
|
||||
padding-left: 10px;
|
||||
}
|
||||
</style>
|
||||
@ -1,181 +0,0 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
:modal="false"
|
||||
:title="title"
|
||||
:visible.sync="show"
|
||||
:fullscreen="true"
|
||||
:before-close="doClose"
|
||||
:z-index="2003"
|
||||
>
|
||||
<div>
|
||||
<map-system-draft ref="mapCanvas" :no-menu="true" @back="back" />
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import MapSystemDraft from '@/views/newMap/mapsystemNew/common/index';
|
||||
import { mapGetters } from 'vuex';
|
||||
import ButtonDbupIcon from '@/assets/baSiDi/dbup.png';
|
||||
import ButtonRightIcon from '@/assets/baSiDi/right.png';
|
||||
import ButtonLeftIcon from '@/assets/baSiDi/left.png';
|
||||
import Vue from 'vue';
|
||||
|
||||
export default {
|
||||
name: 'TRO',
|
||||
components: {
|
||||
MapSystemDraft
|
||||
},
|
||||
props: {
|
||||
stationList: {
|
||||
type: Array,
|
||||
required: true
|
||||
},
|
||||
trainList: {
|
||||
type: Array,
|
||||
required: true
|
||||
},
|
||||
isRunPlan: {
|
||||
type: Boolean,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogShow: false,
|
||||
mapData: null,
|
||||
deviceCode: '',
|
||||
selfJmap: null,
|
||||
buttonDbup: ButtonDbupIcon,
|
||||
buttonRight: ButtonRightIcon,
|
||||
buttonLeft: ButtonLeftIcon
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
show() {
|
||||
return this.dialogShow && !this.$store.state.menuOperation.break;
|
||||
},
|
||||
title() {
|
||||
return '轨道总览';
|
||||
},
|
||||
width() {
|
||||
return this.$store.state.app.width - 5;
|
||||
},
|
||||
height() {
|
||||
return this.$store.state.app.height - 50;
|
||||
},
|
||||
...mapGetters('map', [
|
||||
'bigScreenConfig'
|
||||
])
|
||||
},
|
||||
watch: {
|
||||
'$store.state.map.mapViewLoadedCount': function (val) { // 地图视图加载完成标识 开始加载默认状态
|
||||
if (this.dialogShow) {
|
||||
this.showTroMode();
|
||||
this.$refs.mapCanvas && this.$refs.mapCanvas.mapViewLoaded(false);
|
||||
}
|
||||
},
|
||||
'$store.state.app.windowSizeCount': function() { // 窗口缩放
|
||||
this.$store.dispatch('config/resize', { width:this.width, height: this.height });
|
||||
}
|
||||
},
|
||||
beforeDestroy() {
|
||||
if (this.selfJmap && this.selfJmap._disposeFlag) {
|
||||
this.destroy();
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
doShow() {
|
||||
this.dialogShow = true;
|
||||
if (this.selfJmap) { Vue.prototype.$jlmap = this.selfJmap; }
|
||||
this.$store.dispatch('config/resize', { width:this.width, height: this.height });
|
||||
this.$nextTick(function() {
|
||||
this.$refs.mapCanvas.setMap(this.$store.state.map.map);
|
||||
const mapDevice = this.$store.state.map.mapDevice;
|
||||
const list = [];
|
||||
for (const key in mapDevice) {
|
||||
list.push(mapDevice[key]);
|
||||
}
|
||||
this.$jlmap.updateShowMode(list, '05');
|
||||
this.$store.dispatch('training/updateMapState', list);
|
||||
!this.isRunPlan && this.$jlmap.clearTrainView();
|
||||
});
|
||||
},
|
||||
destroy() {
|
||||
this.selfJmap.dispose();
|
||||
},
|
||||
showTroMode() {
|
||||
const mapDevice = this.$store.state.map.mapDevice;
|
||||
const list = [];
|
||||
for (const key in mapDevice) {
|
||||
list.push(mapDevice[key]);
|
||||
}
|
||||
this.handleUpdateScreen();
|
||||
this.$jlmap.updateShowMode(list, '05'); // 二次过滤
|
||||
},
|
||||
handleUpdateScreen() {
|
||||
this.maskOpen = false;
|
||||
if (this.bigScreenConfig.bigScreenSplitConfig && this.bigScreenConfig.bigScreenSplitConfig.length) {
|
||||
const offsetList = this.bigScreenConfig.offsetList;
|
||||
const width = this.bigScreenConfig.width;
|
||||
const height = this.bigScreenConfig.height;
|
||||
const size = {
|
||||
width: (this.$store.state.app.width - 2) * width,
|
||||
height: this.$store.state.app.height * height,
|
||||
list: this.bigScreenConfig.bigScreenSplitConfig.map(ele => ele.position),
|
||||
offsetList: offsetList
|
||||
};
|
||||
this.$jlmap.setUpdateScreen(size);
|
||||
} else {
|
||||
this.maskOpen = true;
|
||||
}
|
||||
},
|
||||
back() {},
|
||||
doClose() {
|
||||
this.loading = false;
|
||||
this.dialogShow = false;
|
||||
this.$jlmap && this.$jlmap.clearTrainView();
|
||||
this.selfJmap = Vue.prototype.$jlmap;
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style scoped>
|
||||
/deep/ .el-dialog {
|
||||
background: rgba(100, 100, 100, 1);
|
||||
position: relative;
|
||||
border: 2px solid rgba(144, 144, 144, 0.8);
|
||||
border-radius: 6px;
|
||||
font-size: 14px;
|
||||
}
|
||||
/deep/ .el-dialog .el-dialog__body{
|
||||
background: rgba(100, 100, 100, 1);
|
||||
border: 0;
|
||||
padding: 0;
|
||||
}
|
||||
/deep/ .el-dialog .el-dialog__header {
|
||||
padding: 5px;
|
||||
height: 30px;
|
||||
}
|
||||
/deep/ .el-dialog .el-dialog__title {
|
||||
color: #fff;
|
||||
}
|
||||
/deep/ .el-dialog .el-dialog__headerbtn {
|
||||
background: linear-gradient(#CD98A0, #C27D6E, #B63022, #C68770);
|
||||
border: 1px solid #fff;
|
||||
border-radius: 4px;
|
||||
top: 4px;
|
||||
right: 5px;
|
||||
line-height: 16px;
|
||||
}
|
||||
/deep/ .el-dialog__headerbtn .el-dialog__close{
|
||||
color: #fff;
|
||||
}
|
||||
.arrow-button{
|
||||
width: 45px;
|
||||
height: 30px;
|
||||
cursor: pointer;
|
||||
background-size: 45px 30px;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
</style>
|
||||
@ -1,208 +0,0 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
:modal="false"
|
||||
:title="title"
|
||||
:visible.sync="show"
|
||||
:fullscreen="true"
|
||||
:before-close="doClose"
|
||||
:z-index="2000"
|
||||
>
|
||||
<div style="text-align: center;">
|
||||
<map-system-draft ref="mapCanvas" />
|
||||
<el-button size="small" class="fault-button" :type="faultMode ? '':'primary' " @click="changeOperateMode()">{{ faultMode?'切换到普通模式':'切换到故障模式' }}</el-button>
|
||||
<div class="button-box" style="">
|
||||
<div class="arrow-button" :style="{backgroundImage: 'url(' + buttonLeft + ')' }" @click="changeStation(-1)" />
|
||||
<div class="arrow-button" :style="{backgroundImage: 'url(' + buttonDbup + ')' }" @click="goTroDialog" />
|
||||
<div class="arrow-button" :style="{backgroundImage: 'url(' + buttonRight + ')' }" @click="changeStation(1)" />
|
||||
</div>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import MapSystemDraft from '@/views/newMap/mapsystemNew/common/index';
|
||||
import ButtonDbupIcon from '@/assets/baSiDi/dbup.png';
|
||||
import ButtonRightIcon from '@/assets/baSiDi/right.png';
|
||||
import ButtonLeftIcon from '@/assets/baSiDi/left.png';
|
||||
import { OperateMode } from '@/scripts/ConstDic';
|
||||
import Vue from 'vue';
|
||||
|
||||
export default {
|
||||
name: 'TRO',
|
||||
components: {
|
||||
MapSystemDraft
|
||||
},
|
||||
props: {
|
||||
stationList: {
|
||||
type: Array,
|
||||
required: true
|
||||
},
|
||||
trainList: {
|
||||
type: Array,
|
||||
required: true
|
||||
},
|
||||
isRunPlan: {
|
||||
type: Boolean,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogShow: false,
|
||||
mapData: null,
|
||||
deviceCode: '',
|
||||
buttonDbup: ButtonDbupIcon,
|
||||
buttonRight: ButtonRightIcon,
|
||||
buttonLeft: ButtonLeftIcon,
|
||||
selfJmap: null,
|
||||
faultMode: false
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
show() {
|
||||
return this.dialogShow && !this.$store.state.menuOperation.break;
|
||||
},
|
||||
title() {
|
||||
return '轨道详览';
|
||||
},
|
||||
width() {
|
||||
return this.$store.state.app.width - 10;
|
||||
},
|
||||
height() {
|
||||
return this.$store.state.app.height - 40;
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'$store.state.map.mapViewLoadedCount': function (val) { // 地图视图加载完成标识 开始加载默认状态
|
||||
if (this.dialogShow) {
|
||||
const list = [];
|
||||
const mapDevice = this.$store.state.map.mapDevice;
|
||||
for (const key in mapDevice) {
|
||||
list.push(mapDevice[key]);
|
||||
}
|
||||
Vue.prototype.$jlmap.updateShowMode(list, '02');
|
||||
this.$refs.mapCanvas && this.$refs.mapCanvas.setCenter(this.deviceCode);
|
||||
this.$refs.mapCanvas && this.$refs.mapCanvas.mapViewLoaded(false);
|
||||
}
|
||||
},
|
||||
'$store.state.app.windowSizeCount': function() { // 窗口缩放
|
||||
this.$store.dispatch('config/resize', { width:this.width, height: this.height });
|
||||
}
|
||||
},
|
||||
beforeDestroy() {
|
||||
if (this.selfJmap && !this.selfJmap._disposeFlag) {
|
||||
this.destroy();
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
doShow(deviceCode) {
|
||||
this.dialogShow = true;
|
||||
if (this.selfJmap) { Vue.prototype.$jlmap = this.selfJmap; }
|
||||
this.$store.dispatch('config/resize', { width:this.width, height: this.height });
|
||||
this.deviceCode = deviceCode;
|
||||
this.$nextTick(function() {
|
||||
this.$refs.mapCanvas.setMap(this.$store.state.map.map);
|
||||
this.$jlmap.off('pan');
|
||||
this.faultMode = this.$store.state.training.operatemode === OperateMode.FAULT;
|
||||
const mapDevice = this.$store.state.map.mapDevice;
|
||||
const list = [];
|
||||
for (const key in mapDevice) {
|
||||
list.push(mapDevice[key]);
|
||||
}
|
||||
this.$jlmap.updateShowMode(list, '02');
|
||||
this.$store.dispatch('training/updateMapState', list);
|
||||
!this.isRunPlan && this.$jlmap.clearTrainView();
|
||||
});
|
||||
},
|
||||
changeOperateMode() {
|
||||
this.faultMode = !this.faultMode;
|
||||
let mode = OperateMode.NORMAL;
|
||||
if (this.faultMode) {
|
||||
mode = OperateMode.FAULT;
|
||||
}
|
||||
this.$store.dispatch('training/changeOperateMode', { mode: mode });
|
||||
},
|
||||
doClose() {
|
||||
this.loading = false;
|
||||
this.dialogShow = false;
|
||||
this.selfJmap = Vue.prototype.$jlmap;
|
||||
},
|
||||
destroy() {
|
||||
this.selfJmap.dispose();
|
||||
},
|
||||
goTroDialog() {
|
||||
this.doClose();
|
||||
this.$emit('goTroDialog');
|
||||
},
|
||||
changeStation(value) {
|
||||
this.deviceCode = this.deviceCode || this.stationList[0].code;
|
||||
const device = this.$store.getters['map/getDeviceByCode'](this.deviceCode);
|
||||
const stationSn = device.sn + value;
|
||||
const station = this.stationList.find((item) => {
|
||||
return item.sn === stationSn;
|
||||
});
|
||||
if (station && station.depot) {
|
||||
this.changeStation(value * 2);
|
||||
} else if (station) {
|
||||
this.deviceCode = station.code;
|
||||
this.$jlmap && this.$jlmap.setCenterOffset(this.deviceCode, { x: 200, y:0 });
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style scoped>
|
||||
/deep/ .el-dialog {
|
||||
background: rgba(100, 100, 100, 1);
|
||||
position: relative;
|
||||
border: 2px solid rgba(144, 144, 144, 0.8);
|
||||
border-radius: 6px;
|
||||
font-size: 14px;
|
||||
}
|
||||
/deep/ .el-dialog .el-dialog__body{
|
||||
background: rgba(100, 100, 100, 1);
|
||||
border: 0;
|
||||
padding: 0;
|
||||
}
|
||||
/deep/ .el-dialog .el-dialog__header {
|
||||
padding: 5px;
|
||||
height: 30px;
|
||||
}
|
||||
/deep/ .el-dialog .el-dialog__title {
|
||||
color: #fff;
|
||||
}
|
||||
/deep/ .el-dialog .el-dialog__headerbtn {
|
||||
background: linear-gradient(#CD98A0, #C27D6E, #B63022, #C68770);
|
||||
border: 1px solid #fff;
|
||||
border-radius: 4px;
|
||||
top: 4px;
|
||||
right: 5px;
|
||||
line-height: 16px;
|
||||
}
|
||||
/deep/ .el-dialog__headerbtn .el-dialog__close{
|
||||
color: #fff;
|
||||
}
|
||||
.arrow-button{
|
||||
width: 45px;
|
||||
height: 30px;
|
||||
cursor: pointer;
|
||||
background-size: 45px 30px;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
.button-box{
|
||||
width: 150px;
|
||||
height: 35px;
|
||||
display: flex;
|
||||
position: absolute;
|
||||
bottom: 60px;
|
||||
left: calc(50% - 75px);
|
||||
z-index: 9999;
|
||||
justify-content: space-between;
|
||||
justify-items: center;
|
||||
}
|
||||
.fault-button{
|
||||
position: absolute;
|
||||
top: 32px;
|
||||
right: 32px;
|
||||
}
|
||||
</style>
|
||||
@ -1,150 +0,0 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
class="haerbin-01__systerm ttl"
|
||||
:title="title"
|
||||
:modal="false"
|
||||
:width="'900px'"
|
||||
:visible.sync="show"
|
||||
:before-close="doClose"
|
||||
>
|
||||
<div class="actualTimetable">
|
||||
<div class="actualTimetableT">
|
||||
<div class="actualTimetableTtext">实效时刻表</div>
|
||||
<div class="actualTimetableTLine" />
|
||||
</div>
|
||||
<div class="actualTimetableForm">
|
||||
<div class="actualTimeFormEach">
|
||||
<span>日期: </span>
|
||||
<span class="actualTimeFormValue">28.08.2008</span>
|
||||
</div>
|
||||
<div class="actualTimeFormEach">
|
||||
<span>名称: </span>
|
||||
<span class="actualTimeFormValue">SX0807</span>
|
||||
</div>
|
||||
<div class="actualTimeFormEach">
|
||||
<span>描述: </span>
|
||||
<span class="actualTimeFormValue">changed minimum of dwell time</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="defaultTimetable">
|
||||
<div class="defaultTimetableT">
|
||||
<div class="defaultTimetableTtext">预设时刻表</div>
|
||||
<div class="defaultTimetableTLine" />
|
||||
</div>
|
||||
<div class="defaultTimetableM">
|
||||
<el-table :data="tableData" style="width: 100%;" height="300" border class="defaultTimetab">
|
||||
<el-table-column prop="date" label="日期" width="110" />
|
||||
<el-table-column prop="name" label="名称" />
|
||||
<el-table-column prop="description" label="描述" />
|
||||
<el-table-column prop="status" label=" 状态" width="70" />
|
||||
</el-table>
|
||||
</div>
|
||||
<div class="defaultTimetableB">
|
||||
<div id="defaultClearSele" class="defaultTimetableBtn disabled">清除所选</div>
|
||||
<div id="defaultClearAll" class="defaultTimetableBtn disabled">清除全部</div>
|
||||
<div id="defaultShowTime" class="defaultTimetableBtn">显示时刻表</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="ttlButtonGroup">
|
||||
<div id="changeActual" class="defaultTimetableBtn">更换实效时刻表</div>
|
||||
<div id="changeDefault" class="defaultTimetableBtn">更换预设时刻表</div>
|
||||
<div id="settingTimetable" class="defaultTimetableBtn disabled">设定</div>
|
||||
<div id="resetTimetable" class="defaultTimetableBtn disabled">重设</div>
|
||||
<div id="closeTimetable" class="defaultTimetableBtn" @click="doClose">关闭</div>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
name:'TTLDialog',
|
||||
data() {
|
||||
return {
|
||||
dialogShow:false,
|
||||
tableData:[
|
||||
{date:'28.08.2008', name:'SX0807', description:'changed minimum of dwell time', status:'有效'},
|
||||
{date:'29.08.2008', name:'SX0807', description:'changed minimum of dwell time', status:'无效'},
|
||||
{date:'30.08.2008', name:'SX0807', description:'changed minimum of dwell time', status:'无效'},
|
||||
{date:'31.08.2008', name:'SX0807', description:'changed minimum of dwell time', status:'无效'},
|
||||
{date:'01.09.2008', name:'SX0807', description:'changed minimum of dwell time', status:'无效'}
|
||||
]
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
show() {
|
||||
return this.dialogShow && !this.$store.state.menuOperation.break;
|
||||
},
|
||||
title() {
|
||||
return '时刻表';
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
doShow() {
|
||||
this.dialogShow = true;
|
||||
},
|
||||
doClose() {
|
||||
this.dialogShow = false;
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.actualTimetable{padding:0px 15px;}
|
||||
.actualTimetableT{width:100%;position: relative;}
|
||||
.defaultTimetableT{width:100%;position: relative;overflow:hidden;}
|
||||
.actualTimetableTtext,.defaultTimetableTtext{position:absolute;height: 20px;padding-right:5px;font-size:15px;color: #676767;background:#e2e2e2;font-weight: bold;}
|
||||
.actualTimetableTLine,.defaultTimetableTLine{display:inline-block;margin-left:10px;width:100%;border-bottom: 1px #A0A0A0 solid;vertical-align: top;height: 9px;}
|
||||
.actualTimetableForm{}
|
||||
.actualTimeFormEach{margin-top: 10px;}
|
||||
.actualTimeFormEach span{font-size:15px;color: #151515;}
|
||||
.actualTimeFormValue{
|
||||
font-size:15px;
|
||||
color: #151515;
|
||||
display: inline-block;
|
||||
padding: 5px 10px;
|
||||
border: 1px #A2A2A2 solid;
|
||||
width: 810px;
|
||||
}
|
||||
.defaultTimetable{
|
||||
padding:15px 15px 0px 15px;
|
||||
}
|
||||
// .defaultTimetab{
|
||||
// padding: 10px 15px 10px 15px;
|
||||
// }
|
||||
.defaultTimetableM{margin-top:10px;}
|
||||
.defaultTimetableB{display:inline-block;width:100%;margin-top: 10px;}
|
||||
#defaultClearSele{margin-right:10px;width:90px;}
|
||||
#defaultClearAll{width:90px;}
|
||||
#defaultShowTime{float:right;width:90px;}
|
||||
.defaultTimetableBtn{
|
||||
background:transparent;
|
||||
border:1px#9C9C9C solid ;
|
||||
height:auto ;
|
||||
outline:none;
|
||||
text-align:center;
|
||||
display: inline-block;
|
||||
padding:4px 0px;
|
||||
color:#090909;
|
||||
cursor: pointer;
|
||||
}
|
||||
.defaultTimetableBtn.disabled{border:1px #A9A9A9 solid ;color: #A7A7A7; cursor: no-drop;}
|
||||
.ttlButtonGroup{
|
||||
border-top: 1px #6d6d6d solid;
|
||||
margin-top: 10px;
|
||||
padding: 10px 15px;
|
||||
}
|
||||
#changeActual{margin-right:10px;width:120px}
|
||||
#changeDefault{width:120px;margin-right:175px;}
|
||||
#settingTimetable{width:130px;margin-right:10px;}
|
||||
#resetTimetable{width:130px;margin-right:10px;}
|
||||
#closeTimetable{width:130px;}
|
||||
</style>
|
||||
<style lang="scss">
|
||||
.ttl.haerbin-01__systerm .el-dialog .el-dialog__body{
|
||||
background: #E2E2E2;
|
||||
padding:20px 0px 10px 0px;
|
||||
}
|
||||
.defaultTimetab.el-table .cell{
|
||||
padding-top:5px;padding-bottom:5px;
|
||||
}
|
||||
</style>
|
||||
@ -1,284 +0,0 @@
|
||||
<template>
|
||||
<div class="addRules">
|
||||
<div class="addRulesInner">
|
||||
<div class="addRulesInnerTitle">新增故障</div>
|
||||
<div class="closeAddRulesInner" @click="addRulesClose">
|
||||
<span class="el-icon-close closeAddRulesIn" />
|
||||
</div>
|
||||
<el-form ref="form" :model="faultRule" label-width="100px" style="margin-left:15px;">
|
||||
<el-form-item label="目标设备">
|
||||
<!-- faultRule.targetDeviceCode -->
|
||||
<el-input v-model="targetDevice.name" disabled size="small" class="inputModelClass" />
|
||||
<!--<el-button :type="field === 'targetActive' ? 'danger' : 'primary'" size="small" @click="hover('targetActive')">{{ $t('map.activate') }}</el-button>-->
|
||||
</el-form-item>
|
||||
<el-form-item label="触发方式">
|
||||
<el-select v-model="triggerMode" @change="changeTriggerMode">
|
||||
<el-option
|
||||
v-for="item in triggerModeList"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="故障类型">
|
||||
<el-select v-model="faultRule.faultType" placeholder="请选择" class="inputModelClass">
|
||||
<el-option
|
||||
v-for="item in faultTypeList"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="triggerMode === 'DEVICE'" label="触发设备">
|
||||
<!-- faultRule.condition.triggerDeviceCode -->
|
||||
<el-input v-model="triggerDevice" size="small" disabled class="inputModelClass" />
|
||||
<el-button :type="field === 'triggerActive' ? 'danger' : 'primary'" size="small" @click="hover('triggerActive')">{{ $t('map.activate') }}</el-button>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="triggerMode === 'DEVICE'" label="触发状态">
|
||||
<!-- <el-input v-model="faultRule.condition.triggerDeviceStatus" size="small" class="inputModelClass" /> -->
|
||||
<el-select v-model="faultRule.condition.triggerDeviceStatus" placeholder="请选择" class="inputModelClass">
|
||||
<el-option
|
||||
v-for="item in triggerStatusList"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="triggerMode === 'DEVICE'" label="关联设备">
|
||||
<el-input v-model="triggerAssociatedDevice" size="small" disabled class="inputModelClass" />
|
||||
<el-button :type="field === 'triggerAssociated'? 'danger': 'primary'" size="small" @click="hover('triggerAssociated')">{{ $t('map.activate') }}</el-button>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="triggerMode === 'TIME'" label="触发时间">
|
||||
<el-date-picker
|
||||
v-model="faultRule.condition.triggeringTime"
|
||||
type="datetime"
|
||||
placeholder="选择日期时间"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span class="addRulesFooter">
|
||||
<el-button size="medium" type="primary" @click="addRulesCreate">{{ $t('global.confirm') }}</el-button>
|
||||
<el-button size="medium" @click="addRulesClose">{{ $t('global.cancel') }}</el-button>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { FaultStatusEnum } from '@/scripts/FaultDicNew';
|
||||
import { setFailureModeNew} from '@/api/simulation';
|
||||
import { deviceFaultType} from '@/scripts/cmdPlugin/Config';
|
||||
// 添加故障
|
||||
export default {
|
||||
name: 'AddChoose',
|
||||
props: {
|
||||
targetDevice: {
|
||||
type: Object,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
field:'',
|
||||
triggerStatusList:[],
|
||||
faultTypeList:[],
|
||||
faultRule:{
|
||||
targetDeviceCode:'',
|
||||
targetDeviceType:'',
|
||||
faultType:'',
|
||||
condition:{
|
||||
triggerDeviceCode:'',
|
||||
triggerDeviceStatus:'',
|
||||
triggerDeviceType :'',
|
||||
type:'DEVICE',
|
||||
triggeringTime: '',
|
||||
triggerAssociatedDeviceCode: ''
|
||||
}
|
||||
},
|
||||
// targetDevice:'',
|
||||
triggerDevice:'',
|
||||
triggerAssociatedDevice: '',
|
||||
triggerMode: 'DEVICE',
|
||||
triggerModeList: [
|
||||
{label: '设备触发', value: 'DEVICE'},
|
||||
{label: '时间触发', value: 'TIME'}
|
||||
]
|
||||
// rules:{
|
||||
// targetDevice:[
|
||||
// { required: true, message:'请选择目标设备', trigger: 'blur' }
|
||||
// ],
|
||||
// triggerDevice:[
|
||||
// { required: true, message:'请选择触发设备', trigger: 'blur' }
|
||||
// ],
|
||||
// faultRule:{
|
||||
// faultType:[
|
||||
// { required: true, message:'请选择故障类型', trigger: 'blur' },
|
||||
// { required: true, message:'请选择故障类型', trigger: 'change' }
|
||||
// ]
|
||||
// }
|
||||
// }
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
'$store.state.menuOperation.selectedCount':function(em) {
|
||||
const device = this.$store.state.menuOperation.selected;
|
||||
if (device.code) {
|
||||
this.deviceSelect(device);
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
},
|
||||
methods:{
|
||||
deviceSelect(em) {
|
||||
if (this.field.toUpperCase() === 'triggerAssociated'.toUpperCase()) {
|
||||
// if (em._type == 'Station') {
|
||||
// em = this.$store.getters['map/getDeviceByCode'](em.zcCode);
|
||||
// }
|
||||
// this.faultRule.targetDeviceType = this.covertType(em._type);
|
||||
// this.faultRule.targetDeviceCode = em.code;
|
||||
if (em._type.toUpperCase() === 'Section'.toUpperCase() && em.parentName) {
|
||||
this.triggerAssociatedDevice = em._type + '-' + em.parentName + '-' + em.name;
|
||||
} else {
|
||||
this.triggerAssociatedDevice = em._type + '-' + em.name;
|
||||
}
|
||||
this.faultRule.condition.triggerAssociatedDeviceCode = em.code;
|
||||
} else if (this.field.toUpperCase() === 'triggerActive'.toUpperCase()) {
|
||||
this.faultRule.condition.triggerDeviceType = this.covertType(em._type);
|
||||
this.faultRule.condition.triggerDeviceCode = em.code;
|
||||
if (em._type.toUpperCase() === 'Section'.toUpperCase() && em.parentName) {
|
||||
this.triggerDevice = em._type + '-' + em.parentName + '-' + em.name;
|
||||
} else if (em._type.toUpperCase() === 'Train'.toUpperCase()) {
|
||||
this.triggerDevice = em._type + '-' + em.code;
|
||||
} else {
|
||||
this.triggerDevice = em._type + '-' + em.name;
|
||||
}
|
||||
this.triggerStatusList = [];
|
||||
const faultStatus = FaultStatusEnum[this.faultRule.condition.triggerDeviceType];
|
||||
if (faultStatus) {
|
||||
const list = Object.keys(faultStatus);
|
||||
list.forEach(key=>{
|
||||
this.triggerStatusList.push({label:faultStatus[key], value:key});
|
||||
});
|
||||
}
|
||||
this.field = '';
|
||||
this.faultRule.condition.triggerDeviceStatus = '';
|
||||
}
|
||||
},
|
||||
covertType(type) {
|
||||
switch (type) {
|
||||
case 'Section':return 'SECTION';
|
||||
case 'Signal':return 'SIGNAL';
|
||||
case 'Switch':return 'SWITCH';
|
||||
case 'Station':return 'STATION';
|
||||
case 'ZcControl':return 'ZC';
|
||||
case 'StationStand':return 'STAND';
|
||||
case 'Train':return 'TRAIN';
|
||||
}
|
||||
},
|
||||
hover(field) {
|
||||
if (this.field == '') {
|
||||
this.field = field;
|
||||
} else {
|
||||
this.field = '';
|
||||
}
|
||||
},
|
||||
addRulesCreate() {
|
||||
if (this.triggerDevice == '') {
|
||||
this.$messageBox('请选择触发设备');
|
||||
return;
|
||||
}
|
||||
if (this.faultRule.condition.triggerDeviceStatus == '') {
|
||||
this.$messageBox('请选择触发状态');
|
||||
return;
|
||||
}
|
||||
if (this.faultRule.faultType == '') {
|
||||
this.$messageBox('请选择故障类型');
|
||||
return;
|
||||
}
|
||||
console.log(this.faultRule, '-------------');
|
||||
setFailureModeNew(this.faultRule, this.$route.query.group).then(res=>{
|
||||
this.$emit('closeAddRules');
|
||||
this.$emit('reload');
|
||||
}).catch((error)=>{
|
||||
this.$messageBox('创建故障失败: ' + error.message);
|
||||
});
|
||||
},
|
||||
addRulesClose() {
|
||||
this.resetForm();
|
||||
this.$emit('closeAddRules');
|
||||
},
|
||||
|
||||
initValue() {
|
||||
this.faultTypeList = deviceFaultType[this.targetDevice._type];
|
||||
this.faultRule.targetDeviceCode = this.targetDevice.code;
|
||||
this.faultRule.targetDeviceType = this.covertType(this.targetDevice._type);
|
||||
},
|
||||
resetForm() {
|
||||
this.triggerDevice = '';
|
||||
this.faultRule = {
|
||||
targetDeviceCode:'',
|
||||
targetDeviceType:'',
|
||||
faultType:'',
|
||||
condition:{
|
||||
triggerDeviceCode:'',
|
||||
triggerDeviceStatus:'',
|
||||
triggerDeviceType :'',
|
||||
type:'DEVICE',
|
||||
triggeringTime: '',
|
||||
triggerAssociatedDeviceCode: ''
|
||||
}
|
||||
};
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.addRules{
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
left: 0;
|
||||
top: 40px;
|
||||
}
|
||||
.addRulesInner{
|
||||
position: relative;
|
||||
width: 380px;
|
||||
margin-top:6px;
|
||||
background: #fff;
|
||||
border-radius: 10px;
|
||||
border: 1px #ccc solid;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
box-shadow: 3px 3px 3px #a0a0a0;
|
||||
z-index:2;
|
||||
}
|
||||
.queryList{
|
||||
height: 300px;
|
||||
overflow: auto;
|
||||
}
|
||||
.inputModelClass{
|
||||
width:150px;
|
||||
}
|
||||
.addRulesInnerTitle{
|
||||
padding: 10px;
|
||||
font-size: 14px;
|
||||
}
|
||||
.closeAddRulesInner{
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
top: 9px;
|
||||
width: 19px;
|
||||
height: 19px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.closeAddRulesIn{
|
||||
font-size: 19px;
|
||||
}
|
||||
.addRulesFooter{
|
||||
margin-left: 116px;
|
||||
display: inline-block;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
</style>
|
||||
@ -1,196 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-drawer
|
||||
title="设备管理"
|
||||
:visible.sync="show"
|
||||
direction="ltr"
|
||||
:before-close="doClose"
|
||||
custom-class="dialog_box"
|
||||
size="43%"
|
||||
>
|
||||
<div style="margin-bottom: 3px; overflow: hidden; padding: 0 10px;">
|
||||
<div class="plc_box">名称: {{ plcInfo.name }}</div>
|
||||
<div class="plc_box">状态: <span :style="{'color': plcInfo.status ? 'green' : 'red'}">{{ plcInfo.status ? '在线' : '不在线' }}</span></div>
|
||||
<el-button type="text" size="small" class="freshen_box" @click="getList">刷新</el-button>
|
||||
</div>
|
||||
<el-table :data="tableData" border style="width: 100%; max-height: calc(100% - 24px); overflow: auto;">
|
||||
<el-table-column prop="code" label="设备编号" width="180" />
|
||||
<el-table-column prop="typeName" label="设备类型" width="180" />
|
||||
<el-table-column prop="vrDeviceCode" label="连接设备编码">
|
||||
<template slot-scope="scope">
|
||||
<div v-if="scope.row.vrDeviceCode" class="flex_box">{{ scope.row.vrDeviceName }}</div>
|
||||
<div v-if="!scope.row.vrDeviceCode" class="flex_box">(空)</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作">
|
||||
<template slot-scope="scope">
|
||||
<el-button :type="scope.row.buttonShowType ? 'danger' : 'primary'" size="small" @click="handleClick(scope.row, scope.$index)">连接</el-button>
|
||||
<el-button size="small" @click="cancel(scope.row, scope.$index)">断开</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-drawer>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getAllSimulationList, postSimulationConnectById, putSimulationDisconnectById } from '@/api/simulation.js';
|
||||
import ConstConfig from '@/scripts/ConstConfig';
|
||||
import { EventBus } from '@/scripts/event-bus';
|
||||
import { getSessionStorage } from '@/utils/auth';
|
||||
|
||||
export default {
|
||||
name: 'Equipment',
|
||||
data() {
|
||||
return {
|
||||
show: false,
|
||||
group: '',
|
||||
tableData: [],
|
||||
typeList: ConstConfig.ConstSelect.projectDeviceTypeList,
|
||||
plcInfo: {
|
||||
name: '',
|
||||
status: ''
|
||||
},
|
||||
index: 0,
|
||||
selected: {},
|
||||
typeObj: {
|
||||
Section: '区段',
|
||||
Signal: '信号机',
|
||||
Switch: '道岔',
|
||||
Psd: '屏蔽门',
|
||||
StationStand: '站台'
|
||||
}
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
project() {
|
||||
return getSessionStorage('project');
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
EventBus.$on('selectDevice', (data) => {
|
||||
this.selected = data;
|
||||
this.tableData[this.index]['buttonShowType'] = false;
|
||||
this.tableData.splice(this.index, 1, this.tableData[this.index]);
|
||||
this.$store.dispatch('map/selectDeviceCode', {flag: false, type: ''});
|
||||
this.connect(this.tableData[this.index]);
|
||||
});
|
||||
},
|
||||
async beforeDestroy() {
|
||||
EventBus.$off('selectDevice');
|
||||
},
|
||||
methods: {
|
||||
async doShow() {
|
||||
this.show = true;
|
||||
this.group = this.$route.query.group;
|
||||
this.getList();
|
||||
},
|
||||
async getList() {
|
||||
try {
|
||||
const res = await getAllSimulationList(this.group);
|
||||
this.tableData = [];
|
||||
res.data.forEach((item, index) => {
|
||||
if (item.type == 'PLC_GATEWAY') {
|
||||
this.plcInfo = {
|
||||
name: 'PLC网关',
|
||||
status: item.online
|
||||
};
|
||||
} else {
|
||||
item.buttonShowType = false;
|
||||
item.typeName = this.typeList.find(el => el.value == item.type).label;
|
||||
if (item.vrDeviceCode) {
|
||||
item.vrDeviceName = this.$store.getters['map/getDeviceByCode'](item.vrDeviceCode).name;
|
||||
}
|
||||
if (this.project == 'heb' || this.project == 'designheb') {
|
||||
if (item.type == 'SWITCH') {
|
||||
this.tableData.push(item);
|
||||
}
|
||||
} else {
|
||||
this.tableData.push(item);
|
||||
}
|
||||
}
|
||||
});
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
}
|
||||
},
|
||||
doClose() {
|
||||
this.show = false;
|
||||
},
|
||||
handleClick(row, index) {
|
||||
row.buttonShowType = !row.buttonShowType;
|
||||
this.index = index;
|
||||
this.tableData.splice(index, 1, row);
|
||||
this.$store.dispatch('map/selectDeviceCode', {flag: row.buttonShowType, type: row.type});
|
||||
},
|
||||
async connect(row) {
|
||||
this.$confirm(`您确定连接${this.typeObj[this.selected._type] || '设备'}: ${this.selected.name}, 是否继续?`, '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(async () => {
|
||||
try {
|
||||
const res = await postSimulationConnectById(this.group, row.id, this.selected.code);
|
||||
if (res && res.code == 200) {
|
||||
this.$message.success('连接成功!');
|
||||
this.tableData[this.index]['vrDeviceCode'] = this.selected.code;
|
||||
this.tableData[this.index]['vrDeviceName'] = this.selected.name;
|
||||
this.tableData.splice(this.index, 1, this.tableData[this.index]);
|
||||
}
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
}
|
||||
});
|
||||
},
|
||||
async cancel(row, index) {
|
||||
this.$confirm('您确定将次设备断开, 是否继续?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(async () => {
|
||||
if (row.vrDeviceCode) {
|
||||
row.vrDeviceCode = '';
|
||||
row.vrDeviceName = '';
|
||||
this.tableData.splice(index, 1, row);
|
||||
try {
|
||||
const res = await putSimulationDisconnectById(this.group, row.id);
|
||||
if (res && res.code == 200) {
|
||||
this.$message.success('断开成功!');
|
||||
}
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style rel="stylesheet/scss" lang="scss" scoped>
|
||||
.plc_box{
|
||||
float: left;
|
||||
margin-right: 40px;
|
||||
padding: 9px;
|
||||
}
|
||||
.freshen_box{
|
||||
float: right;
|
||||
}
|
||||
.flex_box{
|
||||
float: left;
|
||||
margin-right: 5px;
|
||||
line-height: 30px;
|
||||
}
|
||||
/deep/ {
|
||||
.el-dialog__wrapper{
|
||||
width: 800px;
|
||||
}
|
||||
.dialog_box{
|
||||
height: 100%;
|
||||
}
|
||||
.el-dialog__body{
|
||||
padding-top: 6px;
|
||||
height: calc(100% - 54px);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,600 +0,0 @@
|
||||
<template>
|
||||
<div v-if="dialogShow" id="faultChoose">
|
||||
<div class="falutChooseTitle">{{ title }}</div>
|
||||
<div class="closeFalutChoose" @click="closeFaultChoose">
|
||||
<span class="el-icon-close closeFalutChooseIn" />
|
||||
</div>
|
||||
<el-card class="triggerFaultInfo">
|
||||
<el-button type="primary" size="small" style="margin-bottom:10px;" @click="isTableShow=!isTableShow">{{ isTableShow?'隐藏列表':'显示列表' }}</el-button>
|
||||
<el-table v-if="isTableShow" :data="faultList" height="300" border style="width: 100%;font-size:13px;">
|
||||
<el-table-column prop="targetDeviceCode" label="目标设备" width="220">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ `${deviceMap[scope.row.targetDeviceType]}${formatNameByCode(scope.row.targetDeviceCode)}` }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="faultType" label="故障类型">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ covertFaultType(scope.row) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="condition" label="列车" width="100">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ `${deviceMap[scope.row.condition.triggerDeviceType] || ''}${formatNameByCode(scope.row.condition.triggerDeviceCode)}` }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="condition" label="到达区段" width="180">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ `${formatNameByCode(scope.row.condition.triggerAssociatedDeviceCode)}` }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="condition.condition.triggerTime" label="触发时间" width="150" />
|
||||
<el-table-column prop="triggeringTime" label="故障状态">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.triggeringTime? '已触发': '未触发' }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作">
|
||||
<template slot-scope="scope">
|
||||
<el-button v-if="!scope.row.triggeringTime" type="text" size="small" @click="handleDelete(scope.row)">取消</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-card>
|
||||
<div class="targetCard">
|
||||
<div class="targetCardHead">
|
||||
<el-button style="padding:3px 0" type="text" @click="addRulesCreate">新增</el-button>
|
||||
</div>
|
||||
<div>
|
||||
<el-form ref="form" :model="faultRule" :inline="true" label-width="100px" style="margin-left:15px;">
|
||||
<el-form-item label="目标设备" class="targetFormItem">
|
||||
<el-input v-model="targetDeviceName" disabled size="small" class="inputModelClass" style="width: 300px;" />
|
||||
</el-form-item>
|
||||
<el-form-item label="故障类型" class="targetFormItem">
|
||||
<el-select v-model="faultRule.faultType" placeholder="请选择" class="inputModelClass" size="small" style="width: 300px;">
|
||||
<el-option
|
||||
v-for="item in faultTypeList"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="triggerMode === 'DEVICE'" label="列车" class="targetFormItem">
|
||||
<el-input v-model="triggerDevice" size="small" disabled class="inputModelClass" style="width: 240px;" />
|
||||
<el-button :type="field === 'triggerActive' ? 'danger' : 'primary'" size="small" @click="hover('triggerActive')">{{ $t('map.activate') }}</el-button>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="triggerMode === 'DEVICE'" label="到达区段" class="targetFormItem">
|
||||
<el-input v-model="triggerAssociatedDevice" size="small" disabled class="inputModelClass" style="width: 240px;" />
|
||||
<el-button :type="field === 'triggerAssociated'? 'danger': 'primary'" size="small" @click="hover('triggerAssociated')">{{ $t('map.activate') }}</el-button>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="triggerMode === 'TIME'" label="触发时间" class="targetFormItem">
|
||||
<el-date-picker
|
||||
v-model="faultRule.condition.triggerTime"
|
||||
size="small"
|
||||
format="yyyy-MM-dd HH:mm:ss"
|
||||
value-format="yyyy-MM-dd HH:mm:ss"
|
||||
type="datetime"
|
||||
placeholder="选择日期时间"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getSimulationFaultRules, setFailureModeNew, deleteFailureRule, cancelFailureModeNew } from '@/api/simulation';
|
||||
import ConstConfig from '@/scripts/ConstConfig';
|
||||
import { FaultStatusEnum } from '@/scripts/FaultDicNew';
|
||||
import ModelType from '@/jmapNew/constant/deviceType';
|
||||
import { deviceFaultType } from '@/scripts/cmdPlugin/Config';
|
||||
|
||||
// 故障列表
|
||||
export default {
|
||||
name: 'FaultChoose',
|
||||
props: {
|
||||
group: {
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
offset: {
|
||||
type: Number,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogShow: false,
|
||||
loading: false,
|
||||
isAdd:false,
|
||||
isTableShow:true,
|
||||
deviceMap: {},
|
||||
simulationFault:{},
|
||||
faultList: [],
|
||||
faultRule:{
|
||||
targetDeviceCode:'',
|
||||
targetDeviceType:'',
|
||||
faultType:'',
|
||||
condition:{
|
||||
triggerDeviceCode:'',
|
||||
triggerDeviceStatus:'',
|
||||
triggerDeviceType :'',
|
||||
type:'DEVICE',
|
||||
triggerTime: '',
|
||||
triggerAssociatedDeviceCode: ''
|
||||
}
|
||||
},
|
||||
triggerDevice:'',
|
||||
triggerAssociatedDevice: '',
|
||||
triggerMode: 'DEVICE',
|
||||
triggerModeList: [
|
||||
{label: '设备触发', value: 'DEVICE'},
|
||||
{label: '时间触发', value: 'TIME'}
|
||||
],
|
||||
field:'',
|
||||
triggerStatusList:[],
|
||||
faultTypeList:[],
|
||||
targetDeviceName: ''
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
title() {
|
||||
return '自动故障设置';
|
||||
},
|
||||
lineCode() {
|
||||
return this.$route.query.lineCode;
|
||||
},
|
||||
targetDevice() {
|
||||
return this.$store.state.training.triggerFaultDevice;
|
||||
}
|
||||
},
|
||||
watch:{
|
||||
'$store.state.socket.autoFaultTrigger':function(val) {
|
||||
this.dialogShow && this.getSimulationFaultRules();
|
||||
},
|
||||
'$store.state.menuOperation.selectedCount':function(em) {
|
||||
const device = this.$store.state.menuOperation.selected;
|
||||
if (device && device.code) {
|
||||
this.deviceSelect(device);
|
||||
}
|
||||
},
|
||||
targetDevice: function(device) {
|
||||
this.targetDeviceName = this.targetDevice.name || this.targetDevice.code;
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.deviceMap = [];
|
||||
ConstConfig.ConstSelect.simulationDeviceList.forEach(elem => {
|
||||
this.deviceMap[elem.value] = elem.label;
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
formatNameByCode(code) {
|
||||
let name = '';
|
||||
const device = this.$store.getters['map/getDeviceByCode'](code);
|
||||
if (device) {
|
||||
switch (device._type) {
|
||||
case ModelType.Signal:
|
||||
case ModelType.Switch:
|
||||
case ModelType.Station:
|
||||
case ModelType.Section: {
|
||||
if (device.parentName) {
|
||||
name += device.parentName + '-' + device.name;
|
||||
} else {
|
||||
name += device.name;
|
||||
}
|
||||
|
||||
break;
|
||||
}
|
||||
case ModelType.Train:
|
||||
name = device.code;
|
||||
break;
|
||||
}
|
||||
if (device.stationCode) {
|
||||
const station = this.$store.getters['map/getDeviceByCode'](device.stationCode);
|
||||
if (station) {
|
||||
name += '【' + station.name + '】';
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return name;
|
||||
},
|
||||
hover(field) {
|
||||
if (this.field == '') {
|
||||
this.field = field;
|
||||
} else {
|
||||
this.field = '';
|
||||
}
|
||||
},
|
||||
handleDelete(row) {
|
||||
cancelFailureModeNew(row.id, this.$route.query.group).then(resp => {
|
||||
this.getSimulationFaultRules();
|
||||
}).catch(() => {
|
||||
this.$message.error('取消故障失败！');
|
||||
});
|
||||
},
|
||||
covertType(type) {
|
||||
switch (type) {
|
||||
case 'SECTION':return 'Section';
|
||||
case 'SIGNAL':return 'Signal';
|
||||
case 'SWITCH':return 'Switch';
|
||||
case 'STATION':return 'Station';
|
||||
case 'ZC':return 'ZcControl';
|
||||
case 'STAND':return 'StationStand';
|
||||
case 'TRAIN':return 'Train';
|
||||
case 'Section':return 'SECTION';
|
||||
case 'Signal':return 'SIGNAL';
|
||||
case 'Switch':return 'SWITCH';
|
||||
case 'Station':return 'STATION';
|
||||
case 'ZcControl':return 'ZC';
|
||||
case 'StationStand':return 'STAND';
|
||||
case 'Train':return 'TRAIN';
|
||||
}
|
||||
},
|
||||
covertFaultType(row) {
|
||||
let faultType = '';
|
||||
if (row && row.id) {
|
||||
let type = this.covertType(row.targetDeviceType);
|
||||
if (type == 'Station') {
|
||||
type = 'ZcControl';
|
||||
}
|
||||
const currentList = deviceFaultType[type];
|
||||
currentList.forEach(temp=>{
|
||||
if (temp.value === row.faultType) {
|
||||
faultType = temp.label;
|
||||
}
|
||||
});
|
||||
}
|
||||
return faultType;
|
||||
},
|
||||
closeFaultChoose() {
|
||||
this.dialogShow = false;
|
||||
this.isAdd = false;
|
||||
if (this.$refs.addFault) {
|
||||
this.$refs.addFault.resetForm();
|
||||
}
|
||||
},
|
||||
closeAddRules() {
|
||||
this.isAdd = false;
|
||||
},
|
||||
getSimulationFaultRules() {
|
||||
if (this.dialogShow) {
|
||||
getSimulationFaultRules(this.$route.query.group).then(resp => {
|
||||
this.faultList = resp.data;
|
||||
}).catch(() => {
|
||||
this.$messageBox('获取数据异常');
|
||||
});
|
||||
}
|
||||
},
|
||||
changeTriggerMode(val) {
|
||||
this.resetForm();
|
||||
this.triggerMode = val;
|
||||
this.faultRule.condition.type = val;
|
||||
},
|
||||
doShow() {
|
||||
this.dialogShow = true;
|
||||
this.getSimulationFaultRules();
|
||||
this.resetForm();
|
||||
this.faultTypeList = deviceFaultType[this.targetDevice._type];
|
||||
this.faultRule.targetDeviceCode = this.targetDevice.code;
|
||||
this.faultRule.targetDeviceType = this.covertType(this.targetDevice._type);
|
||||
this.faultRule.faultType = (this.faultTypeList[0] || {}).value;
|
||||
this.$nextTick(()=>{
|
||||
this.dragEvent();
|
||||
});
|
||||
},
|
||||
resetForm() {
|
||||
this.getSimulationFaultRules();
|
||||
this.field = '';
|
||||
this.triggerDevice = '';
|
||||
this.triggerAssociatedDevice = '';
|
||||
this.faultRule = {
|
||||
targetDeviceCode:this.targetDevice.code,
|
||||
targetDeviceType:this.covertType(this.targetDevice._type),
|
||||
faultType:'',
|
||||
condition:{
|
||||
triggerDeviceCode:'',
|
||||
triggerDeviceStatus:'',
|
||||
triggerDeviceType :'',
|
||||
type:'DEVICE',
|
||||
triggerTime: '',
|
||||
triggerAssociatedDeviceCode: ''
|
||||
}
|
||||
};
|
||||
},
|
||||
doClose() {
|
||||
this.dialogShow = false;
|
||||
},
|
||||
handleAdd() {
|
||||
this.isAdd = true;
|
||||
this.$nextTick(() => {
|
||||
this.$refs.addFault.initValue();
|
||||
});
|
||||
},
|
||||
deleteFailure(index, row) {
|
||||
event.cancelBubble = true;
|
||||
this.$confirm('删除故障规则，是否继续？', '提 示', {
|
||||
confirmButtonText: '确 定',
|
||||
cancelButtonText: '取 消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
deleteFailureRule(row.id).then(resp => {
|
||||
}).catch(error => {
|
||||
this.$message.error(`删除故障规则失败: ${error.message}`);
|
||||
});
|
||||
}).catch( () => { });
|
||||
},
|
||||
settingFailure(index, row, idx) {
|
||||
const faultModel = {ruleId: row.id, auto:true};
|
||||
// row['loading' + idx] = true;
|
||||
setFailureModeNew(faultModel, this.group).then(() => {
|
||||
this.getSimulationFaultRules();
|
||||
this.$message.success('设置自动故障成功');
|
||||
}).catch(() => {
|
||||
this.$messageBox('设置自动故障失败');
|
||||
});
|
||||
},
|
||||
cancleAutoFault() {
|
||||
const faultModel = {auto:false};
|
||||
setFailureModeNew(faultModel, this.group).then(() => {
|
||||
this.getSimulationFaultRules();
|
||||
this.$message.success('取消自动故障成功');
|
||||
}).catch(() => {
|
||||
this.$messageBox('取消自动故障失败');
|
||||
});
|
||||
},
|
||||
addRulesCreate() {
|
||||
if (this.triggerMode === 'DEVICE' && this.triggerDevice == '') {
|
||||
this.$messageBox('请选择触发设备');
|
||||
return;
|
||||
}
|
||||
if (this.triggerMode === 'DEVICE' && this.faultRule.condition.triggerDeviceStatus == '') {
|
||||
this.$messageBox('请选择触发状态');
|
||||
return;
|
||||
}
|
||||
if (this.faultRule.faultType == '') {
|
||||
this.$messageBox('请选择故障类型');
|
||||
return;
|
||||
}
|
||||
if (this.triggerMode === 'TIME' && this.faultRule.condition.triggerTime == '') {
|
||||
this.$messageBox('请选择触发时间');
|
||||
return;
|
||||
}
|
||||
if (this.triggerMode === 'DEVICE' && this.faultRule.condition.triggerDeviceType === 'TRAIN' && this.faultRule.condition.triggerDeviceStatus === 'Section' && this.faultRule.condition.triggerAssociatedDeviceCode == '') {
|
||||
this.$messageBox('请选择关联设备');
|
||||
return;
|
||||
}
|
||||
const param = {
|
||||
targetDeviceCode:this.targetDevice.code,
|
||||
targetDeviceType:this.covertType(this.targetDevice._type),
|
||||
faultType: this.faultRule.faultType,
|
||||
condition:{
|
||||
triggerDeviceCode: this.faultRule.condition.triggerDeviceCode || null,
|
||||
triggerDeviceStatus:this.faultRule.condition.triggerDeviceStatus || null,
|
||||
triggerDeviceType :this.faultRule.condition.triggerDeviceType || null,
|
||||
type:this.faultRule.condition.type,
|
||||
triggerTime: this.faultRule.condition.triggerTime || null,
|
||||
triggerAssociatedDeviceCode: this.faultRule.condition.triggerAssociatedDeviceCode || null
|
||||
}
|
||||
};
|
||||
setFailureModeNew(param, this.$route.query.group).then(res=>{
|
||||
this.$message.success('创建故障成功！');
|
||||
this.resetForm();
|
||||
}).catch((error)=>{
|
||||
this.$messageBox('创建故障失败: ' + error.message);
|
||||
});
|
||||
},
|
||||
deviceSelect(em) {
|
||||
if (this.field.toUpperCase() === 'triggerAssociated'.toUpperCase() && em._type.toUpperCase() === 'Section'.toUpperCase()) {
|
||||
if (em._type.toUpperCase() === 'Section'.toUpperCase() && em.parentName) {
|
||||
this.triggerAssociatedDevice = em._type + '-' + em.parentName + '-' + em.name;
|
||||
} else {
|
||||
this.triggerAssociatedDevice = em._type + '-' + em.name;
|
||||
}
|
||||
this.faultRule.condition.triggerAssociatedDeviceCode = em.code;
|
||||
} else if (this.field.toUpperCase() === 'triggerActive'.toUpperCase() && em._type.toUpperCase() === 'Train'.toUpperCase()) {
|
||||
this.faultRule.condition.triggerDeviceType = this.covertType(em._type);
|
||||
this.faultRule.condition.triggerDeviceCode = em.code;
|
||||
if (em._type.toUpperCase() === 'Section'.toUpperCase() && em.parentName) {
|
||||
this.triggerDevice = em._type + '-' + em.parentName + '-' + em.name;
|
||||
} else if (em._type.toUpperCase() === 'Train'.toUpperCase()) {
|
||||
this.triggerDevice = em._type + '-' + em.code;
|
||||
} else {
|
||||
this.triggerDevice = em._type + '-' + em.name;
|
||||
}
|
||||
this.triggerStatusList = [];
|
||||
const faultStatus = FaultStatusEnum[this.faultRule.condition.triggerDeviceType];
|
||||
if (faultStatus) {
|
||||
const list = Object.keys(faultStatus);
|
||||
list.forEach(key=>{
|
||||
this.triggerStatusList.push({label:faultStatus[key], value:key});
|
||||
});
|
||||
}
|
||||
this.field = '';
|
||||
this.faultRule.condition.triggerDeviceStatus = (this.triggerStatusList[0] || {}).value;
|
||||
}
|
||||
},
|
||||
dragEvent() {
|
||||
const offset = this.offset;
|
||||
const dialogHeaderEl = document.querySelector('.falutChooseTitle');
|
||||
const dragDom = document.querySelector('#faultChoose');
|
||||
dialogHeaderEl.style.cursor = 'move';
|
||||
|
||||
/** 获取原有属性 ie dom元素.currentStyle 火狐谷歌 window.getComputedStyle(dom元素, null);*/
|
||||
const sty = dragDom.currentStyle || window.getComputedStyle(dragDom, null);
|
||||
|
||||
dialogHeaderEl.onmousedown = (e) => {
|
||||
/** 鼠标按下，计算当前元素距离可视区的距离*/
|
||||
const disX = e.clientX - dialogHeaderEl.offsetLeft;
|
||||
const disY = e.clientY - dialogHeaderEl.offsetTop;
|
||||
|
||||
/** 获取到的值带px 正则匹配替换*/
|
||||
let styL, styT;
|
||||
|
||||
/** 注意在ie中 第一次获取到的值为组件自带50% 移动之后赋值为px*/
|
||||
if (sty.left.includes('%')) {
|
||||
// eslint-disable-next-line no-useless-escape
|
||||
styL = +document.body.clientWidth * (+sty.left.replace(/\%/g, '') / 100);
|
||||
styT = +document.body.clientHeight * (+sty.top.replace(/\%/g, '') / 100);
|
||||
} else {
|
||||
// eslint-disable-next-line no-useless-escape
|
||||
styL = +sty.left.replace(/\px/g, '');
|
||||
// eslint-disable-next-line no-useless-escape
|
||||
styT = +sty.top.replace(/\px/g, '');
|
||||
}
|
||||
|
||||
document.onmousemove = function (e) {
|
||||
/** 通过事件委托，计算移动的距离*/
|
||||
const l = e.clientX - disX;
|
||||
const t = e.clientY - disY;
|
||||
|
||||
/** 移动当前元素*/
|
||||
// dragDom.style.left = `${l + styL}px`;
|
||||
// dragDom.style.top = `${t + styT}px`;
|
||||
|
||||
/** 移动当前元素*/
|
||||
if (l + styL < 0) {
|
||||
dragDom.style.left = `0px`;
|
||||
} else if (l + styL > document.body.clientWidth - dragDom.clientWidth - 10) {
|
||||
dragDom.style.left = `${document.body.clientWidth - dragDom.clientWidth - 10}px`;
|
||||
} else {
|
||||
dragDom.style.left = `${l + styL}px`;
|
||||
}
|
||||
if (t + styT <= offset) {
|
||||
dragDom.style.top = offset + `px`;
|
||||
} else if (t + styT > document.body.clientHeight - dragDom.clientHeight - 10) {
|
||||
dragDom.style.top = `${document.body.clientHeight - dragDom.clientHeight - 10}px`;
|
||||
} else {
|
||||
dragDom.style.top = `${t + styT}px`;
|
||||
}
|
||||
|
||||
/** 将此时的位置传出去*/
|
||||
// binding.value({ x: e.pageX, y: e.pageY });
|
||||
};
|
||||
|
||||
document.onmouseup = function () {
|
||||
document.onmousemove = null;
|
||||
document.onmouseup = null;
|
||||
};
|
||||
};
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style lang="scss">
|
||||
#faultChoose .card .queryList .el-card .el-card__body .el-table--border .el-table__body-wrapper{
|
||||
height: 135px !important;
|
||||
overflow-y: auto !important;
|
||||
}
|
||||
#faultChoose .el-button--mini {
|
||||
margin-left: 5px;
|
||||
}
|
||||
.triggerFaultListLeft{
|
||||
display: inline-block;
|
||||
float: left;
|
||||
width: 730px;
|
||||
}
|
||||
// 谷歌、safari、qq浏览器、360浏览器滚动条样式
|
||||
// 定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸
|
||||
#faultChoose .el-table__body-wrapper::-webkit-scrollbar {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
// height: 110px;
|
||||
background-color: #FFFFFF;
|
||||
}
|
||||
/*定义滚动条轨道 内阴影+圆角*/
|
||||
#faultChoose .el-table__body-wrapper::-webkit-scrollbar-track {
|
||||
// box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
|
||||
border-radius: 10px;
|
||||
background-color: #FFFFFF;;
|
||||
}
|
||||
/*定义滑块 内阴影+圆角*/
|
||||
#faultChoose .el-table__body-wrapper::-webkit-scrollbar-thumb {
|
||||
border-radius: 10px;
|
||||
// box-shadow: inset 0 0 6px rgba(0,0,0,.3);
|
||||
background-color: #eaeaea;
|
||||
}
|
||||
/*滑块效果*/
|
||||
#faultChoose .el-table__body-wrapper::-webkit-scrollbar-thumb:hover {
|
||||
border-radius: 5px;
|
||||
// box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
|
||||
background: rgba(0,0,0,0.4);
|
||||
}
|
||||
/*IE滚动条颜色*/
|
||||
html {
|
||||
scrollbar-face-color:#bfbfbf;/*滚动条颜色*/
|
||||
scrollbar-highlight-color:#000;
|
||||
scrollbar-3dlight-color:#000;
|
||||
scrollbar-darkshadow-color:#000;
|
||||
scrollbar-Shadow-color:#adadad;/*滑块边色*/
|
||||
scrollbar-arrow-color:rgba(0,0,0,0.4);/*箭头颜色*/
|
||||
scrollbar-track-color:#eeeeee;/*背景颜色*/
|
||||
}
|
||||
</style>
|
||||
<style scoped rel="stylesheet/scss" lang="scss">
|
||||
.triggerFaultInfo{
|
||||
margin-bottom:10px;
|
||||
padding: 10px 10px 10px 15px;
|
||||
}
|
||||
.triggerFaultList{
|
||||
font-size: 14px;
|
||||
margin-top: 10px;
|
||||
line-height: 20px;
|
||||
}
|
||||
.triggerFaultTitle{
|
||||
font-size: 15px;
|
||||
font-weight: bold;
|
||||
}
|
||||
.falutChooseTitle{
|
||||
padding: 15px;
|
||||
cursor: all-scroll;
|
||||
}
|
||||
#faultChoose{
|
||||
width: 1000px;
|
||||
position: absolute;
|
||||
left: 30%;
|
||||
top: 20%;
|
||||
background: #fff;
|
||||
padding:0px 0px 15px 0px;
|
||||
// transform: translate3d(-50%,-50%,0);
|
||||
border-radius: 6px;
|
||||
z-index:999;
|
||||
}
|
||||
.faultChooseFoot{
|
||||
display: inline-block;
|
||||
float: right;
|
||||
margin-right: 20px;
|
||||
margin-top: 20px;
|
||||
}
|
||||
.closeFalutChoose{
|
||||
position: absolute;
|
||||
right: 0px;
|
||||
top: 0px;
|
||||
width: 35px;
|
||||
height: 35px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.closeFalutChooseIn{
|
||||
font-size: 20px;
|
||||
margin-left: 5px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
.targetCard{
|
||||
box-shadow: 0 2px 12px 0 rgba(0,0,0,.1);
|
||||
border-top: 1px #ebeef5 solid;
|
||||
}
|
||||
.targetFormItem{
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
.targetCardHead{
|
||||
padding: 5px;
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
margin-bottom: 10px;
|
||||
border-bottom: 1px #f4f4f4 solid;
|
||||
text-align: right;
|
||||
padding-right: 15px;
|
||||
}
|
||||
</style>
|
||||
@ -1,112 +0,0 @@
|
||||
<template>
|
||||
<el-dialog v-dialogDrag :title="title" :visible.sync="show" width="550px" :before-close="doClose">
|
||||
<el-form ref="form" label-width="120px" :model="formModel" :rules="rules">
|
||||
<el-form-item :label="$t('display.setTime.systemTime')" prop="initTime">
|
||||
<el-time-picker
|
||||
v-model="formModel.initTime"
|
||||
:picker-options="pickerOptions"
|
||||
:placeholder="$t('display.setTime.anyTime')"
|
||||
@change="handleChange"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="hasNumber" :label="$t('display.setTime.loadTrainNum')" prop="loadNum">
|
||||
<el-input-number v-model="formModel.loadNum" :min="1" :max="maxNumber" :label="$t('display.setTime.selectLoadTrainNum')" />
|
||||
<span> {{ ` (${$t('display.setTime.maxTrainNum')} ：${maxNumber}) ` }} </span>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="show = false">{{ $t('global.cancel') }}</el-button>
|
||||
<el-button type="primary" :loading="status" @click="handleSure">{{ $t('global.confirm') }}</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { timestampFormat } from '@/utils/date';
|
||||
import { getLoadTrainNumber } from '@/api/simulation';
|
||||
|
||||
// 计划行车时间选择
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
show: false,
|
||||
formModel: {
|
||||
initTime: new Date(),
|
||||
loadNum: 1
|
||||
},
|
||||
maxNumber: 1,
|
||||
pickerOptions: { selectableRange: '00:00:00 - 23:59:59' },
|
||||
status: false
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
title() {
|
||||
return this.$t('display.setTime.setSimulationSystemTime');
|
||||
},
|
||||
hasNumber() {
|
||||
return this.$route.params.mode == 'demon' && this.$route.query.prdType == '04';
|
||||
},
|
||||
group() {
|
||||
return this.$route.query.group;
|
||||
},
|
||||
rules() {
|
||||
return {
|
||||
initTime: [
|
||||
{ required: true, message: this.$t('display.setTime.selectSystemTime'), trigger: 'change' },
|
||||
{
|
||||
validator(rule, value, callback) {
|
||||
if (this.maxNumber == 0) {
|
||||
callback(new Error(this.$t('display.setTime.selectValidStartTime')));
|
||||
} else {
|
||||
callback();
|
||||
}
|
||||
},
|
||||
trigger: 'change',
|
||||
maxNumber: this.maxNumber
|
||||
}
|
||||
],
|
||||
loadNum: [
|
||||
{ required: true, message: this.$t('display.setTime.selectTrainNum'), trigger: 'change' }
|
||||
|
||||
]
|
||||
};
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
doShow() {
|
||||
this.formModel.initTime = new Date(this.$store.state.training.initTime || null);
|
||||
this.handleChange(this.formModel.initTime);
|
||||
this.show = true;
|
||||
},
|
||||
doClose() {
|
||||
this.status = false;
|
||||
this.show = false;
|
||||
},
|
||||
handleChange(initTime) {
|
||||
this.formModel.loadNum = 0;
|
||||
if (this.hasNumber) {
|
||||
getLoadTrainNumber({ time: timestampFormat('HH:mm:ss', initTime) }, this.group).then(resp => {
|
||||
this.maxNumber = parseInt(resp.data);
|
||||
});
|
||||
}
|
||||
},
|
||||
handleSure() {
|
||||
this.$refs.form.validate((valid) => {
|
||||
if (valid) {
|
||||
this.status = true;
|
||||
const model = {
|
||||
initTime: timestampFormat('HH:mm:ss', this.formModel.initTime),
|
||||
};
|
||||
|
||||
if (this.hasNumber) {
|
||||
model['loadNum'] = this.formModel.loadNum;
|
||||
}
|
||||
|
||||
this.$emit('ConfirmSelectBeginTime', model);
|
||||
this.doClose();
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@ -1,224 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<div v-if="isAllShow&&project != 'bjd'" class="display_top_draft" :style="allStyle">
|
||||
<div class="btn_hover" @click="menuClick">菜单</div>
|
||||
<el-button-group ref="button_group_box" class="button_group_box" :style="`margin-left:-${btnWidth}px`">
|
||||
<el-button v-if="jl3dmodelShow && !isContest && project !== 'bjd'" size="small" @click="jumpjlmap3dmodel">{{ jl3dmodel }}</el-button>
|
||||
<!-- 司机视角 -->
|
||||
<!-- <el-button v-if="$route.query.lineCode === '15'" size="small" type="jumpjlmap3d" @click="jumpjlmap3dDriver">司机视角</el-button> -->
|
||||
<el-button v-if="$route.query.lineCode === '15'" size="small" @click="clCaAnCall">经典案例分析</el-button>
|
||||
<el-button v-if="$route.query.lineCode === '15'" size="small" @click="normStudy">规范学习</el-button>
|
||||
<el-button v-if="$route.query.lineCode === '16'" size="small" @click="showLineBoard">占线板</el-button>
|
||||
</el-button-group>
|
||||
</div>
|
||||
<Jl3dRailway-Device
|
||||
v-if="deviceif"
|
||||
v-show="deviceShow"
|
||||
ref="Jl3dRailwayDevice"
|
||||
:panel-show="deviceShow"
|
||||
@closedevice3dview="jumpjlmap3dmodel"
|
||||
/>
|
||||
<Jl3dRailway-Drive v-show="drivingShow" ref="Jl3dRailwayDrive" :panel-show="drivingShow" @showdriving="showdriving" />
|
||||
<draw-select ref="drawSelect" />
|
||||
<line-board ref="lineBoard" />
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import Jl3dRailwayDevice from '@/views/jlmap3d/railwaydevice/jl3drailwaydevice';
|
||||
import Jl3dRailwayDrive from '@/views/jlmap3d/railwaydrive/jl3drailwaydrive';
|
||||
|
||||
import { getSessionStorage } from '@/utils/auth';
|
||||
import { EventBus } from '@/scripts/event-bus';
|
||||
import { getPostByProjectCode } from '@/api/learn';
|
||||
import { ProjectCode } from '@/scripts/ProjectConfig';
|
||||
import DrawSelect from '@/jmapNew/theme/datie_01/menus/dialog/drawSelect';
|
||||
import LineBoard from './lineBoard';
|
||||
export default {
|
||||
name:'DemonMenu',
|
||||
components:{
|
||||
Jl3dRailwayDevice,
|
||||
Jl3dRailwayDrive,
|
||||
DrawSelect,
|
||||
LineBoard
|
||||
},
|
||||
props:{
|
||||
isAllShow:{
|
||||
type:Boolean,
|
||||
require:true
|
||||
},
|
||||
jl3dmodelShow:{
|
||||
type:Boolean,
|
||||
require:true
|
||||
},
|
||||
jl3dnameShow:{
|
||||
type:Boolean,
|
||||
require:true
|
||||
},
|
||||
cctvShow:{
|
||||
type:Boolean,
|
||||
require:true
|
||||
},
|
||||
trafficplanShow:{
|
||||
type:Boolean,
|
||||
require:true
|
||||
},
|
||||
traffictrainShow:{
|
||||
type:Boolean,
|
||||
require:true
|
||||
},
|
||||
scheduleLoadShow:{
|
||||
type:Boolean,
|
||||
require:true
|
||||
},
|
||||
driverShow:{
|
||||
type:Boolean,
|
||||
require:true
|
||||
},
|
||||
schedulePreviewShow:{
|
||||
type:Boolean,
|
||||
require:true
|
||||
},
|
||||
jlmap3dFaultShow:{
|
||||
type:Boolean,
|
||||
require:true
|
||||
},
|
||||
allStyle:{
|
||||
type:String,
|
||||
default() {
|
||||
return '';
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
hoverBtn: false,
|
||||
btnWidth: 0,
|
||||
group:'',
|
||||
mapId:'',
|
||||
lineCode:'',
|
||||
practiceDisabled:false,
|
||||
deviceif:false,
|
||||
deviceShow: true,
|
||||
drivingShow: false,
|
||||
messageBoard: false,
|
||||
jl3dtrafficplan:this.$t('display.demon.trafficplantext'),
|
||||
jl3dtraffictrain:this.$t('display.demon.traffictraintext'),
|
||||
jl3dpassflow:this.$t('display.demon.passengerflow'),
|
||||
jl3dname: this.$t('display.demon.threeDimensionalView'),
|
||||
jl3dmodel: this.$t('display.demon.deviceView')
|
||||
};
|
||||
},
|
||||
computed:{
|
||||
isDrive() {
|
||||
return this.$route.query.prdType == '04';
|
||||
},
|
||||
project() {
|
||||
return getSessionStorage('project');
|
||||
},
|
||||
isContest() {
|
||||
return this.$route.params.mode === 'demon' && this.project.includes('drts');
|
||||
},
|
||||
running() {
|
||||
return this.$store.state.training.started;
|
||||
},
|
||||
isLocal() { // 是否为本地项目
|
||||
return process.env.VUE_APP_PRO === 'local';
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.group = this.$route.query.group;
|
||||
this.mapId = this.$route.query.mapId;
|
||||
this.lineCode = this.$route.query.lineCode;
|
||||
EventBus.$on('loadScene', () => {
|
||||
this.practiceDisabled = true;
|
||||
});
|
||||
EventBus.$on('quitScene', () => {
|
||||
this.practiceDisabled = false;
|
||||
});
|
||||
if (this.project) {
|
||||
getPostByProjectCode(ProjectCode[this.project]).then(resp => {
|
||||
if (resp.data) {
|
||||
this.messageBoard = true;
|
||||
}
|
||||
}).catch(() => {
|
||||
console.log('获取留言板信息失败');
|
||||
});
|
||||
}
|
||||
|
||||
if (this.$route.query.project == 'zzww') {
|
||||
this.jumpjlmap3dDriver();
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
menuClick() {
|
||||
this.hoverBtn = !this.hoverBtn;
|
||||
if (this.hoverBtn) {
|
||||
this.btnWidth = 600;
|
||||
} else {
|
||||
this.btnWidth = 0;
|
||||
}
|
||||
},
|
||||
clCaAnCall() {
|
||||
this.$refs.drawSelect.doShow(null, 'clCaAn');
|
||||
},
|
||||
normStudy() {
|
||||
this.$refs.drawSelect.doShow(null, 'normStudy');
|
||||
},
|
||||
showLineBoard() {
|
||||
this.$refs.lineBoard.doShow();
|
||||
},
|
||||
jumpjlmap3dmodel() {
|
||||
if (this.deviceif == false) {
|
||||
this.deviceif = true;
|
||||
} else {
|
||||
if (this.deviceShow == false) {
|
||||
this.deviceShow = true;
|
||||
} else {
|
||||
this.deviceShow = false;
|
||||
}
|
||||
}
|
||||
|
||||
},
|
||||
showdriving() {
|
||||
this.drivingShow = false;
|
||||
},
|
||||
jumpjlmap3dDriver() {
|
||||
this.drivingShow = true;
|
||||
this.$refs.Jl3dRailwayDrive.show(this.mapId, this.group);
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.display_top_draft{
|
||||
position: absolute;
|
||||
left: 5px;
|
||||
top: 15px;
|
||||
height: 32px;
|
||||
overflow: hidden;
|
||||
padding-left: 44px;
|
||||
z-index: 35;
|
||||
.btn_hover{
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
z-index: 2;
|
||||
color: #4e4d4d;
|
||||
font-size: 14px;
|
||||
background: #fff;
|
||||
padding: 8px;
|
||||
border-radius: 5px;
|
||||
display: block;
|
||||
cursor: pointer;
|
||||
float: left;
|
||||
height: 32px;
|
||||
}
|
||||
.button_group_box{
|
||||
float: left;
|
||||
transition: all 0.5s;
|
||||
overflow: hidden;
|
||||
margin-left: -700px;
|
||||
// transform: translateX(0px);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,311 +0,0 @@
|
||||
<template>
|
||||
<div
|
||||
v-loading="loading"
|
||||
element-loading-text="玩命初始化中"
|
||||
element-loading-background="rgba(0, 0, 0, 0.5)"
|
||||
class="main"
|
||||
:style="{width: canvasWidth+'px',height:'100%',position:'absolute',overflow:'hidden'}"
|
||||
>
|
||||
<template>
|
||||
<transition name="el-zoom-in-bottom">
|
||||
<map-system-draft ref="mapCanvas" @back="back" />
|
||||
</transition>
|
||||
<menu-demon v-if="isDemon" ref="menuDemon" :offset="offset" :offset-bottom="offsetBottom" :data-error="dataError" :text-status-height="textStatusHeight" @start="start" @end="end" />
|
||||
</template>
|
||||
<menu-system-time ref="menuSystemTime" :offset="offset" :group="group" />
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { getSessionStorage } from '@/utils/auth';
|
||||
import { mapGetters } from 'vuex';
|
||||
import { OperateMode } from '@/scripts/ConstDic';
|
||||
import MapSystemDraft from '@/views/newMap/mapsystemNew/index';
|
||||
import MenuDemon from './menuDemon';
|
||||
import MenuSystemTime from '@/views/newMap/displayCity/menuSystemTime';
|
||||
import { getSimulationInfoNew, ranAsPlan } from '@/api/simulation';
|
||||
import { destroySimulation, initSimulation, getSimulationInfoByGroup } from '@/api/rtSimulation';
|
||||
import { loadMapDataById } from '@/utils/loaddata';
|
||||
import { EventBus } from '@/scripts/event-bus';
|
||||
|
||||
export default {
|
||||
name: 'DisplayDraft',
|
||||
components: {
|
||||
MapSystemDraft,
|
||||
MenuDemon,
|
||||
MenuSystemTime
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
offset: 15,
|
||||
offsetBottom: 15,
|
||||
tipBottom: 0,
|
||||
textStatusHeight: 0,
|
||||
planRunning:false,
|
||||
dataError: false,
|
||||
group:'',
|
||||
loading: false
|
||||
};
|
||||
},
|
||||
computed:{
|
||||
...mapGetters([
|
||||
'canvasWidth'
|
||||
]),
|
||||
mode() {
|
||||
return this.$route.params.mode;
|
||||
},
|
||||
project() {
|
||||
return getSessionStorage('project');
|
||||
},
|
||||
isDemon() {
|
||||
return this.mode === 'demon' && !this.project.includes('drts');
|
||||
},
|
||||
isContest() {
|
||||
return this.mode === 'demon' && this.project.includes('drts');
|
||||
},
|
||||
isExam() {
|
||||
return this.mode === 'exam';
|
||||
},
|
||||
isLesson() {
|
||||
return (this.mode === 'teach' || this.mode === 'manage');
|
||||
},
|
||||
isScript() {
|
||||
return this.mode === 'script';
|
||||
},
|
||||
mapId() {
|
||||
return this.$route.query.mapId;
|
||||
},
|
||||
width() {
|
||||
return this.$store.state.app.width;
|
||||
},
|
||||
height() {
|
||||
return this.$store.state.app.height;
|
||||
}
|
||||
},
|
||||
watch:{
|
||||
'$store.state.socket.permissionOver': function () {
|
||||
this.$alert('用户权限已被收回', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
callback: action => {
|
||||
this.back();
|
||||
}
|
||||
});
|
||||
},
|
||||
'$store.state.config.menuBarLoadedCount': function (val) { // menuBar加载完成
|
||||
this.setPosition();
|
||||
},
|
||||
'$store.state.app.windowSizeCount': function() { // 窗口缩放
|
||||
this.setWindowSize();
|
||||
},
|
||||
'$store.state.training.prdType': function (val) { // 根据权限类型计算高度
|
||||
this.setPosition();
|
||||
if (val == '01') { this.switchModeInner('01'); } else { this.switchModeInner('02'); }
|
||||
},
|
||||
'$store.state.map.mapViewLoadedCount': function (val) { // 地图视图加载完成标识 开始加载默认状态
|
||||
if (this.planRunning) {
|
||||
this.$store.dispatch('training/simulationStart');
|
||||
}
|
||||
},
|
||||
$route() {
|
||||
if (!this.isLesson && !this.isExam) {
|
||||
this.initLoadData();
|
||||
}
|
||||
}
|
||||
},
|
||||
beforeDestroy() {
|
||||
destroySimulation(this.group);
|
||||
this.$store.dispatch('training/reset');
|
||||
// this.$store.dispatch('map/mapClear');
|
||||
},
|
||||
async mounted() {
|
||||
this.setWindowSize();
|
||||
this.initLoadData();
|
||||
},
|
||||
methods:{
|
||||
// 结束加载状态
|
||||
endViewLoading(isSuccess) {
|
||||
if (!isSuccess) {
|
||||
this.$store.dispatch('map/mapClear');
|
||||
}
|
||||
this.$nextTick(() => {
|
||||
EventBus.$emit('viewLoading', false);
|
||||
});
|
||||
},
|
||||
// 仿真错误时，被动退出时调用
|
||||
async back() {
|
||||
if (this.isExam) {
|
||||
await this.$refs.menuExam.back();
|
||||
} else if (this.isLesson) {
|
||||
await this.$refs.lessonMenu.back();
|
||||
} else if (this.isDemon) {
|
||||
await this.$refs.menuDemon.back();
|
||||
} else if (this.isScript) {
|
||||
await this.$refs.menuScript.back();
|
||||
} else if (this.isContest) {
|
||||
await this.$refs.menuDispatherContest.back();
|
||||
}
|
||||
},
|
||||
// 设置各个按钮的定位
|
||||
setPosition() {
|
||||
this.$nextTick(() => {
|
||||
this.offset = 10;
|
||||
this.offsetBottom = 15;
|
||||
const menuBar = document.getElementById('menuBar');
|
||||
const menuTool = document.getElementById('menuTool');
|
||||
const menuBottom = document.getElementById('menuButton');
|
||||
const menuButtonsBox = document.getElementById('menuButtons_box');
|
||||
const textStatus = document.getElementById('textStatus');
|
||||
if (menuBar) {
|
||||
this.offset = (menuBar.offsetHeight || 0) + 15;
|
||||
}
|
||||
if (menuTool) {
|
||||
this.offset = (menuTool.offsetHeight || 0) + 15;
|
||||
}
|
||||
const buttonWidth = this.width - 1200; // B box widht
|
||||
if (menuBottom && buttonWidth < 780) {
|
||||
this.offsetBottom = (menuBottom.offsetHeight || 0) + 15;
|
||||
}
|
||||
if (menuButtonsBox) {
|
||||
this.tipBottom = (menuButtonsBox.offsetHeight || 0) + 15;
|
||||
}
|
||||
if (textStatus) {
|
||||
this.textStatusHeight = textStatus.offsetHeight || 0;
|
||||
textStatus.style.top = this.offset - 15 + 'px';
|
||||
}
|
||||
});
|
||||
},
|
||||
// 缩放设置
|
||||
setWindowSize() {
|
||||
const width = this.width;
|
||||
const height = this.height;
|
||||
this.$store.dispatch('config/resize', { width, height });
|
||||
// this.$store.dispatch('training/updateOffsetStationCode', { offsetStationCode: this.offsetStationCode });
|
||||
},
|
||||
// 初始化
|
||||
initLoadData() {
|
||||
this.group = this.$route.query.group;
|
||||
this.$store.dispatch('training/reset');
|
||||
this.loadSimulationInfo();
|
||||
this.loadMapData();
|
||||
},
|
||||
// 新版地图根据仿真group获取仿真基础信息
|
||||
async loadSimulationInfo() {
|
||||
const resp = await getSimulationInfoByGroup(this.group);
|
||||
if (resp && resp.code == 200 && resp.data) {
|
||||
if (!resp.data.dataError) {
|
||||
this.$store.dispatch('socket/handleSimulationState', resp.data.state);
|
||||
this.$store.dispatch('runPlan/setRunPlanInfo', resp.data.runPlan);
|
||||
this.$store.dispatch('socket/setSimulationSpeed', resp.data.speed);
|
||||
this.planRunning = resp.data.planRunning;
|
||||
if (resp.data.planRunning) {
|
||||
this.$store.commit('training/start');
|
||||
}
|
||||
} else {
|
||||
this.$messageBox('此地图数据正在维护中,无法运行！');
|
||||
}
|
||||
this.dataError = resp.data.dataError;
|
||||
}
|
||||
},
|
||||
// 通过showMode切换显示效果
|
||||
switchModeInner(swch) {
|
||||
// let showMode = '03';
|
||||
// if (swch == '01') {
|
||||
// showMode = '03';
|
||||
// } else if (swch == '02') {
|
||||
// showMode = '02';
|
||||
// }
|
||||
|
||||
const list = [];
|
||||
const mapDevice = this.$store.state.map.mapDevice;
|
||||
for (const key in mapDevice) {
|
||||
list.push(mapDevice[key]);
|
||||
}
|
||||
|
||||
if (swch == '01') {
|
||||
this.$jlmap.updateShowStation(list, this.$store.state.training.centerStationCode); // 显示全部元素
|
||||
} else {
|
||||
this.$jlmap.updateShowStation(list, ''); // 显示全部元素
|
||||
}
|
||||
|
||||
// this.$jlmap.updateShowMode(list, showMode); // 二次过滤
|
||||
},
|
||||
// 加载地图数据
|
||||
loadMapData() {
|
||||
if (parseInt(this.mapId)) {
|
||||
this.$store.dispatch('training/changeOperateMode', { mode: OperateMode.NORMAL }); // 默认为正常模式
|
||||
loadMapDataById(this.mapId, 'simulation');
|
||||
} else {
|
||||
this.endViewLoading();
|
||||
}
|
||||
},
|
||||
start(model) { // 开始仿真
|
||||
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/setInitTime', model.initTime);
|
||||
}).catch(error => {
|
||||
let message = '';
|
||||
switch (error.code) {
|
||||
case '5001':
|
||||
message = this.$t('error.mapDataError');
|
||||
break;
|
||||
case '5002':
|
||||
message = this.$t('error.runningChartDataError');
|
||||
break;
|
||||
case '5003':
|
||||
message = this.$t('error.runningChartIsNotLoaded');
|
||||
break;
|
||||
case '5004':
|
||||
message = this.$t('error.runningDataError');
|
||||
break;
|
||||
case '5000':
|
||||
message = this.$t('error.systemError');
|
||||
break;
|
||||
case '4000':
|
||||
message = this.$t('error.simulationDoesNotExist');
|
||||
break;
|
||||
case '4001':
|
||||
message = this.$t('error.simulationOperationIsNotDefined');
|
||||
break;
|
||||
case '4002':
|
||||
message = this.$t('error.simulationOperationProcessingMethodNotFound');
|
||||
break;
|
||||
case '4003':
|
||||
message = this.$t('error.simulationOperationFailed');
|
||||
break;
|
||||
case '4004':
|
||||
message = this.$t('error.operationConflict');
|
||||
break;
|
||||
default:
|
||||
message = '按计划行车异常,请退出重试!';
|
||||
// this.$messageBox('按计划行车异常,请退出重试!');
|
||||
break;
|
||||
}
|
||||
this.$messageBox(message + '，' + this.$t('error.startSimulationFailed'));
|
||||
});
|
||||
},
|
||||
end() {
|
||||
this.loading = true;
|
||||
initSimulation(this.group).then(() => {
|
||||
this.$store.dispatch('training/over').then(() => {
|
||||
this.$store.dispatch('training/setMapDefaultState').then(() => {
|
||||
this.$store.dispatch('map/clearJlmapTrainView');
|
||||
this.$store.dispatch('map/resetActiveTrainList', false);
|
||||
this.$store.dispatch('map/setTrainWindowShow', false);
|
||||
this.$store.dispatch('map/initSimulationButton');
|
||||
});
|
||||
});
|
||||
setTimeout(() => {
|
||||
this.loading = false;
|
||||
}, 1500);
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.$messageBox(this.$t('display.demon.endSimulationFail'));
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@ -1,663 +0,0 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
title="车站股道图"
|
||||
:visible="dialogVisible"
|
||||
width="99%"
|
||||
z-index="3000"
|
||||
top="5vh"
|
||||
class="lineBoard"
|
||||
center
|
||||
:before-close="handleClose"
|
||||
>
|
||||
<div style="height: 500px; overflow-y: auto;background: #DFE3E6;padding: 7px;">
|
||||
<div style="width: 100%;display: flex;align-items: center;margin-bottom: 10px;">
|
||||
<div
|
||||
v-for="item in showStationList"
|
||||
:key="item.code"
|
||||
class="tab-box"
|
||||
:style="{background: selectCode === item.code ? '#F1F1F1': '#DBDBDB', color: selectCode === item.code ? '#000': '#ccc'}"
|
||||
@click="selectStandCode(item.code)"
|
||||
>
|
||||
{{ item.name }}
|
||||
</div>
|
||||
</div>
|
||||
<div v-for="item in trackList" :key="item.id" style="display: flex; justify-content: space-between;border-top: 1px solid #fff;padding: 3px;height: 36px;align-items: center;" :style="{background: item.oddNumber? '#BAC4CF':'#D2D8DB'}">
|
||||
<!--<div
|
||||
style="padding: 5px 20px;border-radius: 5px;border-width: 2px;border-style: solid;width: 120px;"
|
||||
:style="{borderColor: item.occupied ? '#f00': '#DFE3E6', fontWeight: item.occupied? 'bold': 'normal', color:item.occupied? '#f00':'#1e2024' }"
|
||||
>{{ item.trackName }}</div>-->
|
||||
<div style="width: 150px;display: flex;">
|
||||
<el-dropdown v-show="item.showTrack" trigger="click">
|
||||
<div
|
||||
style="width: 110px;padding: 5px 20px;border-radius: 5px;border-width: 2px;border-style: solid;display: flex;justify-content: space-between;background: #fff;"
|
||||
:style="{borderColor: item.occupied ? '#f00': '#DFE3E6', fontWeight: item.occupied? 'bold': 'normal', color:item.occupied? '#f00':'#1e2024' }"
|
||||
>
|
||||
<span>{{ item.trackName }}</span>
|
||||
<i class="el-icon-caret-bottom" />
|
||||
</div>
|
||||
<el-dropdown-menu slot="dropdown">
|
||||
<el-dropdown-item>黄金糕</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</el-dropdown>
|
||||
<div v-show="item.showTrack" style="width: 30px;height: 30px;background: #fff;border-radius: 5px;margin-left: 5px;" />
|
||||
</div>
|
||||
<div v-show="!item.noData" style="width: 80px;color: #f00;font-weight: bolder;">{{ item.tripNumber }}</div>
|
||||
<div v-show="!item.noData" style="background: #FFCBEC;border: 1px solid #315FD1;border-radius: 3px;font-size: 10px;width: 15px;" :style="{borderColor:item.trainType?'#315FD1':'#DFE3E6'}">{{ item.trainType?'客':'客' }}</div>
|
||||
<div v-show="!item.noData" style="width: 60px;">{{ item.trainDistanceInfo }}</div>
|
||||
<div v-show="!item.noData" style="width: 120px;">
|
||||
<el-select v-model="item.process" placeholder="请选择" size="mini" style="width: 120px;" :disabled="true">
|
||||
<el-option
|
||||
v-for="elem in sectionStatusList"
|
||||
:key="elem.value"
|
||||
:label="elem.label"
|
||||
:value="elem.value"
|
||||
/>
|
||||
</el-select>
|
||||
</div>
|
||||
<div v-show="!item.noData" style="display: flex;width: 300px;">
|
||||
<div v-show="item.receivingRouteCode" :style="{ background: item.receivingNotice ? '#29CA42': '#ccc' }" class="button-box-fir" @click="doShowRecDep(item,'rec')">接预</div>
|
||||
<div
|
||||
v-show="item.receivingRouteCode"
|
||||
class="button-box-sec"
|
||||
:style="{ background: handleBackground(item.receivingRouteLock, item.receivingRouteAutoTrigger) }"
|
||||
@contextmenu="popMenuShow(item, 'rec' ,$event)"
|
||||
@click="doShowRoute(item, 'rec')"
|
||||
>
|
||||
{{ '接路' + (item.receivingRouteLock ? '':getRouteName(item.receivingRouteCode)) }}
|
||||
</div>
|
||||
<div v-show="item.receivingRouteCode" :style="{ background: item.arrive ? '#29CA42': '#ccc' }" class="button-box-fir" style="margin-left: 10px;cursor: default;" @click="doShowRecDep(item, 'arrive')">到点</div>
|
||||
</div>
|
||||
<div v-show="!item.noData" style="width: 120px;color: #f00;">
|
||||
<el-row><div>{{ item.arriveTime || '-' }}</div></el-row>
|
||||
<el-row><div>{{ item.departureTime|| '-' }}</div></el-row>
|
||||
</div>
|
||||
<div v-show="!item.noData" style="width: 120px;color: #f00;font-style:italic;">
|
||||
<el-row><div>{{ item.planArriveTime|| '-' }}</div></el-row>
|
||||
<el-row><div>{{ item.planDepartureTime || '-' }}</div></el-row>
|
||||
</div>
|
||||
<div v-show="!item.noData" style="width: 150px;color: #f00;">
|
||||
<el-row>{{ item.receivingDirection||'-' }}</el-row>
|
||||
<el-row>{{ item.departureDirection||'-' }}</el-row>
|
||||
</div>
|
||||
<div /><!--起点--终点-->
|
||||
<div v-show="!item.noData" style="display: flex;width: 300px;">
|
||||
<div v-show="item.departureRouteCode" :style="{ background: item.departureNotice ? '#29CA42': '#ccc' }" class="button-box-fir" @click="doShowRecDep(item,'dep')">发预</div>
|
||||
<div
|
||||
v-show="item.departureRouteCode"
|
||||
class="button-box-sec"
|
||||
:style="{ background: handleBackground(item.departureRouteLock, item.departureRouteAutoTrigger) }"
|
||||
@contextmenu="popMenuShow(item, 'dep' ,$event)"
|
||||
@click="doShowRoute(item, 'dep')"
|
||||
>
|
||||
{{ '发路' + (item.departureRouteLock ? '':getRouteName(item.departureRouteCode)) }}
|
||||
</div>
|
||||
<div v-show="item.departureRouteCode" :style="{ background: item.departure ? '#29CA42': '#ccc' }" class="button-box-fir" style="margin-left: 10px;cursor: default;" @click="doShowRecDep(item, 'departure')">发点</div>
|
||||
</div>
|
||||
<div v-show="!item.noData" style="width: 80px;color: #f00;font-weight: bolder;">{{ item.tripNumber }}</div>
|
||||
<div style="width: 120px" :style="{fontWeight: item.occupied? 'bold': 'normal', color:item.occupied? '#f00': '#1e2024' }">{{ item.showTrack ? item.trackName: '' }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="background: #DFE3E6;">
|
||||
<div style="padding: 5px;text-align: center;width: 700px;margin: 0 auto;">
|
||||
<div style="background: #999EA7;display: flex;align-items: center;">
|
||||
<div class="button-box">
|
||||
<img :src="arrowPic" class="img-button">
|
||||
</div>
|
||||
<div class="button-box">
|
||||
<img :src="controlPanelPic" class="img-button">
|
||||
</div>
|
||||
<div class="button-box">
|
||||
<img :src="t3Pic" class="img-button">
|
||||
</div>
|
||||
<div class="button-box">
|
||||
<img :src="panelPic" class="img-button">
|
||||
</div>
|
||||
<div class="button-box">
|
||||
<img :src="trainPic" class="img-button">
|
||||
</div>
|
||||
<div class="button-box">
|
||||
<img :src="linkPic" class="img-button">
|
||||
</div>
|
||||
<div class="button-box">
|
||||
<img :src="cameraPic" class="img-button">
|
||||
</div>
|
||||
<div style="width: 270px;height: 36px; background: #fff;border-radius: 5px;" />
|
||||
<div class="button-box">
|
||||
<img :src="unknowPic" class="img-button">
|
||||
</div>
|
||||
<div class="button-box">
|
||||
<div class="img-button">签</div>
|
||||
</div>
|
||||
<div class="button-box">
|
||||
<div class="img-button">令</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="display: flex;margin-top: 5px;justify-content: space-around;background: #DEE2E5;">
|
||||
<div style="width: 49%;margin-top: 10px;">
|
||||
<div style="display: flex;align-items: center;">
|
||||
<div style="background: #0f0;">{{ `进路序列模式：<${readOnlyMap[selectCode1] ? '只读':'可修改'}>` }}</div>
|
||||
<el-button size="mini" style="padding: 7px 4px;" disabled>修改申请</el-button>
|
||||
<el-button size="mini" style="padding: 7px 4px;" disabled>只读申请</el-button>
|
||||
<el-button size="mini" style="padding: 7px 4px;margin-left: 30px;">查找列车</el-button>
|
||||
<el-input v-model="searchTrain" style="width: 70px;height: 25px;" size="mini" />
|
||||
<div style="margin-left: 10px;">上下行</div>
|
||||
<el-select v-model="andDown" size="mini" style="width: 80px;margin-left: 5px;">
|
||||
<el-option
|
||||
v-for="item in andDownList"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
<div style="margin-left: 10px;">接车口</div>
|
||||
<el-select v-model="andDown" size="mini" style="width: 100px;margin-left: 5px;" disabled>
|
||||
<el-option
|
||||
v-for="item in andDownList"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
<div style="margin-left: 10px;">发车口</div>
|
||||
<el-select v-model="andDown" size="mini" style="width: 100px;margin-left: 5px;" disabled>
|
||||
<el-option
|
||||
v-for="item in andDownList"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</div>
|
||||
<el-table
|
||||
:data="sequenceList"
|
||||
style="width: 100%;margin-top: 10px;"
|
||||
highlight-current-row
|
||||
:row-style="{ background: '#ff0' }"
|
||||
height="180"
|
||||
:default-sort="{prop: 'startTime', order: 'ascending'}"
|
||||
border
|
||||
>
|
||||
<el-table-column width="50" label="序号" align="center">
|
||||
<template slot-scope="scope">
|
||||
<!--:style="{ background: scope.$index? '#f00':'#ff0' }" -->
|
||||
<div>{{ scope.$index }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column property="date" label="注意确认" />
|
||||
<el-table-column property="tripNumber" label="车次" />
|
||||
<el-table-column property="trackName" label="股道" />
|
||||
<el-table-column property="autoTrigger" label="自触">
|
||||
<template slot-scope="scope">
|
||||
<div style="width: 100%;height: 22px;" @contextmenu="popMenuShow(scope.row, '' ,$event)">{{ scope.row.autoTrigger? '√':'' }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column property="departure" label="类型">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.departure ? '发车':'接车' }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column property="status" label="状态">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ getRouteStatus(scope.row.status) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column property="startTime" label="开始时间" />
|
||||
<el-table-column property="planTime" label="计划时间" />
|
||||
<el-table-column property="direction" label="方向" />
|
||||
<el-table-column property="routeCode" label="序列描述">
|
||||
<template slot-scope="scope">
|
||||
<div>{{ getRouteName(scope.row.routeCode) }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<div style="width: 100%;display: flex;align-items: center;margin: 5px 0;">
|
||||
<div
|
||||
v-for="item in showStationList"
|
||||
:key="item.code"
|
||||
class="tab-box"
|
||||
:style="{background: selectCode1 === item.code ? '#F1F1F1': '#DBDBDB', color: selectCode1 === item.code ? '#000': '#ccc'}"
|
||||
@click="selectStandCode1(item.code)"
|
||||
>
|
||||
{{ item.name }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="width: 49%;margin-top: 10px;">
|
||||
<div style="display: flex;align-items: center;">
|
||||
<el-select v-model="unknow" size="mini" disabled>
|
||||
<el-option
|
||||
v-for="item in unknowList"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
<div>调机-J101</div>
|
||||
<el-button size="mini" disabled>进路预览</el-button>
|
||||
<el-select v-model="unknow1" size="mini" disabled>
|
||||
<el-option
|
||||
v-for="item in unknowList1"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
<el-button size="mini" disabled>办理进路</el-button>
|
||||
<el-button size="mini" disabled>发送机车</el-button>
|
||||
</div>
|
||||
<el-table
|
||||
:data="tableData1"
|
||||
style="width: 100%;margin-top: 10px;"
|
||||
highlight-current-row
|
||||
border
|
||||
height="180"
|
||||
>
|
||||
<el-table-column type="index" width="50" label="勾" />
|
||||
<el-table-column property="line" label="线路" />
|
||||
<el-table-column property="method" label="方法" />
|
||||
<el-table-column property="nums" label="辆数" />
|
||||
<el-table-column property="direction" label="方向" />
|
||||
<el-table-column property="leadWire" label="牵出线" />
|
||||
<el-table-column property="status" label="状态" />
|
||||
<el-table-column property="leadRoute" label="牵出进路" />
|
||||
<el-table-column property="pushRoute" label="推入进路" />
|
||||
<el-table-column property="note" label="记事" />
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
<rec-dep ref="recDep" />
|
||||
<route-selection ref="routeSelection" />
|
||||
<pop-menu ref="popMenu" :menu="menu" style="background: #DFE3E6;" />
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapGetters } from 'vuex';
|
||||
import ArrowPic from '@/assets/datie/arrow.png';
|
||||
import PicT3 from '@/assets/datie/picT3.png';
|
||||
import ControlPanelPic from '@/assets/datie/controlPanel.png';
|
||||
import ControlPanel2Pic from '@/assets/datie/controlPanel2.png';
|
||||
import RecDep from '@/jmapNew/theme/datie_02/menus/dialog/recDep';
|
||||
import RouteSelection from '@/jmapNew/theme/datie_02/menus/dialog/routeSelection1';
|
||||
import PopMenu from '@/components/PopMenu';
|
||||
import { menuOperate, commitOperate} from '@/jmapNew/theme/components/utils/menuOperate';
|
||||
import T3Pic from '@/assets/ctc_icon/t3.png';
|
||||
import TrainPic from '@/assets/ctc_icon/train.png';
|
||||
import PanelPic from '@/assets/ctc_icon/panel.png';
|
||||
import LinkPic from '@/assets/ctc_icon/link.png';
|
||||
import CameraPic from '@/assets/ctc_icon/camera.png';
|
||||
import UnknowPic from '@/assets/ctc_icon/unknow.png';
|
||||
export default {
|
||||
name: 'LineBoard',
|
||||
components: {
|
||||
RecDep,
|
||||
RouteSelection,
|
||||
PopMenu
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
menu: [{label: '设置自触', handler: this.setTrigger, disabled: false}, {label: '取消自触', handler: this.cancelTrigger, disabled: false}],
|
||||
dialogVisible: false,
|
||||
triggerParam: {},
|
||||
selectCode: '',
|
||||
selectCode1: '',
|
||||
arrowPic: ArrowPic,
|
||||
picT3: PicT3,
|
||||
controlPanelPic: ControlPanelPic,
|
||||
controlPanel2Pic: ControlPanel2Pic,
|
||||
t3Pic: T3Pic,
|
||||
panelPic: PanelPic,
|
||||
trainPic: TrainPic,
|
||||
linkPic: LinkPic,
|
||||
cameraPic: CameraPic,
|
||||
unknowPic: UnknowPic,
|
||||
searchTrain: '',
|
||||
andDown: 'all',
|
||||
unknow: '',
|
||||
unknow1: '',
|
||||
tableData1: [],
|
||||
unknowList1: [{label: '全部机车', value: 'all'}],
|
||||
unknowList: [{label: 'J101-执行中', value: 'J101'}],
|
||||
andDownList: [{ label: '全部', value: 'all' }, { label: '上行', value: 'up' }, { label: '下行', value: 'down' }],
|
||||
sectionStatusList: [
|
||||
{label: '办理接车闭塞', value: 'RECEIVING_BLOCK'},
|
||||
{label: '准备接车', value: 'RECEIVING'},
|
||||
{label: '办理接车进路', value: 'RECEIVING_ROUTE'},
|
||||
{label: '列车到达（通过）报点', value: 'ARRIVE'},
|
||||
{label: '办理发车闭塞', value: 'DEPARTURE_BLOCK'},
|
||||
{label: '发车进路办理', value: 'DEPARTURE_ROUTE'},
|
||||
{label: '发车报点', value: 'DEPARTURE'},
|
||||
{label: '流程终止', value: 'FINISH'}
|
||||
],
|
||||
sequenceMap: {},
|
||||
sequenceList: [],
|
||||
readOnlyMap: {},
|
||||
standTrackSectionMap: {},
|
||||
trackList: [],
|
||||
showStationList: []
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapGetters('map', [
|
||||
'sectionList',
|
||||
'stationList'
|
||||
])
|
||||
},
|
||||
watch: {
|
||||
'$store.state.socket.simulationReset': function (val) {
|
||||
this.sequenceMap = {};
|
||||
this.sequenceList = [];
|
||||
this.readOnlyMap = {};
|
||||
this.standTrackSectionMap = {};
|
||||
this.trackList = [];
|
||||
this.sectionList.forEach(item => {
|
||||
if (item.standTrack) {
|
||||
this.standTrackSectionMap[item.code] = { trackName: item.name, occupied: false, belongStation:item.belongStation, lineMap: {}};
|
||||
}
|
||||
});
|
||||
},
|
||||
'$store.state.socket.railCtcStatusMsg': function (val) {
|
||||
if (val && val.length) {
|
||||
val.forEach(item => {
|
||||
if (item && item.routeSequence && item.routeSequence.lines && item.routeSequence.lines.length) {
|
||||
item.routeSequence.lines.forEach(elem => {
|
||||
if (!this.sequenceMap[elem.id]) {
|
||||
this.sequenceMap[elem.id] = Object.assign(elem, { stationCode: item.stationCode, readOnly: item.readOnly });
|
||||
} else {
|
||||
this.sequenceMap[elem.id] = Object.assign(this.sequenceMap[elem.id], elem, { stationCode: item.stationCode, readOnly: item.readOnly });
|
||||
}
|
||||
});
|
||||
this.readOnlyMap[item.stationCode] = item.readOnly;
|
||||
}
|
||||
if (item && item.routeSequence && item.routeSequence.deletedLineIds && item.routeSequence.deletedLineIds.length) {
|
||||
item.routeSequence.deletedLineIds.forEach(elem => {
|
||||
delete this.sequenceMap[elem];
|
||||
});
|
||||
}
|
||||
if (item && item.trackView && item.trackView.trackLineMap) {
|
||||
for (const key in item.trackView.trackLineMap) {
|
||||
if (this.standTrackSectionMap[key] && item.trackView.trackLineMap[key]) {
|
||||
for (const trainCode in item.trackView.trackLineMap[key]) {
|
||||
if (this.standTrackSectionMap[key].lineMap[trainCode]) {
|
||||
Object.assign(this.standTrackSectionMap[key].lineMap[trainCode], item.trackView.trackLineMap[key][trainCode]);
|
||||
} else { this.standTrackSectionMap[key].lineMap[trainCode] = item.trackView.trackLineMap[key][trainCode]; }
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
if (item && item.trackView && item.trackView.deletedMap) {
|
||||
for (const key in item.trackView.deletedMap) {
|
||||
if (this.standTrackSectionMap[key] && item.trackView.deletedMap[key] && item.trackView.deletedMap[key].length) {
|
||||
const sectionMap = this.standTrackSectionMap[key].lineMap;
|
||||
item.trackView.deletedMap[key].forEach(trainCode => {
|
||||
delete sectionMap[trainCode];
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
if (item && item.trackView && item.trackView.sectionOccupiedMap) {
|
||||
for (const key in item.trackView.sectionOccupiedMap) {
|
||||
if (this.standTrackSectionMap[key]) {
|
||||
this.standTrackSectionMap[key].occupied = item.trackView.sectionOccupiedMap[key];
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
this.sequenceList = [];
|
||||
for (const key in this.sequenceMap) {
|
||||
if (this.sequenceMap[key].stationCode === this.selectCode1) {
|
||||
this.sequenceList.push(this.sequenceMap[key]);
|
||||
}
|
||||
}
|
||||
this.trackList = [];
|
||||
let oddNumber = true;
|
||||
for (const key in this.standTrackSectionMap) {
|
||||
if (this.standTrackSectionMap[key].belongStation === this.selectCode) {
|
||||
if ( JSON.stringify(this.standTrackSectionMap[key].lineMap) !== '{}') {
|
||||
let flag = true;
|
||||
const lineMap = this.standTrackSectionMap[key].lineMap;
|
||||
for (const item in lineMap) {
|
||||
this.trackList.push(Object.assign({}, lineMap[item], { trackName: this.standTrackSectionMap[key].trackName, occupied: this.standTrackSectionMap[key].occupied, oddNumber: oddNumber, showTrack: flag }));
|
||||
flag = false;
|
||||
}
|
||||
oddNumber = !oddNumber;
|
||||
} else {
|
||||
this.trackList.push({trackName: this.standTrackSectionMap[key].trackName, occupied: this.standTrackSectionMap[key].occupied, noData: true, oddNumber: oddNumber, showTrack: true});
|
||||
oddNumber = !oddNumber;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
'$store.state.map.mapDataLoadedCount': function (val) { // 地图数据加载完成
|
||||
this.sectionList.forEach(item => {
|
||||
if (item.standTrack) {
|
||||
this.standTrackSectionMap[item.code] = { trackName: item.name, occupied: false, belongStation:item.belongStation, lineMap: {}};
|
||||
}
|
||||
});
|
||||
},
|
||||
'$store.state.map.showCentralizedStationCode': function (val) {
|
||||
this.initShowStationList(val);
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
},
|
||||
methods: {
|
||||
handleClose() {
|
||||
this.dialogVisible = false;
|
||||
},
|
||||
initShowStationList(val) {
|
||||
if (val) {
|
||||
const centralizedStation = this.$store.getters['map/getDeviceByCode'](val);
|
||||
const sn = centralizedStation.sn;
|
||||
this.showStationList = [centralizedStation];
|
||||
this.stationList.forEach(station => {
|
||||
if (station.sn === sn - 1) {
|
||||
this.showStationList.unshift(station);
|
||||
} else if (station.sn === sn + 1) {
|
||||
this.showStationList.push(station);
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
doShow() {
|
||||
this.dialogVisible = true;
|
||||
this.initShowStationList(this.$store.state.map.showCentralizedStationCode);
|
||||
if (this.showStationList && this.showStationList.length) {
|
||||
this.selectStandCode(this.$store.state.map.showCentralizedStationCode);
|
||||
this.selectStandCode1(this.$store.state.map.showCentralizedStationCode);
|
||||
}
|
||||
},
|
||||
selectStandCode(code) {
|
||||
this.selectCode = code;
|
||||
this.trackList = [];
|
||||
let oddNumber = true;
|
||||
for (const key in this.standTrackSectionMap) {
|
||||
if (this.standTrackSectionMap[key].belongStation === this.selectCode) {
|
||||
if ( JSON.stringify(this.standTrackSectionMap[key].lineMap) !== '{}') {
|
||||
let flag = true;
|
||||
const lineMap = this.standTrackSectionMap[key].lineMap;
|
||||
for (const item in lineMap) {
|
||||
this.trackList.push(Object.assign({}, lineMap[item], { trackName: this.standTrackSectionMap[key].trackName, occupied: this.standTrackSectionMap[key].occupied, oddNumber: oddNumber, showTrack: flag }));
|
||||
flag = false;
|
||||
}
|
||||
oddNumber = !oddNumber;
|
||||
} else {
|
||||
this.trackList.push({trackName: this.standTrackSectionMap[key].trackName, occupied: this.standTrackSectionMap[key].occupied, noData: true, oddNumber: oddNumber, showTrack: true});
|
||||
oddNumber = !oddNumber;
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
getRouteStatus(status) {
|
||||
if (status === '2') {
|
||||
return '触发完成';
|
||||
} else if (status === '1') {
|
||||
return '正在触发';
|
||||
} else {
|
||||
return '等待中';
|
||||
}
|
||||
},
|
||||
selectStandCode1(code) {
|
||||
this.selectCode1 = code;
|
||||
this.sequenceList = [];
|
||||
for (const key in this.sequenceMap) {
|
||||
if (this.sequenceMap[key].stationCode === this.selectCode1) {
|
||||
this.sequenceList.push(this.sequenceMap[key]);
|
||||
}
|
||||
}
|
||||
},
|
||||
getRouteName(code) {
|
||||
if (code) {
|
||||
const route = this.$store.state.map.routeData[code];
|
||||
return route ? route.name : '';
|
||||
} else { return ''; }
|
||||
},
|
||||
handleBackground(flag, trigger) {
|
||||
if (flag) {
|
||||
return '#29CA42';
|
||||
} else {
|
||||
return trigger ? '#FFBF2F' : '#CCCCCC';
|
||||
}
|
||||
},
|
||||
doShowRecDep(row, type) {
|
||||
this.$refs.recDep.doShow(row, type, this.selectCode);
|
||||
},
|
||||
doShowRoute(row, type) {
|
||||
this.$refs.routeSelection.doShow(row, type, this.selectCode);
|
||||
},
|
||||
popMenuShow(item, type, e) {
|
||||
if (type === 'rec') {
|
||||
this.menu[0].disabled = item.receivingRouteAutoTrigger;
|
||||
this.menu[1].disabled = !item.receivingRouteAutoTrigger;
|
||||
this.triggerParam = { stationCode: this.selectCode, tripNumber: item.tripNumber, routeCode: item.receivingRouteCode };
|
||||
} else if (type === 'dep') {
|
||||
this.menu[0].disabled = item.departureRouteAutoTrigger;
|
||||
this.menu[1].disabled = !item.departureRouteAutoTrigger;
|
||||
this.triggerParam = { stationCode: this.selectCode, tripNumber: item.tripNumber, routeCode: item.departureRouteCode };
|
||||
} else {
|
||||
this.menu[0].disabled = item.autoTrigger;
|
||||
this.menu[1].disabled = !item.autoTrigger;
|
||||
this.triggerParam = { stationCode: this.selectCode1, tripNumber: item.tripNumber, routeCode: item.routeCode };
|
||||
}
|
||||
this.$refs.popMenu.resetShowPosition({x: e.x, y:e.y});
|
||||
},
|
||||
setTrigger() {
|
||||
const param = { ...this.triggerParam, trigger: true };
|
||||
commitOperate(menuOperate.CTC.autoTrigger, param, 3).then(({valid, operate})=>{
|
||||
this.loading = false;
|
||||
this.triggerParam = {};
|
||||
if (valid) {
|
||||
this.doClose();
|
||||
this.$message.success('设置自动触发成功！');
|
||||
}
|
||||
}).catch((e) => {
|
||||
console.error(e);
|
||||
this.loading = false;
|
||||
this.doClose();
|
||||
this.triggerParam = {};
|
||||
this.$refs.noticeInfo.doShow();
|
||||
});
|
||||
},
|
||||
cancelTrigger() {
|
||||
const param = { ...this.triggerParam, trigger: false };
|
||||
commitOperate(menuOperate.CTC.autoTrigger, param, 3).then(({valid, operate})=>{
|
||||
this.triggerParam = {};
|
||||
if (valid) {
|
||||
this.$message.success('取消自动触发成功！');
|
||||
}
|
||||
}).catch((e) => {
|
||||
console.error(e);
|
||||
this.triggerParam = {};
|
||||
this.$message.error('取消自动触发失败！');
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
/deep/ .el-dialog__header{
|
||||
background: #B4B6B9;
|
||||
}
|
||||
/deep/ .el-dialog__body{
|
||||
background: #8D939D;
|
||||
padding: 10px;
|
||||
}
|
||||
/deep/ .el-table td{
|
||||
padding: 0;
|
||||
}
|
||||
/deep/ .el-table th{
|
||||
padding: 0;
|
||||
background: #C5CBD0;
|
||||
color: #1e2024;
|
||||
}
|
||||
/deep/ .el-input.is-disabled .el-input__inner {
|
||||
color: #606266;
|
||||
}
|
||||
.img-box {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 4px;
|
||||
margin: 10px 5px 5px 5px;
|
||||
background: #FAFAFA;
|
||||
}
|
||||
.tab-box {
|
||||
padding: 5px;
|
||||
text-align: center;
|
||||
width: 33% ;
|
||||
font-size: 18px;
|
||||
border: 2px solid #F5F5F5;
|
||||
cursor: pointer;
|
||||
border-radius: 5px;
|
||||
margin-left: 5px;
|
||||
}
|
||||
.button-box-sec{
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 4px;
|
||||
font-size: 14px;
|
||||
background: #ccc;
|
||||
padding: 5px;
|
||||
cursor: pointer;
|
||||
margin-left: 10px;
|
||||
width: 160px;
|
||||
text-align: center;
|
||||
}
|
||||
.button-box-fir{
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 4px;
|
||||
font-size: 14px;
|
||||
background: #ccc;
|
||||
padding: 5px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.pop-background {
|
||||
background: #DFE3E6;
|
||||
}
|
||||
.img-button{
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
background: #EBEBEB;
|
||||
border: 2px inset #fff;
|
||||
border-radius: 5px;
|
||||
line-height: 27px;
|
||||
}
|
||||
.img-button:hover{
|
||||
border: 2px outset #fff;
|
||||
}
|
||||
.img-button:active{
|
||||
border: 2px outset #fff;
|
||||
}
|
||||
.button-box{
|
||||
padding: 3px;
|
||||
background: #EBEBEB;
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
border-radius: 5px;
|
||||
margin: 3px;
|
||||
cursor: pointer;
|
||||
}
|
||||
</style>
|
||||
@ -1,342 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<demon-menu
|
||||
ref="demonMenu"
|
||||
:is-all-show="!dataError"
|
||||
:jl3dmodel-show="isShow3dmodel && !isShowScheduling && !isDrive"
|
||||
:jl3dname-show="!isShowScheduling&&!isDrive"
|
||||
:cctv-show="!isShowScheduling"
|
||||
:trafficplan-show="!isShowScheduling"
|
||||
:schedule-load-show="isShowScheduling && !runing"
|
||||
:schedule-preview-show="isShowScheduling && runing"
|
||||
:jlmap3d-fault-show="false"
|
||||
:driver-show="isDrive"
|
||||
:all-style="'top:'+(offset+textStatusHeight)+'px'"
|
||||
/>
|
||||
|
||||
<menu-schema
|
||||
ref="menuSchema"
|
||||
:offset="offset"
|
||||
:data-error="dataError"
|
||||
:offset-bottom="offsetBottom"
|
||||
/>
|
||||
|
||||
<div class="display-draft" :class="{'haerbin_btn_box': $route.query.lineCode == '07'||$route.query.lineCode == '14'}" :style="{bottom: offsetBottom + 'px'}">
|
||||
<el-button-group class="button-group-box">
|
||||
<template v-if="!dataError">
|
||||
<template v-if="!projectDevice">
|
||||
<el-button v-if="simulationPause" v-loading="pauseLoading" type="primary" size="small" @click="start">开始</el-button>
|
||||
<el-button v-if="!simulationPause" v-loading="pauseLoading" type="warning" size="small" @click="pause">暂停</el-button>
|
||||
<el-button type="danger" size="small" @click="end">{{ $t('display.demon.initialize') }}</el-button>
|
||||
</template>
|
||||
</template>
|
||||
<el-button v-if="project !='bjd'" type="primary" size="small" @click="back">{{ projectDevice || project === 'wjls'?'退出':$t('display.demon.back') }}</el-button>
|
||||
</el-button-group>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
|
||||
<!-- 单人仿真 -->
|
||||
<script>
|
||||
import DemonMenu from './demonMenu';
|
||||
import { Notification } from 'element-ui';
|
||||
import MenuSchema from '@/views/newMap/displayCity/menuSchema';
|
||||
import { getGoodsTryUse } from '@/api/management/goods';
|
||||
import {clearSimulation } from '@/api/simulation';
|
||||
import { PermissionType } from '@/scripts/ConstDic';
|
||||
import { getCountTime } from '@/utils/index';
|
||||
import { TrainingMode } from '@/scripts/ConstDic';
|
||||
// import { quitScriptNew } from '@/api/simulation';
|
||||
import { setGoodsTryUse } from '@/api/management/goods';
|
||||
// import {loadScriptNew } from '@/api/simulation';
|
||||
import StatusIcon from '@/views/components/StatusIcon/statusIcon';
|
||||
import { simulationPause, simulationStart } from '../../../api/rtSimulation';
|
||||
// import Vue from 'vue';
|
||||
import { getSessionStorage } from '@/utils/auth';
|
||||
import { destroySimulation } from '@/api/rtSimulation';
|
||||
// import { EventBus } from '@/scripts/event-bus';
|
||||
|
||||
export default {
|
||||
name: 'MenuDemon',
|
||||
components: {
|
||||
MenuSchema,
|
||||
DemonMenu,
|
||||
StatusIcon
|
||||
},
|
||||
props: {
|
||||
offset: {
|
||||
type: Number,
|
||||
required: true
|
||||
},
|
||||
offsetBottom: {
|
||||
type: Number,
|
||||
required: true
|
||||
},
|
||||
dataError: {
|
||||
type: Boolean,
|
||||
default() {
|
||||
return false;
|
||||
}
|
||||
},
|
||||
textStatusHeight: {
|
||||
type: Number,
|
||||
default() {
|
||||
return 0;
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
tryTime: 0, // 进入页面多少秒
|
||||
timeNow: 0, // 进入页面 相对时间
|
||||
time: null, // 定时器
|
||||
countTime: 0, // 显示 倒计时
|
||||
remainingTime: 0,
|
||||
userRole:'AUDIENCE',
|
||||
goodsId: this.$route.query.goodsId,
|
||||
try: this.$route.query.try, // 是否是试用权限
|
||||
training: {
|
||||
id: '',
|
||||
name: '',
|
||||
remarks: ''
|
||||
},
|
||||
isScriptRun:false,
|
||||
jl3dname: this.$t('display.demon.threeDimensionalView'),
|
||||
jl3dmodel: this.$t('display.demon.deviceView'),
|
||||
isShow3dmodel :true,
|
||||
isGoback: false,
|
||||
runing:false,
|
||||
pauseLoading: false,
|
||||
prdTypeMap: {
|
||||
'01': '01', // 现地 => 现地
|
||||
'02': '02', // 行调 => 行调
|
||||
'04': '02', // 司机 => 行调
|
||||
'05': '' // 派班 => null
|
||||
}
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
isShowScheduling() {
|
||||
return this.$route.query.prdType == '05';
|
||||
},
|
||||
isDrive() {
|
||||
return this.$route.query.prdType == '04';
|
||||
},
|
||||
group() {
|
||||
return this.$route.query.group;
|
||||
},
|
||||
projectDevice() {
|
||||
return this.$route.query.projectDevice;
|
||||
},
|
||||
project() {
|
||||
return getSessionStorage('project');
|
||||
},
|
||||
simulationPause() {
|
||||
return this.$store.state.socket.simulationPause;
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'$store.state.training.subscribeCount': function () {
|
||||
this.group && this.initLoadPage();
|
||||
},
|
||||
'$store.state.socket.simulationRoleList':function(val) {
|
||||
(val || []).forEach(item => {
|
||||
if (item.messageType === 'KICK_OUT' && item.userId == this.$store.state.user.id) {
|
||||
!this.isGoback && this.back();
|
||||
}
|
||||
});
|
||||
},
|
||||
'$store.state.socket.simulationOver':function(val) {
|
||||
!this.isGoback && this.back();
|
||||
},
|
||||
'$store.state.socket.simulationStart':function(val) {
|
||||
if (val) {
|
||||
this.setRuning(true);
|
||||
this.$store.dispatch('training/simulationStart').then(() => {
|
||||
this.$store.dispatch('map/setShowCentralizedStationNum');
|
||||
});
|
||||
}
|
||||
},
|
||||
'$store.state.socket.simulationReset':function(val) {
|
||||
this.setRuning(false);
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.$store.dispatch('training/setPrdType', this.$route.query.prdType);
|
||||
switch (this.$store.state.training.prdType) {
|
||||
case '02': { this.userRole = 'DISPATCHER'; break; }
|
||||
case '01': { this.userRole = 'STATION_SUPERVISOR'; break; }
|
||||
case '04': { this.userRole = 'DRIVER'; break; }
|
||||
case '05': { this.userRole = 'DEPOT_DISPATCHER'; break; }
|
||||
default: { this.userRole = 'AUDIENCE'; break; }
|
||||
}
|
||||
},
|
||||
beforeDestroy() {
|
||||
if (this.time) {
|
||||
this.setTryTime();
|
||||
clearTimeout(this.time);
|
||||
}
|
||||
this.$store.dispatch('scriptRecord/updateSimulationPause', false);
|
||||
this.$store.dispatch('map/resetActiveTrainList', true);
|
||||
},
|
||||
mounted() {
|
||||
this.$store.dispatch('training/end', TrainingMode.NORMAL);
|
||||
this.$nextTick(() => {
|
||||
this.$refs.demonMenu.menuClick();
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
async initLoadPage() {
|
||||
try {
|
||||
const memberData = Object.values(this.$store.state.training.memberData);
|
||||
const member = memberData.find(eachMember=>{
|
||||
return eachMember.userId == this.$store.state.user.id;
|
||||
});
|
||||
const deviceId = member ? member.deviceId : '';
|
||||
if (deviceId) {
|
||||
const list = [];
|
||||
const mapDevice = this.$store.state.map.mapDevice;
|
||||
for (const key in mapDevice) {
|
||||
list.push(mapDevice[key]);
|
||||
}
|
||||
this.$jlmap.updateShowStation(list, deviceId);
|
||||
}
|
||||
this.$jlmap.setCenter(deviceId);
|
||||
if (this.try != '0') {
|
||||
this.loadInitData();
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
},
|
||||
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() {
|
||||
this.pauseLoading = true;
|
||||
simulationStart(this.$route.query.group).then(resp => {
|
||||
this.pauseLoading = false;
|
||||
}).catch((e) =>{
|
||||
this.$message.error('仿真开始失败！');
|
||||
});
|
||||
},
|
||||
pause() {
|
||||
this.pauseLoading = true;
|
||||
simulationPause(this.$route.query.group).then(resp => {
|
||||
this.pauseLoading = false;
|
||||
}).catch((e) => {
|
||||
this.pauseLoading = false;
|
||||
this.$message.error('仿真暂停失败！');
|
||||
});
|
||||
},
|
||||
setRuning(run) {
|
||||
this.runing = run;
|
||||
},
|
||||
end() {
|
||||
this.$emit('end');
|
||||
},
|
||||
clearAllData() {
|
||||
this.$refs.chatbox.clearAllData();
|
||||
},
|
||||
async back() {
|
||||
this.isGoback = true;
|
||||
if (this.projectDevice || this.project === 'wjls') {
|
||||
destroySimulation(this.group).then(res=>{
|
||||
this.$store.dispatch('training/over').then(() => {
|
||||
this.$store.dispatch('LogOut').then(() => {
|
||||
location.reload();
|
||||
});
|
||||
});
|
||||
});
|
||||
} else {
|
||||
if (this.project === 'bjd') {
|
||||
window.close();
|
||||
} else {
|
||||
this.$store.dispatch('map/setShowCentralizedStationCode', '');
|
||||
history.go(-1);
|
||||
Notification.closeAll();
|
||||
}
|
||||
|
||||
}
|
||||
},
|
||||
setTryTime() {
|
||||
if (this.try) {
|
||||
const data = { time: this.tryTime, goodsId: this.goodsId };
|
||||
if (data.goodsId) {
|
||||
setGoodsTryUse(data);
|
||||
}
|
||||
|
||||
}
|
||||
},
|
||||
quit() {
|
||||
window.close();
|
||||
}
|
||||
}
|
||||
};
|
||||
</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;
|
||||
}
|
||||
.haerbin_btn_box{
|
||||
width: 450px;
|
||||
bottom: 15px!important;
|
||||
}
|
||||
.display-draft {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
bottom: 15px;
|
||||
.button-group-box{
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,143 +0,0 @@
|
||||
<template>
|
||||
<div class="schema" :style="{top: offset+'px'}">
|
||||
<el-select v-model="speed" style="width: 100px;" size="small" @change="speedChange">
|
||||
<el-option
|
||||
v-for="item in speedList"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
<el-button v-if="!isScheduling" size="small" :type="faultMode ? '':'primary' " @click="changeOperateMode()">{{ faultMode?'切换到普通模式[Tab]':'切换到故障模式[Tab]' }}</el-button>
|
||||
<fault-choose ref="faultChoose" :group="group" :offset="offset" />
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import FaultChoose from './demon/faultChoose';
|
||||
import { OperateMode } from '@/scripts/ConstDic';
|
||||
import { getByGroupStationList } from '@/api/jmap/map';
|
||||
import { getSessionStorage } from '@/utils/auth';
|
||||
import { loadRunPlanData } from '@/utils/loaddata';
|
||||
import { EventBus } from '@/scripts/event-bus';
|
||||
import { timesSpeedPlayback } from '@/api/rtSimulation';
|
||||
|
||||
// 右上角操作
|
||||
export default {
|
||||
name: 'MenuSchema',
|
||||
components: {
|
||||
FaultChoose
|
||||
},
|
||||
props: {
|
||||
offset: {
|
||||
type: Number,
|
||||
required: true
|
||||
},
|
||||
dataError: {
|
||||
type: Boolean,
|
||||
default() {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
mode: OperateMode.NORMAL,
|
||||
OperateMode: OperateMode,
|
||||
viewDisabled: true,
|
||||
faultMode: false,
|
||||
speedList:[
|
||||
{ value: 1, label: '1倍速' },
|
||||
{ value: 2, label: '2倍速' },
|
||||
{ value: 3, label: '3倍速' },
|
||||
{ value: 4, label: '4倍速' },
|
||||
{ value: 5, label: '5倍速' },
|
||||
{ value: 6, label: '6倍速' },
|
||||
{ value: 7, label: '7倍速' },
|
||||
{ value: 8, label: '8倍速' },
|
||||
{ value: 9, label: '9倍速' },
|
||||
{ value: 10, label: '10倍速' }
|
||||
],
|
||||
speed: 1
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
group() {
|
||||
return this.$route.query.group;
|
||||
},
|
||||
isScript() {
|
||||
return this.$route.params.mode === 'script';
|
||||
},
|
||||
isDemon() {
|
||||
return this.$route.params.mode === 'demon';
|
||||
},
|
||||
isScheduling() {
|
||||
return this.$route.query.prdType === '05';
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'$store.state.training.triggerFaultCount': function () {
|
||||
this.setFault();
|
||||
},
|
||||
'$store.state.runPlan.loadRunPlanCount': function () {
|
||||
this.viewDisabled = false;
|
||||
},
|
||||
'$store.state.socket.simulationSpeed': function (val) {
|
||||
this.speed = val;
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
EventBus.$on('CheckFaultModeEvent', () => {
|
||||
if (!this.isScheduling) {
|
||||
this.changeOperateMode();
|
||||
}
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
loadRunData() {
|
||||
this.$store.dispatch('runPlan/clear').then(() => {
|
||||
if (this.group) {
|
||||
this.viewDisabled = true;
|
||||
// 获取排序的车站列表
|
||||
getByGroupStationList(this.group).then(response => {
|
||||
this.$store.dispatch('runPlan/setStations', response.data).then(() => {
|
||||
loadRunPlanData(this.group, this.dataError);
|
||||
});
|
||||
}).catch(() => {
|
||||
this.$messageBox(this.$t('display.schema.getStationListFail'));
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
changeOperateMode() {
|
||||
this.faultMode = !this.faultMode;
|
||||
let mode = OperateMode.NORMAL;
|
||||
if (this.faultMode) {
|
||||
mode = OperateMode.FAULT;
|
||||
}
|
||||
this.$store.dispatch('training/changeOperateMode', { mode: mode });
|
||||
},
|
||||
speedChange(val) {
|
||||
timesSpeedPlayback(this.$route.query.group, val).then(resp => {
|
||||
this.$message.success(`设置${val}倍速成功!`);
|
||||
}).catch(e => {
|
||||
this.$message.error('设置倍速失败！');
|
||||
});
|
||||
},
|
||||
setFault() {
|
||||
this.$refs.faultChoose.doShow();
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style rel="stylesheet/scss" lang="scss" scoped>
|
||||
.schema {
|
||||
z-index: 36;
|
||||
display: inline;
|
||||
position: absolute;
|
||||
right: 5px;
|
||||
}
|
||||
|
||||
/deep/ .el-button+.el-button {
|
||||
margin-left: 0px;
|
||||
}
|
||||
</style>
|
||||
@ -1,123 +0,0 @@
|
||||
<template>
|
||||
<div v-if="isShowSystemTime" class="display-card" :style="{top: top+'px', right: newRight+'px'}">
|
||||
<!--<template v-if="pause">-->
|
||||
<!--<span class="display-pause">{{ $t('display.systemTime.timePause') }}</span>-->
|
||||
<!--</template>-->
|
||||
<!--<template v-else>-->
|
||||
<system-time
|
||||
class="display-time"
|
||||
:time="time"
|
||||
/>
|
||||
<div v-if="isShowDate" style="width: 80px;height: 58px;float: right;box-shadow: 0 0 5px #eee;">
|
||||
<div class="display-date-box">{{ dateString }}</div>
|
||||
<div class="display-date-box">{{ dayString }}</div>
|
||||
</div>
|
||||
<!--</template>-->
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import SystemTime from '@/views/components/systemTime/index';
|
||||
import { timestampFormat } from '@/utils/date';
|
||||
|
||||
// 顶部时间栏显示
|
||||
export default {
|
||||
name: 'MenuSystemTime',
|
||||
components: {
|
||||
SystemTime
|
||||
},
|
||||
props: {
|
||||
offset: {
|
||||
type: Number,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
time: '00:0000',
|
||||
dateString: '00/00/00',
|
||||
dayString: ''
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
isShowSystemTime() {
|
||||
return this.$route.params.mode == 'demon' ||
|
||||
this.$route.params.mode == 'dp' ||
|
||||
this.$route.params.mode == 'plan' ||
|
||||
this.$route.params.mode == 'script' ||
|
||||
this.$route.params.mode == 'practice' ||
|
||||
!this.$route.params.mode;
|
||||
},
|
||||
pause() {
|
||||
return this.$store.state.scriptRecord.simulationPause;
|
||||
},
|
||||
isDisplay() {
|
||||
return this.$route.path.includes('displayCity') || this.$route.path.includes('scriptdisplayCity');
|
||||
},
|
||||
isShowDate() { // 西安一 三号线
|
||||
return (this.$route.query.lineCode == 10 || this.$route.query.lineCode == 11) && this.isDisplay;
|
||||
},
|
||||
top() {
|
||||
return this.isShowDate ? (this.$route.query.prdType == '05' ? 5 : this.offset - 10) : this.offset;
|
||||
},
|
||||
newRight() {
|
||||
return this.isShowDate ? this.$store.state.config.width - 420 : this.$store.state.config.width / 2 - 55;
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'$store.state.training.initTime': function (timestamp) {
|
||||
this.initDate(timestamp);
|
||||
},
|
||||
'$store.state.socket.simulationTimeSync': function (timestamp) { // 仿真时间更新
|
||||
this.$store.dispatch('training/setInitTime', timestamp);
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
const initTime = this.$store.state.training.initTime;
|
||||
if (initTime > 0) {
|
||||
this.initDate(initTime);
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
initDate(timestamp) {
|
||||
this.time = timestampFormat('HH:mmss', timestamp)
|
||||
this.dateString = timestampFormat('YYYY/MM/DD', timestamp)
|
||||
this.dayString = timestampFormat('dddd', timestamp).split('').join(' ')
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style rel="stylesheet/scss" lang="scss" scoped>
|
||||
@import "src/styles/mixin.scss";
|
||||
|
||||
.display-card {
|
||||
z-index: 9;
|
||||
display: inline;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.display-pause {
|
||||
font-size: 21px;
|
||||
font-weight: bold;
|
||||
color: yellow;
|
||||
}
|
||||
|
||||
.display-time{
|
||||
padding: 3px 5px;
|
||||
border: 1px solid rgba(255,255,255,.2);
|
||||
box-shadow: 0 2px 12px 0 rgba(255,255,255,.3);
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.display-card .el-row {
|
||||
line-height: 32px !important;
|
||||
}
|
||||
.display-date-box{
|
||||
height: 29px;
|
||||
line-height: 29px;
|
||||
background: #404040;
|
||||
color: #1DEA1E;
|
||||
text-align: center;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
</style>
|
||||
@ -1,58 +0,0 @@
|
||||
import ConstConfig from '@/scripts/ConstConfig';
|
||||
import Cookies from 'js-cookie';
|
||||
import store from '@/store/index';
|
||||
export function covertMemberData (activeTrainList, resp) {
|
||||
let lastData = JSON.stringify(resp);
|
||||
const roleTypeList = ConstConfig.ConstSelect.roleTypeNew;
|
||||
roleTypeList.forEach(function(element) {
|
||||
const rolename = element.value;
|
||||
if (Cookies.get('user_lang') == 'en') {
|
||||
lastData = lastData.replace(new RegExp(rolename, 'g'), element.enLabel);
|
||||
} else {
|
||||
lastData = lastData.replace(new RegExp(rolename, 'g'), element.label);
|
||||
}
|
||||
});
|
||||
lastData = JSON.parse(lastData);
|
||||
const lastMemberList = [];
|
||||
// const electricDispatcherList = [];
|
||||
const deviceListData = [[], [], [], [], [], [], [], [], [], [], [], [], [], [], [], [], []];
|
||||
const driverList = [];
|
||||
lastData.forEach((member, index)=>{
|
||||
if (member.userId && member.userId == store.state.user.id) {
|
||||
member.disabled = true;
|
||||
member.userName = store.state.user.nickname;
|
||||
store.dispatch('training/setOrignalUserRoleId', member.id);
|
||||
} else {
|
||||
member.disabled = false;
|
||||
}
|
||||
const userName = member.userName ? '-' + member.userName : '';
|
||||
const name = member.name ? '-' + member.name : '';
|
||||
if (member.deviceCode) {
|
||||
const device = store.getters['map/getDeviceByCode'](member.deviceCode);
|
||||
member.deviceName = device.name || device.groupNumber;
|
||||
member.label = member.type + member.deviceName + name + userName;
|
||||
member.normalName = member.type + member.deviceName + name;
|
||||
} else {
|
||||
member.deviceName = '';
|
||||
member.label = member.type + name + userName;
|
||||
member.normalName = member.type + name;
|
||||
}
|
||||
const deviceType = ['行调', '通号', '行值', '司机', '车辆段/停车场调度', '上级部门', '电力调度', '车辆段/停车场信号楼', '车站助理', '车站站长', '车站信号员', '车站客运员', '车站扳道员', '车站引导员', '车站工务工', '设备管理员', '车务段段长 '];
|
||||
const deviceTypeIndex = deviceType.indexOf(member.type);
|
||||
if (deviceTypeIndex >= 0) {
|
||||
if (deviceTypeIndex == 3) {
|
||||
if (activeTrainList.length > 0) {
|
||||
if (activeTrainList.includes(member.deviceCode)) {
|
||||
deviceListData[deviceTypeIndex].push(member);
|
||||
}
|
||||
}
|
||||
lastMemberList.push(member);
|
||||
driverList.push(member);
|
||||
} else {
|
||||
deviceListData[deviceTypeIndex].push(member);
|
||||
lastMemberList.push(member);
|
||||
}
|
||||
}
|
||||
});
|
||||
return {lastMemberList:lastMemberList, deviceListData:deviceListData, driverList:driverList};
|
||||
}
|
||||
@ -32,7 +32,7 @@ import MenuTrainList from '@/views/newMap/displayNew/menuTrainList';
|
||||
import MenuSystemTime from '@/views/newMap/displayNew/menuSystemTime';
|
||||
import { clearSimulation, getSimulationInfoNew, ranAsPlan, exitRunPlan } from '@/api/simulation';
|
||||
import { loadMapDataById } from '@/utils/loaddata';
|
||||
import DispatcherStation from '../jointTrainingNew/dispatcherStation';
|
||||
// import DispatcherStation from '../jointTrainingNew/dispatcherStation';
|
||||
import { EventBus } from '@/scripts/event-bus';
|
||||
|
||||
export default {
|
||||
|
||||
@ -55,7 +55,7 @@ import { loadDraftScriptNew } from '@/api/designPlatform';
|
||||
import Vue from 'vue';
|
||||
import { ScriptMode } from '@/scripts/ConstDic';
|
||||
import ConstConfig from '@/scripts/ConstConfig';
|
||||
import DispatcherStation from '@/views/newMap/jointTrainingNew/dispatcherStation.vue';
|
||||
// import DispatcherStation from '@/views/newMap/jointTrainingNew/dispatcherStation.vue';
|
||||
|
||||
export default {
|
||||
name: 'DisplayDraft',
|
||||
|
||||
@ -99,16 +99,16 @@ import { Message } from 'element-ui';
|
||||
import { getToken } from '@/utils/auth';
|
||||
import MembersManage from './memberManage/membersManage';
|
||||
import AddMember from './memberManage/addMember';
|
||||
import BaSiDi from '@/views/newMap/displayBaSiDi/baSiDiNew';
|
||||
import RpsDialog from '@/views/newMap/displayBaSiDi/rps';
|
||||
import TroDialog from '@/views/newMap/displayBaSiDi/tro';
|
||||
import CarPack from '@/views/newMap/displayBaSiDi/carPack';
|
||||
import TroDetail from '@/views/newMap/displayBaSiDi/troDetail';
|
||||
import TraDialog from '@/views/newMap/displayBaSiDi/tra';
|
||||
import TtlDialog from '@/views/newMap/displayBaSiDi/ttl';
|
||||
import TmtDialog from '@/views/newMap/displayBaSiDi/tmt';
|
||||
import AtrDialog from '@/views/newMap/displayBaSiDi/atr';
|
||||
import TrainTrunkDetail from '@/views/newMap/displayBaSiDi/trainTrunkDetail';
|
||||
// import BaSiDi from '@/views/newMap/displayBaSiDi/baSiDiNew';
|
||||
// import RpsDialog from '@/views/newMap/displayBaSiDi/rps';
|
||||
// import TroDialog from '@/views/newMap/displayBaSiDi/tro';
|
||||
// import CarPack from '@/views/newMap/displayBaSiDi/carPack';
|
||||
// import TroDetail from '@/views/newMap/displayBaSiDi/troDetail';
|
||||
// import TraDialog from '@/views/newMap/displayBaSiDi/tra';
|
||||
// import TtlDialog from '@/views/newMap/displayBaSiDi/ttl';
|
||||
// import TmtDialog from '@/views/newMap/displayBaSiDi/tmt';
|
||||
// import AtrDialog from '@/views/newMap/displayBaSiDi/atr';
|
||||
// import TrainTrunkDetail from '@/views/newMap/displayBaSiDi/trainTrunkDetail';
|
||||
import DispatcherStation from './dispatcherStation';
|
||||
import TicketInfo from '../trainTicket/ticketInfo';
|
||||
import Vue from 'vue';
|
||||
|
||||
Loading…
Reference in New Issue
Block a user