详情表单

src/components/Form/src/BasicForm.vue

@@ -12,7 +12,7 @@
       <slot name="formHeader"></slot>
       <template v-for="schema in getSchema" :key="schema.field">
         <FormItem
-          v-if="schema.isEdit != 1 || schema.component == 'Divider' || schema.component == 'InputTextArea'"
+          v-show="schema.isEdit == 2 || schema.component == 'Divider' || schema.component == 'InputTextArea'"
           :is-advanced="fieldsIsAdvancedMap[schema.field]"
           :table-action="tableAction"
           :form-action-type="formActionType"
@@ -27,7 +27,7 @@
           </template>
         </FormItem>
         <!-- 只读 -->
-        <a-col :span="schema?.colProps?.span || 24" v-if="schema.show !== false && schema.isEdit == 1 && schema.component != 'Divider' && schema.component != 'InputTextArea'">
+        <a-col :span="schema?.colProps?.span || 24" v-show="schema.show !== false && schema.isEdit == 1 && schema.component != 'Divider' && schema.component != 'InputTextArea'">
           <div class="ds-form-onlyread">
             <span class="label">{{ schema.label }}：</span> {{ formModel[schema.field] || '-' }}
             <span v-if="!schema.dynamicDisabled" class="iconfont icon-bianji1" @click="editFormItem(schema)"></span>
@@ -125,17 +125,23 @@
           ...rowProps,
         }
       })
-
       const getBindValue = computed(
         () => ({ ...attrs, ...props, ...unref(getProps) } as Recordable),
       )
-
+      // 每个表单只执行一次isEdit
+      let editFlag = false
       const getSchema = computed((): FormSchema[] => {
         const schemas: FormSchema[] = unref(schemaRef) || (unref(getProps).schemas as any)
         const isReadonly = unref(propsRef).readonly
         for (const schema of schemas) {
-          // 如果表单包含只读属性。处理每个item增加是否可编辑
+          if (!editFlag) {
-          if (isReadonly && !schema.isEdit) schema['isEdit'] = 1
+            // 如果表单包含只读属性。处理每个item增加是否可编辑 （只读1）(可编辑2)
+            if (isReadonly) {
+              schema['isEdit'] = 1
+            } else {
+              schema['isEdit'] = 2
+            }
+          }
           const { defaultValue, component, isHandleDateDefaultValue = true } = schema
           // handle date type
           if (isHandleDateDefaultValue && defaultValue && dateItemType.includes(component)) {
@@ -150,6 +156,9 @@
             }
           }
         }
+        if (schemas.length) {
+          editFlag = true
+        }
         if (unref(getProps).showAdvancedButton) {
           return cloneDeep(
             schemas.filter((schema) => schema.component !== 'Divider') as FormSchema[],

src/views/finance/paymentSettlement/detail/index.vue

@@ -71,6 +71,7 @@
         v-if="visible"
         ref="busTable"
         :formData="getFieldsValue()"
+        :setFieldsValue="setFieldsValue"
         @save="save"
         @refresh="refresh"
       ></BusinessTable>

src/views/operation/paidApply/detail/index.vue

@@ -77,7 +77,6 @@
 </template>
 <script lang="ts" setup>
   import { onMounted, ref } from 'vue'
-  import { BasicTable, useTable } from '/@/components/Table'
   import { useMessage } from '/@/hooks/web/useMessage'
   import { closePage } from '/@/hooks/web/common'
   import { Divider } from 'ant-design-vue'
@@ -91,11 +90,11 @@
   const visible = ref(false)
   import { formSchema } from './columns'
   import { Save, Get, Delete, ApplyAudit } from '../api'
-  console.log(route)
+  console.log(route.path)
   const [registerForm, { validate, getFieldsValue, setFieldsValue }] = useForm({
     labelWidth: 150,
     schemas: formSchema,
-    // readonly: route.path != '/paid-apply/create',
+    readonly: route.path != '/paid-apply/create',
     showActionButtonGroup: false
   })
   // 业务表loading
@@ -127,6 +126,8 @@
   // 保存
   const save = async (feeInfo) => {
     const postData = await validate()
+    console.log(postData)
+    return
     if (feeInfo && feeInfo.length) {
       postData['details'] = [...feeData.value, ...feeInfo]
     } else {
@@ -203,12 +204,8 @@
   }
   onMounted(() => {
     //初始化
-  //   reload()
     init()
   })
-  function handleSuccess() {
-  //   reload()
-  }
 </script>
 
 <style lang="less">