2.3 KiB

Raw Blame History

MonitorDetailPanel 设计

目标

将 MonitorView 右侧整块 aside.detail-panel（含空态）抽为 MonitorDetailPanel.vue，页面模板瘦身；直播会话 / runCommand / commandProgress / dockStatus dialog 逻辑仍留在 MonitorView。

非目标

不改地图、command-progress-float、侧栏设备列表
不把 live join/leave/heartbeat、指令轮询迁入组件
不把 dock-status t-dialog 塞进 aside
首轮不按 section 拆多文件

归属

能力	归属
detail-panel 模板（header/relation/video/status/mission/env/actions/empty）	组件
`live` 状态机、`toggleLive`/`openLive`/`closeLive`/`fullscreenLive`	页面
`runCommand`、`buttonStatusText`、`commandProgress`	页面
`dockStatusOpen` + dialog + summary/rt	页面
`controlExpanded`	页面持有（layout class 依赖），组件 v-model

组件契约（精简）

Props（VM 对象，页面组装成字符串后再传入）：

selected: boolean
header, relation, liveView, dockStatus, flightStatus, mission, environment, actions

Emits：

close / open-device-detail / select-parent
toggle-live / fullscreen-live / live-error
open-dock-status / open-mission-detail
update:controlExpanded
command → { title, desc }

LivePlayer： 组件内渲染；fullscreen 由组件对内部 ref 调用，失败可 emit('toast') 或沿用 @fullscreen-live 让页面处理。为保持现语义：校验+toast 留页面，组件 expose livePlayerRef 或 @fullscreen-live 由页面调现有 fullscreenLive（推荐后者，改动最小）。

验收

选中机巢/无人机：详情头、视频区、状态/任务/环境、快捷控制与展开一致
直播开关/全屏入口仍可用
下发命令仍走页面 runCommand，地图上 progress float 仍工作
「查看详情」仍打开页面 dock-status dialog
control-expanded 仍作用到 monitor-layout
无 console error

实现

新增 src/components/MonitorDetailPanel.vue
改 MonitorView：替换 aside，组装 VM + 接线 emits
Commit：refactor: 抽取 MonitorDetailPanel 右侧详情面板
浏览器冒烟

约束

不改后台；精确 git add；中文 commit
跳过全量单测；冒烟为准

2.3 KiB Raw Blame History

MonitorDetailPanel 设计

目标

非目标

归属

组件契约（精简）

验收

实现

约束

2.3 KiB

Raw Blame History