新增更新缩略图功能

main
wangxiaoshuang 2026-01-26 11:41:11 +08:00
parent dc8fb450fb
commit 8703b28470
3 changed files with 164 additions and 10 deletions

View File

@ -4423,3 +4423,11 @@ export function getTrialSubjectVisitMarkList(data) {
data
})
}
// 更新缩略图
export function updateImageResizePath(data) {
return request({
url: `/Series/updateImageResizePath`,
method: 'post',
data
})
}

View File

@ -29,8 +29,12 @@
:src="item.previewImageUrl"
fit="fill"
/> -->
<img class="image-preview" :src="item.previewImageUrl" crossorigin="anonymous" alt=""
style="width: 72px;height:72px;" fit="fill">
<div class="imageBox" style="width: 72px;height:72px;">
<img class="image-preview" :src="item.previewImageUrl" crossorigin="anonymous" alt=""
style="width: 72px;height:72px;" fit="fill" />
<i class="el-icon-refresh" :title="$t('tip:refreshImage')"
@click.stop="refreshImage(item)"></i>
</div>
<div class="viewernavitextwrapper">
<div style="padding: 1px 5px 1px 1px;display: flex;justify-content: space-between;">
<div v-if="item.keySeries" style="color:red">
@ -136,7 +140,7 @@ import * as cornerstone from 'cornerstone-core'
import * as cornerstoneWADOImageLoader from 'cornerstone-wado-image-loader'
import dicomViewer from '@/components/Dicom/DicomViewer'
import { getStudyInfo, getSeriesList } from '@/api/reading'
import { getInstanceList, getPatientSeriesList, setSeriesStatus, setInstanceStatus } from '@/api/trials'
import { getInstanceList, getPatientSeriesList, setSeriesStatus, setInstanceStatus, updateImageResizePath } from '@/api/trials'
import requestPoolManager from '@/utils/request-pool'
import store from '@/store'
@ -247,6 +251,62 @@ export default {
workSpeedclose(true)
},
methods: {
async updateImageResizePath(data) {
try {
let res = await updateImageResizePath(data)
if (res.IsSuccess) {
this.$message.success(this.$t("message:tip:updateImageResizePath:success"))
}
} catch (err) {
console.log(err)
}
},
async refreshImage(item) {
let thumbnailPath = item.previewImageUrl.split(this.OSSclientConfig.basePath)[1]
let blob = await this.dicomToPng(item.imageIds[0])
let OSSclient = this.OSSclient
try {
let seriesRes = await OSSclient.put(thumbnailPath, blob)
if (seriesRes && seriesRes.url) {
let path = this.$getObjectName(seriesRes.url)
item.previewImageUrl = seriesRes.url
let data = {
seriesId: item.seriesId,
ImageResizePath: path
}
this.updateImageResizePath(data)
}
} catch (e) {
}
},
dicomToPng(imageId) {
return new Promise((resolve) => {
cornerstone.loadImage(imageId).then(async (image) => {
let width = image.columns, height = image.rows;
let canvas = document.createElement('canvas')
canvas.width = (width * 60) / height
canvas.height = 60
if (image) {
cornerstone.renderToCanvas(canvas, image)
// Canvas PNG
let blob = await this.canvasToBlob(canvas)
resolve(blob)
} else {
resolve()
}
})
}).catch((reason) => {
reason()
})
},
canvasToBlob(canvas) {
return new Promise((resolve) => {
canvas.toBlob((blob) => {
resolve(blob)
})
})
},
async loadStudy() {
let params = {}
if (this.isPacs) {
@ -905,7 +965,18 @@ export default {
}
</script>
<style>
<style lang="scss" scoped>
.imageBox {
position: relative;
i {
position: absolute;
top: 0;
left: 0;
cursor: pointer;
}
}
.viewerContainer .el-tabs--border-card {
background: none;
border: none;

View File

@ -45,8 +45,12 @@
style="position: relative;margin-bottom:5px;border-radius: 2px;border: 1px solid #404040;"
series-type="current" @click="showSeriesImage($event, index, i, series)">
<div class="viewernavigatorwrapper">
<img class="image-preview" :src="series.previewImageUrl" crossorigin="anonymous" alt=""
style="width: 85px;height:85px;" fit="fill">
<div class="imageBox" style="width: 72px;height:72px;">
<img class="image-preview" :src="series.previewImageUrl" crossorigin="anonymous" alt=""
style="width: 72px;height:72px;" fit="fill" />
<i class="el-icon-refresh" :title="$t('tip:refreshImage')"
@click.stop="refreshImage(series)"></i>
</div>
<div class="viewernavitextwrapper">
<div style="padding: 1px 5px 1px 1px;display: flex;justify-content: space-between;">
<div>#{{ series.seriesNumber }}</div>
@ -184,8 +188,12 @@
<div class="viewernavigatorwrapper"
style="position: relative;border:1px solid #434343;" series-type="relation"
@click="showRelationSeriesImage($event, seriesItem, studyIndex, index)">
<img class="image-preview" :src="seriesItem.previewImageUrl" crossorigin="anonymous"
alt="" style="width: 85px;height:85px;" fit="fill">
<div class="imageBox" style="width: 72px;height:72px;">
<img class="image-preview" :src="seriesItem.previewImageUrl"
crossorigin="anonymous" alt="" style="width: 72px;height:72px;" fit="fill" />
<i class="el-icon-refresh" :title="$t('tip:refreshImage')"
@click.stop="refreshImage(item)"></i>
</div>
<div class="viewernavitextwrapper">
<div
@ -273,7 +281,7 @@ import * as cornerstone from 'cornerstone-core'
import * as cornerstoneWADOImageLoader from 'cornerstone-wado-image-loader'
import dicomViewer from '@/components/Dicom/DicomViewer'
import { getVisitStudyList, getAllRelationStudyList, getSeriesList } from '@/api/reading'
import { setSeriesStatus, setInstanceStatus } from '@/api/trials'
import { setSeriesStatus, setInstanceStatus, updateImageResizePath } from '@/api/trials'
import { getTaskUploadedDicomStudyList } from '@/api/reading'
import requestPoolManager from '@/utils/request-pool'
import store from '@/store'
@ -358,6 +366,62 @@ export default {
workSpeedclose(true)
},
methods: {
async updateImageResizePath(data) {
try {
let res = await updateImageResizePath(data)
if (res.IsSuccess) {
this.$message.success(this.$t("message:tip:updateImageResizePath:success"))
}
} catch (err) {
console.log(err)
}
},
async refreshImage(item) {
let thumbnailPath = item.previewImageUrl.split(this.OSSclientConfig.basePath)[1]
let blob = await this.dicomToPng(item.imageIds[0])
let OSSclient = this.OSSclient
try {
let seriesRes = await OSSclient.put(thumbnailPath, blob)
if (seriesRes && seriesRes.url) {
let path = this.$getObjectName(seriesRes.url)
item.previewImageUrl = seriesRes.url
let data = {
seriesId: item.seriesId,
ImageResizePath: path
}
this.updateImageResizePath(data)
}
} catch (e) {
}
},
dicomToPng(imageId) {
return new Promise((resolve) => {
cornerstone.loadImage(imageId).then(async (image) => {
let width = image.columns, height = image.rows;
let canvas = document.createElement('canvas')
canvas.width = (width * 60) / height
canvas.height = 60
if (image) {
cornerstone.renderToCanvas(canvas, image)
// Canvas PNG
let blob = await this.canvasToBlob(canvas)
resolve(blob)
} else {
resolve()
}
})
}).catch((reason) => {
reason()
})
},
canvasToBlob(canvas) {
return new Promise((resolve) => {
canvas.toBlob((blob) => {
resolve(blob)
})
})
},
// 访
async getStudiesInfo() {
this.studyList = []
@ -947,7 +1011,18 @@ export default {
}
</script>
<style>
<style lang="scss">
.imageBox {
position: relative;
i {
position: absolute;
top: 0;
left: 0;
cursor: pointer;
}
}
.viewerContainer .el-tabs--border-card {
background: none;
border: none;