feat: 动态子表单增加withConfig

src/components/formFields/importSubform/index.tsx

@@ -7,9 +7,21 @@ import { cloneDeep } from 'lodash'
 import ConditionHelper from '../../../util/condition'
 import InterfaceHelper, { InterfaceConfig } from '../../../util/interface'
 
+/**
+ * 子表单配置项
+ * - withConfig: 拓展配置
+ * - * - enable: 是否开启
+ * - * - dataField: （序列化）数据
+ * - * - configField: （序列化）配置
+ */
 export interface ImportSubformFieldConfig extends FieldConfig {
   type: 'import_subform',
   interface?: InterfaceConfig
+  withConfig?: {
+    enable: boolean
+    dataField: string
+    configField: string
+  }
 }
 
 export interface IImportSubformField {
@@ -17,6 +29,7 @@ export interface IImportSubformField {
 }
 
 interface IImportSubformFieldState {
+  withConfigPath: string // 动态子表单拓展路径
   didMount: boolean
   fields: FieldConfigs[]
   formData: { status: 'normal' | 'error' | 'loading', message?: string }[]
@@ -40,12 +53,22 @@ export default class ImportSubformField extends Field<ImportSubformFieldConfig,
     super(props)
 
     this.state = {
+      withConfigPath: '',
       didMount: false,
       fields: [],
       formData: []
     }
   }
 
+  static getDerivedStateFromProps (nextProps: FieldProps<ImportSubformFieldConfig, any>, prevState: IImportSubformFieldState) {
+    const withConfigPath = nextProps.config.withConfig?.enable && nextProps.config.withConfig?.dataField ? `${nextProps.config.withConfig.dataField}.` : ''
+    if (withConfigPath !== prevState.withConfigPath) {
+      return { withConfigPath }
+    }
+    return null
+  }
+
+
   didMount = async () => {
     await this.setState({
       didMount: true
@@ -187,7 +210,7 @@ export default class ImportSubformField extends Field<ImportSubformFieldConfig,
   handleValueSet = async (formFieldIndex: number, path: string, value: any, validation: true | FieldError[]) => {
     const formFieldConfig = (this.state.fields || [])[formFieldIndex]
     if (formFieldConfig) {
-      const fullPath = formFieldConfig.field === '' || path === '' ? `${formFieldConfig.field}${path}` : `${formFieldConfig.field}.${path}`
+      const fullPath = formFieldConfig.field === '' || path === '' ? `${this.state.withConfigPath}${formFieldConfig.field}${path}` : `${this.state.withConfigPath}${formFieldConfig.field}.${path}`
       await this.props.onValueSet(fullPath, value, true)
       
       const formData = cloneDeep(this.state.formData)
@@ -206,7 +229,7 @@ export default class ImportSubformField extends Field<ImportSubformFieldConfig,
   handleValueUnset = async (formFieldIndex: number, path: string, validation: true | FieldError[]) => {
     const formFieldConfig = (this.state.fields || [])[formFieldIndex]
     if (formFieldConfig) {
-      const fullPath = formFieldConfig.field === '' || path === '' ? `${formFieldConfig.field}${path}` : `${formFieldConfig.field}.${path}`
+      const fullPath = formFieldConfig.field === '' || path === '' ? `${this.state.withConfigPath}${formFieldConfig.field}${path}` : `${this.state.withConfigPath}${formFieldConfig.field}.${path}`
       await this.props.onValueUnset(fullPath, true)
       
       const formData = cloneDeep(this.state.formData)
@@ -225,7 +248,7 @@ export default class ImportSubformField extends Field<ImportSubformFieldConfig,
   handleValueListAppend = async (formFieldIndex: number, path: string, value: any, validation: true | FieldError[]) => {
     const formFieldConfig = (this.state.fields || [])[formFieldIndex]
     if (formFieldConfig) {
-      const fullPath = formFieldConfig.field === '' || path === '' ? `${formFieldConfig.field}${path}` : `${formFieldConfig.field}.${path}`
+      const fullPath = formFieldConfig.field === '' || path === '' ? `${this.state.withConfigPath}${formFieldConfig.field}${path}` : `${this.state.withConfigPath}${formFieldConfig.field}.${path}`
       await this.props.onValueListAppend(fullPath, value, true)
       
       const formData = cloneDeep(this.state.formData)
@@ -244,7 +267,7 @@ export default class ImportSubformField extends Field<ImportSubformFieldConfig,
   handleValueListSplice = async (formFieldIndex: number, path: string, index: number, count: number, validation: true | FieldError[]) => {
     const formFieldConfig = (this.state.fields || [])[formFieldIndex]
     if (formFieldConfig) {
-      const fullPath = formFieldConfig.field === '' || path === '' ? `${formFieldConfig.field}${path}` : `${formFieldConfig.field}.${path}`
+      const fullPath = formFieldConfig.field === '' || path === '' ? `${this.state.withConfigPath}${formFieldConfig.field}${path}` : `${this.state.withConfigPath}${formFieldConfig.field}.${path}`
       await this.props.onValueListSplice(fullPath, index, count, true)
       
       const formData = cloneDeep(this.state.formData)
@@ -262,7 +285,7 @@ export default class ImportSubformField extends Field<ImportSubformFieldConfig,
   handleValueListSort = async (formFieldIndex: number, path: string, index: number, sortType: 'up' | 'down', validation: true | FieldError[]) => {
     const formFieldConfig = (this.state.fields || [])[formFieldIndex]
     if (formFieldConfig) {
-      const fullPath = formFieldConfig.field === '' || path === '' ? `${formFieldConfig.field}${path}` : `${formFieldConfig.field}.${path}`
+      const fullPath = formFieldConfig.field === '' || path === '' ? `${this.state.withConfigPath}${formFieldConfig.field}${path}` : `${this.state.withConfigPath}${formFieldConfig.field}.${path}`
       await this.props.onValueListSort(fullPath, index, sortType, true)
       
       const formData = cloneDeep(this.state.formData)
@@ -311,9 +334,22 @@ export default class ImportSubformField extends Field<ImportSubformFieldConfig,
         { record: this.props.record, data: this.props.data, step: this.props.step },
         { loadDomain: this.props.loadDomain }
       ).then((data: any) => {
-        if (JSON.stringify(data) !== JSON.stringify(this.state.fields)) {
+        let dataToUnstringfy = data
+        let dataToStringfy = JSON.stringify(data)
+        if (Object.prototype.toString.call(data) === "[object String]") {
+          try {
+            dataToStringfy = data
+            dataToUnstringfy = JSON.parse(data)
+          } catch (e) {
+            console.error('当前动态子表单接口响应数据格式不是合格的json字符串')
+            dataToUnstringfy = []
+            dataToStringfy = '[]'
+          }
+        }
+        (this.props.config.withConfig?.enable && this.props.config.withConfig?.configField) &&  this.props.onValueSet(this.props.config.withConfig.configField, data, true)
+        if (dataToStringfy !== JSON.stringify(this.state.fields)) {
           this.setState({
-            fields: data
+            fields: dataToUnstringfy
           })
         }
       })
@@ -362,7 +398,7 @@ export default class ImportSubformField extends Field<ImportSubformFieldConfig,
                         }
                       }}
                       formLayout={formLayout}
-                      value={getValue(value, formFieldConfig.field)}
+                      value={getValue(value, `${this.state.withConfigPath}${formFieldConfig.field}`)}
                       record={record}
                       data={cloneDeep(data)}
                       step={step}