Merge branch 'main' of https://gitea.frp.extimaging.com/XCKJ/irc_web into main
continuous-integration/drone/push Build is passing
Details
continuous-integration/drone/push Build is passing
Details
commit
aba5dec904
|
|
@ -432,6 +432,22 @@ export function studyUndoMaskImage(data) {
|
|||
data
|
||||
})
|
||||
}
|
||||
// 非dicom图像数据匿名
|
||||
export function noneDicomStudyMaskImage(data) {
|
||||
return request({
|
||||
url: `/NoneDicomStudy/noneDicomStudyMaskImage`,
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
// 非dicom图像数据撤销匿名
|
||||
export function noneDicomStudyUndoMaskImage(data) {
|
||||
return request({
|
||||
url: `/NoneDicomStudy/noneDicomStudyUndoMaskImage`,
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
// 获取分割组历史版本
|
||||
export function getSegmentationVersionList(data) {
|
||||
return request({
|
||||
|
|
|
|||
|
|
@ -39,43 +39,72 @@
|
|||
</div>
|
||||
<div class="content-main" :ref="`video-content-main-${index}`" style="flex: 1;">
|
||||
<video v-if="v.currentFilePath" :ref="`videovideo-${index}`"
|
||||
:src="`${OSSclientConfig.basePath}${v.currentFilePath}`" crossorigin="anonymous"
|
||||
width="100%" height="100%" autoplay controls controlsList="nodownload"></video>
|
||||
:src="`${OSSclientConfig.basePath}${v.currentFilePath}`" crossorigin="anonymous" width="100%"
|
||||
height="100%" autoplay controls controlsList="nodownload"></video>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="Anonymous" v-if="isAnonymous">
|
||||
<div
|
||||
:class="{ btn: true, activeBtn: activeTool === 'Note_RectangleRoi' && !isComparison, isNoted: isComparison }"
|
||||
@click="setToolActive('Note_RectangleRoi')">{{
|
||||
$t('DicomViewer:anonymous:Note_RectangleRoi') }}</div>
|
||||
<div :class="{ btn: true, activeBtn: activeTool === 'Eraser' && !isComparison, isNoted: isComparison }"
|
||||
@click="setToolActive('Eraser')">{{
|
||||
$t('DicomViewer:anonymous:Eraser') }}
|
||||
</div>
|
||||
<div :class="{ btn: true, isNoted: isComparison }" @click="anonymousImage(false)">{{
|
||||
$t('DicomViewer:anonymous:Application') }}</div>
|
||||
<!-- <div class="btn">刷新图像</div> -->
|
||||
<div class="btn" v-if="!isComparison" @click="comparison(true)">{{
|
||||
$t('DicomViewer:anonymous:Comparison') }}</div>
|
||||
<div class="btn" v-else @click="comparison(false)">{{
|
||||
$t('DicomViewer:anonymous:Exit') }}</div>
|
||||
<div :class="{ btn: true }" @click="recovery(false)">{{
|
||||
$t('DicomViewer:anonymous:Recovery') }}</div>
|
||||
<!-- <div :class="{ btn: true }" @click="recovery(true)">{{
|
||||
$t('DicomViewer:anonymous:RecoveryAll') }}</div> -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- tools -->
|
||||
<div class="dicom-tools">
|
||||
<div class="measureTool-wrapper">
|
||||
<div class="sideTool-title">{{ $t('trials:reading:button:layout') }}</div>
|
||||
<div class="measureTool-wrapper" v-if="hasAnonymous && hasPermi(['role:iqc'])">
|
||||
<div class="sideTool-title">{{ $t('DicomViewer:anonymous:PixelAnonymity') }}</div>
|
||||
<div class="sideTool-wrapper">
|
||||
<label>{{ $t('trials:reading:button:layout') }}:</label>
|
||||
<select class="sidetool-select" style="width:90px" :value="layout.replace('*', 'x')" @change="handleLayoutChange">
|
||||
<!-- <label>{{ $t('trials:reading:button:layout') }}:</label> -->
|
||||
<!-- <select class="sidetool-select" style="width:90px" :value="layout.replace('*', 'x')"
|
||||
@change="handleLayoutChange">
|
||||
<option value="1x1">1x1</option>
|
||||
<option value="1x2">1x2</option>
|
||||
<option value="2x1">2x1</option>
|
||||
<option value="2x2">2x2</option>
|
||||
</select>
|
||||
</select> -->
|
||||
<div :class="{ btnBox: true, activeBtnBox: isAnonymous }" @click="openAnonymous">{{
|
||||
$t('DicomViewer:anonymous:PixelAnonymity')
|
||||
}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 图像变换 -->
|
||||
<div class="measureTool-wrapper">
|
||||
<div class="sideTool-title">{{ $t('trials:dicom-show:transform') }}</div>
|
||||
<div class="sideTool-wrapper">
|
||||
<button :title="$t('trials:reading:button:zoom')" :class="{ 'btn-link': true, activeTool: activeTool === 'Zoom' }"
|
||||
data-tool="Zoom" @click="setToolActive('Zoom')">
|
||||
<button :title="$t('trials:reading:button:zoom')"
|
||||
:class="{ 'btn-link': true, activeTool: activeTool === 'Zoom' }" data-tool="Zoom"
|
||||
@click="setToolActive('Zoom')">
|
||||
<svg-icon icon-class="magnifier" style="font-size:20px;" />
|
||||
</button>
|
||||
<button :title="$t('trials:reading:button:move')" :class="{ 'btn-link': true, activeTool: activeTool === 'Pan' }"
|
||||
data-tool="Pan" @click="setToolActive('Pan')">
|
||||
<button :title="$t('trials:reading:button:move')"
|
||||
:class="{ 'btn-link': true, activeTool: activeTool === 'Pan' }" data-tool="Pan"
|
||||
@click="setToolActive('Pan')">
|
||||
<svg-icon icon-class="move" style="font-size:20px;" />
|
||||
</button>
|
||||
<button :title="$t('trials:reading:button:rotate')" :class="{ 'btn-link': true, activeTool: activeTool === 'PlanarRotate' }"
|
||||
data-tool="PlanarRotate" @click="setToolActive('PlanarRotate')">
|
||||
<button :title="$t('trials:reading:button:rotate')"
|
||||
:class="{ 'btn-link': true, activeTool: activeTool === 'PlanarRotate' }" data-tool="PlanarRotate"
|
||||
@click="setToolActive('PlanarRotate')">
|
||||
<svg-icon icon-class="rotate" style="font-size:20px;" />
|
||||
</button>
|
||||
<button :title="$t('trials:reading:button:reset')" class="btn-link" @click="resetViewport">
|
||||
|
|
@ -116,7 +145,8 @@ import LengthscaleTool from "@/views/trials/trials-panel/reading/visit-review/to
|
|||
import initLibraries from '@/views/trials/trials-panel/reading/dicoms/components/Fusion/js/initLibraries'
|
||||
import hardcodedMetaDataProvider from '@/views/trials/trials-panel/reading/visit-review/js/hardcodedMetaDataProvider'
|
||||
import registerWebImageLoader from '@/views/trials/trials-panel/reading/visit-review/js/registerWebImageLoader'
|
||||
import store from '@/store'
|
||||
import Note_RectangleRoiTool from '@/views/trials/trials-panel/reading/dicoms3D/components/tools/Note_RectangleRoiTool'
|
||||
import { noneDicomStudyMaskImage, noneDicomStudyUndoMaskImage } from "@/api/reading"
|
||||
const { ViewportType } = Enums
|
||||
const renderingEngineId = 'myRenderingEngine'
|
||||
const {
|
||||
|
|
@ -137,6 +167,7 @@ const {
|
|||
AngleTool,
|
||||
BidirectionalTool,
|
||||
// cursors
|
||||
annotation
|
||||
} = cornerstoneTools
|
||||
const newStyles = {
|
||||
global: {
|
||||
|
|
@ -167,6 +198,9 @@ export default {
|
|||
name: 'ImageViewer',
|
||||
data() {
|
||||
return {
|
||||
hasAnonymous: false,
|
||||
isAnonymous: false,
|
||||
isComparison: false,
|
||||
rows: 1,
|
||||
cols: 1,
|
||||
fullScreenIndex: null,
|
||||
|
|
@ -181,6 +215,7 @@ export default {
|
|||
tools: [],
|
||||
viewportInfos: [],
|
||||
activeCanvasIndex: 0,
|
||||
serie: {}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
|
@ -206,6 +241,8 @@ export default {
|
|||
}
|
||||
},
|
||||
mounted() {
|
||||
let type = this.$router.currentRoute.query.type ? this.$router.currentRoute.query.type : ''
|
||||
this.hasAnonymous = type === 'Study'
|
||||
this.tools = config.customizeStandardsNoneDicom
|
||||
this.trialId = this.$route.query.trialId
|
||||
this.viewportInfos = Array.from({ length: this.cellsMax }, (_, index) => ({
|
||||
|
|
@ -228,6 +265,174 @@ export default {
|
|||
});
|
||||
},
|
||||
methods: {
|
||||
// 对比
|
||||
comparison(f) {
|
||||
this.setToolsPassive()
|
||||
if (f) {
|
||||
if (!this.serie.fileInfo.IsBeMark) return this.$confirm(this.$t("DicomViewer:anonymous:notMasked"))
|
||||
this.isComparison = f
|
||||
this.$emit("update:isComparison", this.isComparison)
|
||||
const toolGroup = ToolGroupManager.getToolGroup(`canvas-0`)
|
||||
toolGroup.setToolEnabled(StackScrollTool.toolName)
|
||||
this.handleLayoutChange({
|
||||
target: {
|
||||
value: `1x2`
|
||||
}
|
||||
})
|
||||
let path = this.serie.fileInfo.Path.split(".MaskNoneDicom_")[0]
|
||||
let imageIds = [`web:${this.OSSclientConfig.basePath}${path}`]
|
||||
let file = Object.assign({}, this.serie.fileInfo)
|
||||
file.Path = path
|
||||
file.FullFilePath = path
|
||||
this.viewportInfos[1] = Object.assign({}, this.viewportInfos[0])
|
||||
this.viewportInfos[1].fileList = [file]
|
||||
this.viewportInfos[1].imageIds = imageIds
|
||||
console.log(imageIds, 'imageIds')
|
||||
if (imageIds.length > 0) {
|
||||
this.renderImage(imageIds, 1, 0)
|
||||
}
|
||||
} else {
|
||||
this.isComparison = f
|
||||
this.$emit("update:isComparison", this.isComparison)
|
||||
const toolGroup = ToolGroupManager.getToolGroup(`canvas-0`)
|
||||
toolGroup.setToolActive(StackScrollTool.toolName, {
|
||||
bindings: [{ mouseButton: MouseBindings.Wheel }]
|
||||
})
|
||||
this.handleLayoutChange({
|
||||
target: {
|
||||
value: `1x1`
|
||||
}
|
||||
})
|
||||
this.activeCanvasIndex = 0
|
||||
this.$emit('toggleImage', {
|
||||
studyId: this.serie.studyId,
|
||||
path: this.serie.fileInfo.Path,
|
||||
})
|
||||
}
|
||||
},
|
||||
// 恢复
|
||||
async recovery() {
|
||||
// if (this.isComparison) return false
|
||||
if (!this.serie.fileInfo.IsBeMark) return this.$confirm(this.$t("DicomViewer:anonymous:notMasked"))
|
||||
if (this.isAnonymous) {
|
||||
this.comparison(false)
|
||||
}
|
||||
this.setToolsPassive()
|
||||
let data = {
|
||||
// NodicomStudyId: this.serie.studyId,
|
||||
NoneDicomStudyFileIdList: [
|
||||
this.serie.fileInfo.Id
|
||||
],
|
||||
}
|
||||
let res = await this.noneDicomStudyUndoMaskImage(data)
|
||||
if (!res) return false
|
||||
let file = res.find(item => item.Id === this.serie.fileInfo.Id)
|
||||
this.$emit('replaceImage', {
|
||||
studyId: this.serie.studyId,
|
||||
path: this.serie.fileInfo.Path,
|
||||
file,
|
||||
IsBeMark: false
|
||||
})
|
||||
},
|
||||
// 应用
|
||||
async anonymousImage() {
|
||||
if (this.isComparison) return false
|
||||
this.setToolsPassive()
|
||||
const renderingEngine = getRenderingEngine(renderingEngineId)
|
||||
const viewport = renderingEngine.getViewport(`canvas-${this.activeCanvasIndex}`)
|
||||
let imageId = viewport.getCurrentImageId()
|
||||
console.log(imageId);
|
||||
let annotations = annotation.state.getAllAnnotations().filter(item => item.metadata.toolName === "Note_RectangleRoi" && item.metadata.referencedImageId === imageId)
|
||||
if (annotations.length <= 0) return false
|
||||
console.log(annotations)
|
||||
let data = {
|
||||
// NodicomStudyId: this.serie.studyId,
|
||||
NoneDicomStudyFileIdList: [
|
||||
this.serie.fileInfo.Id
|
||||
],
|
||||
MaskRegionList: []
|
||||
}
|
||||
annotations.forEach(item => {
|
||||
let points = item.data.handles.points
|
||||
let currentStart = points[0]
|
||||
let currentEnd = points[3]
|
||||
let start = {
|
||||
x: currentStart[0] > currentEnd[0] ? Math.round(currentEnd[0]) : Math.round(currentStart[0]),
|
||||
y: currentStart[1] > currentEnd[1] ? Math.round(currentEnd[1]) : Math.round(currentStart[1]),
|
||||
}
|
||||
let end = {
|
||||
x: currentStart[0] > currentEnd[0] ? Math.round(currentStart[0]) : Math.round(currentEnd[0]),
|
||||
y: currentStart[1] > currentEnd[1] ? Math.round(currentStart[1]) : Math.round(currentEnd[1]),
|
||||
}
|
||||
let width = end.x - start.x
|
||||
let height = end.y - start.y
|
||||
data.MaskRegionList.push({
|
||||
X: start.x,
|
||||
Y: start.y,
|
||||
Width: width,
|
||||
Height: height
|
||||
})
|
||||
})
|
||||
let res = await this.noneDicomStudyMaskImage(data)
|
||||
if (!res || res.length <= 0) return this.$confirm(this.$t("DicomViewer:anonymous:studyMaskImageFail"))
|
||||
annotations.forEach(item => {
|
||||
annotation.state.removeAnnotation(item.annotationUID)
|
||||
})
|
||||
let file = res.find(item => item.Id === this.serie.fileInfo.Id)
|
||||
this.$emit('replaceImage', {
|
||||
studyId: this.serie.studyId,
|
||||
path: this.serie.fileInfo.Path,
|
||||
file,
|
||||
IsBeMark: true
|
||||
})
|
||||
},
|
||||
openAnonymous() {
|
||||
if (this.loading || this.isComparison) return false
|
||||
this.isAnonymous = !this.isAnonymous
|
||||
// if (!this.isAnonymous) {
|
||||
// const elements = document.querySelectorAll('.dicom-item')
|
||||
// const scope = this
|
||||
// Array.from(elements).forEach((element, index) => {
|
||||
// if (element.style.display !== 'none') {
|
||||
// scope.$refs[`dicomCanvas${index}`].setToolPassive(scope.activeTool)
|
||||
// }
|
||||
// })
|
||||
// scope.activeTool = null
|
||||
// } else {
|
||||
// this.activateDicomCanvas(0)
|
||||
// this.changeLayout('1x1')
|
||||
// }
|
||||
},
|
||||
async noneDicomStudyMaskImage(data) {
|
||||
try {
|
||||
this.loading = true
|
||||
let res = await noneDicomStudyMaskImage(data)
|
||||
this.loading = false
|
||||
if (res.IsSuccess) {
|
||||
return res.Result.OkList
|
||||
}
|
||||
return false
|
||||
} catch (err) {
|
||||
console.log(err)
|
||||
this.loading = false
|
||||
return false
|
||||
}
|
||||
},
|
||||
async noneDicomStudyUndoMaskImage(data) {
|
||||
try {
|
||||
this.loading = true
|
||||
let res = await noneDicomStudyUndoMaskImage(data)
|
||||
this.loading = false
|
||||
if (res.IsSuccess) {
|
||||
return res.Result.OkList
|
||||
}
|
||||
return false
|
||||
} catch (err) {
|
||||
console.log(err)
|
||||
this.loading = false
|
||||
return false
|
||||
}
|
||||
},
|
||||
showPanel(e) {
|
||||
e.currentTarget.firstChild.lastChild.style.display = 'block'
|
||||
},
|
||||
|
|
@ -300,6 +505,7 @@ export default {
|
|||
cornerstoneTools.addTool(PlanarFreehandROITool)
|
||||
cornerstoneTools.addTool(SplineROITool)
|
||||
cornerstoneTools.addTool(EraserTool)
|
||||
cornerstoneTools.addTool(Note_RectangleRoiTool)
|
||||
cornerstoneTools.addTool(LengthTool)
|
||||
cornerstoneTools.addTool(LengthscaleTool)
|
||||
cornerstoneTools.addTool(BidirectionalTool)
|
||||
|
|
@ -321,6 +527,7 @@ export default {
|
|||
toolGroup.addTool(SplineROITool.toolName)
|
||||
|
||||
toolGroup.addTool(EraserTool.toolName)
|
||||
toolGroup.addTool(Note_RectangleRoiTool.toolName)
|
||||
toolGroup.addTool(LengthTool.toolName)
|
||||
toolGroup.addTool(LengthscaleTool.toolName)
|
||||
|
||||
|
|
@ -331,6 +538,7 @@ export default {
|
|||
toolGroup.setToolPassive(ZoomTool.toolName)
|
||||
toolGroup.setToolPassive(PlanarRotateTool.toolName)
|
||||
toolGroup.setToolPassive(EraserTool.toolName)
|
||||
toolGroup.setToolPassive(Note_RectangleRoiTool.toolName)
|
||||
})
|
||||
},
|
||||
lengthscaleToolDisabled(saved) {
|
||||
|
|
@ -346,6 +554,7 @@ export default {
|
|||
},
|
||||
// 加载图片回调
|
||||
stackNewImage(e) {
|
||||
if (this.isComparison) return false
|
||||
const { detail } = e
|
||||
const i = this.viewportInfos.findIndex(i => i.viewportId === detail.viewportId)
|
||||
if (i === -1) return
|
||||
|
|
@ -365,6 +574,7 @@ export default {
|
|||
metaData.addProvider((type, imageId) => hardcodedMetaDataProvider(type, imageId, imageIds), 10000)
|
||||
const renderingEngine = getRenderingEngine(renderingEngineId)
|
||||
const viewport = renderingEngine.getViewport(`canvas-${canvasIndex}`)
|
||||
console.log(viewport, 'viewport')
|
||||
await viewport.setStack(imageIds)
|
||||
this.setToolsPassive()
|
||||
viewport.setImageIdIndex(sliceIndex)
|
||||
|
|
@ -373,9 +583,10 @@ export default {
|
|||
},
|
||||
setActiveCanvasImages(obj) {
|
||||
if (!obj || Object.keys(obj).length === 0) return
|
||||
this.serie = obj
|
||||
const i = this.viewportInfos.findIndex(i => i.index === this.activeCanvasIndex)
|
||||
if (i === -1) return
|
||||
if (obj.studyId === this.viewportInfos[i].studyId && this.imageType.includes(this.viewportInfos[i].fileType) && this.imageType.includes(obj.fileInfo.FileType)) {
|
||||
if (obj.studyId === this.viewportInfos[i].studyId && this.imageType.includes(this.viewportInfos[i].fileType) && this.imageType.includes(obj.fileInfo.FileType) && !obj.isReset) {
|
||||
const fileIndex = this.viewportInfos[i].fileList.findIndex(i => i.Path === obj.fileInfo.Path)
|
||||
this.sliceIndex(fileIndex)
|
||||
} else {
|
||||
|
|
@ -693,7 +904,7 @@ export default {
|
|||
border: 1px solid #5b5b5b;
|
||||
}
|
||||
|
||||
.sidetool-select > option {
|
||||
.sidetool-select>option {
|
||||
background-color: #323232;
|
||||
}
|
||||
|
||||
|
|
@ -728,6 +939,7 @@ export default {
|
|||
.viewports-wrapper {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
position: relative;
|
||||
|
||||
.grid-container {
|
||||
display: grid;
|
||||
|
|
@ -865,4 +1077,72 @@ export default {
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
.Anonymous {
|
||||
position: absolute;
|
||||
border-radius: 5px;
|
||||
bottom: 30px;
|
||||
left: 5%;
|
||||
right: 5%;
|
||||
width: 90%;
|
||||
height: 60px;
|
||||
padding: 0 10px;
|
||||
background-color: rgba(255, 255, 255, .2);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
z-index: 2000;
|
||||
|
||||
.btn {
|
||||
width: 12%;
|
||||
text-align: center;
|
||||
height: 40px;
|
||||
line-height: 30px;
|
||||
border-radius: 15px;
|
||||
cursor: pointer;
|
||||
padding: 5px 10px;
|
||||
color: #428bca;
|
||||
background: #ecf3fa;
|
||||
border-color: #b3d1ea;
|
||||
}
|
||||
|
||||
.activeBtn {
|
||||
background: #428bca;
|
||||
border-color: #428bca;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.isNoted {
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
// &:hover {
|
||||
// background-color: rgba(255, 255, 255, .5);
|
||||
// }
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
.dicom-tools .btnBox {
|
||||
display: inline-block;
|
||||
width: 80px;
|
||||
text-align: center;
|
||||
height: 30px;
|
||||
line-height: 20px;
|
||||
border-radius: 15px;
|
||||
color: #428bca;
|
||||
background: #ecf3fa;
|
||||
border-color: #b3d1ea;
|
||||
cursor: pointer;
|
||||
padding: 5px 10px;
|
||||
border: 1px solid rgba(255, 255, 255, .7);
|
||||
margin: 5px;
|
||||
}
|
||||
|
||||
.dicom-tools .activeBtnBox {
|
||||
background: #428bca;
|
||||
border-color: #428bca;
|
||||
color: #fff;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -10,12 +10,8 @@
|
|||
<div class="dicom-desc">
|
||||
<div style="text-overflow: ellipsis;overflow: hidden;">
|
||||
<span :title="study.CodeView">{{ study.CodeView }}</span>
|
||||
<span
|
||||
v-if="otherInfo && otherInfo.IsShowStudyName"
|
||||
:title="study.StudyName"
|
||||
style="margin-left: 5px;"
|
||||
>
|
||||
{{study.StudyName }}
|
||||
<span v-if="otherInfo && otherInfo.IsShowStudyName" :title="study.StudyName" style="margin-left: 5px;">
|
||||
{{ study.StudyName }}
|
||||
</span>
|
||||
</div>
|
||||
<div style="text-overflow: ellipsis;overflow: hidden;">
|
||||
|
|
@ -48,23 +44,14 @@
|
|||
<div v-if="isQcCheck" class="switchBox">
|
||||
<div class="item">
|
||||
<span>{{ $t('trials:audit:table:isReading') }}</span>
|
||||
<el-switch
|
||||
v-model="k.IsReading"
|
||||
:disabled="k.IsDeleted || isAudit"
|
||||
:active-text="$fd('YesOrNo', true)"
|
||||
:inactive-text="$fd('YesOrNo', false)"
|
||||
@change="changeReadingStatus($event, study, k)"
|
||||
/>
|
||||
<el-switch v-model="k.IsReading" :disabled="k.IsDeleted || isAudit"
|
||||
:active-text="$fd('YesOrNo', true)" :inactive-text="$fd('YesOrNo', false)"
|
||||
@change="changeReadingStatus($event, study, k)" />
|
||||
</div>
|
||||
<div class="item">
|
||||
<span>{{ $t('trials:audit:table:isDelete') }}</span>
|
||||
<el-switch
|
||||
v-model="k.IsDeleted"
|
||||
:disabled="isAudit"
|
||||
:active-text="$fd('YesOrNo', true)"
|
||||
:inactive-text="$fd('YesOrNo', false)"
|
||||
@change="changeDeleteStatus($event, study, k)"
|
||||
/>
|
||||
<el-switch v-model="k.IsDeleted" :disabled="isAudit" :active-text="$fd('YesOrNo', true)"
|
||||
:inactive-text="$fd('YesOrNo', false)" @change="changeDeleteStatus($event, study, k)" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -87,6 +74,10 @@ export default {
|
|||
default() {
|
||||
return {}
|
||||
}
|
||||
},
|
||||
isComparison: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
data() {
|
||||
|
|
@ -112,7 +103,7 @@ export default {
|
|||
this.studyId = this.$route.query.studyId
|
||||
this.isQcCheck = !!this.$route.query.isQcCheck
|
||||
this.getNoneDicoms()
|
||||
|
||||
|
||||
// this.$nextTick(() => {
|
||||
// this.activeStudy(this.studyList[0].Id)
|
||||
// })
|
||||
|
|
@ -157,11 +148,22 @@ export default {
|
|||
this.$route.query.isImageSegmentLabel,
|
||||
)
|
||||
this.studyList = res.Result
|
||||
this.studyList.forEach(study => {
|
||||
if (study.NoneDicomStudyFileList && study.NoneDicomStudyFileList.length > 0) {
|
||||
study.NoneDicomStudyFileList.forEach(file => {
|
||||
if (file.Path.includes('.MaskNoneDicom_')) {
|
||||
file.IsBeMark = true
|
||||
} else {
|
||||
file.IsBeMark = false
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
this.otherInfo = res.OtherInfo
|
||||
this.isAudit = res.OtherInfo.AuditState * 1 > 6
|
||||
const studyIndex = this.studyList.findIndex((item) => {
|
||||
return item.NoneDicomStudyFileList.length > 0
|
||||
})
|
||||
return item.NoneDicomStudyFileList.length > 0
|
||||
})
|
||||
if (studyIndex > -1) {
|
||||
this.selectFile(this.studyList[studyIndex], studyIndex, 0)
|
||||
let studyId = this.studyList[studyIndex].Id
|
||||
|
|
@ -171,11 +173,11 @@ export default {
|
|||
this.sortFile()
|
||||
}
|
||||
loading.close()
|
||||
} catch(e) {
|
||||
} catch (e) {
|
||||
console.log(e)
|
||||
loading.close()
|
||||
}
|
||||
|
||||
|
||||
},
|
||||
selected() {
|
||||
|
||||
|
|
@ -280,15 +282,17 @@ export default {
|
|||
return newArr.join(' | ')
|
||||
},
|
||||
// 切换文件
|
||||
selectFile(study, studyIndex, fileIndex) {
|
||||
selectFile(study, studyIndex, fileIndex, isReset = false) {
|
||||
if (this.isComparison) return false
|
||||
this.activeStudyIndex = studyIndex
|
||||
this.activeFileIndex = fileIndex
|
||||
const fileList = study.NoneDicomStudyFileList
|
||||
this.$emit('selectFile', { fileInfo: fileList[fileIndex], fileList, visitTaskInfo: this.visitTaskInfo, studyId: study.Id })
|
||||
this.$emit('selectFile', { fileInfo: fileList[fileIndex], fileList, visitTaskInfo: this.visitTaskInfo, studyId: study.Id, isReset })
|
||||
this.scrollActiveFileIntoView()
|
||||
},
|
||||
activeImage(obj) {
|
||||
if (!obj || this.studyList.length === 0) return
|
||||
const study = this.studyList.find(i => i.Id === obj.studyId)
|
||||
const studyIndex = this.studyList.findIndex(i => i.Id === obj.studyId)
|
||||
if (studyIndex === -1) return
|
||||
this.activeStudy(`${obj.studyId}`)
|
||||
|
|
@ -297,8 +301,26 @@ export default {
|
|||
const fileIndex = fileList.findIndex(f => f.Path === obj.path)
|
||||
if (fileIndex === -1) return
|
||||
this.activeFileIndex = fileIndex
|
||||
this.selectFile(study, studyIndex, fileIndex)
|
||||
this.scrollActiveFileIntoView()
|
||||
},
|
||||
replaceImage(obj) {
|
||||
if (!obj || this.studyList.length === 0) return
|
||||
const study = this.studyList.find(i => i.Id === obj.studyId)
|
||||
const studyIndex = this.studyList.findIndex(i => i.Id === obj.studyId)
|
||||
if (studyIndex === -1) return
|
||||
this.activeStudy(`${obj.studyId}`)
|
||||
this.activeStudyIndex = studyIndex
|
||||
const fileList = this.studyList[studyIndex].NoneDicomStudyFileList || []
|
||||
const fileIndex = fileList.findIndex(f => f.Path === obj.path)
|
||||
const file = fileList.find(f => f.Path === obj.path)
|
||||
if (fileIndex === -1) return
|
||||
this.activeFileIndex = fileIndex
|
||||
file.Path = obj.file.Path
|
||||
file.FullFilePath = obj.file.Path
|
||||
file.IsBeMark = obj.IsBeMark
|
||||
this.selectFile(study, studyIndex, fileIndex, true)
|
||||
},
|
||||
activeStudy(id) {
|
||||
const studyId = `${id}`
|
||||
if (this.activeNames.indexOf(studyId) > -1) return
|
||||
|
|
|
|||
|
|
@ -3,16 +3,15 @@
|
|||
<!-- 检查列表 -->
|
||||
<div class="left-panel">
|
||||
<div class="study-info">
|
||||
<study-list ref="studyList" @selectFile="selectFile"/>
|
||||
<study-list ref="studyList" :isComparison="isComparison" @selectFile="selectFile" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 图像 -->
|
||||
<div class="middle-panel">
|
||||
|
||||
<file-viewer ref="fileViewer"
|
||||
@toggleImage="toggleImage"
|
||||
@selectFile="selectFile" />
|
||||
<file-viewer ref="fileViewer" :isComparison="isComparison" @toggleImage="toggleImage" @selectFile="selectFile"
|
||||
@replaceImage="replaceImage" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -30,6 +29,7 @@ export default {
|
|||
},
|
||||
data() {
|
||||
return {
|
||||
isComparison: false
|
||||
}
|
||||
},
|
||||
|
||||
|
|
@ -48,6 +48,9 @@ export default {
|
|||
this.$refs['fileViewer'].setActiveCanvasImages(obj)
|
||||
return
|
||||
}
|
||||
},
|
||||
replaceImage(obj) {
|
||||
this.$refs['studyList'].replaceImage(obj)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -60,6 +63,7 @@ export default {
|
|||
display: flex;
|
||||
background-color: #444;
|
||||
padding: 5px;
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 5px;
|
||||
height: 5px;
|
||||
|
|
|
|||
|
|
@ -0,0 +1,342 @@
|
|||
|
||||
import {
|
||||
VolumeViewport,
|
||||
utilities as csUtils,
|
||||
} from '@cornerstonejs/core'
|
||||
import * as cornerstoneTools from '@cornerstonejs/tools'
|
||||
const {
|
||||
utilities,
|
||||
annotation,
|
||||
drawing
|
||||
|
||||
} = cornerstoneTools
|
||||
|
||||
const { getAnnotations } = annotation.state
|
||||
const { isAnnotationVisible } = annotation.visibility
|
||||
const { isAnnotationLocked } = annotation.locking
|
||||
|
||||
|
||||
const drawHandlesSvg = drawing.drawHandles
|
||||
// const drawRectSvg = drawing.drawRectByCoordinates
|
||||
const drawLinkedTextBoxSvg = drawing.drawLinkedTextBox
|
||||
const { getTextBoxCoordsCanvas } = utilities.drawing
|
||||
const setAttributesIfNecessary = drawing.setAttributesIfNecessary
|
||||
const setNewAttributesIfValid = drawing.setNewAttributesIfValid
|
||||
const _getHash = (
|
||||
annotationUID,
|
||||
drawingElementType,
|
||||
nodeUID
|
||||
) => {
|
||||
return `${annotationUID}::${drawingElementType}::${nodeUID}`;
|
||||
}
|
||||
const drawRectSvg = (
|
||||
svgDrawingHelper,
|
||||
annotationUID,
|
||||
rectangleUID,
|
||||
canvasCoordinates,
|
||||
options = {},
|
||||
dataId = ''
|
||||
) => {
|
||||
const {
|
||||
color,
|
||||
width: _width,
|
||||
lineWidth,
|
||||
lineDash,
|
||||
} = Object.assign(
|
||||
{
|
||||
color: 'rgb(255, 255, 0)',
|
||||
width: '2',
|
||||
lineWidth: undefined,
|
||||
lineDash: undefined,
|
||||
},
|
||||
options
|
||||
);
|
||||
|
||||
// for supporting both lineWidth and width options
|
||||
|
||||
const strokeWidth = lineWidth || _width;
|
||||
|
||||
const svgns = 'http://www.w3.org/2000/svg';
|
||||
const svgNodeHash = _getHash(annotationUID, 'rect', rectangleUID);
|
||||
const existingRect = svgDrawingHelper.getSvgNode(svgNodeHash);
|
||||
|
||||
const [topLeft, topRight, bottomLeft, bottomRight] = canvasCoordinates;
|
||||
|
||||
const width = Math.hypot(topLeft[0] - topRight[0], topLeft[1] - topRight[1]);
|
||||
const height = Math.hypot(
|
||||
topLeft[0] - bottomLeft[0],
|
||||
topLeft[1] - bottomLeft[1]
|
||||
);
|
||||
|
||||
const center = [
|
||||
(bottomRight[0] + topLeft[0]) / 2,
|
||||
(bottomRight[1] + topLeft[1]) / 2,
|
||||
];
|
||||
const leftEdgeCenter = [
|
||||
(bottomLeft[0] + topLeft[0]) / 2,
|
||||
(bottomLeft[1] + topLeft[1]) / 2,
|
||||
];
|
||||
const angle =
|
||||
(Math.atan2(center[1] - leftEdgeCenter[1], center[0] - leftEdgeCenter[0]) *
|
||||
180) /
|
||||
Math.PI;
|
||||
|
||||
const attributes = {
|
||||
x: `${center[0] - width / 2}`,
|
||||
y: `${center[1] - height / 2}`,
|
||||
width: `${width}`,
|
||||
height: `${height}`,
|
||||
stroke: color,
|
||||
fill: 'rgba(0, 0, 0, 1)',
|
||||
transform: `rotate(${angle} ${center[0]} ${center[1]})`,
|
||||
'stroke-width': strokeWidth,
|
||||
'stroke-dasharray': lineDash,
|
||||
};
|
||||
|
||||
if (existingRect) {
|
||||
setAttributesIfNecessary(attributes, existingRect);
|
||||
|
||||
svgDrawingHelper.setNodeTouched(svgNodeHash);
|
||||
} else {
|
||||
const svgRectElement = document.createElementNS(svgns, 'rect');
|
||||
|
||||
if (dataId !== '') {
|
||||
svgRectElement.setAttribute('data-id', dataId);
|
||||
}
|
||||
|
||||
setNewAttributesIfValid(attributes, svgRectElement);
|
||||
|
||||
svgDrawingHelper.appendNode(svgRectElement, svgNodeHash);
|
||||
}
|
||||
}
|
||||
/**
|
||||
* RectangleROIAnnotation let you draw annotations that measures the statistics
|
||||
* such as area, max, mean and stdDev of a Rectangular region of interest.
|
||||
* You can use RectangleROIAnnotation in all perpendicular views (axial, sagittal, coronal).
|
||||
* Note: annotation tools in cornerstone3DTools exists in the exact location
|
||||
* in the physical 3d space, as a result, by default, all annotations that are
|
||||
* drawing in the same frameOfReference will get shared between viewports that
|
||||
* are in the same frameOfReference. RectangleROI tool's text box lines are dynamically
|
||||
* generated based on the viewport's underlying Modality. For instance, if
|
||||
* the viewport is displaying CT, the text box will shown the statistics in Hounsfield units,
|
||||
* and if the viewport is displaying PET, the text box will show the statistics in
|
||||
* SUV units.
|
||||
*
|
||||
* The resulting annotation's data (statistics) and metadata (the
|
||||
* state of the viewport while drawing was happening) will get added to the
|
||||
* ToolState manager and can be accessed from the ToolState by calling getAnnotations
|
||||
* or similar methods.
|
||||
*
|
||||
* ```js
|
||||
* cornerstoneTools.addTool(RectangleROITool)
|
||||
*
|
||||
* const toolGroup = ToolGroupManager.createToolGroup('toolGroupId')
|
||||
*
|
||||
* toolGroup.addTool(RectangleROITool.toolName)
|
||||
*
|
||||
* toolGroup.addViewport('viewportId', 'renderingEngineId')
|
||||
*
|
||||
* toolGroup.setToolActive(RectangleROITool.toolName, {
|
||||
* bindings: [
|
||||
* {
|
||||
* mouseButton: MouseBindings.Primary, // Left Click
|
||||
* },
|
||||
* ],
|
||||
* })
|
||||
* ```
|
||||
*
|
||||
* Read more in the Docs section of the website.
|
||||
*/
|
||||
|
||||
class Note_RectangleRoiTool extends cornerstoneTools.RectangleROITool {
|
||||
static toolName = "Note_RectangleRoi"
|
||||
constructor(
|
||||
toolProps,
|
||||
defaultToolProps
|
||||
) {
|
||||
super(toolProps, defaultToolProps);
|
||||
}
|
||||
|
||||
/**
|
||||
* it is used to draw the rectangleROI annotation in each
|
||||
* request animation frame. It calculates the updated cached statistics if
|
||||
* data is invalidated and cache it.
|
||||
*
|
||||
* @param enabledElement - The Cornerstone's enabledElement.
|
||||
* @param svgDrawingHelper - The svgDrawingHelper providing the context for drawing.
|
||||
*/
|
||||
renderAnnotation = (
|
||||
enabledElement,
|
||||
svgDrawingHelper
|
||||
) => {
|
||||
let renderStatus = false;
|
||||
const { viewport } = enabledElement;
|
||||
const { element } = viewport;
|
||||
|
||||
let annotations = getAnnotations(this.getToolName(), element);
|
||||
|
||||
if (!annotations?.length) {
|
||||
return renderStatus;
|
||||
}
|
||||
|
||||
annotations = this.filterInteractableAnnotationsForElement(
|
||||
element,
|
||||
annotations
|
||||
);
|
||||
|
||||
if (!annotations?.length) {
|
||||
return renderStatus;
|
||||
}
|
||||
|
||||
const targetId = this.getTargetId(viewport);
|
||||
const renderingEngine = viewport.getRenderingEngine();
|
||||
|
||||
const styleSpecifier = {
|
||||
toolGroupId: this.toolGroupId,
|
||||
toolName: this.getToolName(),
|
||||
viewportId: enabledElement.viewport.id,
|
||||
};
|
||||
|
||||
for (let i = 0; i < annotations.length; i++) {
|
||||
const annotation = annotations[i];
|
||||
const { annotationUID, data } = annotation;
|
||||
const { points, activeHandleIndex } = data.handles;
|
||||
const canvasCoordinates = points.map((p) => viewport.worldToCanvas(p));
|
||||
|
||||
styleSpecifier.annotationUID = annotationUID;
|
||||
|
||||
const { lineWidth, lineDash } = this.getAnnotationStyle({
|
||||
annotation,
|
||||
styleSpecifier,
|
||||
});
|
||||
let color = 'rgb(255, 255, 0)'
|
||||
const { viewPlaneNormal, viewUp } = viewport.getCamera();
|
||||
|
||||
// If cachedStats does not exist, or the unit is missing (as part of import/hydration etc.),
|
||||
// force to recalculate the stats from the points
|
||||
if (
|
||||
!data.cachedStats[targetId] ||
|
||||
data.cachedStats[targetId].areaUnit == null
|
||||
) {
|
||||
data.cachedStats[targetId] = {
|
||||
Modality: null,
|
||||
area: null,
|
||||
max: null,
|
||||
mean: null,
|
||||
stdDev: null,
|
||||
areaUnit: null,
|
||||
};
|
||||
|
||||
this._calculateCachedStats(
|
||||
annotation,
|
||||
viewPlaneNormal,
|
||||
viewUp,
|
||||
renderingEngine,
|
||||
enabledElement
|
||||
);
|
||||
} else if (annotation.invalidated) {
|
||||
this._throttledCalculateCachedStats(
|
||||
annotation,
|
||||
viewPlaneNormal,
|
||||
viewUp,
|
||||
renderingEngine,
|
||||
enabledElement
|
||||
);
|
||||
|
||||
// If the invalidated data is as a result of volumeViewport manipulation
|
||||
// of the tools, we need to invalidate the related stackViewports data if
|
||||
// they are not at the referencedImageId, so that
|
||||
// when scrolling to the related slice in which the tool were manipulated
|
||||
// we re-render the correct tool position. This is due to stackViewport
|
||||
// which doesn't have the full volume at each time, and we are only working
|
||||
// on one slice at a time.
|
||||
if (viewport instanceof VolumeViewport) {
|
||||
const { referencedImageId } = annotation.metadata;
|
||||
|
||||
// invalidate all the relevant stackViewports if they are not
|
||||
// at the referencedImageId
|
||||
for (const targetId in data.cachedStats) {
|
||||
if (targetId.startsWith('imageId')) {
|
||||
const viewports = renderingEngine.getStackViewports();
|
||||
|
||||
const invalidatedStack = viewports.find((vp) => {
|
||||
// The stack viewport that contains the imageId but is not
|
||||
// showing it currently
|
||||
const referencedImageURI =
|
||||
csUtils.imageIdToURI(referencedImageId);
|
||||
const hasImageURI = vp.hasImageURI(referencedImageURI);
|
||||
const currentImageURI = csUtils.imageIdToURI(
|
||||
vp.getCurrentImageId()
|
||||
);
|
||||
return hasImageURI && currentImageURI !== referencedImageURI;
|
||||
});
|
||||
|
||||
if (invalidatedStack) {
|
||||
delete data.cachedStats[targetId];
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// If rendering engine has been destroyed while rendering
|
||||
if (!viewport.getRenderingEngine()) {
|
||||
console.warn('Rendering Engine has been destroyed');
|
||||
return renderStatus;
|
||||
}
|
||||
|
||||
let activeHandleCanvasCoords;
|
||||
|
||||
if (!isAnnotationVisible(annotationUID)) {
|
||||
continue;
|
||||
}
|
||||
|
||||
if (
|
||||
!isAnnotationLocked(annotationUID) &&
|
||||
!this.editData &&
|
||||
activeHandleIndex !== null && activeHandleIndex !== undefined
|
||||
) {
|
||||
// Not locked or creating and hovering over handle, so render handle.
|
||||
activeHandleCanvasCoords = [canvasCoordinates[activeHandleIndex]];
|
||||
}
|
||||
|
||||
if (activeHandleCanvasCoords) {
|
||||
const handleGroupUID = '0';
|
||||
|
||||
drawHandlesSvg(
|
||||
svgDrawingHelper,
|
||||
annotationUID,
|
||||
handleGroupUID,
|
||||
activeHandleCanvasCoords,
|
||||
{
|
||||
color,
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
const dataId = `${annotationUID}-rect`;
|
||||
const rectangleUID = '0';
|
||||
drawRectSvg(
|
||||
svgDrawingHelper,
|
||||
annotationUID,
|
||||
rectangleUID,
|
||||
canvasCoordinates,
|
||||
{
|
||||
color,
|
||||
lineDash,
|
||||
lineWidth,
|
||||
},
|
||||
dataId
|
||||
);
|
||||
|
||||
renderStatus = true;
|
||||
return renderStatus;
|
||||
}
|
||||
|
||||
return renderStatus;
|
||||
};
|
||||
|
||||
}
|
||||
|
||||
|
||||
export default Note_RectangleRoiTool;
|
||||
Loading…
Reference in New Issue