更新模板

app/template/view/components/modal.vue

@@ -10,7 +10,7 @@ import {createupperCamelCaseApi, updateupperCamelCaseApi} from '../api';
 import { modalFormProps } from '../config/form';
 
 defineOptions({
-  name: 'upperCamelCaseDemo',
+    name: 'upperCamelCaseDemo',
 });
 
 const isUpdate = ref(false);
@@ -19,44 +19,44 @@ const gridApi = ref();
 const [Form, formApi] = useVbenForm(modalFormProps);
 
 const [Modal, modalApi] = useVbenModal({
-  fullscreenButton: false,
-  draggable: true,
-  onCancel() {
-    modalApi.close();
-  },
-  onConfirm: async () => {
-    formApi.validate().then(async (e: any) => {
-      if (e.valid) {
-        const values = await formApi.getValues();
-        modalApi.setState({ loading: true, confirmLoading: true });
-        const submitApi = isUpdate.value ? updateupperCamelCaseApi : createupperCamelCaseApi;
-        submitApi(values)
-          .then(() => {
-            message.success('保存成功');
-            gridApi.value?.reload();
-            modalApi.close();
-          })
-          .finally(() => {
-            modalApi.setState({ loading: false, confirmLoading: false });
-          });
-      }
-    });
-    await formApi.validateAndSubmitForm();
-  },
-  onOpenChange(isOpen: boolean) {
-    gridApi.value = isOpen ? modalApi.getData()?.gridApi : null;
-    if (isOpen) {
-      const { values, update } = modalApi.getData<Record<string, any>>();
-      if (values) {
-        isUpdate.value = update;
-        formApi.setValues(values);
-      }
-    }
-  },
+    fullscreenButton: false,
+    draggable: true,
+    onCancel() {
+        modalApi.close();
+    },
+    onConfirm: async () => {
+        formApi.validate().then(async (e: any) => {
+            if (e.valid) {
+                const values = await formApi.getValues();
+                modalApi.setState({ loading: true, confirmLoading: true });
+                const submitApi = isUpdate.value ? updateupperCamelCaseApi : createupperCamelCaseApi;
+                submitApi(values)
+                    .then(() => {
+                        message.success('保存成功');
+                        gridApi.value?.reload();
+                        modalApi.close();
+                    })
+                    .finally(() => {
+                        modalApi.setState({ loading: false, confirmLoading: false });
+                    });
+            }
+        });
+        await formApi.validateAndSubmitForm();
+    },
+    onOpenChange(isOpen: boolean) {
+        gridApi.value = isOpen ? modalApi.getData()?.gridApi : null;
+        if (isOpen) {
+            const { values, update } = modalApi.getData<Record<string, any>>();
+            if (values) {
+                isUpdate.value = update;
+                formApi.setValues(values);
+            }
+        }
+    },
 });
 </script>
 <template>
-  <Modal :title="`${isUpdate === true ? '编辑' : '新增'}模板名称`" class="w-[30%]">
-    <Form />
-  </Modal>
+    <Modal :title="`${isUpdate === true ? '编辑' : '新增'}模板名称`" class="w-[30%]">
+        <Form />
+    </Modal>
 </template>