From 3959e507bfa99cc4ced2a6f48f9b4358334d34c4 Mon Sep 17 00:00:00 2001
From: riku <risaku@163.com>
Date: 星期二, 19 十二月 2023 17:34:45 +0800
Subject: [PATCH] 1. 调试表单选项组件的双向绑定逻辑

---
 src/components/form/FYForm.vue |   74 +++++++++++++++++++++++++++----------
 1 files changed, 54 insertions(+), 20 deletions(-)

diff --git a/src/components/form/FYForm.vue b/src/components/form/FYForm.vue
index 0d68089..5bfa1b8 100644
--- a/src/components/form/FYForm.vue
+++ b/src/components/form/FYForm.vue
@@ -3,21 +3,17 @@
     :inline="false"
     :model="formObj"
     ref="formRef"
-    :rules="rules"
+    :rules="allRules"
     label-position="right"
     label-width="150px"
   >
     <slot name="form-item" :formObj="formObj"></slot>
-    <el-form-item>
-      <el-button
-        :disabled="!edit"
-        type="primary"
-        @click="onSubmit"
-        :loading="loading"
+    <el-form-item v-if="showButtons">
+      <el-button :disabled="!edit" type="primary" @click="onSubmit" :loading="loading"
         >鎻愪氦</el-button
       >
-      <el-button :disabled="!edit" @click="onReset">閲嶇疆</el-button>
-      <el-button v-if="enableCancelBtn" @click="onCancel">鍙栨秷</el-button>
+      <el-button v-if="useReset" :disabled="!edit" @click="onReset">閲嶇疆</el-button>
+      <el-button v-if="useCancel" @click="onCancel">鍙栨秷</el-button>
     </el-form-item>
   </el-form>
 </template>
@@ -30,7 +26,7 @@
  * 鍙紶鍏ュ垵濮嬭〃鍗曟暟鎹甪ormInfo锛岃〃鍗曟牎楠岃鍒檙ules
  * 瀹炵幇submit鍜宑ancel瑙﹀彂鍑芥暟
  */
-import { defineProps, defineEmits, reactive, ref, watch } from 'vue';
+import { defineProps, defineEmits, reactive, ref, watch, computed } from 'vue';
 import { useFormConfirm } from '@/composables/formConfirm';
 
 const props = defineProps({
@@ -38,25 +34,55 @@
   formInfo: Object,
   //琛ㄥ崟妫�楠岃鍒�
   rules: Object,
+  showButtons: {
+    type: Boolean,
+    default: true
+  },
   //鍙栨秷鎸夐挳鏄惁鍙敤
-  enableCancelBtn: Boolean,
+  useCancel: Boolean,
+  //閲嶇疆鎸夐挳鏄惁鍙敤
+  useReset: Boolean,
   //瑙﹀彂閲嶇疆
-  reset: Boolean,
+  doClear: Boolean,
   //閫氱煡缂栬緫鐘舵��
-  isEdit: Boolean,
+  isEdit: Boolean
 });
 
 //瑙﹀彂鍑芥暟锛屾彁浜ゅ拰鍙栨秷
 const emit = defineEmits(['submit', 'cancel', 'update:isEdit']);
 
+const baseRules = reactive({
+  _usertype: [
+    {
+      required: true,
+      message: '鐢ㄦ埛绫诲瀷涓嶈兘涓虹┖',
+      trigger: 'change'
+    }
+  ],
+  _locations: [
+    {
+      required: true,
+      message: '鐪�/甯�/鍖�/闀囦笉鑳戒负绌�',
+      trigger: 'change',
+    }
+  ],
+  _scenetype: [
+    {
+      required: true,
+      message: '鍦烘櫙绫诲瀷涓嶈兘涓虹┖',
+      trigger: 'change'
+    }
+  ]
+});
+
 //琛ㄥ崟鎿嶄綔鍑芥暟
-const { formObj, formRef, edit, onSubmit, onCancel, onReset } = useFormConfirm({
+const { formObj, formRef, edit, onSubmit, onCancel, onReset, clear } = useFormConfirm({
   submit: {
-    do: submit,
+    do: submit
   },
   cancel: {
-    do: cancel,
-  },
+    do: cancel
+  }
 });
 
 //鍔犺浇鐘舵��
@@ -69,6 +95,9 @@
     emit('submit', formObj, () => {
       loading.value = false;
       resolve();
+    },(err)=>{
+      loading.value = false;
+      reject(err);
     });
   });
 }
@@ -78,20 +107,25 @@
   emit('cancel');
 }
 
+const allRules = computed(()=>{
+  return {...baseRules.value, ...props.rules}
+})
+
 //鐩戝惉琛ㄥ崟鍒濆鏁版嵁浼犲叆
 watch(
   () => props.formInfo,
   (nValue) => {
     formObj.value = nValue;
-  }
+  },
+  { deep: false, immediate: true }
 );
 
 //鐩戝惉琛ㄥ崟閲嶇疆鍔熻兘瑙﹀彂
 watch(
-  () => props.reset,
+  () => props.doClear,
   (nValue) => {
     if (nValue) {
-      onReset();
+      clear();
     }
   }
 );

--
Gitblit v1.9.3