fix: merge v1.2.5

package.json

 {
   "name": "ccms",
-  "version": "1.2.0",
+  "version": "1.2.4",
   "description": "ConfigableCMS",
   "main": "lib/index.js",
   "module": "dist/index.js",
@@ -85,4 +85,4 @@
     "react": "^16.13.1",
     "react-dom": "^16.13.1"
   }
-}
+}
\ No newline at end of file

src/components/detail/common.tsx

@@ -3,6 +3,8 @@ import { ColumnsConfig, ParamConfig } from '../../interface'
 
 import { DetailFieldConfigs as getFieldConfigs } from './'
 import ParamHelper from '../../util/param'
+import { CCMSConfig } from '../../main'
+
 /**
  * 详情页表单项基类配置文件格式定义
  * - field:    表单项字段名
@@ -24,7 +26,7 @@ export interface DetailFieldConfig {
   columns?: ColumnsConfig
   childColumns?: ColumnsConfig
   display?: 'none'
-  defaultValue?: string,
+  defaultValue?: ParamConfig,
   condition?: DetailFieldConditionConfig
   layout?: 'horizontal' | 'vertical'
   styles?: object
@@ -76,18 +78,26 @@ export interface DetailFieldProps<C extends DetailFieldConfig, T> {
   data: any[],
   step: number,
   config: C
+  // 挂载引用
+  detail?: React.ReactNode
   // TODO 待删除
   onChange: (value: T) => Promise<void>
   // 事件：设置值
-  onValueSet: (path: string, value: T, validation: true | DetailFieldError[]) => Promise<void>
+  onValueSet: (path: string, value: T, options?: { noPathCombination?: boolean }) => Promise<void>
   // // 事件：置空值
-  onValueUnset: (path: string, validation: true | DetailFieldError[]) => Promise<void>
+  onValueUnset: (path: string, options?: { noPathCombination?: boolean }) => Promise<void>
   // 事件：修改值 - 列表 - 追加
-  onValueListAppend: (path: string, value: any, validation: true | DetailFieldError[]) => Promise<void>
+  onValueListAppend: (path: string, value: any, options?: { noPathCombination?: boolean }) => Promise<void>
   // 事件：修改值 - 列表 - 删除
-  onValueListSplice: (path: string, index: number, count: number, validation: true | DetailFieldError[]) => Promise<void>
+  onValueListSplice: (path: string, index: number, count: number, options?: { noPathCombination?: boolean }) => Promise<void>
   baseRoute: string,
   loadDomain: (domain: string) => Promise<string>
+  loadPageConfig: (pageID: any) => Promise<CCMSConfig>
+  handlePageRedirect: (path: string) => void
+  checkPageAuth: (pageID: any) => Promise<boolean>
+  onUnmount: (reload?: boolean, data?: any) => Promise<void>
+  loadPageURL: (pageID: any) => Promise<string>
+  loadPageFrameURL: (pageID: any) => Promise<string>
 }
 
 /**
@@ -132,7 +142,13 @@ export class DetailField<C extends DetailFieldConfig, E, T, S = {}> extends Reac
       config
     } = this.props
 
-    return config.defaultValue
+    if (typeof config.defaultValue === 'string') {
+      return config.defaultValue
+    }
+    if (config.defaultValue !== undefined) {
+      return ParamHelper(config.defaultValue, { record: this.props.record, data: this.props.data, step: this.props.step })
+    }
+    return undefined
   }
 
   set: (value: T) => Promise<void> = async (value) => {

src/components/detail/custom/index.tsx

+import React, { RefObject } from 'react'
+import { DetailField, DetailFieldConfig, DetailFieldProps, IDetailField } from '../common'
+import { loadMicroApp, MicroApp } from 'qiankun'
+import moment from 'moment'
+import { cloneDeep } from 'lodash'
+
+export interface CustomDetailConfig extends DetailFieldConfig {
+  type: 'custom'
+  entry: string
+}
+
+export default class CustomDtail extends DetailField<CustomDetailConfig, {}, any> implements IDetailField<any> {
+  identifier: string = ''
+  entry: string = ''
+  container: RefObject<HTMLDivElement> = React.createRef()
+  customField: MicroApp | null = null
+  _get: () => Promise<any> = async () => this.props.value
+
+  componentDidMount () {
+    this.loadCustomField(this.props.config.entry)
+  }
+
+  getSnapshotBeforeUpdate () {
+    const snapshot: string[] = []
+    if (this.entry !== this.props.config.entry) {
+      snapshot.push('entry')
+    }
+    return snapshot
+  }
+
+  get = async (): Promise<any> => {
+    return await this._get()
+  }
+
+  bindGet = async (get: () => Promise<any>): Promise<any> => {
+    this._get = get
+  }
+
+  componentDidUpdate (_: DetailFieldProps<CustomDetailConfig, any>, __: {}, snapshot: string[]) {
+    if (snapshot.includes('entry')) {
+      this.loadCustomField(this.props.config.entry)
+    } else {
+      if (this.customField && this.customField.update) {
+        this.customField.update({
+          value: this.props.value,
+          record: this.props.record,
+          data: cloneDeep(this.props.data),
+          step: this.props.step,
+          config: this.props.config,
+          detail: this.props.detail,
+          onChange: this.props.onChange,
+          onValueSet: this.props.onValueSet,
+          onValueUnset: this.props.onValueUnset,
+          onValueListAppend: this.props.onValueListAppend,
+          onValueListSplice: this.props.onValueListSplice,
+          base: this.props.baseRoute,
+          loadDomain: this.props.loadDomain
+        })
+      }
+    }
+  }
+
+  loadCustomField = (entry: string) => {
+    if (this.container.current && entry) {
+      this.entry = this.props.config.entry
+      this.identifier = `custom|${moment().format('x')}|${Math.floor(Math.random() * 1000)}`
+      this.customField = loadMicroApp({
+        name: this.identifier,
+        entry,
+        container: this.container.current,
+        props: {
+          value: this.props.value,
+          record: this.props.record,
+          data: cloneDeep(this.props.data),
+          step: this.props.step,
+          config: this.props.config,
+          detail: this.props.detail,
+          onChange: this.props.onChange,
+          onValueSet: this.props.onValueSet,
+          onValueUnset: this.props.onValueUnset,
+          onValueListAppend: this.props.onValueListAppend,
+          onValueListSplice: this.props.onValueListSplice,
+          base: this.props.baseRoute,
+          loadDomain: this.props.loadDomain
+        }
+      })
+    }
+  }
+
+  render = () => {
+    return (
+      <div ref={this.container}></div>
+    )
+  }
+}

src/components/detail/detailColor/index.tsx

+import React from 'react'
+import { DetailField, DetailFieldConfig, IDetailField } from '../common'
+
+export interface ColorDetailConfig extends DetailFieldConfig {
+  type: 'color'
+}
+
+export interface IColorProps {
+  value: string
+}
+
+export default class InfoDetail extends DetailField<ColorDetailConfig, IColorProps, string> implements IDetailField<string> {
+  reset: () => Promise<string> = async () => {
+    const defaults = await this.defaultValue()
+    return (defaults === undefined) ? '' : defaults
+  }
+
+  state = {
+    value: ''
+  }
+
+  renderComponent = (props: IColorProps) => {
+    return <React.Fragment>
+      您当前使用的UI版本没有实现colorDetail组件。
+    </React.Fragment>
+  }
+
+  componentDidMount() {
+    this.getValue()
+  }
+
+  getValue = async () => {
+    const {
+      value,
+      config: {
+        defaultValue
+      }
+    } = this.props
+
+    if (value && typeof value === 'string') {
+      return this.setState({
+        value
+      })
+    }
+    if (typeof defaultValue === 'string') {
+      this.setState({
+        value: defaultValue
+      })
+    } else {
+      this.setState({
+        value: await this.reset()
+      })
+    }
+  }
+
+  render = () => {
+    const { value } = this.state
+
+    return (
+      <React.Fragment>
+        {this.renderComponent({
+          value
+        })}
+      </React.Fragment>
+    )
+  }
+}

src/components/detail/detailInfo/index.tsx

+import React from 'react'
+import { DetailField, DetailFieldConfig, DetailFieldError, IDetailField } from '../common'
+import StatementHelper, { StatementConfig } from '../../../util/statement'
+import marked from 'marked'
+
+export interface InfoDetailConfig extends DetailFieldConfig {
+  type: 'detail_info'
+  description?: {
+    descType: 'text' | 'tooltip' | 'modal'
+    label?: StatementConfig
+    mode: 'plain' | 'markdown' | 'html'
+    content?: StatementConfig
+    showIcon: boolean
+  },
+}
+
+export interface IInfoProps {
+  description?: {
+    descType: 'text' | 'tooltip' | 'modal'
+    label: string | undefined
+    content: React.ReactNode
+    showIcon: boolean
+  }
+}
+
+export default class InfoDetail extends DetailField<InfoDetailConfig, IInfoProps, string> implements IDetailField<string> {
+  renderComponent = (props: IInfoProps) => {
+    return <React.Fragment>
+      您当前使用的UI版本没有实现InfoDetail组件。
+    </React.Fragment>
+  }
+
+  render = () => {
+    const props: IInfoProps = {}
+    const {
+      config: {
+        description
+      }
+    } = this.props
+    if(description) {
+      if(description.descType === 'text') {
+        props.description = {
+          descType: 'text',
+          label: StatementHelper(description.label, { data: this.props.data, step: this.props.step }),
+          content: description.content,
+          showIcon: description.showIcon
+        }
+      } else if (description.descType === 'tooltip') {
+        props.description = {
+          descType: 'tooltip',
+          label: StatementHelper(description.label, { data: this.props.data, step: this.props.step }),
+          content: description.content,
+          showIcon: description.showIcon
+        }
+      } else {
+        props.description = {
+          descType: 'modal',
+          label: StatementHelper(description.label, { data: this.props.data, step: this.props.step }),
+          content: description.content,
+          showIcon: description.showIcon
+        }
+      }
+      if(description.content !== undefined) {
+        const descriptionType = description.mode
+        switch (descriptionType) {
+          case 'plain':
+            props.description && (props.description.content = StatementHelper(description.content, { data: this.props.data, step: this.props.step }))
+            break
+          case 'markdown':
+            props.description && (props.description.content = <div dangerouslySetInnerHTML={{ __html: marked(StatementHelper(description.content, { data: this.props.data, step: this.props.step })) }}></div>)
+            break
+          case 'html':
+            props.description && (props.description.content = <div dangerouslySetInnerHTML={{ __html: StatementHelper(description.content, { data: this.props.data, step: this.props.step })}}></div>) 
+            break
+        }
+      }
+    }
+    
+    return (
+      <React.Fragment>
+        {this.renderComponent(props)}
+      </React.Fragment>
+    )
+  }
+}

src/components/detail/enum/index.tsx

 import React from 'react'
-import { DetailField, DetailFieldConfig, IDetailField } from '../common'
+import { DetailField, DetailFieldProps, DetailFieldConfig, IDetailField } from '../common'
+import InterfaceHelper, { InterfaceConfig } from '../../../util/interface'
+import { getValue } from '../../../util/value'
 
 export interface EnumDetailConfig extends DetailFieldConfig {
   type: 'detail_enum'
   multiple: boolean | ArrayMultipleConfig | SplitMultipleConfig
-  options: ManualOptionsConfig
+  options: ManualOptionsConfig | InterfaceOptionsConfig
 }
 
 interface ArrayMultipleConfig {
@@ -27,14 +29,40 @@ interface ManualOptionsConfig {
   getValue?: string
 }
 
+export interface InterfaceOptionsConfig {
+  from: 'interface'
+  interface?: InterfaceConfig
+  format?: InterfaceOptionsListConfig | InterfaceOptionKVConfig
+}
+
+export interface InterfaceOptionKVConfig {
+  type: 'kv'
+}
+export interface InterfaceOptionsListConfig {
+  type: 'list'
+  keyField: string
+  labelField: string
+}
+
+
 export interface IEnumProps {
   value?: string | string[]
 }
 
 export default class EnumDetail extends DetailField<EnumDetailConfig, IEnumProps, any> implements IDetailField<string> {
+  interfaceHelper = new InterfaceHelper()
+
   reset: () => Promise<string> = async () => {
     const defaults = await this.defaultValue()
-    return (defaults === undefined) ? '' : defaults
+    return (defaults === undefined) ? '/' : defaults
+  }
+
+  state = {
+    value: ''
+  }
+
+  constructor(props: DetailFieldProps<EnumDetailConfig, string>) {
+    super(props)
   }
 
   renderComponent = (props: IEnumProps) => {
@@ -43,8 +71,11 @@ export default class EnumDetail extends DetailField<EnumDetailConfig, IEnumProps
     </React.Fragment>
   }
 
-  
-  getValue = () => {
+  componentDidMount() {
+    this.getValue()
+  }
+
+  getValue = async () => {
     const {
       value,
       config: {
@@ -54,7 +85,17 @@ export default class EnumDetail extends DetailField<EnumDetailConfig, IEnumProps
       }
     } = this.props
 
-    if (value === '' || value === undefined) return defaultValue
+    if (value === '' || value === undefined) {
+      if (typeof defaultValue === 'string') {
+        return this.setState({
+          value: defaultValue
+        })
+      } else {
+        return this.setState({
+          value: await this.reset()
+        })
+      }
+    }
 
     let theValue = value
     if (Object.prototype.toString.call(theValue) !== '[object Array]') {
@@ -69,29 +110,87 @@ export default class EnumDetail extends DetailField<EnumDetailConfig, IEnumProps
       if (options.data) {
         if (multiple === undefined || multiple === false) {
           const option = options.data.find((option) => option.value === value)
-          return option ? option.label : value.toString()
+          this.setState({
+            value: option ? option.label : value.toString()
+          })
         } else if (multiple === true || multiple.type) {
           if (Array.isArray(theValue)) {
-            return theValue.map((item) => {
-              const option = options.data.find((option) => {
-                return option.value === Number(item)
-              })
-              return option ? option.label : item.toString()
-            }).join(',')
+            this.setState({
+              value: theValue.map((item) => {
+                const option = options.data.find((option) => {
+                  return option.value === Number(item)
+                })
+                return option ? option.label : item.toString()
+              }).join(',')
+            })
           } else {
-            return '-'
+            this.setState({
+              value: '-'
+            })
           }
         }
+      } else {
+        this.setState({
+          value: value
+        })
+      }
+    } else if (options && options.from === 'interface') {
+      if (options.interface) {
+        this.interfaceHelper.request(
+          options.interface,
+          {},
+          { record: this.props.record, data: this.props.data, step: this.props.step },
+          { loadDomain: this.props.loadDomain }
+        ).then((data) => {
+
+          if (options.format) {
+            type OptionItem = { value: string, label: string }
+            let tempOptions: Array<OptionItem> = []
+            if (options.format.type === 'kv') {
+              tempOptions = Object.keys(data).map((key) => ({
+                value: key,
+                label: data[key]
+              }))
+              this.setState({
+                value: theValue.map((item: OptionItem) => {
+                  const option = tempOptions.find((option) => {
+                    return option.value === String(item)
+                  })
+                  return option ? option.label : item.toString()
+                }).join(',')
+              })
+            } else if (options.format.type === 'list') {
+              tempOptions = data.map((item: any) => {
+                if (options.format && options.format.type === 'list') {
+                  return ({
+                    value: getValue(item, options.format.keyField),
+                    label: getValue(item, options.format.labelField)
+                  })
+                }
+              })
+              this.setState({
+                value: theValue.map((item: OptionItem) => {
+                  const option = tempOptions.find((option) => {
+                    return option.value === String(item)
+                  })
+                  return option ? option.label : item.toString()
+                }).join(',')
+              })
+            }
+          }
+        })
       } else {
         return value
       }
-    } else {
+    }
+    else {
       return value
     }
   }
 
   render = () => {
-    const value = this.getValue()
+    // const value = this.getValue()
+    const { value } = this.state
     return (
       <React.Fragment>
         {this.renderComponent({

src/components/detail/group/index.tsx

 import React from 'react'
 import { cloneDeep } from 'lodash'
 import { setValue, getValue } from '../../../util/value'
-import { DetailField, DetailFieldConfig, DetailFieldError, DetailFieldProps, IDetailField } from '../common'
+import { DetailField, DetailFieldConfig, DetailFieldProps, IDetailField } from '../common'
 import getALLComponents, { DetailFieldConfigs } from '../'
 import { IDetailItem } from '../../../steps/detail'
 import ConditionHelper from '../../../util/condition'
@@ -20,7 +20,6 @@ export interface IGroupField {
 }
 
 interface IGroupFieldState {
-  detailData: { status: 'normal' | 'error' | 'loading', message?: string }[]
 }
 
 export default class GroupField extends DetailField<GroupFieldConfig, IGroupField, any, IGroupFieldState> implements IDetailField<string> {
@@ -30,12 +29,10 @@ export default class GroupField extends DetailField<GroupFieldConfig, IGroupFiel
   detailFields: Array<DetailField<DetailFieldConfigs, {}, any> | null> = []
   detailFieldsMounted: Array<boolean> = []
 
-  constructor (props: DetailFieldProps<GroupFieldConfig, any>) {
+  constructor(props: DetailFieldProps<GroupFieldConfig, any>) {
     super(props)
 
-    this.state = {
-      detailData: []
-    }
+    this.state = {}
   }
 
   get = async () => {
@@ -68,22 +65,6 @@ export default class GroupField extends DetailField<GroupFieldConfig, IGroupFiel
     if (this.detailFields[detailFieldIndex]) {
       const detailField = this.detailFields[detailFieldIndex]
       if (detailField) {
-        const detailFieldConfig = this.props.config.fields[detailFieldIndex]
-
-        const value = getValue(this.props.value, detailFieldConfig.field)
-
-        const validation = await detailField.validate(value)
-        if (value === undefined || validation === true) {
-          await this.setState(({ detailData }) => {
-            detailData[detailFieldIndex] = { status: 'normal' }
-            return { detailData: cloneDeep(detailData) }
-          })
-        } else {
-          await this.setState(({ detailData }) => {
-            detailData[detailFieldIndex] = { status: 'error', message: validation[0].message }
-            return { detailData: cloneDeep(detailData) }
-          })
-        }
         await detailField?.didMount()
       }
     }
@@ -118,79 +99,35 @@ export default class GroupField extends DetailField<GroupFieldConfig, IGroupFiel
     // }
   }
 
-  handleValueSet = async (detailFieldIndex: number, path: string, value: any, validation: true | DetailFieldError[]) => {
+  handleValueSet = async (detailFieldIndex: number, path: string, value: any, options?: { noPathCombination?: boolean }) => {
     const detailFieldConfig = (this.props.config.fields || [])[detailFieldIndex]
     if (detailFieldConfig) {
-      const fullPath = detailFieldConfig.field === '' || path === '' ? `${detailFieldConfig.field}${path}` : `${detailFieldConfig.field}.${path}`
-      await this.props.onValueSet(fullPath, value, true)
-
-      const detailData = cloneDeep(this.state.detailData)
-      if (validation === true) {
-        detailData[detailFieldIndex] = { status: 'normal' }
-      } else {
-        detailData[detailFieldIndex] = { status: 'error', message: validation[0].message }
-      }
-
-      this.setState({
-        detailData
-      })
+      const fullPath = options && options.noPathCombination ? path : (detailFieldConfig.field === '' || path === '' ? `${detailFieldConfig.field}${path}` : `${detailFieldConfig.field}.${path}`)
+      await this.props.onValueSet(fullPath, value)
     }
   }
 
-  handleValueUnset = async (detailFieldIndex: number, path: string, validation: true | DetailFieldError[]) => {
+  handleValueUnset = async (detailFieldIndex: number, path: string, options?: { noPathCombination?: boolean }) => {
     const detailFieldConfig = (this.props.config.fields || [])[detailFieldIndex]
     if (detailFieldConfig) {
-      const fullPath = detailFieldConfig.field === '' || path === '' ? `${detailFieldConfig.field}${path}` : `${detailFieldConfig.field}.${path}`
-      await this.props.onValueUnset(fullPath, true)
-
-      const detailData = cloneDeep(this.state.detailData)
-      if (validation === true) {
-        detailData[detailFieldIndex] = { status: 'normal' }
-      } else {
-        detailData[detailFieldIndex] = { status: 'error', message: validation[0].message }
-      }
-
-      this.setState({
-        detailData
-      })
+      const fullPath = options && options.noPathCombination ? path : (detailFieldConfig.field === '' || path === '' ? `${detailFieldConfig.field}${path}` : `${detailFieldConfig.field}.${path}`)
+      await this.props.onValueUnset(fullPath)
     }
   }
 
-  handleValueListAppend = async (detailFieldIndex: number, path: string, value: any, validation: true | DetailFieldError[]) => {
+  handleValueListAppend = async (detailFieldIndex: number, path: string, value: any, options?: { noPathCombination?: boolean }) => {
     const detailFieldConfig = (this.props.config.fields || [])[detailFieldIndex]
     if (detailFieldConfig) {
-      const fullPath = detailFieldConfig.field === '' || path === '' ? `${detailFieldConfig.field}${path}` : `${detailFieldConfig.field}.${path}`
-      await this.props.onValueListAppend(fullPath, value, true)
-
-      const detailData = cloneDeep(this.state.detailData)
-      if (validation === true) {
-        detailData[detailFieldIndex] = { status: 'normal' }
-      } else {
-        detailData[detailFieldIndex] = { status: 'error', message: validation[0].message }
-      }
-
-      this.setState({
-        detailData
-      })
+      const fullPath = options && options.noPathCombination ? path : (detailFieldConfig.field === '' || path === '' ? `${detailFieldConfig.field}${path}` : `${detailFieldConfig.field}.${path}`)
+      await this.props.onValueListAppend(fullPath, value)
     }
   }
 
-  handleValueListSplice = async (detailFieldIndex: number, path: string, index: number, count: number, validation: true | DetailFieldError[]) => {
+  handleValueListSplice = async (detailFieldIndex: number, path: string, index: number, count: number, options?: { noPathCombination?: boolean }) => {
     const detailFieldConfig = (this.props.config.fields || [])[detailFieldIndex]
     if (detailFieldConfig) {
-      const fullPath = detailFieldConfig.field === '' || path === '' ? `${detailFieldConfig.field}${path}` : `${detailFieldConfig.field}.${path}`
-      await this.props.onValueListSplice(fullPath, index, count, true)
-
-      const detailData = cloneDeep(this.state.detailData)
-      if (validation === true) {
-        detailData[detailFieldIndex] = { status: 'normal' }
-      } else {
-        detailData[detailFieldIndex] = { status: 'error', message: validation[0].message }
-      }
-
-      this.setState({
-        detailData
-      })
+      const fullPath = options && options.noPathCombination ? path : (detailFieldConfig.field === '' || path === '' ? `${detailFieldConfig.field}${path}` : `${detailFieldConfig.field}.${path}`)
+      await this.props.onValueListSplice(fullPath, index, count)
     }
   }
 
@@ -250,40 +187,47 @@ export default class GroupField extends DetailField<GroupFieldConfig, IGroupFiel
               label: detailFieldConfig.label,
               columns: config.columns?.enable
                 ? {
-                    type: detailFieldConfig.columns?.type || config.childColumns?.type || 'span',
-                    value: detailFieldConfig.columns?.value || config.childColumns?.value || 1,
-                    wrap: detailFieldConfig.columns?.wrap || config.childColumns?.wrap || false,
-                    gap: config.columns?.gap || 0,
-                    rowGap: config.columns?.rowGap || 0
-                  }
+                  type: detailFieldConfig.columns?.type || config.childColumns?.type || 'span',
+                  value: detailFieldConfig.columns?.value || config.childColumns?.value || 1,
+                  wrap: detailFieldConfig.columns?.wrap || config.childColumns?.wrap || false,
+                  gap: config.columns?.gap || 0,
+                  rowGap: config.columns?.rowGap || 0
+                }
                 : undefined,
               styles: detailFieldConfig.styles,
               layout: formLayout,
               visitable: display,
               fieldType: detailFieldConfig.type,
               children: (
-                  <DetailFieldComponent
-                    key={detailFieldIndex}
-                    ref={(detailField: DetailField<DetailFieldConfigs, any, any> | null) => {
-                      if (detailFieldIndex !== null) {
-                        this.detailFields[detailFieldIndex] = detailField
-                        this.handleMount(detailFieldIndex)
-                      }
-                    }}
-                    formLayout={formLayout}
-                    value={getValue(value, detailFieldConfig.field)}
-                    record={record}
-                    data={cloneDeep(data)}
-                    step={step}
-                    config={detailFieldConfig}
-                    onChange={async (value: any) => { await this.handleChange(detailFieldIndex, value) }}
-                    onValueSet={async (path, value, validation) => this.handleValueSet(detailFieldIndex, path, value, validation)}
-                    onValueUnset={async (path, validation) => this.handleValueUnset(detailFieldIndex, path, validation)}
-                    onValueListAppend={async (path, value, validation) => this.handleValueListAppend(detailFieldIndex, path, value, validation)}
-                    onValueListSplice={async (path, index, count, validation) => this.handleValueListSplice(detailFieldIndex, path, index, count, validation)}
-                    baseRoute={this.props.baseRoute}
-                    loadDomain={async (domain: string) => await this.props.loadDomain(domain)}
-                  />
+                <DetailFieldComponent
+                  checkPageAuth={this.props.checkPageAuth}
+                  loadPageURL={this.props.loadPageURL}
+                  loadPageFrameURL={this.props.loadPageFrameURL}
+                  loadPageConfig={this.props.loadPageConfig}
+                  handlePageRedirect={this.props.handlePageRedirect}
+                  onUnmount={this.props.onUnmount}
+                  key={detailFieldIndex}
+                  ref={(detailField: DetailField<DetailFieldConfigs, any, any> | null) => {
+                    if (detailFieldIndex !== null) {
+                      this.detailFields[detailFieldIndex] = detailField
+                      this.handleMount(detailFieldIndex)
+                    }
+                  }}
+                  formLayout={formLayout}
+                  value={getValue(value, detailFieldConfig.field)}
+                  record={record}
+                  data={cloneDeep(data)}
+                  step={step}
+                  config={detailFieldConfig}
+                  detail={this.props.detail}
+                  onChange={async (value: any) => { await this.handleChange(detailFieldIndex, value) }}
+                  onValueSet={async (path, value, options) => this.handleValueSet(detailFieldIndex, path, value, options)}
+                  onValueUnset={async (path, options) => this.handleValueUnset(detailFieldIndex, path, options)}
+                  onValueListAppend={async (path, value, options) => this.handleValueListAppend(detailFieldIndex, path, value, options)}
+                  onValueListSplice={async (path, index, count, options) => this.handleValueListSplice(detailFieldIndex, path, index, count, options)}
+                  baseRoute={this.props.baseRoute}
+                  loadDomain={async (domain: string) => await this.props.loadDomain(domain)}
+                />
               )
             }
             // 渲染表单项容器

src/components/detail/image/index.tsx

 import React from 'react'
 import { DetailField, DetailFieldConfig, IDetailField } from '../common'
 
+/**
+ * 详情项图片组件 格式定义
+ * - type:    图片类型
+ * - height:  图片高度
+ * - width:   图片宽度
+ * - preview: 点击预览
+ */
 export interface ImageDetailConfig extends DetailFieldConfig {
-  type: 'Image',
+  type: 'image',
   height?: string | number
   width?: string | number
   preview?: boolean
-  url?: string
 }
 
 export interface IImageDetail {
@@ -29,14 +35,10 @@ export default class ImageDetail extends DetailField<ImageDetailConfig, IImageDe
     const {
       value,
       config: {
-        url,
         defaultValue
       }
     } = this.props
     if (value === undefined || value === null || value === '') {
-      if (url) {
-        return url
-      }
       return defaultValue !== undefined ? defaultValue : ''
     }
     return value

src/components/detail/importSubform/index.tsx

@@ -12,10 +12,11 @@ import { ColumnsConfig } from '../../../interface'
 
 /**
  * 子表单配置项
- * - withConfig: 拓展配置
- * - * - enable: 是否开启
- * - * - dataField: （序列化）数据
- * - * - configField: （序列化）配置
+ * - configFrom: 配置来源(get用途)
+ * - * - type: 'data' | 'interface' // 来源类型
+ * - * - dataField: 值来源字段 // 仅type为data时生效
+ * - * - configField: 配置来源字段 // 仅type为data时生效
+ * - * - interface: 来源接口配置 // 仅type为interface时生效
  */
 export interface ImportSubformFieldConfig extends DetailFieldConfig {
   type: 'import_subform',
@@ -45,7 +46,7 @@ interface IImportSubformFieldState {
   formData: { status: 'normal' | 'error' | 'loading', message?: string }[]
 }
 
-export default class ImportSubformField extends DetailField<ImportSubformFieldConfig, IImportSubformField, any, IImportSubformFieldState> implements IDetailField<string> {
+export default class DetailImportSubformField extends DetailField<ImportSubformFieldConfig, IImportSubformField, any, IImportSubformFieldState> implements IDetailField<string> {
   // 各表单项对应的类型所使用的UI组件的类
   getALLComponents = (type: any): typeof Display => getALLComponents[type]
 
@@ -98,42 +99,42 @@ export default class ImportSubformField extends DetailField<ImportSubformFieldCo
         }
         value = await formField.set(value)
         if (source !== value) {
-          this.props.onValueSet(this.getFullpath(formFieldConfig.field), value, true)
+          this.props.onValueSet(this.getFullpath(formFieldConfig.field), value)
         }
         await formField.didMount()
       }
     }
   }
 
-  handleValueSet = async (formFieldIndex: number, path: string, value: any) => {
+  handleValueSet = async (formFieldIndex: number, path: string, value: any, options?: { noPathCombination?: boolean }) => {
     const formFieldConfig = (this.state.fields || [])[formFieldIndex]
     if (formFieldConfig) {
-      const fullPath = this.getFullpath(formFieldConfig.field, path)
-      await this.props.onValueSet(fullPath, value, true)
+      const fullPath = options && options.noPathCombination ? path : this.getFullpath(formFieldConfig.field, path)
+      await this.props.onValueSet(fullPath, value)
     }
   }
 
-  handleValueUnset = async (formFieldIndex: number, path: string) => {
+  handleValueUnset = async (formFieldIndex: number, path: string, options?: { noPathCombination?: boolean }) => {
     const formFieldConfig = (this.state.fields || [])[formFieldIndex]
     if (formFieldConfig) {
-      const fullPath = this.getFullpath(formFieldConfig.field, path)
-      await this.props.onValueUnset(fullPath, true)
+      const fullPath = options && options.noPathCombination ? path : this.getFullpath(formFieldConfig.field, path)
+      await this.props.onValueUnset(fullPath)
     }
   }
 
-  handleValueListAppend = async (formFieldIndex: number, path: string, value: any) => {
+  handleValueListAppend = async (formFieldIndex: number, path: string, value: any, options?: { noPathCombination?: boolean }) => {
     const formFieldConfig = (this.state.fields || [])[formFieldIndex]
     if (formFieldConfig) {
-      const fullPath = this.getFullpath(formFieldConfig.field, path)
-      await this.props.onValueListAppend(fullPath, value, true)
+      const fullPath = options && options.noPathCombination ? path : this.getFullpath(formFieldConfig.field, path)
+      await this.props.onValueListAppend(fullPath, value)
     }
   }
 
-  handleValueListSplice = async (formFieldIndex: number, path: string, index: number, count: number) => {
+  handleValueListSplice = async (formFieldIndex: number, path: string, index: number, count: number, options?: { noPathCombination?: boolean }) => {
     const formFieldConfig = (this.state.fields || [])[formFieldIndex]
     if (formFieldConfig) {
-      const fullPath = this.getFullpath(formFieldConfig.field, path)
-      await this.props.onValueListSplice(fullPath, index, count, true)
+      const fullPath = options && options.noPathCombination ? path : this.getFullpath(formFieldConfig.field, path)
+      await this.props.onValueListSplice(fullPath, index, count)
     }
   }
 
@@ -262,10 +263,10 @@ export default class ImportSubformField extends DetailField<ImportSubformFieldCo
                       data={cloneDeep(data)}
                       step={step}
                       config={formFieldConfig}
-                      onValueSet={async (path, value) => this.handleValueSet(formFieldIndex, path, value)}
-                      onValueUnset={async (path) => this.handleValueUnset(formFieldIndex, path)}
-                      onValueListAppend={async (path, value) => this.handleValueListAppend(formFieldIndex, path, value)}
-                      onValueListSplice={async (path, index, count) => this.handleValueListSplice(formFieldIndex, path, index, count)}
+                      onValueSet={async (path, value, options) => this.handleValueSet(formFieldIndex, path, value, options)}
+                      onValueUnset={async (path, options) => this.handleValueUnset(formFieldIndex, path, options)}
+                      onValueListAppend={async (path, value, options) => this.handleValueListAppend(formFieldIndex, path, value, options)}
+                      onValueListSplice={async (path, index, count, options) => this.handleValueListSplice(formFieldIndex, path, index, count, options)}
                       baseRoute={this.props.baseRoute}
                       loadDomain={async (domain: string) => await this.props.loadDomain(domain)}
                     />

src/components/detail/index.tsx

-
 import TextField, { TextFieldConfig } from './text'
 import EnumDetail, { EnumDetailConfig } from './enum'
 import StatementDetail, { StatementDetailConfig } from './statement'
 import ImageDetail, { ImageDetailConfig } from './image'
-
+import CustomDetail, { CustomDetailConfig } from './custom'
 import GroupField, { GroupFieldConfig } from './group'
 import ImportSubformField, { ImportSubformFieldConfig } from './importSubform'
+import InfoDetail, { InfoDetailConfig } from './detailInfo'
+import ColorDetail, { ColorDetailConfig } from './detailColor'
+import TableField, { TableFieldConfig } from './table'
 
 /**
  * 详情步骤内详情项配置文件格式定义 - 枚举
  */
 export type DetailFieldConfigs =
-    TextFieldConfig |
-    EnumDetailConfig |
-    StatementDetailConfig |
-    ImageDetailConfig |
-    GroupFieldConfig |
-    ImportSubformFieldConfig
+  TextFieldConfig |
+  EnumDetailConfig |
+  StatementDetailConfig |
+  ImageDetailConfig |
+  GroupFieldConfig |
+  ImportSubformFieldConfig |
+  InfoDetailConfig |
+  ColorDetailConfig |
+  TableFieldConfig |
+  CustomDetailConfig
 
 export type componentType =
-    'text' |
-    'group' |
-    'detail_enum' |
-    'statement' |
-    'image' |
-    'import_subform'
+  'text' |
+  'group' |
+  'detail_enum' |
+  'statement' |
+  'image' |
+  'import_subform' |
+  'detail_info' |
+  'detail_color' |
+  'table' |
+  'custom'
 
 export default {
   group: GroupField,
@@ -32,5 +42,9 @@ export default {
   import_subform: ImportSubformField,
   detail_enum: EnumDetail,
   image: ImageDetail,
-  statement: StatementDetail
+  statement: StatementDetail,
+  detail_info: InfoDetail,
+  detail_color: ColorDetail,
+  table: TableField,
+  custom: CustomDetail
 }

src/components/detail/table/common/columnStyle.tsx

+import React, { Component } from 'react'
+
+type Props = {
+    style: any
+    addfix: boolean
+};
+
+export default class ColumnStyleComponent extends Component<Props, {}> {
+  render () {
+    const { style, addfix = true } = this.props
+    const reSetStyle = Object.assign({}, { fontSize: style?.fontSize, color: style?.color }, style?.customStyle)
+    return addfix
+      ? <div style={reSetStyle}>
+           {style?.prefix || ''}{this.props.children}{style?.postfix || ''}
+        </div>
+      : <div style={reSetStyle}>
+            {this.props.children}
+        </div>
+  }
+}

src/components/detail/text/index.tsx

 import React from 'react'
 import { getBoolean } from '../../../util/value'
-import { DetailField, DetailFieldConfig, DetailFieldError, IDetailField } from '../common'
+import { DetailField, DetailFieldProps, DetailFieldConfig, DetailFieldError, IDetailField } from '../common'
 
 export interface TextFieldConfig extends DetailFieldConfig {
   type: 'text'
 }
 
 export interface ITextField {
-  value: string
+  value: string | Array<string>
 }
 
 export default class TextField extends DetailField<TextFieldConfig, ITextField, string> implements IDetailField<string> {
+  reset: () => Promise<string> = async () => {
+    const defaults = await this.defaultValue()
+    return (defaults === undefined) ? '/' : defaults
+  }
+
+  state = {
+    value: ''
+  }
+
+  constructor(props: DetailFieldProps<TextFieldConfig, string>) {
+    super(props)
+  }
+
   renderComponent = (props: ITextField) => {
     return <React.Fragment>
       您当前使用的UI版本没有实现Text组件。
@@ -19,24 +32,45 @@ export default class TextField extends DetailField<TextFieldConfig, ITextField,
     </React.Fragment>
   }
 
-  getValue = () => {
+  componentDidMount() {
+    this.getValue()
+  }
+
+  getValue = async () => {
     const {
       value,
       config: {
         defaultValue
       }
     } = this.props
-
-    if (value === undefined || value === null || value === '') {
-      return defaultValue !== undefined ? defaultValue : ''
+    if (value) {
+      if (typeof value !== 'object') {
+        return this.setState({
+          value: String(value)
+        })
+      } else if (Array.isArray(value)) {
+        return this.setState({
+          value: (value as Array<string>).join(',')
+        })
+      } else {
+        return this.setState({
+          value: '/'
+        })
+      }
+    }
+    if (typeof defaultValue === 'string') {
+      this.setState({
+        value: defaultValue
+      })
+    } else {
+      this.setState({
+        value: await this.reset()
+      })
     }
-    return value
   }
 
   render = () => {
-    const value = this.getValue()
-    console.log(value, 'text value ')
-
+    const { value } = this.state
     return (
       <React.Fragment>
         {this.renderComponent({

src/components/formFields/code/index.tsx

+import React, { KeyboardEvent } from 'react'
+import { Field, FieldConfig, FieldError, IField } from '../common'
+import { getBoolean } from '../../../util/value'
+
+/**
+ * code编辑器配置项
+ * - codeType: 语言类型
+ * - height: 代码编辑器高度
+ * - theme: 编辑器主题风格
+ * - fullScreen: 是否支持全屏
+ */
+export interface CodeFieldConfig extends FieldConfig {
+  type: 'code'
+  codeType: 'xml' | 'json' | 'javascript' | 'java'
+  height: number
+  theme: 'white' | 'black'
+  fullScreen: boolean
+}
+
+export interface ICodeField {
+  codeType: 'xml' | 'json' | 'javascript' | 'java'
+  fullScreenStatus: boolean
+  height: number
+  theme: 'white' | 'black'
+  value: string
+  onChange: (value: string) => Promise<void>
+}
+
+/**
+ * code编辑器配置项
+ * - codeType: 语言类型
+ * - height: 代码编辑器高度
+ * - onResetValue: 编辑器重置为默认值
+ * - fullScreen: 是否支持全屏
+ * - fullScreenStatus: 编辑器是不是处于全屏状态
+ */
+export interface ICodeFieldContainer {
+  fullScreen: boolean
+  fullScreenStatus: boolean
+  theme: 'white' | 'black'
+  children: React.ReactNode
+  onResetValue: (value: string) => Promise<void>
+  keydownCallback: (value: KeyboardEvent) => Promise<void>
+  enterFull: () => void
+  exitFull: () => void
+}
+interface State {
+  fullScreenStatus: boolean // 编辑器是不是处于全屏状态
+}
+export default class CodeField extends Field<CodeFieldConfig, ICodeField, string> implements IField<string> {
+  state:State = {
+    fullScreenStatus: false
+  }
+
+  reset: () => Promise<string> = async () => {
+    const defaults = await this.defaultValue()
+    return (defaults === undefined) ? '' : defaults
+  }
+
+  validate = async (value: string): Promise<true | FieldError[]> => {
+    const {
+      config: {
+        label,
+        required
+      }
+    } = this.props
+
+    const errors: FieldError[] = []
+
+    if (getBoolean(required)) {
+      if (value === '' || value === undefined || value === null || String(value).trim() === '') {
+        errors.push(new FieldError(`输入${label}`))
+        return errors
+      }
+    }
+
+    return errors.length ? errors : true
+  }
+
+  keydownCallback = (e: KeyboardEvent) => {
+    e.stopPropagation()
+    const keyCode = e.keyCode || e.which || e.charCode
+    const ctrlKey = e.ctrlKey || e.metaKey
+    if (this.props.config.fullScreen) {
+      if ((e.key === 'j' || keyCode === 74) && ctrlKey) {
+        this.enterFull()
+      } else if ((e.key === 'Escape' || keyCode === 27)) {
+        this.exitFull()
+      }
+    }
+  }
+
+  enterFull = () => {
+    this.setState({ fullScreenStatus: true })
+  }
+
+  exitFull = () => {
+    this.setState({ fullScreenStatus: false })
+  }
+
+  renderContainer = (props: ICodeFieldContainer) => {
+    return <React.Fragment>
+      您当前使用的UI版本没有实现CodeField的container组件。
+      <div style={{ display: 'none' }}>
+        <button onClick={() => props.onResetValue('onResetValue')}>onResetValue</button>
+      </div>
+    </React.Fragment>
+  }
+
+  renderComponent = (props: ICodeField) => {
+    return <React.Fragment>
+      您当前使用的UI版本没有实现CodeField组件。
+      <div style={{ display: 'none' }}>
+        <button onClick={() => props.onChange('onChange')}>onChange</button>
+      </div>
+    </React.Fragment>
+  }
+
+  render = () => {
+    const {
+      value,
+      config: {
+        theme,
+        fullScreen,
+        height,
+        codeType
+      }
+    } = this.props
+    const { fullScreenStatus } = this.state
+
+    return (
+      <React.Fragment>
+        {this.renderContainer({
+          fullScreenStatus,
+          fullScreen,
+          theme,
+          onResetValue: async (defaultCodeValue: string) => await this.props.onValueSet('', defaultCodeValue, await this.validate(defaultCodeValue)),
+          keydownCallback: async (e: KeyboardEvent) => await this.keydownCallback(e),
+          enterFull: this.enterFull,
+          exitFull: this.exitFull,
+          children: this.renderComponent({
+            codeType,
+            fullScreenStatus,
+            value,
+            theme,
+            height,
+            onChange: async (value: string) => await this.props.onValueSet('', value, await this.validate(value))
+          })
+        })}
+      </React.Fragment>
+    )
+  }
+}

src/components/formFields/common.tsx

@@ -83,16 +83,16 @@ export interface FieldProps<C extends FieldConfig, T> {
   config: C
   // TODO 待删除
   onChange: (value: T) => Promise<void>
-  // 事件：设置值
-  onValueSet: (path: string, value: T, validation: true | FieldError[]) => Promise<void>
+  // 事件：设置值  noPathCombination：为true时不做路径拼接
+  onValueSet: (path: string, value: T, validation: true | FieldError[], options?: { noPathCombination?: boolean }) => Promise<void>
   // 事件：置空值
-  onValueUnset: (path: string, validation: true | FieldError[]) => Promise<void>
+  onValueUnset: (path: string, validation: true | FieldError[], options?: { noPathCombination?: boolean }) => Promise<void>
   // 事件：修改值 - 列表 - 追加
-  onValueListAppend: (path: string, value: any, validation: true | FieldError[]) => Promise<void>
+  onValueListAppend: (path: string, value: any, validation: true | FieldError[], options?: { noPathCombination?: boolean }) => Promise<void>
   // 事件：修改值 - 列表 - 删除
-  onValueListSplice: (path: string, index: number, count: number, validation: true | FieldError[]) => Promise<void>
+  onValueListSplice: (path: string, index: number, count: number, validation: true | FieldError[], options?: { noPathCombination?: boolean }) => Promise<void>
   // 事件：修改值 - 列表 - 修改顺序
-  onValueListSort: (path: string, index: number, sortType: 'up' | 'down', validation: true | FieldError[]) => Promise<void>
+  onValueListSort: (path: string, index: number, sortType: 'up' | 'down', validation: true | FieldError[], options?: { noPathCombination?: boolean }) => Promise<void>
   baseRoute: string,
   loadDomain: (domain: string) => Promise<string>
 }
@@ -181,20 +181,19 @@ export class Field<C extends FieldConfig, E, T, S = {}> extends React.Component<
 }
 
 export interface DisplayProps<C extends FieldConfig, T> {
-  formLayout: 'horizontal' | 'vertical' | 'inline'
   value: T,
   record: { [field: string]: any },
   data: any[],
   step: number,
   config: C,
   // 事件：设置值
-  onValueSet: (path: string, value: T, validation: true | FieldError[]) => Promise<void>
+  onValueSet: (path: string, value: T, options?: { noPathCombination?: boolean }) => Promise<void>
   // 事件：置空值
-  onValueUnset: (path: string, validation: true | FieldError[]) => Promise<void>
+  onValueUnset: (path: string, options?: { noPathCombination?: boolean }) => Promise<void>
   // 事件：修改值 - 列表 - 追加
-  onValueListAppend: (path: string, value: any, validation: true | FieldError[]) => Promise<void>
+  onValueListAppend: (path: string, value: any, options?: { noPathCombination?: boolean }) => Promise<void>
   // 事件：修改值 - 列表 - 删除
-  onValueListSplice: (path: string, index: number, count: number, validation: true | FieldError[]) => Promise<void>
+  onValueListSplice: (path: string, index: number, count: number, options?: { noPathCombination?: boolean }) => Promise<void>
   baseRoute: string,
   loadDomain: (domain: string) => Promise<string>
 }
@@ -240,7 +239,7 @@ export class Display<C extends FieldConfig, E, T, S = {}> extends React.Componen
 
 export class FieldError {
   message: string
-  constructor (message: string) {
+  constructor(message: string) {
     this.message = message
   }
 }

src/components/formFields/diffCode/index.tsx

+import React, { KeyboardEvent } from 'react'
+import { get } from 'lodash'
+import { Field, FieldConfig, FieldError, IField } from '../common'
+
+/**
+ * diffCode编辑器配置项
+ * - codeType: 语言类型
+ * - height: 代码编辑器高度
+ * - theme: 编辑器主题风格
+ * - fullScreen: 是否支持全屏
+ * - originalCodeField: 代码原始值入参字段
+ * - modifiedCodeField: 代码修改值入参字段
+ */
+export interface DiffCodeFieldConfig extends FieldConfig {
+  type: 'diffcode'
+  codeType: 'xml' | 'json' | 'javascript' | 'java'
+  height: number
+  theme: 'white' | 'black'
+  fullScreen: boolean
+  originalCodeField: string
+  modifiedCodeField: string
+}
+
+export interface IDiffCodeField {
+  codeType: 'xml' | 'json' | 'javascript' | 'java'
+  fullScreenStatus: boolean
+  height: number
+  theme: 'white' | 'black'
+  originalCode: string
+  modifiedCode: string
+}
+
+/**
+ * diffCode编辑器配置项
+ * - codeType: 语言类型
+ * - height: 代码编辑器高度
+ * - fullScreen: 是否支持全屏
+ * - fullScreenStatus: 编辑器是不是处于全屏状态
+ */
+export interface IDiffCodeFieldContainer {
+  fullScreen: boolean
+  fullScreenStatus: boolean
+  theme: 'white' | 'black'
+  children: React.ReactNode
+  keydownCallback: (value: KeyboardEvent) => Promise<void>
+  enterFull: () => void
+  exitFull: () => void
+}
+interface DiffCodeFieldValue {
+   [field: string]: any
+}
+interface State {
+  fullScreenStatus: boolean // 编辑器是不是处于全屏状态
+}
+
+export default class DiffCodeField extends Field<DiffCodeFieldConfig, IDiffCodeField, DiffCodeFieldValue> implements IField<DiffCodeFieldValue> {
+  state:State = {
+    fullScreenStatus: false
+  }
+
+  get: () => Promise<DiffCodeFieldValue> = async () => {
+    return {}
+  }
+
+  reset: () => Promise<DiffCodeFieldValue> = async () => {
+    const defaults = await this.defaultValue()
+    return (defaults === undefined) ? '' : defaults
+  }
+
+  validate = async (value: DiffCodeFieldValue): Promise<true | FieldError[]> => {
+    return true
+  }
+
+  keydownCallback = (e: KeyboardEvent) => {
+    e.stopPropagation()
+    const keyCode = e.keyCode || e.which || e.charCode
+    const ctrlKey = e.ctrlKey || e.metaKey
+    if (this.props.config.fullScreen) {
+      if ((e.key === 'j' || keyCode === 74) && ctrlKey) {
+        this.enterFull()
+      } else if ((e.key === 'Escape' || keyCode === 27)) {
+        this.exitFull()
+      }
+    }
+  }
+
+  enterFull = () => {
+    this.setState({ fullScreenStatus: true })
+  }
+
+  exitFull = () => {
+    this.setState({ fullScreenStatus: false })
+  }
+
+  renderContainer = (props: IDiffCodeFieldContainer) => {
+    return <React.Fragment>
+      您当前使用的UI版本没有实现CodeField的container组件。
+      <div style={{ display: 'none' }}>
+      </div>
+    </React.Fragment>
+  }
+
+  renderComponent = (props: IDiffCodeField) => {
+    return <React.Fragment>
+      您当前使用的UI版本没有实现CodeField组件。
+      <div style={{ display: 'none' }}>
+      </div>
+    </React.Fragment>
+  }
+
+  render = () => {
+    const {
+      value,
+      config: {
+        theme,
+        fullScreen,
+        height,
+        codeType,
+        originalCodeField,
+        modifiedCodeField
+      }
+    } = this.props
+    const { fullScreenStatus } = this.state
+    const originalCode = get(value, originalCodeField) || ''
+    const modifiedCode = get(value, modifiedCodeField) || ''
+    return (
+      <React.Fragment>
+        {this.renderContainer({
+          fullScreenStatus,
+          fullScreen,
+          theme,
+          keydownCallback: async (e: KeyboardEvent) => await this.keydownCallback(e),
+          enterFull: this.enterFull,
+          exitFull: this.exitFull,
+          children: this.renderComponent({
+            codeType,
+            fullScreenStatus,
+            originalCode,
+            modifiedCode,
+            theme,
+            height
+          })
+        })}
+      </React.Fragment>
+    )
+  }
+}

src/components/formFields/form/display.tsx

 import React from 'react'
 import { display as getALLComponents } from '../'
 import { FormFieldConfig } from '.'
-import { Display, FieldConfigs, FieldError, FieldProps } from '../common'
+import { Display, FieldConfigs, DisplayProps } from '../common'
 import { getValue, setValue } from '../../../util/value'
 import { cloneDeep } from 'lodash'
 import ConditionHelper from '../../../util/condition'
@@ -28,7 +28,6 @@ export interface IFormFieldItemField {
 
 interface FormState {
   didMount: boolean
-  formDataList: { status: 'normal' | 'error' | 'loading', message?: string }[][]
   showItem: boolean
   showIndex: number
 }
@@ -39,12 +38,11 @@ export default class FormField extends Display<FormFieldConfig, IFormField, Arra
   formFieldsList: Array<Array<Display<FieldConfigs, any, any> | null>> = []
   formFieldsMountedList: Array<Array<boolean>> = []
 
-  constructor (props: FieldProps<FormFieldConfig, any>) {
+  constructor (props: DisplayProps<FormFieldConfig, any>) {
     super(props)
 
     this.state = {
       didMount: false,
-      formDataList: [],
       showItem: false,
       showIndex: 0
     }
@@ -117,9 +115,6 @@ export default class FormField extends Display<FormFieldConfig, IFormField, Arra
     }
     this.formFieldsMountedList[index][formFieldIndex] = true
 
-    const formDataList = cloneDeep(this.state.formDataList)
-    if (!formDataList[index]) formDataList[index] = []
-
     if (this.formFieldsList[index] && this.formFieldsList[index][formFieldIndex]) {
       const formField = this.formFieldsList[index][formFieldIndex]
       if (formField) {
@@ -132,95 +127,43 @@ export default class FormField extends Display<FormFieldConfig, IFormField, Arra
         }
         value = await formField.set(value)
         if (source !== value) {
-          this.props.onValueSet(`[${index}]${formFieldConfig.field}`, value, true)
-        }
-
-        if (value !== undefined) {
-          formDataList[index][formFieldIndex] = { status: 'normal' }
+          this.props.onValueSet(`[${index}]${formFieldConfig.field}`, value)
         }
 
         await formField.didMount()
       }
     }
-
-    await this.setState({
-      formDataList
-    })
   }
 
-  handleValueSet = async (index: number, formFieldIndex: number, path: string, value: any, validation: true | FieldError[]) => {
+  handleValueSet = async (index: number, formFieldIndex: number, path: string, value: any, options?: { noPathCombination?: boolean }) => {
     const formFieldConfig = (this.props.config.fields || [])[formFieldIndex]
     if (formFieldConfig) {
-      const fullPath = formFieldConfig.field === '' || path === '' ? `${formFieldConfig.field}${path}` : `${formFieldConfig.field}.${path}`
-      await this.props.onValueSet(`[${index}]${fullPath}`, value, true)
-
-      const formDataList = cloneDeep(this.state.formDataList)
-      if (validation === true) {
-        formDataList[index][formFieldIndex] = { status: 'normal' }
-      } else {
-        formDataList[index][formFieldIndex] = { status: 'error', message: validation[0].message }
-      }
-
-      this.setState({
-        formDataList
-      })
+      const fullPath = options && options.noPathCombination ? path : (formFieldConfig.field === '' || path === '' ? `${formFieldConfig.field}${path}` : `${formFieldConfig.field}.${path}`)
+      await this.props.onValueSet(`[${index}]${fullPath}`, value)
     }
   }
 
-  handleValueUnset = async (index: number, formFieldIndex: number, path: string, validation: true | FieldError[]) => {
+  handleValueUnset = async (index: number, formFieldIndex: number, path: string, options?: { noPathCombination?: boolean }) => {
     const formFieldConfig = (this.props.config.fields || [])[formFieldIndex]
     if (formFieldConfig) {
-      const fullPath = formFieldConfig.field === '' || path === '' ? `${formFieldConfig.field}${path}` : `${formFieldConfig.field}.${path}`
-      await this.props.onValueUnset(`[${index}]${fullPath}`, true)
-
-      const formDataList = cloneDeep(this.state.formDataList)
-      if (validation === true) {
-        formDataList[index][formFieldIndex] = { status: 'normal' }
-      } else {
-        formDataList[index][formFieldIndex] = { status: 'error', message: validation[0].message }
-      }
-
-      this.setState({
-        formDataList
-      })
+      const fullPath = options && options.noPathCombination ? path : (formFieldConfig.field === '' || path === '' ? `${formFieldConfig.field}${path}` : `${formFieldConfig.field}.${path}`)
+      await this.props.onValueUnset(`[${index}]${fullPath}`)
     }
   }
 
-  handleValueListAppend = async (index: number, formFieldIndex: number, path: string, value: any, validation: true | FieldError[]) => {
+  handleValueListAppend = async (index: number, formFieldIndex: number, path: string, value: any, options?: { noPathCombination?: boolean }) => {
     const formFieldConfig = (this.props.config.fields || [])[formFieldIndex]
     if (formFieldConfig) {
-      const fullPath = formFieldConfig.field === '' || path === '' ? `${formFieldConfig.field}${path}` : `${formFieldConfig.field}.${path}`
-      await this.props.onValueListAppend(`[${index}]${fullPath}`, value, true)
-
-      const formDataList = cloneDeep(this.state.formDataList)
-      if (validation === true) {
-        formDataList[index][formFieldIndex] = { status: 'normal' }
-      } else {
-        formDataList[index][formFieldIndex] = { status: 'error', message: validation[0].message }
-      }
-
-      this.setState({
-        formDataList
-      })
+      const fullPath = options && options.noPathCombination ? path : (formFieldConfig.field === '' || path === '' ? `${formFieldConfig.field}${path}` : `${formFieldConfig.field}.${path}`)
+      await this.props.onValueListAppend(`[${index}]${fullPath}`, value)
     }
   }
 
-  handleValueListSplice = async (index: number, formFieldIndex: number, path: string, _index: number, count: number, validation: true | FieldError[]) => {
+  handleValueListSplice = async (index: number, formFieldIndex: number, path: string, _index: number, count: number, options?: { noPathCombination?: boolean }) => {
     const formFieldConfig = (this.props.config.fields || [])[formFieldIndex]
     if (formFieldConfig) {
-      const fullPath = formFieldConfig.field === '' || path === '' ? `${formFieldConfig.field}${path}` : `${formFieldConfig.field}.${path}`
-      await this.props.onValueListSplice(`[${index}]${fullPath}`, _index, count, true)
-
-      const formDataList = cloneDeep(this.state.formDataList)
-      if (validation === true) {
-        formDataList[index][formFieldIndex] = { status: 'normal' }
-      } else {
-        formDataList[index][formFieldIndex] = { status: 'error', message: validation[0].message }
-      }
-
-      this.setState({
-        formDataList
-      })
+      const fullPath = options && options.noPathCombination ? path : (formFieldConfig.field === '' || path === '' ? `${formFieldConfig.field}${path}` : `${formFieldConfig.field}.${path}`)
+      await this.props.onValueListSplice(`[${index}]${fullPath}`, _index, count)
     }
   }
 
@@ -291,11 +234,6 @@ export default class FormField extends Display<FormFieldConfig, IFormField, Arra
                           }
                           const FormField = this.getALLComponents(formFieldConfig.type) || Display
 
-                          let status = ((this.state.formDataList[index] || [])[fieldIndex] || {}).status || 'normal'
-
-                          if (['group', 'import_subform', 'object', 'tabs', 'form'].some((type) => type === formFieldConfig.type)) {
-                            status = 'normal'
-                          }
                           // 渲染表单项容器
                           return (
                             <div key={fieldIndex}>
@@ -321,10 +259,10 @@ export default class FormField extends Display<FormFieldConfig, IFormField, Arra
                                       data={cloneDeep(data)}
                                       step={step}
                                       config={formFieldConfig}
-                                      onValueSet={async (path, value, validation) => this.handleValueSet(index, fieldIndex, path, value, validation)}
-                                      onValueUnset={async (path, validation) => this.handleValueUnset(index, fieldIndex, path, validation)}
-                                      onValueListAppend={async (path, value, validation) => this.handleValueListAppend(index, fieldIndex, path, value, validation)}
-                                      onValueListSplice={async (path, _index, count, validation) => this.handleValueListSplice(index, fieldIndex, path, _index, count, validation)}
+                                      onValueSet={async (path, value, options) => this.handleValueSet(index, fieldIndex, path, value, options)}
+                                      onValueUnset={async (path, options) => this.handleValueUnset(index, fieldIndex, path, options)}
+                                      onValueListAppend={async (path, value, options) => this.handleValueListAppend(index, fieldIndex, path, value, options)}
+                                      onValueListSplice={async (path, _index, count, options) => this.handleValueListSplice(index, fieldIndex, path, _index, count, options)}
                                       baseRoute={this.props.baseRoute}
                                       loadDomain={async (domain: string) => await this.props.loadDomain(domain)}
                                     />

src/components/formFields/form/index.tsx

@@ -127,6 +127,7 @@ export default class FormField extends Field<FormFieldConfig, IFormField, Array<
     }
 
     let childrenError = 0
+    const childrenErrorMsg: Array<{name:string, msg:string}> = []
 
     const formDataList = cloneDeep(this.state.formDataList)
 
@@ -135,7 +136,7 @@ export default class FormField extends Field<FormFieldConfig, IFormField, Array<
       const formItems = this.formFieldsList[formItemsIndex]
       for (const fieldIndex in (this.props.config.fields || [])) {
         const formItem = formItems[fieldIndex]
-        if (formItem !== null && formItem !== undefined) {
+        if (formItem !== null && formItem !== undefined && !formItem.props.config.disabled) {
           const validation = await formItem.validate(getValue(value[formItemsIndex], (this.props.config.fields || [])[fieldIndex].field))
 
           if (validation === true) {
@@ -143,6 +144,10 @@ export default class FormField extends Field<FormFieldConfig, IFormField, Array<
           } else {
             childrenError++
             formDataList[formItemsIndex][fieldIndex] = { status: 'error', message: validation[0].message }
+            childrenErrorMsg.push({
+              name: this.props.config.fields[fieldIndex].label,
+              msg: validation[0].message
+            })
           }
         }
       }
@@ -153,7 +158,8 @@ export default class FormField extends Field<FormFieldConfig, IFormField, Array<
     })
 
     if (childrenError > 0) {
-      errors.push(new FieldError(`子项中存在${childrenError}个错误。`))
+      const errTips = `${this.props.config.label || ''} ${childrenErrorMsg.map(err => `${err.name}:${err.msg}`).join('; ')}`
+      errors.push(new FieldError(errTips))
     }
 
     return errors.length ? errors : true
@@ -190,7 +196,7 @@ export default class FormField extends Field<FormFieldConfig, IFormField, Array<
               continue
             }
             const formField = this.formFieldsList[index] && this.formFieldsList[index][formFieldIndex]
-            if (formField) {
+            if (formField && !formFieldConfig.disabled) {
               const value = await formField.get()
               item = setValue(item, formFieldConfig.field, value)
             }
@@ -322,10 +328,10 @@ export default class FormField extends Field<FormFieldConfig, IFormField, Array<
     // }
   }
 
-  handleValueSet = async (index: number, formFieldIndex: number, path: string, value: any, validation: true | FieldError[]) => {
+  handleValueSet = async (index: number, formFieldIndex: number, path: string, value: any, validation: true | FieldError[], options?: { noPathCombination?: boolean }) => {
     const formFieldConfig = (this.props.config.fields || [])[formFieldIndex]
     if (formFieldConfig) {
-      const fullPath = formFieldConfig.field === '' || path === '' ? `${formFieldConfig.field}${path}` : `${formFieldConfig.field}.${path}`
+      const fullPath = options && options.noPathCombination ? path : (formFieldConfig.field === '' || path === '' ? `${formFieldConfig.field}${path}` : `${formFieldConfig.field}.${path}`)
       await this.props.onValueSet(`[${index}]${fullPath}`, value, true)
 
       const formDataList = cloneDeep(this.state.formDataList)
@@ -341,10 +347,10 @@ export default class FormField extends Field<FormFieldConfig, IFormField, Array<
     }
   }
 
-  handleValueUnset = async (index: number, formFieldIndex: number, path: string, validation: true | FieldError[]) => {
+  handleValueUnset = async (index: number, formFieldIndex: number, path: string, validation: true | FieldError[], options?: { noPathCombination?: boolean }) => {
     const formFieldConfig = (this.props.config.fields || [])[formFieldIndex]
     if (formFieldConfig) {
-      const fullPath = formFieldConfig.field === '' || path === '' ? `${formFieldConfig.field}${path}` : `${formFieldConfig.field}.${path}`
+      const fullPath = options && options.noPathCombination ? path : (formFieldConfig.field === '' || path === '' ? `${formFieldConfig.field}${path}` : `${formFieldConfig.field}.${path}`)
       await this.props.onValueUnset(`[${index}]${fullPath}`, true)
 
       const formDataList = cloneDeep(this.state.formDataList)
@@ -360,10 +366,10 @@ export default class FormField extends Field<FormFieldConfig, IFormField, Array<
     }
   }
 
-  handleValueListAppend = async (index: number, formFieldIndex: number, path: string, value: any, validation: true | FieldError[]) => {
+  handleValueListAppend = async (index: number, formFieldIndex: number, path: string, value: any, validation: true | FieldError[], options?: { noPathCombination?: boolean }) => {
     const formFieldConfig = (this.props.config.fields || [])[formFieldIndex]
     if (formFieldConfig) {
-      const fullPath = formFieldConfig.field === '' || path === '' ? `${formFieldConfig.field}${path}` : `${formFieldConfig.field}.${path}`
+      const fullPath = options && options.noPathCombination ? path : (formFieldConfig.field === '' || path === '' ? `${formFieldConfig.field}${path}` : `${formFieldConfig.field}.${path}`)
       await this.props.onValueListAppend(`[${index}]${fullPath}`, value, true)
 
       const formDataList = cloneDeep(this.state.formDataList)
@@ -379,10 +385,10 @@ export default class FormField extends Field<FormFieldConfig, IFormField, Array<
     }
   }
 
-  handleValueListSplice = async (index: number, formFieldIndex: number, path: string, _index: number, count: number, validation: true | FieldError[]) => {
+  handleValueListSplice = async (index: number, formFieldIndex: number, path: string, _index: number, count: number, validation: true | FieldError[], options?: { noPathCombination?: boolean }) => {
     const formFieldConfig = (this.props.config.fields || [])[formFieldIndex]
     if (formFieldConfig) {
-      const fullPath = formFieldConfig.field === '' || path === '' ? `${formFieldConfig.field}${path}` : `${formFieldConfig.field}.${path}`
+      const fullPath = options && options.noPathCombination ? path : (formFieldConfig.field === '' || path === '' ? `${formFieldConfig.field}${path}` : `${formFieldConfig.field}.${path}`)
       await this.props.onValueListSplice(`[${index}]${fullPath}`, _index, count, true)
 
       const formDataList = cloneDeep(this.state.formDataList)
@@ -398,10 +404,10 @@ export default class FormField extends Field<FormFieldConfig, IFormField, Array<
     }
   }
 
-  handleValueListSort = async (index: number, formFieldIndex: number, path: string, _index: number, sortType: 'up' | 'down', validation: true | FieldError[]) => {
+  handleValueListSort = async (index: number, formFieldIndex: number, path: string, _index: number, sortType: 'up' | 'down', validation: true | FieldError[], options?: { noPathCombination?: boolean }) => {
     const formFieldConfig = (this.props.config.fields || [])[formFieldIndex]
     if (formFieldConfig) {
-      const fullPath = formFieldConfig.field === '' || path === '' ? `${formFieldConfig.field}${path}` : `${formFieldConfig.field}.${path}`
+      const fullPath = options && options.noPathCombination ? path : (formFieldConfig.field === '' || path === '' ? `${formFieldConfig.field}${path}` : `${formFieldConfig.field}.${path}`)
       await this.props.onValueListSort(`[${index}]${fullPath}`, _index, sortType, true)
 
       const formDataList = cloneDeep(this.state.formDataList)
@@ -494,6 +500,7 @@ export default class FormField extends Field<FormFieldConfig, IFormField, Array<
                           if (!ConditionHelper(formFieldConfig.condition, { record: itemValue, data: this.props.data, step: this.props.step })) {
                             if (!this.formFieldsMountedList[index]) this.formFieldsMountedList[index] = []
                             this.formFieldsMountedList[index][fieldIndex] = false
+                            this.formFieldsList[index] && (this.formFieldsList[index][fieldIndex] = null)
                             return null
                           }
                           const FormField = this.getALLComponents(formFieldConfig.type) || Field
@@ -533,11 +540,11 @@ export default class FormField extends Field<FormFieldConfig, IFormField, Array<
                                       step={step}
                                       config={formFieldConfig}
                                       onChange={(value: any) => this.handleChange(index, fieldIndex, value)}
-                                      onValueSet={async (path, value, validation) => this.handleValueSet(index, fieldIndex, path, value, validation)}
-                                      onValueUnset={async (path, validation) => this.handleValueUnset(index, fieldIndex, path, validation)}
-                                      onValueListAppend={async (path, value, validation) => this.handleValueListAppend(index, fieldIndex, path, value, validation)}
-                                      onValueListSplice={async (path, _index, count, validation) => this.handleValueListSplice(index, fieldIndex, path, _index, count, validation)}
-                                      onValueListSort={async (path, _index, sortType, validation) => await this.handleValueListSort(index, fieldIndex, path, _index, sortType, validation)}
+                                      onValueSet={async (path, value, validation, options) => this.handleValueSet(index, fieldIndex, path, value, validation, options)}
+                                      onValueUnset={async (path, validation, options) => this.handleValueUnset(index, fieldIndex, path, validation, options)}
+                                      onValueListAppend={async (path, value, validation, options) => this.handleValueListAppend(index, fieldIndex, path, value, validation, options)}
+                                      onValueListSplice={async (path, _index, count, validation, options) => this.handleValueListSplice(index, fieldIndex, path, _index, count, validation, options)}
+                                      onValueListSort={async (path, _index, sortType, validation, options) => await this.handleValueListSort(index, fieldIndex, path, _index, sortType, validation, options)}
                                       baseRoute={this.props.baseRoute}
                                       loadDomain={async (domain: string) => await this.props.loadDomain(domain)}
                                     />

src/components/formFields/group/display.tsx

@@ -2,7 +2,7 @@ import React from 'react'
 import { display as getALLComponents, FieldConfigs } from '../'
 import { GroupFieldConfig, IGroupField } from '.'
 import { setValue, getValue, getBoolean } from '../../../util/value'
-import { Display, FieldError, FieldProps } from '../common'
+import { Display, DisplayProps } from '../common'
 import { IFormItem } from '../../../steps/form'
 import { cloneDeep } from 'lodash'
 import ConditionHelper from '../../../util/condition'
@@ -10,7 +10,10 @@ import StatementHelper from '../../../util/statement'
 
 interface IGroupFieldState {
   didMount: boolean
+<<<<<<< HEAD
   formData: { status: 'normal' | 'error' | 'loading', message?: string, name?: string }[],
+=======
+>>>>>>> v1.2.5
 }
 
 export default class GroupField extends Display<GroupFieldConfig, IGroupField, any, IGroupFieldState> {
@@ -20,12 +23,11 @@ export default class GroupField extends Display<GroupFieldConfig, IGroupField, a
   formFields: Array<Display<FieldConfigs, {}, any> | null> = []
   formFieldsMounted: Array<boolean> = []
 
-  constructor (props: FieldProps<GroupFieldConfig, any>) {
+  constructor(props: DisplayProps<GroupFieldConfig, any>) {
     super(props)
 
     this.state = {
-      didMount: false,
-      formData: []
+      didMount: false
     }
   }
 
@@ -72,105 +74,43 @@ export default class GroupField extends Display<GroupFieldConfig, IGroupField, a
         }
         value = await formField.set(value)
         if (source !== value) {
-          this.props.onValueSet(formFieldConfig.field, value, true)
+          this.props.onValueSet(formFieldConfig.field, value)
         }
 
-        if (value !== undefined) {
-          this.setState(({ formData }) => {
-            formData[formFieldIndex] = { status: 'normal', name: formFieldConfig.label }
-            return { formData: cloneDeep(formData) }
-          })
-        }
         await formField.didMount()
       }
     }
   }
 
-  handleValueSet = async (formFieldIndex: number, path: string, value: any, validation: true | FieldError[]) => {
+  handleValueSet = async (formFieldIndex: number, path: string, value: any, options?: { noPathCombination?: boolean }) => {
     const formFieldConfig = (this.props.config.fields || [])[formFieldIndex]
     if (formFieldConfig) {
-      const fullPath = formFieldConfig.field === '' || path === '' ? `${formFieldConfig.field}${path}` : `${formFieldConfig.field}.${path}`
-      await this.props.onValueSet(fullPath, value, true)
-      const formData = cloneDeep(this.state.formData)
-      if (validation === true) {
-        formData[formFieldIndex] = { status: 'normal' }
-      } else {
-        formData[formFieldIndex] = { status: 'error', message: validation[0].message }
-      }
-
-      this.setState({
-        formData
-      })
+      const fullPath = options && options.noPathCombination ? `${formFieldConfig.field}${path}` : `${formFieldConfig.field}.${path}`
+      await this.props.onValueSet(fullPath, value)
     }
   }
 
-  handleValueUnset = async (formFieldIndex: number, path: string, validation: true | FieldError[]) => {
+  handleValueUnset = async (formFieldIndex: number, path: string, options?: { noPathCombination?: boolean }) => {
     const formFieldConfig = (this.props.config.fields || [])[formFieldIndex]
     if (formFieldConfig) {
-      const fullPath = formFieldConfig.field === '' || path === '' ? `${formFieldConfig.field}${path}` : `${formFieldConfig.field}.${path}`
-      await this.props.onValueUnset(fullPath, true)
-      const formData = cloneDeep(this.state.formData)
-      if (validation === true) {
-        formData[formFieldIndex] = { status: 'normal' }
-      } else {
-        formData[formFieldIndex] = { status: 'error', message: validation[0].message }
-      }
-
-      this.setState({
-        formData
-      })
-    }
-  }
-
-  handleValueListAppend = async (formFieldIndex: number, path: string, value: any, validation: true | FieldError[]) => {
-    const formFieldConfig = (this.props.config.fields || [])[formFieldIndex]
-    if (formFieldConfig) {
-      const fullPath = formFieldConfig.field === '' || path === '' ? `${formFieldConfig.field}${path}` : `${formFieldConfig.field}.${path}`
-      await this.props.onValueListAppend(fullPath, value, true)
-      const formData = cloneDeep(this.state.formData)
-      if (validation === true) {
-        formData[formFieldIndex] = { status: 'normal' }
-      } else {
-        formData[formFieldIndex] = { status: 'error', message: validation[0].message }
-      }
-
-      this.setState({
-        formData
-      })
+      const fullPath = options && options.noPathCombination ? `${formFieldConfig.field}${path}` : `${formFieldConfig.field}.${path}`
+      await this.props.onValueUnset(fullPath)
     }
   }
 
-  handleValueListSplice = async (formFieldIndex: number, path: string, index: number, count: number, validation: true | FieldError[]) => {
+  handleValueListAppend = async (formFieldIndex: number, path: string, value: any, options?: { noPathCombination?: boolean }) => {
     const formFieldConfig = (this.props.config.fields || [])[formFieldIndex]
     if (formFieldConfig) {
-      const fullPath = formFieldConfig.field === '' || path === '' ? `${formFieldConfig.field}${path}` : `${formFieldConfig.field}.${path}`
-      await this.props.onValueListSplice(fullPath, index, count, true)
-      const formData = cloneDeep(this.state.formData)
-      if (validation === true) {
-        formData[formFieldIndex] = { status: 'normal' }
-      } else {
-        formData[formFieldIndex] = { status: 'error', message: validation[0].message }
-      }
-
-      this.setState({
-        formData
-      })
+      const fullPath = options && options.noPathCombination ? `${formFieldConfig.field}${path}` : `${formFieldConfig.field}.${path}`
+      await this.props.onValueListAppend(fullPath, value)
     }
   }
 
-  handleValueListSort = async (formFieldIndex: number, path: string, index: number, sortType: 'up' | 'down', validation: true | FieldError[]) => {
+  handleValueListSplice = async (formFieldIndex: number, path: string, index: number, count: number, options?: { noPathCombination?: boolean }) => {
     const formFieldConfig = (this.props.config.fields || [])[formFieldIndex]
     if (formFieldConfig) {
-      const formData = cloneDeep(this.state.formData)
-      if (validation === true) {
-        formData[formFieldIndex] = { status: 'normal' }
-      } else {
-        formData[formFieldIndex] = { status: 'error', message: validation[0].message }
-      }
-
-      this.setState({
-        formData
-      })
+      const fullPath = options && options.noPathCombination ? `${formFieldConfig.field}${path}` : `${formFieldConfig.field}.${path}`
+      await this.props.onValueListSplice(fullPath, index, count)
     }
   }
 
@@ -195,7 +135,6 @@ export default class GroupField extends Display<GroupFieldConfig, IGroupField, a
     const {
       config,
       value,
-      formLayout,
       record,
       data,
       step
@@ -207,81 +146,65 @@ export default class GroupField extends Display<GroupFieldConfig, IGroupField, a
           columns: config?.columns?.enable ? config.columns : undefined,
           children: this.state.didMount
             ? (this.props.config.fields || []).map((formFieldConfig, formFieldIndex) => {
-                if (!ConditionHelper(formFieldConfig.condition, { record: value, data: this.props.data, step: this.props.step })) {
-                  this.formFieldsMounted[formFieldIndex] = false
-                  return null
-                }
-                let hidden: boolean = true
-                let display: boolean = true
-
-                if (formFieldConfig.type === 'hidden') {
-                  hidden = true
-                  display = false
-                }
-
-                if (formFieldConfig.display === 'none') {
-                  hidden = true
-                  display = false
-                }
-
-                const FormField = this.getALLComponents(formFieldConfig.type) || Display
-
-                let status = (this.state.formData[formFieldIndex] || {}).status || 'normal'
-
-                if (['group', 'import_subform', 'object', 'tabs', 'form'].some((type) => type === formFieldConfig.type)) {
-                  status = 'normal'
-                }
-
-                const renderData = {
-                  key: formFieldIndex,
-                  label: formFieldConfig.label,
-                  columns: config.columns?.enable
-                    ? {
-                        type: formFieldConfig.columns?.type || config.childColumns?.type || 'span',
-                        value: formFieldConfig.columns?.value || config.childColumns?.value || 1,
-                        wrap: formFieldConfig.columns?.wrap || config.childColumns?.wrap || false,
-                        gap: config.columns?.gap || 0,
-                        rowGap: config.columns?.rowGap || 0
+              if (!ConditionHelper(formFieldConfig.condition, { record: value, data: this.props.data, step: this.props.step })) {
+                this.formFieldsMounted[formFieldIndex] = false
+                return null
+              }
+              let hidden: boolean = true
+              let display: boolean = true
+
+              if (formFieldConfig.type === 'hidden') {
+                hidden = true
+                display = false
+              }
+
+              if (formFieldConfig.display === 'none') {
+                hidden = true
+                display = false
+              }
+
+              const FormField = this.getALLComponents(formFieldConfig.type) || Display
+
+              let status: 'normal' = 'normal'
+              const renderData = {
+                key: formFieldIndex,
+                label: formFieldConfig.label,
+                status,
+                layout: 'horizontal' as 'horizontal',
+                extra: StatementHelper(formFieldConfig.extra, { record: this.props.record, data: this.props.data, step: this.props.step }),
+                required: getBoolean(formFieldConfig.required),
+                visitable: display,
+                fieldType: formFieldConfig.type,
+                children: (
+                  <FormField
+                    key={formFieldIndex}
+                    ref={(formField: Display<FieldConfigs, any, any> | null) => {
+                      if (formField) {
+                        this.formFields[formFieldIndex] = formField
+                        this.handleMount(formFieldIndex)
                       }
-                    : undefined,
-                  status,
-                  message: (this.state.formData[formFieldIndex] || {}).message || '',
-                  extra: StatementHelper(formFieldConfig.extra, { record: this.props.record, data: this.props.data, step: this.props.step }),
-                  required: getBoolean(formFieldConfig.required),
-                  layout: formLayout,
-                  visitable: display,
-                  fieldType: formFieldConfig.type,
-                  children: (
-                      <FormField
-                        key={formFieldIndex}
-                        ref={(formField: Display<FieldConfigs, any, any> | null) => {
-                          if (formField) {
-                            this.formFields[formFieldIndex] = formField
-                            this.handleMount(formFieldIndex)
-                          }
-                        }}
-                        formLayout={formLayout}
-                        value={getValue(value, formFieldConfig.field)}
-                        record={record}
-                        data={cloneDeep(data)}
-                        step={step}
-                        config={formFieldConfig}
-                        onValueSet={async (path, value, validation) => this.handleValueSet(formFieldIndex, path, value, validation)}
-                        onValueUnset={async (path, validation) => this.handleValueUnset(formFieldIndex, path, validation)}
-                        onValueListAppend={async (path, value, validation) => this.handleValueListAppend(formFieldIndex, path, value, validation)}
-                        onValueListSplice={async (path, index, count, validation) => this.handleValueListSplice(formFieldIndex, path, index, count, validation)}
-                        baseRoute={this.props.baseRoute}
-                        loadDomain={async (domain: string) => await this.props.loadDomain(domain)}
-                      />
-                  )
-                }
-                // 渲染表单项容器
-                return (
-                  hidden
-                    ? this.renderItemComponent(renderData)
-                    : <React.Fragment key={formFieldIndex} />
+                    }}
+                    value={getValue(value, formFieldConfig.field)}
+                    record={record}
+                    data={cloneDeep(data)}
+                    step={step}
+                    config={formFieldConfig}
+                    onValueSet={async (path, value, options) => this.handleValueSet(formFieldIndex, path, value, options)}
+                    onValueUnset={async (path, options) => this.handleValueUnset(formFieldIndex, path, options)}
+                    onValueListAppend={async (path, value, options) => this.handleValueListAppend(formFieldIndex, path, value, options)}
+                    onValueListSplice={async (path, index, count, options) => this.handleValueListSplice(formFieldIndex, path, index, count, options)}
+                    baseRoute={this.props.baseRoute}
+                    loadDomain={async (domain: string) => await this.props.loadDomain(domain)}
+                  />
                 )
-              })
+              }
+              // 渲染表单项容器
+              return (
+                hidden
+                  ? this.renderItemComponent(renderData)
+                  : <React.Fragment key={formFieldIndex} />
+              )
+            })
             : []
         })}
       </React.Fragment>

src/components/formFields/group/index.tsx

@@ -66,19 +66,25 @@ export default class GroupField extends Field<GroupFieldConfig, IGroupField, any
     const errors: FieldError[] = []
 
     let childrenError = 0
+    const childrenErrorMsg: Array<{name:string, msg:string}> = []
 
     const formData = cloneDeep(this.state.formData)
 
     for (const fieldIndex in (this.props.config.fields || [])) {
       const formItem = this.formFields[fieldIndex]
-      if (formItem !== null && formItem !== undefined) {
+      const formConfig = this.props.config.fields?.[fieldIndex]
+      if (formItem !== null && formItem !== undefined && !formItem.props.config.disabled) {
         const validation = await formItem.validate(getValue(value, (this.props.config.fields || [])[fieldIndex].field))
 
-        if (validation === true || this.formFieldsMounted[fieldIndex] === false) {
+        if (validation === true) {
           formData[fieldIndex] = { status: 'normal' }
         } else {
           childrenError++
           formData[fieldIndex] = { status: 'error', message: validation[0].message }
+          childrenErrorMsg.push({
+            name: formConfig?.label,
+            msg: validation[0].message
+          })
         }
       }
     }
@@ -88,7 +94,8 @@ export default class GroupField extends Field<GroupFieldConfig, IGroupField, any
     })
 
     if (childrenError > 0) {
-      errors.push(new FieldError(`子项中存在${childrenError}个错误。`))
+      const errTips = `${this.props.config.label || ''}子项中存在错误。\n ${childrenErrorMsg.map(err => `${err.name}:${err.msg}`).join('; ')}。`
+      errors.push(new FieldError(errTips))
     }
 
     return errors.length ? errors : true
@@ -104,7 +111,7 @@ export default class GroupField extends Field<GroupFieldConfig, IGroupField, any
           continue
         }
         const formField = this.formFields[formFieldIndex]
-        if (formField) {
+        if (formField && !formFieldConfig.disabled) {
           const value = await formField.get()
           data = setValue(data, formFieldConfig.field, value)
         }
@@ -182,10 +189,10 @@ export default class GroupField extends Field<GroupFieldConfig, IGroupField, any
     // }
   }
 
-  handleValueSet = async (formFieldIndex: number, path: string, value: any, validation: true | FieldError[]) => {
+  handleValueSet = async (formFieldIndex: number, path: string, value: any, validation: true | FieldError[], options?: { noPathCombination?: boolean }) => {
     const formFieldConfig = (this.props.config.fields || [])[formFieldIndex]
     if (formFieldConfig) {
-      const fullPath = formFieldConfig.field === '' || path === '' ? `${formFieldConfig.field}${path}` : `${formFieldConfig.field}.${path}`
+      const fullPath = options && options.noPathCombination ? path : (formFieldConfig.field === '' || path === '' ? `${formFieldConfig.field}${path}` : `${formFieldConfig.field}.${path}`)
       await this.props.onValueSet(fullPath, value, true)
       const formData = cloneDeep(this.state.formData)
       if (validation === true) {
@@ -200,10 +207,10 @@ export default class GroupField extends Field<GroupFieldConfig, IGroupField, any
     }
   }
 
-  handleValueUnset = async (formFieldIndex: number, path: string, validation: true | FieldError[]) => {
+  handleValueUnset = async (formFieldIndex: number, path: string, validation: true | FieldError[], options?: { noPathCombination?: boolean }) => {
     const formFieldConfig = (this.props.config.fields || [])[formFieldIndex]
     if (formFieldConfig) {
-      const fullPath = formFieldConfig.field === '' || path === '' ? `${formFieldConfig.field}${path}` : `${formFieldConfig.field}.${path}`
+      const fullPath = options && options.noPathCombination ? path : (formFieldConfig.field === '' || path === '' ? `${formFieldConfig.field}${path}` : `${formFieldConfig.field}.${path}`)
       await this.props.onValueUnset(fullPath, true)
       const formData = cloneDeep(this.state.formData)
       if (validation === true) {
@@ -218,10 +225,10 @@ export default class GroupField extends Field<GroupFieldConfig, IGroupField, any
     }
   }
 
-  handleValueListAppend = async (formFieldIndex: number, path: string, value: any, validation: true | FieldError[]) => {
+  handleValueListAppend = async (formFieldIndex: number, path: string, value: any, validation: true | FieldError[], options?: { noPathCombination?: boolean }) => {
     const formFieldConfig = (this.props.config.fields || [])[formFieldIndex]
     if (formFieldConfig) {
-      const fullPath = formFieldConfig.field === '' || path === '' ? `${formFieldConfig.field}${path}` : `${formFieldConfig.field}.${path}`
+      const fullPath = options && options.noPathCombination ? path : (formFieldConfig.field === '' || path === '' ? `${formFieldConfig.field}${path}` : `${formFieldConfig.field}.${path}`)
       await this.props.onValueListAppend(fullPath, value, true)
       const formData = cloneDeep(this.state.formData)
       if (validation === true) {
@@ -236,10 +243,10 @@ export default class GroupField extends Field<GroupFieldConfig, IGroupField, any
     }
   }
 
-  handleValueListSplice = async (formFieldIndex: number, path: string, index: number, count: number, validation: true | FieldError[]) => {
+  handleValueListSplice = async (formFieldIndex: number, path: string, index: number, count: number, validation: true | FieldError[], options?: { noPathCombination?: boolean }) => {
     const formFieldConfig = (this.props.config.fields || [])[formFieldIndex]
     if (formFieldConfig) {
-      const fullPath = formFieldConfig.field === '' || path === '' ? `${formFieldConfig.field}${path}` : `${formFieldConfig.field}.${path}`
+      const fullPath = options && options.noPathCombination ? path : (formFieldConfig.field === '' || path === '' ? `${formFieldConfig.field}${path}` : `${formFieldConfig.field}.${path}`)
       await this.props.onValueListSplice(fullPath, index, count, true)
       const formData = cloneDeep(this.state.formData)
       if (validation === true) {
@@ -254,10 +261,10 @@ export default class GroupField extends Field<GroupFieldConfig, IGroupField, any
     }
   }
 
-  handleValueListSort = async (formFieldIndex: number, path: string, index: number, sortType: 'up' | 'down', validation: true | FieldError[]) => {
+  handleValueListSort = async (formFieldIndex: number, path: string, index: number, sortType: 'up' | 'down', validation: true | FieldError[], options?: { noPathCombination?: boolean }) => {
     const formFieldConfig = (this.props.config.fields || [])[formFieldIndex]
     if (formFieldConfig) {
-      const fullPath = formFieldConfig.field === '' || path === '' ? `${formFieldConfig.field}${path}` : `${formFieldConfig.field}.${path}`
+      const fullPath = options && options.noPathCombination ? path : (formFieldConfig.field === '' || path === '' ? `${formFieldConfig.field}${path}` : `${formFieldConfig.field}.${path}`)
       await this.props.onValueListSort(fullPath, index, sortType, true)
       const formData = cloneDeep(this.state.formData)
       if (validation === true) {
@@ -307,6 +314,7 @@ export default class GroupField extends Field<GroupFieldConfig, IGroupField, any
             ? (this.props.config.fields || []).map((formFieldConfig, formFieldIndex) => {
                 if (!ConditionHelper(formFieldConfig.condition, { record: value, data: this.props.data, step: this.props.step })) {
                   this.formFieldsMounted[formFieldIndex] = false
+                  this.formFields && (this.formFields[formFieldIndex] = null)
                   return null
                 }
                 let hidden: boolean = true
@@ -367,11 +375,11 @@ export default class GroupField extends Field<GroupFieldConfig, IGroupField, any
                         step={step}
                         config={formFieldConfig}
                         onChange={async (value: any) => { await this.handleChange(formFieldIndex, value) }}
-                        onValueSet={async (path, value, validation) => this.handleValueSet(formFieldIndex, path, value, validation)}
-                        onValueUnset={async (path, validation) => this.handleValueUnset(formFieldIndex, path, validation)}
-                        onValueListAppend={async (path, value, validation) => this.handleValueListAppend(formFieldIndex, path, value, validation)}
-                        onValueListSplice={async (path, index, count, validation) => this.handleValueListSplice(formFieldIndex, path, index, count, validation)}
-                        onValueListSort={async (path, index, sortType, validation) => this.handleValueListSort(formFieldIndex, path, index, sortType, validation)}
+                        onValueSet={async (path, value, validation, options) => this.handleValueSet(formFieldIndex, path, value, validation, options)}
+                        onValueUnset={async (path, validation, options) => this.handleValueUnset(formFieldIndex, path, validation, options)}
+                        onValueListAppend={async (path, value, validation, options) => this.handleValueListAppend(formFieldIndex, path, value, validation, options)}
+                        onValueListSplice={async (path, index, count, validation, options) => this.handleValueListSplice(formFieldIndex, path, index, count, validation, options)}
+                        onValueListSort={async (path, index, sortType, validation, options) => this.handleValueListSort(formFieldIndex, path, index, sortType, validation, options)}
                         baseRoute={this.props.baseRoute}
                         loadDomain={async (domain: string) => await this.props.loadDomain(domain)}
                       />