[update] 修改企标计划详情和企标详情文件列表，企标新增抽屉样式

src/views/enterpriseStandardLibrary/standard/detail/EnterpriseStandardDetail.vue

@@ -6,17 +6,17 @@
         <span>{{ part }}</span>
         <div class="detail-page-part-title-operate-box" v-if="index === 0">
           <!--          企标评价-->
-          <a-button type="link" @click="handleEvaluate">
+          <a-button type="link" @click="handleEvaluate" v-has="'enterpriseStandard:detail:evaluate'">
             <i class="iconfont icon-edit-1" />
             {{ $t('enterpriseStandardLibrary.standard.evaluate') }}
           </a-button>
           <!--          更新记录-->
-          <a-button type="link" @click="handleOpenUpdateRecord">
+          <a-button type="link" @click="handleOpenUpdateRecord" v-has="'enterpriseStandard:detail:updateLog'">
             <i class="iconfont icon-root-list" />
             {{ $t('enterpriseStandardLibrary.standard.updateRecord') }}
           </a-button>
           <!--          提交问题-->
-          <a-button type="link" @click="submitQuestion">
+          <a-button type="link" @click="submitQuestion" v-has="'enterpriseStandard:detail:submitQuestion'">
             <i class="iconfont icon-chat" />
             {{ $t('enterpriseStandardLibrary.standard.submitQuestion') }}
           </a-button>
@@ -25,22 +25,15 @@
       <div class="detail-page-part-form" v-if="index !== 3">
         <div class="detail-page-part-form-item" v-for="formItem in form[part]" :key="formItem.id">
           <label>{{ formItem.dbFieldTxt }}</label>
-          <div v-if="formItem.fieldShowType === FieldType.FILE_UP.value" class="file-box">
+          <div v-if="fileField.includes(formItem.dbFieldName)" class="file-box">
             <template v-if="detailData[formItem.dbFieldName]">
-              <div class="detail-page-process-manuscript-file" v-for="(fileId, index) in detailData[formItem.dbFieldName].split(',')" :key="fileId">
+              <div class="detail-page-process-manuscript-file" v-for="file in detailData[formItem.dbFieldName + 'List']" :key="file.id">
                 <div class="detail-page-process-manuscript-file-info">
                   <a-icon type="link" />
-                  <div class="detail-page-process-manuscript-file-name"
-                    @click="handlePreview(fileId, detailData[formItem.dbFieldName + '_dictText'].split(',')[index])">
-                    {{ detailData[formItem.dbFieldName + '_dictText'].split(',')[index] }}
-                  </div>
+                  <div class="detail-page-process-manuscript-file-name" @click="handlePreview(file)">{{ file.fileName }}</div>
                 </div>
-                <!--  下载  -->
-                <a-button
-                  type="link"
-                  icon="download"
-                  class="file-btn"
-                  @click="handleDownload(fileId, detailData[formItem.dbFieldName + '_dictText'].split(',')[index])">
+                <!--                下载-->
+                <a-button type="link" icon="download" class="file-btn" @click="handleDownload(file)">
                   {{ $t('download') }}
                 </a-button>
                 <!--                无水印下载-->
@@ -66,25 +59,23 @@
             <span>{{ formItem.dbFieldTxt }}</span>
             <a-button v-if="formIndex === 0" type="primary" ghost icon="file-text">{{ $t('enterpriseStandardLibrary.standard.standardResolutionSheet') }}</a-button>
           </div>
-          <div class="detail-page-process-manuscript-file" v-for="(fileId, index) in detailData[formItem.dbFieldName].split(',')" :key="fileId">
-            <div class="detail-page-process-manuscript-file-info">
-              <a-icon type="link" />
-              <div class="detail-page-process-manuscript-file-name">{{ detailData[formItem.dbFieldName + '_dictText'].split(',')[index] }}</div>
+          <template v-if="detailData[formItem.dbFieldName]">
+            <div class="detail-page-process-manuscript-file" v-for="file in detailData[formItem.dbFieldName + 'List']" :key="file.id">
+              <div class="detail-page-process-manuscript-file-info">
+                <a-icon type="link" />
+                <div class="detail-page-process-manuscript-file-name" @click="handlePreview(file)">{{ file.fileName }}</div>
+              </div>
+              <div class="detail-page-process-manuscript-file-operate">
+                <!--                下载-->
+                <a-button type="link" icon="download" @click="handleDownload(file)">{{ $t('download') }}</a-button>
+                <!--                无水印下载-->
+                <a-button type="link">
+                  <i class="iconfont icon-water-drop-slash"></i>
+                  {{ $t('unwatermarkedDownload') }}
+                </a-button>
+              </div>
             </div>
-            <div class="detail-page-process-manuscript-file-operate">
-              <a-button type="link"
-                icon="download"
-                @click="downloadDraft(fileId, detailData[formItem.dbFieldName + '_dictText'].split(',')[index])">
-                {{ $t('download') }}
-              </a-button>
-              <a-button
-                type="link"
-                @click="downloadDraftNoWater(fileId, detailData[formItem.dbFieldName + '_dictText'].split(',')[index])">
-                <i class="iconfont icon-water-drop-slash"></i>
-                {{ $t('unwatermarkedDownload') }}
-              </a-button>
-            </div>
-          </div>
+          </template>
         </div>
       </div>
     </div>
@@ -117,6 +108,12 @@
     <update-record-modal ref="updateRecordModal"></update-record-modal>
     <!--  提交问题弹框  -->
     <submit-question-modal ref="submitQuestionModal"></submit-question-modal>
+    <!--  图片预览容器 -->
+    <div id="images">
+      <div class="image" v-viewer="{movable: false}">
+        <img v-show="image" :src="imageUrl">
+      </div>
+    </div>
   </div>
 </template>
 
@@ -131,6 +128,7 @@ import EnterpriseStandardEvaluateModal from './module/EnterpriseStandardEvaluate
 import Vue from 'vue'
 import { ACCESS_TOKEN } from '@/store/mutation-types'
 import { previewPdf } from '@/utils/previewPdf'
+import { getFileInfo } from '../../../../api/api'
 
 const FILE_TYPE_IMGS = ['jpg', 'jpeg', 'png', 'raw']
 const FILE_TYPE_PDF = 'pdf'
@@ -145,6 +143,7 @@ export default {
       partList: [], // 页面模块列表
       form: {}, // 页面字段
       detailData: {}, // 页面数据
+      fileField: ['associated_file', 'publish_of_original', 'modification_list', 'draft_for_review', 'draft_for_comment', 'draft'], // 是文件的字段
       columns: [
         {
           title: this.$t('serialNumber'),
@@ -170,7 +169,9 @@ export default {
           scopedSlots: { customRender: 'text' }
         }
       ], // 稽查内容表格列参数
-      dataSource: [] // 稽查内容数据
+      dataSource: [], // 稽查内容数据
+      image: false,
+      imageUrl: ''
     }
   },
   created () {
@@ -198,18 +199,54 @@ export default {
       getEnterpriseStandardInfoById(params).then(res => {
         if (res.success) {
           this.detailData = res.result
+          this.fileField.forEach(item => {
+            if (this.detailData[item]) {
+              const fileList = this.detailData[item].split(',')
+              const fileInfoList = []
+              fileList.forEach(async id => {
+                const fileInfo = await this.getFileInfo(id)
+                if (fileInfo) {
+                  fileInfoList.push(fileInfo)
+                }
+              })
+              this.$set(this.detailData, item + 'List', fileInfoList)
+            }
+          })
         } else {
           this.$message.warning(res.message)
         }
       })
     },
-    handlePreview (fileId, fileName) {
+    getFileInfo (fileId) {
+      return new Promise(resolve => {
+        let fileInfo
+        getFileInfo({ id: fileId }).then(res => {
+          if (res.success) {
+            fileInfo = res.result
+          }
+        }).finally(() => {
+          resolve(fileInfo)
+        })
+      })
+    },
+    handlePreview (file) {
+      if (!file || !file.url) {
+        return
+      }
       // 截取文件后缀名
-      const fileSuffix = fileName ? fileName.split('.')[fileName.split('.').length - 1] : ''
-      const fileFullUrl = `${window._CONFIG.domianWebSocketURL}/sys/common/download/${fileId}?token=${Vue.ls.get(ACCESS_TOKEN)}&fullfilename=${fileName}`
+      const fileSuffix = file.fileName ? file.fileName.split('.')[file.fileName.split('.').length - 1] : ''
+      const canPreview = FILE_TYPE_IMGS.some(tt => fileSuffix.toLowerCase() === tt) || fileSuffix.toLowerCase() === FILE_TYPE_PDF
+      // 判断是否为可预览格式的文件
+      if (!canPreview) {
+        this.$message.loading('该文件类型不支持预览，正在为您准备下载...').then(() => {
+          this.handleDownload(file)
+        })
+        return
+      }
+      const fileFullUrl = `${window._CONFIG.domianWebSocketURL}/sys/common/download/${file.id}?token=${Vue.ls.get(ACCESS_TOKEN)}&fullfilename=${file.fileName}`
       // 图片预览，使用自己添加的组件
-      if (FILE_TYPE_IMGS.includes(fileSuffix)) {
-        this.imageUrl = getFileAccessHttpUrl(fileId)
+      if (canPreview && FILE_TYPE_IMGS.includes(fileSuffix.toLowerCase())) {
+        this.imageUrl = getFileAccessHttpUrl(file.id)
         // 获取viewer实例
         const viewer = this.$el.querySelector('.image').$viewer
         // 调用show方法进行显示预览图
@@ -218,8 +255,8 @@ export default {
         return
       }
       // pdf预览
-      if (FILE_TYPE_PDF.includes(fileSuffix)) {
-        const url = previewPdf(fileId)
+      if (canPreview && FILE_TYPE_PDF.includes(fileSuffix)) {
+        const url = previewPdf(file.response.result.id)
         window.open(url)
         return
       }
@@ -227,13 +264,9 @@ export default {
       const url = `${window._CONFIG.onlinePreviewDomainURL}?url=${encodeURIComponent(Base64.encode(fileFullUrl))}`
       window.open(url)
     },
-    handleDownload (fileId, fileName) {
+    handleDownload (file) {
       // 下载文件
-      downloadFile(`/sys/common/download/${fileId}`, fileName)
-    },
-    // 过程稿件里的下载
-    downloadDraft (fileId, fileName) {
-      downloadFile(`/sys/common/download/${fileId}`, fileName)
+      downloadFile(`/sys/common/download/${file.id}`, file.fileName)
     },
     // 过程稿件里的无水印下载
     downloadDraftNoWater (fileId, fileName) {