gfwleak/nezha-nezha-fronted
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix：处理图片加载的闭包问题

Browse Source
This commit is contained in:
zhangyu
2022-07-06 10:37:03 +08:00
parent 543f6efda8
commit 8a6635b7ff
3 changed files with 51 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
nezha-fronted/src/components/common/ChartDiagram/diagram.vue
View File

@@ -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)

44
nezha-fronted/src/components/common/js/common.js
View File

@@ -16,7 +16,7 @@ export function getUUID () {
return (S4() + S4() + '-' + S4() + '-' + S4() + '-' + S4() + '-' + S4() + S4() + S4())
}
const chartCache = {}
export const chartCache = {}
export function getChart (key) {
return chartCache[`chart${key}`]
@@ -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)
}

12
nezha-fronted/src/components/common/project/topologyL5.vue
View File

@@ -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 => {