rt-sim-training-client/src/views/planSchedule/index.vue

<template>
  <div class="plan-schedule">
    <title-bar ref="titleBar" @back="back" />
    <menu-bar ref="menuBar" :line-code="lineCode" @dispatchDialog="dispatchDialog" />
    <schedule ref="schedule" :group="group" :line-code="lineCode" :max-height="height" :max-width="width" />
    <status-bar ref="statusBar" :max-top="height" @setPosition="setPosition" />

    <manage-plan-list ref="managePlanList" @dispatchDialog="dispatchDialog" />
    <create-today-plan ref="createTodayPlan" />
    <create-week-plan ref="createWeekPlan" @reloadPlanList="reloadTable" />
  </div>
</template>

<script>
import TitleBar from './titleBar';
import MenuBar from './menuBar';
import StatusBar from './statusBar';
import Schedule from './schedule';
import ManagePlanList from './menusPlan/managePlanList';
import CreateTodayPlan from './menusPlan/createTodayPlan';
import CreateWeekPlan from './menusPlan/createWeekPlan';

export default {
    name: 'Menus',
    components: {
        TitleBar,
        MenuBar,
        StatusBar,
        Schedule,
        ManagePlanList,
        CreateTodayPlan,
        CreateWeekPlan
    },
    props: {
        group: {
            type: String,
            required: true
        }
    },
    data() {
    	return {};
    },
    computed: {
        skinCode() {
            return this.$route.query.skinCode;
        },
        width() {
            return this.$store.state.app.width > 1920 ? 1920 : this.$store.state.app.width;
        },
        height() {
            return this.$store.state.app.height > 1080 ? 1080 : this.$store.state.app.height;
        },
        lineCode() {
            return this.$route.query.lineCode;
        }
    },
    methods: {
        setPosition() {
            this.$nextTick(() => {
                this.$refs.schedule.setPosition();
            });
        },
        dispatchDialog(dialogObj) {
            this.$nextTick(() => {
                if (this.$refs[dialogObj.name]) {
                    this.$refs[dialogObj.name].doShow(dialogObj.params);
                }
            });
        },
        reloadTable(dialogObj) {
            if (this.$refs[dialogObj.name]) {
                this.$refs[dialogObj.name].reloadTable();
            }
        },
        confirm(params) {
        },
        back() {
            this.$emit('back');
        }
    }
};
</script>

<style>
    .plan-schedule {
        position: absolute;
        background: gray;
		width: 100%;
    }

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

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

    .plan-schedule .system-close {
        cursor: pointer;
        position: absolute;
        right: 0px;
        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-schedule .system-close::before {
        position: absolute;
        height: 22px;
        line-height: 22px;
        top: 0px;
        left: 0px;
        font-size: x-large;
    }

    .plan-schedule .pop-menu .is-disabled span {
        color: #B4B3B8;
    }

    .beijing-01__schedule {
        overflow: hidden !important;
    }

    .plan-schedule-dialog .el-dialog {
		background: #0099F8;
        box-shadow: 1px hsla(240, 0%, 100%, 0.5) inset;
        border: 2px solid #727375;
        border-radius: 4px;
        color: #000;
        font-size: 14px;
    }

    .plan-schedule-dialog .el-dialog .el-dialog__header {
        height: 30px;
        padding: 5px;
		background: -webkit-linear-gradient(#0055E8, #0099F8);
		background: -o-linear-gradient(#0055E8, #0099F8);
		background: -moz-linear-gradient(#0055E8, #0099F8);
		background: linear-gradient(#0055E8, #0099F8);
    }

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

    .plan-schedule-dialog .el-dialog .el-dialog__body {
        padding-top: 10px;
        padding-bottom: 10px;
        padding-left: 5px;
        padding-right: 5px;
        margin: 0px 3px 3px 3px;
        color: #000;
        background: #FFFFFF;
        opacity: 1;
    }

    .plan-schedule-dialog .el-dialog .el-dialog__title {
        font-size: 16px;
		color: #ffffff;
    }

    .plan-schedule-dialog .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;
    }

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

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

    .beijing-01__schedule .el-dialog .el-form {
        background: #ECE9D8 !important;
    }

    .beijing-01__schedule .el-dialog .el-card {
        background: #ECE9D8 !important;
    }

    .plan-schedule-dialog .el-dialog .el-button .el-button--primary{
        background: #0099F8;
    }

    .beijing-01__schedule .el-dialog .expand {
        width: 120px;
    }

    /*.plan-schedule-dialog .el-dialog .el-button:focus span {*/
        /*border: 1px dashed gray;*/
    /*}*/

    /*.plan-schedule-dialog .el-dialog .el-button:active {*/
        /*border: 2px inset #E2E2E2;*/
    /*}*/

    /*.plan-schedule-dialog .el-dialog .el-button:disabled {*/
        /*border: 2px inset #E2E2E2;*/
    /*}*/

    /*.plan-schedule-dialog .el-dialog .el-button:disabled span {*/
        /*border: 0px;*/
    /*}*/

    .beijing-01__schedule .el-dialog .button-group {
        margin: 0px 5px;
        text-align: center !important;
    }

    .beijing-01__schedule .el-dialog .el-input {
        border: 2px inset #E9E9E9;
    }

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

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

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

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

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

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

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

    .beijing-01__schedule .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;
    }

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

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

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

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

    .beijing-01__schedule .el-dialog .el-checkbox__label {
        color: #000 !important;
    }

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

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

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

    .beijing-01__schedule .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;
    }

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

    .beijing-01__schedule .el-dialog .el-radio__label {
        color: #000 !important;
    }

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

    .beijing-01__schedule .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%;
    }

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

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

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

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

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

    .beijing-01__schedule .el-dialog .table {
        margin-top: 10px;
    }

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

    .beijing-01__schedule .el-dialog .button-group {
        margin-top: 10px;
    }

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