1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
<template>
    <BasicModal
        v-bind="$attrs"
        @register="registerModal"
        :title="getTitle"
        @ok="handleSubmit"
        :showOkBtn="!isDetail"
        :width="900"
    >
        <div v-show="isDetail">
            <Description size="middle" @register="registerDetail" :column="2"/>
        </div>
        <div v-show="!isDetail">
            <BasicForm @register="registerForm" />
        </div>
    </BasicModal>
</template>
<script lang="ts" setup>
    import { ref, computed, unref } from 'vue';
    import { BasicModal, useModalInner } from '/@/components/Modal';
    import { BasicForm, useForm } from '/@/components/Form/index';
    import { formSchema, detailSchema } from './${modelCode!}.data';
    import { getDetail, submitObj } from '/@/api/${serviceCode!}/${modelCode!}';
    import { Description, useDescription } from '/@/components/Description/index';
 
    const emit = defineEmits(['success']);
    const isDetail = ref(true);
    const isUpdate = ref(true);
    const rowId = ref('');
    //详情
    const [registerDetail, { setDescProps }] = useDescription({
        schema: detailSchema,
    });
 
    const [registerForm, { setFieldsValue, resetFields, validate }] = useForm({
        labelWidth: 100,
        schemas: formSchema,
        showActionButtonGroup: false,
        baseColProps: {
            span: 12,
        },
        actionColOptions: {
            span: 23,
        },
    });
 
    const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
        resetFields();
        setModalProps({ confirmLoading: false });
        isUpdate.value = !!data?.isUpdate;
        isDetail.value = !!data?.isDetail;
        if (unref(isDetail)) {
            const detail = await getDetail({ id: data.record.id });
            setDescProps({
                data: detail,
            });
        } else {
            if (unref(isUpdate)) {
                rowId.value = data.record.id;
                const detailData = await getDetail({ id: data.record.id });
                setFieldsValue({
                    ...detailData,
                });
            }
        }
    });
 
    const getTitle = computed(() => {
        if (unref(isDetail)) {
            return '查看';
        } else {
            return !unref(isUpdate) ? '新增' : '编辑';
        }
    });
 
    async function handleSubmit() {
        try {
            const values = await validate();
            setModalProps({ confirmLoading: true });
            if (unref(isUpdate)) {
                values.id = rowId.value;
            }
            await submitObj(values);
            closeModal();
            emit('success', { isUpdate: unref(isUpdate), values: { ...values, id: rowId.value } });
        } finally {
            setModalProps({ confirmLoading: false });
        }
    }
</script>