Merge branch 'uat'

# Conflicts:
#	src/views/trials/trials-panel/visit/crc-upload/components/studyInfo.vue
#	src/views/trials/trials-panel/visit/crc-upload/components/uploadDicomFiles2.vue

src/App.vue

@@ -29,7 +29,7 @@
       direction="rtl"
       size="80%"
     >
-      <div style="width: 620px">
+      <div style="width: 800px">
         <el-form
           label-width="100px"
           @submit.native.prevent

src/api/admin.js

@@ -342,3 +342,11 @@ export function addNewUserSendEmail(data) {
     data
   })
 }
+// 用户追溯
+export function getUserJoinedTrialList(data) {
+  return request({
+    url: `/TrialMaintenance/getUserJoinedTrialList`,
+    method: 'post',
+    data
+  })
+}

src/api/dictionary.js

@@ -1069,4 +1069,160 @@ export function batchAddEnrollOrPdEmailConfig(params) {
     method: 'post',
     params
   })
-}
+}
+// 文件记录-系统文件列表
+export function getSysFileTypeList(data) {
+  return request({
+    url: `/SysFileType/getSysFileTypeList`,
+    method: 'post',
+    data
+  })
+}
+// 文件记录-新增/编辑系统文件
+export function addOrUpdateSysFileType(data) {
+  return request({
+    url: `/SysFileType/addOrUpdateSysFileType`,
+    method: 'post',
+    data
+  })
+}
+// 文件记录-删除系统文件
+export function deleteSysFileType(id) {
+  return request({
+    url: `/SysFileType/deleteSysFileType/${id}`,
+    method: 'delete'
+  })
+}
+// 项目文档-获取项目菜单
+export function getTrialFileTypeData(data) {
+  return request({
+    url: `/TrialFileType/getTrialFileTypeData`,
+    method: 'post',
+    data
+  })
+}
+// 项目文档-修改项目菜单启用
+export function setAuthorizedView(data) {
+  return request({
+    url: `/TrialFileType/setAuthorizedView`,
+    method: 'post',
+    data
+  })
+}
+// 项目文档-新增/修改项目菜单
+export function addOrUpdateTrialFileType(data) {
+  return request({
+    url: `/TrialFileType/addOrUpdateTrialFileType`,
+    method: 'post',
+    data
+  })
+}
+// 项目文档-删除项目菜单
+export function deleteTrialFileType(id) {
+  return request({
+    url: `/TrialFileType/deleteTrialFileType/${id}`,
+    method: 'delete',
+  })
+}
+// 项目文档-报告/文档列表
+export function getTrialFinalRecordList(data) {
+  return request({
+    url: `/TrialFinalRecord/getTrialFinalRecordList`,
+    method: 'post',
+    data
+  })
+}
+// 项目文档-报告/文档授权
+export function authorizedTrialFinalRecord(data) {
+  return request({
+    url: `/TrialFinalRecord/authorizedTrialFinalRecord`,
+    method: 'post',
+    data
+  })
+}
+// 项目文档-报告/文档新增/修改
+export function addOrUpdateTrialFinalRecord(data) {
+  return request({
+    url: `/TrialFinalRecord/addOrUpdateTrialFinalRecord`,
+    method: 'post',
+    data
+  })
+}
+// 项目文档-删除报告/文档
+export function deleteTrialFinalRecord(id) {
+  return request({
+    url: `/TrialFinalRecord/deleteTrialFinalRecord/${id}`,
+    method: 'delete',
+  })
+}
+// 项目文档-一般文件记录列表
+export function getTrialNormalRecordList(data) {
+  return request({
+    url: `/TrialNormalRecord/getTrialNormalRecordList`,
+    method: 'post',
+    data
+  })
+}
+// 项目文档-一般文件记录授权
+export function authorizedTTrialNormalRecord(data) {
+  return request({
+    url: `/TrialNormalRecord/authorizedTTrialNormalRecord`,
+    method: 'post',
+    data
+  })
+}
+// 项目文档-一般文件记录批量新增
+export function batchAddTrialNormalRecord(data) {
+  return request({
+    url: `/TrialNormalRecord/batchAddTrialNormalRecord`,
+    method: 'post',
+    data
+  })
+}
+// 项目文档-一般文件记录新增/修改
+export function addOrUpdateTrialNormalRecord(data) {
+  return request({
+    url: `/TrialNormalRecord/addOrUpdateTrialNormalRecord`,
+    method: 'post',
+    data
+  })
+}
+// 项目文档-删除一般文件记录
+export function deleteTrialNormalRecord(id) {
+  return request({
+    url: `/TrialNormalRecord/deleteTrialNormalRecord/${id}`,
+    method: 'delete',
+  })
+}
+// 项目文档-批量删除一般文件记录
+export function deleteTrialNormalRecordList(data) {
+  return request({
+    url: `/TrialNormalRecord/deleteTrialNormalRecordList`,
+    method: 'post',
+    data
+  })
+}
+// 项目文档-培训记录列表
+export function getTrialTrianingRecordList(data) {
+  return request({
+    url: `/TrialTrianingRecord/getTrialTrianingRecordList`,
+    method: 'post',
+    data
+  })
+}
+// 项目文档-培训记录新增/修改
+export function addOrUpdateTrialTrianingRecord(data) {
+  return request({
+    url: `/TrialTrianingRecord/addOrUpdateTrialTrianingRecord`,
+    method: 'post',
+    data
+  })
+}
+// 项目文档-培训记录批量新增/修改
+export function batchAddTrialTrianingRecord(data) {
+  return request({
+    url: `/TrialTrianingRecord/batchAddTrialTrianingRecord`,
+    method: 'post',
+    data
+  })
+}

src/api/trials.js

@@ -3940,8 +3940,6 @@ export function updateTrialUserRole(data) {
   })
 }
 
-
-
 // 获取报表配置
 export function getTrialQuestionExportResult(data) {
   return request({
@@ -3965,4 +3963,29 @@ export function trialUserSendJoinEmail(data) {
     method: 'post',
     data
   })
-}
+}
+
+// 获取非Dicom标记
+export function getNoneDicomMarkListOutDto(data) {
+  return request({
+    url: `/ReadingImageTask/getNoneDicomMarkListOutDto`,
+    method: 'post',
+    data
+  })
+}
+// 添加非Dicom标记
+export function addNoneDicomMark(data) {
+  return request({
+    url: `/ReadingImageTask/addNoneDicomMark`,
+    method: 'post',
+    data
+  })
+}
+// 删除非Dicom标记
+export function deleteTrialFileType(id) {
+  return request({
+    url: `/ReadingImageTask/deleteTrialFileType/${id}`,
+    method: 'post'
+  })
+}
+

src/components/BaseForm/search-form.vue

@@ -146,17 +146,19 @@
         <!-- 具名slot -->
         <slot v-if="item.type === 'Custom'" :name="item.slot" />
       </el-form-item>
-      <el-form-item v-for="item in searchHandle" :key="item.label">
-        <slot v-if="item.slot" :name="item.slot" />
-        <el-button
-          v-else
-          :type="item.type"
-          :size="item.size || size"
-          :icon="item.icon || ''"
-          @click="handleClick(item.emitKey)"
-          >{{ item.label }}</el-button
-        >
-      </el-form-item>
+      <div style="display: inline-block;width: fit-content;">
+        <el-form-item v-for="item in searchHandle" :key="item.label">
+          <slot v-if="item.slot" :name="item.slot" />
+          <el-button
+            v-else
+            :type="item.type"
+            :size="item.size || size"
+            :icon="item.icon || ''"
+            @click="handleClick(item.emitKey)"
+            >{{ item.label }}</el-button
+          >
+        </el-form-item>
+      </div>
     </el-form>
   </div>
 </template>
@@ -174,11 +176,11 @@ export default {
     },
     labelWidth: {
       type: String,
-      default: "",
+      default: '',
     },
     size: {
       type: String,
-      default: "mini",
+      default: 'mini',
     },
     searchForm: {
       type: Array,
@@ -196,10 +198,10 @@ export default {
   methods: {
     handleClick(emitKey) {
       // emit事件
-      this.$emit(`${emitKey}`);
+      this.$emit(`${emitKey}`)
     },
   },
-};
+}
 </script>
 <style lang="scss">
 .base-search-form {

src/main.js

@@ -461,8 +461,8 @@ async function VueInit() {
             var my_username = zzSessionStorage.getItem('my_username')
             var my_password = zzSessionStorage.getItem('my_password')
             let my_userid = zzSessionStorage.getItem('userId')
-            let my_EMail = zzSessionStorage.getItem('my_EMail')
-            if (md5(_vm.unlock.my_password) === my_password && my_username === _vm.unlock.my_username) {
+            let my_EMail = zzSessionStorage.getItem('my_EMail') || ''
+            if (md5(_vm.unlock.my_password) === my_password && (my_username === _vm.unlock.my_username || my_EMail.toUpperCase() === vm.unlock.my_username.toUpperCase())) {
               resetReadingRestTime().then(() => {
               })
               const closeLock = (_vm) => {

src/permission.js

@@ -7,15 +7,15 @@ import 'nprogress/nprogress.css'
 import { getToken, removeToken } from '@/utils/auth'
 import Vue from 'vue'
 import { OSSclient } from './utils/oss'
-import WHITELIST from "./utils/whiteList"
+import WHITELIST from './utils/whiteList'
 import { getTrialExtralConfig } from '@/api/trials'
 // import getPageTitle from '@/utils/get-page-title'
 
 NProgress.configure({ showSpinner: false })
 
 const whiteList = WHITELIST
-store.state.trials.whiteList = whiteList;
-router.beforeEach(async (to, from, next) => {
+store.state.trials.whiteList = whiteList
+router.beforeEach(async(to, from, next) => {
   NProgress.start()
   // 设置页面标题
   // document.title = getPageTitle(to.meta.title) store.state.trials.whiteList.indexOf(to.path) === -1
@@ -27,13 +27,13 @@ router.beforeEach(async (to, from, next) => {
     to.query.trialId !==
     store.state.trials.config.trialId
   ) {
-    let res = await getTrialExtralConfig({
-      TrialId: to.query.trialId,
+    const res = await getTrialExtralConfig({
+      TrialId: to.query.trialId
     })
     if (res.IsSuccess) {
       store.dispatch('trials/setConfig', {
         trialId: to.query.trialId,
-        ...res.Result,
+        ...res.Result
       })
     }
   }
@@ -45,13 +45,13 @@ router.beforeEach(async (to, from, next) => {
     to.query.trialId !==
     store.state.trials.config.trialId
   ) {
-    let res = await getTrialExtralConfig({
-      TrialId: to.query.trialId,
+    const res = await getTrialExtralConfig({
+      TrialId: to.query.trialId
     })
     if (res.IsSuccess) {
       store.dispatch('trials/setConfig', {
         trialId: to.query.trialId,
-        ...res.Result,
+        ...res.Result
       })
     }
   }
@@ -72,12 +72,12 @@ router.beforeEach(async (to, from, next) => {
       NProgress.done()
     } else if (from.path === '/researchForm') {
       removeToken()
-      let lang = to.query.lang || zzSessionStorage.getItem('lang')
+      const lang = to.query.lang || zzSessionStorage.getItem('lang')
       next(`/researchLogin?trialId=${to.query.trialId}&lang=${lang}`)
       NProgress.done()
     } else if (from.path === '/researchDetail_m') {
       removeToken()
-      let lang = to.query.lang || zzSessionStorage.getItem('lang')
+      const lang = to.query.lang || zzSessionStorage.getItem('lang')
       next(`/researchLogin_m?trialId=${to.query.trialId}&lang=${lang}`)
       NProgress.done()
     } else {
@@ -107,7 +107,7 @@ router.beforeEach(async (to, from, next) => {
     /* has no token*/
     if (whiteList.indexOf(to.path) !== -1) {
       if (to.path === '/researchLogin') {
-        let lang = to.query.lang || zzSessionStorage.getItem('lang')
+        const lang = to.query.lang || zzSessionStorage.getItem('lang')
         const flag = navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i)
         if (flag) {
           next(`/researchLogin_m?trialId=${to.query.trialId}&lang=${lang}`)
@@ -123,11 +123,11 @@ router.beforeEach(async (to, from, next) => {
       }
     } else {
       if (to.path === '/researchForm') {
-        let lang = to.query.lang || zzSessionStorage.getItem('lang')
+        const lang = to.query.lang || zzSessionStorage.getItem('lang')
         next(`/researchLogin?trialId=${to.query.trialId}&lang=${lang}`)
         NProgress.done()
       } else if (to.path === '/researchDetail_m') {
-        let lang = to.query.lang || zzSessionStorage.getItem('lang')
+        const lang = to.query.lang || zzSessionStorage.getItem('lang')
         next(`/researchLogin_m?trialId=${to.query.trialId}&lang=${lang}`)
         NProgress.done()
       } else if (to.path === '/ReviewersResearchForm') {

src/store/getters.js

@@ -48,6 +48,8 @@ const getters = {
   TotalNeedSignSystemDocCount: state => state.user.TotalNeedSignSystemDocCount,
   TotalNeedSignTrialDocCount: state => state.user.TotalNeedSignTrialDocCount,
   IsFirstSysDocNeedSign: state => state.user.IsFirstSysDocNeedSign,
-  TrialStatusStr: state => state.user.TrialStatusStr
+  TrialStatusStr: state => state.user.TrialStatusStr,
+  lastViewportTaskId: state => state.noneDicomReview.lastViewportTaskId,
+  currentTaskState: state => state.noneDicomReview.currentTaskState
 }
 export default getters

src/store/index.js

@@ -12,7 +12,7 @@ import trials from './modules/trials'
 import financials from './modules/financials'
 import reading from './modules/reading'
 import lang from './modules/lang'
-
+import noneDicomReview from './modules/noneDicomReview'
 Vue.use(Vuex)
 
 const store = new Vuex.Store({
@@ -27,7 +27,8 @@ const store = new Vuex.Store({
     trials,
     financials,
     reading,
-    lang
+    lang,
+    noneDicomReview
   },
   getters
 })

src/store/modules/noneDicomReview.js

@@ -0,0 +1,28 @@
+const getDefaultState = () => {
+  return {
+    lastViewportTaskId: null,
+    currentTaskState: 0
+  }
+}
+const state = getDefaultState
+
+const mutations = {
+
+}
+
+const actions = {
+  setLastViewportTaskId({ state }, id) {
+    state.lastViewportTaskId = id
+  },
+  setCurrentTaskState({ state }, taskState) {
+    state.currentTaskState = taskState
+  }
+}
+
+export default {
+  namespaced: true,
+  state,
+  mutations,
+  actions
+}
+

src/utils/index.js

@@ -34,7 +34,7 @@ export function parseTime(time, cFormat) {
   const time_str = format.replace(/{([ymdhisa])+}/g, (result, key) => {
     const value = formatObj[key]
     // Note: getDay() returns 0 on Sunday
-    if (key === 'a') { return ['日', '一', '二', '三', '四', '五', '六'][value ] }
+    if (key === 'a') { return ['日', '一', '二', '三', '四', '五', '六'][value] }
     return value.toString().padStart(2, '0')
   })
   return time_str
@@ -51,12 +51,44 @@ export function param2Obj(url) {
   }
   return JSON.parse(
     '{"' +
-      decodeURIComponent(search)
-        .replace(/"/g, '\\"')
-        .replace(/&/g, '","')
-        .replace(/=/g, '":"')
-        .replace(/\+/g, ' ') +
-      '"}'
+    decodeURIComponent(search)
+      .replace(/"/g, '\\"')
+      .replace(/&/g, '","')
+      .replace(/=/g, '":"')
+      .replace(/\+/g, ' ') +
+    '"}'
   )
 }
 
+export function deepClone(source, map = new WeakMap()) {
+  // 处理基本类型和函数（直接返回）
+  if (typeof source !== 'object' || source === null) {
+    return source;
+  }
+
+  // 处理循环引用
+  if (map.has(source)) {
+    return map.get(source);
+  }
+
+  // 创建新容器
+  const target = Array.isArray(source) ? [] : {};
+  map.set(source, target);  // 记录克隆关系
+
+  // 克隆普通键值
+  for (const key in source) {
+    if (Object.prototype.hasOwnProperty.call(source, key)) {
+      target[key] = deepClone(source[key], map);
+    }
+  }
+
+  // 克隆Symbol键值（ES6+）
+  const symbolKeys = Object.getOwnPropertySymbols(source);
+  for (const symKey of symbolKeys) {
+    if (source.propertyIsEnumerable(symKey)) {
+      target[symKey] = deepClone(source[symKey], map);
+    }
+  }
+
+  return target;
+}

src/utils/oss.js

@@ -41,7 +41,13 @@ async function ossGenerateSTS() {
               let _vm = router.default.app
               if (_vm._route.path !== '/trials/trials-panel/visit/crc-upload') {
                 var objectItem = objectName.split('/')
-                objectItem[objectItem.length - 1] = new Date().getTime() + '_' + objectItem[objectItem.length - 1]
+                // objectItem[objectItem.length - 1] = new Date().getTime() + '_' + objectItem[objectItem.length - 1]
+                objectItem[objectItem.length - 1] = `${objectItem[objectItem.length - 1].substring(
+                  0,
+                  objectItem[objectItem.length - 1].lastIndexOf('.')
+                )}__${new Date().getTime()}${objectItem[objectItem.length - 1].substring(
+                  objectItem[objectItem.length - 1].lastIndexOf('.')
+                ).toLocaleLowerCase()}`
                 objectName = objectItem.join('/')
               }
               let res = await OSSclient.put(objectName, object)
@@ -78,7 +84,13 @@ async function ossGenerateSTS() {
               let _vm = router.default.app
               if (_vm._route.path !== '/trials/trials-panel/visit/crc-upload') {
                 var objectItem = data.path.split('/')
-                objectItem[objectItem.length - 1] = new Date().getTime() + '_' + objectItem[objectItem.length - 1]
+                // objectItem[objectItem.length - 1] = new Date().getTime() + '_' + objectItem[objectItem.length - 1]
+                objectItem[objectItem.length - 1] = `${objectItem[objectItem.length - 1].substring(
+                  0,
+                  objectItem[objectItem.length - 1].lastIndexOf('.')
+                )}__${new Date().getTime()}${objectItem[objectItem.length - 1].substring(
+                  objectItem[objectItem.length - 1].lastIndexOf('.')
+                ).toLocaleLowerCase()}`
                 data.path = objectItem.join('/')
               }
               let res = await customerHttp(OSSclient, data, progress);
@@ -185,7 +197,13 @@ function uploadAWS(aws, data, progress) {
       let _vm = router.default.app
       if (_vm._route.path !== '/trials/trials-panel/visit/crc-upload') {
         var objectItem = data.path.split('/')
-        objectItem[objectItem.length - 1] = new Date().getTime() + '_' + objectItem[objectItem.length - 1]
+        // objectItem[objectItem.length - 1] = new Date().getTime() + '_' + objectItem[objectItem.length - 1]
+        objectItem[objectItem.length - 1] = `${objectItem[objectItem.length - 1].substring(
+          0,
+          objectItem[objectItem.length - 1].lastIndexOf('.')
+        )}__${new Date().getTime()}${objectItem[objectItem.length - 1].substring(
+          objectItem[objectItem.length - 1].lastIndexOf('.')
+        ).toLocaleLowerCase()}`
         data.path = objectItem.join('/')
       }
       let bucketName = data.path.split("/")[1] || Vue.prototype.OSSclientConfig.bucket

src/utils/stream.js

@@ -20,7 +20,7 @@ function zipFiles(zipName, files) {
                         ctrl.close();
                     } else {
                         let { name, url } = fileInfo.value;
-                        url = decodeUtf8(url);
+                        // url = decodeUtf8(url); // 待定，可能做过特殊处理
                         return fetch(url).then(res => {
                             ctrl.enqueue({
                                 name,
@@ -58,7 +58,7 @@ async function updateFile(file, name) {
         try {
             store.dispatch('trials/setUnLock', true)
             const fileOutputStream = streamSaver.createWriteStream(name);
-            file = decodeUtf8(file);
+            // file = decodeUtf8(file);
             let res = await fetch(file);
             res.body.pipeTo(fileOutputStream).then(() => {
                 store.dispatch('trials/setUnLock', true)

src/views/dictionary/template/file/fileForm.vue

@@ -0,0 +1,191 @@
+<template>
+  <base-model :config="config">
+    <div slot="dialog-body">
+      <el-form
+        ref="fileForm"
+        :model="form"
+        label-width="100px"
+        size="small"
+        :rules="rules"
+      >
+        <div class="base-dialog-body">
+          <el-form-item :label="$t('dictionary:file:form:name')" prop="Name">
+            <el-input v-model="form.Name" />
+          </el-form-item>
+          <el-form-item
+            :label="$t('dictionary:file:form:nameCN')"
+            prop="NameCN"
+          >
+            <el-input v-model="form.NameCN" />
+          </el-form-item>
+          <el-form-item
+            :label="$t('dictionary:browser:form:ArchiveTypeEnum')"
+            prop="ArchiveTypeEnum"
+          >
+            <el-select
+              v-model="form.ArchiveTypeEnum"
+              clearable
+              placeholder=""
+              style="width: 100%"
+            >
+              <el-option
+                v-for="item in $d.ArchiveType"
+                :key="item.id"
+                :label="item.label"
+                :value="item.value"
+              >
+              </el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item
+            :label="$t('dictionary:browser:form:SubIdentificationEnum')"
+            prop="SubIdentificationEnum"
+          >
+            <el-select
+              style="width: 100%"
+              v-model="form.SubIdentificationEnum"
+              clearable
+              placeholder=""
+            >
+              <el-option
+                v-for="item in $d.SubIdentification"
+                :key="item.id"
+                :label="item.label"
+                :value="item.value"
+              >
+              </el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item :label="$t('dictionary:file:form:IsEnable')">
+            <el-switch
+              v-model="form.IsEnable"
+              :active-value="true"
+              :inactive-value="false"
+            >
+            </el-switch>
+          </el-form-item>
+          <el-form-item :label="$t('dictionary:file:form:IsConfirmRecord')">
+            <el-switch
+              v-model="form.IsConfirmRecord"
+              :active-value="true"
+              :inactive-value="false"
+            >
+            </el-switch>
+          </el-form-item>
+        </div>
+      </el-form>
+    </div>
+    <div slot="dialog-footer">
+      <el-button size="small" @click="canel">
+        {{ $t('dictionary:browser:button:canel') }}
+      </el-button>
+      <el-button size="small" type="primary" :loading="loading" @click="save">
+        {{ $t('dictionary:browser:button:save') }}
+      </el-button>
+    </div>
+  </base-model>
+</template>
+  <script>
+import baseModel from '@/components/BaseModel'
+import { addOrUpdateSysFileType } from '@/api/dictionary'
+export default {
+  props: {
+    config: {
+      required: true,
+      default: () => {
+        return {}
+      },
+    },
+    data: {
+      required: true,
+      default: () => {
+        return {}
+      },
+    },
+  },
+  components: {
+    'base-model': baseModel,
+  },
+  data() {
+    return {
+      form: {
+        ArchiveTypeEnum: null,
+        IsConfirmRecord: true,
+        IsEnable: true,
+        Name: null,
+        NameCN: null,
+        SubIdentificationEnum: null,
+      },
+      rules: {
+        Name: [
+          {
+            required: true,
+            message: this.$t('common:ruleMessage:specify'),
+            trigger: ['blur', 'change'],
+          },
+        ],
+        NameCN: [
+          {
+            required: true,
+            message: this.$t('common:ruleMessage:specify'),
+            trigger: ['blur', 'change'],
+          },
+        ],
+        SubIdentificationEnum: [
+          {
+            required: true,
+            message: this.$t('common:ruleMessage:select'),
+            trigger: ['blur', 'change'],
+          },
+        ],
+        ArchiveTypeEnum: [
+          {
+            required: true,
+            message: this.$t('common:ruleMessage:select'),
+            trigger: ['blur', 'change'],
+          },
+        ],
+      },
+      fileList: [],
+      loading: false,
+    }
+  },
+  created() {
+    if (this.config.status === 'edit') {
+      Object.keys(this.form).forEach((key) => {
+        this.form[key] = this.data[key]
+      })
+      if (this.form.FileName) {
+        this.fileList[0] = {
+          name: this.form.FileName,
+          path: this.form.Path,
+          fullPath: this.form.Path,
+        }
+      }
+    }
+  },
+  methods: {
+    async save() {
+      try {
+        let validate = await this.$refs.fileForm.validate()
+        if (!validate) return false
+        this.loading = true
+        if (this.config.status === 'edit') {
+          this.form.Id = this.data.Id
+        }
+        let res = await addOrUpdateSysFileType(this.form)
+        if (res.IsSuccess) {
+          this.$emit('close')
+          this.$emit('getList')
+        }
+      } catch (err) {
+        console.log(err)
+        this.loading = false
+      }
+    },
+    canel() {
+      this.$emit('close')
+    },
+  },
+}
+</script>

src/views/dictionary/template/file/index.vue

@@ -0,0 +1,340 @@
+<template>
+  <BoxContent>
+    <box-content>
+      <!-- 搜索框 -->
+      <div class="search">
+        <el-form :inline="true" size="mini" class="base-search-form">
+          <el-form-item :label="$t('dictionary:file:search:Name')">
+            <el-input v-model="searchData.Name" style="width: 100px" />
+          </el-form-item>
+          <el-form-item :label="$t('dictionary:file:search:NameCN')">
+            <el-input v-model="searchData.NameCN" style="width: 100px" />
+          </el-form-item>
+          <el-form-item :label="$t('dictionary:file:search:archiveTypeEnum')">
+            <el-select
+              v-model="searchData.ArchiveTypeEnum"
+              clearable
+              placeholder=""
+              style="width: 100px"
+            >
+              <el-option
+                v-for="item in $d.ArchiveType"
+                :key="item.id"
+                :label="item.label"
+                :value="item.value"
+              >
+              </el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item
+            :label="$t('dictionary:file:search:subIdentificationEnum')"
+          >
+            <el-select
+              v-model="searchData.SubIdentificationEnum"
+              clearable
+              placeholder=""
+              style="width: 100px"
+            >
+              <el-option
+                v-for="item in $d.SubIdentification"
+                :key="item.id"
+                :label="item.label"
+                :value="item.value"
+              >
+              </el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item :label="$t('dictionary:file:search:isEnable')">
+            <el-select
+              v-model="searchData.IsEnable"
+              clearable
+              placeholder=""
+              style="width: 100px"
+            >
+              <el-option
+                v-for="item in $d.YesOrNo"
+                :key="item.id"
+                :label="item.label"
+                :value="item.value"
+              >
+              </el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item :label="$t('dictionary:file:search:isConfirmRecord')">
+            <el-select
+              v-model="searchData.IsConfirmRecord"
+              clearable
+              placeholder=""
+              style="width: 100px"
+            >
+              <el-option
+                v-for="item in $d.YesOrNo"
+                :key="item.id"
+                :label="item.label"
+                :value="item.value"
+              >
+              </el-option>
+            </el-select>
+          </el-form-item>
+
+          <el-form-item>
+            <el-button
+              type="primary"
+              icon="el-icon-search"
+              @click="handleSearch"
+            >
+              {{ $t('common:button:search') }}
+            </el-button>
+            <el-button
+              type="primary"
+              icon="el-icon-refresh-left"
+              @click="handleReset"
+            >
+              {{ $t('common:button:reset') }}
+            </el-button>
+          </el-form-item>
+        </el-form>
+        <span style="margin-left: auto">
+          <el-button type="primary" size="mini" @click="handleAdd">
+            {{ $t('dictionary:browser:button:add') }}
+          </el-button>
+        </span>
+      </div>
+
+      <el-table
+        v-loading="loading"
+        v-adaptive="{ bottomOffset: 45 }"
+        :data="list"
+        stripe
+        height="100"
+        style="width: 100%"
+        @sort-change="handleSortByColumn"
+      >
+        <el-table-column type="index" width="40" />
+
+        <el-table-column
+          prop="Name"
+          :label="$t('dictionary:file:table:Name')"
+          sortable="custom"
+          show-overflow-tooltip
+        />
+        <el-table-column
+          prop="NameCN"
+          :label="$t('dictionary:file:table:NameCN')"
+          show-overflow-tooltip
+          sortable="custom"
+        />
+        <el-table-column
+          prop="ArchiveTypeEnum"
+          :label="$t('dictionary:file:table:archiveTypeEnum')"
+          show-overflow-tooltip
+          sortable="custom"
+        >
+          <template slot-scope="scope">
+            {{ $fd('ArchiveType', scope.row.ArchiveTypeEnum) }}
+          </template>
+        </el-table-column>
+        <el-table-column
+          prop="SubIdentificationEnum"
+          :label="$t('dictionary:file:table:subIdentificationEnum')"
+          show-overflow-tooltip
+          sortable="custom"
+        >
+          <template slot-scope="scope">
+            {{ $fd('SubIdentification', scope.row.SubIdentificationEnum) }}
+          </template>
+        </el-table-column>
+        <el-table-column
+          :label="$t('dictionary:file:table:IsEnable')"
+          prop="IsEnable"
+          show-overflow-tooltip
+          sortable="custom"
+        >
+          <template slot-scope="scope">
+            <el-tag :type="!scope.row.IsEnable ? 'info' : ''">
+              {{ $fd('YesOrNo', scope.row.IsEnable) }}
+            </el-tag>
+          </template>
+        </el-table-column>
+        <el-table-column
+          :label="$t('dictionary:file:table:isConfirmRecord')"
+          prop="IsConfirmRecord"
+          show-overflow-tooltip
+          sortable="custom"
+        >
+          <template slot-scope="scope">
+            <el-tag :type="!scope.row.IsEnable ? 'info' : ''">
+              {{ $fd('YesOrNo', scope.row.IsConfirmRecord) }}
+            </el-tag>
+          </template>
+        </el-table-column>
+        <el-table-column
+          prop="CreateTime"
+          :label="$t('dictionary:file:table:createTime')"
+          show-overflow-tooltip
+          sortable="custom"
+        />
+        <el-table-column
+          prop="UpdateTime"
+          :label="$t('dictionary:file:table:updateTime')"
+          show-overflow-tooltip
+          sortable="custom"
+        />
+        <el-table-column
+          :label="$t('dictionary:file:table:action')"
+          width="200"
+          fixed="right"
+        >
+          <template slot-scope="scope">
+            <el-button type="text" @click="handleEdit(scope.row)">
+              {{ $t('dictionary:file:button:edit') }}
+            </el-button>
+            <el-button
+              type="text"
+              @click="handleDelete(scope.row)"
+              v-if="hasPermi(['dictionary:template:file:del'])"
+            >
+              {{ $t('dictionary:file:button:delete') }}
+            </el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+
+      <!-- 分页组件 -->
+      <pagination
+        class="page"
+        :total="total"
+        :page.sync="searchData.PageIndex"
+        :limit.sync="searchData.PageSize"
+        @pagination="getList"
+      />
+      <File-form
+        :config="config"
+        :data="rowData"
+        v-if="config.visible"
+        @close="close"
+        @getList="getList"
+      />
+    </box-content>
+  </BoxContent>
+</template>
+<script>
+import { getSysFileTypeList, deleteSysFileType } from '@/api/dictionary'
+import BoxContent from '@/components/BoxContent'
+import Pagination from '@/components/Pagination'
+import FileForm from './fileForm'
+const searchDataDefault = () => {
+  return {
+    ArchiveTypeEnum: null,
+    IsConfirmRecord: null,
+    IsEnable: null,
+    Name: null,
+    NameCN: null,
+    SubIdentificationEnum: null,
+    PageIndex: 1,
+    PageSize: 20,
+    asc: false,
+    sortField: 'CreateTime',
+  }
+}
+export default {
+  name: 'fileRecord',
+  components: { Pagination, FileForm, BoxContent },
+  data() {
+    return {
+      searchData: searchDataDefault(),
+      loading: false,
+      list: [],
+      total: 0,
+      rowData: {},
+      config: {
+        visible: false,
+        showClose: true,
+        width: '400px',
+        title: '',
+        appendToBody: true,
+        status: 'add',
+      },
+    }
+  },
+  created() {
+    this.getList()
+  },
+  methods: {
+    async getList() {
+      try {
+        this.loading = true
+        let res = await getSysFileTypeList(this.searchData)
+        this.loading = false
+        if (res.IsSuccess) {
+          this.list = res.Result.CurrentPageData
+          this.total = res.Result.TotalCount
+        }
+      } catch (err) {
+        this.loading = false
+        console.log(err)
+      }
+    },
+    // 新增
+    handleAdd() {
+      this.rowData = {}
+      this.config.title = this.$t('dictionary:file:form:title:add')
+      this.config.status = 'add'
+      this.config.visible = true
+    },
+    // 编辑
+    handleEdit(row) {
+      this.rowData = { ...row }
+      this.config.title = this.$t('dictionary:file:form:title:edit')
+      this.config.status = 'edit'
+      this.config.visible = true
+    },
+    // 删除
+    handleDelete(row) {
+      this.$confirm(this.$t('dictionary:file:message:deleteMessage'), {
+        type: 'warning',
+        distinguishCancelAndClose: true,
+      })
+        .then(() => {
+          deleteSysFileType(row.Id).then((res) => {
+            if (res.IsSuccess) {
+              this.getList()
+              this.$message.success(
+                this.$t('common:message:deletedSuccessfully')
+              )
+            }
+          })
+        })
+        .catch((err) => {
+          console.log(err)
+        })
+    },
+    // 查询
+    handleSearch() {
+      this.searchData.PageIndex = 1
+      this.getList()
+    },
+    // 重置
+    handleReset() {
+      this.searchData = searchDataDefault()
+      this.getList()
+    },
+    // 排序
+    handleSortByColumn(column) {
+      if (column.order === 'ascending') {
+        this.searchData.Asc = true
+      } else {
+        this.searchData.Asc = false
+      }
+      this.searchData.SortField = column.prop
+      this.searchData.PageIndex = 1
+      this.getList()
+    },
+    close() {
+      this.config.visible = false
+    },
+  },
+}
+</script>
+<style lang="scss" scoped>
+</style>

src/views/dictionary/template/index.vue

@@ -6,52 +6,84 @@
         <qc-questions v-if="activeTab == 'qc'" />
       </el-tab-pane>
       <!-- 阅片标准配置 -->
-      <el-tab-pane :label="$t('dictionary:template:tab:criterionsConfig')" name="criterions">
+      <el-tab-pane
+        :label="$t('dictionary:template:tab:criterionsConfig')"
+        name="criterions"
+      >
         <criterions-tmp v-if="activeTab == 'criterions'" />
       </el-tab-pane>
       <!-- 临床数据配置 -->
-      <el-tab-pane :label="$t('dictionary:template:tab:clinicalDataConfig')" name="clinicalData">
+      <el-tab-pane
+        :label="$t('dictionary:template:tab:clinicalDataConfig')"
+        name="clinicalData"
+      >
         <clinical-data v-if="activeTab == 'clinicalData'" />
       </el-tab-pane>
       <!-- 医学审核问题配置 -->
-      <el-tab-pane :label="$t('dictionary:template:tab:medicalConfig')" name="medicalAudit">
+      <el-tab-pane
+        :label="$t('dictionary:template:tab:medicalConfig')"
+        name="medicalAudit"
+      >
         <medical-audit v-if="activeTab == 'medicalAudit'" />
       </el-tab-pane>
       <!-- DICOM字段匿名化配置 -->
-      <el-tab-pane :label="$t('dictionary:template:tab:dicomTagConfig')" name="anonymization">
+      <el-tab-pane
+        :label="$t('dictionary:template:tab:dicomTagConfig')"
+        name="anonymization"
+      >
         <Anonymization v-if="activeTab == 'anonymization'" />
       </el-tab-pane>
       <!-- DICOM字段新增配置 -->
-      <el-tab-pane :label="$t('dictionary:template:tab:dicomTagAddConfig')" name="increasefields">
+      <el-tab-pane
+        :label="$t('dictionary:template:tab:dicomTagAddConfig')"
+        name="increasefields"
+      >
         <IncreaseFields v-if="activeTab == 'increasefields'" />
       </el-tab-pane>
       <!-- 邮件管理 -->
-      <el-tab-pane :label="$t('dictionary:template:tab:emailConfig')" name="email">
+      <el-tab-pane
+        :label="$t('dictionary:template:tab:emailConfig')"
+        name="email"
+      >
         <Email v-if="activeTab == 'email'" />
       </el-tab-pane>
       <!-- 签名管理 -->
-      <el-tab-pane :label="$t('dictionary:template:tab:signConfig')" name="sign">
+      <el-tab-pane
+        :label="$t('dictionary:template:tab:signConfig')"
+        name="sign"
+      >
         <Sign v-if="activeTab == 'sign'" />
       </el-tab-pane>
       <!-- 浏览器推荐 -->
-      <el-tab-pane :label="$t('dictionary:template:tab:browserConfig')" name="browser">
+      <el-tab-pane
+        :label="$t('dictionary:template:tab:browserConfig')"
+        name="browser"
+      >
         <Browser v-if="activeTab == 'browser'" />
       </el-tab-pane>
+      <!-- 文件记录 -->
+      <el-tab-pane
+        :label="$t('dictionary:template:tab:fileConfig')"
+        name="file"
+      >
+        <File v-if="activeTab == 'file'" />
+      </el-tab-pane>
     </el-tabs>
   </div>
 </template>
 <script>
-import QcQuestions from "./components/QcQuestions.vue";
-import CriterionsTmp from "./components/CriterionsTmp";
-import ClinicalData from "./components/ClinicalDataConfig";
-import MedicalAudit from "./components/MedicalAudit";
-import Anonymization from "./components/Anonymization";
-import IncreaseFields from "./components/IncreaseFields";
-import Email from "./email/index.vue";
-import Sign from "./sign/index.vue";
-import Browser from "./browser/index.vue";
+import QcQuestions from './components/QcQuestions.vue'
+import CriterionsTmp from './components/CriterionsTmp'
+import ClinicalData from './components/ClinicalDataConfig'
+import MedicalAudit from './components/MedicalAudit'
+import Anonymization from './components/Anonymization'
+import IncreaseFields from './components/IncreaseFields'
+import Email from './email/index.vue'
+import Sign from './sign/index.vue'
+import Browser from './browser/index.vue'
+import File from './file/index.vue'
 export default {
-  name: "Questions",
+  name: 'Questions',
   components: {
     QcQuestions,
     CriterionsTmp,
@@ -62,25 +94,26 @@ export default {
     Sign,
     MedicalAudit,
     Browser,
+    File,
   },
   data() {
     return {
-      activeTab: "qc",
-    };
+      activeTab: 'qc',
+    }
   },
   mounted() {
     if (this.$route.query.tabActive) {
-      this.activeTab = this.$route.query.tabActive;
+      this.activeTab = this.$route.query.tabActive
     } else {
-      this.activeTab = "qc";
+      this.activeTab = 'qc'
     }
   },
   methods: {
     clickTab(tab, event) {
-      this.$router.push({ path: `/dictionary/template?tabActive=${tab.name}` });
+      this.$router.push({ path: `/dictionary/template?tabActive=${tab.name}` })
     },
   },
-};
+}
 </script>
 <style lang="scss">
 .question-wrapper {

src/views/none-dicom-show/components/image-viewer.vue

@@ -1,13 +1,19 @@
 /* eslint-disable no-unused-vars */
 <template>
-  <div style="width:100%;height:100%;">
+  <div style="width: 100%; height: 100%">
     <transition name="viewer-fade">
-      <div v-show="urlList.length > 0" ref="image-viewer__wrapper" tabindex="-1" class="image-viewer__wrapper" :style="{ 'z-index':5 }">
+      <div
+        v-show="urlList.length > 0"
+        ref="image-viewer__wrapper"
+        tabindex="-1"
+        class="image-viewer__wrapper"
+        :style="{ 'z-index': 5 }"
+      >
         <span class="image-viewer_desc">
           <!-- <span v-if="studyCode">NST00006</span>
           <span v-if="modality">CT</span>
           <span v-if="bodyPart">上/下腹部</span><br> -->
-          {{ `${index+1} / ${urlList.length}` }}
+          {{ `${index + 1} / ${urlList.length}` }}
         </span>
         <!-- 关闭 -->
         <span class="image-viewer__btn image-viewer__close" @click="hide">
@@ -38,37 +44,46 @@
             <i class="el-image-viewer__actions__divider" />
             <i class="el-icon-c-scale-to-original" @click="toggleMode" />
             <i class="el-image-viewer__actions__divider" />
-            <i class="el-icon-refresh-left" @click="handleActions('anticlocelise')" />
-            <i class="el-icon-refresh-right" @click="handleActions('clocelise')" />
+            <i
+              class="el-icon-refresh-left"
+              @click="handleActions('anticlocelise')"
+            />
+            <i
+              class="el-icon-refresh-right"
+              @click="handleActions('clocelise')"
+            />
           </div>
         </div>
         <!-- 图片 -->
         <div id="image-viewer__canvas" class="image-viewer__canvas">
-          <img
-            v-for="(item, i) in urlList"
-            v-show="i === index"
-            :ref="`img${i}`"
-            :key="item.Id"
-            crossorigin="anonymous"
-            :src="item.FileType&&item.FileType.indexOf('zip')>=0?zipImg:`${OSSclientConfig.basePath}${item.Path}`"
-            :style="imgStyle"
-            style="max-width:100%;max-height: 100%;"
-            @load="handleImgLoad"
-            @error="handleImgError"
-            @mousedown="handleMouseDown"
-          >
-
+          <template v-for="(item, i) in urlList">
+            <img
+              v-if="!~item.FileType.indexOf('pdf')"
+              v-show="i === index"
+              :ref="`img${i}`"
+              :key="item.Id"
+              crossorigin="anonymous"
+              :src="
+                item.FileType && item.FileType.indexOf('zip') >= 0
+                  ? zipImg
+                  : `${OSSclientConfig.basePath}${item.Path}`
+              "
+              :style="imgStyle"
+              style="max-width: 100%; max-height: 100%"
+              @load="handleImgLoad"
+              @error="handleImgError"
+              @mousedown="handleMouseDown"
+            />
+          </template>
         </div>
       </div>
     </transition>
-
   </div>
-
 </template>
 
 <script>
 import { on, off } from 'element-ui/src/utils/dom'
-import { rafThrottle, isFirefox } from 'element-ui/src/utils/util';
+import { rafThrottle, isFirefox } from 'element-ui/src/utils/util'
 
 const mousewheelEventName = isFirefox() ? 'DOMMouseScroll' : 'mousewheel'
 
@@ -77,36 +92,36 @@ export default {
   props: {
     urlList: {
       type: Array,
-      default: () => []
+      default: () => [],
     },
     studyCode: {
       type: String,
-      default: ''
+      default: '',
     },
     bodyPart: {
       type: String,
-      default: ''
+      default: '',
     },
     modality: {
       type: String,
-      default: ''
+      default: '',
     },
     onSwitch: {
       type: Function,
-      default: () => {}
+      default: () => {},
     },
     onClose: {
       type: Function,
-      default: () => {}
+      default: () => {},
     },
     initialIndex: {
       type: Number,
-      default: 0
+      default: 0,
+    },
+    zipImg: {
+      required: true,
+      default: '',
     },
-    zipImg:{
-      required:true,
-      default:''
-    }
   },
 
   data() {
@@ -120,7 +135,7 @@ export default {
         deg: 0,
         offsetX: 0,
         offsetY: 0,
-        enableTransition: false
+        enableTransition: false,
       },
     }
   },
@@ -141,25 +156,25 @@ export default {
         transform: `scale(${scale}) rotate(${deg}deg)`,
         transition: enableTransition ? 'transform .3s' : '',
         'margin-left': `${offsetX}px`,
-        'margin-top': `${offsetY}px`
+        'margin-top': `${offsetY}px`,
       }
       return style
-    }
+    },
   },
   watch: {
     initialIndex: {
       immediate: true,
       handler(val) {
         this.index = val
-      }
+      },
     },
     index: {
       immediate: true,
       handler(val) {
         this.reset()
         this.onSwitch(val)
-      }
-    }
+      },
+    },
   },
   mounted() {
     document.getElementById('image-viewer__canvas').onmousewheel = (event) => {
@@ -167,13 +182,13 @@ export default {
         // 缩小
         this.handleActions('zoomOut', {
           zoomRate: 0.015,
-          enableTransition: false
+          enableTransition: false,
         })
       } else {
         // 放大
         this.handleActions('zoomIn', {
           zoomRate: 0.015,
-          enableTransition: false
+          enableTransition: false,
         })
       }
       return false
@@ -186,7 +201,7 @@ export default {
       this.onClose()
     },
     deviceSupportInstall() {
-      this._keyDownHandler = e => {
+      this._keyDownHandler = (e) => {
         e.stopPropagation()
         const keyCode = e.keyCode
         switch (keyCode) {
@@ -216,17 +231,17 @@ export default {
             break
         }
       }
-      this._mouseWheelHandler = rafThrottle(e => {
+      this._mouseWheelHandler = rafThrottle((e) => {
         const delta = e.wheelDelta ? e.wheelDelta : -e.detail
         if (delta > 0) {
           this.handleActions('zoomIn', {
             zoomRate: 0.015,
-            enableTransition: false
+            enableTransition: false,
           })
         } else {
           this.handleActions('zoomOut', {
             zoomRate: 0.015,
-            enableTransition: false
+            enableTransition: false,
           })
         }
       })
@@ -254,12 +269,12 @@ export default {
       const { offsetX, offsetY } = this.transform
       const startX = e.pageX
       const startY = e.pageY
-      this._dragHandler = rafThrottle(ev => {
+      this._dragHandler = rafThrottle((ev) => {
         this.transform.offsetX = offsetX + ev.pageX - startX
         this.transform.offsetY = offsetY + ev.pageY - startY
       })
       on(document, 'mousemove', this._dragHandler)
-      on(document, 'mouseup', ev => {
+      on(document, 'mouseup', (ev) => {
         off(document, 'mousemove', this._dragHandler)
       })
 
@@ -271,7 +286,7 @@ export default {
         deg: 0,
         offsetX: 0,
         offsetY: 0,
-        enableTransition: false
+        enableTransition: false,
       }
     },
     toggleMode() {
@@ -294,18 +309,22 @@ export default {
         zoomRate: 0.2,
         rotateDeg: 90,
         enableTransition: true,
-        ...options
+        ...options,
       }
       const { transform } = this
       switch (action) {
         case 'zoomOut':
           if (transform.scale > 0.2) {
-            transform.scale = parseFloat((transform.scale - zoomRate).toFixed(3))
+            transform.scale = parseFloat(
+              (transform.scale - zoomRate).toFixed(3)
+            )
           }
           break
         case 'zoomIn':
           if (transform.scale < 5) {
-            transform.scale = parseFloat((transform.scale + zoomRate).toFixed(3))
+            transform.scale = parseFloat(
+              (transform.scale + zoomRate).toFixed(3)
+            )
           }
           break
         case 'clocelise':
@@ -316,47 +335,46 @@ export default {
           break
       }
       transform.enableTransition = enableTransition
-    }
-  }
+    },
+  },
 }
 </script>
 <style lang="scss" scoped>
-
-.image-viewer__wrapper{
-    position: relative;
-    top:0;
-    right:0;
-    bottom:0;
-    left:0;
-    width: 100%;
-    height: 100%;
+.image-viewer__wrapper {
+  position: relative;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
 }
-.image-viewer__btn{
-    position:absolute;
-    z-index:1;
-    display:flex;
-    align-items:center;
-    justify-content:center;
-    border-radius:50%;
-    opacity:.8;
-    cursor:pointer;
-    box-sizing:border-box;
-    user-select:none
+.image-viewer__btn {
+  position: absolute;
+  z-index: 1;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: 50%;
+  opacity: 0.8;
+  cursor: pointer;
+  box-sizing: border-box;
+  user-select: none;
 }
 
-.image-viewer__close{
+.image-viewer__close {
   display: none;
-    top:40px;
-    right:40px;
-    width:40px;
-    height:40px;
-    font-size:40px
+  top: 40px;
+  right: 40px;
+  width: 40px;
+  height: 40px;
+  font-size: 40px;
 }
-.image-viewer_desc{
-  position:absolute;
-  top:40px;
-  left:40px;
-  font-size:15px;
+.image-viewer_desc {
+  position: absolute;
+  top: 40px;
+  left: 40px;
+  font-size: 15px;
   padding: 5px;
   height: 30px;
   width: 70px;
@@ -369,92 +387,92 @@ export default {
   border-radius: 17px;
   // border-radius: 2%;
 }
-.image-viewer__canvas{
-    position: absolute;
-    top: 50%;
-    transform: translateY(-50%);
-    width:100%;
-    height:100%;
-    display:flex;
-    justify-content:center;
-    align-items:center
+.image-viewer__canvas {
+  position: absolute;
+  top: 50%;
+  transform: translateY(-50%);
+  width: 100%;
+  height: 100%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
 }
-.image-viewer__actions{
-    left:50%;
-    bottom:30px;
-    transform:translateX(-50%);
-    width:282px;
-    height:44px;
-    padding:0 23px;
-    background-color:#606266;
-    border-color:#fff;
-    border-radius:22px
+.image-viewer__actions {
+  left: 50%;
+  bottom: 30px;
+  transform: translateX(-50%);
+  width: 282px;
+  height: 44px;
+  padding: 0 23px;
+  background-color: #606266;
+  border-color: #fff;
+  border-radius: 22px;
 }
-.image-viewer__actions__inner{
-    width:100%;
-    height:100%;
-    text-align:justify;
-    cursor:default;
-    font-size:23px;
-    color:#fff;
-    display:flex;
-    align-items:center;
-    justify-content:space-around
+.image-viewer__actions__inner {
+  width: 100%;
+  height: 100%;
+  text-align: justify;
+  cursor: default;
+  font-size: 23px;
+  color: #fff;
+  display: flex;
+  align-items: center;
+  justify-content: space-around;
 }
-.image-viewer__next,.image-viewer__prev{
-    top:50%;
-    width:44px;
-    height:44px;
-    font-size:24px;
-    color:#fff;
-    background-color:#606266;
-    border-color:#fff
+.image-viewer__next,
+.image-viewer__prev {
+  top: 50%;
+  width: 44px;
+  height: 44px;
+  font-size: 24px;
+  color: #fff;
+  background-color: #606266;
+  border-color: #fff;
 }
-.image-viewer__prev{
-    transform:translateY(-50%);
-    left:40px
+.image-viewer__prev {
+  transform: translateY(-50%);
+  left: 40px;
 }
-.image-viewer__next{
-    transform:translateY(-50%);
-    right:40px;
-    text-indent:2px
+.image-viewer__next {
+  transform: translateY(-50%);
+  right: 40px;
+  text-indent: 2px;
 }
-.image-viewer__mask{
-    position:absolute;
-    width:100%;
-    height:100%;
-    top:0;
-    left:0;
-    opacity:.5;
-    // background:#000
-
+.image-viewer__mask {
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  top: 0;
+  left: 0;
+  opacity: 0.5;
+  // background:#000
 }
-.viewer-fade-enter-active{
-    animation:viewer-fade-in .3s
+.viewer-fade-enter-active {
+  animation: viewer-fade-in 0.3s;
 }
-.viewer-fade-leave-active{
-    animation:viewer-fade-out .3s
+.viewer-fade-leave-active {
+  animation: viewer-fade-out 0.3s;
 }
 
-@keyframes viewer-fade-in{
-    0%{
-        transform:translate3d(0,-20px,0);
-        opacity:0
-    }
-    100%{
-        transform:translate3d(0,0,0);
-        opacity:1
-    }
+@keyframes viewer-fade-in {
+  0% {
+    transform: translate3d(0, -20px, 0);
+    opacity: 0;
+  }
+  100% {
+    transform: translate3d(0, 0, 0);
+    opacity: 1;
+  }
 }
 
-@keyframes viewer-fade-out{
-    0%{
-        transform:translate3d(0,0,0);
-        opacity:1
-    }
-    100%{
-        transform:translate3d(0,-20px,0);
-        opacity:0
-    }
+@keyframes viewer-fade-out {
+  0% {
+    transform: translate3d(0, 0, 0);
+    opacity: 1;
+  }
+  100% {
+    transform: translate3d(0, -20px, 0);
+    opacity: 0;
+  }
 }
 </style>

src/views/none-dicom-show/components/preview.vue

@@ -1,6 +1,5 @@
 <template>
   <div class="none-dicom_preview-wrapper">
-
     <div class="image-viewer-wrapper">
       <!-- 预览图像 -->
       <ImageViewer
@@ -15,10 +14,10 @@
         :study-code="previewImage.studyCode"
         :body-part="previewImage.bodyPart"
         :modality="previewImage.modality"
-        :zip-img='zipImg'
+        :zip-img="zipImg"
       />
     </div>
-    <div class="thumbnail-wrapper" style="z-index:999;background-color:#fff;">
+    <div class="thumbnail-wrapper" style="z-index: 999; background-color: #fff">
       <div class="">
         <div class="img-wrapper">
           <el-button
@@ -33,21 +32,31 @@
               <slot name="empty">暂无数据</slot>
             </div>
             <div v-show="!noData" class="items" :style="itemsStyle">
-              <div
-                v-for="(item, index) in previewImage.imgList"
-                :key="index"
-                class="item-img"
-                :style="imgSize"
-                :class="{
-                  'is-active': index === currentIndex
-                }"
-                @click="selected(index)"
-              >
-                <img :title="item.FileName" crossorigin="anonymous" :src="item.FileType&&item.FileType.indexOf('zip')>=0?zipImg:`${OSSclientConfig.basePath}${item.Path}`">
-                <p v-if="item.FileName" class="item-date">
-                  {{ `${index+1}` }}
-                </p>
-              </div>
+              <template v-for="(item, index) in previewImage.imgList">
+                <div
+                  v-if="!~item.FileType.indexOf('pdf')"
+                  :key="index"
+                  class="item-img"
+                  :style="imgSize"
+                  :class="{
+                    'is-active': index === currentIndex,
+                  }"
+                  @click="selected(index)"
+                >
+                  <img
+                    :title="item.FileName"
+                    crossorigin="anonymous"
+                    :src="
+                      item.FileType && item.FileType.indexOf('zip') >= 0
+                        ? zipImg
+                        : `${OSSclientConfig.basePath}${item.Path}`
+                    "
+                  />
+                  <p v-if="item.FileName" class="item-date">
+                    {{ `${index + 1}` }}
+                  </p>
+                </div>
+              </template>
             </div>
           </div>
           <el-button
@@ -63,12 +72,12 @@
   </div>
 </template>
 <script>
-import ImageViewer from './image-viewer';
-import zipImg from "@/assets/zip.png";
+import ImageViewer from './image-viewer'
+import zipImg from '@/assets/zip.png'
 export default {
   name: 'Preview',
   components: {
-    ImageViewer
+    ImageViewer,
   },
   props: {
     imgSize: {
@@ -76,13 +85,13 @@ export default {
       default: () => {
         return {
           width: '120px',
-          height: '120px'
+          height: '120px',
         }
-      }
+      },
     },
     value: {
       type: Number,
-      default: null
+      default: null,
     },
     previewImage: {
       type: Object,
@@ -94,11 +103,10 @@ export default {
           infinite: true, // 是否可以循环切换
           studyCode: '',
           modality: '',
-          bodyPart: ''
+          bodyPart: '',
         }
-      }
-    }
-
+      },
+    },
   },
   data() {
     return {
@@ -107,14 +115,14 @@ export default {
       translateX: 0,
       pageSize: 0, // 一页展示的图片数
       urlList: [],
-      zipImg
+      zipImg,
     }
   },
   computed: {
     // 偏移度数
     itemsStyle() {
       return {
-        transform: `translateX(${-this.translateX}px)`
+        transform: `translateX(${-this.translateX}px)`,
       }
     },
     // 每一项宽度
@@ -128,7 +136,8 @@ export default {
     disabledNext() {
       // 禁用后一页按钮
       return (
-        this.translateX >= (this.previewImage.imgList.length - this.pageSize) * this.itemWidth
+        this.translateX >=
+        (this.previewImage.imgList.length - this.pageSize) * this.itemWidth
       )
     },
     noData() {
@@ -136,28 +145,27 @@ export default {
     },
     dataLength() {
       return this.previewImage.imgList.length
-    }
-
+    },
   },
   watch: {
     value: {
       immediate: true,
       handler(val) {
         this.currentIndex = val
-      }
+      },
     },
     'previewImage.index': {
       immediate: true,
       handler(val) {
         this.urlList.index = val
-      }
-    }
+      },
+    },
   },
   mounted() {
     this.pageSize = this.wrapperWidth() / this.itemWidth
     this.urlList = this.previewImage
     const scope = this
-    window.onresize = function() {
+    window.onresize = function () {
       scope.pageSize = scope.wrapperWidth() / scope.itemWidth
       scope.selected(scope.currentIndex)
     }
@@ -201,148 +209,147 @@ export default {
         return this.$refs.imagesWrapper.offsetWidth
       }
       return 0
-    }
-
-  }
+    },
+  },
 }
 </script>
 
 <style lang="scss">
-.none-dicom_preview-wrapper{
+.none-dicom_preview-wrapper {
   width: 100%;
   height: 100%;
   display: flex;
   flex-direction: column;
 
-.image-viewer-wrapper{
-  flex: 1;
-}
-.thumbnail-wrapper{
-  height: 130px;
-}
-.img-content{
-  position: absolute;
-  left: 0;
-  bottom: 10px;
-  width: 100%;
-}
-.img-wrapper {
-  display: flex;
-  position: relative;
-  margin: 0 20px;
-  height: 120px;
-  .to {
-    width: 32px;
-    height: 100%;
-    padding: 0;
+  .image-viewer-wrapper {
+    flex: 1;
   }
-  .images::before {
+  .thumbnail-wrapper {
+    height: 130px;
+  }
+  .img-content {
     position: absolute;
-    z-index: 5;
-    top: 0;
-    height: 100%;
-    width: 84px;
-    content: '';
-    pointer-events: none;
-    background: -webkit-gradient(
-      linear,
-      left top,
-      right top,
-      from(#fff),
-      color-stop(50%, rgba(0, 0, 0, 0))
-    );
-    background: -o-linear-gradient(left, #fff, rgba(0, 0, 0, 0) 50%);
-    background: linear-gradient(90deg, #fff, rgba(0, 0, 0, 0) 50%);
-  }
-  .images::after {
-    position: absolute;
-    z-index: 5;
-    top: 0;
-    height: 100%;
-    right: 0;
-    width: 84px;
-    content: '';
-    pointer-events: none;
-    background: -webkit-gradient(
-      linear,
-      right top,
-      left top,
-      from(#fff),
-      color-stop(50%, rgba(0, 0, 0, 0))
-    );
-    background: -o-linear-gradient(right, #fff, rgba(0, 0, 0, 0) 50%);
-    background: linear-gradient(270deg, #fff, rgba(0, 0, 0, 0) 50%);
-  }
-  .images {
-    position: relative;
-    overflow: hidden;
+    left: 0;
+    bottom: 10px;
     width: 100%;
-    height: 100%;
-    margin: 0 2px;
-    .empty-text {
-      color: rgb(158, 158, 158);
+  }
+  .img-wrapper {
+    display: flex;
+    position: relative;
+    margin: 0 20px;
+    height: 120px;
+    .to {
+      width: 32px;
       height: 100%;
-      display: flex;
-      align-items: center;
-      justify-content: center;
+      padding: 0;
     }
-    .items {
+    .images::before {
       position: absolute;
+      z-index: 5;
       top: 0;
-      left: 0;
-      display: flex;
-      // width: 6000px;
       height: 100%;
-      align-items: center;
-      transition: transform 0.25s ease;
-      .item-img {
-        display: inline-block;
-        box-sizing: border-box;
-        position: relative;
-        margin-right: 8px;
-        border: 2px solid rgba(0, 0, 0, 0);
-        cursor: pointer;
-        .item-date {
-          bottom: 0px;
-          position: absolute;
-          width: 100%;
-          height: 24px;
-          background: rgba(0, 0, 0, 0.2);
-          text-align: center;
-          line-height: 24px;
-          color: white;
-        }
-        img {
-          width: 100%;
-          height: 100%;
-        }
+      width: 84px;
+      content: '';
+      pointer-events: none;
+      background: -webkit-gradient(
+        linear,
+        left top,
+        right top,
+        from(#fff),
+        color-stop(50%, rgba(0, 0, 0, 0))
+      );
+      background: -o-linear-gradient(left, #fff, rgba(0, 0, 0, 0) 50%);
+      background: linear-gradient(90deg, #fff, rgba(0, 0, 0, 0) 50%);
+    }
+    .images::after {
+      position: absolute;
+      z-index: 5;
+      top: 0;
+      height: 100%;
+      right: 0;
+      width: 84px;
+      content: '';
+      pointer-events: none;
+      background: -webkit-gradient(
+        linear,
+        right top,
+        left top,
+        from(#fff),
+        color-stop(50%, rgba(0, 0, 0, 0))
+      );
+      background: -o-linear-gradient(right, #fff, rgba(0, 0, 0, 0) 50%);
+      background: linear-gradient(270deg, #fff, rgba(0, 0, 0, 0) 50%);
+    }
+    .images {
+      position: relative;
+      overflow: hidden;
+      width: 100%;
+      height: 100%;
+      margin: 0 2px;
+      .empty-text {
+        color: rgb(158, 158, 158);
+        height: 100%;
+        display: flex;
+        align-items: center;
+        justify-content: center;
       }
-      .item-img:hover::after {
-        // border-color: #409EFF;
-        opacity: 0;
-      }
-      .item-img::after {
+      .items {
         position: absolute;
         top: 0;
         left: 0;
-        width: 100%;
+        display: flex;
+        // width: 6000px;
         height: 100%;
-        content: '';
-        opacity: 0.2;
-        pointer-events: none;
-        -webkit-transition: opacity 0.3s ease;
-        -o-transition: opacity 0.3s ease;
-        transition: opacity 0.3s ease;
-        background-color: #fff;
-      }
-      .is-active {
-        border-color: #409eff;
-      }
-      .is-active:after {
-        opacity: 0;
+        align-items: center;
+        transition: transform 0.25s ease;
+        .item-img {
+          display: inline-block;
+          box-sizing: border-box;
+          position: relative;
+          margin-right: 8px;
+          border: 2px solid rgba(0, 0, 0, 0);
+          cursor: pointer;
+          .item-date {
+            bottom: 0px;
+            position: absolute;
+            width: 100%;
+            height: 24px;
+            background: rgba(0, 0, 0, 0.2);
+            text-align: center;
+            line-height: 24px;
+            color: white;
+          }
+          img {
+            width: 100%;
+            height: 100%;
+          }
+        }
+        .item-img:hover::after {
+          // border-color: #409EFF;
+          opacity: 0;
+        }
+        .item-img::after {
+          position: absolute;
+          top: 0;
+          left: 0;
+          width: 100%;
+          height: 100%;
+          content: '';
+          opacity: 0.2;
+          pointer-events: none;
+          -webkit-transition: opacity 0.3s ease;
+          -o-transition: opacity 0.3s ease;
+          transition: opacity 0.3s ease;
+          background-color: #fff;
+        }
+        .is-active {
+          border-color: #409eff;
+        }
+        .is-active:after {
+          opacity: 0;
+        }
       }
     }
   }
 }
-}
 </style>

src/views/none-dicom-show/index.vue

@@ -9,6 +9,9 @@
         <div v-for="(study, i) in studyList" :key="study.CodeView">
           <div class="study-desc">
             <span>{{ study.CodeView }}</span>
+            <span v-if="OtherInfo.IsShowStudyName" style="margin-left: 5px">
+              {{ study.StudyName }}
+            </span>
             <span style="margin: 0 5px">{{ study.Modality }}</span>
             <span>{{ getBodyPart(study.BodyPart) }}</span>
           </div>
@@ -45,7 +48,7 @@
     </el-card>
     <!-- 预览图像 -->
     <el-card class="box-card right">
-      <div style="width: 100%; height: 100%">
+      <div style="width: 100%; height: 100%" v-if="!showPDF">
         <Preview
           v-if="previewImage.imgList.length > 0"
           ref="previewImage"
@@ -55,6 +58,9 @@
           @selectedImg="selectedImg"
         />
       </div>
+      <div style="width: 100%; height: 100%" v-else>
+        <PreviewFile :file-path="pdfFile.path" :file-type="pdfFile.type" />
+      </div>
     </el-card>
 
     <!-- <el-card class="box-card" style="width:300px;height:100%;padding: 10px;margin-left:10px;">
@@ -68,11 +74,13 @@ import { getNoneDicomStudyList } from '@/api/trials'
 import store from '@/store'
 import { changeURLStatic } from '@/utils/history.js'
 import Preview from './components/preview'
+import PreviewFile from '@/components/PreviewFile'
 // import CheckForm from './components/form'
 export default {
   name: 'Notice',
   components: {
     Preview,
+    PreviewFile,
     // CheckForm
   },
   data() {
@@ -97,6 +105,12 @@ export default {
       sudyId: '',
       loading: false,
       bp: [],
+      OtherInfo: {},
+      showPDF: false,
+      pdfFile: {
+        path: null,
+        type: null,
+      },
     }
   },
   async created() {
@@ -148,6 +162,7 @@ export default {
       )
         .then((res) => {
           this.studyList = res.Result
+          this.OtherInfo = res.OtherInfo
           this.loading = false
           const studyIndex = this.studyList.findIndex((item) => {
             return item.NoneDicomStudyFileList.length > 0
@@ -163,6 +178,15 @@ export default {
     },
     selected(file, studyIndex, fileIndex, isChangeSub = false) {
       this.currentFileId = file.Id
+      if (!!~file.FileType.indexOf('pdf')) {
+        this.pdfFile.path = file.Path || file.FullFilePath
+        this.pdfFile.type = 'pdf'
+        this.showPDF = true
+        return true
+      } else {
+        this.showPDF = false
+      }
+
       this.currentStudyIndex = studyIndex
       this.previewImage.imgList =
         this.studyList[studyIndex].NoneDicomStudyFileList

src/views/system/role/components/RoleForm.vue

@@ -29,7 +29,18 @@
             >
           </el-radio-group>
         </el-form-item>
-
+        <el-form-item :label="$t('system:role:form:IsEnable')" prop="IsEnable">
+          <el-switch
+            v-model="form.IsEnable"
+            active-color="#13ce66"
+            inactive-color="#dcdfe6"
+            :active-value="true"
+            :inactive-value="false"
+            :active-text="$fd('IsEnable', true)"
+            :inactive-text="$fd('IsEnable', false)"
+          >
+          </el-switch>
+        </el-form-item>
         <el-form-item label="Group: " prop="UserTypeGroupIdList">
           <el-select v-model="form.UserTypeGroupIdList" multiple>
             <el-option
@@ -69,18 +80,18 @@
           <el-checkbox
             v-model="menuExpand"
             @change="handleCheckedTreeExpand($event)"
-            >{{ $t("system:role:form:checkbox:menuExpand") }}</el-checkbox
+            >{{ $t('system:role:form:checkbox:menuExpand') }}</el-checkbox
           >
           <el-checkbox
             v-model="menuNodeAll"
             @change="handleCheckedTreeNodeAll($event)"
-            >{{ $t("system:role:form:checkbox:menuNodeAll") }}</el-checkbox
+            >{{ $t('system:role:form:checkbox:menuNodeAll') }}</el-checkbox
           >
           <el-checkbox
             v-model="form.menuCheckStrictly"
             @change="handleCheckedTreeConnect($event)"
             >{{
-              $t("system:role:form:checkbox:menuCheckStrictly")
+              $t('system:role:form:checkbox:menuCheckStrictly')
             }}</el-checkbox
           >
           <el-tree
@@ -116,30 +127,31 @@
   </base-model>
 </template>
 <script>
-import { addOrUpdateUserType } from "@/api/admin";
+import { addOrUpdateUserType } from '@/api/admin'
 // import { addOrUpdateUserType } from '@/api/system/role'
 // import { getMenuList } from '@/api/system/menu'
-import { getMenuList } from "@/api/system/menu";
-import { model_cfg } from "../role";
-import BaseModel from "@/components/BaseModel";
+import { getMenuList } from '@/api/system/menu'
+import { model_cfg } from '../role'
+import BaseModel from '@/components/BaseModel'
 
 export default {
   components: { BaseModel },
-  dicts: ["UserTypeGroup"],
+  dicts: ['UserTypeGroup'],
   props: {
     data: {
       type: Object,
       default() {
         return {
-          Id: "",
-          UserTypeName: "",
+          Id: '',
+          UserTypeName: '',
           IsInternal: true,
-          UserTypeShortName: "",
-          Order: "",
-          Description: "",
-          PermissionStr: "",
+          UserTypeShortName: '',
+          Order: '',
+          Description: '',
+          PermissionStr: '',
           UserTypeEnum: null,
-        };
+          IsEnable: true,
+        }
       },
     },
   },
@@ -148,136 +160,137 @@ export default {
       menuExpand: false,
       menuNodeAll: false,
       userTypeGroupOptions: [
-        { value: 1, label: "Trial" },
-        { value: 2, label: "Reviewer" },
-        { value: 3, label: "Other" },
+        { value: 1, label: 'Trial' },
+        { value: 2, label: 'Reviewer' },
+        { value: 3, label: 'Other' },
       ],
       model_cfg,
       defaultProps: {
-        children: "Children",
-        label: "MenuName",
+        children: 'Children',
+        label: 'MenuName',
       },
       form: {
-        Id: "",
-        UserType: "",
+        Id: '',
+        UserType: '',
         IsInternal: true,
-        UserTypeShortName: "",
+        UserTypeShortName: '',
         Type: null,
-        Description: "",
+        Description: '',
         UserTypeGroupIdList: [],
         menuCheckStrictly: true,
+        IsEnable: true,
       },
       rules: {
         UserTypeName: [
-          { required: true, message: "Please specify", trigger: "blur" },
+          { required: true, message: 'Please specify', trigger: 'blur' },
           {
             max: 50,
-            message: "The maximum length is 50",
+            message: 'The maximum length is 50',
           },
         ],
         UserTypeShortName: [
-          { required: true, message: "Please specify", trigger: "blur" },
+          { required: true, message: 'Please specify', trigger: 'blur' },
           {
             max: 50,
-            message: "The maximum length is 50",
-            trigger: "blur",
+            message: 'The maximum length is 50',
+            trigger: 'blur',
           },
         ],
-        Description: [{ max: 500, message: "The maximum length is 500" }],
+        Description: [{ max: 500, message: 'The maximum length is 500' }],
         UserTypeGroupIdList: [
-          { required: true, message: "Please specify", trigger: "blur" },
+          { required: true, message: 'Please specify', trigger: 'blur' },
         ],
         UserTypeEnum: [
-          { required: true, message: "Please select", trigger: "blur" },
+          { required: true, message: 'Please select', trigger: 'blur' },
         ],
       },
       menuOptions: [],
       btnLoading: false,
-    };
+    }
   },
   mounted() {
-    this.getMenuList();
+    this.getMenuList()
     if (Object.keys(this.data).length && this.data.Id) {
-      this.form = { ...this.data };
+      this.form = { ...this.data }
     }
   },
   methods: {
     handleCheckedTreeConnect(value) {
-      this.form.menuCheckStrictly = !!value;
+      this.form.menuCheckStrictly = !!value
     },
     getMenuAllCheckedKeys() {
       // 目前被选中的菜单节点
-      const checkedKeys = this.$refs.menu.getCheckedKeys();
+      const checkedKeys = this.$refs.menu.getCheckedKeys()
       // 半选中的菜单节点
-      const halfCheckedKeys = this.$refs.menu.getHalfCheckedKeys();
-      checkedKeys.unshift.apply(checkedKeys, halfCheckedKeys);
-      return checkedKeys;
+      const halfCheckedKeys = this.$refs.menu.getHalfCheckedKeys()
+      checkedKeys.unshift.apply(checkedKeys, halfCheckedKeys)
+      return checkedKeys
     },
 
     handleCheckedTreeExpand(value) {
-      const treeList = this.menuOptions;
+      const treeList = this.menuOptions
       for (let i = 0; i < treeList.length; i++) {
-        this.$refs.menu.store.nodesMap[treeList[i].MenuId].expanded = value;
+        this.$refs.menu.store.nodesMap[treeList[i].MenuId].expanded = value
       }
     },
     handleCheckedTreeNodeAll(value, type) {
-      this.$refs.menu.setCheckedNodes(value ? this.menuOptions : []);
+      this.$refs.menu.setCheckedNodes(value ? this.menuOptions : [])
     },
     toTree(arr, ParentId) {
       function loop(ParentId) {
-        const res = [];
+        const res = []
         for (let i = 0; i < arr.length; i++) {
-          const item = arr[i];
-          item.hasChildren = false;
+          const item = arr[i]
+          item.hasChildren = false
           if (item.ParentId !== ParentId) {
-            continue;
+            continue
           }
-          item.Children = loop(item.MenuId);
-          res.push(item);
+          item.Children = loop(item.MenuId)
+          res.push(item)
         }
-        return res;
+        return res
       }
 
-      return loop(ParentId);
+      return loop(ParentId)
     },
     getMenuList() {
       getMenuList({})
         .then((res) => {
           const menu = this.toTree(
             res.Result,
-            "00000000-0000-0000-0000-000000000000"
-          );
-          this.menuOptions = menu;
-          console.log(this.menuOptions);
+            '00000000-0000-0000-0000-000000000000'
+          )
+          this.menuOptions = menu
+          console.log(this.menuOptions)
           this.$nextTick(() => {
             this.form.MenuIds.forEach((v) => {
-              this.$refs.menu.setChecked(v, true, false);
-            });
-          });
+              this.$refs.menu.setChecked(v, true, false)
+            })
+          })
         })
-        .catch(function () {});
+        .catch(function () {})
     },
     handleSave() {
       this.$refs.roleForm.validate((valid) => {
-        if (!valid) return;
-        this.btnLoading = true;
-        this.model_cfg.showClose = false;
-        this.form.MenuIds = this.getMenuAllCheckedKeys();
-        console.log(this.form.MenuIds);
+        if (!valid) return
+        this.btnLoading = true
+        this.model_cfg.showClose = false
+        this.form.MenuIds = this.getMenuAllCheckedKeys()
+        console.log(this.form.MenuIds)
         addOrUpdateUserType(this.form)
           .then((res) => {
-            this.btnLoading = false;
-            this.$refs["roleForm"].resetFields();
-            this.$emit("close");
-            this.model_cfg.showClose = true;
-            this.$message.success("Saved successfully!");
+            this.btnLoading = false
+            this.$refs['roleForm'].resetFields()
+            this.$emit('close')
+            this.model_cfg.showClose = true
+            this.$message.success('Saved successfully!')
           })
           .catch(() => {
-            this.btnLoading = false;
-            this.model_cfg.showClose = true;
-          });
-      });
+            this.btnLoading = false
+            this.model_cfg.showClose = true
+          })
+      })
     },
   },
-};
+}
 </script>

src/views/system/role/index.vue

@@ -21,26 +21,92 @@
           </el-select>
         </el-form-item>
         <el-form-item>
-          <el-button type="primary" icon="el-icon-search" size="mini" @click="getList">{{ $t('common:button:search') }}</el-button>
-          <el-button v-hasPermi="['system:role:add']" type="primary" icon="el-icon-plus" size="mini" @click="handleAddRole">{{ $t('common:button:add') }}</el-button>
+          <el-button
+            type="primary"
+            icon="el-icon-search"
+            size="mini"
+            @click="getList"
+            >{{ $t('common:button:search') }}</el-button
+          >
+          <el-button
+            v-hasPermi="['system:role:add']"
+            type="primary"
+            icon="el-icon-plus"
+            size="mini"
+            @click="handleAddRole"
+            >{{ $t('common:button:add') }}</el-button
+          >
         </el-form-item>
       </el-form>
-      <el-table v-loading="loading" v-adaptive="{bottomOffset:30}" size="small" height="100" :data="list" class="table">
+      <el-table
+        v-loading="loading"
+        v-adaptive="{ bottomOffset: 30 }"
+        size="small"
+        height="100"
+        :data="list"
+        class="table"
+      >
         <el-table-column type="index" width="50" />
-        <el-table-column :label="$t('system:role:table:User Type')" prop="UserTypeName" min-width="220" show-overflow-tooltip />
-        <el-table-column :label="$t('system:role:table:Shortname')" prop="UserTypeShortName" min-width="120" show-overflow-tooltip />
-        <el-table-column :label="$t('system:role:table:Group')" prop="Note" min-width="80" show-overflow-tooltip>
+        <el-table-column
+          :label="$t('system:role:table:User Type')"
+          prop="UserTypeName"
+          min-width="220"
+          show-overflow-tooltip
+        />
+        <el-table-column
+          :label="$t('system:role:table:Shortname')"
+          prop="UserTypeShortName"
+          min-width="120"
+          show-overflow-tooltip
+        />
+        <el-table-column
+          :label="$t('system:role:table:Group')"
+          prop="Note"
+          min-width="80"
+          show-overflow-tooltip
+        >
           <template slot-scope="scope">
-            {{ scope.row.UserTypeGroupList.map(v => {return v.GroupName}).toString() }}
+            {{
+              scope.row.UserTypeGroupList.map((v) => {
+                return v.GroupName
+              }).toString()
+            }}
           </template>
         </el-table-column>
-        <el-table-column :label="$t('system:role:table:PermissionStr')" prop="PermissionStr" min-width="100" show-overflow-tooltip />
-        <el-table-column :label="$t('system:role:table:User Type Enum')" prop="UserTypeEnum" min-width="100" show-overflow-tooltip>
+        <el-table-column
+          :label="$t('system:role:table:PermissionStr')"
+          prop="PermissionStr"
+          min-width="100"
+          show-overflow-tooltip
+        />
+        <el-table-column
+          :label="$t('system:role:table:User Type Enum')"
+          prop="UserTypeEnum"
+          min-width="100"
+          show-overflow-tooltip
+        >
           <template slot-scope="scope">
-            {{ $fd('UserType',scope.row.UserTypeEnum) }}
+            {{ $fd('UserType', scope.row.UserTypeEnum) }}
           </template>
         </el-table-column>
-        <el-table-column :label="$t('system:role:table:Description')" prop="Description" min-width="220" show-overflow-tooltip />
+        <el-table-column
+          :label="$t('system:role:table:IsEnable')"
+          prop="IsEnable"
+          min-width="100"
+          show-overflow-tooltip
+        >
+          <template slot-scope="scope">
+            <el-tag :type="!scope.row.IsEnable ? 'info' : ''">
+              {{ $fd('IsEnable', scope.row.IsEnable) }}
+            </el-tag>
+          </template>
+        </el-table-column>
+        <el-table-column
+          :label="$t('system:role:table:Description')"
+          prop="Description"
+          min-width="220"
+          show-overflow-tooltip
+        />
         <el-table-column :label="$t('common:action:action')" width="280">
           <template slot-scope="scope">
             <el-button
@@ -49,14 +115,16 @@
               type="text"
               icon="el-icon-edit"
               @click="handleEditRole(scope.row)"
-            >{{ $t('common:button:edit') }}</el-button>
+              >{{ $t('common:button:edit') }}</el-button
+            >
             <el-button
               v-hasPermi="['system:role:delete']"
               size="mini"
               type="text"
               icon="el-icon-delete"
               @click="handleDeleteRole(scope.row)"
-            >{{ $t('common:button:delete') }}</el-button>
+              >{{ $t('common:button:delete') }}</el-button
+            >
           </template>
         </el-table-column>
       </el-table>
@@ -87,36 +155,36 @@ export default {
       treeData: [],
       defaultProps: {
         label: 'MenuName',
-        children: 'Children'
+        children: 'Children',
       },
       // 查询参数
       queryParams: {
         GroupId: undefined,
-        SearchFilter: undefined
+        SearchFilter: undefined,
       },
       dialogVisible: false,
       editRow: {},
       expandedKeys: [],
       treeLoading: false,
       funcListLoading: false,
-      funcList: []
+      funcList: [],
     }
   },
   mounted() {
     this.getList()
   },
   methods: {
-    getDictionary() {
-
-    },
+    getDictionary() {},
     getList() {
       this.loading = true
-      getUserTypeRoleList(this.queryParams).then((res) => {
-        this.loading = false
-        this.list = res.Result
-      }).catch(() => {
-        this.loading = false
-      })
+      getUserTypeRoleList(this.queryParams)
+        .then((res) => {
+          this.loading = false
+          this.list = res.Result
+        })
+        .catch(() => {
+          this.loading = false
+        })
     },
     handleAddRole() {
       this.editRow = {}
@@ -139,11 +207,13 @@ export default {
       this.$confirm(this.$t('trials:uploadedDicoms:message:deleteMes'), {
         type: 'warning',
         distinguishCancelAndClose: true,
-
       }).then(() => {
         deleteUserTypeRole(row.Id).then((res) => {
           if (res.IsSuccess) {
-            this.list.splice(this.list.findIndex((item) => item.Id === row.Id), 1)
+            this.list.splice(
+              this.list.findIndex((item) => item.Id === row.Id),
+              1
+            )
             this.$message.success(this.$t('common:message:deletedSuccessfully'))
           }
         })
@@ -152,8 +222,8 @@ export default {
     closeModal() {
       this.model_cfg.visible = false
       this.getList()
-    }
-  }
+    },
+  },
 }
 </script>
 <style lang="scss">
@@ -188,7 +258,7 @@ export default {
     overflow-y: auto;
     border-right: 1px solid #ccc;
   }
-  .selected-row{
+  .selected-row {
     background-color: cadetblue;
   }
 }

src/views/system/user/components/Retrospect.vue

@@ -0,0 +1,355 @@
+<template>
+  <box-content>
+    <div class="title">
+      {{ $t('system:retrospect:title:userFrom') }}
+    </div>
+    <div class="userFrom">
+      <el-form size="mini" class="base-search-form">
+        <el-form-item :label="$t('system:retrospect:form:createType')">
+          <span>{{ $fd('UserCeateSource', otherInfo.UserCeateSource) }}</span>
+        </el-form-item>
+        <el-form-item :label="$t('system:retrospect:form:createTime')">
+          <span>{{ otherInfo.CreateTime }}</span>
+        </el-form-item>
+        <el-form-item :label="$t('system:retrospect:form:createTrial')">
+          <span>{{
+            otherInfo.ResearchProgramNo || otherInfo.ExperimentName
+              ? `${otherInfo.ResearchProgramNo}, ${otherInfo.ExperimentName} `
+              : $t('common:title:none')
+          }}</span>
+        </el-form-item>
+      </el-form>
+    </div>
+    <div class="title">
+      {{ $t('system:retrospect:title:joinTrial') }}
+    </div>
+    <!-- 搜索框 -->
+    <div class="search">
+      <el-form :inline="true" size="mini" class="base-search-form">
+        <el-form-item :label="$t('system:retrospect:search:TrialCode')">
+          <el-input
+            v-model="searchData.TrialCode"
+            style="width: 100px"
+            clearable
+          />
+        </el-form-item>
+        <el-form-item :label="$t('system:retrospect:search:ResearchProgramNo')">
+          <el-input
+            v-model="searchData.ResearchProgramNo"
+            style="width: 100px"
+            clearable
+          />
+        </el-form-item>
+        <el-form-item :label="$t('system:retrospect:search:ExperimentName')">
+          <el-input
+            v-model="searchData.ExperimentName"
+            style="width: 100px"
+            clearable
+          />
+        </el-form-item>
+        <el-form-item :label="$t('system:retrospect:search:UserTypeId')">
+          <el-select
+            v-model="searchData.UserTypeId"
+            style="width: 100px"
+            placeholder=""
+          >
+            <template v-for="userType of userTypeOptions">
+              <el-option
+                v-if="![4, 6, 20].includes(userType.UserTypeEnum)"
+                :key="userType.Id"
+                :label="userType.UserType"
+                :value="userType.Id"
+              />
+            </template>
+          </el-select>
+        </el-form-item>
+        <el-form-item :label="$t('system:retrospect:search:IsDeleted')">
+          <el-select
+            v-model="searchData.IsDeleted"
+            style="width: 100px"
+            placeholder=""
+          >
+            <el-option
+              v-for="item of $d.IsUserExitTrial"
+              :key="item.Id"
+              :label="item.label"
+              :value="item.value"
+            />
+          </el-select>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="el-icon-search" @click="handleSearch">
+            {{ $t('common:button:search') }}
+          </el-button>
+          <el-button
+            type="primary"
+            icon="el-icon-refresh-left"
+            @click="handleReset"
+          >
+            {{ $t('common:button:reset') }}
+          </el-button>
+        </el-form-item>
+      </el-form>
+    </div>
+
+    <el-table
+      v-loading="loading"
+      v-adaptive="{ bottomOffset: 45 }"
+      :data="list"
+      stripe
+      height="100"
+      style="width: 100%"
+      @sort-change="handleSortByColumn"
+    >
+      <el-table-column type="index" width="40" />
+
+      <el-table-column
+        prop="TrialCode"
+        :label="$t('system:retrospect:table:TrialCode')"
+        sortable="custom"
+        show-overflow-tooltip
+      />
+      <el-table-column
+        prop="ResearchProgramNo"
+        :label="$t('system:retrospect:table:ResearchProgramNo')"
+        show-overflow-tooltip
+        sortable="custom"
+      />
+      <el-table-column
+        prop="ExperimentName"
+        :label="$t('system:retrospect:table:ExperimentName')"
+        show-overflow-tooltip
+        sortable="custom"
+      />
+      <el-table-column
+        prop="TrialStatusStr"
+        :label="$t('system:retrospect:table:TrialStatusStr')"
+        show-overflow-tooltip
+        sortable="custom"
+      >
+        <template slot-scope="scope">
+          <el-tag
+            v-if="scope.row.TrialStatusStr === 'Initializing'"
+            type="info"
+            >{{ $fd('TrialStatusEnum', scope.row.TrialStatusStr) }}</el-tag
+          >
+          <el-tag
+            v-if="scope.row.TrialStatusStr === 'Ongoing'"
+            type="primary"
+            >{{ $fd('TrialStatusEnum', scope.row.TrialStatusStr) }}</el-tag
+          >
+          <el-tag
+            v-if="scope.row.TrialStatusStr === 'Completed'"
+            type="warning"
+            >{{ $fd('TrialStatusEnum', scope.row.TrialStatusStr) }}</el-tag
+          >
+          <el-tag v-if="scope.row.TrialStatusStr === 'Stopped'" type="danger">{{
+            $fd('TrialStatusEnum', scope.row.TrialStatusStr)
+          }}</el-tag>
+        </template></el-table-column
+      >
+      <el-table-column
+        prop="TrialCreateTime"
+        :label="$t('system:retrospect:table:TrialCreateTime')"
+        show-overflow-tooltip
+        sortable="custom"
+      />
+      <el-table-column
+        prop="TrialUserRoleList"
+        :label="$t('system:retrospect:table:TrialUserRoleList')"
+        show-overflow-tooltip
+      >
+        <template slot-scope="scope">
+          <el-tooltip
+            class="item"
+            effect="dark"
+            :content="$t('trials:staff:tip:userTypeDisabled')"
+            placement="top"
+            style="margin-right: 2px"
+            v-if="
+              scope.row.TrialUserRoleList.some(
+                (item) => item.IsDeleted || item.IsUserRoleDisabled
+              )
+            "
+          >
+            <i class="el-icon-warning icon-i"></i>
+          </el-tooltip>
+          <span>{{
+            scope.row.TrialUserRoleList.map(
+              (item) => item.UserTypeShortName
+            ).join(', ')
+          }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column
+        prop="IsDeleted"
+        :label="$t('system:retrospect:table:IsDeleted')"
+        show-overflow-tooltip
+        sortable="custom"
+      >
+        <template slot-scope="scope">
+          <el-tag :type="scope.row.IsDeleted ? 'info' : ''">
+            {{ $fd('IsUserExitTrial', scope.row.IsDeleted) }}
+          </el-tag>
+        </template>
+      </el-table-column>
+      <el-table-column
+        prop="JoinTime"
+        :label="$t('system:retrospect:table:JoinTime')"
+        show-overflow-tooltip
+        sortable="custom"
+      />
+      <el-table-column
+        prop="RemoveTime"
+        :label="$t('system:retrospect:table:RemoveTime')"
+        show-overflow-tooltip
+        sortable="custom"
+      />
+      <el-table-column
+        :label="$t('common:action:action')"
+        width="200"
+        fixed="right"
+      >
+        <template slot-scope="scope">
+          <!-- 详情 -->
+          <el-button
+            circle
+            icon="el-icon-info"
+            :title="$t('system:retrospect:table:detail')"
+            @click.stop="handleDetail(scope.row)"
+          />
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <!-- 分页组件 -->
+    <pagination
+      class="page"
+      :total="total"
+      :page.sync="searchData.PageIndex"
+      :limit.sync="searchData.PageSize"
+      @pagination="getList"
+    />
+  </box-content>
+</template>
+<script>
+import {
+  getUserJoinedTrialList,
+  getUserTypeListByUserType,
+} from '@/api/admin.js'
+import Pagination from '@/components/Pagination'
+import BoxContent from '@/components/BoxContent'
+const searchDataDefault = () => {
+  return {
+    TrialCode: null,
+    ResearchProgramNo: null,
+    ExperimentName: null,
+    UserTypeId: null,
+    IsDeleted: null,
+    PageIndex: 1,
+    PageSize: 20,
+    Asc: false,
+    SortField: null,
+  }
+}
+export default {
+  components: { BoxContent, Pagination },
+  props: {
+    userId: { type: String, default: '' },
+  },
+  data() {
+    return {
+      searchData: searchDataDefault(),
+      loading: false,
+      otherInfo: {
+        CreateTime: null,
+        ExperimentName: null,
+        ResearchProgramNo: null,
+        TrialCode: null,
+        UserCeateSource: null,
+      },
+      list: [],
+      total: 0,
+      userTypeOptions: [],
+    }
+  },
+  mounted() {
+    this.getUserTypeList()
+    this.getList()
+  },
+  methods: {
+    getUserTypeList() {
+      getUserTypeListByUserType(0).then((res) => {
+        if (res.IsSuccess) {
+          this.userTypeOptions = []
+          res.Result.forEach((item) => {
+            if (item.UserTypeEnum !== 21) {
+              this.userTypeOptions.push(item)
+            }
+          })
+        }
+      })
+    },
+    async getList() {
+      try {
+        if (!this.userId) return false
+        this.searchData.IdentityUserId = this.userId
+        this.loading = true
+        let res = await getUserJoinedTrialList(this.searchData)
+        this.loading = false
+        if (res.IsSuccess) {
+          res.OtherInfo = res.OtherInfo ? res.OtherInfo : {}
+          Object.keys(this.otherInfo).forEach((key) => {
+            this.otherInfo[key] = res.OtherInfo[key]
+          })
+          this.list = res.Result.CurrentPageData
+          this.total = res.Result.TotalCount
+        }
+      } catch (err) {
+        console.log(err)
+        this.loading = false
+      }
+    },
+    handleDetail(row) {
+      this.$router.push({
+        path: `/trials/trials-panel?trialId=${row.TrialId}&trialCode=${row.TrialCode}&researchProgramNo=${row.ResearchProgramNo}`,
+      })
+    },
+    // 查询
+    handleSearch() {
+      this.searchData.PageIndex = 1
+      this.getList()
+    },
+    // 重置
+    handleReset() {
+      this.searchData = searchDataDefault()
+      this.getList()
+    },
+    // 排序
+    handleSortByColumn(column) {
+      if (column.order === 'ascending') {
+        this.searchData.Asc = true
+      } else {
+        this.searchData.Asc = false
+      }
+      this.searchData.SortField = column.prop
+      this.searchData.PageIndex = 1
+      this.getList()
+    },
+  },
+}
+</script>
+<style lang="scss" scoped>
+.title {
+  font-weight: bold;
+  margin-bottom: 10px;
+}
+.userFrom {
+  padding-left: 20px;
+  margin-bottom: 10px;
+}
+.icon-i {
+  color: #e6a23c;
+  cursor: pointer;
+}
+</style>

src/views/system/user/components/UserInfo.vue

@@ -184,7 +184,7 @@
         :disabled="isDisabled"
         style="margin: 10px 15px"
         @click="handleSave"
-        >Save</el-button
+        >{{ $t('common:button:save') }}</el-button
       >
     </el-form-item>
     <roleList

src/views/system/user/edit/index.vue

@@ -7,23 +7,31 @@
       <el-tab-pane :label="$t('system:userlist:tab:Password')" name="account">
         <Account v-if="load.account" :user-id="userId" />
       </el-tab-pane>
+      <el-tab-pane
+        :label="$t('system:userlist:tab:retrospect')"
+        name="retrospect"
+      >
+        <Retrospect v-if="load.retrospect" :user-id="userId" />
+      </el-tab-pane>
     </el-tabs>
   </div>
 </template>
 <script>
 import UserInfo from '../components/UserInfo'
 import Account from '../components/Account'
+import Retrospect from '../components/Retrospect'
 export default {
   name: 'EditUser',
-  components: { UserInfo, Account },
+  components: { UserInfo, Account,Retrospect },
   data() {
     return {
       activeTab: 'user',
       userId: '',
       load: {
         role: false,
-        account: false
-      }
+        account: false,
+        retrospect: false,
+      },
     }
   },
   created() {
@@ -34,7 +42,7 @@ export default {
       if (this.load[tab.name] === false) {
         this.load[tab.name] = true
       }
-    }
-  }
+    },
+  },
 }
 </script>

src/views/system/user/list/index.vue

@@ -55,9 +55,9 @@
         {{
           Array.isArray(scope.row.UserRoleList) &&
           scope.row.UserRoleList.length > 0
-            ? scope.row.UserRoleList.map((item) => item.UserTypeShortName).join(
-                ', '
-              )
+            ? scope.row.UserRoleList.filter((item) => !item.IsUserRoleDisabled)
+                .map((item) => item.UserTypeShortName)
+                .join(', ')
             : ''
         }}
       </template>
@@ -396,13 +396,13 @@ export default {
           label: this.$t('common:button:search'),
           type: 'primary',
           emitKey: 'search',
-          icon: 'el-icon-search'
+          icon: 'el-icon-search',
         },
         {
           label: this.$t('common:button:reset'),
           type: 'primary',
           emitKey: 'reset',
-          icon: 'el-icon-refresh-left'
+          icon: 'el-icon-refresh-left',
         },
         {
           label: this.$t('common:button:new'),

src/views/trials/trials-panel/attachments/reReading-tracking/index.vue

@@ -10,7 +10,7 @@
               v-for="(item,index) of siteOptions"
               :key="index"
               :label="item.TrialSiteCode"
-              :value="item.SiteId"
+              :value="item.TrialSiteId"
             />
           </el-select>
         </el-form-item>

src/views/trials/trials-panel/reading/dicoms/components/Fusion/js/initVolumeLoader.js

@@ -1,6 +1,7 @@
 import {
   volumeLoader,
-  cornerstoneStreamingImageVolumeLoader
+  cornerstoneStreamingImageVolumeLoader,
+  cornerstoneStreamingDynamicImageVolumeLoader
 } from '@cornerstonejs/core';
 
 export default function initVolumeLoader() {
@@ -11,4 +12,8 @@ export default function initVolumeLoader() {
     'cornerstoneStreamingImageVolume',
     cornerstoneStreamingImageVolumeLoader
   );
+  volumeLoader.registerVolumeLoader(
+    'cornerstoneStreamingDynamicImageVolume',
+    cornerstoneStreamingDynamicImageVolumeLoader
+  );
 }

src/views/trials/trials-panel/reading/dicoms/customize/CustomizeQuestionFormItem.vue

@@ -227,8 +227,7 @@
           type="number"
           v-if="question.Type === 'number' && question.DataSource !== 1"
           @change="(val) => { formItemNumberChange(val, question) }"
-          onblur="value=parseFloat(value).toFixed(parseInt(localStorage.getItem('digitPlaces')));"
-          @input="limitInput($event, questionForm, question.Id)"
+          @blur="handleBlur(questionForm[question.Id], questionForm, question.Id)"
           v-model="questionForm[question.Id]"
         >
           <template slot="append" v-if="question.Unit !== 0">{{question.Unit !== 4 ? $fd('ValueUnit', question.Unit) : question.CustomUnit}}</template>
@@ -237,8 +236,7 @@
         <el-input
           type="number"
           v-if="question.Type === 'number' && question.DataSource === 1"
-          onblur="value=parseFloat(value).toFixed(parseInt(localStorage.getItem('digitPlaces')));"
-          @input="limitInput($event, questionForm, question.Id)"
+          @blur="handleBlur(questionForm[question.Id], questionForm, question.Id)"
           :disabled="question.DataSource === 1"
           v-model="questionForm[question.Id]"
         >
@@ -396,7 +394,7 @@ export default {
       loading: false,
       RowIndex: 0,
       RowId: null,
-      digitPlaces: 0,
+      digitPlaces: 2,
       CalculationTabelList: [],
       classArr: []
     }
@@ -424,7 +422,8 @@ export default {
     },
   },
   mounted() {
-    this.digitPlaces = localStorage.getItem('digitPlaces') ? parseInt(localStorage.getItem('digitPlaces')) : 0
+    var digitPlaces = Number(localStorage.getItem('digitPlaces'))
+    this.digitPlaces = digitPlaces === -1 ? this.digitPlaces : digitPlaces
     // if (this.question.Type === 'class') {
     //   this.ClassifyAlgorithmsList = JSON.parse(this.question.ClassifyAlgorithms)
     // }
@@ -471,6 +470,9 @@ export default {
         }
       }
     },
+    handleBlur(value, a, b) {
+      this.$set(a, b, parseFloat(value).toFixed(this.digitPlaces))
+    },
     deleteTableCol(row, index) {
       this.$confirm(this.$t('trials:uploadNonDicoms:message:msg1')).then(() => {
         const loading = this.$loading({ fullscreen: true })
@@ -728,14 +730,13 @@ export default {
       } catch (e) {
         console.log(e)
       }
-      var digitPlaces = parseInt(localStorage.getItem('digitPlaces'))
       if (rules.ValueType === 2) {
         num = num * 100
       }
       if (rules.CustomCalculateMark === 13 || rules.CustomCalculateMark === 14) {
         return num
       } else {
-        return num.toFixed(digitPlaces)
+        return num.toFixed(this.digitPlaces)
       }
       
     },

src/views/trials/trials-panel/reading/dicoms/customize/CustomizeQuestionTableFormItem.vue

@@ -148,8 +148,7 @@
           v-if="question.Type === 'number' && question.DataSource !== 1"
           :disabled="question.TableQuestionType === 2 || (question.IsCopy && type === 'edit' && !IsBaseline && questionForm.IsCurrentTaskAdd === 'False')"
           @change="((val)=>{formItemNumberChange(val, question)})"
-          onblur="value=parseFloat(value).toFixed(parseInt(localStorage.getItem('digitPlaces')))"
-          @input="limitInput($event, question)"
+          @blur="handleBlur(questionForm[question.Id], questionForm, question.Id)"
           v-model="questionForm[question.Id]"
         >
           <template slot="append" v-if="question.Unit !== 0">{{question.Unit !== 4 ? $fd('ValueUnit', question.Unit) : question.CustomUnit}}</template>
@@ -158,8 +157,7 @@
           type="number"
           v-if="question.Type === 'number' && question.DataSource === 1"
           :disabled="question.DataSource === 1"
-          onblur="value=parseFloat(value).toFixed(parseInt(localStorage.getItem('digitPlaces')))"
-          @input="limitInput($event, question)"
+          @blur="handleCalculationBlur(calculationValue)"
           v-model="calculationValue"
         >
           <template slot="append" v-if="question.Unit !== 0">{{question.Unit !== 4 ? $fd('ValueUnit', question.Unit) : question.CustomUnit}}</template>
@@ -297,7 +295,7 @@ export default {
       organList: [],
       QuestionsList: [],
       QuestionsForm: {},
-      digitPlaces: 0
+      digitPlaces: 2
     }
   },
   // watch: {
@@ -323,7 +321,8 @@ export default {
     },
   },
   mounted() {
-    this.digitPlaces = localStorage.getItem('digitPlaces') ? parseInt(localStorage.getItem('digitPlaces')) : 0
+    var digitPlaces = Number(localStorage.getItem('digitPlaces'))
+    this.digitPlaces = digitPlaces === -1 ? this.digitPlaces : digitPlaces
     if (this.question.Type === 'upload') {
       if (this.questionForm[this.question.Id]) {
         this.urls = this.questionForm[this.question.Id].split('|')
@@ -382,6 +381,12 @@ export default {
         this.$emit('setFormItemData', { key: question.Id, val: v, question: question })
       }
     },
+    handleBlur(value, a, b) {
+      this.$set(a, b, parseFloat(value).toFixed(this.digitPlaces))
+    },
+    handleCalculationBlur(v) {
+      this.calculationValue = parseFloat(v).toFixed(this.digitPlaces)
+    },
     limitInput(value, q) {
       console.log(value)
       if (value.indexOf('.') > -1) {
@@ -477,11 +482,10 @@ export default {
       } catch (e) {
         console.log(e)
       }
-      var digitPlaces = parseInt(localStorage.getItem('digitPlaces'))
       if (rules.ValueType === 2) {
         num = num * 100
       }
-      return num.toFixed(digitPlaces)
+      return num.toFixed(this.digitPlaces)
     },
     formItemNumberChange(v, question) {
       this.$emit('formItemTableNumberChange', v, question)

src/views/trials/trials-panel/reading/dicoms/customize/CustomizeQuestionsPreview.vue

@@ -58,10 +58,13 @@ export default {
       activeName: 0,
       CalculationList: [],
       IsBaseline: true,
-      classArr: []
+      classArr: [],
+      digitPlaces: 2
     }
   },
   mounted() {
+    var digitPlaces = Number(localStorage.getItem('digitPlaces'))
+    this.digitPlaces = digitPlaces === -1 ? this.digitPlaces : digitPlaces
     this.getQuestionCalculateRelation()
     // this.getCustomTableQuestionAnswer()
     DicomEvent.$on('reGetQuestionAnswer', () => {
@@ -133,7 +136,7 @@ export default {
             this.classArr.push({triggerId: v.ClassifyQuestionId, classId: v.Id, classifyAlgorithms: v.ClassifyAlgorithms, classifyType: v.ClassifyType})
           }
           if (v.Type === 'number') {
-            this.$set(this.questionForm, v.Id, v.Answer === '' ? '' : parseFloat(v.Answer).toFixed(localStorage.getItem('digitPlaces')))
+            this.$set(this.questionForm, v.Id, v.Answer === '' ? '' : parseFloat(v.Answer).toFixed(this.digitPlaces))
           }
           if (v.Childrens.length > 0) {
             this.setChild(v.Childrens)
@@ -187,7 +190,7 @@ export default {
               this.$set(this.questionForm, v.Id, v.TableQuestions.Answers)
             }
             if (v.Type === 'number') {
-              this.$set(this.questionForm, v.Id, v.Answer === '' ? '' : parseFloat(v.Answer).toFixed(localStorage.getItem('digitPlaces')))
+              this.$set(this.questionForm, v.Id, v.Answer === '' ? '' : parseFloat(v.Answer).toFixed(this.digitPlaces))
             }
             if (v.Childrens.length > 0) {
               this.setChild(v.Childrens)
@@ -208,7 +211,7 @@ export default {
           i.TableQuestions.Questions.forEach(o => {
             if (o.Type === 'number') {
               i.TableQuestions.Answers.forEach((ite, index) => {
-                this.$set(i.TableQuestions.Answers[index], o.Id, i.TableQuestions.Answers[index][o.Id] ? parseFloat(i.TableQuestions.Answers[index][o.Id]).toFixed(localStorage.getItem('digitPlaces')) : null)
+                this.$set(i.TableQuestions.Answers[index], o.Id, i.TableQuestions.Answers[index][o.Id] ? parseFloat(i.TableQuestions.Answers[index][o.Id]).toFixed(this.digitPlaces) : null)
               })
             }
           })
@@ -218,7 +221,7 @@ export default {
           this.classArr.push({triggerId: i.ClassifyQuestionId, classId: i.Id, classifyAlgorithms: i.ClassifyAlgorithms, classifyType: i.ClassifyType})
         }
         if (i.Type === 'number') {
-          this.$set(this.questionForm, i.Id, i.Answer === '' ? '' : parseFloat(i.Answer).toFixed(localStorage.getItem('digitPlaces')))
+          this.$set(this.questionForm, i.Id, i.Answer === '' ? '' : parseFloat(i.Answer).toFixed(this.digitPlaces))
         }
         if (i.Childrens && i.Childrens.length > 0) {
           this.setChild(i.Childrens)

src/views/trials/trials-panel/reading/dicoms/customize/CustomizeReportPage.vue

@@ -148,7 +148,7 @@
                       v-else-if="scope.row.DataSource !== 1 && questionForm[scope.row.QuestionId] instanceof Array && scope.row.Type==='number' && (scope.row.xfIndex || scope.row.xfIndex === 0) && !scope.row.IsShowInDicom && ((task.IsBaseLine && scope.row.LimitEdit === 1) || (!task.IsBaseLine && scope.row.LimitEdit === 2) || scope.row.LimitEdit === 0)"
                       v-model="questionForm[scope.row.QuestionId][scope.row.xfIndex][scope.row.TableQuestionId]"
                       :disabled="scope.row.DataSource === 1"
-                      onblur="value=parseFloat(value).toFixed(parseInt(localStorage.getItem('digitPlaces')))"
+                      @blur="value=parseFloat(value).toFixed(digitPlaces)"
                       @input="limitInput($event, questionForm[scope.row.QuestionId][scope.row.xfIndex], scope.row.TableQuestionId)"
                       size="mini"
                       @focus="() => {questionId = scope.row.QuestionId}"
@@ -171,7 +171,7 @@
                       v-else-if="scope.row.DataSource !== 1 && scope.row.Type==='number' && !scope.row.IsShowInDicom && ((task.IsBaseLine && scope.row.LimitEdit === 1) || (!task.IsBaseLine && scope.row.LimitEdit === 2) || scope.row.LimitEdit === 0)"
                       v-model="questionForm[scope.row.QuestionId]"
                       :disabled="scope.row.DataSource === 1"
-                      onblur="value=parseFloat(value).toFixed(parseInt(localStorage.getItem('digitPlaces')))"
+                      @blur="value=parseFloat(value).toFixed(digitPlaces)"
                       @input="limitInput($event, questionForm, scope.row.QuestionId)"
                       size="mini"
                       @focus="() => {questionId = scope.row.QuestionId}"
@@ -314,7 +314,8 @@ export default {
       TrialReadingCriterionId: null,
       tableAnswers: {},
       questionForm: {},
-      questionId: null
+      questionId: null,
+      digitPlaces: 2
     }
   },
   watch: {
@@ -337,7 +338,8 @@ export default {
   },
   async mounted() {
     this.CriterionType = parseInt(localStorage.getItem('CriterionType'))
-    this.digitPlaces = parseInt(localStorage.getItem('digitPlaces'))
+    let digitPlaces = Number(localStorage.getItem('digitPlaces'))
+    this.digitPlaces = digitPlaces === -1 ? this.digitPlaces : digitPlaces
     this.TrialReadingCriterionId = this.$route.query.TrialReadingCriterionId
     window.addEventListener('resize', () => {
       this.handleResize()
@@ -359,7 +361,6 @@ export default {
         if (value.split('.')[1].length >= this.digitPlaces) {
           this.$set(a, b, parseFloat(value).toFixed(this.digitPlaces))
         }
-      } else {
       }
     },
     setImageUrl(qid, index, tqid, url, RowId) {
@@ -552,11 +553,10 @@ export default {
       } catch (e) {
         console.log(e)
       }
-      var digitPlaces = parseInt(localStorage.getItem('digitPlaces'))
       if (rules.ValueType === 2) {
         num = num * 100
       }
-      return isNaN(num) ? '' : isFinite(num) ? num.toFixed(digitPlaces) : '∞'
+      return isNaN(num) ? '' : isFinite(num) ? num.toFixed(this.digitPlaces) : '∞'
     },
     getReportInfo() {
       this.loading = true
@@ -647,14 +647,13 @@ export default {
                 }
               }
             }
-            var digitPlaces = parseInt(localStorage.getItem('digitPlaces')) || 0
             item.Answer.forEach(i => {
               if (item.DictionaryCode) {
                 this.$set(obj.Answers, i.VisitTaskId, i.Answer ? parseInt(i.Answer) : null)
                 // obj.Answers[i.VisitTaskId] = i.Answer ? parseInt(i.Answer) : null
               } else {
                 if (item.Type === 'number') {
-                  this.$set(obj.Answers, i.VisitTaskId, isNaN(parseFloat(i.Answer)) ? i.Answer : parseFloat(i.Answer).toFixed(digitPlaces))
+                  this.$set(obj.Answers, i.VisitTaskId, isNaN(parseFloat(i.Answer)) ? i.Answer : parseFloat(i.Answer).toFixed(this.digitPlaces))
                 } else {
                   this.$set(obj.Answers, i.VisitTaskId, i.Answer)
                 }

src/views/trials/trials-panel/reading/none-dicoms/index--.vue

@@ -0,0 +1,76 @@
+<template>
+  <div v-loading="loading" class="reading-viewer-container">
+    <!-- 访视阅片 -->
+    <visit-review v-if="taskInfo && taskInfo.ReadingCategory=== 1" />
+    <!-- 全局阅片 -->
+    <global-review v-else-if="taskInfo && taskInfo.ReadingCategory=== 2" />
+    <!-- 裁判阅片 -->
+    <ad-review v-else-if="taskInfo && taskInfo.ReadingCategory=== 4" />
+    <!-- 肿瘤学阅片 -->
+    <oncology-review v-else-if="taskInfo && taskInfo.ReadingCategory=== 5" />
+  </div>
+</template>
+<script>
+import { getNextTask } from '@/api/trials'
+import store from '@/store'
+import VisitReview from '@/views/trials/trials-panel/reading/visit-review'
+import GlobalReview from '@/views/trials/trials-panel/reading/global-review'
+import AdReview from '@/views/trials/trials-panel/reading/ad-review'
+import OncologyReview from '@/views/trials/trials-panel/reading/oncology-review'
+export default {
+  name: 'ReadingViewer',
+  components: {
+    VisitReview,
+    GlobalReview,
+    AdReview,
+    OncologyReview
+  },
+  data() {
+    return {
+      taskInfo: null,
+      loading: false
+    }
+  },
+  mounted() {
+    this.getTaskInfo()
+  },
+  methods: {
+    async getTaskInfo() {
+      this.loading = true
+      try {
+        const params = {
+          subjectId: this.$route.query.subjectId,
+          trialId: this.$route.query.trialId,
+          subjectCode: this.$route.query.subjectCode,
+          visitTaskId: this.$route.query.visitTaskId,
+          trialReadingCriterionId: this.$route.query.TrialReadingCriterionId
+        }
+        const res = await getNextTask(params)
+        this.taskInfo = res.Result
+        localStorage.setItem('taskInfo', JSON.stringify(res.Result))
+        // if (res.Result.IsExistsClinicalData && res.Result.IsNeedReadClinicalData && !res.Result.IsReadClinicalData) {
+        //   this.isFullscreen = false
+        //   this.dialogVisible = true
+        //   this.cdVisitTaskId = res.Result.visitTaskId
+        // }
+        // this.$nextTick(() => {
+        //   if (res.Result.IsFirstChangeTask && res.Result.ReadingTaskState === 0) {
+        //     this.tipVisible = true
+        //   }
+        // })
+        this.loading = false
+      } catch (e) {
+        console.log(e)
+        store.dispatch('reading/setCurrentReadingTaskState', 2)
+        this.loading = false
+      }
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+.reading-viewer-container {
+  width: 100%;
+  height: 100%;
+}
+</style>

src/views/trials/trials-panel/reading/visit-review/components/EcrfList.vue

@@ -0,0 +1,318 @@
+<template>
+  <div v-loading="loading" class="ecrf-list-container">
+    <el-form
+      ref="questions"
+      size="small"
+      :model="questionForm"
+      class="ecrf-form"
+    >
+      <FormItem
+        v-for="question of questions"
+        :key="question.Id"
+        :question="question"
+        :question-form="questionForm"
+        :reading-task-state="readingTaskState"
+        :visit-task-id="visitTaskId"
+        :calculation-list="calculationList"
+        @setFormItemData="setFormItemData"
+        @resetFormItemData="resetFormItemData"
+      />
+
+      <el-form-item v-if="readingTaskState < 2">
+        <div style="text-align:center;">
+          <el-button v-if="taskInfo && taskInfo.IseCRFShowInDicomReading" type="primary" @click="skipTask">
+            {{ $t('trials:readingReport:button:skip') }}
+          </el-button>
+          <el-button type="primary" @click="handleSave">
+            {{ $t('common:button:save') }}
+          </el-button>
+          <el-button v-if="taskInfo && taskInfo.IseCRFShowInDicomReading" type="primary" @click="handleSubmit">
+            {{ $t('common:button:submit') }}
+          </el-button>
+        </div>
+      </el-form-item>
+    </el-form>
+
+    <!-- 签名框 -->
+    <el-dialog
+      v-if="signVisible"
+      :visible.sync="signVisible"
+      :close-on-click-modal="false"
+      width="600px"
+      custom-class="base-dialog-wrapper"
+    >
+      <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 ref="signForm" :sign-code-enum="signCode" @closeDialog="closeSignDialog" />
+    </el-dialog>
+  </div>
+
+</template>
+
+<script>
+
+import { getTrialReadingQuestion, saveVisitTaskQuestions, submitVisitTaskQuestionsInDto, getQuestionCalculateRelation } from '@/api/trials'
+import { setSkipReadingCache } from '@/api/reading'
+import const_ from '@/const/sign-code'
+import store from '@/store'
+import { mapGetters } from 'vuex'
+import FormItem from './FormItem'
+import SignForm from '@/views/trials/components/newSignForm'
+export default {
+  name: 'EcrfList',
+  components: {
+    FormItem,
+    SignForm
+  },
+  props: {
+    visitTaskInfo: {
+      type: Object,
+      required: true
+    }
+  },
+  data() {
+    return {
+      trialId: '',
+      criterionId: '',
+      visitTaskId: '',
+      loading: false,
+      questions: [],
+      questionForm: {},
+      publicQuestions: [],
+      signVisible: false,
+      signCode: null,
+      currentUser: zzSessionStorage.getItem('userName'),
+      readingTaskState: 2,
+      activeName: 0,
+      classArr: [],
+      calculationList: [],
+      taskInfo: null
+    }
+  },
+  computed: {
+    ...mapGetters(['currentTaskState'])
+  },
+  watch: {
+    'visitTaskInfo.VisitTaskId': {
+      immediate: true,
+      handler(id) {
+        this.trialId = this.$route.query.trialId
+        this.criterionId = this.$route.query.TrialReadingCriterionId
+        if (!id) return
+        this.visitTaskId = id
+        this.getQuestionCalculateRelation()
+        this.getQuestions()
+      }
+    },
+    currentTaskState: {
+      immediate: true,
+      handler(state) {
+        if (state === 2) {
+          this.readingTaskState = 2
+        }
+      }
+    }
+  },
+  mounted() {
+    this.taskInfo = JSON.parse(localStorage.getItem('taskInfo'))
+  },
+  methods: {
+    async getQuestions() {
+      this.loading = true
+      try {
+        const param = {
+          readingQuestionCriterionTrialId: this.criterionId,
+          visitTaskId: this.visitTaskId
+        }
+        const res = await getTrialReadingQuestion(param)
+        if (res.IsSuccess) {
+          this.readingTaskState = res.OtherInfo.readingTaskState
+          res.Result.SinglePage.map((v) => {
+            if (v.Type === 'group' && v.Childrens.length === 0) return
+            if (!v.IsPage && v.Type !== 'group' && v.Type !== 'summary') {
+              this.$set(this.questionForm, v.Id, v.Answer ? v.Answer : null)
+            }
+            if (v.Type === 'class') {
+              this.classArr.push({ triggerId: v.ClassifyQuestionId, classId: v.Id, classifyAlgorithms: v.ClassifyAlgorithms, classifyType: v.ClassifyType })
+            }
+            if (v.Childrens.length > 0) {
+              this.setChild(v.Childrens)
+            }
+          })
+          this.questions = res.Result.SinglePage
+        }
+        this.loading = false
+      } catch (e) {
+        this.loading = false
+      }
+    },
+    setChild(obj) {
+      obj.forEach(i => {
+        if (i.Type !== 'group' && i.Type !== 'summary' && i.Id) {
+          this.$set(this.questionForm, i.Id, i.Answer ? i.Answer : null)
+        }
+        if (i.Type === 'class') {
+          this.classArr.push({ triggerId: i.ClassifyQuestionId, classId: i.Id, classifyAlgorithms: i.ClassifyAlgorithms, classifyType: i.ClassifyType })
+        }
+        if (i.Childrens && i.Childrens.length > 0) {
+          this.setChild(i.Childrens)
+        }
+      })
+    },
+    async getQuestionCalculateRelation() {
+      try {
+        const res = await getQuestionCalculateRelation({ TrialReadingCriterionId: this.criterionId })
+        this.calculationList = res.Result
+      } catch (e) {
+        console.log(e)
+      }
+    },
+    async handleSave() {
+      const valid = await this.$refs['questions'].validate()
+      if (!valid) return
+      this.loading = true
+      const answers = []
+      for (const k in this.questionForm) {
+        answers.push({ readingQuestionTrialId: k, answer: this.questionForm[k] })
+      }
+      const params = {
+        trialId: this.trialId,
+        visitTaskId: this.visitTaskId,
+        readingQuestionCriterionTrialId: this.criterionId,
+        answerList: answers
+      }
+      try {
+        const res = await saveVisitTaskQuestions(params)
+        if (res.IsSuccess) {
+          this.$message.success(this.$t('common:message:savedSuccessfully'))
+        }
+        this.loading = false
+      } catch (e) {
+        this.loading = false
+      }
+    },
+    async handleSubmit() {
+      const valid = await this.$refs['questions'].validate()
+      if (!valid) return
+      const { ImageAssessmentReportConfirmation } = const_.processSignature
+      this.signCode = ImageAssessmentReportConfirmation
+      this.signVisible = true
+    },
+    // 关闭签名框
+    closeSignDialog(isSign, signInfo) {
+      if (isSign) {
+        this.signConfirm(signInfo)
+      } else {
+        this.signVisible = false
+      }
+    },
+    // 签名并确认
+    async signConfirm(signInfo) {
+      this.loading = true
+      var answers = []
+      for (const k in this.questionForm) {
+        answers.push({ readingQuestionTrialId: k, answer: this.questionForm[k] })
+      }
+      var params = {
+        data: {
+          trialId: this.trialId,
+          visitTaskId: this.visitTaskId,
+          readingQuestionCriterionTrialId: this.criterionId,
+          answerList: answers
+        },
+        signInfo: signInfo
+      }
+      try {
+        const res = await submitVisitTaskQuestionsInDto(params)
+        this.loading = false
+        if (res.IsSuccess) {
+          this.$message.success(this.$t('common:message:savedSuccessfully'))
+          this.isEdit = false
+          this.$refs['signForm'].btnLoading = false
+          this.signVisible = false
+          this.readingTaskState = 2
+          this.taskInfo.ReadingTaskState = 2
+          localStorage.setItem('taskInfo', JSON.stringify(this.taskInfo))
+          store.dispatch('noneDicomReview/setCurrentTaskState', 2)
+          window.opener.postMessage('refreshTaskList', window.location)
+          const confirm = await this.$confirm(
+            this.$t('trials:noneDicoms:message:msg1'),
+            {
+              type: 'warning',
+              distinguishCancelAndClose: true
+            }
+          )
+          if (confirm !== 'confirm') return
+          window.location.reload()
+        }
+      } catch (e) {
+        this.loading = false
+        this.$refs['signForm'].btnLoading = false
+      }
+    },
+    async skipTask() {
+      try {
+        // 是否确认跳过？
+        const confirm = await this.$confirm(
+          this.$t('trials:readingReport:message:skipConfirm'),
+          {
+            type: 'warning',
+            distinguishCancelAndClose: true
+          }
+        )
+        if (confirm !== 'confirm') return
+        this.loading = true
+        const res = await setSkipReadingCache({ visitTaskId: this.visitTaskId })
+        this.loading = false
+        if (res.IsSuccess) {
+          window.location.reload()
+        }
+      } catch (e) {
+        this.loading = false
+        console.log(e)
+      }
+    },
+    resetFormItemData(v) {
+      this.questionForm[v] = null
+    },
+    setFormItemData(obj) {
+      this.$set(this.questionForm, obj.key, JSON.parse(JSON.stringify(obj.val)))
+      this.classArr.map(i => {
+        if (i.triggerId === obj.key) {
+          let answer = null
+          const list = JSON.parse(i.classifyAlgorithms)
+          if (i.classifyType === 0) {
+            const o = list.find(v => {
+              return (
+                parseFloat(obj.val) >= parseFloat(v.gt) &&
+                  parseFloat(obj.val) < parseFloat(v.lt)
+              )
+            })
+            answer = o ? o.label : null
+          } else if (i.classifyType === 1) {
+            const o = list.find(v => {
+              return v.val.includes(obj.val)
+            })
+            answer = o ? o.label : null
+          }
+          this.$set(this.questionForm, i.classId, answer)
+        }
+      })
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+.ecrf-list-container{
+  min-height:400px;
+  color: #ddd;
+  .ecrf-form{
+    ::v-deep .el-form-item__label{
+      color: #ddd;
+    }
+
+  }
+}
+</style>

src/views/trials/trials-panel/reading/visit-review/components/FileViewer.vue

@@ -0,0 +1,957 @@
+<template>
+  <div class="none-dicom-viewer">
+    <!-- tools -->
+    <div class="tools-wrapper">
+      <!-- 布局 -->
+      <div class="tool-item" :title="$t('trials:reading:button:layout')">
+        <el-dropdown @command="handleCommand">
+          <span class="el-dropdown-link">
+            <svg-icon icon-class="layout" class="svg-icon" /><i class="el-icon-arrow-down el-icon--right" />
+          </span>
+          <el-dropdown-menu slot="dropdown">
+            <el-dropdown-item command="1*1">1*1</el-dropdown-item>
+            <el-dropdown-item command="1*2">1*2</el-dropdown-item>
+            <el-dropdown-item command="2*2">2*2</el-dropdown-item>
+          </el-dropdown-menu>
+        </el-dropdown>
+      </div>
+      <!-- 缩放 -->
+      <div
+        :class="['tool-item', activeTool === 'Zoom' ? 'tool-item-active' : '']"
+        :title="$t('trials:reading:button:zoom')"
+        @click.prevent="setToolActive('Zoom')"
+      >
+        <svg-icon icon-class="magnifier" class="svg-icon" />
+      </div>
+      <!-- 移动 -->
+      <div
+        :class="['tool-item', activeTool === 'Pan' ? 'tool-item-active' : '']"
+        :title="$t('trials:reading:button:move')"
+        @click.prevent="setToolActive('Pan')"
+      >
+        <svg-icon icon-class="move" class="svg-icon" />
+      </div>
+      <!-- 旋转 -->
+      <div
+        :class="['tool-item', activeTool === 'PlanarRotate' ? 'tool-item-active' : '']"
+        :title="$t('trials:reading:button:rotate')"
+        @click.prevent="setToolActive('PlanarRotate')"
+      >
+        <svg-icon icon-class="rotate" class="svg-icon" />
+      </div>
+      <!-- 箭头工具 -->
+      <div
+        :class="['tool-item', readingTaskState === 2 ? 'tool-disabled' : '', activeTool === 'ArrowAnnotate' ? 'tool-item-active' : '']"
+        :title="$t('trials:reading:button:arrowAnnotate')"
+        @click.prevent="setAnnotateToolActive('ArrowAnnotate')"
+      >
+        <svg-icon icon-class="arrow" class="svg-icon" />
+      </div>
+
+      <!-- 自由曲线 -->
+      <div
+        :class="['tool-item', readingTaskState === 2 ? 'tool-disabled' : '', activeTool === 'PlanarFreehandROI' ? 'tool-item-active' : '']"
+        :title="$t('trials:dicom-show:Eraser')"
+        @click.prevent="setAnnotateToolActive('PlanarFreehandROI')"
+      >
+        <svg-icon icon-class="polygon" class="svg-icon" />
+      </div>
+      <!-- 截图 -->
+      <!-- <div
+        class="tool-item"
+        :title="$t('trials:reading:button:screenShot')"
+        @click.prevent="saveImage"
+      >
+        <svg-icon icon-class="image" class="svg-icon" />
+      </div> -->
+      <!-- 重置 -->
+      <div
+        class="tool-item"
+        :title="$t('trials:reading:button:reset')"
+        @click.prevent="resetViewport"
+      >
+        <svg-icon icon-class="refresh" class="svg-icon" />
+      </div>
+    </div>
+    <!-- viewports -->
+    <div class="viewports-wrapper">
+      <div class="grid-container" :style="gridStyle">
+        <div
+          v-for="(v, index) in viewportInfos"
+          v-show="index < cells.length"
+          :key="index"
+          :style="cellStyle"
+          :class="['grid-cell', index === activeCanvasIndex ? 'cell_active' : '', index === fullScreenIndex ? 'cell-full-screen' : '']"
+          @dblclick="toggleFullScreen($event, index)"
+          @click="activeCanvas(index)"
+          @mouseup="sliderMouseup($event, index)"
+          @mousemove="sliderMousemove($event, index)"
+        >
+          <div v-show="v.fileType === 'image/jpeg'" :ref="`canvas-${index}`" class="content">
+            <div class="left-top-text">
+              <div
+                v-if="v.taskInfo.IsExistsClinicalData"
+                class="cd-info"
+                :title="$t('trials:reading:button:clinicalData')"
+                @click.stop="viewCD(v.taskInfo.VisitTaskId)"
+              >
+                <svg-icon icon-class="documentation" class="svg-icon" />
+              </div>
+              <h2
+                v-if="taskInfo && taskInfo.IsReadingShowSubjectInfo && v.taskInfo"
+                class="subject-info"
+              >
+                {{ `${taskInfo.SubjectCode} ${v.taskInfo.TaskBlindName} ` }}
+              </h2>
+              <div v-if="v.currentFileName">{{ v.currentFileName }}</div>
+            </div>
+            <div
+              v-if="taskInfo && taskInfo.IsReadingTaskViewInOrder === 1 && v.taskInfo"
+              class="top-center-tool"
+            >
+              <div class="toggle-visit-container">
+                <div
+                  class="arrw_icon"
+                  :style="{ cursor: v.taskInfo.VisitTaskNum !== 0 ? 'pointer' : 'not-allowed', color: v.taskInfo.VisitTaskNum !== 0 ? '#fff': '#6b6b6b' }"
+                  @click.stop.prevent="toggleTask($event, v.taskInfo.VisitTaskNum, -1)"
+                  @dblclick.stop="preventDefault($event)"
+                >
+                  <i class="el-icon-caret-left" />
+                </div>
+                <div class="arrow_text">
+                  {{ v.taskInfo.TaskBlindName }}
+                </div>
+                <div
+                  class="arrw_icon"
+                  :style="{ cursor: v.taskInfo.VisitTaskNum < taskInfo.VisitNum ? 'pointer' : 'not-allowed', color: v.taskInfo.VisitTaskNum < taskInfo.VisitNum ? '#fff': '#6b6b6b' }"
+                  @click.stop.prevent="toggleTask($event, v.taskInfo.VisitTaskNum, 1)"
+                  @dblclick.stop="preventDefault($event)"
+                >
+                  <i class="el-icon-caret-right" />
+                </div>
+              </div>
+            </div>
+            <div :ref="`sliderBox-${index}`" class="right-slider-box" @click.stop="clickSlider($event, index)">
+              <div :style="{top: v.height + '%'}" class="slider" @click.stop.prevent="() => {return}" @mousedown.stop="sliderMousedown($event, index)" />
+            </div>
+          </div>
+          <div v-show="v.fileType === 'application/pdf'" class="content">
+            <iframe v-if="v.currentFilePath" :ref="`iframe-${index}`" :src="`/static/pdfjs/web/viewer.html?file=${OSSclientConfig.basePath}${v.currentFilePath}?index=${index}`" width="100%" height="100%" frameborder="0" crossorigin="anonymous" />
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+import { addNoneDicomMark, deleteTrialFileType } from '@/api/trials'
+import {
+  RenderingEngine,
+  Enums,
+  imageLoader,
+  metaData,
+  getRenderingEngine,
+  eventTarget
+} from '@cornerstonejs/core'
+import * as cornerstoneTools from '@cornerstonejs/tools'
+import initLibraries from '@/views/trials/trials-panel/reading/dicoms/components/Fusion/js/initLibraries'
+import hardcodedMetaDataProvider from './../js/hardcodedMetaDataProvider'
+import registerWebImageLoader from './../js/registerWebImageLoader'
+import { mapGetters } from 'vuex'
+import store from '@/store'
+const { ViewportType } = Enums
+const renderingEngineId = 'myRenderingEngine'
+const {
+  ToolGroupManager,
+  Enums: csToolsEnums,
+  StackScrollTool,
+  PanTool,
+  ZoomTool,
+  PlanarRotateTool,
+  ArrowAnnotateTool,
+  PlanarFreehandROITool,
+  EraserTool
+} = cornerstoneTools
+const { MouseBindings, Events: toolsEvents } = csToolsEnums
+export default {
+  name: 'ImageViewer',
+  props: {
+    relatedStudyInfo: {
+      type: Object,
+      default() {
+        return {}
+      }
+    }
+  },
+  data() {
+    return {
+      rows: 1,
+      cols: 1,
+      fullScreenIndex: null,
+      imageIds: [],
+      activeCanvasIndex: 0,
+      activeCanvasFileType: '',
+      layout: '1*2',
+      cellsMax: 4,
+      viewportInfos: [],
+      taskInfo: null,
+      activeTool: '',
+      readingTaskState: 2,
+      renderHistoryAnnotationTaskIds: []
+    }
+  },
+  computed: {
+    gridStyle() {
+      return {
+        display: 'grid',
+        gridTemplateRows: `repeat(${this.rows}, 1fr)`,
+        gridTemplateColumns: `repeat(${this.cols}, 1fr)`,
+        height: '100%',
+        width: '100%'
+      }
+    },
+    cellStyle() {
+      return {
+        border: '1px dashed #ccc',
+        display: 'flex',
+        alignItems: 'center',
+        justifyContent: 'center'
+      }
+    },
+    cells() {
+      return Array(this.rows * this.cols).fill(0)
+    },
+    ...mapGetters(['lastViewportTaskId', 'currentTaskState'])
+  },
+  watch: {
+    relatedStudyInfo: {
+      immediate: true,
+      handler(obj) {
+        if (!obj || Object.keys(obj).length === 0) return
+        this.updateViewportInfos(0, obj)
+      }
+    },
+    currentTaskState: {
+      immediate: true,
+      handler(state) {
+        if (state === 2) {
+          this.readingTaskState = 2
+          // 设置标记锁定
+          const annotations = cornerstoneTools.annotation.state.getAllAnnotations()
+          annotations.map(annotation => {
+            cornerstoneTools.annotation.locking.setAnnotationLocked(annotation.annotationUID)
+          })
+          this.setToolsPassive()
+        }
+      }
+    }
+  },
+  mounted() {
+    this.taskInfo = JSON.parse(localStorage.getItem('taskInfo'))
+    this.readingTaskState = this.taskInfo.ReadingTaskState
+    if (this.taskInfo.VisitNum > 0 && this.taskInfo.IsReadingTaskViewInOrder !== 0) {
+      this.rows = 1
+      this.cols = 2
+      this.activeCanvasIndex = 1
+    }
+    this.viewportInfos = Array.from({ length: this.cellsMax }, (_, index) => ({
+      index: index,
+      taskInfo: '',
+      studyId: '',
+      currentImageIdIndex: 0,
+      viewportId: `canvas-${index}`,
+      fileType: '',
+      currentFileName: '',
+      currentFilePath: '',
+      imageIds: [],
+      oldB: null,
+      oldM: null,
+      isMove: false,
+      height: 0
+    }))
+    this.initLoader()
+    window.addEventListener('message', this.handleIframeMessage)
+    console.log(cornerstoneTools)
+  },
+  beforeDestroy() {
+    window.removeEventListener('message', this.handleIframeMessage)
+  },
+  methods: {
+    // 初始化加载器
+    async initLoader() {
+      registerWebImageLoader(imageLoader)
+      await initLibraries()
+
+      let renderingEngine = getRenderingEngine(renderingEngineId)
+      if (!renderingEngine) {
+        renderingEngine = new RenderingEngine(renderingEngineId)
+      }
+      const resizeObserver = new ResizeObserver(() => {
+        const renderingEngine = getRenderingEngine(renderingEngineId)
+        if (renderingEngine) {
+          renderingEngine.resize(true, false)
+        }
+      })
+      const element1 = this.$refs['canvas-0'][0]
+      const element2 = this.$refs['canvas-1'][0]
+      const element3 = this.$refs['canvas-2'][0]
+      const element4 = this.$refs['canvas-3'][0]
+      const elements = [
+        element1,
+        element2,
+        element3,
+        element4
+      ]
+      elements.forEach((element, i) => {
+        element.oncontextmenu = (e) => e.preventDefault()
+        resizeObserver.observe(element)
+        element.addEventListener('CORNERSTONE_STACK_NEW_IMAGE', this.stackNewImage)
+      })
+      const viewportInputArray = [
+        {
+          viewportId: 'canvas-0',
+          type: ViewportType.STACK,
+          element: element1
+        },
+        {
+          viewportId: 'canvas-1',
+          type: ViewportType.STACK,
+          element: element2
+        },
+        {
+          viewportId: 'canvas-2',
+          type: ViewportType.STACK,
+          element: element3
+        },
+        {
+          viewportId: 'canvas-3',
+          type: ViewportType.STACK,
+          element: element4
+        }
+      ]
+      const viewportIds = ['canvas-0', 'canvas-1', 'canvas-2', 'canvas-3']
+      renderingEngine.setViewports(viewportInputArray)
+      this.addAnnotationListeners()
+      cornerstoneTools.addTool(StackScrollTool)
+      cornerstoneTools.addTool(PanTool)
+      cornerstoneTools.addTool(ZoomTool)
+      cornerstoneTools.addTool(PlanarRotateTool)
+      cornerstoneTools.addTool(ArrowAnnotateTool)
+      cornerstoneTools.addTool(PlanarFreehandROITool)
+      cornerstoneTools.addTool(EraserTool)
+
+      viewportIds.forEach((viewportId, i) => {
+        const toolGroupId = `canvas-${i}`
+        const toolGroup = ToolGroupManager.createToolGroup(toolGroupId)
+        toolGroup.addViewport(viewportId, renderingEngineId)
+        toolGroup.addTool(StackScrollTool.toolName)
+        toolGroup.addTool(PanTool.toolName)
+        toolGroup.addTool(ZoomTool.toolName)
+        toolGroup.addTool(PlanarRotateTool.toolName)
+        toolGroup.addTool(ArrowAnnotateTool.toolName, {
+          arrowHeadStyle: 'standard',
+          changeTextCallback: async(data, eventData, doneChangingTextCallback) => {
+            return doneChangingTextCallback(await this.customPrompt())
+          },
+          getTextCallback: async(doneChangingTextCallback) => {
+            return doneChangingTextCallback(await this.customPrompt())
+          }
+        })
+        toolGroup.addTool(PlanarFreehandROITool.toolName)
+        toolGroup.addTool(EraserTool.toolName)
+        toolGroup.setToolActive(StackScrollTool.toolName, {
+          bindings: [{ mouseButton: MouseBindings.Wheel }]
+        })
+        toolGroup.setToolPassive(PanTool.toolName)
+        toolGroup.setToolPassive(ZoomTool.toolName)
+        toolGroup.setToolPassive(PlanarRotateTool.toolName)
+        if (this.readingTaskState < 2) {
+          toolGroup.setToolPassive(ArrowAnnotateTool.toolName)
+          toolGroup.setToolPassive(PlanarFreehandROITool.toolName)
+        } else {
+          toolGroup.setToolEnabled(ArrowAnnotateTool.toolName)
+          toolGroup.setToolEnabled(PlanarFreehandROITool.toolName)
+        }
+        toolGroup.setToolPassive(EraserTool.toolName)
+      })
+    },
+
+    // 加载图片回调
+    stackNewImage(e) {
+      const { detail } = e
+      const i = this.viewportInfos.findIndex(i => i.viewportId === detail.viewportId)
+      if (i === -1) return
+      this.viewportInfos[i].currentImageIdIndex = detail.imageIdIndex
+      const obj = this.viewportInfos[i].fileList[detail.imageIdIndex]
+      if (!obj) return
+      this.viewportInfos[i].currentFileName = obj.FileName
+      this.viewportInfos[i].height = (this.viewportInfos[i].currentImageIdIndex) * 100 / (this.viewportInfos[i].imageIds.length - 1)
+      const path = detail.imageId.split(`web:${this.OSSclientConfig.basePath}`)[1]
+      this.$emit('toggleImage', { taskId: this.viewportInfos[i].taskInfo.VisitTaskId, studyId: this.viewportInfos[i].studyId, path: path })
+      this.renderHistoryAnnotations(this.viewportInfos[i].taskInfo)
+    },
+    renderHistoryAnnotations(obj) {
+      if (this.renderHistoryAnnotationTaskIds.includes(obj.VisitTaskId)) return
+      this.renderHistoryAnnotationTaskIds.push(obj.VisitTaskId)
+      const arr = []
+      obj.Annotations.map(i => {
+        if (typeof i.MeasureData === 'string') {
+          const annotation = JSON.parse(i.MeasureData)
+          annotation.annotationId = i.Id
+          arr.push(annotation)
+          cornerstoneTools.annotation.state.addAnnotation(annotation)
+          if (obj.ReadingTaskState === 2) {
+            cornerstoneTools.annotation.locking.setAnnotationLocked(annotation.annotationUID)
+          }
+        }
+      })
+    },
+    // 渲染图片
+    async renderImage(imageIds, canvasIndex, sliceIndex) {
+      metaData.addProvider((type, imageId) => hardcodedMetaDataProvider(type, imageId, imageIds), 10000)
+      const renderingEngine = getRenderingEngine(renderingEngineId)
+      const viewport = renderingEngine.getViewport(`canvas-${canvasIndex}`)
+      await viewport.setStack(imageIds)
+      viewport.setImageIdIndex(sliceIndex)
+      viewport.render()
+      // this.updateViewportInfos()
+    },
+    setActiveCanvasImages(obj) {
+      console.log('setActiveCanvasImages')
+      if (!obj || Object.keys(obj).length === 0) return
+      const i = this.viewportInfos.findIndex(i => i.index === this.activeCanvasIndex)
+      if (i === -1) return
+      if (obj.studyId === this.viewportInfos[i].studyId && this.viewportInfos[i].fileType === 'image/jpeg' && obj.fileInfo.FileType === 'image/jpeg') {
+        const fileIndex = this.viewportInfos[i].fileList.findIndex(i => i.Path === obj.fileInfo.Path)
+        this.sliceIndex(fileIndex)
+      } else {
+        this.updateViewportInfos(this.activeCanvasIndex, obj)
+      }
+      if (this.activeCanvasIndex === this.cells.length - 1) {
+        store.dispatch('noneDicomReview/setLastViewportTaskId', obj.visitTaskInfo.VisitTaskId)
+      }
+    },
+    // 激活视图
+    activeCanvas(index) {
+      if (this.activeCanvasIndex === index) return
+      const i = this.viewportInfos.findIndex(i => i.index === index)
+      if (i === -1) return
+      this.activeCanvasIndex = index
+      if (index === this.cells.length - 1) {
+        store.dispatch('noneDicomReview/setLastViewportTaskId', this.viewportInfos[i].taskInfo.VisitTaskId)
+      }
+      this.$emit('toggleTask', this.viewportInfos[i].taskInfo)
+      this.setToolsPassive()
+    },
+    // 更新视图信息
+    updateViewportInfos(index, obj) {
+      const i = this.viewportInfos.findIndex(i => i.index === index)
+      if (i === -1) return
+
+      this.viewportInfos[i].taskInfo = obj.visitTaskInfo
+
+      this.viewportInfos[i].currentFileName = obj.fileInfo.FileName
+      this.viewportInfos[i].studyId = obj.studyId
+      this.viewportInfos[i].fileType = obj.fileInfo.FileType
+      if (obj.fileInfo.FileType === 'image/jpeg') {
+        const arr = obj.fileList.filter(i => i.FileType === obj.fileInfo.FileType)
+        this.viewportInfos[i].fileList = arr
+        const fileIndex = this.viewportInfos[i].fileList.findIndex(i => i.Path === obj.fileInfo.Path)
+        this.viewportInfos[i].currentImageIdIndex = fileIndex
+        const imageIds = []
+        for (let i = 0; i < arr.length; i++) {
+          const path = arr[i].Path
+          imageIds.push(`web:${this.OSSclientConfig.basePath}${path}`)
+        }
+        this.viewportInfos[i].imageIds = imageIds
+        if (imageIds.length > 0) {
+          this.renderImage(imageIds, index, fileIndex)
+        }
+        this.$nextTick(() => {
+          const renderingEngine = getRenderingEngine(renderingEngineId)
+          if (renderingEngine) {
+            renderingEngine.resize(true, false)
+          }
+        })
+      } else {
+        this.viewportInfos[i].currentFilePath = obj.fileInfo.Path
+      }
+    },
+    // 切换图片
+    sliceIndex(index) {
+      const i = this.viewportInfos.findIndex(i => i.index === this.activeCanvasIndex)
+      if (i === -1) return
+      if (index < 0 || index >= this.viewportInfos[i].imageIds.length) return
+      const renderingEngine = getRenderingEngine(renderingEngineId)
+      const viewport = renderingEngine.getViewport(
+        this.viewportInfos[i].viewportId
+      )
+      viewport.setImageIdIndex(index)
+      viewport.render()
+    },
+    // 更改视图布局
+    handleCommand(command) {
+      this.fullScreenIndex = null
+      this.layout = command
+      this.rows = parseInt(command.split('*')[0])
+      this.cols = parseInt(command.split('*')[1])
+      // 有序阅片 1*1 显示当前图片 1*2  显示基线*当前图片  2*2 显示当前图片
+      // const obj = this.viewportInfos.find(i => i.index === this.activeCanvasIndex)
+      // if (obj && this.rows === 1 && this.cols === 1) {
+      //   this.viewportInfos = this.viewportInfos.map((v, i) => {
+      //     if (i === 0) {
+      //       v.taskInfo = obj.taskInfo
+      //       v.currentImageIdIndex === obj.currentImageIdIndex
+      //       v.currentFileName === obj.currentFileName
+      //       v.imageIds === obj.imageIds
+      //     } else {
+      //       v.taskInfo = ''
+      //       v.currentImageIdIndex === 0
+      //       v.currentFileName === ''
+      //       v.imageIds === []
+      //     }
+      //     return v
+      //   })
+      //   this.activeCanvasIndex = 0
+      // } else if (obj && this.rows === 1 && this.cols === 2 && this.taskInfo.IsReadingTaskViewInOrder === 1) {
+      //   this.viewportInfos = this.viewportInfos.map((v, i) => {
+      //     if (i === 0) {
+      //       v.taskInfo = this.relatedStudyInfo.visitTaskInfo
+      //       v.currentImageIdIndex === this.relatedStudyInfo.fileIndex
+      //       v.currentFileName === this.relatedStudyInfo.fileInfo.FileName
+      //       const imageIds = []
+      //       for (let i = 0; i < this.relatedStudyInfo.fileList.length; i++) {
+      //         const path = this.relatedStudyInfo.fileList[i].Path
+      //         imageIds.push(`web:${this.OSSclientConfig.basePath}${path}`)
+      //       }
+      //       v.imageIds === imageIds
+      //     } else if (i === 1) {
+      //       v.taskInfo = obj.taskInfo
+      //       v.currentImageIdIndex === obj.currentImageIdIndex
+      //       v.currentFileName === obj.currentFileName
+      //       v.imageIds === obj.imageIds
+      //     } else {
+      //       v.taskInfo = ''
+      //       v.currentImageIdIndex === 0
+      //       v.currentFileName === ''
+      //       v.imageIds === []
+      //     }
+      //     return v
+      //   })
+      //   this.activeCanvasIndex = 1
+      // } else if (obj && this.rows === 1 && this.cols === 2 && this.taskInfo.IsReadingTaskViewInOrder !== 1) {
+      //   this.viewportInfos = this.viewportInfos.map((v, i) => {
+      //     if (i === 0 || i === 1) {
+      //       v.taskInfo = obj.taskInfo
+      //       v.currentImageIdIndex === obj.currentImageIdIndex
+      //       v.currentFileName === obj.currentFileName
+      //       v.imageIds === obj.imageIds
+      //     } else {
+      //       v.taskInfo = ''
+      //       v.currentImageIdIndex === 0
+      //       v.currentFileName === ''
+      //       v.imageIds === []
+      //     }
+      //     return v
+      //   })
+      //   this.activeCanvasIndex = 1
+      // } else if (obj && (this.rows === 2 && this.cols === 2)) {
+      //   this.viewportInfos = this.viewportInfos.map(v => {
+      //     v.taskInfo = obj.taskInfo
+      //     v.currentImageIdIndex === obj.currentImageIdIndex
+      //     v.currentFileName === obj.currentFileName
+      //     v.imageIds === obj.imageIds
+      //     return v
+      //   })
+      //   this.activeCanvasIndex = 3
+      // }
+      // this.$nextTick(() => {
+      //   this.viewportInfos.forEach(v => {
+      //     if (v.imageIds.length > 0) {
+      //       this.renderImage(v.imageIds, v.index, v.currentImageIdIndex)
+      //     }
+      //   })
+      // })
+    },
+    // 切换全屏
+    toggleFullScreen(e, index) {
+      this.fullScreenIndex = this.fullScreenIndex === index ? null : index
+      this.activeCanvasIndex = index
+    },
+    // 切换任务
+    toggleTask(evt, visitTaskNum, i) {
+      const num = visitTaskNum + i
+      if (num >= 0 && num <= this.taskInfo.VisitNum) {
+        this.$emit('toggleTaskByViewer', num)
+      }
+
+      evt.stopImmediatePropagation()
+      evt.stopPropagation()
+      evt.preventDefault()
+    },
+    // 激活工具
+    setToolActive(toolName) {
+      const i = this.viewportInfos.findIndex(i => i.index === this.activeCanvasIndex)
+      if (i === -1) return
+      const toolGroupId = `canvas-${this.viewportInfos[i].index}`
+      const toolGroup = ToolGroupManager.getToolGroup(toolGroupId)
+      if (this.activeTool === toolName) {
+        toolGroup.setToolPassive(this.activeTool)
+        this.activeTool = ''
+      } else {
+        if (this.activeTool) {
+          toolGroup.setToolPassive(this.activeTool)
+        }
+        toolGroup.setToolActive(toolName, {
+          bindings: [{ mouseButton: MouseBindings.Primary }]
+        })
+        this.activeTool = toolName
+      }
+    },
+    // 激活标注工具
+    setAnnotateToolActive(toolName) {
+      if (this.readingTaskState === 2) return
+      const i = this.viewportInfos.findIndex(i => i.index === this.activeCanvasIndex)
+      if (i === -1) return
+      if (this.viewportInfos[i].taskInfo.VisitTaskId === this.taskInfo.VisitTaskId) {
+        const toolGroupId = `canvas-${this.viewportInfos[i].index}`
+        const toolGroup = ToolGroupManager.getToolGroup(toolGroupId)
+        if (this.activeTool === toolName) {
+          toolGroup.setToolPassive(this.activeTool)
+          this.activeTool = ''
+        } else {
+          if (this.activeTool) {
+            toolGroup.setToolPassive(this.activeTool)
+          }
+          toolGroup.setToolActive(toolName, {
+            bindings: [{ mouseButton: MouseBindings.Primary }]
+          })
+          this.activeTool = toolName
+        }
+      }
+    },
+    setToolsPassive() {
+      if (!this.activeTool) return
+      const toolGroupIds = ['canvas-0', 'canvas-1', 'canvas-2', 'canvas-3']
+      toolGroupIds.forEach(toolGroupId => {
+        const toolGroup = ToolGroupManager.getToolGroup(toolGroupId)
+        toolGroup.setToolPassive(this.activeTool)
+      })
+      this.activeTool = ''
+    },
+    addAnnotationListeners() {
+      const debouncedCallback = this.debounce((evt) => {
+        this.annotationModifiedListener(evt)
+      }, 100)
+      eventTarget.addEventListener(
+        toolsEvents.ANNOTATION_MODIFIED,
+        (evt) => {
+          debouncedCallback(evt)
+        }
+      )
+      eventTarget.addEventListener(
+        toolsEvents.ANNOTATION_COMPLETED,
+        this.annotationCompletedListener
+      )
+      eventTarget.addEventListener(
+        toolsEvents.ANNOTATION_REMOVED,
+        this.annotationRemovedListener
+      )
+    },
+    async annotationRemovedListener(e) {
+      if (this.readingTaskState === 2) return
+      const { annotation } = e.detail
+      if (!annotation) return
+      if (!annotation.annotationId) return
+      await deleteTrialFileType(annotation.annotationId)
+      const renderingEngine = getRenderingEngine(renderingEngineId)
+      const viewport = renderingEngine.getViewport(`canvas-${this.activeCanvasIndex}`)
+      viewport.render()
+      // 删除成功
+    },
+    async annotationModifiedListener(e) {
+      console.log('Modified')
+      if (this.readingTaskState === 2) return
+      const { annotation } = e.detail
+      if (!annotation) return
+      if (!annotation.annotationId) return
+      const i = this.viewportInfos.findIndex(i => i.index === this.activeCanvasIndex)
+      if (i === -1) return
+      if (this.viewportInfos[i].taskInfo.VisitTaskId !== this.taskInfo.VisitTaskId) return
+      const imageId = annotation.metadata.referencedImageId
+      const path = imageId.split(`web:${this.OSSclientConfig.basePath}`)[1]
+      const fileList = this.viewportInfos[i].fileList
+      const fileIndex = fileList.findIndex(f => f.Path === path)
+      if (fileIndex === -1) return
+      const params = {
+        id: annotation.annotationId,
+        visitTaskId: this.viewportInfos[i].taskInfo.VisitTaskId,
+        studyId: this.viewportInfos[i].studyId,
+        noneDicomFileId: fileList[fileIndex].Id,
+        path: fileList[fileIndex].Path,
+        measureData: JSON.stringify(annotation)
+      }
+      await addNoneDicomMark(params)
+      // 保存成功
+      this.$message.success(this.$t('common:message:savedSuccessfully'))
+    },
+    async annotationCompletedListener(e) {
+      console.log('Completed')
+      if (this.readingTaskState === 2) return
+      const { annotation } = e.detail
+      if (!annotation) return
+      const i = this.viewportInfos.findIndex(i => i.index === this.activeCanvasIndex)
+      if (i === -1) return
+      if (this.viewportInfos[i].taskInfo.VisitTaskId !== this.taskInfo.VisitTaskId) return
+      const imageId = annotation.metadata.referencedImageId
+      const path = imageId.split(`web:${this.OSSclientConfig.basePath}`)[1]
+      const fileList = this.viewportInfos[i].fileList
+      const fileIndex = fileList.findIndex(f => f.Path === path)
+      if (fileIndex === -1) return
+      const params = {
+        id: '',
+        visitTaskId: this.viewportInfos[i].taskInfo.VisitTaskId,
+        studyId: this.viewportInfos[i].studyId,
+        noneDicomFileId: fileList[fileIndex].Id,
+        path: fileList[fileIndex].Path,
+        measureData: JSON.stringify(annotation)
+      }
+      const res = await addNoneDicomMark(params)
+      annotation.annotationId = res.Result
+      // 保存成功
+      this.$message.success(this.$t('common:message:savedSuccessfully'))
+    },
+    debounce(callback, delay) {
+      let timerId
+      return function() {
+        clearTimeout(timerId)
+        timerId = setTimeout(() => {
+          callback.apply(this, arguments)
+        }, delay)
+      }
+    },
+    // 重置视图
+    resetViewport() {
+      this.setToolsPassive()
+      const renderingEngine = getRenderingEngine(renderingEngineId)
+      const viewportId = `canvas-${this.activeCanvasIndex}`
+      const viewport = (renderingEngine.getViewport(viewportId))
+      viewport.resetCamera({ resetPan: true, resetZoom: true, resetToCenter: true })
+      renderingEngine.render()
+    },
+    // 箭头工具输入标记名称自定义弹窗
+    async customPrompt() {
+      try {
+        const { value } = await this.$prompt('请输入标记名称')
+        return value
+      } catch {
+        return null
+      }
+    },
+    // 滚动条
+    clickSlider(e, index) {
+      const height = e.offsetY * 100 / this.$refs[`sliderBox-${index}`][0].clientHeight
+      const i = this.viewportInfos.findIndex(i => i.index === index)
+      if (i === -1) return
+      this.viewportInfos[i].height = height
+      let sliceIdx = Math.trunc(this.viewportInfos[i].imageIds.length * height / 100)
+      sliceIdx = sliceIdx >= this.viewportInfos[i].imageIds.length ? this.viewportInfos[i].imageIds.length - 1 : sliceIdx < 0 ? 0 : sliceIdx
+      const renderingEngine = getRenderingEngine(renderingEngineId)
+      const viewport = renderingEngine.getViewport(
+        this.viewportInfos[i].viewportId
+      )
+      viewport.setImageIdIndex(sliceIdx)
+      viewport.render()
+      // this.$emit('toggleImage', { taskId: this.viewportInfos[i].taskInfo.VisitTaskId, studyId: this.viewportInfos[i].studyId, imageIndex: sliceIdx })
+    },
+    sliderMouseup(e, index) {
+      const i = this.viewportInfos.findIndex(i => i.index === index)
+      if (i === -1 && this.viewportInfos[i].fileType !== 'image/jpeg') return
+      this.viewportInfos[i].isMove = false
+    },
+    sliderMousemove(e, index) {
+      const i = this.viewportInfos.findIndex(i => i.index === index)
+      if (i === -1 && this.viewportInfos[i].fileType !== 'image/jpeg') return
+      if (!this.viewportInfos[i].isMove) return
+      const delta = this.viewportInfos[i].oldB - (this.viewportInfos[i].oldM - e.clientY)
+      const boxHeight = this.$refs[`sliderBox-${index}`][0].clientHeight
+      if (delta < 0) return
+      if (delta > boxHeight) return
+      const height = delta * 100 / boxHeight
+      let sliceIdx = Math.trunc(this.viewportInfos[i].imageIds.length * height / 100)
+      sliceIdx = sliceIdx >= this.viewportInfos[i].imageIds.length ? this.viewportInfos[i].imageIds.length - 1 : sliceIdx < 0 ? 0 : sliceIdx
+      this.viewportInfos[i].height = height
+      if (this.viewportInfos[i].currentImageIdIndex !== i) {
+        const renderingEngine = getRenderingEngine(renderingEngineId)
+        const viewport = renderingEngine.getViewport(
+          this.viewportInfos[i].viewportId
+        )
+        viewport.setImageIdIndex(sliceIdx)
+        viewport.render()
+        // this.$emit('toggleImage', { taskId: this.viewportInfos[i].taskInfo.VisitTaskId, studyId: this.viewportInfos[i].studyId, imageIndex: sliceIdx })
+      }
+    },
+    sliderMousedown(e, index) {
+      const i = this.viewportInfos.findIndex(i => i.index === index)
+      if (i === -1) return
+      const boxHeight = this.$refs[`sliderBox-${index}`][0].clientHeight
+      this.viewportInfos[i].oldB = parseInt(e.srcElement.style.top) * boxHeight / 100
+      this.viewportInfos[i].oldM = e.clientY
+      this.viewportInfos[i].isMove = true
+      e.stopImmediatePropagation()
+      e.stopPropagation()
+      e.preventDefault()
+    },
+    handleIframeMessage(event) {
+      if (event.data.type === 'pdf-clicked') {
+        const baseUrl = event.data.data.baseUrl
+        const urlParams = new URL(baseUrl)
+        const index = parseInt(urlParams.search.split('=')[1])
+        this.activeCanvas(index)
+      }
+    },
+    preventDefault(e) {
+      e.stopImmediatePropagation()
+      e.stopPropagation()
+      e.preventDefault()
+    },
+    // 查看临床数据
+    viewCD(id) {
+      this.$emit('previewCD', id)
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+.none-dicom-viewer {
+  display: flex;
+  flex-direction: column;
+  width:100%;
+  height: 100%;
+  user-select: none;
+  .tools-wrapper {
+    height: 50px;
+    display: flex;
+    flex-direction: row;
+    justify-content: flex-start;
+    align-items: center;
+    border-bottom: 1px solid #727272;
+    color: #ddd;
+    .tool-item {
+      padding: 5px;
+      margin: 0 5px;
+      border: 1px solid #333;
+      font-size: 20px;
+      cursor: pointer;
+    }
+    .tool-item-active {
+      background-color: #607d8b;
+    }
+    .tool-disabled {
+      cursor: not-allowed;
+    }
+  }
+  .viewports-wrapper {
+    flex: 1;
+    .grid-container {
+      display: grid;
+      height: 100%;
+      width: 100%;
+      position: relative;
+    }
+
+    .grid-cell {
+      border: 1px dashed #ccc;;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+    }
+    .cell_active {
+      border-color: #fafa00!important;
+    }
+    .cell-full-screen {
+      grid-column: 1 / -1;
+      grid-row: 1 / -1;
+    }
+
+    .content {
+      width: 100%;
+      height: 100%;
+      position: relative;
+      .left-top-text {
+        position: absolute;
+        left: 5px;
+        top: 5px;
+        color: #ddd;
+        z-index: 1;
+        font-size: 12px;
+        .cd-info {
+          color: #ddd;
+          font-size: 18px;
+          cursor: pointer;
+        }
+        .subject-info {
+          color:#f44336;
+          padding: 5px 0px;
+          margin: 0;
+        }
+      }
+      .top-center-tool {
+        position: absolute;
+        left:50%;
+        top: 5px;
+        transform: translateX(-50%);
+        z-index: 1;
+        .toggle-visit-container {
+          display: flex;
+        }
+        .arrw_icon{
+          width: 20px;
+          height: 20px;
+          background-color: #3f3f3f;
+          text-align: center;
+          line-height: 20px;
+          border-radius: 10%;
+        }
+        .arrow_text{
+          height: 20px;
+          line-height: 20px;
+          background-color: #00000057;
+          color: #fff;
+          padding:0 10px;
+          font-size: 14px;
+        }
+      }
+      .right-slider-box {
+        position: absolute;
+        right: 1px;
+        height: calc(100% - 140px);
+        transform: translateY(-50%);
+        top: calc(50% - 30px);
+        width: 10px;
+        background: #333;
+        z-index: 1;
+        cursor: pointer;
+      }
+      .right-slider-box:after{
+        content: '';
+        position: absolute;
+        bottom: -20px;
+        left: 0;
+        height: 20px;
+        width: 100%;
+        background: #333;
+      }
+      .slider {
+        height: 20px;
+        width: 100%;
+        position: absolute;
+        top: 0;
+        z-index:10;
+        background: #9e9e9e;
+        cursor: move
+      }
+    }
+  }
+}
+</style>

src/views/trials/trials-panel/reading/visit-review/components/FormItem.vue

@@ -0,0 +1,588 @@
+<template>
+  <div>
+    <!-- <div
+      v-if="!!question.GroupName && (questionForm[question.ParentId] === question.ParentTriggerValue) || question.ParentId===''||question.ParentId===null"
+      style="font-weight: bold;font-size: 16px;margin: 5px 0px;"
+    >
+      {{ question.GroupName }}
+    </div> -->
+    <div
+      v-if="!!question.GroupName && question.Type==='group'"
+      style="font-weight: bold;font-size: 16px;margin: 5px 0px;"
+    >
+      {{ question.GroupName }}
+    </div>
+    <template v-else>
+      <el-form-item
+        v-if="(question.ShowQuestion===1 && questionForm[question.ParentId] === question.ParentTriggerValue) || question.ShowQuestion===0"
+        :label="`${question.QuestionName}`"
+        :prop="question.Id"
+        :rules="[
+          { required: (question.IsRequired === 0 || (question.IsRequired ===1 && question.RelevanceId && (question.RelevanceValueList.includes(isNaN(parseFloat(questionForm[question.RelevanceId])) ? questionForm[question.RelevanceId] : questionForm[question.RelevanceId].toString())))) && question.Type!=='group' && question.Type!=='summary',
+            message: $t('common:ruleMessage:specify'), trigger: ['blur', 'change']},
+        ]"
+        :class="[question.Type==='group'?'mb':question.Type==='upload'?'uploadWrapper':'']"
+      >
+
+        <!-- 输入框 -->
+        <el-input
+          v-if="question.Type==='input'"
+          v-model="questionForm[question.Id]"
+          :disabled="readingTaskState >= 2"
+        />
+        <!-- 多行文本输入框 -->
+        <el-input
+          v-if="question.Type==='textarea'"
+          v-model="questionForm[question.Id]"
+          type="textarea"
+          :autosize="{ minRows: 2, maxRows: 4}"
+          :disabled="readingTaskState >= 2"
+        />
+        <!-- 下拉框 -->
+        <!--        <el-select-->
+        <!--          v-if="question.Type==='select'"-->
+        <!--          v-model="questionForm[question.Id]"-->
+        <!--          :disabled="readingTaskState >= 2"-->
+        <!--          clearable-->
+        <!--          @change="((val)=>{formItemChange(val, question)})"-->
+        <!--        >-->
+        <!--          <el-option-->
+        <!--            v-for="val in question.TypeValue.split('|')"-->
+        <!--            :key="val"-->
+        <!--            :label="val"-->
+        <!--            :value="val"-->
+        <!--          />-->
+        <!--        </el-select>-->
+        <el-select
+          v-if="question.Type==='select'"
+          v-model="questionForm[question.Id]"
+          filterable
+          :placeholder="$t('common:placeholder:select')"
+          :disabled="readingTaskState >= 2"
+          @change="((val)=>{formItemChange(val, question)})"
+        >
+          <template v-if="question.DictionaryCode">
+            <el-option
+              v-for="item of $d[question.DictionaryCode]"
+              :key="item.id"
+              :value="item.value.toString()"
+              :label="item.label"
+            />
+          </template>
+          <template v-else-if="question.TypeValue">
+            <el-option
+              v-for="val in question.TypeValue.split('|')"
+              :key="val.trim()"
+              :label="val.trim()"
+              :value="val.trim()"
+            />
+          </template>
+        </el-select>
+        <!-- 单选 -->
+        <el-radio-group
+          v-if="question.Type==='radio'"
+          v-model="questionForm[question.Id]"
+          :disabled="readingTaskState >= 2"
+          @change="((val)=>{formItemChange(val, question)})"
+        >
+          <template v-if="question.DictionaryCode">
+            <el-radio
+              v-for="item of $d[question.DictionaryCode]"
+              :key="item.id"
+              :label="item.value.toString()"
+            >
+              {{ item.label }}
+            </el-radio>
+          </template>
+          <template v-else-if="question.TypeValue">
+            <el-radio
+              v-for="val in question.TypeValue.split('|')"
+              :key="val.trim()"
+              :label="val.trim()"
+            >
+              {{ val.trim() }}
+            </el-radio>
+          </template>
+        </el-radio-group>
+        <!-- 复选框 -->
+        <el-checkbox-group
+          v-if="question.Type==='checkbox'"
+          v-model="questionForm[question.Id]"
+          :disabled="readingTaskState >= 2"
+        >
+          <el-checkbox
+            v-for="val in question.TypeValue.split('|')"
+            :key="val.trim()"
+            :label="val.trim()"
+          >
+            {{ val.trim() }}
+          </el-checkbox>
+        </el-checkbox-group>
+        <!-- 数值 -->
+        <!-- :precision="2" :step="0.1" :max="10" -->
+        <template v-if="question.Type==='number'">
+          <!-- 数值 -->
+          <el-select
+            v-if="question.TypeValue"
+            v-model="questionForm[question.Id]"
+            clearable
+            @change="(val) => { formItemNumberChange(val, question) }"
+          >
+            <el-option
+              v-for="val in question.TypeValue.split('|')"
+              :key="val"
+              :label="val.trim()"
+              :value="val.trim()"
+            />
+          </el-select>
+          <el-input
+            v-if="question.DataSource !== 1"
+            v-model="questionForm[question.Id]"
+            type="number"
+            onblur="value=parseFloat(value).toFixed(parseInt(localStorage.getItem('digitPlaces')));"
+            @change="(val) => { formItemNumberChange(val, question) }"
+            @input="limitInput($event, questionForm, question.Id)"
+          >
+            <template v-if="question.Unit !== 0" slot="append">{{ question.Unit !== 4 ? $fd('ValueUnit', question.Unit) : question.CustomUnit }}</template>
+            <template v-else-if="question.ValueType === 2" slot="append">%</template>
+          </el-input>
+          <el-input
+            v-if="question.DataSource === 1"
+            v-model="questionForm[question.Id]"
+            type="number"
+            onblur="value=parseFloat(value).toFixed(parseInt(localStorage.getItem('digitPlaces')));"
+            :disabled="question.DataSource === 1"
+            @input="limitInput($event, questionForm, question.Id)"
+          >
+            <template v-if="question.Unit !== 0" slot="append">{{ question.Unit !== 4 ? $fd('ValueUnit', question.Unit) : question.CustomUnit }}</template>
+            <template v-else-if="question.ValueType === 2" slot="append">%</template>
+          </el-input>
+        </template>
+        <!-- 自动分类 -->
+        <el-input
+          v-if="question.Type === 'class' && question.ClassifyShowType === 1"
+          v-model="questionForm[question.Id]"
+          :disabled="!question.ClassifyEditType"
+        />
+        <el-select
+          v-if="question.Type === 'class' && question.ClassifyShowType === 2"
+          v-model="questionForm[question.Id]"
+          :disabled="!question.ClassifyEditType"
+          @change="(val) => { formItemChange(val, question) }"
+        >
+          <el-option
+            v-for="val in question.TypeValue.split('|')"
+            :key="val"
+            :label="val.trim()"
+            :value="val.trim()"
+          />
+        </el-select>
+        <el-radio-group
+          v-if="question.Type === 'class' && question.ClassifyShowType === 3"
+          v-model="questionForm[question.Id]"
+          :disabled="!question.ClassifyEditType"
+          @change="(val) => { formItemChange(val, question) }"
+        >
+          <el-radio
+            v-for="item of question.TypeValue.split('|')"
+            :key="item.trim()"
+            :label="item.trim()"
+          >
+            {{ item.trim() }}
+          </el-radio>
+        </el-radio-group>
+        <el-input
+          v-if="question.Type === 'class' && question.ClassifyShowType === 4"
+          v-model="questionForm[question.Id]"
+          type="number"
+          :disabled="!question.ClassifyEditType"
+          @change="(val) => { formItemNumberChange(val, question) }"
+        />
+        <!-- 上传图像 -->
+        <el-upload
+          v-if="question.Type==='upload'"
+          action
+          :accept="accept"
+          :limit="question.ImageCount"
+          :on-preview="handlePictureCardPreview"
+          :before-upload="handleBeforeUpload"
+          :http-request="uploadScreenshot"
+          list-type="picture-card"
+          :on-remove="handleRemove"
+          :file-list="fileList"
+          :class="{disabled:fileList.length >= question.ImageCount}"
+          :disabled="readingTaskState >= 2"
+        >
+          <i slot="default" class="el-icon-plus" />
+          <div slot="file" slot-scope="{file}">
+            <img
+              class="el-upload-list__item-thumbnail"
+              :src="OSSclientConfig.basePath + file.url"
+              alt=""
+            >
+            <span class="el-upload-list__item-actions">
+              <span
+                class="el-upload-list__item-preview"
+                @click="handlePictureCardPreview(file)"
+              >
+                <i class="el-icon-zoom-in" />
+              </span>
+
+              <span
+                v-if="readingTaskState < 2"
+                class="el-upload-list__item-delete"
+                @click="handleRemove(file)"
+              >
+                <i class="el-icon-delete" />
+              </span>
+            </span>
+          </div>
+        </el-upload>
+        <el-dialog
+          append-to-body
+          :visible.sync="imgVisible"
+          width="600px"
+        >
+          <el-image :src="OSSclientConfig.basePath + imageUrl" width="100%">
+            <div slot="placeholder" class="image-slot">
+              {{ $t('trials:readingUnit:qsList:message:loading') }}<span class="dot">...</span>
+            </div>
+          </el-image>
+        </el-dialog>
+      </el-form-item>
+    </template>
+
+    <FormItem
+      v-for="(item) in question.Childrens"
+      :key="item.Id"
+      :question="item"
+      :reading-task-state="readingTaskState"
+      :question-form="questionForm"
+      :visit-task-id="visitTaskId"
+      :calculation-list="calculationList"
+      @setFormItemData="setFormItemData"
+      @resetFormItemData="resetFormItemData"
+      @formItemNumberChange="formItemNumberChange"
+    />
+  </div>
+</template>
+<script>
+// import { uploadReadingAnswerImage } from '@/api/trials'
+export default {
+  name: 'FormItem',
+  props: {
+    questionForm: {
+      type: Object,
+      default() {
+        return {}
+      }
+    },
+    question: {
+      type: Object,
+      default() {
+        return {}
+      }
+    },
+    readingTaskState: {
+      type: Number,
+      required: true
+    },
+    visitTaskId: {
+      type: String,
+      default: ''
+    },
+    calculationList: {
+      type: Array,
+      default() {
+        return []
+      }
+    }
+  },
+  data() {
+    return {
+      fileList: [],
+      accept: '.png,.jpg,.jpeg',
+      imgVisible: false,
+      imageUrl: '',
+      urls: [],
+      digitPlaces: null
+    }
+  },
+  watch: {
+    questionForm: {
+      deep: true,
+      immediate: true,
+      handler(v, oldv) {
+        try {
+          if (!v || !v[this.question.Id] || !oldv || !oldv[this.question.Id]) { return }
+        } catch (e) {
+          console.log(e, v)
+        }
+        if (this.question.Type === 'class') {
+          this.$emit('setFormItemData', { key: this.question.Id, val: v[this.question.Id], question: v })
+        }
+        this.formItemNumberChange(this.question.Id, false)
+      }
+    }
+  },
+  mounted() {
+    if (this.question.Type === 'upload') {
+      if (this.questionForm[this.question.Id]) {
+        this.urls = this.questionForm[this.question.Id].split('|')
+        this.fileList = []
+
+        this.urls.map(url => {
+          this.fileList.push({ name: '', url: `${url}` })
+        })
+      }
+    }
+    this.digitPlaces = localStorage.getItem('digitPlaces') ? parseInt(localStorage.getItem('digitPlaces')) : 0
+  },
+  methods: {
+    limitInput(value, a, b) {
+      if (value.indexOf('.') > -1) {
+        if (value.split('.')[1].length >= this.digitPlaces) {
+          this.$set(a, b, parseFloat(value).toFixed(this.digitPlaces))
+        }
+      }
+    },
+    logic(rules, num = 0) {
+      try {
+        if (rules.CalculateQuestionList.length === 0) {
+          return false
+        }
+        const dataArr = []
+        rules.CalculateQuestionList.forEach((o, i) => {
+          if (i === 0) {
+            if (rules.CustomCalculateMark > 4 && rules.CustomCalculateMark < 10) {
+              switch (rules.CustomCalculateMark) {
+                case 5:
+                  this.questionForm[o.QuestionId].forEach((q, qi) => {
+                    if (qi === 0) {
+                      num = parseFloat(q[o.TableQuestionId])
+                    } else {
+                      num *= parseFloat(q[o.TableQuestionId])
+                    }
+                  })
+                  break
+                case 6:
+                  this.questionForm[o.QuestionId].forEach((q, qi) => {
+                    if (qi === 0) {
+                      num = parseFloat(q[o.TableQuestionId])
+                    } else {
+                      num += parseFloat(q[o.TableQuestionId])
+                    }
+                  })
+                  break
+                case 7:
+                  this.questionForm[o.QuestionId].forEach((q, qi) => {
+                    if (qi === 0) {
+                      num = parseFloat(q[o.TableQuestionId])
+                    } else {
+                      num += parseFloat(q[o.TableQuestionId])
+                    }
+                  })
+                  num = this.questionForm[o.QuestionId].length === 0 ? 0 : num / this.questionForm[o.QuestionId].length
+                  break
+                case 8:
+                  const arr = []
+                  this.questionForm[o.QuestionId].forEach(q => {
+                    arr.push(q[o.TableQuestionId])
+                  })
+                  num = arr.length === 0 ? 0 : Math.max(...arr)
+                  break
+                case 9:
+                  const arr1 = []
+                  this.questionForm[o.QuestionId].forEach(q => {
+                    arr1.push(q[o.TableQuestionId])
+                  })
+                  num = arr1.length === 0 ? 0 : Math.min(...arr1)
+                  break
+              }
+            } else {
+              num = parseFloat(this.questionForm[o.TableQuestionId])
+              if (!isNaN(num)) {
+                dataArr.push(num)
+              }
+            }
+          } else {
+            switch (rules.CustomCalculateMark) {
+              case 1:
+                num += parseFloat(this.questionForm[o.TableQuestionId])
+                break
+              case 2:
+                num -= parseFloat(this.questionForm[o.TableQuestionId])
+                break
+              case 3:
+                num *= parseFloat(this.questionForm[o.TableQuestionId])
+                break
+              case 4:
+                if (parseFloat(this.questionForm[o.TableQuestionId]) === 0) {
+                  num = 0
+                } else {
+                  num /= parseFloat(this.questionForm[o.TableQuestionId])
+                }
+                break
+              case 10:
+                if (!isNaN(parseFloat(this.questionForm[o.TableQuestionId]))) {
+                  dataArr.push(parseFloat(this.questionForm[o.TableQuestionId]))
+                }
+                num = dataArr.length === 0 ? 0 : dataArr.reduce((acc, curr) => {
+                  return acc + (typeof curr === 'number' ? curr : 0)
+                }, 0) / dataArr.length
+                break
+              case 11:
+                if (!isNaN(parseFloat(this.questionForm[o.TableQuestionId]))) {
+                  dataArr.push(parseFloat(this.questionForm[o.TableQuestionId]))
+                }
+                num = Math.max(...dataArr)
+                break
+              case 12:
+                if (!isNaN(parseFloat(this.questionForm[o.TableQuestionId]))) {
+                  dataArr.push(parseFloat(this.questionForm[o.TableQuestionId]))
+                }
+                num = Math.min(...dataArr)
+                break
+              case 13:
+                if (!isNaN(parseFloat(this.questionForm[o.TableQuestionId]))) {
+                  dataArr.push(parseFloat(this.questionForm[o.TableQuestionId]))
+                }
+                num = dataArr.length === 0 ? 0 : dataArr.reduce((acc, curr) => acc && curr) ? 1 : 0
+                break
+              case 14:
+                if (!isNaN(parseFloat(this.questionForm[o.TableQuestionId]))) {
+                  dataArr.push(parseFloat(this.questionForm[o.TableQuestionId]))
+                }
+                num = dataArr.length === 0 ? 0 : dataArr.reduce((acc, curr) => acc || curr, 0) ? 1 : 0
+                break
+            }
+          }
+        })
+      } catch (e) {
+        console.log(e)
+      }
+      var digitPlaces = parseInt(localStorage.getItem('digitPlaces'))
+      if (rules.ValueType === 2) {
+        num = num * 100
+      }
+      if (rules.CustomCalculateMark === 13 || rules.CustomCalculateMark === 14) {
+        return num
+      } else {
+        return num.toFixed(digitPlaces)
+      }
+    },
+    formItemNumberChange(questionId, isTable) {
+      if (isTable) {
+        this.calculationList.forEach((v, i) => {
+          var find = v.CalculateQuestionList.filter(o => {
+            return o.QuestionId === questionId
+          })
+          // find的自动计算值number
+          if (find) {
+            var num = this.logic(v)
+            if (num !== false) {
+              this.$emit('setFormItemData', { key: v.QuestionId, val: num, question: v })
+            }
+          }
+        })
+      } else {
+        this.calculationList.forEach(v => {
+          var find = v.CalculateQuestionList.filter(o => {
+            return o.TableQuestionId === questionId
+          })
+          // find的自动计算值number
+          if (find) {
+            var num = this.logic(v)
+            if (num !== false) {
+              this.$emit('setFormItemData', { key: v.QuestionId, val: num, question: v })
+            }
+          }
+        })
+      }
+    },
+    formItemChange(v, question) {
+      if (question.Childrens.length > 0) {
+        this.resetChild(question.Childrens)
+      } else {
+        this.$emit('setFormItemData', { key: question.Id, val: v, question: question })
+      }
+    },
+    resetChild(obj) {
+      obj.forEach(i => {
+        this.$emit('resetFormItemData', i.Id)
+        if (i.Childrens && i.Childrens.length > 0) {
+          this.resetChild(i.Childrens)
+        }
+      })
+    },
+    resetFormItemData(v) {
+      this.$emit('resetFormItemData', v)
+    },
+    setFormItemData(obj) {
+      this.$emit('setFormItemData', obj)
+    },
+    async uploadScreenshot(param) {
+      if (!this.visitTaskId) return
+      const loading = this.$loading({
+        target: document.querySelector('.ecrf-wrapper'),
+        fullscreen: false,
+        lock: true,
+        text: 'Loading',
+        spinner: 'el-icon-loading'
+      })
+      var file = await this.fileToBlob(param.file)
+      const res = await this.OSSclient.put(`/${this.trialId}/ReadAttachment/${this.subjectId}/${this.visitTaskId}/${param.file.name}`, file)
+      this.fileList.push({ name: param.file.name, url: this.$getObjectName(res.url) })
+      this.urls.push(this.$getObjectName(res.url))
+      this.$emit('setFormItemData', { key: this.question.Id, val: this.urls.length > 0 ? this.urls.join('|') : '' })
+      loading.close()
+    },
+    handleBeforeUpload(file) {
+      // 检测文件类型是否符合要求
+      if (this.checkFileSuffix(file.name)) {
+        // this.fileList = []
+        return true
+      } else {
+        this.$alert(`必须是 ${this.accept} 格式`)
+        return false
+      }
+    },
+    checkFileSuffix(fileName) {
+      var index = fileName.lastIndexOf('.')
+      var suffix = fileName.substring(index + 1, fileName.length)
+      if (this.accept.toLocaleLowerCase().search(suffix.toLocaleLowerCase()) === -1) {
+        return false
+      } else {
+        return true
+      }
+    },
+    // 预览图片
+    handlePictureCardPreview(file) {
+      this.imageUrl = this.OSSclientConfig.basePath + file.url
+      this.imgVisible = true
+    },
+    // 删除图片
+    handleRemove(file, fileList) {
+      this.imageUrl = ''
+      this.fileList.splice(this.fileList.findIndex(f => f.url === file.url), 1)
+      this.urls.splice(this.fileList.findIndex(f => f === file.url), 1)
+      this.$emit('setFormItemData', { key: this.question.Id, val: this.urls.length > 0 ? this.urls.join('|') : '' })
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+.mb{
+  margin-bottom: 0px;
+}
+.disabled{
+  ::v-deep .el-upload--picture-card {
+    display: none;
+  }
+}
+.uploadWrapper{
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+}
+</style>

src/views/trials/trials-panel/reading/visit-review/components/ImageViewer.vue

@@ -0,0 +1,861 @@
+<template>
+  <div class="none-dicom-viewer">
+    <!-- tools -->
+    <div class="tools-wrapper">
+      <!-- 布局 -->
+      <div class="tool-item" :title="$t('trials:reading:button:layout')">
+        <el-dropdown @command="handleCommand">
+          <span class="el-dropdown-link">
+            <svg-icon icon-class="layout" class="svg-icon" /><i class="el-icon-arrow-down el-icon--right" />
+          </span>
+          <el-dropdown-menu slot="dropdown">
+            <el-dropdown-item command="1*1">1*1</el-dropdown-item>
+            <el-dropdown-item command="1*2">1*2</el-dropdown-item>
+            <el-dropdown-item command="2*2">2*2</el-dropdown-item>
+          </el-dropdown-menu>
+        </el-dropdown>
+      </div>
+      <!-- 缩放 -->
+      <div
+        :class="['tool-item', activeTool === 'Zoom' ? 'tool-item-active' : '']"
+        :title="$t('trials:reading:button:zoom')"
+        @click.prevent="setToolActive('Zoom')"
+      >
+        <svg-icon icon-class="magnifier" class="svg-icon" />
+      </div>
+      <!-- 移动 -->
+      <div
+        :class="['tool-item', activeTool === 'Pan' ? 'tool-item-active' : '']"
+        :title="$t('trials:reading:button:move')"
+        @click.prevent="setToolActive('Pan')"
+      >
+        <svg-icon icon-class="move" class="svg-icon" />
+      </div>
+      <!-- 旋转 -->
+      <div
+        :class="['tool-item', activeTool === 'PlanarRotate' ? 'tool-item-active' : '']"
+        :title="$t('trials:reading:button:rotate')"
+        @click.prevent="setToolActive('PlanarRotate')"
+      >
+        <svg-icon icon-class="rotate" class="svg-icon" />
+      </div>
+      <!-- 箭头工具 -->
+      <div
+        :class="['tool-item', readingTaskState === 2 ? 'tool-disabled' : '', activeTool === 'ArrowAnnotate' ? 'tool-item-active' : '']"
+        :title="$t('trials:reading:button:arrowAnnotate')"
+        @click.prevent="setAnnotateToolActive('ArrowAnnotate')"
+      >
+        <svg-icon icon-class="arrow" class="svg-icon" />
+      </div>
+      <!-- 清除标注 -->
+      <div
+        :class="['tool-item', readingTaskState === 2 ? 'tool-disabled' : '', activeTool === 'Eraser' ? 'tool-item-active' : '']"
+        :title="$t('trials:dicom-show:Eraser')"
+        @click.prevent="setAnnotateToolActive('Eraser')"
+      >
+        <svg-icon icon-class="clear" class="svg-icon" />
+      </div>
+      <!-- 截图 -->
+      <!-- <div
+        class="tool-item"
+        :title="$t('trials:reading:button:screenShot')"
+        @click.prevent="saveImage"
+      >
+        <svg-icon icon-class="image" class="svg-icon" />
+      </div> -->
+      <!-- 重置 -->
+      <div
+        class="tool-item"
+        :title="$t('trials:reading:button:reset')"
+        @click.prevent="resetViewport"
+      >
+        <svg-icon icon-class="refresh" class="svg-icon" />
+      </div>
+    </div>
+    <!-- viewports -->
+    <div class="viewports-wrapper">
+      <div class="grid-container" :style="gridStyle">
+        <div
+          v-for="(v, index) in viewportInfos"
+          v-show="index < cells.length"
+          :key="index"
+          :style="cellStyle"
+          :class="['grid-cell', index === activeCanvasIndex ? 'cell_active' : '', index === fullScreenIndex ? 'cell-full-screen' : '']"
+          @dblclick="toggleFullScreen($event, index)"
+          @click="activeCanvas(index)"
+          @mouseup="sliderMouseup($event, index)"
+          @mousemove="sliderMousemove($event, index)"
+        >
+          <div :ref="`canvas-${index}`" class="content">
+            <div class="left-top-text">
+              <div
+                v-if="v.taskInfo.IsExistsClinicalData"
+                class="cd-info"
+                :title="$t('trials:reading:button:clinicalData')"
+                @click.stop="viewCD($event)"
+              >
+                <svg-icon icon-class="documentation" class="svg-icon" />
+              </div>
+              <h2
+                v-if="taskInfo && taskInfo.IsReadingShowSubjectInfo && v.taskInfo"
+                class="subject-info"
+              >
+                {{ `${taskInfo.SubjectCode} ${v.taskInfo.TaskBlindName} ` }}
+              </h2>
+              <div v-if="v.currentFileName">{{ v.currentFileName }}</div>
+            </div>
+            <div
+              v-if="taskInfo && taskInfo.IsReadingTaskViewInOrder === 1 && v.taskInfo"
+              class="top-center-tool"
+            >
+              <div class="toggle-visit-container">
+                <div
+                  class="arrw_icon"
+                  :style="{ cursor: v.taskInfo.VisitTaskNum !== 0 ? 'pointer' : 'not-allowed', color: v.taskInfo.VisitTaskNum !== 0 ? '#fff': '#6b6b6b' }"
+                  @click.stop.prevent="toggleTask($event, v.taskInfo.VisitTaskNum, -1)"
+                  @dblclick.stop="preventDefault($event)"
+                >
+                  <i class="el-icon-caret-left" />
+                </div>
+                <div class="arrow_text">
+                  {{ v.taskInfo.TaskBlindName }}
+                </div>
+                <div
+                  class="arrw_icon"
+                  :style="{ cursor: v.taskInfo.VisitTaskNum < taskInfo.VisitNum ? 'pointer' : 'not-allowed', color: v.taskInfo.VisitTaskNum < taskInfo.VisitNum ? '#fff': '#6b6b6b' }"
+                  @click.stop.prevent="toggleTask($event, v.taskInfo.VisitTaskNum, 1)"
+                  @dblclick.stop="preventDefault($event)"
+                >
+                  <i class="el-icon-caret-right" />
+                </div>
+              </div>
+            </div>
+            <div :ref="`sliderBox-${index}`" class="right-slider-box" @click.stop="clickSlider($event, index)">
+              <div :style="{top: v.height + '%'}" class="slider" @click.stop.prevent="() => {return}" @mousedown.stop="sliderMousedown($event, index)" />
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+import { addNoneDicomMark, deleteTrialFileType } from '@/api/trials'
+import {
+  RenderingEngine,
+  Enums,
+  imageLoader,
+  metaData,
+  getRenderingEngine,
+  eventTarget
+} from '@cornerstonejs/core'
+import * as cornerstoneTools from '@cornerstonejs/tools'
+import initLibraries from '@/views/trials/trials-panel/reading/dicoms/components/Fusion/js/initLibraries'
+import hardcodedMetaDataProvider from './../js/hardcodedMetaDataProvider'
+import registerWebImageLoader from './../js/registerWebImageLoader'
+import { mapGetters } from 'vuex'
+import store from '@/store'
+const { ViewportType } = Enums
+const renderingEngineId = 'myRenderingEngine'
+const {
+  ToolGroupManager,
+  Enums: csToolsEnums,
+  StackScrollTool,
+  PanTool,
+  ZoomTool,
+  PlanarRotateTool,
+  ArrowAnnotateTool,
+  EraserTool
+} = cornerstoneTools
+const { MouseBindings, Events: toolsEvents } = csToolsEnums
+export default {
+  name: 'ImageViewer',
+  props: {
+    relatedStudyInfo: {
+      type: Object,
+      default() {
+        return {}
+      }
+    }
+  },
+  data() {
+    return {
+      rows: 1,
+      cols: 1,
+      fullScreenIndex: null,
+      imageIds: [],
+      activeCanvasIndex: 0,
+      layout: '1*2',
+      cellsMax: 4,
+      viewportInfos: [],
+      taskInfo: null,
+      activeTool: '',
+      readingTaskState: 2,
+      renderHistoryAnnotationTaskIds: []
+    }
+  },
+  computed: {
+    gridStyle() {
+      return {
+        display: 'grid',
+        gridTemplateRows: `repeat(${this.rows}, 1fr)`,
+        gridTemplateColumns: `repeat(${this.cols}, 1fr)`,
+        height: '100%',
+        width: '100%'
+      }
+    },
+    cellStyle() {
+      return {
+        border: '1px dashed #ccc',
+        display: 'flex',
+        alignItems: 'center',
+        justifyContent: 'center'
+      }
+    },
+    cells() {
+      return Array(this.rows * this.cols).fill(0)
+    },
+    ...mapGetters(['lastViewportTaskId'])
+  },
+  watch: {
+    relatedStudyInfo: {
+      immediate: true,
+      handler(obj) {
+        if (!obj || Object.keys(obj).length === 0) return
+        this.updateViewportInfos(0, obj)
+      }
+    }
+  },
+  mounted() {
+    this.taskInfo = JSON.parse(localStorage.getItem('taskInfo'))
+    this.readingTaskState = this.taskInfo.ReadingTaskState
+    if (this.taskInfo.VisitNum > 0 && this.taskInfo.IsReadingTaskViewInOrder !== 0) {
+      this.rows = 1
+      this.cols = 2
+      this.activeCanvasIndex = 1
+    }
+    this.viewportInfos = Array.from({ length: this.cellsMax }, (_, index) => ({
+      index: index,
+      taskInfo: '',
+      studyId: '',
+      currentImageIdIndex: 0,
+      viewportId: `canvas-${index}`,
+      currentFileName: '',
+      imageIds: [],
+      oldB: null,
+      oldM: null,
+      isMove: false,
+      height: 0
+    }))
+    this.initLoader()
+    console.log(cornerstoneTools)
+  },
+  methods: {
+    // 初始化加载器
+    async initLoader() {
+      registerWebImageLoader(imageLoader)
+      await initLibraries()
+
+      let renderingEngine = getRenderingEngine(renderingEngineId)
+      if (!renderingEngine) {
+        renderingEngine = new RenderingEngine(renderingEngineId)
+      }
+      const resizeObserver = new ResizeObserver(() => {
+        const renderingEngine = getRenderingEngine(renderingEngineId)
+        if (renderingEngine) {
+          renderingEngine.resize(true, false)
+        }
+      })
+      const element1 = this.$refs['canvas-0'][0]
+      const element2 = this.$refs['canvas-1'][0]
+      const element3 = this.$refs['canvas-2'][0]
+      const element4 = this.$refs['canvas-3'][0]
+      const elements = [
+        element1,
+        element2,
+        element3,
+        element4
+      ]
+      elements.forEach((element, i) => {
+        element.oncontextmenu = (e) => e.preventDefault()
+        resizeObserver.observe(element)
+        element.addEventListener('CORNERSTONE_STACK_NEW_IMAGE', this.stackNewImage)
+      })
+      const viewportInputArray = [
+        {
+          viewportId: 'canvas-0',
+          type: ViewportType.STACK,
+          element: element1
+        },
+        {
+          viewportId: 'canvas-1',
+          type: ViewportType.STACK,
+          element: element2
+        },
+        {
+          viewportId: 'canvas-2',
+          type: ViewportType.STACK,
+          element: element3
+        },
+        {
+          viewportId: 'canvas-3',
+          type: ViewportType.STACK,
+          element: element4
+        }
+      ]
+      const viewportIds = ['canvas-0', 'canvas-1', 'canvas-2', 'canvas-3']
+      renderingEngine.setViewports(viewportInputArray)
+      this.addAnnotationListeners()
+      cornerstoneTools.addTool(StackScrollTool)
+      cornerstoneTools.addTool(PanTool)
+      cornerstoneTools.addTool(ZoomTool)
+      cornerstoneTools.addTool(PlanarRotateTool)
+      cornerstoneTools.addTool(ArrowAnnotateTool)
+
+      cornerstoneTools.addTool(EraserTool)
+
+      viewportIds.forEach((viewportId, i) => {
+        const toolGroupId = `canvas-${i}`
+        const toolGroup = ToolGroupManager.createToolGroup(toolGroupId)
+        toolGroup.addViewport(viewportId, renderingEngineId)
+        toolGroup.addTool(StackScrollTool.toolName)
+        toolGroup.addTool(PanTool.toolName)
+        toolGroup.addTool(ZoomTool.toolName)
+        toolGroup.addTool(PlanarRotateTool.toolName)
+        toolGroup.addTool(ArrowAnnotateTool.toolName, {
+          arrowHeadStyle: 'standard',
+          changeTextCallback: async(data, eventData, doneChangingTextCallback) => {
+            return doneChangingTextCallback(await this.customPrompt())
+          },
+          getTextCallback: async(doneChangingTextCallback) => {
+            return doneChangingTextCallback(await this.customPrompt())
+          }
+        })
+        toolGroup.addTool(EraserTool.toolName)
+        toolGroup.setToolActive(StackScrollTool.toolName, {
+          bindings: [{ mouseButton: MouseBindings.Wheel }]
+        })
+        toolGroup.setToolPassive(PanTool.toolName)
+        toolGroup.setToolPassive(ZoomTool.toolName)
+        toolGroup.setToolPassive(PlanarRotateTool.toolName)
+        if (this.readingTaskState < 2) {
+          toolGroup.setToolPassive(ArrowAnnotateTool.toolName)
+        } else {
+          toolGroup.setToolEnabled(ArrowAnnotateTool.toolName)
+        }
+        toolGroup.setToolPassive(EraserTool.toolName)
+      })
+    },
+
+    // 加载图片回调
+    stackNewImage(e) {
+      const { detail } = e
+      const i = this.viewportInfos.findIndex(i => i.viewportId === detail.viewportId)
+      if (i === -1) return
+      this.viewportInfos[i].currentImageIdIndex = detail.imageIdIndex
+      const obj = this.viewportInfos[i].fileList[detail.imageIdIndex]
+      if (!obj) return
+      this.viewportInfos[i].currentFileName = obj.FileName
+      this.viewportInfos[i].height = (this.viewportInfos[i].currentImageIdIndex) * 100 / (this.viewportInfos[i].imageIds.length - 1)
+      this.$emit('toggleImage', { taskId: this.viewportInfos[i].taskInfo.VisitTaskId, studyId: this.viewportInfos[i].studyId, imageIndex: detail.imageIdIndex })
+      this.renderHistoryAnnotations(this.viewportInfos[i].taskInfo)
+    },
+    renderHistoryAnnotations(obj) {
+      if (this.renderHistoryAnnotationTaskIds.includes(obj.VisitTaskId)) return
+      this.renderHistoryAnnotationTaskIds.push(obj.VisitTaskId)
+      const arr = []
+      obj.Annotations.map(i => {
+        if (typeof i.MeasureData === 'string') {
+          const annotation = JSON.parse(i.MeasureData)
+          annotation.annotationId = i.Id
+          arr.push(annotation)
+          cornerstoneTools.annotation.state.addAnnotation(annotation)
+          if (obj.ReadingTaskState === 2) {
+            cornerstoneTools.annotation.locking.setAnnotationLocked(annotation.annotationUID)
+          }
+        }
+      })
+    },
+    // 渲染图片
+    async renderImage(imageIds, canvasIndex, sliceIndex) {
+      metaData.addProvider((type, imageId) => hardcodedMetaDataProvider(type, imageId, imageIds), 10000)
+      const renderingEngine = getRenderingEngine(renderingEngineId)
+      const viewport = renderingEngine.getViewport(`canvas-${canvasIndex}`)
+      await viewport.setStack(imageIds)
+      viewport.setImageIdIndex(sliceIndex)
+      viewport.render()
+      // this.updateViewportInfos()
+    },
+    setActiveCanvasImages(obj) {
+      if (!obj || Object.keys(obj).length === 0) return
+      const i = this.viewportInfos.findIndex(i => i.index === this.activeCanvasIndex)
+      if (i === -1) return
+      if (obj.studyId === this.viewportInfos[i].studyId) {
+        this.sliceIndex(obj.fileIndex)
+      } else {
+        this.updateViewportInfos(this.activeCanvasIndex, obj)
+      }
+      if (this.activeCanvasIndex === this.cells.length - 1) {
+        store.dispatch('noneDicomReview/setLastViewportTaskId', obj.visitTaskInfo.VisitTaskId)
+      }
+    },
+    // 激活视图
+    activeCanvas(index) {
+      if (this.activeCanvasIndex === index) return
+      const i = this.viewportInfos.findIndex(i => i.index === index)
+      if (i === -1) return
+      this.activeCanvasIndex = index
+      if (index === this.cells.length - 1) {
+        store.dispatch('noneDicomReview/setLastViewportTaskId', this.viewportInfos[i].taskInfo.VisitTaskId)
+      }
+      this.$emit('toggleTask', this.viewportInfos[i].taskInfo)
+      this.setToolsPassive()
+    },
+    // 更新视图信息
+    updateViewportInfos(index, obj) {
+      const i = this.viewportInfos.findIndex(i => i.index === index)
+      if (i === -1) return
+      this.viewportInfos[i].taskInfo = obj.visitTaskInfo
+      this.viewportInfos[i].currentImageIdIndex = obj.fileIndex
+      this.viewportInfos[i].currentFileName = obj.fileInfo.FileName
+      this.viewportInfos[i].fileList = obj.fileList
+      this.viewportInfos[i].studyId = obj.studyId
+      const imageIds = []
+      for (let i = 0; i < obj.fileList.length; i++) {
+        const path = obj.fileList[i].Path
+        imageIds.push(`web:${this.OSSclientConfig.basePath}${path}`)
+      }
+      this.viewportInfos[i].imageIds = imageIds
+      if (imageIds.length > 0) {
+        this.renderImage(imageIds, index, obj.fileIndex)
+      }
+    },
+    // 切换图片
+    sliceIndex(index) {
+      const i = this.viewportInfos.findIndex(i => i.index === this.activeCanvasIndex)
+      if (i === -1) return
+      if (index < 0 || index >= this.viewportInfos[i].imageIds.length) return
+      const renderingEngine = getRenderingEngine(renderingEngineId)
+      const viewport = renderingEngine.getViewport(
+        this.viewportInfos[i].viewportId
+      )
+      viewport.setImageIdIndex(index)
+      viewport.render()
+    },
+    // 更改视图布局
+    handleCommand(command) {
+      this.fullScreenIndex = null
+      this.layout = command
+      this.rows = parseInt(command.split('*')[0])
+      this.cols = parseInt(command.split('*')[1])
+      // 有序阅片 1*1 显示当前图片 1*2  显示基线*当前图片  2*2 显示当前图片
+      // const obj = this.viewportInfos.find(i => i.index === this.activeCanvasIndex)
+      // if (obj && this.rows === 1 && this.cols === 1) {
+      //   this.viewportInfos = this.viewportInfos.map((v, i) => {
+      //     if (i === 0) {
+      //       v.taskInfo = obj.taskInfo
+      //       v.currentImageIdIndex === obj.currentImageIdIndex
+      //       v.currentFileName === obj.currentFileName
+      //       v.imageIds === obj.imageIds
+      //     } else {
+      //       v.taskInfo = ''
+      //       v.currentImageIdIndex === 0
+      //       v.currentFileName === ''
+      //       v.imageIds === []
+      //     }
+      //     return v
+      //   })
+      //   this.activeCanvasIndex = 0
+      // } else if (obj && this.rows === 1 && this.cols === 2 && this.taskInfo.IsReadingTaskViewInOrder === 1) {
+      //   this.viewportInfos = this.viewportInfos.map((v, i) => {
+      //     if (i === 0) {
+      //       v.taskInfo = this.relatedStudyInfo.visitTaskInfo
+      //       v.currentImageIdIndex === this.relatedStudyInfo.fileIndex
+      //       v.currentFileName === this.relatedStudyInfo.fileInfo.FileName
+      //       const imageIds = []
+      //       for (let i = 0; i < this.relatedStudyInfo.fileList.length; i++) {
+      //         const path = this.relatedStudyInfo.fileList[i].Path
+      //         imageIds.push(`web:${this.OSSclientConfig.basePath}${path}`)
+      //       }
+      //       v.imageIds === imageIds
+      //     } else if (i === 1) {
+      //       v.taskInfo = obj.taskInfo
+      //       v.currentImageIdIndex === obj.currentImageIdIndex
+      //       v.currentFileName === obj.currentFileName
+      //       v.imageIds === obj.imageIds
+      //     } else {
+      //       v.taskInfo = ''
+      //       v.currentImageIdIndex === 0
+      //       v.currentFileName === ''
+      //       v.imageIds === []
+      //     }
+      //     return v
+      //   })
+      //   this.activeCanvasIndex = 1
+      // } else if (obj && this.rows === 1 && this.cols === 2 && this.taskInfo.IsReadingTaskViewInOrder !== 1) {
+      //   this.viewportInfos = this.viewportInfos.map((v, i) => {
+      //     if (i === 0 || i === 1) {
+      //       v.taskInfo = obj.taskInfo
+      //       v.currentImageIdIndex === obj.currentImageIdIndex
+      //       v.currentFileName === obj.currentFileName
+      //       v.imageIds === obj.imageIds
+      //     } else {
+      //       v.taskInfo = ''
+      //       v.currentImageIdIndex === 0
+      //       v.currentFileName === ''
+      //       v.imageIds === []
+      //     }
+      //     return v
+      //   })
+      //   this.activeCanvasIndex = 1
+      // } else if (obj && (this.rows === 2 && this.cols === 2)) {
+      //   this.viewportInfos = this.viewportInfos.map(v => {
+      //     v.taskInfo = obj.taskInfo
+      //     v.currentImageIdIndex === obj.currentImageIdIndex
+      //     v.currentFileName === obj.currentFileName
+      //     v.imageIds === obj.imageIds
+      //     return v
+      //   })
+      //   this.activeCanvasIndex = 3
+      // }
+      // this.$nextTick(() => {
+      //   this.viewportInfos.forEach(v => {
+      //     if (v.imageIds.length > 0) {
+      //       this.renderImage(v.imageIds, v.index, v.currentImageIdIndex)
+      //     }
+      //   })
+      // })
+    },
+    // 切换全屏
+    toggleFullScreen(e, index) {
+      this.fullScreenIndex = this.fullScreenIndex === index ? null : index
+      this.activeCanvasIndex = index
+    },
+    // 切换任务
+    toggleTask(evt, visitTaskNum, i) {
+      const num = visitTaskNum + i
+      if (num >= 0 && num <= this.taskInfo.VisitNum) {
+        this.$emit('toggleTaskByViewer', num)
+      }
+
+      evt.stopImmediatePropagation()
+      evt.stopPropagation()
+      evt.preventDefault()
+    },
+    // 激活工具
+    setToolActive(toolName) {
+      const i = this.viewportInfos.findIndex(i => i.index === this.activeCanvasIndex)
+      if (i === -1) return
+      const toolGroupId = `canvas-${this.viewportInfos[i].index}`
+      const toolGroup = ToolGroupManager.getToolGroup(toolGroupId)
+      if (this.activeTool === toolName) {
+        toolGroup.setToolPassive(this.activeTool)
+        this.activeTool = ''
+      } else {
+        if (this.activeTool) {
+          toolGroup.setToolPassive(this.activeTool)
+        }
+        toolGroup.setToolActive(toolName, {
+          bindings: [{ mouseButton: MouseBindings.Primary }]
+        })
+        this.activeTool = toolName
+      }
+    },
+    // 激活标注工具
+    setAnnotateToolActive(toolName) {
+      if (this.readingTaskState === 2) return
+      const i = this.viewportInfos.findIndex(i => i.index === this.activeCanvasIndex)
+      if (i === -1) return
+      if (this.viewportInfos[i].taskInfo.VisitTaskId === this.taskInfo.VisitTaskId) {
+        const toolGroupId = `canvas-${this.viewportInfos[i].index}`
+        const toolGroup = ToolGroupManager.getToolGroup(toolGroupId)
+        if (this.activeTool === toolName) {
+          toolGroup.setToolPassive(this.activeTool)
+          this.activeTool = ''
+        } else {
+          if (this.activeTool) {
+            toolGroup.setToolPassive(this.activeTool)
+          }
+          toolGroup.setToolActive(toolName, {
+            bindings: [{ mouseButton: MouseBindings.Primary }]
+          })
+          this.activeTool = toolName
+        }
+      }
+    },
+    setToolsPassive() {
+      if (!this.activeTool) return
+      const toolGroupIds = ['canvas-0', 'canvas-1', 'canvas-2', 'canvas-3']
+      toolGroupIds.forEach(toolGroupId => {
+        const toolGroup = ToolGroupManager.getToolGroup(toolGroupId)
+        toolGroup.setToolPassive(this.activeTool)
+      })
+      this.activeTool = ''
+    },
+    addAnnotationListeners() {
+      eventTarget.addEventListener(
+        toolsEvents.ANNOTATION_MODIFIED,
+        this.annotationModifiedListener
+      )
+      eventTarget.addEventListener(
+        toolsEvents.ANNOTATION_COMPLETED,
+        this.annotationModifiedListener
+      )
+      eventTarget.addEventListener(
+        toolsEvents.ANNOTATION_REMOVED,
+        this.annotationRemovedListener
+      )
+    },
+    async annotationRemovedListener(e) {
+      if (this.readingTaskState === 2) return
+      const { annotation } = e.detail
+      if (!annotation) return
+      if (!annotation.annotationId) return
+      await deleteTrialFileType(annotation.annotationId)
+      const renderingEngine = getRenderingEngine(renderingEngineId)
+      const viewport = renderingEngine.getViewport(`canvas-${this.activeCanvasIndex}`)
+      viewport.render()
+      // 删除成功
+    },
+    async annotationModifiedListener(e) {
+      if (this.readingTaskState === 2) return
+      const { annotation } = e.detail
+      if (!annotation) return
+      const i = this.viewportInfos.findIndex(i => i.index === this.activeCanvasIndex)
+      if (i === -1) return
+      if (this.viewportInfos[i].taskInfo.VisitTaskId !== this.taskInfo.VisitTaskId) return
+      const fileName = this.viewportInfos[i].currentFileName
+      const fileList = this.viewportInfos[i].fileList
+      const fileIndex = fileList.findIndex(f => f.FileName === fileName)
+      if (fileIndex === -1) return
+      const params = {
+        id: annotation.annotationId ? annotation.annotationId : '',
+        visitTaskId: this.viewportInfos[i].taskInfo.VisitTaskId,
+        studyId: this.viewportInfos[i].studyId,
+        noneDicomFileId: fileList[fileIndex].Id,
+        path: fileList[fileIndex].Path,
+        measureData: JSON.stringify(annotation)
+      }
+      const res = await addNoneDicomMark(params)
+      if (annotation.annotationId) return
+      annotation.annotationId = res.Result
+      // 保存成功
+      this.$message.success(this.$t('common:message:savedSuccessfully'))
+    },
+    // 重置视图
+    resetViewport() {
+      this.setToolsPassive()
+      const renderingEngine = getRenderingEngine(renderingEngineId)
+      const viewportId = `canvas-${this.activeCanvasIndex}`
+      const viewport = (renderingEngine.getViewport(viewportId))
+      viewport.resetCamera({ resetPan: true, resetZoom: true, resetToCenter: true })
+      renderingEngine.render()
+    },
+    // 箭头工具输入标记名称自定义弹窗
+    async customPrompt() {
+      try {
+        const { value } = await this.$prompt('请输入标记名称')
+        return value
+      } catch {
+        return null
+      }
+    },
+    // 滚动条
+    clickSlider(e, index) {
+      const height = e.offsetY * 100 / this.$refs[`sliderBox-${index}`][0].clientHeight
+      const i = this.viewportInfos.findIndex(i => i.index === index)
+      if (i === -1) return
+      this.viewportInfos[i].height = height
+      let sliceIdx = Math.trunc(this.viewportInfos[i].imageIds.length * height / 100)
+      sliceIdx = sliceIdx >= this.viewportInfos[i].imageIds.length ? this.viewportInfos[i].imageIds.length - 1 : sliceIdx < 0 ? 0 : sliceIdx
+      const renderingEngine = getRenderingEngine(renderingEngineId)
+      const viewport = renderingEngine.getViewport(
+        this.viewportInfos[i].viewportId
+      )
+      viewport.setImageIdIndex(sliceIdx)
+      viewport.render()
+      // this.$emit('toggleImage', { taskId: this.viewportInfos[i].taskInfo.VisitTaskId, studyId: this.viewportInfos[i].studyId, imageIndex: sliceIdx })
+    },
+    sliderMouseup(e, index) {
+      const i = this.viewportInfos.findIndex(i => i.index === index)
+      if (i === -1) return
+      this.viewportInfos[i].isMove = false
+    },
+    sliderMousemove(e, index) {
+      const i = this.viewportInfos.findIndex(i => i.index === index)
+      if (i === -1) return
+      if (!this.viewportInfos[i].isMove) return
+      const delta = this.viewportInfos[i].oldB - (this.viewportInfos[i].oldM - e.clientY)
+      const boxHeight = this.$refs[`sliderBox-${index}`][0].clientHeight
+      if (delta < 0) return
+      if (delta > boxHeight) return
+      const height = delta * 100 / boxHeight
+      let sliceIdx = Math.trunc(this.viewportInfos[i].imageIds.length * height / 100)
+      sliceIdx = sliceIdx >= this.viewportInfos[i].imageIds.length ? this.viewportInfos[i].imageIds.length - 1 : sliceIdx < 0 ? 0 : sliceIdx
+      this.viewportInfos[i].height = height
+      if (this.viewportInfos[i].currentImageIdIndex !== i) {
+        const renderingEngine = getRenderingEngine(renderingEngineId)
+        const viewport = renderingEngine.getViewport(
+          this.viewportInfos[i].viewportId
+        )
+        viewport.setImageIdIndex(sliceIdx)
+        viewport.render()
+        // this.$emit('toggleImage', { taskId: this.viewportInfos[i].taskInfo.VisitTaskId, studyId: this.viewportInfos[i].studyId, imageIndex: sliceIdx })
+      }
+    },
+    sliderMousedown(e, index) {
+      const i = this.viewportInfos.findIndex(i => i.index === index)
+      if (i === -1) return
+      const boxHeight = this.$refs[`sliderBox-${index}`][0].clientHeight
+      this.viewportInfos[i].oldB = parseInt(e.srcElement.style.top) * boxHeight / 100
+      this.viewportInfos[i].oldM = e.clientY
+      this.viewportInfos[i].isMove = true
+      e.stopImmediatePropagation()
+      e.stopPropagation()
+      e.preventDefault()
+    },
+    preventDefault(e) {
+      e.stopImmediatePropagation()
+      e.stopPropagation()
+      e.preventDefault()
+    },
+    // 查看临床数据
+    viewCD(e) {
+
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+.none-dicom-viewer {
+  display: flex;
+  flex-direction: column;
+  width:100%;
+  height: 100%;
+  user-select: none;
+  .tools-wrapper {
+    height: 50px;
+    display: flex;
+    flex-direction: row;
+    justify-content: flex-start;
+    align-items: center;
+    border-bottom: 1px solid #727272;
+    color: #ddd;
+    .tool-item {
+      padding: 5px;
+      margin: 0 5px;
+      border: 1px solid #333;
+      font-size: 20px;
+      cursor: pointer;
+    }
+    .tool-item-active {
+      background-color: #607d8b;
+    }
+    .tool-disabled {
+      cursor: not-allowed;
+    }
+  }
+  .viewports-wrapper {
+    flex: 1;
+    .grid-container {
+      display: grid;
+      height: 100%;
+      width: 100%;
+      position: relative;
+    }
+
+    .grid-cell {
+      border: 1px dashed #ccc;;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+    }
+    .cell_active {
+      border-color: #fafa00!important;
+    }
+    .cell-full-screen {
+      grid-column: 1 / -1;
+      grid-row: 1 / -1;
+    }
+
+    .content {
+      width: 100%;
+      height: 100%;
+      position: relative;
+      .left-top-text {
+        position: absolute;
+        left: 5px;
+        top: 5px;
+        color: #ddd;
+        z-index: 1;
+        font-size: 12px;
+        .cd-info {
+          color: #ddd;
+          font-size: 18px;
+          cursor: pointer;
+        }
+        .subject-info {
+          color:#f44336;
+          padding: 5px 0px;
+          margin: 0;
+        }
+      }
+      .top-center-tool {
+        position: absolute;
+        left:50%;
+        top: 5px;
+        transform: translateX(-50%);
+        z-index: 1;
+        .toggle-visit-container {
+          display: flex;
+        }
+        .arrw_icon{
+          width: 20px;
+          height: 20px;
+          background-color: #3f3f3f;
+          text-align: center;
+          line-height: 20px;
+          border-radius: 10%;
+        }
+        .arrow_text{
+          height: 20px;
+          line-height: 20px;
+          background-color: #00000057;
+          color: #fff;
+          padding:0 10px;
+          font-size: 14px;
+        }
+      }
+      .right-slider-box {
+        position: absolute;
+        right: 1px;
+        height: calc(100% - 140px);
+        transform: translateY(-50%);
+        top: calc(50% - 30px);
+        width: 10px;
+        background: #333;
+        z-index: 1;
+        cursor: pointer;
+      }
+      .right-slider-box:after{
+        content: '';
+        position: absolute;
+        bottom: -20px;
+        left: 0;
+        height: 20px;
+        width: 100%;
+        background: #333;
+      }
+      .slider {
+        height: 20px;
+        width: 100%;
+        position: absolute;
+        top: 0;
+        z-index:10;
+        background: #9e9e9e;
+        cursor: move
+      }
+    }
+  }
+}
+</style>

src/views/trials/trials-panel/reading/visit-review/components/PDFViewer.vue

@@ -0,0 +1,331 @@
+<template>
+  <div class="none-dicom-viewer">
+    <!-- tools -->
+    <div class="tools-wrapper">
+      <!-- 布局 -->
+      <div class="tool-item" :title="$t('trials:reading:button:layout')">
+        <el-dropdown @command="handleCommand">
+          <span class="el-dropdown-link">
+            <svg-icon icon-class="layout" class="svg-icon" /><i class="el-icon-arrow-down el-icon--right" />
+          </span>
+          <el-dropdown-menu slot="dropdown">
+            <el-dropdown-item command="1*1">1*1</el-dropdown-item>
+            <el-dropdown-item command="1*2">1*2</el-dropdown-item>
+            <el-dropdown-item command="2*2">2*2</el-dropdown-item>
+          </el-dropdown-menu>
+        </el-dropdown>
+      </div>
+    </div>
+    <!-- viewports -->
+    <div class="viewports-wrapper">
+      <div class="grid-container" :style="gridStyle">
+        <div
+          v-for="(v, index) in viewportInfos"
+          v-show="index < cells.length"
+          :key="index"
+          :style="cellStyle"
+          :class="['grid-cell', index === activeCanvasIndex ? 'cell_active' : '', index === fullScreenIndex ? 'cell-full-screen' : '']"
+          @dblclick="toggleFullScreen($event, index)"
+          @click="activeCanvas(index)"
+        >
+          <div :ref="`canvas-${index}`" class="content">
+
+            <div style="width: 100%; height: 100%; padding: 1px;">
+              <iframe v-if="v.currentFilePath" :ref="`iframe-${index}`" :src="`/static/pdfjs/web/viewer.html?file=${OSSclientConfig.basePath}${v.currentFilePath}`" width="100%" height="100%" frameborder="0" crossorigin="anonymous" />
+              <!-- <div class="left-top-text">
+                <div
+                  v-if="v.taskInfo.IsExistsClinicalData"
+                  class="cd-info"
+                  :title="$t('trials:reading:button:clinicalData')"
+                  @click.stop="viewCD($event)"
+                >
+                  <svg-icon icon-class="documentation" class="svg-icon" />
+                </div>
+                <h2
+                  v-if="taskInfo && taskInfo.IsReadingShowSubjectInfo && v.taskInfo"
+                  class="subject-info"
+                >
+                  {{ `${taskInfo.SubjectCode} ${v.taskInfo.TaskBlindName} ` }}
+                </h2>
+                <div v-if="v.currentFileName">{{ v.currentFileName }}</div>
+              </div> -->
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+// import { addNoneDicomMark, deleteTrialFileType } from '@/api/trials'
+
+import { mapGetters } from 'vuex'
+import store from '@/store'
+
+export default {
+  name: 'PdfViewer',
+  data() {
+    return {
+      rows: 1,
+      cols: 1,
+      fullScreenIndex: null,
+      imageIds: [],
+      activeCanvasIndex: 0,
+      layout: '1*2',
+      cellsMax: 4,
+      viewportInfos: [],
+      taskInfo: null,
+      activeTool: '',
+      readingTaskState: 2
+    }
+  },
+  computed: {
+    gridStyle() {
+      return {
+        display: 'grid',
+        gridTemplateRows: `repeat(${this.rows}, 1fr)`,
+        gridTemplateColumns: `repeat(${this.cols}, 1fr)`,
+        height: '100%',
+        width: '100%'
+      }
+    },
+    cellStyle() {
+      return {
+        border: '1px dashed #ccc',
+        display: 'flex',
+        alignItems: 'center',
+        justifyContent: 'center'
+      }
+    },
+    cells() {
+      return Array(this.rows * this.cols).fill(0)
+    },
+    ...mapGetters(['lastViewportTaskId'])
+  },
+  watch: {
+    relatedStudyInfo: {
+      immediate: true,
+      handler(obj) {
+        if (!obj || Object.keys(obj).length === 0) return
+        this.updateViewportInfos(0, obj)
+      }
+    }
+  },
+  mounted() {
+    this.taskInfo = JSON.parse(localStorage.getItem('taskInfo'))
+    this.readingTaskState = this.taskInfo.ReadingTaskState
+    this.viewportInfos = Array.from({ length: this.cellsMax }, (_, index) => ({
+      index: index,
+      taskInfo: '',
+      studyId: '',
+      viewportId: `canvas-${index}`,
+      currentFileName: '',
+      currentFilePath: ''
+    }))
+    // this.addIframeEventListener()
+    window.addEventListener('message', this.handleIframeMessage)
+  },
+  beforeDestroy() {
+    window.removeEventListener('message', this.handleIframeMessage)
+  },
+  methods: {
+    handleIframeMessage(event) {
+      if (event.data.type === 'pdf-clicked') {
+        const baseUrl = event.data.data.baseUrl
+        const i = this.viewportInfos.findIndex(i => baseUrl.includes(i.currentFilePath))
+        if (i === -1) return
+        this.activeCanvas(this.viewportInfos[i].index)
+      }
+    },
+    setActiveCanvasImages(obj) {
+      if (!obj || Object.keys(obj).length === 0) return
+      const i = this.viewportInfos.findIndex(i => i.index === this.activeCanvasIndex)
+      if (i === -1) return
+      this.updateViewportInfos(this.activeCanvasIndex, obj)
+      if (this.activeCanvasIndex === this.cells.length - 1) {
+        store.dispatch('noneDicomReview/setLastViewportTaskId', obj.visitTaskInfo.VisitTaskId)
+      }
+    },
+    // 激活视图
+    activeCanvas(index) {
+      if (this.activeCanvasIndex === index) return
+      const i = this.viewportInfos.findIndex(i => i.index === index)
+      if (i === -1) return
+      this.activeCanvasIndex = index
+      if (index === this.cells.length - 1) {
+        store.dispatch('noneDicomReview/setLastViewportTaskId', this.viewportInfos[i].taskInfo.VisitTaskId)
+      }
+      this.$emit('toggleTask', this.viewportInfos[i].taskInfo)
+    },
+    // 更新视图信息
+    updateViewportInfos(index, obj) {
+      const i = this.viewportInfos.findIndex(i => i.index === index)
+      if (i === -1) return
+      this.viewportInfos[i].taskInfo = obj.visitTaskInfo
+      this.viewportInfos[i].currentFileName = obj.fileInfo.FileName
+      this.viewportInfos[i].currentFilePath = obj.fileList[obj.fileIndex].Path
+      this.viewportInfos[i].studyId = obj.studyId
+    },
+    // 更改视图布局
+    handleCommand(command) {
+      this.fullScreenIndex = null
+      this.layout = command
+      this.rows = parseInt(command.split('*')[0])
+      this.cols = parseInt(command.split('*')[1])
+    },
+    // 切换全屏
+    toggleFullScreen(e, index) {
+      this.fullScreenIndex = this.fullScreenIndex === index ? null : index
+      this.activeCanvasIndex = index
+    },
+    // 切换任务
+    toggleTask(evt, visitTaskNum, i) {
+      const num = visitTaskNum + i
+      if (num >= 0 && num <= this.taskInfo.VisitNum) {
+        this.$emit('toggleTaskByViewer', num)
+      }
+
+      evt.stopImmediatePropagation()
+      evt.stopPropagation()
+      evt.preventDefault()
+    },
+    // 查看临床数据
+    viewCD(e) {
+
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+.none-dicom-viewer {
+  display: flex;
+  flex-direction: column;
+  width:100%;
+  height: 100%;
+  user-select: none;
+  .tools-wrapper {
+    height: 50px;
+    display: flex;
+    flex-direction: row;
+    justify-content: flex-start;
+    align-items: center;
+    border-bottom: 1px solid #727272;
+    color: #ddd;
+    .tool-item {
+      padding: 5px;
+      margin: 0 5px;
+      border: 1px solid #333;
+      font-size: 20px;
+      cursor: pointer;
+    }
+    .tool-item-active {
+      background-color: #607d8b;
+    }
+    .tool-disabled {
+      cursor: not-allowed;
+    }
+  }
+  .viewports-wrapper {
+    flex: 1;
+    .grid-container {
+      display: grid;
+      height: 100%;
+      width: 100%;
+      position: relative;
+    }
+
+    .grid-cell {
+      border: 1px dashed #ccc;;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+    }
+    .cell_active {
+      border-color: #fafa00!important;
+    }
+    .cell-full-screen {
+      grid-column: 1 / -1;
+      grid-row: 1 / -1;
+    }
+
+    .content {
+      width: 100%;
+      height: 100%;
+      position: relative;
+      .left-top-text {
+        position: absolute;
+        left: 5px;
+        top: 5px;
+        color: #ddd;
+        z-index: 1;
+        font-size: 12px;
+        .cd-info {
+          color: #ddd;
+          font-size: 18px;
+          cursor: pointer;
+        }
+        .subject-info {
+          color:#f44336;
+          padding: 5px 0px;
+          margin: 0;
+        }
+      }
+      .top-center-tool {
+        position: absolute;
+        left:50%;
+        top: 5px;
+        transform: translateX(-50%);
+        z-index: 1;
+        .toggle-visit-container {
+          display: flex;
+        }
+        .arrw_icon{
+          width: 20px;
+          height: 20px;
+          background-color: #3f3f3f;
+          text-align: center;
+          line-height: 20px;
+          border-radius: 10%;
+        }
+        .arrow_text{
+          height: 20px;
+          line-height: 20px;
+          background-color: #00000057;
+          color: #fff;
+          padding:0 10px;
+          font-size: 14px;
+        }
+      }
+      .right-slider-box {
+        position: absolute;
+        right: 1px;
+        height: calc(100% - 140px);
+        transform: translateY(-50%);
+        top: calc(50% - 30px);
+        width: 10px;
+        background: #333;
+        z-index: 1;
+        cursor: pointer;
+      }
+      .right-slider-box:after{
+        content: '';
+        position: absolute;
+        bottom: -20px;
+        left: 0;
+        height: 20px;
+        width: 100%;
+        background: #333;
+      }
+      .slider {
+        height: 20px;
+        width: 100%;
+        position: absolute;
+        top: 0;
+        z-index:10;
+        background: #9e9e9e;
+        cursor: move
+      }
+    }
+  }
+}
+</style>

src/views/trials/trials-panel/reading/visit-review/components/ReadPage.vue

@@ -0,0 +1,495 @@
+<template>
+  <div v-loading="loading" class="read-page-container">
+    <!-- 检查列表 -->
+    <div class="left-panel">
+      <div class="task-container">
+        <div class="task-info">
+          <div
+            v-for="s in visitTaskList"
+            :key="s.VisitTaskId"
+            class="task-item"
+            :class="{'task-item-active': activeTaskVisitId==s.VisitTaskId}"
+
+            @click.prevent="toggleTask(s)"
+          >{{ s.TaskBlindName }}</div>
+        </div>
+      </div>
+      <div class="study-info">
+        <div
+          v-for="s in visitTaskList"
+          v-show="activeTaskVisitId === s.VisitTaskId"
+          :key="s.VisitTaskId"
+          style="height:100%;"
+        >
+          <study-list
+            v-if="selectArr.includes(s.VisitTaskId) && s.StudyList.length > 0"
+            :ref="s.VisitTaskId"
+            :visit-task-info="s"
+            @selectFile="selectFile"
+          />
+
+        </div>
+      </div>
+    </div>
+
+    <!-- 图像 -->
+    <div class="middle-panel">
+      <!-- <image-viewer
+        ref="imageViewer"
+        :related-study-info="relatedStudyInfo"
+        @toggleTaskByViewer="toggleTaskByViewer"
+        @toggleTask="toggleTask"
+        @toggleImage="toggleImage"
+      /> -->
+      <!-- <pdf-viewer
+        ref="imageViewer"
+        :related-study-info="relatedStudyInfo"
+        @toggleTaskByViewer="toggleTaskByViewer"
+        @toggleTask="toggleTask"
+        @toggleImage="toggleImage"
+      /> -->
+      <file-viewer
+        ref="fileViewer"
+        :related-study-info="relatedStudyInfo"
+        @toggleTaskByViewer="toggleTaskByViewer"
+        @toggleTask="toggleTask"
+        @toggleImage="toggleImage"
+        @previewCD="previewCD"
+      />
+    </div>
+    <!-- 表单 -->
+    <div class="right-panel">
+      <div
+        v-if="taskInfo && taskInfo.IsReadingShowSubjectInfo"
+        class="text-info"
+      >
+        <h3>
+          <span
+            v-if="currentVisitInfo && currentVisitInfo.SubjectCode"
+          >
+            {{ currentVisitInfo.SubjectCode }}
+          </span>
+          <span
+            v-if="currentVisitInfo && currentVisitInfo.TaskBlindName"
+            style="margin-left:5px;"
+          >
+            {{ currentVisitInfo.TaskBlindName }}
+          </span>
+        </h3>
+      </div>
+      <ecrf-list
+        v-if="currentVisitInfo"
+        :visit-task-info="currentVisitInfo"
+      />
+    </div>
+
+    <el-dialog
+      :visible.sync="clinicalDataVisible"
+      :custom-class="isClinicalDataFullscreen?'full-dialog-container':'dialog-container'"
+      :show-close="false"
+      :close-on-click-modal="false"
+      :fullscreen="isClinicalDataFullscreen"
+    >
+      <span slot="title" class="dialog-footer">
+        <!-- 当前阅片任务存在临床数据，请查看。若已查看，请点击“确认” -->
+        <span v-if="!closeCDVisible">{{ $t('trials:reading:dagTitle:msg1') }}</span>
+        <div style="position: absolute;right: 20px;top: 10px;">
+          <svg-icon :icon-class="isClinicalDataFullscreen?'exit-fullscreen':'fullscreen'" style="cursor: pointer;font-size: 20px;" @click="isClinicalDataFullscreen=!isClinicalDataFullscreen" />
+          <svg-icon v-if="closeCDVisible" icon-class="dClose" style="cursor: pointer;font-size: 25px;margin-left: 10px;" @click="clinicalDataVisible = false" />
+        </div>
+      </span>
+      <div style="height: 100%;margin:0;display: flex;flex-direction: column;">
+        <clinical-data
+          v-if="clinicalDataVisible"
+          style="flex: 1"
+          :trial-id="trialId"
+          :subject-id="taskInfo.SubjectId"
+          :visit-task-id="cdVisitTaskId"
+          :is-reading-show-subject-info="taskInfo.IsReadingShowSubjectInfo"
+        />
+        <div v-if="!closeCDVisible" style="text-align:right">
+          <el-button type="primary" @click="handleConfirmCD">{{ $t('trials:reading:button:confirm') }}</el-button>
+        </div>
+      </div>
+
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { getRelatedVisitTask, getReadingImageFile, getNoneDicomMarkListOutDto, readClinicalData } from '@/api/trials'
+import StudyList from './StudyList'
+// import ImageViewer from './ImageViewer'
+// import PdfViewer from './PDFViewer'
+import FileViewer from './FileViewer'
+import EcrfList from './EcrfList'
+import ClinicalData from '@/views/trials/trials-panel/reading/clinical-data'
+import { mapGetters } from 'vuex'
+export default {
+  name: 'ReadPage',
+  components: {
+    StudyList,
+    FileViewer,
+    // ImageViewer,
+    // PdfViewer,
+    EcrfList,
+    ClinicalData
+  },
+  data() {
+    return {
+      loading: false,
+      // 当前任务信息
+      taskInfo: null,
+      // 当前激活的任务Id
+      activeTaskVisitId: '',
+      // 表单数据
+      formData: {
+        name: '',
+        description: ''
+      },
+      // 当前任务关联的任务信息
+      visitTaskList: [],
+      selectArr: [],
+      fileType: 'image',
+      currentStudyInfo: null,
+      currentVisitInfo: null,
+      relatedStudyInfo: null,
+      clinicalDataVisible: false,
+      isClinicalDataFullscreen: false,
+      closeCDVisible: false,
+      trialId: '',
+      cdVisitTaskId: ''
+    }
+  },
+  computed: {
+    ...mapGetters(['lastViewportTaskId'])
+  },
+  watch: {
+    lastViewportTaskId: {
+      immediate: true,
+      handler(id) {
+        if (!id) return
+        const idx = this.visitTaskList.findIndex(i => i.VisitTaskId === id)
+        if (idx === -1) return
+        this.currentVisitInfo = this.visitTaskList[idx]
+        // this.activeTaskVisitId = id
+      }
+    }
+  },
+
+  mounted() {
+    this.taskInfo = JSON.parse(localStorage.getItem('taskInfo'))
+    this.trialId = this.$route.query.trialId
+    this.getRelatedTask()
+    this.$nextTick(() => {
+      if (this.taskInfo.IsExistsClinicalData && this.taskInfo.IsNeedReadClinicalData && !this.taskInfo.IsReadClinicalData) {
+        this.isClinicalDataFullscreen = false
+        this.clinicalDataVisible = true
+        this.cdVisitTaskId = this.taskInfo.VisitTaskId
+      }
+    })
+  },
+  methods: {
+    // 获取关联任务信息
+    async getRelatedTask() {
+      this.loading = true
+      try {
+        const params = {
+          visitTaskId: this.taskInfo.VisitTaskId
+        }
+        const res = await getRelatedVisitTask(params)
+        this.visitTaskList = res.Result.map((item) => ({
+          ...item,
+          StudyList: [],
+          Annotations: []
+        }))
+        const idx = res.Result.findIndex(i => i.IsCurrentTask)
+        if (idx > -1) {
+          await this.setActiveTaskVisitId(res.Result[idx].VisitTaskId)
+          this.$nextTick(() => {
+            this.$refs[res.Result[idx].VisitTaskId][0].setInitActiveFile()
+          })
+        }
+        if (this.taskInfo.IsReadingTaskViewInOrder !== 0 && res.Result.length > 1) {
+          const i = this.visitTaskList.findIndex(i => i.IsBaseLineTask)
+          if (i > -1) {
+            await this.getReadingImageFile(res.Result[i].VisitTaskId, i)
+            await this.getAnnotations(res.Result[i].VisitTaskId, i)
+            const studyList = this.visitTaskList[i].StudyList
+            if (studyList.length > 0) {
+              const fileInfo = studyList[0].NoneDicomStudyFileList[0]
+              this.relatedStudyInfo = { fileInfo, visitTaskInfo: this.visitTaskList[i], fileList: studyList[0].NoneDicomStudyFileList, fileIndex: 0, studyId: studyList[0].Id }
+              if (!this.selectArr.includes(res.Result[i].VisitTaskId)) {
+                this.selectArr.push(res.Result[i].VisitTaskId)
+              }
+            }
+          }
+        }
+        this.loading = false
+      } catch (e) {
+        console.log(e)
+        this.loading = false
+      }
+    },
+    // 获取任务关联的文件信息
+    getReadingImageFile(visitTaskId, visitTaskIdx) {
+      return new Promise(async(resolve, reject) => {
+        this.loading = true
+        try {
+          const params = {
+            subjectId: this.taskInfo.SubjectId,
+            trialId: this.$route.query.trialId,
+            visistTaskId: visitTaskId
+          }
+          const res = await getReadingImageFile(params)
+          this.$set(this.visitTaskList[visitTaskIdx], 'StudyList', res.Result)
+          // const arr = [
+          //   {
+          //     BodyPart: '',
+          //     Code: 0,
+          //     CodeView: '',
+          //     Description: '',
+          //     FileCount: 0,
+          //     Id: '6783b9e8-738f-42d6-bc36-8d3b36b060ee',
+          //     ImageDate: '0001-01-01 00:00:00',
+          //     IsCriticalSequence: true,
+          //     IsDeleted: false,
+          //     IsReading: false,
+          //     Modality: '',
+          //     StudyName: '',
+          //     SubjectId: '08dd3125-be6c-d544-0242-0a0001000000',
+          //     SubjectVisitId: '01000000-0a10-0242-4a73-08dd3125be6d',
+          //     TrialId: '08dd2ee1-0754-9e3d-0242-0a0001000000',
+          //     UpdateTime: '0001-01-01 00:00:00',
+          //     NoneDicomStudyFileList: [
+          //       {
+          //         Id: '08dd3480-5a81-cb9d-0242-0a0001000000',
+          //         Path: '/08dd2ee1-0754-9e3d-0242-0a0001000000/DocumentToSign/1740706111094_Independent%20Review%20Charter.pdf',
+          //         FileName: 'A11CF934.jpg',
+          //         CreateTime: '2025-01-14 17:46:43',
+          //         CreateUserId: '746d0000-3e2c-0016-f276-08daeedff8de',
+          //         NoneDicomStudyId: '08dd3480-4747-4454-0242-0a0001000000',
+          //         FileSize: 29137,
+          //         FullFilePath: '/08dd2ee1-0754-9e3d-0242-0a0001000000/DocumentToSign/1740706111094_Independent%20Review%20Charter.pdf',
+          //         FileType: 'image/jpeg'
+          //       }
+          //     ]
+          //   },
+          //   {
+          //     BodyPart: '',
+          //     Code: 0,
+          //     CodeView: '',
+          //     Description: '',
+          //     FileCount: 0,
+          //     Id: '6783b9e8-738f-42f6-bc36-8d3b36b060ee',
+          //     ImageDate: '0001-01-01 00:00:00',
+          //     IsCriticalSequence: true,
+          //     IsDeleted: false,
+          //     IsReading: false,
+          //     Modality: '',
+          //     StudyName: '',
+          //     SubjectId: '08dd3125-be6c-d544-0242-0a0001000000',
+          //     SubjectVisitId: '01000000-0a00-0242-4a73-08dd3125be6d',
+          //     TrialId: '08dd2ee1-0754-9e3d-0242-0a0001000000',
+          //     UpdateTime: '0001-01-01 00:00:00',
+          //     NoneDicomStudyFileList: [
+          //       {
+          //         Id: '08dd3480-5a81-cb8d-0242-0a0001000000',
+          //         Path: '/08dd2ee1-0754-9e3d-0242-0a0001000000/DocumentToSign/1740706163441_IRaCIS%20%E5%90%8E%E5%8F%B0%E7%AE%A1%E7%90%86%E7%B3%BB%E7%BB%9FV%201.0%20CRO%E7%94%A8%E6%88%B7%E4%BD%BF%E7%94%A8%E6%96%87%E6%A1%A3_20200601.pdf',
+          //         FileName: 'A11CF934.jpg',
+          //         CreateTime: '2025-01-14 17:46:43',
+          //         CreateUserId: '746d0000-3e2c-0016-f276-08daeedff8de',
+          //         NoneDicomStudyId: '08dd3480-4747-4454-0242-0a0001000000',
+          //         FileSize: 29137,
+          //         FullFilePath: '/08dd2ee1-0754-9e3d-0242-0a0001000000/DocumentToSign/1740706163441_IRaCIS%20%E5%90%8E%E5%8F%B0%E7%AE%A1%E7%90%86%E7%B3%BB%E7%BB%9FV%201.0%20CRO%E7%94%A8%E6%88%B7%E4%BD%BF%E7%94%A8%E6%96%87%E6%A1%A3_20200601.pdf',
+          //         FileType: 'image/jpeg'
+          //       }
+          //     ]
+          //   }
+          // ]
+          // this.$set(this.visitTaskList[visitTaskIdx], 'StudyList', arr)
+          this.loading = false
+          resolve()
+        } catch (e) {
+          console.log(e)
+          this.loading = false
+          reject(e)
+        }
+      })
+    },
+    // 获取任务关联的标注信息
+    getAnnotations(visitTaskId, visitTaskIdx) {
+      return new Promise(async(resolve, reject) => {
+        this.loading = true
+        try {
+          const params = {
+            visitTaskId: visitTaskId
+          }
+          const res = await getNoneDicomMarkListOutDto(params)
+          this.$set(this.visitTaskList[visitTaskIdx], 'Annotations', res.Result.NoneDicomMarkList)
+          this.loading = false
+          resolve()
+        } catch (e) {
+          console.log(e)
+          this.loading = false
+          reject(e)
+        }
+      })
+    },
+    // 切换任务
+    toggleTask(taskInfo) {
+      this.setActiveTaskVisitId(taskInfo.VisitTaskId)
+    },
+    // 视图触发任务切换
+    async toggleTaskByViewer(visitTaskNum) {
+      const i = this.visitTaskList.findIndex(v => v.VisitTaskNum === visitTaskNum)
+      if (i === -1) return
+      const visistTaskId = this.visitTaskList[i].VisitTaskId
+      this.setActiveTaskVisitId(visistTaskId, true)
+    },
+    // 设置激活的访视
+    async setActiveTaskVisitId(id, isInitActiveFile = false) {
+      if (!id) return
+      if (!this.selectArr.includes(id)) {
+        this.selectArr.push(id)
+      }
+      const idx = this.visitTaskList.findIndex(i => i.VisitTaskId === id)
+      if (idx === -1) return
+      if (this.visitTaskList[idx].StudyList.length === 0) {
+        await this.getReadingImageFile(id, idx)
+        await this.getAnnotations(id, idx)
+      }
+      this.activeTaskVisitId = id
+      this.$nextTick(() => {
+        if (isInitActiveFile) {
+          this.$refs[id][0].setInitActiveFile()
+        }
+      })
+    },
+    // 切换图片
+    toggleImage(obj) {
+      this.$refs[obj.taskId][0].activeImage(obj)
+    },
+    async handleConfirmCD() {
+      this.loading = true
+      var visitTaskId = this.taskInfo.VisitTaskId
+      try {
+        await readClinicalData({ visitTaskId })
+        this.loading = false
+        this.clinicalDataVisible = false
+        this.closeCDVisible = true
+        // this.isReadClinicalData = true
+      } catch (e) {
+        this.loading = false
+      }
+    },
+    previewCD(taskId) {
+      this.closeCDVisible = true
+      this.isClinicalDataFullscreen = false
+      this.dialogVisible = true
+      this.cdVisitTaskId = taskId
+      this.clinicalDataVisible = true
+    },
+    selectFile(obj) {
+      // this.$refs['imageViewer'].setActiveCanvasImages(obj)
+      this.$refs['fileViewer'].setActiveCanvasImages(obj)
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+  .read-page-container {
+    box-sizing: border-box;
+    height: 100%;
+    display: flex;
+    ::-webkit-scrollbar {
+      width: 5px;
+      height: 5px;
+    }
+    ::-webkit-scrollbar-thumb {
+      border-radius: 10px;
+      background: #d0d0d0;
+    }
+    .left-panel {
+      display: flex;
+      width: 200px;
+      border: 1px solid #727272;
+      color: #fff;
+      ::-webkit-scrollbar {
+        width: 3px;
+        height: 3px;
+      }
+      ::-webkit-scrollbar-thumb {
+        border-radius: 10px;
+        background: #d0d0d0;
+      }
+      .task-container {
+        position: relative;
+        width: 25px;
+        overflow-y: auto;
+      }
+      .task-info {
+        position: absolute;
+        top: 5px;
+        right: 20px;
+        transform-origin: right top;
+        transform: rotate(-90deg);
+        display: flex;
+        .task-item {
+          margin-left: 10px;
+          white-space: nowrap;
+          padding: 0px  4px;
+          border: 1px solid #999999;
+          border-bottom:none ;
+          text-align: center;
+          background-color: #4e4e4e;
+          color: #d5d5d5;
+          cursor: pointer;
+        }
+        .task-item-active {
+          background-color: #607d8b;
+          border: 1px solid #607d8b;
+        }
+      }
+      .study-info {
+        width: 170px;
+        border-left: 1px solid #727272;
+      }
+    }
+    .middle-panel {
+      flex: 1;
+      border: 1px solid #727272;
+      margin: 0 5px;
+    }
+    .right-panel {
+      width: 400px;
+      border: 1px solid #727272;
+      padding: 0 10px;
+      .text-info {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        color: #ddd;
+      }
+    }
+    ::v-deep .dialog-container{
+      margin-top: 50px !important;
+      width:75%;
+      height:80%;
+    }
+    ::v-deep .el-dialog__body{
+        padding: 20px 20px 0 20px;
+        height: calc(100% - 70px);
+      }
+    .el-dialog__header{
+      position: relative;
+    }
+    .full-dialog-container{
+      ::v-deep .is-fullscreen .el-dialog__body{
+        height: calc(100% - 70px);
+      }
+    }
+  }
+
+</style>

src/views/trials/trials-panel/reading/visit-review/components/ReportPage.vue

@@ -0,0 +1,799 @@
+<template>
+  <div class="report-wrapper">
+    <el-card v-loading="loading" shadow="never" style="display:flex;flex-direction: column;">
+      <div slot="header" class="clearfix report-header">
+        <h3 style="margin:0;padding:0;">{{ $t('trials:readingReport:title:eicrf') }}</h3>
+        <div style="margin-left:auto">
+          <el-button
+            v-if="readingTaskState<2"
+            type="primary"
+            size="small"
+            @click="skipTask"
+          >
+            <!-- 跳过 -->
+            {{ $t('trials:readingReport:button:skip') }}
+          </el-button>
+          <el-button v-if="readingTaskState<2" type="primary" size="small" @click="getReportInfo">{{ $t('trials:readingReport:button:refresh') }}</el-button>
+          <el-button v-if="readingTaskState<2" type="primary" size="small" @click="handleSave(true)">{{ $t('common:button:save') }}</el-button>
+          <el-button v-if="readingTaskState<2" type="primary" size="small" @click="handleConfirm">{{ $t('common:button:submit') }}</el-button>
+        </div>
+      </div>
+      <div style="flex: 1">
+        <el-table
+          v-if="taskQuestions.length > 0"
+          ref="reportList"
+          v-adaptive="{bottomOffset:0}"
+          :data="taskQuestions"
+          row-key="Id"
+          border
+          default-expand-all
+          height="100"
+          :tree-props="{children: 'Childrens', hasChildren: 'hasChildren'}"
+          size="mini"
+        >
+          <el-table-column
+            prop=""
+            label=""
+            show-overflow-tooltip
+            width="350px"
+          >
+            <template slot-scope="scope">
+              <span v-if="scope.row.QuestionName">{{ scope.row.BlindName ? scope.row.QuestionName : scope.row.QuestionName }}</span>
+              <span
+                v-else
+                style="font-weight: bold;font-size: 16px;color: #f44336;"
+              >
+                {{ scope.row.GroupName }}
+              </span>
+            </template>
+          </el-table-column>
+          <el-table-column
+            v-for="task in visitTaskList"
+            :key="task.VisitTaskId"
+            prop="date"
+            show-overflow-tooltip
+            width="200px"
+          >
+            <template slot="header">
+              <div v-if="task.IsCurrentTask">
+                {{ task.BlindName }}
+              </div>
+              <div v-else>
+                <div>
+                  {{ task.BlindName }}
+                  <el-button type="text" size="small" @click="previewDicoms(task)">
+                    <span class="el-icon-view" />
+                  </el-button>
+                </div>
+              </div>
+            </template>
+            <template slot-scope="scope">
+              <template v-if="readingTaskState<2 && task.VisitTaskId === visitTaskId && (scope.row.Type==='input' || scope.row.Type==='number' || scope.row.Type==='select' || scope.row.Type==='textarea' || scope.row.Type==='radio')">
+                <!-- 输入框 -->
+                <div>
+                  <template v-if="!((task.IsBaseLine && scope.row.LimitEdit === 1) || (!task.IsBaseLine && scope.row.LimitEdit === 2) || scope.row.LimitEdit === 0)" />
+                  <el-input
+                    v-else-if="questionForm[scope.row.QuestionId] instanceof Array && (scope.row.Type==='input' || scope.row.Type==='textarea') && !scope.row.IsShowInDicom && ((task.IsBaseLine && scope.row.LimitEdit === 1) || (!task.IsBaseLine && scope.row.LimitEdit === 2) || scope.row.LimitEdit === 0)"
+                    v-model="questionForm[scope.row.QuestionId][scope.row.xfIndex][scope.row.TableQuestionId]"
+                    size="mini"
+                  />
+                  <span v-else-if="questionForm[scope.row.QuestionId] instanceof Array && (scope.row.Type==='input' || scope.row.Type==='textarea')">
+                    {{ questionForm[scope.row.QuestionId][scope.row.xfIndex][scope.row.TableQuestionId] }}
+                  </span>
+                  <el-input
+                    v-else-if="(scope.row.Type==='input' || scope.row.Type==='textarea') && !scope.row.IsShowInDicom && ((task.IsBaseLine && scope.row.LimitEdit === 1) || (!task.IsBaseLine && scope.row.LimitEdit === 2) || scope.row.LimitEdit === 0)"
+                    v-model="questionForm[scope.row.QuestionId]"
+                    size="mini"
+                  />
+                  <span v-else-if="scope.row.Type==='input' || scope.row.Type==='textarea'">
+                    {{ questionForm[scope.row.QuestionId] }}
+                  </span>
+                  <el-select
+                    v-else-if="questionForm[scope.row.QuestionId] instanceof Array && (scope.row.Type==='select' || scope.row.Type==='radio') && !scope.row.IsShowInDicom && ((task.IsBaseLine && scope.row.LimitEdit === 1) || (!task.IsBaseLine && scope.row.LimitEdit === 2) || scope.row.LimitEdit === 0)"
+                    v-model="questionForm[scope.row.QuestionId][scope.row.xfIndex][scope.row.TableQuestionId]"
+                    size="mini"
+                    clearable
+                  >
+                    <template>
+                      <el-option
+                        v-for="val in scope.row.TypeValue.split('|')"
+                        :key="val"
+                        :label="val"
+                        :value="val"
+                      />
+                    </template>
+                  </el-select>
+                  <span v-else-if="questionForm[scope.row.QuestionId] instanceof Array && scope.row.Type==='select'">
+                    {{ questionForm[scope.row.QuestionId][scope.row.xfIndex][scope.row.TableQuestionId] }}
+                  </span>
+                  <el-select
+                    v-else-if="(scope.row.Type==='select' || scope.row.Type==='radio') && !scope.row.IsShowInDicom && ((task.IsBaseLine && scope.row.LimitEdit === 1) || (!task.IsBaseLine && scope.row.LimitEdit === 2) || scope.row.LimitEdit === 0)"
+                    v-model="questionForm[scope.row.QuestionId]"
+                    size="mini"
+                    clearable
+                  >
+                    <template>
+                      <el-option
+                        v-for="val in scope.row.TypeValue.split('|')"
+                        :key="val"
+                        :label="val"
+                        :value="val"
+                      />
+                    </template>
+                  </el-select>
+                  <span v-else-if="scope.row.Type==='select' || scope.row.Type==='radio'">
+                    {{ questionForm[scope.row.QuestionId] }}
+                  </span>
+                  <el-input
+                    v-else-if="scope.row.DataSource !== 1 && questionForm[scope.row.QuestionId] instanceof Array && scope.row.Type==='number' && (scope.row.xfIndex || scope.row.xfIndex === 0) && !scope.row.IsShowInDicom && ((task.IsBaseLine && scope.row.LimitEdit === 1) || (!task.IsBaseLine && scope.row.LimitEdit === 2) || scope.row.LimitEdit === 0)"
+                    v-model="questionForm[scope.row.QuestionId][scope.row.xfIndex][scope.row.TableQuestionId]"
+                    :disabled="scope.row.DataSource === 1"
+                    size="mini"
+                    @blur="limitBlur(questionForm[scope.row.QuestionId][scope.row.xfIndex], scope.row.TableQuestionId, scope.row.ValueType)"
+                    @focus="() => {questionId = scope.row.QuestionId}"
+                  >
+                    <template v-if="scope.row.Unit !== 0" slot="append">{{ scope.row.Unit !== 4 ? $fd('ValueUnit', scope.row.Unit) : scope.row.CustomUnit }}</template>
+                    <template v-else-if="scope.row.ValueType === 2" slot="append">%</template>
+                  </el-input>
+                  <span v-else-if="questionForm[scope.row.QuestionId] instanceof Array && scope.row.Type==='number' && (scope.row.xfIndex || scope.row.xfIndex === 0)">
+                    <template v-if="(scope.row.ValueType === 0 || scope.row.ValueType === 1) && scope.row.Unit">
+                      {{ isNaN(parseInt(questionForm[scope.row.QuestionId][scope.row.xfIndex][scope.row.TableQuestionId]))? questionForm[scope.row.QuestionId][scope.row.xfIndex][scope.row.TableQuestionId]:`${questionForm[scope.row.QuestionId][scope.row.xfIndex][scope.row.TableQuestionId]} ${scope.row.Unit !== 4 ? $fd('ValueUnit',scope.row.Unit) : scope.row.CustomUnit}` }}
+                    </template>
+                    <template v-else-if="scope.row.ValueType === 2">
+                      {{ isNaN(parseInt(questionForm[scope.row.QuestionId][scope.row.xfIndex][scope.row.TableQuestionId])) ? questionForm[scope.row.QuestionId][scope.row.xfIndex][scope.row.TableQuestionId]:`${questionForm[scope.row.QuestionId][scope.row.xfIndex][scope.row.TableQuestionId]} %` }}
+                    </template>
+                    <template v-else>
+                      {{ isNaN(parseInt(questionForm[scope.row.QuestionId][scope.row.xfIndex][scope.row.TableQuestionId])) ? questionForm[scope.row.QuestionId][scope.row.xfIndex][scope.row.TableQuestionId]:`${questionForm[scope.row.QuestionId][scope.row.xfIndex][scope.row.TableQuestionId]}` }}
+                    </template>
+                  </span>
+                  <el-input
+                    v-else-if="scope.row.DataSource !== 1 && scope.row.Type==='number' && !scope.row.IsShowInDicom && ((task.IsBaseLine && scope.row.LimitEdit === 1) || (!task.IsBaseLine && scope.row.LimitEdit === 2) || scope.row.LimitEdit === 0)"
+                    v-model="questionForm[scope.row.QuestionId]"
+                    :disabled="scope.row.DataSource === 1"
+                    size="mini"
+                    @blur="limitBlur(questionForm, scope.row.QuestionId, scope.row.ValueType)"
+                    @focus="() => {questionId = scope.row.QuestionId}"
+                  >
+                    <template v-if="scope.row.Unit !== 0" slot="append">{{ scope.row.Unit !== 4 ? $fd('ValueUnit', scope.row.Unit) : scope.row.CustomUnit }}</template>
+                    <template v-else-if="scope.row.ValueType === 2" slot="append">%</template>
+                  </el-input>
+                  <span v-else-if="scope.row.Type==='number'">
+                    <template v-if="(scope.row.ValueType === 0 || scope.row.ValueType === 1) && scope.row.Unit">
+                      {{ isNaN(parseInt(questionForm[scope.row.QuestionId]))? questionForm[scope.row.QuestionId]:`${questionForm[scope.row.QuestionId]} ${scope.row.Unit !== 4 ? $fd('ValueUnit',scope.row.Unit) : scope.row.CustomUnit}` }}
+                    </template>
+                    <template v-else-if="scope.row.ValueType === 2">
+                      {{ isNaN(parseInt(questionForm[scope.row.QuestionId])) ? questionForm[scope.row.QuestionId]:`${questionForm[scope.row.QuestionId]} %` }}
+                    </template>
+                    <template v-else>
+                      {{ isNaN(parseInt(questionForm[scope.row.QuestionId])) ? questionForm[scope.row.QuestionId] : questionForm[scope.row.QuestionId] }}
+                    </template>
+                  </span>
+                </div>
+              </template>
+              <template v-else-if="scope.row.DictionaryCode">
+                {{ $fd(scope.row.DictionaryCode, scope.row.Answers[task.VisitTaskId]) }}
+              </template>
+              <template v-else-if="criterionType === 10">
+                {{ isNaN(parseInt(scope.row.Answers[task.VisitTaskId]))?scope.row.Answers[task.VisitTaskId]:`${scope.row.Answers[task.VisitTaskId]}` }}
+              </template>
+              <template v-else-if="!((task.IsBaseLine && scope.row.LimitEdit === 1) || (!task.IsBaseLine && scope.row.LimitEdit === 2) || scope.row.LimitEdit === 0)" />
+              <template v-else-if="(scope.row.ValueType === 0 || scope.row.ValueType === 1) && scope.row.Unit">
+                {{ isNaN(parseInt(scope.row.Answers[task.VisitTaskId]))?scope.row.Answers[task.VisitTaskId]:`${scope.row.Answers[task.VisitTaskId]} ${scope.row.Unit !== 4 ? $fd('ValueUnit',scope.row.Unit) : scope.row.CustomUnit}` }}
+              </template>
+              <template v-else-if="scope.row.ValueType === 2">
+                {{ isNaN(parseInt(scope.row.Answers[task.VisitTaskId])) ? scope.row.Answers[task.VisitTaskId]:`${scope.row.Answers[task.VisitTaskId]} %` }}
+              </template>
+              <template v-else-if="scope.row.Answers && scope.row.Answers.hasOwnProperty(task.VisitTaskId)">
+                {{ scope.row.Answers[task.VisitTaskId] }}
+              </template>
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
+    </el-card>
+
+    <!-- 签名框 -->
+    <el-dialog
+      v-if="signVisible"
+      :visible.sync="signVisible"
+      :close-on-click-modal="false"
+      width="600px"
+      custom-class="base-dialog-wrapper"
+    >
+      <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 ref="signForm" :sign-code-enum="signCode" @closeDialog="closeSignDialog" />
+    </el-dialog>
+  </div>
+</template>
+<script>
+import { changeCalculationAnswer, getReadingReportEvaluation, submitDicomVisitTask, verifyVisitTaskQuestions, getQuestionCalculateRelation } from '@/api/trials'
+import { setSkipReadingCache } from '@/api/reading'
+// import UploadFile from './UploadFile'
+import const_ from '@/const/sign-code'
+import SignForm from '@/views/trials/components/newSignForm'
+import { getToken } from '@/utils/auth'
+import store from '@/store'
+export default {
+  name: 'ReportPage',
+  components: { SignForm },
+  data() {
+    return {
+      trialId: '',
+      visitTaskId: '',
+      subjectId: '',
+      readingTool: 1,
+      criterionType: null,
+      isReadingTaskViewInOrder: false,
+      currentUser: zzSessionStorage.getItem('userName'),
+      signVisible: false,
+      signCode: null,
+      visitTaskList: [],
+      taskQuestions: [],
+      loading: false,
+      answers: [],
+      readingTaskState: 2,
+      answerArr: [],
+      questions: [],
+      CalculationList: [],
+      TrialReadingCriterionId: null,
+      tableAnswers: {},
+      questionForm: {},
+      questionId: null,
+      taskInfo: null
+    }
+  },
+  watch: {
+    questionForm: {
+      deep: true,
+      immediate: true,
+      handler(v, oldv) {
+        try {
+          if (!v[this.questionId] || !oldv[this.questionId]) return
+        } catch (e) {
+        }
+        this.formItemNumberChange(this.questionId, false)
+      }
+    }
+  },
+  async mounted() {
+    this.taskInfo = JSON.parse(localStorage.getItem('taskInfo'))
+    this.trialId = this.$route.query.trialId
+    this.visitTaskId = this.taskInfo.VisitTaskId
+    this.subjectId = this.taskInfo.SubjectId
+    this.criterionType = this.taskInfo.CriterionType
+    this.digitPlaces = this.taskInfo.DigitPlaces
+    this.TrialReadingCriterionId = this.taskInfo.TrialReadingCriterionId
+    window.addEventListener('resize', () => {
+      this.handleResize()
+    })
+    await this.getQuestionCalculateRelation()
+    this.getReportInfo()
+  },
+  methods: {
+    limitBlur(questionForm, id, valueType) {
+      const value = questionForm[id]
+      if (valueType === 0) {
+        this.$set(questionForm, id, parseInt(value))
+      } else if (valueType === 3) {
+        this.$set(questionForm, id, parseFloat(value))
+      } else {
+        this.$set(questionForm, id, parseFloat(value).toFixed(this.digitPlaces))
+      }
+    },
+    setImageUrl(qid, index, tqid, url, RowId) {
+      if (index || index === 0) {
+        // 表格问题
+        this.$set(this.questionForm[qid][index], tqid, url)
+        this.$set(this.questionForm[qid][index], tqid + '_RowId', RowId)
+        // this.questionForm[qid][index][tqid] = url
+      } else {
+        // 非表格问题
+        this.questionForm[qid] = url
+      }
+    },
+    getTagterAnswers(list, questionId) {
+      list.forEach(v => {
+        if (v.QuestionId === questionId) {
+          return Object.assign({}, v.Answers)
+        } else if (v.Childrens.length > 0) {
+          return this.getTagterAnswers(v.Childrens, questionId)
+        }
+      })
+    },
+    formItemNumberChange(questionId, isTable) {
+      if (isTable) {
+        this.CalculationList.forEach((v, i) => {
+          var find = v.CalculateQuestionList.filter(o => {
+            return o.QuestionId === questionId
+          })
+          // find的自动计算值number
+          if (find) {
+            var num = this.logic(v)
+            if (num !== false) {
+              this.$set(this.questionForm, v.QuestionId, num)
+              // this.$emit('setFormItemData', { key: v.QuestionId, val: num })
+            }
+          }
+        })
+      } else {
+        this.CalculationList.forEach(v => {
+          var find = v.CalculateQuestionList.filter(o => {
+            return o.TableQuestionId === questionId
+          })
+          // find的自动计算值number
+          if (find) {
+            var num = this.logic(v)
+            if (num !== false) {
+              this.$set(this.questionForm, v.QuestionId, num)
+              // this.$emit('setFormItemData', { key: v.QuestionId, val: num })
+            }
+          }
+        })
+      }
+      // this.$emit('formItemNumberChange')
+    },
+    getTableAnswers(QuestionId, list) {
+      var arr = []
+      window.xfList = list
+      list.forEach((v, i) => {
+        var obj = {}
+        v.Childrens.forEach((o) => {
+          this.$set(o, 'xfIndex', i)
+          obj[o.TableQuestionId + '_RowId'] = o.RowId
+          obj[o.TableQuestionId] = o.Answers[this.visitTaskId]
+        })
+        arr.push(obj)
+      })
+      return arr
+    },
+    InitVisitTaskQuestionForm() {
+      this.taskQuestions.map((v, i) => {
+        if (v.Type === 'group' && v.Childrens.length === 0 && v.Type !== 'table') return
+        if (!v.IsPage && v.Type !== 'group' && v.Type !== 'summary' && v.Type !== 'table' && v.Type !== 'number') {
+          this.$set(this.questionForm, v.QuestionId, v.Answers[this.visitTaskId])
+        }
+        if (v.Type === 'table') {
+          var tableAnswers = this.getTableAnswers(v.QuestionId, v.Childrens, i)
+          this.$set(this.questionForm, v.QuestionId, tableAnswers)
+          // this.$set(v, 'xfIndex', i)
+        }
+        if (v.Type === 'number') {
+          let val = null
+          if (v.ValueType === 0) {
+            val = parseInt(v.Answers[this.visitTaskId])
+          } else if (v.ValueType === 3) {
+            val = v.Answers[this.visitTaskId]
+          } else {
+            val = v.Answers[this.visitTaskId] === '' ? parseFloat(0).toFixed(this.digitPlaces) : v.Answers[this.visitTaskId]
+          }
+          this.$set(this.questionForm, v.QuestionId, val)
+        }
+        if (v.Childrens.length > 0) {
+          this.setChild(v.Childrens)
+        }
+      })
+      this.formItemNumberChange(this.questionId, false)
+    },
+    setChild(obj) {
+      obj.forEach((i, index) => {
+        if (i.Type !== 'group' && i.Type !== 'summary' && i.Id && i.Type !== 'table') {
+          this.$set(this.questionForm, i.QuestionId, i.Answers[this.visitTaskId])
+        }
+        if (i.Type === 'table') {
+          var tableAnswers = this.getTableAnswers(i.QuestionId, i.Childrens, index)
+          this.$set(this.questionForm, i.QuestionId, tableAnswers)
+        }
+        if (i.Type === 'number') {
+          let val = null
+          if (i.ValueType === 0) {
+            val = parseInt(i.Answers[this.visitTaskId])
+          } else if (i.ValueType === 3) {
+            val = i.Answers[this.visitTaskId]
+          } else {
+            val = i.Answers[this.visitTaskId] === '' ? parseFloat(0).toFixed(this.digitPlaces) : i.Answers[this.visitTaskId]
+          }
+          this.$set(this.questionForm, i.QuestionId, val)
+        }
+        if (i.Childrens && i.Childrens.length > 0 && i.Type !== 'table') {
+          this.setChild(i.Childrens)
+        }
+      })
+    },
+    getQuestionCalculateRelation() {
+      return new Promise(resolve => {
+        getQuestionCalculateRelation({
+          TrialReadingCriterionId: this.TrialReadingCriterionId
+        }).then(res => {
+          this.CalculationList = res.Result
+          resolve()
+        })
+      })
+    },
+    logic(rules, num = 0) {
+      try {
+        if (rules.CalculateQuestionList.length === 0) {
+          return false
+        }
+        rules.CalculateQuestionList.forEach((o, i) => {
+          if (i === 0) {
+            if (rules.CustomCalculateMark > 4) {
+              switch (rules.CustomCalculateMark) {
+                case 5:
+                  this.questionForm[o.QuestionId].forEach((q, qi) => {
+                    if (qi === 0) {
+                      num = parseFloat(q[o.TableQuestionId])
+                    } else {
+                      num *= parseFloat(q[o.TableQuestionId])
+                    }
+                  })
+                  break
+                case 6:
+                  this.questionForm[o.QuestionId].forEach((q, qi) => {
+                    if (qi === 0) {
+                      num = isNaN(parseFloat(q[o.TableQuestionId])) ? null : parseFloat(q[o.TableQuestionId])
+                    } else {
+                      num += isNaN(parseFloat(q[o.TableQuestionId])) ? null : parseFloat(q[o.TableQuestionId])
+                    }
+                  })
+                  break
+                case 7:
+                  this.questionForm[o.QuestionId].forEach((q, qi) => {
+                    if (qi === 0) {
+                      num = parseFloat(q[o.TableQuestionId])
+                    } else {
+                      num += parseFloat(q[o.TableQuestionId])
+                    }
+                  })
+                  num = this.questionForm[o.QuestionId].length === 0 ? 0 : num / this.questionForm[o.QuestionId].length
+                  break
+                case 8:
+                  var arr = []
+                  this.questionForm[o.QuestionId].forEach(q => {
+                    arr.push(q[o.TableQuestionId])
+                  })
+                  num = arr.length === 0 ? 0 : Math.max(...arr)
+                  break
+                case 9:
+                  // eslint-disable-next-line no-redeclare
+                  var arr = []
+                  this.questionForm[o.QuestionId].forEach(q => {
+                    arr.push(q[o.TableQuestionId])
+                  })
+                  num = arr.length === 0 ? 0 : Math.min(...arr)
+                  break
+              }
+            } else {
+              num = parseFloat(this.questionForm[o.TableQuestionId])
+            }
+          } else {
+            switch (rules.CustomCalculateMark) {
+              case 1:
+                num += parseFloat(this.questionForm[o.TableQuestionId])
+                break
+              case 2:
+                num -= parseFloat(this.questionForm[o.TableQuestionId])
+                break
+              case 3:
+                num *= parseFloat(this.questionForm[o.TableQuestionId])
+                break
+              case 4:
+                num /= parseFloat(this.questionForm[o.TableQuestionId])
+                // num /= parseFloat(this.questionForm[o.TableQuestionId])
+                break
+            }
+          }
+        })
+      } catch (e) {
+        console.log(e)
+      }
+      var digitPlaces = parseInt(localStorage.getItem('digitPlaces'))
+      if (rules.ValueType === 2) {
+        num = num * 100
+      }
+      return isNaN(num) ? '' : isFinite(num) ? num.toFixed(digitPlaces) : '∞'
+    },
+    getReportInfo() {
+      this.loading = true
+      var params = {
+        visitTaskId: this.visitTaskId,
+        trialId: this.trialId
+      }
+      this.taskQuestions = []
+      getReadingReportEvaluation(params).then(res => {
+        this.readingTaskState = res.Result.ReadingTaskState
+        this.answerArr = []
+        this.questions = res.Result.TaskQuestions.concat()
+        var taskQuestions = this.getQuestions(res.Result.TaskQuestions)
+        taskQuestions.forEach(item => {
+          this.$set(this.taskQuestions, this.taskQuestions.length, item)
+        })
+        this.visitTaskList = res.Result.VisitTaskList
+        this.InitVisitTaskQuestionForm()
+        this.handleResize()
+        this.loading = false
+      }).catch(() => { this.loading = false })
+    },
+    getQuestions(questions) {
+      const arr = []
+      if (questions.length !== 0) {
+        questions.forEach((item) => {
+          const obj = item
+          this.$set(obj, 'Answers', {})
+
+          var digitPlaces = parseInt(localStorage.getItem('digitPlaces')) || 0
+          item.Answer.forEach(i => {
+            if (item.DictionaryCode) {
+              this.$set(obj.Answers, i.VisitTaskId, i.Answer ? parseInt(i.Answer) : null)
+              // obj.Answers[i.VisitTaskId] = i.Answer ? parseInt(i.Answer) : null
+            } else {
+              if (item.Type === 'number') {
+                let val = null
+                if (item.ValueType === 0) {
+                  val = parseInt(i.Answer)
+                } else if (item.ValueType === 3) {
+                  val = i.Answer
+                } else {
+                  val = isNaN(parseFloat(i.Answer)) ? i.Answer : parseFloat(i.Answer).toFixed(digitPlaces)
+                }
+                this.$set(obj.Answers, i.VisitTaskId, val)
+              } else {
+                this.$set(obj.Answers, i.VisitTaskId, i.Answer)
+              }
+              // obj.Answers[i.VisitTaskId] = i.Answer
+            }
+          })
+          if (item.Childrens.length >= 1) {
+            obj.Childrens = this.getQuestions(item.Childrens)
+          }
+          arr.push(obj)
+        })
+      }
+      return arr
+    },
+    handleShowDetail(val) {
+      this.getReportInfo()
+      // this.taskQuestions = this.getQuestions(res.Result.TaskQuestions, !this.isShowDetail, null)
+    },
+    async handleConfirm() {
+      await this.handleSave(false)
+      await this.verifyVisitTaskQuestions()
+      const { ImageAssessmentReportConfirmation } = const_.processSignature
+      this.signCode = ImageAssessmentReportConfirmation
+      this.signVisible = true
+    },
+    verifyVisitTaskQuestions() {
+      return new Promise((resolve, reject) => {
+        this.loading = true
+        verifyVisitTaskQuestions({ visitTaskId: this.visitTaskId }).then(res => {
+          this.loading = false
+          resolve()
+        }).catch(() => {
+          this.loading = false
+          reject()
+        })
+      })
+    },
+    handleResize() {
+      this.$nextTick(() => {
+        this.$refs.reportList ? this.$refs.reportList.doLayout() : ''
+      })
+    },
+    // 关闭签名框
+    closeSignDialog(isSign, signInfo) {
+      if (isSign) {
+        this.signConfirm(signInfo)
+      } else {
+        this.signVisible = false
+      }
+    },
+    // 签名并确认
+    signConfirm(signInfo) {
+      this.loading = true
+      var params = {
+        data: {
+          visitTaskId: this.visitTaskId
+        },
+        signInfo: signInfo
+      }
+      submitDicomVisitTask(params).then(res => {
+        if (res.IsSuccess) {
+          this.$message.success(this.$t('common:message:savedSuccessfully'))
+          if (this.$refs['signForm']) {
+            this.$refs['signForm'].btnLoading = false
+          }
+
+          this.signVisible = false
+          // window.location.reload()
+          // window.opener.postMessage('refreshTaskList', window.location)
+
+          // 设置当前任务阅片状态为已读
+          this.readingTaskState = 2
+          this.taskInfo.ReadingTaskState = 2
+          localStorage.setItem('taskInfo', JSON.stringify(this.taskInfo))
+          store.dispatch('noneDicomReview/setCurrentTaskState', 2)
+          // DicomEvent.$emit('setReadingState', 2)
+          window.opener.postMessage('refreshTaskList', window.location)
+          this.$confirm(this.$t('trials:oncologyReview:title:msg2'), {
+            type: 'warning',
+            distinguishCancelAndClose: true
+          })
+            .then(() => {
+              // var token = getToken()
+              // var subjectCode = this.$router.currentRoute.query.subjectCode
+              // var subjectId = this.$router.currentRoute.query.subjectId
+              // var trialId = this.$router.currentRoute.query.trialId
+
+              // this.$router.push({
+              //   path: `/readingPage?subjectCode=${subjectCode}&subjectId=${subjectId}&trialId=${trialId}&TokenKey=${token}`
+              // })
+              // DicomEvent.$emit('getNextTask')
+              window.location.reload()
+            })
+            .catch(action => {
+
+            })
+        }
+        this.loading = false
+      }).catch(() => {
+        this.loading = false
+        if (this.$refs['signForm'] && this.$refs['signForm'].btnLoading) {
+          this.$refs['signForm'].btnLoading = false
+        }
+      })
+    },
+    previewDicoms(task) {
+      var token = getToken()
+      // var subjectCode = this.$router.currentRoute.query.subjectCode
+      var subjectCode = localStorage.getItem('subjectCode')
+      var subjectId = this.subjectId
+      var trialId = this.trialId
+      var isReadingTaskViewInOrder = this.isReadingTaskViewInOrder
+      var criterionType = this.criterionType
+      var readingTool = this.readingTool
+      var trialReadingCriterionId = this.$router.currentRoute.query.TrialReadingCriterionId
+      var path = `/noneDicomReading?TrialReadingCriterionId=${trialReadingCriterionId}&trialId=${trialId}&subjectCode=${subjectCode}&subjectId=${subjectId}&visitTaskId=${task.VisitTaskId}&isReadingTaskViewInOrder=${isReadingTaskViewInOrder}&criterionType=${criterionType}&readingTool=${readingTool}&TokenKey=${token}`
+      const routeData = this.$router.resolve({ path })
+      window.open(routeData.href, '_blank')
+    },
+    handleSave(isPrompt) {
+      return new Promise((resolve, reject) => {
+        this.loading = true
+        var answers = []
+        var tableQuestionAnswer = []
+        for (const k in this.questionForm) {
+          if (this.questionForm[k] instanceof Array) {
+            this.questionForm[k].forEach((v, i) => {
+              Object.keys(v).forEach(o => {
+                if (o.indexOf('_RowId') === -1) {
+                  tableQuestionAnswer.push({
+                    questionId: k,
+                    answer: v[o],
+                    tableQuestionId: o,
+                    rowId: v[o + '_RowId']
+                  })
+                }
+              })
+            })
+            // tableQuestionAnswer.push({})
+          } else {
+            answers.push({ questionId: k, answer: this.questionForm[k].toString() })
+          }
+        }
+        var params = {
+          visitTaskId: this.visitTaskId,
+          questionAnswer: answers,
+          tableQuestionAnswer: tableQuestionAnswer
+        }
+        changeCalculationAnswer(params).then(res => {
+          if (isPrompt) {
+            this.$message.success(this.$t('common:message:savedSuccessfully'))
+          }
+          // DicomEvent.$emit('refreshQuestionAnswer')
+          this.loading = false
+          resolve()
+        }).catch(() => {
+          this.loading = false
+          reject()
+        })
+      })
+    },
+    async skipTask() {
+      try {
+        // 是否确认跳过？
+        const confirm = await this.$confirm(
+          this.$t('trials:readingReport:message:skipConfirm'),
+          {
+            type: 'warning',
+            distinguishCancelAndClose: true
+          }
+        )
+        if (confirm !== 'confirm') return
+        this.loading = true
+        const res = await setSkipReadingCache({ visitTaskId: this.visitTaskId })
+        this.loading = false
+        if (res.IsSuccess) {
+          window.location.reload()
+        }
+      } catch (e) {
+        this.loading = false
+        console.log(e)
+      }
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+.report-wrapper{
+
+  height: 100%;
+  // background-color: #fff;
+  background-color: #000;
+  ::-webkit-scrollbar {
+    width: 7px;
+    height: 7px;
+  }
+  ::-webkit-scrollbar-thumb {
+    border-radius: 10px;
+    // background: #d0d0d0;
+  }
+  .report-header{
+    display: flex;
+  }
+  .el-card{
+    background-color: #000;
+    color: #ffffff;
+    border:none;
+  }
+  ::v-deep .el-table--border th.gutter:last-of-type{
+    border: none;
+  }
+  ::v-deep .el-table, .el-table__expanded-cell {
+    background-color: #000;
+    color: #fff;
+    border-color:#444444;
+  }
+
+  ::v-deep .el-table th, .el-table tr {
+    background-color: #000;
+    color: #fff;
+    border-color:#444444;
+  }
+  ::v-deep .el-table__body tr > td{
+    background-color:#000 !important;
+    color: #fff;
+    border-color:#444444;
+  }
+  ::v-deep .el-table__body tr:hover > td{
+    background-color:#858282 !important;
+    color: #fff;
+    border-color:#444444;
+  }
+  ::v-deep .el-table--border th.gutter:last-of-type{
+    border: none;
+  }
+  ::v-deep .el-card__header{
+    border: none;
+    padding: 10px;
+  }
+  ::v-deep .el-upload-list--picture-card .el-upload-list__item{
+    width: 30px;
+    height: 30px;
+  }
+  ::v-deep .el-upload--picture-card{
+    width: 30px;
+    height: 30px;
+    line-height: 40px;
+  }
+}
+::v-deep .el-switch__label.is-active{
+  color: #428bca;
+}
+.uploadWrapper{
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+}
+</style>

src/views/trials/trials-panel/reading/visit-review/components/StudyList.vue

@@ -0,0 +1,228 @@
+<template>
+  <div v-loading="loading" class="study-wrapper">
+    <div class="study-info">
+      <div
+        v-if="taskInfo && taskInfo.IsReadingShowSubjectInfo"
+        :title="taskInfo.SubjectCode"
+      >
+        {{ taskInfo.SubjectCode }}
+      </div>
+      <div
+        v-if="taskInfo && taskInfo.IsReadingShowSubjectInfo"
+        :title="visitTaskInfo.TaskBlindName"
+      >
+        {{ visitTaskInfo.TaskBlindName }}
+      </div>
+    </div>
+    <div class="ps">
+      <el-collapse v-model="activeNames">
+        <el-collapse-item v-for="(study, index) in studyList" :key="`${study.Id}`" :name="`${study.Id}`">
+          <template slot="title">
+            <div
+              v-if="!study.IsCriticalSequence"
+              class="dicom-desc"
+            >
+              <div>{{ study.CodeView }}</div>
+              <div>
+                <span :title="study.BodyPart">{{ study.BodyPart }}</span>
+                <span style="margin-left: 5px;" :title="study.Modality">{{ study.Modality }}</span>
+              </div>
+            </div>
+            <div v-else>
+              <!-- 关键序列 -->
+              关键文件
+            </div>
+          </template>
+          <div class="file-list-container">
+            <div
+              v-for="(k, i) in study.NoneDicomStudyFileList"
+              :key="i"
+              style="position:relative;margin-top:1px;"
+              @click="selectFile(study, index, i)"
+            >
+              <div
+                :class="{'file-active': index === activeStudyIndex && i === activeFileIndex}"
+                class="file-wrapper"
+              >
+                <div v-if="k.FileType === 'image/jpeg'" class="file-image">
+                  <el-image
+                    style="width: 100%;height: 100%;"
+                    :src="`${OSSclientConfig.basePath}${k.Path}?x-oss-process=image/resize,w_50,h_50/format,png`"
+                    fit="fill"
+                    crossorigin="anonymous"
+                  />
+                </div>
+                <div class="file-text" :title="k.FileName">
+                  {{ k.FileName }}
+                </div>
+
+              </div>
+            </div>
+          </div>
+        </el-collapse-item>
+      </el-collapse>
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  name: 'StudyList',
+  props: {
+    visitTaskInfo: {
+      type: Object,
+      default() {
+        return {}
+      }
+    }
+  },
+  data() {
+    return {
+      loading: false,
+      activeNames: [],
+      activeStudyIndex: -1,
+      activeFileIndex: -1,
+      taskInfo: null,
+      studyList: []
+    }
+  },
+  mounted() {
+    this.taskInfo = JSON.parse(localStorage.getItem('taskInfo'))
+    this.studyList = this.visitTaskInfo.StudyList
+    if (this.studyList.length === 0) return
+    this.$nextTick(() => {
+      this.activeNames.push(this.studyList[0].Id)
+    })
+  },
+  methods: {
+    // 设置初始化激活文件
+    setInitActiveFile() {
+      if (this.studyList.length === 0) return
+      this.$nextTick(() => {
+        this.activeNames.push(this.studyList[0].Id)
+        this.selectFile(this.studyList[0], 0, 0)
+      })
+    },
+    // 切换文件
+    selectFile(study, studyIndex, fileIndex) {
+      this.activeStudyIndex = studyIndex
+      this.activeFileIndex = fileIndex
+      const fileList = study.NoneDicomStudyFileList
+      this.$emit('selectFile', { fileInfo: fileList[fileIndex], fileList, visitTaskInfo: this.visitTaskInfo, studyId: study.Id })
+    },
+    activeImage(obj) {
+      if (this.studyList.length === 0) return
+      const i = this.studyList.findIndex(i => i.Id === obj.studyId)
+      if (i === -1) return
+      this.activeNames.push(obj.studyId)
+      this.activeStudyIndex = i
+      const fileList = this.studyList[i].NoneDicomStudyFileList
+      const fIndex = fileList.findIndex(f => f.Path === obj.path)
+      if (fIndex === -1) return
+      this.activeFileIndex = fIndex
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+.study-wrapper{
+  width:100%;
+  height: 100%;
+  overflow-y: hidden;
+  overflow-x: hidden;
+  display: flex;
+  flex-direction: column;
+  .study-info {
+    font-size: 16px;
+    font-weight: bold;
+    color: #ddd;
+    padding: 5px 0px;
+    margin: 0;
+    text-align: center;
+    background-color: #4c4c4c;
+    height: 50px;
+  }
+  .dicom-desc{
+    font-weight: bold;
+    font-size: 13px;
+    text-align: left;
+    color: #d0d0d0;
+    padding: 2px;
+  }
+
+  .ps {
+    flex: 1;
+    overflow-anchor: none;
+    touch-action: auto;
+    overflow-y: auto;
+  }
+  .file-active {
+    background-color: #607d8b!important;
+    border: 1px solid #607d8b!important;
+  }
+  ::v-deep.el-progress__text{
+    color: #ccc;
+    font-size: 12px;
+  }
+  .file-list-container{
+    width: 100%;
+    display: flex;
+    flex-direction: column;
+    justify-content: flex-start;
+    .file-wrapper {
+      width: 100%;
+      padding: 5px;
+      display: flex;
+      flex-direction: row;
+      align-items: center;
+      cursor: pointer;
+      background-color: #3a3a3a;
+      // color: #ddd;
+      // white-space: nowrap;
+      // overflow: hidden;
+      // text-overflow: ellipsis;
+      .el-progress__text{
+        display: none;
+      }
+      .el-progress-bar{
+        padding-right:0px;
+      }
+      .file-image {
+        width: 50px;
+        height: 50px;
+      }
+      .file-text {
+        flex: 1;
+        padding-left: 5px;
+        color: #ddd;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+      }
+
+    }
+  }
+  ::v-deep.el-collapse{
+    border: none;
+    .el-collapse-item{
+      background-color: #000!important;
+      color: #ddd;
+
+    }
+    .el-collapse-item__content{
+      padding-bottom:0px;
+      background-color: #000!important;
+    }
+    .el-collapse-item__header{
+      background-color: #000!important;
+      color: #ddd;
+      border-bottom-color:#5a5a5a;
+      padding-left: 5px;
+      height: 60px;
+      line-height: 20px;
+    }
+  }
+  ::v-deep .el-progress-bar__inner{
+    transition: width 0s ease;
+  }
+}
+</style>

src/views/trials/trials-panel/reading/visit-review/index.vue

@@ -0,0 +1,79 @@
+<template>
+  <div class="visit-review-container">
+    <el-tabs
+      v-model="activeName"
+    >
+      <!-- 阅片 -->
+      <el-tab-pane
+        v-if="taskInfo"
+        :label="$t('trials:reading:tabTitle:review')"
+        name="read"
+      >
+        <read-page />
+      </el-tab-pane>
+      <!-- 报告 -->
+      <el-tab-pane
+        v-if="taskInfo && !taskInfo.IseCRFShowInDicomReading"
+        :label="$t('trials:reading:tabTitle:report')"
+        name="report"
+      >
+        <report-page v-if="activeName === 'report'" />
+      </el-tab-pane>
+    </el-tabs>
+  </div>
+</template>
+<script>
+import ReadPage from './components/ReadPage'
+import ReportPage from './components/ReportPage'
+export default {
+  name: 'VisitReview',
+  components: {
+    ReadPage,
+    ReportPage
+  },
+  data() {
+    return {
+      activeName: 'read',
+      taskInfo: null
+    }
+  },
+  mounted() {
+    this.taskInfo = JSON.parse(localStorage.getItem('taskInfo'))
+  }
+}
+</script>
+<style lang="scss" scoped>
+  .visit-review-container {
+    height: 100vh;
+    display: flex;
+    flex-direction: column;
+    background-color: #000;
+    padding: 5px;
+    ::v-deep .el-tabs {
+      height: 100%;
+      display: flex;
+      flex-direction: column;
+      .el-tabs__item {
+        color: #fff;
+      }
+      .el-tabs__item.is-active {
+        color: #428bca;
+      }
+      .el-tabs__item:hover {
+        color: #428bca;
+      }
+      .el-tabs__header {
+        height: 50px;
+        margin:0px;
+      }
+      .el-tabs__content {
+        flex: 1;
+        margin:0px;
+      }
+      .el-tab-pane {
+        height: 100%;
+      }
+
+    }
+  }
+</style>

src/views/trials/trials-panel/reading/visit-review/js/hardcodedMetaDataProvider.js

@@ -0,0 +1,68 @@
+// Add hardcoded meta data provider for color images
+export default function hardcodedMetaDataProvider(type, imageId, imageIds) {
+  const colonIndex = imageId.indexOf(':')
+  const scheme = imageId.substring(0, colonIndex)
+  if (scheme !== 'web') {
+    return
+  }
+
+  if (type === 'imagePixelModule') {
+    const imagePixelModule = {
+      pixelRepresentation: 0,
+      bitsAllocated: 24,
+      bitsStored: 24,
+      highBit: 24,
+      photometricInterpretation: 'RGB',
+      samplesPerPixel: 3
+    }
+
+    return imagePixelModule
+  } else if (type === 'generalSeriesModule') {
+    const generalSeriesModule = {
+      modality: 'SC',
+      seriesNumber: 1,
+      seriesDescription: 'Color',
+      seriesDate: '20190201',
+      seriesTime: '120000',
+      seriesInstanceUID: '1.2.276.0.7230010.3.1.4.83233.20190201120000.1'
+    }
+
+    return generalSeriesModule
+  } else if (type === 'imagePlaneModule') {
+    const index = imageIds.indexOf(imageId)
+    // console.warn(index);
+    const imagePlaneModule = {
+      imageOrientationPatient: [1, 0, 0, 0, 1, 0],
+      imagePositionPatient: [0, 0, index * 5],
+      pixelSpacing: [1, 1],
+      columnPixelSpacing: 1,
+      rowPixelSpacing: 1,
+      frameOfReferenceUID: 'FORUID',
+      columns: 2048,
+      rows: 1216,
+      rowCosines: [1, 0, 0],
+      columnCosines: [0, 1, 0],
+      // setting useDefaultValues to true signals the calibration values above cannot be trusted
+      // and units should be displayed in pixels
+      usingDefaultValues: true
+    }
+
+    return imagePlaneModule
+  } else if (type === 'voiLutModule') {
+    return {
+      // According to the DICOM standard, the width is the number of samples
+      // in the input, so 256 samples.
+      windowWidth: [256],
+      // The center is offset by 0.5 to allow for an integer value for even
+      // sample counts
+      windowCenter: [128]
+    }
+  } else if (type === 'modalityLutModule') {
+    return {
+      rescaleSlope: 1,
+      rescaleIntercept: 0
+    }
+  } else {
+    return undefined
+  }
+}

src/views/trials/trials-panel/reading/visit-review/js/registerWebImageLoader.js

@@ -0,0 +1,244 @@
+import * as cornerstone from '@cornerstonejs/core'
+const canvas = document.createElement('canvas')
+let lastImageIdDrawn
+
+// Todo: this loader should exist in a separate package in the same monorepo
+
+/**
+ * creates a cornerstone Image object for the specified Image and imageId
+ *
+ * @param image - An Image
+ * @param imageId - the imageId for this image
+ * @returns Cornerstone Image Object
+ */
+function createImage(image, imageId) {
+  // extract the attributes we need
+  const rows = image.naturalHeight
+  const columns = image.naturalWidth
+
+  function getPixelData(targetBuffer) {
+    const imageData = getImageData()
+
+    let targetArray
+
+    // Check if targetBuffer is provided for volume viewports
+    if (targetBuffer) {
+      targetArray = new Uint8Array(
+        targetBuffer.arrayBuffer,
+        targetBuffer.offset,
+        targetBuffer.length
+      )
+    } else {
+      targetArray = new Uint8Array(imageData.width * imageData.height * 3)
+    }
+
+    // modify original image data and remove alpha channel (RGBA to RGB)
+    convertImageDataToRGB(imageData, targetArray)
+
+    return targetArray
+  }
+
+  function convertImageDataToRGB(imageData, targetArray) {
+    for (let i = 0, j = 0; i < imageData.data.length; i += 4, j += 3) {
+      targetArray[j] = imageData.data[i]
+      targetArray[j + 1] = imageData.data[i + 1]
+      targetArray[j + 2] = imageData.data[i + 2]
+    }
+  }
+
+  function getImageData() {
+    let context
+
+    if (lastImageIdDrawn === imageId) {
+      context = canvas.getContext('2d')
+    } else {
+      canvas.height = image.naturalHeight
+      canvas.width = image.naturalWidth
+      context = canvas.getContext('2d')
+      context.drawImage(image, 0, 0)
+      lastImageIdDrawn = imageId
+    }
+
+    return context.getImageData(0, 0, image.naturalWidth, image.naturalHeight)
+  }
+
+  function getCanvas() {
+    if (lastImageIdDrawn === imageId) {
+      return canvas
+    }
+
+    canvas.height = image.naturalHeight
+    canvas.width = image.naturalWidth
+    const context = canvas.getContext('2d')
+
+    context.drawImage(image, 0, 0)
+    lastImageIdDrawn = imageId
+
+    return canvas
+  }
+
+  // Extract the various attributes we need
+  return {
+    imageId,
+    minPixelValue: 0,
+    maxPixelValue: 255,
+    slope: 1,
+    intercept: 0,
+    windowCenter: 128,
+    windowWidth: 255,
+    getPixelData,
+    getCanvas,
+    getImage: () => image,
+    rows,
+    columns,
+    height: rows,
+    width: columns,
+    color: true,
+    // we converted the canvas rgba already to rgb above
+    rgba: false,
+    columnPixelSpacing: 1, // for web it's always 1
+    rowPixelSpacing: 1, // for web it's always 1
+    invert: false,
+    sizeInBytes: rows * columns * 3,
+    numberOfComponents: 3
+  }
+}
+
+function arrayBufferToImage(arrayBuffer) {
+  return new Promise((resolve, reject) => {
+    const image = new Image()
+    const arrayBufferView = new Uint8Array(arrayBuffer)
+    const blob = new Blob([arrayBufferView])
+    const urlCreator = window.URL || window.webkitURL
+    const imageUrl = urlCreator.createObjectURL(blob)
+
+    image.src = imageUrl
+    image.onload = () => {
+      resolve(image)
+      urlCreator.revokeObjectURL(imageUrl)
+    }
+
+    image.onerror = (error) => {
+      urlCreator.revokeObjectURL(imageUrl)
+      reject(error)
+    }
+  })
+}
+
+//
+// This is a cornerstone image loader for web images such as PNG and JPEG
+//
+const options = {
+  // callback allowing customization of the xhr (e.g. adding custom auth headers, cors, etc)
+  beforeSend: (xhr) => {
+    // xhr
+  }
+}
+
+// Loads an image given a url to an image
+function loadImage(uri, imageId) {
+  const xhr = new XMLHttpRequest()
+
+  xhr.open('GET', uri, true)
+  xhr.responseType = 'arraybuffer'
+  options.beforeSend(xhr)
+
+  xhr.onprogress = function(oProgress) {
+    if (oProgress.lengthComputable) {
+      // evt.loaded the bytes browser receive
+      // evt.total the total bytes set by the header
+      const loaded = oProgress.loaded
+      const total = oProgress.total
+      const percentComplete = Math.round((loaded / total) * 100)
+
+      const eventDetail = {
+        imageId,
+        loaded,
+        total,
+        percentComplete
+      }
+
+      cornerstone.triggerEvent(
+        cornerstone.eventTarget,
+        'cornerstoneimageloadprogress',
+        eventDetail
+      )
+    }
+  }
+
+  const promise = new Promise((resolve, reject) => {
+    xhr.onload = function() {
+      const imagePromise = arrayBufferToImage(this.response)
+
+      imagePromise
+        .then((image) => {
+          const imageObject = createImage(image, imageId)
+
+          resolve(imageObject)
+        }, reject)
+        .catch((error) => {
+          console.error(error)
+        })
+    }
+    xhr.onerror = function(error) {
+      reject(error)
+    }
+
+    xhr.send()
+  })
+
+  const cancelFn = () => {
+    xhr.abort()
+  }
+
+  return {
+    promise,
+    cancelFn
+  }
+}
+
+function registerWebImageLoader(imageLoader) {
+  imageLoader.registerImageLoader('web', _loadImageIntoBuffer)
+}
+
+/**
+ * Small stripped down loader from cornerstoneDICOMImageLoader
+ * Which doesn't create cornerstone images that we don't need
+ */
+function _loadImageIntoBuffer(imageId, options) {
+  const uri = imageId.replace('web:', '')
+
+  const promise = new Promise((resolve, reject) => {
+    // get the pixel data from the server
+    loadImage(uri, imageId)
+      .promise.then(
+        (image) => {
+          if (
+            !options?.targetBuffer?.length ||
+            !options?.targetBuffer?.offset
+          ) {
+            resolve(image)
+            return
+          }
+
+          // @ts-ignore
+          image.getPixelData(options.targetBuffer)
+
+          resolve(true)
+        },
+        (error) => {
+          reject(error)
+        }
+      )
+      .catch((error) => {
+        reject(error)
+      })
+  })
+
+  return {
+    promise,
+    cancelFn: undefined
+  }
+}
+
+export default registerWebImageLoader

src/views/trials/trials-panel/setting/trial-config/components/logicalConfig.vue

@@ -49,6 +49,7 @@
       <el-form-item
         :label="$t('trials:logincCfg:form:subjectNum2')"
         prop="IsSubjectSecondCodeView"
+        v-if="showMore"
       >
         <el-radio-group
           v-model="form.IsSubjectSecondCodeView"
@@ -103,6 +104,7 @@
       <el-form-item
         :label="$t('trials:logincCfg:form:subjectAge')"
         prop="IsHaveSubjectAge"
+        v-if="showMore"
       >
         <el-radio-group
           v-model="form.IsHaveSubjectAge"
@@ -121,6 +123,7 @@
       <el-form-item
         :label="$t('trials:logincCfg:form:subjectGender')"
         prop="IsSubjectSexView"
+        v-if="showMore"
       >
         <el-radio-group
           v-model="form.IsSubjectSexView"
@@ -152,6 +155,7 @@
       <el-form-item
         :label="$t('trials:logincCfg:form:imageCopy')"
         prop="IsImageReplicationAcrossTrial"
+        v-if="showMore"
       >
         <el-radio-group
           v-model="form.IsImageReplicationAcrossTrial"
@@ -203,6 +207,45 @@
           @click="handleSetModality"
         />
       </el-form-item>
+      <!--展示检查名称-->
+      <el-form-item
+        :label="$t('trials:logincCfg:form:IsShowStudyName ')"
+        prop="IsShowStudyName"
+        v-if="showMore"
+      >
+        <el-radio-group
+          v-model="form.IsShowStudyName"
+          :disabled="form.IsTrialBasicLogicConfirmed && !isEdit"
+          @input="IsShowStudyNameChange"
+        >
+          <el-radio
+            :label="item.value"
+            v-for="item in $d.YesOrNo"
+            :key="item.id"
+            >{{ item.label }}
+          </el-radio>
+        </el-radio-group>
+      </el-form-item>
+      <!-- 检查名称 -->
+      <el-form-item
+        :label="$t('trials:logincCfg:form:StudyNameList')"
+        prop="StudyNameTypes"
+        v-if="form.IsShowStudyName && showMore"
+      >
+        <el-input
+          v-model="form.StudyNameTypes"
+          type="textarea"
+          :autosize="{ minRows: 2, maxRows: 8 }"
+          style="width: 80%"
+          disabled
+        />
+        <el-button
+          :disabled="form.IsTrialBasicLogicConfirmed && !isEdit"
+          icon="el-icon-plus"
+          circle
+          @click="handleSetStudyName"
+        />
+      </el-form-item>
       <!-- 影像质疑超限天数 -->
       <el-form-item
         :label="$t('trials:logincCfg:form:exceededDays')"
@@ -215,6 +258,19 @@
           :disabled="form.IsTrialBasicLogicConfirmed && !isEdit"
         />
       </el-form-item>
+      <el-form-item>
+        <div
+          :class="{ showMore: true, isCheck: showMore }"
+          @click.stop="showMore = !showMore"
+        >
+          <i class="el-icon-arrow-down"></i>
+          <span>{{
+            showMore
+              ? $t('trials:logincCfg:button:packUp')
+              : $t('trials:logincCfg:button:more')
+          }}</span>
+        </div>
+      </el-form-item>
       <el-form-item>
         <!-- 保存 -->
         <el-button
@@ -279,7 +335,8 @@
           v-if="
             (form.IsTrialBasicLogicConfirmed === false ||
               (form.IsTrialBasicLogicConfirmed === true && isEdit)) &&
-            hasPermi(['trials:trials-panel:setting:trial-config:save'])
+            hasPermi(['trials:trials-panel:setting:trial-config:save']) &&
+            showMore
           "
         >
           {{ $t('common:button:terminology') }}
@@ -748,6 +805,121 @@
       :visible.sync="terminologyVisible"
       :DATA.sync="form.TrialObjectNameList"
     />
+    <el-dialog
+      v-if="studyNameListVisible"
+      :visible.sync="studyNameListVisible"
+      :close-on-click-modal="false"
+      :title="$t('trials:logincCfg:form:studyName')"
+      custom-class="base-dialog-wrapper"
+      width="400px"
+    >
+      <div class="base-dialog-body" style="position: relative">
+        <el-button
+          size="small"
+          type="primary"
+          @click="addStudyName_model.visible = true"
+          style="position: absolute; top: 10px; right: 10px; z-index: 9"
+        >
+          {{ $t('common:button:add') }}
+        </el-button>
+        <el-table
+          ref="studyNameTable"
+          v-loading="listLoading"
+          :data="trialStudyNameList"
+          stripe
+          height="400"
+          row-key="Name"
+          @selection-change="handleStudyNameSelectionChange"
+        >
+          <el-table-column
+            type="selection"
+            align="left"
+            width="45"
+            :reserve-selection="true"
+          />
+          <el-table-column
+            prop="Name"
+            :label="$t('trials:logincCfg:form:studyName')"
+          >
+            <template slot-scope="scope">
+              <div class="bodyPartName">
+                <span :title="isEN ? scope.row.EnName : scope.row.Name">{{
+                  isEN ? scope.row.EnName : scope.row.Name
+                }}</span>
+                <el-button
+                  circle
+                  icon="el-icon-delete"
+                  :title="$t('trials:logincCfg:form:StudyName:del')"
+                  @click.stop="handleDelStudyName(scope.row)"
+                />
+              </div>
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
+      <div
+        class="base-dialog-footer"
+        style="text-align: right; margin-top: 10px"
+      >
+        <el-button
+          size="small"
+          type="primary"
+          :disabled="listLoading"
+          @click="studyNameListVisible = false"
+        >
+          {{ $t('common:button:cancel') }}
+        </el-button>
+        <el-button
+          size="small"
+          type="primary"
+          :disabled="listLoading"
+          @click="handleConfirmStudyName"
+        >
+          {{ $t('common:button:confirm') }}
+        </el-button>
+      </div>
+    </el-dialog>
+    <!--新增检查名称-->
+    <base-model v-if="addStudyName_model.visible" :config="addStudyName_model">
+      <template slot="dialog-body">
+        <el-form
+          ref="addStudyNameForm"
+          :inline="true"
+          :model="addStudyNameForm"
+          class="demo-form-inline"
+          :rules="addStudyNamerules"
+        >
+          <el-form-item
+            :label="$t('trials:setting:form:studyName')"
+            prop="Name"
+            label-width="150px"
+          >
+            <el-input
+              v-model.trim="addStudyNameForm.Name"
+              clearable
+              type="textarea"
+              :rows="2"
+            ></el-input>
+          </el-form-item>
+          <el-form-item
+            :label="$t('trials:setting:form:bodyPart')"
+            style="display: none"
+            prop="bodyPartStr"
+            label-width="150px"
+          >
+            <el-input clearable :maxlength="50"></el-input>
+          </el-form-item>
+        </el-form>
+      </template>
+      <template slot="dialog-footer">
+        <el-button type="primary" @click="addOrUpdateTrialStudyName">
+          {{ $t('common:button:confirm') }}
+        </el-button>
+        <el-button @click="addStudyName_model.visible = false">
+          {{ $t('common:button:cancel') }}
+        </el-button>
+      </template>
+    </base-model>
   </div>
 </template>
 <script>
@@ -772,6 +944,7 @@ export default {
   components: { SignForm, ClinicalDataForm, BaseModel, terminology },
   data() {
     return {
+      showMore: false,
       form: {
         TrialId: '',
         IsNoticeSubjectCodeRule: false,
@@ -785,6 +958,9 @@ export default {
         // ClinicalInformationTransmissionEnum: 1,
         IsImageReplicationAcrossTrial: false,
         BodyPartTypes: '',
+        StudyNameTypes: '',
+        IsShowStudyName: null,
+        StudyNameList: [],
         BodyPartTypeList: [],
         Modalitys: '',
         ModalityList: [],
@@ -855,6 +1031,13 @@ export default {
             trigger: 'blur',
           },
         ],
+        StudyNameTypes: [
+          {
+            required: true,
+            message: this.$t('trials:trialCfg:formRule:bodyPart'),
+            trigger: 'blur',
+          },
+        ],
         // Modalitys: [
         //   { required: true, message: this.$t('trials:trialCfg:formRule:modality'), trigger: 'blur' },
         //   { max: 500, message: `${this.$t('common:ruleMessage:maxLength')} 500` }
@@ -894,19 +1077,32 @@ export default {
       listLoading: false,
       modalityListVisible: false,
       bodyPartListVisible: false,
+      studyNameListVisible: false,
       selectedList: [],
       selectedBodyParts: [],
       trialBodyPartList: [],
+      trialStudyNameList: [],
       addBodyPart_model: {
         visible: false,
         title: this.$t('trials:setting:button:add'),
         width: '500px',
         appendToBody: true,
       },
+      addStudyName_model: {
+        visible: false,
+        title: this.$t('trials:setting:button:add'),
+        width: '500px',
+        appendToBody: true,
+      },
       addBodyPartForm: {
         bodyPartStr: null,
         Id: null,
       },
+      addStudyNameForm: {
+        Name: null,
+        EnName: null,
+        IeChoose: false,
+      },
       addBodyPartrules: {
         bodyPartStr: [
           {
@@ -932,6 +1128,31 @@ export default {
           },
         ],
       },
+      addStudyNamerules: {
+        Name: [
+          {
+            required: true,
+            message: this.$t('trials:setting:format:notStudyName'),
+            trigger: ['blur', 'change'],
+          },
+          {
+            validator: (rule, value, callback) => {
+              let flag = this.trialStudyNameList.some(
+                (item) => item.Name === value
+              )
+              if (flag) {
+                callback(
+                  new Error(this.$t('trials:setting:format:hasStudyName'))
+                )
+              } else {
+                callback()
+              }
+            },
+            message: this.$t('trials:setting:format:hasStudyName'),
+            trigger: ['blur', 'change'],
+          },
+        ],
+      },
       errMessage: null,
 
       renderFunc(h, option) {
@@ -947,6 +1168,11 @@ export default {
   // created() {
   //   this.getTrialBodyPartList();
   // },
+  computed: {
+    isEN() {
+      return this.$i18n.locale !== 'zh'
+    },
+  },
   methods: {
     openTerminology() {
       this.terminologyVisible = true
@@ -1003,6 +1229,30 @@ export default {
     handleBodyPartSelectionChange(val) {
       this.selectedBodyParts = val
     },
+    IsShowStudyNameChange(val) {
+      // if (!val) {
+      //   if (this.form.StudyNameList && this.form.StudyNameList.length > 0) {
+      //     this.form.StudyNameList.forEach((item) => {
+      //       item.IsChoose = false
+      //     })
+      //   } else {
+      //     this.form.StudyNameList = []
+      //   }
+      //   thiss.form.StudyNameTypes = null
+      // }
+    },
+    handleStudyNameSelectionChange(val) {
+      let data = []
+      if (val) {
+        data = val.map((item) => item.Name)
+      }
+      this.trialStudyNameList.forEach((item) => {
+        item.IsChoose = false
+        if (data.includes(item.Name)) {
+          item.IsChoose = true
+        }
+      })
+    },
     // 获取检查部位
     async getTrialBodyPartList(data) {
       try {
@@ -1073,6 +1323,19 @@ export default {
         }
       }
     },
+    async addOrUpdateTrialStudyName() {
+      let validate = await this.$refs.addStudyNameForm.validate()
+      if (!validate) return
+      this.addStudyNameForm.EnName = this.addStudyNameForm.Name
+      let data = { ...this.addStudyNameForm }
+      this.trialStudyNameList.push(data)
+      this.addStudyNameForm = {
+        EnName: null,
+        Name: null,
+        IsChoose: false,
+      }
+      this.addStudyName_model.visible = false
+    },
     // 编辑检查部位
     handleEditBodyPart(item) {
       this.addBodyPartForm.bodyPartStr = item.Name
@@ -1081,6 +1344,12 @@ export default {
       this.addBodyPart_model.title = this.$t('trials:setting:button:edit')
       this.addBodyPart_model.visible = true
     },
+    handleDelStudyName(item) {
+      let index = this.trialStudyNameList.findIndex(
+        (data) => item.Name === data.Name
+      )
+      this.trialStudyNameList.splice(index, 1)
+    },
     handleSetBodyPart() {
       this.bodyPartListVisible = true
       this.$nextTick(() => {
@@ -1092,6 +1361,19 @@ export default {
         this.toggleBodyPartSelection(a)
       })
     },
+    handleSetStudyName() {
+      this.studyNameListVisible = true
+      this.trialStudyNameList = []
+      this.form.StudyNameList.forEach((item) => {
+        this.trialStudyNameList.push({
+          ...item,
+        })
+      })
+      this.$nextTick(() => {
+        let select = this.trialStudyNameList.filter((item) => item.IsChoose)
+        this.toggleStudyNameSelection(select)
+      })
+    },
     toggleBodyPartSelection(rows) {
       if (rows) {
         rows.forEach((row) => {
@@ -1101,6 +1383,15 @@ export default {
         this.$refs.bodyPartTable.clearSelection()
       }
     },
+    toggleStudyNameSelection(rows) {
+      if (rows) {
+        rows.forEach((row) => {
+          this.$refs.studyNameTable.toggleRowSelection(row)
+        })
+      } else {
+        this.$refs.studyNameTable.clearSelection()
+      }
+    },
     handleConfirmBodyParts() {
       this.form.BodyPartTypeList = Object.assign(
         [],
@@ -1112,6 +1403,14 @@ export default {
       this.form.BodyPartTypes = bodyPartTypes.join(' | ')
       this.bodyPartListVisible = false
     },
+    handleConfirmStudyName() {
+      var studyNameTypes = this.trialStudyNameList.filter((i) => i.IsChoose)
+      this.form.StudyNameTypes = this.isEN
+        ? studyNameTypes.map((item) => item.EnName).join(', ')
+        : studyNameTypes.map((item) => item.Name).join(', ')
+      this.form.StudyNameList = this.trialStudyNameList
+      this.studyNameListVisible = false
+    },
     // 配置信息保存
     handleSave() {
       this.$refs['logicalConfigForm'].validate((valid) => {
@@ -1305,6 +1604,16 @@ export default {
           NewVal: this.form.ModalityListStr,
           OldVal: this.initialForm.ModalityListStr,
         },
+        {
+          Name: this.$t('trials:logincCfg:form:IsShowStudyName '),
+          NewVal: this.$fd('YesOrNo', this.form.IsShowStudyName),
+          OldVal: this.$fd('YesOrNo', this.initialForm.IsShowStudyName),
+        },
+        {
+          Name: this.$t('trials:logincCfg:form:StudyNameList'),
+          NewVal: this.form.StudyNameTypes,
+          OldVal: this.initialForm.StudyNameTypes,
+        },
         {
           Name: this.$t('trials:logincCfg:form:exceededDays'),
           NewVal: this.form.ChangeDefalutDays,
@@ -1355,6 +1664,16 @@ export default {
       let BodyPartTypes = res.BodyPartTypes
       this.form.BodyPartTypes = ''
       this.form.BodyPartTypeList = BodyPartTypes.split('|')
+      let StudyNameTypes = this.form.StudyNameList.filter(
+        (item) => item.IsChoose
+      )
+      this.form.StudyNameTypes = ''
+      if (StudyNameTypes && StudyNameTypes.length > 0) {
+        this.form.StudyNameTypes = this.isEN
+          ? StudyNameTypes.map((item) => item.EnName).join(', ')
+          : StudyNameTypes.map((item) => item.Name).join(', ')
+      }
+
       let r = await this.getTrialBodyPartList()
       if (r) {
         var bodyPartTypes = this.form.BodyPartTypeList.map((i) => {
@@ -1596,4 +1915,16 @@ export default {
     margin: 0;
   }
 }
+.showMore {
+  cursor: pointer;
+  color: #409eff;
+  i {
+    transition: 0.3s;
+  }
+}
+.showMore.isCheck {
+  i {
+    transform: rotate(180deg);
+  }
+}
 </style>

src/views/trials/trials-panel/setting/trial-config/components/processConfig.vue

@@ -139,6 +139,25 @@
           </el-radio>
         </el-radio-group>
       </el-form-item>
+      <!--图像格式-->
+      <el-form-item
+        :label="$t('trials:processCfg:form:ImageFormatList')"
+        prop="ImageFormatList"
+        v-if="[0, 2].includes(form.CollectImagesEnum)"
+      >
+        <el-checkbox-group
+          v-model="form.ImageFormatList"
+          :disabled="form.IsTrialProcessConfirmed && !isEdit"
+        >
+          <el-checkbox
+            v-for="item in $d.ImageFormat"
+            :label="item.value"
+            :key="item.id"
+          >
+            {{ item.label }}
+          </el-checkbox>
+        </el-checkbox-group>
+      </el-form-item>
       <!-- 修约小数位数 -->
       <!-- <el-form-item
         :label="$t('trials:processCfg:form:digitPlaces')"
@@ -1186,6 +1205,7 @@ export default {
         ClinicalDataSetNamesStr: '',
         QCProcessEnum: null,
         CollectImagesEnum: null,
+        ImageFormatList: [],
         IsImageConsistencyVerification: null,
         ReadingMode: null,
         // ImagePlatform: null,
@@ -1225,6 +1245,14 @@ export default {
             trigger: ['blur', 'change'],
           },
         ],
+        ImageFormatList: [
+          {
+            type: 'array',
+            required: true,
+            message: this.$t('common:ruleMessage:select'),
+            trigger: ['blur', 'change'],
+          },
+        ],
         QCProcessEnum: [
           {
             required: true,
@@ -1499,6 +1527,11 @@ export default {
             this.initialForm.CollectImagesEnum
           ),
         },
+        {
+          Name: this.$t('trials:processCfg:form:ImageFormatList'), // 图像格式
+          NewVal: this.form.ImageFormatList.join(', '),
+          OldVal: this.initialForm.ImageFormatList.join(', '),
+        },
         // {
         //   Name: this.$t('trials:processCfg:form:criterion'), // 阅片标准
         //   NewVal: criterions.length > 0 ? criterions.join(', ') : '',

src/views/trials/trials-panel/trial-summary/trial-document/components/fileRecord/index.vue

@@ -0,0 +1,847 @@
+<template>
+  <box-content>
+    <div class="title">
+      {{ TITLE }}
+    </div>
+    <el-form :inline="true" size="mini" class="base-search-form">
+      <el-form-item
+        :label="$t('trials:trialDocument:fileRecord:form:isConfirmRecord')"
+        v-if="isManage && hasEdit && !viewStatus"
+      >
+        <el-radio-group
+          v-model="rowData.IsConfirmRecord"
+          :disabled="rowBtnStatus === 'edit'"
+        >
+          <el-radio
+            :label="item.value"
+            v-for="item in $d.YesOrNo"
+            :key="item.id"
+            >{{ item.label }}
+          </el-radio>
+        </el-radio-group>
+      </el-form-item>
+      <el-form-item
+        :label="$t('trials:trialDocument:fileRecord:form:isEnable')"
+        v-if="isManage && hasEdit && !viewStatus"
+      >
+        <el-radio-group
+          v-model="rowData.IsEnable"
+          :disabled="rowBtnStatus === 'edit'"
+        >
+          <el-radio
+            :label="item.value"
+            v-for="item in $d.YesOrNo"
+            :key="item.id"
+            >{{ item.label }}
+          </el-radio>
+        </el-radio-group>
+      </el-form-item>
+      <el-form-item v-if="isManage && hasEdit && !viewStatus">
+        <el-button
+          type="primary"
+          size="mini"
+          @click="rowBtnStatus = 'save'"
+          v-if="rowBtnStatus === 'edit'"
+        >
+          {{ $t('common:button:edit') }}
+        </el-button>
+        <el-button
+          type="primary"
+          size="mini"
+          :loading="rowBtnLoading"
+          @click="saveRowData"
+          v-if="rowBtnStatus === 'save'"
+        >
+          {{ $t('common:button:save') }}
+        </el-button>
+      </el-form-item>
+    </el-form>
+    <!-- 搜索框 -->
+    <div class="search" style="position: relative">
+      <el-form :inline="true" size="mini" class="base-search-form">
+        <el-form-item
+          :label="$t('trials:trialDocument:fileRecord:search:name')"
+        >
+          <el-input
+            v-model="searchData.FileName"
+            style="width: 100px"
+            clearable
+          />
+        </el-form-item>
+        <el-form-item
+          :label="$t('trials:trialDocument:fileRecord:search:isAuthorizedView')"
+          v-if="isManage && !viewStatus"
+        >
+          <el-select
+            v-if="!viewStatus"
+            v-model="searchData.IsAuthorizedView"
+            style="width: 100px"
+            placeholder=""
+          >
+            <el-option
+              v-for="item in $d.YesOrNo"
+              :key="item.id"
+              :label="item.label"
+              :value="item.value"
+            >
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="el-icon-search" @click="handleSearch">
+            {{ $t('common:button:search') }}
+          </el-button>
+          <el-button
+            type="primary"
+            icon="el-icon-refresh-left"
+            @click="handleReset"
+          >
+            {{ $t('common:button:reset') }}
+          </el-button>
+        </el-form-item>
+        <el-form-item v-if="isManage && !viewStatus">
+          <el-button
+            type="primary"
+            :disabled="selectTable.length <= 0"
+            size="mini"
+            v-if="hasAccredit && isManage && !viewStatus"
+            @click.stop="auth"
+          >
+            {{ $t('trials:trialDocument:fileRecord:button:accredit') }}
+          </el-button>
+          <el-button
+            type="primary"
+            size="mini"
+            v-if="hasEdit && isManage && !viewStatus"
+            @click.stop="openFile(false)"
+          >
+            {{ $t('trials:trialDocument:fileRecord:button:uploadFile') }}
+          </el-button>
+          <el-button
+            type="primary"
+            size="mini"
+            v-if="hasEdit && isManage && !viewStatus"
+            @click.stop="openFile(true)"
+          >
+            {{ $t('trials:trialDocument:fileRecord:button:uploadFolder') }}
+          </el-button>
+          <el-button
+            type="primary"
+            icon="el-icon-bottom"
+            size="mini"
+            :disabled="selectTable.length <= 0"
+            v-if="hasDownLoad && isManage && !viewStatus"
+            @click.stop="downLoad"
+          >
+            {{ $t('trials:trialDocument:fileRecord:button:downLoad') }}
+          </el-button>
+          <el-button
+            type="primary"
+            size="mini"
+            v-if="hasDel && isManage && !viewStatus"
+            :disabled="selectTable.length <= 0"
+            @click.stop="delList"
+          >
+            {{ $t('trials:trialDocument:fileRecord:button:del') }}
+          </el-button>
+        </el-form-item>s
+      </el-form>
+    </div>
+
+    <el-table
+      v-loading="loading"
+      v-adaptive="{ bottomOffset: 75 }"
+      :data="list"
+      stripe
+      height="100"
+      style="width: 100%"
+      @sort-change="handleSortByColumn"
+      @selection-change="handleSelectionChange"
+    >
+      <el-table-column type="selection" width="55" />
+
+      <!--名称-->
+      <el-table-column
+        prop="FileName"
+        :label="$t('trials:trialDocument:fileRecord:table:name')"
+        show-overflow-tooltip
+        sortable="custom"
+      >
+        <template slot-scope="scope">
+          <div
+            v-if="
+              scope.row.TrialFileRecord &&
+              scope.row.TrialFileRecord.TrialFileTypeId
+            "
+            style="display: flex; align-items: center"
+          >
+            <span class="fileName">{{
+              scope.row.TrialFileRecord.FileName
+            }}</span>
+            <div v-if="isManage && !viewStatus" class="fileBtnBox">
+              <i
+                class="el-icon-view"
+                @click.stop="preview(scope.row.TrialFileRecord)"
+              />
+              <i
+                class="el-icon-download"
+                v-if="hasDownLoad"
+                @click.stop="downLoad(false, scope.row.TrialFileRecord, 'file')"
+              />
+              <i
+                class="el-icon-delete"
+                v-if="hasDel"
+                @click.stop="delFile(scope.row, 'Trial')"
+              />
+            </div>
+          </div>
+          <i
+            v-else-if="isManage && !viewStatus && hasEdit"
+            class="el-icon-upload2"
+            style="cursor: pointer; color: #409eff"
+            @click.stop="upload(scope.row, 'Trial', ['.pdf'])"
+          />
+        </template>
+      </el-table-column>
+      <el-table-column
+        prop="fileType"
+        :label="$t('trials:trialDocument:fileRecord:table:fileType')"
+        show-overflow-tooltip
+      >
+        <template slot-scope="scope">
+          <span v-if="scope.row.TrialFileRecord">{{
+            scope.row.TrialFileRecord.FileFormat
+          }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column
+        prop="fileType"
+        :label="$t('trials:trialDocument:fileRecord:table:fileSize')"
+        show-overflow-tooltip
+      >
+        <template slot-scope="scope">
+          <span v-if="scope.row.TrialFileRecord">{{
+            scope.row.TrialFileRecord.FileSize
+              ? fileSizeFormatter(scope.row.TrialFileRecord.FileSize)
+              : ''
+          }}</span>
+        </template>
+      </el-table-column>
+      <!--历史记录-->
+      <el-table-column
+        prop="HistoryFileRecord"
+        :label="$t('trials:trialDocument:fileRecord:table:historyFileRecord')"
+        show-overflow-tooltip
+        sortable="custom"
+        v-if="isManage && !viewStatus"
+      >
+        <template slot-scope="scope">
+          <div
+            v-if="
+              scope.row.HistoryFileRecord &&
+              scope.row.HistoryFileRecord.TrialFileTypeId
+            "
+            style="display: flex; align-items: center"
+          >
+            <span class="fileName">{{
+              scope.row.HistoryFileRecord.FileName
+            }}</span>
+            <div v-if="isManage && !viewStatus" class="fileBtnBox">
+              <i
+                class="el-icon-download"
+                v-if="hasDownLoad"
+                @click.stop="
+                  downLoad(false, scope.row.HistoryFileRecord, 'file')
+                "
+              />
+              <i
+                class="el-icon-delete"
+                v-if="hasDel"
+                @click.stop="delFile(scope.row, 'History')"
+              />
+            </div>
+          </div>
+          <i
+            v-else-if="isManage && !viewStatus"
+            class="el-icon-upload2"
+            style="cursor: pointer; color: #409eff"
+            @click.stop="upload(scope.row, 'History', ['.zip'])"
+          />
+        </template>
+      </el-table-column>
+
+      <el-table-column
+        prop="IsAuthorizedView"
+        :label="$t('trials:trialDocument:fileRecord:table:isAuthorizedView')"
+        show-overflow-tooltip
+        sortable="custom"
+        v-if="isManage && !viewStatus"
+      >
+        <template slot-scope="scope">
+          <el-switch
+            v-if="isManage && !viewStatus && hasEdit"
+            v-model="scope.row.IsAuthorizedView"
+            @change="(val) => auth(false, scope.row, val)"
+            :active-value="true"
+            :inactive-value="false"
+            :active-text="$fd('YesOrNo', true)"
+            :inactive-text="$fd('YesOrNo', false)"
+          >
+          </el-switch>
+          <span v-else>{{ $fd('YesOrNo', scope.row.IsAuthorizedView) }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column
+        prop="UpdateTime"
+        :label="$t('trials:trialDocument:fileRecord:table:updateTime')"
+        show-overflow-tooltip
+        sortable="custom"
+      />
+      <el-table-column
+        prop="CreateTime"
+        :label="$t('trials:trialDocument:fileRecord:table:createTime')"
+        show-overflow-tooltip
+        sortable="custom"
+      />
+      <el-table-column
+        :label="$t('common:action:action')"
+        width="200"
+        fixed="right"
+      >
+        <template slot-scope="scope">
+          <el-button
+            icon="el-icon-view"
+            :title="$t('common:button:view')"
+            size="mini"
+            circle
+            :disabled="
+              !scope.row.TrialFileRecord || !scope.row.TrialFileRecord.FilePath
+            "
+            @click.stop="preview(scope.row.TrialFileRecord)"
+          />
+          <el-button
+            v-if="hasDownLoad && isManage && !viewStatus"
+            icon="el-icon-download"
+            :title="$t('trials:trialDocument:fileRecord:button:download')"
+            size="mini"
+            circle
+            @click.stop="downLoad(false, scope.row.TrialFileRecord, 'file')"
+          />
+          <el-button
+            v-if="hasDel && isManage && !viewStatus"
+            icon="el-icon-delete"
+            :title="$t('trials:trialDocument:fileRecord:button:delete')"
+            size="mini"
+            circle
+            @click.stop="handleDel(scope.row)"
+          />
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <!-- 分页组件 -->
+    <pagination
+      class="page"
+      :total="total"
+      :page.sync="searchData.PageIndex"
+      :limit.sync="searchData.PageSize"
+      @pagination="getList"
+    />
+    <upload-files
+      :config="config"
+      :faccept="faccept"
+      :uploadPath="uploadPath"
+      :limitLength="limitLength"
+      v-if="config.visible"
+      @close="close"
+      @uplaodFile="uplaodFile"
+    />
+  </box-content>
+</template>
+  <script>
+import {
+  addOrUpdateTrialFileType,
+  getTrialNormalRecordList,
+  deleteTrialNormalRecord,
+  authorizedTTrialNormalRecord,
+  addOrUpdateTrialNormalRecord,
+  batchAddTrialNormalRecord,
+  deleteTrialNormalRecordList,
+} from '@/api/dictionary'
+import { downLoadFile } from '@/utils/stream.js'
+import { deepClone } from '@/utils/index.js'
+import Pagination from '@/components/Pagination'
+import BoxContent from '@/components/BoxContent'
+import uploadFiles from '../uploadFiles.vue'
+const searchDataDefault = () => {
+  return {
+    IsAuthorizedView: null,
+    FileName: null,
+    PageIndex: 1,
+    PageSize: 20,
+    Asc: false,
+    SortField: 'FileName',
+  }
+}
+export default {
+  name: 'fileRecord',
+  components: { BoxContent, Pagination, uploadFiles },
+  props: {
+    viewStatus: {
+      type: Boolean,
+      default: true,
+    },
+    ArchiveTypeEnum: {
+      type: Number,
+      default: 0,
+    },
+    Id: {
+      type: String,
+      default: '',
+    },
+    rowData: {
+      type: Object,
+      default: () => {
+        return {}
+      },
+    },
+  },
+  data() {
+    return {
+      rowBtnStatus: 'edit', // edit 编辑 save 保存
+      rowBtnLoading: false,
+      searchData: searchDataDefault(),
+      loading: false,
+      list: [],
+      total: 0,
+      selectTable: [],
+      config: {
+        visible: false,
+        showClose: true,
+        width: '800px',
+        title: '',
+        appendToBody: false,
+        isFolder: false,
+      },
+      selectData: {},
+      selectKey: null,
+      uploadPath: null,
+      faccept: ['.pdf'],
+      limitLength: 0,
+    }
+  },
+  methods: {
+    // 新增列表数据
+    async uplaodFile(list) {
+      console.log(list, 'list')
+      try {
+        if (!list || list.length <= 0) return false
+        if (this.selectKey) {
+          this.selectData[`${this.selectKey}FileRecord`] = list[0]
+          this.loading = true
+          let res = await addOrUpdateTrialNormalRecord(this.selectData)
+          this.loading = false
+          if (res.IsSuccess) {
+            this.getList()
+          }
+          return false
+        }
+        let arr = []
+        list.forEach((item) => {
+          let obj = {
+            TrialId: this.$route.query.trialId,
+            TrialFileTypeId: this.Id,
+            IsAuthorizedView: true,
+            TrialFileRecord: item,
+            HistoryFileRecord: null,
+          }
+          arr.push(obj)
+        })
+        this.loading = true
+        let res = await batchAddTrialNormalRecord({
+          TrialNormalRecordList: arr,
+        })
+        this.loading = false
+        if (res.IsSuccess) {
+          this.getList()
+        }
+      } catch (err) {
+        this.loading = false
+        console.log(err)
+      }
+    },
+    // 上传单个文件
+    upload(row, key, faccept = []) {
+      this.faccept = faccept
+      this.selectData = deepClone(row)
+      this.config.title = this.$t(
+        'trials:trialDocument:fileRecord:form:title:uploadFile'
+      )
+      this.limitLength = 1
+      this.selectKey = key
+      this.config.visible = true
+      this.config.isFolder = false
+    },
+    // 删除文件
+    async delFile(row, key) {
+      try {
+        let confirm = await this.$confirm(
+          this.$t('trials:trialDocument:fileRecord:message:deleteFile'),
+          {
+            type: 'warning',
+            distinguishCancelAndClose: true,
+          }
+        )
+        if (confirm !== 'confirm') return false
+        let data = deepClone(row)
+        data[`${key}FileRecord`] = null
+        this.loading = true
+        let res = await addOrUpdateTrialNormalRecord(data)
+        this.loading = false
+        if (res.IsSuccess) {
+          this.$message.success(this.$t('common:message:deletedSuccessfully'))
+          this.getList()
+        }
+      } catch (err) {
+        this.loading = false
+        console.log(err)
+      }
+    },
+    // 下载
+    async downLoad(isArray = true, row, type = 'zip') {
+      try {
+        if (type === 'file') {
+          return await downLoadFile(
+            this.OSSclientConfig.basePath + row.FilePath,
+            row.FileName
+          )
+        }
+        let { files, name } = this.formatDownloadFile(isArray, row)
+        let res = await downLoadFile(files, name, type)
+        // if (res && this.downloadId) {
+        //   this.downloadImageSuccess()
+        // }
+      } catch (err) {
+        console.log(err)
+      }
+    },
+    // 格式化下载文件路径
+    formatDownloadFile(isArray = true, row) {
+      let files = [],
+        name = `${this.TITLE}_${new Date().getTime()}.zip`,
+        arr = ['Trial', 'History']
+      if (!isArray) {
+        name = `${row.Name}_${row.Version}_${new Date().getTime()}.zip`
+        arr.forEach((key) => {
+          if (row[`${key}FileRecord`] && row[`${key}FileRecord`].FilePath) {
+            let obj = {
+              name: `${row[`${key}FileRecord`].FileName.substring(
+                0,
+                row[`${key}FileRecord`].FileName.lastIndexOf('.')
+              )}__${row.Version}${row[`${key}FileRecord`].FileName.substring(
+                row[`${key}FileRecord`].FileName.lastIndexOf('.')
+              ).toLocaleLowerCase()}`,
+              url:
+                this.OSSclientConfig.basePath +
+                row[`${key}FileRecord`].FilePath,
+            }
+            files.push(obj)
+          }
+        })
+      } else {
+        this.selectTable.forEach((item) => {
+          arr.forEach((key) => {
+            if (item[`${key}FileRecord`] && item[`${key}FileRecord`].FilePath) {
+              let obj = {
+                name: `${item[`${key}FileRecord`].FileName.substring(
+                  0,
+                  item[`${key}FileRecord`].FileName.lastIndexOf('.')
+                )}__${new Date().getTime()}${item[
+                  `${key}FileRecord`
+                ].FileName.substring(
+                  item[`${key}FileRecord`].FileName.lastIndexOf('.')
+                ).toLocaleLowerCase()}`,
+                url:
+                  this.OSSclientConfig.basePath +
+                  item[`${key}FileRecord`].FilePath,
+              }
+              files.push(obj)
+            }
+          })
+        })
+      }
+      return { files, name }
+    },
+    // 授权
+    async auth(isArray = true, row, IsAuthorizedView) {
+      try {
+        let data = {}
+        if (isArray) {
+          data = {
+            Ids: this.selectTable.map((item) => item.Id),
+            IsAuthorizedView: true,
+          }
+        } else {
+          data = {
+            Ids: [row.Id],
+            IsAuthorizedView,
+          }
+        }
+        this.loading = true
+        let res = await authorizedTTrialNormalRecord(data)
+        this.loading = false
+        if (res.IsSuccess) {
+          this.$t('trials:trialDocument:fileRecord:message:authSuccessfully')
+          if (isArray) {
+            this.getList()
+          }
+        }
+      } catch (err) {
+        this.loading = false
+        if (!isArray) {
+          row.IsAuthorizedView = !row.IsAuthorizedView
+        }
+        console.log(err)
+      }
+    },
+    // 删除列表数据
+    handleDel(row) {
+      this.$confirm(
+        this.$t('trials:trialDocument:fileRecord:message:deleteMessage'),
+        {
+          type: 'warning',
+          distinguishCancelAndClose: true,
+        }
+      )
+        .then(() => {
+          this.loading = true
+          deleteTrialNormalRecord(row.Id)
+            .then((res) => {
+              this.loading = false
+              if (res.IsSuccess) {
+                this.getList()
+                this.$message.success(
+                  this.$t('common:message:deletedSuccessfully')
+                )
+              }
+            })
+            .catch((err) => {
+              this.loading = false
+              console.log(err)
+            })
+        })
+        .catch((err) => {
+          this.loading = false
+          console.log(err)
+        })
+    },
+    // 批量删除列表数据
+    delList() {
+      this.$confirm(
+        this.$t('trials:trialDocument:fileRecord:message:deleteMessage'),
+        {
+          type: 'warning',
+          distinguishCancelAndClose: true,
+        }
+      )
+        .then(() => {
+          let data = {
+            Ids: this.selectTable.map((item) => item.Id),
+          }
+          this.loading = true
+          deleteTrialNormalRecordList(data)
+            .then((res) => {
+              this.loading = false
+              if (res.IsSuccess) {
+                this.getList()
+                this.$message.success(
+                  this.$t('common:message:deletedSuccessfully')
+                )
+              }
+            })
+            .catch((err) => {
+              this.loading = false
+              console.log(err)
+            })
+        })
+        .catch((err) => {
+          this.loading = false
+          console.log(err)
+        })
+    },
+    async getList() {
+      try {
+        if (!this.Id) return false
+        this.searchData.TrialFileTypeId = this.Id
+        this.searchData.TrialId = this.$route.query.trialId
+        this.loading = true
+        let res = await getTrialNormalRecordList(this.searchData)
+        this.loading = false
+        if (res.IsSuccess) {
+          this.list = res.Result.CurrentPageData
+          this.total = res.Result.TotalCount
+        }
+      } catch (err) {
+        this.loading = false
+        console.log(err)
+      }
+    },
+    // 查询
+    handleSearch() {
+      this.searchData.PageIndex = 1
+      this.getList()
+    },
+    // 重置
+    handleReset() {
+      this.searchData = searchDataDefault()
+      this.getList()
+    },
+    // 排序
+    handleSortByColumn(column) {
+      if (column.order === 'ascending') {
+        this.searchData.Asc = true
+      } else {
+        this.searchData.Asc = false
+      }
+      this.searchData.SortField = column.prop
+      this.searchData.PageIndex = 1
+      this.getList()
+    },
+    handleSelectionChange(val) {
+      this.selectTable = val
+    },
+    // 保存菜单数据
+    async saveRowData() {
+      try {
+        this.rowBtnLoading = true
+        let res = await addOrUpdateTrialFileType(this.rowData)
+        this.rowBtnLoading = false
+        if (res.IsSuccess) {
+          this.rowBtnStatus = 'edit'
+          this.$emit('getMenu')
+          this.$message.success(this.$t('common:message:savedSuccessfully'))
+        }
+      } catch (err) {
+        console.log(err)
+        this.rowBtnLoading = false
+      }
+    },
+    // 预览
+    preview(row) {
+      if (!row.FilePath) return false
+      this.$preview({
+        path: row.FilePath || row.fullPath,
+        type: 'pdf',
+        title: row.FileName,
+      })
+    },
+    close() {
+      this.config.visible = false
+      // this.selectData = {}
+      // this.selectKey = null
+      this.faccept = ['.pdf']
+      this.limitLength = 0
+    },
+    fileSizeFormatter(size) {
+      if (!size) return
+      return (size / Math.pow(1024, 2)).toFixed(3) + 'M'
+    },
+    openFile(isFolder = false) {
+      this.selectData = {}
+      this.selectKey = null
+      this.faccept = ['.pdf']
+      this.limitLength = 0
+      this.config.title = this.$t(
+        'trials:trialDocument:fileRecord:form:title:uploadFile'
+      )
+      this.config.visible = true
+      this.config.isFolder = isFolder
+    },
+  },
+  watch: {
+    Id: {
+      handler() {
+        this.getList()
+      },
+      immediate: true,
+    },
+  },
+  created() {
+    let typeArr = ['', 'Report', 'Doc', 'Record', 'Reviewer', 'Template']
+    let types = typeArr[this.ArchiveTypeEnum]
+    this.uploadPath = `/${this.$route.query.trialId}/Document/${types}`
+    console.log(this.uploadPath, this.ArchiveTypeEnum)
+  },
+  computed: {
+    isEN() {
+      return this.$i18n.locale !== 'zh'
+    },
+    isInspect() {
+      return this.hasPermi([
+        'trials:trials-panel:trial-summary:trial-document:inspect',
+      ])
+    },
+    isManage() {
+      return this.hasPermi([
+        'trials:trials-panel:trial-summary:trial-document:manage',
+      ])
+    },
+    hasAdd() {
+      return this.hasPermi([
+        'trials:trials-panel:trial-summary:trial-document:add',
+      ])
+    },
+    hasEdit() {
+      return this.hasPermi([
+        'trials:trials-panel:trial-summary:trial-document:edit',
+      ])
+    },
+    hasDel() {
+      return this.hasPermi([
+        'trials:trials-panel:trial-summary:trial-document:del',
+      ])
+    },
+    hasDownLoad() {
+      return this.hasPermi([
+        'trials:trials-panel:trial-summary:trial-document:downLoad',
+      ])
+    },
+    hasAccredit() {
+      return this.hasPermi([
+        'trials:trials-panel:trial-summary:trial-document:accredit',
+      ])
+    },
+    TITLE() {
+      return `${this.$fd('ArchiveType', this.ArchiveTypeEnum)} — ${
+        this.isEN ? this.rowData.Name : this.rowData.NameCN
+      }`
+    },
+  },
+}
+</script>
+  <style lang="scss" scoped>
+.title {
+  line-height: 40px;
+  font-weight: bold;
+  margin-bottom: 10px;
+}
+.fileName {
+  display: inline-block;
+  max-width: calc(100% - 60px);
+  white-space: nowrap; /* 文本不换行 */
+  overflow: hidden; /* 超出部分隐藏 */
+  text-overflow: ellipsis;
+}
+.fileBtnBox {
+  display: inline-block;
+  width: 50px;
+  i {
+    cursor: pointer;
+    color: #409eff;
+    margin-right: 3px;
+    &:last-child {
+      margin: 0;
+    }
+  }
+}
+</style>

src/views/trials/trials-panel/trial-summary/trial-document/components/menu.vue

@@ -0,0 +1,413 @@
+<template>
+  <div class="trialDocumentMenu">
+    <div class="menuBox" v-for="item in menu" :key="item.ArchiveTypeEnum">
+      <div class="top">
+        <i class="el-icon-folder-opened"></i>
+        <span>{{ $fd('ArchiveType', item.ArchiveTypeEnum) }}</span>
+        <i
+          class="el-icon-circle-plus menuAdd"
+          :title="$t('trials:trialDocument:menu:add')"
+          @click.stop="addMenu(item.ArchiveTypeEnum)"
+          v-if="isManage && hasAdd && !viewStatus && item.ArchiveTypeEnum !== 5"
+        ></i>
+      </div>
+      <div
+        :class="{ menu: true, selected: Id === data.Id }"
+        v-for="data in item.TrialFileTypeList"
+        :key="data.SysFileTypeId"
+        @click.stop="handleSelect(data, item.ArchiveTypeEnum)"
+      >
+        <i class="el-icon-s-order" style="margin-left: 5px"></i>
+        <span class="menuItem">{{ isEN ? data.Name : data.NameCN }}</span>
+        <div
+          @click="NATIVE"
+          class="menuBtnBox"
+          v-if="isManage && hasEdit && !viewStatus"
+        >
+          <i
+            v-if="data.IsSelfDefine"
+            class="el-icon-edit-outline"
+            :title="$t('trials:trialDocument:menu:edit')"
+            @click.stop="editMenu(item.ArchiveTypeEnum, data)"
+          />
+          <i
+            v-if="data.IsSelfDefine"
+            class="el-icon-delete"
+            :title="$t('trials:trialDocument:menu:del')"
+            @click.stop="delMenu(data)"
+          />
+          <el-switch
+            class="menuSwitch"
+            @change="(val) => changeIsEnble(val, data)"
+            v-model="data.IsEnable"
+            :active-value="true"
+            :inactive-value="false"
+          >
+          </el-switch>
+        </div>
+      </div>
+    </div>
+    <base-model :config="config">
+      <div slot="dialog-body">
+        <el-form
+          ref="menuForm"
+          :model="form"
+          label-width="100px"
+          size="small"
+          :rules="rules"
+        >
+          <div class="base-dialog-body">
+            <el-form-item
+              :label="$t('trials:trialDocument:form:ArchiveTypeEnum')"
+              prop="ArchiveTypeEnum"
+            >
+              <el-select
+                v-model="form.ArchiveTypeEnum"
+                disabled
+                placeholder=""
+                style="width: 100%"
+              >
+                <el-option
+                  v-for="item in $d.ArchiveType"
+                  :key="item.id"
+                  :label="item.label"
+                  :value="item.value"
+                >
+                </el-option>
+              </el-select>
+            </el-form-item>
+            <el-form-item
+              :label="$t('trials:trialDocument:form:Name')"
+              prop="Name"
+            >
+              <el-input v-model="form.Name" />
+            </el-form-item>
+          </div>
+        </el-form>
+      </div>
+      <div slot="dialog-footer">
+        <el-button size="small" @click="canel">
+          {{ $t('trials:trialDocument:button:canel') }}
+        </el-button>
+        <el-button size="small" type="primary" :loading="loading" @click="save">
+          {{ $t('trials:trialDocument:button:save') }}
+        </el-button>
+      </div>
+    </base-model>
+  </div>
+</template>
+<script>
+import {
+  getTrialFileTypeData,
+  setAuthorizedView,
+  addOrUpdateTrialFileType,
+  deleteTrialFileType,
+} from '@/api/dictionary'
+import baseModel from '@/components/BaseModel'
+const defaultForm = () => {
+  return {
+    ArchiveTypeEnum: null,
+    Name: null,
+    NameCN: null,
+    FirstFinalDate: null,
+    IsConfirmRecord: true,
+    IsEnable: true,
+    IsSelfDefine: true,
+    SubIdentificationEnum: null,
+    SysFileTypeId: null,
+    TrialId: null,
+    Id: null,
+  }
+}
+export default {
+  name: 'trialDocumentMenu',
+  props: {
+    viewStatus: {
+      type: Boolean,
+      default: true,
+    },
+    Id: {
+      type: String,
+      default: '',
+    },
+    SubIdentificationEnum: {
+      type: Number,
+      default: 0,
+    },
+    ArchiveTypeEnum: {
+      type: Number,
+      default: 0,
+    },
+    rowData: {
+      type: Object,
+      default: () => {
+        return {}
+      },
+    },
+  },
+  data() {
+    return {
+      loading: false,
+      menu: [],
+      config: {
+        visible: false,
+        showClose: true,
+        width: '400px',
+        title: '',
+        appendToBody: true,
+        status: 'add',
+      },
+      form: defaultForm(),
+      rules: {
+        Name: [
+          {
+            required: true,
+            message: this.$t('common:ruleMessage:specify'),
+            trigger: ['blur', 'change'],
+          },
+        ],
+      },
+    }
+  },
+  components: {
+    'base-model': baseModel,
+  },
+  watch: {
+    viewStatus: {
+      handler() {
+        this.getMenu()
+      },
+      immediate: true,
+    },
+  },
+  computed: {
+    isEN() {
+      return this.$i18n.locale !== 'zh'
+    },
+    isInspect() {
+      return this.hasPermi([
+        'trials:trials-panel:trial-summary:trial-document:inspect',
+      ])
+    },
+    isManage() {
+      return this.hasPermi([
+        'trials:trials-panel:trial-summary:trial-document:manage',
+      ])
+    },
+    hasAdd() {
+      return this.hasPermi([
+        'trials:trials-panel:trial-summary:trial-document:add',
+      ])
+    },
+    hasEdit() {
+      return this.hasPermi([
+        'trials:trials-panel:trial-summary:trial-document:edit',
+      ])
+    },
+  },
+  methods: {
+    // 获取菜单
+    async getMenu() {
+      try {
+        let data = {
+          TrialId: this.$route.query.trialId,
+          IsEnable: this.viewStatus,
+        }
+        this.loading = true
+        let res = await getTrialFileTypeData(data)
+        this.loading = false
+        if (res.IsSuccess) {
+          this.menu = res.Result.TrialFileTypeDataList
+        }
+      } catch (err) {
+        this.loading = false
+        console.log(err)
+      }
+    },
+    // 修改菜单启用
+    async changeIsEnble(val, item) {
+      try {
+        let data = {
+          Id: item.Id,
+          IsEnable: val,
+        }
+        this.loading = true
+        let res = await setAuthorizedView(data)
+        this.loading = false
+      } catch (err) {
+        this.loading = false
+        item.IsEnable = !item.IsEnable
+        console.log(err)
+      }
+    },
+    // 选中
+    handleSelect(data, ArchiveTypeEnum) {
+      this.$emit('update:Id', data.Id)
+      this.$emit('update:SubIdentificationEnum', data.SubIdentificationEnum)
+      this.$emit('update:ArchiveTypeEnum', ArchiveTypeEnum)
+      this.$emit('update:rowData', data)
+    },
+    // 新增
+    addMenu(ArchiveTypeEnum) {
+      this.config.title = this.$t('trials:trialDocument:title:add')
+      this.form = defaultForm()
+      this.form.ArchiveTypeEnum = ArchiveTypeEnum
+      this.form.TrialId = this.$route.query.trialId
+      switch (ArchiveTypeEnum) {
+        case 1: {
+          this.form.SubIdentificationEnum = 0
+          break
+        }
+        case 2: {
+          this.form.SubIdentificationEnum = 1
+          break
+        }
+        case 3: {
+          this.form.SubIdentificationEnum = 2
+          break
+        }
+        case 4: {
+          this.form.SubIdentificationEnum = 2
+          break
+        }
+      }
+      this.config.visible = true
+    },
+    // 修改
+    editMenu(ArchiveTypeEnum, item) {
+      this.config.title = this.$t('trials:trialDocument:title:edit')
+      this.form = defaultForm()
+      Object.keys(this.form).forEach((key) => {
+        this.form[key] = item[key]
+      })
+      this.form.ArchiveTypeEnum = ArchiveTypeEnum
+      this.config.visible = true
+    },
+    // 删除
+    delMenu(row) {
+      this.$confirm(this.$t('trials:trialDocument:message:deleteMessage'), {
+        type: 'warning',
+        distinguishCancelAndClose: true,
+      })
+        .then(() => {
+          this.loading = true
+          deleteTrialFileType(row.Id).then((res) => {
+            if (res.IsSuccess) {
+              this.getMenu()
+              this.$message.success(
+                this.$t('common:message:deletedSuccessfully')
+              )
+            }
+          })
+        })
+        .catch((err) => {
+          this.loading = false
+          console.log(err)
+        })
+    },
+    async save() {
+      try {
+        let validate = await this.$refs.menuForm.validate()
+        if (!validate) return false
+        this.form.NameCN = this.form.Name
+        this.loading = true
+        let res = await addOrUpdateTrialFileType(this.form)
+        if (res.IsSuccess) {
+          this.config.visible = false
+          this.getMenu()
+        }
+      } catch (err) {
+        console.log(err)
+        this.loading = false
+      }
+    },
+    canel() {
+      this.config.visible = false
+    },
+    NATIVE(event) {
+      event.stopPropagation()
+    },
+  },
+}
+</script>
+<style lang="scss" scoped>
+.trialDocumentMenu {
+  padding: 0 10px;
+  .menuBox {
+    border-bottom: 1px solid rgb(238, 238, 238);
+    &:last-child {
+      border: none;
+    }
+    .top {
+      color: #303133;
+      line-height: 48px;
+      width: 100%;
+      position: relative;
+      i {
+        margin-right: 5px;
+      }
+      .menuAdd {
+        margin: 0;
+        position: absolute;
+        top: 15px;
+        right: 0;
+        cursor: pointer;
+      }
+    }
+    .menu {
+      font-size: 14px;
+      margin-bottom: 12px;
+      padding: 0 12px 0 20px;
+      cursor: pointer;
+      min-height: 36px;
+      display: flex;
+      align-items: center;
+      border-radius: 5px;
+      position: relative;
+      i {
+        margin-right: 5px;
+      }
+      .menuBtnBox {
+        position: absolute;
+        top: 7px;
+        right: 5px;
+        display: flex;
+        align-items: center;
+      }
+      .menuItem {
+        width: 70%;
+        white-space: nowrap; /* 文本不换行 */
+        overflow: hidden; /* 超出部分隐藏 */
+        text-overflow: ellipsis;
+      }
+    }
+    .menu:hover {
+      background: #f5f5f5;
+    }
+    .menu.selected {
+      color: #6698ff;
+      background: rgba(102, 152, 255, 0.1);
+    }
+  }
+  .menuSwitch {
+    ::v-deep.el-switch__core {
+      height: 14px;
+      width: 28px !important;
+      &::after {
+        width: 12px;
+        height: 12px;
+        top: 0;
+      }
+    }
+  }
+  .el-switch.is-checked {
+    ::v-deep.el-switch__core {
+      height: 14px;
+      width: 28px !important;
+      &::after {
+        margin-left: -12px;
+      }
+    }
+  }
+}
+</style>

src/views/trials/trials-panel/trial-summary/trial-document/components/report_doc/form.vue

@@ -0,0 +1,381 @@
+<template>
+  <base-model :config="config">
+    <div slot="dialog-body">
+      <el-form
+        ref="reportDocForm"
+        :model="form"
+        label-width="140px"
+        size="small"
+        :rules="rules"
+      >
+        <div class="base-dialog-body">
+          <el-form-item
+            v-if="!config.upload"
+            :label="$t('trials:trialDocument:reportDoc:form:name')"
+            prop="Name"
+          >
+            <el-input v-model="form.Name" />
+          </el-form-item>
+          <el-form-item
+            v-if="!config.upload"
+            :label="$t('trials:trialDocument:reportDoc:form:version')"
+            prop="Version"
+          >
+            <el-input v-model="form.Version" />
+          </el-form-item>
+          <el-form-item
+            v-if="!config.upload"
+            :label="$t('trials:trialDocument:reportDoc:form:isAuthorizedView')"
+            prop="IsAuthorizedView"
+          >
+            <el-switch
+              v-model="form.IsAuthorizedView"
+              :active-value="true"
+              :inactive-value="false"
+              :active-text="$fd('YesOrNo', true)"
+              :inactive-text="$fd('YesOrNo', false)"
+            >
+            </el-switch>
+          </el-form-item>
+          <el-form-item
+            v-if="!config.upload || config.upload === 'PDF'"
+            :label="$t('trials:trialDocument:reportDoc:form:pdfFileRecord')"
+            prop="PDFFileRecord"
+          >
+            <el-upload
+              class="upload-demo"
+              action
+              :before-upload="(param) => beforeUpload(param, 'PDF', '.pdf')"
+              :http-request="(param) => handleUploadFile(param, 'PDF')"
+              :on-remove="() => handleRemoveFile('PDF')"
+              :limit="1"
+              accept=".pdf"
+              :file-list="PDFFile"
+            >
+              <el-button
+                size="small"
+                type="primary"
+                :disabled="
+                  !!form.PDFFileRecord && !!form.PDFFileRecord.FilePath
+                "
+                >{{ $t('common:button:upload') }}
+              </el-button>
+              <span slot="tip" class="el-upload__tip">
+                {{ $t('trials:trialDocument:reportDoc:rule:mustPDF') }}
+              </span>
+            </el-upload>
+          </el-form-item>
+          <el-form-item
+            v-if="!config.upload || config.upload === 'Word'"
+            :label="$t('trials:trialDocument:reportDoc:form:wordFileRecord')"
+          >
+            <el-upload
+              class="upload-demo"
+              action
+              :before-upload="(param) => beforeUpload(param, 'Word', '.docx')"
+              :http-request="(param) => handleUploadFile(param, 'Word')"
+              :on-remove="() => handleRemoveFile('Word')"
+              :limit="1"
+              accept=".docx"
+              :file-list="WordFile"
+            >
+              <el-button
+                size="small"
+                type="primary"
+                :disabled="
+                  !!form.WordFileRecord && !!form.WordFileRecord.FilePath
+                "
+                >{{ $t('common:button:upload') }}
+              </el-button>
+              <span slot="tip" class="el-upload__tip">
+                {{ $t('trials:trialDocument:reportDoc:rule:mustDOCX') }}
+              </span>
+            </el-upload>
+          </el-form-item>
+          <el-form-item
+            v-if="!config.upload || config.upload === 'Sign'"
+            :label="$t('trials:trialDocument:reportDoc:form:signFileRecord')"
+            :prop="
+              rowData.IsConfirmRecord &&
+              (!config.upload || config.upload === 'Sign')
+                ? 'SignFileRecord'
+                : ''
+            "
+          >
+            <el-upload
+              class="upload-demo"
+              action
+              :before-upload="(param) => beforeUpload(param, 'Sign', '.pdf')"
+              :http-request="(param) => handleUploadFile(param, 'Sign')"
+              :on-remove="() => handleRemoveFile('Sign')"
+              :limit="1"
+              accept=".pdf"
+              :file-list="SignFile"
+            >
+              <el-button
+                size="small"
+                type="primary"
+                :disabled="
+                  !!form.SignFileRecord && !!form.SignFileRecord.FilePath
+                "
+                >{{ $t('common:button:upload') }}
+              </el-button>
+              <span slot="tip" class="el-upload__tip">
+                {{ $t('trials:trialDocument:reportDoc:rule:mustPDF') }}
+              </span>
+            </el-upload>
+          </el-form-item>
+          <el-form-item
+            v-if="!config.upload || config.upload === 'History'"
+            :label="$t('trials:trialDocument:reportDoc:form:historyFileRecord')"
+          >
+            <el-upload
+              class="upload-demo"
+              action
+              :before-upload="(param) => beforeUpload(param, 'History', '.zip')"
+              :http-request="(param) => handleUploadFile(param, 'History')"
+              :on-remove="() => handleRemoveFile('History')"
+              :limit="1"
+              accept=".zip"
+              :file-list="HistoryFile"
+            >
+              <el-button
+                size="small"
+                type="primary"
+                :disabled="
+                  !!form.HistoryFileRecord && !!form.HistoryFileRecord.FilePath
+                "
+                >{{ $t('common:button:upload') }}
+              </el-button>
+              <span slot="tip" class="el-upload__tip">
+                {{ $t('trials:trialDocument:reportDoc:rule:mustZIP') }}
+              </span>
+            </el-upload>
+          </el-form-item>
+        </div>
+      </el-form>
+    </div>
+    <div slot="dialog-footer">
+      <el-button size="small" @click="canel">
+        {{ $t('trials:trialDocument:reportDoc:button:canel') }}
+      </el-button>
+      <el-button size="small" type="primary" :loading="loading" @click="save">
+        {{ $t('trials:trialDocument:reportDoc:button:save') }}
+      </el-button>
+    </div>
+  </base-model>
+</template>
+  <script>
+import baseModel from '@/components/BaseModel'
+import { addOrUpdateTrialFinalRecord } from '@/api/dictionary'
+export default {
+  props: {
+    config: {
+      required: true,
+      default: () => {
+        return {}
+      },
+    },
+    data: {
+      required: true,
+      default: () => {
+        return {}
+      },
+    },
+    ArchiveTypeEnum: {
+      type: Number,
+      default: 0,
+    },
+    rowData: {
+      type: Object,
+      default: () => {
+        return {}
+      },
+    },
+  },
+  components: {
+    'base-model': baseModel,
+  },
+  data() {
+    return {
+      form: {
+        Version: null,
+        Name: null,
+        IsAuthorizedView: true,
+        PDFFileRecord: null,
+        WordFileRecord: null,
+        SignFileRecord: null,
+        HistoryFileRecord: null,
+      },
+      rules: {
+        Name: [
+          {
+            required: true,
+            message: this.$t('common:ruleMessage:specify'),
+            trigger: ['blur', 'change'],
+          },
+        ],
+        Version: [
+          {
+            required: true,
+            message: this.$t('common:ruleMessage:specify'),
+            trigger: ['blur', 'change'],
+          },
+        ],
+        IsAuthorizedView: [
+          {
+            required: true,
+            message: this.$t('common:ruleMessage:select'),
+            trigger: ['blur', 'change'],
+          },
+        ],
+        PDFFileRecord: [
+          {
+            required: true,
+            validator: (rule, value, callback) => {
+              if (
+                !this.form.PDFFileRecord ||
+                !this.form.PDFFileRecord.FilePath
+              ) {
+                callback(
+                  new Error(
+                    this.$t(
+                      'trials:trialDocument:reportDoc:msg:noPdfFileRecord'
+                    )
+                  )
+                )
+              } else {
+                callback()
+              }
+            },
+            // message: this.$t('common:ruleMessage:specify'),
+            trigger: ['blur', 'change'],
+          },
+        ],
+        SignFileRecord: [
+          {
+            required: true,
+            validator: (rule, value, callback) => {
+              if (
+                !this.form.SignFileRecord ||
+                !this.form.SignFileRecord.FilePath
+              ) {
+                callback(
+                  new Error(
+                    this.$t(
+                      'trials:trialDocument:reportDoc:msg:noSignFileRecord'
+                    )
+                  )
+                )
+              } else {
+                callback()
+              }
+            },
+            // message: this.$t('common:ruleMessage:specify'),
+            trigger: ['blur', 'change'],
+          },
+        ],
+      },
+      loading: false,
+      PDFFile: [],
+      WordFile: [],
+      SignFile: [],
+      HistoryFile: [],
+    }
+  },
+  created() {
+    if (this.config.status === 'edit') {
+      Object.keys(this.form).forEach((key) => {
+        this.form[key] = this.data[key]
+      })
+      let arr = ['PDF', 'Word', 'Sign', 'History']
+
+      arr.forEach((key) => {
+        if (
+          this.form[`${key}FileRecord`] &&
+          this.form[`${key}FileRecord`].FilePath
+        ) {
+          this[`${key}File`] = []
+          this[`${key}File`].push({
+            name: this.form[`${key}FileRecord`].FileName,
+            url: this.form[`${key}FileRecord`].FilePath,
+          })
+        }
+      })
+    }
+  },
+  methods: {
+    async save() {
+      try {
+        let validate = await this.$refs.reportDocForm.validate()
+        if (!validate) return false
+        this.loading = true
+        this.form.TrialFileTypeId = this.rowData.Id
+        if (this.config.status === 'edit') {
+          this.form.Id = this.data.Id
+        }
+        let res = await addOrUpdateTrialFinalRecord(this.form)
+        if (res.IsSuccess) {
+          this.$emit('close')
+          this.$emit('getList')
+        }
+      } catch (err) {
+        console.log(err)
+        this.loading = false
+      }
+    },
+    canel() {
+      this.$emit('close')
+    },
+    handleRemoveFile(key) {
+      this.form[`${key}FileRecord`] = null
+      this[`${key}File`] = []
+    },
+    beforeUpload(param, key, accept) {
+      if (this[`${key}File`] && this[`${key}File`][0]) {
+        this.$alert(
+          this.$t('trials:trialDocument:reportDoc:msg:hasFile')
+        ).catch()
+        return
+      }
+      let extendName = param.name
+        .substring(param.name.lastIndexOf('.'))
+        .toLocaleLowerCase()
+      if (accept !== extendName) {
+        this.$alert(
+          this.$t('trials:trialDocument:reportDoc:msg:typeErr')
+        ).catch()
+        return
+      }
+    },
+    async handleUploadFile(param, key) {
+      let trialId = this.$route.query.trialId
+      let extendName = param.file.name
+        .substring(param.file.name.lastIndexOf('.'))
+        .toLocaleLowerCase()
+      if (!trialId)
+        return this.$alert(
+          this.$t('trials:trialDocument:reportDoc:msg:noTrialId')
+        ).catch()
+      this.loading = true
+      var file = await this.fileToBlob(param.file)
+      let typeArr = ['', 'Report', 'Doc', 'Record', 'Reviewer', 'Template']
+      let types = typeArr[this.ArchiveTypeEnum]
+      let fileNameNoType = param.file.name
+        .substring(0, param.file.name.lastIndexOf('.'))
+        .toLocaleLowerCase()
+      const res = await this.OSSclient.put(
+        `/${trialId}/Document/${types}/${fileNameNoType}${extendName}`,
+        file
+      )
+      this.form[`${key}FileRecord`] = {
+        FileName: param.file.name,
+        FilePath: this.$getObjectName(res.url),
+        FileSize: param.file.size,
+        FileFormat: extendName,
+      }
+      this.loading = false
+    },
+  },
+}
+</script>

src/views/trials/trials-panel/trial-summary/trial-document/components/report_doc/index.vue

@@ -0,0 +1,846 @@
+<template>
+  <box-content>
+    <div class="title">
+      {{ TITLE }}
+    </div>
+    <el-form :inline="true" size="mini" class="base-search-form">
+      <el-form-item
+        :label="$t('trials:trialDocument:reportDoc:form:firstFinalDate')"
+      >
+        <el-date-picker
+          :disabled="!isManage || rowBtnStatus === 'edit'"
+          v-model="rowData.FirstFinalDate"
+          type="date"
+          value-format="yyyy-MM-dd"
+          format="yyyy-MM-dd"
+          placeholder=""
+        >
+        </el-date-picker>
+      </el-form-item>
+      <el-form-item
+        :label="$t('trials:trialDocument:reportDoc:form:isConfirmRecord')"
+        v-if="isManage && hasEdit && !viewStatus"
+      >
+        <el-radio-group
+          v-model="rowData.IsConfirmRecord"
+          :disabled="rowBtnStatus === 'edit'"
+        >
+          <el-radio
+            :label="item.value"
+            v-for="item in $d.YesOrNo"
+            :key="item.id"
+            >{{ item.label }}
+          </el-radio>
+        </el-radio-group>
+      </el-form-item>
+      <el-form-item
+        :label="$t('trials:trialDocument:reportDoc:form:isEnable')"
+        v-if="isManage && hasEdit && !viewStatus"
+      >
+        <el-radio-group
+          v-model="rowData.IsEnable"
+          :disabled="rowBtnStatus === 'edit'"
+        >
+          <el-radio
+            :label="item.value"
+            v-for="item in $d.YesOrNo"
+            :key="item.id"
+            >{{ item.label }}
+          </el-radio>
+        </el-radio-group>
+      </el-form-item>
+      <el-form-item v-if="isManage && hasEdit && !viewStatus">
+        <el-button
+          type="primary"
+          size="mini"
+          @click="rowBtnStatus = 'save'"
+          v-if="rowBtnStatus === 'edit'"
+        >
+          {{ $t('common:button:edit') }}
+        </el-button>
+        <el-button
+          type="primary"
+          size="mini"
+          :loading="rowBtnLoading"
+          @click="saveRowData"
+          v-if="rowBtnStatus === 'save'"
+        >
+          {{ $t('common:button:save') }}
+        </el-button>
+      </el-form-item>
+    </el-form>
+    <!-- 搜索框 -->
+    <div class="search" style="position: relative">
+      <el-form :inline="true" size="mini" class="base-search-form">
+        <el-form-item :label="$t('trials:trialDocument:reportDoc:search:name')">
+          <el-input v-model="searchData.Name" style="width: 100px" clearable />
+        </el-form-item>
+        <el-form-item
+          :label="$t('trials:trialDocument:reportDoc:search:version')"
+        >
+          <el-input
+            v-model="searchData.Version"
+            style="width: 100px"
+            clearable
+          />
+        </el-form-item>
+        <el-form-item
+          :label="$t('trials:trialDocument:reportDoc:search:isAuthorizedView')"
+          v-if="isManage && !viewStatus"
+        >
+          <el-select
+            v-if="!viewStatus"
+            v-model="searchData.IsAuthorizedView"
+            style="width: 100px"
+            placeholder=""
+          >
+            <el-option
+              v-for="item in $d.YesOrNo"
+              :key="item.id"
+              :label="item.label"
+              :value="item.value"
+            >
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="el-icon-search" @click="handleSearch">
+            {{ $t('common:button:search') }}
+          </el-button>
+          <el-button
+            type="primary"
+            icon="el-icon-refresh-left"
+            @click="handleReset"
+          >
+            {{ $t('common:button:reset') }}
+          </el-button>
+        </el-form-item>
+        <el-form-item v-if="isManage && !viewStatus">
+          <el-button
+            type="primary"
+            :disabled="selectTable.length <= 0"
+            size="mini"
+            v-if="hasAccredit && isManage && !viewStatus"
+            @click.stop="auth"
+          >
+            {{ $t('trials:trialDocument:reportDoc:button:accredit') }}
+          </el-button>
+          <el-button
+            type="primary"
+            size="mini"
+            v-if="hasAdd && isManage && !viewStatus"
+            @click.stop="handleAdd"
+          >
+            {{ $t('trials:trialDocument:reportDoc:button:add') }}
+          </el-button>
+          <el-button
+            type="primary"
+            icon="el-icon-bottom"
+            size="mini"
+            :disabled="selectTable.length <= 0"
+            v-if="hasDownLoad && isManage && !viewStatus"
+            @click.stop="downLoad"
+          >
+            {{ $t('trials:trialDocument:reportDoc:button:downLoad') }}
+          </el-button>
+        </el-form-item>
+      </el-form>
+    </div>
+
+    <el-table
+      v-loading="loading"
+      v-adaptive="{ bottomOffset: 75 }"
+      :data="list"
+      stripe
+      height="100"
+      style="width: 100%"
+      @sort-change="handleSortByColumn"
+      @selection-change="handleSelectionChange"
+    >
+      <el-table-column type="selection" width="55" />
+
+      <el-table-column
+        prop="Name"
+        :label="$t('trials:trialDocument:reportDoc:table:name')"
+        sortable="custom"
+        show-overflow-tooltip
+      />
+      <el-table-column
+        prop="Version"
+        :label="$t('trials:trialDocument:reportDoc:table:version')"
+        show-overflow-tooltip
+        sortable="custom"
+      />
+      <!--定稿PDF-->
+      <el-table-column
+        prop="PDFFileRecord"
+        :label="$t('trials:trialDocument:reportDoc:table:pdfFileRecord')"
+        show-overflow-tooltip
+        sortable="custom"
+      >
+        <template slot-scope="scope">
+          <div
+            v-if="
+              scope.row.PDFFileRecord && scope.row.PDFFileRecord.TrialFileTypeId
+            "
+            style="display: flex; align-items: center"
+          >
+            <span class="fileName">{{ scope.row.PDFFileRecord.FileName }}</span>
+            <div v-if="isManage && !viewStatus" class="fileBtnBox">
+              <i
+                class="el-icon-view"
+                @click.stop="preview(scope.row.PDFFileRecord)"
+              />
+              <i
+                class="el-icon-download"
+                v-if="hasDownLoad"
+                @click.stop="downLoad(false, scope.row.PDFFileRecord, 'file')"
+              />
+              <i
+                class="el-icon-delete"
+                v-if="hasDel"
+                @click.stop="delFile(scope.row, 'PDF')"
+              />
+            </div>
+          </div>
+          <i
+            v-else-if="isManage && !viewStatus && hasEdit"
+            class="el-icon-upload2"
+            style="cursor: pointer; color: #409eff"
+            @click.stop="upload(scope.row, 'PDF')"
+          />
+        </template>
+      </el-table-column>
+      <!--定稿WORD-->
+      <el-table-column
+        prop="WordFileRecord"
+        :label="$t('trials:trialDocument:reportDoc:table:wordFileRecord')"
+        show-overflow-tooltip
+        sortable="custom"
+        v-if="isManage && !viewStatus"
+      >
+        <template slot-scope="scope">
+          <div
+            v-if="
+              scope.row.WordFileRecord &&
+              scope.row.WordFileRecord.TrialFileTypeId
+            "
+            style="display: flex; align-items: center"
+          >
+            <span class="fileName">{{
+              scope.row.WordFileRecord.FileName
+            }}</span>
+            <div v-if="isManage && !viewStatus" class="fileBtnBox">
+              <i
+                class="el-icon-download"
+                v-if="hasDownLoad"
+                @click.stop="downLoad(false, scope.row.WordFileRecord, 'file')"
+              />
+              <i
+                class="el-icon-delete"
+                v-if="hasDel"
+                @click.stop="delFile(scope.row, 'Word')"
+              />
+            </div>
+          </div>
+          <i
+            v-else-if="isManage && !viewStatus && hasEdit"
+            class="el-icon-upload2"
+            style="cursor: pointer; color: #409eff"
+            @click.stop="upload(scope.row, 'Word')"
+          />
+        </template>
+      </el-table-column>
+      <!--签字页-->
+      <el-table-column
+        prop="SignFileRecord"
+        :label="$t('trials:trialDocument:reportDoc:table:signFileRecord')"
+        show-overflow-tooltip
+        sortable="custom"
+        v-if="isManage && !viewStatus"
+      >
+        <template slot-scope="scope">
+          <div
+            v-if="
+              scope.row.SignFileRecord &&
+              scope.row.SignFileRecord.TrialFileTypeId
+            "
+            style="display: flex; align-items: center"
+          >
+            <span class="fileName">{{
+              scope.row.SignFileRecord.FileName
+            }}</span>
+            <div v-if="isManage && !viewStatus" class="fileBtnBox">
+              <i
+                class="el-icon-view"
+                @click.stop="preview(scope.row.SignFileRecord)"
+              />
+              <i
+                class="el-icon-download"
+                v-if="hasDownLoad"
+                @click.stop="downLoad(false, scope.row.SignFileRecord, 'file')"
+              />
+              <i
+                class="el-icon-delete"
+                v-if="hasDel"
+                @click.stop="delFile(scope.row, 'Sign')"
+              />
+            </div>
+          </div>
+          <i
+            v-else-if="isManage && !viewStatus && hasEdit"
+            class="el-icon-upload2"
+            style="cursor: pointer; color: #409eff"
+            @click.stop="upload(scope.row, 'Sign')"
+          />
+        </template>
+      </el-table-column>
+      <!--历史记录-->
+      <el-table-column
+        prop="HistoryFileRecord"
+        :label="$t('trials:trialDocument:reportDoc:table:historyFileRecord')"
+        show-overflow-tooltip
+        sortable="custom"
+        v-if="isManage && !viewStatus"
+      >
+        <template slot-scope="scope">
+          <div
+            v-if="
+              scope.row.HistoryFileRecord &&
+              scope.row.HistoryFileRecord.TrialFileTypeId
+            "
+            style="display: flex; align-items: center"
+          >
+            <span class="fileName">{{
+              scope.row.HistoryFileRecord.FileName
+            }}</span>
+            <div v-if="isManage && !viewStatus" class="fileBtnBox">
+              <i
+                class="el-icon-download"
+                v-if="hasDownLoad"
+                @click.stop="
+                  downLoad(false, scope.row.HistoryFileRecord, 'file')
+                "
+              />
+              <i
+                class="el-icon-delete"
+                v-if="hasDel"
+                @click.stop="delFile(scope.row, 'History')"
+              />
+            </div>
+          </div>
+          <i
+            v-else-if="isManage && !viewStatus && hasEdit"
+            class="el-icon-upload2"
+            style="cursor: pointer; color: #409eff"
+            @click.stop="upload(scope.row, 'History')"
+          />
+        </template>
+      </el-table-column>
+
+      <el-table-column
+        prop="IsAuthorizedView"
+        :label="$t('trials:trialDocument:reportDoc:table:isAuthorizedView')"
+        show-overflow-tooltip
+        sortable="custom"
+      >
+        <template slot-scope="scope">
+          <el-switch
+            v-if="isManage && !viewStatus && hasEdit"
+            v-model="scope.row.IsAuthorizedView"
+            @change="(val) => auth(false, scope.row, val)"
+            :active-value="true"
+            :inactive-value="false"
+            :active-text="$fd('YesOrNo', true)"
+            :inactive-text="$fd('YesOrNo', false)"
+          >
+          </el-switch>
+          <span v-else>{{ $fd('YesOrNo', scope.row.IsAuthorizedView) }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column
+        prop="UpdateTime"
+        :label="$t('trials:trialDocument:reportDoc:table:updateTime')"
+        show-overflow-tooltip
+        sortable="custom"
+      />
+      <el-table-column
+        prop="CreateTime"
+        :label="$t('trials:trialDocument:reportDoc:table:createTime')"
+        show-overflow-tooltip
+        sortable="custom"
+      />
+      <el-table-column
+        :label="$t('common:action:action')"
+        width="200"
+        fixed="right"
+      >
+        <template slot-scope="scope">
+          <el-button
+            icon="el-icon-view"
+            :title="$t('common:button:view')"
+            size="mini"
+            circle
+            :disabled="
+              !scope.row.PDFFileRecord || !scope.row.PDFFileRecord.FilePath
+            "
+            @click.stop="preview(scope.row.PDFFileRecord)"
+          />
+          <el-button
+            v-if="hasEdit && isManage && !viewStatus"
+            icon="el-icon-edit-outline"
+            :title="$t('common:button:edit')"
+            size="mini"
+            circle
+            @click.stop="handleEdit(scope.row)"
+          />
+          <el-button
+            v-if="hasDownLoad && isManage && !viewStatus"
+            icon="el-icon-download"
+            :title="$t('trials:trialDocument:reportDoc:button:download')"
+            size="mini"
+            circle
+            @click.stop="downLoad(false, scope.row)"
+          />
+          <el-button
+            v-if="hasDel && isManage && !viewStatus"
+            icon="el-icon-delete"
+            :title="$t('trials:trialDocument:reportDoc:button:delete')"
+            size="mini"
+            circle
+            @click.stop="handleDel(scope.row)"
+          />
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <!-- 分页组件 -->
+    <pagination
+      class="page"
+      :total="total"
+      :page.sync="searchData.PageIndex"
+      :limit.sync="searchData.PageSize"
+      @pagination="getList"
+    />
+    <reportDoc-form
+      :ArchiveTypeEnum="ArchiveTypeEnum"
+      :rowData="rowData"
+      :config="config"
+      :data="selectData"
+      v-if="config.visible"
+      @close="close"
+      @getList="getList"
+    />
+  </box-content>
+</template>
+<script>
+import {
+  addOrUpdateTrialFileType,
+  getTrialFinalRecordList,
+  deleteTrialFinalRecord,
+  authorizedTrialFinalRecord,
+  addOrUpdateTrialFinalRecord,
+} from '@/api/dictionary'
+import { downLoadFile } from '@/utils/stream.js'
+import { deepClone } from '@/utils/index.js'
+import Pagination from '@/components/Pagination'
+import BoxContent from '@/components/BoxContent'
+import reportDocForm from './form.vue'
+const searchDataDefault = () => {
+  return {
+    IsAuthorizedView: null,
+    Name: null,
+    Version: null,
+    PageIndex: 1,
+    PageSize: 20,
+    Asc: false,
+    SortField: null,
+  }
+}
+export default {
+  name: 'reportDoc',
+  components: { BoxContent, Pagination, reportDocForm },
+  props: {
+    viewStatus: {
+      type: Boolean,
+      default: true,
+    },
+    ArchiveTypeEnum: {
+      type: Number,
+      default: 0,
+    },
+    Id: {
+      type: String,
+      default: '',
+    },
+    rowData: {
+      type: Object,
+      default: () => {
+        return {}
+      },
+    },
+  },
+  data() {
+    return {
+      rowBtnStatus: 'edit', // edit 编辑 save 保存
+      rowBtnLoading: false,
+      searchData: searchDataDefault(),
+      loading: false,
+      list: [],
+      total: 0,
+      selectTable: [],
+      config: {
+        visible: false,
+        showClose: true,
+        width: '600px',
+        title: '',
+        appendToBody: false,
+        status: 'add',
+        upload: null,
+      },
+      selectData: {},
+    }
+  },
+  methods: {
+    // 上传单个文件
+    upload(row, key) {
+      this.selectData = deepClone(row)
+      this.config.title = `${this.$t(
+        'trials:trialDocument:reportDoc:form:title:upload'
+      )}
+        -
+    ${this.isEN ? this.rowData.Name : this.rowData.NameCN}`
+      this.config.status = 'edit'
+      this.config.upload = key
+      this.config.visible = true
+    },
+    // 新增
+    handleAdd() {
+      this.selectData = {}
+      this.config.title = `${this.$t(
+        'trials:trialDocument:reportDoc:form:title:add'
+      )}
+        -
+    ${this.isEN ? this.rowData.Name : this.rowData.NameCN}`
+      this.config.status = 'add'
+      this.config.upload = null
+      this.config.visible = true
+    },
+    // 编辑
+    handleEdit(row) {
+      this.selectData = deepClone(row)
+      this.config.title = `${this.$t(
+        'trials:trialDocument:reportDoc:form:title:edit'
+      )}
+        -
+    ${this.isEN ? this.rowData.Name : this.rowData.NameCN}`
+      this.config.status = 'edit'
+      this.config.upload = null
+      this.config.visible = true
+    },
+    // 删除文件
+    async delFile(row, key) {
+      try {
+        let confirm = await this.$confirm(
+          this.$t('trials:trialDocument:reportDoc:message:deleteFile'),
+          {
+            type: 'warning',
+            distinguishCancelAndClose: true,
+          }
+        )
+        if (confirm !== 'confirm') return false
+        let data = deepClone(row)
+        data[`${key}FileRecord`] = null
+        this.loading = true
+        let res = await addOrUpdateTrialFinalRecord(data)
+        this.loading = false
+        if (res.IsSuccess) {
+          this.$message.success(this.$t('common:message:deletedSuccessfully'))
+          this.getList()
+        }
+      } catch (err) {
+        this.loading = false
+        console.log(err)
+      }
+    },
+    // 下载
+    async downLoad(isArray = true, row, type = 'zip') {
+      try {
+        if (type === 'file') {
+          return await downLoadFile(
+            this.OSSclientConfig.basePath + row.FilePath,
+            row.FileName
+          )
+        }
+        let { files, name } = this.formatDownloadFile(isArray, row)
+        let res = await downLoadFile(files, name, type)
+        // if (res && this.downloadId) {
+        //   this.downloadImageSuccess()
+        // }
+      } catch (err) {
+        console.log(err)
+      }
+    },
+    // 格式化下载文件路径
+    formatDownloadFile(isArray = true, row) {
+      let files = [],
+        name = `${this.TITLE}_${new Date().getTime()}.zip`,
+        arr = ['PDF', 'Word', 'Sign', 'History']
+      if (!isArray) {
+        name = `${row.Name}_${row.Version}_${new Date().getTime()}.zip`
+        arr.forEach((key) => {
+          if (row[`${key}FileRecord`] && row[`${key}FileRecord`].FilePath) {
+            let obj = {
+              name: `${row[`${key}FileRecord`].FileName.substring(
+                0,
+                row[`${key}FileRecord`].FileName.lastIndexOf('.')
+              )}__${row.Version}${row[`${key}FileRecord`].FileName.substring(
+                row[`${key}FileRecord`].FileName.lastIndexOf('.')
+              ).toLocaleLowerCase()}`,
+              url:
+                this.OSSclientConfig.basePath +
+                row[`${key}FileRecord`].FilePath,
+            }
+            files.push(obj)
+          }
+        })
+      } else {
+        this.selectTable.forEach((item) => {
+          arr.forEach((key) => {
+            if (item[`${key}FileRecord`] && item[`${key}FileRecord`].FilePath) {
+              let obj = {
+                name: `${item.Name}_${item.Version}/${item[
+                  `${key}FileRecord`
+                ].FileName.substring(
+                  0,
+                  item[`${key}FileRecord`].FileName.lastIndexOf('.')
+                )}__${item.Version}${item[
+                  `${key}FileRecord`
+                ].FileName.substring(
+                  item[`${key}FileRecord`].FileName.lastIndexOf('.')
+                ).toLocaleLowerCase()}`,
+                url:
+                  this.OSSclientConfig.basePath +
+                  item[`${key}FileRecord`].FilePath,
+              }
+              files.push(obj)
+            }
+          })
+        })
+      }
+      return { files, name }
+    },
+    // 授权
+    async auth(isArray = true, row, IsAuthorizedView) {
+      try {
+        let data = {}
+        if (isArray) {
+          data = {
+            Ids: this.selectTable.map((item) => item.Id),
+            IsAuthorizedView: true,
+          }
+        } else {
+          data = {
+            Ids: [row.Id],
+            IsAuthorizedView,
+          }
+        }
+        this.loading = true
+        let res = await authorizedTrialFinalRecord(data)
+        this.loading = false
+        if (res.IsSuccess) {
+          this.$t('trials:trialDocument:reportDoc:message:authSuccessfully')
+          if (isArray) {
+            this.getList()
+          }
+        }
+      } catch (err) {
+        this.loading = false
+        if (!isArray) {
+          row.IsAuthorizedView = !row.IsAuthorizedView
+        }
+        console.log(err)
+      }
+    },
+    // 删除列表数据
+    handleDel(row) {
+      this.$confirm(
+        this.$t('trials:trialDocument:reportDoc:message:deleteMessage'),
+        {
+          type: 'warning',
+          distinguishCancelAndClose: true,
+        }
+      )
+        .then(() => {
+          this.loading = true
+          deleteTrialFinalRecord(row.Id)
+            .then((res) => {
+              this.loading = false
+              if (res.IsSuccess) {
+                this.getList()
+                this.$message.success(
+                  this.$t('common:message:deletedSuccessfully')
+                )
+              }
+            })
+            .catch((err) => {
+              this.loading = false
+              console.log(err)
+            })
+        })
+        .catch((err) => {
+          this.loading = false
+          console.log(err)
+        })
+    },
+    async getList() {
+      try {
+        if (!this.Id) return false
+        this.searchData.TrialFileTypeId = this.Id
+        this.searchData.TrialId = this.$route.query.trialId
+        this.loading = true
+        let res = await getTrialFinalRecordList(this.searchData)
+        this.loading = false
+        if (res.IsSuccess) {
+          this.list = res.Result.CurrentPageData
+          this.total = res.Result.TotalCount
+        }
+      } catch (err) {
+        this.loading = false
+        console.log(err)
+      }
+    },
+    // 查询
+    handleSearch() {
+      this.searchData.PageIndex = 1
+      this.getList()
+    },
+    // 重置
+    handleReset() {
+      this.searchData = searchDataDefault()
+      this.getList()
+    },
+    // 排序
+    handleSortByColumn(column) {
+      if (column.order === 'ascending') {
+        this.searchData.Asc = true
+      } else {
+        this.searchData.Asc = false
+      }
+      this.searchData.SortField = column.prop
+      this.searchData.PageIndex = 1
+      this.getList()
+    },
+    handleSelectionChange(val) {
+      this.selectTable = val
+    },
+    // 保存菜单数据
+    async saveRowData() {
+      try {
+        this.rowBtnLoading = true
+        let res = await addOrUpdateTrialFileType(this.rowData)
+        this.rowBtnLoading = false
+        if (res.IsSuccess) {
+          this.rowBtnStatus = 'edit'
+          this.$emit('getMenu')
+          this.$message.success(this.$t('common:message:savedSuccessfully'))
+        }
+      } catch (err) {
+        console.log(err)
+        this.rowBtnLoading = false
+      }
+    },
+    // 预览
+    preview(row) {
+      if (!row.FilePath) return false
+      this.$preview({
+        path: row.FilePath || row.fullPath,
+        type: 'pdf',
+        title: row.FileName,
+      })
+    },
+    close() {
+      this.config.visible = false
+    },
+  },
+  watch: {
+    Id: {
+      handler() {
+        this.getList()
+      },
+      immediate: true,
+    },
+  },
+  computed: {
+    isEN() {
+      return this.$i18n.locale !== 'zh'
+    },
+    isInspect() {
+      return this.hasPermi([
+        'trials:trials-panel:trial-summary:trial-document:inspect',
+      ])
+    },
+    isManage() {
+      return this.hasPermi([
+        'trials:trials-panel:trial-summary:trial-document:manage',
+      ])
+    },
+    hasAdd() {
+      return this.hasPermi([
+        'trials:trials-panel:trial-summary:trial-document:add',
+      ])
+    },
+    hasEdit() {
+      return this.hasPermi([
+        'trials:trials-panel:trial-summary:trial-document:edit',
+      ])
+    },
+    hasDel() {
+      return this.hasPermi([
+        'trials:trials-panel:trial-summary:trial-document:del',
+      ])
+    },
+    hasDownLoad() {
+      return this.hasPermi([
+        'trials:trials-panel:trial-summary:trial-document:downLoad',
+      ])
+    },
+    hasAccredit() {
+      return this.hasPermi([
+        'trials:trials-panel:trial-summary:trial-document:accredit',
+      ])
+    },
+    TITLE() {
+      return `${this.$fd('ArchiveType', this.ArchiveTypeEnum)} — ${
+        this.isEN ? this.rowData.Name : this.rowData.NameCN
+      }`
+    },
+  },
+}
+</script>
+<style lang="scss" scoped>
+.title {
+  line-height: 40px;
+  font-weight: bold;
+  margin-bottom: 10px;
+}
+.fileName {
+  display: inline-block;
+  max-width: calc(100% - 60px);
+  white-space: nowrap; /* 文本不换行 */
+  overflow: hidden; /* 超出部分隐藏 */
+  text-overflow: ellipsis;
+}
+.fileBtnBox {
+  display: inline-block;
+  width: 50px;
+  i {
+    cursor: pointer;
+    color: #409eff;
+    margin-right: 3px;
+    &:last-child {
+      margin: 0;
+    }
+  }
+}
+</style>

src/views/trials/trials-panel/trial-summary/trial-document/components/trainRecord/form.vue

@@ -0,0 +1,299 @@
+<template>
+  <base-model :config="config">
+    <div slot="dialog-body">
+      <el-form
+        ref="trainRecordForm"
+        :model="form"
+        label-width="140px"
+        size="small"
+        :rules="rules"
+      >
+        <div class="base-dialog-body">
+          <el-form-item
+            v-if="!config.upload"
+            :label="$t('trials:trialDocument:trainRecord:form:TrianingDate')"
+            prop="TrianingDate"
+          >
+            <el-date-picker
+              v-model="form.TrianingDate"
+              type="date"
+              placeholder=""
+              format="yyyy-MM-dd"
+              value-format="yyyy-MM-dd"
+              style="width: 100%"
+            >
+            </el-date-picker>
+          </el-form-item>
+          <el-form-item
+            v-if="!config.upload"
+            :label="$t('trials:trialDocument:trainRecord:form:TrianingCount')"
+            prop="TrianingCount"
+          >
+            <el-input v-model.number="form.TrianingCount" type="number" />
+          </el-form-item>
+          <el-form-item
+            v-if="!config.upload"
+            :label="$t('trials:trialDocument:trainRecord:form:TrianingState')"
+            prop="TrianingState"
+          >
+            <el-input v-model="form.TrianingState" type="number" />
+          </el-form-item>
+          <el-form-item
+            v-if="!config.upload"
+            :label="$t('trials:trialDocument:trainRecord:form:Note')"
+            prop="Note"
+          >
+            <el-input v-model="form.Note" type="number" />
+          </el-form-item>
+          <el-form-item
+            v-if="!config.upload || config.upload === 'Train'"
+            :label="$t('trials:trialDocument:trainRecord:form:TrialFileRecord')"
+            prop="TrialFileRecord"
+          >
+            <el-upload
+              class="upload-demo"
+              action
+              :before-upload="(param) => beforeUpload(param, 'Trial', '.pdf')"
+              :http-request="(param) => handleUploadFile(param, 'Trial')"
+              :on-remove="() => handleRemoveFile('Trial')"
+              :limit="1"
+              accept=".pdf"
+              :file-list="TrialFile"
+            >
+              <el-button
+                size="small"
+                type="primary"
+                :disabled="
+                  !!form.TrialFileRecord && !!form.TrialFileRecord.FilePath
+                "
+                >{{ $t('common:button:upload') }}
+              </el-button>
+              <span slot="tip" class="el-upload__tip">
+                {{ $t('trials:trialDocument:trainRecord:rule:mustPDF') }}
+              </span>
+            </el-upload>
+          </el-form-item>
+          <el-form-item
+            v-if="!config.upload || config.upload === 'History'"
+            :label="
+              $t('trials:trialDocument:trainRecord:form:historyFileRecord')
+            "
+          >
+            <el-upload
+              class="upload-demo"
+              action
+              :before-upload="(param) => beforeUpload(param, 'History', '.zip')"
+              :http-request="(param) => handleUploadFile(param, 'History')"
+              :on-remove="() => handleRemoveFile('History')"
+              :limit="1"
+              accept=".zip"
+              :file-list="HistoryFile"
+            >
+              <el-button
+                size="small"
+                type="primary"
+                :disabled="
+                  !!form.HistoryFileRecord && !!form.HistoryFileRecord.FilePath
+                "
+                >{{ $t('common:button:upload') }}
+              </el-button>
+              <span slot="tip" class="el-upload__tip">
+                {{ $t('trials:trialDocument:trainRecord:rule:mustZIP') }}
+              </span>
+            </el-upload>
+          </el-form-item>
+        </div>
+      </el-form>
+    </div>
+    <div slot="dialog-footer">
+      <el-button size="small" @click="canel">
+        {{ $t('trials:trialDocument:trainRecord:button:canel') }}
+      </el-button>
+      <el-button size="small" type="primary" :loading="loading" @click="save">
+        {{ $t('trials:trialDocument:trainRecord:button:save') }}
+      </el-button>
+    </div>
+  </base-model>
+</template>
+    <script>
+import baseModel from '@/components/BaseModel'
+import { addOrUpdateTrialTrianingRecord } from '@/api/dictionary'
+export default {
+  props: {
+    config: {
+      required: true,
+      default: () => {
+        return {}
+      },
+    },
+    data: {
+      required: true,
+      default: () => {
+        return {}
+      },
+    },
+    ArchiveTypeEnum: {
+      type: Number,
+      default: 0,
+    },
+    rowData: {
+      type: Object,
+      default: () => {
+        return {}
+      },
+    },
+  },
+  components: {
+    'base-model': baseModel,
+  },
+  data() {
+    return {
+      form: {
+        Note: null,
+        TrianingCount: null,
+        TrianingDate: null,
+        TrianingState: null,
+        IsAuthorizedView: true,
+        TrialFileRecord: null,
+        HistoryFileRecord: null,
+      },
+      rules: {
+        TrianingDate: [
+          {
+            required: true,
+            message: this.$t('common:ruleMessage:specify'),
+            trigger: ['blur', 'change'],
+          },
+        ],
+        TrianingCount: [
+          {
+            type: 'number',
+            min: 0,
+            message: this.$t(
+              'trials:trialDocument:trainRecord:ruleMessage:TrianingCountPattern'
+            ),
+            trigger: 'blur',
+          },
+          {
+            validator: (rule, value, callback) => {
+              if (
+                value &&
+                (String(value).includes('.') ||
+                  new RegExp(/\D/g).test(String(value)))
+              ) {
+                callback(
+                  new Error(
+                    this.$t(
+                      'trials:trialDocument:trainRecord:ruleMessage:TrianingCountPatternS'
+                    )
+                  )
+                )
+              } else {
+                callback()
+              }
+            },
+            trigger: 'blur',
+          },
+        ],
+      },
+      loading: false,
+      TrialFile: [],
+      HistoryFile: [],
+    }
+  },
+  created() {
+    if (this.config.status === 'edit') {
+      Object.keys(this.form).forEach((key) => {
+        this.form[key] = this.data[key]
+      })
+      let arr = ['Trial', 'History']
+
+      arr.forEach((key) => {
+        if (
+          this.form[`${key}FileRecord`] &&
+          this.form[`${key}FileRecord`].FilePath
+        ) {
+          this[`${key}File`] = []
+          this[`${key}File`].push({
+            name: this.form[`${key}FileRecord`].FileName,
+            url: this.form[`${key}FileRecord`].FilePath,
+          })
+        }
+      })
+    }
+  },
+  methods: {
+    async save() {
+      try {
+        let validate = await this.$refs.trainRecordForm.validate()
+        if (!validate) return false
+        this.loading = true
+        this.form.TrialFileTypeId = this.rowData.Id
+        if (this.config.status === 'edit') {
+          this.form.Id = this.data.Id
+        }
+        let res = await addOrUpdateTrialTrianingRecord(this.form)
+        if (res.IsSuccess) {
+          this.$emit('close')
+          this.$emit('getList')
+        }
+      } catch (err) {
+        console.log(err)
+        this.loading = false
+      }
+    },
+    canel() {
+      this.$emit('close')
+    },
+    handleRemoveFile(key) {
+      this.form[`${key}FileRecord`] = null
+      this[`${key}File`] = []
+    },
+    beforeUpload(param, key, accept) {
+      if (this[`${key}File`] && this[`${key}File`][0]) {
+        this.$alert(
+          this.$t('trials:trialDocument:trainRecord:msg:hasFile')
+        ).catch()
+        return
+      }
+      let extendName = param.name
+        .substring(param.name.lastIndexOf('.'))
+        .toLocaleLowerCase()
+      if (accept !== extendName) {
+        this.$alert(
+          this.$t('trials:trialDocument:trainRecord:msg:typeErr')
+        ).catch()
+        return
+      }
+    },
+    async handleUploadFile(param, key) {
+      let trialId = this.$route.query.trialId
+      let extendName = param.file.name
+        .substring(param.file.name.lastIndexOf('.'))
+        .toLocaleLowerCase()
+      if (!trialId)
+        return this.$alert(
+          this.$t('trials:trialDocument:trainRecord:msg:noTrialId')
+        ).catch()
+      this.loading = true
+      var file = await this.fileToBlob(param.file)
+      let typeArr = ['', 'Report', 'Doc', 'Record', 'Reviewer', 'Template']
+      let types = typeArr[this.ArchiveTypeEnum]
+      let fileNameNoType = param.file.name
+        .substring(0, param.file.name.lastIndexOf('.'))
+        .toLocaleLowerCase()
+      const res = await this.OSSclient.put(
+        `/${trialId}/Document/${types}/${fileNameNoType}${extendName}`,
+        file
+      )
+      this.form[`${key}FileRecord`] = {
+        FileName: param.file.name,
+        FilePath: this.$getObjectName(res.url),
+        FileSize: param.file.size,
+        FileFormat: extendName,
+      }
+      this.loading = false
+    },
+  },
+}
+</script>

src/views/trials/trials-panel/trial-summary/trial-document/components/trainRecord/index.vue

@@ -0,0 +1,918 @@
+<template>
+  <box-content>
+    <div class="title">
+      {{ TITLE }}
+    </div>
+    <el-form :inline="true" size="mini" class="base-search-form">
+      <el-form-item
+        :label="$t('trials:trialDocument:trainRecord:form:isConfirmRecord')"
+        v-if="isManage && hasEdit && !viewStatus"
+      >
+        <el-radio-group
+          v-model="rowData.IsConfirmRecord"
+          :disabled="rowBtnStatus === 'edit'"
+        >
+          <el-radio
+            :label="item.value"
+            v-for="item in $d.YesOrNo"
+            :key="item.id"
+            >{{ item.label }}
+          </el-radio>
+        </el-radio-group>
+      </el-form-item>
+      <el-form-item
+        :label="$t('trials:trialDocument:trainRecord:form:isEnable')"
+        v-if="isManage && hasEdit && !viewStatus"
+      >
+        <el-radio-group
+          v-model="rowData.IsEnable"
+          :disabled="rowBtnStatus === 'edit'"
+        >
+          <el-radio
+            :label="item.value"
+            v-for="item in $d.YesOrNo"
+            :key="item.id"
+            >{{ item.label }}
+          </el-radio>
+        </el-radio-group>
+      </el-form-item>
+      <el-form-item v-if="isManage && hasEdit && !viewStatus">
+        <el-button
+          type="primary"
+          size="mini"
+          @click="rowBtnStatus = 'save'"
+          v-if="rowBtnStatus === 'edit'"
+        >
+          {{ $t('common:button:edit') }}
+        </el-button>
+        <el-button
+          type="primary"
+          size="mini"
+          :loading="rowBtnLoading"
+          @click="saveRowData"
+          v-if="rowBtnStatus === 'save'"
+        >
+          {{ $t('common:button:save') }}
+        </el-button>
+      </el-form-item>
+    </el-form>
+    <!-- 搜索框 -->
+    <div class="search" style="position: relative">
+      <el-form :inline="true" size="mini" class="base-search-form">
+        <!--培训日期-->
+        <el-form-item
+          :label="$t('trials:trialDocument:trainRecord:search:TrianingDate')"
+        >
+          <el-date-picker
+            style="width: 240px"
+            v-model="TrianingDate"
+            type="daterange"
+            :range-separator="$t('baseForm:daterange:rangeSeparator')"
+            start-placeholder=""
+            end-placeholder=""
+            format="yyyy-MM-dd"
+            value-format="yyyy-MM-dd"
+          >
+          </el-date-picker>
+        </el-form-item>
+        <el-form-item
+          :label="$t('trials:trialDocument:trainRecord:search:name')"
+        >
+          <el-input
+            v-model="searchData.FileName"
+            style="width: 100px"
+            clearable
+          />
+        </el-form-item>
+        <el-form-item
+          :label="
+            $t('trials:trialDocument:trainRecord:search:isAuthorizedView')
+          "
+          v-if="isManage && !viewStatus"
+        >
+          <el-select
+            v-if="!viewStatus"
+            v-model="searchData.IsAuthorizedView"
+            style="width: 100px"
+            placeholder=""
+          >
+            <el-option
+              v-for="item in $d.YesOrNo"
+              :key="item.id"
+              :label="item.label"
+              :value="item.value"
+            >
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <!--更新时间-->
+        <el-form-item
+          :label="$t('trials:trialDocument:trainRecord:search:UpdateTime')"
+          style="margin-bottom: 10px"
+        >
+          <el-date-picker
+            style="width: 240px"
+            v-model="UpdateTime"
+            type="daterange"
+            :range-separator="$t('baseForm:daterange:rangeSeparator')"
+            start-placeholder=""
+            end-placeholder=""
+            format="yyyy-MM-dd"
+            value-format="yyyy-MM-dd"
+          >
+          </el-date-picker>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="el-icon-search" @click="handleSearch">
+            {{ $t('common:button:search') }}
+          </el-button>
+          <el-button
+            type="primary"
+            icon="el-icon-refresh-left"
+            @click="handleReset"
+          >
+            {{ $t('common:button:reset') }}
+          </el-button>
+        </el-form-item>
+        <el-form-item v-if="isManage && !viewStatus">
+          <el-button
+            type="primary"
+            :disabled="selectTable.length <= 0"
+            size="mini"
+            v-if="hasAccredit && isManage && !viewStatus"
+            @click.stop="auth"
+          >
+            {{ $t('trials:trialDocument:trainRecord:button:accredit') }}
+          </el-button>
+          <el-button
+            type="primary"
+            size="mini"
+            v-if="hasEdit && isManage && !viewStatus"
+            @click.stop="openFile(false)"
+          >
+            {{ $t('trials:trialDocument:trainRecord:button:uploadFile') }}
+          </el-button>
+          <el-button
+            type="primary"
+            size="mini"
+            v-if="hasEdit && isManage && !viewStatus"
+            @click.stop="openFile(true)"
+          >
+            {{ $t('trials:trialDocument:trainRecord:button:uploadFolder') }}
+          </el-button>
+          <el-button
+            type="primary"
+            size="mini"
+            v-if="hasAdd && isManage && !viewStatus"
+            @click.stop="handleAdd"
+          >
+            {{ $t('trials:trialDocument:trainRecord:button:add') }}
+          </el-button>
+          <el-button
+            type="primary"
+            icon="el-icon-bottom"
+            size="mini"
+            :disabled="selectTable.length <= 0"
+            v-if="hasDownLoad && isManage && !viewStatus"
+            @click.stop="downLoad"
+          >
+            {{ $t('trials:trialDocument:trainRecord:button:downLoad') }}
+          </el-button>
+        </el-form-item>
+      </el-form>
+    </div>
+
+    <el-table
+      v-loading="loading"
+      v-adaptive="{ bottomOffset: 75 }"
+      :data="list"
+      stripe
+      height="100"
+      style="width: 100%"
+      @sort-change="handleSortByColumn"
+      @selection-change="handleSelectionChange"
+    >
+      <el-table-column type="selection" width="55" />
+
+      <el-table-column
+        prop="TrianingDate"
+        :label="$t('trials:trialDocument:trainRecord:table:TrianingDate')"
+        show-overflow-tooltip
+        sortable="custom"
+      />
+      <el-table-column
+        prop="TrianingCount"
+        :label="$t('trials:trialDocument:trainRecord:table:TrianingCount')"
+        show-overflow-tooltip
+        sortable="custom"
+      />
+      <el-table-column
+        prop="TrianingState"
+        :label="$t('trials:trialDocument:trainRecord:table:TrianingState')"
+        show-overflow-tooltip
+        sortable="custom"
+      />
+      <el-table-column
+        prop="Note"
+        :label="$t('trials:trialDocument:trainRecord:table:Note')"
+        show-overflow-tooltip
+        sortable="custom"
+      />
+      <!--文件名称-->
+      <el-table-column
+        prop="FileName"
+        :label="$t('trials:trialDocument:trainRecord:table:name')"
+        show-overflow-tooltip
+        sortable="custom"
+      >
+        <template slot-scope="scope">
+          <div
+            v-if="
+              scope.row.TrialFileRecord &&
+              scope.row.TrialFileRecord.TrialFileTypeId
+            "
+            style="display: flex; align-items: center"
+          >
+            <span class="fileName">{{
+              scope.row.TrialFileRecord.FileName
+            }}</span>
+            <div v-if="isManage && !viewStatus" class="fileBtnBox">
+              <i
+                class="el-icon-view"
+                @click.stop="preview(scope.row.TrialFileRecord)"
+              />
+              <i
+                class="el-icon-download"
+                v-if="hasDownLoad"
+                @click.stop="downLoad(false, scope.row.TrialFileRecord, 'file')"
+              />
+              <i
+                class="el-icon-delete"
+                v-if="hasDel"
+                @click.stop="delFile(scope.row, 'Trial')"
+              />
+            </div>
+          </div>
+          <i
+            v-else-if="isManage && !viewStatus && hasEdit"
+            class="el-icon-upload2"
+            style="cursor: pointer; color: #409eff"
+            @click.stop="upload(scope.row, 'Trial')"
+          />
+        </template>
+      </el-table-column>
+
+      <!--历史记录-->
+      <el-table-column
+        prop="HistoryFileRecord"
+        :label="$t('trials:trialDocument:trainRecord:table:historyFileRecord')"
+        show-overflow-tooltip
+        sortable="custom"
+        v-if="isManage && !viewStatus"
+      >
+        <template slot-scope="scope">
+          <div
+            v-if="
+              scope.row.HistoryFileRecord &&
+              scope.row.HistoryFileRecord.TrialFileTypeId
+            "
+            style="display: flex; align-items: center"
+          >
+            <span class="fileName">{{
+              scope.row.HistoryFileRecord.FileName
+            }}</span>
+            <div v-if="isManage && !viewStatus" class="fileBtnBox">
+              <i
+                class="el-icon-download"
+                v-if="hasDownLoad"
+                @click.stop="
+                  downLoad(false, scope.row.HistoryFileRecord, 'file')
+                "
+              />
+              <i
+                class="el-icon-delete"
+                v-if="hasDel"
+                @click.stop="delFile(scope.row, 'History')"
+              />
+            </div>
+          </div>
+          <i
+            v-else-if="isManage && !viewStatus"
+            class="el-icon-upload2"
+            style="cursor: pointer; color: #409eff"
+            @click.stop="upload(scope.row, 'History')"
+          />
+        </template>
+      </el-table-column>
+
+      <el-table-column
+        prop="IsAuthorizedView"
+        :label="$t('trials:trialDocument:trainRecord:table:isAuthorizedView')"
+        show-overflow-tooltip
+        sortable="custom"
+        v-if="isManage && !viewStatus"
+      >
+        <template slot-scope="scope">
+          <el-switch
+            v-if="isManage && !viewStatus && hasEdit"
+            v-model="scope.row.IsAuthorizedView"
+            @change="(val) => auth(false, scope.row, val)"
+            :active-value="true"
+            :inactive-value="false"
+            :active-text="$fd('YesOrNo', true)"
+            :inactive-text="$fd('YesOrNo', false)"
+          >
+          </el-switch>
+          <span v-else>{{ $fd('YesOrNo', scope.row.IsAuthorizedView) }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column
+        prop="UpdateTime"
+        :label="$t('trials:trialDocument:trainRecord:table:updateTime')"
+        show-overflow-tooltip
+        sortable="custom"
+      />
+      <el-table-column
+        prop="CreateTime"
+        :label="$t('trials:trialDocument:trainRecord:table:createTime')"
+        show-overflow-tooltip
+        sortable="custom"
+      />
+      <el-table-column
+        :label="$t('common:action:action')"
+        width="200"
+        fixed="right"
+      >
+        <template slot-scope="scope">
+          <el-button
+            icon="el-icon-view"
+            :title="$t('common:button:view')"
+            size="mini"
+            circle
+            :disabled="
+              !scope.row.TrialFileRecord || !scope.row.TrialFileRecord.FilePath
+            "
+            @click.stop="preview(scope.row.TrialFileRecord)"
+          />
+          <el-button
+            v-if="hasEdit && isManage && !viewStatus"
+            icon="el-icon-edit-outline"
+            :title="$t('common:button:edit')"
+            size="mini"
+            circle
+            @click.stop="handleEdit(scope.row)"
+          />
+          <el-button
+            v-if="hasDownLoad && isManage && !viewStatus"
+            icon="el-icon-download"
+            :title="$t('trials:trialDocument:trainRecord:button:download')"
+            size="mini"
+            circle
+            @click.stop="downLoad(false, scope.row.TrialFileRecord, 'file')"
+          />
+          <el-button
+            v-if="hasDel && isManage && !viewStatus"
+            icon="el-icon-delete"
+            :title="$t('trials:trialDocument:trainRecord:button:delete')"
+            size="mini"
+            circle
+            @click.stop="handleDel(scope.row)"
+          />
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <!-- 分页组件 -->
+    <pagination
+      class="page"
+      :total="total"
+      :page.sync="searchData.PageIndex"
+      :limit.sync="searchData.PageSize"
+      @pagination="getList"
+    />
+    <upload-files
+      :config="config"
+      :faccept="faccept"
+      :uploadPath="uploadPath"
+      :limitLength="limitLength"
+      v-if="config.visible"
+      @close="close"
+      @uplaodFile="uplaodFile"
+    />
+    <trainRecord-form
+      :ArchiveTypeEnum="ArchiveTypeEnum"
+      :rowData="rowData"
+      :config="update_config"
+      :data="selectData"
+      v-if="update_config.visible"
+      @close="updateClose"
+      @getList="getList"
+    />
+  </box-content>
+</template>
+    <script>
+import {
+  addOrUpdateTrialFileType,
+  getTrialTrianingRecordList,
+  deleteTrialNormalRecord,
+  authorizedTTrialNormalRecord,
+  addOrUpdateTrialTrianingRecord,
+  batchAddTrialTrianingRecord,
+  deleteTrialNormalRecordList,
+} from '@/api/dictionary'
+import { downLoadFile } from '@/utils/stream.js'
+import { deepClone } from '@/utils/index.js'
+import Pagination from '@/components/Pagination'
+import BoxContent from '@/components/BoxContent'
+import uploadFiles from '../uploadFiles.vue'
+import trainRecordForm from './form.vue'
+const searchDataDefault = () => {
+  return {
+    IsAuthorizedView: null,
+    FileName: null,
+    TrianingDateStartTime: null,
+    TrianingDateEndTime: null,
+    UpdateStartTime: null,
+    UpdateEndTime: null,
+    PageIndex: 1,
+    PageSize: 20,
+    Asc: false,
+    SortField: 'TrianingDate',
+  }
+}
+export default {
+  name: 'trainRecord',
+  components: { BoxContent, Pagination, uploadFiles, trainRecordForm },
+  props: {
+    viewStatus: {
+      type: Boolean,
+      default: true,
+    },
+    ArchiveTypeEnum: {
+      type: Number,
+      default: 0,
+    },
+    Id: {
+      type: String,
+      default: '',
+    },
+    rowData: {
+      type: Object,
+      default: () => {
+        return {}
+      },
+    },
+  },
+  data() {
+    return {
+      rowBtnStatus: 'edit', // edit 编辑 save 保存
+      rowBtnLoading: false,
+      searchData: searchDataDefault(),
+      loading: false,
+      list: [],
+      total: 0,
+      selectTable: [],
+      config: {
+        visible: false,
+        showClose: true,
+        width: '800px',
+        title: '',
+        appendToBody: false,
+        isFolder: false,
+      },
+      selectData: {},
+      uploadPath: null,
+      faccept: ['.pdf'],
+      limitLength: 0,
+
+      TrianingDate: [],
+      UpdateTime: [],
+      update_config: {
+        visible: false,
+        showClose: true,
+        width: '600px',
+        title: '',
+        appendToBody: false,
+        status: 'add',
+        upload: null,
+      },
+    }
+  },
+  methods: {
+    // 新增列表数据
+    async uplaodFile(list) {
+      console.log(list, 'list')
+      try {
+        if (!list || list.length <= 0) return false
+        let arr = []
+        list.forEach((item) => {
+          let obj = {
+            TrialId: this.$route.query.trialId,
+            TrialFileTypeId: this.Id,
+            IsAuthorizedView: true,
+            TrialFileRecord: item,
+            HistoryFileRecord: null,
+            Note: null,
+            TrianingCount: null,
+            TrianingDate: null,
+            TrianingState: null,
+          }
+          arr.push(obj)
+        })
+        this.loading = true
+        let res = await batchAddTrialTrianingRecord({
+          TrianingRecordList: arr,
+        })
+        this.loading = false
+        if (res.IsSuccess) {
+          this.getList()
+        }
+      } catch (err) {
+        this.loading = false
+        console.log(err)
+      }
+    },
+    // 上传单个文件
+    upload(row, key) {
+      this.selectData = deepClone(row)
+      this.update_config.title = `${this.$t(
+        'trials:trialDocument:reportDoc:form:title:upload'
+      )}
+        -
+    ${this.isEN ? this.rowData.Name : this.rowData.NameCN}`
+      this.update_config.status = 'edit'
+      this.update_config.upload = key
+      this.update_config.visible = true
+    },
+    // 新增
+    handleAdd() {
+      this.selectData = {}
+      this.update_config.title = `${this.$t(
+        'trials:trialDocument:reportDoc:form:title:add'
+      )}
+        -
+    ${this.isEN ? this.rowData.Name : this.rowData.NameCN}`
+      this.update_config.status = 'add'
+      this.update_config.upload = null
+      this.update_config.visible = true
+    },
+    // 编辑
+    handleEdit(row) {
+      this.selectData = deepClone(row)
+      this.update_config.title = `${this.$t(
+        'trials:trialDocument:reportDoc:form:title:edit'
+      )}
+        -
+    ${this.isEN ? this.rowData.Name : this.rowData.NameCN}`
+      this.update_config.status = 'edit'
+      this.update_config.upload = null
+      this.update_config.visible = true
+    },
+    // 删除文件
+    async delFile(row, key) {
+      try {
+        let confirm = await this.$confirm(
+          this.$t('trials:trialDocument:trainRecord:message:deleteFile'),
+          {
+            type: 'warning',
+            distinguishCancelAndClose: true,
+          }
+        )
+        if (confirm !== 'confirm') return false
+        let data = deepClone(row)
+        data[`${key}FileRecord`] = null
+        this.loading = true
+        let res = await addOrUpdateTrialTrianingRecord(data)
+        this.loading = false
+        if (res.IsSuccess) {
+          this.$message.success(this.$t('common:message:deletedSuccessfully'))
+          this.getList()
+        }
+      } catch (err) {
+        this.loading = false
+        console.log(err)
+      }
+    },
+    // 下载
+    async downLoad(isArray = true, row, type = 'zip') {
+      try {
+        if (type === 'file') {
+          return await downLoadFile(
+            this.OSSclientConfig.basePath + row.FilePath,
+            row.FileName
+          )
+        }
+        let { files, name } = this.formatDownloadFile(isArray, row)
+        let res = await downLoadFile(files, name, type)
+        // if (res && this.downloadId) {
+        //   this.downloadImageSuccess()
+        // }
+      } catch (err) {
+        console.log(err)
+      }
+    },
+    // 格式化下载文件路径
+    formatDownloadFile(isArray = true, row) {
+      let files = [],
+        name = `${this.TITLE}_${new Date().getTime()}.zip`,
+        arr = ['Trial', 'History']
+      if (!isArray) {
+        name = `${row.Name}_${row.Version}_${new Date().getTime()}.zip`
+        arr.forEach((key) => {
+          if (row[`${key}FileRecord`] && row[`${key}FileRecord`].FilePath) {
+            let obj = {
+              name: `${row[`${key}FileRecord`].FileName.substring(
+                0,
+                row[`${key}FileRecord`].FileName.lastIndexOf('.')
+              )}__${row.Version}${row[`${key}FileRecord`].FileName.substring(
+                row[`${key}FileRecord`].FileName.lastIndexOf('.')
+              ).toLocaleLowerCase()}`,
+              url:
+                this.OSSclientConfig.basePath +
+                row[`${key}FileRecord`].FilePath,
+            }
+            files.push(obj)
+          }
+        })
+      } else {
+        this.selectTable.forEach((item) => {
+          arr.forEach((key) => {
+            if (item[`${key}FileRecord`] && item[`${key}FileRecord`].FilePath) {
+              let obj = {
+                name: `${item[`${key}FileRecord`].FileName.substring(
+                  0,
+                  item[`${key}FileRecord`].FileName.lastIndexOf('.')
+                )}__${new Date().getTime()}${item[
+                  `${key}FileRecord`
+                ].FileName.substring(
+                  item[`${key}FileRecord`].FileName.lastIndexOf('.')
+                ).toLocaleLowerCase()}`,
+                url:
+                  this.OSSclientConfig.basePath +
+                  item[`${key}FileRecord`].FilePath,
+              }
+              files.push(obj)
+            }
+          })
+        })
+      }
+      return { files, name }
+    },
+    // 授权
+    async auth(isArray = true, row, IsAuthorizedView) {
+      try {
+        let data = {}
+        if (isArray) {
+          data = {
+            Ids: this.selectTable.map((item) => item.Id),
+            IsAuthorizedView: true,
+          }
+        } else {
+          data = {
+            Ids: [row.Id],
+            IsAuthorizedView,
+          }
+        }
+        this.loading = true
+        let res = await authorizedTTrialNormalRecord(data)
+        this.loading = false
+        if (res.IsSuccess) {
+          this.$t('trials:trialDocument:trainRecord:message:authSuccessfully')
+          if (isArray) {
+            this.getList()
+          }
+        }
+      } catch (err) {
+        this.loading = false
+        if (!isArray) {
+          row.IsAuthorizedView = !row.IsAuthorizedView
+        }
+        console.log(err)
+      }
+    },
+    // 删除列表数据
+    handleDel(row) {
+      this.$confirm(
+        this.$t('trials:trialDocument:trainRecord:message:deleteMessage'),
+        {
+          type: 'warning',
+          distinguishCancelAndClose: true,
+        }
+      )
+        .then(() => {
+          this.loading = true
+          deleteTrialNormalRecord(row.Id)
+            .then((res) => {
+              this.loading = false
+              if (res.IsSuccess) {
+                this.getList()
+                this.$message.success(
+                  this.$t('common:message:deletedSuccessfully')
+                )
+              }
+            })
+            .catch((err) => {
+              this.loading = false
+              console.log(err)
+            })
+        })
+        .catch((err) => {
+          this.loading = false
+          console.log(err)
+        })
+    },
+    async getList() {
+      try {
+        if (!this.Id) return false
+        this.searchData.TrialFileTypeId = this.Id
+        this.searchData.TrialId = this.$route.query.trialId
+        if (this.TrianingDate && this.TrianingDate.length >= 2) {
+          this.searchData.TrianingDateStartTime = this.TrianingDate[0]
+          this.searchData.TrianingDateEndTime = this.TrianingDate[1]
+        } else {
+          this.searchData.TrianingDateStartTime = null
+          this.searchData.TrianingDateEndTime = null
+        }
+        if (this.UpdateTime && this.UpdateTime.length >= 2) {
+          this.searchData.UpdateStartTime = this.UpdateTime[0]
+          this.searchData.UpdateEndTime = this.UpdateTime[1]
+        } else {
+          this.searchData.UpdateStartTime = null
+          this.searchData.UpdateEndTime = null
+        }
+        this.loading = true
+        let res = await getTrialTrianingRecordList(this.searchData)
+        this.loading = false
+        if (res.IsSuccess) {
+          this.list = res.Result.CurrentPageData
+          this.total = res.Result.TotalCount
+        }
+      } catch (err) {
+        this.loading = false
+        console.log(err)
+      }
+    },
+    // 查询
+    handleSearch() {
+      this.searchData.PageIndex = 1
+      this.getList()
+    },
+    // 重置
+    handleReset() {
+      this.searchData = searchDataDefault()
+      this.TrianingDate = []
+      this.UpdateTime = []
+      this.getList()
+    },
+    // 排序
+    handleSortByColumn(column) {
+      if (column.order === 'ascending') {
+        this.searchData.Asc = true
+      } else {
+        this.searchData.Asc = false
+      }
+      this.searchData.SortField = column.prop
+      this.searchData.PageIndex = 1
+      this.getList()
+    },
+    handleSelectionChange(val) {
+      this.selectTable = val
+    },
+    // 保存菜单数据
+    async saveRowData() {
+      try {
+        this.rowBtnLoading = true
+        let res = await addOrUpdateTrialFileType(this.rowData)
+        this.rowBtnLoading = false
+        if (res.IsSuccess) {
+          this.rowBtnStatus = 'edit'
+          this.$emit('getMenu')
+          this.$message.success(this.$t('common:message:savedSuccessfully'))
+        }
+      } catch (err) {
+        console.log(err)
+        this.rowBtnLoading = false
+      }
+    },
+    // 预览
+    preview(row) {
+      if (!row.FilePath) return false
+      this.$preview({
+        path: row.FilePath || row.fullPath,
+        type: 'pdf',
+        title: row.FileName,
+      })
+    },
+    close() {
+      this.config.visible = false
+      // this.selectData = {}
+      // this.selectKey = null
+      this.faccept = ['.pdf']
+      this.limitLength = 0
+    },
+    updateClose() {
+      this.update_config.visible = false
+    },
+    fileSizeFormatter(size) {
+      if (!size) return
+      return (size / Math.pow(1024, 2)).toFixed(3) + 'M'
+    },
+    openFile(isFolder = false) {
+      this.selectData = {}
+      this.selectKey = null
+      this.faccept = ['.pdf']
+      this.limitLength = 0
+      this.config.title = this.$t(
+        'trials:trialDocument:trainRecord:form:title:uploadFile'
+      )
+      this.config.visible = true
+      this.config.isFolder = isFolder
+    },
+  },
+  watch: {
+    Id: {
+      handler() {
+        this.getList()
+      },
+      immediate: true,
+    },
+  },
+  created() {
+    let typeArr = ['', 'Report', 'Doc', 'Record', 'Reviewer', 'Template']
+    let types = typeArr[this.ArchiveTypeEnum]
+    this.uploadPath = `/${this.$route.query.trialId}/Document/${types}`
+    console.log(this.uploadPath, this.ArchiveTypeEnum)
+  },
+  computed: {
+    isEN() {
+      return this.$i18n.locale !== 'zh'
+    },
+    isInspect() {
+      return this.hasPermi([
+        'trials:trials-panel:trial-summary:trial-document:inspect',
+      ])
+    },
+    isManage() {
+      return this.hasPermi([
+        'trials:trials-panel:trial-summary:trial-document:manage',
+      ])
+    },
+    hasAdd() {
+      return this.hasPermi([
+        'trials:trials-panel:trial-summary:trial-document:add',
+      ])
+    },
+    hasEdit() {
+      return this.hasPermi([
+        'trials:trials-panel:trial-summary:trial-document:edit',
+      ])
+    },
+    hasDel() {
+      return this.hasPermi([
+        'trials:trials-panel:trial-summary:trial-document:del',
+      ])
+    },
+    hasDownLoad() {
+      return this.hasPermi([
+        'trials:trials-panel:trial-summary:trial-document:downLoad',
+      ])
+    },
+    hasAccredit() {
+      return this.hasPermi([
+        'trials:trials-panel:trial-summary:trial-document:accredit',
+      ])
+    },
+    TITLE() {
+      return `${this.$fd('ArchiveType', this.ArchiveTypeEnum)} — ${
+        this.isEN ? this.rowData.Name : this.rowData.NameCN
+      }`
+    },
+  },
+}
+</script>
+    <style lang="scss" scoped>
+.title {
+  line-height: 40px;
+  font-weight: bold;
+  margin-bottom: 10px;
+}
+.fileName {
+  display: inline-block;
+  max-width: calc(100% - 60px);
+  white-space: nowrap; /* 文本不换行 */
+  overflow: hidden; /* 超出部分隐藏 */
+  text-overflow: ellipsis;
+}
+.fileBtnBox {
+  display: inline-block;
+  width: 50px;
+  i {
+    cursor: pointer;
+    color: #409eff;
+    margin-right: 3px;
+    &:last-child {
+      margin: 0;
+    }
+  }
+}
+</style>

src/views/trials/trials-panel/trial-summary/trial-document/components/uploadFiles.vue

@@ -0,0 +1,502 @@
+<template>
+  <base-model :config="config">
+    <div slot="dialog-body">
+      <!-- 多文件上传 -->
+      <form id="inputForm" ref="uploadForm">
+        <el-divider content-position="left">{{
+          $t('trials:trialDocument:label:fileType').replace(
+            'xxx',
+            faccept.join('/')
+          )
+        }}</el-divider>
+        <div class="form-group">
+          <div
+            class="upload"
+            style="margin-right: 10px"
+            :disabled="limitLength"
+          >
+            <input
+              multiple="multiple"
+              webkitdirectory=""
+              directory
+              accept="*/*"
+              type="file"
+              name="uploadFolder"
+              class="select-file"
+              title=""
+              @change="beginScanFiles($event)"
+              v-if="!loading && (!limitLength || fileList.length < limitLength)"
+            />
+            <div class="btn-select">
+              {{ $t('trials:trialDocument:button:selectFolder') }}
+            </div>
+          </div>
+          <div class="upload">
+            <input
+              class="select-file"
+              multiple=""
+              :accept="faccept.join(',')"
+              type="file"
+              name="uploadFile"
+              title=""
+              @change="beginScanFiles($event)"
+              v-if="!loading && (!limitLength || fileList.length < limitLength)"
+            />
+            <div class="btn-select">
+              {{ $t('trials:trialDocument:button:select') }}
+            </div>
+          </div>
+        </div>
+      </form>
+      <!-- 文件列表 -->
+      <el-table
+        ref="filesTable"
+        :data="fileList"
+        class="dicomFiles-table"
+        height="300"
+        @selection-change="handleSelectionChange"
+      >
+        <el-table-column
+          type="selection"
+          width="55"
+          :selectable="(row, index) => row.status !== 2 && !loading"
+        />
+        <el-table-column type="index" width="50" />
+        <!-- 文件名称 -->
+        <el-table-column
+          prop="name"
+          :label="$t('trials:trialDocument:table:fileName')"
+          min-width="100"
+        />
+        <!-- 文件大小 -->
+        <el-table-column
+          prop="size"
+          :label="$t('trials:trialDocument:table:fileSize')"
+        >
+          <template slot-scope="scope">
+            <span>{{
+              scope.row.size && scope.row.size > 0
+                ? `${(scope.row.size / 1024 / 1024).toFixed(2)}MB`
+                : ''
+            }}</span>
+          </template>
+        </el-table-column>
+        <!-- 文件类型 -->
+        <el-table-column
+          prop="type"
+          :label="$t('trials:trialDocument:table:fileType')"
+        />
+        <!-- 上传状态 -->
+        <el-table-column
+          prop="status"
+          :label="$t('trials:trialDocument:table:uploadStatus')"
+          min-width="100"
+        >
+          <template slot-scope="scope">
+            <el-tag
+              :type="['warning', 'info', 'success', 'danger'][scope.row.status]"
+              v-if="scope.row.status || scope.row.status === 0"
+              >{{ $fd('NoneDicomUploadStatus', scope.row.status) }}
+            </el-tag>
+          </template>
+        </el-table-column>
+        <el-table-column
+          :label="$t('trials:trialDocument:table:failedFileCount')"
+          min-width="150"
+          show-overflow-tooltip
+        >
+          <template slot-scope="scope">
+            <el-progress
+              color="#409eff"
+              :percentage="
+                ((scope.row.uploadFileSize * 100) / scope.row.size).toFixed(2) *
+                1
+              "
+            />
+          </template>
+        </el-table-column>
+        <el-table-column :label="$t('common:action:action')">
+          <template slot-scope="scope">
+            <el-button
+              size="mini"
+              icon="el-icon-delete"
+              circle
+              :disabled="loading"
+              :title="$t('trials:trialDocument:action:delete')"
+              @click="handleRemoveFile(scope.row)"
+            />
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+    <div slot="dialog-footer">
+      <div style="text-align: right; padding: 10px 0px">
+        <span style="margin-right: 10px">{{
+          $store.state.trials.uploadTip
+        }}</span>
+        <el-button
+          size="small"
+          type="primary"
+          :disabled="selectArr.length == 0"
+          :loading="loading"
+          @click="beginUpload"
+        >
+          {{ $t('trials:trialDocument:action:upload') }}
+        </el-button>
+      </div>
+    </div>
+  </base-model>
+</template>
+<script>
+import baseModel from '@/components/BaseModel'
+import { deepClone } from '@/utils/index.js'
+import store from '@/store'
+export default {
+  name: 'uploadFiles',
+  props: {
+    config: {
+      required: true,
+      default: () => {
+        return {
+          visible: false,
+        }
+      },
+    },
+    faccept: {
+      type: Array,
+      default: () => {
+        return []
+      },
+    },
+    uploadPath: {
+      type: String,
+      default: '',
+    },
+    limitLength: {
+      type: Number,
+      default: 0,
+    },
+  },
+  components: {
+    'base-model': baseModel,
+  },
+  data() {
+    return {
+      loading: false,
+      fileList: [],
+      selectArr: [],
+      isFail: false,
+      successFileList: [],
+      fileInput: null,
+    }
+  },
+  methods: {
+    // 获取待上传文件信息
+    handleSelectionChange(selection) {
+      this.selectArr = selection
+    },
+    // 扫描待上传文件
+    beginScanFiles(e) {
+      if (this.fileInput) {
+        this.fileInput = null
+      }
+      var files = [...e.target.files]
+      if (this.limitLength && this.fileList.length >= this.limitLength)
+        return this.$message.warning(
+          this.$t('trials:trialDocument:message:limitLength')
+        )
+      var sameFiles = []
+      files.forEach((file) => {
+        var extendName = file.name
+          .substring(file.name.lastIndexOf('.'))
+          .toLocaleLowerCase()
+        if (
+          this.faccept.indexOf(extendName) !== -1 &&
+          this.fileList.findIndex((v) => v.name === file.name) > -1
+        ) {
+          sameFiles.push(file.name)
+        }
+      })
+      var scope = this
+      if (sameFiles.length > 0) {
+        const h = this.$createElement
+        var msg = this.$t('trials:trialDocument:message:exsitSameFile').replace(
+          'xxx',
+          sameFiles.join(', ')
+        )
+        this.$msgbox({
+          message: h('div', { style: 'maxHeight:300px;overflow: auto;' }, [
+            h('p', null, msg),
+            h(
+              'p',
+              null,
+              this.$t('trials:trialDocument:message:isContinueUpload')
+            ),
+          ]),
+          type: 'warning',
+          showCancelButton: true,
+        })
+          .then(() => {
+            scope.pendingUploadQuene(files)
+          })
+          .catch(() => {
+            scope.resetUploadForm()
+          })
+      } else {
+        scope.pendingUploadQuene(files)
+      }
+    },
+    pendingUploadQuene(files) {
+      for (var i = 0; i < files.length; ++i) {
+        const fileName = files[i].name
+        var extendName = fileName
+          .substring(fileName.lastIndexOf('.'))
+          .toLocaleLowerCase()
+        if (this.faccept.indexOf(extendName) !== -1) {
+          files[i].id = `${files[i].lastModified}${files[i].name}`
+          let obj = {
+            name: files[i].name,
+            size: files[i].size,
+            type: extendName.split('.')[1],
+            status: 0,
+            file: files[i],
+            id: `${files[i].lastModified}${files[i].name}`,
+            fileType: files[i].type,
+            uploadFileSize: 0,
+          }
+          this.fileList.push(obj)
+          this.$refs.filesTable.toggleRowSelection(obj, true)
+        }
+      }
+      this.resetUploadForm()
+    },
+    resetUploadForm() {
+      this.$nextTick(() => {
+        this.$refs.uploadForm.reset()
+      })
+    },
+    handleRemoveFile(row) {
+      this.$confirm(this.$t('trials:trialDocument:message:delete'), {
+        type: 'warning',
+        distinguishCancelAndClose: true,
+      })
+        .then(() => {
+          this.fileList.splice(
+            this.fileList.findIndex((item) => item.id === row.id),
+            1
+          )
+          let flag = this.successFileList.some((item) => item.id === row.id)
+          if (flag) {
+            this.successFileList.splice(
+              this.successFileList.findIndex((item) => item.id === row.id),
+              1
+            )
+          }
+        })
+        .catch(() => {})
+    },
+    // 开始上传文件
+    async beginUpload() {
+      this.loading = true
+      this.isFail = false
+      const fileMaxSize = 1024 * 1024 * 1024 * 2 // 1G
+      var currentFilesSize = 0
+      this.selectArr.forEach((item) => {
+        currentFilesSize += item.size
+      })
+      if (currentFilesSize / fileMaxSize > 1) {
+        // 'Upload file size cannot exceed 1G'
+        this.$alert(this.$t('trials:trialDocument:message:uploadSize'))
+        this.loading = false
+      } else {
+        this.selectArr.forEach((item) => (item.status = 0))
+        let num = this.selectArr.length > 6 ? 6 : this.selectArr.length
+        let funArr = []
+        for (let i = 0; i < num; i++) {
+          funArr.push(this.handleUploadTask(this.selectArr, i))
+        }
+        if (funArr.length > 0) {
+          let res = await Promise.all(funArr)
+        }
+      }
+    },
+    // 并发上传
+    async handleUploadTask(arr, index) {
+      if (!this.config.visible) return
+      let file = this.fileList.filter((item) => item.id === arr[index].id)[0]
+      file.status = 1
+      let fileType = file.name
+        .substring(file.name.lastIndexOf('.'))
+        .toLocaleLowerCase()
+      let fileName = file.name
+        .substring(0, file.name.lastIndexOf('.'))
+        .toLocaleLowerCase()
+      let path = `${this.uploadPath}/${fileName}${fileType}`
+      file.curPath = path
+      const fileData = await this.fileToBlob(file.file)
+      let res = await this.fileToOss(path, fileData, file)
+      if (res) {
+        file.status = 2
+        this.successFileList.push({
+          FileName: file.name,
+          FilePath: this.$getObjectName(res.url),
+          FileSize: file.size,
+          FileFormat: fileType,
+        })
+        let flag = arr.every((item) => item.status === 2)
+        if (flag) {
+          return this.submitFile(this.successFileList)
+        }
+      } else {
+        file.status = 3
+      }
+      let flag = arr.every((item) => item.status > 1)
+      if (flag) {
+        let failFileList = arr.filter((item) => item.status === 3)
+        if (failFileList && failFileList.length > 0) {
+          this.$refs.filesTable.clearSelection()
+          failFileList.forEach((row) => {
+            row.uploadFileSize = 0
+            this.$refs.filesTable.toggleRowSelection(row)
+          })
+          this.isFail = true
+          this.submitFile(this.successFileList, true)
+          return false
+        }
+      }
+      let ind = arr.findIndex((item) => item.status === 0)
+      if (ind >= 0) {
+        return this.handleUploadTask(arr, ind)
+      } else {
+        return false
+      }
+    },
+    // file上传到oss
+    async fileToOss(path, file, item) {
+      try {
+        let res = await this.OSSclient.multipartUpload(
+          {
+            path,
+            file,
+            speed: true,
+          },
+          (percentage, checkpoint, lastPer) => {
+            item.uploadFileSize += checkpoint.size * (percentage - lastPer)
+            if (item.uploadFileSize > file.fileSize) {
+              item.uploadFileSize = file.fileSize
+            }
+          }
+        )
+        if (res) {
+          return res
+        } else {
+          return false
+        }
+      } catch (err) {
+        console.log(err)
+        return false
+      }
+    },
+    submitFile(list, isReLoad = false) {
+      if (!this.config.visible) return
+      if (!isReLoad) {
+        this.reset()
+      }
+      let arr = deepClone(list)
+      this.$emit('uplaodFile', arr)
+    },
+    reset() {
+      this.loading = false
+      this.selectArr = []
+      this.successFileList = []
+      this.OSSclient.close()
+      this.$emit('close')
+    },
+    openFile(isFolder = false) {
+      this.fileInput = document.createElement('input')
+      this.fileInput.type = 'file'
+      this.fileInput.addEventListener('change', this.beginScanFiles)
+      if (isFolder) {
+        this.fileInput.accept = '*/*'
+        //webkitdirectory directory
+        this.fileInput.webkitdirectory = 'webkitdirectory'
+        this.fileInput.directory = 'directory'
+      } else {
+        this.fileInput.accept = this.faccept.join(',')
+      }
+      console.log(this.fileInput)
+      this.fileInput.click()
+    },
+  },
+  watch: {
+    isFail() {
+      if (this.isFail) {
+        this.$confirm(this.$t('trials:trialDocument:failUpload'), {
+          type: 'warning',
+          distinguishCancelAndClose: true,
+          confirmButtonText: this.$t('common:button:confirm'),
+          cancelButtonText: this.$t('common:button:cancel'),
+        })
+          .then(() => {
+            this.beginUpload()
+          })
+          .catch((err) => {
+            this.loading = false
+            console.log(err)
+          })
+      }
+    },
+    loading() {
+      store.dispatch('trials/setUnLock', this.loading)
+    },
+  },
+  mounted() {
+    this.openFile(this.config.isFolder)
+  },
+  beforeDestroy() {
+    store.dispatch('trials/setUnLock', false)
+    this.OSSclient.close()
+  },
+}
+</script>
+<style lang="scss" scoped>
+.upload {
+  display: inline-block;
+  height: 30px;
+  width: 90px;
+  padding: 2px 10px;
+  line-height: 23px;
+  position: relative;
+  text-decoration: none;
+  border-radius: 3px;
+  overflow: hidden;
+  text-align: center;
+  background: #428bca;
+  border-color: #428bca;
+  color: #fff;
+  .select-file {
+    height: 30px;
+    width: 90px;
+    position: absolute;
+    overflow: hidden;
+    left: 0;
+    top: 0;
+    opacity: 0;
+    font-size: 0;
+  }
+  .btn-select {
+    //给显示在页面上的按钮写样式
+    width: 90px;
+    height: 30px;
+    line-height: 30px;
+    text-align: center;
+    cursor: pointer;
+    border-radius: 24px;
+    overflow: hidden;
+    position: absolute;
+    top: 0;
+    left: 0;
+    pointer-events: none; //pointer-events:none用来控制该标签的点击穿透事件
+  }
+}
+</style>

src/views/trials/trials-panel/trial-summary/trial-document/index.vue

@@ -0,0 +1,151 @@
+<template>
+  <div class="trialDocument">
+    <div class="left">
+      <div class="top" v-if="isManage">
+        <div class="viewCheck">
+          <span>{{ $t('trials:trialDocument:view') }}</span>
+          <el-switch
+            v-model="viewStatus"
+            active-color="#13ce66"
+            inactive-color="#409eff"
+            :active-value="false"
+            :inactive-value="true"
+            :active-text="$t('trials:trialDocument:viewStatus:manage')"
+            :inactive-text="$t('trials:trialDocument:viewStatus:inspect')"
+            @change="handleChange"
+          >
+          </el-switch>
+        </div>
+      </div>
+      <div
+        :class="{
+          menuBox: true,
+          noTop: !isManage,
+        }"
+      >
+        <Menu
+          ref="Menu"
+          :viewStatus="viewStatus"
+          :Id.sync="Id"
+          :SubIdentificationEnum.sync="SubIdentificationEnum"
+          :ArchiveTypeEnum.sync="ArchiveTypeEnum"
+          :rowData.sync="rowData"
+        />
+      </div>
+    </div>
+    <div class="main">
+      <report-doc
+        v-if="[0, 1].includes(SubIdentificationEnum)"
+        :viewStatus="viewStatus"
+        :Id="Id"
+        :ArchiveTypeEnum="ArchiveTypeEnum"
+        :rowData="rowData"
+        @getMenu="getMenu"
+      />
+      <file-record
+        v-if="[2].includes(SubIdentificationEnum)"
+        :viewStatus="viewStatus"
+        :Id="Id"
+        :ArchiveTypeEnum="ArchiveTypeEnum"
+        :rowData="rowData"
+        @getMenu="getMenu"
+      />
+      <!--v-if="[4].includes(SubIdentificationEnum)"-->
+      <train-record
+        v-if="[4].includes(SubIdentificationEnum)"
+        :viewStatus="viewStatus"
+        :Id="Id"
+        :ArchiveTypeEnum="ArchiveTypeEnum"
+        :rowData="rowData"
+        @getMenu="getMenu"
+      />
+    </div>
+  </div>
+</template>
+<script>
+import BaseContainer from '@/components/BaseContainer'
+import Menu from './components/menu.vue'
+import reportDoc from './components/report_doc/index.vue'
+import fileRecord from './components/fileRecord/index.vue'
+import trainRecord from './components/trainRecord/index.vue'
+export default {
+  name: 'trialDocument',
+  components: { BaseContainer, Menu, reportDoc, fileRecord, trainRecord },
+  data() {
+    return {
+      viewStatus: false,
+      Id: null,
+      SubIdentificationEnum: null,
+      ArchiveTypeEnum: null,
+      rowData: {},
+    }
+  },
+  computed: {
+    isInspect() {
+      return this.hasPermi([
+        'trials:trials-panel:trial-summary:trial-document:inspect',
+      ])
+    },
+    isManage() {
+      return this.hasPermi([
+        'trials:trials-panel:trial-summary:trial-document:manage',
+      ])
+    },
+  },
+  methods: {
+    handleChange() {
+      this.Id = null
+      this.SubIdentificationEnum = null
+      this.ArchiveTypeEnum = null
+      this.rowData = {}
+    },
+    getMenu() {
+      this.$refs.Menu.getMenu()
+    },
+  },
+}
+</script>
+<style lang="scss" scoped>
+.trialDocument {
+  width: 100%;
+  height: 100%;
+  background-color: #fff;
+  display: flex;
+  align-items: center;
+  .left {
+    width: 300px;
+    height: 100%;
+    box-sizing: border-box;
+    border-right: 1px solid #e4e7ed;
+    .top {
+      width: 100%;
+      max-height: 75px;
+      display: flex;
+      flex-wrap: wrap;
+      padding: 0 15px;
+      margin-bottom: 5px;
+      .viewCheck {
+        width: 100%;
+        line-height: 30px;
+        margin-bottom: 10px;
+      }
+    }
+    .menuBox {
+      width: 100%;
+      height: calc(100% - 80px);
+      overflow-y: auto;
+      &::-webkit-scrollbar {
+        display: none; /* Chrome Safari */
+      }
+    }
+    .noTop {
+      height: 100%;
+    }
+  }
+  .main {
+    width: calc(100% - 300px);
+    height: 100%;
+    padding: 10px;
+  }
+}
+</style>

src/views/trials/trials-panel/visit/crc-upload/components/studyInfo.vue

@@ -14,7 +14,7 @@
         icon="el-icon-delete"
         @click="handleBatchDelete"
       >
-        {{ $t("trials:uploadedDicoms:action:delete") }}
+        {{ $t('trials:uploadedDicoms:action:delete') }}
       </el-button>
       <!-- 预览 -->
       <el-button
@@ -24,7 +24,7 @@
         icon="el-icon-view"
         @click="handlePreviewAllFiles"
       >
-        {{ $t("trials:uploadedDicoms:action:preview") }}
+        {{ $t('trials:uploadedDicoms:action:preview') }}
       </el-button>
     </div>
     <el-table
@@ -34,6 +34,7 @@
       height="300"
       :row-class-name="tableRowClassName"
       @selection-change="handleSelectionChange"
+      :default-sort="{ prop: 'UploadedTime', order: 'descending' }"
     >
       <el-table-column
         v-if="!(data.SubmitState * 1 === 2) || data.IsQCConfirmedReupload"
@@ -46,21 +47,32 @@
         :label="$t('trials:uploadedDicoms:table:studyId')"
         min-width="80"
         show-overflow-tooltip
+        sortable
+      />
+      <!-- 检查名称 -->
+      <el-table-column
+        v-if="relationInfo.IsShowStudyName"
+        prop="StudyName"
+        :label="$t('trials:audit:table:StudyName')"
+        sortable
       />
       <!-- 检查类型 -->
       <el-table-column
         prop="ModalityForEdit"
         :label="$t('trials:audit:table:modality')"
+        sortable
       />
       <!-- 检查类型 -->
       <el-table-column
         prop="Modalities"
         :label="$t('trials:audit:table:modality1')"
+        sortable
       />
       <!-- 检查部位 -->
       <el-table-column
         prop="BodyPartForEdit"
         :label="$t('trials:uploadedDicoms:table:bodyPart')"
+        sortable
         min-width="100"
         show-overflow-tooltip
       >
@@ -72,6 +84,7 @@
       <el-table-column
         prop="SeriesCount"
         :label="$t('trials:uploadedDicoms:table:seriesCount')"
+        sortable
         min-width="100"
         show-overflow-tooltip
       />
@@ -79,6 +92,7 @@
       <el-table-column
         prop="InstanceCount"
         :label="$t('trials:uploadedDicoms:table:instanceCount')"
+        sortable
         min-width="100"
         show-overflow-tooltip
       />
@@ -86,18 +100,28 @@
       <el-table-column
         prop="StudyTime"
         :label="$t('trials:uploadedDicoms:table:studyDate')"
+        sortable
         min-width="120"
         show-overflow-tooltip
       >
         <template slot-scope="scope">
-          {{ moment(scope.row.StudyTime).format("YYYY-MM-DD") }}
+          {{ moment(scope.row.StudyTime).format('YYYY-MM-DD') }}
         </template>
       </el-table-column>
+      <!-- 更新时间 -->
+      <el-table-column
+        prop="UpdateTime"
+        :label="$t('trials:uploadedDicoms:table:UpdateTime')"
+        min-width="120"
+        show-overflow-tooltip
+        sortable
+      />
       <!-- 上传时间 -->
       <el-table-column
         prop="UploadedTime"
         :label="$t('trials:uploadedDicoms:table:uploadedTime')"
-        min-width="80"
+        sortable
+        min-width="120"
         show-overflow-tooltip
       />
       <el-table-column
@@ -223,7 +247,9 @@
                 v-for="bodyPart in trialBodyPartTypes"
                 :key="bodyPart"
                 :label="bodyPart"
-                >{{ $fd("Bodypart", bodyPart,'Code',BodyPart,'Name') }}</el-checkbox
+                >{{
+                  $fd('Bodypart', bodyPart, 'Code', BodyPart, 'Name')
+                }}</el-checkbox
               >
             </el-checkbox-group>
           </el-form-item>
@@ -258,7 +284,7 @@
           type="primary"
           @click="editStudyInfoVisible = false"
         >
-          {{ $t("common:button:cancel") }}
+          {{ $t('common:button:cancel') }}
         </el-button>
         <el-button
           :loading="btnLoading"
@@ -266,7 +292,7 @@
           type="primary"
           @click="handleUpdateStudyInfo"
         >
-          {{ $t("common:button:save") }}
+          {{ $t('common:button:save') }}
         </el-button>
       </div>
     </el-dialog>
@@ -291,18 +317,18 @@ import {
   getSubjectVisitUploadedStudyList,
   deleteStudyList,
   updateModality,
-} from "@/api/trials";
-import moment from "moment";
-import { getToken } from "@/utils/auth";
-import uploadPetClinicalData from "./uploadPetClinicalData.vue";
+} from '@/api/trials'
+import moment from 'moment'
+import { getToken } from '@/utils/auth'
+import uploadPetClinicalData from './uploadPetClinicalData.vue'
 export default {
-  name: "StudyInfo",
+  name: 'StudyInfo',
   components: { uploadPetClinicalData },
   props: {
     data: {
       type: Object,
       default() {
-        return {};
+        return {}
       },
     },
   },
@@ -310,12 +336,12 @@ export default {
     return {
       editStudyInfoVisible: false,
       studyForm: {
-        StudyCode: "",
+        StudyCode: '',
         IsDicomData: true,
-        Modalities: "",
+        Modalities: '',
         BodyPartForEdit: [],
         SeriesCount: null,
-        StudyTime: "",
+        StudyTime: '',
       },
       deleteArr: [],
       studyLoading: false,
@@ -331,189 +357,187 @@ export default {
       petVisible: false,
       rowData: {},
 
-      BodyPart:{}
-    };
+      BodyPart: {},
+    }
   },
   async mounted() {
-    this.getStudyInfo();
+    this.getStudyInfo()
     this.BodyPart.Bodypart = await this.$getBodyPart(this.$route.query.trialId)
   },
   methods: {
     // 预览临床数据
     handlePreviewClinicalData(row) {
-      this.rowData = row;
-      this.petVisible = true;
+      this.rowData = row
+      this.petVisible = true
     },
     // 打开检查信息编辑框
     handleEditStudy(row) {
-      this.editStudyInfoVisible = true;
-      this.studyForm = { ...row };
-      var bodyPart = [];
-      if (this.studyForm.BodyPartForEdit.indexOf("|") !== -1) {
-        bodyPart = this.studyForm.BodyPartForEdit.split("|");
-      } else if (this.studyForm.BodyPartForEdit !== "") {
-        bodyPart.push(this.studyForm.BodyPartForEdit);
+      this.editStudyInfoVisible = true
+      this.studyForm = { ...row }
+      var bodyPart = []
+      if (this.studyForm.BodyPartForEdit.indexOf('|') !== -1) {
+        bodyPart = this.studyForm.BodyPartForEdit.split('|')
+      } else if (this.studyForm.BodyPartForEdit !== '') {
+        bodyPart.push(this.studyForm.BodyPartForEdit)
       }
-      this.studyForm.BodyPartForEdit = bodyPart;
+      this.studyForm.BodyPartForEdit = bodyPart
     },
     // 更新拍片部位/拍片类型信息
     handleUpdateStudyInfo() {
-      this.$refs["studyForm"].validate((valid) => {
-        if (!valid) return;
-        this.btnLoading = true;
-        this.studyForm.BodyPart = this.studyForm.BodyPartForEdit.join("|");
-        this.studyForm.Modality = this.studyForm.Modalities;
+      this.$refs['studyForm'].validate((valid) => {
+        if (!valid) return
+        this.btnLoading = true
+        this.studyForm.BodyPart = this.studyForm.BodyPartForEdit.join('|')
+        this.studyForm.Modality = this.studyForm.Modalities
         var params = {
           id: this.studyForm.StudyId,
           subjectVisitId: this.data.Id,
           type: 1,
           modality: this.studyForm.Modality,
           bodyPart: this.studyForm.BodyPart,
-        };
+        }
         updateModality(this.data.TrialId, params)
           .then((res) => {
-            this.btnLoading = false;
+            this.btnLoading = false
             if (res.IsSuccess) {
-              this.getStudyInfo();
-              this.$message.success(
-                this.$t("common:message:savedSuccessfully")
-              );
-              this.editStudyInfoVisible = false;
+              this.getStudyInfo()
+              this.$message.success(this.$t('common:message:savedSuccessfully'))
+              this.editStudyInfoVisible = false
             }
           })
           .catch(() => {
-            this.btnLoading = false;
-          });
-      });
+            this.btnLoading = false
+          })
+      })
     },
     getStudyInfo() {
-      this.studyLoading = true;
+      this.studyLoading = true
       getSubjectVisitUploadedStudyList(this.data.Id)
         .then((res) => {
-          this.studyList = res.Result;
-          this.studyLoading = false;
-          this.relationInfo = res.OtherInfo;
-          console.log(this.relationInfo);
+          this.studyList = res.Result
+          this.studyLoading = false
+          this.relationInfo = res.OtherInfo
+          console.log(this.relationInfo)
           this.trialBodyPartTypes = this.relationInfo.BodyPartTypes
-            ? this.relationInfo.BodyPartTypes.split("|")
-            : [];
+            ? this.relationInfo.BodyPartTypes.split('|')
+            : []
           this.trialModalitys = this.relationInfo.Modalitys
-            ? this.relationInfo.Modalitys.split("|")
-            : [];
-          console.log(this.trialBodyPartTypes);
-          console.log(this.trialModalitys);
+            ? this.relationInfo.Modalitys.split('|')
+            : []
+          console.log(this.trialBodyPartTypes)
+          console.log(this.trialModalitys)
         })
         .catch(() => {
-          this.studyLoading = false;
-        });
+          this.studyLoading = false
+        })
     },
     // 批量删除
     handleBatchDelete() {
-      this.$confirm(this.$t("trials:uploadedDicoms:message:deleteMes"), {
-        type: "warning",
+      this.$confirm(this.$t('trials:uploadedDicoms:message:deleteMes'), {
+        type: 'warning',
         distinguishCancelAndClose: true,
       })
         .then(() => {
-          this.studyLoading = true;
+          this.studyLoading = true
           deleteStudyList(this.trialId, this.data.Id, this.deleteArr)
             .then((res) => {
               if (res.IsSuccess) {
-                this.getStudyInfo();
-                this.$emit("getList");
+                this.getStudyInfo()
+                this.$emit('getList')
                 this.$message.success(
-                  this.$t("trials:uploadedDicoms:message:deleteSuccessfully")
-                );
+                  this.$t('trials:uploadedDicoms:message:deleteSuccessfully')
+                )
               }
             })
             .catch(() => {
-              this.studyLoading = true;
-            });
+              this.studyLoading = true
+            })
         })
-        .catch(() => {});
+        .catch(() => {})
     },
     // 预览所有影像
     handlePreviewAllFiles() {
-      var tokenKey = getToken();
+      var tokenKey = getToken()
       const routeData = this.$router.resolve({
         path: `/showvisitdicoms?trialId=${this.data.TrialId}&visitInfo=${this.data.VisitName}(${this.data.VisitNum})&subjectVisitId=${this.data.Id}&isFromCRCUpload=1&TokenKey=${tokenKey}`,
-      });
-      var newWindow = window.open(routeData.href, "_blank");
-      this.$emit("setOpenWindow", newWindow);
+      })
+      var newWindow = window.open(routeData.href, '_blank')
+      this.$emit('setOpenWindow', newWindow)
     },
     // 预览影像
     handleViewStudy(row) {
-      var token = getToken();
+      var token = getToken()
       const routeData = this.$router.resolve({
         path: `/showdicom?studyId=${row.StudyId}&isFromCRCUpload=1&TokenKey=${token}&type=Study`,
-      });
-      var newWindow = window.open(routeData.href, "_blank");
-      this.$emit("setOpenWindow", newWindow);
+      })
+      var newWindow = window.open(routeData.href, '_blank')
+      this.$emit('setOpenWindow', newWindow)
     },
     // 删除某个检查
     handleDeleteStudy(row) {
-      this.$confirm(this.$t("trials:uploadedDicoms:message:deleteMes"), {
-        type: "warning",
+      this.$confirm(this.$t('trials:uploadedDicoms:message:deleteMes'), {
+        type: 'warning',
         distinguishCancelAndClose: true,
       })
         .then(() => {
-          this.studyLoading = true;
+          this.studyLoading = true
           deleteStudyList(this.trialId, this.data.Id, [row.StudyId])
             .then((res) => {
               if (res.IsSuccess) {
-                this.getStudyInfo();
-                this.$emit("getList");
+                this.getStudyInfo()
+                this.$emit('getList')
                 this.$message.success(
-                  this.$t("trials:uploadedDicoms:message:deleteSuccessfully")
-                );
+                  this.$t('trials:uploadedDicoms:message:deleteSuccessfully')
+                )
               }
             })
             .catch(() => {
-              this.studyLoading = true;
-            });
+              this.studyLoading = true
+            })
         })
-        .catch(() => {});
+        .catch(() => {})
     },
     getBodyPart(bodyPart) {
-      if (!bodyPart) return "";
-      var separator = ",";
-      if (bodyPart.indexOf("|") > -1) {
-        separator = "|";
-      } else if (bodyPart.indexOf(",") > -1) {
-        separator = ",";
-      } else if (bodyPart.indexOf("，") > -1) {
-        separator = "，";
+      if (!bodyPart) return ''
+      var separator = ','
+      if (bodyPart.indexOf('|') > -1) {
+        separator = '|'
+      } else if (bodyPart.indexOf(',') > -1) {
+        separator = ','
+      } else if (bodyPart.indexOf('，') > -1) {
+        separator = '，'
       }
-      var arr = bodyPart.split(separator);
-      var newArr = arr.map(i => {
-        return this.$fd('Bodypart', i.trim(),'Code',this.BodyPart,'Name')
+      var arr = bodyPart.split(separator)
+      var newArr = arr.map((i) => {
+        return this.$fd('Bodypart', i.trim(), 'Code', this.BodyPart, 'Name')
       })
-      return newArr.join(" | ");
+      return newArr.join(' | ')
     },
     // 获取勾选项
     handleSelectionChange(val) {
-      this.deleteArr = [];
+      this.deleteArr = []
       val.forEach((item) => {
-        this.deleteArr.push(item.StudyId);
-      });
+        this.deleteArr.push(item.StudyId)
+      })
     },
     // 设置已删除行勾选状态
     hasDeleted(row) {
       if (row.IsDeleted) {
-        return false;
+        return false
       } else {
-        return true;
+        return true
       }
     },
     // 设置已删除序列行样式
     tableRowClassName({ row, rowIndex }) {
       if (row.IsDeleted) {
-        return "delete-row";
+        return 'delete-row'
       } else {
-        return "";
+        return ''
       }
     },
   },
-};
+}
 </script>
 <style lang="scss">
 .study-info {

src/views/trials/trials-panel/visit/crc-upload/components/uploadDicomFiles2.vue

@@ -36,6 +36,7 @@
       :row-class-name="tableRowClassName"
       max-height="250"
       @selection-change="handleUploadedSelectionChange"
+      :default-sort="{ prop: 'UploadedTime', order: 'descending' }"
     >
       <el-table-column type="selection" width="55" />
       <!-- 检查编号 -->
@@ -44,6 +45,7 @@
         :label="$t('trials:uploadedDicoms:table:studyId')"
         min-width="80"
         show-overflow-tooltip
+        sortable
       >
         <template slot-scope="scope">
           <el-tooltip
@@ -87,15 +89,24 @@
           {{ scope.row.StudyCode }}
         </template>
       </el-table-column>
+      <!-- 检查名称 -->
+      <el-table-column
+        v-if="relationInfo.IsShowStudyName"
+        prop="StudyName"
+        :label="$t('trials:audit:table:StudyName')"
+        sortable
+      />
       <!-- 检查类型 -->
       <el-table-column
         prop="ModalityForEdit"
         :label="$t('trials:audit:table:modality')"
+        sortable
       />
       <!-- 检查设备 -->
       <el-table-column
         prop="Modalities"
         :label="$t('trials:audit:table:modality1')"
+        sortable
       />
       <!-- 检查部位 -->
       <el-table-column
@@ -103,6 +114,7 @@
         :label="$t('trials:uploadedDicoms:table:bodyPart')"
         min-width="100"
         show-overflow-tooltip
+        sortable
       >
         <template slot-scope="scope">
           {{ getBodyPart(scope.row.BodyPartForEdit) }}
@@ -114,6 +126,7 @@
         :label="$t('trials:uploadedDicoms:table:seriesCount')"
         min-width="100"
         show-overflow-tooltip
+        sortable
       />
       <!-- 图像数量 -->
       <el-table-column
@@ -121,6 +134,7 @@
         :label="$t('trials:uploadedDicoms:table:instanceCount')"
         min-width="100"
         show-overflow-tooltip
+        sortable
       />
       <!-- 检查日期 -->
       <el-table-column
@@ -128,6 +142,7 @@
         :label="$t('trials:uploadedDicoms:table:studyDate')"
         min-width="120"
         show-overflow-tooltip
+        sortable
       >
         <template slot-scope="scope">
           {{
@@ -137,12 +152,21 @@
           }}
         </template>
       </el-table-column>
+      <!-- 更新时间 -->
+      <el-table-column
+        prop="UpdateTime"
+        :label="$t('trials:uploadedDicoms:table:UpdateTime')"
+        min-width="120"
+        show-overflow-tooltip
+        sortable
+      />
       <!-- 上传时间 -->
       <el-table-column
         prop="UploadedTime"
         :label="$t('trials:uploadedDicoms:table:uploadedTime')"
-        min-width="80"
+        min-width="120"
         show-overflow-tooltip
+        sortable
       />
       <el-table-column
         :label="$t('common:action:action')"
@@ -694,6 +718,30 @@
           <el-form-item :label="$t('trials:audit:table:studyId')">
             <el-input v-model="studyForm.StudyCode" disabled />
           </el-form-item>
+          <!-- 检查名称 -->
+          <el-form-item
+            v-if="relationInfo.IsShowStudyName"
+            :label="$t('trials:audit:table:StudyName')"
+            prop="StudyName"
+            :rules="[
+              {
+                required: true,
+                message: $t('common:ruleMessage:specify'),
+                trigger: 'blur',
+              },
+            ]"
+          >
+            <el-radio-group v-model="studyForm.StudyName">
+              <template v-for="m in relationInfo.StudyNameList">
+                <el-radio
+                  v-if="m.IsChoose"
+                  :key="m.Name"
+                  :label="isEN ? m.EnName : m.Name"
+                  style="margin-bottom: 15px"
+                />
+              </template>
+            </el-radio-group>
+          </el-form-item>
           <!-- 检查类型 -->
           <el-form-item
             v-if="studyForm.IsDicomData"
@@ -899,6 +947,11 @@ export default {
       isClose: false,
     }
   },
+  computed: {
+    isEN() {
+      return this.$i18n.locale !== 'zh'
+    },
+  },
   watch: {
     btnLoading() {
       store.dispatch('trials/setUnLock', this.btnLoading)
@@ -959,6 +1012,7 @@ export default {
           type: 1,
           modality: this.studyForm.Modality,
           bodyPart: this.studyForm.BodyPart,
+          StudyName: this.studyForm.StudyName,
         }
         updateModality(this.trialId, params)
           .then((res) => {
@@ -1135,8 +1189,12 @@ export default {
                 patientNameElement ? patientNameElement.dataOffset : 0,
                 patientNameElement ? patientNameElement.length : 0
               )
+              // 解析dicom中字符集字段与解析库不一致 2025.03.04
+              let SpecificCharacterSet = data.string('x00080005')
+                ? data.string('x00080005').replace('ISO IR', 'ISO_IR')
+                : ''
               const patientNameStr = convertBytes(
-                data.string('x00080005'),
+                SpecificCharacterSet,
                 patientNameBytes
               )
               scope.uploadQueues.push({
@@ -1244,8 +1302,11 @@ export default {
                   : 0,
                 seriesDescriptionElement ? seriesDescriptionElement.length : 0
               )
+              let SpecificCharacterSet = data.string('x00080005')
+                ? data.string('x00080005').replace('ISO IR', 'ISO_IR')
+                : ''
               const seriesDescriptionStr = convertBytes(
-                data.string('x00080005'),
+                SpecificCharacterSet,
                 seriesDescriptionBytes
               )
               seriesItem = {
@@ -1457,17 +1518,13 @@ export default {
                         ${li.join('')}
                         </ol>
                         </div>`
-            this.$alert(
-              content,
-              '',
-              {
-                confirmButtonText: this.$t(
-                  'trials:uploadDicomList:label:confirm'
-                ),
-                dangerouslyUseHTMLString: true,
-                callback: (action) => {},
-              }
-            )
+            this.$alert(content, '', {
+              confirmButtonText: this.$t(
+                'trials:uploadDicomList:label:confirm'
+              ),
+              dangerouslyUseHTMLString: true,
+              callback: (action) => {},
+            })
             this.btnLoading = false
           }
           var results = []
@@ -1724,7 +1781,7 @@ export default {
                                     o.imageColumns,
                                     o.imageRows
                                   )
-                                  let thumbnailPath = `/${params.trialId}/Image/${params.trialSiteId}/${params.subjectId}/${params.subjectVisitId}/${dicomInfo.studyUid}/${v.seriesUid}.png`
+                                  let thumbnailPath = `/${params.trialId}/Image/${params.subjectId}/${params.subjectVisitId}/${dicomInfo.studyUid}/${v.seriesUid}.png`
                                   let OSSclient = scope.OSSclient
                                   let seriesRes = await OSSclient.put(
                                     thumbnailPath,

src/views/trials/trials-panel/visit/crc-upload/components/uploadNonDicomFiles.vue

@@ -23,21 +23,35 @@
       </el-button>
     </div>
 
-    <el-table :data="nonDicomStudyList" style="width: 100%">
+    <el-table
+      :data="nonDicomStudyList"
+      style="width: 100%"
+      :default-sort="{ prop: 'CreateTime', order: 'descending' }"
+    >
       <!-- 检查编号 -->
       <el-table-column
         prop="CodeView"
         :label="$t('trials:uploadNonDicoms:table:studyId')"
+        sortable
+      />
+      <!-- 检查名称 -->
+      <el-table-column
+        v-if="relationInfo.IsShowStudyName"
+        prop="StudyName"
+        :label="$t('trials:uploadNonDicoms:table:StudyName')"
+        sortable
       />
       <!-- 检查类型 -->
       <el-table-column
         prop="Modality"
         :label="$t('trials:uploadNonDicoms:table:modality')"
+        sortable
       />
       <!-- 检查部位 -->
       <el-table-column
         prop="BodyPart"
         :label="$t('trials:uploadNonDicoms:table:bodyPart')"
+        sortable
       >
         <template slot-scope="scope">
           {{ getBodyPart(scope.row.BodyPart) }}
@@ -47,6 +61,7 @@
       <el-table-column
         prop="FileCount"
         :label="$t('trials:uploadNonDicoms:table:files')"
+        sortable
       >
         <template slot-scope="scope">
           <el-popover
@@ -159,6 +174,7 @@
       <el-table-column
         prop="ImageDate"
         :label="$t('trials:uploadNonDicoms:table:studyDate')"
+        sortable
       >
         <template slot-scope="scope">
           {{ moment(scope.row.ImageDate).format('YYYY-MM-DD') }}
@@ -168,6 +184,13 @@
       <el-table-column
         prop="UpdateTime"
         :label="$t('trials:uploadNonDicoms:table:updateTime')"
+        sortable
+      />
+      <!-- 创建时间 -->
+      <el-table-column
+        prop="CreateTime"
+        :label="$t('trials:uploadNonDicoms:table:CreateTime')"
+        sortable
       />
       <el-table-column :label="$t('common:action:action')" min-width="200">
         <template slot-scope="scope">
@@ -235,6 +258,30 @@
           >
             <el-input v-model="form.CodeView" disabled />
           </el-form-item>
+          <!-- 检查名称 -->
+          <el-form-item
+            v-if="relationInfo.IsShowStudyName"
+            :label="$t('trials:uploadNonDicoms:table:StudyName')"
+            prop="StudyName"
+            :rules="[
+              {
+                required: true,
+                message: $t('common:ruleMessage:specify'),
+                trigger: 'blur',
+              },
+            ]"
+          >
+            <el-radio-group v-model="form.StudyName">
+              <template v-for="m in relationInfo.StudyNameList">
+                <el-radio
+                  v-if="m.IsChoose"
+                  :key="m.Name"
+                  :label="isEN ? m.EnName : m.Name"
+                  style="line-height: 40px"
+                />
+              </template>
+            </el-radio-group>
+          </el-form-item>
           <!-- 检查类型 -->
           <el-form-item
             :label="$t('trials:uploadNonDicoms:table:modality')"
@@ -343,7 +390,10 @@
       <!-- 多文件上传 -->
       <form id="inputForm" ref="uploadForm">
         <el-divider content-position="left">{{
-          $t('trials:uploadNonDicoms:label:fileType')
+          $t('trials:uploadNonDicoms:label:fileType').replace(
+            'xxx',
+            relationInfo.ImageFormatList.join('/')
+          )
         }}</el-divider>
         <div class="form-group">
           <div class="upload" style="margin-right: 10px">
@@ -602,6 +652,7 @@ export default {
         BodyParts: [],
         Modality: '',
         ImageDate: '',
+        StudyName: '',
       },
       pickerOption: {
         disabledDate: (time) => {
@@ -627,6 +678,7 @@ export default {
       moment,
       BodyPart: {},
       studyMonitorId: null,
+      relationInfo: {},
     }
   },
   async mounted() {
@@ -666,12 +718,22 @@ export default {
     store.dispatch('trials/setUnLock', false)
     this.OSSclient.close()
   },
+  computed: {
+    isEN() {
+      return this.$i18n.locale !== 'zh'
+    },
+  },
   methods: {
     // 初始化非Dicom列表数据
     getNoneDicomList() {
       this.loading = true
       getNoneDicomStudyList(this.subjectVisitId)
         .then((res) => {
+          this.relationInfo = res.OtherInfo
+          this.faccept = []
+          this.relationInfo.ImageFormatList.forEach((item) => {
+            this.faccept.push(`.${item}`)
+          })
           this.nonDicomStudyList = res.Result.map((v) => {
             if (v.VideoObjectName) {
               v.FileCount += 1
@@ -691,6 +753,7 @@ export default {
       this.form.CodeView = ''
       this.form.BodyPart = ''
       this.form.Modality = ''
+      this.form.StudyName = ''
       this.form.ImageDate = ''
       this.form.BodyParts = []
       this.dialogVisible = true
@@ -698,11 +761,14 @@ export default {
     // 打开比编辑弹框，并初始化数据
     handleEdit(row) {
       this.title = this.$t('trials:uploadNonDicoms:dialogTitle:edit')
-      const { CodeView, Id, BodyPart, Modality, ImageDate } = { ...row }
+      const { CodeView, Id, BodyPart, Modality, ImageDate, StudyName } = {
+        ...row,
+      }
       this.form.CodeView = CodeView
       this.form.Id = Id
       this.form.BodyPart = BodyPart
       this.form.Modality = Modality
+      this.form.StudyName = StudyName
       this.form.ImageDate = ImageDate
       this.form.BodyParts = this.form.BodyPart.split(', ')
       this.dialogVisible = true
@@ -838,7 +904,6 @@ export default {
     // 扫描待上传文件
     beginScanFiles(e) {
       var files = [...e.target.files]
-      console.log(files)
       var sameFiles = []
       files.forEach((file) => {
         var extendName = file.name
@@ -909,6 +974,13 @@ export default {
       })
     },
     handlePreviewImg(row) {
+      if (!!~row.FileType.indexOf('pdf')) {
+        return this.$preview({
+          path: row.Path || row.fullPath,
+          type: 'pdf',
+          title: row.FileName,
+        })
+      }
       // this.imgUrl = row.FullFilePath
       // this.previewImgVisible = true
       // this.imageLoading = true

src/views/trials/trials-panel/visit/qc-check/components/dicomFiles.vue

@@ -9,7 +9,7 @@
         icon="el-icon-view"
         @click="handlePreviewAllFiles"
       >
-        {{ $t("trials:audit:action:preview") }}
+        {{ $t('trials:audit:action:preview') }}
       </el-button>
     </div>
     <el-table
@@ -19,6 +19,7 @@
       height="300"
       :row-class-name="tableRowClassName"
       @selection-change="handleSelectionChange"
+      :default-sort="{ prop: 'UploadedTime', order: 'descending' }"
     >
       <!-- 检查编号 -->
       <el-table-column
@@ -26,6 +27,7 @@
         :label="$t('trials:audit:table:studyId')"
         min-width="80"
         show-overflow-tooltip
+        sortable
       />
       <!--      &lt;!&ndash; 检查类型 &ndash;&gt;-->
       <!--      <el-table-column-->
@@ -46,14 +48,23 @@
       <!--        </template>-->
       <!--      </el-table-column>-->
       <!--      &lt;!&ndash; 检查类型 &ndash;&gt;-->
+      <!-- 检查名称 -->
+      <el-table-column
+        v-if="relationInfo.IsShowStudyName"
+        prop="StudyName"
+        :label="$t('trials:audit:table:StudyName')"
+        sortable
+      />
       <el-table-column
         prop="ModalityForEdit"
         :label="$t('trials:audit:table:modality')"
+        sortable
       />
       <!-- 检查类型 -->
       <el-table-column
         prop="Modalities"
         :label="$t('trials:audit:table:modality1')"
+        sortable
       />
       <!-- 检查部位 -->
       <el-table-column
@@ -61,6 +72,7 @@
         :label="$t('trials:uploadedDicoms:table:bodyPart')"
         min-width="100"
         show-overflow-tooltip
+        sortable
       >
         <template slot-scope="scope">
           {{ getBodyPart(scope.row.BodyPartForEdit) }}
@@ -72,6 +84,7 @@
         :label="$t('trials:audit:table:seriesCount')"
         min-width="100"
         show-overflow-tooltip
+        sortable
       />
       <!-- 图像数量 -->
       <el-table-column
@@ -79,6 +92,7 @@
         :label="$t('trials:audit:table:instanceCount')"
         min-width="100"
         show-overflow-tooltip
+        sortable
       />
       <!-- 检查日期 -->
       <el-table-column
@@ -86,17 +100,27 @@
         :label="$t('trials:audit:table:studyDate')"
         min-width="120"
         show-overflow-tooltip
+        sortable
       >
         <template slot-scope="scope">
-          {{ moment(scope.row.StudyTime).format("YYYY-MM-DD") }}
+          {{ moment(scope.row.StudyTime).format('YYYY-MM-DD') }}
         </template>
       </el-table-column>
+      <!-- 更新时间 -->
+      <el-table-column
+        prop="UpdateTime"
+        :label="$t('trials:audit:table:studyUpdateTime')"
+        min-width="80"
+        show-overflow-tooltip
+        sortable
+      />
       <!-- 上传时间 -->
       <el-table-column
         prop="UploadedTime"
         :label="$t('trials:audit:table:studyUploadTime')"
         min-width="80"
         show-overflow-tooltip
+        sortable
       />
       <el-table-column
         :label="$t('common:action:action')"
@@ -144,27 +168,24 @@
   </div>
 </template>
 <script>
-import {
-  getSubjectVisitUploadedStudyList,
-  deleteStudyList,
-} from "@/api/trials";
-import { getToken } from "@/utils/auth";
-import uploadPetClinicalData from "@/views/trials/trials-panel/visit/crc-upload/components/uploadPetClinicalData.vue";
-import moment from "moment";
+import { getSubjectVisitUploadedStudyList, deleteStudyList } from '@/api/trials'
+import { getToken } from '@/utils/auth'
+import uploadPetClinicalData from '@/views/trials/trials-panel/visit/crc-upload/components/uploadPetClinicalData.vue'
+import moment from 'moment'
 export default {
-  name: "StudyInfo",
+  name: 'StudyInfo',
   components: { uploadPetClinicalData },
   props: {
     data: {
       type: Object,
       default() {
-        return {};
+        return {}
       },
     },
   },
   data() {
     return {
-      userTypeEnumInt: zzSessionStorage.getItem("userTypeEnumInt") * 1,
+      userTypeEnumInt: zzSessionStorage.getItem('userTypeEnumInt') * 1,
       deleteArr: [],
       studyLoading: false,
       studyList: [],
@@ -175,117 +196,117 @@ export default {
       rowData: {},
       relationInfo: {},
       bp: [],
-    };
+    }
   },
   async mounted() {
-    this.getStudyInfo();
-    this.bp = await this.$getBodyPart(this.$route.query.trialId);
+    this.getStudyInfo()
+    this.bp = await this.$getBodyPart(this.$route.query.trialId)
   },
   methods: {
     // 预览临床数据
     handlePreviewClinicalData(row) {
-      this.rowData = row;
-      this.petVisible = true;
+      this.rowData = row
+      this.petVisible = true
     },
     getStudyInfo() {
-      this.studyLoading = true;
+      this.studyLoading = true
       getSubjectVisitUploadedStudyList(this.data.Id)
         .then((res) => {
-          this.studyList = res.Result;
-          this.relationInfo = res.OtherInfo;
-          this.studyLoading = false;
+          this.studyList = res.Result
+          this.relationInfo = res.OtherInfo
+          this.studyLoading = false
         })
         .catch(() => {
-          this.studyLoading = false;
-        });
+          this.studyLoading = false
+        })
     },
     // 批量删除
     handleBatchDelete() {
-      this.$confirm(this.$t("trials:qcCheck:message:delete"), {
-        type: "warning",
+      this.$confirm(this.$t('trials:qcCheck:message:delete'), {
+        type: 'warning',
         distinguishCancelAndClose: true,
       })
         .then(() => {
-          this.studyLoading = true;
+          this.studyLoading = true
           deleteStudyList(this.trialId, this.data.Id, this.deleteArr)
             .then((res) => {
               if (res.IsSuccess) {
-                this.getStudyInfo();
-                this.$emit("getList");
+                this.getStudyInfo()
+                this.$emit('getList')
                 this.$message.success(
-                  this.$t("trials:qcCheck:message:deletedSuccessfully")
-                );
+                  this.$t('trials:qcCheck:message:deletedSuccessfully')
+                )
               }
             })
             .catch(() => {
-              this.studyLoading = true;
-            });
+              this.studyLoading = true
+            })
         })
-        .catch(() => {});
+        .catch(() => {})
     },
     // 预览所有影像
     handlePreviewAllFiles() {
-      var token = getToken();
+      var token = getToken()
       const routeData = this.$router.resolve({
         path: `/showvisitdicoms?trialId=${this.data.TrialId}&visitInfo=${this.data.VisitName}(${this.data.VisitNum})&subjectVisitId=${this.data.Id}&TokenKey=${token}`,
-      });
-      window.open(routeData.href, "_blank");
+      })
+      window.open(routeData.href, '_blank')
     },
     // 预览影像
     handleViewStudy(row) {
-      var token = getToken();
+      var token = getToken()
       const routeData = this.$router.resolve({
         path: `/showdicom?studyId=${row.StudyId}&TokenKey=${token}&type=Study`,
-      });
-      window.open(routeData.href, "_blank");
+      })
+      window.open(routeData.href, '_blank')
     },
     getBodyPart(bodyPart) {
-      if (!bodyPart) return "";
-      var separator = ",";
-      if (bodyPart.indexOf("|") > -1) {
-        separator = "|";
-      } else if (bodyPart.indexOf(",") > -1) {
-        separator = ",";
-      } else if (bodyPart.indexOf("，") > -1) {
-        separator = "，";
+      if (!bodyPart) return ''
+      var separator = ','
+      if (bodyPart.indexOf('|') > -1) {
+        separator = '|'
+      } else if (bodyPart.indexOf(',') > -1) {
+        separator = ','
+      } else if (bodyPart.indexOf('，') > -1) {
+        separator = '，'
       }
-      var arr = bodyPart.split(separator);
+      var arr = bodyPart.split(separator)
       var newArr = arr.map((i) => {
         return this.$fd(
-          "Bodypart",
+          'Bodypart',
           i.trim(),
-          "Code",
+          'Code',
           { Bodypart: this.bp },
-          "Name"
-        );
-      });
-      return newArr.join(" | ");
+          'Name'
+        )
+      })
+      return newArr.join(' | ')
     },
     // 获取勾选项
     handleSelectionChange(val) {
-      this.deleteArr = [];
+      this.deleteArr = []
       val.forEach((item) => {
-        this.deleteArr.push(item.StudyId);
-      });
+        this.deleteArr.push(item.StudyId)
+      })
     },
     // 设置已删除行勾选状态
     hasDeleted(row) {
       if (row.IsDeleted) {
-        return false;
+        return false
       } else {
-        return true;
+        return true
       }
     },
     // 设置已删除序列行样式
     tableRowClassName({ row, rowIndex }) {
       if (row.IsDeleted) {
-        return "delete-row";
+        return 'delete-row'
       } else {
-        return "";
+        return ''
       }
     },
   },
-};
+}
 </script>
 <style lang="scss">
 .study-info {

src/views/trials/trials-panel/visit/qc-check/components/qualityAssurance.vue

@@ -98,27 +98,55 @@
               :data="studyList"
               :row-class-name="tableRowClassName"
               @selection-change="handleSelectionChangeDicom"
+              :default-sort="{ prop: 'UploadedTime', order: 'descending' }"
             >
               <el-table-column type="selection" width="55"> </el-table-column>
               <!-- 检查编号 -->
               <el-table-column
                 prop="StudyCode"
                 :label="$t('trials:audit:table:studyId')"
+                sortable
               />
+              <!-- 检查名称 -->
+              <el-table-column
+                prop="StudyName"
+                v-if="relationInfo.IsShowStudyName"
+                :label="$t('trials:audit:table:StudyName')"
+                sortable
+              >
+                <template slot-scope="scope">
+                  <el-tooltip
+                    class="item"
+                    effect="dark"
+                    :content="$t('trials:audit:message:noStudyName')"
+                    placement="bottom"
+                    v-if="!scope.row.StudyName"
+                  >
+                    <i
+                      class="el-icon-warning"
+                      style="color: #f44336; font-size: 16px"
+                    />
+                  </el-tooltip>
+                  <span v-else>{{ scope.row.StudyName }}</span>
+                </template>
+              </el-table-column>
               <!-- 检查类型 -->
               <el-table-column
                 prop="ModalityForEdit"
                 :label="$t('trials:audit:table:modality')"
+                sortable
               />
               <!-- 检查类型 -->
               <el-table-column
                 prop="Modalities"
                 :label="$t('trials:audit:table:modality1')"
+                sortable
               />
               <!-- 检查部位 -->
               <el-table-column
                 prop="BodyPartForEdit"
                 :label="$t('trials:audit:table:bodyPart')"
+                sortable
               >
                 <template slot-scope="scope">
                   <el-tooltip
@@ -133,23 +161,28 @@
                       style="color: #f44336; font-size: 16px"
                     />
                   </el-tooltip>
-                  <span v-else>{{ getBodyPart(scope.row.BodyPartForEdit) }}</span>
+                  <span v-else>{{
+                    getBodyPart(scope.row.BodyPartForEdit)
+                  }}</span>
                 </template>
               </el-table-column>
               <!-- 序列数量 -->
               <el-table-column
                 prop="SeriesCount"
                 :label="$t('trials:audit:table:seriesCount')"
+                sortable
               />
               <!-- 图像数量 -->
               <el-table-column
                 prop="InstanceCount"
                 :label="$t('trials:audit:table:instanceCount')"
+                sortable
               />
               <!-- 检查日期 -->
               <el-table-column
                 prop="StudyTime"
                 :label="$t('trials:audit:table:studyDate')"
+                sortable
               >
                 <template slot-scope="scope">
                   <el-tooltip
@@ -180,6 +213,22 @@
                   }}</span>
                 </template>
               </el-table-column>
+              <!-- 更新时间 -->
+              <el-table-column
+                prop="UpdateTime"
+                :label="$t('trials:audit:table:seriesOfUpdateTime')"
+                min-width="120"
+                sortable
+                show-overflow-tooltip
+              />
+              <!-- 上传时间 -->
+              <el-table-column
+                prop="UploadedTime"
+                :label="$t('trials:audit:table:seriesOfUploadedDate')"
+                min-width="120"
+                sortable
+                show-overflow-tooltip
+              />
               <el-table-column :label="$t('common:action:action')">
                 <template slot-scope="scope">
                   <!-- 预览 -->
@@ -217,32 +266,41 @@
             </el-table>
             <!-- 序列信息 -->
             <h3>{{ $t('trials:audit:title:series') }}</h3>
-            <el-table :data="seriesList" :row-class-name="tableRowClassName">
+            <el-table
+              :data="seriesList"
+              :row-class-name="tableRowClassName"
+              :default-sort="{ prop: 'CreateTime', order: 'descending' }"
+            >
               <!-- 序列号 -->
               <el-table-column
                 prop="SeriesNumber"
                 :label="$t('trials:audit:table:seriesId')"
+                sortable
               />
               <!-- 检查编号 -->
               <el-table-column
                 prop="StudyCode"
                 :label="$t('trials:audit:table:seriesOfStudyId')"
+                sortable
               />
               <!-- 检查类型 -->
               <el-table-column
                 prop="Modality"
                 :label="$t('trials:audit:table:seriesModality')"
+                sortable
                 show-overflow-tooltip
               />
               <!-- 图像数量 -->
               <el-table-column
                 prop="InstanceCount"
                 :label="$t('trials:audit:table:seriesOfInstanceCount')"
+                sortable
               />
               <!-- 检查日期 -->
               <el-table-column
                 prop="SeriesTime"
                 :label="$t('trials:audit:table:seriesOfStudyDate')"
+                sortable
                 show-overflow-tooltip
               >
                 <template slot-scope="scope">
@@ -253,16 +311,25 @@
                   }}
                 </template>
               </el-table-column>
+                            <!-- 更新时间 -->
+                            <el-table-column
+                prop="UpdateTime"
+                :label="$t('trials:audit:table:seriesOfUpdateTime')"
+                sortable
+                show-overflow-tooltip
+              />
               <!-- 上传时间 -->
               <el-table-column
                 prop="CreateTime"
                 :label="$t('trials:audit:table:seriesOfUploadedDate')"
+                sortable
                 show-overflow-tooltip
               />
               <!-- 是否阅片 -->
               <el-table-column
                 prop="IsReading"
                 :label="$t('trials:audit:table:isReading')"
+                sortable
               >
                 <template slot-scope="scope">
                   <el-switch
@@ -278,6 +345,7 @@
               <el-table-column
                 prop="IsDeleted"
                 :label="$t('trials:audit:table:isDelete')"
+                sortable
               >
                 <template slot-scope="scope">
                   <el-switch
@@ -380,22 +448,33 @@
             <el-table
               :data="noneDicomStudyList"
               @selection-change="handleSelectionChangeNonedicom"
+              :default-sort="{ prop: 'CreateTime', order: 'descending' }"
             >
               <el-table-column type="selection" width="55"> </el-table-column>
               <!-- 检查编号 -->
               <el-table-column
                 prop="CodeView"
                 :label="$t('trials:audit:table:nonDicomsStudyId')"
+                sortable
+              />
+              <!-- 检查名称 -->
+              <el-table-column
+                prop="StudyName"
+                v-if="relationInfo.IsShowStudyName"
+                :label="$t('trials:audit:table:StudyName')"
+                sortable
               />
               <!-- 检查类型 -->
               <el-table-column
                 prop="Modality"
                 :label="$t('trials:audit:table:nonDicomsModality')"
+                sortable
               />
               <!-- 检查部位 -->
               <el-table-column
                 prop="BodyPart"
                 :label="$t('trials:audit:table:nonDicomsBodypart')"
+                sortable
               >
                 <template slot-scope="scope">
                   {{ getBodyPart(scope.row.BodyPart) }}
@@ -405,6 +484,7 @@
               <el-table-column
                 prop="FileCount"
                 :label="$t('trials:audit:table:nonDicomsFileCount')"
+                sortable
               >
                 <template slot-scope="scope">
                   <el-popover
@@ -484,6 +564,7 @@
               <el-table-column
                 prop="ImageDate"
                 :label="$t('trials:audit:table:nonDicomsStudyDate')"
+                sortable
               >
                 <template slot-scope="scope">
                   <i
@@ -508,6 +589,13 @@
               <el-table-column
                 prop="UpdateTime"
                 :label="$t('trials:audit:table:nonDicomsUpdateTime')"
+                sortable
+              />
+              <!-- 创建时间 -->
+              <el-table-column
+                prop="CreateTime"
+                :label="$t('trials:audit:table:nonDicomsCreateTime')"
+                sortable
               />
               <el-table-column :label="$t('common:action:action')">
                 <template slot-scope="scope">
@@ -886,6 +974,30 @@
             <el-form-item :label="$t('trials:audit:table:studyId')">
               <el-input v-model="studyForm.StudyCode" disabled />
             </el-form-item>
+            <!-- 检查名称 -->
+            <el-form-item
+              v-if="relationInfo.IsShowStudyName"
+              :label="$t('trials:audit:table:StudyName')"
+              prop="StudyName"
+              :rules="[
+                {
+                  required: true,
+                  message: $t('common:ruleMessage:specify'),
+                  trigger: 'blur',
+                },
+              ]"
+            >
+              <el-radio-group v-model="studyForm.StudyName">
+                <template v-for="m in relationInfo.StudyNameList">
+                  <el-radio
+                    v-if="m.IsChoose"
+                    :key="m.Name"
+                    :label="isEN ? m.EnName : m.Name"
+                    style="line-height: 40px"
+                  />
+                </template>
+              </el-radio-group>
+            </el-form-item>
             <!-- 检查类型 -->
             <el-form-item
               v-if="studyForm.IsDicomData"
@@ -1034,6 +1146,30 @@
             <el-form-item :label="$t('trials:audit:table:nonDicomsStudyId')">
               <el-input v-model="noneDicomForm.CodeView" disabled />
             </el-form-item>
+            <!-- 检查名称 -->
+            <el-form-item
+              v-if="relationInfo.IsShowStudyName"
+              :label="$t('trials:audit:table:StudyName')"
+              prop="StudyName"
+              :rules="[
+                {
+                  required: true,
+                  message: $t('common:ruleMessage:specify'),
+                  trigger: 'blur',
+                },
+              ]"
+            >
+              <el-radio-group v-model="noneDicomForm.StudyName">
+                <template v-for="m in relationInfo.StudyNameList">
+                  <el-radio
+                    v-if="m.IsChoose"
+                    :key="m.Name"
+                    :label="isEN ? m.EnName : m.Name"
+                    style="line-height: 40px"
+                  />
+                </template>
+              </el-radio-group>
+            </el-form-item>
             <!-- 检查类型 -->
             <el-form-item
               :label="$t('trials:audit:table:nonDicomsModality')"
@@ -1343,6 +1479,11 @@ export default {
       default: 1,
     },
   },
+  computed: {
+    isEN() {
+      return this.$i18n.locale !== 'zh'
+    },
+  },
   data() {
     return {
       activeName: this.data.DicomStudyCount > 0 ? 'dicom' : 'none-dicom',
@@ -1392,6 +1533,7 @@ export default {
         BodyParts: [],
         Modality: '',
         ImageDate: '',
+        StudyName: '',
       },
       subjectClinicalData: {},
       moment,
@@ -2091,13 +2233,33 @@ export default {
       }
       if (auditState === 8) {
         var isgo = true
+        var hasStudyName = true,
+          hasStudyNameList = []
         var isgoList = []
         this.studyList.forEach((v) => {
           if (!v.BodyPartForEdit) {
             isgo = false
             isgoList.push(v.StudyCode)
           }
+          if (this.relationInfo.IsShowStudyName && !v.StudyName) {
+            hasStudyName = false
+            hasStudyNameList.push(v.StudyCode)
+          }
         })
+        if (!hasStudyName) {
+          // `请补充检查${isgoList.toString()}的检查名称！`
+          this.$confirm(
+            this.$t('trials:qcQuality:title:noStudyName').replace(
+              'xxx',
+              hasStudyNameList.join('、 ')
+            ),
+            '',
+            {
+              showCancelButton: false,
+            }
+          )
+          return
+        }
         if (!isgo) {
           // `请补充检查${isgoList.toString()}的检查部位！`
           this.$confirm(
@@ -2297,6 +2459,7 @@ export default {
           type: 1,
           modality: this.studyForm.Modality,
           bodyPart: this.studyForm.BodyPart,
+          StudyName: this.studyForm.StudyName,
         }
         updateModality(this.data.TrialId, params)
           .then((res) => {
@@ -2328,7 +2491,10 @@ export default {
 
     // 打开非Dicom信息编辑框
     handleEditNoneDicomInfo(row) {
-      const { CodeView, Id, BodyPart, Modality, ImageDate } = { ...row }
+      const { CodeView, Id, BodyPart, Modality, ImageDate, StudyName } = {
+        ...row,
+      }
+      this.noneDicomForm.StudyName = StudyName
       this.noneDicomForm.CodeView = CodeView
       this.noneDicomForm.Id = Id
       this.noneDicomForm.BodyPart = BodyPart
@@ -2375,6 +2541,13 @@ export default {
     },
     // 预览文件
     previewFile(row) {
+      if (!!~row.FileType.indexOf('pdf')) {
+        return this.$preview({
+          path: row.Path || row.fullPath,
+          type: 'pdf',
+          title: row.FileName,
+        })
+      }
       // window.open(row.FullFilePath, '_blank')
       // this.imgObj.url = row.FullFilePath
       // this.imgObj.loading = true

static/pdfjs/web/viewer.js

@@ -2759,6 +2759,8 @@ function webViewerTouchStart(evt) {
 }
 
 function webViewerClick(evt) {
+  console.log('webViewerClick')
+  window.parent.postMessage({ type: 'pdf-clicked',  data: {baseUrl: PDFViewerApplication.baseUrl}})
   if (!PDFViewerApplication.secondaryToolbar.isOpen) {
     return;
   }
@@ -11758,7 +11760,7 @@ const DEFAULT_L10N_STRINGS = {
   rendering_error: "An error occurred while rendering the page.",
   page_scale_width: "Page Width",
   page_scale_fit: "Page Fit",
-  page_scale_auto: "Automatic Zoom",
+  page_scale_auto: "100%", //Automatic Zoom
   page_scale_actual: "Actual Size",
   page_scale_percent: "{{scale}}%",
   loading: "Loading…",

vue.config.js

@@ -4,6 +4,7 @@ const NodePolyfillPlugin = require('node-polyfill-webpack-plugin')
 const WebpackAliyunOss = require('webpack-aliyun-oss')
 const MiniCssExtractPlugin = require('mini-css-extract-plugin')
 const CssMinimizerPlugin = require('css-minimizer-webpack-plugin')
+const CopyPlugin = require('copy-webpack-plugin')
 // const TerserWebpackPlugin = require('terser-webpack-plugin')
 const { resolve } = require('path')
 const webpack = require('webpack')
@@ -11,7 +12,7 @@ const defaultSettings = require('./src/settings.js')
 const moment = require('moment')
 var distDate = moment(new Date()).format('YYYY-MM-DD')
 const name = process.env.NODE_ENV === 'usa' ? 'LILI' : defaultSettings.title || 'IRCIS' // page title
-
+const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
 // eslint-disable-next-line no-undef
 module.exports = defineConfig({
   // lintOnSave: false,
@@ -83,8 +84,20 @@ module.exports = defineConfig({
       asyncWebAssembly: true
     },
     plugins: [
+      new CopyPlugin({
+        patterns: [
+          {
+            from: resolve(__dirname, './static'),
+            to: resolve(__dirname, './dist/static'),
+            globOptions: {
+              ignore: ['.*']
+            }
 
-      process.env.NODE_ENV === 'development' || process.env.VUE_APP_OSS_CONFIG_BUCKET === 'zyypacs-usa' ? function() { }
+          }
+        ]
+      }),
+      // new BundleAnalyzerPlugin(),
+      process.env.NODE_ENV === 'development' || process.env.VUE_APP_OSS_CONFIG_BUCKET === 'zyypacs-usa' ? function () { }
         : new WebpackAliyunOss({
           from: ['./dist/**'],
           dist: process.env.VUE_APP_OSS_PATH + distDate,
@@ -171,7 +184,7 @@ module.exports = defineConfig({
       // 生成文件的最大体积
       maxAssetSize: 3000000000,
       // 只给出js的性能提示
-      assetFilter: function(assetFileName) {
+      assetFilter: function (assetFileName) {
         return assetFileName.endsWith('.js')
       }
     }