mb-form 支持插槽

增加 add.formData属性 设置隐藏值 默认值

magic-boot-ui/src/components/magic/template/mb-form.vue

@@ -8,7 +8,9 @@
     <el-row v-for="(row,i) in form.rows" :key="i" :gutter="row.gutter">
       <el-col v-for="(col,j) in row.cols" :key="j" :span="col.span" v-bind="col.colProps">
         <el-form-item :label="col.label" :label-width="col.labelWidth" :prop="col.name" v-bind="col.formItemProps">
+          <slot v-if="col.component == 'dynamic'" :name="col.name" :form-data="formData" :col="col"></slot>
           <component
+              v-else
               :is="!col.component ? 'mb-input' : col.component.startsWith('el-') || $global.dynamicComponentNames.indexOf(col.component) != -1 ? col.component : 'mb-' + col.component"
               v-model="formData[col.name]"
               :item-label="col.label"
@@ -25,7 +27,7 @@
   import { ref, reactive, getCurrentInstance, watch } from 'vue'
   const { proxy } = getCurrentInstance()
   const rules = reactive(getRules())
-  const formData = ref({})
+  const formData = ref(initFormData())
   const dataForm = ref()
   const props = defineProps({
     form: {
@@ -36,29 +38,30 @@
       type: Object,
       default: () => {}
     },
+    add: {
+      type: Object,
+      default: () => {}
+    },
     primaryField: {
       type: String,
       default: 'id'
     }
   })
   const emit = defineEmits(['reload'])
-  watch(() => props.detail.formData, (value) => {
+  watch(() => [props.detail && props.detail.formData, props.add && props.add.formData], (value) => {
-    Object.assign(formData.value, value)
+    value.forEach(it => {
+      if(it){
+        Object.assign(formData.value, it)
+      }
+    })
   },{ deep: true })
 
   props.form.props = props.form.props || {}
   proxy.$common.setDefaultValue(props.form.props, 'labelPosition', 'right')
   proxy.$common.setDefaultValue(props.form.props, 'labelWidth', '120px')
 
-  if(props.detail && props.detail.formData){
+  if(props.add && props.add.formData){
-    if(props.detail.handlerFormData){
+    Object.assign(formData.value, props.add.formData)
-      props.detail.handlerFormData(props.detail.formData)
-    }
-    formData.value = props.detail.formData
-  }
-
-  if(props.detail && props.detail.request){
-
   }
 
   function getRules(){
@@ -99,9 +102,6 @@
             type: 'success',
             duration: 2000
           })
-          if(props.detail && props.detail.formData){
-            props.detail.formData = {}
-          }
           d.hide()
           emit('reload')
         }).catch(() => d.hideLoading())
@@ -110,23 +110,28 @@
   }
 
   function getDetail(id) {
+    if(props.detail.handlerFormData && props.detail.formData){
+      props.detail.handlerFormData(props.detail.formData)
+    }
     formData.value = props.detail.formData || {}
-    var detailData = initFormData()
+    if(props.detail && props.detail.request){
-    detailData[props.primaryField] = id
+      var _formData = initFormData()
+      _formData[props.primaryField] = id
       proxy.$get(props.detail.request.url, { [props.primaryField]: id }).then(res => {
         const { data } = res
-      for (var t in detailData) {
+        for (var t in _formData) {
           if ((data[t] || data[t] === 0) && (!props.detail.excludeAssign || props.detail.excludeAssign.indexOf(t) === -1)) {
-          detailData[t] = data[t]
+            _formData[t] = data[t]
           }
         }
         if(formData.value){
-        formData.value = Object.assign(detailData, formData.value)
+          formData.value = Object.assign(_formData, formData.value)
         } else {
-        formData.value = detailData
+          formData.value = _formData
         }
       })
     }
+  }
 
   defineExpose({ save, getDetail, getFormData })