227 lines
5.6 KiB
Markdown
227 lines
5.6 KiB
Markdown
# 当前页面说明
|
|
|
|
## 页面定位
|
|
|
|
当前系统只有一个实际业务页面,即“设备激活”页面。
|
|
|
|
页面对应代码:
|
|
|
|
- `frontend/src/views/activate/index.vue`
|
|
- `frontend/src/views/activate/ActiveForm.vue`
|
|
|
|
该页面同时承担两类职责:
|
|
|
|
- 激活码生成
|
|
- 激活记录管理
|
|
|
|
也就是说,它不是单纯的录入页,而是把“生成新激活码”和“查询历史激活记录”放在一个界面中完成。
|
|
|
|
## 页面结构
|
|
|
|
从界面结构上看,当前页面可以分成 3 个区域:
|
|
|
|
1. 激活记录查询区
|
|
2. 激活记录列表区
|
|
3. 设备激活弹窗区
|
|
|
|
## 1. 激活记录查询区
|
|
|
|
页面顶部是激活记录查询区,用于筛选本地数据库中的历史记录。
|
|
|
|
包含以下控件:
|
|
|
|
- `macAddress` 输入框
|
|
- 用于按设备 MAC 地址筛选记录
|
|
|
|
- 激活模块多选框
|
|
- 用于按模块筛选记录
|
|
- 支持多选
|
|
- 当前可选模块:
|
|
- `simulate`
|
|
- `digital`
|
|
- `contrast`
|
|
|
|
- 查询按钮
|
|
- 按当前条件查询本地 SQLite 中的激活记录
|
|
|
|
- 重置按钮
|
|
- 清空查询条件
|
|
- 清空后重新查询全部记录
|
|
|
|
该区域的作用是帮助用户快速定位某台设备、某类模块,或直接查看全部历史记录。
|
|
|
|
## 2. 激活记录列表区
|
|
|
|
查询区下方是激活记录列表区,用于展示本地数据库中的激活历史。
|
|
|
|
当前列表字段如下:
|
|
|
|
- `applicant`
|
|
- 申请方
|
|
|
|
- `macAddress`
|
|
- 设备 MAC 地址
|
|
|
|
- `applicationCode`
|
|
- 设备申请码
|
|
- 长内容以省略形式展示
|
|
|
|
- `module`
|
|
- 当前记录对应的激活模块
|
|
- 界面中会拆分为标签显示
|
|
|
|
- `activationCode`
|
|
- 最终生成的激活码
|
|
- 长内容以省略形式展示
|
|
|
|
- `createTime`
|
|
- 记录生成时间
|
|
|
|
- `remark`
|
|
- 备注信息
|
|
|
|
- `action`
|
|
- 当前提供“复制激活码”和“删除”操作
|
|
|
|
列表区支持的功能:
|
|
|
|
- 展示本地全部或筛选后的激活记录
|
|
- 分页显示,当前每页 10 条
|
|
- 无数据时显示空状态
|
|
- 直接复制某条历史记录中的激活码
|
|
- 删除单条历史记录
|
|
|
|
列表上方工具区还提供 3 个批量操作:
|
|
|
|
- 备份数据
|
|
- 将当前本地激活记录导出为 JSON 备份文件
|
|
|
|
- 导入备份
|
|
- 选择之前导出的 JSON 备份文件
|
|
- 导入时会先清空当前数据,再恢复备份内容
|
|
|
|
- 清空数据
|
|
- 一次性删除本地全部激活记录
|
|
|
|
该区域主要用于“查历史”和“复用历史结果”,避免重复生成。
|
|
|
|
## 3. 设备激活弹窗区
|
|
|
|
列表区上方提供“设备激活”按钮,点击后打开激活弹窗。
|
|
|
|
这个弹窗是当前页面的核心操作区,用于生成新的激活码并保存到本地数据库。
|
|
|
|
### 3.1 RSA 密钥配置区
|
|
|
|
该区域是否显示,由环境变量 `VITE_RSA_CAN_EDIT` 控制。
|
|
|
|
如果开启,则会显示:
|
|
|
|
- RSA 公钥文本框
|
|
- RSA 私钥文本框
|
|
- 复制公钥按钮
|
|
- 复制私钥按钮
|
|
|
|
当前默认配置为不显示该区域。
|
|
|
|
### 3.2 激活模块选择区
|
|
|
|
用户可以通过 3 个开关选择需要激活的模块:
|
|
|
|
- 模拟模式模块 `simulate`
|
|
- 数字模式模块 `digital`
|
|
- 对比模式模块 `contrast`
|
|
|
|
生成激活码前,至少要选择一个模块,否则页面会提示错误。
|
|
|
|
### 3.3 申请方输入区
|
|
|
|
用户可以录入本次激活记录的申请方。
|
|
|
|
该字段当前用于:
|
|
|
|
- 标识该条激活记录属于谁
|
|
- 辅助后续在历史列表中识别记录来源
|
|
|
|
申请方不是生成激活码的必要条件,但会和激活记录一起保存到本地数据库。
|
|
|
|
### 3.4 设备申请码输入区
|
|
|
|
用户在这里输入或粘贴设备申请码。
|
|
|
|
这是生成激活码的前提条件,当前规则包括:
|
|
|
|
- 不能为空
|
|
- 必须能被当前 RSA 私钥正确解密
|
|
- 解密结果中必须包含 `macAddress`
|
|
|
|
如果申请码无效,页面会提示错误并终止生成。
|
|
|
|
### 3.5 设备激活码展示区
|
|
|
|
当模块选择和申请码校验通过后,用户可以点击“生成激活码”。
|
|
|
|
生成成功后:
|
|
|
|
- 激活码显示在只读文本框中
|
|
- 用户可以点击“复制激活码”直接复制结果
|
|
|
|
这里展示的是最终输出内容,也是后续保存到数据库中的核心字段。
|
|
|
|
### 3.6 备注区
|
|
|
|
用户可以输入备注信息。
|
|
|
|
当前限制:
|
|
|
|
- 最长 120 个字符
|
|
|
|
备注会随激活记录一起保存,方便后续查询和识别用途。
|
|
|
|
### 3.7 弹窗底部操作区
|
|
|
|
弹窗底部有两个按钮:
|
|
|
|
- 保存
|
|
- 前提是必须已经生成激活码
|
|
- 点击后将本次数据写入本地 SQLite
|
|
- 保存成功后关闭弹窗,并刷新主页面列表
|
|
|
|
- 关闭
|
|
- 直接关闭弹窗
|
|
- 不保存当前内容
|
|
|
|
## 页面操作流程
|
|
|
|
从用户视角,当前页面的典型使用流程如下:
|
|
|
|
1. 进入“设备激活”页面。
|
|
2. 点击“设备激活”按钮,打开激活弹窗。
|
|
3. 选择一个或多个需要激活的模块。
|
|
4. 录入申请方。
|
|
5. 输入设备申请码。
|
|
6. 点击“生成激活码”。
|
|
7. 生成成功后查看或复制激活码。
|
|
8. 如有需要,填写备注。
|
|
9. 点击“保存”,将数据写入本地数据库。
|
|
10. 返回主页面后,在历史列表中查看新记录。
|
|
11. 后续如需再次使用,可直接从列表复制历史激活码。
|
|
12. 如有需要,可手动备份当前数据,或在清空后通过备份文件恢复。
|
|
|
|
## 页面价值总结
|
|
|
|
当前页面虽然只有一个,但已经覆盖完整核心业务流程:
|
|
|
|
- 录入申请方
|
|
- 输入申请码
|
|
- 选择激活模块
|
|
- 生成激活码
|
|
- 保存激活记录
|
|
- 查询历史记录
|
|
- 复制历史激活码
|
|
- 删除历史记录
|
|
- 备份本地数据
|
|
- 导入备份恢复数据
|
|
|
|
因此,这个页面本质上是一个“激活工具 + 本地记录管理工具”的组合界面。
|