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

package/es/editor/preset/preset-rawitem/ibiz-preset-rawitem/ibiz-preset-rawitem.d.ts

@@ -30,7 +30,7 @@ export declare const IBizPresetRawitem: import("vue").DefineComponent<{
     type: string | undefined;
     content: Ref<string | number | undefined>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    change: (_value: unknown, _name?: string | undefined) => boolean;
+    change: (_value: unknown, _name?: string | undefined, _ignore?: boolean | undefined) => boolean;
     blur: (_event?: IData | undefined) => boolean;
     focus: (_event?: IData | undefined) => boolean;
     enter: (_event?: IData | undefined) => boolean;
@@ -60,7 +60,7 @@ export declare const IBizPresetRawitem: import("vue").DefineComponent<{
 }>> & {
     onFocus?: ((_event?: IData | undefined) => any) | undefined;
     onBlur?: ((_event?: IData | undefined) => any) | undefined;
-    onChange?: ((_value: unknown, _name?: string | undefined) => any) | undefined;
+    onChange?: ((_value: unknown, _name?: string | undefined, _ignore?: boolean | undefined) => any) | undefined;
     onEnter?: ((_event?: IData | undefined) => any) | undefined;
     onInfoTextChange?: ((_text: string) => any) | undefined;
 }, {

package/es/editor/radio-button-list/ibiz-radio/ibiz-radio.d.ts

@@ -1,5 +1,5 @@
-import './ibiz-radio.scss';
 import { RadioButtonListEditorController } from '../radio-button-list.controller';
+import './ibiz-radio.scss';
 export declare const IBizRadio: import("vue").DefineComponent<{
     value: (StringConstructor | NumberConstructor)[];
     controller: import("@ibiz-template/vue3-util").RequiredProp<import("vue").PropType<RadioButtonListEditorController>, undefined, undefined>;
@@ -33,7 +33,7 @@ export declare const IBizRadio: import("vue").DefineComponent<{
     isBtnRoundCorner: boolean;
     showFormDefaultContent: import("vue").ComputedRef<boolean>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    change: (_value: unknown, _name?: string | undefined) => boolean;
+    change: (_value: unknown, _name?: string | undefined, _ignore?: boolean | undefined) => boolean;
     blur: (_event?: IData | undefined) => boolean;
     focus: (_event?: IData | undefined) => boolean;
     enter: (_event?: IData | undefined) => boolean;
@@ -63,7 +63,7 @@ export declare const IBizRadio: import("vue").DefineComponent<{
 }>> & {
     onFocus?: ((_event?: IData | undefined) => any) | undefined;
     onBlur?: ((_event?: IData | undefined) => any) | undefined;
-    onChange?: ((_value: unknown, _name?: string | undefined) => any) | undefined;
+    onChange?: ((_value: unknown, _name?: string | undefined, _ignore?: boolean | undefined) => any) | undefined;
     onEnter?: ((_event?: IData | undefined) => any) | undefined;
     onInfoTextChange?: ((_text: string) => any) | undefined;
 }, {

package/es/editor/radio-button-list/ibiz-radio/ibiz-radio.mjs

@@ -1,7 +1,7 @@
 import { isVNode, defineComponent, ref, watch, computed, createVNode, resolveComponent, mergeProps } from 'vue';
 import { getRadioProps, getEditorEmits, useNamespace, useAutoFocusBlur, useCodeListListen, useFocusAndBlur } from '@ibiz-template/vue3-util';
-import './ibiz-radio.css';
 import { notNilEmpty } from 'qx-util';
+import './ibiz-radio.css';
 
 "use strict";
 function _isSlot(s) {
@@ -45,9 +45,8 @@ const IBizRadio = /* @__PURE__ */ defineComponent({
       deep: true
     });
     const fn = (data) => {
-      if (data) {
+      if (data)
         items.value = data;
-      }
     };
     useCodeListListen(c.model.appCodeListId, c.context.srfappid, fn);
     const valueText = computed(() => {

package/es/editor/rate/ibiz-rate/ibiz-rate.d.ts

@@ -33,7 +33,7 @@ export declare const IBizRate: import("vue").DefineComponent<{
     editorRef: import("vue").Ref<any>;
     showFormDefaultContent: import("vue").ComputedRef<boolean>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    change: (_value: unknown, _name?: string | undefined) => boolean;
+    change: (_value: unknown, _name?: string | undefined, _ignore?: boolean | undefined) => boolean;
     blur: (_event?: IData | undefined) => boolean;
     focus: (_event?: IData | undefined) => boolean;
     enter: (_event?: IData | undefined) => boolean;
@@ -63,7 +63,7 @@ export declare const IBizRate: import("vue").DefineComponent<{
 }>> & {
     onFocus?: ((_event?: IData | undefined) => any) | undefined;
     onBlur?: ((_event?: IData | undefined) => any) | undefined;
-    onChange?: ((_value: unknown, _name?: string | undefined) => any) | undefined;
+    onChange?: ((_value: unknown, _name?: string | undefined, _ignore?: boolean | undefined) => any) | undefined;
     onEnter?: ((_event?: IData | undefined) => any) | undefined;
     onInfoTextChange?: ((_text: string) => any) | undefined;
 }, {

package/es/editor/raw/ibiz-raw/ibiz-raw.d.ts

@@ -30,7 +30,7 @@ export declare const IBizRaw: import("vue").DefineComponent<{
     template: string;
     showFormDefaultContent: import("vue").ComputedRef<boolean>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    change: (_value: unknown, _name?: string | undefined) => boolean;
+    change: (_value: unknown, _name?: string | undefined, _ignore?: boolean | undefined) => boolean;
     blur: (_event?: IData | undefined) => boolean;
     focus: (_event?: IData | undefined) => boolean;
     enter: (_event?: IData | undefined) => boolean;
@@ -60,7 +60,7 @@ export declare const IBizRaw: import("vue").DefineComponent<{
 }>> & {
     onFocus?: ((_event?: IData | undefined) => any) | undefined;
     onBlur?: ((_event?: IData | undefined) => any) | undefined;
-    onChange?: ((_value: unknown, _name?: string | undefined) => any) | undefined;
+    onChange?: ((_value: unknown, _name?: string | undefined, _ignore?: boolean | undefined) => any) | undefined;
     onEnter?: ((_event?: IData | undefined) => any) | undefined;
     onInfoTextChange?: ((_text: string) => any) | undefined;
 }, {

package/es/editor/slider/ibiz-slider/ibiz-slider.d.ts

@@ -40,7 +40,7 @@ export declare const IBizSlider: import("vue").DefineComponent<{
     showFormDefaultContent: import("vue").ComputedRef<boolean>;
     pieStyle: import("vue").Ref<string>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    change: (_value: unknown, _name?: string | undefined) => boolean;
+    change: (_value: unknown, _name?: string | undefined, _ignore?: boolean | undefined) => boolean;
     blur: (_event?: IData | undefined) => boolean;
     focus: (_event?: IData | undefined) => boolean;
     enter: (_event?: IData | undefined) => boolean;
@@ -70,7 +70,7 @@ export declare const IBizSlider: import("vue").DefineComponent<{
 }>> & {
     onFocus?: ((_event?: IData | undefined) => any) | undefined;
     onBlur?: ((_event?: IData | undefined) => any) | undefined;
-    onChange?: ((_value: unknown, _name?: string | undefined) => any) | undefined;
+    onChange?: ((_value: unknown, _name?: string | undefined, _ignore?: boolean | undefined) => any) | undefined;
     onEnter?: ((_event?: IData | undefined) => any) | undefined;
     onInfoTextChange?: ((_text: string) => any) | undefined;
 }, {

package/es/editor/span/span/span.mjs

@@ -158,7 +158,7 @@ const IBizSpan = /* @__PURE__ */ 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 createVNode("span", {

package/es/editor/span/span-link/span-link.d.ts

@@ -30,7 +30,7 @@ export declare const IBizSpanLink: import("vue").DefineComponent<{
     editorRef: Ref<any>;
     showFormDefaultContent: import("vue").ComputedRef<boolean>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    change: (_value: unknown, _name?: string | undefined) => boolean;
+    change: (_value: unknown, _name?: string | undefined, _ignore?: boolean | undefined) => boolean;
     blur: (_event?: IData | undefined) => boolean;
     focus: (_event?: IData | undefined) => boolean;
     enter: (_event?: IData | undefined) => boolean;
@@ -60,7 +60,7 @@ export declare const IBizSpanLink: import("vue").DefineComponent<{
 }>> & {
     onFocus?: ((_event?: IData | undefined) => any) | undefined;
     onBlur?: ((_event?: IData | undefined) => any) | undefined;
-    onChange?: ((_value: unknown, _name?: string | undefined) => any) | undefined;
+    onChange?: ((_value: unknown, _name?: string | undefined, _ignore?: boolean | undefined) => any) | undefined;
     onEnter?: ((_event?: IData | undefined) => any) | undefined;
     onInfoTextChange?: ((_text: string) => any) | undefined;
 }, {

package/es/editor/stepper/ibiz-stepper/ibiz-stepper.d.ts

@@ -36,7 +36,7 @@ export declare const IBizStepper: import("vue").DefineComponent<{
     onBlur: () => void;
     showFormDefaultContent: import("vue").ComputedRef<boolean>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    change: (_value: unknown, _name?: string | undefined) => boolean;
+    change: (_value: unknown, _name?: string | undefined, _ignore?: boolean | undefined) => boolean;
     blur: (_event?: IData | undefined) => boolean;
     focus: (_event?: IData | undefined) => boolean;
     enter: (_event?: IData | undefined) => boolean;
@@ -66,7 +66,7 @@ export declare const IBizStepper: import("vue").DefineComponent<{
 }>> & {
     onFocus?: ((_event?: IData | undefined) => any) | undefined;
     onBlur?: ((_event?: IData | undefined) => any) | undefined;
-    onChange?: ((_value: unknown, _name?: string | undefined) => any) | undefined;
+    onChange?: ((_value: unknown, _name?: string | undefined, _ignore?: boolean | undefined) => any) | undefined;
     onEnter?: ((_event?: IData | undefined) => any) | undefined;
     onInfoTextChange?: ((_text: string) => any) | undefined;
 }, {

package/es/editor/switch/ibiz-switch/ibiz-switch.d.ts

@@ -33,7 +33,7 @@ export declare const IBizSwitch: import("vue").DefineComponent<{
     editorRef: import("vue").Ref<any>;
     showFormDefaultContent: import("vue").ComputedRef<boolean>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    change: (_value: unknown, _name?: string | undefined) => boolean;
+    change: (_value: unknown, _name?: string | undefined, _ignore?: boolean | undefined) => boolean;
     blur: (_event?: IData | undefined) => boolean;
     focus: (_event?: IData | undefined) => boolean;
     enter: (_event?: IData | undefined) => boolean;
@@ -63,7 +63,7 @@ export declare const IBizSwitch: import("vue").DefineComponent<{
 }>> & {
     onFocus?: ((_event?: IData | undefined) => any) | undefined;
     onBlur?: ((_event?: IData | undefined) => any) | undefined;
-    onChange?: ((_value: unknown, _name?: string | undefined) => any) | undefined;
+    onChange?: ((_value: unknown, _name?: string | undefined, _ignore?: boolean | undefined) => any) | undefined;
     onEnter?: ((_event?: IData | undefined) => any) | undefined;
     onInfoTextChange?: ((_text: string) => any) | undefined;
 }, {

package/es/editor/text-box/ibiz-input-ip/ibiz-input-ip.d.ts

@@ -37,7 +37,7 @@ export declare const IBizInputIP: import("vue").DefineComponent<{
     showFormDefaultContent: import("vue").ComputedRef<boolean>;
     handleKeyUp: (e: KeyboardEvent) => void;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    change: (_value: unknown, _name?: string | undefined) => boolean;
+    change: (_value: unknown, _name?: string | undefined, _ignore?: boolean | undefined) => boolean;
     blur: (_event?: IData | undefined) => boolean;
     focus: (_event?: IData | undefined) => boolean;
     enter: (_event?: IData | undefined) => boolean;
@@ -67,7 +67,7 @@ export declare const IBizInputIP: import("vue").DefineComponent<{
 }>> & {
     onFocus?: ((_event?: IData | undefined) => any) | undefined;
     onBlur?: ((_event?: IData | undefined) => any) | undefined;
-    onChange?: ((_value: unknown, _name?: string | undefined) => any) | undefined;
+    onChange?: ((_value: unknown, _name?: string | undefined, _ignore?: boolean | undefined) => any) | undefined;
     onEnter?: ((_event?: IData | undefined) => any) | undefined;
     onInfoTextChange?: ((_text: string) => any) | undefined;
 }, {

package/es/editor/text-box/ibiz-input-number/ibiz-input-number.d.ts

@@ -40,7 +40,7 @@ export declare const IBizInputNumber: import("vue").DefineComponent<{
     enablethousands: import("vue").Ref<boolean>;
     onInput: (value: string | number) => void;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    change: (_value: unknown, _name?: string | undefined) => boolean;
+    change: (_value: unknown, _name?: string | undefined, _ignore?: boolean | undefined) => boolean;
     blur: (_event?: IData | undefined) => boolean;
     focus: (_event?: IData | undefined) => boolean;
     enter: (_event?: IData | undefined) => boolean;
@@ -70,7 +70,7 @@ export declare const IBizInputNumber: import("vue").DefineComponent<{
 }>> & {
     onFocus?: ((_event?: IData | undefined) => any) | undefined;
     onBlur?: ((_event?: IData | undefined) => any) | undefined;
-    onChange?: ((_value: unknown, _name?: string | undefined) => any) | undefined;
+    onChange?: ((_value: unknown, _name?: string | undefined, _ignore?: boolean | undefined) => any) | undefined;
     onEnter?: ((_event?: IData | undefined) => any) | undefined;
     onInfoTextChange?: ((_text: string) => any) | undefined;
 }, {

package/es/editor/text-box/ibiz-input-number/ibiz-input-number.mjs

@@ -203,7 +203,7 @@ const IBizInputNumber = /* @__PURE__ */ defineComponent({
       }
       return 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 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/es/editor/text-box/input/input.d.ts

@@ -26,7 +26,7 @@ export declare const IBizInput: import("vue").DefineComponent<{
     c: TextBoxEditorController;
     ns: import("@ibiz-template/core").Namespace;
     rows: import("vue").Ref<number>;
-    type: import("vue").ComputedRef<"string" | "text" | "password" | "textarea">;
+    type: import("vue").ComputedRef<"textarea" | "string" | "text" | "password">;
     items: import("vue").Ref<readonly {
         value: string | number;
         text: string;
@@ -79,7 +79,7 @@ export declare const IBizInput: import("vue").DefineComponent<{
     showFormDefaultContent: import("vue").ComputedRef<boolean>;
     currentFormatVal: import("vue").ComputedRef<string>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    change: (_value: unknown, _name?: string | undefined) => boolean;
+    change: (_value: unknown, _name?: string | undefined, _ignore?: boolean | undefined) => boolean;
     blur: (_event?: IData | undefined) => boolean;
     focus: (_event?: IData | undefined) => boolean;
     enter: (_event?: IData | undefined) => boolean;
@@ -109,7 +109,7 @@ export declare const IBizInput: import("vue").DefineComponent<{
 }>> & {
     onFocus?: ((_event?: IData | undefined) => any) | undefined;
     onBlur?: ((_event?: IData | undefined) => any) | undefined;
-    onChange?: ((_value: unknown, _name?: string | undefined) => any) | undefined;
+    onChange?: ((_value: unknown, _name?: string | undefined, _ignore?: boolean | undefined) => any) | undefined;
     onEnter?: ((_event?: IData | undefined) => any) | undefined;
     onInfoTextChange?: ((_text: string) => any) | undefined;
 }, {

package/es/editor/text-box/input/input.mjs

@@ -374,7 +374,7 @@ const IBizInput = /* @__PURE__ */ defineComponent({
     }
     const formDefaultContent = 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 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/es/editor/upload/ibiz-file-upload/ibiz-file-upload.d.ts

@@ -44,7 +44,7 @@ export declare const IBizFileUpload: import("vue").DefineComponent<{
     componentRef: import("vue").Ref<any>;
     showFormDefaultContent: import("vue").ComputedRef<boolean>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    change: (_value: unknown, _name?: string | undefined) => boolean;
+    change: (_value: unknown, _name?: string | undefined, _ignore?: boolean | undefined) => boolean;
     blur: (_event?: IData | undefined) => boolean;
     focus: (_event?: IData | undefined) => boolean;
     enter: (_event?: IData | undefined) => boolean;
@@ -74,7 +74,7 @@ export declare const IBizFileUpload: import("vue").DefineComponent<{
 }>> & {
     onFocus?: ((_event?: IData | undefined) => any) | undefined;
     onBlur?: ((_event?: IData | undefined) => any) | undefined;
-    onChange?: ((_value: unknown, _name?: string | undefined) => any) | undefined;
+    onChange?: ((_value: unknown, _name?: string | undefined, _ignore?: boolean | undefined) => any) | undefined;
     onEnter?: ((_event?: IData | undefined) => any) | undefined;
     onInfoTextChange?: ((_text: string) => any) | undefined;
 }, {

package/es/editor/upload/ibiz-image-cropping/ibiz-image-cropping.css

@@ -0,0 +1 @@
+@charset "UTF-8";.ibiz-image-cropping-upload{--ibiz-image-upload-box-width:120px;--ibiz-image-upload-box-height:120px;--ibiz-image-upload-list-item-margin:5px;--ibiz-image-upload-list-item-bg-color:var(--ibiz-bg-color);--ibiz-image-upload-list-item-border:1px solid var(--ibiz-border-color-light);--ibiz-image-upload-list-item-border-radius:var(--ibiz-border-radius-base);--ibiz-image-upload-list-item-box-shadow:var(--ibiz-box-shadow);--ibiz-image-upload-list-item-cover-bg-color:rgba(0, 0, 0, 0.6);--ibiz-image-upload-list-item-cover-i-color:var(--ibiz-color-white);--ibiz-image-upload-list-item-cover-i-size:var(--ibiz-font-size-extra-large);--ibiz-image-upload-list-item-cover-i-margin:0 2px;--ibiz-grid-image-upload-box-width:80px;--ibiz-grid-image-upload-box-height:32px;display:flex;align-items:center}.ibiz-image-cropping-upload .el-upload--picture-card{width:var(--ibiz-image-upload-box-width);height:var(--ibiz-image-upload-box-height)}.ibiz-image-cropping-upload__btn{width:var(--ibiz-image-upload-box-width);height:var(--ibiz-image-upload-box-height);line-height:var(--ibiz-image-upload-box-height)}.ibiz-image-cropping-upload__list-item{position:relative;display:inline-block;width:var(--ibiz-image-upload-box-width);height:var(--ibiz-image-upload-box-height);margin-right:var(--ibiz-image-upload-list-item-margin);line-height:var(--ibiz-image-upload-box-height);text-align:center;background:var(--ibiz-image-upload-list-item-bg-color);border:var(--ibiz-image-upload-list-item-border);border-radius:var(--ibiz-image-upload-list-item-border-radius);box-shadow:var(--ibiz-image-upload-list-item-box-shadow)}.ibiz-image-cropping-upload__list-item img{width:100%;height:100%;vertical-align:top;-o-object-fit:contain;object-fit:contain}.ibiz-image-cropping-upload__list-item:hover .ibiz-image-cropping-upload__list-item-cover{display:block}.ibiz-image-cropping-upload__list-item-cover{position:absolute;inset:0;display:none;background:var(--ibiz-image-upload-list-item-cover-bg-color)}.ibiz-image-cropping-upload__list-item-cover ion-icon{margin:var(--ibiz-image-upload-list-item-cover-i-margin);font-size:var(--ibiz-image-upload-list-item-cover-i-size);color:var(--ibiz-image-upload-list-item-cover-i-color);cursor:pointer}.ibiz-image-cropping-upload__list-item-cover img{width:100%;height:100%;vertical-align:top}.ibiz-image-cropping-upload__image-upload-add{font-size:var(--ibiz-font-size-header-2);color:var(--ibiz-color-text-3)}.ibiz-image-cropping-upload--disabled .ibiz-image-cropping-upload__download-icon{display:none}.ibiz-image-cropping-upload--disabled .ibiz-image-cropping-upload__remove-icon{display:none}.ibiz-image-cropping-upload--readonly .ibiz-image-cropping-upload__remove-icon{display:none}.ibiz-image-cropping-upload--readonly .el-upload--picture-card{display:none}.ibiz-image-cropping-upload--autosize{-o-object-fit:cover;object-fit:cover;justify-content:center}.ibiz-image-cropping-upload--autosize .ibiz-image-upload__list-item{width:100%;height:100%}.ibiz-image-cropping-upload--autosize .ibiz-image-upload__list-item-cover{display:none;visibility:hidden}.ibiz-image-caropping-upload-modal__img{width:100%}.ibiz-image-caropping-upload-icon.is-not-show{display:none}.ibiz-grid-field-edit-column__editor.ibiz-image-upload{flex-wrap:wrap}.ibiz-grid-field-edit-column__editor.ibiz-image-upload .el-upload--picture-card{width:var(--ibiz-grid-image-upload-box-width);height:var(--ibiz-grid-image-upload-box-height)}.ibiz-grid-field-edit-column__editor.ibiz-image-upload .ibiz-image-caropping-upload__image-upload-list{display:flex;align-items:center;justify-content:flex-start;flex-wrap:wrap}.ibiz-grid-field-edit-column__editor.ibiz-image-upload .ibiz-image-caropping-upload__list-item{width:var(--ibiz-grid-image-upload-box-width);height:var(--ibiz-grid-image-upload-box-height);margin:var(--ibiz-spacing-extra-tight) var(--ibiz-spacing-extra-tight) var(--ibiz-spacing-extra-tight) 0;line-height:var(--ibiz-grid-image-upload-box-height)}.ibiz-grid-field-edit-column__editor.ibiz-image-upload .ibiz-image-caropping-upload__list-item img{-o-object-fit:fill;object-fit:fill}.ibiz-form-item .ibiz-image-caropping-upload.is-show-default{padding:var(--ibiz-form-item-hover-edit-padding)}

package/es/editor/upload/ibiz-image-cropping/ibiz-image-cropping.d.ts

@@ -0,0 +1,96 @@
+import { Ref } from 'vue';
+import './ibiz-image-cropping.scss';
+import { UploadEditorController } from '../upload-editor.controller';
+export declare const IBizImageCropping: import("vue").DefineComponent<{
+    value: StringConstructor;
+    controller: import("@ibiz-template/vue3-util").RequiredProp<import("vue").PropType<UploadEditorController>, undefined, undefined>;
+    data: import("@ibiz-template/vue3-util").RequiredProp<import("vue").PropType<IData>, undefined, undefined>;
+    disabled: {
+        type: BooleanConstructor;
+    };
+    readonly: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    autoFocus: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    overflowMode: {
+        type: StringConstructor;
+    };
+    controlParams: {
+        type: ObjectConstructor;
+        required: boolean;
+    };
+}, {
+    ns: import("@ibiz-template/core").Namespace;
+    c: UploadEditorController;
+    files: Ref<{
+        id: string;
+        name: string;
+        url?: string | undefined;
+        base64?: string | undefined;
+    }[]>;
+    limit: import("vue").ComputedRef<1 | 9999>;
+    headers: Ref<IData>;
+    uploadUrl: Ref<string>;
+    dialogImageUrl: Ref<string[]>;
+    dialogVisible: Ref<boolean>;
+    noUploadIcon: import("vue").ComputedRef<boolean>;
+    beforeUpload: (rawFile: import("element-plus").UploadRawFile) => boolean;
+    onSuccess: (response: IData) => void;
+    onError: (...args: IData[]) => never;
+    onRemove: (file: IData) => void;
+    onDownload: (file: IData) => void;
+    onDialogVisibleChange: (value: boolean) => void;
+    onPreview: (file: IData) => void;
+    componentRef: Ref<any>;
+    showFormDefaultContent: import("vue").ComputedRef<boolean>;
+    dialogImageUrlIndex: Ref<number>;
+    cropVisible: Ref<boolean>;
+    tempFileList: Ref<IData | undefined>;
+    imageUpload: Ref<any>;
+    cropRect: IData;
+    onChange: (file: IData) => void;
+    cropDialogClose: () => void;
+    cropChange: (url: string) => void;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    change: (_value: unknown, _name?: string | undefined, _ignore?: boolean | undefined) => boolean;
+    blur: (_event?: IData | undefined) => boolean;
+    focus: (_event?: IData | undefined) => boolean;
+    enter: (_event?: IData | undefined) => boolean;
+    infoTextChange: (_text: string) => boolean;
+}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    value: StringConstructor;
+    controller: import("@ibiz-template/vue3-util").RequiredProp<import("vue").PropType<UploadEditorController>, undefined, undefined>;
+    data: import("@ibiz-template/vue3-util").RequiredProp<import("vue").PropType<IData>, undefined, undefined>;
+    disabled: {
+        type: BooleanConstructor;
+    };
+    readonly: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    autoFocus: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    overflowMode: {
+        type: StringConstructor;
+    };
+    controlParams: {
+        type: ObjectConstructor;
+        required: boolean;
+    };
+}>> & {
+    onFocus?: ((_event?: IData | undefined) => any) | undefined;
+    onBlur?: ((_event?: IData | undefined) => any) | undefined;
+    onChange?: ((_value: unknown, _name?: string | undefined, _ignore?: boolean | undefined) => any) | undefined;
+    onEnter?: ((_event?: IData | undefined) => any) | undefined;
+    onInfoTextChange?: ((_text: string) => any) | undefined;
+}, {
+    disabled: boolean;
+    readonly: boolean;
+    autoFocus: boolean;
+}, {}>;

package/es/editor/upload/ibiz-image-cropping/ibiz-image-cropping.mjs

@@ -0,0 +1,233 @@
+import { defineComponent, ref, computed, nextTick, createVNode, resolveComponent, mergeProps } from 'vue';
+import { getUploadProps, getEditorEmits, useNamespace, useAutoFocusBlur, useFocusAndBlur } from '@ibiz-template/vue3-util';
+import './ibiz-image-cropping.css';
+import { useIViewUpload } from '../use/use-iview-upload.mjs';
+
+"use strict";
+const IBizImageCropping = /* @__PURE__ */ defineComponent({
+  name: "IBizImageCropping",
+  props: getUploadProps(),
+  emits: getEditorEmits(),
+  setup(props, {
+    emit
+  }) {
+    var _a, _b;
+    const ns = useNamespace("image-cropping-upload");
+    const c = props.controller;
+    const {
+      useInFocusAndBlur,
+      useInValueChange
+    } = useAutoFocusBlur(props, emit);
+    const {
+      uploadUrl,
+      headers,
+      files,
+      limit,
+      onDownload,
+      onError,
+      onRemove,
+      onSuccess,
+      beforeUpload
+    } = useIViewUpload(props, (value) => {
+      emit("change", value);
+      useInValueChange();
+    }, c);
+    const dialogImageUrl = ref([]);
+    const dialogImageUrlIndex = ref(0);
+    const dialogVisible = ref(false);
+    const uploadTag = ref(false);
+    const imageUpload = 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 = ref();
+    const cropVisible = 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 = computed(() => {
+      return limit.value === 1 && files.value.length === 1;
+    });
+    const showFormDefaultContent = computed(() => {
+      if (props.controlParams && props.controlParams.editmode === "hover" && !props.readonly) {
+        return true;
+      }
+      return false;
+    });
+    const {
+      componentRef
+    } = 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) {
+        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 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"
+    }, [createVNode("div", {
+      "class": this.ns.e("image-upload-list")
+    }, [this.files.map((item) => createVNode("div", {
+      "key": item.id,
+      "class": this.ns.e("list-item")
+    }, [createVNode("img", {
+      "src": item.base64 ? item.base64 : item.url
+    }, null), createVNode("div", {
+      "class": this.ns.e("list-item-cover")
+    }, [createVNode("ion-icon", {
+      "class": this.ns.e("preview-icon"),
+      "onClick": () => this.onPreview(item),
+      "name": "search"
+    }, null), createVNode("ion-icon", {
+      "class": this.ns.e("download-icon"),
+      "onClick": () => this.onDownload(item),
+      "name": "download"
+    }, null), createVNode("ion-icon", {
+      "class": this.ns.e("remove-icon"),
+      "onClick": () => this.onRemove(item),
+      "name": "remove"
+    }, null)])]))]), createVNode(resolveComponent("el-upload"), 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: () => [createVNode("ion-icon", {
+        "name": "add-outline",
+        "class": this.ns.e("image-upload-add")
+      }, null)]
+    }), createVNode(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 createVNode(resolveComponent("iBizCropping"), mergeProps({
+          "img": this.tempFileList,
+          "onChange": this.cropChange
+        }, this.cropRect), null);
+      }
+    }), this.dialogVisible ? createVNode(resolveComponent("el-image-viewer"), 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]);
+  }
+});
+
+export { IBizImageCropping };

package/es/editor/upload/ibiz-image-preview/ibiz-image-preview.d.ts

@@ -26,8 +26,10 @@ export declare const IBizImagePreview: import("vue").DefineComponent<{
     ns: import("@ibiz-template/core").Namespace;
     c: UploadEditorController;
     showFormDefaultContent: import("vue").ComputedRef<boolean>;
+    previewList: import("vue").ComputedRef<(string | undefined)[]>;
+    onClick: (event: MouseEvent) => void;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    change: (_value: unknown, _name?: string | undefined) => boolean;
+    change: (_value: unknown, _name?: string | undefined, _ignore?: boolean | undefined) => boolean;
     blur: (_event?: IData | undefined) => boolean;
     focus: (_event?: IData | undefined) => boolean;
     enter: (_event?: IData | undefined) => boolean;
@@ -57,7 +59,7 @@ export declare const IBizImagePreview: import("vue").DefineComponent<{
 }>> & {
     onFocus?: ((_event?: IData | undefined) => any) | undefined;
     onBlur?: ((_event?: IData | undefined) => any) | undefined;
-    onChange?: ((_value: unknown, _name?: string | undefined) => any) | undefined;
+    onChange?: ((_value: unknown, _name?: string | undefined, _ignore?: boolean | undefined) => any) | undefined;
     onEnter?: ((_event?: IData | undefined) => any) | undefined;
     onInfoTextChange?: ((_text: string) => any) | undefined;
 }, {