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

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)

nezha-fronted/src/components/common/js/common.js

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

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