@lambo-design/upload-file 1.0.0-beta.15 → 1.0.0-beta.17

package/CHANGELOG.md

@@ -1,13 +1,27 @@
 # Changelog
-## [1.0.0-beta.15](http://git.inspur.com/ecbh/lambo-design/lambo-design/-/compare/@lambo-design/upload-file@1.0.0-beta.14...@lambo-design/upload-file@1.0.0-beta.15) (2024-04-18)
+## [1.0.0-beta.17](http://git.inspur.com/ecbh/lambo-design/lambo-design/-/compare/@lambo-design/upload-file@1.0.0-beta.16...@lambo-design/upload-file@1.0.0-beta.17) (2024-06-04)
 
 
 ### ✨ Features | 新功能
 
-* **@lambo-design/upload-file:** 修改工具类方法引用路径 ([d48b381](http://git.inspur.com/ecbh/lambo-design/lambo-design/-/commit/d48b38109bbdb96b0e21128bf93e5ba85b8248bb))
+* **upload-file:** 增加文件编码列表fileIdList、限制文件上传数量limitFileNum属性 ([9c0b631](http://git.inspur.com/ecbh/lambo-design/lambo-design/-/commit/9c0b6310b797503c574a7f32e90768e9912a5c4e))
 
-## [1.0.0-beta.14](http://git.inspur.com/ecbh/lambo-design/lambo-design/-/compare/@lambo-design/upload-file@1.0.0-beta.13...@lambo-design/upload-file@1.0.0-beta.14) (2024-04-13)
+## [1.0.0-beta.16](http://git.inspur.com/ecbh/lambo-design/lambo-design/-/compare/@lambo-design/upload-file@1.0.0-beta.15...@lambo-design/upload-file@1.0.0-beta.16) (2024-05-31)
 
-## [1.0.0-beta.13](http://git.inspur.com/ecbh/lambo-design/lambo-design/-/compare/@lambo-design/upload-file@1.0.0-beta.12...@lambo-design/upload-file@1.0.0-beta.13) (2024-04-12)
 
-## 1.0.0-beta.12 (2024-04-12)
+### ✨ Features | 新功能
+
+* **upload-file:** 上传文件优化 ([0b71962](http://git.inspur.com/ecbh/lambo-design/lambo-design/-/commit/0b71962bba818f01c573f19eed57bd81e758e1ac))
+
+## [1.0.0-beta.15](http://git.inspur.com/ecbh/lambo-design/lambo-design/-/compare/@lambo-design/upload-file@1.0.0-beta.14...@lambo-design/upload-file@1.0.0-beta.15) (2024-04-18)
+
+
+### ✨ Features | 新功能
+
+* **@lambo-design/upload-file:** 修改工具类方法引用路径 ([d48b381](http://git.inspur.com/ecbh/lambo-design/lambo-design/-/commit/d48b38109bbdb96b0e21128bf93e5ba85b8248bb))
+
+## [1.0.0-beta.14](http://git.inspur.com/ecbh/lambo-design/lambo-design/-/compare/@lambo-design/upload-file@1.0.0-beta.13...@lambo-design/upload-file@1.0.0-beta.14) (2024-04-13)
+
+## [1.0.0-beta.13](http://git.inspur.com/ecbh/lambo-design/lambo-design/-/compare/@lambo-design/upload-file@1.0.0-beta.12...@lambo-design/upload-file@1.0.0-beta.13) (2024-04-12)
+
+## 1.0.0-beta.12 (2024-04-12)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lambo-design/upload-file",
-  "version": "1.0.0-beta.15",
+  "version": "1.0.0-beta.17",
   "description": "",
   "main": "index.js",
   "author": "lambo",
@@ -12,8 +12,8 @@
   "devDependencies": {
     "axios": "^0.24.0",
     "axios-cache-plugin": "^0.1.0",
-    "@lambo-design/core": "^4.7.1-beta.130",
-    "@lambo-design/shared": "^1.0.0-beta.158"
+    "@lambo-design/shared": "^1.0.0-beta.183",
+    "@lambo-design/core": "^4.7.1-beta.139"
   },
   "scripts": {
     "release": "pnpm release-beta && git push --follow-tags && pnpm re-publish",

package/src/index.vue

@@ -15,13 +15,13 @@
            :multiple="multiple"
            :accept="accept"
            @change="readFile($event, 1)"/>
-      <div class="upload-file-list" v-if="showFileList && resultList.length > 0">
+    <div class="upload-file-list" v-if="showFileList && resultList.length > 0">
       <List border size="small">
         <ListItem v-for="item in resultList" :key="item.fileCode">
           <div span="21">
             <a :href="item.fileUrl ? item.fileUrl : downloadUrl + item.fileCode">
-              {{item.fileName}}
-              <span class="size" style="margin-left: 5px" v-if="item.showSize">({{item.showSize}})</span>
+              {{ item.fileName }}
+              <span class="size" style="margin-left: 5px" v-if="item.showSize">({{ item.showSize }})</span>
             </a>
           </div>
           <div span="3" style="text-align: right">
@@ -35,7 +35,7 @@
 </template>
 
 <script>
-import axios from 'axios';
+import ajax from "@lambo-design/shared/utils/ajax";
 import config from "@lambo-design/shared/config/config";
 import {formatterSizeUnit} from "@lambo-design/shared/utils/file";
 
@@ -64,6 +64,12 @@ export default {
       type: Boolean,
       default: false
     },
+    //限制上传数量
+    limitFileNum: {
+      type: Number,
+      required: false,
+      default: 0
+    },
     //是否按钮形式
     uploadBtn: {
       type: Boolean,
@@ -88,6 +94,14 @@ export default {
       required: false,
       default: ""
     },
+    //文件编码列表
+    fileIdList: {
+      type: Array,
+      required: false,
+      default: () => {
+        return []
+      }
+    },
     //文件列表
     fileList: {
       type: Array,
@@ -102,24 +116,24 @@ export default {
       default: ''
     },
     //上传文件Url
-    ossFilePutUrl:{
+    ossFilePutUrl: {
       type: String,
       default: "/oss/file/put"
     },
     //获取文件url
-    ossFileGetUrl:{
-      type:String,
-      default:"/oss/file/get/"
+    ossFileGetUrl: {
+      type: String,
+      default: "/oss/file/get/"
     },
     //文件预览所需文件流服务host
-    fileOnlinePreviewHost:{
+    fileOnlinePreviewHost: {
       type: String,
       default: "http://pub-manage-server:8080"
     },
     //预览文件url
-    ossFilePreviewUrl:{
-      type:String,
-      default:"/anon/oss/file/getObjToOutputStream/"
+    ossFilePreviewUrl: {
+      type: String,
+      default: "/anon/oss/file/getObjToOutputStream/"
     }
   },
 
@@ -145,18 +159,21 @@ export default {
   },
   methods: {
     UploadFile: function () {
-      this.$refs.uploadInput.click();
-      this.loading=true;
+      if (this.limitFileNum !== 0 && this.resultList.length > this.limitFileNum) {
+        alert('最多只能上传' + this.limitFileNum + '个文件');
+      } else {
+        this.$refs.uploadInput.click();
+      }
     },
     readFile: function (e, num) {
       let self = this;
       //读取文件
-      // var file = e.target.files[0];
+      self.loading = true;
       for (let file of e.target.files) {
-        // fileSuffix
-        var reg = new RegExp("\.(" + this.fileSuffix + ")$", "i");
+        const reg = new RegExp("\.(" + this.fileSuffix + ")$", "i");
         if (!reg.test(file.name)) {
           alert('文件类型必须是doc，docx，txt，xls，xlsx，jpg，jpeg，png中的一种');
+          self.loading = false;
           return false;
         } else {
           self.attachmentFile.fileName = file;
@@ -168,33 +185,31 @@ export default {
           }
         }
         self.attachmentFile.fileType = self.attachmentFile.fileName.name.substring(self.attachmentFile.fileName.name.lastIndexOf(".") + 1);
-
       }
-      // self.loading = true;
-      self.loadtoServer();
+      self.doUpload();
     },
-    loadtoServer: function () {
-      var self = this;
-      let inputDOM = this.$refs.uploadInput;
-      var afile = inputDOM.files;
-      if (afile.size == 0) {
+    doUpload: function () {
+      let self = this;
+      const allFile = this.$refs.uploadInput.files;
+      if (allFile.size === 0) {
         alert("不能传入空文件");
+        self.loading = false;
         return false;
       }
       let formData = new FormData();
-      for (let file of afile) {
+      for (let file of allFile) {
         formData.append('file', file);
       }
       let resultList = [];
-      let uploadUrl = self.ossServerContext + self.ossFilePutUrl;
-      let downloadUrl = self.ossServerContext + self.ossFileGetUrl;
-      axios.post(uploadUrl, formData).then(response => {
-        if (response.data.code == "1") {
-          var result = response.data.data;
+      const uploadUrl = self.ossServerContext + self.ossFilePutUrl;
+      const downloadUrl = self.ossServerContext + self.ossFileGetUrl;
+      ajax.post(uploadUrl, formData, { payload: true }).then(response => {
+        if (response.data.code === 1) {
+          const result = response.data.data;
           self.loading = false;
           if (result.length >= 1) {
             result.forEach(item => {
-              let tmp = {
+              const tmp = {
                 fileUrl: downloadUrl + item.fileId,
                 fileCode: item.fileId,
                 fileName: item.fileName,
@@ -203,7 +218,6 @@ export default {
                 showSize: formatterSizeUnit(item.length),
                 otherParam: self.otherParam
               };
-
               resultList.push(tmp);
               self.resultList.push(tmp);
             });
@@ -226,34 +240,29 @@ export default {
 
     encode64(value) {
       let typeValue = typeof value;
-      if (typeValue == 'string' || typeValue == 'number') {
+      if (typeValue === 'string' || typeValue === 'number') {
         return window.btoa(
-            window.encodeURIComponent(value)
-                .replace(/%([0-9A-F]{2})/g,
-                    function toSolidBytes(match, p1) {
-                      return String.fromCharCode('0x' + p1);
-                    }
-                )
-        );
+          window.encodeURIComponent(value)
+            .replace(/%([0-9A-F]{2})/g,
+              function toSolidBytes(match, p1) {
+                return String.fromCharCode('0x' + p1);
+              }));
       } else {
         return value;
       }
     },
     previewFile: function (item) {
-      var fileCode = item.fileCode;
-      var fileName = item.fileName;
-      var fileType = item.fileType;
-      if(fileCode) {
-        let url = this.fileOnlinePreviewHost + this.ossServerContext + this.ossFilePreviewUrl + fileCode + "?fullfilename=" + fileName + "." + fileType;
-        window.open(config.fileOnlinePreviewContext + '/onlinePreview?url='+encodeURIComponent(this.encode64(url)));
+      if (item.fileCode) {
+        const url = this.fileOnlinePreviewHost + this.ossServerContext + this.ossFilePreviewUrl + item.fileCode + "?fullfilename=" + item.fileName + "." + item.fileType;
+        window.open(config.fileOnlinePreviewContext + '/onlinePreview?url=' + encodeURIComponent(this.encode64(url)));
       }
     },
     deleteFile: function (fileCode) {
       if (fileCode) {
-        var result = [];
-        var deletes = []
+        let result = [];
+        let deletes = []
         this.resultList.forEach(item => {
-          if (item.fileCode != fileCode) {
+          if (item.fileCode !== fileCode) {
             result.push(item);
           } else {
             deletes.push(item)
@@ -266,12 +275,50 @@ export default {
           this.$emit("upload-result", this.resultList, deletes);
         }
       }
+    },
+    initFileList: function (value) {
+      if (this.resultList.length === 0) {
+        let requests = []
+        for (const fileId of value) {
+          requests.push(ajax.get(config.upmsServerContext + "/oss/file/getMetaData/" + fileId))
+        }
+        Promise.all(requests).then((response) => {
+          response.forEach(item => {
+            this.resultList.push({
+              fileCode: item.data.data.fileId,
+              fileUrl: this.ossServerContext + this.ossFileGetUrl + item.data.data.fileId,
+              fileName: item.data.data.fileName,
+              fileType: item.data.data.fileName.substring(item.data.data.fileName.lastIndexOf(".") + 1),
+              size: item.data.data.length,
+              showSize: formatterSizeUnit(item.data.data.length),
+              otherParam: this.otherParam
+            })
+          })
+        });
+      }
+    },
+    arraysEqual(arr1, arr2) {
+      if (arr1.length !== arr2.length) return false;
+      for (let i = 0; i < arr1.length; i++) {
+        if (arr1[i] !== arr2[i]) return false;
+      }
+      return true;
     }
   },
   watch: {
-    fileList: function (value) {
-      var data = this.fileList;
-      this.resultList = data;
+    fileList: {
+      handler: function (value) {
+        this.resultList = this.fileList
+      },
+      deep: true
+    },
+    fileIdList: {
+      handler: function (newValue, oldValue) {
+        if (newValue.length > 0 && !this.arraysEqual(newValue, oldValue)) {
+          this.initFileList(newValue)
+        }
+      },
+      deep: true
     }
   }
 }