fj-dc-ui/.svn/pristine/e9/e9fa3a689bc6940befd5de3201bbc9eb4d6d36aa.svn-base

<!--  -->
<template>
    <div id="popupContainer" class=''>
        <el-dialog :title="currentObjectName" @close="closeDialog" width="50%" :visible.sync="dialogFormVisible">
            <el-tabs v-model="currentViewId" type="card">
                <el-tab-pane
                    :label="option.label"
                    :name="option.label"
                    v-for="option in options"
                    :key="option.value">
                    <component
                        :is="option.value"
                        :currentObjectRgstrId="currentObjectRgstrId"
                        :currentObjectName="currentObjectName"
                        :currentYsdwCode="currentYsdwCode"
                        :currentObjectId="currentObjectId"
                        :currentObjectType="currentObjectType">
                    </component>
                </el-tab-pane>
            </el-tabs>
        </el-dialog>
    </div>
</template>

<script>

export default {
components: {
    jichuxinxi:resolve => {require(['./jichuxinxi.vue'], resolve)},//基础信息
    dengjixinxi:resolve => {require(['./dengjixinxi.vue'], resolve)},//登记信息
    ysdwjyys:resolve => {require(['./ysdwjyys.vue'], resolve)},//用水单位节约用水情况抽查表
    jsxdw:resolve => {require(['./jsxdw.vue'], resolve)},//节水型单位节约用水情况抽查表
    problemList:resolve => {require(['./problemList.vue'], resolve)},//问题清单
},
props: ["currentDuchaTpe","currentObjectRgstrId","currentYsdwCode","currentObjectId","currentObjectName","currentObjectType"],
data() {
    return {
        currentViewId:'基础信息',
        dialogFormVisible:true,
        options:[],
        options_ducha: [
            {
                value: "jichuxinxi",
                label: "基础信息"
            },{
                value: "dengjixinxi",
                label: "登记信息"
            },{
                value: "ysdwjyys",
                label: "用水单位节约用水情况抽查表"
            },{
                value: "jsxdw",
                label: "节水型单位节约用水情况抽查表"
            },{
                value: "problemList",
                label: "问题清单"
            }
        ],
        options_ducha_feijishui: [
            {
                value: "jichuxinxi",
                label: "基础信息"
            },{
                value: "dengjixinxi",
                label: "登记信息"
            },{
                value: "ysdwjyys",
                label: "用水单位节约用水情况抽查表"
            },{
                value: "problemList",
                label: "问题清单"
            }
        ],
        options_base: [
            {
                value: "jichuxinxi",
                label: "基础信息"
            }
        ],
    };
},
computed: {},
watch: {
    currentDuchaTpe(n,o){
        if(n){
            this.options = this.options_ducha;
        }else{
            this.options = this.options_base;
        }
    }
},
//生命周期 - 创建完成（可以访问当前this实例）
created() {

},
//生命周期 - 挂载完成（可以访问DOM元素）
mounted() {
    if(this.currentDuchaTpe){
        if(this.currentObjectType == '1'){
            this.options = this.options_ducha;//节水型
        }else{
            this.options = this.options_ducha_feijishui;//非节水型
        }
    }else{
        this.options = this.options_base;
    }
},
beforeCreate() {}, //生命周期 - 创建之前
beforeMount() {}, //生命周期 - 挂载之前
beforeUpdate() {}, //生命周期 - 更新之前
updated() {}, //生命周期 - 更新之后
beforeDestroy() {}, //生命周期 - 销毁之前
destroyed() {}, //生命周期 - 销毁完成
activated() {}, //如果页面有keep-alive缓存功能，这个函数会触发
methods: {
    closeDialog() {
        this.$emit("cancelHandler");
    },
    showDialog() {
        this.dialogFormVisible = true;
    },
},
}
</script>
<style scoped>
/*@import url(); 引入公共css类*/
.el-dialog__header{
    text-align: center !important;
    border-bottom: 1px dashed #C5C6C8 !important;
}
.el-dialog{
    border-radius: 4px !important;
}
</style>