@newview/file-ui 1.1.37 → 1.1.39

package/README.md

@@ -1,3 +1,7 @@
+## 1.1.38
+1. UploadFile 上传方式变更
+2. UploadFile 增加文件名称显示
+
 ## 1.1.36
 1. UploadFile 修改图片预览bug
 

package/dist/file-ui.js

@@ -260,6 +260,11 @@ const propDefine$6 = {
   uploadQuantity: {
     type: Number,
     default: 0
+  },
+  isShowFileName: {
+    // 是否显示文件名称
+    type: Boolean,
+    default: true
   }
 };
 const _sfc_main$6 = defineComponent({
@@ -288,7 +293,8 @@ let UploadFileInstance$1 = class UploadFileInstance extends BaseInstance {
     // 当前Token
     // 响应属性 | ref、reactive、computed
     __publicField(this, "fileList", ref([]));
-    __publicField(this, "uploading", ref(false));
+    __publicField(this, "uploading", ref(true));
+    __publicField(this, "uploadingPercent", ref(0));
     __publicField(this, "uploadFilePos", reactive({}));
     // 文件上传参数
     __publicField(this, "action", ref("/FileServiceApi/Upload/file"));
@@ -309,8 +315,10 @@ let UploadFileInstance$1 = class UploadFileInstance extends BaseInstance {
       this.uploading.value = false;
       if (result.Code != "0") {
         this.message.error(result.Msg);
+        this.uploadingPercent.value = 100;
         return;
       }
+      this.uploadingPercent.value = 100;
       this.message.success("上传成功");
       this.ctx.emit("success", { token: result.Token, fileId: result.FileId });
       this.loadFileList(true);
@@ -337,10 +345,12 @@ let UploadFileInstance$1 = class UploadFileInstance extends BaseInstance {
       }
       this.uploading.value = false;
     });
+    /** 当前选择上传的分组 */
+    __publicField(this, "activeGroupName", ref(""));
     /**
      * 上传之前
      */
-    __publicField(this, "doBeforeUpload", () => {
+    __publicField(this, "doBeforeUpload", (file) => {
       return new Promise(async (resolve, reject) => {
         let flag = true;
         if (this.props.uploadQuantity > 0) {
@@ -354,10 +364,8 @@ let UploadFileInstance$1 = class UploadFileInstance extends BaseInstance {
           flag = true;
         }
         if (flag) {
-          resolve(() => {
-          });
           this.message.info("文件上传中,请稍等");
-          this.uploading.value = true;
+          this.multipartUpload(file);
         } else {
           reject();
         }
@@ -552,8 +560,7 @@ let UploadFileInstance$1 = class UploadFileInstance extends BaseInstance {
      * @param fileInfo 
      */
     __publicField(this, "doView", async (fileInfo, index = 0) => {
-      const apiResult = await this.fileInfoApi.getEntities(QueryWrapper.create().eq("Token", fileInfo.Token));
-      const result = this.utilities.parseApiResult(apiResult);
+      const result = this.fileList.value;
       this.previewFileInfo = result[index];
       this.previewVisible.value = true;
       this.previewIndex.value = this.previewIndexData[fileInfo.Id];
@@ -605,7 +612,7 @@ let UploadFileInstance$1 = class UploadFileInstance extends BaseInstance {
    */
   async loadFileList(isChange = false) {
     this.uploading.value = true;
-    const apiResult = await this.fileInfoApi.getEntities(QueryWrapper.create().eq("Token", this.currentToken));
+    const apiResult = await this.fileInfoApi.getEntities(QueryWrapper.create().eq("Token", this.currentToken).orderBy(["CreateTime"], true));
     this.fileList.value = this.utilities.parseApiResult(apiResult);
     this.uploading.value = false;
     if (isChange) {
@@ -613,6 +620,116 @@ let UploadFileInstance$1 = class UploadFileInstance extends BaseInstance {
     }
     this.setPreviewList();
   }
+  /**
+   * 文件分片上传
+   * @param file 
+   */
+  async multipartUpload(file) {
+    let _this = this;
+    let fileName = file.name;
+    let temp1 = fileName.split(".");
+    let ext = temp1[temp1.length - 1];
+    let ossContentType = this.getOssContentType(fileName);
+    let fileMark = this.utilities.getCurrentDate("YYYYMMDDHHmmss") + "." + ext;
+    let ossClient = await new OSSFileApi().getOSSClient();
+    const userInfo = this.storageInfo.getUser();
+    const business = this.storageInfo.getCurrentBusiness();
+    const module = this.storageInfo.getCurrentModule();
+    const platform = this.storageInfo.getCurrentPlatform();
+    let businessName = business ? business == null ? void 0 : business.ModuleAlias : "非业务";
+    let moduleName = module ? module == null ? void 0 : module.ModuleAlias : "非业务";
+    let moduleName2 = businessName + "/" + moduleName;
+    let FileCabinePath = (platform == null ? void 0 : platform.OssRootPath) + "/" + moduleName2 + "/";
+    let newFileName = `${FileCabinePath}${this.props.catalog}/${this.currentToken}/${fileMark}`;
+    const result = await ossClient.multipartUpload(newFileName, file, {
+      async progress(p) {
+        _this.uploadingPercent.value = (p * 100).toFixed(0);
+      },
+      mime: ossContentType
+    });
+    if (result.res.statusCode === 200) {
+      let fileInfo = {
+        "FileCabinetId": (module == null ? void 0 : module.Id) ? module == null ? void 0 : module.Id : 0,
+        "FileCabinePath": FileCabinePath,
+        "Catalog": this.props.catalog,
+        "Token": this.currentToken,
+        "GroupName": this.activeGroupName.value,
+        "FileMark": fileMark,
+        "FileName": fileName,
+        "FileExt": ext,
+        "FileSize": file.size,
+        "ExtraInfo": this.props.extraInfo,
+        "CreateUserId": userInfo == null ? void 0 : userInfo.Id,
+        "CreateUserName": userInfo == null ? void 0 : userInfo.UserName,
+        "CreateTime": this.utilities.getCurrentDate(),
+        "Id": 0
+      };
+      let infoSaveRes = this.utilities.parseApiResult(await this.fileInfoApi.save(fileInfo));
+      if (infoSaveRes) {
+        this.message.success("上传成功！");
+        this.ctx.emit("success", { token: this.currentToken, fileId: infoSaveRes });
+        this.loadFileList(true);
+        this.uploadingPercent.value = 100;
+      } else {
+        this.message.error("网络出现异常，再次上传");
+        this.uploadingPercent.value = 0;
+      }
+    } else {
+      this.message.error("网络出现异常，再次上传");
+      this.uploadingPercent.value = 0;
+    }
+  }
+  getOssContentType(fileName) {
+    if (fileName.indexOf(".bmp") > -1) {
+      return "image/bmp";
+    }
+    if (fileName.indexOf(".gif") > -1) {
+      return "image/gif";
+    }
+    if (fileName.indexOf(".jpeg") > -1 || fileName.indexOf(".jpg") > -1 || fileName.indexOf(".png") > -1) {
+      return "image/jpg";
+    }
+    if (fileName.indexOf(".html") > -1) {
+      return "text/html";
+    }
+    if (fileName.indexOf(".txt") > -1) {
+      return "text/plain";
+    }
+    if (fileName.indexOf(".vsd") > -1) {
+      return "application/vnd.visio";
+    }
+    if (fileName.indexOf(".pptx") > -1 || fileName.indexOf(".ppt") > -1) {
+      return "application/vnd.ms-powerpoint";
+    }
+    if (fileName.indexOf(".docx") > -1 || fileName.indexOf(".doc") > -1) {
+      return "application/msword";
+    }
+    if (fileName.indexOf(".xls") > -1 || fileName.indexOf(".xlsx") > -1 || fileName.indexOf(".xla") > -1) {
+      return "application/vnd.ms-excel";
+    }
+    if (fileName.indexOf(".xml") > -1) {
+      return "text/xml";
+    }
+    if (fileName.indexOf(".pdf") > -1) {
+      return "application/pdf";
+    }
+    if (fileName.indexOf(".zip") > -1) {
+      return "application/zip";
+    }
+    if (fileName.indexOf(".tar") > -1) {
+      return "application/x-tar";
+    }
+    if (fileName.indexOf(".avi") > -1) {
+      return "video/avi";
+    }
+    if (fileName.indexOf(".mp4") > -1) {
+      return "video/mp4";
+    }
+    if (fileName.indexOf(".mp3") > -1) {
+      return "audio/mp3";
+    }
+    return "application/octet-stream";
+  }
   // 私有方法 | private 方法名() {}
   /**
    * 设置预览列表
@@ -631,22 +748,29 @@ let UploadFileInstance$1 = class UploadFileInstance extends BaseInstance {
   }
   //#endregion 业务逻辑 文件预览 END
 };
-const UploadFile_vue_vue_type_style_index_0_scoped_fa1f4ac1_lang = "";
-const _withScopeId$1 = (n) => (pushScopeId("data-v-fa1f4ac1"), n = n(), popScopeId(), n);
+const UploadFile_vue_vue_type_style_index_0_scoped_6ac1e6fe_lang = "";
+const _withScopeId$1 = (n) => (pushScopeId("data-v-6ac1e6fe"), n = n(), popScopeId(), n);
 const _hoisted_1$3 = { class: "uploadFile uploadPage" };
-const _hoisted_2$3 = ["onClick", "title"];
-const _hoisted_3$3 = { class: "file-upload-list-cover" };
-const _hoisted_4$2 = { class: "file-upload-btn" };
+const _hoisted_2$3 = ["title"];
+const _hoisted_3$3 = ["onClick"];
+const _hoisted_4$2 = { class: "file-upload-list-cover" };
 const _hoisted_5$2 = {
-  key: 1,
+  key: 0,
+  class: "file-upload-list-name nv-text-nowrap"
+};
+const _hoisted_6$2 = { class: "file-upload-loading" };
+const _hoisted_7$2 = /* @__PURE__ */ _withScopeId$1(() => /* @__PURE__ */ createElementVNode("div", null, "上传进度", -1));
+const _hoisted_8$2 = ["onClick"];
+const _hoisted_9$2 = {
+  key: 2,
   class: "nv-flex",
   style: { "color": "#949494", "border": "1px dashed #dcdee2", "height": "60px", "padding": "0 20px", "font-size": "16px", "justify-content": "center" }
 };
-const _hoisted_6$2 = {
+const _hoisted_10$2 = {
   class: "nv-flex",
   style: { "width": "40px", "margin-right": "6px" }
 };
-const _hoisted_7$2 = {
+const _hoisted_11$2 = {
   t: "1706683071705",
   class: "icon",
   viewBox: "0 0 1566 1024",
@@ -655,19 +779,21 @@ const _hoisted_7$2 = {
   "p-id": "4559",
   style: { "fill": "currentColor" }
 };
-const _hoisted_8$2 = /* @__PURE__ */ _withScopeId$1(() => /* @__PURE__ */ createElementVNode("path", {
+const _hoisted_12$2 = /* @__PURE__ */ _withScopeId$1(() => /* @__PURE__ */ createElementVNode("path", {
   d: "M156.661991 699.757959h21.096999a10.443999 10.443999 0 0 1 10.235999 10.443999c0 5.765-4.491 10.443999-10.235999 10.444h-21.096999v21.097999a10.443999 10.443999 0 0 1-10.444 10.234999 10.276999 10.276999 0 0 1-10.443999-10.234999v-21.097999h-21.096999a10.443999 10.443999 0 0 1-10.234999-10.444c0-5.765 4.49-10.443999 10.234999-10.443999h21.096999v-21.096999a10.443999 10.443999 0 0 1 10.443999-10.234999c5.765 0 10.443999 4.49 10.444 10.234999v21.096999z m1378.627919-83.552995v-21.096999a10.276999 10.276999 0 0 0-10.443999-10.234999 10.443999 10.443999 0 0 0-10.444 10.234999v21.096999h-21.096998a10.276999 10.276999 0 0 0-10.235 10.443999c0 5.598 4.595 10.443999 10.235 10.444h21.096998v21.096998c0 5.745 4.679 10.235999 10.444 10.236a10.443999 10.443999 0 0 0 10.443999-10.236v-21.096998h21.097999c5.744 0 10.234999-4.679 10.234999-10.444a10.443999 10.443999 0 0 0-10.234999-10.443999h-21.097999zM776.459955 960.861944H250.596985a20.804999 20.804999 0 0 1-20.825998-20.887999c0-11.529999 9.462999-20.888999 20.825998-20.888999h94.727995a83.009995 83.009995 0 0 1-11.112-41.671997v-605.969965a83.489995 83.489995 0 0 1 83.636996-83.447995h62.580996v-20.992999a83.489995 83.489995 0 0 1 83.636995-83.448995h501.151971a83.448995 83.448995 0 0 1 83.636995 83.448995v605.969965c0 15.184999-4.053 29.409998-11.134 41.671997h115.553994c11.551999 0 20.909999 9.273999 20.909998 20.887999 0 11.529999-9.295999 20.887999-20.888998 20.887999h-250.659986v20.992999c0 15.185999-4.052 29.409998-11.132999 41.671997h11.195999c11.488999 0 20.825999 9.274999 20.825999 20.888999 0 11.529999-9.462999 20.887999-20.825999 20.887999H892.807948a41.657998 41.657998 0 0 1-6.413 50.862997 41.671998 41.671998 0 0 1-59.071996 0l-50.862997-50.862997z m76.367995-41.776998h66.423996c22.977999 0 41.609998-18.589999 41.609998-41.879997V270.460984c0-22.559999-18.047999-40.689998-40.313998-40.689997H416.303976c-22.266999 0-40.314998 18.213999-40.314998 40.689997v606.741965c0 23.123999 18.799999 41.880998 41.589998 41.880997h317.083981l-10.736999-10.756999a41.692998 41.692998 0 0 1-10.862-40.376998l-19.718999-19.739999a146.259991 146.259991 0 0 1-190.980988-220.516987 146.217991 146.217991 0 0 1 220.517987 190.980989l19.738998 19.739999a41.629998 41.629998 0 0 1 40.376998 10.839999l69.829996 69.829996z m149.809991-104.440994h62.852997a41.796998 41.796998 0 0 0 41.589997-41.776997v-605.759965c0-23.144999-18.632999-41.776998-41.589997-41.776997H563.774967a41.796998 41.796998 0 0 0-41.566998 41.775997v20.888999h396.793977a83.448995 83.448995 0 0 1 83.636995 83.448995v543.199968zM266.326984 46.998997h31.122999c8.773999 0 15.875999 6.955 15.875999 15.665999 0 8.647999-7.102 15.665999-15.875999 15.665999h-31.122999v31.123999c0 8.772999-6.956 15.874999-15.665999 15.874999a15.769999 15.769999 0 0 1-15.666999-15.874999V78.329995H203.869988a15.728999 15.728999 0 0 1-15.874999-15.665999c0-8.647999 7.102-15.665999 15.874999-15.665999h31.122998V15.874999C234.992986 7.102 241.949986 0 250.659985 0c8.646999 0 15.665999 7.102 15.665999 15.874999V46.999997zM20.887999 939.973945c0-11.529999 9.462999-20.888999 20.825999-20.888999h125.454992c11.488999 0 20.825999 9.274999 20.825999 20.888999 0 11.529999-9.462999 20.887999-20.825999 20.887999H41.713998a20.804999 20.804999 0 0 1-20.825999-20.887999z m658.733961-135.021992A104.441994 104.441994 0 1 0 531.899969 657.229961a104.441994 104.441994 0 0 0 147.721991 147.721992z m-220.079987-491.626971a20.887999 20.887999 0 0 1 20.867999-20.888999h229.791986a20.887999 20.887999 0 1 1 0 41.776997H480.430972a20.825999 20.825999 0 0 1-20.887999-20.887998z m0 104.440994c0-11.529999 9.295999-20.887999 20.742999-20.887999H814.789952c11.446999 0 20.741999 9.273999 20.741999 20.887999 0 11.529999-9.294999 20.887999-20.741999 20.887998H480.284972a20.762999 20.762999 0 0 1-20.741999-20.887998z m0 104.441993c0-11.529999 9.316999-20.888999 20.846999-20.888998h146.301991c11.509999 0 20.845999 9.274999 20.845999 20.888998 0 11.529999-9.315999 20.887999-20.845999 20.887999H480.388972a20.804999 20.804999 0 0 1-20.845999-20.887999zM62.665996 396.877977a62.664996 62.664996 0 1 1 0-125.329993 62.664996 62.664996 0 0 1 0 125.329993z m0-31.332998a31.331998 31.331998 0 1 0 0-62.664997 31.331998 31.331998 0 0 0 0 62.664997z m1295.074924-93.996995a62.664996 62.664996 0 1 1 0-125.329993 62.664996 62.664996 0 0 1 0 125.329993z m0-31.332998a31.331998 31.331998 0 1 0 0-62.663996 31.331998 31.331998 0 0 0 0 62.663996z",
   "p-id": "4560"
 }, null, -1));
-const _hoisted_9$2 = [
-  _hoisted_8$2
+const _hoisted_13$1 = [
+  _hoisted_12$2
 ];
-const _hoisted_10$2 = { class: "file-upload-list-cover" };
-const _hoisted_11$2 = { class: "file-upload-btn" };
+const _hoisted_14$1 = { class: "file-upload-list-cover" };
+const _hoisted_15$1 = { class: "file-upload-loading" };
+const _hoisted_16$1 = /* @__PURE__ */ _withScopeId$1(() => /* @__PURE__ */ createElementVNode("div", null, "上传进度", -1));
 function _sfc_render$6(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_Image = resolveComponent("Image");
   const _component_Icon = resolveComponent("Icon");
   const _component_Space = resolveComponent("Space");
+  const _component_Circle = resolveComponent("Circle");
   const _component_Upload = resolveComponent("Upload");
   const _component_Card = resolveComponent("Card");
   const _component_Spin = resolveComponent("Spin");
@@ -681,14 +807,12 @@ function _sfc_render$6(_ctx, _cache, $props, $setup, $data, $options) {
         default: withCtx(() => [
           (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.getGroupFiles(groupName), (item, index) => {
             return openBlock(), createElementBlock("div", {
-              class: normalizeClass(
-                _ctx.isImage(item) ? "file-upload-list file-upload-list-bs" : "file-upload-list"
-              )
+              class: "file-upload-list",
+              title: item.FileName
             }, [
               createElementVNode("div", {
-                class: "file-upload-list-content",
-                onClick: ($event) => _ctx.doView(item, index),
-                title: item.FileName
+                class: normalizeClass(["file-upload-list-content", { "file-upload-list-bs": _ctx.isImage(item) }]),
+                onClick: ($event) => _ctx.doView(item, index)
               }, [
                 createVNode(_component_Image, {
                   src: _ctx.getThumbnailUrl(item),
@@ -697,7 +821,7 @@ function _sfc_render$6(_ctx, _cache, $props, $setup, $data, $options) {
                   width: "100%",
                   height: "100%"
                 }, null, 8, ["src"]),
-                createElementVNode("div", _hoisted_3$3, [
+                createElementVNode("div", _hoisted_4$2, [
                   createVNode(_component_Space, null, {
                     default: withCtx(() => [
                       createVNode(_component_Icon, {
@@ -715,41 +839,59 @@ function _sfc_render$6(_ctx, _cache, $props, $setup, $data, $options) {
                     _: 2
                   }, 1024)
                 ])
-              ], 8, _hoisted_2$3)
-            ], 2);
+              ], 10, _hoisted_3$3),
+              _ctx.isShowFileName ? (openBlock(), createElementBlock("div", _hoisted_5$2, toDisplayString(item.FileName), 1)) : createCommentVNode("", true)
+            ], 8, _hoisted_2$3);
           }), 256)),
-          !_ctx.readonly ? (openBlock(), createBlock(_component_Upload, {
+          _ctx.uploadingPercent > 0 && _ctx.uploadingPercent < 100 ? (openBlock(), createBlock(_component_Circle, {
             key: 0,
-            ref_for: true,
-            ref: "uploadRef",
-            type: "drag",
-            name: "FormFile",
-            multiple: _ctx.multiple,
-            "show-upload-list": false,
-            format: _ctx.format,
-            "max-size": _ctx.maxSize,
-            action: _ctx.action,
-            headers: _ctx.headers,
-            data: _ctx.uploadFilePos[groupName],
-            "on-success": _ctx.doSuccess,
-            "on-format-error": _ctx.doFormatError,
-            "on-exceeded-size": _ctx.doMaxSize,
-            "before-upload": _ctx.doBeforeUpload,
-            style: { "display": "inline-block", "width": "78px" }
+            size: "78",
+            percent: _ctx.uploadingPercent,
+            "stroke-color": ["#108ee9", "#87d068"]
           }, {
             default: withCtx(() => [
-              createElementVNode("div", _hoisted_4$2, [
-                createVNode(_component_Icon, {
-                  type: "ios-camera",
-                  size: "20"
-                })
+              createElementVNode("div", _hoisted_6$2, [
+                createElementVNode("div", null, toDisplayString(_ctx.uploadingPercent) + "%", 1),
+                _hoisted_7$2
               ])
             ]),
-            _: 2
-          }, 1032, ["multiple", "format", "max-size", "action", "headers", "data", "on-success", "on-format-error", "on-exceeded-size", "before-upload"])) : createCommentVNode("", true),
-          _ctx.readonly && _ctx.fileList.length == 0 ? (openBlock(), createElementBlock("div", _hoisted_5$2, [
-            createElementVNode("i", _hoisted_6$2, [
-              (openBlock(), createElementBlock("svg", _hoisted_7$2, _hoisted_9$2))
+            _: 1
+          }, 8, ["percent"])) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+            !_ctx.readonly ? (openBlock(), createBlock(_component_Upload, {
+              key: 0,
+              ref_for: true,
+              ref: "uploadRef",
+              type: "drag",
+              name: "FormFile",
+              multiple: _ctx.multiple,
+              "show-upload-list": false,
+              format: _ctx.format,
+              "max-size": _ctx.maxSize,
+              headers: _ctx.headers,
+              data: _ctx.uploadFilePos[groupName],
+              "on-success": _ctx.doSuccess,
+              "on-format-error": _ctx.doFormatError,
+              "on-exceeded-size": _ctx.doMaxSize,
+              "before-upload": _ctx.doBeforeUpload,
+              style: { "display": "inline-block", "width": "78px" }
+            }, {
+              default: withCtx(() => [
+                createElementVNode("div", {
+                  class: "file-upload-btn",
+                  onClick: ($event) => _ctx.activeGroupName = groupName
+                }, [
+                  createVNode(_component_Icon, {
+                    type: "ios-camera",
+                    size: "20"
+                  })
+                ], 8, _hoisted_8$2)
+              ]),
+              _: 2
+            }, 1032, ["multiple", "format", "max-size", "headers", "data", "on-success", "on-format-error", "on-exceeded-size", "before-upload"])) : createCommentVNode("", true)
+          ], 64)),
+          _ctx.readonly && _ctx.fileList.length == 0 ? (openBlock(), createElementBlock("div", _hoisted_9$2, [
+            createElementVNode("i", _hoisted_10$2, [
+              (openBlock(), createElementBlock("svg", _hoisted_11$2, _hoisted_13$1))
             ]),
             createElementVNode("div", null, toDisplayString(_ctx.nullMsg), 1)
           ])) : createCommentVNode("", true)
@@ -777,7 +919,7 @@ function _sfc_render$6(_ctx, _cache, $props, $setup, $data, $options) {
           width: "100%",
           height: "100%"
         }, null, 8, ["src"]),
-        createElementVNode("div", _hoisted_10$2, [
+        createElementVNode("div", _hoisted_14$1, [
           createVNode(_component_Space, null, {
             default: withCtx(() => [
               createVNode(_component_Icon, {
@@ -802,7 +944,21 @@ function _sfc_render$6(_ctx, _cache, $props, $setup, $data, $options) {
         style: { "margin-bottom": "8px" }
       }, {
         default: withCtx(() => [
-          createVNode(_component_Upload, {
+          _ctx.uploadingPercent > 0 && _ctx.uploadingPercent < 100 ? (openBlock(), createBlock(_component_Circle, {
+            key: 0,
+            size: "78",
+            percent: _ctx.uploadingPercent,
+            "stroke-color": ["#108ee9", "#87d068"]
+          }, {
+            default: withCtx(() => [
+              createElementVNode("div", _hoisted_15$1, [
+                createElementVNode("div", null, toDisplayString(_ctx.uploadingPercent) + "%", 1),
+                _hoisted_16$1
+              ])
+            ]),
+            _: 1
+          }, 8, ["percent"])) : (openBlock(), createBlock(_component_Upload, {
+            key: 1,
             ref: "uploadRef",
             type: "drag",
             name: "FormFile",
@@ -820,7 +976,10 @@ function _sfc_render$6(_ctx, _cache, $props, $setup, $data, $options) {
             style: { "display": "inline-block", "width": "78px" }
           }, {
             default: withCtx(() => [
-              createElementVNode("div", _hoisted_11$2, [
+              createElementVNode("div", {
+                class: "file-upload-btn",
+                onClick: _cache[3] || (_cache[3] = ($event) => _ctx.activeGroupName = _ctx.groups[0])
+              }, [
                 createVNode(_component_Icon, {
                   type: "ios-camera",
                   size: "20"
@@ -828,7 +987,7 @@ function _sfc_render$6(_ctx, _cache, $props, $setup, $data, $options) {
               ])
             ]),
             _: 1
-          }, 8, ["multiple", "format", "max-size", "action", "headers", "data", "on-success", "on-format-error", "on-exceeded-size", "before-upload"])
+          }, 8, ["multiple", "format", "max-size", "action", "headers", "data", "on-success", "on-format-error", "on-exceeded-size", "before-upload"]))
         ]),
         _: 1
       })) : createCommentVNode("", true)
@@ -840,14 +999,14 @@ function _sfc_render$6(_ctx, _cache, $props, $setup, $data, $options) {
     })) : createCommentVNode("", true),
     createVNode(_component_filePreview, {
       modelValue: _ctx.previewVisible,
-      "onUpdate:modelValue": _cache[3] || (_cache[3] = ($event) => _ctx.previewVisible = $event),
+      "onUpdate:modelValue": _cache[4] || (_cache[4] = ($event) => _ctx.previewVisible = $event),
       "preview-list": _ctx.previewList,
       "preview-index": _ctx.previewIndex,
       "file-info": _ctx.previewFileInfo
     }, null, 8, ["modelValue", "preview-list", "preview-index", "file-info"])
   ]);
 }
-const UploadFile = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["render", _sfc_render$6], ["__scopeId", "data-v-fa1f4ac1"]]);
+const UploadFile = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["render", _sfc_render$6], ["__scopeId", "data-v-6ac1e6fe"]]);
 var commonjsGlobal = typeof globalThis !== "undefined" ? globalThis : typeof window !== "undefined" ? window : typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : {};
 function getDefaultExportFromCjs(x) {
   return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, "default") ? x["default"] : x;
@@ -19823,9 +19982,10 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
         readonly: _ctx.getPropValue(item.uploadFileProp, "readonly") || _ctx.onlyView,
         token: _ctx.formModel[item.model],
         multiple: _ctx.getPropValue(item.uploadFileProp, "multiple"),
+        isShowFileName: _ctx.getPropValue(item.uploadFileProp, "isShowFileName"),
         uploadQuantity: _ctx.getPropValue(item.uploadFileProp, "uploadQuantity", 0),
         onReturnFileList: ($event) => _ctx.tokenList($event, item)
-      }, null, 8, ["readonly", "token", "multiple", "uploadQuantity", "onReturnFileList"])) : createCommentVNode("", true),
+      }, null, 8, ["readonly", "token", "multiple", "isShowFileName", "uploadQuantity", "onReturnFileList"])) : createCommentVNode("", true),
       item.type === "TextEditor" ? (openBlock(), createBlock(_component_TextEditor, {
         key: 1,
         ref: "textEditorRef",