<template>
  <div v-show="show" class="run-plan-dialog">
    <component :is="menus" ref="schedule" :group="group" @back="doClose" />
  </div>
</template>

<script>

export default {
    name: 'RunPlanLoad',
    props: {
        group: {
            type: String,
            required: true
        }
    },
    data() {
        return {
            menus: null,
            show: false
        };
    },
    computed: {
        title() {
            return this.$t('display.runPlan.runDiagramPlanTool');
        }
    },
    watch: {
        '$route.query.lineCode': function (code) {
            if (code) {
                this.menus = this.$theme.loadPlanComponent(code);
            }
        }
    },
    mounted() {
        this.menus = this.$theme.loadPlanComponent(this.$route.query.lineCode);
    },
    methods: {
        doShow() {
            this.show = true;
            this.$refs.schedule.setPosition();
        },
        doClose() {
            this.show = false;
        }
    }
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
    @import "src/styles/mixin.scss";

    .run-plan-dialog {
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        position: absolute;
        z-index: 10;
        top: 0px;
        left: 0px;
        width: 100%;
        height: 100%;
        background: white;
    }
</style>
