<template>
    <div class="dialog-list-wrapper">
        <template
            v-if="dialogConfig && dialogConfig.data && dialogConfig.data.length"
            v-for="item in dialogConfig.data">
            <el-dialog
                :title="item.title"
                :visible.sync="dialogVisible[item.name]"
                class="dialog-item">
                <template
                    v-if="item && item.data && item.data.length"
                    v-for="subItem in item.data">
                    <med-list
                        @change="() => { handleChange(subItem.name) }"
                        :search-config="subItem.searchConfig"
                        :table-config="subItem.tableConfig"
                        :button-config="subItem.buttonConfig"
                        :ref="subItem.name" />
                    <span class="cut-line" />
                </template>
                <div
                    slot="footer"
                    class="dialog-footer"
                    align="center">
                    <el-button @click="dialogVisible[item.name] = false">
                        取 消
                    </el-button>
                    <el-button
                        @click="dialogVisible[item.name] = false"
                        type="primary">
                        提交匹配
                    </el-button>
                </div>
            </el-dialog>
        </template>
    </div>
</template>

<script>

export default {
    name: 'MedDialogList',
    props: {
        dialogVisible: {
            required: true,
            type: Object,
            default: () => ({})
        },
        dialogConfig: {
            required: true,
            type: Object,
            default: () => ({})
        },
        buttonConfig: {
            type: Object,
            default: () => ({})
        }
    },
    data() {
        return {
            listRefs: []
        };
    },
    created() {
        this.dialogConfig.data.forEach(item => {
            item.data.forEach(key => {
                this.listRefs.push(key.name);
            });
        });
    },
    mounted() {
        const { dialogConfig } = this;
        // 初始化dialogVisible
        if (dialogConfig && dialogConfig.data && dialogConfig.data.length) {
            dialogConfig.data.forEach(item => {
                this.$set(this.dialogVisible, item.name, false);
            });
        }
    },
    methods: {
        // 监听列表数据联动
        handleChange(item) {
            this.listRefs.forEach(key => {
                if (key !== item) {
                    this.$refs[key][0].getTableData();
                }
            });
        }
    }
};
</script>
