| | |
| | | </div> |
| | | </Col> |
| | | <Col :span="11" :offset="2" :class="`${prefixCls}-col`"> |
| | | 5 |
| | | |
| | | <div class="mb-10px font-size-16px">联系人</div> |
| | | <div class="p-10px bg-gray-1"> |
| | | <BasicForm @register="registerForm2" /> |
| | | </div> |
| | | </Col> |
| | | </Row> |
| | | |
| | |
| | | import {getMenuList} from "@/api/demo/system"; |
| | | import {TreeItem} from "@/components/Tree"; |
| | | import {BasicForm, useForm} from "@/components/Form"; |
| | | import {schemas} from './drawerFormData.tsx' |
| | | import {schemas} from './drawerFormData' |
| | | import {schemas as schemas2} from './drawerContacterFormData' |
| | | |
| | | const emit = defineEmits(['success', 'register']); |
| | | const isUpdate = ref(true); |
| | |
| | | |
| | | // const [registerDrawer] = useDrawer(); |
| | | |
| | | const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => { |
| | | Logger.log('打开了DrawerForm', data); |
| | | isUpdate.value = !!data?.isUpdate; |
| | | // // 方式1 |
| | | // setFieldsValue({ |
| | | // field2: data.data, |
| | | // field1: data.info, |
| | | // }); |
| | | |
| | | // setDrawerProps({ confirmLoading: true }); |
| | | // setTimeout(() => { |
| | | // setDrawerProps({ confirmLoading: false }); |
| | | // }, 1000); |
| | | |
| | | resetFields(); |
| | | if (unref(isUpdate)) { |
| | | setFieldsValue({ |
| | | ...data.record, |
| | | }); |
| | | } |
| | | }); |
| | | |
| | | |
| | | async function handleSubmit() { |
| | | try { |
| | | const values = await validate(); |
| | | // const values = getFieldsValue(); |
| | | Logger.log('点击submit',values); |
| | | setDrawerProps({ confirmLoading: true }); |
| | | // TODO custom api |
| | | |
| | | closeDrawer(); |
| | | emit('success'); |
| | | } finally { |
| | | setDrawerProps({ confirmLoading: false }); |
| | | } |
| | | } |
| | | |
| | | |
| | | |
| | | const modelRef = ref({}); |
| | | // 左侧表单 |
| | | const [ |
| | | registerForm, |
| | | { resetFields, setFieldsValue, validate } |
| | |
| | | span: 24, |
| | | }, |
| | | }); |
| | | |
| | | // 右侧表单 |
| | | const [ |
| | | registerForm2, |
| | | { resetFields:resetFields2, setFieldsValue:setFieldsValue2, validate:validate2 } |
| | | // { |
| | | // // setFieldsValue, |
| | | // // setProps |
| | | // }, |
| | | ] = useForm({ |
| | | layout: 'vertical', |
| | | // labelWidth: 100, |
| | | showAdvancedButton: true, //开启折叠 |
| | | autoAdvancedLine: 5, // 超过多少行折叠 |
| | | alwaysShowLines: 4, // 始终显示多少行 |
| | | schemas:schemas2, |
| | | // showActionButtonGroup: false, // 默认显示操作按钮,开启才会显示折叠按钮 |
| | | showResetButton:false, // 隐藏重置按钮 |
| | | showSubmitButton:false, // 隐藏提交按钮 |
| | | actionColOptions: { |
| | | span: 24, |
| | | }, |
| | | }); |
| | | |
| | | |
| | | const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => { |
| | | Logger.log('打开了DrawerForm', data); |
| | | isUpdate.value = !!data?.isUpdate; |
| | | // // 方式1 |
| | | // setFieldsValue({ |
| | | // field2: data.data, |
| | | // field1: data.info, |
| | | // }); |
| | | |
| | | // setDrawerProps({ confirmLoading: true }); |
| | | // setTimeout(() => { |
| | | // setDrawerProps({ confirmLoading: false }); |
| | | // }, 1000); |
| | | |
| | | resetFields(); |
| | | resetFields2(); |
| | | if (unref(isUpdate)) { |
| | | setFieldsValue({ |
| | | ...data.record, |
| | | }); |
| | | setFieldsValue2({ |
| | | ...data.record, |
| | | }); |
| | | } |
| | | }); |
| | | |
| | | |
| | | async function handleSubmit() { |
| | | try { |
| | | // const values = await validate(); |
| | | const [values, values2] = await Promise.all([validate(), validate2()]); |
| | | |
| | | // const values = getFieldsValue(); |
| | | Logger.log('点击submit 左侧表单values:',values); |
| | | Logger.log('点击submit 右侧表单values2:', values2); |
| | | setDrawerProps({ confirmLoading: true }); |
| | | // TODO custom api |
| | | |
| | | closeDrawer(); |
| | | emit('success'); |
| | | } finally { |
| | | setDrawerProps({ confirmLoading: false }); |
| | | } |
| | | } |
| | | |
| | | |
| | | |
| | | |
| | | const prefixCls = 'clues-drawer'; |
| | | // 关闭提示信息 |
| | | const visible = ref<boolean>(true); |