@ibiz-template/vue3-components 0.7.41-alpha.7 → 0.7.41-alpha.70

package/lib/control/form/form-detail/form-item/composite-form-item-ex/composite-form-item-ex.controller.cjs

@@ -0,0 +1,189 @@
+'use strict';
+
+var runtime = require('@ibiz-template/runtime');
+var Schema = require('async-validator');
+var compositeFormItemEx_state = require('./composite-form-item-ex.state.cjs');
+
+"use strict";
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+class CompositeFormItemExController extends runtime.FormItemController {
+  constructor() {
+    super(...arguments);
+    /**
+     * @description 默认显示的编辑器类型
+     * @type {string}
+     * @memberof CompositeFormItemExController
+     */
+    __publicField(this, "defaultType", "");
+    /**
+     * @description 组件内部自己绘制切换菜单，而非外部绘制的编辑器类型
+     * @type {string[]}
+     * @memberof CompositeFormItemExController
+     */
+    __publicField(this, "includesList", ["HTMLEDITOR_DEFAULT", "MARKDOWN_DEFAULT"]);
+    /**
+     * @description 代码表id
+     * @type {string}
+     * @memberof CompositeFormItemExController
+     */
+    __publicField(this, "codeListId", "");
+    /**
+     * @description 是否禁止切换菜单选项
+     * @type {boolean}
+     * @memberof CompositeFormItemExController
+     */
+    __publicField(this, "disableSwitch", false);
+    /**
+     * @description 是否隐藏切换菜单
+     * @type {boolean}
+     * @memberof CompositeFormItemExController
+     */
+    __publicField(this, "hiddenSwitch", false);
+    /**
+     * @description 切换菜单选项
+     * @type {{ id: string; name: string; icon?: ISysImage, editor?: IData }[]}
+     * @memberof CompositeFormItemExController
+     */
+    __publicField(this, "switchOptions", []);
+    /**
+     * @description 值项
+     * @type {(IEditorItem | undefined)}
+     * @memberof CompositeFormItemExController
+     */
+    __publicField(this, "valueItem");
+  }
+  createState() {
+    var _a;
+    return new compositeFormItemEx_state.CompositeFormItemExState((_a = this.parent) == null ? void 0 : _a.state);
+  }
+  async onInit() {
+    var _a, _b, _c, _d, _e, _f;
+    await super.onInit();
+    const editor = this.model.editor;
+    if (!editor) {
+      return;
+    }
+    this.codeListId = editor.appCodeListId || "";
+    if ((_a = editor.editorParams) == null ? void 0 : _a.codelistid) {
+      this.codeListId = editor.editorParams.codelistid;
+    }
+    if (this.codeListId) {
+      const app = ibiz.hub.getApp(this.context.srfappid);
+      const items = await app.codeList.get(
+        this.codeListId,
+        this.context,
+        this.params
+      );
+      if (items && items.length) {
+        this.switchOptions = items.map((item) => {
+          return {
+            id: item.value,
+            name: item.text,
+            icon: item.sysImage,
+            editor: item.data
+          };
+        });
+        this.defaultType = ((_b = this.switchOptions[0]) == null ? void 0 : _b.id) || "";
+      }
+    }
+    if ((_c = editor.editorParams) == null ? void 0 : _c.defaulttype) {
+      this.defaultType = editor.editorParams.defaulttype;
+    }
+    if ((_d = editor.editorParams) == null ? void 0 : _d.includes) {
+      this.includesList = JSON.parse(editor.editorParams.includes);
+    }
+    if ((_e = editor.editorParams) == null ? void 0 : _e.disableswitch) {
+      this.disableSwitch = editor.editorParams.disableswitch === "true";
+    }
+    if ((_f = editor.editorParams) == null ? void 0 : _f.hiddenswitch) {
+      this.hiddenSwitch = editor.editorParams.hiddenswitch === "true";
+    }
+    if (editor.editorItems && editor.editorItems.length) {
+      this.valueItem = editor.editorItems[0];
+    }
+    await this.updateEditor(this.defaultType);
+  }
+  /**
+   * @description 更新编辑器模型
+   * @param {string} id
+   * @returns {*}  {Promise<void>}
+   * @memberof CompositeFormItemExController
+   */
+  async updateEditor(id) {
+    if (!id || id === this.state.editorId) {
+      return;
+    }
+    const option = this.switchOptions.find((item) => item.id === id);
+    if (!option) {
+      return;
+    }
+    const editorModel = {
+      ...this.createEditorModel(),
+      ...option.editor
+    };
+    this.editorProvider = await runtime.getEditorProvider(editorModel);
+    if (this.editorProvider) {
+      this.editor = await this.editorProvider.createController(
+        editorModel,
+        this
+      );
+      this.rules = [];
+      const formItemsVRs = runtime.filterValueRules(
+        this.form.model.deformItemVRs || [],
+        this.name
+      );
+      if (formItemsVRs) {
+        this.rules.push(
+          ...runtime.generateRules(formItemsVRs, this.name, this.valueItemName)
+        );
+      }
+      if (editorModel) {
+        this.rules.push(...runtime.generateEditorRules(editorModel));
+      }
+      if (this.rules.length > 0) {
+        this.validator = new Schema({ [this.name]: this.rules });
+      } else {
+        this.validator = void 0;
+      }
+    } else {
+      this.editor = void 0;
+      this.rules = [];
+      this.validator = void 0;
+    }
+    this.state.editorId = id;
+  }
+  /**
+   * @description 处理编辑器切换
+   * @param {string} id
+   * @returns {*}  {Promise<void>}
+   * @memberof CompositeFormItemExController
+   */
+  async handleEditorSwitch(id) {
+    if (this.disableSwitch) {
+      return;
+    }
+    if (!id || id === this.state.editorId) {
+      return;
+    }
+    if (this.value) {
+      const result = await ibiz.confirm.warning({
+        title: ibiz.i18n.t("control.form.compositeFormItemEx.confirmTitle"),
+        desc: ibiz.i18n.t("control.form.compositeFormItemEx.confirmDesc")
+      });
+      if (!result) {
+        return;
+      }
+    }
+    this.setDataValue("", this.name);
+    if (this.valueItem && this.valueItem.id) {
+      this.setDataValue(id, this.valueItem.id);
+    }
+  }
+}
+
+exports.CompositeFormItemExController = CompositeFormItemExController;

package/lib/control/form/form-detail/form-item/composite-form-item-ex/composite-form-item-ex.css

@@ -0,0 +1 @@
+.ibiz-composite-form-item-ex{--ibiz-composite-form-item-ex-menu-top:0;--ibiz-composite-form-item-ex-menu-right:0;--ibiz-composite-form-item-ex-menu-text-color:var(--ibiz-color-text-2);--ibiz-composite-form-item-ex-menu-font-size:var(--ibiz-font-size-regular);--ibiz-composite-form-item-ex-menu-width:120px;--ibiz-composite-form-item-ex-menu-height:var(--ibiz-height-control-default);--ibiz-composite-form-item-ex-menu-icon-gap:var(--ibiz-spacing-extra-tight);--ibiz-composite-form-item-ex-menu-z-index:9;--ibiz-composite-form-item-ex-menu-padding:0 var(--ibiz-spacing-base-tight);--ibiz-composite-form-item-ex-menu-item-padding:var(--ibiz-spacing-extra-tight);--ibiz-composite-form-item-ex-menu-item-hover-bg-color:var(--ibiz-color-fill-0);--ibiz-composite-form-item-ex-menu-bg-color:var(--ibiz-color-bg-3);--ibiz-composite-form-item-ex-menu-text-icon-size:var(--ibiz-font-size-header-6);--ibiz-composite-form-item-ex-menu-content-padding:var(--ibiz-spacing-base-tight);--ibiz-composite-form-item-ex-loading-min-height:calc(var(--el-loading-spinner-size) + var(--ibiz-spacing-tight));position:relative}.ibiz-composite-form-item-ex__editor.is-hidden-switch{--ibiz-composite-form-item-ex-menu-width:0}.ibiz-composite-form-item-ex .ibiz-composite-form-item-ex-menu{position:absolute;top:var(--ibiz-composite-form-item-ex-menu-top);right:var(--ibiz-composite-form-item-ex-menu-right);z-index:var(--ibiz-composite-form-item-ex-menu-z-index);display:flex;align-items:center;width:var(--ibiz-composite-form-item-ex-menu-width);height:var(--ibiz-composite-form-item-ex-menu-height);padding:var(--ibiz-composite-form-item-ex-menu-padding);font-size:var(--ibiz-composite-form-item-ex-menu-font-size);color:var(--ibiz-composite-form-item-ex-menu-text-color);cursor:pointer;background:var(--ibiz-composite-form-item-ex-menu-bg-color)}.ibiz-composite-form-item-ex .ibiz-composite-form-item-ex-menu.is-disabled{cursor:auto}.ibiz-composite-form-item-ex .ibiz-composite-form-item-ex-menu.is-disabled .ibiz-composite-form-item-ex-menu__icon{display:none}.ibiz-composite-form-item-ex-menu__text-icon{display:flex;flex:0 0 auto;align-items:center;justify-content:center;width:1em;height:1em;margin-right:var(--ibiz-composite-form-item-ex-menu-icon-gap);font-size:var(--ibiz-composite-form-item-ex-menu-text-icon-size)}.ibiz-composite-form-item-ex-menu__text-icon .ibiz-icon{display:flex;align-items:center;justify-content:center}.ibiz-composite-form-item-ex-menu__text-icon .ibiz-icon svg{width:1em;height:1em;fill:currentcolor}.ibiz-composite-form-item-ex-menu__text{flex:1 1 0;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ibiz-composite-form-item-ex-menu__icon{display:flex;flex:0 0 auto;align-items:center;justify-content:center;margin-left:var(--ibiz-composite-form-item-ex-menu-icon-gap)}.ibiz-composite-form-item-ex-menu__icon svg{width:1em;height:1em}.ibiz-form-item-container__editor>.el-loading-parent--relative{min-height:var(--ibiz-composite-form-item-ex-loading-min-height)}.ibiz-composite-form-item-ex-menu-popover{--ibiz-composite-form-item-ex-menu-top:0;--ibiz-composite-form-item-ex-menu-right:0;--ibiz-composite-form-item-ex-menu-text-color:var(--ibiz-color-text-2);--ibiz-composite-form-item-ex-menu-font-size:var(--ibiz-font-size-regular);--ibiz-composite-form-item-ex-menu-width:120px;--ibiz-composite-form-item-ex-menu-height:var(--ibiz-height-control-default);--ibiz-composite-form-item-ex-menu-icon-gap:var(--ibiz-spacing-extra-tight);--ibiz-composite-form-item-ex-menu-z-index:9;--ibiz-composite-form-item-ex-menu-padding:0 var(--ibiz-spacing-base-tight);--ibiz-composite-form-item-ex-menu-item-padding:var(--ibiz-spacing-extra-tight);--ibiz-composite-form-item-ex-menu-item-hover-bg-color:var(--ibiz-color-fill-0);--ibiz-composite-form-item-ex-menu-bg-color:var(--ibiz-color-bg-3);--ibiz-composite-form-item-ex-menu-text-icon-size:var(--ibiz-font-size-header-6);--ibiz-composite-form-item-ex-menu-content-padding:var(--ibiz-spacing-base-tight);--ibiz-composite-form-item-ex-loading-min-height:calc(var(--el-loading-spinner-size) + var(--ibiz-spacing-tight))}.ibiz-composite-form-item-ex-menu-popover.el-popover.el-popper{width:var(--ibiz-composite-form-item-ex-menu-width)!important;min-width:var(--ibiz-composite-form-item-ex-menu-width);padding:var(--ibiz-composite-form-item-ex-menu-content-padding)}.ibiz-composite-form-item-ex-menu-content{font-size:var(--ibiz-composite-form-item-ex-menu-font-size);color:var(--ibiz-composite-form-item-ex-menu-text-color)}.ibiz-composite-form-item-ex-menu-item{display:flex;align-items:center;padding:var(--ibiz-composite-form-item-ex-menu-item-padding);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer}.ibiz-composite-form-item-ex-menu-item__icon{flex:0 0 auto;width:1em;height:1em;margin-right:var(--ibiz-composite-form-item-ex-menu-icon-gap);visibility:hidden;fill:currentcolor}.ibiz-composite-form-item-ex-menu-item__text-icon{display:flex;flex:0 0 auto;align-items:center;justify-content:center;width:1em;height:1em;margin-right:var(--ibiz-composite-form-item-ex-menu-icon-gap);font-size:var(--ibiz-composite-form-item-ex-menu-text-icon-size)}.ibiz-composite-form-item-ex-menu-item__text-icon .ibiz-icon{display:flex;align-items:center;justify-content:center}.ibiz-composite-form-item-ex-menu-item__text-icon .ibiz-icon svg{width:1em;height:1em;fill:currentcolor}.ibiz-composite-form-item-ex-menu-item__text{flex:1 1 0;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ibiz-composite-form-item-ex-menu-item.is-active .ibiz-composite-form-item-ex-menu-item__icon{visibility:visible}.ibiz-composite-form-item-ex-menu-item:hover{background-color:var(--ibiz-composite-form-item-ex-menu-item-hover-bg-color)}

package/lib/control/form/form-detail/form-item/composite-form-item-ex/composite-form-item-ex.provider.cjs

@@ -0,0 +1,23 @@
+'use strict';
+
+var compositeFormItemEx_controller = require('./composite-form-item-ex.controller.cjs');
+
+"use strict";
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+class CompositeFormItemExProvider {
+  constructor() {
+    __publicField(this, "component", "IBizCompositeFormItemEx");
+  }
+  async createController(detailModel, form, parent) {
+    const c = new compositeFormItemEx_controller.CompositeFormItemExController(detailModel, form, parent);
+    await c.init();
+    return c;
+  }
+}
+
+exports.CompositeFormItemExProvider = CompositeFormItemExProvider;

package/lib/control/form/form-detail/form-item/composite-form-item-ex/composite-form-item-ex.state.cjs

@@ -0,0 +1,24 @@
+'use strict';
+
+var runtime = require('@ibiz-template/runtime');
+
+"use strict";
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+class CompositeFormItemExState extends runtime.FormItemState {
+  constructor() {
+    super(...arguments);
+    /**
+     * @description 当前选中的编辑器id
+     * @type {string}
+     * @memberof CompositeFormItemExState
+     */
+    __publicField(this, "editorId", "");
+  }
+}
+
+exports.CompositeFormItemExState = CompositeFormItemExState;

package/lib/control/form/form-detail/form-item/composite-form-item-ex/index.cjs

@@ -0,0 +1,20 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var runtime = require('@ibiz-template/runtime');
+var compositeFormItemEx_provider = require('./composite-form-item-ex.provider.cjs');
+var compositeFormItemEx = require('./composite-form-item-ex.cjs');
+
+"use strict";
+var CompositeFormItemEX = {
+  install: (v) => {
+    v.component(compositeFormItemEx.CompositeFormItemEx.name, compositeFormItemEx.CompositeFormItemEx);
+    runtime.registerFormDetailProvider(
+      "FORM_USERCONTROL_COMPOSITE_FORM_ITEM_EX",
+      () => new compositeFormItemEx_provider.CompositeFormItemExProvider()
+    );
+  }
+};
+
+exports.default = CompositeFormItemEX;

package/lib/control/form/form-detail/form-item/form-item-container/form-item-container.cjs

@@ -28,6 +28,12 @@ const IBizFormItemContainer = /* @__PURE__ */ vue.defineComponent({
         c.loadInputTip();
     });
     vue.onUnmounted(() => c.clearTipsCache());
+    const showError = vue.computed(() => {
+      const {
+        validateMode
+      } = c.form;
+      return validateMode === "default";
+    });
     const renderTipContent = () => {
       const {
         inputTip
@@ -50,7 +56,7 @@ const IBizFormItemContainer = /* @__PURE__ */ vue.defineComponent({
           }, null);
       }
     };
-    const renderInputTip = () => {
+    const renderTipsIcon = () => {
       return vue.createVNode(vue.resolveComponent("el-tooltip"), {
         "effect": "light",
         "visible": visible.value,
@@ -60,16 +66,42 @@ const IBizFormItemContainer = /* @__PURE__ */ vue.defineComponent({
         "placement": labelPos === "RIGHT" ? "right" : "left"
       }, {
         default: () => {
-          return vue.createVNode("div", {
-            "class": [ns.em("label", "content"), ns.is("tooltip", enableInputTip)]
-          }, [enableInputTip && ibiz.config.form.showTipsIcon && vue.createVNode("ion-icon", {
+          return vue.createVNode("ion-icon", {
             "name": "bulb-outline",
             "class": ns.em("label", "icon")
-          }, null), sysImage && vue.createVNode(vue3Util.IBizIcon, {
+          }, null);
+        },
+        content: () => {
+          return vue.createVNode("div", {
+            "class": ns.em("popper", "content")
+          }, [vue.createVNode("div", {
+            "class": ns.em("popper", "tooltip")
+          }, [renderTipContent()]), c.state.inputTipUrl && vue.createVNode("a", {
+            "target": "_blank",
+            "href": c.state.inputTipUrl,
+            "title": ibiz.i18n.t("component.formItemContainer.more")
+          }, [ibiz.i18n.t("component.formItemContainer.more")])]);
+        }
+      });
+    };
+    const renderLabelWithoutTips = () => {
+      return vue.createVNode(vue.resolveComponent("el-tooltip"), {
+        "effect": "light",
+        "visible": visible.value,
+        "onUpdate:visible": ($event) => visible.value = $event,
+        "popper-class": [ns.e("popper"), ns.is(ibiz.config.tooltiprendermode.toLowerCase(), true)],
+        "disabled": !enableInputTip,
+        "placement": labelPos === "RIGHT" ? "right" : "left"
+      }, {
+        default: () => {
+          return vue.createVNode("div", {
+            "class": [ns.em("label", "content"), ns.is("tooltip", enableInputTip)]
+          }, [sysImage && vue.createVNode(vue3Util.IBizIcon, {
             "class": ns.em("label", "icon"),
             "icon": sysImage
           }, null), vue.createVNode("div", {
-            "class": ns.em("label", "text")
+            "class": ns.em("label", "text"),
+            "title": enableInputTip ? void 0 : core.showTitle(c.labelCaption)
           }, [c.labelCaption])]);
         },
         content: () => {
@@ -86,13 +118,23 @@ const IBizFormItemContainer = /* @__PURE__ */ vue.defineComponent({
       });
     };
     const renderLabel = () => {
+      const form = props.controller.form;
+      const showTipsIcon = enableInputTip && form.showTipsIcon;
       return vue.createVNode("div", {
-        "title": enableInputTip ? void 0 : core.showTitle(c.labelCaption),
         "class": [ns.e("label"), ...c.labelClass || []]
-      }, [renderInputTip()]);
+      }, [showTipsIcon && vue.createVNode("div", {
+        "class": [ns.em("label", "content"), ns.is("tooltip", enableInputTip)]
+      }, [renderTipsIcon(), sysImage && vue.createVNode(vue3Util.IBizIcon, {
+        "class": ns.em("label", "icon"),
+        "icon": sysImage
+      }, null), vue.createVNode("div", {
+        "class": ns.em("label", "text"),
+        "title": core.showTitle(c.labelCaption)
+      }, [c.labelCaption])]), !showTipsIcon && renderLabelWithoutTips()]);
     };
     return {
       ns,
+      showError,
       renderLabel
     };
   },
@@ -106,7 +148,7 @@ const IBizFormItemContainer = /* @__PURE__ */ vue.defineComponent({
       "class": [this.ns.e("content"), this.ns.em("content", "label-".concat(labelPos == null ? void 0 : labelPos.toLowerCase()))]
     }, [vue.createVNode("div", {
       "class": [this.ns.e("editor")]
-    }, [(_b = (_a = this.$slots).default) == null ? void 0 : _b.call(_a)]), this.controller.state.error ? vue.createVNode("div", {
+    }, [(_b = (_a = this.$slots).default) == null ? void 0 : _b.call(_a)]), this.showError && this.controller.state.error ? vue.createVNode("div", {
       "title": core.showTitle(this.controller.state.error),
       "class": [this.ns.e("error")]
     }, [this.controller.state.error]) : null]);

package/lib/control/form/form-detail/form-item/form-item.cjs

@@ -28,53 +28,45 @@ const FormItem = /* @__PURE__ */ vue.defineComponent({
     }
   },
   setup(props) {
-    var _a, _b, _c, _d;
     const ns = vue3Util.useNamespace("form-item");
     const c = props.controller;
     const onValueChange = (val, name, ignore = false) => {
       props.controller.setDataValue(val, name, ignore);
     };
-    const extraParams = vue.ref({});
-    let emptyHiddenUnit = ibiz.config.form.emptyHiddenUnit;
-    const emptyhiddenunit = (_b = (_a = props.controller.form) == null ? void 0 : _a.controlParams) == null ? void 0 : _b.emptyhiddenunit;
-    if (emptyhiddenunit) {
-      emptyHiddenUnit = Object.is(emptyhiddenunit, "true");
-    }
-    const editorParams = ((_d = (_c = props.controller.editor) == null ? void 0 : _c.model) == null ? void 0 : _d.editorParams) || {};
-    const {
-      EMPTYHIDDENUNIT
-    } = editorParams;
-    if (EMPTYHIDDENUNIT) {
-      emptyHiddenUnit = Object.is(EMPTYHIDDENUNIT, "true");
-    }
-    Object.assign(extraParams.value, {
-      emptyHiddenUnit
+    const CustomHtml = vue3Util.computedAsync(async () => {
+      const html = await props.controller.getCustomHtml(props.controller.data);
+      return html;
     });
     return {
       ns,
       c,
-      extraParams,
+      CustomHtml,
       onValueChange
     };
   },
   render() {
     var _a, _b, _c, _d, _e;
-    if (!this.c.state.visible || ((_a = this.c.model.editor) == null ? void 0 : _a.editorType) === "HIDDEN") {
+    if (!this.c.state.visible || ((_a = this.c.model.editor) == null ? void 0 : _a.editorType) === "HIDDEN")
       return null;
-    }
     let editor = null;
     const compositeItem = this.c.model.compositeItem;
     if (compositeItem) {
       const {
         editorItems = []
       } = this.c.model.editor || {};
-      editor = editorItems.map((item) => {
+      editor = editorItems.map((item, index) => {
         const controller = this.c.form.details[item.id];
-        return vue.createVNode(compositeFormItem.CompositeFormItem, {
-          "modelData": controller.model,
-          "controller": controller,
-          "attrs": this.attrs
-        }, null);
+        return [
+          vue.createVNode(compositeFormItem.CompositeFormItem, {
+            "modelData": controller.model,
+            "controller": controller,
+            "attrs": this.attrs
+          }, null),
+          // feat：复合表单项样式2会在编辑器之间加`-`分隔符
+          editorItems.length - 1 > index && this.c.model.detailStyle === "STYLE2" && vue.createVNode("span", {
+            "class": this.ns.e("composite-separator")
+          }, [vue.createTextVNode("-")])
+        ];
       });
     } else {
       const editMode = (_d = (_c = (_b = this.c.editor) == null ? void 0 : _b.model) == null ? void 0 : _c.editorParams) == null ? void 0 : _d.editMode;
@@ -86,7 +78,6 @@ const FormItem = /* @__PURE__ */ vue.defineComponent({
         disabled: this.c.state.disabled,
         readonly: this.c.state.readonly,
         onChange: this.onValueChange,
-        extraParams: this.extraParams,
         controlParams: editMode ? {
           ...this.c.form.controlParams,
           editmode: editMode
@@ -111,6 +102,11 @@ const FormItem = /* @__PURE__ */ vue.defineComponent({
         }, null);
       }
     }
+    if (this.c.isCustomCode)
+      return vue.createVNode("div", {
+        "class": [this.ns.b(), this.ns.e("script"), this.ns.m(this.modelData.id), this.ns.is("compositeItem", compositeItem), ...this.c.containerClass],
+        "innerHTML": this.CustomHtml
+      }, null);
     return vue.createVNode(vue.resolveComponent("iBizFormItemContainer"), {
       "id": "".concat(this.c.form.view.model.codeName, "_").concat(this.c.form.model.codeName, "_").concat(this.modelData.codeName),
       "class": [this.ns.b(), this.ns.m(this.modelData.id), this.ns.is("compositeItem", compositeItem), ...this.c.containerClass],

package/lib/control/form/form-detail/form-item/form-item.css

@@ -1 +1 @@
-.ibiz-form-item{border-color:var(--ibiz-color-border);--ibiz-form-item-label-color:var(--ibiz-color-text-1);--ibiz-form-item-text-color:var(--ibiz-color-text-2);--ibiz-form-item-hover-color:var(--ibiz-color-text-0);--ibiz-form-item-hover-bg-color:var(--ibiz-color-fill-1);--ibiz-form-item-readonly-color:var(--ibiz-color-disabled-text);--ibiz-form-item-border-color:transparent;--ibiz-form-item-font-size:var(--ibiz-font-size-regular);--ibiz-form-item-placeholder-color:var(--ibiz-color-text-3);--ibiz-form-item-disabled-color:var(--ibiz-color-disabled-text);--ibiz-form-item-disabled-bg-color:var(--ibiz-color-disabled-fill);--ibiz-form-item-disabled-border-color:var(--ibiz-color-disabled-border);--ibiz-form-item-active-bg:var(--ibiz-color-fill-2);--ibiz-form-item-active-border:var(--ibiz-active-bg);--ibiz-form-item-focus-bg:var(--ibiz-color-fill-0);--ibiz-form-item-focus-border:var(--ibiz-color-focus-border);--ibiz-form-item-line-height:var(--ibiz-editor-default-line-height);--ibiz-form-item-font-weight:var(--ibiz-font-weight-regular);--ibiz-form-item-hover-edit-padding:var(--ibiz-spacing-none) 11px}.ibiz-form-item.is-compositeItem{--ibiz-form-item-compositeItem-gap:var(--ibiz-spacing-tight)}.ibiz-form-item.is-compositeItem .ibiz-form-item-container__editor{display:flex;gap:var(--ibiz-form-item-compositeItem-gap)}
+.ibiz-form-item{border-color:var(--ibiz-color-border);--ibiz-form-item-label-color:var(--ibiz-color-text-1);--ibiz-form-item-text-color:var(--ibiz-color-text-2);--ibiz-form-item-hover-color:var(--ibiz-color-text-0);--ibiz-form-item-hover-bg-color:var(--ibiz-color-fill-1);--ibiz-form-item-readonly-color:var(--ibiz-color-disabled-text);--ibiz-form-item-border-color:transparent;--ibiz-form-item-font-size:var(--ibiz-font-size-regular);--ibiz-form-item-placeholder-color:var(--ibiz-color-text-3);--ibiz-form-item-disabled-color:var(--ibiz-color-disabled-text);--ibiz-form-item-disabled-bg-color:var(--ibiz-color-disabled-fill);--ibiz-form-item-disabled-border-color:var(--ibiz-color-disabled-border);--ibiz-form-item-active-bg:var(--ibiz-color-fill-2);--ibiz-form-item-active-border:var(--ibiz-active-bg);--ibiz-form-item-focus-bg:var(--ibiz-color-fill-0);--ibiz-form-item-focus-border:var(--ibiz-color-focus-border);--ibiz-form-item-line-height:var(--ibiz-editor-default-line-height);--ibiz-form-item-font-weight:var(--ibiz-font-weight-regular);--ibiz-form-item-hover-edit-padding:var(--ibiz-spacing-none) 11px}.ibiz-form-item.is-compositeItem{--ibiz-form-item-compositeItem-gap:var(--ibiz-spacing-tight)}.ibiz-form-item.is-compositeItem .ibiz-form-item__composite-separator{line-height:var(--ibiz-form-item-container-line-height)}.ibiz-form-item.is-compositeItem .ibiz-form-item-container__editor{display:flex;gap:var(--ibiz-form-item-compositeItem-gap)}

package/lib/control/form/form-detail/form-item/index.cjs

@@ -7,12 +7,14 @@ var vue3Util = require('@ibiz-template/vue3-util');
 var formItem = require('./form-item.cjs');
 var formItemContainer = require('./form-item-container/form-item-container.cjs');
 var formItem_provider = require('./form-item.provider.cjs');
+var index = require('./composite-form-item-ex/index.cjs');
 
 "use strict";
 const IBizFormItem = vue3Util.withInstall(formItem.FormItem, function(v) {
   v.component(formItem.FormItem.name, formItem.FormItem);
   v.component(formItemContainer.IBizFormItemContainer.name, formItemContainer.IBizFormItemContainer);
   runtime.registerFormDetailProvider("FORMITEM", () => new formItem_provider.FormItemProvider());
+  v.use(index.default);
 });
 
 exports.IBizFormItemContainer = formItemContainer.IBizFormItemContainer;

package/lib/control/form/form-detail/form-mdctrl/form-mdctrl-form/form-mdctrl-form.cjs

@@ -81,7 +81,8 @@ const FormMDCtrlForm = /* @__PURE__ */ vue.defineComponent({
       "onRemoveClick": (item) => this.controller.remove(item.id)
     }, {
       item: ({
-        data
+        data,
+        index
       }) => {
         if (!formProvider) {
           return vue.createVNode("div", null, [ibiz.i18n.t("control.form.formMDctrlForm.noFindProvider")]);
@@ -90,6 +91,7 @@ const FormMDCtrlForm = /* @__PURE__ */ vue.defineComponent({
           class: this.ns.be("item", "form"),
           key: data.id,
           modelData: model.contentControl,
+          mdCtrlFormIndex: index,
           context: data.context,
           params: data.params,
           onCreated: (event) => {

package/lib/control/form/form-detail/form-mdctrl/form-mdctrl-md/form-mdctrl-md.cjs

@@ -4,6 +4,7 @@ var vue = require('vue');
 var runtime = require('@ibiz-template/runtime');
 var vue3Util = require('@ibiz-template/vue3-util');
 require('./form-mdctrl-md.css');
+var core = require('@ibiz-template/core');
 
 "use strict";
 function _isSlot(s) {
@@ -29,16 +30,52 @@ const FormMDCtrlMD = /* @__PURE__ */ vue.defineComponent({
     const onSelectionChange = (event) => {
       isSelected.value = event.data.length > 0;
     };
+    const handleRemove = () => {
+      isSelected.value = false;
+      props.controller.remove();
+    };
+    const renderRemoveBtn = () => {
+      let _slot2;
+      if (!props.controller.enableDelete)
+        return null;
+      if (ibiz.config.form.mdCtrlConfirmBeforeRemove) {
+        return vue.createVNode(vue.resolveComponent("el-popconfirm"), {
+          "title": core.showTitle(ibiz.i18n.t("control.form.mdCtrlContainer.promptInformation")),
+          "confirm-button-text": ibiz.i18n.t("app.confirm"),
+          "cancel-button-text": ibiz.i18n.t("app.cancel"),
+          "onConfirm": () => handleRemove()
+        }, {
+          reference: () => {
+            let _slot;
+            return vue.createVNode(vue.resolveComponent("el-button"), {
+              "type": "danger",
+              "disabled": !isSelected.value,
+              "class": [ns.be("actions", "remove"), ns.be("actions", "btn")]
+            }, _isSlot(_slot = ibiz.i18n.t("app.delete")) ? _slot : {
+              default: () => [_slot]
+            });
+          }
+        });
+      }
+      return vue.createVNode(vue.resolveComponent("el-button"), {
+        "type": "danger",
+        "disabled": !isSelected.value,
+        "class": [ns.be("actions", "remove"), ns.be("actions", "btn")],
+        "onClick": () => handleRemove()
+      }, _isSlot(_slot2 = ibiz.i18n.t("app.delete")) ? _slot2 : {
+        default: () => [_slot2]
+      });
+    };
     return {
       ns,
       showActions,
-      isSelected,
       onCreated,
-      onSelectionChange
+      onSelectionChange,
+      renderRemoveBtn
     };
   },
   render() {
-    let _slot, _slot2;
+    let _slot3;
     const {
       mdProvider,
       model
@@ -64,16 +101,9 @@ const FormMDCtrlMD = /* @__PURE__ */ vue.defineComponent({
     }, [this.controller.enableCreate && vue.createVNode(vue.resolveComponent("el-button"), {
       "class": [this.ns.be("actions", "create"), this.ns.be("actions", "btn")],
       "onClick": () => this.controller.create()
-    }, _isSlot(_slot = ibiz.i18n.t("app.add")) ? _slot : {
-      default: () => [_slot]
-    }), this.controller.enableDelete && vue.createVNode(vue.resolveComponent("el-button"), {
-      "type": "danger",
-      "disabled": !this.isSelected,
-      "class": [this.ns.be("actions", "remove"), this.ns.be("actions", "btn")],
-      "onClick": () => this.controller.remove()
-    }, _isSlot(_slot2 = ibiz.i18n.t("app.delete")) ? _slot2 : {
-      default: () => [_slot2]
-    })])]);
+    }, _isSlot(_slot3 = ibiz.i18n.t("app.add")) ? _slot3 : {
+      default: () => [_slot3]
+    }), this.renderRemoveBtn()])]);
   }
 });
 

package/lib/control/form/form-detail/form-mdctrl/form-mdctrl-repeater/form-mdctrl-repeater.cjs

@@ -6,6 +6,7 @@ var vue3Util = require('@ibiz-template/vue3-util');
 var repeaterSingleForm = require('./repeater-single-form/repeater-single-form.cjs');
 var repeaterMultiForm = require('./repeater-multi-form/repeater-multi-form.cjs');
 var repeaterGrid = require('./repeater-grid/repeater-grid.cjs');
+var repeaterGrid2 = require('./repeater-grid2/repeater-grid2.cjs');
 
 "use strict";
 const FormMDCtrlRepeater = /* @__PURE__ */ vue.defineComponent({
@@ -27,6 +28,7 @@ const FormMDCtrlRepeater = /* @__PURE__ */ vue.defineComponent({
     };
   },
   render() {
+    var _a;
     const classNames = [this.ns.b()];
     switch (this.controller.repeaterStyle) {
       case "MultiForm":
@@ -36,6 +38,14 @@ const FormMDCtrlRepeater = /* @__PURE__ */ vue.defineComponent({
           "controller": this.controller
         }, null);
       case "Grid":
+        const gridStyle = (_a = this.controller.model.ctrlParams) == null ? void 0 : _a.gridStyle;
+        if (gridStyle === "style2") {
+          return vue.createVNode(repeaterGrid2.RepeaterGrid2, {
+            "class": classNames,
+            "controller": this.controller,
+            "onChange": this.onDataChange
+          }, null);
+        }
         return vue.createVNode(repeaterGrid.RepeaterGrid, {
           "class": classNames,
           "controller": this.controller,

package/lib/control/form/form-detail/form-mdctrl/form-mdctrl-repeater/form-mdctrl-repeater.util.cjs

@@ -0,0 +1,32 @@
+'use strict';
+
+var vue = require('vue');
+
+"use strict";
+function useLoadMore(initItems, chunkSize) {
+  let totalItems = [];
+  let page = 1;
+  const renderItems = vue.ref([]);
+  const updateTotalItems = (items) => {
+    page = 1;
+    totalItems = items != null ? items : [];
+    renderItems.value = totalItems.slice(0, chunkSize);
+  };
+  updateTotalItems(initItems);
+  const loadMore = () => {
+    if (renderItems.value.length >= totalItems.length) {
+      return;
+    }
+    page += 1;
+    const start = (page - 1) * chunkSize;
+    const end = page * chunkSize;
+    renderItems.value.push(...totalItems.slice(start, end));
+  };
+  return {
+    renderItems,
+    loadMore,
+    updateTotalItems
+  };
+}
+
+exports.useLoadMore = useLoadMore;