XCKJ
/
irc_web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

阅片比例尺

main
wangxiaoshuang 2025-10-10 16:47:25 +08:00
parent ef336eafe6
commit ff1b4f6f21
5 changed files with 633 additions and 740 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/views/trials/trials-panel/reading/dicoms/components/ReportPage.vue
View File

@ -265,7 +265,7 @@ export default {
...mapGetters(['language']), ...mapGetters(['language']),
isBaseline() { isBaseline() {
var i = this.visitTaskList.findIndex(i => i.VisitTaskId === this.visitTaskId) var i = this.visitTaskList.findIndex(i => i.VisitTaskId === this.visitTaskId)
return this.visitTaskList[i].IsBaseLine return this.visitTaskList[i] ? this.visitTaskList[i].IsBaseLine : false
} }
}, },
watch: { watch: {

6
src/views/trials/trials-panel/reading/dicoms3D/components/PetCtViewport.vue
View File

@ -260,9 +260,9 @@ export default {
this.defaultWindowLevel.windowCenter = windowCenter this.defaultWindowLevel.windowCenter = windowCenter
this.imageInfo.wwwc = `${Math.round(windowWidth)}/${Math.round(windowCenter)}` this.imageInfo.wwwc = `${Math.round(windowWidth)}/${Math.round(windowCenter)}`
} }
// const toolGroupId = `viewport-${this.viewportIndex}` const toolGroupId = this.viewportId
// const toolGroup = ToolGroupManager.getToolGroup(toolGroupId) const toolGroup = cornerstoneTools.ToolGroupManager.getToolGroup(toolGroupId)
// toolGroup.setToolEnabled('ScaleOverlay') toolGroup.setToolEnabled('ScaleOverlay')
} }
}, },

465
src/views/trials/trials-panel/reading/dicoms3D/components/ReadPage.vue
View File

@ -1,40 +1,21 @@
<template> <template>
<div <div v-loading="loading" :element-loading-text="loadingText" element-loading-spinner="el-icon-loading"
v-loading="loading" element-loading-background="rgba(0, 0, 0, 0.8)" class="read-page-container">
:element-loading-text="loadingText"
element-loading-spinner="el-icon-loading"
element-loading-background="rgba(0, 0, 0, 0.8)"
class="read-page-container"
>
<!-- 检查列表 --> <!-- 检查列表 -->
<div class="left-panel"> <div class="left-panel">
<div class="task-container"> <div class="task-container">
<div class="task-info"> <div class="task-info">
<div <div v-for="(s, index) in visitTaskList" :key="s.VisitTaskId" class="task-item"
v-for="(s, index) in visitTaskList" :class="{ 'task-item-active': activeTaskId == s.VisitTaskId }" @click.prevent="toggleTask(s, index)">{{
:key="s.VisitTaskId" s.TaskBlindName }}</div>
class="task-item"
:class="{'task-item-active': activeTaskId==s.VisitTaskId}"
@click.prevent="toggleTask(s, index)"
>{{ s.TaskBlindName }}</div>
</div> </div>
</div> </div>
<div v-loading="sLoading" class="study-info"> <div v-loading="sLoading" class="study-info">
<div <div v-for="s in visitTaskList" v-show="activeTaskId === s.VisitTaskId" :key="s.VisitTaskId"
v-for="s in visitTaskList" style="height:100%;">
v-show="activeTaskId === s.VisitTaskId" <study-list v-if="selectArr.includes(s.VisitTaskId) && s.StudyList.length > 0" :ref="s.VisitTaskId"
:key="s.VisitTaskId" :visit-task-info="s" :marked-series-ids="markedSeriesIds" @activeSeries="activeSeries"
style="height:100%;" @showMultiFrame="showMultiFrame" />
>
<study-list
v-if="selectArr.includes(s.VisitTaskId) && s.StudyList.length > 0"
:ref="s.VisitTaskId"
:visit-task-info="s"
:marked-series-ids="markedSeriesIds"
@activeSeries="activeSeries"
@showMultiFrame="showMultiFrame"
/>
</div> </div>
</div> </div>
@ -47,12 +28,8 @@
<div class="tools-wrapper"> <div class="tools-wrapper">
<div class="tools-left"> <div class="tools-left">
<!-- 布局 --> <!-- 布局 -->
<div <div :class="['tool-item', isFusion ? 'tool-disabled' : '']" :title="$t('trials:reading:button:layout')"
:class="['tool-item', isFusion ? 'tool-disabled' : '']" @click.stop="showPanel($event, 'layout')" @mouseleave="toolMouseout">
:title="$t('trials:reading:button:layout')"
@click.stop="showPanel($event, 'layout')"
@mouseleave="toolMouseout"
>
<div class="dropdown"> <div class="dropdown">
<div class="icon"> <div class="icon">
<svg-icon icon-class="layout" class="svg-icon" /> <svg-icon icon-class="layout" class="svg-icon" />
@ -73,7 +50,8 @@
A A
</div> </div>
</li> </li>
<li v-if="taskInfo && taskInfo.IsReadingTaskViewInOrder === 1" class="layout_flex_row" @click.stop="changeLayout(3)"> <li v-if="taskInfo && taskInfo.IsReadingTaskViewInOrder === 1" class="layout_flex_row"
@click.stop="changeLayout(3)">
<div class="layout_box_1_1"> <div class="layout_box_1_1">
A A
</div> </div>
@ -106,12 +84,9 @@
</div> </div>
</div> </div>
<!-- 调窗 --> <!-- 调窗 -->
<div <div :class="['tool-item', activeTool === 'WindowLevel' ? 'tool-item-active' : '']"
:class="['tool-item', activeTool === 'WindowLevel' ? 'tool-item-active' : '']" :title="$t('trials:reading:button:wwwc')" @click.stop="setWindowLevelActive($event)"
:title="$t('trials:reading:button:wwwc')" @mouseleave="toolMouseout">
@click.stop="setWindowLevelActive($event)"
@mouseleave="toolMouseout"
>
<div class="dropdown"> <div class="dropdown">
<div class="icon"> <div class="icon">
<svg-icon icon-class="reverse" class="svg-icon" /> <svg-icon icon-class="reverse" class="svg-icon" />
@ -121,7 +96,8 @@
<ul style="width:165px;"> <ul style="width:165px;">
<li v-for="item in wwwcArr" :key="item.label"> <li v-for="item in wwwcArr" :key="item.label">
<a href="#" @click.stop="changeVoiRange(item)"> <a href="#" @click.stop="changeVoiRange(item)">
<div v-if="item.wc !== null" style="display:flex;flex-direction: row;justify-content: space-between;"> <div v-if="item.wc !== null"
style="display:flex;flex-direction: row;justify-content: space-between;">
<div>{{ item.label }}</div> <div>{{ item.label }}</div>
<div>{{ `${item.ww} / ${item.wc}` }}</div> <div>{{ `${item.ww} / ${item.wc}` }}</div>
</div> </div>
@ -138,27 +114,17 @@
</div> </div>
</div> </div>
<!-- 反色 --> <!-- 反色 -->
<div <div class="tool-item" :title="$t('trials:reading:button:reverseColor')" @click.prevent="toggleInvert">
class="tool-item"
:title="$t('trials:reading:button:reverseColor')"
@click.prevent="toggleInvert"
>
<svg-icon icon-class="reversecolor" class="svg-icon" /> <svg-icon icon-class="reversecolor" class="svg-icon" />
</div> </div>
<!-- 缩放 --> <!-- 缩放 -->
<div <div :class="['tool-item', activeTool === 'Zoom' ? 'tool-item-active' : '']"
:class="['tool-item', activeTool === 'Zoom' ? 'tool-item-active' : '']" :title="$t('trials:reading:button:zoom')" @click.prevent="setToolActive('Zoom')">
:title="$t('trials:reading:button:zoom')"
@click.prevent="setToolActive('Zoom')"
>
<svg-icon icon-class="magnifier" class="svg-icon" /> <svg-icon icon-class="magnifier" class="svg-icon" />
</div> </div>
<!-- 移动 --> <!-- 移动 -->
<div <div :class="['tool-item', activeTool === 'Pan' ? 'tool-item-active' : '']"
:class="['tool-item', activeTool === 'Pan' ? 'tool-item-active' : '']" :title="$t('trials:reading:button:move')" @click.prevent="setToolActive('Pan')">
:title="$t('trials:reading:button:move')"
@click.prevent="setToolActive('Pan')"
>
<svg-icon icon-class="move" class="svg-icon" /> <svg-icon icon-class="move" class="svg-icon" />
</div> </div>
<!-- 旋转 --> <!-- 旋转 -->
@ -169,18 +135,10 @@
> >
<svg-icon icon-class="rotate" class="svg-icon" /> <svg-icon icon-class="rotate" class="svg-icon" />
</div> --> </div> -->
<div <div class="tool-item" :title="$t('trials:reading:button:rotate')" @click.stop="showPanel($event)"
class="tool-item" @mouseleave="toolMouseout">
:title="$t('trials:reading:button:rotate')"
@click.stop="showPanel($event)"
@mouseleave="toolMouseout"
>
<div class="dropdown"> <div class="dropdown">
<div <div class="icon" data-tool="Rotate" :class="[activeTool === 'Rotate' ? 'tool_active' : '']">
class="icon"
data-tool="Rotate"
:class="[activeTool==='Rotate'?'tool_active':'']"
>
<svg-icon icon-class="rotate" class="svg-icon" /> <svg-icon icon-class="rotate" class="svg-icon" />
<i class="el-icon-arrow-down" style="color:#fff;" /> <i class="el-icon-arrow-down" style="color:#fff;" />
</div> </div>
@ -196,36 +154,27 @@
</div> </div>
</div> </div>
<!-- 适应图像或窗口 --> <!-- 适应图像或窗口 -->
<div <div class="tool-item"
class="tool-item"
:title="forceFitToWindow ? `${$t('trials:reading:button:fitWindow')}` : `${$t('trials:reading:button:fitImage')}`" :title="forceFitToWindow ? `${$t('trials:reading:button:fitWindow')}` : `${$t('trials:reading:button:fitImage')}`"
@click.prevent="fitToType(forceFitToWindow)" @click.prevent="fitToType(forceFitToWindow)">
>
<svg-icon v-if="forceFitToWindow" icon-class="fitToWindow" class="svg-icon" /> <svg-icon v-if="forceFitToWindow" icon-class="fitToWindow" class="svg-icon" />
<svg-icon v-else icon-class="fitToImage" class="svg-icon" /> <svg-icon v-else icon-class="fitToImage" class="svg-icon" />
</div> </div>
<!--融合--> <!--融合-->
<div v-if="readingTool === 2" class="tool-item" :title="$t('trials:lugano:button:fusion')" @click.prevent="openFusion"> <div v-if="readingTool === 2" class="tool-item" :title="$t('trials:lugano:button:fusion')"
@click.prevent="openFusion">
<svg-icon icon-class="fusion" class="svg-icon" /> <svg-icon icon-class="fusion" class="svg-icon" />
</div> </div>
<div <div v-for="tool in tools" :key="tool.toolName"
v-for="tool in tools"
:key="tool.toolName"
:class="['tool-item', readingTaskState === 2 ? 'tool-disabled' : '', activeTool === tool.toolName ? 'tool-item-active' : '']" :class="['tool-item', readingTaskState === 2 ? 'tool-disabled' : '', activeTool === tool.toolName ? 'tool-item-active' : '']"
:style="{ cursor: tool.isDisabled ? 'not-allowed' : 'pointer' }" :style="{ cursor: tool.isDisabled ? 'not-allowed' : 'pointer' }"
:title="tool.disabledReason ? tool.disabledReason : $t(`${tool.i18nKey}`)" :title="tool.disabledReason ? tool.disabledReason : $t(`${tool.i18nKey}`)"
@click.prevent="setAnnotateToolActive(tool.toolName)" @click.prevent="setAnnotateToolActive(tool.toolName)" @mouseenter="enter($event, tool.toolName)">
@mouseenter="enter($event,tool.toolName)"
>
<svg-icon :icon-class="tool.icon" class="svg-icon" /> <svg-icon :icon-class="tool.icon" class="svg-icon" />
</div> </div>
<!-- 清除标注 --> <!-- 清除标注 -->
<div <div v-if="criterionType === 0" :class="['tool-item', activeTool === 'Eraser' ? 'tool-item-active' : '']"
v-if="criterionType === 0" :title="$t('trials:dicom-show:Eraser')" @click.prevent="setToolActive('Eraser')">
:class="['tool-item', activeTool === 'Eraser' ? 'tool-item-active' : '']"
:title="$t('trials:dicom-show:Eraser')"
@click.prevent="setToolActive('Eraser')"
>
<svg-icon icon-class="clear" class="svg-icon" /> <svg-icon icon-class="clear" class="svg-icon" />
</div> </div>
<div class="tool-frame"> <div class="tool-frame">
@ -238,20 +187,11 @@
<svg-icon icon-class="previousframe" class="svg-icon" /> <svg-icon icon-class="previousframe" class="svg-icon" />
</div> </div>
<!-- 播放/暂停 --> <!-- 播放/暂停 -->
<div <div v-if="clipPlaying" :title="$t('trials:dicom-show:stop')" class="icon"
v-if="clipPlaying" @click.prevent="toggleClipPlay(false)">
:title="$t('trials:dicom-show:stop')"
class="icon"
@click.prevent="toggleClipPlay(false)"
>
<svg-icon icon-class="stop" class="svg-icon" /> <svg-icon icon-class="stop" class="svg-icon" />
</div> </div>
<div <div v-else :title="$t('trials:dicom-show:play')" class="icon" @click.prevent="toggleClipPlay(true)">
v-else
:title="$t('trials:dicom-show:play')"
class="icon"
@click.prevent="toggleClipPlay(true)"
>
<svg-icon icon-class="play" class="svg-icon" /> <svg-icon icon-class="play" class="svg-icon" />
</div> </div>
<!-- 下一帧 --> <!-- 下一帧 -->
@ -262,7 +202,8 @@
<div :title="$t('trials:dicom-show:lastframe')" class="icon" @click.prevent="scrollPage(99999)"> <div :title="$t('trials:dicom-show:lastframe')" class="icon" @click.prevent="scrollPage(99999)">
<svg-icon icon-class="lastframe" class="svg-icon" /> <svg-icon icon-class="lastframe" class="svg-icon" />
</div> </div>
<select v-model="fps" :title="$t('trials:dicom-show:speed')" class="select-wrapper" :disabled="clipPlaying"> <select v-model="fps" :title="$t('trials:dicom-show:speed')" class="select-wrapper"
:disabled="clipPlaying">
<!-- 默认值 --> <!-- 默认值 -->
<option :value="5">5</option> <option :value="5">5</option>
<option :value="10">10</option> <option :value="10">10</option>
@ -273,26 +214,14 @@
</select> </select>
</div> </div>
<!-- 重置 --> <!-- 重置 -->
<div <div class="tool-item" :title="$t('trials:reading:button:reset')" @click.prevent="resetViewport">
class="tool-item"
:title="$t('trials:reading:button:reset')"
@click.prevent="resetViewport"
>
<svg-icon icon-class="refresh" class="svg-icon" /> <svg-icon icon-class="refresh" class="svg-icon" />
</div> </div>
<!-- 更多 :class="['tool-item', readingTaskState === 2 ? 'tool-disabled' : '']" --> <!-- 更多 :class="['tool-item', readingTaskState === 2 ? 'tool-disabled' : '']" -->
<div <div v-if="criterionType === 0" :title="$t('trials:reading:button:more')" :class="['tool-item']"
v-if="criterionType === 0" @click.stop="showPanel($event)" @mouseleave="toolMouseout">
:title="$t('trials:reading:button:more')"
:class="['tool-item']"
@click.stop="showPanel($event)"
@mouseleave="toolMouseout"
>
<div class="dropdown"> <div class="dropdown">
<div <div class="icon" data-tool="more">
class="icon"
data-tool="more"
>
<svg-icon icon-class="more" class="svg-icon" /> <svg-icon icon-class="more" class="svg-icon" />
<i class="el-icon-arrow-down" style="color:#fff;" /> <i class="el-icon-arrow-down" style="color:#fff;" />
</div> </div>
@ -309,21 +238,15 @@
</div> </div>
</div> </div>
</div> </div>
<div <div class="tool-item" :title="$t('trials:reading:button:upload')"
class="tool-item" v-if="trialCriterion.ImageUploadEnum > 0 && readingTaskState < 2" v-hasPermi="['role:ir']">
:title="$t('trials:reading:button:upload')"
v-if="trialCriterion.ImageUploadEnum > 0 && readingTaskState < 2"
v-hasPermi="['role:ir']"
>
<div class="tool-wrapper"> <div class="tool-wrapper">
<div class="icon" @click.prevent="openUploadImage('upload')"> <div class="icon" @click.prevent="openUploadImage('upload')">
<i class="el-icon-upload2 svg-icon" /> <i class="el-icon-upload2 svg-icon" />
</div> </div>
</div> </div>
</div> </div>
<div <div v-if="trialCriterion.ImageDownloadEnum > 0" v-hasPermi="[
v-if="trialCriterion.ImageDownloadEnum > 0"
v-hasPermi="[
'role:ir', 'role:ir',
'role:mim', 'role:mim',
'role:mc', 'role:mc',
@ -331,10 +254,7 @@
'role:apm', 'role:apm',
'role:ea', 'role:ea',
'role:qa', 'role:qa',
]" ]" class="tool-item" :title="$t('trials:reading:button:download')">
class="tool-item"
:title="$t('trials:reading:button:download')"
>
<div class="tool-wrapper"> <div class="tool-wrapper">
<div class="icon" @click.prevent="openUploadImage('download')"> <div class="icon" @click.prevent="openUploadImage('download')">
<i class="el-icon-download svg-icon" /> <i class="el-icon-download svg-icon" />
@ -349,26 +269,16 @@
<div> <div>
<!-- 手册 --> <!-- 手册 -->
<el-button <el-button v-if="taskInfo && taskInfo.ExistsManual" type="text" @click="previewManuals">
v-if="taskInfo && taskInfo.ExistsManual"
type="text"
@click="previewManuals"
>
{{ $t('trials:reading:button:handbooks') }} {{ $t('trials:reading:button:handbooks') }}
</el-button> </el-button>
<!-- 临床数据 --> <!-- 临床数据 -->
<el-button <el-button v-if="taskInfo && taskInfo.IsExistsClinicalData" type="text"
v-if="taskInfo && taskInfo.IsExistsClinicalData" @click="previewCD(taskInfo.VisitTaskId)">
type="text"
@click="previewCD(taskInfo.VisitTaskId)"
>
{{ $t('trials:reading:button:clinicalData') }} {{ $t('trials:reading:button:clinicalData') }}
</el-button> </el-button>
<!-- 个性化配置 --> <!-- 个性化配置 -->
<el-button <el-button type="text" @click="previewConfig">
type="text"
@click="previewConfig"
>
{{ $t('trials:reading:button:customCfg') }} {{ $t('trials:reading:button:customCfg') }}
</el-button> </el-button>
</div> </div>
@ -378,103 +288,58 @@
<div class="viewports-wrapper"> <div class="viewports-wrapper">
<div ref="container" class="grid-container"> <div ref="container" class="grid-container">
<div :class="['viewports-box', isFusion ? 'viewports-box-down' : '']" :style="gridStyle"> <div :class="['viewports-box', isFusion ? 'viewports-box-down' : '']" :style="gridStyle">
<div <div v-for="(v, index) in cellsMax" v-show="index < cells.length" :key="`viewport-${index}`"
v-for="(v, index) in cellsMax"
v-show="index < cells.length"
:key="`viewport-${index}`"
:style="cellStyle" :style="cellStyle"
:class="['grid-cell', index === activeViewportIndex ? 'cell_active' : '', index === fullScreenIndex ? 'cell-full-screen' : '']" :class="['grid-cell', index === activeViewportIndex ? 'cell_active' : '', index === fullScreenIndex ? 'cell-full-screen' : '']"
@dblclick="toggleFullScreen($event, index)" @dblclick="toggleFullScreen($event, index)" @click="activeViewport(index)">
@click="activeViewport(index)" <Viewport :ref="`viewport-${index}`" :data-viewport-uid="`viewport-${index}`"
> :rendering-engine-id="renderingEngineId" :viewport-id="`viewport-${index}`" :viewport-index="index"
<Viewport @activeViewport="activeViewport" @toggleTaskByViewport="toggleTaskByViewport" @previewCD="previewCD"
:ref="`viewport-${index}`" @renderAnnotations="renderAnnotations" />
:data-viewport-uid="`viewport-${index}`"
:rendering-engine-id="renderingEngineId"
:viewport-id="`viewport-${index}`"
:viewport-index="index"
@activeViewport="activeViewport"
@toggleTaskByViewport="toggleTaskByViewport"
@previewCD="previewCD"
@renderAnnotations="renderAnnotations"
/>
</div> </div>
</div> </div>
<div v-if="readingTool === 2" :class="[ 'viewports-box', !isFusion ? 'viewports-box-down' : '' ]" :style="gridStyle"> <div v-if="readingTool === 2" :class="['viewports-box', !isFusion ? 'viewports-box-down' : '']"
<div :style="gridStyle">
v-for="(v, index) in cellsMax" <div v-for="(v, index) in cellsMax" v-show="index < cells.length" :key="`viewport-fusion-${index}`"
v-show="index < cells.length"
:key="`viewport-fusion-${index}`"
:style="cellStyle" :style="cellStyle"
:class="['grid-cell', index === activeViewportIndex ? 'cell_active' : '', index === fullScreenIndex ? 'cell-full-screen' : '']" :class="['grid-cell', index === activeViewportIndex ? 'cell_active' : '', index === fullScreenIndex ? 'cell-full-screen' : '']"
@dblclick="toggleFullScreen($event, index)" @dblclick="toggleFullScreen($event, index)" @click="activeViewport(index)">
@click="activeViewport(index)" <PetCtViewport :ref="`viewport-fusion-${index}`" :data-viewport-uid="`viewport-fusion-${index}`"
> :rendering-engine-id="renderingEngineId" :viewport-id="`viewport-fusion-${index}`"
<PetCtViewport :viewport-index="index" @activeViewport="activeViewport"
:ref="`viewport-fusion-${index}`" @toggleTaskByViewport="toggleTaskByViewport" @previewCD="previewCD"
:data-viewport-uid="`viewport-fusion-${index}`" @renderAnnotations="renderAnnotations" @upperRangeChange="upperRangeChange" />
:rendering-engine-id="renderingEngineId"
:viewport-id="`viewport-fusion-${index}`"
:viewport-index="index"
@activeViewport="activeViewport"
@toggleTaskByViewport="toggleTaskByViewport"
@previewCD="previewCD"
@renderAnnotations="renderAnnotations"
@upperRangeChange="upperRangeChange"
/>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<!-- 表单 --> <!-- 表单 -->
<div class="form-wrapper"> <div class="form-wrapper">
<div <div v-for="s in visitTaskList" v-show="lastViewportTaskId === s.VisitTaskId" :key="s.VisitTaskId"
v-for="s in visitTaskList" style="height: 100%;">
v-show="lastViewportTaskId === s.VisitTaskId" <mRecisit v-if="lastViewportTaskId && criterionType === 7 && lastViewportTaskIds.includes(s.VisitTaskId)"
:key="s.VisitTaskId"
style="height: 100%;"
>
<mRecisit
v-if="lastViewportTaskId && criterionType === 7 && lastViewportTaskIds.includes(s.VisitTaskId)"
:ref="`ecrf_${s.VisitTaskId}`" :ref="`ecrf_${s.VisitTaskId}`"
:reading-task-state="currentVisitInfo.VisitTaskId === taskInfo.VisitTaskId ? readingTaskState : 2" :reading-task-state="currentVisitInfo.VisitTaskId === taskInfo.VisitTaskId ? readingTaskState : 2"
:last-viewport-task-id="lastViewportTaskId" :last-viewport-task-id="lastViewportTaskId" :visit-info="s" @removeAnnotation="removeAnnotation"
:visit-info="s" @getScreenshots="getScreenshots" @setMarkName="setMarkName" @imageLocation="imageLocation"
@removeAnnotation="removeAnnotation" @resetAnnotations="resetAnnotations" @getAnnotations="getAnnotations"
@getScreenshots="getScreenshots" @setToolToTarget="setToolToTarget" />
@setMarkName="setMarkName"
@imageLocation="imageLocation"
@resetAnnotations="resetAnnotations"
@getAnnotations="getAnnotations"
@setToolToTarget="setToolToTarget"
/>
<recisit <recisit
v-else-if="lastViewportTaskId && criterionType === 1 && lastViewportTaskIds.includes(s.VisitTaskId)" v-else-if="lastViewportTaskId && criterionType === 1 && lastViewportTaskIds.includes(s.VisitTaskId)"
:ref="`ecrf_${s.VisitTaskId}`" :ref="`ecrf_${s.VisitTaskId}`"
:reading-task-state="currentVisitInfo.VisitTaskId === taskInfo.VisitTaskId ? readingTaskState : 2" :reading-task-state="currentVisitInfo.VisitTaskId === taskInfo.VisitTaskId ? readingTaskState : 2"
:last-viewport-task-id="lastViewportTaskId" :last-viewport-task-id="lastViewportTaskId" :visit-info="s" @removeAnnotation="removeAnnotation"
:visit-info="s" @getScreenshots="getScreenshots" @setMarkName="setMarkName" @imageLocation="imageLocation"
@removeAnnotation="removeAnnotation" @resetAnnotations="resetAnnotations" @getAnnotations="getAnnotations"
@getScreenshots="getScreenshots" @setToolToTarget="setToolToTarget" />
@setMarkName="setMarkName"
@imageLocation="imageLocation"
@resetAnnotations="resetAnnotations"
@getAnnotations="getAnnotations"
@setToolToTarget="setToolToTarget"
/>
<customize-question-list <customize-question-list
v-else-if="lastViewportTaskId && criterionType === 0 && lastViewportTaskIds.includes(s.VisitTaskId)" v-else-if="lastViewportTaskId && criterionType === 0 && lastViewportTaskIds.includes(s.VisitTaskId)"
:ref="`ecrf_${s.VisitTaskId}`" :ref="`ecrf_${s.VisitTaskId}`"
:reading-task-state="taskInfo && currentVisitInfo.VisitTaskId === taskInfo.VisitTaskId ? readingTaskState : 2" :reading-task-state="taskInfo && currentVisitInfo.VisitTaskId === taskInfo.VisitTaskId ? readingTaskState : 2"
:last-viewport-task-id="lastViewportTaskId" :last-viewport-task-id="lastViewportTaskId" :visit-info="s" @resetAnnotations="resetAnnotations"
:visit-info="s" @setReadingTaskState="setReadingTaskState" @viewCustomAnnotationSeries="viewCustomAnnotationSeries"
@resetAnnotations="resetAnnotations" @getCustomScreenshots="getCustomScreenshots" @setReadingToolActive="setReadingToolActive"
@setReadingTaskState="setReadingTaskState" @setReadingToolPassive="setReadingToolPassive" />
@viewCustomAnnotationSeries="viewCustomAnnotationSeries"
@getCustomScreenshots="getCustomScreenshots"
@setReadingToolActive="setReadingToolActive"
@setReadingToolPassive="setReadingToolPassive"
/>
</div> </div>
</div> </div>
</div> </div>
@ -483,30 +348,21 @@
</div> </div>
<!-- 自定义调窗 --> <!-- 自定义调窗 -->
<el-dialog <el-dialog v-if="customWwc.visible" :visible.sync="customWwc.visible" :close-on-click-modal="false"
v-if="customWwc.visible" :title="customWwc.title" width="400px" custom-class="base-dialog-wrapper">
:visible.sync="customWwc.visible" <custom-wwwc-form :ww="activeViewportWW" :wc="activeViewportWC" @close="customWwc.visible = false"
:close-on-click-modal="false" @setWwwc="setWwwc" />
:title="customWwc.title"
width="400px"
custom-class="base-dialog-wrapper"
>
<custom-wwwc-form :ww="activeViewportWW" :wc="activeViewportWC" @close="customWwc.visible = false" @setWwwc="setWwwc" />
</el-dialog> </el-dialog>
<!-- 手册 --> <!-- 手册 -->
<el-dialog <el-dialog v-if="manualsDialog.visible" :visible.sync="manualsDialog.visible"
v-if="manualsDialog.visible"
:visible.sync="manualsDialog.visible"
:custom-class="manualsDialog.isFullscreen ? 'manuals-full-dialog-container' : 'manuals-dialog-container'" :custom-class="manualsDialog.isFullscreen ? 'manuals-full-dialog-container' : 'manuals-dialog-container'"
:show-close="false" :show-close="false" :close-on-click-modal="false" :fullscreen="manualsDialog.isFullscreen">
:close-on-click-modal="false"
:fullscreen="manualsDialog.isFullscreen"
>
<span slot="title" class="dialog-footer"> <span slot="title" class="dialog-footer">
<!-- 手册 --> <!-- 手册 -->
<span>{{ $t('trials:reading:button:handbooks') }}</span> <span>{{ $t('trials:reading:button:handbooks') }}</span>
<span style="position: absolute;right: 20px;font-size: 20px;"> <span style="position: absolute;right: 20px;font-size: 20px;">
<svg-icon :icon-class="isFullscreen?'exit-fullscreen':'fullscreen'" style="margin-right:10px;cursor: pointer;" @click="manualsDialog.isFullscreen=!manualsDialog.isFullscreen" /> <svg-icon :icon-class="isFullscreen ? 'exit-fullscreen' : 'fullscreen'" style="margin-right:10px;cursor: pointer;"
@click="manualsDialog.isFullscreen = !manualsDialog.isFullscreen" />
<svg-icon icon-class="close" style="cursor: pointer;" @click="manualsDialog.visible = false" /> <svg-icon icon-class="close" style="cursor: pointer;" @click="manualsDialog.visible = false" />
</span> </span>
</span> </span>
@ -515,13 +371,8 @@
</div> </div>
</el-dialog> </el-dialog>
<!-- 个性化配置 --> <!-- 个性化配置 -->
<el-dialog <el-dialog v-if="personalConfigDialog.visible" :visible.sync="personalConfigDialog.visible"
v-if="personalConfigDialog.visible" :close-on-click-modal="false" :title="personalConfigDialog.title" width="600px">
:visible.sync="personalConfigDialog.visible"
:close-on-click-modal="false"
:title="personalConfigDialog.title"
width="600px"
>
<el-tabs v-model="personalConfigDialog.activeName" class="personal_config"> <el-tabs v-model="personalConfigDialog.activeName" class="personal_config">
<!-- 热键 --> <!-- 热键 -->
<el-tab-pane :label="$t('trials:reading:tab:hotkeys')" name="1"> <el-tab-pane :label="$t('trials:reading:tab:hotkeys')" name="1">
@ -539,57 +390,35 @@
</el-dialog> </el-dialog>
<!-- 临床数据 --> <!-- 临床数据 -->
<el-dialog <el-dialog :visible.sync="clinicalDataVisible"
:visible.sync="clinicalDataVisible" :custom-class="isClinicalDataFullscreen ? 'cd-full-dialog-container' : 'cd-dialog-container'" :show-close="false"
:custom-class="isClinicalDataFullscreen?'cd-full-dialog-container':'cd-dialog-container'" :close-on-click-modal="false" :fullscreen="isClinicalDataFullscreen">
:show-close="false"
:close-on-click-modal="false"
:fullscreen="isClinicalDataFullscreen"
>
<span slot="title" class="dialog-footer"> <span slot="title" class="dialog-footer">
<div style="position: absolute;right: 20px;top: 10px;color: #000;"> <div style="position: absolute;right: 20px;top: 10px;color: #000;">
<svg-icon :icon-class="isClinicalDataFullscreen?'exit-fullscreen':'fullscreen'" style="cursor: pointer;font-size: 20px;" @click="isClinicalDataFullscreen=!isClinicalDataFullscreen" /> <svg-icon :icon-class="isClinicalDataFullscreen ? 'exit-fullscreen' : 'fullscreen'"
<svg-icon icon-class="dClose" style="cursor: pointer;font-size: 25px;margin-left: 10px;" @click="clinicalDataVisible = false" /> style="cursor: pointer;font-size: 20px;" @click="isClinicalDataFullscreen = !isClinicalDataFullscreen" />
<svg-icon icon-class="dClose" style="cursor: pointer;font-size: 25px;margin-left: 10px;"
@click="clinicalDataVisible = false" />
</div> </div>
</span> </span>
<div style="height: 100%;margin:0;display: flex;flex-direction: column;"> <div style="height: 100%;margin:0;display: flex;flex-direction: column;">
<clinical-data <clinical-data v-if="clinicalDataVisible" style="flex: 1" :trial-id="trialId" :subject-id="taskInfo.SubjectId"
v-if="clinicalDataVisible" :visit-task-id="cdVisitTaskId" :is-reading-show-subject-info="taskInfo.IsReadingShowSubjectInfo" />
style="flex: 1"
:trial-id="trialId"
:subject-id="taskInfo.SubjectId"
:visit-task-id="cdVisitTaskId"
:is-reading-show-subject-info="taskInfo.IsReadingShowSubjectInfo"
/>
</div> </div>
</el-dialog> </el-dialog>
<el-dialog <el-dialog :visible.sync="fusionVisible" :close-on-click-modal="false" :title="$t('trials:lugano:button:record')"
:visible.sync="fusionVisible" width="850px">
:close-on-click-modal="false" <FusionForm v-if="fusionVisible" :active-task-index="activeTaskIndex" :task-list="visitTaskList"
:title="$t('trials:lugano:button:record')" @close="closeFusion" @fusion="handleFusion" />
width="850px"
>
<FusionForm v-if="fusionVisible" :active-task-index="activeTaskIndex" :task-list="visitTaskList" @close="closeFusion" @fusion="handleFusion" />
</el-dialog> </el-dialog>
<upload-dicom-and-nonedicom <upload-dicom-and-nonedicom v-if="uploadImageVisible" :subject-id="uploadSubjectId"
v-if="uploadImageVisible" :subject-code="uploadSubjectCode" :criterion="uploadTrialCriterion" :visible.sync="uploadImageVisible"
:subject-id="uploadSubjectId" :visit-task-id="taskId" :is-reading-task-view-in-order="isReadingTaskViewInOrder" />
:subject-code="uploadSubjectCode" <download-dicom-and-nonedicom v-if="downloadImageVisible" :subject-id="uploadSubjectId"
:criterion="uploadTrialCriterion" :subject-code="uploadSubjectCode" :criterion="uploadTrialCriterion" :task-id="taskId"
:visible.sync="uploadImageVisible" :visible.sync="downloadImageVisible" />
:visit-task-id="taskId"
:is-reading-task-view-in-order="isReadingTaskViewInOrder"
/>
<download-dicom-and-nonedicom
v-if="downloadImageVisible"
:subject-id="uploadSubjectId"
:subject-code="uploadSubjectCode"
:criterion="uploadTrialCriterion"
:task-id="taskId"
:visible.sync="downloadImageVisible"
/>
</div> </div>
</template> </template>
<script> <script>
@ -1300,6 +1129,13 @@ export default {
] ]
}) })
} }
toolGroup.setToolConfiguration(
ScaleOverlayTool.toolName,
{
scaleLocation: 'bottom'
},
true // overwrite
)
toolGroup.setToolActive(StackScrollTool.toolName, { toolGroup.setToolActive(StackScrollTool.toolName, {
bindings: [{ mouseButton: MouseBindings.Wheel }] bindings: [{ mouseButton: MouseBindings.Wheel }]
}) })
@ -3303,33 +3139,40 @@ export default {
box-sizing: border-box; box-sizing: border-box;
height: 100%; height: 100%;
display: flex; display: flex;
::-webkit-scrollbar { ::-webkit-scrollbar {
width: 5px; width: 5px;
height: 5px; height: 5px;
} }
::-webkit-scrollbar-thumb { ::-webkit-scrollbar-thumb {
border-radius: 10px; border-radius: 10px;
background: #d0d0d0; background: #d0d0d0;
} }
.left-panel { .left-panel {
display: flex; display: flex;
width: 200px; width: 200px;
border: 1px solid #727272; border: 1px solid #727272;
color: #fff; color: #fff;
user-select: none; user-select: none;
::-webkit-scrollbar { ::-webkit-scrollbar {
width: 3px; width: 3px;
height: 3px; height: 3px;
} }
::-webkit-scrollbar-thumb { ::-webkit-scrollbar-thumb {
border-radius: 10px; border-radius: 10px;
background: #d0d0d0; background: #d0d0d0;
} }
.task-container { .task-container {
position: relative; position: relative;
width: 25px; width: 25px;
overflow-y: auto; overflow-y: auto;
} }
.task-info { .task-info {
position: absolute; position: absolute;
top: 5px; top: 5px;
@ -3337,6 +3180,7 @@ export default {
transform-origin: right top; transform-origin: right top;
transform: rotate(-90deg); transform: rotate(-90deg);
display: flex; display: flex;
.task-item { .task-item {
margin-left: 10px; margin-left: 10px;
white-space: nowrap; white-space: nowrap;
@ -3348,27 +3192,32 @@ export default {
color: #d5d5d5; color: #d5d5d5;
cursor: pointer; cursor: pointer;
} }
.task-item-active { .task-item-active {
background-color: #607d8b; background-color: #607d8b;
border: 1px solid #607d8b; border: 1px solid #607d8b;
} }
} }
.study-info { .study-info {
width: 170px; width: 170px;
border-left: 1px solid #727272; border-left: 1px solid #727272;
} }
} }
.middle-panel { .middle-panel {
flex: 1; flex: 1;
border: 1px solid #727272; border: 1px solid #727272;
margin: 0 5px; margin: 0 5px;
user-select: none; user-select: none;
.dicom-viewer { .dicom-viewer {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
width: 100%; width: 100%;
height: 100%; height: 100%;
user-select: none; user-select: none;
.tools-wrapper { .tools-wrapper {
height: 50px; height: 50px;
display: flex; display: flex;
@ -3376,6 +3225,7 @@ export default {
border-bottom: 1px solid #727272; border-bottom: 1px solid #727272;
color: #ddd; color: #ddd;
padding: 0 5px; padding: 0 5px;
.tools-left { .tools-left {
flex: 1; flex: 1;
display: flex; display: flex;
@ -3383,12 +3233,14 @@ export default {
justify-content: flex-start; justify-content: flex-start;
align-items: center; align-items: center;
} }
.tool-item { .tool-item {
padding: 5px; padding: 5px;
margin: 0 5px; margin: 0 5px;
border: 1px solid #333; border: 1px solid #333;
font-size: 20px; font-size: 20px;
cursor: pointer; cursor: pointer;
.el-dropdown-link { .el-dropdown-link {
.svg-icon { .svg-icon {
color: #ddd; color: #ddd;
@ -3396,12 +3248,15 @@ export default {
} }
} }
} }
.tool-item-active { .tool-item-active {
background-color: #607d8b; background-color: #607d8b;
} }
.tool-disabled { .tool-disabled {
cursor: not-allowed; cursor: not-allowed;
} }
.tool-frame { .tool-frame {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
@ -3411,16 +3266,19 @@ export default {
padding: 1px; padding: 1px;
margin: 0 5px; margin: 0 5px;
border: 1px solid #404040; border: 1px solid #404040;
.icon { .icon {
padding: 5px; padding: 5px;
border-right: 1px solid #404040; border-right: 1px solid #404040;
cursor: pointer; cursor: pointer;
text-align: center; text-align: center;
.svg-icon { .svg-icon {
font-size: 20px; font-size: 20px;
color: #ddd; color: #ddd;
} }
} }
.select-wrapper { .select-wrapper {
width: 60px; width: 60px;
background-color: black; background-color: black;
@ -3429,6 +3287,7 @@ export default {
font-size: 13px; font-size: 13px;
outline: none; outline: none;
} }
.text { .text {
position: relative; position: relative;
font-size: 12px; font-size: 12px;
@ -3437,16 +3296,19 @@ export default {
display: none; display: none;
} }
} }
// .icon:hover{ // .icon:hover{
// background-color: #607d8b; // background-color: #607d8b;
// } // }
.dropdown { .dropdown {
position: relative; position: relative;
display: inline-block; display: inline-block;
.text { .text {
text-align: center; text-align: center;
} }
} }
.dropdown-content { .dropdown-content {
display: none; display: none;
position: absolute; position: absolute;
@ -3455,11 +3317,13 @@ export default {
box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2); box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
z-index: 9999; z-index: 9999;
font-size: 12px; font-size: 12px;
ul { ul {
list-style: none; list-style: none;
margin: 0; margin: 0;
padding: 0; padding: 0;
text-align: center; text-align: center;
li { li {
a { a {
display: block; display: block;
@ -3467,17 +3331,21 @@ export default {
} }
} }
} }
ul li a:hover { ul li a:hover {
background-color: #727272; background-color: #727272;
} }
} }
.layout-content-ul li:hover { .layout-content-ul li:hover {
background-color: #727272; background-color: #727272;
} }
.layout-content ul li { .layout-content ul li {
border-top: 1px solid #ddd; border-top: 1px solid #ddd;
border-left: 1px solid #ddd; border-left: 1px solid #ddd;
} }
.layout_flex_row { .layout_flex_row {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
@ -3486,6 +3354,7 @@ export default {
text-align: center; text-align: center;
margin-bottom: 2px; margin-bottom: 2px;
} }
.layout_flex_column { .layout_flex_column {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
@ -3493,6 +3362,7 @@ export default {
align-items: center; align-items: center;
margin-bottom: 2px; margin-bottom: 2px;
} }
.layout_box_1_1 { .layout_box_1_1 {
flex: 1; flex: 1;
line-height: 30px; line-height: 30px;
@ -3501,6 +3371,7 @@ export default {
border-bottom: 1px solid #ddd; border-bottom: 1px solid #ddd;
border-right: 1px solid #ddd; border-right: 1px solid #ddd;
} }
.layout_box_1_2 { .layout_box_1_2 {
flex: 1; flex: 1;
line-height: 15px; line-height: 15px;
@ -3509,12 +3380,14 @@ export default {
border-bottom: 1px solid #ddd; border-bottom: 1px solid #ddd;
border-right: 1px solid #ddd; border-right: 1px solid #ddd;
} }
.divider { .divider {
display: block; display: block;
height: 1px; height: 1px;
width: 100%; width: 100%;
margin: 10px 0; margin: 10px 0;
} }
.el-divider__text { .el-divider__text {
padding: 0 10px; padding: 0 10px;
font-size: 12px; font-size: 12px;
@ -3523,20 +3396,24 @@ export default {
color: #fff; color: #fff;
} }
} }
.content-wrapper { .content-wrapper {
flex: 1; flex: 1;
height: calc(100% - 50px); height: calc(100% - 50px);
display: flex; display: flex;
flex-direction: row; flex-direction: row;
} }
.viewports-wrapper { .viewports-wrapper {
flex: 1; flex: 1;
.grid-container { .grid-container {
display: grid; display: grid;
height: 100%; height: 100%;
width: 100%; width: 100%;
position: relative; position: relative;
} }
.viewports-box { .viewports-box {
display: grid; display: grid;
position: absolute; position: absolute;
@ -3548,25 +3425,31 @@ export default {
right: 0; right: 0;
z-index: 9; z-index: 9;
} }
.viewports-box-down { .viewports-box-down {
z-index: 1; z-index: 1;
} }
.grid-cell { .grid-cell {
border: 1px dashed #ccc;; border: 1px dashed #ccc;
;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
z-index: 1; z-index: 1;
} }
.cell_active { .cell_active {
border-color: #fafa00 !important; border-color: #fafa00 !important;
} }
.cell-full-screen { .cell-full-screen {
grid-column: 1 / -1; grid-column: 1 / -1;
grid-row: 1 / -1; grid-row: 1 / -1;
z-index: 9; z-index: 9;
} }
} }
.form-wrapper { .form-wrapper {
width: 400px; width: 400px;
height: 100%; height: 100%;
@ -3582,36 +3465,44 @@ export default {
overflow-y: auto; overflow-y: auto;
} }
} }
::v-deep .manuals-dialog-container { ::v-deep .manuals-dialog-container {
margin-top: 50px !important; margin-top: 50px !important;
width: 75%; width: 75%;
height: 80%; height: 80%;
.el-dialog__body { .el-dialog__body {
padding: 10px; padding: 10px;
height: calc(100% - 50px) !important; height: calc(100% - 50px) !important;
} }
.el-dialog__header { .el-dialog__header {
position: relative; position: relative;
} }
} }
::v-deep .manuals-full-dialog-container { ::v-deep .manuals-full-dialog-container {
.el-dialog__body { .el-dialog__body {
padding: 10px; padding: 10px;
height: calc(100% - 50px) !important; height: calc(100% - 50px) !important;
} }
.el-dialog__header { .el-dialog__header {
position: relative; position: relative;
} }
} }
::v-deep .cd-dialog-container { ::v-deep .cd-dialog-container {
background: #fff !important; background: #fff !important;
margin-top: 50px !important; margin-top: 50px !important;
width: 75%; width: 75%;
height: 80%; height: 80%;
.el-dialog__body { .el-dialog__body {
padding: 20px 20px 0 20px; padding: 20px 20px 0 20px;
height: calc(100% - 70px); height: calc(100% - 70px);
} }
.el-dialog__header { .el-dialog__header {
position: relative; position: relative;
} }
@ -3619,18 +3510,22 @@ export default {
::v-deep .cd-full-dialog-container { ::v-deep .cd-full-dialog-container {
background: #fff !important; background: #fff !important;
.el-dialog__body { .el-dialog__body {
padding: 10px; padding: 10px;
height: calc(100% - 50px) !important; height: calc(100% - 50px) !important;
} }
.el-dialog__header { .el-dialog__header {
position: relative; position: relative;
} }
} }
::v-deep .el-dropdown-menu { ::v-deep .el-dropdown-menu {
.el-dropdown-menu__item { .el-dropdown-menu__item {
padding: 0 5px; padding: 0 5px;
} }
.layout_flex_row { .layout_flex_row {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
@ -3640,12 +3535,14 @@ export default {
align-items: center; align-items: center;
text-align: center; text-align: center;
} }
.layout_flex_column { .layout_flex_column {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
} }
.layout_box_1_1 { .layout_box_1_1 {
flex: 1; flex: 1;
line-height: 30px; line-height: 30px;
@ -3654,6 +3551,7 @@ export default {
// border-bottom:1px solid #ddd; // border-bottom:1px solid #ddd;
// border-right:1px solid #ddd; // border-right:1px solid #ddd;
} }
.layout_box_1_2 { .layout_box_1_2 {
flex: 1; flex: 1;
line-height: 15px; line-height: 15px;
@ -3664,5 +3562,4 @@ export default {
} }
} }
} }
</style> </style>

2
src/views/trials/trials-panel/reading/dicoms3D/components/ReportPage.vue
View File

@ -255,7 +255,7 @@ export default {
...mapGetters(['language']), ...mapGetters(['language']),
isBaseline() { isBaseline() {
var i = this.visitTaskList.findIndex(i => i.VisitTaskId === this.visitTaskId) var i = this.visitTaskList.findIndex(i => i.VisitTaskId === this.visitTaskId)
return this.visitTaskList[i].IsBaseLine return this.visitTaskList[i] ? this.visitTaskList[i].IsBaseLine : false
} }
}, },
watch: { watch: {

84
src/views/trials/trials-panel/reading/dicoms3D/components/Viewport.vue
View File

@ -1,59 +1,34 @@
<template> <template>
<div <div ref="viewport" class="viewport-wrapper" v-loading="loading" :element-loading-text="NSTip"
ref="viewport" element-loading-background="rgba(0, 0, 0, 0.8)" @mouseup="sliderMouseup" @mousemove="sliderMousemove"
class="viewport-wrapper" @mouseleave="sliderMouseleave">
v-loading="loading"
:element-loading-text="NSTip"
element-loading-background="rgba(0, 0, 0, 0.8)"
@mouseup="sliderMouseup"
@mousemove="sliderMousemove"
@mouseleave="sliderMouseleave"
>
<div v-if="series && taskInfo" class="left-top-text"> <div v-if="series && taskInfo" class="left-top-text">
<div <div v-if="taskInfo.IsExistsClinicalData" class="cd-info" :title="$t('trials:reading:button:clinicalData')">
v-if="taskInfo.IsExistsClinicalData" <svg-icon style="cursor: pointer;" icon-class="documentation" class="svg-icon"
class="cd-info" @click.stop="viewCD(series.TaskInfo.VisitTaskId)" />
:title="$t('trials:reading:button:clinicalData')"
>
<svg-icon
style="cursor: pointer;"
icon-class="documentation"
class="svg-icon"
@click.stop="viewCD(series.TaskInfo.VisitTaskId)"
/>
</div> </div>
<h2 <h2 v-if="taskInfo.IsReadingShowSubjectInfo" class="subject-info">
v-if="taskInfo.IsReadingShowSubjectInfo"
class="subject-info"
>
{{ `${series.TaskInfo.SubjectCode} ${series.TaskInfo.TaskBlindName} ` }} {{ `${series.TaskInfo.SubjectCode} ${series.TaskInfo.TaskBlindName} ` }}
</h2> </h2>
<div>Series: #{{ series.SeriesNumber }}</div> <div>Series: #{{ series.SeriesNumber }}</div>
<div v-if="series.Stack">Image: #{{ `${series.SliceIndex + 1}/${series.Stack.length}` }}</div> <div v-if="series.Stack">Image: #{{ `${series.SliceIndex + 1}/${series.Stack.length}` }}</div>
<div>{{ series.Modality }}</div> <div>{{ series.Modality }}</div>
</div> </div>
<div <div v-if="series && taskInfo && taskInfo.IsReadingTaskViewInOrder === 1" class="top-center-tool">
v-if="series && taskInfo && taskInfo.IsReadingTaskViewInOrder === 1"
class="top-center-tool"
>
<div class="toggle-visit-container"> <div class="toggle-visit-container">
<div <div class="arrw_icon"
class="arrw_icon"
:style="{ cursor: series.TaskInfo.VisitTaskNum !== 0 ? 'pointer' : 'not-allowed', color: series.TaskInfo.VisitTaskNum !== 0 ? '#fff' : '#6b6b6b' }" :style="{ cursor: series.TaskInfo.VisitTaskNum !== 0 ? 'pointer' : 'not-allowed', color: series.TaskInfo.VisitTaskNum !== 0 ? '#fff' : '#6b6b6b' }"
@click.stop.prevent="toggleTask($event, series.TaskInfo.VisitTaskNum, -1)" @click.stop.prevent="toggleTask($event, series.TaskInfo.VisitTaskNum, -1)"
@dblclick.stop="preventDefault($event)" @dblclick.stop="preventDefault($event)">
>
<i class="el-icon-caret-left" /> <i class="el-icon-caret-left" />
</div> </div>
<div class="arrow_text"> <div class="arrow_text">
{{ series.TaskInfo.TaskBlindName }} {{ series.TaskInfo.TaskBlindName }}
</div> </div>
<div <div class="arrw_icon"
class="arrw_icon"
:style="{ cursor: series.TaskInfo.VisitTaskNum < taskInfo.VisitNum ? 'pointer' : 'not-allowed', color: series.TaskInfo.VisitTaskNum < taskInfo.VisitNum ? '#fff' : '#6b6b6b' }" :style="{ cursor: series.TaskInfo.VisitTaskNum < taskInfo.VisitNum ? 'pointer' : 'not-allowed', color: series.TaskInfo.VisitTaskNum < taskInfo.VisitNum ? '#fff' : '#6b6b6b' }"
@click.stop.prevent="toggleTask($event, series.TaskInfo.VisitTaskNum, 1)" @click.stop.prevent="toggleTask($event, series.TaskInfo.VisitTaskNum, 1)"
@dblclick.stop="preventDefault($event)" @dblclick.stop="preventDefault($event)">
>
<i class="el-icon-caret-right" /> <i class="el-icon-caret-right" />
</div> </div>
</div> </div>
@ -65,11 +40,13 @@
<div v-show="mousePosition.index.length > 0"> <div v-show="mousePosition.index.length > 0">
Pos: {{ mousePosition.index[0] }}, {{ mousePosition.index[1] }} Pos: {{ mousePosition.index[0] }}, {{ mousePosition.index[1] }}
</div> </div>
<div v-if="(series.Modality === 'CT' || series.Modality === 'DR' || series.Modality === 'CR') && mousePosition.value"> <div
v-if="(series.Modality === 'CT' || series.Modality === 'DR' || series.Modality === 'CR') && mousePosition.value">
HU: {{ mousePosition.value }} HU: {{ mousePosition.value }}
</div> </div>
<div v-else-if="(series.Modality === 'PT' && mousePosition.value)"> <div v-else-if="(series.Modality === 'PT' && mousePosition.value)">
{{mousePosition.modalityUnit}}: {{ digitPlaces === -1 ?mousePosition.value.toFixed(3) :mousePosition.value.toFixed(digitPlaces) }} {{ mousePosition.modalityUnit }}: {{ digitPlaces === -1 ? mousePosition.value.toFixed(3)
: mousePosition.value.toFixed(digitPlaces) }}
</div> </div>
<div v-else-if="mousePosition.value"> <div v-else-if="mousePosition.value">
Density: {{ mousePosition.value }} Density: {{ mousePosition.value }}
@ -83,7 +60,8 @@
</div> </div>
<div v-if="series" class="right-bottom-text"> <div v-if="series" class="right-bottom-text">
<div v-show="imageInfo.location">Location: {{ `${Number(imageInfo.location).toFixed(digitPlaces)} mm` }}</div> <div v-show="imageInfo.location">Location: {{ `${Number(imageInfo.location).toFixed(digitPlaces)} mm` }}</div>
<div v-show="series.SliceThickness">Slice Thickness: {{ `${Number(series.SliceThickness).toFixed(digitPlaces)} mm` }}</div> <div v-show="series.SliceThickness">Slice Thickness: {{ `${Number(series.SliceThickness).toFixed(digitPlaces)} mm`
}}</div>
<div v-show="imageInfo.wwwc">WW/WL: {{ imageInfo.wwwc }}</div> <div v-show="imageInfo.wwwc">WW/WL: {{ imageInfo.wwwc }}</div>
</div> </div>
<div class="orientation-top"> <div class="orientation-top">
@ -100,7 +78,8 @@
{{ markers.left }} {{ markers.left }}
</div> </div>
<div ref="sliderBox" class="right-slider-box" @click.stop="clickSlider($event)"> <div ref="sliderBox" class="right-slider-box" @click.stop="clickSlider($event)">
<div :style="{top: sliderInfo.height + '%'}" class="slider" @click.stop.prevent="() => {return}" @mousedown.stop="sliderMousedown($event)" /> <div :style="{ top: sliderInfo.height + '%' }" class="slider" @click.stop.prevent="() => { return }"
@mousedown.stop="sliderMousedown($event)" />
</div> </div>
</div> </div>
</template> </template>
@ -219,9 +198,9 @@ export default {
// this.imageInfo.wwwc = `${Math.round(detail.image.windowWidth)}/${Math.round(detail.image.windowCenter)}` // this.imageInfo.wwwc = `${Math.round(detail.image.windowWidth)}/${Math.round(detail.image.windowCenter)}`
this.getOrientationMarker() this.getOrientationMarker()
this.$emit('renderAnnotations', this.series) this.$emit('renderAnnotations', this.series)
// const toolGroupId = `viewport-${this.viewportIndex}` const toolGroupId = this.viewportId
// const toolGroup = ToolGroupManager.getToolGroup(toolGroupId) const toolGroup = cornerstoneTools.ToolGroupManager.getToolGroup(toolGroupId)
// toolGroup.setToolEnabled('ScaleOverlay') toolGroup.setToolEnabled('ScaleOverlay')
}, },
imageRendered(e) { imageRendered(e) {
const renderingEngine = getRenderingEngine(this.renderingEngineId) const renderingEngine = getRenderingEngine(this.renderingEngineId)
@ -553,6 +532,7 @@ export default {
height: 100%; height: 100%;
position: relative; position: relative;
cursor: default !important; cursor: default !important;
.left-top-text { .left-top-text {
position: absolute; position: absolute;
left: 5px; left: 5px;
@ -560,25 +540,30 @@ export default {
color: #ddd; color: #ddd;
z-index: 1; z-index: 1;
font-size: 12px; font-size: 12px;
.cd-info { .cd-info {
color: #ddd; color: #ddd;
font-size: 18px; font-size: 18px;
} }
.subject-info { .subject-info {
color: #f44336; color: #f44336;
padding: 5px 0px; padding: 5px 0px;
margin: 0; margin: 0;
} }
} }
.top-center-tool { .top-center-tool {
position: absolute; position: absolute;
left: 50%; left: 50%;
top: 5px; top: 5px;
transform: translateX(-50%); transform: translateX(-50%);
z-index: 1; z-index: 1;
.toggle-visit-container { .toggle-visit-container {
display: flex; display: flex;
} }
.arrw_icon { .arrw_icon {
width: 20px; width: 20px;
height: 20px; height: 20px;
@ -587,6 +572,7 @@ export default {
line-height: 20px; line-height: 20px;
border-radius: 10%; border-radius: 10%;
} }
.arrow_text { .arrow_text {
height: 20px; height: 20px;
line-height: 20px; line-height: 20px;
@ -596,6 +582,7 @@ export default {
font-size: 14px; font-size: 14px;
} }
} }
.right-top-text { .right-top-text {
position: absolute; position: absolute;
right: 5px; right: 5px;
@ -604,6 +591,7 @@ export default {
z-index: 1; z-index: 1;
font-size: 12px; font-size: 12px;
} }
.left-bottom-text { .left-bottom-text {
position: absolute; position: absolute;
left: 5px; left: 5px;
@ -612,6 +600,7 @@ export default {
z-index: 1; z-index: 1;
font-size: 12px; font-size: 12px;
} }
.right-bottom-text { .right-bottom-text {
position: absolute; position: absolute;
right: 5px; right: 5px;
@ -620,6 +609,7 @@ export default {
z-index: 1; z-index: 1;
font-size: 12px; font-size: 12px;
} }
.right-slider-box { .right-slider-box {
position: absolute; position: absolute;
right: 1px; right: 1px;
@ -631,6 +621,7 @@ export default {
z-index: 1; z-index: 1;
cursor: pointer; cursor: pointer;
} }
.right-slider-box:after { .right-slider-box:after {
content: ''; content: '';
position: absolute; position: absolute;
@ -640,6 +631,7 @@ export default {
width: 100%; width: 100%;
background: #333; background: #333;
} }
.slider { .slider {
height: 20px; height: 20px;
width: 100%; width: 100%;
@ -649,6 +641,7 @@ export default {
background: #9e9e9e; background: #9e9e9e;
cursor: move cursor: move
} }
.orientation-top { .orientation-top {
position: absolute; position: absolute;
left: 50%; left: 50%;
@ -657,6 +650,7 @@ export default {
transform: translateX(-50%); transform: translateX(-50%);
z-index: 1; z-index: 1;
} }
.orientation-bottom { .orientation-bottom {
position: absolute; position: absolute;
left: 50%; left: 50%;
@ -665,6 +659,7 @@ export default {
transform: translateX(-50%); transform: translateX(-50%);
z-index: 1; z-index: 1;
} }
.orientation-left { .orientation-left {
position: absolute; position: absolute;
top: 50%; top: 50%;
@ -673,6 +668,7 @@ export default {
transform: translateY(-50%); transform: translateY(-50%);
z-index: 1; z-index: 1;
} }
.orientation-right { .orientation-right {
position: absolute; position: absolute;
top: 50%; top: 50%;