fix: 虚流量进度条

openspec/changes/update-asset-virtual-traffic-progress-denominator/proposal.md

@@ -0,0 +1,25 @@
+# Change: 更新资产信息虚流量进度条计算口径
+
+## Why
+
+资产信息页在管理员双区块流量视图中会分别展示“真流量使用”和“虚流量使用”。当前“虚流量使用”的进度条需要明确以“虚流量已用 / 真流量总量”为口径，避免使用停机阈值或虚流量总量作为分母导致展示比例与业务认知不一致。
+
+该口径需要同时作用于“当前生效套餐”和“套餐列表”，保证同一资产下不同套餐展示区域的虚流量进度一致。
+
+## What Changes
+
+- 资产信息页“当前生效套餐”的“虚流量使用”进度条 MUST 按 `virtual_used_mb / real_total_mb` 计算百分比。
+- 资产信息页“套餐列表”中每条套餐记录的“虚流量使用”进度条 MUST 按 `virtual_used_mb / real_total_mb` 计算百分比。
+- “虚流量使用”的数值文案可以继续展示已用虚流量与停机阈值/虚流量阈值信息，但进度条分母 MUST 使用真流量总量。
+- 当 `real_total_mb` 为空、缺失或小于等于 0 时，进度条 MUST 稳定显示为 0%，不得出现 `NaN`、`Infinity` 或渲染异常。
+- 本次变更不修改后端接口字段契约。
+
+## Impact
+
+- Affected specs:
+  - `asset-package-traffic-display`
+- Affected code:
+  - `src/views/asset-management/asset-information/components/CurrentPackageCard.vue`
+  - `src/views/asset-management/asset-information/components/PackageListCard.vue`
+- Dependencies:
+  - 继续使用现有套餐流量字段：`virtual_used_mb`、`real_total_mb`、`virtual_total_mb`

openspec/changes/update-asset-virtual-traffic-progress-denominator/specs/asset-package-traffic-display/spec.md

@@ -0,0 +1,45 @@
+## ADDED Requirements
+
+### Requirement: Asset Virtual Traffic Progress Uses Real Total
+
+The asset information page SHALL calculate the `虚流量使用` progress percentage with `virtual_used_mb / real_total_mb` in both the `当前生效套餐` card and the `套餐列表` package rows.
+
+The progress bar denominator MUST be `real_total_mb` even when the display text also shows `virtual_total_mb`, stop threshold, or other virtual traffic threshold values.
+
+When `real_total_mb` is missing, empty, or less than or equal to zero, the progress percentage MUST be treated as `0` and MUST NOT render `NaN`, `Infinity`, or a broken progress bar.
+
+#### Scenario: Current package virtual progress uses real total
+
+- **GIVEN** 用户正在资产信息页查看 `当前生效套餐`
+- **AND** 当前套餐的 `virtual_used_mb` 为 `20`
+- **AND** 当前套餐的 `real_total_mb` 为 `100`
+- **WHEN** 页面渲染 `虚流量使用` 进度条
+- **THEN** 进度条百分比 MUST 按 `20 / 100` 计算
+- **AND** 进度条 MUST 显示为 `20%`
+
+#### Scenario: Package list virtual progress uses real total
+
+- **GIVEN** 用户正在资产信息页查看 `套餐列表`
+- **AND** 某条套餐记录的 `virtual_used_mb` 为 `20`
+- **AND** 该记录的 `real_total_mb` 为 `100`
+- **WHEN** 页面渲染该记录的 `虚流量使用` 进度条
+- **THEN** 进度条百分比 MUST 按 `20 / 100` 计算
+- **AND** 进度条 MUST 显示为 `20%`
+
+#### Scenario: Virtual threshold does not control progress denominator
+
+- **GIVEN** `虚流量使用` 展示区域同时展示停机阈值或 `virtual_total_mb`
+- **AND** `virtual_used_mb` 为 `20`
+- **AND** `real_total_mb` 为 `100`
+- **AND** `virtual_total_mb` 为 `50`
+- **WHEN** 页面渲染 `虚流量使用` 进度条
+- **THEN** 进度条百分比 MUST 按 `virtual_used_mb / real_total_mb` 计算
+- **AND** 进度条 MUST NOT 按 `virtual_used_mb / virtual_total_mb` 计算
+
+#### Scenario: Missing or zero real total renders stable zero progress
+
+- **GIVEN** `虚流量使用` 展示区域需要渲染进度条
+- **AND** `real_total_mb` 缺失、为空或小于等于 `0`
+- **WHEN** 页面计算虚流量进度条百分比
+- **THEN** 进度条百分比 MUST 为 `0`
+- **AND** 页面 MUST NOT 显示 `NaN`、`Infinity` 或发生渲染异常

openspec/changes/update-asset-virtual-traffic-progress-denominator/tasks.md

@@ -0,0 +1,13 @@
+## 1. Implementation
+
+- [x] 1.1 调整“当前生效套餐”中“虚流量使用”进度条百分比为 `virtual_used_mb / real_total_mb`
+- [x] 1.2 调整“套餐列表”中每条记录“虚流量使用”进度条百分比为 `virtual_used_mb / real_total_mb`
+- [x] 1.3 保留现有虚流量已用、停机阈值/虚流量阈值等展示文案，不改变后端字段契约
+- [x] 1.4 为 `real_total_mb` 为空、缺失或小于等于 0 的情况提供稳定 0% 展示
+
+## 2. Verification
+
+- [x] 2.1 验证“当前生效套餐”中虚流量已用为 20、真流量总量为 100 时，虚流量进度条显示 20%
+- [x] 2.2 验证“套餐列表”中虚流量已用为 20、真流量总量为 100 时，虚流量进度条显示 20%
+- [x] 2.3 验证停机阈值/虚流量阈值不同于真流量总量时，虚流量进度条仍使用真流量总量作为分母
+- [x] 2.4 验证真流量总量缺失或为 0 时，虚流量进度条稳定显示 0% 且页面无异常

src/views/asset-management/asset-information/components/CurrentPackageCard.vue

@@ -102,14 +102,14 @@
                     :percentage="
                       getUsageProgress(
                         currentPackage.virtual_used_mb || 0,
-                        currentPackage.virtual_total_mb || 0
+                        currentPackage.real_total_mb || 0
                       )
                     "
                     :color="
                       getProgressColorByPercentage(
                         getUsageProgress(
                           currentPackage.virtual_used_mb || 0,
-                          currentPackage.virtual_total_mb || 0
+                          currentPackage.real_total_mb || 0
                         )
                       )
                     "
@@ -131,7 +131,7 @@
                     formatProgressPercentage(
                       getUsageProgress(
                         currentPackage.virtual_used_mb || 0,
-                        currentPackage.virtual_total_mb || 0
+                        currentPackage.real_total_mb || 0
                       )
                     )
                   }}

src/views/asset-management/asset-information/components/PackageListCard.vue

@@ -112,14 +112,14 @@
                         :percentage="
                           getUsageProgress(
                             scope.row.virtual_used_mb || 0,
-                            scope.row.virtual_total_mb || 0
+                            scope.row.real_total_mb || 0
                           )
                         "
                         :color="
                           getProgressColorByPercentage(
                             getUsageProgress(
                               scope.row.virtual_used_mb || 0,
-                              scope.row.virtual_total_mb || 0
+                              scope.row.real_total_mb || 0
                             )
                           )
                         "
@@ -140,7 +140,7 @@
                         formatProgressPercentage(
                           getUsageProgress(
                             scope.row.virtual_used_mb || 0,
-                            scope.row.virtual_total_mb || 0
+                            scope.row.real_total_mb || 0
                           )
                         )
                       }}
@@ -380,11 +380,6 @@
     emit('showDailyRecords', { packageRow })
   }
 
-  // 显示流量详单
-  const handleShowDailyRecords = (packageRow: PackageInfo) => {
-    emit('showDailyRecords', { packageRow })
-  }
-
   // 点击订单号
   const handleOrderNoClick = (packageRow: PackageInfo) => {
     if (!hasAuth('order:package_list_detail')) {