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

1

temp
wangxiaoshuang 2026-08-24 09:45:13 +08:00
parent 1ca4fb7dd4
commit 9ecaf5e267
5 changed files with 172 additions and 145 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/views/trials/trials-panel/reading/dicoms/components/DicomViewer.vue
View File

@ -422,7 +422,7 @@
</div> </div>
</div> </div>
</div> </div>
<el-tooltip v-if="trialCriterion.ImageUploadEnum > 0 && currentReadingTaskState < 2" v-hasPermi="['role:ir']" <el-tooltip v-if="trialCriterion.ImageUploadEnum > 0"
class="item" effect="dark" :content="$t('trials:reading:button:upload')" placement="bottom"> class="item" effect="dark" :content="$t('trials:reading:button:upload')" placement="bottom">
<div class="tool-wrapper"> <div class="tool-wrapper">
<div class="icon" @click.prevent="openUploadImage('upload')"> <div class="icon" @click.prevent="openUploadImage('upload')">
@ -431,15 +431,7 @@
<div class="text">{{ $t('trials:reading:button:upload') }}</div> <div class="text">{{ $t('trials:reading:button:upload') }}</div>
</div> </div>
</el-tooltip> </el-tooltip>
<el-tooltip v-if="trialCriterion.ImageDownloadEnum > 0" v-hasPermi="[ <el-tooltip v-if="trialCriterion.ImageDownloadEnum > 0" class="item" effect="dark" :content="$t('trials:reading:button:download')" placement="bottom">
'role:ir',
'role:mim',
'role:mc',
'role:pm',
'role:apm',
'role:ea',
'role:qa',
]" class="item" effect="dark" :content="$t('trials:reading:button:download')" placement="bottom">
<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" />

1
src/views/trials/trials-panel/reading/dicoms/components/upload.js
View File

@ -96,6 +96,7 @@ async function deleteCache(path) {
* *
*/ */
export async function changeFile(key, file, study, image) { export async function changeFile(key, file, study, image) {
// console.log(image, 'image')
// return console.log(study, 'study') // return console.log(study, 'study')
let dataset = dcmjs.data.DicomMessage.readFile(image.data.byteArray.buffer) let dataset = dcmjs.data.DicomMessage.readFile(image.data.byteArray.buffer)
// console.log(dataset, 'dataset') // console.log(dataset, 'dataset')

4
src/views/trials/trials-panel/reading/dicoms/customize/CustomizeDicomCanvas.vue
View File

@ -477,6 +477,10 @@ export default {
DicomEvent.$off('updateImage') DicomEvent.$off('updateImage')
}, },
methods: { methods: {
getInfo() {
var image = cornerstone.getImage(this.canvas)
return image
},
goViewer(e) { goViewer(e) {
console.log(this.$refs['sliderBox'].clientHeight) console.log(this.$refs['sliderBox'].clientHeight)
var height = e.offsetY * 100 / this.$refs['sliderBox'].clientHeight var height = e.offsetY * 100 / this.$refs['sliderBox'].clientHeight

50
src/views/trials/trials-panel/reading/dicoms/customize/CustomizeDicomViewer.vue
View File

@ -309,11 +309,8 @@
<div class="text">{{ $t('trials:reading:button:reset') }}</div> <div class="text">{{ $t('trials:reading:button:reset') }}</div>
</div> </div>
</el-tooltip> </el-tooltip>
<el-tooltip <el-tooltip v-if="trialCriterion.ImageUploadEnum > 0" class="item" effect="dark"
v-if="trialCriterion.ImageUploadEnum > 0" :content="$t('trials:reading:button:upload')" placement="bottom">
class="item" effect="dark"
:content="$t('trials:reading:button:upload')"
placement="bottom">
<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" />
@ -321,15 +318,8 @@
<div class="text">{{ $t('trials:reading:button:upload') }}</div> <div class="text">{{ $t('trials:reading:button:upload') }}</div>
</div> </div>
</el-tooltip> </el-tooltip>
<el-tooltip v-if="trialCriterion.ImageDownloadEnum > 0" v-hasPermi="[ <el-tooltip v-if="trialCriterion.ImageDownloadEnum > 0" class="item" effect="dark"
'role:ir', :content="$t('trials:reading:button:download')" placement="bottom">
'role:mim',
'role:mc',
'role:pm',
'role:apm',
'role:ea',
'role:qa',
]" class="item" effect="dark" :content="$t('trials:reading:button:download')" placement="bottom">
<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" />
@ -337,7 +327,10 @@
<div class="text">{{ $t('trials:reading:button:download') }}</div> <div class="text">{{ $t('trials:reading:button:download') }}</div>
</div> </div>
</el-tooltip> </el-tooltip>
<label for="Replacement" style="color: #fff;cursor: pointer;">
替换
</label>
<input type="file" id="Replacement" @change="beginScanFiles($event, 'replace')" style="display: none;">
<div style="margin-left: auto"> <div style="margin-left: auto">
<div style="display: flex;"> <div style="display: flex;">
<el-tooltip class="item" effect="dark" :content="$t('trials:reading:button:handbooks')" placement="bottom" <el-tooltip class="item" effect="dark" :content="$t('trials:reading:button:handbooks')" placement="bottom"
@ -449,10 +442,10 @@
/> --> /> -->
<upload-dicom-and-nonedicom v-if="uploadImageVisible" :SubjectId="uploadSubjectId" :SubjectCode="uploadSubjectCode" <upload-dicom-and-nonedicom v-if="uploadImageVisible" :SubjectId="uploadSubjectId" :SubjectCode="uploadSubjectCode"
:Criterion="uploadTrialCriterion" :visible.sync="uploadImageVisible" :VisitTaskId="taskId" :Criterion="uploadTrialCriterion" :visible.sync="uploadImageVisible" :VisitTaskId="taskId"
:isReadingTaskViewInOrder="isReadingTaskViewInOrder" /> :isReadingTaskViewInOrder="isReadingTaskViewInOrder" :StudyInstanceUID="StudyInstanceUID" :isReading="true" />
<download-dicom-and-nonedicom v-if="downloadImageVisible" :SubjectId="uploadSubjectId" <download-dicom-and-nonedicom v-if="downloadImageVisible" :SubjectId="uploadSubjectId"
:SubjectCode="uploadSubjectCode" :Criterion="uploadTrialCriterion" :TaskId="taskId" :SubjectCode="uploadSubjectCode" :Criterion="uploadTrialCriterion" :TaskId="taskId"
:visible.sync="downloadImageVisible" /> :visible.sync="downloadImageVisible" :isReading="true" />
</div> </div>
</template> </template>
<script> <script>
@ -479,6 +472,8 @@ import { getDoctorShortcutKey, getUserWLTemplateList } from '@/api/user'
import uploadDicomAndNonedicom from '@/components/uploadDicomAndNonedicom' import uploadDicomAndNonedicom from '@/components/uploadDicomAndNonedicom'
import downloadDicomAndNonedicom from '@/components/downloadDicomAndNonedicom' import downloadDicomAndNonedicom from '@/components/downloadDicomAndNonedicom'
import { getCriterionReadingInfo, setReadKeyFile } from '@/api/trials' import { getCriterionReadingInfo, setReadKeyFile } from '@/api/trials'
import { changeFile } from "@/views/trials/trials-panel/reading/dicoms/components/upload.js"
import dcmjs from '@/utils/dcmUpload/dcmjs'
export default { export default {
name: 'DicomViewer', name: 'DicomViewer',
components: { components: {
@ -684,7 +679,10 @@ export default {
fullScreenWidth: window.innerWidth - 570 + 'px', fullScreenWidth: window.innerWidth - 570 + 'px',
fullScreenHeight: window.innerHeight - 128 + 'px', fullScreenHeight: window.innerHeight - 128 + 'px',
ManualsClose: false ManualsClose: false,
fileKey: null,
file: null,
StudyInstanceUID: null
} }
}, },
@ -857,6 +855,12 @@ export default {
this.loadLinkedImageStack(seriesInfo) this.loadLinkedImageStack(seriesInfo)
console.log('loadLinkedImageStack') console.log('loadLinkedImageStack')
}) })
DicomEvent.$on('sendStudyFile', (study) => {
let image = this.$refs[`dicomCanvas${this.currentDicomCanvasIndex}`][0].getInfo()
study.visitTaskList = this.visitTaskList
this.$emit("update:Loading", true)
changeFile('IR', this.file, study, image)
})
}, },
beforeDestroy() { beforeDestroy() {
DicomEvent.$off('updateImage') DicomEvent.$off('updateImage')
@ -867,6 +871,11 @@ export default {
DicomEvent.$off('loadLinkedImageStack') DicomEvent.$off('loadLinkedImageStack')
}, },
methods: { methods: {
beginScanFiles(e, key) {
this.fileKey = key
this.file = e.target.files[0]
DicomEvent.$emit('getStudyFile')
},
handleReadingChart(e) { handleReadingChart(e) {
this.$emit('handleReadingChart', e) this.$emit('handleReadingChart', e)
}, },
@ -899,6 +908,11 @@ export default {
if (idx > -1) { if (idx > -1) {
this.taskId = this.visitTaskList[idx].VisitTaskId this.taskId = this.visitTaskList[idx].VisitTaskId
} }
let image = this.$refs[`dicomCanvas${this.currentDicomCanvasIndex}`][0].getInfo()
let dataset = dcmjs.data.DicomMessage.readFile(image.data.byteArray.buffer)
this.StudyInstanceUID = dataset.dict['0020000D'].Value[0]
dataset = null
console.log(this.StudyInstanceUID, 'StudyInstanceUID')
this.uploadSubjectCode = localStorage.getItem("subjectCode") this.uploadSubjectCode = localStorage.getItem("subjectCode")
this.uploadSubjectId = localStorage.getItem("subjectId") this.uploadSubjectId = localStorage.getItem("subjectId")
this.uploadTrialCriterion = this.trialCriterion this.uploadTrialCriterion = this.trialCriterion

144
src/views/trials/trials-panel/reading/dicoms/customize/CustomizeStudyList.vue
View File

@ -1,9 +1,11 @@
<template> <template>
<div v-loading="loading" class="study-wrapper"> <div v-loading="loading" class="study-wrapper">
<h4 v-if="isReadingShowSubjectInfo" style="color: #ddd;padding: 5px 0px;margin: 0;text-align: center;background-color: #4c4c4c;"> <h4 v-if="isReadingShowSubjectInfo"
style="color: #ddd;padding: 5px 0px;margin: 0;text-align: center;background-color: #4c4c4c;">
{{ subjectCode }} {{ subjectCode }}
</h4> </h4>
<h4 v-if="isReadingShowSubjectInfo" style="color: #ddd;padding: 5px 0px;margin: 0;text-align: center;background-color: #4c4c4c;margin-bottom: 5px;"> <h4 v-if="isReadingShowSubjectInfo"
style="color: #ddd;padding: 5px 0px;margin: 0;text-align: center;background-color: #4c4c4c;margin-bottom: 5px;">
{{ taskBlindName }} {{ taskBlindName }}
</h4> </h4>
<div class="ps"> <div class="ps">
@ -14,11 +16,8 @@
<!-- 关键序列 --> <!-- 关键序列 -->
{{ $t('trials:reading:title:keySeries') }} {{ $t('trials:reading:title:keySeries') }}
</div> </div>
<div <div v-else class="dicom-desc"
v-else style="width: 150px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;">
class="dicom-desc"
style="width: 150px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;"
>
<div> <div>
<div style="text-overflow: ellipsis;overflow: hidden;" v-if="!study.StudyName"> <div style="text-overflow: ellipsis;overflow: hidden;" v-if="!study.StudyName">
<span :title="study.StudyCode">{{ study.StudyCode }}</span> <span :title="study.StudyCode">{{ study.StudyCode }}</span>
@ -31,59 +30,47 @@
</span> </span>
<div>{{ study.Modalities }} ({{ study.SeriesCount }})</div> <div>{{ study.Modalities }} ({{ study.SeriesCount }})</div>
</div> </div>
<div style="text-overflow: ellipsis;overflow: hidden;" :title="study.Description">{{ study.Description }}</div> <div style="text-overflow: ellipsis;overflow: hidden;" :title="study.Description">{{ study.Description
}}</div>
</div> </div>
</div> </div>
</template> </template>
<div class="series"> <div class="series">
<div <div v-for="(series, i) in study.SeriesList" :key="i" style="position:relative;margin-top:5px;"
v-for="(series, i) in study.SeriesList" series-type="current" @click="showSeriesImage(index, i, series)">
:key="i"
style="position:relative;margin-top:5px;"
series-type="current"
@click="showSeriesImage(index,i,series)"
>
<div <div :class="{ 'series-active': i == seriesIndex && index === studyIndex }" class="series-wrapper">
:class="{'series-active': i==seriesIndex && index === studyIndex}" <el-image class="image-preview" :src="series.previewImageUrl" fit="fill" crossorigin="anonymous" />
class="series-wrapper"
>
<el-image
class="image-preview"
:src="series.previewImageUrl"
fit="fill"
crossorigin="anonymous"
/>
<div class="image-desc"> <div class="image-desc">
<div class="flex-div"> <div class="flex-div">
<div style="width: 40px;display: flex;flex-direction: row;justify-content: space-between;"> <div style="width: 40px;display: flex;flex-direction: row;justify-content: space-between;">
<div v-if="!study.IsCriticalSequence">#{{ series.seriesNumber }}</div> <div v-if="!study.IsCriticalSequence">#{{ series.seriesNumber }}</div>
<div v-if="series.isDicom && series.prefetchInstanceCount<series.instanceCount * 100 && series.modality!== 'SR'"> <div
v-if="series.isDicom && series.prefetchInstanceCount < series.instanceCount * 100 && series.modality !== 'SR'">
<!-- 下载 --> <!-- 下载 -->
<el-tooltip v-if="!series.isLoading" class="item" effect="dark" :content="$t('trials:reading:button:download')" placement="bottom"> <el-tooltip v-if="!series.isLoading" class="item" effect="dark"
<i class="el-icon-video-play" style="font-size: 18px;margin-right: 5px;color: #ffeb3b;cursor: pointer;" @click.stop="loadSeries(series,index,i)" /> :content="$t('trials:reading:button:download')" placement="bottom">
<i class="el-icon-video-play"
style="font-size: 18px;margin-right: 5px;color: #ffeb3b;cursor: pointer;"
@click.stop="loadSeries(series, index, i)" />
</el-tooltip> </el-tooltip>
</div> </div>
<el-tooltip v-else-if="series.isDicom && series.prefetchInstanceCount === 0 &&series.modality!== 'SR'" class="item" effect="dark" :content="$t('trials:reading:button:download')" placement="bottom"> <el-tooltip
<i class="el-icon-video-play" style="font-size: 18px;margin-right: 5px;color: #ffeb3b;cursor: pointer;" @click.stop="loadSeries(series,index,i)" /> v-else-if="series.isDicom && series.prefetchInstanceCount === 0 && series.modality !== 'SR'"
class="item" effect="dark" :content="$t('trials:reading:button:download')" placement="bottom">
<i class="el-icon-video-play"
style="font-size: 18px;margin-right: 5px;color: #ffeb3b;cursor: pointer;"
@click.stop="loadSeries(series, index, i)" />
</el-tooltip> </el-tooltip>
</div> </div>
<div v-if="series.isExistMutiFrames && series.instanceCount > 1"> <div v-if="series.isExistMutiFrames && series.instanceCount > 1">
<el-popover <el-popover placement="right" trigger="hover" popper-class="instance_frame_wrapper">
placement="right"
trigger="hover"
popper-class="instance_frame_wrapper"
>
<div class="frame_list"> <div class="frame_list">
<div <div v-for="(instance, idx) in series.instanceInfoList" :key="instance.Id"
v-for="(instance, idx) in series.instanceInfoList" class="frame_content" :class="{ 'frame_content_active': activeInstanceId === instance.Id }"
:key="instance.Id"
class="frame_content"
:class="{ 'frame_content_active': activeInstanceId === instance.Id }"
:style="{ 'margin-bottom': idx < series.instanceInfoList.length - 1 ? '5px' : '0px' }" :style="{ 'margin-bottom': idx < series.instanceInfoList.length - 1 ? '5px' : '0px' }"
@click.stop="showMultiFrames(index,series, i, instance)" @click.stop="showMultiFrames(index, series, i, instance)">
>
<!-- <div> <!-- <div>
<img <img
class="image-preview" class="image-preview"
@ -96,12 +83,14 @@
</div> --> </div> -->
<div> <div>
<div>{{ instance.InstanceNumber }}</div> <div>{{ instance.InstanceNumber }}</div>
<div>{{ `${instance.NumberOfFrames > 0 ? instance.KeyFramesList.length > 0 ? instance.KeyFramesList.length : instance.NumberOfFrames : 1} frame` }}</div> <div>{{ `${instance.NumberOfFrames > 0 ? instance.KeyFramesList.length > 0 ?
instance.KeyFramesList.length : instance.NumberOfFrames : 1} frame` }}</div>
</div> </div>
</div> </div>
</div> </div>
<i slot="reference" class="el-icon-connection" style="font-size: 15px;cursor: pointer;color: #ffeb3b;" /> <i slot="reference" class="el-icon-connection"
style="font-size: 15px;cursor: pointer;color: #ffeb3b;" />
</el-popover> </el-popover>
</div> </div>
</div> </div>
@ -121,9 +110,11 @@
{{ series.modality }}: {{ series.instanceCount }} image {{ series.modality }}: {{ series.instanceCount }} image
</p> </p>
<div class="flex-div"> <div class="flex-div">
<div v-if="measureData && measureData.findIndex(v=>v.SeriesId === series.seriesId && v.MeasureData) > -1"> <div
v-if="measureData && measureData.findIndex(v => v.SeriesId === series.seriesId && v.MeasureData) > -1">
<!-- 有标注 --> <!-- 有标注 -->
<el-tooltip class="item" effect="dark" :content="$t('trials:reading:button:marked')" placement="right"> <el-tooltip class="item" effect="dark" :content="$t('trials:reading:button:marked')"
placement="right">
<i class="el-icon-star-on" style="font-size: 16px;color: #ff5722;" /> <i class="el-icon-star-on" style="font-size: 16px;color: #ff5722;" />
</el-tooltip> </el-tooltip>
@ -131,10 +122,10 @@
</div> </div>
</div> </div>
</div> </div>
<div v-if="series.isDicom && series.prefetchInstanceCount>0 && series.prefetchInstanceCount<series.instanceCount * 100" style="width: 100%;"> <div
<el-progress v-if="series.isDicom && series.prefetchInstanceCount > 0 && series.prefetchInstanceCount < series.instanceCount * 100"
:percentage="parseInt((series.prefetchInstanceCount / series.instanceCount).toFixed(2))" style="width: 100%;">
/> <el-progress :percentage="parseInt((series.prefetchInstanceCount / series.instanceCount).toFixed(2))" />
</div> </div>
</div> </div>
@ -144,24 +135,19 @@
</div> </div>
<div class="sr-wrapper"> <div class="sr-wrapper">
<el-dialog <el-dialog :visible.sync="srDialogVisible"
:visible.sync="srDialogVisible" :custom-class="isSrFullscreen ? 'sr-full-dialog-container' : 'sr-dialog-container'" :show-close="false"
:custom-class="isSrFullscreen?'sr-full-dialog-container':'sr-dialog-container'" :close-on-click-modal="false" :fullscreen="isSrFullscreen">
:show-close="false"
:close-on-click-modal="false"
:fullscreen="isSrFullscreen"
>
<span slot="title" class="dialog-footer"> <span slot="title" class="dialog-footer">
<div style="position: absolute;right: 20px;top: 10px;"> <div style="position: absolute;right: 20px;top: 10px;">
<svg-icon :icon-class="isSrFullscreen?'exit-fullscreen':'fullscreen'" style="cursor: pointer;font-size: 20px;color:#000;" @click="isSrFullscreen=!isSrFullscreen" /> <svg-icon :icon-class="isSrFullscreen ? 'exit-fullscreen' : 'fullscreen'"
<svg-icon icon-class="dClose" style="cursor: pointer;font-size: 25px;margin-left: 10px;" @click="srDialogVisible = false" /> style="cursor: pointer;font-size: 20px;color:#000;" @click="isSrFullscreen = !isSrFullscreen" />
<svg-icon icon-class="dClose" style="cursor: pointer;font-size: 25px;margin-left: 10px;"
@click="srDialogVisible = false" />
</div> </div>
</span> </span>
<div style="height: 100%;margin:0;"> <div style="height: 100%;margin:0;">
<SrList <SrList v-if="srDialogVisible" :sr-info="srInfo" />
v-if="srDialogVisible"
:sr-info="srInfo"
/>
</div> </div>
</el-dialog> </el-dialog>
</div> </div>
@ -266,6 +252,9 @@ export default {
var idx = this.visitTaskList.findIndex(i => i.VisitTaskId === this.visitTaskId) var idx = this.visitTaskList.findIndex(i => i.VisitTaskId === this.visitTaskId)
this.measureData = this.visitTaskList[idx].MeasureData this.measureData = this.visitTaskList[idx].MeasureData
}) })
DicomEvent.$on("getStudyFile", () => {
DicomEvent.$emit('sendStudyFile', { studyList: this.studyList, studyIndex: this.studyIndex, seriesIndex: this.seriesIndex, visitTaskId: this.visitTaskId })
})
// DicomEvent.$on('setReadingState', readingTaskState => { // DicomEvent.$on('setReadingState', readingTaskState => {
// var idx = this.visitTaskList.findIndex(i => i.VisitTaskId === this.visitTaskId) // var idx = this.visitTaskList.findIndex(i => i.VisitTaskId === this.visitTaskId)
// if (idx > -1) { // if (idx > -1) {
@ -871,10 +860,12 @@ export default {
::v-deep .el-progress-bar__inner { ::v-deep .el-progress-bar__inner {
transition: width 0s ease; transition: width 0s ease;
} }
width:100%; width:100%;
height: 100%; height: 100%;
overflow-y: auto; overflow-y: auto;
overflow-x: hidden; overflow-x: hidden;
.dicom-desc { .dicom-desc {
font-weight: bold; font-weight: bold;
font-size: 13px; font-size: 13px;
@ -887,19 +878,23 @@ export default {
overflow-anchor: none; overflow-anchor: none;
touch-action: auto; touch-action: auto;
} }
.series-active { .series-active {
background-color: #607d8b !important; background-color: #607d8b !important;
border: 1px solid #607d8b !important; border: 1px solid #607d8b !important;
} }
::v-deep .el-progress__text { ::v-deep .el-progress__text {
color: #ccc; color: #ccc;
font-size: 12px; font-size: 12px;
} }
.series { .series {
width: 100%; width: 100%;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: flex-start; justify-content: flex-start;
.series-wrapper { .series-wrapper {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
@ -912,9 +907,11 @@ export default {
border-radius: 2px; border-radius: 2px;
border: 1px solid #404040; border: 1px solid #404040;
background-color: #3a3a3a; background-color: #3a3a3a;
.el-progress__text { .el-progress__text {
display: none; display: none;
} }
.el-progress-bar { .el-progress-bar {
padding-right: 0px; padding-right: 0px;
} }
@ -925,8 +922,10 @@ export default {
border: 2px solid #252525; border: 2px solid #252525;
cursor: pointer; cursor: pointer;
} }
.image-desc { .image-desc {
vertical-align: top; vertical-align: top;
p { p {
width: 95px; width: 95px;
white-space: nowrap; white-space: nowrap;
@ -936,6 +935,7 @@ export default {
color: #ddd; color: #ddd;
margin: 0px; margin: 0px;
line-height: 1.5; line-height: 1.5;
div { div {
width: 95px; width: 95px;
white-space: nowrap; white-space: nowrap;
@ -944,6 +944,7 @@ export default {
} }
} }
} }
.flex-div { .flex-div {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
@ -960,17 +961,21 @@ export default {
} }
} }
} }
::v-deep .el-collapse { ::v-deep .el-collapse {
border: none; border: none;
.el-collapse-item { .el-collapse-item {
background-color: #000 !important; background-color: #000 !important;
color: #ddd; color: #ddd;
} }
.el-collapse-item__content { .el-collapse-item__content {
padding-bottom: 5px; padding-bottom: 5px;
background-color: #000 !important; background-color: #000 !important;
} }
.el-collapse-item__header { .el-collapse-item__header {
background-color: #000 !important; background-color: #000 !important;
color: #ddd; color: #ddd;
@ -980,27 +985,33 @@ export default {
line-height: 20px; line-height: 20px;
} }
} }
.sr-wrapper { .sr-wrapper {
::v-deep .el-dialog { ::v-deep .el-dialog {
background: #fff !important; background: #fff !important;
border: 1px solid #ddd; border: 1px solid #ddd;
// color: #ddd; // color: #ddd;
.el-dialog__title { .el-dialog__title {
color: #fff; color: #fff;
} }
} }
::v-deep .sr-dialog-container { ::v-deep .sr-dialog-container {
margin-top: 50px !important; margin-top: 50px !important;
width: 75%; width: 75%;
height: 80%; height: 80%;
} }
::v-deep .el-dialog__body { ::v-deep .el-dialog__body {
padding: 10px; padding: 10px;
height: calc(100% - 50px); height: calc(100% - 50px);
} }
.el-dialog__header { .el-dialog__header {
position: relative; position: relative;
} }
.sr-full-dialog-container { .sr-full-dialog-container {
::v-deep .is-fullscreen .el-dialog__body { ::v-deep .is-fullscreen .el-dialog__body {
height: calc(100% - 50px); height: calc(100% - 50px);
@ -1008,7 +1019,6 @@ export default {
} }
} }
} }
</style> </style>
<style> <style>
.instance_frame_wrapper { .instance_frame_wrapper {
@ -1017,18 +1027,22 @@ export default {
border: 1px solid #2c2c2c; border: 1px solid #2c2c2c;
padding: 5px; padding: 5px;
} }
.frame_list { .frame_list {
max-height: 500px; max-height: 500px;
overflow-y: auto; overflow-y: auto;
} }
.instance_frame_wrapper ::-webkit-scrollbar { .instance_frame_wrapper ::-webkit-scrollbar {
width: 7px; width: 7px;
height: 7px; height: 7px;
} }
.instance_frame_wrapper ::-webkit-scrollbar-thumb { .instance_frame_wrapper ::-webkit-scrollbar-thumb {
border-radius: 10px; border-radius: 10px;
background: #d0d0d0; background: #d0d0d0;
} }
.frame_content { .frame_content {
height: 50px; height: 50px;
padding: 5px; padding: 5px;
@ -1038,6 +1052,7 @@ export default {
font-size: 12px; font-size: 12px;
border: 1px solid #404040; border: 1px solid #404040;
} }
.frame_content:hover { .frame_content:hover {
/* font-weight: bold; */ /* font-weight: bold; */
/* box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1); */ /* box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1); */
@ -1046,6 +1061,7 @@ export default {
border-color: #213a54 !important; border-color: #213a54 !important;
background-color: #213a54; background-color: #213a54;
} }
.frame_content_active { .frame_content_active {
border-color: #213a54 !important; border-color: #213a54 !important;
background-color: #213a54; background-color: #213a54;