From de7623b475d957f278f84b12947b5eb348fbc793 Mon Sep 17 00:00:00 2001
From: fan <fanyuhong@joylink.club>
Date: Sat, 18 Feb 2023 12:18:09 +0800
Subject: [PATCH] =?UTF-8?q?=E5=8F=91=E5=B8=83=E6=8A=A5=E9=94=99=E8=B0=83?=
 =?UTF-8?q?=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/newMap/display/lineBoard.vue        |   4 +-
 .../newMap/display/lineBoard/confirmTip.vue   |  74 +++++
 .../newMap/display/lineBoard/mapVisual.vue    | 245 ++++++++++++++
 src/views/newMap/display/lineBoard/recDep.vue | 136 ++++++++
 .../display/lineBoard/routeSelection1.vue     | 308 ++++++++++++++++++
 5 files changed, 765 insertions(+), 2 deletions(-)
 create mode 100644 src/views/newMap/display/lineBoard/confirmTip.vue
 create mode 100644 src/views/newMap/display/lineBoard/mapVisual.vue
 create mode 100644 src/views/newMap/display/lineBoard/recDep.vue
 create mode 100644 src/views/newMap/display/lineBoard/routeSelection1.vue

diff --git a/src/views/newMap/display/lineBoard.vue b/src/views/newMap/display/lineBoard.vue
index 437df709f..0a7808dc9 100644
--- a/src/views/newMap/display/lineBoard.vue
+++ b/src/views/newMap/display/lineBoard.vue
@@ -279,8 +279,8 @@ 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 RecDep from './lineBoard/recDep';
+import RouteSelection from './lineBoard/routeSelection1';
 import PopMenu from '@/components/PopMenu';
 import { menuOperate, commitOperate} from '@/jmapNew/theme/components/utils/menuOperate';
 import T3Pic from '@/assets/ctc_icon/t3.png';
diff --git a/src/views/newMap/display/lineBoard/confirmTip.vue b/src/views/newMap/display/lineBoard/confirmTip.vue
new file mode 100644
index 000000000..6852074ca
--- /dev/null
+++ b/src/views/newMap/display/lineBoard/confirmTip.vue
@@ -0,0 +1,74 @@
+<template>
+  <el-dialog
+    v-dialogDrag
+    class="chengdou-03__systerm confirm-control-speed"
+    :title="title"
+    :visible.sync="show"
+    width="340px"
+    :before-close="doClose"
+    :z-index="2000"
+    :modal="false"
+    :close-on-click-modal="false"
+    append-to-body
+  >
+    <div style="height: 60px; padding-left: 20px">
+      <span style="font-size: 18px">{{ message }}</span>
+    </div>
+    <el-row justify="center" class="button-group">
+      <el-col :span="11">
+        <el-button :id="confirmId" type="primary" @click="confirm">确定</el-button>
+      </el-col>
+      <el-col :span="11" :offset="2">
+        <el-button @click="doClose">取 消</el-button>
+      </el-col>
+    </el-row>
+  </el-dialog>
+</template>
+
+<script>
+export default {
+    name: 'ConfirmTip',
+    data() {
+        return {
+            dialogShow: false,
+            message: '',
+            confirmId: ''
+        };
+    },
+    computed: {
+        show() {
+            return this.dialogShow && !this.$store.state.menuOperation.break;
+        },
+        title() {
+            return '提示';
+        }
+    },
+    mounted() {
+
+    },
+    methods: {
+        doShow(operate) {
+            this.message = operate.message;
+            this.dialogShow = true;
+            this.confirmId = operate.confirmId;
+        },
+        confirm() {
+            this.$emit('close');
+        },
+        doClose() {
+            this.dialogShow = false;
+        }
+    }
+};
+
+</script>
+<style scoped>
+    .confirm-control-speed .context {
+        padding-bottom: 40px !important;
+        border: 1px solid lightgray;
+    }
+    .chengdou-03__systerm .el-dialog .el-button{
+        display: block;
+        margin: 0 auto;
+    }
+</style>
diff --git a/src/views/newMap/display/lineBoard/mapVisual.vue b/src/views/newMap/display/lineBoard/mapVisual.vue
new file mode 100644
index 000000000..c2073391e
--- /dev/null
+++ b/src/views/newMap/display/lineBoard/mapVisual.vue
@@ -0,0 +1,245 @@
+<template>
+  <div
+    ref="jlmapCanvas"
+    class="jlmap-canvas"
+    :style="{ width: width + 'px', height: height + 'px' }"
+  >
+    <div :id="canvasId" class="display_canvas" />
+  </div>
+</template>
+
+<script>
+import Jlmap from '@/jmapNew/map';
+import { parserFactory, ParserType } from '@/jmapNew/parser';
+import { deepAssign } from '@/utils/index';
+import deviceType from '@/jmapNew/constant/deviceType';
+
+export default {
+    name: 'JLocalmapVisual',
+    props: {
+        width: {
+            type: Number,
+            default: 0
+        },
+        height: {
+            type: Number,
+            default: 0
+        },
+        mapData: {
+            type: Object,
+            defautl() {
+                return {};
+            }
+        }
+    },
+    data() {
+        return {
+            loading: true,
+            offset: {
+                x: 0,
+                y: 0
+            },
+            map: null,
+            mapDevice: {},
+            routeData: [],
+            autoReentryData: []
+        };
+    },
+    computed: {
+        canvasId() {
+            return ['map', Math.random().toFixed(5) * 100000].join('_');
+        }
+    },
+    watch: {
+        '$store.state.config.canvasSizeCount': function (val) {
+            this.resetSize();
+        }
+        // '$store.state.training.prdType': function (val) {
+        //     if (val) {
+        //         this.changePrdType(val);
+        //     }
+        // }
+    },
+    mounted() {
+        this.init();
+    },
+    beforeDestroy() {
+        if (this.map) {
+            this.map.dispose();
+            this.map = null;
+        }
+    },
+    methods: {
+        init() {
+            document.getElementById(this.canvasId).oncontextmenu = function (e) {
+                return false;
+            };
+
+            const prdType = this.$store.state.training.prdType;
+
+            let showMode = '';
+            if (prdType == '01') {
+                showMode = '03';
+            } else if (prdType == '02') {
+                showMode = '02';
+            }
+
+            if (!this.map) {
+                this.map = new Jlmap({
+                    dom: document.getElementById(this.canvasId),
+                    config: {
+                        renderer: 'canvas',
+                        width: this.width,
+                        height: this.height
+                    },
+                    options: {
+                        scaleRate: 1,
+                        offsetX: 0,
+                        offsetY: 0,
+                        zoomOnMouseWheel: false
+                    },
+                    showConfig: {
+                        prdType: prdType,
+                        previewOrMapDraw: true,
+                        showMode: showMode
+                    },
+                    methods: {}
+                });
+            }
+
+            window.document.oncontextmenu = function () {
+                return false;
+            };
+            if (this.mapData && this.mapData.skinVO) {
+                const parser = parserFactory(ParserType.Graph.value);
+                this.mapDevice = parser.parser(this.mapData, this.mapData.skinVO.code, this.map.getShowConfig());
+                console.log('parsed mapDevice', this.mapDevice)
+            }
+        },
+        loadData() {
+            try {
+                this.setMap(this.mapData, this.mapDevice);
+            } catch (error) {
+                console.log('[ERROR] ', error);
+            }
+        },
+        // 设置地图
+        setMap(data, mapDevice) {
+            if (data.skinVO) {
+                this.routeData = this.$store.state.map.routeData;
+                this.autoReentryData = this.$store.state.map.autoReentryData;
+                this.map.setMap(data, mapDevice, {
+                    routeData: this.routeData,
+                    autoReentryData: this.autoReentryData
+                });
+                this.setMapFree();
+            } else {
+                this.mapDevice = {};
+                this.map.clear();
+            }
+        },
+        // 重置jlmap宽高
+        resetSize() {
+            this.$nextTick(() => {
+                this.map && this.map.resize({ width: this.width, height: this.height });
+            });
+        },
+        // 设置显示图层
+        setLevelVisible(levels) {
+            this.map && this.map.setLevelVisible(levels);
+        },
+        setMapFree() {
+            const list = [];
+            Object.values(this.mapDevice).forEach((elem) => {
+                const code = elem.code;
+                const type = elem._type;
+                // 列车不需要设置默认状态
+                type != deviceType.Train &&
+                    list.push({ code, _type: type, _free: true });
+            });
+
+            this.map.update(list, false);
+        },
+        // 设置中心偏移
+        setCenterWithOffset(code, dx, y) {
+            this.map.setCenterWithOffset(code, dx, y - this.height / 2);
+        },
+        // 更新地图数据
+        updateMapDevice(elems) {
+            const list = [];
+            elems.forEach((elem) => {
+                if (elem.code) {
+                    list.push(deepAssign(this.mapDevice[elem.code], elem));
+                }
+            });
+
+            this.map.update(list, false);
+        },
+        getDeviceByCode(code) {
+            return this.mapDevice[code];
+        },
+        setShowStation(stationCode, setCenter) {
+            const list = [];
+            const mapDevice = this.$store.state.map.mapDevice;
+            for (const key in mapDevice) {
+                list.push(mapDevice[key]);
+            }
+            this.map.updateShowStation(list, stationCode);
+            !setCenter && this.setCenter(stationCode);
+        }
+    }
+};
+</script>
+<style rel="stylesheet/scss" lang="scss" scoped>
+.mask {
+  opacity: 0;
+  background: #000;
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
+  z-index: 9;
+}
+.jlmap-canvas {
+  position: relative;
+  -moz-user-select: none;
+  -o-user-select: none;
+  -khtml-user-select: none;
+  -webkit-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  background: #000;
+  float: left;
+}
+.title {
+  text-align: right;
+  font-size: 14px;
+  color: #606266;
+  line-height: 32px;
+  -webkit-box-sizing: border-box;
+  box-sizing: border-box;
+  font-weight: 700;
+}
+
+.zoom-view {
+  position: absolute;
+  bottom: 0;
+  background: #fff;
+  padding-top: 5px;
+  height: 42px;
+  border-bottom: 1px #f3f3f3 solid;
+  border-right: 1px #f3f3f3 solid;
+}
+
+/deep/ {
+  .el-form.el-form--inline {
+    height: 28px !important;
+    line-height: 28px !important;
+  }
+
+  .el-loading-mask {
+    background-color: rgba(0, 0, 0, 0.3);
+  }
+}
+</style>
diff --git a/src/views/newMap/display/lineBoard/recDep.vue b/src/views/newMap/display/lineBoard/recDep.vue
new file mode 100644
index 000000000..1d99ffe15
--- /dev/null
+++ b/src/views/newMap/display/lineBoard/recDep.vue
@@ -0,0 +1,136 @@
+<template>
+  <el-dialog
+    v-dialogDrag
+    class="chengdou-03__systerm stand-stop-time"
+    title="作业窗口"
+    :visible.sync="show"
+    width="500px"
+    :before-close="doClose"
+    :z-index="2000"
+    :modal="false"
+    :close-on-click-modal="false"
+  >
+    <div>
+      <el-form :model="form" class="demo-form-inline">
+        <el-form-item label="作业任务:">
+          <el-input v-model="form.work" type="textarea" :rows="2" :disabled="true" />
+        </el-form-item>
+        <el-form-item label="操作时间:">
+          <el-input v-model="form.time" type="textarea" :rows="1" :disabled="true" />
+        </el-form-item>
+        <el-form-item label="操作信息:">
+          <el-input v-model="form.info" type="textarea" :rows="2" :disabled="true" />
+        </el-form-item>
+      </el-form>
+      <div style="text-align: center;"><el-button v-if="type === 'rec'" style="width: 200px;" @click="commit(menuOperate.CTC.receivingNotice)">完成接预</el-button></div>
+      <div style="text-align: center;margin-top: 10px;"><el-button v-if="type === 'dep'" style="width: 200px;" @click="commit(menuOperate.CTC.departureNotice)">完成发预</el-button></div>
+      <div style="text-align: center;margin-top: 10px;"><el-button v-if="type === 'rec'" style="width: 200px;" @click="commit(menuOperate.CTC.cancelReceivingNotice)">取消接预</el-button></div>
+      <div style="text-align: center;margin-top: 10px;"><el-button v-if="type === 'dep'" style="width: 200px;" @click="commit(menuOperate.CTC.cancelDepartureNotice)">取消发预</el-button></div>
+      <div style="text-align: center;margin-top: 10px;"><el-button v-if="type === 'arrive'" style="width: 200px;" @click="commit(menuOperate.CTC.finishArrive)">完成到点</el-button></div>
+      <div style="text-align: center;margin-top: 10px;"><el-button v-if="type === 'arrive'" style="width: 200px;" @click="commit(menuOperate.CTC.cancelArrive)">取消到点</el-button></div>
+      <div style="text-align: center;margin-top: 10px;"><el-button v-if="type === 'departure'" style="width: 200px;" @click="commit(menuOperate.CTC.finishDeparture)">完成发点</el-button></div>
+      <div style="text-align: center;margin-top: 10px;"><el-button v-if="type === 'departure'" style="width: 200px;" @click="commit(menuOperate.CTC.cancelDeparture)">取消发点</el-button></div>
+      <el-button style="height: 50px;width: 50px;position: relative;left: 370px;" @click="doClose">关闭</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import { mapGetters } from 'vuex';
+import CancelMouseState from '@/mixin/CancelMouseState';
+import {menuOperate, commitOperate} from '@/jmapNew/theme/components/utils/menuOperate';
+
+export default {
+    name: 'TrainMove',
+    mixins: [
+        CancelMouseState
+    ],
+    data() {
+        return {
+            selected: null,
+            selectedType: '',
+            dialogShow: false,
+            menuOperate: menuOperate,
+            type: '',
+            stationCode: '',
+            tripNumber: '',
+            loading: false,
+            tableData: [],
+            deviceTypeList: [
+                { label: '区段', value: 'Section' },
+                { label: '信号机', value: 'Signal' },
+                { label: '道岔', value: 'Switch' },
+                { label: '车站', value: 'Station' }
+            ],
+            deviceIdList: [],
+            form: {
+                work: '',
+                time: '',
+                info: ''
+            }
+        };
+    },
+    computed: {
+        ...mapGetters('map', [
+            'stationStandList'
+        ]),
+        show() {
+            return this.dialogShow && !this.$store.state.menuOperation.break;
+        }
+    },
+    methods: {
+        doShow(row, type, stationCode) {
+            this.type = type;
+            this.loading = true;
+            this.stationCode = stationCode;
+            this.tripNumber = row.tripNumber;
+            this.dialogShow = true;
+            this.$nextTick(function () {
+                this.$store.dispatch('training/emitTipFresh');
+            });
+        },
+        doClose() {
+            this.loading = false;
+            this.dialogShow = false;
+            this.$store.dispatch('training/emitTipFresh');
+        },
+        commit(type) {
+            this.loading = true;
+            commitOperate(type, {stationCode: this.stationCode, tripNumber: this.tripNumber}, 3).then(({valid, operate})=>{
+                this.loading = false;
+                if (valid) {
+                    this.doClose();
+                }
+            }).catch((error) => {
+                this.loading = false;
+                this.doClose();
+                console.error(error);
+                // this.$refs.noticeInfo.doShow();
+                this.$message.error('操作失败！');
+            });
+        }
+    }
+};
+</script>
+<style scoped>
+	.chengdou-03__systerm .el-dialog .base-label {
+		/*background: rgba(0, 0, 0, x);*/
+		position: relative;
+		left: -5px;
+		top: -18px;
+		padding: 0 5px;
+		background-color: #F0F0F0;
+	}
+	.text-button{
+		color: #148ad0;
+		cursor:pointer;
+	}
+	.text-button:active{
+		color: #b938e1;
+		text-decoration: underline;
+	}
+	.text-button:hover{
+		color: #b938e1;
+		text-decoration: underline;
+	}
+</style>
diff --git a/src/views/newMap/display/lineBoard/routeSelection1.vue b/src/views/newMap/display/lineBoard/routeSelection1.vue
new file mode 100644
index 000000000..26df9e930
--- /dev/null
+++ b/src/views/newMap/display/lineBoard/routeSelection1.vue
@@ -0,0 +1,308 @@
+<template>
+  <el-dialog v-dialogDrag top="12vh" class="ningbo-01__systerm route-setting" :title="title" :visible.sync="show" width="1100px" :before-close="doClose" :z-index="2000" :modal="false" :close-on-click-modal="false">
+    <el-row>
+      <el-col :span="2">列车车次</el-col>
+      <el-col :span="21"><span style="font-size: 18px;color: #f00;">{{ selected.tripNumber }}</span></el-col>
+    </el-row>
+    <el-row style="margin-top: 10px;">
+      <el-col :span="2">进路描述</el-col>
+      <el-col :span="21">
+        <div style="width: 100%;height: 50px;background: #DFE3E6;padding: 10px;">
+          <span>{{ `${type === 'dep' ? '发车/通过': '接车/通过'}； 股道：${selected.trackName}；进路按钮：${getRouteNames()}` }}</span>
+        </div>
+      </el-col>
+    </el-row>
+    <el-row style="margin-top: 10px;">
+      <el-col :span="2">进路显示</el-col>
+      <el-col :span="21">
+        <map-visual ref="map" :map-data="mapData" :width="960" :height="600" />
+      </el-col>
+    </el-row>
+    <!--<el-row :gutter="24">-->
+    <!--<el-col :span="6">-->
+    <!--<el-row class="header">-->
+    <!--<el-col :span="11"><span>集中站</span></el-col>-->
+    <!--<el-col :span="11" :offset="2"><span>始端信号机</span></el-col>-->
+    <!--</el-row>-->
+    <!--<el-row>-->
+    <!--<el-col :span="11">-->
+    <!--<el-input v-model="stationName" size="small" disabled />-->
+    <!--</el-col>-->
+    <!--<el-col :span="11" :offset="2">-->
+    <!--<el-input v-model="signalName" size="small" disabled />-->
+    <!--</el-col>-->
+    <!--</el-row>-->
+    <!--<el-row style="margin-top: 10px; line-height: 30px;">-->
+    <!--<el-col :span="11"><span>进路列表</span></el-col>-->
+    <!--</el-row>-->
+    <!--<el-table ref="table" :data="tempData" border :cell-style="tableStyle" style="width: 100%; height: 460px; margin-top:10px" size="mini" highlight-current-row :show-header="false" @row-click="clickEvent">-->
+    <!--<el-table-column :id="domIdChoose" prop="name" style="margin-left:30px" />-->
+    <!--</el-table>-->
+    <!--<el-row justify="center" class="button-group">-->
+    <!--<el-col :span="8" :offset="4">-->
+    <!--<el-button :id="domIdConfirm" type="primary" :loading="loading" :disabled="commitDisabled" @click="commit">确定</el-button>-->
+    <!--</el-col>-->
+    <!--<el-col :span="8" :offset="4">-->
+    <!--<el-button :id="domIdCancel" @click="cancel">取 消</el-button>-->
+    <!--</el-col>-->
+    <!--</el-row>-->
+    <!--</el-col>-->
+    <!--<el-col :span="18">-->
+    <!--<map-visual ref="map" :map-data="mapData" :width="780" :height="600" />-->
+    <!--</el-col>-->
+    <!--</el-row>-->
+    <el-row style="margin-top: 10px;margin-bottom: 10px;">
+      <el-col :span="21" :offset="2">
+        <el-radio v-model="radio" disabled label="禁用">分段办理</el-radio>
+      </el-col>
+    </el-row>
+    <div style="display: flex;justify-content: space-between;margin-bottom: 10px;">
+      <el-button v-if="type === 'rec'" size="mini" :type="selected.receivingRouteAutoTrigger?'warning':''" :disabled="!!route.lock || !selected.receivingNotice" @click="commit">办理接车</el-button>
+      <el-button v-if="type === 'dep'" size="mini" :type="selected.departureRouteAutoTrigger?'warning':''" :disabled="!!route.lock || !selected.departureNotice" @click="commit">办理发车</el-button>
+      <el-button size="mini" disabled>办理通过</el-button>
+      <el-button size="mini" disabled>进路单锁</el-button>
+      <el-button size="mini" :disabled="cancelRouteDisabled" @click="commit">取消进路</el-button>
+      <el-button size="mini" @click="doClose">关闭</el-button>
+    </div>
+    <notice-info ref="noticeInfo" pop-class="ningbo-01__systerm" />
+    <confirm-tip ref="confirmTip" @close="doClose" />
+  </el-dialog>
+</template>
+
+<script>
+import { OperationEvent } from '@/scripts/cmdPlugin/OperationHandler';
+import { menuOperate, commitOperate} from '@/jmapNew/theme/components/utils/menuOperate';
+import { deepAssign } from '@/utils/index';
+import { mouseCancelState} from '@/jmapNew/theme/components/utils/menuItemStatus';
+import { mapGetters } from 'vuex';
+// import { dbReadData } from '@/utils/indexedDb';
+import ConfirmTip from './confirmTip';
+import MapVisual from './mapVisual';
+import NoticeInfo from '@/jmapNew/theme/components/menus/childDialog/noticeInfo';
+import { UserOperationType } from '@/scripts/ConstDic';
+export default {
+    name: 'RouteSelection',
+    components: {
+        NoticeInfo,
+        ConfirmTip,
+        MapVisual
+    },
+    data() {
+        return {
+            radio:'',
+            beforeSectionList: [],
+            beforeSwitchList: [],
+            dialogShow: false,
+            loading: false,
+            selected: {},
+            operation: '',
+            display: true,
+            mapData: null,
+            route: '',
+            tableStyle: {
+                'border-bottom': 'none'
+            },
+            type: ''
+        };
+    },
+    computed: {
+        ...mapGetters('map', [
+            'overlapData'
+        ]),
+        show() {
+            return this.dialogShow && !this.$store.state.menuOperation.break;
+        },
+        domIdCancel() {
+            return this.dialogShow ? OperationEvent.Command.cancel.menu.domId : '';
+        },
+        domIdChoose() {
+            return this.dialogShow ? OperationEvent.Signal.arrangementRoute.choose.domId : '';
+        },
+        domIdConfirm() {
+            return this.dialogShow ? OperationEvent.Signal.arrangementRoute.menu.domId : '';
+        },
+        title() {
+            return '进路办理';
+        },
+        cancelRouteDisabled() {
+            return !this.route.lock || (this.type === 'rec' && !this.selected.receivingNotice) || (this.type === 'dep' && !this.selected.departureNotice);
+        }
+    },
+    watch: {
+        '$store.state.map.mapDataLoadedCount': function (val) { // 地图数据加载完成
+            this.mapData = JSON.parse(JSON.stringify(this.$store.state.map.map));
+        }
+    },
+    methods: {
+        getRouteNames() {
+            const receivingRoute = this.$store.state.map.routeData[this.selected.receivingRouteCode];
+            const departureRoute = this.$store.state.map.routeData[this.selected.departureRouteCode];
+            return (receivingRoute ? receivingRoute.name : '') + ',' + (departureRoute ? departureRoute.name : '');
+        },
+        doShow(selected, type) {
+            // this.$root.$emit('dialogOpen', selected);
+            if (!this.mapData) { this.mapData = JSON.parse(JSON.stringify(this.$store.state.map.map)); }
+            this.selected = selected;
+            this.type = type;
+            this.dialogShow = true;
+            this.$nextTick(function () {
+                this.loadData();
+                this.$store.dispatch('training/emitTipFresh');
+            });
+        },
+        loadData() {
+            this.beforeSwitchList = [];
+            this.beforeSectionList = [];
+            this.$refs.map.loadData(this.mapData);
+            setTimeout(() => {
+                if (this.type === 'rec') {
+                    this.clickEvent(this.selected.receivingRouteCode);
+                } else if (this.type === 'dep') {
+                    this.clickEvent(this.selected.departureRouteCode);
+                }
+            }, 100);
+        },
+        doClose() {
+            this.loading = false;
+            this.dialogShow = false;
+            this.route = {};
+            this.restoreBeforeDevices();
+            this.$store.dispatch('training/emitTipFresh');
+            mouseCancelState(this.selected);
+        },
+        restoreBeforeDevices() {
+            // 恢复之前选中设备
+            if (this.beforeSectionList && this.beforeSectionList.length) {
+                this.beforeSectionList.forEach(el => {
+                    el.routeLock = false;
+                    el.preWhite = false;
+                });
+            }
+
+            if (this.beforeSwitchList && this.beforeSwitchList.length) {
+                this.beforeSwitchList.forEach(el => {
+                    // N-定位 R-反位 NO-无(失表) EX-挤叉
+                    el.pos = 'NO';
+                    el.routeLock = false;
+                });
+            }
+
+            this.$refs.map.updateMapDevice([...this.beforeSectionList, ...this.beforeSwitchList]);
+
+            this.beforeSectionList = [];
+            this.beforeSwitchList = [];
+        },
+        clickEvent(routeCode) {
+            const route = this.$store.state.map.routeData[routeCode];
+            this.route = route;
+            if (route) {
+                // 恢复进路区段的切除状态
+                this.restoreBeforeDevices();
+
+                const containSectionList = [];
+                const containSwitchList = [];
+                if (!route.setting) {
+                    const signalBegin = this.$refs.map.getDeviceByCode(route.startSignalCode);
+                    const code = route.startSignalCode;
+                    const signal = signalBegin;
+                    const switchCodeList = [];
+
+                    this.$refs.map.setCenterWithOffset(code, 50, signal.position.y);
+                    if (route.routeSectionList && route.routeSectionList.length) {
+                        route.routeSectionList.forEach(code => {
+                            const section = deepAssign({}, this.$refs.map.getDeviceByCode(code));
+                            if (section.logicSectionCodeList && section.logicSectionCodeList.length) {
+                                section.logicSectionCodeList.forEach(sectionCode => {
+                                    containSectionList.push({code: sectionCode, preWhite: true});
+                                });
+                            } else {
+                                containSectionList.push({code, preWhite: true});
+                            }
+
+                            if (section.switchSection && section.switch) {
+                                switchCodeList.push(section.switch.code);
+                            }
+                        });
+                    }
+
+                    if (route.routeSwitchList && route.routeSwitchList.length) {
+                        route.routeSwitchList.filter(el => switchCodeList.includes(el.switchCode)).forEach(el => {
+                            const swch = deepAssign({}, this.$refs.map.getDeviceByCode(el.switchCode));
+                            const sectionA = this.$refs.map.getDeviceByCode(swch.sectionACode);
+                            // const sectionB = this.$refs.map.getDeviceByCode(swch.sectionBCode);
+                            const sectionC = this.$refs.map.getDeviceByCode(swch.sectionCCode);
+                            // normalPosition: el.normal, reversePosition: !el.normal
+                            containSwitchList.push({code: el.switchCode, routeLock: true, pos:el.pos });
+                            if (el.normal) {
+                                containSectionList.push({code: sectionA.code, routeLock:true });
+                                // containSectionList.push({code: sectionC.code, preBlue: true });
+                            } else {
+                                containSectionList.push({code: sectionC.code, routeLock:true });
+                                // containSectionList.push({code: sectionB.code, preBlue: true });
+                            }
+                        });
+                    }
+
+                    this.$refs.map.updateMapDevice([...containSectionList, ...containSwitchList]);
+                    this.beforeSectionList = containSectionList;
+                    this.beforeSwitchList = containSwitchList;
+
+                    // 设置选中指令
+                    const operate = {
+                        userOperationType: UserOperationType.LEFTCLICK,
+                        operation: OperationEvent.Signal.arrangementRoute.choose.operation,
+                        val: route.code
+                    };
+
+                    this.$store.dispatch('trainingNew/next', operate).then(({ valid }) => {
+                        if (valid) {
+                            this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
+                        }
+                    });
+                } else {
+                    this.$refs.noticeInfo.doShow('当前进路不允许排列, 与其他进路可能发生冲突');
+                }
+            }
+        },
+        commit() {
+            if (this.route) {
+                this.loading = true;
+                const type = this.route.lock ? menuOperate.Signal.cancelTrainRoute : menuOperate.CTC.setRoute;
+                const param = this.route.lock ? { signalCode: this.route.startSignalCode } : { routeCode:this.route.code, tripNumber: this.selected.tripNumber, force: false, duration: null };
+                commitOperate(type, param, 3).then(({valid, operate})=>{
+                    this.loading = false;
+                    if (valid) {
+                        this.doClose();
+                    }
+                }).catch((e) => {
+                    this.loading = false;
+                    this.doClose();
+                    this.$refs.noticeInfo.doShow();
+                });
+            }
+        },
+        cancel() {
+            const operate = {
+                userOperationType: UserOperationType.LEFTCLICK,
+                operation: OperationEvent.Command.cancel.menu.operation
+            };
+            this.$store.dispatch('trainingNew/next', operate).then(({ valid }) => {
+                if (valid) {
+                    this.doClose();
+                }
+            }).catch(() => {
+                this.doClose();
+            });
+        }
+    } // D3D8DC
+};
+</script>
+<style scoped>
+	/deep/ .el-dialog__header{
+		background: #B4B6B9;
+	}
+	/deep/ .el-dialog__body{
+		background: #D3D8DC !important;
+		padding: 10px;
+	}
+</style>