阅片比例尺
parent
ef336eafe6
commit
ff1b4f6f21
|
@ -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: {
|
||||||
|
|
|
@ -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')
|
||||||
}
|
}
|
||||||
|
|
||||||
},
|
},
|
||||||
|
|
File diff suppressed because it is too large
Load Diff
|
@ -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: {
|
||||||
|
|
|
@ -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,8 +60,9 @@
|
||||||
</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 v-show="imageInfo.wwwc ">WW/WL: {{ imageInfo.wwwc }}</div>
|
}}</div>
|
||||||
|
<div v-show="imageInfo.wwwc">WW/WL: {{ imageInfo.wwwc }}</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="orientation-top">
|
<div class="orientation-top">
|
||||||
{{ markers.top }}
|
{{ markers.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)
|
||||||
|
@ -385,7 +364,7 @@ export default {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
cachePTMetadata(images) {
|
cachePTMetadata(images) {
|
||||||
images.map(i=>{
|
images.map(i => {
|
||||||
const instanceMetadata = getPTImageIdInstanceMetadata(i.imageId)
|
const instanceMetadata = getPTImageIdInstanceMetadata(i.imageId)
|
||||||
if (typeof instanceMetadata.CorrectedImage === 'string') {
|
if (typeof instanceMetadata.CorrectedImage === 'string') {
|
||||||
instanceMetadata.CorrectedImage = instanceMetadata.CorrectedImage.split('\\')
|
instanceMetadata.CorrectedImage = instanceMetadata.CorrectedImage.split('\\')
|
||||||
|
@ -549,10 +528,11 @@ export default {
|
||||||
</script>
|
</script>
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
.viewport-wrapper {
|
.viewport-wrapper {
|
||||||
width:100%;
|
width: 100%;
|
||||||
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,26 +540,31 @@ 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;
|
||||||
background-color: #3f3f3f;
|
background-color: #3f3f3f;
|
||||||
|
@ -587,15 +572,17 @@ 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;
|
||||||
background-color: #00000057;
|
background-color: #00000057;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
padding:0 10px;
|
padding: 0 10px;
|
||||||
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,7 +621,8 @@ 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;
|
||||||
bottom: -20px;
|
bottom: -20px;
|
||||||
|
@ -640,15 +631,17 @@ export default {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
background: #333;
|
background: #333;
|
||||||
}
|
}
|
||||||
|
|
||||||
.slider {
|
.slider {
|
||||||
height: 20px;
|
height: 20px;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 0;
|
top: 0;
|
||||||
z-index:10;
|
z-index: 10;
|
||||||
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%;
|
||||||
|
|
Loading…
Reference in New Issue