From dcc796696acd3658ab4a2f44a28342a32316ada9 Mon Sep 17 00:00:00 2001
From: YunaiV <zhijiantianya@gmail.com>
Date: Thu, 9 Mar 2023 00:06:53 +0800
Subject: [PATCH] =?UTF-8?q?vue3=20=E9=87=8D=E6=9E=84=EF=BC=9A=E9=85=8D?=
 =?UTF-8?q?=E7=BD=AE=E7=AE=A1=E7=90=86=EF=BC=8C=E5=BE=AE=E8=B0=83?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/infra/config/index.ts   |  4 +--
 src/config/axios/service.ts     |  1 -
 src/views/infra/config/form.vue | 44 +++++++++++++++++----------------
 3 files changed, 25 insertions(+), 24 deletions(-)

diff --git a/src/api/infra/config/index.ts b/src/api/infra/config/index.ts
index 6924c251..5d13628c 100644
--- a/src/api/infra/config/index.ts
+++ b/src/api/infra/config/index.ts
@@ -42,12 +42,12 @@ export const getConfigKeyApi = (configKey: string) => {
 }
 
 // 新增参数
-export const createConfigApi = (data: ConfigVO) => {
+export const createConfig = (data: ConfigVO) => {
   return request.post({ url: '/infra/config/create', data })
 }
 
 // 修改参数
-export const updateConfigApi = (data: ConfigVO) => {
+export const updateConfig = (data: ConfigVO) => {
   return request.put({ url: '/infra/config/update', data })
 }
 
diff --git a/src/config/axios/service.ts b/src/config/axios/service.ts
index fbafd3e8..7109615b 100644
--- a/src/config/axios/service.ts
+++ b/src/config/axios/service.ts
@@ -170,7 +170,6 @@ service.interceptors.response.use(
       return Promise.reject(new Error(msg))
     } else if (code === 901) {
       ElMessage.error({
-        duration: 5,
         offset: 300,
         dangerouslyUseHTMLString: true,
         message:
diff --git a/src/views/infra/config/form.vue b/src/views/infra/config/form.vue
index e4481dce..14a225a0 100644
--- a/src/views/infra/config/form.vue
+++ b/src/views/infra/config/form.vue
@@ -36,7 +36,6 @@
 <script setup lang="ts">
 import * as ConfigApi from '@/api/infra/config'
 // import type { FormExpose } from '@/components/Form'
-import * as PostApi from '@/api/system/post'
 const { t } = useI18n() // 国际化
 const message = useMessage() // 消息弹窗
 // const { proxy } = getCurrentInstance()
@@ -46,15 +45,15 @@ const modelTitle = ref('') // 弹窗的标题
 const modelLoading = ref(false) // 弹窗的 Loading 加载
 const formType = ref('') // 表单的类型：create - 新增；update - 修改
 const formLoading = ref(false) // 操作按钮的 Loading 加载
-let formRef = ref() // 表单的 Ref
+// let formRef = ref() // 表单的 Ref
 const formData = reactive({
-  id: undefined,
-  category: undefined,
-  name: undefined,
-  key: undefined,
-  value: undefined,
+  id: 0,
+  category: '',
+  name: '',
+  key: '',
+  value: '',
   visible: true,
-  remark: undefined
+  remark: ''
 })
 const formRules = reactive({
   category: [{ required: true, message: '参数分类不能为空', trigger: 'blur' }],
@@ -65,6 +64,8 @@ const formRules = reactive({
 })
 // const formRef = ref<FormExpose>() // 表单 Ref
 
+const { proxy } = getCurrentInstance() as any
+
 /** 打开弹窗 */
 const openModal = async (type: string, id?: number) => {
   modelVisible.value = true
@@ -84,20 +85,21 @@ defineExpose({ openModal }) // 提供 openModal 方法，用于打开弹窗
 /** 提交表单 */
 const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
 const submitForm = async () => {
+  const formRef = proxy.$refs['formRef']
+  console.log(formRef, '======')
   // 校验表单
-  const elForm = unref(formRef)?.getElFormRef()
-  if (!elForm) return
-  const valid = await elForm.validate()
+  if (!formRef) return
+  const valid = await formRef.validate()
   if (!valid) return
   // 提交请求
   formLoading.value = true
   try {
-    const data = unref(formRef)?.formModel as PostApi.PostVO
+    const data = formData as ConfigApi.ConfigVO
     if (formType.value === 'create') {
-      await PostApi.createPostApi(data)
+      await ConfigApi.createConfig(data)
       message.success(t('common.createSuccess'))
     } else {
-      await PostApi.updatePostApi(data)
+      await ConfigApi.updateConfig(data)
       message.success(t('common.updateSuccess'))
     }
     modelVisible.value = false
@@ -109,14 +111,14 @@ const submitForm = async () => {
 
 /** 重置表单 */
 const resetForm = () => {
-  formData.id = undefined
-  formData.category = undefined
-  formData.name = undefined
-  formData.key = undefined
-  formData.value = undefined
+  formData.id = 0
+  formData.category = ''
+  formData.name = ''
+  formData.key = ''
+  formData.value = ''
   formData.visible = true
-  formData.remark = undefined
+  formData.remark = ''
   // proxy.$refs['formRef'].resetFields()
-  // formRef.value.resetFields() // TODO 芋艿：为什么拿不到
+  // formRef.value.resetFields() // TODO 芋艿：为什么拿不到 formRef 呢？
 }
 </script>