ZdyRagModal.vue
3.0 KB
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
<!--<template>-->
<!-- <BasicModal v-bind="$attrs" @register="registerModal" destroyOnClose :title="title" :width="800" @ok="handleSubmit">-->
<!-- <BasicForm @register="registerForm" name="TestForm" />-->
<!-- </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} from '../ZdyRag.data';-->
<!-- import {saveOrUpdate} from '../ZdyRag.api';-->
<!-- // Emits声明-->
<!-- const emit = defineEmits(['register','success']);-->
<!-- const isUpdate = ref(true);-->
<!-- const isDetail = ref(false);-->
<!-- //表单配置-->
<!-- const [registerForm, { setProps,resetFields, setFieldsValue, validate, scrollToField }] = useForm({-->
<!-- labelWidth: 150,-->
<!-- schemas: formSchema,-->
<!-- showActionButtonGroup: false,-->
<!-- baseColProps: {span: 24}-->
<!-- });-->
<!-- //表单赋值-->
<!-- const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => {-->
<!-- //重置表单-->
<!-- await resetFields();-->
<!-- setModalProps({confirmLoading: false,showCancelBtn:!!data?.showFooter,showOkBtn:!!data?.showFooter});-->
<!-- isUpdate.value = !!data?.isUpdate;-->
<!-- isDetail.value = !!data?.showFooter;-->
<!-- if (unref(isUpdate)) {-->
<!-- //表单赋值-->
<!-- await setFieldsValue({-->
<!-- ...data.record,-->
<!-- });-->
<!-- }-->
<!-- // 隐藏底部时禁用整个表单-->
<!-- setProps({ disabled: !data?.showFooter })-->
<!-- });-->
<!-- //设置标题-->
<!-- const title = computed(() => (!unref(isUpdate) ? '新增' : !unref(isDetail) ? '详情' : '编辑'));-->
<!-- //表单提交事件-->
<!-- async function handleSubmit(v) {-->
<!-- try {-->
<!-- let values = await validate();-->
<!-- setModalProps({confirmLoading: true});-->
<!-- //提交表单-->
<!-- await saveOrUpdate(values, isUpdate.value);-->
<!-- //关闭弹窗-->
<!-- closeModal();-->
<!-- //刷新列表-->
<!-- emit('success');-->
<!-- } catch ({ errorFields }) {-->
<!-- if (errorFields) {-->
<!-- const firstField = errorFields[0];-->
<!-- if (firstField) {-->
<!-- scrollToField(firstField.name, { behavior: 'smooth', block: 'center' });-->
<!-- }-->
<!-- }-->
<!-- return Promise.reject(errorFields);-->
<!-- } finally {-->
<!-- setModalProps({confirmLoading: false});-->
<!-- }-->
<!-- }-->
<!--</script>-->
<!--<style lang="less" scoped>-->
<!-- /** 时间和数字输入框样式 */-->
<!-- :deep(.ant-input-number) {-->
<!-- width: 100%;-->
<!-- }-->
<!-- :deep(.ant-calendar-picker) {-->
<!-- width: 100%;-->
<!-- }-->
<!--</style>-->