@ibiz-template/vue3-components 0.7.38-alpha.43 → 0.7.38-alpha.56

package/lib/editor/data-picker/picker-editor.controller.cjs

@@ -76,6 +76,16 @@ class PickerEditorController extends runtime.EditorController {
      * @type {IAcItemProvider}
      */
     __publicField(this, "acItemProvider");
+    /**
+     * 分组行为状态
+     */
+    __publicField(this, "groupActionState", new runtime.ButtonContainerState());
+    /**
+     * @description 自填模式行为行为组
+     * @type {IAppDEUIActionGroupDetail[]}
+     * @memberof PickerEditorController
+     */
+    __publicField(this, "actionDetails", []);
   }
   async onInit() {
     var _a, _b, _c, _d;
@@ -130,6 +140,37 @@ class PickerEditorController extends runtime.EditorController {
     this.objectIdField = (_b = this.model.objectIdField) == null ? void 0 : _b.toLowerCase();
     this.objectNameField = (_c = this.model.objectNameField) == null ? void 0 : _c.toLowerCase();
     this.objectValueField = (_d = this.model.objectValueField) == null ? void 0 : _d.toLowerCase();
+    if (this.model.uiactionGroup) {
+      this.actionDetails = this.model.uiactionGroup.uiactionGroupDetails || [];
+      if (this.actionDetails.length > 0) {
+        this.actionDetails.forEach((detail) => {
+          const actionid = detail.uiactionId;
+          if (actionid) {
+            const buttonState = new runtime.UIActionButtonState(
+              detail.id,
+              this.context.srfappid,
+              actionid
+            );
+            this.groupActionState.addState(detail.id, buttonState);
+          }
+        });
+        await this.groupActionState.init();
+        this.actionDetails.forEach((detail) => {
+          if (detail.capLanguageRes && detail.capLanguageRes.lanResTag) {
+            detail.caption = ibiz.i18n.t(
+              detail.capLanguageRes.lanResTag,
+              detail.caption
+            );
+          }
+          if (detail.tooltipLanguageRes && detail.tooltipLanguageRes.lanResTag) {
+            detail.tooltip = ibiz.i18n.t(
+              detail.tooltipLanguageRes.lanResTag,
+              detail.tooltip
+            );
+          }
+        });
+      }
+    }
   }
   /**
    * 初始化noAc和noButton
@@ -327,6 +368,30 @@ class PickerEditorController extends runtime.EditorController {
     }
     return object;
   }
+  /**
+   * @description 分组行为项点击
+   * @param {IUIActionGroupDetail} detail
+   * @param {MouseEvent} event
+   * @return {*}  {Promise<void>}
+   * @memberof PickerEditorController
+   */
+  async onActionClick(detail, data, event) {
+    if (event) {
+      event.stopPropagation();
+    }
+    const actionId = detail.uiactionId;
+    await runtime.UIActionUtil.execAndResolved(
+      actionId,
+      {
+        context: this.context,
+        params: this.params,
+        data: [data],
+        view: this.view,
+        event
+      },
+      detail.appId
+    );
+  }
 }
 
 exports.PickerEditorController = PickerEditorController;

package/lib/editor/date-picker/ibiz-date-picker/ibiz-date-picker.cjs

@@ -151,7 +151,7 @@ const IBizDatePicker = /* @__PURE__ */ vue.defineComponent({
     const readonlyContent = this.formatValue;
     const formDefaultContent = vue.createVNode("div", {
       "class": this.ns.b("form-default-content")
-    }, [this.formatValue ? this.formatValue : "-"]);
+    }, [this.formatValue ? this.formatValue : ibiz.config.common.emptyText]);
     return vue.createVNode("div", {
       "class": [this.ns.b(), this.disabled ? this.ns.m("disabled") : "", this.readonly ? this.ns.m("readonly") : "", this.ns.e(this.editorModel.editorType), this.ns.is("editable", this.isEditable), this.ns.is("show-default", this.showFormDefaultContent)],
       "onKeyup": this.handleKeyUp

package/lib/editor/date-range/ibiz-date-range-picker/ibiz-date-range-picker.cjs

@@ -192,7 +192,7 @@ const IBizDateRangePicker = /* @__PURE__ */ vue.defineComponent({
       "start-placeholder": this.startPlaceHolder,
       "end-placeholder": this.endPlaceHolder,
       "unlink-panels": this.unlinkPanels
-    }, this.$attrs), null) : "-"]);
+    }, this.$attrs), null) : ibiz.config.common.emptyText]);
     return vue.createVNode("div", {
       "class": [this.ns.b(), this.disabled ? this.ns.m("disabled") : "", this.readonly ? this.ns.m("readonly") : "", this.ns.is("editable", this.isEditable), this.ns.is("show-default", this.showFormDefaultContent)],
       "onKeyup": this.handleKeyUp

package/lib/editor/date-range/ibiz-date-range-picker/ibiz-date-range-picker.css

@@ -1 +1 @@
-.ibiz-date-range-picker .el-date-editor{width:100%;line-height:var(--ibiz-editor-default-line-height);display:flex;align-items:center;justify-content:flex-start}.ibiz-date-range-picker .el-date-editor .el-range-input{color:var(--ibiz-form-item-text-color);background-color:transparent}.ibiz-date-range-picker--readonly{font-size:var(--ibiz-form-item-font-size);line-height:var(--ibiz-editor-default-line-height);color:var(--ibiz-form-item-readonly-color)}.ibiz-date-range-picker-form-default-content{display:none}.ibiz-form-item .ibiz-date-range-picker.is-show-default:hover .ibiz-date-range-picker-form-default-content{display:none}.ibiz-form-item .ibiz-date-range-picker.is-show-default:hover .ibiz-date-range-picker-input{display:flex}.ibiz-form-item .ibiz-date-range-picker.is-show-default .ibiz-date-range-picker-form-default-content{display:flex;align-items:center;width:100%;padding:var(--ibiz-form-item-hover-edit-padding);font-family:Arial,sans-serif;font-size:var(--ibiz-form-item-font-size);line-height:var(--ibiz-editor-default-line-height);color:var(--ibiz-form-item-text-color)}.ibiz-form-item .ibiz-date-range-picker.is-show-default .ibiz-date-range-picker-form-default-content .ibiz-date-range-picker-default-input{box-shadow:none}.ibiz-form-item .ibiz-date-range-picker.is-show-default .ibiz-date-range-picker-form-default-content.is-has-val{padding:0}.ibiz-form-item .ibiz-date-range-picker.is-show-default .ibiz-date-range-picker-input{display:none}.ibiz-form-item .ibiz-date-range-picker.is-show-default.is-editable .ibiz-date-range-picker-form-default-content{display:none}.ibiz-form-item .ibiz-date-range-picker.is-show-default.is-editable .ibiz-date-range-picker-input{display:flex}
+.ibiz-date-range-picker .el-date-editor{width:100%;line-height:var(--ibiz-editor-default-line-height);display:flex;align-items:center;justify-content:flex-start}.ibiz-date-range-picker .el-date-editor .el-range-input{color:var(--ibiz-form-item-text-color);background-color:transparent}.ibiz-date-range-picker--readonly{font-size:var(--ibiz-form-item-font-size);color:var(--ibiz-form-item-readonly-color);line-height:var(--ibiz-editor-default-line-height)}.ibiz-date-range-picker-form-default-content{display:none}.ibiz-form-item .ibiz-date-range-picker.is-show-default:hover .ibiz-date-range-picker-form-default-content{display:none}.ibiz-form-item .ibiz-date-range-picker.is-show-default:hover .ibiz-date-range-picker-input{display:flex}.ibiz-form-item .ibiz-date-range-picker.is-show-default .ibiz-date-range-picker-form-default-content{display:flex;align-items:center;width:100%;padding:var(--ibiz-form-item-hover-edit-padding);font-family:Arial,sans-serif;font-size:var(--ibiz-form-item-font-size);line-height:var(--ibiz-editor-default-line-height);color:var(--ibiz-form-item-text-color)}.ibiz-form-item .ibiz-date-range-picker.is-show-default .ibiz-date-range-picker-form-default-content .ibiz-date-range-picker-default-input{box-shadow:none}.ibiz-form-item .ibiz-date-range-picker.is-show-default .ibiz-date-range-picker-form-default-content.is-has-val{padding:0}.ibiz-form-item .ibiz-date-range-picker.is-show-default .ibiz-date-range-picker-input{display:none}.ibiz-form-item .ibiz-date-range-picker.is-show-default.is-editable .ibiz-date-range-picker-form-default-content{display:none}.ibiz-form-item .ibiz-date-range-picker.is-show-default.is-editable .ibiz-date-range-picker-input{display:flex}

package/lib/editor/dropdown-list/ibiz-dropdown/ibiz-dropdown.cjs

@@ -71,20 +71,12 @@ const IBizDropdown = /* @__PURE__ */ vue.defineComponent({
       });
       return list;
     };
-    const loadCodeList = async () => {
-      if (c.model.appCodeListId) {
-        const app = ibiz.hub.getApp(c.context.srfappid);
-        const codeListModel = app.codeList.getCodeList(c.model.appCodeListId);
-        if (codeListModel) {
-          codeItemValueNumber.value = codeListModel.codeItemValueNumber || false;
-        }
-      }
-      isLoading.value = true;
-      let codeList = await c.loadCodeList(props.data);
+    const afterLoadCodeList = (codeList) => {
+      items.value = [];
+      codeListItems.value = [];
       if (c.multiple && !codeList.some((item) => item.children)) {
         codeList = c.handleCodeListAllItems(codeList);
       }
-      isLoadedCodeList.value = true;
       if (c.blankItemName && !c.multiple) {
         items.value = [{
           value: void 0,
@@ -101,6 +93,19 @@ const IBizDropdown = /* @__PURE__ */ vue.defineComponent({
           break;
         }
       }
+    };
+    const loadCodeList = async () => {
+      if (c.model.appCodeListId) {
+        const app = ibiz.hub.getApp(c.context.srfappid);
+        const codeListModel = app.codeList.getCodeList(c.model.appCodeListId);
+        if (codeListModel) {
+          codeItemValueNumber.value = codeListModel.codeItemValueNumber || false;
+        }
+      }
+      isLoading.value = true;
+      const codeList = await c.loadCodeList(props.data);
+      afterLoadCodeList(codeList);
+      isLoadedCodeList.value = true;
       isLoading.value = false;
     };
     vue.watch(() => props.value, async (newVal, oldVal) => {
@@ -154,7 +159,7 @@ const IBizDropdown = /* @__PURE__ */ vue.defineComponent({
     } = runtime.useCodeListSelection(c.allItemsValue);
     const curValue = vue.computed({
       get() {
-        var _a, _b, _c;
+        var _a, _b;
         if (!isLoadedCodeList.value) {
           return c.multiple ? [] : "";
         }
@@ -173,7 +178,7 @@ const IBizDropdown = /* @__PURE__ */ vue.defineComponent({
           }
           return c.multiple ? props.value : props.value.toString();
         }
-        return (_c = props.value) == null ? void 0 : _c.toString();
+        return props.value || props.value === 0 ? props.value.toString() : "";
       },
       set(_select) {
         let select = _select;
@@ -195,13 +200,21 @@ const IBizDropdown = /* @__PURE__ */ vue.defineComponent({
           }
           emit("change", selectArr);
         } else if (editorItems && editorItems.length > 0) {
-          emit("change", codeItemValueNumber.value ? Number(select) : select, editorItems[0].id);
+          let emitVal = select;
+          if (codeItemValueNumber.value) {
+            emitVal = select === "" ? null : Number(select);
+          }
+          emit("change", emitVal, editorItems[0].id);
           const selectItem = getCodeListItemByValue(codeItemValueNumber.value ? Number(select) : select);
           if (selectItem) {
             emit("change", selectItem.text);
           }
         } else {
-          emit("change", codeItemValueNumber.value ? Number(select) : select);
+          let emitVal = select;
+          if (codeItemValueNumber.value) {
+            emitVal = select === "" ? null : Number(select);
+          }
+          emit("change", emitVal);
         }
         setEditable(false);
         if (c.editorParams.alwaysLoad === "true") {
@@ -274,13 +287,8 @@ const IBizDropdown = /* @__PURE__ */ vue.defineComponent({
       }
     };
     const fn = (data) => {
-      if (data) {
-        if (c.multiple && !data.some((item) => item.children)) {
-          items.value = c.handleCodeListAllItems(data);
-          return;
-        }
-        items.value = data;
-      }
+      if (data)
+        afterLoadCodeList(data);
     };
     vue3Util.useCodeListListen(c.model.appCodeListId, c.context.srfappid, fn);
     vue.onMounted(() => {
@@ -455,7 +463,7 @@ const IBizDropdown = /* @__PURE__ */ vue.defineComponent({
       }, [vue.createVNode("span", {
         "class": this.ns.be("content-item", "label")
       }, [text])]);
-    }) : "-"]);
+    }) : ibiz.config.common.emptyText]);
     return vue.createVNode("div", {
       "class": [this.ns.b(), this.disabled ? this.ns.m("disabled") : "", this.readonly ? this.ns.m("readonly") : "", this.ns.is("editable", this.isEditable), this.ns.is("show-default", this.showFormDefaultContent), this.c.editorParams.type === "round" && this.ns.m("round")],
       "style": this.cssVars

package/lib/editor/dropdown-list/ibiz-emoji-picker/ibiz-emoji-picker.cjs

@@ -89,7 +89,7 @@ const IBizEmojiPicker = /* @__PURE__ */ vue.defineComponent({
     const renderFormDefaultContent = () => {
       return vue.createVNode("div", {
         "class": [ns.b("form-default-content"), ns.is("clear", !!emoji.value)]
-      }, [emoji.value ? emoji.value : "-"]);
+      }, [emoji.value ? emoji.value : ibiz.config.common.emptyText]);
     };
     const renderReference = () => {
       return vue.createVNode(vue.resolveComponent("el-button"), {

package/lib/editor/dropdown-list/ibiz-virtualized-list/ibiz-virtualized-list.cjs

@@ -56,20 +56,12 @@ const IBizVirtualizedList = /* @__PURE__ */ vue.defineComponent({
       });
       return list;
     };
-    const loadCodeList = async () => {
-      if (c.model.appCodeListId) {
-        const app = ibiz.hub.getApp(c.context.srfappid);
-        const codeListModel = app.codeList.getCodeList(c.model.appCodeListId);
-        if (codeListModel) {
-          codeItemValueNumber.value = codeListModel.codeItemValueNumber || false;
-        }
-      }
-      isLoading.value = true;
-      let codeList = await c.loadCodeList(props.data);
+    const afterLoadCodeList = (codeList) => {
+      items.value = [];
+      codeListItems.value = [];
       if (c.multiple && !codeList.some((item) => item.children)) {
         codeList = c.handleCodeListAllItems(codeList);
       }
-      isLoadedCodeList.value = true;
       if (c.blankItemName && !c.multiple) {
         items.value = [{
           value: void 0,
@@ -86,6 +78,19 @@ const IBizVirtualizedList = /* @__PURE__ */ vue.defineComponent({
           break;
         }
       }
+    };
+    const loadCodeList = async () => {
+      if (c.model.appCodeListId) {
+        const app = ibiz.hub.getApp(c.context.srfappid);
+        const codeListModel = app.codeList.getCodeList(c.model.appCodeListId);
+        if (codeListModel) {
+          codeItemValueNumber.value = codeListModel.codeItemValueNumber || false;
+        }
+      }
+      isLoading.value = true;
+      const codeList = await c.loadCodeList(props.data);
+      afterLoadCodeList(codeList);
+      isLoadedCodeList.value = true;
       isLoading.value = false;
     };
     vue.watch(() => props.value, async (newVal, oldVal) => {
@@ -249,13 +254,8 @@ const IBizVirtualizedList = /* @__PURE__ */ vue.defineComponent({
       }
     };
     const fn = (data) => {
-      if (data) {
-        if (c.multiple && !data.some((item) => item.children)) {
-          items.value = c.handleCodeListAllItems(data);
-          return;
-        }
-        items.value = data;
-      }
+      if (data)
+        afterLoadCodeList(data);
     };
     vue3Util.useCodeListListen(c.model.appCodeListId, c.context.srfappid, fn);
     vue.onMounted(() => {

package/lib/editor/html/wang-editor/wang-editor.cjs

@@ -29,7 +29,7 @@ const IBizHtml = /* @__PURE__ */ vue.defineComponent({
     const editorRef = vue.shallowRef();
     const valueHtml = vue.ref("");
     const headers = vue.ref({
-      ["".concat(ibiz.env.tokenHeader, "Authorization")]: "".concat(ibiz.env.tokenPrefix, "Bearer ").concat(qxUtil.getCookie(core.CoreConst.TOKEN))
+      ["".concat(ibiz.env.tokenHeader, "Authorization")]: "".concat(ibiz.env.tokenPrefix, "Bearer ").concat(core.getAppCookie(core.CoreConst.TOKEN))
     });
     const uploadUrl = vue.ref("");
     const downloadUrl = vue.ref("");

package/lib/editor/index.cjs

@@ -33,6 +33,7 @@ require('./preset/index.cjs');
 require('./carousel/index.cjs');
 require('./user/ibiz-searchcond-edit/index.cjs');
 require('./date-range-select/index.cjs');
+var ibizImageCropping = require('./upload/ibiz-image-cropping/ibiz-image-cropping.cjs');
 var span = require('./span/span/span.cjs');
 var spanLink = require('./span/span-link/span-link.cjs');
 var input = require('./text-box/input/input.cjs');
@@ -102,6 +103,7 @@ var carouselEditor_provider = require('./carousel/carousel-editor.provider.cjs')
 "use strict";
 const IBizEditor = {
   install: (v) => {
+    v.component(ibizImageCropping.IBizImageCropping.name, ibizImageCropping.IBizImageCropping);
     v.component(notSupportedEditor.NotSupportedEditor.name, notSupportedEditor.NotSupportedEditor);
     v.component(span.IBizSpan.name, span.IBizSpan);
     v.component(spanLink.IBizSpanLink.name, spanLink.IBizSpanLink);
@@ -239,6 +241,10 @@ const IBizEditor = {
       "PICTURE_ONE_RAW",
       () => new uploadEditor_provider.FileUploaderEditorProvider("PICTURE_ONE_RAW")
     );
+    runtime.registerEditorProvider(
+      "PICTURE_CROPPING",
+      () => new uploadEditor_provider.FileUploaderEditorProvider("PICTURE_CROPPING")
+    );
     runtime.registerEditorProvider("RAW", () => new rawEditor_provider.RawEditorProvider());
     runtime.registerEditorProvider("STEPPER", () => new stepperEditor_provider.StepperEditorProvider());
     runtime.registerEditorProvider("RATING", () => new rateEditor_provider.RateEditorProvider());

package/lib/editor/list-box/ibiz-list-box/ibiz-list-box.cjs

@@ -3,8 +3,8 @@
 var vue = require('vue');
 var vue3Util = require('@ibiz-template/vue3-util');
 var ramda = require('ramda');
-require('./ibiz-list-box.css');
 var runtime = require('@ibiz-template/runtime');
+require('./ibiz-list-box.css');
 
 "use strict";
 function _isSlot(s) {

package/lib/editor/markdown/ibiz-markdown-editor/ibiz-markdown-editor.cjs

@@ -23,7 +23,7 @@ const IBizMarkDown = /* @__PURE__ */ vue.defineComponent({
     const editor = vue.ref(null);
     const id = qxUtil.createUUID();
     const headers = vue.ref({
-      ["".concat(ibiz.env.tokenHeader, "Authorization")]: "".concat(ibiz.env.tokenPrefix, "Bearer ").concat(qxUtil.getCookie(core.CoreConst.TOKEN))
+      ["".concat(ibiz.env.tokenHeader, "Authorization")]: "".concat(ibiz.env.tokenPrefix, "Bearer ").concat(core.getAppCookie(core.CoreConst.TOKEN))
     });
     const uploadUrl = vue.ref("");
     const downloadUrl = vue.ref("");
@@ -144,7 +144,7 @@ const IBizMarkDown = /* @__PURE__ */ vue.defineComponent({
     const calcMarkDownStyle = () => {
       if (window.ResizeObserver && markDownBox.value) {
         const tempCssVars = {
-          width: "".concat(markDownBox.value.offsetWidth, "px")
+          width: markDownBox.value.offsetWidth ? "".concat(markDownBox.value.offsetWidth, "px") : "100%"
         };
         if (c && typeof c.parent.model.height === "number") {
           Object.assign(tempCssVars, {

package/lib/editor/number-range/ibiz-number-range-picker/ibiz-number-range-picker.cjs

@@ -193,7 +193,7 @@ const IBizNumberRangePicker = /* @__PURE__ */ vue.defineComponent({
       "class": this.ns.b("default-separator")
     }, [this.rangeSeparator]), vue.createVNode("div", {
       "class": this.ns.b("default-max")
-    }, [this.maxValue])] : "-"]);
+    }, [this.maxValue])] : ibiz.config.common.emptyText]);
     return vue.createVNode("div", {
       "class": [this.ns.b(), this.disabled ? this.ns.m("disabled") : "", this.readonly ? this.ns.m("readonly") : "", this.ns.is("editable", this.isEditable), this.ns.is("show-default", this.showFormDefaultContent)],
       "ref": "componentRef"

package/lib/editor/radio-button-list/ibiz-radio/ibiz-radio.cjs

@@ -2,8 +2,8 @@
 
 var vue = require('vue');
 var vue3Util = require('@ibiz-template/vue3-util');
-require('./ibiz-radio.css');
 var qxUtil = require('qx-util');
+require('./ibiz-radio.css');
 
 "use strict";
 function _isSlot(s) {
@@ -47,9 +47,8 @@ const IBizRadio = /* @__PURE__ */ vue.defineComponent({
       deep: true
     });
     const fn = (data) => {
-      if (data) {
+      if (data)
         items.value = data;
-      }
     };
     vue3Util.useCodeListListen(c.model.appCodeListId, c.context.srfappid, fn);
     const valueText = vue.computed(() => {

package/lib/editor/span/span/span.cjs

@@ -160,7 +160,7 @@ const IBizSpan = /* @__PURE__ */ vue.defineComponent({
       content = this.text;
       this.spanTitle = this.text;
     } else {
-      content = "-";
+      content = ibiz.config.common.emptyText;
     }
     const isEllipsis = this.c.editorParams.overflowMode === "ellipsis" || this.c.model.wrapMode === "NOWRAP";
     return vue.createVNode("span", {

package/lib/editor/text-box/ibiz-input-number/ibiz-input-number.cjs

@@ -205,7 +205,7 @@ const IBizInputNumber = /* @__PURE__ */ vue.defineComponent({
       }
       return vue.createVNode("div", {
         "class": this.ns.b("form-default-content")
-      }, [this.currentVal || this.currentVal === 0 ? this.currentFormatVal + unit : "-"]);
+      }, [this.currentVal || this.currentVal === 0 ? this.currentFormatVal + unit : ibiz.config.common.emptyText]);
     };
     return vue.createVNode("div", {
       "class": [this.ns.b(), this.disabled ? this.ns.m("disabled") : "", this.readonly ? this.ns.m("readonly") : "", this.ns.is("editable", this.isEditable), this.ns.is("show-default", this.showFormDefaultContent)]

package/lib/editor/text-box/input/input.cjs

@@ -376,7 +376,7 @@ const IBizInput = /* @__PURE__ */ vue.defineComponent({
     }
     const formDefaultContent = vue.createVNode("div", {
       "class": this.ns.b("form-default-content")
-    }, [this.currentVal ? this.type === "password" ? this.currentVal.split("").map((_item) => "\u2022") : this.currentFormatVal : "-"]);
+    }, [this.currentVal ? this.type === "password" ? this.currentVal.split("").map((_item) => "\u2022") : this.currentFormatVal : ibiz.config.common.emptyText]);
     return vue.createVNode("div", {
       "class": [this.ns.b(), this.ns.is("textarea", Object.is(this.type, "textarea")), this.disabled ? this.ns.m("disabled") : "", this.readonly ? this.ns.m("readonly") : "", this.ns.is("editable", this.isEditable), this.ns.is("show-default", this.showFormDefaultContent)],
       "style": {

package/lib/editor/upload/ibiz-image-cropping/ibiz-image-cropping.cjs

@@ -0,0 +1,235 @@
+'use strict';
+
+var vue = require('vue');
+var vue3Util = require('@ibiz-template/vue3-util');
+require('./ibiz-image-cropping.css');
+var useIviewUpload = require('../use/use-iview-upload.cjs');
+
+"use strict";
+const IBizImageCropping = /* @__PURE__ */ vue.defineComponent({
+  name: "IBizImageCropping",
+  props: vue3Util.getUploadProps(),
+  emits: vue3Util.getEditorEmits(),
+  setup(props, {
+    emit
+  }) {
+    var _a, _b;
+    const ns = vue3Util.useNamespace("image-cropping-upload");
+    const c = props.controller;
+    const {
+      useInFocusAndBlur,
+      useInValueChange
+    } = vue3Util.useAutoFocusBlur(props, emit);
+    const {
+      uploadUrl,
+      headers,
+      files,
+      limit,
+      onDownload,
+      onError,
+      onRemove,
+      onSuccess,
+      beforeUpload
+    } = useIviewUpload.useIViewUpload(props, (value) => {
+      emit("change", value);
+      useInValueChange();
+    }, c);
+    const dialogImageUrl = vue.ref([]);
+    const dialogImageUrlIndex = vue.ref(0);
+    const dialogVisible = vue.ref(false);
+    const uploadTag = vue.ref(false);
+    const imageUpload = vue.ref();
+    const cropRect = {};
+    if ((_a = c.editorParams) == null ? void 0 : _a.cropWidth) {
+      Object.assign(cropRect, {
+        cropareaWidth: Number(c.editorParams.cropWidth)
+      });
+    }
+    if ((_b = c.editorParams) == null ? void 0 : _b.cropHeight) {
+      Object.assign(cropRect, {
+        cropareaHeight: Number(c.editorParams.cropHeight)
+      });
+    }
+    const tempFileList = vue.ref();
+    const cropVisible = vue.ref(false);
+    const onDialogVisibleChange = (value) => {
+      dialogVisible.value = value;
+    };
+    const onPreview = (file) => {
+      dialogImageUrl.value = [];
+      files.value.forEach((i) => {
+        if (i.base64) {
+          dialogImageUrl.value.push(i.base64);
+        } else if (i.url) {
+          dialogImageUrl.value.push(i.url);
+        }
+      });
+      dialogImageUrlIndex.value = files.value.findIndex((item) => item.url === file.url);
+      dialogVisible.value = true;
+    };
+    const noUploadIcon = vue.computed(() => {
+      return limit.value === 1 && files.value.length === 1;
+    });
+    const showFormDefaultContent = vue.computed(() => {
+      if (props.controlParams && props.controlParams.editmode === "hover" && !props.readonly) {
+        return true;
+      }
+      return false;
+    });
+    const {
+      componentRef
+    } = vue3Util.useFocusAndBlur(() => emit("focus"), () => useInFocusAndBlur());
+    const onChange = (file) => {
+      if (file.status === "ready" && !uploadTag.value) {
+        tempFileList.value = file;
+        uploadTag.value = true;
+        cropVisible.value = true;
+      }
+    };
+    const dataURLtoBlob = (dataURL) => {
+      const byteString = atob(dataURL.split(",")[1]);
+      const mimeString = dataURL.split(",")[0].split(":")[1].split(";")[0];
+      const arrayBuffer = new ArrayBuffer(byteString.length);
+      const intArray = new Uint8Array(arrayBuffer);
+      for (let i = 0; i < byteString.length; i++) {
+        intArray[i] = byteString.charCodeAt(i);
+      }
+      return new Blob([arrayBuffer], {
+        type: mimeString
+      });
+    };
+    const cropChange = (url) => {
+      if (!url) {
+        uploadTag.value = false;
+        cropVisible.value = false;
+        ibiz.message.info(ibiz.i18n.t("editor.upload.cancelUpload"));
+        return;
+      }
+      const blob = dataURLtoBlob(url);
+      const _tempFile = new File([blob], "cropimg.png", {
+        type: blob.type
+      });
+      if (_tempFile) {
+        vue.nextTick(() => {
+          imageUpload.value.handleRemove(tempFileList.value);
+          imageUpload.value.handleStart(_tempFile);
+          tempFileList.value = void 0;
+          imageUpload.value.submit();
+          uploadTag.value = false;
+          cropVisible.value = false;
+        });
+      }
+    };
+    const cropDialogClose = () => {
+      if (tempFileList.value) {
+        ibiz.message.info(ibiz.i18n.t("editor.upload.cancelUpload"));
+        imageUpload.value.handleRemove(tempFileList.value);
+      }
+      uploadTag.value = false;
+    };
+    return {
+      ns,
+      c,
+      files,
+      limit,
+      headers,
+      uploadUrl,
+      dialogImageUrl,
+      dialogVisible,
+      noUploadIcon,
+      beforeUpload,
+      onSuccess,
+      onError,
+      onRemove,
+      onDownload,
+      onDialogVisibleChange,
+      onPreview,
+      componentRef,
+      showFormDefaultContent,
+      dialogImageUrlIndex,
+      cropVisible,
+      tempFileList,
+      imageUpload,
+      cropRect,
+      onChange,
+      cropDialogClose,
+      cropChange
+    };
+  },
+  render() {
+    return vue.createVNode("div", {
+      "class": [this.ns.b(), this.disabled ? this.ns.m("disabled") : "", this.readonly ? this.ns.m("readonly") : "", this.readonly && this.c.autoPreview && this.ns.m("autosize"), this.ns.is("show-default", this.showFormDefaultContent)],
+      "ref": "componentRef"
+    }, [vue.createVNode("div", {
+      "class": this.ns.e("image-upload-list")
+    }, [this.files.map((item) => vue.createVNode("div", {
+      "key": item.id,
+      "class": this.ns.e("list-item")
+    }, [vue.createVNode("img", {
+      "src": item.base64 ? item.base64 : item.url
+    }, null), vue.createVNode("div", {
+      "class": this.ns.e("list-item-cover")
+    }, [vue.createVNode("ion-icon", {
+      "class": this.ns.e("preview-icon"),
+      "onClick": () => this.onPreview(item),
+      "name": "search"
+    }, null), vue.createVNode("ion-icon", {
+      "class": this.ns.e("download-icon"),
+      "onClick": () => this.onDownload(item),
+      "name": "download"
+    }, null), vue.createVNode("ion-icon", {
+      "class": this.ns.e("remove-icon"),
+      "onClick": () => this.onRemove(item),
+      "name": "remove"
+    }, null)])]))]), vue.createVNode(vue.resolveComponent("el-upload"), vue.mergeProps({
+      "ref": "imageUpload",
+      "class": [this.ns.b("icon"), this.ns.is("not-show", this.noUploadIcon)],
+      "file-list": this.files,
+      "action": this.uploadUrl,
+      "headers": this.headers,
+      "disabled": this.disabled,
+      "multiple": false,
+      "limit": this.limit,
+      "show-file-list": false,
+      "accept": this.c.accept,
+      "list-type": "picture-card",
+      "auto-upload": false,
+      "onChange": this.onChange,
+      "before-upload": this.beforeUpload,
+      "onSuccess": this.onSuccess,
+      "onError": this.onError,
+      "onRemove": this.onRemove,
+      "onPreview": this.onDownload
+    }, this.$attrs), {
+      default: () => [vue.createVNode("ion-icon", {
+        "name": "add-outline",
+        "class": this.ns.e("image-upload-add")
+      }, null)]
+    }), vue.createVNode(vue.resolveComponent("el-dialog"), {
+      "modelValue": this.cropVisible,
+      "onUpdate:modelValue": ($event) => this.cropVisible = $event,
+      "title": ibiz.i18n.t("editor.upload.cropImg"),
+      "class": this.ns.e("upload-dialog"),
+      "onClosed": this.cropDialogClose,
+      "destroy-on-close": true,
+      "width": 640
+    }, {
+      default: () => {
+        return vue.createVNode(vue.resolveComponent("iBizCropping"), vue.mergeProps({
+          "img": this.tempFileList,
+          "onChange": this.cropChange
+        }, this.cropRect), null);
+      }
+    }), this.dialogVisible ? vue.createVNode(vue.resolveComponent("el-image-viewer"), vue.mergeProps({
+      "onClose": () => this.onDialogVisibleChange(false),
+      "url-list": this.dialogImageUrl,
+      "hide-on-click-modal": true,
+      "close-on-press-escape": true,
+      "teleported": true,
+      "z-index": 9999,
+      "initial-index": this.dialogImageUrlIndex
+    }, this.$attrs), null) : null]);
+  }
+});
+
+exports.IBizImageCropping = IBizImageCropping;