rt-sim-training-client/src/views/planMonitor/newEditTool/index.vue

<template>
  <div class="plan-tool" style="width: 100%; height: 100%;padding-top: 45px;">
    <menu-bar
      ref="menuBar"
      :load-run-plan-id="loadRunPlanId"
      :load-run-plan-name="loadRunPlanName"
      :run-plan-list="runPlanList"
      @doClose="doClose"
      @dispatchDialog="dispatchDialog"
      @loadingRunPlan="loadingRunPlan"
      @modifyRunPlanName="modifyRunPlanName"
      @refresh="refreshRunPlanList"
      @refreshData="refresh"
    />
    <!-- :plan-parser="PlanParser" -->
    <div class="scheduleIn">
      <schedule
        ref="schedule"
        v-loading="runplanLoading"
        :plan-parser="PlanParser"
        :load-run-plan-id="loadRunPlanId"
        :load-run-plan-name="loadRunPlanName"
      />
      <status-bar ref="statusBar" :load-run-plan-id="loadRunPlanId" @dispatchDialog="dispatchDialog" @showTrain="showTrain" @refresh="refresh" />
    </div>
    <parameter ref="parameter" />
    <off-line ref="offLine" @handleConfirm="handleConfirm" @dispatchDialog="dispatchDialog" />
    <add-planning-train ref="addPlanningTrain" :load-run-plan-id="loadRunPlanId" @dispatchDialog="dispatchDialog" />
    <edit-planning-train
      ref="editPlanningTrain"
      :load-run-plan-id="loadRunPlanId"
      @dispatchDialog="dispatchDialog"
      @dispatchOperate="dispatchOperate"
      @refresh="refresh"
    />
    <duplicate-train ref="duplicateTrain" @dispatchDialog="dispatchDialog" @dispatchOperate="dispatchOperate" @refresh="refresh" />
    <move-planing-train ref="movePlaningTrain" :load-run-plan-id="loadRunPlanId" @dispatchDialog="dispatchDialog" @dispatchOperate="dispatchOperate" @refresh="refresh" />

    <systerm-out ref="systermOut" />
    <add-task ref="addTask" @dispatchOperate="dispatchOperate" @refresh="refresh" />
    <delete-task ref="deleteTask" @dispatchOperate="dispatchOperate" @refresh="refresh" />
    <modifying-task ref="modifyingTask" :load-run-plan-id="loadRunPlanId" @dispatchOperate="dispatchOperate" @refresh="refresh" />

    <modifying-station-interval-time ref="modifyingStationIntervalTime" />
    <modifying-station-stop-time ref="modifyingStationStopTime" />
    <edit-plan-name ref="editPlan" @renewal="refreshRunPlanName" />

    <create-empty-plan ref="createEmptyPlan" @refresh="refreshRunPlanList" />
  </div>
</template>

<script>
import MenuBar from './menuBar';
import StatusBar from './statusBar';
import Schedule from '../components/schedule';
import Parameter from './menus/parameter/index';
import OffLine from '../components/menus/offLine';
import AddPlanningTrain from '../components/menus/addPlanningTrain';
import EditPlanningTrain from '../components/menus/editPlanningTrain';
import EditPlanName from '../components/menus/editPlanName';
import DuplicateTrain from '../components/menus/duplicateTrain';
import SystermOut from '../components/menus/systermOut';
import AddTask from '../components/menus/addTask';
import DeleteTask from '../components/menus/deleteTask';
import ModifyingTask from '../components/menus/modifyingTask';
import MovePlaningTrain from '../components/menus/movePlaningTrain';
import ModifyingStationIntervalTime from '../components/menus/modifyingStationIntervalTime';
import ModifyingStationStopTime from '../components/menus/modifyingStationStopTime';
import CreateEmptyPlan from './menus/createEmptyPlan';
import { deletePlanService } from '@/api/runplan';
import { loadMapDataById } from '@/utils/loaddata';
import { getRpListByMapId } from '@/api/runplan';

export default {
    name: 'Menus',
    components: {
        MenuBar,
        StatusBar,
        Schedule,
        Parameter,
        OffLine,
        AddPlanningTrain,
        EditPlanningTrain,
        DuplicateTrain,
        SystermOut,
        AddTask,
        DeleteTask,
        ModifyingTask,
        // AddSmoothRunTime,
        // EditSmoothRunTime,
        ModifyingStationIntervalTime,
        ModifyingStationStopTime,
        EditPlanName,
        MovePlaningTrain,
        CreateEmptyPlan
    },
    data() {
        return {
            PlanParser: {},
            runPlanList: [],
            loadRunPlanId: '',
            loadRunPlanName: '',
            runplanLoading:false
        };
    },
    computed: {
        lineCode() {
            return this.$route.query.lineCode || '02';
        }
    },
    watch: {
        '$store.state.map.mapDataLoadedCount': function (val) {
            this.runplanLoading = false;
        }
    },
    created() {
        this.PlanParser = this.$theme.loadPlanParser(this.lineCode);
    },
    async mounted() {
        // this.loadRunPlanName = this.$route.query.planName;
        if (this.$route.query.mapId) {
            this.refreshRunPlanList(true);
            await this.loadMap();
        }
    },
    beforeDestroy() {
    },
    methods: {
        dispatchDialog(dialogObj) {
            this.$nextTick(() => {
                if (dialogObj.name == 'gernaratePlanTrain') {
                    this.$refs['menuBar'].handleGernaratePlanningTrain();
                } else {
                    if (this.$refs[dialogObj.name]) {
                        this.$refs[dialogObj.name].doShow(dialogObj.params);
                    }
                }
            });
        },
        dispatchOperate(operateObj) {
            this.$nextTick(() => {
                if (this.$refs[operateObj.dialogName]) {
                    this.$refs[operateObj.dialogName][operateObj.operate](operateObj.params);
                }
            });
        },
        async loadMap() {
            this.runplanLoading = true;
            // 加载地图数据
            loadMapDataById(this.$route.query.mapId, 'parse');
        },
        handleConfirm(params) {
            if (params.operate == 'AddPlanningTrain') {
                // 添加计划
                this.$refs.addPlanningTrain.handleConfirm();
            } else if (params.operate == 'DeletePlanningTrain') {
                // 删除计划
                const model = {
                    planId: this.$route.query.planId,
                    serviceNumber: params.serviceNumber
                };
                deletePlanService(model).then(resp => {
                    this.$message.success(this.$t('tip.deletePlanSuccessfully'));
                    this.$store.dispatch('runPlan/setSelected', {});
                    this.$store.dispatch('runPlan/refresh');
                    // this.$refs.openRunPlan.loadRunPlanData(Object.assign({refresh: true}, this.$route.query));
                }).catch(() => {
                    this.$messageBox(this.$t('tip.deletePlanFailed'));
                });
            }
        },
        showTrain() {
            if (this.$refs.schedule) {
                this.$refs.schedule.displayTrain();
            }
        },
        refresh() {
            this.$store.dispatch('runPlan/refresh');
        },
        refreshRunPlanList(planId) {
            getRpListByMapId(this.$route.query.mapId).then(resp => {
                this.runPlanList = resp.data || [];
                if (planId && this.runPlanList.length) {
                    this.runPlanList.forEach(item => {
                        if (item.id === planId) {
                            this.loadRunPlanId = item.id;
                            this.loadRunPlanName = item.name;
                        }
                    });
                } else {
                    this.loadRunPlanId = '';
                    this.loadRunPlanName = '';
                }
            }).catch(() => {
                this.$message.error('获取草稿运行图列表失败');
            });
        },
        doClose() {
            this.$emit('doClose');
        },
        loadingRunPlan(param) {
            this.loadRunPlanId = param.planId;
            this.loadRunPlanName = param.planName;
        },
        modifyRunPlanName() {
            if (this.loadRunPlanId && this.loadRunPlanName) {
                this.$refs.editPlan.doShow({id: this.loadRunPlanId, name: this.loadRunPlanName});
            } else {
                this.$message.info(this.$t('planMonitor.openRunPlan.pleaseSelectRunplan'));
            }
        },
        refreshRunPlanName(name) {
            this.$refs.schedule.refreshRunPlanName(name);
            this.$router.replace({ path: this.$route.path, query: { ...this.$route.query, planName: name }});
        }
    }
};
</script>

<style>
    .plan-tool {
        position: absolute;
    }

    .plan-tool .pop-menu {
        background: #F0F0F0;
    }

    .plan-tool .pop-menu span {
        color: #000;
    }

    .scheduleIn{
        width:100%;
        height: 100%;
        position: relative;
    }

    .plan-tool .system-close {
        cursor: pointer;
        height: 25px;
        width: 25px;
        background: -webkit-linear-gradient(#CD98A0, #C27D6E, #B63022, #C68770);
        background: -o-linear-gradient(#CD98A0, #C27D6E, #B63022, #C68770);
        background: -moz-linear-gradient(#CD98A0, #C27D6E, #B63022, #C68770);
        background: linear-gradient(#CD98A0, #C27D6E, #B63022, #C68770);
        border: 1px solid white;
        border-radius: 4px;
    }

    .plan-tool .system-close::before {
        position: absolute;
        top: 0px;
        left: 0px;
        font-size: x-large;
    }

    .planEdit__tool {
        overflow: hidden !important;
    }
</style>