update 法规入库/变更流程、pdfjs

2023-11-30 19:22:05 +08:00
parent ce3f55e022
commit 3324230195
745 changed files with 261958 additions and 15 deletions
@@ -0,0 +1,109 @@
+<template>
+  <div>
+    <template v-if="fileList && fileList.length > 0">
+      <div v-for="file in fileList" :key="file.id" class="file-name" @click="handlePreview(file)">{{ file.fileName }}</div>
+    </template>
+  </div>
+</template>
+
+<script>
+import { getFileInfo } from '../api/api'
+import Vue from 'vue'
+import { ACCESS_TOKEN } from '../store/mutation-types'
+import { getFileAccessHttpUrl } from '../api/manage'
+import { previewPdf } from '../utils/previewPdf'
+
+const Base64 = require('js-base64').Base64
+
+// 支持预览的文件后缀
+const CAN_PREVIEW_FILE_SUFFIX = ['jpg', 'jpeg', 'png', 'pdf', 'doc', 'docx', 'xls', 'xlsx', 'ppt', 'pptx']
+const FILE_TYPE_IMGS = ['jpg', 'jpeg', 'png', 'raw']
+const FILE_TYPE_PDF = 'pdf'
+
+export default {
+  name: 'FileDisplay',
+  props: {
+    // 文件id
+    fileIds: {
+      type: String,
+      required: false,
+      default: null
+    }
+  },
+  data () {
+    return {
+      fileList: []
+    }
+  },
+  watch: {
+    fileIds: {
+      handler () {
+        console.log('文件id', this.fileIds)
+        if (this.fileIds) {
+          this.initFileList()
+        } else {
+          this.fileList = []
+        }
+      },
+      immediate: true
+    }
+  },
+  methods: {
+    /**
+     * 获取文件列表
+     */
+    initFileList () {
+      const fileIdArr = this.fileIds.split(',')
+      this.fileList = []
+      fileIdArr.forEach(item => {
+        getFileInfo({ id: item }).then(res => {
+          if (res.success) {
+            this.fileList.push(res.result)
+          }
+        })
+      })
+    },
+    handlePreview (file) {
+      if (!file || !file.url) {
+        return
+      }
+      // 截取文件后缀名
+      const fileSuffix = file.fileName ? file.fileName.split('.')[file.fileName.split('.').length - 1] : ''
+      const canPreview = CAN_PREVIEW_FILE_SUFFIX.some(tt => fileSuffix.toLowerCase() === tt)
+      // 判断是否为可预览格式的文件
+      if (!canPreview) {
+        this.$message('该文件类型不支持预览')
+        return
+      }
+      const fileFullUrl = `${window._CONFIG.domianWebSocketURL}/sys/common/view/${file.id}?token=${Vue.ls.get(ACCESS_TOKEN)}&fullfilename=${file.fileName}`
+      // 图片预览，使用自己添加的组件
+      if (canPreview && FILE_TYPE_IMGS.includes(fileSuffix.toLowerCase())) {
+        this.imageUrl = getFileAccessHttpUrl(file.id)
+        // 获取viewer实例
+        const viewer = this.$el.querySelector('.image').$viewer
+        // 调用show方法进行显示预览图
+        viewer.show()
+        // this.$refs.imagePreviewModal.open(file)
+        return
+      }
+      // pdf预览
+      if (canPreview && FILE_TYPE_PDF.includes(fileSuffix)) {
+        const url = previewPdf(file.id)
+        window.open(url)
+        return
+      }
+      // 其余可预览文件仍使用KKFile进行预览
+      const url = `${window._CONFIG.onlinePreviewDomainURL}?url=${encodeURIComponent(Base64.encode(fileFullUrl))}`
+      window.open(url)
+    }
+  }
+}
+</script>
+
+<style scoped lang="less">
+@import '~@assets/less/common.less';
+
+.file-name {
+  color: @primary-color;
+}
+</style>