@ibiz-template/mob-vue3-components 0.0.2 → 0.0.3

package/es/control/form/form-detail/form-item/form-item-container/form-item-container.css

@@ -1 +1 @@
-.ibiz-form-item-container{--ibiz-form-item-container-label-width:8.125rem;--ibiz-form-item-container-line-height:var(--ibiz-form-item-line-height);--ibiz-form-item-container-require-mark-color:var(--ibiz-color-danger);--ibiz-form-item-container-container-padding:var(--ibiz-spacing-base);--ibiz-form-item-container-left-container-padding:var(--ibiz-spacing-base);--ibiz-form-item-container-error-margin-top:var(--ibiz-spacing-extra-tight);--ibiz-form-item-container-bg-color:var(--ibiz-color-bg-1);--ibiz-form-item-container-label-font-size:var(--ibiz-font-size-header-6);--ibiz-form-item-container-label-text-color:var(--ibiz-color-text-0);--ibiz-form-item-container-container-error-padding:0 var(--ibiz-spacing-base);--ibiz-form-item-container-border:0.0625rem var(--ibiz-color-border) solid;--ibiz-form-item-container-editor-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-none) var(--ibiz-spacing-tight) var(--ibiz-spacing-none);--ibiz-form-item-label-line-height:1;--ibiz-form-item-label-font-size:var(--ibiz-font-size-header-5);--ibiz-form-item-label-text-color:var(--ibiz-color-text-0);position:relative;width:100%;height:100%;padding:var(--ibiz-form-item-container-container-padding);font-size:var(--ibiz-form-item-font-size);background-color:var(--ibiz-form-item-container-bg-color);border-width:calc(100% - var(--ibiz-spacing-base) * 2);border-radius:var(--ibiz-border-radius-small)}.ibiz-form-item-container::after{position:absolute;z-index:1;width:calc(100% - var(--ibiz-spacing-base) * 2);height:.00625rem;content:"";background-color:var(--ibiz-color-border)}.ibiz-form-item-container__label{position:relative;flex-shrink:0;width:var(--ibiz-form-item-container-label-width);overflow:visible;color:var(--ibiz-form-item-label-text-color)}.ibiz-form-item-container__label span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:inline-block;width:100%;font-size:var(--ibiz-form-item-container-label-font-size);text-align:var(--ibiz-form-item-container-label-align)}.ibiz-form-item-container__editor{width:100%;text-align:var(--ibiz-form-item-container-editor-align)}.ibiz-form-item-container__editor .van-cell{padding-bottom:0}.ibiz-form-item-container.is-required .ibiz-form-item-container__label::before{position:absolute;top:.1875rem;left:-.625rem;display:inline-block;height:100%;font-size:.875rem;color:var(--ibiz-form-item-error-color);content:"*"}.ibiz-form-item-container.is-error::after{background-color:var(--ibiz-form-item-error-color)}.ibiz-form-item-container.is-error .ibiz-form-item-container-content{border-color:var(--ibiz-form-item-error-color)}.ibiz-form-item-container--left::after{bottom:0}.ibiz-form-item-container--right.is-required .ibiz-form-item-container__label::before{right:-.625rem;left:auto}.ibiz-form-item-container--right .ibiz-form-item-container__editor{width:calc(100% - var(--ibiz-form-item-container-label-width))}.ibiz-form-item-container--left .ibiz-form-item-container__editor{width:calc(100% - var(--ibiz-form-item-container-label-width))}.ibiz-form-item-container--top .ibiz-form-item-container__editor{padding:var(--ibiz-form-item-container-editor-padding)}.ibiz-form-item-container--bottom .ibiz-form-item-container__editor{padding:var(--ibiz-form-item-container-editor-padding)}.ibiz-form-item-container-content{position:relative}.ibiz-form-item-container--left .ibiz-form-item-container-content,.ibiz-form-item-container--right .ibiz-form-item-container-content{height:100%;display:flex;align-items:center;justify-content:center}.ibiz-form-item-container-error{position:absolute;bottom:0;width:calc(100% - var(--ibiz-spacing-base));padding-right:var(--ibiz-spacing-base);font-size:var(--ibiz-form-item-error-font-size);line-height:var(--ibiz-form-item-font-size);color:var(--ibiz-form-item-error-color);text-align:var(--ibiz-form-item-container-editor-align)}
+.ibiz-form-item-container{--ibiz-form-item-container-label-width:8.125rem;--ibiz-form-item-container-line-height:var(--ibiz-form-item-line-height);--ibiz-form-item-container-require-mark-color:var(--ibiz-color-danger);--ibiz-form-item-container-container-padding:var(--ibiz-spacing-base);--ibiz-form-item-container-left-container-padding:var(--ibiz-spacing-base);--ibiz-form-item-container-error-margin-top:var(--ibiz-spacing-extra-tight);--ibiz-form-item-container-bg-color:var(--ibiz-color-bg-1);--ibiz-form-item-container-label-font-size:var(--ibiz-font-size-header-6);--ibiz-form-item-container-label-text-color:var(--ibiz-color-text-0);--ibiz-form-item-container-container-error-padding:0 var(--ibiz-spacing-base);--ibiz-form-item-container-border:0.0625rem var(--ibiz-color-border) solid;--ibiz-form-item-container-editor-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-none) var(--ibiz-spacing-tight) var(--ibiz-spacing-none);--ibiz-form-item-label-line-height:1;--ibiz-form-item-label-font-size:var(--ibiz-font-size-header-5);--ibiz-form-item-label-text-color:var(--ibiz-color-text-0);position:relative;width:100%;height:100%;padding:var(--ibiz-form-item-container-container-padding);font-size:var(--ibiz-form-item-font-size);background-color:var(--ibiz-form-item-container-bg-color);border-width:calc(100% - var(--ibiz-spacing-base) * 2);border-radius:var(--ibiz-border-radius-small)}.ibiz-form-item-container::after{position:absolute;z-index:1;width:calc(100% - var(--ibiz-spacing-base) * 2);height:.00625rem;content:"";background-color:var(--ibiz-color-border)}.ibiz-form-item-container__label{position:relative;flex-shrink:0;width:var(--ibiz-form-item-container-label-width);overflow:visible;color:var(--ibiz-form-item-label-text-color)}.ibiz-form-item-container__label span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:inline-block;width:100%;font-size:var(--ibiz-form-item-container-label-font-size);text-align:var(--ibiz-form-item-container-label-align)}.ibiz-form-item-container__editor{width:100%;text-align:var(--ibiz-form-item-container-editor-align)}.ibiz-form-item-container__editor .van-cell{padding-bottom:0}.ibiz-form-item-container.is-required .ibiz-form-item-container__label::before{position:absolute;top:.1875rem;left:-.625rem;display:inline-block;height:100%;font-size:.875rem;color:var(--ibiz-form-item-error-color);content:"*"}.ibiz-form-item-container.is-error::after{background-color:var(--ibiz-form-item-error-color)}.ibiz-form-item-container.is-error .ibiz-form-item-container-content{border-color:var(--ibiz-form-item-error-color)}.ibiz-form-item-container--left::after{bottom:0}.ibiz-form-item-container--right.is-required .ibiz-form-item-container__label::before{right:-.625rem;left:auto}.ibiz-form-item-container--right .ibiz-form-item-container__editor{position:relative;width:calc(100% - var(--ibiz-form-item-container-label-width))}.ibiz-form-item-container--left .ibiz-form-item-container__editor{width:calc(100% - var(--ibiz-form-item-container-label-width))}.ibiz-form-item-container--top .ibiz-form-item-container__editor{padding:var(--ibiz-form-item-container-editor-padding)}.ibiz-form-item-container--bottom .ibiz-form-item-container__editor{padding:var(--ibiz-form-item-container-editor-padding)}.ibiz-form-item-container-content{position:relative}.ibiz-form-item-container--left .ibiz-form-item-container-content,.ibiz-form-item-container--right .ibiz-form-item-container-content{height:100%;display:flex;align-items:center;justify-content:center}.ibiz-form-item-container-error{position:absolute;bottom:0;width:calc(100% - var(--ibiz-spacing-base));padding-right:var(--ibiz-spacing-base);font-size:var(--ibiz-form-item-error-font-size);line-height:var(--ibiz-form-item-font-size);color:var(--ibiz-form-item-error-color);text-align:var(--ibiz-form-item-container-editor-align)}

package/es/editor/data-picker/ibiz-picker-select-view/ibiz-picker-select-view.d.ts

@@ -28,7 +28,7 @@ export declare const IBizPickerSelectView: import("vue").DefineComponent<{
         [x: string]: any;
         [x: symbol]: any;
         srfsandbox?: string | undefined;
-        srfappid?: string | undefined;
+        srfappid: string;
         getOwnContext: () => IData;
         destroy: () => void;
         clone: () => IContext;

package/es/editor/upload/ibiz-file-upload/ibiz-file-upload.css

@@ -1 +1 @@
-.ibiz-file-upload{width:100%}.ibiz-file-upload .van-uploader__preview{display:none}.ibiz-file-upload .ibiz-file-upload-button{height:1.875rem}.ibiz-file-upload .ibiz-file-upload-button span{font-size:var(--ibiz-form-item-font-size);color:var(--ibiz-form-item-text-color)}.ibiz-file-upload .van-uploader__preview .van-uploader__file-icon{display:none}.ibiz-file-upload .van-uploader__preview .van-uploader__file-name{display:none}.ibiz-file-upload .ibiz-file-upload-item-cover{position:absolute;top:0;bottom:0;box-sizing:border-box;display:flex;align-items:center;justify-content:center;width:100%;font-size:.75rem;line-height:initial;color:#fff;text-align:center;background:var(--ibiz-color-overlay-bg)}.ibiz-file-upload .ibiz-file-upload-preview{width:100%}.ibiz-file-upload .ibiz-file-upload-preview-item{display:flex;align-items:center;border-bottom:.0625rem solid var(--ibiz-color-border)}.ibiz-file-upload .ibiz-file-upload-preview-item:last-child{border-width:0}.ibiz-file-upload .ibiz-file-upload-preview-item-img{width:3.125rem;min-width:3.125rem;padding:.625rem}.ibiz-file-upload .ibiz-file-upload-preview-item-img img{width:100%;height:100%;border-radius:.25rem}.ibiz-file-upload .ibiz-file-upload-preview-item-text{overflow:hidden;font-size:.875rem;text-overflow:ellipsis;white-space:nowrap}.ibiz-file-upload .ibiz-file-upload-preview-item-action{display:flex;flex-grow:1;align-items:center;justify-content:flex-end;min-width:3.125rem;color:var(--ibiz-color-overlay-bg);text-align:right}
+.ibiz-file-upload{width:100%}.ibiz-file-upload .van-uploader__preview{display:none}.ibiz-file-upload .ibiz-file-upload-button{width:1.25rem;height:1.25rem;font-size:var(--ibiz-font-size-header-4);color:var(--ibiz-color-text-2);background:0 0;border:none;border-radius:50%}.ibiz-file-upload .van-uploader__preview .van-uploader__file-icon{display:none}.ibiz-file-upload .van-uploader__preview .van-uploader__file-name{display:none}.ibiz-file-upload .ibiz-file-upload-item-cover{position:absolute;top:0;bottom:0;box-sizing:border-box;display:flex;align-items:center;justify-content:center;width:100%;font-size:.75rem;line-height:initial;color:#fff;text-align:center;background:var(--ibiz-color-overlay-bg)}.ibiz-file-upload .ibiz-file-upload-preview{width:100%;margin-top:.625rem}.ibiz-file-upload .ibiz-file-upload-preview-item{display:flex;align-items:center;justify-content:space-between;width:100%;padding:0 var(--ibiz-spacing-tight);margin-bottom:var(--ibiz-spacing-tight);background:var(--ibiz-color-disabled-bg);border-radius:var(--ibiz-border-radius-small)}.ibiz-file-upload .ibiz-file-upload-preview-item:last-child{margin:0;border-width:0}.ibiz-file-upload .ibiz-file-upload-preview-item-img{flex-shrink:0;width:2.5rem;min-width:2.5rem;height:2.5rem;padding:.375rem}.ibiz-file-upload .ibiz-file-upload-preview-item-img img{width:100%;height:100%;border-radius:.25rem}.ibiz-file-upload .ibiz-file-upload-preview-item-left{display:flex;flex-grow:1;align-items:center;width:calc(100% - 1.25rem)}.ibiz-file-upload .ibiz-file-upload-preview-item-text{display:flex;flex:1;align-items:center;width:calc(100% - 2.5rem);padding-left:var(--ibiz-spacing-tight);font-size:.875rem}.ibiz-file-upload .ibiz-file-upload-preview-item-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ibiz-file-upload .ibiz-file-upload-preview-item-action{display:flex;flex-shrink:0;align-items:center;justify-content:flex-end;width:1.25rem;color:var(--ibiz-color-overlay-bg);text-align:right}.ibiz-file-upload .van-uploader__input-wrapper{width:100%;text-align:right}.ibiz-form-item-container--top .ibiz-file-upload .van-uploader{position:absolute;top:0;right:0;width:100%}

package/es/editor/upload/ibiz-file-upload/ibiz-file-upload.d.ts

@@ -32,6 +32,9 @@ export declare const IBizFileUpload: import("vue").DefineComponent<{
     beforeUpload: () => void;
     onDownload: (file: IData) => void;
     afterRead: (file: IData | IData[]) => Promise<void>;
+    getFileSuffix: (name: string) => string;
+    getFileName: (filename: string) => string;
+    getPreviewImg: (name: string) => string;
     limit: import("vue").ComputedRef<1 | 9999>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     change: (_value: unknown, _name?: string | undefined) => boolean;

package/es/editor/upload/ibiz-file-upload/ibiz-file-upload.mjs

@@ -1,4 +1,4 @@
-import { resolveComponent, createTextVNode, createVNode, defineComponent } from 'vue';
+import { resolveComponent, createVNode, createTextVNode, defineComponent } from 'vue';
 import { getUploadProps, getEditorEmits, useNamespace } from '@ibiz-template/vue3-util';
 import './ibiz-file-upload.css';
 import { useVanUpload } from '../use/use-van-upload.mjs';
@@ -25,6 +25,27 @@ const IBizFileUpload = /* @__PURE__ */ defineComponent({
     } = useVanUpload(props, (value) => {
       emit("change", value);
     }, c);
+    const getFileSuffix = (name) => {
+      const lastDotIndex = name.lastIndexOf(".");
+      if (lastDotIndex === -1) {
+        return "";
+      }
+      const extension = name.substring(lastDotIndex + 1).toLowerCase();
+      return extension;
+    };
+    const getFileName = (filename) => {
+      const lastDotIndex = filename.lastIndexOf(".");
+      if (lastDotIndex === -1) {
+        return filename;
+      }
+      const name = filename.substring(0, lastDotIndex);
+      return name;
+    };
+    const getPreviewImg = (name) => {
+      const suffix = getFileSuffix(name);
+      const type = c.fileTypeMap.get(suffix) || "unknown";
+      return `./assets/img/file/${type}.svg`;
+    };
     return {
       ns,
       c,
@@ -35,6 +56,9 @@ const IBizFileUpload = /* @__PURE__ */ defineComponent({
       beforeUpload,
       onDownload,
       afterRead,
+      getFileSuffix,
+      getFileName,
+      getPreviewImg,
       limit
     };
   },
@@ -53,17 +77,17 @@ const IBizFileUpload = /* @__PURE__ */ defineComponent({
     }, {
       default: () => {
         return !this.readonly && !this.disabled && createVNode(resolveComponent("van-button"), {
-          "class": this.ns.b("button")
-        }, {
-          default: () => [createTextVNode("\u4E0A\u4F20\u6587\u4EF6")]
-        });
+          "class": this.ns.b("button"),
+          "icon": "add-o",
+          "type": "primary"
+        }, null);
       },
       "preview-cover": (file) => {
         return createVNode("div", {
           "class": this.ns.b("item-cover")
         }, [file.name]);
       }
-    }), createVNode("div", {
+    }), this.files.length > 0 && createVNode("div", {
       "class": this.ns.b("preview")
     }, [this.files.map((item) => {
       return createVNode("div", {
@@ -71,18 +95,25 @@ const IBizFileUpload = /* @__PURE__ */ defineComponent({
         "onClick": () => {
           this.onDownload(item);
         }
+      }, [createVNode("div", {
+        "class": this.ns.b("preview-item-left")
       }, [createVNode("div", {
         "class": this.ns.b("preview-item-img")
       }, [createVNode("img", {
-        "src": "./assets/img/file.png",
+        "src": this.getPreviewImg(item.name),
         "alt": ""
       }, null)]), createVNode("div", {
         "class": this.ns.b("preview-item-text")
-      }, [item.name]), !this.readonly && !this.disabled && createVNode("div", {
+      }, [createVNode("div", {
+        "class": this.ns.b("preview-item-name")
+      }, [this.getFileName(item.name)]), this.getFileSuffix(item.name) && createVNode("div", {
+        "class": this.ns.b("preview-item-suffix")
+      }, [createTextVNode("."), this.getFileSuffix(item.name)])])]), !this.readonly && !this.disabled && createVNode("div", {
         "class": this.ns.b("preview-item-action")
       }, [createVNode(resolveComponent("van-icon"), {
         "name": "cross",
-        "onClick": () => {
+        "onClick": (e) => {
+          e.stopPropagation();
           this.onRemove(item);
         }
       }, null)])]);

package/es/editor/upload/upload-editor.controller.d.ts

@@ -27,6 +27,14 @@ export declare class UploadEditorController extends EditorController<IFileUpload
      * 下载参数
      */
     exportParams?: IParams;
+    /**
+     * 文件类型
+     *
+     * @author zk
+     * @date 2023-12-07 03:12:25
+     * @memberof UploadEditorController
+     */
+    fileTypeMap: Map<string, string>;
     protected onInit(): Promise<void>;
     /**
      * 计算文件的上传路径和下载路径

package/es/editor/upload/upload-editor.controller.mjs

@@ -32,6 +32,56 @@ class UploadEditorController extends EditorController {
      * 下载参数
      */
     __publicField(this, "exportParams");
+    /**
+     * 文件类型
+     *
+     * @author zk
+     * @date 2023-12-07 03:12:25
+     * @memberof UploadEditorController
+     */
+    __publicField(this, "fileTypeMap", /* @__PURE__ */ new Map([
+      // word文档
+      ["docx", "docx"],
+      ["doc", "docx"],
+      ["dotx", "docx"],
+      ["dot", "docx"],
+      // pdf
+      ["pdf", "pdf"],
+      // text
+      ["txt", "text"],
+      //
+      ["xlsx", "excel"],
+      ["xls", "excel"],
+      ["xlsm", "excel"],
+      ["xlsb", "excel"],
+      ["csv", "excel"],
+      // ppt
+      ["pptx", "ppt"],
+      // 图片
+      ["jpg", "img"],
+      ["png", "img"],
+      ["gif", "img"],
+      ["bmp", "img"],
+      ["svg", "img"],
+      // 音频
+      ["mp3", "audio"],
+      ["wav", "audio"],
+      ["aac", "audio"],
+      ["flac", "audio"],
+      ["wma", "audio"],
+      // 视频
+      ["mp4", "video"],
+      ["avi", "video"],
+      ["mov", "video"],
+      ["mkv", "video"],
+      ["wmv", "video"],
+      // 压缩
+      ["zip", "zip"],
+      ["rar", "zip"],
+      ["7z", "zip"],
+      ["gz", "zip"],
+      ["tar", "zip"]
+    ]));
   }
   async onInit() {
     var _a;

package/es/editor/upload/use/use-van-upload.mjs

@@ -10,11 +10,6 @@ function useVanUpload(props, valueChange, c) {
   });
   const uploadUrl = ref("");
   const downloadUrl = ref("");
-  const uploadCache = {
-    count: 0,
-    cacheFiles: []
-    // iview上传过程中不能改default-file-list,所以需要缓存
-  };
   watch(
     () => props.value,
     (newVal) => {
@@ -56,34 +51,28 @@ function useVanUpload(props, valueChange, c) {
     { immediate: true }
   );
   const emitValue = () => {
-    const _files = [...files.value, ...uploadCache.cacheFiles];
+    const _files = [...files.value];
     const value = _files.length > 0 ? JSON.stringify(_files.map((file) => ({ name: file.name, id: file.id }))) : null;
-    uploadCache.cacheFiles = [];
     valueChange(value);
   };
   const beforeUpload = () => {
     if (!c.multiple && files.value.length === 1) {
       return false;
     }
-    uploadCache.count += 1;
     return true;
   };
   const onSuccess = (response) => {
     if (!response) {
       return;
     }
-    uploadCache.cacheFiles.push({
+    files.value.push({
       name: response.filename,
       id: response.fileid
     });
-    uploadCache.count -= 1;
-    if (uploadCache.count === 0) {
-      emitValue();
-    }
+    emitValue();
   };
   const onError = (...args) => {
     const error = args[0];
-    uploadCache.count -= 1;
     throw new HttpError({
       response: { data: JSON.parse(error.message), status: error.status }
     });

package/es/panel-component/panel-button/panel-button.controller.mjs

@@ -90,14 +90,18 @@ class PanelButtonController extends PanelItemController {
    */
   async onActionClick(event) {
     const { uiactionId } = this.model;
-    await UIActionUtil.execAndResolved(uiactionId, {
-      context: this.panel.context,
-      params: this.panel.params,
-      data: [this.data],
-      view: this.panel.view,
-      event,
-      noWaitRoute: true
-    });
+    await UIActionUtil.execAndResolved(
+      uiactionId,
+      {
+        context: this.panel.context,
+        params: this.panel.params,
+        data: [this.data],
+        view: this.panel.view,
+        event,
+        noWaitRoute: true
+      },
+      this.model.appId
+    );
   }
   calcItemVisible(data) {
     if (this.state.uiActionState.visible === false) {

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

@@ -1 +1 @@
-.ibiz-form-item-container{--ibiz-form-item-container-label-width:8.125rem;--ibiz-form-item-container-line-height:var(--ibiz-form-item-line-height);--ibiz-form-item-container-require-mark-color:var(--ibiz-color-danger);--ibiz-form-item-container-container-padding:var(--ibiz-spacing-base);--ibiz-form-item-container-left-container-padding:var(--ibiz-spacing-base);--ibiz-form-item-container-error-margin-top:var(--ibiz-spacing-extra-tight);--ibiz-form-item-container-bg-color:var(--ibiz-color-bg-1);--ibiz-form-item-container-label-font-size:var(--ibiz-font-size-header-6);--ibiz-form-item-container-label-text-color:var(--ibiz-color-text-0);--ibiz-form-item-container-container-error-padding:0 var(--ibiz-spacing-base);--ibiz-form-item-container-border:0.0625rem var(--ibiz-color-border) solid;--ibiz-form-item-container-editor-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-none) var(--ibiz-spacing-tight) var(--ibiz-spacing-none);--ibiz-form-item-label-line-height:1;--ibiz-form-item-label-font-size:var(--ibiz-font-size-header-5);--ibiz-form-item-label-text-color:var(--ibiz-color-text-0);position:relative;width:100%;height:100%;padding:var(--ibiz-form-item-container-container-padding);font-size:var(--ibiz-form-item-font-size);background-color:var(--ibiz-form-item-container-bg-color);border-width:calc(100% - var(--ibiz-spacing-base) * 2);border-radius:var(--ibiz-border-radius-small)}.ibiz-form-item-container::after{position:absolute;z-index:1;width:calc(100% - var(--ibiz-spacing-base) * 2);height:.00625rem;content:"";background-color:var(--ibiz-color-border)}.ibiz-form-item-container__label{position:relative;flex-shrink:0;width:var(--ibiz-form-item-container-label-width);overflow:visible;color:var(--ibiz-form-item-label-text-color)}.ibiz-form-item-container__label span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:inline-block;width:100%;font-size:var(--ibiz-form-item-container-label-font-size);text-align:var(--ibiz-form-item-container-label-align)}.ibiz-form-item-container__editor{width:100%;text-align:var(--ibiz-form-item-container-editor-align)}.ibiz-form-item-container__editor .van-cell{padding-bottom:0}.ibiz-form-item-container.is-required .ibiz-form-item-container__label::before{position:absolute;top:.1875rem;left:-.625rem;display:inline-block;height:100%;font-size:.875rem;color:var(--ibiz-form-item-error-color);content:"*"}.ibiz-form-item-container.is-error::after{background-color:var(--ibiz-form-item-error-color)}.ibiz-form-item-container.is-error .ibiz-form-item-container-content{border-color:var(--ibiz-form-item-error-color)}.ibiz-form-item-container--left::after{bottom:0}.ibiz-form-item-container--right.is-required .ibiz-form-item-container__label::before{right:-.625rem;left:auto}.ibiz-form-item-container--right .ibiz-form-item-container__editor{width:calc(100% - var(--ibiz-form-item-container-label-width))}.ibiz-form-item-container--left .ibiz-form-item-container__editor{width:calc(100% - var(--ibiz-form-item-container-label-width))}.ibiz-form-item-container--top .ibiz-form-item-container__editor{padding:var(--ibiz-form-item-container-editor-padding)}.ibiz-form-item-container--bottom .ibiz-form-item-container__editor{padding:var(--ibiz-form-item-container-editor-padding)}.ibiz-form-item-container-content{position:relative}.ibiz-form-item-container--left .ibiz-form-item-container-content,.ibiz-form-item-container--right .ibiz-form-item-container-content{height:100%;display:flex;align-items:center;justify-content:center}.ibiz-form-item-container-error{position:absolute;bottom:0;width:calc(100% - var(--ibiz-spacing-base));padding-right:var(--ibiz-spacing-base);font-size:var(--ibiz-form-item-error-font-size);line-height:var(--ibiz-form-item-font-size);color:var(--ibiz-form-item-error-color);text-align:var(--ibiz-form-item-container-editor-align)}
+.ibiz-form-item-container{--ibiz-form-item-container-label-width:8.125rem;--ibiz-form-item-container-line-height:var(--ibiz-form-item-line-height);--ibiz-form-item-container-require-mark-color:var(--ibiz-color-danger);--ibiz-form-item-container-container-padding:var(--ibiz-spacing-base);--ibiz-form-item-container-left-container-padding:var(--ibiz-spacing-base);--ibiz-form-item-container-error-margin-top:var(--ibiz-spacing-extra-tight);--ibiz-form-item-container-bg-color:var(--ibiz-color-bg-1);--ibiz-form-item-container-label-font-size:var(--ibiz-font-size-header-6);--ibiz-form-item-container-label-text-color:var(--ibiz-color-text-0);--ibiz-form-item-container-container-error-padding:0 var(--ibiz-spacing-base);--ibiz-form-item-container-border:0.0625rem var(--ibiz-color-border) solid;--ibiz-form-item-container-editor-padding:var(--ibiz-spacing-tight) var(--ibiz-spacing-none) var(--ibiz-spacing-tight) var(--ibiz-spacing-none);--ibiz-form-item-label-line-height:1;--ibiz-form-item-label-font-size:var(--ibiz-font-size-header-5);--ibiz-form-item-label-text-color:var(--ibiz-color-text-0);position:relative;width:100%;height:100%;padding:var(--ibiz-form-item-container-container-padding);font-size:var(--ibiz-form-item-font-size);background-color:var(--ibiz-form-item-container-bg-color);border-width:calc(100% - var(--ibiz-spacing-base) * 2);border-radius:var(--ibiz-border-radius-small)}.ibiz-form-item-container::after{position:absolute;z-index:1;width:calc(100% - var(--ibiz-spacing-base) * 2);height:.00625rem;content:"";background-color:var(--ibiz-color-border)}.ibiz-form-item-container__label{position:relative;flex-shrink:0;width:var(--ibiz-form-item-container-label-width);overflow:visible;color:var(--ibiz-form-item-label-text-color)}.ibiz-form-item-container__label span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:inline-block;width:100%;font-size:var(--ibiz-form-item-container-label-font-size);text-align:var(--ibiz-form-item-container-label-align)}.ibiz-form-item-container__editor{width:100%;text-align:var(--ibiz-form-item-container-editor-align)}.ibiz-form-item-container__editor .van-cell{padding-bottom:0}.ibiz-form-item-container.is-required .ibiz-form-item-container__label::before{position:absolute;top:.1875rem;left:-.625rem;display:inline-block;height:100%;font-size:.875rem;color:var(--ibiz-form-item-error-color);content:"*"}.ibiz-form-item-container.is-error::after{background-color:var(--ibiz-form-item-error-color)}.ibiz-form-item-container.is-error .ibiz-form-item-container-content{border-color:var(--ibiz-form-item-error-color)}.ibiz-form-item-container--left::after{bottom:0}.ibiz-form-item-container--right.is-required .ibiz-form-item-container__label::before{right:-.625rem;left:auto}.ibiz-form-item-container--right .ibiz-form-item-container__editor{position:relative;width:calc(100% - var(--ibiz-form-item-container-label-width))}.ibiz-form-item-container--left .ibiz-form-item-container__editor{width:calc(100% - var(--ibiz-form-item-container-label-width))}.ibiz-form-item-container--top .ibiz-form-item-container__editor{padding:var(--ibiz-form-item-container-editor-padding)}.ibiz-form-item-container--bottom .ibiz-form-item-container__editor{padding:var(--ibiz-form-item-container-editor-padding)}.ibiz-form-item-container-content{position:relative}.ibiz-form-item-container--left .ibiz-form-item-container-content,.ibiz-form-item-container--right .ibiz-form-item-container-content{height:100%;display:flex;align-items:center;justify-content:center}.ibiz-form-item-container-error{position:absolute;bottom:0;width:calc(100% - var(--ibiz-spacing-base));padding-right:var(--ibiz-spacing-base);font-size:var(--ibiz-form-item-error-font-size);line-height:var(--ibiz-form-item-font-size);color:var(--ibiz-form-item-error-color);text-align:var(--ibiz-form-item-container-editor-align)}

package/lib/editor/upload/ibiz-file-upload/ibiz-file-upload.cjs

@@ -27,6 +27,27 @@ const IBizFileUpload = /* @__PURE__ */ vue.defineComponent({
     } = useVanUpload.useVanUpload(props, (value) => {
       emit("change", value);
     }, c);
+    const getFileSuffix = (name) => {
+      const lastDotIndex = name.lastIndexOf(".");
+      if (lastDotIndex === -1) {
+        return "";
+      }
+      const extension = name.substring(lastDotIndex + 1).toLowerCase();
+      return extension;
+    };
+    const getFileName = (filename) => {
+      const lastDotIndex = filename.lastIndexOf(".");
+      if (lastDotIndex === -1) {
+        return filename;
+      }
+      const name = filename.substring(0, lastDotIndex);
+      return name;
+    };
+    const getPreviewImg = (name) => {
+      const suffix = getFileSuffix(name);
+      const type = c.fileTypeMap.get(suffix) || "unknown";
+      return `./assets/img/file/${type}.svg`;
+    };
     return {
       ns,
       c,
@@ -37,6 +58,9 @@ const IBizFileUpload = /* @__PURE__ */ vue.defineComponent({
       beforeUpload,
       onDownload,
       afterRead,
+      getFileSuffix,
+      getFileName,
+      getPreviewImg,
       limit
     };
   },
@@ -55,17 +79,17 @@ const IBizFileUpload = /* @__PURE__ */ vue.defineComponent({
     }, {
       default: () => {
         return !this.readonly && !this.disabled && vue.createVNode(vue.resolveComponent("van-button"), {
-          "class": this.ns.b("button")
-        }, {
-          default: () => [vue.createTextVNode("\u4E0A\u4F20\u6587\u4EF6")]
-        });
+          "class": this.ns.b("button"),
+          "icon": "add-o",
+          "type": "primary"
+        }, null);
       },
       "preview-cover": (file) => {
         return vue.createVNode("div", {
           "class": this.ns.b("item-cover")
         }, [file.name]);
       }
-    }), vue.createVNode("div", {
+    }), this.files.length > 0 && vue.createVNode("div", {
       "class": this.ns.b("preview")
     }, [this.files.map((item) => {
       return vue.createVNode("div", {
@@ -73,18 +97,25 @@ const IBizFileUpload = /* @__PURE__ */ vue.defineComponent({
         "onClick": () => {
           this.onDownload(item);
         }
+      }, [vue.createVNode("div", {
+        "class": this.ns.b("preview-item-left")
       }, [vue.createVNode("div", {
         "class": this.ns.b("preview-item-img")
       }, [vue.createVNode("img", {
-        "src": "./assets/img/file.png",
+        "src": this.getPreviewImg(item.name),
         "alt": ""
       }, null)]), vue.createVNode("div", {
         "class": this.ns.b("preview-item-text")
-      }, [item.name]), !this.readonly && !this.disabled && vue.createVNode("div", {
+      }, [vue.createVNode("div", {
+        "class": this.ns.b("preview-item-name")
+      }, [this.getFileName(item.name)]), this.getFileSuffix(item.name) && vue.createVNode("div", {
+        "class": this.ns.b("preview-item-suffix")
+      }, [vue.createTextVNode("."), this.getFileSuffix(item.name)])])]), !this.readonly && !this.disabled && vue.createVNode("div", {
         "class": this.ns.b("preview-item-action")
       }, [vue.createVNode(vue.resolveComponent("van-icon"), {
         "name": "cross",
-        "onClick": () => {
+        "onClick": (e) => {
+          e.stopPropagation();
           this.onRemove(item);
         }
       }, null)])]);

package/lib/editor/upload/ibiz-file-upload/ibiz-file-upload.css

@@ -1 +1 @@
-.ibiz-file-upload{width:100%}.ibiz-file-upload .van-uploader__preview{display:none}.ibiz-file-upload .ibiz-file-upload-button{height:1.875rem}.ibiz-file-upload .ibiz-file-upload-button span{font-size:var(--ibiz-form-item-font-size);color:var(--ibiz-form-item-text-color)}.ibiz-file-upload .van-uploader__preview .van-uploader__file-icon{display:none}.ibiz-file-upload .van-uploader__preview .van-uploader__file-name{display:none}.ibiz-file-upload .ibiz-file-upload-item-cover{position:absolute;top:0;bottom:0;box-sizing:border-box;display:flex;align-items:center;justify-content:center;width:100%;font-size:.75rem;line-height:initial;color:#fff;text-align:center;background:var(--ibiz-color-overlay-bg)}.ibiz-file-upload .ibiz-file-upload-preview{width:100%}.ibiz-file-upload .ibiz-file-upload-preview-item{display:flex;align-items:center;border-bottom:.0625rem solid var(--ibiz-color-border)}.ibiz-file-upload .ibiz-file-upload-preview-item:last-child{border-width:0}.ibiz-file-upload .ibiz-file-upload-preview-item-img{width:3.125rem;min-width:3.125rem;padding:.625rem}.ibiz-file-upload .ibiz-file-upload-preview-item-img img{width:100%;height:100%;border-radius:.25rem}.ibiz-file-upload .ibiz-file-upload-preview-item-text{overflow:hidden;font-size:.875rem;text-overflow:ellipsis;white-space:nowrap}.ibiz-file-upload .ibiz-file-upload-preview-item-action{display:flex;flex-grow:1;align-items:center;justify-content:flex-end;min-width:3.125rem;color:var(--ibiz-color-overlay-bg);text-align:right}
+.ibiz-file-upload{width:100%}.ibiz-file-upload .van-uploader__preview{display:none}.ibiz-file-upload .ibiz-file-upload-button{width:1.25rem;height:1.25rem;font-size:var(--ibiz-font-size-header-4);color:var(--ibiz-color-text-2);background:0 0;border:none;border-radius:50%}.ibiz-file-upload .van-uploader__preview .van-uploader__file-icon{display:none}.ibiz-file-upload .van-uploader__preview .van-uploader__file-name{display:none}.ibiz-file-upload .ibiz-file-upload-item-cover{position:absolute;top:0;bottom:0;box-sizing:border-box;display:flex;align-items:center;justify-content:center;width:100%;font-size:.75rem;line-height:initial;color:#fff;text-align:center;background:var(--ibiz-color-overlay-bg)}.ibiz-file-upload .ibiz-file-upload-preview{width:100%;margin-top:.625rem}.ibiz-file-upload .ibiz-file-upload-preview-item{display:flex;align-items:center;justify-content:space-between;width:100%;padding:0 var(--ibiz-spacing-tight);margin-bottom:var(--ibiz-spacing-tight);background:var(--ibiz-color-disabled-bg);border-radius:var(--ibiz-border-radius-small)}.ibiz-file-upload .ibiz-file-upload-preview-item:last-child{margin:0;border-width:0}.ibiz-file-upload .ibiz-file-upload-preview-item-img{flex-shrink:0;width:2.5rem;min-width:2.5rem;height:2.5rem;padding:.375rem}.ibiz-file-upload .ibiz-file-upload-preview-item-img img{width:100%;height:100%;border-radius:.25rem}.ibiz-file-upload .ibiz-file-upload-preview-item-left{display:flex;flex-grow:1;align-items:center;width:calc(100% - 1.25rem)}.ibiz-file-upload .ibiz-file-upload-preview-item-text{display:flex;flex:1;align-items:center;width:calc(100% - 2.5rem);padding-left:var(--ibiz-spacing-tight);font-size:.875rem}.ibiz-file-upload .ibiz-file-upload-preview-item-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ibiz-file-upload .ibiz-file-upload-preview-item-action{display:flex;flex-shrink:0;align-items:center;justify-content:flex-end;width:1.25rem;color:var(--ibiz-color-overlay-bg);text-align:right}.ibiz-file-upload .van-uploader__input-wrapper{width:100%;text-align:right}.ibiz-form-item-container--top .ibiz-file-upload .van-uploader{position:absolute;top:0;right:0;width:100%}

package/lib/editor/upload/upload-editor.controller.cjs

@@ -34,6 +34,56 @@ class UploadEditorController extends runtime.EditorController {
      * 下载参数
      */
     __publicField(this, "exportParams");
+    /**
+     * 文件类型
+     *
+     * @author zk
+     * @date 2023-12-07 03:12:25
+     * @memberof UploadEditorController
+     */
+    __publicField(this, "fileTypeMap", /* @__PURE__ */ new Map([
+      // word文档
+      ["docx", "docx"],
+      ["doc", "docx"],
+      ["dotx", "docx"],
+      ["dot", "docx"],
+      // pdf
+      ["pdf", "pdf"],
+      // text
+      ["txt", "text"],
+      //
+      ["xlsx", "excel"],
+      ["xls", "excel"],
+      ["xlsm", "excel"],
+      ["xlsb", "excel"],
+      ["csv", "excel"],
+      // ppt
+      ["pptx", "ppt"],
+      // 图片
+      ["jpg", "img"],
+      ["png", "img"],
+      ["gif", "img"],
+      ["bmp", "img"],
+      ["svg", "img"],
+      // 音频
+      ["mp3", "audio"],
+      ["wav", "audio"],
+      ["aac", "audio"],
+      ["flac", "audio"],
+      ["wma", "audio"],
+      // 视频
+      ["mp4", "video"],
+      ["avi", "video"],
+      ["mov", "video"],
+      ["mkv", "video"],
+      ["wmv", "video"],
+      // 压缩
+      ["zip", "zip"],
+      ["rar", "zip"],
+      ["7z", "zip"],
+      ["gz", "zip"],
+      ["tar", "zip"]
+    ]));
   }
   async onInit() {
     var _a;

package/lib/editor/upload/use/use-van-upload.cjs

@@ -12,11 +12,6 @@ function useVanUpload(props, valueChange, c) {
   });
   const uploadUrl = vue.ref("");
   const downloadUrl = vue.ref("");
-  const uploadCache = {
-    count: 0,
-    cacheFiles: []
-    // iview上传过程中不能改default-file-list,所以需要缓存
-  };
   vue.watch(
     () => props.value,
     (newVal) => {
@@ -58,34 +53,28 @@ function useVanUpload(props, valueChange, c) {
     { immediate: true }
   );
   const emitValue = () => {
-    const _files = [...files.value, ...uploadCache.cacheFiles];
+    const _files = [...files.value];
     const value = _files.length > 0 ? JSON.stringify(_files.map((file) => ({ name: file.name, id: file.id }))) : null;
-    uploadCache.cacheFiles = [];
     valueChange(value);
   };
   const beforeUpload = () => {
     if (!c.multiple && files.value.length === 1) {
       return false;
     }
-    uploadCache.count += 1;
     return true;
   };
   const onSuccess = (response) => {
     if (!response) {
       return;
     }
-    uploadCache.cacheFiles.push({
+    files.value.push({
       name: response.filename,
       id: response.fileid
     });
-    uploadCache.count -= 1;
-    if (uploadCache.count === 0) {
-      emitValue();
-    }
+    emitValue();
   };
   const onError = (...args) => {
     const error = args[0];
-    uploadCache.count -= 1;
     throw new core.HttpError({
       response: { data: JSON.parse(error.message), status: error.status }
     });

package/lib/panel-component/panel-button/panel-button.controller.cjs

@@ -92,14 +92,18 @@ class PanelButtonController extends runtime.PanelItemController {
    */
   async onActionClick(event) {
     const { uiactionId } = this.model;
-    await runtime.UIActionUtil.execAndResolved(uiactionId, {
-      context: this.panel.context,
-      params: this.panel.params,
-      data: [this.data],
-      view: this.panel.view,
-      event,
-      noWaitRoute: true
-    });
+    await runtime.UIActionUtil.execAndResolved(
+      uiactionId,
+      {
+        context: this.panel.context,
+        params: this.panel.params,
+        data: [this.data],
+        view: this.panel.view,
+        event,
+        noWaitRoute: true
+      },
+      this.model.appId
+    );
   }
   calcItemVisible(data) {
     if (this.state.uiActionState.visible === false) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ibiz-template/mob-vue3-components",
-  "version": "0.0.2",
+  "version": "0.0.3",
   "description": "使用 rollup 编译 vue 组件或者 jsx",
   "main": "lib/index.cjs",
   "module": "es/index.mjs",
@@ -24,11 +24,11 @@
   },
   "dependencies": {
     "@ibiz-template-package/vs-tree-ex": "^0.1.1",
-    "@ibiz-template/core": "^0.4.5",
-    "@ibiz-template/model-helper": "^0.4.5",
-    "@ibiz-template/runtime": "^0.4.5",
+    "@ibiz-template/core": "^0.4.6",
+    "@ibiz-template/model-helper": "^0.4.8",
+    "@ibiz-template/runtime": "^0.4.8",
     "@ibiz-template/theme": "^0.4.0",
-    "@ibiz-template/vue3-util": "^0.4.5",
+    "@ibiz-template/vue3-util": "^0.4.8",
     "@ibiz/model-core": "^0.0.26",
     "async-validator": "^4.2.5",
     "cherry-markdown": "^0.8.26",