综合演练问题调整

2022-12-01 10:58:16 +08:00 · 2022-12-01 10:58:16 +08:00 · 797afc7258
commit 797afc7258
parent ad1ba2efd4
18 changed files with 177 additions and 1314 deletions
--- a/src/scripts/ConstDic.js
+++ b/src/scripts/ConstDic.js
@ -377,3 +377,7 @@ export const UserOperationType = {
    CHOOSEVALUE: '选择',
    FILLVALUE: '填写'
 };
+export const SimulationUserType = {
+    TEACHER: 'TEACHER',
+    STUDENT: 'STUDENT'
+};
--- a/src/store/modules/training.js
+++ b/src/store/modules/training.js
@ -3,6 +3,7 @@ import { TrainingMode } from '@/scripts/ConstDic';
 import deviceType from '../../jmapNew/constant/deviceType';
 import LangStorage from '@/utils/lang';
 import { deepAssign } from '@/utils/index';
+import store from '@/store/index';

 /**
 * 实训状态数据
@ -47,7 +48,8 @@ const training = {
        trainingStart: false, // 实训开始状态
        notifySelected: null, // 场景弹窗内容
        runPathList:[], // 运行线 (宁波三号线)
-        domConfig: {} // 线路功能前端配置项
+        domConfig: {}, // 线路功能前端配置项
+        simulationUserType: '' // 仿真用户角色
    },

    getters: {
@ -211,6 +213,12 @@ const training = {
            }
        },
        setSimulationUserList: (state, simulationUserList) => {
+            state.simulationUserType = '';
+            simulationUserList.forEach(item => {
+                if (item.userId == store.state.user.id ) {
+                    state.simulationUserType = item.userType;
+                }
+            });
            state.simulationUserList = simulationUserList;
        },
        updateMemberTrust:(state, {deviceCode, trust}) => {
@ -244,7 +252,7 @@ const training = {
                        user.online = item.online;
                        user.memberId = item.memberId;
                        user.role = item.role;
-                        user.type = item.type;
+                        user.memberType = item.memberType;
                        user.deviceCode = item.deviceCode;
                        memberIndex = index;
                    }
--- a/src/utils/baseUrl.js
+++ b/src/utils/baseUrl.js
@ -23,13 +23,13 @@ export function handlerUrl() {
    let OSS_URL;
    if (process.env.NODE_ENV === 'development') {
        // 开发分支
-        BASE_API = 'http://192.168.3.233/rtss-server';
+        // BASE_API = 'http://192.168.3.233/rtss-server';
        // BASE_API = 'https://joylink.club/jlcloud';
        // BASE_API = 'https://test.joylink.club/jlcloud';
        // BASE_API = 'http://114.116.51.125/jlcloud';
        // BASE_API = 'http://192.168.3.90:9000'; // 周寅
        // BASE_API = 'http://192.168.3.94:9000'; // 旭强
-        // BASE_API = 'http://192.168.3.15:9000'; // 张赛
+        BASE_API = 'http://192.168.3.15:9000'; // 张赛
        // BASE_API = 'http://192.168.3.5:9000'; // 夏增彬
        // BASE_API = 'http://192.168.3.37:9000'; // 卫志宏
        // BASE_API = 'http://b29z135112.zicp.vip';
--- a/src/utils/stomp.js
+++ b/src/utils/stomp.js
@ -62,6 +62,9 @@ export function getTopic(type, group, param) {
    case 'YJDDZH':
        topic = `/topic/yjddzh/trainPosition`;
        break;
+    case 'RUNFACT':
+        topic = `/user/queue/simulation/${group}/runFact`;
+        break;
    }

    return topic;
--- a/src/views/newMap/display/index.vue
+++ b/src/views/newMap/display/index.vue
@ -29,6 +29,7 @@ import TrainingMenu from './trainingList/trainingMenu';
 import TrainingDesign from './trainingDesign/designPane.vue';
 import VoiceChatBox from './voiceChatBox';
 import DesignTrainingMenu from './trainingList/designTrainingMenu';
+import { SimulationUserType } from '@/scripts/ConstDic';
 export default {
    name: 'DisplayDraft',
    components: {
@ -99,7 +100,9 @@ export default {
        this.$store.dispatch('trainingNew/clearStepOverCount');
        this.$store.dispatch('trainingNew/trainingEnd');
        this.$store.dispatch('trainingNew/changeTeachMode', '');
-        clearSimulation(this.group);
+        if (this.$store.state.training.simulationUserType === SimulationUserType.TEACHER) {
+            clearSimulation(this.group);
+        }
    },
    methods:{
        // 缩放设置
@ -141,9 +144,6 @@ export default {
            this.$nextTick(() => {
                EventBus.$emit('viewLoading', false);
            });
-        },
-        // 仿真错误时，被动退出时调用
-        async back() {
        }
    }
 };
--- a/src/views/newMap/display/memberManage/addMember.vue
+++ b/src/views/newMap/display/memberManage/addMember.vue
@ -4,6 +4,7 @@
    :title="title"
    :visible.sync="dialogVisible"
    width="500px"
+    append-to-body
    :before-close="handleClose"
    center
    :close-on-click-modal="false"
@ -100,7 +101,7 @@ export default {
        }
    },
    methods: {
-        initData(row) {
+        initData() {
            this.filterStationList = [];
            this.stationList.forEach(item => {
                if (!item.depot) {
@ -108,8 +109,8 @@ export default {
                }
            });
        },
-        doShow(row) {
-            this.initData(row);
+        doShow() {
+            this.initData();
            this.dialogVisible = true;
        },
        doSave() {
--- a/src/views/newMap/display/memberManage/e-members.vue
+++ b/src/views/newMap/display/memberManage/e-members.vue
@ -16,8 +16,8 @@
          @node-contextmenu="handleShowContextMenu"
        >
          <span slot-scope="{ node, data }">
-            <span v-if="node.data.online" style="color: green;">{{ data.nickName + (data.admin? '【管理员】':'') + (data.referee? '【裁判员】':'') + (data.deviceVO? ` -- (${data.deviceVO.code})`:'') }}</span>
-            <span v-else style="color: #ccc;">{{ data.nickName + (data.admin? '【管理员】':'') + (data.referee? '【裁判员】':'') + (data.deviceVO? ` -- (${data.deviceVO.code})`:'') }}</span>
+            <span v-if="node.data.online" style="color: green;">{{ data.nickName + (data.userType === 'TEACHER'? '【教员】':'') + (data.referee? '【裁判员】':'') + (data.deviceVO? ` -- (${data.deviceVO.code})`:'') }}</span>
+            <span v-else style="color: #ccc;">{{ data.nickName + (data.userType === 'TEACHER'? '【教员】':'') + (data.referee? '【裁判员】':'') + (data.deviceVO? ` -- (${data.deviceVO.code})`:'') }}</span>
          </span>
        </el-tree>
      </el-scrollbar>
@ -29,6 +29,7 @@
 <script>
 import { DeviceMenu } from '@/scripts/ConstDic';
 import ContentMenu from './content-menu';
+import { SimulationUserType } from '@/scripts/ConstDic';

 export default {
    components: {
@ -42,12 +43,6 @@ export default {
        members: {
            type: Array,
            required: true
-        },
-        isAdmin: {
-            type: Boolean,
-            default() {
-                return false;
-            }
        }
    },
    data() {
@ -97,7 +92,7 @@ export default {
                x: e.clientX,
                y: e.clientY
            };
-            if (this.isAdmin) {
+            if (this.$store.state.training.simulationUserType === SimulationUserType.TEACHER) {
                this.clickUserId = `${obj.userId || ''}`;
                this.menuDisabled = !!obj.deviceVO;
                this.$store.dispatch('menuOperation/setPopMenu', { position, menu: DeviceMenu.JointRoom });
--- a/src/views/newMap/display/memberManage/membersManage.vue
+++ b/src/views/newMap/display/memberManage/membersManage.vue
@ -43,13 +43,13 @@
          class="room__container--members"
          :room="room"
          :members="simulationUserList"
-          :is-admin="isAdmin"
          style="height: 100%"
          @message="messageInfo"
        />
      </div>
      <div class="room__footer" />
    </div>
+    <add-member ref="addMember" :station-list="stationList" />
  </el-drawer>
 </template>

@ -57,18 +57,12 @@
 import eMembers from './e-members';
 import { EventBus } from '@/scripts/event-bus';
 import { assignUsersPlayRoles } from '@/api/jointSimulation';
+import AddMember from './addMember';
 export default {
    name: 'MembersManage',
    components: {
-        eMembers
-    },
-    props: {
-        isAdmin: {
-            type: Boolean,
-            default() {
-                return false;
-            }
-        }
+        eMembers,
+        AddMember
    },
    data() {
        return {
@ -166,7 +160,6 @@ export default {
            return this.$store.state.user.nickname;
        },
        roles() {
-            console.log(this.$store.state.training.userRole, '-----------------');
            return this.$store.state.training.roles;
        }
    },
@ -404,7 +397,7 @@ export default {
            });
        },
        addMember() {
-            this.$emit('addSimulationMember');
+            this.$refs.addMember.doShow();
        },
        filterNode(value, data) {
            let flag = false;
@ -427,6 +420,8 @@ export default {
                    this.$store.dispatch('training/setUserRole', userRole);
                    this.$store.dispatch('training/setRoles', userRole);
                    this.$store.dispatch('training/updateMemberAndUser', { simulationUserList: [item], userId: this.userId });
+                } else {
+                    this.$store.dispatch('training/updateMemberAndUser', { simulationUserList: [item], userId: this.userId });
                }
            });
        }
--- a/src/views/newMap/display/simulationControl.vue
+++ b/src/views/newMap/display/simulationControl.vue
@ -5,9 +5,18 @@
      <span style="margin-left: 10px;font-size: 14px;">{{ dateString }}</span>
    </div>
    <div style="display: flex;">
-      <el-button class="controlButton" type="info" style="background: #000;" :loading="pauseLoading" circle :class="simulationPaused?'el-icon-video-play':'el-icon-video-pause'" @click="startOrPause" />
+      <el-button
+        class="controlButton"
+        type="info"
+        style="background: #000;"
+        :disabled="isDisabled"
+        :loading="pauseLoading"
+        circle
+        :class="simulationPaused?'el-icon-video-play':'el-icon-video-pause'"
+        @click="startOrPause"
+      />
      <div>
-        <div class="simulationMenu" @click="showMenuSpeedList">{{ `x${speed}` }}</div>
+        <div class="simulationMenu" :style="{cursor: isDisabled ? 'not-allowed':'pointer'}" @click="showMenuSpeedList">{{ `x${speed}` }}</div>
        <div v-show="isShowSpeedMenuList" class="simulationMenuList" style="right: 85px;">
          <div v-for="(each, index) in speedList" :key="index">
            <div class="eachSimulationMenu" :class="{'active' :speed === each.value}" @click="speedChange(each.value)">{{ each.label }}</div>
@ -15,7 +24,7 @@
        </div>
      </div>
      <div>
-        <div class="simulationMenu" style="width: 70px;" :style="{background: nowMode === '正常操作' ? '#0fb20b' :'#efc007'}" @click="changeOperateMode">{{ nowMode }}</div>
+        <div class="simulationMenu" style="width: 70px;" :style="{background: nowMode === '正常操作' ? '#0fb20b' :'#efc007',cursor: isDisabled ? 'not-allowed':'pointer'}" @click="changeOperateMode">{{ nowMode }}</div>
      </div>
    </div>
  </div>
@ -25,6 +34,7 @@ import { simulationPause, simulationStart, timesSpeedPlayback } from '@/api/rtSi
 import { OperateMode } from '@/scripts/ConstDic';
 import { getSessionStorage } from '@/utils/auth';
 import { timestampFormat } from '@/utils/date';
+import { SimulationUserType } from '@/scripts/ConstDic';
 export default {
    name:'SimulationControl',
    data() {
@ -76,6 +86,9 @@ export default {
            } else {
                return '正常操作';
            }
+        },
+        isDisabled() {
+            return this.$store.state.training.simulationUserType !== SimulationUserType.TEACHER;
        }
    },
    watch: {
@ -96,21 +109,25 @@ export default {
            this.dateString = timestampFormat('YYYYMMDD', date);
        },
        changeOperateMode() {
-            let val = '';
-            if (this.nowMode === '正常操作') {
-                val = OperateMode.FAULT;
-            } else {
-                val = OperateMode.NORMAL;
+            if (this.$store.state.training.simulationUserType === SimulationUserType.TEACHER) {
+                let val = '';
+                if (this.nowMode === '正常操作') {
+                    val = OperateMode.FAULT;
+                } else {
+                    val = OperateMode.NORMAL;
+                }
+                this.$store.dispatch('training/changeOperateMode', { mode: val });
            }
-            this.$store.dispatch('training/changeOperateMode', { mode: val });
        },
        showMenuModeList() {
            event.stopPropagation();
            this.isShowModeMenuList = !this.isShowModeMenuList;
        },
        showMenuSpeedList(event) {
-            event.stopPropagation();
-            this.isShowSpeedMenuList = !this.isShowSpeedMenuList;
+            if (this.$store.state.training.simulationUserType === SimulationUserType.TEACHER) {
+                event.stopPropagation();
+                this.isShowSpeedMenuList = !this.isShowSpeedMenuList;
+            }
        },
        startOrPause() {
            this.pauseLoading = true;
--- a/src/views/newMap/display/simulationMenu.vue
+++ b/src/views/newMap/display/simulationMenu.vue
--- a/src/views/newMap/display/simulationMenu/simulationMenu.vue
+++ b/src/views/newMap/display/simulationMenu/simulationMenu.vue
@ -16,8 +16,6 @@
    <select-exam ref="selectExam" @examStart="examStart" />
    <exam-panel ref="examPanel" />
    <device-manage ref="deviceManage" />
-    <diagram-load ref="diagramLoad" :group="group" />
-    <diagram-preview ref="diagramPreview" />
    <qr-code ref="qrCode" />
  </div>
 </template>
@ -35,8 +33,7 @@ import ExamPanel from '../exam/examPanel';
 import getErrorTip from '@/scripts/errorTip';
 import DeviceManage from './deviceManage';
 import QrCode from '@/components/QrCode';
-import DiagramLoad from './diagramLoad';
-import DiagramPreview from './diagramPreview';
+import { SimulationUserType } from '@/scripts/ConstDic';

 export default {
    name: 'SimulationMenu',
@ -49,9 +46,7 @@ export default {
        Jl3dDevice,
        MemberManage,
        DeviceManage,
-        QrCode,
-        DiagramPreview,
-        DiagramLoad
+        QrCode
    },
    data() {
        return {
@ -62,16 +57,14 @@ export default {
            deviceShow: true,
            allMenuList: [
                { label: '设备视图', name: 'jlmap3dmodel', click: this.jlmap3dmodel, isDisabled: () => { return false; }, isShow: () => { return true; } },
-                { label: '设备管理', name: 'deviceManage', click: this.deviceManage, isDisabled: () => { return false; }, isShow: () => { return this.$store.state.training.domConfig.hasDeviceManage; } },
+                { label: '设备管理', name: 'deviceManage', click: this.deviceManage, isDisabled: () => { return false; }, isShow: () => { return this.$store.state.training.domConfig.hasDeviceManage && this.$store.state.training.simulationUserType === SimulationUserType.TEACHER; } },
                { label: '联系方式', name: 'contectUs', click: this.contectUs, isDisabled: () => { return false; }, isShow: () => { return true; } },
-                { label: '生成二维码', name: 'generateQrCode', click: this.generateQrCode, isDisabled: () => { return false; }, isShow: () => { return this.$store.state.training.domConfig.isJoint; } },
-                { label: '切换客流数据', name: 'changeFlowData', click: this.changeFlowData, isDisabled: () => { return false; }, isShow: () => { return this.$store.state.training.domConfig.hasLpf; } },
-                { label: '运行图加载', name: 'diagramLoad', click: this.diagramLoad, isDisabled: () => { return false; }, isShow: ()=>{ return this.$route.query.simType === 'METRO'; } },
-                { label: '运行图预览', name: 'diagramPreview', click: this.diagramPreview, isDisabled: () => { return false; }, isShow: ()=>{ return this.$route.query.simType === 'METRO'; } },
-                { label: '成员管理', name: 'memberManage', click: this.memberManage, isDisabled: () => { return false; }, isShow: () => { return !this.$store.state.training.domConfig.hasMemberManage; } },
-                { label: '考试', name: 'exam', click: this.goExam, isDisabled: () => { return false; }, isShow: () => { return this.$store.state.training.domConfig.hasExam; } },
-                { label: '按计划行车', name: 'drivingPlan', click: this.drivingPlan, isDisabled: () => { return this.$store.state.trainingNew.trainingSwitch; }, isShow: () => { return true; } },
-                { label: '初始化', name: 'initialize', click: this.initializeSim, isDisabled: () => { return this.$store.state.trainingNew.trainingSwitch; }, isShow: () => { return true; } },
+                { label: '生成二维码', name: 'generateQrCode', click: this.generateQrCode, isDisabled: () => { return false; }, isShow: () => { return this.$store.state.training.domConfig.isJoint && this.$store.state.training.simulationUserType === SimulationUserType.TEACHER; } },
+                { label: '切换客流数据', name: 'changeFlowData', click: this.changeFlowData, isDisabled: () => { return false; }, isShow: () => { return this.$store.state.training.domConfig.hasLpf && this.$store.state.training.simulationUserType === SimulationUserType.TEACHER; } },
+                { label: '成员管理', name: 'memberManage', click: this.memberManage, isDisabled: () => { return false; }, isShow: () => { return !this.$store.state.training.domConfig.hasMemberManage && this.$store.state.training.simulationUserType === SimulationUserType.TEACHER; } },
+                { label: '考试', name: 'exam', click: this.goExam, isDisabled: () => { return false; }, isShow: () => { return this.$store.state.training.domConfig.hasExam && this.$store.state.training.simulationUserType === SimulationUserType.TEACHER; } },
+                { label: '按计划行车', name: 'drivingPlan', click: this.drivingPlan, isDisabled: () => { return this.$store.state.trainingNew.trainingSwitch; }, isShow: () => { return this.$store.state.training.simulationUserType === SimulationUserType.TEACHER; } },
+                { label: '初始化', name: 'initialize', click: this.initializeSim, isDisabled: () => { return this.$store.state.trainingNew.trainingSwitch; }, isShow: () => { return this.$store.state.training.simulationUserType === SimulationUserType.TEACHER; } },
                { label: '退出', name: 'quit', click: this.exitSim, isDisabled: () => { return false; }, isShow: () => { return true; } }
            ]
        };
@ -90,6 +83,22 @@ export default {
            return this.$route.query.mapId;
        }
    },
+    watch: {
+        '$store.state.training.simulationUserType': function (val) {
+            this.handleMenuShow();
+        },
+        '$store.state.socket.simulationOver':function(val) {
+            this.back();
+        },
+        '$store.state.socket.simulationRoleList':function(val) {
+            console.log('**************', val);
+            (val || []).forEach(item => {
+                if (item.body.messageType === 'KICK_OUT' && item.body.userId == this.$store.state.user.id) {
+                    this.back();
+                }
+            });
+        }
+    },
    mounted() {
        window.addEventListener('click', this.close, false);
    },
@ -101,14 +110,6 @@ export default {
        this.$store.dispatch('trainingNew/changeTeachMode', '');
    },
    methods: {
-        diagramLoad() {
-            this.hideMenuList();
-            this.$refs.diagramLoad.doShow();
-        },
-        diagramPreview() {
-            this.hideMenuList();
-            this.$refs.diagramPreview.doShow();
-        },
        generateQrCode() {
            this.hideMenuList();
            getSimulationQrcode(this.$route.query.group).then(resp => {
@ -178,17 +179,20 @@ export default {
                cancelButtonText: '取 消',
                type: 'warning'
            }).then(() => {
-                if (this.projectDevice && this.$route.query.type === 'IM') {
-                    clearSimulation(this.group).then(() => {
-                        this.logout();
-                    });
-                } else if (this.projectDevice) {
-                    this.logout();
-                } else {
-                    this.$router.go(-1);
-                }
+                this.back();
            });
        },
+        back() {
+            if (this.projectDevice && this.$route.query.type === 'IM') {
+                clearSimulation(this.group).then(() => {
+                    this.logout();
+                });
+            } else if (this.projectDevice) {
+                this.logout();
+            } else {
+                this.$router.go(-1);
+            }
+        },
        initializeSim() {
            initSimulation(this.group).then(() => {
                this.$store.dispatch('training/setMapDefaultState').then(() => {
--- a/src/views/newMap/display/terminals/bigScreen.vue
+++ b/src/views/newMap/display/terminals/bigScreen.vue
@ -31,7 +31,7 @@ export default {
        }
    },
    watch: {
-        '$store.state.map.initJlmapLoadedCount': function (val) {
+        '$store.state.map.initJlmapLoadedCount': function () {
            this.handleBigScreenData();
        },
        mapDevice() {
--- a/src/views/newMap/display/simulationMenu/diagramLoad.vue
+++ b/src/views/newMap/display/simulationMenu/diagramLoad.vue
@ -1,6 +1,6 @@
 <template>
-  <div v-show="show" class="run-plan-dialog" :style="{width: width + 'px',height:height + 'px'}">
-    <plan-schedule ref="planSchedule" :group="group" @back="doClose" />
+  <div class="run-plan-dialog" :style="{width: width + 'px',height:height + 'px'}">
+    <plan-schedule ref="planSchedule" :group="group" />
  </div>
 </template>

@ -22,8 +22,7 @@ export default {
    },
    data() {
        return {
-            menus: null,
-            show: false
+            menus: null
        };
    },
    computed: {
@ -53,19 +52,18 @@ export default {
    beforeDestroy() {
        this.$store.dispatch('runPlan/setPlanData', []);
    },
-    methods: {
-        doShow() {
-            this.show = true;
+    mounted() {
+        this.$nextTick(() => {
            this.$refs.planSchedule.setPosition();
-        },
-        doClose() {
-            this.show = false;
-        }
+            this.$refs.planSchedule.loadChartPage();
+        });
+    },
+    methods: {
    }
 };
 </script>
 <style rel="stylesheet/scss" lang="scss" scoped>
-@import "src/styles/mixin.scss";
+@import "src/styles/mixin";

 .run-plan-dialog {
 	-webkit-user-select: none;
--- a/src/views/newMap/display/simulationMenu/diagramPreview.vue
+++ b/src/views/newMap/display/simulationMenu/diagramPreview.vue
@ -1,37 +1,23 @@
 <template>
-  <el-dialog
-    v-dialogLoading="dialogLoading"
-    :title="title"
-    :width="maxWidth + 'px'"
-    top="0"
-    :style="{left:$store.state.app.width> 1920? '50%': '0'}"
-    :visible.sync="dialogShow"
-    :before-close="doClose"
-    :close-on-click-modal="false"
-    :modal="false"
-  >
-    <div id="PlanSchedule" :style="{top: top+'px', height: height+'px'}">
-      <div class="left">
-        <div :id="runPlanId" />
-      </div>
-      <div class="right">
-        <data-table
-          ref="serviceTable1"
-          :height="height/2"
-          :config="serviceNumberConfig"
-          :style="{top: top-height/2+'px'}"
-          @touch="scheduleTouch"
-        />
-        <data-table
-          ref="tripTable1"
-          :height="height/2"
-          :config="tripNumberConfig"
-          :style="{top: top-height/2+'px'}"
-          @touch="trainNumTouch"
-        />
-      </div>
+  <div id="PlanSchedule" :style="{height: height+'px'}">
+    <div class="left">
+      <div :id="runPlanId" />
    </div>
-  </el-dialog>
+    <div class="right">
+      <data-table
+        ref="serviceTable1"
+        :height="height/2 - 20"
+        :config="serviceNumberConfig"
+        @touch="scheduleTouch"
+      />
+      <data-table
+        ref="tripTable1"
+        :height="height/2 - 20"
+        :config="tripNumberConfig"
+        @touch="trainNumTouch"
+      />
+    </div>
+  </div>
 </template>

 <script>
@ -41,7 +27,7 @@ import DataTable from '@/views/planSchedule/menusPlan/components/dataTable';
 import echarts from 'echarts';
 import {toTimeStamp, formatDuring} from '@/utils/date';
 import { deepAssign } from '@/utils/index';
-import { EventBus } from '@/scripts/event-bus';
+import { clearSubscribe, getTopic} from '@/utils/stomp';
 let myChart = null;
 export default {
    name: 'DiagramPreview',
@ -50,11 +36,9 @@ export default {
    },
    data() {
        return {
-            top: 0,
            height: 0,
            inter:null,
            runPlanId: 'run-plan-view',
-            // myChart: null,
            PlanParser: {},
            serviceNumberConfig: {
                data: [],
@ -90,8 +74,6 @@ export default {
            kmRangeMap: {},
            absoluteTime: 2 * 3600,
            indexKmRangeMap: {},
-            dialogLoading: false,
-            dialogShow: false,
            seriesMap: {},
            staticSeries: [],
            runSeries: [],
@ -108,9 +90,6 @@ export default {
        },
        maxHeight() {
            return this.$store.state.app.height > 1080 ? 1080 : this.$store.state.app.height;
-        },
-        title() {
-            return this.$t('display.runPlan.previewRunDiagram');
        }
    },
    watch: {
@ -124,9 +103,7 @@ export default {
            try {
                await this.loadChartPage();
                this.selectSeries = []; this.runSeries = []; this.runPlanData = {};
-                if (this.dialogShow) {
-                    await this.loadInitData();
-                }
+                await this.loadInitData();
            } catch (e) {
                console.error(e);
            } finally {
@ -135,9 +112,7 @@ export default {
        },
        '$store.state.socket.simulationReset': function (val) {
            this.selectSeries = []; this.runSeries = []; this.runPlanData = {};
-            if (this.dialogShow) {
-                this.loadInitData();
-            }
+            this.loadInitData();
        },
        '$store.state.runPlan.planSizeCount': function () {
            this.reSize({ width: this.$store.state.runPlan.width, height: this.$store.state.runPlan.height });
@ -148,36 +123,19 @@ export default {
            }
        }
    },
-    mounted() {
+    async mounted() {
        this.staticSeries = []; this.selectSeries = []; this.runSeries = []; this.runPlanData = {};
        this.PlanParser = this.$theme.loadPlanParser(this.$route.query.lineCode);
-        // this.loadChartPage();
-        EventBus.$on('clearRunSeries', () => {
-            this.runSeries = [];
-        });
+        await this.setPosition();
+        await this.loadChartPage();
+        await this.loadInitData();
    },
    beforeDestroy() {
        this.$store.dispatch('runPlan/setSelected', null);
+        clearSubscribe(getTopic('LPF', this.group));
        this.destroy();
    },
    methods: {
-        doShow() {
-            try {
-                this.dialogLoading = true;
-                this.dialogShow = true;
-                this.setPosition();
-                this.loadInitData();
-                this.inter && clearInterval(this.inter);
-            } catch (e) {
-                console.error(e);
-            } finally {
-                this.dialogLoading = false;
-            }
-        },
-        async doClose() {
-            this.dialogShow = false;
-            this.inter && clearInterval(this.inter);
-        },
        serviceNumberChange(row) {
            if (row) {
                this.$store.dispatch('runPlan/setSelected', { serviceNumber: row.serviceNumber, tripNumber: null });
@ -206,19 +164,12 @@ export default {
        },
        async setPosition() {
            this.$nextTick(() => {
-                const top = 54;
                const width = this.maxWidth * 0.85;
-                let height = this.maxHeight;
-
-                height = height - top;
+                const height = this.maxHeight;
                this.$store.dispatch('runPlan/resize', { width, height });

-                if (this.top != top) {
-                    this.top = top;
-                }
-
                if (this.height != height) {
-                    this.height = height - top;
+                    this.height = height;
                }
            });
        },
@ -455,7 +406,7 @@ export default {
                    this.destroy();
                    let startValue = 3600 + this.PlanParser.getTranslation();
                    const offsetTime = 3600;
-                    const initTime = toTimeStamp(formatDuring(this.$store.state.training.initTime));
+                    const initTime = toTimeStamp(formatDuring(this.$store.state.socket.simulationTimeSync));
                    startValue = initTime - this.PlanParser.getTranslation();
                    option.dataZoom[0].startValue = option.dataZoom[1].startValue = startValue - offsetTime;
                    option.dataZoom[0].endValue = option.dataZoom[1].endValue = startValue + offsetTime;
@ -613,7 +564,7 @@ export default {
 };
 </script>
 <style scoped rel="stylesheet/scss" lang="scss">
-@import "src/styles/mixin.scss";
+@import "src/styles/mixin";

 #PlanSchedule {
 	z-index: 5;
--- a/src/views/newMap/display/terminals/index.vue
+++ b/src/views/newMap/display/terminals/index.vue
@ -22,6 +22,8 @@
    <emergency-dispatch-work v-else-if="picture === 'emergency'" ref="emergencyDispatchWork" />
    <register-book v-else-if="picture === 'registerBook'" ref="registerBook" />
    <train-ticket v-else-if="picture === 'trainTicket'" ref="trainTicket" />
+    <diagram-load v-else-if="picture === 'diagramLoad'" ref="diagramLoad" :group="group" />
+    <diagram-preview v-else-if="picture === 'diagramPreview'" ref="diagramPreview" />
    <terminal-menu
      v-if="menuShow"
      ref="terminalMenu"
@ -59,6 +61,8 @@ import ScheduleWork from './schedulWork';
 import EmergencyDispatchWork from './emergencyDispatchWork';
 import RegisterBook from './registerBook';
 import TrainTicket from './trainTicket/index';
+import DiagramLoad from './diagramLoad';
+import DiagramPreview from './diagramPreview';

 export default {
    name: 'Index',
@ -84,7 +88,9 @@ export default {
        ScheduleWork,
        EmergencyDispatchWork,
        RegisterBook,
-        TrainTicket
+        TrainTicket,
+        DiagramLoad,
+        DiagramPreview
    },
    data() {
        return {
@ -191,6 +197,9 @@ export default {
            case 'YJDDZH':
                creatSubscribe(getTopic(type, this.group), header, defaultCallback);
                break;
+            case 'RUNFACT':
+                creatSubscribe(getTopic(type, this.group), header, defaultCallback);
+                break;
            }
        },
        clearSubscribe() {
@ -198,6 +207,7 @@ export default {
            clearSubscribe(getTopic('ATS_STATUS', this.group));
            clearSubscribe(getTopic('STATE', this.group));
            clearSubscribe(getTopic('CTC', this.group));
+            clearSubscribe(getTopic('LPF', this.group));
        },
        loadingChange() {
            this.loading = true;
@ -215,6 +225,8 @@ export default {
                this.$nextTick(() => { this.subscribe('LPF'); });
            } else if (val === 'emergency') {
                this.$nextTick(() => { this.subscribe('YJDDZH'); });
+            } else if (val === 'diagramPreview') {
+                this.$nextTick(() => { this.subscribe('RUNFACT'); });
            }
            this.$nextTick(() => { this.loading = false; });
        },
--- a/src/views/newMap/display/terminals/terminalMenu.vue
+++ b/src/views/newMap/display/terminals/terminalMenu.vue
@ -85,6 +85,18 @@ export default {
                    }
                ],
                'METRO': [
+                    {
+                        name: '运行图加载',
+                        code: 'diagramLoad',
+                        roleList: ['DISPATCHER'],
+                        click: this.changePictureShow
+                    },
+                    {
+                        name: '运行图预览',
+                        code: 'diagramPreview',
+                        roleList: ['DISPATCHER', 'STATION_SUPERVISOR', 'DRIVER'],
+                        click: this.changePictureShow
+                    },
                    {
                        name: '派班工作站',
                        code: 'scheduleWork',
--- a/src/views/planSchedule/index.vue
+++ b/src/views/planSchedule/index.vue
@ -60,6 +60,9 @@ export default {
                this.$refs.schedule.setPosition();
            });
        },
+        loadChartPage() {
+            this.$refs.schedule.loadChartPage();
+        },
        dispatchDialog(dialogObj) {
            this.$nextTick(() => {
                if (this.$refs[dialogObj.name]) {
--- a/src/views/planSchedule/titleBar.vue
+++ b/src/views/planSchedule/titleBar.vue
@ -3,7 +3,7 @@
    <img class="logo" :src="logoImg">
    <span> {{ mapName }} &ensp;</span>
    <span v-if="runPlanName">({{ runPlanName }})</span>
-    <span class="system-close el-icon-close" @click="back" />
+    <!--    <span class="system-close el-icon-close" @click="back" />-->
  </div>
 </template>

@ -35,9 +35,9 @@ export default {
        }
    },
    methods: {
-        back() {
-            this.$emit('back');
-        }
+        // back() {
+        // this.$emit('back');
+        // }
    }
 };
 </script>
@ -58,7 +58,7 @@ export default {
        background: -moz-linear-gradient(#0055E8, #0099F8);
        background: linear-gradient(#0055E8, #0099F8);
        color: white;
-        font: bold;
+        font-weight: bold;
        font-size: 16px;

        .logo {