通用培训文档优化：增加附件、培训时限

2025-04-15 15:49:22 +08:00 · 2025-04-15 15:49:22 +08:00 · e1c41d2327
parent d4ae366fa6
commit e1c41d2327
8 changed files with 242 additions and 325 deletions
--- a/src/components/PreviewFile/index.vue
+++ b/src/components/PreviewFile/index.vue
@ -1,28 +1,28 @@
 <template>
  <div class="preview-wrapper">
-    <iframe
-      v-if="fileType.indexOf('jpg') !== -1 || fileType.indexOf('png') !== -1"
-      frameborder="0"
-      :src="filePath"
-      width="100%"
-      height="100%"
-    />
+    <iframe v-if="fileType.indexOf('jpg') !== -1 || fileType.indexOf('png') !== -1" frameborder="0" :src="filePath"
+      width="100%" height="100%" />
    <!-- <embed v-else-if="fileType.indexOf('pdf') !== -1" :src="filePath+'#toolbar=0'" style="width: 100%; height: 100%"> -->
    <!-- <iframe v-else-if="fileType.indexOf('pdf') !== -1" :src="filePath+'#toolbar=0'" width="100%" height="100%" frameborder="0" /> -->
-    <iframe v-else-if="fileType.indexOf('pdf') !== -1" :src="`/static/pdfjs/web/viewer.html?file=${OSSclientConfig.basePath}${filePath}?userName=${currentUser}&COMPANY=${COMPANY}`" width="100%" height="100%" frameborder="0" crossorigin="anonymous" />
+    <iframe v-else-if="fileType.indexOf('pdf') !== -1"
+      :src="`/static/pdfjs/web/viewer.html?file=${OSSclientConfig.basePath}${filePath}?userName=${currentUser}&COMPANY=${COMPANY}`"
+      width="100%" height="100%" frameborder="0" crossorigin="anonymous" />
    <!--    <pdf-->
    <!--      v-else-if="fileType.indexOf('pdf') !== -1"-->
    <!--      :src="`/static/pdfjs/web/viewer.html?file=${filePath}`">-->
    <!--    </pdf>-->
-    <div v-else>
+    <iframe v-else
+      :src="`/static/onlyOffice/viewer.html?url=${OSSclientConfig.basePath}${filePath}?type=${fileType}&title=${title}&documentType=${documentType}&userName=${currentUser}`"
+      width="100%" height="100%" frameborder="0" crossorigin="anonymous" />
+    <!-- <div v-else>
      {{ $t('common:message:downloadFile') }}
      <el-link type="primary" @click="downLoadFile">{{ $t('common:button:download') }}</el-link>
-    </div>
+    </div> -->
  </div>
 </template>
 <script>
 import { mapGetters } from 'vuex'
-
+import DOCUMENTTYPE from "@/utils/onlyOffice_type.js"
 export default {
  name: 'PreviewFile',
  computed: {
@ -36,12 +36,22 @@ export default {
    fileType: {
      type: String,
      required: true
-    }
+    },
+    title: {
+      type: String,
+      default: ''
+    },
  },
  data() {
    return {
      currentUser: zzSessionStorage.getItem('userName'),
-      COMPANY:process.env.VUE_APP_COMPANY_NAME
+      COMPANY: process.env.VUE_APP_COMPANY_NAME
+    }
+  },
+  computed: {
+    documentType() {
+      console.log(DOCUMENTTYPE[`.${this.fileType}`], 'documentType')
+      return DOCUMENTTYPE[`.${this.fileType}`]
    }
  },
  mounted() {
@ -62,14 +72,16 @@ export default {
 }
 </script>
 <style lang="scss">
-.preview-wrapper{
+.preview-wrapper {
  height: 100%;
-  width:100%;
+  width: 100%;
  padding: 10px;
+
  ::-webkit-scrollbar {
    width: 7px;
    height: 7px;
  }
+
  ::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background: #d0d0d0;
--- a/src/views/dictionary/attachment/components/SignatureTemplate/attachmentList.vue
+++ b/src/views/dictionary/attachment/components/SignatureTemplate/attachmentList.vue
@ -52,14 +52,14 @@

            <img v-show="false" :src="`${OSSclientConfig.basePath}${rowData.FilePath}`" alt="Image" />
        </viewer>
-        <attachmentPreview :SystemDocumentId="SystemDocumentId" :visible.sync="perview_visible"
-            v-if="perview_visible" />
+        <!-- <attachmentPreview :SystemDocumentId="SystemDocumentId" :visible.sync="perview_visible"
+            v-if="perview_visible" /> -->
    </div>
 </template>
 <script>
 import BaseModel from '@/components/BaseModel'
 import attachmentForm from './attachmentForm'
-import attachmentPreview from './attachmentPreview'
+// import attachmentPreview from './attachmentPreview'
 import { addOrUpdateSystemDocumentAttachment, getSystemDocumentAttachmentList, deleteSystemDocumentAttachment } from '@/api/dictionary'
 const defaultSearchData = () => {
    return {
@ -70,7 +70,11 @@ const defaultSearchData = () => {
    }
 }
 export default {
-    components: { BaseModel, attachmentForm, attachmentPreview },
+    components: {
+        BaseModel,
+        attachmentForm,
+        //  attachmentPreview 
+    },
    props: {
        config: {
            type: Object,
@ -108,7 +112,7 @@ export default {
                    flipVertical: true,
                }
            },
-            perview_visible: false
+            // perview_visible: false
        }
    },
    watch: {
@ -179,7 +183,7 @@ export default {
            }
        },
        preview(data) {
-            return this.perview_visible = true
+            // return this.perview_visible = true
            this.rowData = Object.assign({}, data)
            if (['.ppt',
                '.pptx',
--- a/src/views/dictionary/attachment/components/SignatureTemplate/attachmentPreview.vue
+++ b/src/views/dictionary/attachment/components/SignatureTemplate/attachmentPreview.vue
@ -1,6 +1,6 @@
 <template>
    <el-dialog :visible.sync="visible" :title="title" :fullscreen="true" append-to-body
-        custom-class="base-dialog-wrapper" @close="handleClose">
+        custom-class="base-dialog-wrapper" :before-close="handleClose">
        <div v-loading="loading" class="img-container" v-if="visible">
            <el-card class="box-card left">
                <div class="title">
@ -23,12 +23,8 @@
                                    " style="width: 100%; height: 100%"
                                        :src="`${OSSclientConfig.basePath}${item.FilePath}?x-oss-process=image/resize,w_50,h_50/format,png`"
                                        fit="contain" crossorigin="anonymous" />
-                                    <el-image v-else-if="item.FileFormat === 'pdf'" style="width: 100%; height: 100%"
-                                        :src="pdf" fit="contain" crossorigin="anonymous" />
-                                    <el-image v-else-if="
-                                        item.FileFormat === 'zip'
-                                    " style="width: 100%; height: 100%" :src="zip" fit="contain"
-                                        crossorigin="anonymous" />
+                                    <el-image v-else style="width: 100%; height: 100%" :src="getsrc(item.FileFormat)"
+                                        fit="contain" crossorigin="anonymous" />
                                </div>
                                <div v-if="item.Name.length < 15" class="img-text">
                                    {{ `${index + 1}. ${item.Name}` }}
@ -52,8 +48,9 @@
                ].includes(rowData.FileFormat)">
                    <imageViewer :rowData="rowData" />
                </div>
-                <div style="width: 100%; height: 100%" v-else-if="rowData.FileFormat === 'pdf'">
-                    <PreviewFile :file-path="rowData.FilePath" :file-type="rowData.FileFormat" />
+                <div style="width: 100%; height: 100%" v-else>
+                    <PreviewFile v-if='rowData.FilePath' :file-path="rowData.FilePath" :file-type="rowData.FileFormat"
+                        :title="rowData.Name" />
                </div>
            </el-card>

@ -65,8 +62,14 @@
 </template>

 <script>
-import pdf from '@/assets/pdf.png'
-import zip from '@/assets/zip.jpg'
+import pdf from '@/assets/file_icon/pdf.png'
+import zip from '@/assets/file_icon/zip.png'
+import doc from '@/assets/file_icon/doc.png'
+import docx from '@/assets/file_icon/docx.png'
+import ppt from '@/assets/file_icon/ppt.png'
+import pptx from '@/assets/file_icon/pptx.png'
+import xls from '@/assets/file_icon/xls.png'
+import xlsx from '@/assets/file_icon/xlsx.png'
 import PreviewFile from '@/components/PreviewFile'
 import imageViewer from './image-viewer'
 import { getSystemDocumentAttachmentList } from '@/api/dictionary'
@ -98,10 +101,16 @@ export default {
        return {
            pdf,
            zip,
+            doc,
+            docx,
+            ppt,
+            pptx,
+            xls,
+            xlsx,
            rowData: {},
            list: [],
            searchData: defaultSearchData(),
-            title: null
+            title: this.$t('dictionary:signature:fileList')
        }
    },
    watch: {
@ -113,6 +122,9 @@ export default {
        }
    },
    methods: {
+        getsrc(type) {
+            return this[type.toLowerCase()]
+        },
        selected(row) {
            this.rowData = row
        },
--- a/src/views/dictionary/attachment/components/SignatureTemplate/image-viewer.vue
+++ b/src/views/dictionary/attachment/components/SignatureTemplate/image-viewer.vue
@ -44,10 +44,6 @@ export default {
      type: Function,
      default: () => { },
    },
-    zipImg: {
-      required: true,
-      default: '',
-    },
    rowData:{
      type: Object,
      default: () => {
--- a/src/views/trials/trials-panel/attachments/attachment-management/index.vue
+++ b/src/views/trials/trials-panel/attachments/attachment-management/index.vue
@ -122,6 +122,12 @@
        <!-- 文件名称 -->
        <el-table-column prop="Name" :label="$t('trials:signRecords:table:fileName')" show-overflow-tooltip
          sortable="custom" />
+        <el-table-column :label="$t('trials:signRecords:table:AttachmentCount')" prop="AttachmentCount"
+          show-overflow-tooltip sortable="custom">
+          <template slot-scope="scope">
+            <el-button type="text" @click.stop="openAttachment(scope.row)">{{ scope.row.AttachmentCount }}</el-button>
+          </template>
+        </el-table-column>
        <!-- 文件级别 -->
        <el-table-column prop="IsSystemDoc" :label="$t('trials:signRecords:table:fileLevel')" show-overflow-tooltip
          width="160" sortable="custom" v-if="!isSystem">
@ -201,10 +207,15 @@
    <!-- 预览文件 -->
    <el-dialog v-if="previewVisible" :visible.sync="previewVisible" :title="$t('trials:signRecords:action:preview')"
      :fullscreen="true" append-to-body custom-class="base-dialog-wrapper">
+      <span style="position: fixed; left: 16px; top: 45px;cursor: pointer;" @click.stop="openAttachment(currentRow)"
+        v-if="currentRow.AttachmentCount">{{
+          $t('trials:signRecords:table:AttachmentCount') }} ({{
+          currentRow.AttachmentCount }})</span>
      <div class="base-modal-body" style="border: 2px solid #ccc; padding: 10px">
        <PreviewFile v-if="previewVisible" :file-path="currentPath" :file-type="currentType" @getList="getList" />
      </div>
    </el-dialog>
+    <attachmentPreview :SystemDocumentId="SystemDocumentId" :visible.sync="perview_visible" v-if="perview_visible" />
  </BaseContainer>
 </template>
 <script>
@ -220,6 +231,7 @@ import { pMTrainingRecordList_Export } from '@/api/export'
 import BaseContainer from '@/components/BaseContainer'
 import Pagination from '@/components/Pagination'
 import PreviewFile from '@/components/PreviewFile/index'
+import attachmentPreview from '@/views/dictionary/attachment/components/SignatureTemplate/attachmentPreview'
 const searchDataDefault = () => {
  return {
    UserName: null,
@ -240,7 +252,7 @@ const searchDataDefault = () => {
 }
 export default {
  name: 'AttachmentsManagement',
-  components: { BaseContainer, Pagination, PreviewFile },
+  components: { BaseContainer, Pagination, PreviewFile, attachmentPreview },
  props: {
    isDoc: {
      type: Boolean,
@ -276,7 +288,9 @@ export default {
      trialId: this.$route.query.trialId,
      exportLoading: false,
      timeList: [],
-      timeListC: []
+      timeListC: [],
+      SystemDocumentId: null,
+      perview_visible: null,
    }
  },
  mounted() {
@ -285,6 +299,10 @@ export default {
    this.getUserType()
  },
  methods: {
+    openAttachment(row) {
+      this.SystemDocumentId = row.Id
+      this.perview_visible = true
+    },
    changeTimeList() {
      if (this.timeList) {
        this.searchData.StartConfirmTime = this.timeList[0]
--- a/src/views/trials/trials-panel/attachments/self-attachment/index.vue
+++ b/src/views/trials/trials-panel/attachments/self-attachment/index.vue
@ -5,17 +5,9 @@
      <el-form :inline="true">
        <!-- 文件类型 -->
        <el-form-item :label="$t('trials:self-attachment:table:fileType')">
-          <el-select
-            v-model="searchData.FileTypeId"
-            clearable
-            style="width:150px;"
-          >
-            <el-option
-              v-for="item of typeOptions"
-              :key="item.FileTypeId"
-              :label="item.FileType"
-              :value="item.FileTypeId"
-            />
+          <el-select v-model="searchData.FileTypeId" clearable style="width:150px;">
+            <el-option v-for="item of typeOptions" :key="item.FileTypeId" :label="item.FileType"
+              :value="item.FileTypeId" />
          </el-select>
        </el-form-item>
        <!-- 文件名称 -->
@ -26,7 +18,7 @@
        <el-form-item :label="$t('trials:self-attachment:table:isSign')">
          <el-select v-model="searchData.IsSign" clearable style="width:120px;">
            <template v-for="item of $d.TrainingStatusEnum">
-              <el-option  v-if="item.raw.ValueCN !== '无'" :label="item.label" :value="item.value" :key="item.id"/>
+              <el-option v-if="item.raw.ValueCN !== '无'" :label="item.label" :value="item.value" :key="item.id" />
            </template>
          </el-select>
        </el-form-item>
@ -44,104 +36,70 @@
    </template>
    <template slot="main-container">
      <!-- 系统文件列表 -->
-      <el-table
-        ref="TrialAttachments"
-        v-loading="loading"
-        v-adaptive="{bottomOffset:60}"
-        :data="list"
-        stripe
-        height="100"
-        @sort-change="handleSortByColumn"
-      >
+      <el-table ref="TrialAttachments" v-loading="loading" v-adaptive="{ bottomOffset: 60 }" :data="list" stripe
+        height="100" @sort-change="handleSortByColumn">
        <el-table-column type="selection" width="50" />
        <el-table-column type="index" width="40" />
        <!-- 文件类型 -->
-        <el-table-column
-          prop="FileType"
-          :label="$t('trials:self-attachment:table:fileType')"
-          show-overflow-tooltip
-          sortable="custom"
-        />
+        <el-table-column prop="FileType" :label="$t('trials:self-attachment:table:fileType')" show-overflow-tooltip
+          sortable="custom" />
        <!-- 文件名称 -->
-        <el-table-column
-          prop="Name"
-          :label="$t('trials:self-attachment:table:fileName')"
-          show-overflow-tooltip
-          sortable="custom"
-        />
+        <el-table-column prop="Name" :label="$t('trials:self-attachment:table:fileName')" show-overflow-tooltip
+          sortable="custom" />
+        <el-table-column :label="$t('trials:self-attachment:table:AttachmentCount')" prop="AttachmentCount"
+          show-overflow-tooltip sortable="custom">
+          <template slot-scope="scope">
+            <el-button type="text" @click.stop="openAttachment(scope.row)">{{ scope.row.AttachmentCount }}</el-button>
+          </template>
+        </el-table-column>
        <!-- 是否废除 -->
-        <el-table-column
-          prop="IsDeleted"
-          :label="$t('trials:self-attachment:table:isDeleted')"
-          show-overflow-tooltip
-          sortable="custom"
-        >
+        <el-table-column prop="IsDeleted" :label="$t('trials:self-attachment:table:isDeleted')" show-overflow-tooltip
+          sortable="custom">
          <template slot-scope="scope">
            <el-tag v-if="scope.row.IsDeleted" type="danger">{{ $fd('TrainingStatus', scope.row.IsDeleted) }}</el-tag>
            <el-tag v-else type="primary">{{ $fd('TrainingStatus', scope.row.IsDeleted) }}</el-tag>
          </template>
        </el-table-column>
        <!-- 上传时间 -->
-        <el-table-column
-          prop="CreateTime"
-          :label="$t('trials:self-attachment:table:uploadTime')"
-          show-overflow-tooltip
-          sortable="custom"
-        />
+        <el-table-column prop="CreateTime" :label="$t('trials:self-attachment:table:uploadTime')" show-overflow-tooltip
+          sortable="custom" />
        <!-- 是否签署 -->
-        <el-table-column
-          prop="ConfirmTime"
-          :label="$t('trials:self-attachment:table:isSign')"
-          show-overflow-tooltip
-          sortable="custom"
-        >
+        <el-table-column prop="ConfirmTime" :label="$t('trials:self-attachment:table:isSign')" show-overflow-tooltip
+          sortable="custom">
          <template slot-scope="scope">
-            <el-tag v-if="scope.row.IsConfirmed" type="primary">{{ $fd('TrainingStatusEnum', scope.row.IsConfirmed) }}</el-tag>
+            <el-tag v-if="scope.row.IsConfirmed" type="primary">{{ $fd('TrainingStatusEnum', scope.row.IsConfirmed)
+            }}</el-tag>
            <el-tag v-else type="danger">{{ $fd('TrainingStatusEnum', scope.row.IsConfirmed) }}</el-tag>
          </template>
        </el-table-column>
        <!-- 签署时间 -->
-        <el-table-column
-          prop="ConfirmTime"
-          :label="$t('trials:self-attachment:table:signTime')"
-          show-overflow-tooltip
-          sortable="custom"
-        />
+        <el-table-column prop="ConfirmTime" :label="$t('trials:self-attachment:table:signTime')" show-overflow-tooltip
+          sortable="custom" />

        <el-table-column :label="$t('common:action:action')">
          <template slot-scope="scope">
            <!-- 预览 -->
-            <el-button
-              icon="el-icon-view"
-              circle
-              :title="$t('trials:self-attachment:action:preview')"
-              @click="handlePreview(scope.row)"
-            />
+            <el-button icon="el-icon-view" circle :title="$t('trials:self-attachment:action:preview')"
+              @click="handlePreview(scope.row)" />
            <!-- 签署 -->
-            <el-button
-              icon="el-icon-edit-outline"
-              circle
-              :disabled="!!scope.row.ConfirmTime"
-              :title="$t('trials:self-attachment:action:sign')"
-              @click="handleSign(scope.row)"
-            />
+            <el-button icon="el-icon-edit-outline" circle :disabled="!!scope.row.ConfirmTime"
+              :title="$t('trials:self-attachment:action:sign')" @click="handleSign(scope.row)" />
          </template>
        </el-table-column>
      </el-table>

      <!-- 分页组件 -->
-      <pagination class="page" :total="total" :page.sync="searchData.PageIndex" :limit.sync="searchData.PageSize" @pagination="getList" />
+      <pagination class="page" :total="total" :page.sync="searchData.PageIndex" :limit.sync="searchData.PageSize"
+        @pagination="getList" />
    </template>

    <!-- 预览文件 -->
-    <el-dialog
-      v-if="previewVisible"
-      :visible.sync="previewVisible"
-      :title="title"
-      :fullscreen="true"
-      append-to-body
-      custom-class="base-dialog-wrapper"
-    >
+    <el-dialog v-if="previewVisible" :visible.sync="previewVisible" :title="title" :fullscreen="true" append-to-body
+      custom-class="base-dialog-wrapper">
+      <span style="position: fixed; left: 16px; top: 45px;cursor: pointer;" @click.stop="openAttachment(currentRow)"
+        v-if="currentRow.AttachmentCount">{{
+          $t('trials:self-attachment:table:AttachmentCount') }} ({{
+          currentRow.AttachmentCount }})</span>
      <span v-if="!currentIsConfirm" style="position: fixed;right: 75px;top: 14px;">
        <span style="color:red;margin-right:10px;">
          <!-- 请仔细阅读文件，并签名确认 -->
@ -149,13 +107,8 @@
          <span v-show="duration < currentMinMinutes * 60">{{ `(${currentMinMinutes * 60 - duration}s)` }}</span>
        </span>
        <!-- 签署 -->
-        <el-button
-          size="small"
-          type="primary"
-          :disabled="timer !== null || duration === 0"
-          :loading="btnLoading"
-          @click="handleConfirm"
-        >
+        <el-button size="small" type="primary" :disabled="timer !== null || duration === 0" :loading="btnLoading"
+          @click="handleConfirm">
          {{ $t('common:button:sign') }}
          <!-- {{ duration >= currentMinMinutes * 60?'确认':`确认(${currentMinMinutes * 60 - duration}s)` }} -->
        </el-button>
@ -167,19 +120,16 @@
    </el-dialog>

    <!-- 签名弹框 -->
-    <el-dialog
-      v-if="signVisible"
-      :visible.sync="signVisible"
-      :close-on-click-modal="false"
-      width="600px"
-      append-to-body
-    >
+    <el-dialog v-if="signVisible" :visible.sync="signVisible" :close-on-click-modal="false" width="600px"
+      append-to-body>
      <div slot="title">
        <span style="font-size:18px;">{{ $t('common:dialogTitle:sign') }}</span>
-        <span style="font-size:12px;margin-left:5px">{{ `(${$t('common:label:sign')}${ currentUser })` }}</span>
+        <span style="font-size:12px;margin-left:5px">{{ `(${$t('common:label:sign')}${currentUser})` }}</span>
      </div>
-      <SignForm :is-system-doc="currentRow.IsSystemDoc" :document-id="currentRow.Id" :file-name="fileName" :trial-id="trialId" @closeDialog="closeSignDialog" />
+      <SignForm :is-system-doc="currentRow.IsSystemDoc" :document-id="currentRow.Id" :file-name="fileName"
+        :trial-id="trialId" @closeDialog="closeSignDialog" />
    </el-dialog>
+    <attachmentPreview :SystemDocumentId="SystemDocumentId" :visible.sync="perview_visible" v-if="perview_visible" />
  </BaseContainer>
 </template>
 <script>
@ -189,6 +139,7 @@ import Pagination from '@/components/Pagination'
 import PreviewFile from '@/components/PreviewFile/index'
 import SignForm from './components/SignForm'
 import store from '@/store'
+import attachmentPreview from '@/views/dictionary/attachment/components/SignatureTemplate/attachmentPreview'
 const searchDataDefault = () => {
  return {
    FileTypeId: '',
@ -202,7 +153,7 @@ const searchDataDefault = () => {
 }
 export default {
  name: 'TrialAttachments',
-  components: { BaseContainer, Pagination, PreviewFile, SignForm },
+  components: { BaseContainer, Pagination, PreviewFile, SignForm, attachmentPreview },
  data() {
    return {
      searchData: searchDataDefault(),
@ -223,7 +174,9 @@ export default {
      fileName: '',
      currentUser: zzSessionStorage.getItem('userName'),
      typeOptions: [],
-      trialId: this.$route.query.trialId
+      trialId: this.$route.query.trialId,
+      SystemDocumentId: null,
+      perview_visible: null
    }
  },
  mounted() {
@ -240,6 +193,10 @@ export default {
    }
  },
  methods: {
+    openAttachment(row) {
+      this.SystemDocumentId = row.Id
+      this.perview_visible = true
+    },
    // 获取系统文件数据
    getList() {
      this.loading = true
@ -336,8 +293,8 @@ export default {
              // 文档签署已完成，是否关闭弹窗？
              this.$confirm(this.$t('trials:self-attachment:message:closeDocument')).then(() => {
                this.previewVisible = false
-              }).catch(()=>{})
-              
+              }).catch(() => { })
+
            } else {
              this.handleSign(res.Result)
            }
--- a/src/views/trials/trials-workbench/components/needSignSysDoc.vue
+++ b/src/views/trials/trials-workbench/components/needSignSysDoc.vue
@ -13,91 +13,53 @@
      </el-col>
      <el-col :span="12" style="text-align: right">
        <h3>
-          <Pagination
-            class="page"
-            :total="total"
-            :page.sync="listQuery.pageIndex"
-            :limit.sync="listQuery.pageSize"
-            layout="total, sizes, prev, pager, next"
-            :background="false"
-            style="display: inline-block"
-            @pagination="getList"
-          />
-          <el-button
-            icon="el-icon-refresh-left"
-            size="small"
-            circle
-            :title="$t('common:button:reset')"
-            @click="handleReset"
-          />
+          <Pagination class="page" :total="total" :page.sync="listQuery.pageIndex" :limit.sync="listQuery.pageSize"
+            layout="total, sizes, prev, pager, next" :background="false" style="display: inline-block"
+            @pagination="getList" />
+          <el-button icon="el-icon-refresh-left" size="small" circle :title="$t('common:button:reset')"
+            @click="handleReset" />
        </h3>
      </el-col>
    </el-row>
    <!--  -->
-    <el-table
-      ref="needSignSysList"
-      v-loading="listLoading"
-      :data="list"
-      :show-header="true"
-      v-adaptive="{ bottomOffset: 45 }"
-      height="100"
-      @sort-change="handleSortByColumn"
-      :default-sort="{ prop: 'UpdateTime', order: 'descending' }"
-    >
+    <el-table ref="needSignSysList" v-loading="listLoading" :data="list" :show-header="true"
+      v-adaptive="{ bottomOffset: 45 }" height="100" @sort-change="handleSortByColumn"
+      :default-sort="{ prop: 'UpdateTime', order: 'descending' }">
      <el-table-column type="index" width="40" />
-      <el-table-column
-        :label="$t('trials:sysDocBeSigned:table:fileType')"
-        prop="FileType"
-        show-overflow-tooltip
-        sortable="custom"
-      />
-      <el-table-column
-        :label="$t('trials:sysDocBeSigned:table:fileName')"
-        prop="Name"
-        show-overflow-tooltip
-        sortable="custom"
-      />
-      <el-table-column
-        :label="$t('trials:sysDocBeSigned:table:uploadTime')"
-        prop="CreateTime"
-        show-overflow-tooltip
-        sortable="custom"
-      />
+      <el-table-column :label="$t('trials:sysDocBeSigned:table:fileType')" prop="FileType" show-overflow-tooltip
+        sortable="custom" />
+      <el-table-column :label="$t('trials:sysDocBeSigned:table:fileName')" prop="Name" show-overflow-tooltip
+        sortable="custom" />
+      <el-table-column :label="$t('trials:sysDocBeSigned:table:AttachmentCount')" prop="AttachmentCount"
+        show-overflow-tooltip sortable="custom">
+        <template slot-scope="scope">
+          <el-button type="text" @click.stop="openAttachment(scope.row)">{{ scope.row.AttachmentCount }}</el-button>
+        </template>
+      </el-table-column>
+      <el-table-column :label="$t('trials:sysDocBeSigned:table:uploadTime')" prop="CreateTime" show-overflow-tooltip
+        sortable="custom" />
+      <el-table-column :label="$t('trials:sysDocBeSigned:table:SuggestFinishTime')" prop="SuggestFinishTime"
+        show-overflow-tooltip sortable="custom" />
      <el-table-column :label="$t('common:action:action')" width="140">
        <template slot-scope="scope">
          <!-- 预览 -->
-          <el-button
-            icon="el-icon-view"
-            circle
-            v-if="isSigned"
-            :title="$t('trials:self-attachment:action:preview')"
-            @click="handlePreview(scope.row)"
-          />
-          <el-button
-            icon="el-icon-edit-outline"
-            circle
-            v-if="!isSigned"
+          <el-button icon="el-icon-view" circle v-if="isSigned" :title="$t('trials:self-attachment:action:preview')"
+            @click="handlePreview(scope.row)" />
+          <el-button icon="el-icon-edit-outline" circle v-if="!isSigned"
            :disabled="IsFirstSysDocNeedSign && !!~scope.row.DocTypeCode"
-            :title="$t('trials:needSignSysDoc:action:sign')"
-            @click="handleSign(scope.row)"
-          />
+            :title="$t('trials:needSignSysDoc:action:sign')" @click="handleSign(scope.row)" />
        </template>
      </el-table-column>
    </el-table>

    <!-- 预览/签署文件 -->
-    <el-dialog
-      v-if="previewVisible"
-      :visible.sync="previewVisible"
-      :title="title"
-      :fullscreen="true"
-      append-to-body
-      custom-class="base-dialog-wrapper"
-    >
-      <span
-        v-if="!currentIsConfirm"
-        style="position: fixed; right: 75px; top: 14px"
-      >
+    <el-dialog v-if="previewVisible" :visible.sync="previewVisible" :title="title" :fullscreen="true" append-to-body
+      custom-class="base-dialog-wrapper">
+      <span style="position: fixed; left: 16px; top: 45px;cursor: pointer;" @click.stop="openAttachment(currentRow)"
+        v-if="currentRow.AttachmentCount">{{
+          $t('trials:sysDocBeSigned:table:AttachmentCount') }} ({{
+          currentRow.AttachmentCount }})</span>
+      <span v-if="!currentIsConfirm" style="position: fixed; right: 75px; top: 14px">
        <span style="color: red; margin-right: 10px">
          <!-- 请仔细阅读文件，并签名确认 -->
          {{ $t('common:message:signTip') }}
@ -106,51 +68,30 @@
          }}</span>
        </span>

-        <el-button
-          size="small"
-          type="primary"
-          :disabled="timer !== null || duration === 0"
-          :loading="btnLoading"
-          @click="handleConfirm"
-        >
+        <el-button size="small" type="primary" :disabled="timer !== null || duration === 0" :loading="btnLoading"
+          @click="handleConfirm">
          {{ $t('common:button:sign') }}
        </el-button>
      </span>

-      <div
-        class="base-modal-body"
-        style="border: 2px solid #ccc; padding: 10px"
-      >
-        <PreviewFile
-          v-if="previewVisible"
-          :file-path="currentPath"
-          :file-type="currentType"
-          @getList="getList"
-        />
+      <div class="base-modal-body" style="border: 2px solid #ccc; padding: 10px">
+        <PreviewFile v-if="previewVisible" :file-path="currentPath" :file-type="currentType" @getList="getList" />
      </div>
    </el-dialog>

    <!-- 签名弹框 -->
-    <el-dialog
-      v-if="signVisible"
-      :visible.sync="signVisible"
-      :close-on-click-modal="false"
-      width="600px"
-      append-to-body
-    >
+    <el-dialog v-if="signVisible" :visible.sync="signVisible" :close-on-click-modal="false" width="600px"
+      append-to-body>
      <div slot="title">
        <span style="font-size: 18px">{{ $t('common:dialogTitle:sign') }}</span>
        <span style="font-size: 12px; margin-left: 5px">{{
          `(${$t('common:label:sign')}${currentUser})`
        }}</span>
      </div>
-      <SignForm
-        :is-system-doc="currentRow.IsSystemDoc"
-        :document-id="currentRow.Id"
-        :file-name="fileName"
-        @closeDialog="closeSignDialog"
-      />
+      <SignForm :is-system-doc="currentRow.IsSystemDoc" :document-id="currentRow.Id" :file-name="fileName"
+        @closeDialog="closeSignDialog" />
    </el-dialog>
+    <attachmentPreview :SystemDocumentId="SystemDocumentId" :visible.sync="perview_visible" v-if="perview_visible" />
  </div>
 </template>
 <script>
@ -162,6 +103,7 @@ import {
 import Pagination from '@/components/Pagination'
 import PreviewFile from '@/components/PreviewFile/index'
 import SignForm from '@/views/trials/trials-panel/attachments/self-attachment/components/SignForm'
+import attachmentPreview from '@/views/dictionary/attachment/components/SignatureTemplate/attachmentPreview'
 import { mapGetters } from 'vuex'
 const searchDataDefault = () => {
  return {
@ -173,7 +115,7 @@ const searchDataDefault = () => {
 }
 export default {
  name: 'NeedSignSysDoc',
-  components: { Pagination, PreviewFile, SignForm },
+  components: { Pagination, PreviewFile, SignForm, attachmentPreview },
  props: {
    isSigned: {
      type: Boolean,
@ -200,6 +142,8 @@ export default {
      currentIsConfirm: false,
      currentUser: zzSessionStorage.getItem('userName'),
      currentRow: {},
+      SystemDocumentId: null,
+      perview_visible: false
    }
  },
  mounted() {
@ -214,6 +158,10 @@ export default {
    ...mapGetters(['IsFirstSysDocNeedSign']),
  },
  methods: {
+    openAttachment(row) {
+      this.SystemDocumentId = row.Id
+      this.perview_visible = true
+    },
    // 预览
    handlePreview(row) {
      this.currentRow = { ...row }
@ -303,7 +251,7 @@ export default {
                  .then(() => {
                    this.previewVisible = false
                  })
-                  .catch(() => {})
+                  .catch(() => { })
              } else {
                this.handleSign(res.Result)
              }
--- a/src/views/trials/trials-workbench/components/needSignedSysDoc.vue
+++ b/src/views/trials/trials-workbench/components/needSignedSysDoc.vue
@ -3,84 +3,56 @@
    <el-row>
      <el-col :span="12">
        <!-- 待签署的系统文件 -->
-        <h3>{{ !isSigned ? $t('trials:workbench:title:sysDocBeSigned') : $t('trials:workbench:title:sysDocSigned') }}</h3>
+        <h3>{{ !isSigned ? $t('trials:workbench:title:sysDocBeSigned') : $t('trials:workbench:title:sysDocSigned') }}
+        </h3>
      </el-col>
      <el-col :span="12" style="text-align:right;">
        <h3>
-          <Pagination class="page" :total="total" :page.sync="listQuery.pageIndex" :limit.sync="listQuery.pageSize" layout="total, sizes, prev, pager, next" :background="false" style="display: inline-block;" @pagination="getList" />
-          <el-button icon="el-icon-refresh-left" size="small" circle :title="$t('common:button:reset')" @click="handleReset" />
+          <Pagination class="page" :total="total" :page.sync="listQuery.pageIndex" :limit.sync="listQuery.pageSize"
+            layout="total, sizes, prev, pager, next" :background="false" style="display: inline-block;"
+            @pagination="getList" />
+          <el-button icon="el-icon-refresh-left" size="small" circle :title="$t('common:button:reset')"
+            @click="handleReset" />
        </h3>
      </el-col>
    </el-row>
    <!--  -->
-    <el-table
-      ref="needSignSysList"
-      v-loading="listLoading"
-      :data="list"
-      :show-header="true"
-      v-adaptive="{bottomOffset:45}"
-      height="100"
-      @sort-change="handleSortByColumn"
-      :default-sort ="{prop: 'UpdateTime', order: 'descending'}"
-    >
+    <el-table ref="needSignSysList" v-loading="listLoading" :data="list" :show-header="true"
+      v-adaptive="{ bottomOffset: 45 }" height="100" @sort-change="handleSortByColumn"
+      :default-sort="{ prop: 'UpdateTime', order: 'descending' }">
      <el-table-column type="index" width="40" />
-      <el-table-column
-        :label="$t('trials:sysDocBeSigned:table:fileType')"
-        prop="FileType"
-        show-overflow-tooltip
-        sortable="custom"
-      />
-      <el-table-column
-        :label="$t('trials:sysDocBeSigned:table:fileName')"
-        prop="Name"
-        show-overflow-tooltip
-        sortable="custom"
-      />
-      <el-table-column
-        :label="$t('trials:sysDocBeSigned:table:uploadTime')"
-        prop="CreateTime"
-        show-overflow-tooltip
-        sortable="custom"
-      />
-      <el-table-column
-        :label="$t('trials:sysDocBeSigned:table:ConfirmTime')"
-        prop="ConfirmTime"
-        show-overflow-tooltip
-        sortable="custom"
-      />
-      <el-table-column
-        :label="$t('common:action:action')"
-        width="140"
-      >
+      <el-table-column :label="$t('trials:sysDocBeSigned:table:fileType')" prop="FileType" show-overflow-tooltip
+        sortable="custom" />
+      <el-table-column :label="$t('trials:sysDocBeSigned:table:fileName')" prop="Name" show-overflow-tooltip
+        sortable="custom" />
+      <el-table-column :label="$t('trials:sysDocBeSigned:table:AttachmentCount')" prop="AttachmentCount"
+        show-overflow-tooltip sortable="custom">
+        <template slot-scope="scope">
+          <el-button type="text" @click.stop="openAttachment(scope.row)">{{ scope.row.AttachmentCount }}</el-button>
+        </template>
+      </el-table-column>
+      <el-table-column :label="$t('trials:sysDocBeSigned:table:uploadTime')" prop="CreateTime" show-overflow-tooltip
+        sortable="custom" />
+      <el-table-column :label="$t('trials:sysDocBeSigned:table:ConfirmTime')" prop="ConfirmTime" show-overflow-tooltip
+        sortable="custom" />
+      <el-table-column :label="$t('common:action:action')" width="140">
        <template slot-scope="scope">
          <!-- 预览 -->
-          <el-button
-            icon="el-icon-view"
-            circle
-            v-if="isSigned"
-            :title="$t('trials:self-attachment:action:preview')"
-            @click="handlePreview(scope.row)"
-          />
-          <el-button
-            icon="el-icon-edit-outline"
-            circle
-            v-if="!isSigned"
-            :title="$t('trials:needSignedSysDoc:action:sign')"
-            @click="handleSign(scope.row)"
-          />
+          <el-button icon="el-icon-view" circle v-if="isSigned" :title="$t('trials:self-attachment:action:preview')"
+            @click="handlePreview(scope.row)" />
+          <el-button icon="el-icon-edit-outline" circle v-if="!isSigned"
+            :title="$t('trials:needSignedSysDoc:action:sign')" @click="handleSign(scope.row)" />
        </template>
      </el-table-column>
    </el-table>

    <!-- 预览/签署文件 -->
-    <el-dialog
-      v-if="previewVisible"
-      :visible.sync="previewVisible"
-      :title="title"
-      :fullscreen="true"
-      append-to-body
-      custom-class="base-dialog-wrapper"
-    >
+    <el-dialog v-if="previewVisible" :visible.sync="previewVisible" :title="title" :fullscreen="true" append-to-body
+      custom-class="base-dialog-wrapper">
+      <span style="position: fixed; left: 16px; top: 45px;cursor: pointer;" @click.stop="openAttachment(currentRow)"
+        v-if="currentRow.AttachmentCount">{{
+          $t('trials:sysDocBeSigned:table:AttachmentCount') }} ({{
+          currentRow.AttachmentCount }})</span>
      <span v-if="!currentIsConfirm" style="position: fixed;right: 75px;top: 14px;">
        <span style="color:red;margin-right:10px;">
          <!-- 请仔细阅读文件，并签名确认 -->
@ -88,13 +60,8 @@
          <span v-show="duration < currentMinMinutes * 60">{{ `(${currentMinMinutes * 60 - duration}s)` }}</span>
        </span>

-        <el-button
-          size="small"
-          type="primary"
-          :disabled="timer !== null || duration === 0"
-          :loading="btnLoading"
-          @click="handleConfirm"
-        >
+        <el-button size="small" type="primary" :disabled="timer !== null || duration === 0" :loading="btnLoading"
+          @click="handleConfirm">
          {{ $t('common:button:sign') }}
        </el-button>
      </span>
@ -105,19 +72,16 @@
    </el-dialog>

    <!-- 签名弹框 -->
-    <el-dialog
-      v-if="signVisible"
-      :visible.sync="signVisible"
-      :close-on-click-modal="false"
-      width="600px"
-      append-to-body
-    >
+    <el-dialog v-if="signVisible" :visible.sync="signVisible" :close-on-click-modal="false" width="600px"
+      append-to-body>
      <div slot="title">
        <span style="font-size:18px;">{{ $t('common:dialogTitle:sign') }}</span>
-        <span style="font-size:12px;margin-left:5px">{{ `(${$t('common:label:sign')}${ currentUser })` }}</span>
+        <span style="font-size:12px;margin-left:5px">{{ `(${$t('common:label:sign')}${currentUser})` }}</span>
      </div>
-      <SignForm :is-system-doc="currentRow.IsSystemDoc" :document-id="currentRow.Id" :file-name="fileName" @closeDialog="closeSignDialog" />
+      <SignForm :is-system-doc="currentRow.IsSystemDoc" :document-id="currentRow.Id" :file-name="fileName"
+        @closeDialog="closeSignDialog" />
    </el-dialog>
+    <attachmentPreview :SystemDocumentId="SystemDocumentId" :visible.sync="perview_visible" v-if="perview_visible" />
  </div>
 </template>
 <script>
@ -125,6 +89,7 @@ import { getWaitSignSysDocList, setSystemDocFirstViewTime } from '@/api/trials'
 import Pagination from '@/components/Pagination'
 import PreviewFile from '@/components/PreviewFile/index'
 import SignForm from '@/views/trials/trials-panel/attachments/self-attachment/components/SignForm'
+import attachmentPreview from '@/views/dictionary/attachment/components/SignatureTemplate/attachmentPreview'
 const searchDataDefault = () => {
  return {
    pageIndex: 1,
@ -135,7 +100,7 @@ const searchDataDefault = () => {
 }
 export default {
  name: 'NeedSignSysDoc',
-  components: { Pagination, PreviewFile, SignForm },
+  components: { Pagination, PreviewFile, SignForm, attachmentPreview },
  props: {
    isSigned: {
      type: Boolean,
@ -159,7 +124,9 @@ export default {
      currentType: '',
      currentIsConfirm: false,
      currentUser: zzSessionStorage.getItem('userName'),
-      currentRow: {}
+      currentRow: {},
+      perview_visible: false,
+      SystemDocumentId: null
    }
  },
  mounted() {
@ -171,6 +138,10 @@ export default {
    }
  },
  methods: {
+    openAttachment(row) {
+      this.SystemDocumentId = row.Id
+      this.perview_visible = true
+    },
    // 预览
    handlePreview(row) {
      this.currentRow = { ...row }
@ -270,8 +241,7 @@ export default {
 </script>

 <style lang="scss" scoped>
-.needSignSys-wrapper{
+.needSignSys-wrapper {
  height: 100%;
 }
-
 </style>