文件显示

src/views/activityMan/placeactivity/placeActivityInfo.vue

@@ -141,11 +141,10 @@
             <van-uploader
               v-show="fileList.length != 0"
               v-model="fileList"
-              :max-count="1"
+              :max-count="fileList.length"
+              :deletable="false"
+              @click-preview="downHandle"
             >
-              <template #preview-cover="file">
-                <div class="preview-cover van-ellipsis">{{ file.name }}</div>
-              </template>
             </van-uploader>
           </template>
         </van-field>
@@ -254,10 +253,12 @@ export default {
         placeActivity.value.safetyPlan.split("|").forEach((item) => {
           if (item.trim().length > 0) {
             fileList.value.push({
-              name: decodeURIComponent(
-                item.substring(item.lastIndexOf("/") + 1)
-              ),
-              url: $base + item,
+              file: {
+                name: decodeURIComponent(
+                  item.substring(item.lastIndexOf("/") + 1)
+                ),
+              },
+              url: $base + item.replace("程序附件//", "程序附件/"),
             });
           }
         });
@@ -273,6 +274,19 @@ export default {
         }
       });
     };
+    /**
+     * 下载文件 网页端可用
+     */
+    const downHandle = (fileObj) => {
+      // 声明a标签
+      const aEle = document.createElement("a");
+      // 设置下载文件名
+      aEle.download = fileObj.file.name;
+      // 下载地址
+      aEle.href = fileObj.content;
+      // 调用下载
+      aEle.click();
+    };
     // 审核通过
     const update = () => {
       xm.showConfirm({
@@ -296,6 +310,7 @@ export default {
       onClickLeft,
       placeActivity,
       fileList,
+      downHandle,
       isLoading,
       update,
       subjectContentEditor,

src/views/activityMan/placeactivity/placeActivityView.vue

@@ -206,7 +206,9 @@
               :max-count="5"
               capture="camera"
               accept=""
+              :preview-full-image="false"
               :before-delete="deleteRead"
+              @click-preview="downHandle"
             >
               <van-button>上传文件</van-button>
             </van-uploader>
@@ -309,11 +311,21 @@ export default {
           });
           placeActivity.value.safetyPlan.split("|").forEach((item) => {
             if (item.trim().length > 0) {
+              fileupList.value.push({
+                file: {
+                  name: decodeURIComponent(
+                    item.substring(item.lastIndexOf("/") + 1)
+                  ),
+                },
+                url: item,
+              });
               fileList.value.push({
-                name: decodeURIComponent(
-                  item.substring(item.lastIndexOf("/") + 1)
-                ),
-                url: $base + item,
+                file: {
+                  name: decodeURIComponent(
+                    item.substring(item.lastIndexOf("/") + 1)
+                  ),
+                },
+                url: $base + item.replace("程序附件//", "程序附件/"),
               });
             }
           });
@@ -390,26 +402,33 @@ export default {
     let fileList = ref([]);
     let fileupList = ref([]);
     const afterRead = (file) => {
+      file.status = "uploading";
+      file.message = "上传中";
       // 此时可以自行将文件上传至服务器
       new tools()
         .uploadFile(file, `reporting/reportingActivities`)
         .then(({ data, status, statusText }) => {
           if (status == 200 || statusText == "OK") {
-            xm.showToast({
-              message: "上传成功",
-            });
+            file.status = "done";
+            // xm.showToast({
+            //   message: "上传成功",
+            // });
             data.name = decodeURIComponent(
               data.url.substring(data.url.lastIndexOf("/") + 1)
             );
             fileupList.value.push(data);
           }
+        })
+        .catch(() => {
+          file.status = "failed";
+          file.message = "上传失败";
         });
     };
     // 删除文件
     const deleteRead = (file) => {
       //删除文件操作
       for (let index = 0; index < fileList.value.length; index++) {
-        if (file.file == fileList.value[index].file) {
+        if (file.file.name == fileList.value[index].file.name) {
           let delurl = fileupList.value[index].url;
           new tools().uploadFiledelete("", delurl).then(({ data }) => {});
           fileupList.value.splice(index, 1);
@@ -417,18 +436,31 @@ export default {
         }
       }
     };
+    /**
+     * 下载文件 网页端可用
+     */
+    const downHandle = (fileObj) => {
+      // 声明a标签
+      const aEle = document.createElement("a");
+      // 设置下载文件名
+      aEle.download = fileObj.file.name;
+      // 下载地址
+      aEle.href = fileObj.content;
+      // 调用下载
+      aEle.click();
+    };
     // 提交数据
     const submit = () => {
       isLoading.value = true;
       //保存前附件处理
-      siteInspection.enclosure = fileupList.value
+      placeActivity.value.safetyPlan = fileupList.value
         .map((option) => option.url)
         .join("|");
       new placeActivityServer().save(placeActivity.value).then((res) => {
         if (res.status == 200 || res.statusText == "OK") {
-          xm.showToast({
-            message: res.data,
-          });
+          // xm.showToast({
+          //   message: res.data,
+          // });
         }
         onClickLeft();
       });
@@ -457,6 +489,7 @@ export default {
       // 文件上传
       afterRead,
       deleteRead,
+      downHandle,
       fileList,
       submit,
       subjectContentEditor,