diff --git a/.DS_Store b/.DS_Store
new file mode 100644
index 0000000000000000000000000000000000000000..c75e4b861d9b3fdd3258c555752f8daa402c7179
Binary files /dev/null and b/.DS_Store differ
diff --git a/src/components/formFields/form/display.tsx b/src/components/formFields/form/display.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..430759b790898b26fddb9b98ec98f3cb6a85df02
--- /dev/null
+++ b/src/components/formFields/form/display.tsx
@@ -0,0 +1,69 @@
+import React from 'react'
+import { FormDisplay } from 'ccms'
+import { Form, Collapse, Space } from 'antd'
+import { IFormField, IFormFieldItem, IFormFieldItemField } from 'ccms/dist/src/components/formFields/form/display'
+import {display as getALLComponents} from '../'
+
+export default class FormDisplayComponent extends FormDisplay {
+  getALLComponents = (type: any) => getALLComponents[type]
+
+  remove: () => Promise<void> = async () => {}
+
+  renderItemFieldComponent = (props: IFormFieldItemField) => {
+    const {
+      label,
+      children
+    } = props
+    return (
+      <Form.Item
+        label={label}
+      >
+        {children}
+      </Form.Item>
+    )
+  }
+
+  renderItemComponent = (props: IFormFieldItem) => {
+    const {
+      title,
+      index,
+      canCollapse,
+      children
+    } = props
+
+    return (
+      <Collapse.Panel
+        header={<div style={{ display: 'inline-block', width: 'calc(100% - 60px)' }}>{title}</div>}
+        key={index}
+        forceRender={true}
+        showArrow={!!canCollapse}
+      >
+        {children}
+    </Collapse.Panel>
+    )
+  }
+
+  renderComponent = (props: IFormField) => {
+    const {
+      canCollapse,
+      children
+    } = props
+
+    const collapsePaneldDefaultActiveKeys = Array.from(Array(children.length), (v,k) =>k)
+    const CollapseProps = canCollapse? {
+      accordion: true
+    }: {
+      activeKey: collapsePaneldDefaultActiveKeys
+    }
+    return (
+      <React.Fragment>
+        <Space
+          style={{ width: '100%' }}
+          direction="vertical"
+        >
+          <Collapse bordered={false} style={{marginBottom: '24px'}} {...CollapseProps} >{children}</Collapse>
+        </Space>
+      </React.Fragment>
+    )
+  }
+}
diff --git a/src/components/formFields/group/display.tsx b/src/components/formFields/group/display.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..c7b0342b461a4e0eb8c9839bef07568a68c2111f
--- /dev/null
+++ b/src/components/formFields/group/display.tsx
@@ -0,0 +1,45 @@
+import React from "react";
+import { GroupDisplay } from 'ccms';
+import { IGroupField, GroupFieldConfig } from "ccms/dist/src/components/formFields/group";
+import { IFormItem } from "ccms/dist/src/steps/form";
+import { Form } from "antd"
+import {display as getALLComponents} from '../'
+import styles from './index.less'
+
+export const PropsType = (props: GroupFieldConfig) => { };
+
+export default class GroupDisplayComponent extends GroupDisplay {
+  getALLComponents = (type: any) => getALLComponents[type]
+
+  renderComponent = (props: IGroupField) => {
+    const {
+      children
+    } = props
+    return (
+      <div>
+        {children}
+      </div>
+    )
+  }
+
+  renderItemComponent = (props: IFormItem) => {
+    const {
+      key,
+      label,
+      visitable,
+      fieldType,
+      children
+    } = props
+
+    return (
+      <Form.Item
+        key={key}
+        label={label}
+        className={styles[`ccms-antd-mini-form-${fieldType}`]}
+        style={visitable ? {} : { overflow: 'hidden', width: 0, height: 0, margin: 0, padding: 0 }}
+      >
+        {children}
+      </Form.Item>
+    )
+  }
+}
\ No newline at end of file
diff --git a/src/components/formFields/hidden/display.tsx b/src/components/formFields/hidden/display.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..1beed5f384dce98987a09703c69ef2219f0a0e29
--- /dev/null
+++ b/src/components/formFields/hidden/display.tsx
@@ -0,0 +1,4 @@
+import { HiddenDisplay } from 'ccms'
+
+export default class HiddenDisplayComponent extends HiddenDisplay {
+}
diff --git a/src/components/formFields/importSubform/display.tsx b/src/components/formFields/importSubform/display.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..69566acc98e240119f607de9bfd58461253188da
--- /dev/null
+++ b/src/components/formFields/importSubform/display.tsx
@@ -0,0 +1,53 @@
+
+import React from "react";
+import { ImportSubformDisplay } from "ccms";
+import { IImportSubformField } from "ccms/dist/src/components/detail/importSubform";
+import { Display } from "ccms/dist/src/components/formFields/common";
+import { IDetailItem } from "ccms/dist/src/steps/detail";
+import { display as getALLComponents } from '../'
+import InterfaceHelper from "../../../util/interface";
+import { Form } from "antd";
+import styles from './index.less'
+
+export default class ImportSubformDisplayComponent extends ImportSubformDisplay {
+  getALLComponents = (type: any): typeof Display => getALLComponents[type]
+
+  interfaceHelper = new InterfaceHelper()
+
+  renderComponent = (props: IImportSubformField) => {
+    const {
+      children
+    } = props
+    return (
+      <div>
+        {children}
+      </div>
+    )
+  }
+
+  /**
+   * 表单项组件 - UI渲染方法
+   * 各UI库需重写该方法
+   * @param props
+   */
+  renderItemComponent = (props: IDetailItem) => {
+    const {
+      key,
+      label,
+      visitable,
+      fieldType,
+      children
+    } = props
+
+    return (
+      <Form.Item
+        key={key}
+        label={label}
+        className={styles[`ccms-antd-mini-form-${fieldType}`]}
+        style={visitable ? {} : { overflow: 'hidden', width: 0, height: 0 }}
+      >
+        {children}
+      </Form.Item>
+    )
+  }
+}
diff --git a/src/components/formFields/index.tsx b/src/components/formFields/index.tsx
index 5a848cc063c57d6ce99e0531e28c924b01a46a6c..566e8d307c48d816256c0a16eaa3faeb7310cbe1 100644
--- a/src/components/formFields/index.tsx
+++ b/src/components/formFields/index.tsx
@@ -24,16 +24,21 @@ import CodeField from './code'
 import DiffCodeField from './diffCode'
 
 import TextDisplayComponent from './text/display'
+import FormDisplayComponent from './form/display'
 import LongTextDisplayComponent from './longtext/display'
 import RadioDisplayComponent from './radio/display'
 import ColorDisplayComponent from './color/display'
 import NumberDisplayComponent from './number/display'
 import SwitchDisplayComponent from './switch/display'
+import GroupDisplayComponent from './group/display'
 import UploadDisplayComponent from './upload/display'
 import DatetimeDisplayComponent from './datetime/display'
 import DatetimeRangeDisplayComponent from './datetimeRange/display'
 import SelectSingleDisplayComponent from './select/single/display'
 import SelectMultipleDisplayComponent from './select/multiple/display'
+import TabsDisplayComponent from './tabs/display'
+import MultipleTextDisplayComponent from './multipleText/display'
+import ImportSubformDisplayComponent from './importSubform/display'
 
 export default {
   text: TextField,
@@ -64,6 +69,7 @@ export default {
 
 export const display = {
   text: TextDisplayComponent,
+  form: FormDisplayComponent,
   radio: RadioDisplayComponent,
   longtext: LongTextDisplayComponent,
   number: NumberDisplayComponent,
@@ -73,5 +79,9 @@ export const display = {
   select_single: SelectSingleDisplayComponent,
   select_multiple: SelectMultipleDisplayComponent,
   color: ColorDisplayComponent,
-  upload: UploadDisplayComponent
+  upload: UploadDisplayComponent,
+  group: GroupDisplayComponent,
+  tabs: TabsDisplayComponent,
+  multiple_text: MultipleTextDisplayComponent,
+  import_subform: ImportSubformDisplayComponent,
 }
\ No newline at end of file
diff --git a/src/components/formFields/tabs/display.tsx b/src/components/formFields/tabs/display.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..47e7910ebacb5e134e9af82ad0d523acb93151f5
--- /dev/null
+++ b/src/components/formFields/tabs/display.tsx
@@ -0,0 +1,54 @@
+import React from 'react'
+import { TabsDisplay } from 'ccms'
+import { Form, Tabs } from 'antd'
+import { ITabsField, ITabsFieldItem, ITabsFieldItemField } from 'ccms/dist/src/components/formFields/tabs/display'
+import {display as getALLComponents} from '../'
+import { Display } from 'ccms/dist/src/components/formFields/common'
+
+export default class TabsDisplayComponent extends TabsDisplay<{}> {
+    // 各表单项对应的类型所使用的UI组件的类
+    getALLComponents = (type: any): typeof Display => getALLComponents[type]
+  
+    renderItemFieldComponent = (props: ITabsFieldItemField) => {
+      const {
+        label,
+        children
+      } = props
+  
+      return (
+      <Form.Item
+        label={label}
+      >
+        {children}
+      </Form.Item>
+    )
+  }
+
+  renderItemComponent = (props: ITabsFieldItem) => {
+    const {
+      key,
+      label,
+      children
+    } = props
+
+    return (
+      <Tabs.TabPane tab={label} key={key} forceRender={true}>
+        {children}
+      </Tabs.TabPane>
+    )
+  }
+
+  renderComponent = (props: ITabsField) => {
+    const {
+      children
+    } = props
+
+    return (
+      <React.Fragment>
+        <Tabs animated={true} style={{ width: '100%' }}>
+          {children}
+        </Tabs>
+      </React.Fragment>
+    )
+  }
+}