You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1.3 KiB
1.3 KiB
MonitorDeviceList 设计
目标
将 Monitor 左侧 aside.device-panel(标题、搜索、筛选、多选条、DockDeviceCard 列表)抽为 MonitorDeviceList.vue。选中/筛选/多选状态与业务逻辑仍留页面。
非目标
- 不迁
filteredDocks/filterCounts/select/ 多选 Set 计算 - 不改 DockDeviceCard
- 不改地图与详情面板
契约
Props
| prop | 说明 |
|---|---|
dockCount / droneCount |
标题计数 |
search |
v-model 搜索 |
filter |
v-model:all | online | alarm |
filterCounts |
{ all, online, alarm } |
docks |
当前列表(filteredDocks) |
selectedDockIds |
Set 或可 has(id) 的集合 |
selectedId |
当前选中设备 id |
isDockActive |
(dock) => boolean |
altitudeOf |
(drone) => string 传给卡片 |
Emits: update:search · update:filter · clear-selection · select-all · clear-dock-selection · select · toggle-select
内部继续用 DockDeviceCard。
实现
src/components/MonitorDeviceList.vue- MonitorView 用组件替换
aside.device-panel - Commit:
refactor: 抽取 MonitorDeviceList 左侧设备列表 - 冒烟:搜索/筛选/点选机巢卡片正常
约束
精确 git add;中文 commit;跳过全量单测