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

<template>
  <div class="plan-tool" style="width: 100%; height: 100%;">
    <menu-bar
      ref="menuBar"
      :plan-convert="PlanConvert"
      :run-plan-list="runPlanList"
      :load-run-plan-id="loadRunPlanId"
      @doClose="doClose"
      @dispatchDialog="dispatchDialog"
      @loadingRunPlan="loadingRunPlan"
      @checkIsLoadRunPlan="checkIsLoadRunPlan"
      @modifyRunPlanName="modifyRunPlanName"
    />
    <schedule
      ref="schedule"
      :plan-convert="PlanConvert"
      :load-run-plan-id="loadRunPlanId"
      :load-run-plan-name="loadRunPlanName"
      :max-height="height"
      :max-width="width"
    />
    <status-bar ref="statusBar" :load-run-plan-id="loadRunPlanId" @dispatchDialog="dispatchDialog" @showTrain="showTrain" />
    <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"
    />
    <edit-smooth-run-time ref="editSmoothRunTime" @dispatchDialog="dispatchDialog" />
    <add-smooth-run-time ref="addSmoothRunTime" @dispatchDialog="dispatchDialog" />
    <duplicate-train ref="duplicateTrain" :load-run-plan-id="loadRunPlanId" @dispatchDialog="dispatchDialog" @dispatchOperate="dispatchOperate" @refresh="refresh" />
    <modifying-routing ref="modifyingRouting" @dispatchDialog="dispatchDialog" />
    <modifying-begin-time ref="modifyingBeginTime" />

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

    <edit-station-between-time ref="editStationBetweenTime" />

    <modifying-station-interval-time ref="modifyingStationIntervalTime" />
    <populating-generic-data ref="populatingGenericData" :load-run-plan-id="loadRunPlanId" />
    <create-empty-plan ref="createEmptyPlan" @refresh="refreshRunPlanList" />
    <edit-plan-name ref="editPlan" @renewal="refreshRunPlanName" />
  </div>
</template>

<script>
import MenuBar from './menuBar';
import StatusBar from './statusBar';
import Schedule from './schedule';
import Parameter from './menus/parameter/index';
import OffLine from './menus/offLine';
import AddPlanningTrain from './menus/addPlanningTrain';
import EditPlanningTrain from './menus/editPlanningTrain';
import EditPlanName from './menus/editPlanName';
import DuplicateTrain from './menus/duplicateTrain';
import SystermOut from './menus/systermOut';
import AddTask from './menus/addTask';
import DeleteTask from './menus/deleteTask';
import ModifyingTask from './menus/modifyingTask';
import ModifyingRouting from './menus/modifyingRouting';
import ModifyingBeginTime from './menus/modifyingBeginTime';
import EditStationBetweenTime from './menus/editStationBetweenTime';
import AddSmoothRunTime from './menus/addSmoothRunTime';
import EditSmoothRunTime from './menus/editSmoothRunTime';
import ModifyingStationIntervalTime from './menus/modifyingStationIntervalTime';
import PopulatingGenericData from './menus/populatingGenericData';
import CreateEmptyPlan from './menus/createEmptyPlan';
import { deletePlanService } from '@/api/runplan';
import { checkLoginLine } from '@/api/login';
import { getRpListByMapId } from '@/api/runplan';

export default {
    name: 'Menus',
    components: {
        MenuBar,
        StatusBar,
        Schedule,
        PopulatingGenericData,
        Parameter,
        OffLine,
        AddPlanningTrain,
        EditPlanningTrain,
        DuplicateTrain,
        SystermOut,
        AddTask,
        DeleteTask,
        ModifyingTask,
        ModifyingRouting,
        ModifyingBeginTime,
        EditStationBetweenTime,
        AddSmoothRunTime,
        EditSmoothRunTime,
        ModifyingStationIntervalTime,
        CreateEmptyPlan,
        EditPlanName
    },
    data() {
        return {
            PlanConvert: {},
            timeDemon: null,
            runPlanList: [],
            loadRunPlanId: '',
            loadRunPlanName: ''
        };
    },
    computed: {
        lineCode() {
            return this.$route.query.lineCode;
        },
        width() {
            return this.$store.state.app.width;
        },
        height() {
            return this.$store.state.app.height;
        }
    },
    created() {
        this.PlanConvert = this.$theme.loadPlanConvert(this.lineCode);
    },
    mounted() {
        this.timeDemon = setInterval(() => {
            checkLoginLine();
        }, 5000 * 60);
        if (this.$route.query.mapId) {
            this.refreshRunPlanList(true);
        }
    },
    beforeDestroy() {
        if (this.timeDemon) {
            clearTimeout(this.timeDemon);
        }
    },
    methods: {
        dispatchDialog(dialogObj) {
            this.$nextTick(() => {
                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);
                }
            });
        },
        handleConfirm(params) {
            if (params.operate == 'AddPlanningTrain') {
                // 添加计划
                this.$refs.addPlanningTrain.handleConfirm();
            } else if (params.operate == 'DeletePlanningTrain') {
                // 删除计划
                const model = {
                    planId: this.loadRunPlanId,
                    serviceNumber: params.serviceNumber
                };
                deletePlanService(model).then(resp => {
                    this.$message.success(this.$t('tip.deletePlanSuccessfully'));
                    this.$store.dispatch('runPlan/setDraftSelected', {});
                    this.$store.dispatch('runPlan/refresh');
                }).catch(() => {
                    this.$messageBox(this.$t('tip.deletePlanFailed'));
                });
            }
        },
        showTrain() {
            if (this.$refs.schedule) {
                this.$refs.schedule.displayTrain();
            }
        },
        refresh() {
            this.$store.dispatch('runPlan/refresh');
        },
        refreshRunPlanList(firstLoad) {
            getRpListByMapId(this.$route.query.mapId).then(resp => {
                this.runPlanList = resp.data || [];
                if (firstLoad && this.runPlanList.length) {
                    this.loadRunPlanId = this.runPlanList[0].id;
                    this.loadRunPlanName = this.runPlanList[0].name;
                }
            }).catch(() => {
                this.$message.error('获取草稿运行图列表失败');
            });
        },
        doClose() {
            this.$emit('doClose');
        },
        loadingRunPlan(param) {
            this.loadRunPlanId = param.planId;
            this.loadRunPlanName = param.planName;
        },
        checkIsLoadRunPlan(planId) {
            this.refreshRunPlanList(planId === this.loadRunPlanId);
        },
        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.refreshRunPlanList();
        }
    }
};
</script>

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

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

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

    .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;
    }

    /* .planEdit__tool .el-dialog {
        overflow: hidden !important;
        background: rgba(202, 221, 253, 0.88);;
        box-shadow: 1px hsla(240, 0%, 100%, 0.5) inset;
        border: 2px solid #727375;
        border-radius: 4px;
        color: #000;
        font-size: 14px;
    }

    .planEdit__tool .el-dialog .el-dialog__header {
        height: 30px;
        padding: 5px;
    }

    .planEdit__tool .el-dialog .el-dialog__footer {
        background: #ECE9D8;
        opacity: 1;
    }

    .planEdit__tool .el-dialog .el-dialog__body {
        padding-top: 10px;
        padding-bottom: 10px;
        padding-left: 5px;
        padding-right: 5px;
        margin: 0px 3px 3px 3px;
        border: 2px solid rgba(120, 121, 123, 0.5);
        box-shadow: 1px hsla(240, 0%, 100%, 0.5) inset;
        color: #000;
        background: #ECE9D8;
        opacity: 1;
    }

    .planEdit__tool .el-dialog .el-dialog__title {
        font-size: 16px;
    }

    .planEdit__tool .el-dialog .el-dialog__headerbtn {
        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;
        top: 0px;
        right: 3px;
        line-height: 26px;
        width: 26px;
    }

    .planEdit__tool .el-dialog .el-dialog__headerbtn .el-icon-close:before {
        font-size: 16px;
    }

    .planEdit__tool .el-dialog .el-dialog__headerbtn .el-dialog__close {
        color: #fff;
    }

    .planEdit__tool .el-dialog .el-tabs--top {
        border: 2px outset #FEFEFD;
        border-radius: 4px;
    }

    .planEdit__tool .el-dialog .el-tabs__item {
        height: 30px;
        line-height: 30px;
        text-align: center;
        color: #000 !important;
        border-right: 2px outset #fff;
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    .planEdit__tool .el-dialog .el-tab-pane {
        margin: 10px !important;
    }

    .planEdit__tool .el-dialog .el-tabs--card>.el-tabs__header .el-tabs__item.is-active {
        border-bottom: none
    }

    .planEdit__tool .el-dialog .el-tabs--card>.el-tabs__header .el-tabs__item:not(.is-active) {
        border-bottom: 2px inset #fff
    }

    .planEdit__tool .el-dialog .el-form {
        background: #ECE9D8 !important;
    }

    .planEdit__tool .el-dialog .el-card {
        background: #ECE9D8 !important;
    }

    .planEdit__tool .el-dialog .el-button {
        height: 32px;
        line-height: 32px;
        padding: 0px;
        width: 80px;
        border: 2px outset #E2E2E2;
        border-radius: 0px !important;
        color: #000;
        background: #ECE9D8;
    }

    .planEdit__tool .el-dialog .expand {
        width: 120px;
    }

    .planEdit__tool .el-dialog .el-button:focus span {
        border: 1px dashed gray;
    }

    .planEdit__tool .el-dialog .el-button:active {
        border: 2px inset #E2E2E2;
    }

    .planEdit__tool .el-dialog .el-button:disabled {
        border: 2px inset #E2E2E2;
    }

    .planEdit__tool .el-dialog .el-button:disabled span {
        border: 0px;
    }

    .planEdit__tool .el-dialog .button-group {
        margin-top: 10px;
    }

    .planEdit__tool .el-dialog .el-input {
        border: 2px inset #E9E9E9;
    }

    .planEdit__tool .el-dialog .el-input .el-input__inner {
        color: #000;
        background: #fff !important;
        border: 0px;
        border-radius: 0px !important;
        box-sizing: border-box;
    }

    .planEdit__tool .el-dialog .el-input.is-disabled .el-input__inner {
        background: #F0F0F0 !important;
    }

    .planEdit__tool .el-dialog .el-textarea {
        border: 2px inset #E9E9E9;
        border-radius: 0px;
    }

    .planEdit__tool .el-dialog .el-textarea .el-textarea__inner {
        color: #000;
        background: #fff !important;
        border: 0px;
        border-radius: 0px !important;
        box-sizing: border-box;
    }

    .planEdit__tool .el-dialog .el-textarea.is-disabled .el-textarea__inner {
        background: #F0F0F0 !important;
    }

    .planEdit__tool .el-dialog .el-table {
        border: 2px inset #E9E9E9;
        color: #000 !important;
    }

    .planEdit__tool .el-dialog .el-table .cell {
        line-height: unset !important;
    }

    .planEdit__tool .el-dialog .el-table th.is-leaf {
        background: #ECE9D8 !important;
        border-right: 1px solid #BDBDBD !important;
        border-bottom: 1px solid #BDBDBD !important;
        color: #000 !important;
        height: 20px !important;
        padding: 0px;
    }

    .planEdit__tool .el-dialog .el-table tr td {
        height: 20px !important;
        padding: 0px;
    }

    .planEdit__tool .el-dialog .el-table .el-table__empty-text {
        top: 15px !important;
    }

    .planEdit__tool .el-dialog .current-row>td {
        background: #316AC5 !important;
        color: #fff !important;
    }

    .planEdit__tool .el-dialog .el-checkbox__inner {
        border: 1px inset #dcdfe6 !important;
    }

    .planEdit__tool .el-dialog .el-checkbox__label {
        color: #000 !important;
    }

    .planEdit__tool .el-dialog .el-checkbox.is-disabled .el-checkbox__inner {
        background: #E6E6E6 !important;
    }

    .planEdit__tool .el-dialog .el-checkbox.is-disabled .el-checkbox__label {
        color: #C5C9CC !important;
    }

    .planEdit__tool .el-dialog .el-checkbox__input.is-checked .el-checkbox__inner {
        background: #fff !important;
        border: 1px inset #dcdfe6 !important;
    }

    .planEdit__tool .el-dialog .el-checkbox__input.is-checked .el-checkbox__inner::after {
        position: absolute;
        -webkit-box-sizing: content-box;
        box-sizing: content-box;
        content: "";
        border: 1px solid #000;
        border-left: 0;
        border-top: 0;
        height: 7px;
        left: 4px;
        top: 1px;
    }

    .planEdit__tool .el-dialog .el-radio__inner {
        border: 1px inset #dcdfe6 !important;
    }

    .planEdit__tool .el-dialog .el-radio__label {
        color: #000 !important;
    }

    .planEdit__tool .el-dialog .el-radio__input.is-checked .el-radio__inner {
        background: #fff !important;
        border: 1px inset #dcdfe6 !important;
    }

    .planEdit__tool .el-dialog .el-radio__input.is-checked .el-radio__inner::after {
        width: 4px;
        height: 4px;
        border-radius: 100%;
        background-color: #000 !important;
        position: absolute;
        left: 50%;
        top: 50%;
    }

    .planEdit__tool .el-dialog .el-radio.is-disabled .el-radio__inner {
        background: #E6E6E6 !important;
    }

    .planEdit__tool .el-dialog .el-radio.is-disabled .el-radio__label {
        color: #C5C9CC !important;
    }

    .planEdit__tool .el-dialog .base-label {
        background: rgba(0, 0, 0, x);
        position: relative;
        left: -15px;
        top: -18px;
    }

    .planEdit__tool .el-dialog .el-form-item label {
        font-weight: normal !important;
        color: #000 !important;
    }

    .planEdit__tool .el-dialog .context {
        height: 100px;
        border: 2px inset #E2E2E2;
        overflow-y: scroll;
    }

    .planEdit__tool .el-dialog .table {
        margin-top: 10px;
    }

    .planEdit__tool .el-dialog .notice {
        margin-left: 62px;
        line-height: 30px;
    }

    .planEdit__tool .el-dialog .button-group {
        margin-top: 10px;
    }

    .planEdit__tool .el-dialog .el-tree__empty-block {
        background: #E9E9E9 !important;
        color: #000 !important;
    } */
</style>