diff --git a/nezha-fronted/src/components/common/ChartDiagram/diagram.vue b/nezha-fronted/src/components/common/ChartDiagram/diagram.vue index 16e679e3f..581f5aa6a 100644 --- a/nezha-fronted/src/components/common/ChartDiagram/diagram.vue +++ b/nezha-fronted/src/components/common/ChartDiagram/diagram.vue @@ -327,7 +327,7 @@ import { myCubec, myCubeAnchors } from '../project/L5/services/canvas.js' -import {getTopology, setTopology} from '../js/common' +import {getTopology, setTopology, dealImg} from '../js/common' import CanvasProps from '../project/L5/CanvasProps' import topologyTopTool from '../project/L5/topologyTopTool' import popDataMain from '../project/popData/Main' @@ -1596,7 +1596,7 @@ export default { this.$message({ duration: 2000, type: 'success', message: this.$t('tip.saveSuccess') }) this.uploadPicShow = false this.$get('monitor/project/topo/icon', { id: res.data.id }).then(iconInfo => { - this.dealImg(`monitor/project/topo/icon/${res.data.id}/1`).then((data, header) => { + dealImg(`monitor/project/topo/icon/${res.data.id}/1`, res.data.id).then((data, header) => { const group = this.tools.find(tool => tool.group === this.uploadPic.unit) this.iconArray.push({ ...iconInfo.data.list[0], @@ -1752,7 +1752,7 @@ export default { if (nowImage && nowImage.data) { promiseArr.push(nowImage) } else { - promiseArr.push(this.dealImg(`monitor/project/topo/icon/${item.id}/1`)) + promiseArr.push(dealImg(`monitor/project/topo/icon/${item.id}/1`, item.id)) } imgArr.push({ ...item }) }) @@ -1814,7 +1814,7 @@ export default { if (nowImage && nowImage.data) { promiseArr.push(nowImage) } else { - promiseArr.push(this.dealImg(`monitor/project/topo/icon/${item.data.imageId}/1`)) + promiseArr.push(dealImg(`monitor/project/topo/icon/${item.data.imageId}/1`, item.data.imageId)) } } else if (item.data.imageId) { promiseArr.push(imgDefault) diff --git a/nezha-fronted/src/components/common/js/common.js b/nezha-fronted/src/components/common/js/common.js index 91099ac62..4f2ce1660 100644 --- a/nezha-fronted/src/components/common/js/common.js +++ b/nezha-fronted/src/components/common/js/common.js @@ -48,6 +48,48 @@ export function getTopologyImg (key) { return false } +const topologyImg = {} + +export function dealImg (url, id) { + if (url) { + return new Promise((resolve, reject) => { + if (topologyImg['img' + id]) { + resolve(topologyImg['img' + id]) + return + } + vm.$axios + .get(url) + .then((res) => { + const imageInfo = { + data: ('data:image/jpeg;base64,' + res.data), + // width: res.headers.width === -1 ? 100 : (res.headers.width > 900 ? 900 : res.headers.width), + // height: res.headers.height === -1 ? 100 : (res.headers.height > 900 ? 900 : res.headers.height) + width: res.headers.width === -1 ? 100 : Number(res.headers.width), + height: res.headers.height === -1 ? 100 : Number(res.headers.height) + } + if (imageInfo.width > 900 || imageInfo.height > 900) { + if (imageInfo.height > imageInfo.width) { + imageInfo.width = imageInfo.width * 900 / imageInfo.height + imageInfo.height = 900 + } else if (imageInfo.height < imageInfo.width) { + imageInfo.height = imageInfo.height * 900 / imageInfo.width + imageInfo.width = 900 + } else { + imageInfo.height = 900 + imageInfo.width = 900 + } + } + topologyImg['img' + id] = imageInfo + resolve(topologyImg['img' + id]) + }) + }) + } else { + return new Promise(resolve => { + resolve({}) + }) + } +} + export function setTopologyImg (key, img) { // localStorage.setItem('nz-topologyImg-' + key, img) } diff --git a/nezha-fronted/src/components/common/project/topologyL5.vue b/nezha-fronted/src/components/common/project/topologyL5.vue index 8b3d90751..7d924b90e 100644 --- a/nezha-fronted/src/components/common/project/topologyL5.vue +++ b/nezha-fronted/src/components/common/project/topologyL5.vue @@ -351,7 +351,7 @@ import { myCubec, myCubeAnchors } from './L5/services/canvas.js' -import { getTopology, setTopology } from '../js/common' +import { getTopology, setTopology, dealImg } from '../js/common' import CanvasProps from './L5/CanvasProps' import topologyTopTool from './L5//topologyTopTool' import CanvasContextMenu from './L5/CanvasContextMenu' @@ -1653,7 +1653,7 @@ export default { this.$message({ duration: 2000, type: 'success', message: this.$t('tip.saveSuccess') }) this.uploadPicShow = false this.$get('monitor/project/topo/icon', { id: res.data.id }).then(iconInfo => { - this.dealImg(`monitor/project/topo/icon/${res.data.id}/1`).then((data, header) => { + dealImg(`monitor/project/topo/icon/${res.data.id}/1`, res.data.id).then((data, header) => { const group = this.tools.find(tool => tool.group === this.uploadPic.unit) this.iconArray.push({ ...iconInfo.data.list[0], @@ -1749,7 +1749,7 @@ export default { res.data.list.forEach((item, index) => { item.imageName = item.name delete item.name - promiseArr.push(this.dealImg(`monitor/project/topo/icon/${item.id}/1`)) + promiseArr.push(dealImg(`monitor/project/topo/icon/${item.id}/1`, item.id)) imgArr.push({ ...item }) }) Promise.all(promiseArr).then((res2, header) => { @@ -1808,7 +1808,7 @@ export default { } imgidList.forEach((item, index) => { if (item.data.imageId && imageAllId.data.list.find(image => item.data.imageId === image.id)) { - promiseArr.push(this.dealImg(`monitor/project/topo/icon/${item.data.imageId}/1`)) + promiseArr.push(dealImg(`monitor/project/topo/icon/${item.data.imageId}/1`, item.data.imageId)) } else if (item.data.imageId) { promiseArr.push(imgDefault) } else { @@ -2280,10 +2280,6 @@ export default { this.timer4 = null } if (getTopology(this.topologyIndex)) { - window.topology = null - window.Le5leTopologyPoint = null - window.topologyPoint = null - window.topologyRect = null getTopology(this.topologyIndex).off('contextmenu', this.onContextMenu) getTopology(this.topologyIndex).destroy() Object.keys(getTopology(this.topologyIndex)).forEach(key => {