aldehyde 0.2.287 → 0.2.288

package/src/aldehyde/table/relation-table.tsx

@@ -1,31 +1,30 @@
 import React from "react";
 import {
-  Button,
-  Col,
-  Form as AntdForm,
-  message,
-  Popover,
-  Row,
-  Space,
-  Tooltip,
-  Typography, Popconfirm, FormInstance,
+    Button,
+    Col,
+    Form as AntdForm,
+    Popover,
+    Row,
+    Space,
+    Tooltip,
+    Typography, Popconfirm, FormInstance,
 } from "antd";
 import Table from "./control-table-x-axis-wrapper";
 import {
-  AlignLeftOutlined, CheckOutlined, CloseCircleOutlined,
-  DeleteOutlined,
-  EditOutlined,
-  FormOutlined,
-  PlusSquareOutlined,
-  SnippetsOutlined,
+    AlignLeftOutlined, CheckOutlined, CloseCircleOutlined,
+    DeleteOutlined,
+    EditOutlined,
+    FormOutlined,
+    PlusSquareOutlined,
+    SnippetsOutlined,
 } from "@ant-design/icons";
 import "./index.css";
 import {
-  ClassAddConfig,
-  DtmplData,
-  FieldGroupConfig,
-  SelectedRow,
-  ViewOrEdit,
+    ClassAddConfig,
+    DtmplData,
+    FieldGroupConfig,
+    SelectedRow,
+    ViewOrEdit,
 } from "../tmpl/interface";
 import SupportInputTypes from "../tmpl/control-type-supportor";
 import TableUnits from "./table-util";
@@ -38,925 +37,948 @@ import CollapseCard from "../controls/collapse-card";
 import RowEditor from "../detail/edit/row-editor";
 import Action from "../controls/action";
 import CountingTag from "../controls/counting-tag";
-import { LocaleContext } from "../locale/LocaleProvider";
+import {LocaleContext} from "../locale/LocaleProvider";
 import VerticalList from "../list/vertical-list";
 import {EntryControl} from "../index";
 import TmplConfigAnalysis from "../tmpl/tmpl-config-analysis";
 
 
 const FormItem = AntdForm.Item;
-const { Text } = Typography;
+const {Text} = Typography;
 
 interface RelationTableProps {
-  showRightNav?: boolean;
-  mainCode?: string;
-  serverKey?: string;
-  parentId: string;
-  loading: boolean;
-  viewOrEdit: ViewOrEdit;
-  refreshId?: string;
-  fieldGroupConfig: FieldGroupConfig;
-  value: DtmplData[];
-  parentFormInstance?: FormInstance;
-  onChange?: (fieldGroupConfig: FieldGroupConfig, value: DtmplData[]) => void;
-  initCollapse?: boolean;
+    showRightNav?: boolean;
+    mainCode?: string;
+    serverKey?: string;
+    parentId: string;
+    loading: boolean;
+    viewOrEdit: ViewOrEdit;
+    refreshId?: string;
+    fieldGroupConfig: FieldGroupConfig;
+    value: DtmplData[];
+    parentFormInstance?: FormInstance;
+    onChange?: (fieldGroupConfig: FieldGroupConfig, value: DtmplData[]) => void;
+    onEditing?: (editing: boolean) => void;
+    initCollapse?: boolean;
 }
 
 interface RelationTableStat {
-  selectedCode?: string;
-  showDtmplView?: boolean;
-  showDtmplEdit?: boolean;
-  showSelectTable?: boolean;
-  tableLoading?: boolean;
-  showRowEdit?: boolean;
-  selectedDtmplData?: DtmplData;
-  filterStr?: string;
-  pageSize?: number;
-  addTmplId?: string;
-  editings?:string[];
-  uploadingFiles?:object[];
+    selectedCode?: string;
+    showDtmplView?: boolean;
+    showDtmplEdit?: boolean;
+    showSelectTable?: boolean;
+    tableLoading?: boolean;
+    showRowEdit?: boolean;
+    selectedDtmplData?: DtmplData;
+    filterStr?: string;
+    pageSize?: number;
+    addTmplId?: string;
+    editings?: string[];
+    uploadingFiles?: object[];
 }
 
 class RelationTable extends React.PureComponent<
-  RelationTableProps,
-  RelationTableStat
+    RelationTableProps,
+    RelationTableStat
 > {
-  state = {
-    showDtmplView: false,
-    selectedCode: undefined,
-    showSelectTable: false,
-    showDtmplEdit: false,
-    tableLoading: false,
-    showRowEdit: false,
-    selectedDtmplData: undefined,
-    filterStr: undefined,
-    pageSize: 10,
-    addTmplId: undefined,
-    editings:[],
-    uploadingFiles:[],
-  };
-  static contextType = LocaleContext;
-  context: React.ContextType<typeof LocaleContext>;
-  static defaultProps = {};
-  formRef = React.createRef<FormInstance>();
-
-  async componentDidMount() {
-    // const {fieldGroupConfig} = this.props;
-    // if (fieldGroupConfig.displayConfig.includes('folded')) {
-    //     this.setState({
-    //         collapse: true,
-    //     })
-    // }
-  }
-
-  async componentDidUpdate(prevProps) {
-    const { fieldGroupConfig } = this.props;
-    const { fieldGroupConfig: preFieldGroupConfig } = prevProps;
-    if (
-      fieldGroupConfig.disabled != preFieldGroupConfig.disabled ||
-      fieldGroupConfig.mainCode != preFieldGroupConfig.mainCode
-    ) {
-      this.setState({ filterStr: "" });
+    state = {
+        showDtmplView: false,
+        selectedCode: undefined,
+        showSelectTable: false,
+        showDtmplEdit: false,
+        tableLoading: false,
+        showRowEdit: false,
+        selectedDtmplData: undefined,
+        filterStr: undefined,
+        pageSize: 10,
+        addTmplId: undefined,
+        editings: [],
+        uploadingFiles: [],
+    };
+    static contextType = LocaleContext;
+    context: React.ContextType<typeof LocaleContext>;
+    static defaultProps = {};
+    formRef = React.createRef<FormInstance>();
+
+    async componentDidMount() {
+        // const {fieldGroupConfig} = this.props;
+        // if (fieldGroupConfig.displayConfig.includes('folded')) {
+        //     this.setState({
+        //         collapse: true,
+        //     })
+        // }
     }
-  }
-
-  buildDataSource = () => {
-    const { filterStr } = this.state;
-    const { value } = this.props;
-    let dataSource = undefined;
-
-    /** 构建 dataSource **/
-    if (value) {
-      dataSource = [];
-      value.forEach((item, index) => {
-        let flag = true;
-        if (filterStr) {
-          flag = false;
-          for (let value of Object.values(item.fieldMap)) {
-            if (value && value.toString().indexOf(filterStr) >= 0) {
-              flag = true;
-            }
-          }
-        }
-        if (flag) {
-          let row = {
-            key: item.code,
-            relationLabel: item.relationLabel,
-            code: item.code, //增加code,为了删除操作
-            ...item.fieldMap,
-          };
-          dataSource.push(row);
+
+    async componentDidUpdate(prevProps) {
+        const {fieldGroupConfig} = this.props;
+        const {fieldGroupConfig: preFieldGroupConfig} = prevProps;
+        if (
+            fieldGroupConfig.disabled != preFieldGroupConfig.disabled ||
+            fieldGroupConfig.mainCode != preFieldGroupConfig.mainCode
+        ) {
+            this.setState({filterStr: ""});
         }
-      });
     }
 
-    return dataSource;
-  };
-
-  buildColumns = () => {
-    const { viewOrEdit, fieldGroupConfig, serverKey,parentFormInstance } = this.props;
-    const {
-      buttons,
-      fields,
-      showRelationName,
-      relationNames,
-      disabled,
-      deleteData,addOrEditType
-    } = fieldGroupConfig;
-    const { translate } = this.context;
-    const {editings}=this.state;
-    let columns = [];
-    /** 构建column **/
-    let s = 0;
-    fields.forEach((item) => {
-      let column = {};
-      columns.push(column);
-      column["title"] = translate("${" + item.title + "}");
-      column["dataIndex"] = item.id;
-      s++;
-      let itemType = SupportInputTypes.getControlType(item, null);
-      if (s < 12 && item.sortable) {
-        TableUnits.sort(column, itemType);
-      }
-      //配置字段的 默认次过滤条件
-      if(item.relValueField ){
-        if(!item.baseCriteria){
-          item.baseCriteria={}
+    buildDataSource = () => {
+        const {filterStr} = this.state;
+        const {value} = this.props;
+        let dataSource = undefined;
+
+        /** 构建 dataSource **/
+        if (value) {
+            dataSource = [];
+            value.forEach((item, index) => {
+                let flag = true;
+                if (filterStr) {
+                    flag = false;
+                    for (let value of Object.values(item.fieldMap)) {
+                        if (value && value.toString().indexOf(filterStr) >= 0) {
+                            flag = true;
+                        }
+                    }
+                }
+                if (flag) {
+                    let row = {
+                        key: item.code,
+                        relationLabel: item.relationLabel,
+                        code: item.code, //增加code,为了删除操作
+                        ...item.fieldMap,
+                    };
+                    dataSource.push(row);
+                }
+            });
         }
-        item.baseCriteria={...item.baseCriteria,"secondCriteria":parentFormInstance.getFieldValue(item.relValueField.id)};
-        item.configChanged=true;
-      }
-      column["render"] = (text, record) => {
-
-        return (editings.indexOf(record.code)>=0?
-
-            <FormItem style={{margin:0}}
-                      name={record.code+"_"+item.id}
-                      key={record.code+"_"+item.id}
-                      rules={TmplConfigAnalysis.getRules(item,translate)}
-            initialValue={record[item.id]} >
-                <EntryControl
-                  serverKey={serverKey}
-                  //holderType={"table"}
-                  fieldConfig={item}
-                  value={record[item.id]}
-                /></FormItem>:
-            <ViewControl
-                serverKey={serverKey}
-                holderType={"table"}
-                fieldConfig={item}
-                value={record[item.id]}
-            />
-        );
-      };
-    });
-    if (showRelationName) {
-      //判断是否有关系属性
-      let rela = {
-        dataIndex: "relationLabel",
-        name: "relation",
-        title: translate("${关系}"),
-        type: "relation",
-        editable: true,
-        fieldAvailable: true,
-        id: "10000", //关系默认id是'10000'
-        options: relationNames,
-      };
-      columns.unshift(rela);
-    }
 
-    //添加操作列
-
-    const viewable = buttons.includes("detail");
-    const rowEdit = buttons.includes("rowEdit");
-    const dtmplEdit = buttons.includes("dtmplEdit");
-    const deletable = buttons.includes("singleDelete");
-    if (
-      viewOrEdit == "edit" &&
-      (viewable || rowEdit || dtmplEdit || deletable)
-    ) {
-      const actionColumn = {};
-      columns.push(actionColumn);
-      actionColumn["操作"] = 1;
-      actionColumn["title"] = translate("${操作}");
-      actionColumn["fixed"] = "right";
-      actionColumn["key"] = "action";
-      actionColumn["render"] = (record) => {
-        return (
-          <div className="actionbtn">
-            {/*详情*/}
-            {viewable ? (
-              <Button
-                disabled={disabled}
-                title={translate("${当前实体}")}
-                type="primary"
-                icon={<AlignLeftOutlined />}
-                size="small"
-                onClick={() => this.showEntityView(record)}
-              ></Button>
-            ) : (
-              ""
-            )}
-            {/*模板编辑*/}
-            {dtmplEdit ? (
-              <Button
-                disabled={disabled}
-                title={translate("${编辑}${当前实体}")}
-                icon={<FormOutlined />}
-                size="small"
-                onClick={() => this.showEditDtmplModel(record)}
-              ></Button>
-            ) : (
-              ""
-            )}
-            {fieldGroupConfig.rowActions &&
-            fieldGroupConfig.rowActions.length > 0
-              ? fieldGroupConfig.rowActions.map((action) => {
-                  return (
-                    <Action
-                      serverKey={serverKey}
-                      disabled={disabled}
-                      key={action.id}
-                      data={[record]}
-                      actionConfig={action}
-                      doAction={this.doRowAction}
-                      buttonSize={"small"}
-                    ></Action>
-                  );
-                })
-              : ""}
-            {/*行编辑*/}
-            {rowEdit && editings.indexOf(record.code)<0 ? (
-                addOrEditType !== "tableRow" ?
-                <RowEditor
-                serverKey={serverKey}
-                disabled={disabled}
-                buttonIcon={<EditOutlined />}
-                dtmplData={this.getRowEditData(record.code)}
-                fieldGroupConfig={fieldGroupConfig}
-                onOk={this.handleRowEdit}
-                tooltipTitle={translate("${编辑}${当前行}")}
-              ></RowEditor>:<Button icon={<EditOutlined />} size={'small'}
-                                    onClick={()=>this.setState({editings:[...editings,record.code]})} >
-                      </Button>
-            ) : ""
+        return dataSource;
+    };
+
+    buildColumns = () => {
+        const {viewOrEdit, fieldGroupConfig, serverKey, parentFormInstance} = this.props;
+        const {
+            buttons,
+            fields,
+            showRelationName,
+            relationNames,
+            disabled,
+            deleteData, addOrEditType
+        } = fieldGroupConfig;
+        const {translate} = this.context;
+        const {editings} = this.state;
+        let columns = [];
+        /** 构建column **/
+        let s = 0;
+        fields.forEach((item) => {
+            let column = {};
+            columns.push(column);
+            column["title"] = translate("${" + item.title + "}");
+            column["dataIndex"] = item.id;
+            s++;
+            let itemType = SupportInputTypes.getControlType(item, null);
+            if (s < 12 && item.sortable) {
+                TableUnits.sort(column, itemType);
+            }
+            //配置字段的 默认次过滤条件
+            if (item.relValueField) {
+                if (!item.baseCriteria) {
+                    item.baseCriteria = {}
+                }
+                item.baseCriteria = {
+                    ...item.baseCriteria,
+                    "secondCriteria": parentFormInstance.getFieldValue(item.relValueField.id)
+                };
+                item.configChanged = true;
             }
-            {editings.indexOf(record.code)>=0?
-                <><Button onClick={()=>this.saveRowData(record.code)}
-                          icon={<CheckOutlined />} size={'small'}></Button>
-                  <Button onClick={()=>this.cancelRowEdit(record.code)}
-                          icon={<CloseCircleOutlined />} size={'small'}></Button>
-                </>:""}
-            {/*删除*/}
-            {deletable ?
-                deleteData? <Popconfirm
-                    placement="leftBottom"
-                    title={translate("${确定要[删除]选中数据吗}?")}
-                    onConfirm={() => {
-                      this.delete(record);
-                    }}
-                    okText={translate("${确定}")}
-                    cancelText={translate("${取消}")}
-                    okType={"danger"}
-                >  <Button
-                        disabled={disabled}
-                        danger
-                        type="primary"
-                        icon={<DeleteOutlined />}
-                        size="small" ></Button>
-                </Popconfirm> :
-                 <Tooltip placement="right" title={translate("${删除}${当前行}")}>
-                <Button
-                  disabled={disabled}
-                  danger
-                  type="primary"
-                  icon={<DeleteOutlined />}
-                  size="small"
-                  onClick={() => this.delete(record)}></Button></Tooltip>
-
-             : (
-              ""
-            )}
-          </div>
+            column["render"] = (text, record) => {
+
+                return (editings.indexOf(record.code) >= 0 ?
+
+                        <FormItem style={{margin: 0}}
+                                  name={record.code + "_" + item.id}
+                                  key={record.code + "_" + item.id}
+                                  rules={TmplConfigAnalysis.getRules(item, translate)}
+                                  initialValue={record[item.id]}>
+                            <EntryControl
+                                serverKey={serverKey}
+                                //holderType={"table"}
+                                fieldConfig={item}
+                                value={record[item.id]}
+                            /></FormItem> :
+                        <ViewControl
+                            serverKey={serverKey}
+                            holderType={"table"}
+                            fieldConfig={item}
+                            value={record[item.id]}
+                        />
+                );
+            };
+        });
+        if (showRelationName) {
+            //判断是否有关系属性
+            let rela = {
+                dataIndex: "relationLabel",
+                name: "relation",
+                title: translate("${关系}"),
+                type: "relation",
+                editable: true,
+                fieldAvailable: true,
+                id: "10000", //关系默认id是'10000'
+                options: relationNames,
+            };
+            columns.unshift(rela);
+        }
+
+        //添加操作列
+
+        const viewable = buttons.includes("detail");
+        const rowEdit = buttons.includes("rowEdit");
+        const dtmplEdit = buttons.includes("dtmplEdit");
+        const deletable = buttons.includes("singleDelete");
+        if (
+            viewOrEdit == "edit" &&
+            (viewable || rowEdit || dtmplEdit || deletable)
+        ) {
+            const actionColumn = {};
+            columns.push(actionColumn);
+            actionColumn["操作"] = 1;
+            actionColumn["title"] = translate("${操作}");
+            actionColumn["fixed"] = "right";
+            actionColumn["key"] = "action";
+            actionColumn["render"] = (record) => {
+                return (
+                    <div className="actionbtn">
+                        {/*详情*/}
+                        {viewable ? (
+                            <Button
+                                disabled={disabled}
+                                title={translate("${当前实体}")}
+                                type="primary"
+                                icon={<AlignLeftOutlined/>}
+                                size="small"
+                                onClick={() => this.showEntityView(record)}
+                            ></Button>
+                        ) : (
+                            ""
+                        )}
+                        {/*模板编辑*/}
+                        {dtmplEdit ? (
+                            <Button
+                                disabled={disabled}
+                                title={translate("${编辑}${当前实体}")}
+                                icon={<FormOutlined/>}
+                                size="small"
+                                onClick={() => this.showEditDtmplModel(record)}
+                            ></Button>
+                        ) : (
+                            ""
+                        )}
+                        {fieldGroupConfig.rowActions &&
+                        fieldGroupConfig.rowActions.length > 0
+                            ? fieldGroupConfig.rowActions.map((action) => {
+                                return (
+                                    <Action
+                                        serverKey={serverKey}
+                                        disabled={disabled}
+                                        key={action.id}
+                                        data={[record]}
+                                        actionConfig={action}
+                                        doAction={this.doRowAction}
+                                        buttonSize={"small"}
+                                    ></Action>
+                                );
+                            })
+                            : ""}
+                        {/*行编辑*/}
+                        {rowEdit && editings.indexOf(record.code) < 0 ? (
+                            addOrEditType !== "tableRow" ?
+                                <RowEditor
+                                    serverKey={serverKey}
+                                    disabled={disabled}
+                                    buttonIcon={<EditOutlined/>}
+                                    dtmplData={this.getRowEditData(record.code)}
+                                    fieldGroupConfig={fieldGroupConfig}
+                                    onOk={this.handleRowEdit}
+                                    tooltipTitle={translate("${编辑当前行}")}
+                                ></RowEditor> : <Button icon={<EditOutlined/>} size={'small'}
+                                                        onClick={() =>  this.editRowEdit(record.code)}>
+                                </Button>
+                        ) : ""
+                        }
+                        {editings.indexOf(record.code) >= 0 ?
+                            <><Tooltip placement="topRight" title={translate("${确定修改}")}>
+                                <Button  onClick={() => this.saveRowData(record.code)}
+                                         icon={<CheckOutlined/>} size={'small'}></Button></Tooltip>
+                            <Tooltip placement="topRight" title={translate("${取消修改}")}>
+                                <Button onClick={() => this.cancelRowEdit(record.code)}
+                                        icon={<CloseCircleOutlined/>} size={'small'}></Button>
+                                </Tooltip>
+                            </> : ""}
+                        {/*删除*/}
+                        {deletable ?
+                            deleteData ? <Popconfirm
+                                    placement="leftBottom"
+                                    title={translate("${确定要[删除]选中数据吗}?")}
+                                    onConfirm={() => {
+                                        this.delete(record);
+                                    }}
+                                    okText={translate("${确定}")}
+                                    cancelText={translate("${取消}")}
+                                    okType={"danger"}
+                                > <Button
+                                    disabled={disabled}
+                                    danger
+                                    type="primary"
+                                    icon={<DeleteOutlined/>}
+                                    size="small"></Button>
+                                </Popconfirm> :
+                                <Tooltip placement="right" title={translate("${删除}${当前行}")}>
+                                    <Button
+                                        disabled={disabled}
+                                        danger
+                                        type="primary"
+                                        icon={<DeleteOutlined/>}
+                                        size="small"
+                                        onClick={() => this.delete(record)}></Button></Tooltip>
+
+                            : (
+                                ""
+                            )}
+                    </div>
+                );
+            };
+        } else if (viewOrEdit == "view" && viewable) {
+            const actionColumn = {};
+            columns.push(actionColumn);
+            actionColumn["操作"] = 1;
+            actionColumn["title"] = translate("${操作}");
+            actionColumn["fixed"] = "right";
+            actionColumn["key"] = "action";
+            actionColumn["render"] = (record) => {
+                return (
+                    <div className="actionbtn">
+                        {/*详情*/}
+                        {viewable ? (
+                            <Button
+                                disabled={disabled}
+                                title={translate("${当前实体}")}
+                                type="primary"
+                                icon={<AlignLeftOutlined/>}
+                                size="small"
+                                onClick={() => this.showEntityView(record)}
+                            ></Button>
+                        ) : (
+                            ""
+                        )}
+                    </div>
+                );
+            };
+        }
+
+        return columns;
+    };
+
+    doRowAction = async (actionId: string, codes: string[], params: object) => {
+        await this.doAction(
+            actionId,
+            [{title: undefined, code: codes[0]}],
+            params
         );
-      };
-    } else if (viewOrEdit == "view" && viewable) {
-      const actionColumn = {};
-      columns.push(actionColumn);
-      actionColumn["操作"] = 1;
-      actionColumn["title"] = translate("${操作}");
-      actionColumn["fixed"] = "right";
-      actionColumn["key"] = "action";
-      actionColumn["render"] = (record) => {
-        return (
-          <div className="actionbtn">
-            {/*详情*/}
-            {viewable ? (
-              <Button
-                disabled={disabled}
-                title={translate("${当前实体}")}
-                type="primary"
-                icon={<AlignLeftOutlined />}
-                size="small"
-                onClick={() => this.showEntityView(record)}
-              ></Button>
-            ) : (
-              ""
-            )}
-          </div>
+        this.handleDtmplEdit(codes[0]);
+    };
+
+    doAction = async (actionId: string, selectedRows: SelectedRow[], params) => {
+        this.setState({
+            tableLoading: true,
+        });
+        let {serverKey} = this.props;
+        let result: boolean = await HcserviceV3.postActions(
+            serverKey,
+            actionId,
+            selectedRows,
+            params
         );
-      };
-    }
+        {
+            this.setState({
+                tableLoading: false,
+            });
+        }
+    };
 
-    return columns;
-  };
-
-  doRowAction = async (actionId: string, codes: string[], params: object) => {
-    await this.doAction(
-      actionId,
-      [{ title: undefined, code: codes[0] }],
-      params
-    );
-    this.handleDtmplEdit(codes[0]);
-  };
-
-  doAction = async (actionId: string, selectedRows: SelectedRow[], params) => {
-    this.setState({
-      tableLoading: true,
-    });
-    let { serverKey } = this.props;
-    let result: boolean = await HcserviceV3.postActions(
-      serverKey,
-      actionId,
-      selectedRows,
-      params
-    );
-    {
-      this.setState({
-        tableLoading: false,
-      });
-    }
-  };
-
-  showEntityView = (record) => {
-    //console.log('tabel record:', record);
-    this.setState({
-      selectedCode: record.code,
-      showDtmplView: true,
-    });
-  };
-
-  hiddenEntityView = () => {
-    this.setState({
-      showDtmplView: false,
-    });
-  };
-  hiddenEntityEdit = () => {
-    this.setState({
-      showDtmplEdit: false,
-    });
-  };
-
-  editRow = (record) => {};
-  delete =async (record) => {
-    const { value, fieldGroupConfig, onChange,serverKey } = this.props;
-    //追加
-    const selectdDatas:DtmplData[] = [];
-    const selectdCodes:string[] = [];
-    if (value) {
-      for (let v of value) {
-        if (v.code != record.code) {
-          selectdDatas.push(v);
-          selectdCodes.push(v.code);
+    showEntityView = (record) => {
+        //console.log('tabel record:', record);
+        this.setState({
+            selectedCode: record.code,
+            showDtmplView: true,
+        });
+    };
+
+    hiddenEntityView = () => {
+        this.setState({
+            showDtmplView: false,
+        });
+    };
+    hiddenEntityEdit = () => {
+        this.setState({
+            showDtmplEdit: false,
+        });
+    };
+
+    editRow = (record) => {
+    };
+    delete = async (record) => {
+        const {value, fieldGroupConfig, onChange, serverKey} = this.props;
+        //追加
+        const selectdDatas: DtmplData[] = [];
+        const selectdCodes: string[] = [];
+        if (value) {
+            for (let v of value) {
+                if (v.code != record.code) {
+                    selectdDatas.push(v);
+                    selectdCodes.push(v.code);
+                }
+            }
         }
-      }
-    }
-    //直接删除
-    if(fieldGroupConfig.deleteData){
-      let result: boolean = await HcserviceV3.deleteByCode(serverKey, fieldGroupConfig.id, [record.code]);
-    }
-    onChange(fieldGroupConfig, selectdDatas);
-  };
-
-  searchValue = (filterStr: string) => {
-    this.setState({
-      filterStr,
-    });
-  };
-
-  tabChange = (pagination) => {
-    //console.log('pagination',pagination);
-    this.setState({
-      pageSize: pagination.pageSize,
-    });
-  };
-
-  showSelect = () => {
-    //console.log('showSelectTable click');
-    this.setState({
-      showSelectTable: true,
-    });
-  };
-
-  select = async (selectedRows: SelectedRow[]) => {
-    this.setState({
-      showSelectTable: false,
-    });
-    if (!selectedRows || selectedRows.length <= 0) {
-      return;
-    }
+        //直接删除
+        if (fieldGroupConfig.deleteData) {
+            let result: boolean = await HcserviceV3.deleteByCode(serverKey, fieldGroupConfig.id, [record.code]);
+        }
+        onChange(fieldGroupConfig, selectdDatas);
+    };
 
-    //查询
-    const codes: string[] = [];
-    for (let row of selectedRows) {
-      codes.push(row.code);
-    }
-    await this.add(codes);
-  };
-
-  add = async (codes: string[]) => {
-    const { value, fieldGroupConfig, onChange, serverKey } = this.props;
-    const { relationNames } = fieldGroupConfig;
-    this.setState({
-      tableLoading: true,
-    });
-    let selectdDatas: DtmplData[] = await HcserviceV3.requestSelectedData(
-      serverKey,
-      fieldGroupConfig.id,
-      codes
-    );
-
-    //添加默认关系
-    if (selectdDatas) {
-      for (let d of selectdDatas) {
-        d["relationLabel"] = relationNames[0];
-      }
-    }
+    searchValue = (filterStr: string) => {
+        this.setState({
+            filterStr,
+        });
+    };
 
-    //追加
-    if (value) {
-      selectdDatas.unshift(...value);
-    }
+    tabChange = (pagination) => {
+        //console.log('pagination',pagination);
+        this.setState({
+            pageSize: pagination.pageSize,
+        });
+    };
 
-    onChange(fieldGroupConfig, selectdDatas);
-    this.setState({
-      tableLoading: false,
-    });
-  };
-
-  getRowEditData = (code?: string) => {
-    const { value } = this.props;
-    let data = undefined;
-    if (code) {
-      for (let dtmplData of value) {
-        if (code == dtmplData.code) {
-          data = dtmplData;
-          break;
+    showSelect = () => {
+        //console.log('showSelectTable click');
+        this.setState({
+            showSelectTable: true,
+        });
+    };
+
+    select = async (selectedRows: SelectedRow[]) => {
+        this.setState({
+            showSelectTable: false,
+        });
+        if (!selectedRows || selectedRows.length <= 0) {
+            return;
         }
-      }
-    }
-    return data;
-  };
-  handleDtmplAdd = async (code: string) => {
-    this.setState({
-      showDtmplEdit: false,
-    });
-    await this.add([code]);
-  };
-
-  handleDtmplEdit = async (code: string) => {
-    const { value, fieldGroupConfig, onChange } = this.props;
-    const {
-      serverKey,
-    } = fieldGroupConfig;
-    this.setState({
-      tableLoading: true,
-      showDtmplEdit: false,
-    });
-    let data: DtmplData = (
-      await HcserviceV3.requestSelectedData(serverKey, fieldGroupConfig.id, [
-        code,
-      ])
-    )[0];
-    let datas: DtmplData[] = [...value];
-
-    if (datas && data) {
-      for (let v of datas) {
-        if (v.code == data.code) {
-          v.fieldMap = data.fieldMap;
+
+        //查询
+        const codes: string[] = [];
+        for (let row of selectedRows) {
+            codes.push(row.code);
         }
-      }
-    }
-    onChange(fieldGroupConfig, datas);
-    this.setState({
-      tableLoading: false,
-    });
-  };
-
-  handleRowEdit = (dtmplData: DtmplData) => {
-    const { value, fieldGroupConfig, onChange } = this.props;
-    let datas: DtmplData[] = [];
-    if (value) {
-      datas = [...value];
-    }
-    let isAdd = true;
-    for (let v of datas) {
-      if (v.code == dtmplData.code) {
-        isAdd = false;
-        if(dtmplData.editStatus){
-          v.editStatus = dtmplData.editStatus;
+        await this.add(codes);
+    };
+
+    add = async (codes: string[]) => {
+        const {value, fieldGroupConfig, onChange, serverKey} = this.props;
+        const {relationNames} = fieldGroupConfig;
+        this.setState({
+            tableLoading: true,
+        });
+        let selectdDatas: DtmplData[] = await HcserviceV3.requestSelectedData(
+            serverKey,
+            fieldGroupConfig.id,
+            codes
+        );
+
+        //添加默认关系
+        if (selectdDatas) {
+            for (let d of selectdDatas) {
+                d["relationLabel"] = relationNames[0];
+            }
         }
-        v.fieldMap = dtmplData.fieldMap;
-        if(dtmplData.relationLabel){
-          v.relationLabel = dtmplData.relationLabel;
+
+        //追加
+        if (value) {
+            selectdDatas.unshift(...value);
         }
-        break;
-      }
-    }
-    if (isAdd) {
-      datas.unshift(dtmplData);
-    }
-    onChange(fieldGroupConfig, datas);
-
-    // if (isAdd) {
-    //   message.success(translate("${已添加}"));
-    // } else {
-    //   message.success(translate("${已修改}"));
-    // }
-  };
-
-  showAddDtmplModel = (addTmplId?: string) => {
-    this.setState({
-      showDtmplEdit: true,
-      addTmplId,
-      selectedCode: undefined,
-    });
-  };
-  showEditDtmplModel = (record) => {
-    this.setState({
-      showDtmplEdit: true,
-      addTmplId: undefined,
-      selectedCode: record.code,
-    });
-  };
-
-  getAddTmplButton = (classAddConfigs: ClassAddConfig[]) => {
-    const { translate } = this.context;
-
-    if (classAddConfigs && classAddConfigs.length < 1) {
-      return translate("${没有分类添加按钮}");
-    }
-    return classAddConfigs.map((config) => {
-      return (
-        <p>
-          <Button
-            size={"small"}
-            type={"text"}
-            onClick={() => this.showAddDtmplModel(config.id)}
-          >
-            {config.title}
-          </Button>
-        </p>
-      );
-    });
-  };
-
-  addNewRow=(defaultValue)=>{
-    const { value, fieldGroupConfig, onChange } = this.props;
-    const {editings}=this.state;
-    let datas: DtmplData[] = [];
-    if (value) {
-      datas = [...value];
-    }
-    let fieldMaps=[];
-    if(!defaultValue){
-      fieldMaps=[{}]
-    }else if(Array.isArray(defaultValue)){
-      fieldMaps=defaultValue;
-    }else{
-      fieldMaps=[defaultValue]
-    }
 
-    let editingCodes=[...editings];
-    let i=0;
-    for(let f of fieldMaps){
-      let newData: DtmplData = {};
-      newData.code=Date.now()+""+i++;
-      newData.relationLabel=fieldGroupConfig.relationNames[0]
-      newData.fieldMap=f;
-      datas.unshift(newData);
-      editingCodes.push(newData.code);
-    }
+        onChange(fieldGroupConfig, selectdDatas);
+        this.setState({
+            tableLoading: false,
+        });
+    };
 
-    this.setState({editings:editingCodes})
-    onChange(fieldGroupConfig, datas);
-  }
+    getRowEditData = (code?: string) => {
+        const {value} = this.props;
+        let data = undefined;
+        if (code) {
+            for (let dtmplData of value) {
+                if (code == dtmplData.code) {
+                    data = dtmplData;
+                    break;
+                }
+            }
+        }
+        return data;
+    };
+    handleDtmplAdd = async (code: string) => {
+        this.setState({
+            showDtmplEdit: false,
+        });
+        await this.add([code]);
+    };
+
+    handleDtmplEdit = async (code: string) => {
+        const {value, fieldGroupConfig, onChange} = this.props;
+        const {
+            serverKey,
+        } = fieldGroupConfig;
+        this.setState({
+            tableLoading: true,
+            showDtmplEdit: false,
+        });
+        let data: DtmplData = (
+            await HcserviceV3.requestSelectedData(serverKey, fieldGroupConfig.id, [
+                code,
+            ])
+        )[0];
+        let datas: DtmplData[] = [...value];
+
+        if (datas && data) {
+            for (let v of datas) {
+                if (v.code == data.code) {
+                    v.fieldMap = data.fieldMap;
+                }
+            }
+        }
+        onChange(fieldGroupConfig, datas);
+        this.setState({
+            tableLoading: false,
+        });
+    };
+
+    handleRowEdit = (dtmplData: DtmplData) => {
+        const {value, fieldGroupConfig, onChange} = this.props;
+        let datas: DtmplData[] = [];
+        if (value) {
+            datas = [...value];
+        }
+        let isAdd = true;
+        for (let v of datas) {
+            if (v.code == dtmplData.code) {
+                isAdd = false;
+                if (dtmplData.editStatus) {
+                    v.editStatus = dtmplData.editStatus;
+                }
+                v.fieldMap = dtmplData.fieldMap;
+                if (dtmplData.relationLabel) {
+                    v.relationLabel = dtmplData.relationLabel;
+                }
+                break;
+            }
+        }
+        if (isAdd) {
+            datas.unshift(dtmplData);
+        }
+        onChange(fieldGroupConfig, datas);
+    };
+
+    showAddDtmplModel = (addTmplId?: string) => {
+        this.setState({
+            showDtmplEdit: true,
+            addTmplId,
+            selectedCode: undefined,
+        });
+    };
+    showEditDtmplModel = (record) => {
+        this.setState({
+            showDtmplEdit: true,
+            addTmplId: undefined,
+            selectedCode: record.code,
+        });
+    };
+
+    getAddTmplButton = (classAddConfigs: ClassAddConfig[]) => {
+        const {translate} = this.context;
+
+        if (classAddConfigs && classAddConfigs.length < 1) {
+            return translate("${没有分类添加按钮}");
+        }
+        return classAddConfigs.map((config) => {
+            return (
+                <p>
+                    <Button
+                        size={"small"}
+                        type={"text"}
+                        onClick={() => this.showAddDtmplModel(config.id)}
+                    >
+                        {config.title}
+                    </Button>
+                </p>
+            );
+        });
+    };
 
-  saveRowData=async (code:string)=>{
-   let currentForm= this.formRef.current;
-   let dtmplData:DtmplData = {code};
-    dtmplData.fieldMap={};
-    dtmplData.editStatus="changed";
+    addNewRow = (defaultValue) => {
+        const {value, fieldGroupConfig, onChange, onEditing} = this.props;
+        const {editings} = this.state;
+        let datas: DtmplData[] = [];
+        if (value) {
+            datas = [...value];
+        }
+        let fieldMaps = [];
+        if (!defaultValue) {
+            fieldMaps = [{}]
+        } else if (Array.isArray(defaultValue)) {
+            fieldMaps = defaultValue;
+        } else {
+            fieldMaps = [defaultValue]
+        }
 
-    await currentForm.validateFields().then(async (values) => {
-      for (let key in values) {
-        if (values.hasOwnProperty(key) && key.startsWith(code)) {
-          dtmplData.fieldMap[key.split("_")[1]]=values[key];
+        let editingCodes = [...editings];
+        let i = 0;
+        for (let f of fieldMaps) {
+            let newData: DtmplData = {};
+            newData.code = Date.now() + "" + i++;
+            newData.relationLabel = fieldGroupConfig.relationNames[0]
+            newData.fieldMap = f;
+            datas.unshift(newData);
+            editingCodes.push(newData.code);
         }
-      }
-      this.cancelRowEdit(code);
-      this.handleRowEdit(dtmplData);
-    }).catch(errorInfo => {
-    })
-  }
-
-  cancelRowEdit=(code:string)=>{
-    const {editings}=this.state
-   // editings..unshift(code);
-    let arr = editings.filter(item => item !== code);
-    this.setState({editings:[...arr]});
-  }
-
-  uploadFiles=(values)=> {
-
-    const {batchAddFileField} = this.props.fieldGroupConfig
-    if (values) {
-
-      let uploading = false;
-      let vals=JSON.parse(values);
-      for (let value of vals) {
-        if (!value.status ||  value.status != "done") {
-          uploading = true;
+
+        this.setState({editings: editingCodes})
+        onChange(fieldGroupConfig, datas);
+        if (onEditing) {
+            onEditing(editingCodes.length>0);
         }
-      }
-      let datas=[];
-      if (!uploading) {
-        for (let value of vals) {
-          let data = {};
-          data[batchAddFileField.id] =JSON.stringify(value) ;
-          datas.push(data);
+    }
+
+    editRowEdit = (code) => {
+        const {editings}=this.state;
+        const {onEditing} = this.props;
+        let edis=[...editings, code];
+        this.setState({editings:edis });
+        if (onEditing) {
+            onEditing(edis.length>0);
         }
-        this.addNewRow(datas);
-        this.setState({uploadingFiles:[]})
-      }else{
-        this.setState({uploadingFiles:values})
-      }
     }
-  }
-
-  buildButtons = () => {
-    const { fieldGroupConfig, viewOrEdit, value, serverKey } = this.props;
-    const { translate } = this.context;
-    const { buttons, disabled,addOrEditType,batchAddFileField } = fieldGroupConfig;
-    const { showRowEdit,uploadingFiles } = this.state;
-
-    const buttonDisabled: boolean = disabled
-      ? disabled
-      : fieldGroupConfig.max
-      ? fieldGroupConfig.max <= (value ? value.length : 0)
-      : false;
-
-    if (viewOrEdit == "edit") {
-      return (
-        <Row>
-          <Col span={20}>
-            <Space>
-              {buttons.includes("rowAdd") ? (
-                      addOrEditType=="tableRow"?
-                          <>
-                          <Button onClick={()=>this.addNewRow(undefined)}>{translate("${添加一行}")}</Button>
-                            {batchAddFileField? <EntryControl value={uploadingFiles} onChange={this.uploadFiles} fieldConfig={{controlType:"relfile"}}/> :""}
-                          </>:
-                <RowEditor
-                  serverKey={serverKey}
-                  disabled={buttonDisabled}
-                  buttonStyle={{marginBottom:10}}
-                  buttonTitle={translate("${新建一行}")}
-                  fieldGroupConfig={fieldGroupConfig}
-                  onOk={this.handleRowEdit}
-                ></RowEditor>
-              ) : (
-                ""
-              )}
-              {buttons.includes("dtmplAdd") ? (
-                fieldGroupConfig.classAddConfigs &&
-                fieldGroupConfig.classAddConfigs.length > 0 ? (
-                  <Popover
-                    arrow={false}
-                    content={this.getAddTmplButton(
-                      fieldGroupConfig.classAddConfigs
-                    )}
-                    placement="bottomRight"
-                  >
-                    <Tooltip>
-                      <Button icon={<PlusSquareOutlined />}>
-                        {translate("${新增}")}
-                      </Button>
-                    </Tooltip>
-                  </Popover>
-                ) : (
-                  <Button
-                    disabled={buttonDisabled}
-                    icon={<PlusSquareOutlined />}
-                    size="small"
-                    onClick={() => this.showAddDtmplModel()}
-                    style={{ marginBottom: 10 }}
-                  >
-                    {translate("${新增}")}
-                  </Button>
-                )
-              ) : (
-                ""
-              )}
-              {buttons.includes("selectAdd") ? (
-                <Button
-                  disabled={buttonDisabled}
-                  type="primary"
-                  icon={<SnippetsOutlined />}
-                  size="small"
-                  onClick={this.showSelect}
-                  style={{ marginBottom: 10 }}
-                >
-                  {translate("${选择}")}
-                </Button>
-              ) : (
-                ""
-              )}
-              {fieldGroupConfig.min && (!value || value.length <= 0) ? (
-                <Text style={{ color: "red" }}>
-                  {translate("${请选择或添加}")}
-                  {translate("${" + fieldGroupConfig.title + "}")}
-                </Text>
-              ) : null}
-              <FormItem
-                name={"$virtual" + fieldGroupConfig.id}
-                style={{ margin: 0, maxHeight: "32px" }}
-                rules={
-                  fieldGroupConfig.min
-                    ? [
-                        {
-                          required: true,
-                          message: ``,
-                        },
-                      ]
-                    : null
+
+    cancelRowEdit = (code: string) => {
+        const {onEditing} = this.props
+        const {editings} = this.state
+        let arr = editings.filter(item => item !== code);
+        this.setState({editings: [...arr]});
+        if (onEditing) {
+            onEditing(arr.length>0);
+        }
+    }
+
+    saveRowData = async (code: string) => {
+        let currentForm = this.formRef.current;
+        let dtmplData: DtmplData = {code};
+        dtmplData.fieldMap = {};
+        dtmplData.editStatus = "changed";
+
+        await currentForm.validateFields().then(async (values) => {
+            for (let key in values) {
+                if (values.hasOwnProperty(key) && key.startsWith(code)) {
+                    dtmplData.fieldMap[key.split("_")[1]] = values[key];
                 }
-              >
-                <CountingTag
-                  min={fieldGroupConfig.min + ""}
-                  style={{ marginBottom: 10 }}
-                  count={value ? value.length : 0}
-                  value={value}
-                ></CountingTag>
-              </FormItem>
-            </Space>
-          </Col>
-        </Row>
-      );
-    } else {
-      return "";
+            }
+            this.cancelRowEdit(code);
+            this.handleRowEdit(dtmplData);
+        }).catch(errorInfo => {
+        })
     }
-  };
-
-  render() {
-    const {
-      fieldGroupConfig,
-      value,
-      parentId,
-      loading,
-      initCollapse,
-      mainCode,
-      serverKey,
-      showRightNav,parentFormInstance
-    } = this.props;
-    const {
-      pageSize,
-      selectedCode,
-      showDtmplView,
-      showSelectTable,
-      showDtmplEdit,
-      addTmplId,
-      tableLoading,
-    } = this.state;
-    const { translate } = this.context;
-
-    const { buttons,viewModel } = fieldGroupConfig;
-    let mainCode1 = fieldGroupConfig.mainCode
-      ? fieldGroupConfig.mainCode
-      : mainCode
-      ? mainCode
-      : parentId;
-    let page = {
-      pageSize: pageSize,
-      hideOnSinglePage: true,
-      defaultCurrent: 1,
-      total: value ? value.length : undefined,
-      showTotal: (total) => {
-        return translate("${总共}" + total + "${条}");
-      },
-    };
-    let exceptCodes = [];
-    if (value) {
-      for (let v of value) {
-        exceptCodes.push(v.code);
-      }
+
+
+
+    uploadFiles = (values) => {
+
+        const {batchAddFileField} = this.props.fieldGroupConfig
+        if (values) {
+
+            let uploading = false;
+            let vals = JSON.parse(values);
+            for (let value of vals) {
+                if (!value.status || value.status != "done") {
+                    uploading = true;
+                }
+            }
+            let datas = [];
+            if (!uploading) {
+                for (let value of vals) {
+                    let data = {};
+                    data[batchAddFileField.id] = JSON.stringify(value);
+                    datas.push(data);
+                }
+                this.addNewRow(datas);
+                this.setState({uploadingFiles: []})
+            } else {
+                this.setState({uploadingFiles: values})
+            }
+        }
     }
 
-    return fieldGroupConfig.displayConfig.includes("nonDataNonDisplayed") &&
-      (!value || value.length <= 0) ? (
-      ""
-    ) : (
-      <>
-        <CollapseCard
-          showRightNav={showRightNav}
-          initCollapse={
-            initCollapse || fieldGroupConfig.displayConfig.includes("folded")
-          }
-          title={fieldGroupConfig.title}
-          tip={fieldGroupConfig.tip}
-          id={parentId + fieldGroupConfig.id}
-          className={`hoverable`}
-          styles={{header:{ background: "#f2f4f5" },body:{ padding: "6px" }}}
-          loading={loading}
-          //暂时注释掉，后续要支持配置。
-          //extra={<Input.Search onSearch={this.searchValue} allowClear placeholder=""/>}
-        >
-          <div className="editTableList">
-            {this.buildButtons()}
-            { viewModel && viewModel=="verticalList" ?<VerticalList
-                dataSource={this.buildDataSource()}
-                columnConfigs={fieldGroupConfig?.fields}
-                serverKey={serverKey}
-                columns={this.buildColumns()}/>:
-                <AntdForm
-                    ref={this.formRef} component={false}>
-                <Table
-              size={"small"}
-              locale={{
-                emptyText: (
-                  <div style={{ textAlign: "center", width: "100%" }}>
-                    <Text disabled>{translate("${暂无数据}...")}</Text>
-                  </div>
-                ),
-              }}
-              bordered
-              loading={tableLoading}
-              dataSource={this.buildDataSource()}
-              columns={this.buildColumns()}
-              pagination={page}
-              onChange={this.tabChange}
-            /></AntdForm> }
-          </div>
-        </CollapseCard>
-        {buttons.includes("detail") ? (
-          <ModalDtmplView
-            serverKey={serverKey}
-            mainCode={mainCode1}
-            open={showDtmplView}
-            onCancel={this.hiddenEntityView}
-            sourceId={fieldGroupConfig.id}
-            code={selectedCode}
-          >
-            {" "}
-          </ModalDtmplView>
-        ) : (
-          ""
-        )}
-        {buttons.includes("dtmplEdit") || buttons.includes("dtmplAdd") ? (
-          <DtmplEditPage
-            addTmplId={addTmplId}
-            serverKey={serverKey}
-            mainCode={mainCode1}
-            open={showDtmplEdit}
-            onCancel={this.hiddenEntityEdit}
-            sourceId={fieldGroupConfig.id}
-            code={selectedCode}
-            parentFormInstance={parentFormInstance}
-            onOk={selectedCode ? this.handleDtmplEdit : this.handleDtmplAdd}
-          />
-        ) : (
-          ""
-        )}
-        {buttons.includes("selectAdd") ? (
-          <ModelSelectTable
-            serverKey={serverKey}
-            defaultCriteriaValue={fieldGroupConfig.defaultCriteriaValue}
-            maxSelectedRows={fieldGroupConfig.max}
-            open={showSelectTable}
-            onOK={this.select}
-            onCancel={() => {
-              this.setState({ showSelectTable: false });
-            }}
-            exceptCodes={exceptCodes}
-            mainCode={mainCode1}
-            sourceId={fieldGroupConfig.id}
-          ></ModelSelectTable>
+    buildButtons = () => {
+        const {fieldGroupConfig, viewOrEdit, value, serverKey} = this.props;
+        const {translate} = this.context;
+        const {buttons, disabled, addOrEditType, batchAddFileField} = fieldGroupConfig;
+        const {showRowEdit, uploadingFiles} = this.state;
+
+        const buttonDisabled: boolean = disabled
+            ? disabled
+            : fieldGroupConfig.max
+                ? fieldGroupConfig.max <= (value ? value.length : 0)
+                : false;
+
+        if (viewOrEdit == "edit") {
+            return (
+                <Row>
+                    <Col span={20}>
+                        <Space>
+                            {buttons.includes("rowAdd") ? (
+                                addOrEditType == "tableRow" ?
+                                    <>
+                                        <Button
+                                            onClick={() => this.addNewRow(undefined)}>{translate("${添加一行}")}</Button>
+                                        {batchAddFileField ?
+                                            <EntryControl value={uploadingFiles} onChange={this.uploadFiles}
+                                                          fieldConfig={{controlType: "relfile"}}/> : ""}
+                                    </> :
+                                    <RowEditor
+                                        serverKey={serverKey}
+                                        disabled={buttonDisabled}
+                                        buttonStyle={{marginBottom: 10}}
+                                        buttonTitle={translate("${新建一行}")}
+                                        fieldGroupConfig={fieldGroupConfig}
+                                        onOk={this.handleRowEdit}
+                                    ></RowEditor>
+                            ) : (
+                                ""
+                            )}
+                            {buttons.includes("dtmplAdd") ? (
+                                fieldGroupConfig.classAddConfigs &&
+                                fieldGroupConfig.classAddConfigs.length > 0 ? (
+                                    <Popover
+                                        arrow={false}
+                                        content={this.getAddTmplButton(
+                                            fieldGroupConfig.classAddConfigs
+                                        )}
+                                        placement="bottomRight"
+                                    >
+                                        <Tooltip>
+                                            <Button icon={<PlusSquareOutlined/>}>
+                                                {translate("${新增}")}
+                                            </Button>
+                                        </Tooltip>
+                                    </Popover>
+                                ) : (
+                                    <Button
+                                        disabled={buttonDisabled}
+                                        icon={<PlusSquareOutlined/>}
+                                        size="small"
+                                        onClick={() => this.showAddDtmplModel()}
+                                        style={{marginBottom: 10}}
+                                    >
+                                        {translate("${新增}")}
+                                    </Button>
+                                )
+                            ) : (
+                                ""
+                            )}
+                            {buttons.includes("selectAdd") ? (
+                                <Button
+                                    disabled={buttonDisabled}
+                                    type="primary"
+                                    icon={<SnippetsOutlined/>}
+                                    size="small"
+                                    onClick={this.showSelect}
+                                    style={{marginBottom: 10}}
+                                >
+                                    {translate("${选择}")}
+                                </Button>
+                            ) : (
+                                ""
+                            )}
+                            {fieldGroupConfig.min && (!value || value.length <= 0) ? (
+                                <Text style={{color: "red"}}>
+                                    {translate("${请选择或添加}")}
+                                    {translate("${" + fieldGroupConfig.title + "}")}
+                                </Text>
+                            ) : null}
+                            <FormItem
+                                name={"$virtual" + fieldGroupConfig.id}
+                                style={{margin: 0, maxHeight: "32px"}}
+                                rules={
+                                    fieldGroupConfig.min
+                                        ? [
+                                            {
+                                                required: true,
+                                                message: ``,
+                                            },
+                                        ]
+                                        : null
+                                }
+                            >
+                                <CountingTag
+                                    min={fieldGroupConfig.min + ""}
+                                    style={{marginBottom: 10}}
+                                    count={value ? value.length : 0}
+                                    value={value}
+                                ></CountingTag>
+                            </FormItem>
+                        </Space>
+                    </Col>
+                </Row>
+            );
+        } else {
+            return "";
+        }
+    };
+
+    render() {
+        const {
+            fieldGroupConfig,
+            value,
+            parentId,
+            loading,
+            initCollapse,
+            mainCode,
+            serverKey,
+            showRightNav, parentFormInstance
+        } = this.props;
+        const {
+            pageSize,
+            selectedCode,
+            showDtmplView,
+            showSelectTable,
+            showDtmplEdit,
+            addTmplId,
+            tableLoading,
+        } = this.state;
+        const {translate} = this.context;
+
+        const {buttons, viewModel} = fieldGroupConfig;
+        let mainCode1 = fieldGroupConfig.mainCode
+            ? fieldGroupConfig.mainCode
+            : mainCode
+                ? mainCode
+                : parentId;
+        let page = {
+            pageSize: pageSize,
+            hideOnSinglePage: true,
+            defaultCurrent: 1,
+            total: value ? value.length : undefined,
+            showTotal: (total) => {
+                return translate("${总共}" + total + "${条}");
+            },
+        };
+        let exceptCodes = [];
+        if (value) {
+            for (let v of value) {
+                exceptCodes.push(v.code);
+            }
+        }
+
+        return fieldGroupConfig.displayConfig.includes("nonDataNonDisplayed") &&
+        (!value || value.length <= 0) ? (
+            ""
         ) : (
-          ""
-        )}
-      </>
-    );
-  }
+            <>
+                <CollapseCard
+                    showRightNav={showRightNav}
+                    initCollapse={
+                        initCollapse || fieldGroupConfig.displayConfig.includes("folded")
+                    }
+                    title={fieldGroupConfig.title}
+                    tip={fieldGroupConfig.tip}
+                    id={parentId + fieldGroupConfig.id}
+                    className={`hoverable`}
+                    styles={{header: {background: "#f2f4f5"}, body: {padding: "6px"}}}
+                    loading={loading}
+                    //暂时注释掉，后续要支持配置。
+                    //extra={<Input.Search onSearch={this.searchValue} allowClear placeholder=""/>}
+                >
+                    <div className="editTableList">
+                        {this.buildButtons()}
+                        {viewModel && viewModel == "verticalList" ? <VerticalList
+                                dataSource={this.buildDataSource()}
+                                columnConfigs={fieldGroupConfig?.fields}
+                                serverKey={serverKey}
+                                columns={this.buildColumns()}/> :
+                            <AntdForm
+                                ref={this.formRef} component={false}>
+                                <Table
+                                    size={"small"}
+                                    locale={{
+                                        emptyText: (
+                                            <div style={{textAlign: "center", width: "100%"}}>
+                                                <Text disabled>{translate("${暂无数据}...")}</Text>
+                                            </div>
+                                        ),
+                                    }}
+                                    bordered
+                                    loading={tableLoading}
+                                    dataSource={this.buildDataSource()}
+                                    columns={this.buildColumns()}
+                                    pagination={page}
+                                    onChange={this.tabChange}
+                                /></AntdForm>}
+                    </div>
+                </CollapseCard>
+                {buttons.includes("detail") ? (
+                    <ModalDtmplView
+                        serverKey={serverKey}
+                        mainCode={mainCode1}
+                        open={showDtmplView}
+                        onCancel={this.hiddenEntityView}
+                        sourceId={fieldGroupConfig.id}
+                        code={selectedCode}
+                    >
+                        {" "}
+                    </ModalDtmplView>
+                ) : (
+                    ""
+                )}
+                {buttons.includes("dtmplEdit") || buttons.includes("dtmplAdd") ? (
+                    <DtmplEditPage
+                        addTmplId={addTmplId}
+                        serverKey={serverKey}
+                        mainCode={mainCode1}
+                        open={showDtmplEdit}
+                        onCancel={this.hiddenEntityEdit}
+                        sourceId={fieldGroupConfig.id}
+                        code={selectedCode}
+                        parentFormInstance={parentFormInstance}
+                        onOk={selectedCode ? this.handleDtmplEdit : this.handleDtmplAdd}
+                    />
+                ) : (
+                    ""
+                )}
+                {buttons.includes("selectAdd") ? (
+                    <ModelSelectTable
+                        serverKey={serverKey}
+                        defaultCriteriaValue={fieldGroupConfig.defaultCriteriaValue}
+                        maxSelectedRows={fieldGroupConfig.max}
+                        open={showSelectTable}
+                        onOK={this.select}
+                        onCancel={() => {
+                            this.setState({showSelectTable: false});
+                        }}
+                        exceptCodes={exceptCodes}
+                        mainCode={mainCode1}
+                        sourceId={fieldGroupConfig.id}
+                    ></ModelSelectTable>
+                ) : (
+                    ""
+                )}
+            </>
+        );
+    }
 }
 
 export default RelationTable;