<template>
  <div>
    <!-- 详情 -->
    <Detail :selectedRow="selectedRow" />
    <!-- 删除客户资料 -->
    <Delete :selectedRow="selectedRow"
            @refresh="refresh" />
    <!-- 新增客户资料 -->
    <Add @refresh="refresh" />
    <!-- 修改 -->
    <Modify :selectedRow="selectedRow"
            @refresh="refresh" />
    <!-- 恢复客户资料 -->
    <Recover :selectedRow="selectedRow"
             @refresh="refresh" />
    <!-- 停用 -->
    <Disable :selectedRow="selectedRow"
             @refresh="refresh" />
    <!-- 撤销 -->
    <Cancel :selectedRow="selectedRow"
            @refresh="refresh" />
    <!-- 审核客户资料 -->
    <Check :selectedRow="selectedRow"
           @refresh="refresh" />
  </div>
</template>

<script lang="ts">
import { defineComponent, PropType } from 'vue';
import { QueryCustomInfoType } from '@/services/go/ermcp/customInfo/interface';
import Detail from '../detail/index.vue';
import Delete from '../delete/index.vue';
import Add from '../add/index.vue';
import Modify from '../modify/index.vue';
import Recover from '../recover/index.vue';
import Disable from '../disable/index.vue';
import Cancel from '../cancel/index.vue';
import Check from '../check/index.vue';

export default defineComponent({
    name: 'custom-control-modal',
    components: { Detail, Delete, Add, Modify, Recover, Disable, Cancel, Check },
    props: {
        selectedRow: {
            type: Object as PropType<QueryCustomInfoType>,
            default: {},
        },
    },
    setup(props, context) {
        function refresh() {
            context.emit('refresh');
        }
        return {
            refresh,
        };
    },
});
</script>

<style lang="less">
.custom-detail {
    .ant-form.inlineForm {
        margin-top: 20px;
    }
    .upload {
        .look {
            margin-left: 0;
        }
    }
}
</style>;

