shiran
e38ea4cc32
缘由：上次（802eaa3）我把概览"流量上限"的"修改"按钮挂到旧 update_traffic 接口
（兼容字段 traffic_max），与 docs/2026.05.08.12.37-add.json 中真正的流量策略接口
（traffic_policy/update + add_fixed + add_temporary）路径错位；同时 vm 详情返回
已新增 traffic_max_mb / temporary_traffic_mb / temporary_cycle_start / traffic_used /
traffic_exhausted_rx_mbps / traffic_exhausted_tx_mbps 等字段，概览未体现。
修改：
- UserVmDetail.vue & VmDetail.vue 概览将"流量上限"单值 cell 改为分段展示：
主行 已用/总量；副行 基础 + 临时（含周期起始日期）；按钮组「修改」「加临时」。
- 主行/副行字段来源 add.json 新字段，旧 traffic_max 仅作 fallback。
- 「修改」按钮改挂 openTrafficPolicyDialog / openVmTrafficPolicyDialog
（对应 user_vm/traffic_policy/update 与 host_service/point/vm/traffic_policy/update）；
「加临时」直达 openAddTrafficDialog('temporary') / openVmAddTrafficDialog('temporary')。
- openTrafficPolicyDialog / openVmTrafficPolicyDialog 增加 vm / detail 字段 fallback，
并在 trafficPolicy 未加载时异步触发 loadTrafficPolicy，避免懒加载导致初值全 0。
- 新增 formatTrafficMb helper（VmDetail.vue）处理 MB 自适应单位、对 0 友好输出。
- 新增 .traffic-cell 系列样式。
预期：
- 详情概览能直接看到 总/已用/基础/临时/周期 五个关键信息。
- 概览"修改"走 add.json 中的新流量策略接口，与"流量策略" tab 行为一致。
- 旧 dropdown 中"修改带宽"路径保留（不删除），用于纯带宽场景。
未测试：admin_dashboard_pc 本地 HMR 已更新，无编译/控制台报错。新流量策略接口与
真实 vm.value 字段填充尚需联调验证（特别是 traffic_used 单位假设为 MB，若实际为
字节需调整 formatTraffic / detailTrafficUsedMb 的换算）。
Co-authored-by: Cursor <cursoragent@cursor.com>
管理员后台pc端
007UI 后台管理系统
一个基于Vue 3、Element Plus的现代化后台管理系统模板，采用蓝色扁平化高端设计风格。
技术栈
- 前端框架：Vue 3
- 构建工具：Vite
- UI组件库：Element Plus
- 路由管理：Vue Router
- HTTP请求：Axios
- 图表库：ECharts
- 实用工具：VueUse
特性
- 🎨 精美的蓝色扁平化UI设计风格
- 📱 响应式布局，支持多端设备
- 🧩 模块化设计，易于扩展
- 🔐 内置完整的权限管理系统
- 📊 集成数据可视化图表
- 📝 丰富的表单组件和数据表格
- 🌐 全局状态管理
- 🚀 快速的开发体验
快速开始
确保已安装Node.js和pnpm包管理器。
# 克隆项目
git clone https://github.com/yourusername/007ui.git
# 进入项目目录
cd 007ui
# 安装依赖
pnpm install
# 启动开发服务器
pnpm dev
项目结构
007ui/
├── public/ # 静态资源
├── src/ # 源代码
│ ├── assets/ # 资源文件
│ ├── components/ # 公共组件
│ │ └── layout/ # 布局组件
│ ├── router/ # 路由配置
│ ├── utils/ # 工具函数
│ ├── views/ # 页面组件
│ ├── App.vue # 应用入口组件
│ ├── main.js # 应用入口文件
│ └── style.css # 全局样式
├── .gitignore # Git忽略文件
├── index.html # HTML模板
├── package.json # 项目配置
├── README.md # 项目说明
└── vite.config.js # Vite配置
布局和页面
- 登录页：简洁美观的登录界面
- 主布局：包含侧边栏、顶部导航和内容区
- 仪表盘：数据概览和图表展示
- 系统管理：用户、角色、权限管理
- 内容管理：文章、分类、标签管理
- 数据统计：访问统计、性能监控
贡献
欢迎提交问题和功能请求。对于重大更改，请先开启一个issue讨论您想要的更改。