修改体系文件预览跟下载文件名称

src/utils/common.js

@@ -151,6 +151,7 @@ export default {
       console.info('重新生成成功')
     })
   },
+
   /**
      * 检验员签名方法
      * @param {*} id ： 原始记录/报告主键
@@ -216,8 +217,7 @@ export default {
         message: '删除成功',
         type: 'success'
       })
-    }).catch(e => {
+    }).catch(e => {})
-    })
   },
   /**
      * 下载导入模板

src/views/dic/category.vue

@@ -107,11 +107,11 @@
             <span>字典详情</span>
           </div>
           <el-button
+            v-if="list.length > 0"
             type="danger"
             icon="el-icon-delete"
-                  @click="deleteCategoryDetail"
-                  v-if="list.length > 0"
             style="margin-bottom:20px"
+            @click="deleteCategoryDetail"
           >
             删除
           </el-button>
@@ -418,7 +418,7 @@ export default {
       this.species = []
     },
     deleteCategoryDetail() {
-      if(this.detailSeletArr.length==0){
+      if (this.detailSeletArr.length === 0) {
         return this.$message.warning('请选择数据')
       }
       this.api({

src/views/document/index.vue

@@ -34,16 +34,9 @@
       :columns="columns"
       :crud="crud"
     >
-      <el-table-column
+      <el-table-column slot="operation" align="center" width="200" label="操作">
-        slot="operation"
-        align="center"
-        width="200"
-        label="操作"
-      >
         <template slot-scope="scope">
-          <el-button type="text" @click="downLoad(scope.row)">
+          <el-button type="text" @click="downLoad(scope.row)"> 预览 </el-button>
-            预览
-          </el-button>
           <el-button type="text" @click="downLoadFn(scope.row)">
             下载
           </el-button>
@@ -56,13 +49,27 @@
     <pagination />
     <el-dialog title="查看历史版本" :visible.sync="dialogTableVisible">
       <el-table :data="gridData">
-        <el-table-column :formatter="formatterFlowName" property="flowName" label="操作环节" width="80" />
+        <el-table-column
+          :formatter="formatterFlowName"
+          property="flowName"
+          label="操作环节"
+          width="80"
+        />
         <el-table-column property="filename" label="文件名称" />
-        <el-table-column :formatter="formatter.getChineseName" property="createBy" label="创建人" width="100" />
+        <el-table-column
+          :formatter="formatter.getChineseName"
+          property="createBy"
+          label="创建人"
+          width="100"
+        />
         <el-table-column property="createTime" label="创建时间" width="150" />
         <el-table-column label="操作" width="80">
           <template v-slot="scope">
-            <el-button v-if="scope.row.flowName !== 0" type="text" @click="viewHistoryFile(scope.row)">
+            <el-button
+              v-if="scope.row.flowName !== 0"
+              type="text"
+              @click="viewHistoryFile(scope.row)"
+            >
               预览
             </el-button>
           </template>
@@ -79,150 +86,179 @@
 </template>
 
 <script>
-import CRUD, { header, presenter } from '@/components/Crud/crud'
+import CRUD, { header, presenter } from "@/components/Crud/crud";
-import Query from '@/components/Crud/Query'
+import Query from "@/components/Crud/Query";
-import CustomTable from '@/components/Crud/Table'
+import CustomTable from "@/components/Crud/Table";
-import Pagination from '@/components/Crud/Pagination'
+import Pagination from "@/components/Crud/Pagination";
-import CrudDocumentArchives from '@/api/document_archives'
+import CrudDocumentArchives from "@/api/document_archives";
-import { uploadFileFn, updateInspectionSystemFile } from '@/api/common'
+import { uploadFileFn, updateInspectionSystemFile } from "@/api/common";
-import { downloadFileUrl } from '@/utils'
+import { downloadFileUrl } from "@/utils";
-import download from 'downloadjs'
+import download from "downloadjs";
-import preview from '@/utils/preview'
+import preview from "@/utils/preview";
 
 // crud交由presenter持有
 const defaultCrud = presenter(
   CRUD({
-    title: '检验机构体系文件管理',
+    title: "检验机构体系文件管理",
-    url: '/inspectionSystemFile/list',
+    url: "/inspectionSystemFile/list",
-    orderBy: ['id desc'],
+    orderBy: ["id desc"],
     api: preview,
-    crudMethod: { ...CrudDocumentArchives }
+    crudMethod: { ...CrudDocumentArchives },
   })
-)
+);
 
 export default {
-  name: 'DocumentArchivesList',
+  name: "DocumentArchivesList",
   components: { Pagination, Query, CustomTable },
   mixins: [defaultCrud, header()],
   data() {
     return {
-      action: this.preview.baseURL + '/inspectionSystemFile',
+      action: this.preview.baseURL + "/inspectionSystemFile",
       fileList: [],
       colConfigs: [
-        { prop: 'filename', label: '文件名', align: 'center' },
+        { prop: "filename", label: "文件名", align: "center" },
-        { prop: 'createBy', label: '创建人', align: 'center', formatter: this.formatter.getChineseName },
-        { prop: 'createTime', label: '创建时间', align: 'center' },
-        { prop: 'updateBy', label: '更新人', align: 'center', formatter: this.formatter.getChineseName },
         {
-          prop: 'updateTime',
+          prop: "createBy",
-          label: '更新时间',
+          label: "创建人",
-          align: 'center',
+          align: "center",
-          formatter: this.formatter.formatterDepartmentName
+          formatter: this.formatter.getChineseName,
         },
-        { slot: 'operation' }
+        { prop: "createTime", label: "创建时间", align: "center" },
+        {
+          prop: "updateBy",
+          label: "更新人",
+          align: "center",
+          formatter: this.formatter.getChineseName,
+        },
+        {
+          prop: "updateTime",
+          label: "更新时间",
+          align: "center",
+          formatter: this.formatter.formatterDepartmentName,
+        },
+        { slot: "operation" },
       ],
       permission: {
-        add: ['documentArchives:add'],
+        add: ["documentArchives:add"],
-        edit: ['documentArchives:update'],
+        edit: ["documentArchives:update"],
-        del: ['documentArchives:delete']
+        del: ["documentArchives:delete"],
       },
       dialogTableVisible: false,
       params: {
-        inspectionSystemFileId: '',
+        inspectionSystemFileId: "",
         pageNum: 1,
-        pageSize: 10
+        pageSize: 10,
       },
       gridData: [],
       subTotal: 0,
-      url: process.env.VUE_APP_PREVIEW_API + process.env.VUE_APP_PROJECT_NAME + '/inspectionSystemFile'
+      url:
-    }
+        process.env.VUE_APP_PREVIEW_API +
-  },
+        process.env.VUE_APP_PROJECT_NAME +
-  mounted() {
+        "/inspectionSystemFile",
+    };
   },
+  mounted() {},
   methods: {
     handleRemove(file, fileList) {
-      console.log(file, fileList)
+      console.log(file, fileList);
     },
     handlePreview(file) {
-      console.log(file)
+      console.log(file);
     },
     checkHistory(row) {
-      this.dialogTableVisible = true
+      this.dialogTableVisible = true;
-      this.params.inspectionSystemFileId = row.id
+      this.params.inspectionSystemFileId = row.id;
-      this.getSubList()
+      this.getSubList();
     },
     getSubList() {
       this.preview({
-        url: '/inspectionSystemFileLog/list',
+        url: "/inspectionSystemFileLog/list",
-        method: 'get',
+        method: "get",
-        params: this.params
+        params: this.params,
-      }).then(res => {
+      }).then((res) => {
-        this.gridData = res.list
+        this.gridData = res.list;
-        this.subTotal = res.total
+        this.subTotal = res.total;
-      })
+      });
     },
     handleCurrentChange(val) {
-      this.params.pageNum = val
+      this.params.pageNum = val;
-      this.getSubList()
+      this.getSubList();
     },
     handleExceed(files, fileList) {
       this.$message.warning(
         `当前限制选择 3 个文件，本次选择了 ${files.length} 个文件，共选择了 ${
           files.length + fileList.length
         } 个文件`
-      )
+      );
     },
     // EXCEL上传方法
     beforeUpload(file) {
       if (this.$refs.customTable.$refs.table.selection.length > 1) {
-        this.$notify.warning('请选择单份体系文件进行更新上传！')
+        this.$notify.warning("请选择单份体系文件进行更新上传！");
-        return false
+        return false;
       }
-      const fd = new FormData()
+      const fd = new FormData();
-      fd.append('file', file)
+      fd.append("file", file);
       if (this.$refs.customTable.$refs.table.selection.length) {
-        fd.append('id', this.$refs.customTable.$refs.table.selection[0].id)
+        fd.append("id", this.$refs.customTable.$refs.table.selection[0].id);
         updateInspectionSystemFile(fd).then(() => {
-          this.$notify.success('体系更新成功。')
+          this.$notify.success("体系更新成功。");
-          this.crud.toQuery()
+          this.crud.toQuery();
-        })
+        });
       } else {
         uploadFileFn(fd).then(() => {
-          this.$notify.success('体系上传成功。')
+          this.$notify.success("体系上传成功。");
-          this.crud.toQuery()
+          this.crud.toQuery();
-        })
+        });
       }
-      return false
+      return false;
     },
     downLoad(item) {
-      downloadFileUrl(this.url + '/' + item.id + item.suffix, item.filename, item.suffix)
+      const data = this.url + "/" + item.id + item.suffix;
+      this.$router.push({
+        path:
+          "/preview/document?src=" +
+          this.$store.getters.prodName +
+          "/static/web/viewer.html?file=" +
+          encodeURIComponent(data),
+      });
     },
     viewHistoryFile(item) {
-      downloadFileUrl(this.url + '/' + item.inspectionSystemFileId + '_' + item.id + item.suffix, item.filename, item.suffix)
+      downloadFileUrl(
+        this.url +
+          "/" +
+          item.inspectionSystemFileId +
+          "_" +
+          item.id +
+          item.suffix,
+        item.filename,
+        item.suffix
+      );
     },
     downLoadFn(item) {
-      download(this.url + '/' + item.id + item.suffix)
+      const data = this.url + "/" + item.id + item.suffix;
+      download(data, item.filename);
     },
     beforeRemove(file, fileList) {
-      return this.$confirm(`确定移除 ${file.name}？`)
+      return this.$confirm(`确定移除 ${file.name}？`);
     },
     closeReportDialog() {
-      this.$refs['reportForm'].resetFields()
+      this.$refs["reportForm"].resetFields();
     },
     formatterFlowName(row, column, cellValue) {
       switch (cellValue) {
         case 0:
-          return '保存'
+          return "保存";
         case 1:
-          return '更新'
+          return "更新";
         case 2:
-          return '删除'
+          return "删除";
         default:
-          break
+          break;
-      }
-    }
-  }
       }
+    },
+  },
+};
 </script>
 <style scoped>
 .searchBox {

src/views/preview/document.vue

@@ -0,0 +1,11 @@
+<template>
+  <preview />
+</template>
+
+<script>
+import preview from '@/views/preview/common/index'
+export default {
+  name: 'Document',
+  components: { preview }
+}
+</script>