9.2 KiB
✅已完成、⚠️部分完成、❌未完成这样显示 -----------------------------------------------------------------------------------------------需要解决
接口路径 方法 功能描述 已实现 潜在风险 / 待修复点
.../snapshot/progress GET 快照进度 是 getUserVmSnapshotProgress task_id 类型为 string，前端需确保传字符串而非整数 .../snapshot/count GET 快照数量 是 getUserVmSnapshotCount 无 .../snapshot/set_limit POST 设置快照上限 是 setUserVmSnapshotLimit 无 五、备份 (Backup) — 7 个接口 接口路径 方法 功能描述 已实现 潜在风险 / 待修复点 .../backup/list GET 备份列表 是 getUserVmBackupList 同快照 list，无分页参数 .../backup/create POST 创建备份 是 createUserVmBackup 无 .../backup/restore POST 恢复备份 是 restoreUserVmBackup 无 .../backup/delete POST 删除备份 是 deleteUserVmBackup 同快照 delete，用 POST 而非 DELETE .../backup/progress GET 备份进度 是 getUserVmBackupProgress task_id 类型为 string .../backup/count GET 备份数量 是 getUserVmBackupCount 无 .../backup/set_limit POST 设置备份上限 是 setUserVmBackupLimit 无 六、安全组 (PostGroup) — 15 个接口 接口路径 方法 功能描述 已实现 潜在风险 / 待修复点 .../post_group/list GET 安全组列表 是 getUserVmPostGroupList 无分页参数，仅有 keyword 搜索 .../post_group/detail GET 安全组详情 是 getUserVmPostGroupDetail 无 .../post_group/user_list GET 用户安全组列表 是 getUserVmPostGroupUserList 注意：分页参数名为 page_size（非 count），与其他接口不一致 .../post_group/create POST 创建安全组 是 createUserVmPostGroup lock/drop_all 为 boolean，但 FormData 会序列化为字符串 "true"/"false"，需后端兼容 .../post_group/update POST 修改安全组 是 updateUserVmPostGroup 同上 boolean 问题 .../post_group/bind POST 绑定安全组 是 bindUserVmPostGroup 无 .../post_group/unbind POST 解绑安全组 是 unbindUserVmPostGroup 无 .../post_group/apply POST 应用安全组 是 applyUserVmPostGroup 无 .../post_group/set_shared POST 设置共享 是 setSharedUserVmPostGroup shared 为 boolean，同上 FormData 序列化问题 .../post_group/delete DELETE 删除安全组 是 deleteUserVmPostGroup 无 .../post_group/enable_whitelist POST 启用白名单 是 enableUserVmPostGroupWhitelist 无 .../post_group/disable_whitelist POST 禁用白名单 是 disableUserVmPostGroupWhitelist 无 .../post_group/create_rule POST 创建规则 是 createUserVmPostGroupRule 无 .../post_group/update_rule POST 修改规则 是 updateUserVmPostGroupRule 无 .../post_group/delete_rule DELETE 删除规则 是 deleteUserVmPostGroupRule 无 七、网络 & 组网 (Network / Networking) — 7 个接口 接口路径 方法 功能描述 已实现 潜在风险 / 待修复点 .../network/list GET 网络列表 是 getUserVmNetworkList 无 .../network/detail GET 网络详情 是 getUserVmNetworkDetail OpenAPI 有可选参数 host_id，前端需视情况传递 .../networking/list GET 组网列表 是 getUserVmNetworkingList 无 .../networking/detail GET 组网详情 是 getUserVmNetworkingDetail 无 .../networking/create POST 创建组网 是 createUserVmNetworking 无 .../networking/assign POST 分配组网 IP 是 assignUserVmNetworking 无 .../networking/remove_network POST 移除组网网络 是 removeUserVmNetworkingNetwork 无 .../networking/delete DELETE 删除组网 是 deleteUserVmNetworking 无 八、总结 接口完整性 OpenAPI 定义的 68 个接口全部已在 src/api/admin/userVm.js 中实现，HTTP 方法和路径均一致，无缺失接口。 需要关注的潜在风险（按严重程度排序） 优先级 风险点 涉及位置 说明 状态 ✅高 user_goods/create 缺少 item_id UserGoodsList.vue 新增/编辑表单 已添加 item_id 归属项字段，普通商品直接赋值商品ID，云服务器弹出虚拟机列表选择 ✅已完成 ✅高 user_goods/list 缺少筛选参数 UserGoodsList.vue 已添加 user_id 和 good_id 筛选输入框，支持按用户ID和商品ID过滤 ✅已完成 ✅中 post_group/user_list 分页参数名不一致 UserVmSecurityGroupSelector.vue 前端调用处已正确使用 page_size 参数名 ✅已完成（无需修改） ✅中 Boolean 字段通过 FormData 传递 安全组 create/update/set_shared fd() 已增加 boolean 类型显式转换为 "true"/"false"；SecurityGroupDetail.vue 和 VmDetail.vue 手动 append 处也已修复 ✅已完成 ⚠️中 snapshot/list 和 backup/list 无分页 快照/备份相关页面 OpenAPI 未定义分页参数，如数据量大可能一次返回全部 ⚠️后端限制，待后端支持分页 ✅低 task_id 类型为 string 快照/备份进度查询 所有调用处已使用 String() 确保传字符串 ✅已完成（无需修改） ✅低 UserGoodsDetail.vue 基础价格显示用了 renewPrice UserGoodsDetail.vue 第 62 行 已修复为 basePrice ✅已完成 ✅低 fd() 过滤空字符串 userVm.js fd() 函数 已移除 v === '' 过滤条件，允许空字符串传递（用于清除字段） ✅已完成
第二阶段：功能开发与组件化审查结果
一、请求实现 ✅ OpenAPI 定义的 69 个接口（user_vm 64 + user_goods 5）全部在 src/api/admin/userVm.js 中实现 ✅ 商品管理 33 个接口全部在 src/api/admin/product.js 中实现（group 6 + goods 5 + spec 8 + plan 9 + group_tag 5） ✅ 无缺失接口
二、组件化拆分 已创建的公共组件：
| 组件 | 路径 | Props | 复用场景 |
|---|---|---|---|
| FormSelectorField | src/components/common/FormSelectorField.vue | modelValue, displayText, placeholder, buttonText, disabled, clearable, hint, hintType | 所有"只读输入框+选择按钮+清除按钮"的选择器行（50+处） |
已补充的工具函数（src/utils/tool.js）：
| 函数 | 用途 | 复用场景 |
|---|---|---|
| formatPrice(fen) | 分→元显示 ¥xx.xx | 25+个文件的价格展示 |
| yuanToFen(yuan) | 元→分转换 | 所有提交价格的表单 |
| formatExpireTime(t) | 到期时间格式化（<2000年显示永久） | 28+个文件 |
三、嵌套与快捷入口评估 ⚠️ ProductGroup.vue（3281行）是当前最大的单体文件，集中了 5 个 CRUD 模块和 11 个弹窗：
- 商品分组管理（树形/列表 + CRUD）
- 分组标签管理（列表 + CRUD）
- 商品表单（新增/编辑弹窗）
- 商品参数管理（参数列表 + 参数值管理 2级嵌套弹窗）
- 商品套餐管理（套餐列表 + 套餐表单 + 参数配置预览）
推荐拆分方案（待确认后执行）： ❌ ProductParameterManager.vue - 提取参数管理弹窗（参数列表+参数值管理+参数表单，约 300 行模板 + 400 行逻辑） ❌ ProductPlanManager.vue - 提取套餐管理弹窗（套餐列表+套餐表单+参数配置，约 250 行模板 + 500 行逻辑） ❌ GroupTagManager.vue - 提取分组标签Tab页（标签列表+标签表单，约 80 行模板 + 150 行逻辑） 拆分后 ProductGroup.vue 可从 3281 行降至约 1600 行
-----------------------------------------------------------------------------------------------需要解决
1.请求接口的带有page-size或者是count参数的都只能是10
2.每次解决后的内容写在-需要解决之间，不要写在外面
3.我不要你解释，不是我主动告诉你解释需求，那么你就根据问题开始直接编写代码解决问题或者完善功能，问题都是用-需要解决隔开的
4.涉及到表单，需要查看后端模型是不是JSON字符串或者数组，前端发送的是不是对应的JSON字符串或者数组，如果不同需要改为相同，前端提交的数据需要跟后端对应
5.涉及到表单时，需要检查后端模型字段类型。
6.前端提交的数据格式必须与后端对应：
后端模型为 JSON 字符串 → 前端需要 JSON.stringify() 后提交
后端模型为数组 → 前端需要提交 JSON 数组字符串
注意各项目 POST 请求默认 Content-Type 不同，可能需要手动调整
7.内存统一kb单位（展示是以Mb为单位），硬盘统一GB单位，流量统一MB单位（展示是以GB为单位），续费价格统一以分为单位（展示是以元为单位），基础价格统一以分为单位（展示是以元为单位）
8.开发的代码或者文件放在对应的文件模块，不要太乱
9.前端页面有问题或者不美观的也可以修改优化美化等
10.例如订单ID，套餐ID的这种都需要变为选择组件选择，里面是列表展示，并且带有分页，和刷新按钮
11.只需要修改我指定的位置，如果有关联使用的需要提前告知确认后再进行修改
管理员前端控制台：ApiServer-web-admin_dashboard_pc
网站首页前端：ApiServer-Web-home
用户前端控制台：ApiServer-web-user_dashboard_pc
移动端前端：ApiServer-Web-user_dashboard_pe---移动前端需要适配兼容微信小程序 H5 APP （安卓/IOS双端），注意分包大小
文档统计：全前端项目文档.md 全部项目涉及到硬编码配置的可以单独在一个文件进行配置然后进行调用（每个项目都有一个单独配置的文件） 开始编写代码完善项目 对应完成的部分在当前文档记录并且进行标记✅已完成、⚠️部分完成、❌未完成这样显示