# 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`**（推荐后者，改动最小）。

## 验收

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

## 实现

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

## 约束

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