irc_web/.svn/pristine/f6/f6f8e26dc4c40d737d3cefc8f23...

791 lines
29 KiB
Plaintext
Raw Blame History

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<template>
<div class="dicom-container">
<div class="dicom-list">
<div class="container">
<div class="related-study-wrapper">
<div class="left">
<div class="visit-name-wrapper">
<div v-if="(visitTaskList.length > 0)" style="display: flex;flex-direction: row;">
<div
v-for="s in visitTaskList"
:key="s.VisitTaskId"
class="visit-item"
:class="{'visit-item-active': activeTaskVisitId==s.VisitTaskId}"
@click.prevent="handleClick(s)"
>{{ s.TaskBlindName }}</div>
</div>
</div>
</div>
<div class="right">
<div
v-for="s in visitTaskList"
v-show="activeTaskVisitId === s.VisitTaskId"
:key="s.VisitTaskId"
class="study-wrapper"
>
<StudyList
v-if="selectArr.includes(s.VisitTaskId)"
:ref="s.VisitTaskId"
:visit-task-id="s.VisitTaskId"
:trial-id="trialId"
:subject-visit-id="s.VisitId"
:task-blind-name="s.TaskBlindName"
:is-reading-show-subject-info="isReadingShowSubjectInfo"
@loadImageStack="loadImageStack"
@previewNoneDicoms="previewNoneDicoms"
/>
</div>
</div>
</div>
</div>
</div>
<div class="dicom-viewer">
<div class="container">
<DicomViewer
v-if="activeTaskVisitId"
ref="dicomViewer"
:is-show="isShow"
:question-form-change-state="questionFormChangeState"
:question-form-change-num="questionFormChangeNum"
:is-exists-clinical-data="isExistsClinicalData"
:is-exists-no-dicom-file="isExistsNoDicomFile"
:is-reading-show-subject-info="isReadingShowSubjectInfo"
:is-reading-task-view-in-order="isReadingTaskViewInOrder"
@previewCD="previewCD"
/>
</div>
</div>
</div>
</template>
<script>
import StudyList from './StudyList'
// import DicomViewer from './DicomViewer'
import DicomViewer from '@/views/trials/trials-panel/reading/dicoms/components/DicomViewer.vue'
import DicomEvent from './DicomEvent'
import store from '@/store'
import { getToken } from '@/utils/auth'
import { mapGetters } from 'vuex'
export default {
name: 'ReadPage',
components: {
DicomViewer,
StudyList
},
props: {
trialId: {
type: String,
required: true
},
subjectId: {
type: String,
required: true
},
subjectCode: {
type: String,
required: true
},
visitTaskId: {
type: String,
required: true
},
isShow: {
type: Boolean,
required: true
},
isExistsClinicalData: {
type: Boolean,
required: true
},
isExistsNoDicomFile: {
type: Boolean,
required: true
},
isReadingShowSubjectInfo: {
type: Boolean,
required: true
},
isReadingTaskViewInOrder: {
type: Boolean,
required: true
},
questionFormChangeState: {
type: Boolean,
default() {
return false
}
},
questionFormChangeNum: {
type: Number,
default() {
return 0
}
}
},
data() {
return {
activeName: 'relation-study',
tabs: ['relation-study'],
taskList: [],
loading: false,
selectArr: [],
activeTaskIndex: -1,
activeTaskVisitId: '',
measureData: [],
activeTaskIsCurrentTask: false,
activeTaskIsBaseline: false,
activeTaskReadingTaskState: 2,
readingTaskState: 2,
open: null
}
},
computed: {
...mapGetters(['visitTaskList', 'activeSeries'])
},
watch: {
'activeSeries': {
immediate: true,
handler(v) {
if (this.visitTaskList.length === 0) return
var index = this.visitTaskList.findIndex(i => i.VisitTaskId === v.visitTaskId)
if (index === -1) return
this.activeTaskVisitId = v.visitTaskId
this.activeTaskIndex = index
this.activeTaskIsCurrentTask = this.visitTaskList[index].IsCurrentTask
this.activeTaskIsBaseline = this.visitTaskList[index].IsBaseLineTask
this.activeTaskReadingTaskState = this.visitTaskList[index].ReadingTaskState
if (!this.selectArr.includes(this.visitTaskList[index].VisitTaskId)) {
this.selectArr.push(this.visitTaskList[index].VisitTaskId)
}
this.$refs[this.activeTaskVisitId]
this.$nextTick(() => {
this.$refs[this.activeTaskVisitId][0].setSeriesActive(v)
})
}
}
},
mounted() {
this.getVisitInfo()
DicomEvent.$on('getNextVisitInfo', () => {
this.getNextVisitInfo()
})
DicomEvent.$on('toggleSeries', async data => {
console.log(data)
var index = this.visitTaskList.findIndex(i => i.VisitTaskId === data.series.visitTaskId)
if (index === -1) return
var alignedVisitTaskId = ''
var i = -1
if (data.type > 0) {
// 显示下一访视对齐的序列
i = index + 1
} else {
// 显示上一访视对齐的序列
i = index - 1
}
if (i > -1 && i < this.visitTaskList.length) {
alignedVisitTaskId = this.visitTaskList[i].VisitTaskId
this.getAlignedSeries(data.series, alignedVisitTaskId, data.measureData, i, data.canvasIndex)
}
})
DicomEvent.$on('isCanActiveNoneDicomTool', data => {
this.open.postMessage({ type: 'isCanActiveNoneDicomTool', data: data }, window.location)
})
DicomEvent.$on('removeNoneDicomMeasureData', data => {
this.open.postMessage({ type: 'removeNoneDicomMeasureData', data: data }, window.location)
})
DicomEvent.$on('addNoneDicomMeasureData', data => {
this.open.postMessage({ type: 'addNoneDicomMeasureData', data: data }, window.location)
})
DicomEvent.$on('selectSeries', data => {
this.$nextTick(() => {
this.$refs[this.activeTaskVisitId][0].selectSeries(data)
})
})
},
beforeDestroy() {
DicomEvent.$off('getNextVisitInfo')
DicomEvent.$off('toggleSeries')
DicomEvent.$off('isCanActiveNoneDicomTool')
DicomEvent.$off('removeNoneDicomMeasureData')
DicomEvent.$off('addNoneDicomMeasureData')
DicomEvent.$off('selectSeries')
},
methods: {
async getVisitInfo() {
const loading = this.$loading({ fullscreen: true })
await store.dispatch('reading/getOrganInfo', this.visitTaskId)
await store.dispatch('reading/getVisitTasks', this.visitTaskId)
var index = this.visitTaskList.findIndex(i => i.IsCurrentTask)
if (index > -1) {
await store.dispatch('reading/getMeasuredData', this.visitTaskList[index].VisitTaskId)
await store.dispatch('reading/getStudyInfo', { trialId: this.trialId, subjectVisitId: this.visitTaskList[index].VisitId, visitTaskId: this.visitTaskList[index].VisitTaskId, taskBlindName: this.visitTaskList[index].TaskBlindName })
await store.dispatch('reading/getReadingQuestionAndAnswer', { trialId: this.trialId, visitTaskId: this.visitTaskList[index].VisitTaskId })
await store.dispatch('reading/getDicomReadingQuestionAnswer', { trialId: this.trialId, visitTaskId: this.visitTaskList[index].VisitTaskId })
await store.dispatch('reading/setStatus', { visitTaskId: this.visitTaskList[index].VisitTaskId })
this.activeTaskVisitId = this.visitTaskList[index].VisitTaskId
this.activeTaskIndex = index
this.activeTaskIsCurrentTask = this.visitTaskList[index].IsCurrentTask
this.activeTaskIsBaseline = this.visitTaskList[index].IsBaseLineTask
this.activeTaskReadingTaskState = this.visitTaskList[index].ReadingTaskState
this.selectArr.push(this.visitTaskList[index].VisitTaskId)
this.$nextTick(() => {
this.$refs[this.activeTaskVisitId][0].initStudyInfo()
})
}
loading.close()
},
async getNextVisitInfo() {
const loading = this.$loading({ fullscreen: true })
var i = this.visitTaskList.length - 1
await store.dispatch('reading/getMasterSeries', { trialId: this.trialId, visitTaskId: this.visitTaskList[i].VisitTaskId, visitId: this.visitTaskList[i].VisitId })
await store.dispatch('reading/refreshMeasuredData', this.visitTaskList[i].VisitTaskId)
await store.dispatch('reading/getNextVisitTask', { visitTaskId: this.visitTaskId })
var index = this.visitTaskList.findIndex(i => i.IsCurrentTask)
if (index > -1) {
await store.dispatch('reading/getMeasuredData', this.visitTaskList[index].VisitTaskId)
await store.dispatch('reading/getStudyInfo', { trialId: this.trialId, subjectVisitId: this.visitTaskList[index].VisitId, visitTaskId: this.visitTaskList[index].VisitTaskId, taskBlindName: this.visitTaskList[index].TaskBlindName })
await store.dispatch('reading/getReadingQuestionAndAnswer', { trialId: this.trialId, visitTaskId: this.visitTaskList[index].VisitTaskId })
await store.dispatch('reading/getDicomReadingQuestionAnswer', { trialId: this.trialId, visitTaskId: this.visitTaskList[index].VisitTaskId })
await store.dispatch('reading/setStatus', { visitTaskId: this.visitTaskList[index].VisitTaskId })
this.activeTaskVisitId = this.visitTaskList[index].VisitTaskId
this.activeTaskIndex = index
this.activeTaskIsCurrentTask = this.visitTaskList[index].IsCurrentTask
this.activeTaskIsBaseline = this.visitTaskList[index].IsBaseLineTask
this.activeTaskReadingTaskState = this.visitTaskList[index].ReadingTaskState
this.selectArr.push(this.visitTaskList[index].VisitTaskId)
this.$nextTick(() => {
this.$refs[this.activeTaskVisitId][0].initStudyInfo()
})
}
loading.close()
},
async handleClick(visitTaskInfo) {
if (this.activeTaskVisitId === visitTaskInfo.VisitTaskId) return
var index = this.visitTaskList.findIndex(i => i.VisitTaskId === visitTaskInfo.VisitTaskId)
if (!this.visitTaskList[index].IsInit) {
const loading = this.$loading({ fullscreen: true })
await store.dispatch('reading/getMeasuredData', this.visitTaskList[index].VisitTaskId)
await store.dispatch('reading/getStudyInfo', { trialId: this.trialId, subjectVisitId: this.visitTaskList[index].VisitId, visitTaskId: this.visitTaskList[index].VisitTaskId, taskBlindName: this.visitTaskList[index].TaskBlindName })
await store.dispatch('reading/getReadingQuestionAndAnswer', { trialId: this.trialId, visitTaskId: this.visitTaskList[index].VisitTaskId })
await store.dispatch('reading/getDicomReadingQuestionAnswer', { trialId: this.trialId, visitTaskId: this.visitTaskList[index].VisitTaskId })
await store.dispatch('reading/setStatus', { visitTaskId: this.visitTaskList[index].VisitTaskId })
loading.close()
}
this.activeTaskVisitId = this.visitTaskList[index].VisitTaskId
this.activeTaskIndex = index
this.activeTaskIsCurrentTask = this.visitTaskList[index].IsCurrentTask
this.activeTaskIsBaseline = this.visitTaskList[index].IsBaseLineTask
this.activeTaskReadingTaskState = this.visitTaskList[index].ReadingTaskState
if (!this.selectArr.includes(this.visitTaskList[index].VisitTaskId)) {
this.selectArr.push(this.visitTaskList[index].VisitTaskId)
}
this.$nextTick(() => {
this.$refs[this.activeTaskVisitId][0].getStudyList()
})
},
loadImageStack(seriesInfo) {
this.$nextTick(() => {
this.$refs.dicomViewer.loadImageStack(seriesInfo)
})
},
previewCD() {
var token = getToken()
const routeData = this.$router.resolve({
path: `/clinicalData?subjectId=${this.subjectId}&trialId=${this.trialId}&visitTaskId=${this.visitTaskId}&TokenKey=${token}`
})
window.open(routeData.href, '_blank')
},
previewNoneDicoms(obj) {
var index = this.visitTaskList.findIndex(i => i.VisitTaskId === obj.visitTaskId)
var taskBlindName = this.visitTaskList[index].TaskBlindName
var token = getToken()
const routeData = this.$router.resolve({
path: `/nonedicoms?subjectId=${this.subjectId}&trialId=${this.trialId}&visitTaskId=${obj.visitTaskId}&taskBlindName=${taskBlindName}&readingTaskState=${this.visitTaskList[index].ReadingTaskState}&TokenKey=${token}`
})
this.open = window.open(routeData.href, '_blank')
},
async getAlignedSeries(baseSeries, visitTaskId, measureData, visitTaskIdx, canvasIndex) {
var loading = ''
var index = visitTaskIdx
if (!this.visitTaskList[index].IsInit) {
loading = this.$loading({ fullscreen: true })
if (!this.visitTaskList[index].measureDataInit) {
await store.dispatch('reading/getMeasuredData', this.visitTaskList[index].VisitTaskId)
}
if (!this.visitTaskList[index].studyListInit) {
await store.dispatch('reading/getStudyInfo', { trialId: this.trialId, subjectVisitId: this.visitTaskList[index].VisitId, visitTaskId: this.visitTaskList[index].VisitTaskId, taskBlindName: this.visitTaskList[index].TaskBlindName })
}
if (!this.visitTaskList[index].readingQuestionsInit) {
await store.dispatch('reading/getReadingQuestionAndAnswer', { trialId: this.trialId, visitTaskId: this.visitTaskList[index].VisitTaskId })
}
if (!this.visitTaskList[index].questionsInit) {
await store.dispatch('reading/getDicomReadingQuestionAnswer', { trialId: this.trialId, visitTaskId: this.visitTaskList[index].VisitTaskId })
}
await store.dispatch('reading/setStatus', { visitTaskId: this.visitTaskList[index].VisitTaskId })
}
this.activeTaskVisitId = visitTaskId
this.activeTaskIndex = index
this.activeTaskIsCurrentTask = this.visitTaskList[index].IsCurrentTask
this.activeTaskIsBaseline = this.visitTaskList[index].IsBaseLineTask
this.activeTaskReadingTaskState = this.visitTaskList[index].ReadingTaskState
if (!this.selectArr.includes(this.visitTaskList[index].VisitTaskId)) {
this.selectArr.push(this.visitTaskList[index].VisitTaskId)
}
var linkedSeries = this.getSeriesInfoByMark(baseSeries, visitTaskId, measureData, visitTaskIdx)
if (linkedSeries) {
this.$nextTick(() => {
linkedSeries.canvasIndex = canvasIndex
DicomEvent.$emit('loadLinkedImageStack', linkedSeries)
this.$refs[this.activeTaskVisitId][0].handleActiveSeries(linkedSeries)
})
}
if (loading) {
loading.close()
}
},
getLinkedSeries(baseSeries, visitTaskId, visitTaskIdx) {
var index = visitTaskIdx
if (index === -1) return
var visitTaskInfo = this.visitTaskList[index]
var obj = null
var studyList = visitTaskInfo.StudyList
// 查找筛选描述一致
var seriesList = studyList.map(s => s.SeriesList).flat()
var similarArr = seriesList.map((i, index) => {
return { similar: this.strSimilarity2Percent(i.description, baseSeries.description), index }
})
similarArr = similarArr.sort((a, b) => {
return b.similar - a.similar
})
const i = similarArr[0] && similarArr[0].similar > 0.85 ? similarArr[0].index : -1
if (i > -1) {
obj = seriesList[i]
}
// const idx = seriesList.findIndex(series => series.description === baseSeries.description)
// idx > -1 ? obj = seriesList[idx] : ''
if (!obj) {
// 描述不一致,则筛选层厚一致
const idx = seriesList.findIndex(series => series.sliceThickness === baseSeries.sliceThickness)
idx > -1 ? obj = seriesList[idx] : ''
}
if (!obj) {
// 层厚不一致,则筛选图像数量一致
const idx = seriesList.findIndex(series => series.instanceCount === baseSeries.instanceCount)
idx > -1 ? obj = seriesList[idx] : ''
}
if (!obj) {
const idx = seriesList.findIndex(series => series.isDicom && series.instanceCount > 0)
idx > -1 ? obj = seriesList[idx] : ''
}
if (obj) {
obj.imageIdIndex = Math.floor(obj.imageIds.length * (baseSeries.imageIdIndex / baseSeries.instanceCount))
}
return obj
},
strSimilarity2Number(s, t) {
var n = s.length; var m = t.length; var d = []
var i, j, s_i, t_j, cost
if (n === 0) return m
if (m === 0) return n
for (i = 0; i <= n; i++) {
d[i] = []
d[i][0] = i
}
for (j = 0; j <= m; j++) {
d[0][j] = j
}
for (i = 1; i <= n; i++) {
s_i = s.charAt(i - 1)
for (j = 1; j <= m; j++) {
t_j = t.charAt(j - 1)
if (s_i === t_j) {
cost = 0
} else {
cost = 1
}
d[i][j] = this.Minimum(d[i - 1][j] + 1, d[i][j - 1] + 1, d[i - 1][j - 1] + cost)
}
}
return d[n][m]
},
// 两个字符串的相似程度,并返回相似度百分比
strSimilarity2Percent(s, t) {
var l = s.length > t.length ? s.length : t.length
var d = this.strSimilarity2Number(s, t)
return Number((1 - d / l).toFixed(4))
},
Minimum(a, b, c) {
return a < b ? (a < c ? a : c) : (b < c ? b : c)
},
getLinkedSeries1(baseSeries, visitTaskId, visitTaskIdx) {
var index = visitTaskIdx
if (index === -1) return
var visitTaskInfo = this.visitTaskList[index]
var seriesInfo = {}
var studyList = visitTaskInfo.StudyList
// 筛选描述一致
var seriseArr = []
studyList.forEach((s, i) => {
var series = s.SeriesList.filter(series => series.description === baseSeries.description)
series.length > 0 ? seriseArr.push(...series) : ''
})
if (seriseArr.length > 0) {
// 描述一致,则筛选层厚一致
var stSeriseArr = seriseArr.filter(s => s.sliceThickness === baseSeries.sliceThickness)
if (stSeriseArr.length > 0) {
// 层厚一致,则筛选图像数量一致
var icSeriseArr = stSeriseArr.filter(s => s.instanceCount === baseSeries.instanceCount)
if (icSeriseArr.length > 0) {
const sIdx = icSeriseArr[0].studyIndex
const series = icSeriseArr[0]
var imageIdIndex = Math.floor(series.imageIds.length * (baseSeries.imageIdIndex / baseSeries.instanceCount))
// obj.studyId = series.studyId
// obj.studyIndex = sIdx
// obj.seriesIndex = series.seriesIndex
// obj.series = series
// obj.series.imageIdIndex = imageIdIndex
// obj.seriesId = series.seriesId
// obj.visitTaskId = visitTaskId
seriesInfo = studyList[sIdx].SeriesList[ series.seriesIndex]
seriesInfo.imageIdIndex = imageIdIndex
seriesInfo.studyIndex = sIdx
seriesInfo.seriesIndex = series.seriesIndex
seriesInfo.visitTaskId = visitTaskId
seriesInfo.studyId = series.studyId
} else {
const sIdx = stSeriseArr[0].studyIndex
const series = stSeriseArr[0]
const imageIdIndex = Math.floor(series.imageIds.length * (baseSeries.imageIdIndex / baseSeries.instanceCount))
// obj.studyIndex = sIdx
// obj.studyId = series.studyId
// obj.seriesIndex = series.seriesIndex
// obj.series = series
// obj.series.imageIdIndex = imageIdIndex
// obj.seriesId = series.seriesId
// obj.visitTaskId = visitTaskId
seriesInfo = studyList[sIdx].SeriesList[ series.seriesIndex]
seriesInfo.imageIdIndex = imageIdIndex
seriesInfo.studyIndex = sIdx
seriesInfo.seriesIndex = series.seriesIndex
seriesInfo.visitTaskId = visitTaskId
seriesInfo.studyId = series.studyId
}
} else {
const sIdx = seriseArr[0].studyIndex
const series = seriseArr[0]
const imageIdIndex = Math.floor(series.imageIds.length * (baseSeries.imageIdIndex / baseSeries.instanceCount))
// obj.studyIndex = sIdx
// obj.studyId = series.studyId
// obj.seriesIndex = series.seriesIndex
// obj.series = series
// obj.series.imageIdIndex = imageIdIndex
// obj.seriesId = series.seriesId
// obj.visitTaskId = visitTaskId
seriesInfo = studyList[sIdx].SeriesList[ series.seriesIndex]
seriesInfo.imageIdIndex = imageIdIndex
seriesInfo.studyIndex = sIdx
seriesInfo.seriesIndex = series.seriesIndex
seriesInfo.visitTaskId = visitTaskId
seriesInfo.studyId = series.studyId
}
} else {
// 都不符合要求, 判断是否存在层厚为5的序列否则显示第一个检查的中间的序列
var seriesObj = null
for (let i = 0; i < studyList.length; i++) {
const seriesIdx = studyList[i].SeriesList.findIndex(s => s.sliceThickness && parseInt(s.sliceThickness) === 5)
if (seriesIdx > -1) {
seriesObj = { studyIndex: i, seriesIdx, series: studyList[i].SeriesList[seriesIdx] }
break
}
}
if (seriesObj) {
// obj.studyIndex = seriesObj.studyIndex
// obj.seriesIndex = seriesObj.seriesIdx
// seriesObj.series.imageIdIndex = Math.floor(seriesObj.series.imageIds.length / 2)
// obj.series = seriesObj.series
// obj.seriesId = seriesObj.series.seriesId
seriesInfo = studyList[seriesObj.studyIndex].SeriesList[seriesObj.seriesIdx]
seriesInfo.imageIdIndex = Math.floor(seriesObj.series.imageIds.length / 2)
seriesInfo.studyIndex = seriesObj.studyIndex
seriesInfo.seriesIndex = seriesObj.seriesIdx
seriesInfo.visitTaskId = visitTaskId
seriesInfo.studyId = seriesObj.series.studyId
} else {
const sIdx = studyList.findIndex(s => s.IsDicom)
const series = studyList[sIdx].SeriesList[0]
// series.imageIdIndex = Math.floor(series.imageIds.length / 2)
// obj.studyIndex = sIdx
// obj.seriesIndex = 0
// obj.series = series
// obj.seriesId = series.seriesId
seriesInfo = studyList[sIdx].SeriesList[0]
seriesInfo.imageIdIndex = imageIdIndex
seriesInfo.studyIndex = sIdx
seriesInfo.seriesIndex = series.seriesIndex
seriesInfo.visitTaskId = visitTaskId
seriesInfo.studyId = series.studyId
}
}
return seriesInfo
},
// 根据标记获取标记所在的序列信息
getSeriesInfoByMark(baseSeries, visitTaskId, obj, visitTaskIdx) {
var seriesInfo = null
if (obj) {
// 根据任务ID测量病灶信息
var index = visitTaskIdx
if (index > -1) {
var idx = -1
if (this.CriterionType === 10) {
idx = this.visitTaskList[index].MeasureData.findIndex(item => item.OrderMarkName === obj.OrderMarkName)
} else {
idx = this.visitTaskList[index].MeasureData.findIndex(item => item.QuestionId === obj.QuestionId && item.RowIndex === obj.RowIndex)
}
if (idx > -1 && this.visitTaskList[index].MeasureData[idx].MeasureData) {
var studyList = this.visitTaskList[index].StudyList
var studyId = this.visitTaskList[index].MeasureData[idx].StudyId
var seriesId = this.visitTaskList[index].MeasureData[idx].SeriesId
var instanceId = this.visitTaskList[index].MeasureData[idx].InstanceId
var studyIdx = studyList.findIndex(study => study.StudyId === studyId)
if (studyIdx > -1) {
var seriesIdx = studyList[studyIdx].SeriesList.findIndex(s => s.seriesId === seriesId)
if (seriesIdx > -1) {
var series = studyList[studyIdx].SeriesList[seriesIdx]
var instanceIdx = series.instanceList.findIndex(imageId => !!~imageId.indexOf(instanceId))
if (instanceIdx > -1) {
series.imageIdIndex = instanceIdx
// series.studyIndex = studyIdx
// series.seriesIndex = seriesIdx
// series.visitTaskId = visitTaskId
// series.studyId = studyId
seriesInfo = series
}
}
} else {
seriesInfo = this.getLinkedSeries(baseSeries, visitTaskId, visitTaskIdx)
}
} else {
seriesInfo = this.getLinkedSeries(baseSeries, visitTaskId, visitTaskIdx)
}
}
} else {
seriesInfo = this.getLinkedSeries(baseSeries, visitTaskId, visitTaskIdx)
}
return seriesInfo
}
}
}
</script>
<style lang="scss" scoped>
.dicom-container{
width: 100%;
height: 100%;
display: flex;
flex-direction: row;
justify-content: flex-start;
background-color: #000;
box-sizing: border-box;
::-webkit-scrollbar {
width: 5px;
height: 5px;
}
::-webkit-scrollbar-thumb {
border-radius: 10px;
background: #d0d0d0;
}
.dicom-viewer{
flex: 1;
width: 100%;
box-sizing: border-box;
.container{
width: 100%;
height: 100%;
box-sizing: border-box;
}
}
.dicom-list{
width: 200px;
padding: 5px 0px;
box-sizing: border-box;
.container{
width: 100%;
height: 100%;
box-sizing: border-box;
border: 1px solid #727272;
// border: 1px solid #ccc;
}
.el-tabs{
box-sizing: border-box;
padding: 0 5px;
height: 100%;
display: flex;
flex-direction: column;
// justify-content: flex-start;
border: 1px solid #727272;
.el-tabs__item{
color: #fff;
}
>>>.el-tabs__header{
height: 55px;
margin:0px;
box-sizing: border-box;
}
>>>.el-tabs__content{
flex: 1;
margin:0px;
overflow-y: auto;
box-sizing: border-box;
}
>>>.el-tabs__item{
color: #fff;
}
}
.dicom-desc{
font-weight: bold;
font-size: 13px;
text-align: center;
// background-color: rgb(88 84 83);
color: #d0d0d0;
padding: 2px;
}
.ps {
overflow-anchor: none;
touch-action: auto;
}
.series-active {
background-color: #607d8b!important;
border: 1px solid #607d8b!important;
}
>>>.el-progress__text{
color: #ccc;
font-size: 12px;
}
.series{
width: 100%;
display: flex;
flex-direction: column;
justify-content: flex-start;
.series-wrapper {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
width: 100%;
height: 85px;
// padding: 1px 2px 1px 8px;
// margin: 10px 0px;
border-radius: 2px;
border: 1px solid #404040;
background-color: #3a3a3a;
.el-progress__text{
display: none;
}
.el-progress-bar{
padding-right:0px;
}
.image-preview {
height: 75px;
width: 75px;
border: 2px solid #252525;
cursor: pointer;
}
.image-desc {
vertical-align: top;
p{
width: 100px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
font-size: 12px;
color: #ddd;
padding: 1px;
margin: 0px;
}
}
}
}
.related-study-wrapper{
box-sizing: border-box;
height: 100%;
padding-bottom: 5px;
display: flex;
flex-direction: row;
justify-content: space-between;
.left{
position: relative;
width: 25px;
height: 100%;
overflow-x: hidden;
overflow-y: auto;
box-sizing: border-box;
.visit-name-wrapper{
position: absolute;
top: 5px;
transform-origin: right top;
transform: rotate(-90deg);
right: 19px;
// top: 5px;
// right: 20px;
// transform-origin: right top;
// transform: rotate(-90deg);
// display: flex;
// flex-direction: row;
// align-content: flex-start;
}
.visit-item{
margin-left: 10px;
white-space: nowrap;
padding: 0px 4px;
border: 1px solid #999999;
border-bottom:none ;
text-align: center;
background-color: #4e4e4e;
color: #d5d5d5;
cursor: pointer;
// margin-left: 10px;
}
.visit-item-active{
background-color: #607d8b;
border: 1px solid #607d8b;
}
}
.right{
width:170px;
flex:1;
height: 100%;
border-left: 1px solid #4a4a4a;
color: #d5d5d5;
.study-wrapper{
width: 100%;
height: 100%;
}
}
}
}
}
</style>