aldehyde 0.2.480 → 0.2.482

package/src/aldehyde/controls/entry-control.tsx

@@ -1,418 +1,428 @@
-import React from "react";
-import { FieldConfig, ViewOrEdit } from "../tmpl/interface";
-import { Input, Select as AntdSelect, Radio, Switch } from "antd";
-import ControlTypeSupportor from "../tmpl/control-type-supportor";
-import InputNumber from "./input-number";
-import InputRange from "./input-range";
-import AutoComplete from "./auto-complete";
-import loadable from "@loadable/component";
-import Upload from "../controls/upload";
-import Progress from "./progress";
-import Cascader from "./cascader";
-import EntitySelect from "./entity-select/entity-select";
-import PopoverEntitySelect from "./entity-select/popover-entity-select";
-import LabTreeSelect from "./entity-select/lab-tree-select";
-import Units from "../units";
-import { ProgramConfig, useLocale } from "../index";
-import { LockOutlined } from "@ant-design/icons";
-import DatePicker from "./date-picker";
-import Select from "./select";
-import FieldHistory from "./field-history";
-import TreeEntitySelect from "./tree-select/tree-entity-select";
-import FileView from "./file-view";
-import MultiFileUpload from "./upload/mult-file-upload";
-import NavigationTree from "./tree-select/navigation-tree";
-import EllipsisText from "./text/ellipsis-text";
-import DirectUpload from "./direct-upload";
-import PCIconSelector from "./icon-selector/pc-icon-selector";
-import AppIconSelector from "./icon-selector/app-icon-selector";
-import SingleCheckbox from "./single-checkbox";
-
-// const CheckboxGroup = Checkbox.Group;
-const RadioGroup = Radio.Group;
-// 暂时先这样, 异步组件国际化有问题
-const Loading = <>loading</>;
-const Signature = loadable(() => import("./signature"), { fallback: Loading });
-const ChemStruc = loadable(() => import("./chemstruc/graph"), {
-  fallback: Loading,
-});
-const HtmlEditor = loadable(() => import("./html-editor/draft"), {
-  fallback: Loading,
-});
-const SqlCodeEditor = loadable(() => import("./code-editor/sql-code-editor"), {
-  fallback: Loading,
-});
-const ColorPicker = loadable(() => import("./color-picker"), {
-  fallback: Loading,
-});
-// const DatePicker = loadable(() =>
-//     import("./date-picker"), {fallback: Loading});
-
-const { TextArea } = Input;
-
-interface EntryControlProps {
-  serverKey?: string;
-  mainCode?: string | Promise<string>;
-  value?: any;
-  fieldConfig: FieldConfig;
-  onChange?: any;
-  id?: any;
-  baseCriteria?: object;
-  style?: any;
-  dataCode?: string;
-  width?: any;
-}
-
-function renderControl(
-  id: any,
-  mainCode: string | Promise<string>,
-  fieldConfig: FieldConfig,
-  fieldValue: any,
-  onChange: any,
-  width: any,
-  other
-) {
-  const { translate } = useLocale();
-  let itemType = ControlTypeSupportor.getControlType(fieldConfig, fieldValue);
-
-  let entryControl = undefined;
-
-  let placeholder = !fieldConfig.disabled
-    ? translate("${请输入}${" + (fieldConfig.placeholder || fieldConfig.title) + "}")
-    : translate("${无需输入}");
-  let disabled: boolean = fieldConfig.disabled;
-
-  let viewOrEdit: ViewOrEdit = "edit";
-  let fieldConfigM: string = fieldConfig.min;
-  let min =
-    fieldConfigM || fieldConfigM == "0"
-      ? Units.configParamTrans(fieldConfigM, itemType)
-      : undefined;
-  fieldConfigM = fieldConfig.max;
-  let max =
-    fieldConfigM || fieldConfigM == "0"
-      ? Units.configParamTrans(fieldConfigM, itemType)
-      : undefined;
-
-  let controlProps = {
-    id,
-    mainCode,
-    fieldConfig,
-    min,
-    max,
-    itemType,
-    viewOrEdit,
-    onChange,
-    disabled,
-    value: fieldValue,
-    style: fieldConfig?.style || { minWidth: 220, width: "100%" },
-    ...other,
-  };
-
-  let antdControlProps = {
-    id,
-    placeholder,
-    disabled,
-    value: fieldValue,
-    onChange,
-    style: fieldConfig?.style || { minWidth: 220, width: "100%" },
-    ...other,
-  };
-
-  const unSupportControl = (
-    <Input
-      type="text"
-      placeholder={translate("${暂未实现}-${" + itemType + "}")}
-      disabled={true}
-    />
-  );
-
-  //自定义组件为先
-  if (ProgramConfig.getCustomEditControl(itemType)) {
-    return React.createElement(
-      ProgramConfig.getCustomEditControl(itemType),
-      controlProps
-    );
-  }
-
-  switch (itemType) {
-    case "int":
-    case "decimal":
-    case "float":
-    case "double":
-    case "intrange":
-    case "decimalrange":
-      entryControl = <InputNumber {...controlProps} />;
-      break;
-    case "text":
-    case "QRCode":
-      entryControl = (
-        <Input allowClear={true} type="text" {...antdControlProps} />
-      );
-      break;
-    case "range":
-      entryControl = (
-        <InputRange
-          // style={{width: scalableWidth}}
-          {...controlProps}
-        />
-      );
-      break;
-
-    case "yes-no-select":
-      entryControl = (
-        <AntdSelect
-          {...antdControlProps}
-          notFoundContent={translate("${暂无选项}")}
-          allowClear={true}
-          showSearch
-          optionFilterProp={"label"}
-          options={[
-            { value: '是', label: '是' },
-            { value: '否', label: '否' },
-          ]}
-        ></AntdSelect>
-      );
-      break;
-    case "select":
-    case "multiselect":
-    case "texttags":
-    case "checkbox":
-    case "radio":
-    case "steps":
-      entryControl = (<Select{...controlProps}></Select>);
-      break;
-    case "yes-no-switch":
-      const {
-        value: value1,
-        onChange: onChange1,
-        style: style1,
-        ...other1
-      } = antdControlProps;
-      entryControl = (
-        <Switch
-          style={{ width: "60px" }}
-          checkedChildren={translate("${是}")}
-          unCheckedChildren={translate("${否}")}
-          checked={value1 == "是" ? true : false}
-          onChange={(checked) => {
-            onChange1(checked ? "是" : "否");
-          }}
-          {...other1}
-        />
-      );
-      break;
-    case "yes-no-radio":
-      const { value: value2, ...other2 } = antdControlProps;
-      entryControl = (
-        <RadioGroup
-          value={
-            value2
-              ? value2 == "是" ? "是" : "否" : null
-          }
-          {...other2}
-        >
-          <Radio value={"是"}>{translate("${是}")}</Radio>
-          <Radio value={"否"}>{translate("${否}")}</Radio>
-        </RadioGroup>
-      );
-      break;
-    case "date-YY":
-    case "daterange-YY":
-    case "date-M1":
-    case "daterange-M1":
-    case "date":
-    case "daterange":
-    case "datetime-HH":
-    case "datetimerange-HH":
-    case "datetime-mm":
-    case "datetimerange-mm":
-    case "datetime":
-    case "datetimerange":
-      entryControl = <DatePicker {...controlProps} />;
-      break;
-    case "time-HH":
-    case "timerange-HH":
-    case "time-mm":
-    case "timerange-mm":
-    case "time":
-    case "timerange":
-    case "timerange-HH-unorder":
-    case "timerange-mm-unorder":
-    case "timerange-unorder":
-      entryControl = <DatePicker {...controlProps} />;
-      break;
-    case "textarea":
-    case "url":
-      entryControl = (
-        <TextArea rows={3} allowClear={true} {...antdControlProps} />
-      );
-      break;
-    case "html":
-      entryControl = (
-        <HtmlEditor viewOrEdit={"edit"} {...controlProps}></HtmlEditor>
-      );
-      break;
-    case "password":
-      entryControl = (
-        <Input.Password
-          {...antdControlProps}
-          autoComplete="new-password"
-          prefix={<LockOutlined className="site-form-item-icon" />}
-        />
-      );
-      break;
-    case "preselect":
-      entryControl = <AutoComplete {...controlProps} />;
-      break;
-    case "caselect":
-      entryControl = <Cascader {...controlProps}></Cascader>;
-      break;
-    case "relation":
-      entryControl = unSupportControl;
-      break;
-    case "file":
-    case "video":
-    case "picture":
-    case "non-download-file":
-      entryControl = <Upload {...controlProps} />;
-      break;
-    case "direct-file":
-      entryControl = <DirectUpload {...controlProps} />;
-      break;
-    case "relfile":
-      entryControl = disabled ?
-        <FileView {...controlProps}></FileView> : <MultiFileUpload  {...controlProps} maxCount={fieldConfig.max ? parseInt(fieldConfig.max) : 50} />;
-      break;
-    case "chemstruc":
-      entryControl = (
-        <ChemStruc viewOrEdit={"edit"} {...controlProps}></ChemStruc>
-      );
-      //entryControl =unSupportControl
-      break;
-    case "sql-code-editor":
-      entryControl = (
-        <SqlCodeEditor viewOrEdit={"edit"} {...controlProps}></SqlCodeEditor>
-      );
-      break;
-    case "relselect":
-    case "refselect":
-    case "entity-select":
-    case "relselect-extdis":
-      entryControl = (
-        <EntitySelect
-          //baseCriteria={fieldConfig.baseCriteria}
-          maxSelected={max ? parseInt(max) : undefined}
-          {...controlProps}
-        />
-      );
-      break;
-    case "relselectvalue":
-    case "entity-select-value":
-      entryControl = (
-        <EntitySelect valueOnly={true}
-          //baseCriteria={fieldConfig.baseCriteria}
-          maxSelected={max ? parseInt(max) : undefined}
-          {...controlProps}
-        />
-      );
-      break;
-    case "table-entity-select":
-      entryControl = (
-        <PopoverEntitySelect
-          maxSelected={max ? parseInt(max) : undefined}
-          {...controlProps}
-        />
-      );
-      break;
-    case "lab-tree-select":
-      entryControl = (
-        <LabTreeSelect
-          maxSelected={max ? parseInt(max) : undefined}
-          {...controlProps}
-        />
-      );
-      break;
-    case "tree-entity-select":
-      entryControl = (
-        <TreeEntitySelect
-          //baseCriteria={fieldConfig.baseCriteria}
-          maxSelected={max ? parseInt(max) : undefined}
-          {...controlProps}
-        />
-      );
-      break;
-    case "ltree-entity-select":
-    case "ltree-entity-select-value":
-      // entryControl = (
-      //     <TreeEntitySelect treeOpen={true} multiple={false}
-      //         baseCriteria={fieldConfig.baseCriteria}
-      //         maxSelected={max ? parseInt(max) : undefined}
-      //         {...controlProps}
-      //     />
-      // );
-      entryControl = (
-        <NavigationTree
-          // baseCriteria={fieldConfig.baseCriteria}
-          {...controlProps}
-        />
-      );
-      break;
-    case "tree-entity-select-value":
-      entryControl = (
-        <TreeEntitySelect valueOnly={true}
-          // baseCriteria={fieldConfig.baseCriteria}
-          maxSelected={max ? parseInt(max) : undefined}
-          {...controlProps}
-        />
-      );
-      break;
-    case "progress":
-      entryControl = <Progress {...controlProps}></Progress>;
-      break;
-    case "signature":
-      entryControl = <Signature {...controlProps}></Signature>;
-      break;
-    case "color":
-      entryControl = <ColorPicker {...controlProps}></ColorPicker>;
-      break;
-    case "hidden": //
-      entryControl = <Input type="hidden" value={fieldValue} disabled={true} />;
-      break;
-    case "field-history": //
-      entryControl = <FieldHistory {...controlProps} ></FieldHistory>;
-      break;
-    case "text-view":
-      entryControl = (
-        <EllipsisText
-          isHtml={false}
-          value={fieldValue}
-          showMax={
-            fieldConfig.ellipsisLength ? fieldConfig.ellipsisLength : 28
-          }
-        ></EllipsisText>
-      );
-      break;
-    case "pc-icon-selector":
-      entryControl = <PCIconSelector {...controlProps} />;
-      break;
-    case "app-icon-selector":
-      entryControl = <AppIconSelector {...controlProps} />;
-      break;
-    case "single-checkbox":
-      entryControl = <SingleCheckbox {...controlProps} />;
-      break;
-    default:
-      entryControl = unSupportControl;
-      break;
-  }
-
-  return entryControl;
-}
-
-const EntryControl: React.FC<EntryControlProps> = (props) => {
-  const { fieldConfig, value, onChange, id, mainCode, ...other } = props;
-  return renderControl(id, mainCode, fieldConfig, value, onChange, null, other);
-};
-
-export default EntryControl;
+import React from "react";
+import { FieldConfig, ViewOrEdit, EditStatus } from "../tmpl/interface";
+import { Input, Select as AntdSelect, Radio, Switch } from "antd";
+import ControlTypeSupportor from "../tmpl/control-type-supportor";
+import InputNumber from "./input-number";
+import InputRange from "./input-range";
+import AutoComplete from "./auto-complete";
+import loadable from "@loadable/component";
+import Upload from "../controls/upload";
+import Progress from "./progress";
+import Cascader from "./cascader";
+import EntitySelect from "./entity-select/entity-select";
+import PopoverEntitySelect from "./entity-select/popover-entity-select";
+import LabTreeSelect from "./entity-select/lab-tree-select";
+import Units from "../units";
+import { ProgramConfig, useLocale } from "../index";
+import { LockOutlined } from "@ant-design/icons";
+import DatePicker from "./date-picker";
+import Select from "./select";
+import FieldHistory from "./field-history";
+import TreeEntitySelect from "./tree-select/tree-entity-select";
+import FileView from "./file-view";
+import MultiFileUpload from "./upload/mult-file-upload";
+import NavigationTree from "./tree-select/navigation-tree";
+import EllipsisText from "./text/ellipsis-text";
+import DirectUpload from "./direct-upload";
+import PCIconSelector from "./icon-selector/pc-icon-selector";
+import AppIconSelector from "./icon-selector/app-icon-selector";
+import SingleCheckbox from "./single-checkbox";
+
+// const CheckboxGroup = Checkbox.Group;
+const RadioGroup = Radio.Group;
+// 暂时先这样, 异步组件国际化有问题
+const Loading = <>loading</>;
+const Signature = loadable(() => import("./signature"), { fallback: Loading });
+const ChemStruc = loadable(() => import("./chemstruc/graph"), {
+  fallback: Loading,
+});
+const HtmlEditor = loadable(() => import("./html-editor/draft"), {
+  fallback: Loading,
+});
+const SqlCodeEditor = loadable(() => import("./code-editor/sql-code-editor"), {
+  fallback: Loading,
+});
+const ColorPicker = loadable(() => import("./color-picker"), {
+  fallback: Loading,
+});
+// const DatePicker = loadable(() =>
+//     import("./date-picker"), {fallback: Loading});
+
+const { TextArea } = Input;
+
+interface EntryControlProps {
+  serverKey?: string;
+  mainCode?: string | Promise<string>;
+  value?: any;
+  fieldConfig: FieldConfig;
+  onChange?: any;
+  id?: any;
+  baseCriteria?: object;
+  style?: any;
+  dataCode?: string;
+  width?: any;
+  editStatus?: EditStatus;
+}
+
+function renderControl(
+  id: any,
+  mainCode: string | Promise<string>,
+  fieldConfig: FieldConfig,
+  fieldValue: any,
+  onChange: any,
+  width: any,
+  other
+) {
+  const { translate } = useLocale();
+  const { rowEditType } = fieldConfig;
+  let itemType = ControlTypeSupportor.getControlType(fieldConfig, fieldValue);
+
+  let entryControl = undefined;
+
+  let placeholder = !fieldConfig.disabled
+    ? translate("${请输入}${" + (fieldConfig.placeholder || fieldConfig.title) + "}")
+    : translate("${无需输入}");
+  let disabled: boolean = fieldConfig.disabled;
+  if (rowEditType && !disabled) { // 表单禁用级别处理，读写规则：读禁用，写则判断行编辑类别
+    let isNew: boolean = other.editStatus === "new";
+    if (rowEditType === "editable" || (rowEditType === "editonly" && !isNew) || (rowEditType === "addonly" && isNew)) {
+      disabled = false;
+    } else {
+      disabled = true;
+    }
+  }
+
+  let viewOrEdit: ViewOrEdit = "edit";
+  let fieldConfigM: string = fieldConfig.min;
+  let min =
+    fieldConfigM || fieldConfigM == "0"
+      ? Units.configParamTrans(fieldConfigM, itemType)
+      : undefined;
+  fieldConfigM = fieldConfig.max;
+  let max =
+    fieldConfigM || fieldConfigM == "0"
+      ? Units.configParamTrans(fieldConfigM, itemType)
+      : undefined;
+
+  let controlProps = {
+    id,
+    mainCode,
+    fieldConfig,
+    min,
+    max,
+    itemType,
+    viewOrEdit,
+    onChange,
+    disabled,
+    value: fieldValue,
+    style: fieldConfig?.style || { minWidth: 220, width: "100%" },
+    ...other,
+  };
+
+  let antdControlProps = {
+    id,
+    placeholder,
+    disabled,
+    value: fieldValue,
+    onChange,
+    style: fieldConfig?.style || { minWidth: 220, width: "100%" },
+    ...other,
+  };
+
+  const unSupportControl = (
+    <Input
+      type="text"
+      placeholder={translate("${暂未实现}-${" + itemType + "}")}
+      disabled={true}
+    />
+  );
+
+  //自定义组件为先
+  if (ProgramConfig.getCustomEditControl(itemType)) {
+    return React.createElement(
+      ProgramConfig.getCustomEditControl(itemType),
+      controlProps
+    );
+  }
+
+  switch (itemType) {
+    case "int":
+    case "decimal":
+    case "float":
+    case "double":
+    case "intrange":
+    case "decimalrange":
+      entryControl = <InputNumber {...controlProps} />;
+      break;
+    case "text":
+    case "QRCode":
+      entryControl = (
+        <Input allowClear={true} type="text" {...antdControlProps} />
+      );
+      break;
+    case "range":
+      entryControl = (
+        <InputRange
+          // style={{width: scalableWidth}}
+          {...controlProps}
+        />
+      );
+      break;
+
+    case "yes-no-select":
+      entryControl = (
+        <AntdSelect
+          {...antdControlProps}
+          notFoundContent={translate("${暂无选项}")}
+          allowClear={true}
+          showSearch
+          optionFilterProp={"label"}
+          options={[
+            { value: '是', label: '是' },
+            { value: '否', label: '否' },
+          ]}
+        ></AntdSelect>
+      );
+      break;
+    case "select":
+    case "multiselect":
+    case "texttags":
+    case "checkbox":
+    case "radio":
+    case "steps":
+      entryControl = (<Select{...controlProps}></Select>);
+      break;
+    case "yes-no-switch":
+      const {
+        value: value1,
+        onChange: onChange1,
+        style: style1,
+        ...other1
+      } = antdControlProps;
+      entryControl = (
+        <Switch
+          style={{ width: "60px" }}
+          checkedChildren={translate("${是}")}
+          unCheckedChildren={translate("${否}")}
+          checked={value1 == "是" ? true : false}
+          onChange={(checked) => {
+            onChange1(checked ? "是" : "否");
+          }}
+          {...other1}
+        />
+      );
+      break;
+    case "yes-no-radio":
+      const { value: value2, ...other2 } = antdControlProps;
+      entryControl = (
+        <RadioGroup
+          value={
+            value2
+              ? value2 == "是" ? "是" : "否" : null
+          }
+          {...other2}
+        >
+          <Radio value={"是"}>{translate("${是}")}</Radio>
+          <Radio value={"否"}>{translate("${否}")}</Radio>
+        </RadioGroup>
+      );
+      break;
+    case "date-YY":
+    case "daterange-YY":
+    case "date-M1":
+    case "daterange-M1":
+    case "date":
+    case "daterange":
+    case "datetime-HH":
+    case "datetimerange-HH":
+    case "datetime-mm":
+    case "datetimerange-mm":
+    case "datetime":
+    case "datetimerange":
+      entryControl = <DatePicker {...controlProps} />;
+      break;
+    case "time-HH":
+    case "timerange-HH":
+    case "time-mm":
+    case "timerange-mm":
+    case "time":
+    case "timerange":
+    case "timerange-HH-unorder":
+    case "timerange-mm-unorder":
+    case "timerange-unorder":
+      entryControl = <DatePicker {...controlProps} />;
+      break;
+    case "textarea":
+    case "url":
+      entryControl = (
+        <TextArea rows={3} allowClear={true} {...antdControlProps} />
+      );
+      break;
+    case "html":
+      entryControl = (
+        <HtmlEditor viewOrEdit={"edit"} {...controlProps}></HtmlEditor>
+      );
+      break;
+    case "password":
+      entryControl = (
+        <Input.Password
+          {...antdControlProps}
+          autoComplete="new-password"
+          prefix={<LockOutlined className="site-form-item-icon" />}
+        />
+      );
+      break;
+    case "preselect":
+      entryControl = <AutoComplete {...controlProps} />;
+      break;
+    case "caselect":
+      entryControl = <Cascader {...controlProps}></Cascader>;
+      break;
+    case "relation":
+      entryControl = unSupportControl;
+      break;
+    case "file":
+    case "video":
+    case "picture":
+    case "non-download-file":
+      entryControl = <Upload {...controlProps} />;
+      break;
+    case "direct-file":
+      entryControl = <DirectUpload {...controlProps} />;
+      break;
+    case "relfile":
+      entryControl = disabled ?
+        <FileView {...controlProps}></FileView> : <MultiFileUpload  {...controlProps} maxCount={fieldConfig.max ? parseInt(fieldConfig.max) : 50} />;
+      break;
+    case "chemstruc":
+      entryControl = (
+        <ChemStruc viewOrEdit={"edit"} {...controlProps}></ChemStruc>
+      );
+      //entryControl =unSupportControl
+      break;
+    case "sql-code-editor":
+      entryControl = (
+        <SqlCodeEditor viewOrEdit={"edit"} {...controlProps}></SqlCodeEditor>
+      );
+      break;
+    case "relselect":
+    case "refselect":
+    case "entity-select":
+    case "relselect-extdis":
+      entryControl = (
+        <EntitySelect
+          //baseCriteria={fieldConfig.baseCriteria}
+          maxSelected={max ? parseInt(max) : undefined}
+          {...controlProps}
+        />
+      );
+      break;
+    case "relselectvalue":
+    case "entity-select-value":
+      entryControl = (
+        <EntitySelect valueOnly={true}
+          //baseCriteria={fieldConfig.baseCriteria}
+          maxSelected={max ? parseInt(max) : undefined}
+          {...controlProps}
+        />
+      );
+      break;
+    case "table-entity-select":
+      entryControl = (
+        <PopoverEntitySelect
+          maxSelected={max ? parseInt(max) : undefined}
+          {...controlProps}
+        />
+      );
+      break;
+    case "lab-tree-select":
+      entryControl = (
+        <LabTreeSelect
+          maxSelected={max ? parseInt(max) : undefined}
+          {...controlProps}
+        />
+      );
+      break;
+    case "tree-entity-select":
+      entryControl = (
+        <TreeEntitySelect
+          //baseCriteria={fieldConfig.baseCriteria}
+          maxSelected={max ? parseInt(max) : undefined}
+          {...controlProps}
+        />
+      );
+      break;
+    case "ltree-entity-select":
+    case "ltree-entity-select-value":
+      // entryControl = (
+      //     <TreeEntitySelect treeOpen={true} multiple={false}
+      //         baseCriteria={fieldConfig.baseCriteria}
+      //         maxSelected={max ? parseInt(max) : undefined}
+      //         {...controlProps}
+      //     />
+      // );
+      entryControl = (
+        <NavigationTree
+          // baseCriteria={fieldConfig.baseCriteria}
+          {...controlProps}
+        />
+      );
+      break;
+    case "tree-entity-select-value":
+      entryControl = (
+        <TreeEntitySelect valueOnly={true}
+          // baseCriteria={fieldConfig.baseCriteria}
+          maxSelected={max ? parseInt(max) : undefined}
+          {...controlProps}
+        />
+      );
+      break;
+    case "progress":
+      entryControl = <Progress {...controlProps}></Progress>;
+      break;
+    case "signature":
+      entryControl = <Signature {...controlProps}></Signature>;
+      break;
+    case "color":
+      entryControl = <ColorPicker {...controlProps}></ColorPicker>;
+      break;
+    case "hidden": //
+      entryControl = <Input type="hidden" value={fieldValue} disabled={true} />;
+      break;
+    case "field-history": //
+      entryControl = <FieldHistory {...controlProps} ></FieldHistory>;
+      break;
+    case "text-view":
+      entryControl = (
+        <EllipsisText
+          isHtml={false}
+          value={fieldValue}
+          showMax={
+            fieldConfig.ellipsisLength ? fieldConfig.ellipsisLength : 28
+          }
+        ></EllipsisText>
+      );
+      break;
+    case "pc-icon-selector":
+      entryControl = <PCIconSelector {...controlProps} />;
+      break;
+    case "app-icon-selector":
+      entryControl = <AppIconSelector {...controlProps} />;
+      break;
+    case "single-checkbox":
+      entryControl = <SingleCheckbox {...controlProps} />;
+      break;
+    default:
+      entryControl = unSupportControl;
+      break;
+  }
+
+  return entryControl;
+}
+
+const EntryControl: React.FC<EntryControlProps> = (props) => {
+  const { fieldConfig, value, onChange, id, mainCode, ...other } = props;
+  return renderControl(id, mainCode, fieldConfig, value, onChange, null, other);
+};
+
+export default EntryControl;