# 设备分配看板设计

日期：2026-04-30

## 背景

当前“设备分配”页面延续了传统的“列表 + 详情表单”结构，但这类结构不适合当前业务目标。

对设备分配来说，用户最关心的不是单条分配记录的编辑细节，而是整体分配态势：

- 一共有多少识别单元
- 一共有多少设备
- 已分配多少识别单元
- 还有多少识别单元未分配
- 每台设备分配了多少识别单元
- 哪些设备接近上限、已经满载、或者处于空闲
- 在给定设备承载上限的前提下，如何快速自动平均分配

因此，这个页面应从“表单页”转为“分配看板”。

## 目标

设备分配页需要回答四个问题：

1. 当前整体分配情况如何
2. 哪些设备负载偏高，哪些设备空闲
3. 哪些识别单元还未分配
4. 如何基于设备上限快速自动平均分配，并允许少量手工调整

## 界面原则

本页优先强调“看清分配情况”和“快速完成分配”，界面应尽量简洁。

具体原则：

- 优先展示数字、状态和卡片，不展示大段说明文字
- 不放与分配主题关系弱的输入框
- 非关键说明尽量缩成短标签、短提示或折叠信息
- 让用户进入页面后先看到总量、负载、未分配，再看到操作
- 操作按钮集中放在一行，避免表单式堆叠

## 非目标

本次不做以下内容：

- 不做复杂拖拽交互
- 不做实时设备性能采样驱动的智能调度
- 不做按设备型号自动推算上限
- 不修改设备最终运行配置 JSON 合同
- 不引入新的底层部署引擎

## 页面定位

“设备分配”页面是一个调度和部署看板，不是传统资产详情页。

它的核心职责是：

- 展示识别单元与设备之间的承载关系
- 辅助用户快速完成平均分配
- 让未分配、超载、空闲这些问题一眼可见

## 信息架构

页面从上到下分为四个区域：

1. 分配概览
2. 操作区
3. 设备分配看板
4. 未分配识别单元

## 一、分配概览

页面顶部显示 6 个关键统计值：

- 识别单元总数
- 设备总数
- 已分配识别单元
- 未分配识别单元
- 平均每台设备负载
- 超载设备数

说明：

- “已分配识别单元”按是否被任一设备分配计算
- “未分配识别单元”按未出现在任何设备分配中的识别单元计算
- “平均每台设备负载”按 `已分配识别单元 / 设备总数` 计算，保留 1 位小数
- “超载设备数”按当前页面设定的“每台设备最大单元数”判断

这些统计值用于快速判断整体均衡情况。

## 二、操作区

操作区位于概览下方，采用一行布局，包含：

- 每台设备最大单元数滑块
- 自动平均分配
- 清空分配
- 保存设备分配

### 每台设备最大单元数

- 类型：滑块
- 默认值：4
- 范围：1 到 8
- 右侧显示当前值，例如：`4 路/台`

这是页面级控制参数，不直接写入设备运行配置，只影响当前页面的自动分配和负载判断。

### 自动平均分配

点击后执行自动分配算法：

1. 收集所有识别单元
2. 收集所有设备
3. 清空当前页面中的暂存分配结果
4. 按设备当前已分配数量从少到多依次分配
5. 单台设备不超过当前滑块上限
6. 剩余放不下的识别单元保留在“未分配识别单元”区域

目标是：

- 尽量平均
- 不超过上限
- 剩余明确可见

自动分配完成后，页面显示轻量提示，例如：

`已按每台最多 4 路完成自动分配，剩余 3 路未分配。`

### 清空分配

清空当前页面暂存的所有设备分配，不立即落库。

### 保存设备分配

将当前页面中的设备分配关系统一保存到数据库。

## 三、设备分配看板

页面主体改为卡片式设备板，而不是传统表格。

每台设备显示为一张卡片，卡片内容包括：

- 设备名称
- 设备 ID
- 当前分配数量，例如 `3 / 4`
- 当前状态
- 已分配的识别单元标签列表

### 设备状态

基于当前“每台设备最大单元数”计算：

- `0`：空闲
- `1` 到 `上限 - 1`：正常
- `= 上限`：满载
- `> 上限`：超载

### 排序规则

卡片按以下优先级排序：

1. 超载
2. 满载
3. 正常
4. 空闲

同类内再按设备名称或设备 ID 排序。

这样最需要关注的设备会优先显示。

### 视觉形式

每张设备卡片建议包含：

- 状态标签
- 负载数字
- 简短负载条
- 识别单元标签块

这已经构成足够直观的图形化表达，不需要第一版引入复杂图表。

## 四、未分配识别单元

单独放在页面下方或右侧，作为一个明确区域。

显示：

- 未分配识别单元数量
- 未分配识别单元列表

若没有未分配单元，则显示：

`已全部分配`

这个区域用于快速暴露“还有哪些识别单元没有落到任何设备上”。

## 手工调整

第一版不做拖拽。

手工调整采用轻量操作方式：

- 在设备卡片中的识别单元标签上，支持“移出”
- 在未分配识别单元列表中，支持“加入某设备”
- 在设备卡片上，支持“从未分配中加入”

也可以支持简单的“移动到其他设备”菜单，但不要求第一版一步到位。

原则是：

- 先保证清楚和稳定
- 再考虑拖拽式优化

## 数据模型要求

本页使用现有底层对象，不新增新的核心存储结构：

- 识别单元：`recognition_units`
- 设备分配：`device_assignments`

页面上的“每台设备最大单元数”是 UI 级暂存参数，不要求本次入库。

保存时，仅保存：

- 每台设备对应的识别单元列表
- 描述信息

不修改设备最终运行配置的生成合同。

## 页面与详情页关系

设备分配页负责整体看板和编辑。

设备详情页只做状态展示：

- 当前设备分配了多少识别单元
- 当前设备对应哪个场景模板

设备详情页不再承担分配编辑职责。

## 低优先级信息处理

以下内容不应在主界面占据明显位置：

- 长段文字说明
- 单独的“描述”输入框
- 与分配动作无关的扩展属性

如确有必要保留，应放入折叠区域或次级编辑入口，而不是主操作区。

## 错误处理

需要处理这些情况：

- 没有设备：页面显示空状态，并禁用自动分配/保存
- 没有识别单元：页面显示空状态，并禁用自动分配
- 某识别单元引用缺失：在卡片或未分配区显示异常标记
- 保存失败：保留当前页面暂存状态，并提示错误

## 测试

至少覆盖以下测试：

1. 统计信息正确
2. 自动平均分配在不同设备/单元数量组合下结果正确
3. 超载、满载、空闲状态判定正确
4. 未分配识别单元列表正确
5. 保存设备分配后，数据库中的 `device_assignments` 正确更新
6. 设备详情页和预览页仍能读取保存后的分配结果

## 实施建议

建议按以下顺序实施：

1. 后端补充分配统计与自动分配计算
2. 改造设备分配页面为“概览 + 操作区 + 看板 + 未分配区”
3. 接入保存逻辑
4. 最后补样式和状态表现

## 结论

设备分配页应从“单条配置表单”转为“分配看板”。

核心不是编辑细节，而是：

- 看清楚总量
- 看清楚负载
- 看清楚未分配
- 一键自动平均分配
- 再做少量手工修正

这会比当前的列表/勾选模式更符合实际使用场景，也更适合 32 路视频、多台边缘设备的部署方式。