大铁ctc调整6/15

src/jmapNew/theme/datie_02/menus/bottomTable.vue

@@ -1,26 +1,43 @@
 <template>
-	<div v-if="showTable" style="background: #F0F0F0;z-index: 10;position: absolute;left: 0;bottom: 0;width: 100%;font-size: 14px;">
+  <div v-show="showTable" style="background: #F0F0F0;z-index: 10;position: absolute;left: 0;bottom: 0;width: 100%;font-size: 14px;">
     <i class="el-icon-close close_icon" @click.stop="doClose" />
     <el-row>
       <el-col :span="11" style="padding: 0 10px;">
         <div style="border: 1px solid #C7C7C7;margin-top: 10px;">
           <div style="position: relative; top: -8px;left: 15px;width: 130px;background: #f0f0f0;">列车进路序列 可修改</div>
           <div style="width: 100%;background: #9F9F9F">
-						<el-table :data="tableData" height="90" border style="width: 465px" :cell-style="{padding: 0}">
+            <el-table
-							<el-table-column type="index" width="30" label="序" label-class-name="bottom-table-label-header"/>
+              ref="sequenceTable"
-							<el-table-column property="trainCode" label="车次" width="50" label-class-name="bottom-table-label-header"/>
+              :data="sequenceList"
-							<el-table-column property="section" label="股道" width="50" label-class-name="bottom-table-label-header"/>
+              height="90"
-							<el-table-column property="trigger" label="自触" width="50" label-class-name="bottom-table-label-header"/>
+              border
-							<el-table-column property="direction" label="方向" width="90" label-class-name="bottom-table-label-header"/>
+              style="width: 650px"
-							<el-table-column property="start" label="开始" width="50" label-class-name="bottom-table-label-header"/>
+              :cell-style="{padding: 0}"
-							<el-table-column property="plan" label="状态" width="50" label-class-name="bottom-table-label-header"/>
+              :default-sort="{prop: 'startTime', order: 'descending'}"
-							<el-table-column property="description" label="描述" label-class-name="bottom-table-label-header"/>
+            >
+              <el-table-column type="index" width="30" label="序" label-class-name="bottom-table-label-header" />
+              <el-table-column property="tripNumber" label="车次" width="60" label-class-name="bottom-table-label-header" />
+              <el-table-column property="trackName" label="股道" width="50" label-class-name="bottom-table-label-header" />
+              <el-table-column property="autoTrigger" label="自触" width="50" label-class-name="bottom-table-label-header">
+                <template slot-scope="scope">
+                  <el-checkbox v-model="scope.row.autoTrigger" @change="triggerChange(scope.row)" />
+                </template>
+              </el-table-column>
+              <el-table-column property="direction" label="方向" width="80" label-class-name="bottom-table-label-header" />
+              <el-table-column property="startTime" label="开始" width="80" label-class-name="bottom-table-label-header" />
+              <el-table-column property="planTime" label="计划" width="90" label-class-name="bottom-table-label-header" />
+              <el-table-column property="" label="状态" width="90" label-class-name="bottom-table-label-header">
+                <template slot-scope="scope">
+                  <span>{{ getRouteStatus(scope.row.status) }}</span>
+                </template>
+              </el-table-column>
+              <el-table-column property="description" label="进路描述" label-class-name="bottom-table-label-header" />
             </el-table>
           </div>
         </div>
         <div style="display: flex;align-items: center;">
           <div style="margin-right: 10px;">车站</div>
-					<el-select v-model="stationCode" size="mini">
+          <el-select v-model="stationCode" size="mini" @change="stationChange">
             <el-option
               v-for="item in stationList"
               :key="item.code"
@@ -42,13 +59,13 @@
                 <div style="position: relative; top: -8px;left: 15px;width: 86px;background: #f0f0f0;">调车进路序列</div>
                 <div style="width: 100%;background: #9F9F9F">
                   <el-table :data="tableData" height="55" border style="width: 465px" :cell-style="{padding: 0}">
-										<el-table-column type="index" label="顺序" width="50" label-class-name="bottom-table-label-header"/>
+                    <el-table-column type="index" label="顺序" width="50" label-class-name="bottom-table-label-header" />
-										<el-table-column property="" label="勾序" width="50" label-class-name="bottom-table-label-header"/>
+                    <el-table-column property="" label="勾序" width="50" label-class-name="bottom-table-label-header" />
-										<el-table-column property="" label="进路及方向" width="95" label-class-name="bottom-table-label-header"/>
+                    <el-table-column property="" label="进路及方向" width="95" label-class-name="bottom-table-label-header" />
-										<el-table-column property="" label="自触" width="50" label-class-name="bottom-table-label-header"/>
+                    <el-table-column property="" label="自触" width="50" label-class-name="bottom-table-label-header" />
-										<el-table-column property="" label="状态" width="50" label-class-name="bottom-table-label-header"/>
+                    <el-table-column property="" label="状态" width="50" label-class-name="bottom-table-label-header" />
-										<el-table-column property="" label="触发时间" width="80" label-class-name="bottom-table-label-header"/>
+                    <el-table-column property="" label="触发时间" width="80" label-class-name="bottom-table-label-header" />
-										<el-table-column property="" label="占用时间" label-class-name="bottom-table-label-header"/>
+                    <el-table-column property="" label="占用时间" label-class-name="bottom-table-label-header" />
                   </el-table>
                 </div>
               </div>
@@ -58,12 +75,12 @@
                 <div style="position: relative; top: -8px;left: 15px;width: 44px;background: #f0f0f0;">勾序列</div>
                 <div style="width: 100%;background: #9F9F9F">
                   <el-table :data="tableData" height="55" style="width: 360px" border :cell-style="{padding: 0}">
-										<el-table-column type="index" label="钩计划" width="70" label-class-name="bottom-table-label-header"/>
+                    <el-table-column type="index" label="钩计划" width="70" label-class-name="bottom-table-label-header" />
-										<el-table-column property="" label="股道" width="50" label-class-name="bottom-table-label-header"/>
+                    <el-table-column property="" label="股道" width="50" label-class-name="bottom-table-label-header" />
-										<el-table-column property="" label="操作" width="50" label-class-name="bottom-table-label-header"/>
+                    <el-table-column property="" label="操作" width="50" label-class-name="bottom-table-label-header" />
-										<el-table-column property="" label="状态" width="50" label-class-name="bottom-table-label-header"/>
+                    <el-table-column property="" label="状态" width="50" label-class-name="bottom-table-label-header" />
-										<el-table-column property="" label="记事" width="50" label-class-name="bottom-table-label-header"/>
+                    <el-table-column property="" label="记事" width="50" label-class-name="bottom-table-label-header" />
-										<el-table-column property="" label="作业时间" label-class-name="bottom-table-label-header"/>
+                    <el-table-column property="" label="作业时间" label-class-name="bottom-table-label-header" />
                   </el-table>
                 </div>
               </div>
@@ -98,18 +115,21 @@
 </template>
 
 <script>
-	import { mapGetters } from 'vuex';
+import { mapGetters } from 'vuex';
-	import { EventBus } from '@/scripts/event-bus';
+import { EventBus } from '@/scripts/event-bus';
-    export default {
+import { menuOperate, commitOperate} from '@/jmapNew/theme/components/utils/menuOperate';
-        name: 'bottomTable',
+export default {
+    name: 'BottomTable',
     data() {
         return {
             tableData: [{}],
             stationCode: '',
             sheetValue: '',
             showTable: false,
-				sheetList: [{ label: '历史进路', value: 'historyRoute' }]
+            sheetList: [{ label: '历史进路', value: 'historyRoute' }],
-			}
+            sequenceList: [],
+            sequenceMap: {}
+        };
     },
     computed: {
         ...mapGetters('map', [
@@ -118,14 +138,38 @@
     },
     watch: {
         'showTable': function (val) {
-        		const offset = val ? 149: 0;
+            const offset = val ? 162 : 0;
-				EventBus.$emit('setMenuButtonPosition', offset)
+            EventBus.$emit('setMenuButtonPosition', offset);
+        },
+        '$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.sequenceList = [];
+                for (const key in this.sequenceMap) {
+                    if (this.sequenceMap[key].stationCode === this.stationCode) {
+                        this.sequenceList.push(this.sequenceMap[key]);
+                    }
+                }
+            }
         }
     },
-		mounted(){
+    mounted() {
         EventBus.$on('bottomTableShowOrHidden', () => {
             this.showTable = !this.showTable;
         });
+        if (this.stationList && this.stationList.length) {
+            this.stationCode = this.stationList[0].code;
+        }
     },
     methods: {
         doShow() {
@@ -134,11 +178,55 @@
         doClose() {
             this.showTable = false;
         },
-			setMenuButtonPosition(val) {
+        getRouteStatus(status) {
-        		const offset = val ? 149:0;
+            if (status === '2') {
+                return '触发完成';
+            } else if (status === '1') {
+                return '正在触发';
+            } else {
+                return '等待中';
+            }
+        },
+        triggerChange(row) {
+            const triggerParam = { stationCode: this.stationCode, tripNumber: row.tripNumber, routeCode: row.routeCode, trigger: row.autoTrigger };
+            if (row.autoTrigger) {
+                this.setTrigger(triggerParam, row);
+            } else {
+                this.cancelTrigger(triggerParam, row);
+            }
+        },
+        stationChange(stationCode) {
+            this.sequenceList = [];
+            for (const key in this.sequenceMap) {
+                if (this.sequenceMap[key].stationCode === stationCode) {
+                    this.sequenceList.push(this.sequenceMap[key]);
                 }
             }
-    };
+        },
+        setTrigger(triggerParam, row) {
+            commitOperate(menuOperate.CTC.autoTrigger, triggerParam, 3).then(({valid, operate})=>{
+                if (valid) {
+                    this.$message.success('设置自动触发成功！');
+                }
+            }).catch((e) => {
+                console.error(e);
+                row.autoTrigger = false;
+                this.$message.error('设置自动触发失败！');
+            });
+        },
+        cancelTrigger(triggerParam, row) {
+            commitOperate(menuOperate.CTC.autoTrigger, triggerParam, 3).then(({valid, operate})=>{
+                if (valid) {
+                    this.$message.success('取消自动触发成功！');
+                }
+            }).catch((e) => {
+                console.error(e);
+                row.autoTrigger = true;
+                this.$message.error('取消自动触发失败！');
+            });
+        }
+    }
+};
 </script>
 
 <style scoped>

src/jmapNew/theme/datie_02/menus/menuPanel.vue

@@ -7,10 +7,10 @@
           <img :src="t3Pic" class="img-button">
         </div>
         <div class="button-box">
-          <img :src="trainPic" class="img-button">
+          <img :src="panelPic" class="img-button" @click="showLineBoard">
         </div>
         <div class="button-box">
-          <img :src="panelPic" class="img-button" @click="showLineBoard">
+          <img :src="trainPic" class="img-button">
         </div>
         <div class="button-box">
           <img :src="linkPic" class="img-button">

src/views/newMap/displayCity/lineBoard.vue

@@ -20,15 +20,15 @@
           {{ item.name }}
         </div>
       </div>
-      <div v-for="item in infoList" :key="item.id" style="display: flex; justify-content: space-between;border-top: 1px solid #fff;padding: 3px;height: 36px;align-items: center;">
+      <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;">
         <div
-          style="padding: 5px 20px;border-radius: 5px;border-width: 2px;border-style: solid;"
+          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>{{ item.tripNumber }}</div>
+        <div v-show="!item.noData" style="width: 80px;">{{ item.tripNumber }}</div>
-        <div style="background: #FFCBEC;border: 1px solid #315FD1;border-radius: 3px;font-size: 10px;">{{ item.trainType?'客':'' }}</div>
+        <div v-show="!item.noData" style="background: #FFCBEC;border: 1px solid #315FD1;border-radius: 3px;font-size: 10px;">{{ item.trainType?'客':'' }}</div>
-        <div>{{ item.trainDistanceInfo }}</div>
+        <div v-show="!item.noData">{{ item.trainDistanceInfo }}</div>
-        <div>
+        <div v-show="!item.noData">
           <el-select v-model="item.process" placeholder="请选择" size="mini" style="width: 120px;" :disabled="true">
             <el-option
               v-for="elem in sectionStatusList"
@@ -38,7 +38,7 @@
             />
           </el-select>
         </div>
-        <div style="display: flex;">
+        <div v-show="!item.noData" style="display: flex;">
           <div :style="{ background: item.receivingNotice ? '#29CA42': '#ccc' }" class="button-box-fir" @click="doShowRecDep(item,'rec')">接预</div>
           <div
             class="button-box-sec"
@@ -50,16 +50,16 @@
           </div>
           <div :style="{ background: item.arrive ? '#29CA42': '#ccc' }" class="button-box-fir" style="margin-left: 10px;cursor: default;">到点</div>
         </div>
-        <div>
+        <div v-show="!item.noData">
           <div>{{ item.arriveTime }}</div>
           <div>{{ item.departureTime }}</div>
         </div>
-        <div>
+        <div v-show="!item.noData">
           <div>{{ item.planArriveTime }}</div>
           <div>{{ item.planDepartureTime }}</div>
         </div>
         <div /><!--起点--终点-->
-        <div style="display: flex;">
+        <div v-show="!item.noData" style="display: flex;">
           <div :style="{ background: item.departureNotice ? '#29CA42': '#ccc' }" class="button-box-fir" @click="doShowRecDep(item,'dep')">发预</div>
           <div
             class="button-box-sec"
@@ -71,8 +71,8 @@
           </div>
           <div :style="{ background: item.departure ? '#29CA42': '#ccc' }" class="button-box-fir" style="margin-left: 10px;cursor: default;">发点</div>
         </div>
-        <div>{{ item.tripNumber }}</div>
+        <div v-show="!item.noData">{{ item.tripNumber }}</div>
-        <div :style="{fontWeight: item.occupied? 'bold': 'normal', color:item.occupied? '#f00': '#1e2024' }">{{ item.trackName }}</div>
+        <div style="width: 120px" :style="{fontWeight: item.occupied? 'bold': 'normal', color:item.occupied? '#f00': '#1e2024' }">{{ item.trackName }}</div>
       </div>
     </div>
     <!--<div style="display: flex; justify-content: center;">-->
@@ -87,7 +87,7 @@
     <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;">{{ `进路序列模式：&lt;${readOnly ? '只读':'可修改'}&gt;` }}</div>
+          <div style="background: #0f0;">{{ `进路序列模式：&lt;${readOnlyMap[selectCode1] ? '只读':'可修改'}&gt;` }}</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>
@@ -121,11 +121,12 @@
           </el-select>
         </div>
         <el-table
-          :data="tableData"
+          :data="sequenceList"
           style="width: 100%;margin-top: 10px;"
           highlight-current-row
           :row-style="{ background: '#ff0' }"
           height="180"
+          :default-sort="{prop: 'startTime', order: 'descending'}"
           border
         >
           <el-table-column width="50" label="序号" align="center">
@@ -142,8 +143,16 @@
               <div style="width: 100%;height: 22px;" @contextmenu="popMenuShow(scope.row, '' ,$event)">{{ scope.row.autoTrigger? '√':'' }}</div>
             </template>
           </el-table-column>
-          <el-table-column property="type" label="类型" />
+          <el-table-column property="departure" label="类型">
-          <el-table-column property="status" 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="方向" />
@@ -237,11 +246,10 @@ export default {
     data() {
         return {
             menu: [{label: '设置自触', handler: this.setTrigger, disabled: false}, {label: '取消自触', handler: this.cancelTrigger, disabled: false}],
-            dialogVisible: false,
+            dialogVisible: true,
             triggerParam: {},
             selectCode: '',
             selectCode1: '',
-            readOnly: '',
             arrowPic: ArrowPic,
             picT3: PicT3,
             controlPanelPic: ControlPanelPic,
@@ -253,7 +261,6 @@ export default {
             andDown: 'all',
             unknow: '',
             unknow1: '',
-            tableData: [],
             tableData1: [],
             unknowList1: [{label: '全部机车', value: 'all'}],
             unknowList: [{label: 'J101-执行中', value: 'J101'}],
@@ -269,7 +276,11 @@ export default {
                 {label: '流程终止', value: 'FINISH'}
             ],
             stationDataMap: {},
-            infoList : []
+            sequenceMap: {},
+            sequenceList: [],
+            readOnlyMap: {},
+            standTrackSectionMap: {},
+            trackList: []
         };
     },
     computed: {
@@ -282,15 +293,65 @@ export default {
         '$store.state.socket.railCtcStatusMsg': function (val) {
             if (val && val.length) {
                 val.forEach(item => {
-                    if (item) {
+                    if (item && item.routeSequence && item.routeSequence.lines && item.routeSequence.lines.length) {
-                        this.stationDataMap[item.stationCode] = { trackView: item.trackView, routeSequence: item.routeSequence };
+                        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.infoList = this.stationDataMap[this.selectCode] ? this.stationDataMap[this.selectCode].trackView.lines : [];
+                        this.readOnlyMap[item.stationCode] = item.readOnly;
-                this.tableData = this.stationDataMap[this.selectCode1] ? this.stationDataMap[this.selectCode1].routeSequence.lines : [];
+                    }
-                this.readOnly = this.stationDataMap[this.selectCode1] ? this.stationDataMap[this.selectCode1].routeSequence.readOnly : false;
+                    console.log(item.trackView, '******************');
+                    if (item && item.trackView && item.trackView.trackLineMap) {
+                        console.log(item.trackView.trackLineMap, '******************');
+                        for (const key in item.trackView.trackLineMap) {
+                            this.standTrackSectionMap[key].lines = item.trackView.trackLineMap[key];
                         }
                     }
+                    if (item && item.trackView && item.trackView.sectionOccupiedMap) {
+                        for (const key in item.trackView.sectionOccupiedMap) {
+                            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 = [];
+                for (const key in this.standTrackSectionMap) {
+                    if (this.standTrackSectionMap[key].belongStation === this.selectCode) {
+                        if (this.standTrackSectionMap[key].lines && this.standTrackSectionMap[key].lines.length) {
+                            this.standTrackSectionMap[key].lines.forEach((item, index) => {
+                                if (!index) {
+                                    this.trackList.push(Object.assign({}, item, { trackName: this.standTrackSectionMap[key].trackName, occupied: this.standTrackSectionMap[key].occupied }));
+                                } else {
+                                    this.trackList.push(Object.assign({}, item));
+                                }
+                            });
+                        } else {
+                            this.trackList.push({trackName: this.standTrackSectionMap[key].trackName, occupied: this.standTrackSectionMap[key].occupied, noData: true});
+                        }
+                    }
+                }
+                console.log(this.trackList, 'trackList', this.standTrackSectionMap);
+            }
+        },
+        '$store.state.map.mapDataLoadedCount': function (val) { // 地图数据加载完成
+            console.log(this.sectionList, 'sectionList');
+            this.sectionList.forEach(item => {
+                if (item.standTrack) {
+                    this.standTrackSectionMap[item.code] = { trackName: item.name, occupied: false, belongStation:item.belongStation, lines: [] };
+                }
+            });
+        }
+    },
+    mounted() {
+        this.dialogVisible = false;
     },
     methods: {
         handleClose() {
@@ -298,20 +359,47 @@ export default {
         },
         doShow() {
             this.dialogVisible = true;
-            this.selectCode = this.stationList[0].code;
+            if (this.stationList[0]) {
-            this.selectCode1 = this.stationList[0].code;
+                this.selectStandCode(this.stationList[0].code);
-            this.infoList = this.stationDataMap[this.selectCode] ? this.stationDataMap[this.selectCode].trackView.lines : [];
+                this.selectStandCode1(this.stationList[0].code);
-            this.tableData = this.stationDataMap[this.selectCode1] ? this.stationDataMap[this.selectCode1].routeSequence.lines : [];
+            }
-            this.readOnly = this.stationDataMap[this.selectCode1] ? this.stationDataMap[this.selectCode1].routeSequence.readOnly : false;
         },
         selectStandCode(code) {
             this.selectCode = code;
-            this.infoList = this.stationDataMap[this.selectCode].trackView.lines;
+            this.trackList = [];
+            for (const key in this.standTrackSectionMap) {
+                if (this.standTrackSectionMap[key].belongStation === this.selectCode) {
+                    if (this.standTrackSectionMap[key].lines && this.standTrackSectionMap[key].lines.length) {
+                        this.standTrackSectionMap[key].lines.forEach((item, index) => {
+                            if (!index) {
+                                this.trackList.push(Object.assign({}, item, { sectionName: this.standTrackSectionMap[key].sectionName, occupied: this.standTrackSectionMap[key].occupied }));
+                            } else {
+                                this.trackList.push(Object.assign({}, item));
+                            }
+                        });
+                    } else {
+                        this.trackList.push({sectionName: this.standTrackSectionMap[key].sectionName, occupied: this.standTrackSectionMap[key].occupied});
+                    }
+                }
+            }
+        },
+        getRouteStatus(status) {
+            if (status === '2') {
+                return '触发完成';
+            } else if (status === '1') {
+                return '正在触发';
+            } else {
+                return '等待中';
+            }
         },
         selectStandCode1(code) {
             this.selectCode1 = code;
-            this.tableData = this.stationDataMap[this.selectCode1].routeSequence.lines;
+            this.sequenceList = [];
-            this.readOnly = this.stationDataMap[this.selectCode1].routeSequence.readOnly;
+            for (const key in this.sequenceMap) {
+                if (this.sequenceMap[key].stationCode === this.selectCode1) {
+                    this.sequenceList.push(this.sequenceMap[key]);
+                }
+            }
         },
         getRouteName(code) {
             if (code) {