1、文件上传功能重构

2、实现签到删除 3、实现签到表格处弹性布局 4、库存删除问题修正
2024-12-16 08:02:05 +08:00
parent ba0d565424
commit de37820973
28 changed files with 1292 additions and 91 deletions
--- a/ruoyi-ui/src/components/FileUpload/index.vue
+++ b/ruoyi-ui/src/components/FileUpload/index.vue
@@ -28,7 +28,7 @@
    <!-- 文件列表 -->
    <transition-group class="upload-file-list el-upload-list el-upload-list--text" name="el-fade-in-linear" tag="ul">
      <li :key="file.url" class="el-upload-list__item ele-upload-list__item-content" v-for="(file, index) in fileList">
-        <el-link :href="`${file.url}`" :underline="false" target="_blank">
+        <el-link :href="`${baseUrl}${file.url}`" :underline="false" target="_blank">
          <span class="el-icon-document"> {{ getFileName(file.name) }} </span>
        </el-link>
        <div class="ele-upload-list__item-content-action">
@@ -41,7 +41,6 @@

 <script>
 import { getToken } from "@/utils/auth";
-import { listByIds, delOss } from "@/api/system/oss";

 export default {
  name: "FileUpload",
@@ -56,12 +55,12 @@ export default {
    // 大小限制(MB)
    fileSize: {
      type: Number,
-      default: 100,
+      default: 5,
    },
    // 文件类型, 例如['png', 'jpg', 'jpeg']
    fileType: {
      type: Array,
-      default: () => ["doc", "docx", "xls","pdf","xlsx"],
+      default: () => ["doc", "xls", "ppt", "txt", "pdf","docx", "xlsx"],
    },
    // 是否显示提示
    isShowTip: {
@@ -74,7 +73,7 @@ export default {
      number: 0,
      uploadList: [],
      baseUrl: process.env.VUE_APP_BASE_API,
-      uploadFileUrl: process.env.VUE_APP_BASE_API + "/system/oss/upload", // 上传文件服务器地址
+      uploadFileUrl: process.env.VUE_APP_BASE_API + "/common/upload", // 上传文件服务器地址
      headers: {
        Authorization: "Bearer " + getToken(),
      },
@@ -83,24 +82,16 @@ export default {
  },
  watch: {
    value: {
-      async handler(val) {
+      handler(val) {
        if (val) {
          let temp = 1;
          // 首先将值转为数组
-          let list;
-          if (Array.isArray(val)) {
-            list = val;
-          } else {
-            await listByIds(val).then(res => {
-              list = res.data.map(oss => {
-                oss = { name: oss.originalName, url: oss.url, ossId: oss.ossId };
-                return oss;
-              });
-            })
-          }
+          const list = Array.isArray(val) ? val : this.value.split(',');
          // 然后将数组转为对象数组
          this.fileList = list.map(item => {
-            item = { name: item.name, url: item.url, ossId: item.ossId };
+            if (typeof item === "string") {
+              item = { name: item, url: item };
+            }
            item.uid = item.uid || new Date().getTime() + temp++;
            return item;
          });
@@ -156,7 +147,7 @@ export default {
    // 上传成功回调
    handleUploadSuccess(res, file) {
      if (res.code === 200) {
-        this.uploadList.push({ name: res.data.fileName, url: res.data.url, ossId: res.data.ossId });
+        this.uploadList.push({ name: res.fileName, url: res.fileName });
        this.uploadedSuccessfully();
      } else {
        this.number--;
@@ -168,8 +159,6 @@ export default {
    },
    // 删除文件
    handleDelete(index) {
-      let ossId = this.fileList[index].ossId;
-      delOss(ossId);
      this.fileList.splice(index, 1);
      this.$emit("input", this.listToString(this.fileList));
    },
@@ -197,11 +186,11 @@ export default {
      let strs = "";
      separator = separator || ",";
      for (let i in list) {
-        strs += list[i].ossId + separator;
+        strs += list[i].url + separator;
      }
-      return strs != "" ? strs.substr(0, strs.length - 1) : "";
-    },
-  },
+      return strs != '' ? strs.substr(0, strs.length - 1) : '';
+    }
+  }
 };
 </script>

--- a/ruoyi-ui/src/components/ImageUpload/index.vue
+++ b/ruoyi-ui/src/components/ImageUpload/index.vue
@@ -44,7 +44,6 @@

 <script>
 import { getToken } from "@/utils/auth";
-import { listByIds, delOss } from "@/api/system/oss";

 export default {
  props: {
@@ -56,7 +55,7 @@ export default {
    },
    // 大小限制(MB)
    fileSize: {
-       type: Number,
+      type: Number,
      default: 5,
    },
    // 文件类型, 例如['png', 'jpg', 'jpeg']
@@ -78,7 +77,7 @@ export default {
      dialogVisible: false,
      hideUpload: false,
      baseUrl: process.env.VUE_APP_BASE_API,
-      uploadImgUrl: process.env.VUE_APP_BASE_API + "/system/oss/upload", // 上传的图片服务器地址
+      uploadImgUrl: process.env.VUE_APP_BASE_API + "/common/upload", // 上传的图片服务器地址
      headers: {
        Authorization: "Bearer " + getToken(),
      },
@@ -87,21 +86,19 @@ export default {
  },
  watch: {
    value: {
-      async handler(val) {
+      handler(val) {
        if (val) {
          // 首先将值转为数组
-          let list;
-          if (Array.isArray(val)) {
-            list = val;
-          } else {
-            await listByIds(val).then(res => {
-              list = res.data;
-            })
-          }
+          const list = Array.isArray(val) ? val : this.value.split(',');
          // 然后将数组转为对象数组
          this.fileList = list.map(item => {
-            // 此处name使用ossId 防止删除出现重名
-            item = { name: item.ossId, url: item.url, ossId: item.ossId };
+            if (typeof item === "string") {
+              if (item.indexOf(this.baseUrl) === -1) {
+                item = { name: this.baseUrl + item, url: this.baseUrl + item };
+              } else {
+                item = { name: item, url: item };
+              }
+            }
            return item;
          });
        } else {
@@ -128,7 +125,7 @@ export default {
        if (file.name.lastIndexOf(".") > -1) {
          fileExtension = file.name.slice(file.name.lastIndexOf(".") + 1);
        }
-        isImg = this.fileType.some((type) => {
+        isImg = this.fileType.some(type => {
          if (file.type.indexOf(type) > -1) return true;
          if (fileExtension && fileExtension.indexOf(type) > -1) return true;
          return false;
@@ -158,7 +155,7 @@ export default {
    // 上传成功回调
    handleUploadSuccess(res, file) {
      if (res.code === 200) {
-        this.uploadList.push({ name: res.data.fileName, url: res.data.url, ossId: res.data.ossId });
+        this.uploadList.push({name: res.fileName, url: res.fileName});
        this.uploadedSuccessfully();
      } else {
        this.number--;
@@ -171,15 +168,13 @@ export default {
    // 删除图片
    handleDelete(file) {
      const findex = this.fileList.map(f => f.name).indexOf(file.name);
-      if(findex > -1) {
-        let ossId = this.fileList[findex].ossId;
-        delOss(ossId);
+      if (findex > -1) {
        this.fileList.splice(findex, 1);
        this.$emit("input", this.listToString(this.fileList));
      }
    },
    // 上传失败
-    handleUploadError(res) {
+    handleUploadError() {
      this.$modal.msgError("上传图片失败，请重试");
      this.$modal.closeLoading();
    },
@@ -203,11 +198,11 @@ export default {
      let strs = "";
      separator = separator || ",";
      for (let i in list) {
-        if (list[i].ossId) {
-          strs += list[i].ossId + separator;
+        if (list[i].url) {
+          strs += list[i].url.replace(this.baseUrl, "") + separator;
        }
      }
-      return strs != "" ? strs.substr(0, strs.length - 1) : "";
+      return strs != '' ? strs.substr(0, strs.length - 1) : '';
    }
  }
 };
@@ -215,12 +210,13 @@ export default {
 <style scoped lang="scss">
 // .el-upload--picture-card 控制加号部分
 ::v-deep.hide .el-upload--picture-card {
-    display: none;
+  display: none;
 }
+
 // 去掉动画效果
 ::v-deep .el-list-enter-active,
 ::v-deep .el-list-leave-active {
-    transition: all 0s;
+  transition: all 0s;
 }

 ::v-deep .el-list-enter, .el-list-leave-active {
--- a/ruoyi-ui/src/plugins/download.js
+++ b/ruoyi-ui/src/plugins/download.js
@@ -9,8 +9,44 @@ const baseURL = process.env.VUE_APP_BASE_API
 let downloadLoadingInstance;

 export default {
-  oss(ossId) {
-    var url = baseURL + '/system/oss/download/' + ossId
+  name(name, isDelete = false) {
+    var url = baseURL + "/common/download?fileName=" + encodeURIComponent(name) + "&delete=" + isDelete
+    axios({
+      method: 'get',
+      url: url,
+      responseType: 'blob',
+      headers: { 'Authorization': 'Bearer ' + getToken() }
+    }).then((res) => {
+      const isBlob = blobValidate(res.data);
+      if (isBlob) {
+        const blob = new Blob([res.data])
+        this.saveAs(blob, decodeURIComponent(res.headers['download-filename']))
+      } else {
+        this.printErrMsg(res.data);
+      }
+    })
+  },
+  resource(resource) {
+    console.log(resource)
+    var url = baseURL + "/common/download/resource?resource=" + encodeURIComponent(resource);
+    console.log(url)
+    axios({
+      method: 'get',
+      url: url,
+      responseType: 'blob',
+      headers: { 'Authorization': 'Bearer ' + getToken() }
+    }).then((res) => {
+      const isBlob = blobValidate(res.data);
+      if (isBlob) {
+        const blob = new Blob([res.data])
+        this.saveAs(blob, decodeURIComponent(res.headers['download-filename']))
+      } else {
+        this.printErrMsg(res.data);
+      }
+    })
+  },
+  zip(url, name) {
+    var url = baseURL + url
    downloadLoadingInstance = Loading.service({ text: "正在下载数据，请稍候", spinner: "el-icon-loading", background: "rgba(0, 0, 0, 0.7)", })
    axios({
      method: 'get',
@@ -20,8 +56,8 @@ export default {
    }).then((res) => {
      const isBlob = blobValidate(res.data);
      if (isBlob) {
-        const blob = new Blob([res.data], { type: 'application/octet-stream' })
-        this.saveAs(blob, decodeURIComponent(res.headers['download-filename']))
+        const blob = new Blob([res.data], { type: 'application/zip' })
+        this.saveAs(blob, name)
      } else {
        this.printErrMsg(res.data);
      }
@@ -32,26 +68,6 @@ export default {
      downloadLoadingInstance.close();
    })
  },
-  zip(url, name) {
-    var url = baseURL + url
-    axios({
-      method: 'get',
-      url: url,
-      responseType: 'blob',
-      headers: {
-        'Authorization': 'Bearer ' + getToken(),
-        'datasource': localStorage.getItem("dataName")
-      }
-    }).then((res) => {
-      const isBlob = blobValidate(res.data);
-      if (isBlob) {
-        const blob = new Blob([res.data], { type: 'application/zip' })
-        this.saveAs(blob, name)
-      } else {
-        this.printErrMsg(res.data);
-      }
-    })
-  },
  saveAs(text, name, opts) {
    saveAs(text, name, opts);
  },
--- a/ruoyi-ui/src/utils/generator/parser.js
+++ b/ruoyi-ui/src/utils/generator/parser.js
@@ -170,7 +170,7 @@ export default {
          };
          // 点击文件列表中已上传的文件时的钩子
          cur['on-preview'] = (file) => {
-            this.$download.oss(file.ossId)
+            this.$download(file.ossId)
          }
        }
        if (config.children) {
--- a/ruoyi-ui/src/views/oa/costing/list.vue
+++ b/ruoyi-ui/src/views/oa/costing/list.vue
@@ -574,7 +574,9 @@
        <el-descriptions-item label="附件" :span="3" :labelStyle="lableBg">
          <!--附件-->
          <template v-if="form.accessory">
-            <ImageOss :name="form.accessory"/>
+            <el-tooltip class="item" effect="dark" content="点击下载" placement="bottom">
+              <el-link type="primary"  @click="downloadFile(form.accessory)">{{form.accessory.match('[^/]+(?!.*/)')[0]}}</el-link>
+            </el-tooltip>
          </template>
          <template v-else>
            <span style="color: #999999">暂无附件</span>
@@ -1217,6 +1219,11 @@ export default {
        this.loading = false;
      });
    },
+    /** 下载文件 */
+    downloadFile(filePath){
+      this.$download.resource(filePath)
+
+    },

    // 多选框选中数据
    /* handleSelectionChange(selection) {
--- a/ruoyi-ui/src/views/oa/finance/index.vue
+++ b/ruoyi-ui/src/views/oa/finance/index.vue
@@ -454,7 +454,9 @@
        <el-descriptions-item label="附件" :span="4" :labelStyle="lableBg">
          <!--附件-->
          <template v-if="form.accessory">
-            <ImageOss :name="form.accessory"/>
+            <el-tooltip class="item" effect="dark" content="点击下载" placement="bottom">
+              <el-link type="primary"  @click="downloadFile(form.accessory)">{{form.accessory.match('[^/]+(?!.*/)')[0]}}</el-link>
+            </el-tooltip>
          </template>
          <template v-else>
            <span style="color: #999999">暂无附件</span>
@@ -1335,6 +1337,11 @@ export default {
      this.download('oa/finance/export', {
        ...this.queryParams
      }, `finance_${new Date().getTime()}.xlsx`)
+    },
+    /** 下载文件 */
+    downloadFile(filePath){
+      this.$download.resource(filePath)
+
    }
  }
 };
--- a/ruoyi-ui/src/views/oa/oaBid/index.vue
+++ b/ruoyi-ui/src/views/oa/oaBid/index.vue
@@ -422,7 +422,9 @@

          <!--附件-->
          <template v-if="form.accessory">
-            <ImageOss :name="form.accessory"/>
+            <el-tooltip class="item" effect="dark" content="点击下载" placement="bottom">
+              <el-link type="primary"  @click="downloadFile(form.accessory)">{{form.accessory.match('[^/]+(?!.*/)')[0]}}</el-link>
+            </el-tooltip>
          </template>
          <template v-else>
            <span style="color: #999999">暂无附件</span>
@@ -876,6 +878,11 @@ export default {
        this.loading = false;
      });
    },
+    /** 下载文件 */
+    downloadFile(filePath){
+      this.$download.resource(filePath)
+
+    },
    //tabs标签
    handleClick(tab, event) {
      // console.log(tab, event);
--- a/ruoyi-ui/src/views/oa/oaContract/index.vue
+++ b/ruoyi-ui/src/views/oa/oaContract/index.vue
@@ -235,7 +235,9 @@
          </template>
          <!--附件-->
          <template v-if="form.accessory">
-            <ImageOss :name="form.accessory"/>
+            <el-tooltip class="item" effect="dark" content="点击下载" placement="bottom">
+              <el-link type="primary"  @click="downloadFile(form.accessory)">{{form.accessory.match('[^/]+(?!.*/)')[0]}}</el-link>
+            </el-tooltip>
          </template>
          <template v-else>
            <span style="color: #999999">暂无附件</span>
@@ -519,6 +521,11 @@ export default {
        this.title = "修改合同管理";
      });
    },
+    /** 下载文件 */
+    downloadFile(filePath){
+      this.$download.resource(filePath)
+
+    },
    /** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate(valid => {
--- a/ruoyi-ui/src/views/oa/proContract/index.vue
+++ b/ruoyi-ui/src/views/oa/proContract/index.vue
@@ -225,7 +225,9 @@
                </template>
                <!--附件-->
                <template v-if="form.accessory">
-                  <ImageOss :name="form.accessory"/>
+                  <el-tooltip class="item" effect="dark" content="点击下载" placement="bottom">
+                    <el-link type="primary"  @click="downloadFile(form.accessory)">{{form.accessory.match('[^/]+(?!.*/)')[0]}}</el-link>
+                  </el-tooltip>
                </template>
                <template v-else>
                  <span style="color: #999999">暂无附件</span>
@@ -585,7 +587,9 @@
          </template>
          <!--附件-->
          <template v-if="form.accessory">
-            <ImageOss :name="form.accessory"/>
+            <el-tooltip class="item" effect="dark" content="点击下载" placement="bottom">
+              <el-link type="primary"  @click="downloadFile(form.accessory)">{{form.accessory.match('[^/]+(?!.*/)')[0]}}</el-link>
+            </el-tooltip>
          </template>
          <template v-else>
            <span style="color: #999999">暂无附件</span>
@@ -742,6 +746,7 @@ export default {
      //点击添加按钮状态
      addBottomStatus: false,
      openForm: false,
+      downLoadUrl :process.env.VUE_APP_BASE_API+'/common/download' ,
      // 表单参数
      form: {},
      // 按钮loading
@@ -1069,6 +1074,12 @@ export default {
      } else {
        callback()
      }
+    },
+
+    /** 下载文件 */
+    downloadFile(filePath){
+      this.$download.resource(filePath)
+
    }
  }
 }
--- a/ruoyi-ui/src/views/oa/project/index.vue
+++ b/ruoyi-ui/src/views/oa/project/index.vue
@@ -313,7 +313,9 @@
                  </template>
                  <!--附件-->
                  <template v-if="form.accessory">
-                    <ImageOss :name="form.accessory"/>
+                    <el-tooltip class="item" effect="dark" content="点击下载" placement="bottom">
+                      <el-link type="primary"  @click="downloadFile(form.accessory)">{{form.accessory.match('[^/]+(?!.*/)')[0]}}</el-link>
+                    </el-tooltip>
                  </template>
                  <template v-else>
                    <span style="color: #999999">暂无附件</span>
@@ -634,7 +636,9 @@
                            </template>
                            <!--附件-->
                            <template v-if="item.accessory">
-                              <ImageOss :name="item.accessory"/>
+                              <el-tooltip class="item" effect="dark" content="点击下载" placement="bottom">
+                                <el-link type="primary"  @click="downloadFile(form.accessory)">{{form.accessory.match('[^/]+(?!.*/)')[0]}}</el-link>
+                              </el-tooltip>
                            </template>
                            <template v-else>
                              <span style="color: #999999">暂无附件</span>
@@ -887,7 +891,9 @@
                    </template>
                    <!--附件-->
                    <template v-if="contractForm.accessory">
-                      <ImageOss :name="contractForm.accessory"/>
+                      <el-tooltip class="item" effect="dark" content="点击下载" placement="bottom">
+                        <el-link type="primary"  @click="downloadFile(form.accessory)">{{form.accessory.match('[^/]+(?!.*/)')[0]}}</el-link>
+                      </el-tooltip>
                    </template>
                    <template v-else>
                      <span style="color: #999999">暂无附件</span>
@@ -1165,7 +1171,9 @@
          </template>
          <!--附件-->
          <template v-if="contractForm.accessory">
-            <ImageOss :name="contractForm.accessory"/>
+            <el-tooltip class="item" effect="dark" content="点击下载" placement="bottom">
+              <el-link type="primary"  @click="downloadFile(form.accessory)">{{form.accessory.match('[^/]+(?!.*/)')[0]}}</el-link>
+            </el-tooltip>
          </template>
          <template v-else>
            <span style="color: #999999">暂无附件</span>
@@ -1520,6 +1528,11 @@ export default {
      this.queryParams.pageNum = 1;
      this.getList();
    },
+    /** 下载文件 */
+    downloadFile(filePath){
+      this.$download.resource(filePath)
+
+    },
    /** 重置按钮操作 */
    resetQuery() {
      this.searchTime = [];
--- a/ruoyi-ui/src/views/oa/purpose/index.vue
+++ b/ruoyi-ui/src/views/oa/purpose/index.vue
@@ -156,7 +156,9 @@
        <el-descriptions-item label="附件" span="4" :labelStyle="lableBg">
          <!--附件-->
          <template v-if="formQuery.accessory">
-            <ImageOss :name="formQuery.accessory"/>
+            <el-tooltip class="item" effect="dark" content="点击下载" placement="bottom">
+              <el-link type="primary"  @click="downloadFile(form.accessory)">{{form.accessory.match('[^/]+(?!.*/)')[0]}}</el-link>
+            </el-tooltip>
          </template>
          <template v-else>
            <span style="color: #999999">暂无附件</span>
@@ -341,6 +343,11 @@ export default {
      this.resetForm("queryForm");
      this.handleQuery();
    },
+    /** 下载文件 */
+    downloadFile(filePath){
+      this.$download.resource(filePath)
+
+    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map(item => item.purposeId)
--- a/ruoyi-ui/src/views/oa/remind/index.vue
+++ b/ruoyi-ui/src/views/oa/remind/index.vue
@@ -146,7 +146,9 @@
          </template>
          <!--附件-->
          <template v-if="lookRemind.accessory">
-            <ImageOss :name="lookRemind.accessory"/>
+            <el-tooltip class="item" effect="dark" content="点击下载" placement="bottom">
+              <el-link type="primary"  @click="downloadFile(form.accessory)">{{form.accessory.match('[^/]+(?!.*/)')[0]}}</el-link>
+            </el-tooltip>
          </template>
          <template v-else>
            <span style="color: #999999">暂无附件</span>
@@ -186,7 +188,9 @@
          </template>
          <!--附件-->
          <template v-if="form.accessory">
-            <ImageOss :name="form.accessory"/>
+            <el-tooltip class="item" effect="dark" content="点击下载" placement="bottom">
+              <el-link type="primary"  @click="downloadFile(form.accessory)">{{form.accessory.match('[^/]+(?!.*/)')[0]}}</el-link>
+            </el-tooltip>
          </template>
          <template v-else>
            <span style="color: #999999">暂无附件</span>
@@ -470,7 +474,11 @@ export default {
      this.openTask = false;
      this.reset();
    },
+    /** 下载文件 */
+    downloadFile(filePath){
+      this.$download.resource(filePath)

+    },

  }
 }
--- a/ruoyi-ui/src/views/oa/remind/list.vue
+++ b/ruoyi-ui/src/views/oa/remind/list.vue
@@ -151,7 +151,9 @@
        <el-descriptions-item label="附件" :labelStyle="lableBg" span="4">
          <!--附件-->
          <template v-if="formLook.accessory">
-            <ImageOss :name="formLook.accessory"/>
+            <el-tooltip class="item" effect="dark" content="点击下载" placement="bottom">
+              <el-link type="primary"  @click="downloadFile(form.accessory)">{{form.accessory.match('[^/]+(?!.*/)')[0]}}</el-link>
+            </el-tooltip>
          </template>
          <template v-else>
            <span style="color: #999999">暂无附件</span>
@@ -415,6 +417,11 @@ export default {
      this.download('oa/remind/export', {
        ...this.queryParams
      }, `remind_${new Date().getTime()}.xlsx`)
+    },
+    /** 下载文件 */
+    downloadFile(filePath){
+      this.$download.resource(filePath)
+
    }
  }
 };
--- a/ruoyi-ui/src/views/system/oss/index.vue
+++ b/ruoyi-ui/src/views/system/oss/index.vue
@@ -383,7 +383,7 @@ export default {
    },
    /** 下载按钮操作 */
    handleDownload(row) {
-      this.$download.oss(row.ossId)
+      this.$download(row.ossId)
    },
    /** 删除按钮操作 */
    handleDelete(row) {