From be9fb71e663466b39754bd0953e969260e67c07d Mon Sep 17 00:00:00 2001 From: air <30444667+sszdot@users.noreply.github.com> Date: Thu, 18 Sep 2025 16:51:38 +0800 Subject: [PATCH] =?UTF-8?q?=E3=80=90=E7=B1=BB=20=20=E5=9E=8B=E3=80=91?= =?UTF-8?q?=EF=BC=9Afactor=20=E3=80=90=E5=8E=9F=20=20=E5=9B=A0=E3=80=91?= =?UTF-8?q?=EF=BC=9A=E5=A4=9A=E5=A4=84=E9=80=9A=E8=BF=87=E9=87=8D=E9=87=8F?= =?UTF-8?q?=E5=88=A4=E6=96=AD=E6=98=AF=E5=90=A6=E6=8C=82=E6=9C=89=E8=B4=A7?= =?UTF-8?q?=E7=89=A9=20=E6=94=B9=E4=B8=BA=E4=B8=BB=E5=85=A5=E5=8F=A3?= =?UTF-8?q?=E5=88=A4=E6=96=AD=20=E8=A7=A3=E8=80=A6=20=E3=80=90=E8=BF=87=20?= =?UTF-8?q?=20=E7=A8=8B=E3=80=91=EF=BC=9A1.=E9=A3=9E=E6=9C=BA=E7=8A=B6?= =?UTF-8?q?=E6=80=81=E9=87=8C=E9=9D=A2=20=E5=A2=9E=E5=8A=A0=E4=B8=80?= =?UTF-8?q?=E4=B8=AA=E6=98=AF=E5=90=A6=E6=8C=82=E6=9C=89=E8=B4=A7=E7=89=A9?= =?UTF-8?q?=E7=9A=84=E7=8A=B6=E6=80=81=E5=AD=97=E6=AE=B5=20PS:=E5=88=A4?= =?UTF-8?q?=E6=96=AD=E9=87=8D=E9=87=8F=E7=8A=B6=E6=80=81=E6=9B=B4=E6=96=B0?= =?UTF-8?q?=202.=E5=87=A1=E6=98=AF=E4=B9=8B=E5=89=8D=E9=80=9A=E9=87=8D?= =?UTF-8?q?=E9=87=8F=E5=88=A4=E6=96=AD=E6=9D=A5=E6=9B=B4=E6=96=B0=E5=9B=BE?= =?UTF-8?q?=E6=A0=87=E7=8A=B6=E6=80=81=E7=9A=84=E4=BD=8D=E7=BD=AE=20?= =?UTF-8?q?=E5=85=A8=E9=83=A8=E6=94=B9=E6=88=90=E5=88=A4=E6=96=AD=20?= =?UTF-8?q?=E8=BF=99=E4=B8=AA=E6=96=B0=E5=AD=97=E6=AE=B5=E6=9D=A5=E5=AE=9E?= =?UTF-8?q?=E7=8E=B0=20=E3=80=90=E5=BD=B1=20=20=E5=93=8D=E3=80=91=EF=BC=9A?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit # 类型 包含: # feat:新功能(feature) # fix:修补bug # docs:文档(documentation) # style: 格式(不影响代码运行的变动) # refactor:重构(即不是新增功能,也不是修改bug的代码变动) # test:增加测试 # chore:构建过程或辅助工具的变动 --- src/components/MapBox.vue | 18 +++++------- src/store/index.js | 1 + .../layout/components/main/home/index.vue | 3 +- .../layout/components/main/planes/index.vue | 3 +- .../layout/components/main/planes/swarm.vue | 28 +++++++++++++++++++ src/views/layout/index.vue | 5 ++++ 6 files changed, 43 insertions(+), 15 deletions(-) diff --git a/src/components/MapBox.vue b/src/components/MapBox.vue index 13bb900..791fd19 100644 --- a/src/components/MapBox.vue +++ b/src/components/MapBox.vue @@ -918,13 +918,11 @@ export default { makePlane (plane, index = 0) { const customIcon = document.createElement('div') customIcon.className = 'custom-marker' - // 根据在线状态与载重显示不同图标,空值安全处理 + // 根据在线状态与是否有货显示不同图标,空值安全处理 // 约定: online === false 才判定为离线;其他(包括 undefined/null) 默认为在线 const isOnline = !((plane && plane.planeState && plane.planeState.online) === false) - const lwRaw0 = plane && plane.planeState ? plane.planeState.loadweight : 0 - const lwNum0 = Number(lwRaw0) - const loadWeight = Number.isFinite(lwNum0) ? lwNum0 : 0 - const iconToUse = !isOnline ? unlineIcon : (loadWeight > 300 ? planeRunIcon : planeIcon) + const hasGoods = !!(plane && plane.planeState && plane.planeState.hasGoods) + const iconToUse = !isOnline ? unlineIcon : (hasGoods ? planeRunIcon : planeIcon) // 使用 important 确保覆盖样式表中的背景图设置 customIcon.style.setProperty('background-image', `url(${iconToUse})`, 'important') customIcon.style.setProperty('background-repeat', 'no-repeat', 'important') @@ -1111,18 +1109,16 @@ export default { if (!el) return // 约定: online === false 才判定为离线;其他(包括 undefined/null) 默认为在线 const isOnline = !((stateObj && stateObj.online) === false) - const lwRaw = stateObj ? stateObj.loadweight : 0 - const lwNum = Number(lwRaw) - const loadWeight = Number.isFinite(lwNum) ? lwNum : 0 - const iconToUse = !isOnline ? unlineIcon : (loadWeight > 300 ? planeRunIcon : planeIcon) + const hasGoods = !!(stateObj && stateObj.hasGoods) + const iconToUse = !isOnline ? unlineIcon : (hasGoods ? planeRunIcon : planeIcon) // 使用 important 确保覆盖样式表中的背景图设置 el.style.setProperty('background-image', `url(${iconToUse})`, 'important') el.style.setProperty('background-repeat', 'no-repeat', 'important') el.style.setProperty('background-size', 'contain', 'important') // 调试信息,观察状态与最终图标选择 try { - el.dataset.icon = !isOnline ? 'unline' : (loadWeight > 300 ? 'run' : 'normal') - console.debug('[updatePlaneIcon]', { index, online: stateObj && stateObj.online, loadweight: lwRaw, parsedLoad: loadWeight, chosen: el.dataset.icon }) + el.dataset.icon = !isOnline ? 'unline' : (hasGoods ? 'run' : 'normal') + console.debug('[updatePlaneIcon]', { index, online: stateObj && stateObj.online, hasGoods, chosen: el.dataset.icon }) } catch (e) { /* noop */ } }, /** diff --git a/src/store/index.js b/src/store/index.js index d0395b0..7eea0c6 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -394,6 +394,7 @@ const store = new Vuex.Store({ acceState: null, // 加速度计校准状态 getPlaneMode: null, // 飞机模式 loadweight: null, // 重量 + hasGoods: false, // 是否有货 hookstatus: null, // 钩子状态 position: [], // [[经度,维度,相对高度]]累计数组 battCapacity: null, // 电池容量 diff --git a/src/views/layout/components/main/home/index.vue b/src/views/layout/components/main/home/index.vue index d88254c..68b71f7 100644 --- a/src/views/layout/components/main/home/index.vue +++ b/src/views/layout/components/main/home/index.vue @@ -50,10 +50,9 @@ export default { planeIconStates () { return this.planeList.map(plane => { const s = plane.planeState || {} - const n = Number(s.loadweight) return { offline: s.online === false, - run: Number.isFinite(n) && n > 300 + run: !!s.hasGoods } }) }, diff --git a/src/views/layout/components/main/planes/index.vue b/src/views/layout/components/main/planes/index.vue index c0495fb..60bd1ed 100644 --- a/src/views/layout/components/main/planes/index.vue +++ b/src/views/layout/components/main/planes/index.vue @@ -181,10 +181,9 @@ export default { */ planeIconState () { const s = this.planeState || {} - const n = Number(s.loadweight) return { offline: s.online === false, - run: Number.isFinite(n) && n > 300 + run: !!s.hasGoods } } }, diff --git a/src/views/layout/components/main/planes/swarm.vue b/src/views/layout/components/main/planes/swarm.vue index db13648..b0b18e1 100644 --- a/src/views/layout/components/main/planes/swarm.vue +++ b/src/views/layout/components/main/planes/swarm.vue @@ -79,6 +79,20 @@ export default { return Array.isArray(posArr) ? posArr : [] }) }, + /** + * @description: 派生出与“图标选择”强相关的轻量状态,供独立 watcher 监控 + * offline: 是否离线;run: 载重是否超过阈值(>300) + */ + planeIconStates () { + return this.planeList.map(plane => { + const s = plane.planeState || {} + const n = Number(s.loadweight) + return { + offline: s.online === false, + run: Number.isFinite(n) && n > 300 + } + }) + }, /** * @description: 侧边栏显隐 */ @@ -293,6 +307,20 @@ export default { }, deep: true }, + // 专门监听轻量图标状态,必要时才更新图标,避免不必要的 DOM 操作 + planeIconStates: { + handler (val, oldVal) { + val.forEach((iconState, index) => { + const prev = Array.isArray(oldVal) ? oldVal[index] : undefined + const changed = !prev || prev.offline !== iconState.offline || prev.run !== iconState.run + if (changed) { + const stateObj = this.planeList[index].planeState || {} + this.$refs.mapbox.updatePlaneIcon(stateObj, index) + } + }) + }, + deep: true + }, // 实时更新所有飞机位置 和轨迹 planePositions: { handler (allPositions) { diff --git a/src/views/layout/index.vue b/src/views/layout/index.vue index 049d3b7..722b454 100644 --- a/src/views/layout/index.vue +++ b/src/views/layout/index.vue @@ -223,6 +223,11 @@ export default { this.$store.dispatch('fetchLog', { content: `${plane.name}--${jsonData[key]}`, color: '#f57c00' }) } else { plane.planeState[key] = jsonData[key] // 按订阅信息 刷新飞机状态 + // 重量更新时,派生更新是否有货标记 + if (key === 'loadweight') { + const n = Number(jsonData[key]) + plane.planeState.hasGoods = Number.isFinite(n) && n > 300 + } } } } catch (error) {