<!--
 * @Author: Liugh
 * @Date: 2021-05-17 14:54:08
 * @LastEditTime: 2021-05-20 09:31:08
 * @LastEditors: Do not edit
 * @FilePath: \auth-web\src\pages\data-auth-module\auth-subject-manage\subject-prop-manage\subject-property.vue
 * @Description: 
-->

<template>
    <main class="subject-property">
        <dg-row gutter="1rem">
            <dg-col :span="5">
                <tree
                    ref="tree"
                    title="主体属性类"
                    type="SUB"
                    @submitNodeOperate="getNodeOperate"
                />
            </dg-col>
            <!-- 属性详情 -->
            <dg-col :span="19">
                <prop-detail
                    :parentNode="parentNode"
                    type="SUB"
                    :key="key"
                    :operateType="operateType"
                    @savePropSuccess="refreshTree"
                ></prop-detail>
            </dg-col>
            <!-- <dg-col :span="13"> -->
            <!-- TODO 根据点击属性类型判断显示什么表格 -->
            <!-- <component :is="compoentValue"></component> -->
            <!-- </dg-col> -->
        </dg-row>
    </main>
</template>

<script>
import Tree from "./prop-tree";
import propDetail from "./prop-detail";
import personnelList from "./personnel-list";
import agencyList from "./agency-list";
import applicationList from "./application-list";
export default {
    name: "subject-property", // 组件名称
    props: {
        // 接收父组件的数据
    },
    data() {
        // 组件内部参数
        return {
            // 参数名称及默认值
            compoentType: [
                {
                    label: "personnel",
                    value: "personnel-list"
                },
                {
                    label: "agency",
                    value: "agency-list"
                },
                {
                    label: "application",
                    value: "application-list"
                }
            ],
            compoentValue: "application-list",
            parentNode: {},
            key: 0,
            // 操作类型，新增属性还是编辑
            operateType: ""
        };
    },
    computed: {}, // 计算属性
    watch: {}, // 侦听器（扩展的计算属性）
    components: { Tree, personnelList, agencyList, applicationList, propDetail }, // 注册局部组件
    methods: {
        /**
         * 获取树操作
         */
        getNodeOperate(data) {
            (this.operateType = data.operateType), (this.parentNode = data);
            this.key++;
        },
        /**
         * 刷新属性树
         */
        refreshTree() {
            this.$refs.tree.init();
        },
        /**
         * @description: 表单查询
         */
        handleSearch() {}
    },
    created() {}, // 组件创建完成后
    mounted() {} // 组件挂载完成后
};
</script>
<style lang="scss" scoped>
@import "../index.scss";
</style>
