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

本地预览影像更改

uat
caiyiling 2025-03-11 14:15:52 +08:00
parent 7a69227888
commit bf4f0c7245
3 changed files with 253 additions and 138 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
src/components/Dicom/DicomCanvas.vue
View File

@ -90,7 +90,7 @@
custom-class="base-dialog-wrapper" custom-class="base-dialog-wrapper"
append-to-body append-to-body
> >
<DicomTags :image-id="stack.imageIds[stack.currentImageIdIndex]" @close="dcmTag.visible = false" /> <dicom-tags :image-id="stack.imageIds[stack.currentImageIdIndex]" @close="dcmTag.visible = false" />
</el-dialog> </el-dialog>
</div> </div>
</template> </template>
@ -217,10 +217,10 @@ export default {
this.stack.description = dicomSeries.description this.stack.description = dicomSeries.description
this.toolState.viewportInvert = false this.toolState.viewportInvert = false
this.toolState.dicomInfoVisible = false this.toolState.dicomInfoVisible = false
var imageId = this.stack.imageIds[this.stack.currentImageIdIndex] // var imageId = this.stack.imageIds[this.stack.currentImageIdIndex]
var instanceId = imageId.split('/')[imageId.split('/').length - 1] // var instanceId = imageId.split('/')[imageId.split('/').length - 1]
instanceId = instanceId.split('.')[0] // instanceId = instanceId.split('.')[0]
this.stack.instanceId = instanceId // this.stack.instanceId = instanceId
this.toolState.clipPlaying = false this.toolState.clipPlaying = false
const element = this.$refs.canvas const element = this.$refs.canvas
cornerstone.enable(element) cornerstone.enable(element)
@ -346,9 +346,9 @@ export default {
// return // return
// } // }
// this.stack.instanceId = image.imageId.split('/')[image.imageId.split('/').length - 1] // this.stack.instanceId = image.imageId.split('/')[image.imageId.split('/').length - 1]
var instanceId = image.imageId.split('/')[image.imageId.split('/').length - 1] // var instanceId = image.imageId.split('/')[image.imageId.split('/').length - 1]
instanceId = instanceId.split('.')[0] // instanceId = instanceId.split('.')[0]
this.stack.instanceId = instanceId // this.stack.instanceId = instanceId
this.height = (this.stack.currentImageIdIndex) * 100 / (this.stack.imageIds.length - 1) this.height = (this.stack.currentImageIdIndex) * 100 / (this.stack.imageIds.length - 1)
this.resetWwwc() this.resetWwwc()
}, },
@ -415,15 +415,16 @@ export default {
}, },
onImageRendered(e) { onImageRendered(e) {
var imageId = e.detail.image.imageId // var imageId = e.detail.image.imageId
var instanceId = imageId.split('/')[imageId.split('/').length - 1] // var instanceId = imageId.split('/')[imageId.split('/').length - 1]
instanceId = instanceId.split('.')[0] // instanceId = instanceId.split('.')[0]
if (this.imageId !== instanceId) { // if (this.imageId !== instanceId) {
this.getOrientationMarker(e.detail.element) // this.getOrientationMarker(e.detail.element)
this.imageId = instanceId // this.imageId = instanceId
} // }
this.stack.instanceId = instanceId this.getOrientationMarker(e.detail.element)
// this.stack.instanceId = instanceId
var viewport = e.detail.viewport var viewport = e.detail.viewport
this.dicomInfo.wwwc = `${Math.round( this.dicomInfo.wwwc = `${Math.round(
viewport.voi.windowWidth viewport.voi.windowWidth

356
src/views/dicom-show/dicom-preview.vue
View File

@ -1,5 +1,5 @@
<template> <template>
<div ref="preview-wrapper"> <div ref="preview-wrapper" class="preview-wrapper">
<div class="viewerContainer"> <div class="viewerContainer">
<div class="viewerContentWrapper" style="padding-top:25px;"> <div class="viewerContentWrapper" style="padding-top:25px;">
<div class="viewerLeftSidePanel"> <div class="viewerLeftSidePanel">
@ -38,7 +38,39 @@
</span> </span>
</span>--> </span>-->
<div class="viewernavitextwrapper"> <div class="viewernavitextwrapper">
<div style="padding: 1px;">#{{ item.seriesNumber }}</div> <div style="padding: 1px 5px 1px 1px;display: flex;justify-content: space-between;">
<div style="padding: 1px;">#{{ item.seriesNumber }}</div>
<div v-if="item.isExistMutiFrames && item.instanceCount > 1">
<el-popover
v-model="item.isShowPopper"
placement="right-start"
trigger="manual"
popper-class="instance_frame_wrapper"
>
<div style="text-align: right;">
<i class="el-icon-circle-close" style="font-size: 20px;cursor: pointer;color:#ddd;" @click="item.isShowPopper = false" />
</div>
<div class="frame_list">
<div
v-for="(instance, idx) in item.instanceInfoList"
:key="instance.InstanceUid"
class="frame_content"
:style="{'margin-bottom':idx<item.instanceInfoList.length-1? '5px':'0px'}"
@click="showMultiFrames(item, index, instance)"
>
<div>
<div>{{ instance.InstanceNumber }}</div>
<div>
{{ `${instance.NumberOfFrames > 0 ? instance.NumberOfFrames : 1} frame` }}
</div>
</div>
</div>
</div>
<i slot="reference" class="el-icon-connection" style="font-size: 15px;cursor: pointer;" @click="popperClick(seriesList, item)" />
</el-popover>
</div>
</div>
<div style="padding: 1px;">{{ item.description }}</div> <div style="padding: 1px;">{{ item.description }}</div>
<div <div
v-show="item.instanceCount" v-show="item.instanceCount"
@ -147,7 +179,11 @@ export default {
}) })
var imageIds = [] var imageIds = []
let isExistMutiFrames = false
let instanceInfoList = []
series.instanceList.forEach(function(instance) { series.instanceList.forEach(function(instance) {
console.log(instance)
let instanceInfo = {}
var fileId = cornerstoneWADOImageLoader.wadouri.fileManager.add( var fileId = cornerstoneWADOImageLoader.wadouri.fileManager.add(
instance.file instance.file
) )
@ -155,7 +191,19 @@ export default {
for (var i = 0; i < instance.frameCount; ++i) { for (var i = 0; i < instance.frameCount; ++i) {
imageIds.push(`${fileId}?frame=${i}`) imageIds.push(`${fileId}?frame=${i}`)
} }
} else imageIds.push(fileId) isExistMutiFrames = true
instanceInfo.NumberOfFrames = instance.frameCount
instanceInfo.InstanceNumber = instance.instanceNumber
instanceInfo.InstanceUid = instance.instanceUid
instanceInfo.FileId = fileId
} else {
imageIds.push(fileId)
instanceInfo.NumberOfFrames = 0
instanceInfo.InstanceNumber = instance.instanceNumber
instanceInfo.InstanceUid = instance.instanceUid
instanceInfo.FileId = fileId
}
instanceInfoList.push(instanceInfo)
}) })
scope.seriesList.push({ scope.seriesList.push({
@ -164,13 +212,43 @@ export default {
modality: series.modality, modality: series.modality,
instanceCount: series.instanceList.length, instanceCount: series.instanceList.length,
imageIds: imageIds, imageIds: imageIds,
previewImageId: imageIds[0] previewImageId: imageIds[0],
isExistMutiFrames: isExistMutiFrames,
instanceInfoList: instanceInfoList,
isShowPopper: false
}) })
}) })
this.showSeriesImage(0) this.showSeriesImage(0)
}, },
popperClick(seriesList, series) {
for (let i = 0; i < seriesList.length; i++) {
if (seriesList[i].isShowPopper) {
seriesList[i].isShowPopper = false
}
}
series.isShowPopper = !series.isShowPopper
},
showMultiFrames(series, seriesIndex, instanceInfo) {
this.currentSeriesIndex = seriesIndex
const imageIds = []
if (instanceInfo.NumberOfFrames && instanceInfo.NumberOfFrames > 1) {
for (let j = 0; j < instanceInfo.NumberOfFrames; j++) {
imageIds.push(`${instanceInfo.FileId}?frame=${j}`)
}
} else {
imageIds.push(instanceInfo.FileId)
}
const seriesInfo = {
seriesNumber: series.seriesNumber,
description: series.description,
modality: series.modality,
instanceCount: series.instanceCount,
imageIds: imageIds,
previewImageId: imageIds[0],
}
this.$refs.dicomViewer.loadImageStack(seriesInfo)
},
showSeriesImage(seriesIndex) { showSeriesImage(seriesIndex) {
// if (seriesIndex === this.currentSeriesIndex) return; // if (seriesIndex === this.currentSeriesIndex) return;
this.currentSeriesIndex = seriesIndex this.currentSeriesIndex = seriesIndex
@ -183,136 +261,172 @@ export default {
} }
</script> </script>
<style scoped> <style lang="scss">
::-webkit-scrollbar { ::-webkit-scrollbar {
width: 7px; width: 7px;
height: 7px; height: 7px;
} }
::-webkit-scrollbar-thumb { ::-webkit-scrollbar-thumb {
border-radius: 10px; border-radius: 10px;
background: #d0d0d0; background: #d0d0d0;
} }
.viewerContainer { .viewerContainer {
display: block; width: 100%;
height: 100%; display: block;
margin-top: 20px; height: 100%;
margin-left: auto; margin-top: 20px;
margin-right: auto; margin-left: auto;
background-color: #444; margin-right: auto;
overflow: hidden; background-color: #444;
} overflow: hidden;
}
.viewerBanner { .viewerBanner {
background: linear-gradient(0, #444, #222); background: linear-gradient(0, #444, #222);
min-height: 28px; min-height: 28px;
font-size: 16px; font-size: 16px;
margin: 0; margin: 0;
height: 30px; height: 30px;
padding-top: 0; padding-top: 0;
padding-left: 5px; padding-left: 5px;
padding-right: 5px; padding-right: 5px;
font-weight: bold; font-weight: bold;
} }
.viewerContentWrapper { .viewerContentWrapper {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
width: 100%; width: 100%;
padding: 5px; padding: 5px;
height: 99%; height: 99%;
/* height: 95%; */ /* height: 95%; */
overflow: hidden; overflow: hidden;
text-overflow: clip; text-overflow: clip;
white-space: nowrap; white-space: nowrap;
} }
.viewerContentWrapper > div { .viewerContentWrapper > div {
display: inline-block; display: inline-block;
white-space: normal; white-space: normal;
} }
.viewerLeftSidePanel { .viewerLeftSidePanel {
width: 200px; width: 200px;
background-color: #323232; background-color: #323232;
box-sizing: border-box; box-sizing: border-box;
margin: 0; margin: 0;
padding: 0; padding: 0;
margin-right: 2px; margin-right: 2px;
color: #d0d0d0; color: #d0d0d0;
overflow-y: auto; overflow-y: auto;
} }
.viewerContentWrapper > div > .sidePanelBody { .viewerContentWrapper > div > .sidePanelBody {
background: rgba(50, 50, 50, 1); background: rgba(50, 50, 50, 1);
word-break: break-all; word-break: break-all;
display: table; display: table;
width: 100%; width: 100%;
border: 1px solid #3e3f3a; border: 1px solid #3e3f3a;
} }
.viewerContentWrapper > div > div.sidePanelBody > div { .viewerContentWrapper > div > div.sidePanelBody > div {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
.studyDesc { .studyDesc {
font-weight: bold; font-weight: bold;
font-size: 13px; font-size: 13px;
text-align: center; text-align: center;
background: rgb(88 84 83); background: rgb(88 84 83);
color: #d0d0d0; color: #d0d0d0;
padding: 5px; padding: 5px;
} }
.ps { .ps {
overflow: hidden !important; overflow: hidden !important;
overflow-anchor: none; overflow-anchor: none;
-ms-overflow-style: none; -ms-overflow-style: none;
touch-action: auto; touch-action: auto;
-ms-touch-action: auto; -ms-touch-action: auto;
} }
.viewerLeftSidePanel .viewernavigatorwrapper { .viewerLeftSidePanel .viewernavigatorwrapper {
display: flex; display: flex;
width: 196px; width: 196px;
height: 84px; height: 84px;
padding: 1px 2px 1px 8px; padding: 1px 2px 1px 8px;
margin: 6px 0 6px 1px; margin: 6px 0 6px 1px;
border-radius: 2px; border-radius: 2px;
border: 1px solid #404040; border: 1px solid #404040;
} }
.ui-draggable-handle { .ui-draggable-handle {
-ms-touch-action: none; -ms-touch-action: none;
touch-action: none; touch-action: none;
} }
.viewerLeftSidePanel .image-preview { .viewerLeftSidePanel .image-preview {
border: 2px solid #252525; border: 2px solid #252525;
cursor: pointer; cursor: pointer;
} }
.viewerLeftSidePanel .viewernavitextwrapper { .viewerLeftSidePanel .viewernavitextwrapper {
flex: 1; flex: 1;
padding: 3px 1px 3px 4px; padding: 3px 1px 3px 4px;
vertical-align: top; vertical-align: top;
font-size: 12px; font-size: 12px;
} }
.viewerSideActive { .viewerSideActive {
background: #16477b; background: #16477b;
background: #16477b80; background: #16477b80;
border: 1px solid #23527b; border: 1px solid #23527b;
} }
.viewerContent { .viewerContent {
flex: 1; flex: 1;
height: 100%; height: 100%;
display: block; display: block;
background-color: black; background-color: black;
color: #d0d0d0; color: #d0d0d0;
font-size: 13px; font-size: 13px;
} }
.instance_frame_wrapper{
min-width: 120px;
background-color: #2c2c2c;
border: 1px solid #2c2c2c;
padding: 5px;
}
.frame_list{
max-height: 500px;
overflow-y: auto;
}
.instance_frame_wrapper ::-webkit-scrollbar {
width: 7px;
height: 7px;
}
.instance_frame_wrapper ::-webkit-scrollbar-thumb {
border-radius: 10px;
background: #d0d0d0;
}
.frame_content{
/* height: 50px; */
padding: 10px;
display: flex;
justify-content: flex-start;
color: #ddd;
font-size: 12px;
border: 1px solid #404040;
}
.frame_content:hover {
/* font-weight: bold; */
/* box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1); */
cursor: pointer;
/* color: #428bca; */
border-color: #213a54 !important;
background-color: #213a54;
}
</style> </style>

2
src/views/dictionary/institutions/components/Hospitals.vue
View File

@ -124,7 +124,7 @@
<el-table-column <el-table-column
prop="CityCN" prop="CityCN"
:label="$t('institutions:hospitals:label:cityCN')" :label="$t('institutions:hospitals:label:cityCN')"
width="120" width="130"
show-overflow-tooltip show-overflow-tooltip
sortable="custom" sortable="custom"
/> />