From 7cc1af269beb3a3f2ab40002d96ea6c3a3e0ed00 Mon Sep 17 00:00:00 2001
From: zhongzm <zhongzm@agt.com>
Date: Wed, 25 Dec 2024 19:55:12 +0800
Subject: [PATCH] =?UTF-8?q?fix:=E5=A5=97=E9=A4=90=E6=B5=81=E9=87=8F?=
 =?UTF-8?q?=E8=AE=A1=E7=AE=97=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/home/modules/line-chart.vue | 53 ++++++++++++++++-----------
 1 file changed, 32 insertions(+), 21 deletions(-)

diff --git a/src/views/home/modules/line-chart.vue b/src/views/home/modules/line-chart.vue
index 0794101..e34aa6e 100644
--- a/src/views/home/modules/line-chart.vue
+++ b/src/views/home/modules/line-chart.vue
@@ -5,8 +5,6 @@ import { fetchPackageList, submitOrder } from '@/service/api/auth';
 import { message } from 'ant-design-vue';
 
 const { t } = useI18n();
-// 注入更新仪表盘的方法
-const updateDashboard = inject('updateDashboard') as () => Promise<void>;
 
 interface PackageOption {
   id: string;
@@ -48,25 +46,35 @@ const formatValidityPeriod = (num: number, type: number): string => {
 };
 
 // 流量单位转换函数
-const formatTraffic = (trafficKB: number): string => {
-  const KB_TO_MB = 1024;
-  const KB_TO_GB = 1024 * 1024;
-  const KB_TO_TB = 1024 * 1024 * 1024;
+const formatTraffic = (bytes: number): string => {
+  // 处理 0 值、undefined 或 null 的情况
+  if (!bytes || bytes === 0) {
+    return '0B';
+  }
 
-  if (trafficKB >= KB_TO_TB) {
-    // KB -> TB (除以 1024^3)
-    return `${(trafficKB / KB_TO_TB).toFixed(2)}TB`;
+  const B_TO_KB = 1024;
+  const B_TO_MB = 1024 * 1024;
+  const B_TO_GB = 1024 * 1024 * 1024;
+  const B_TO_TB = 1024 * 1024 * 1024 * 1024;
+
+  if (bytes >= B_TO_TB) {
+    // B -> TB
+    return `${(bytes / B_TO_TB).toFixed(2)}TB`;
   }
-  if (trafficKB >= KB_TO_GB) {
-    // KB -> GB (除以 1024^2)
-    return `${(trafficKB / KB_TO_GB).toFixed(2)}GB`;
+  if (bytes >= B_TO_GB) {
+    // B -> GB
+    return `${(bytes / B_TO_GB).toFixed(2)}GB`;
   }
-  if (trafficKB >= KB_TO_MB) {
-    // KB -> MB (除以 1024)
-    return `${(trafficKB / KB_TO_MB).toFixed(2)}MB`;
+  if (bytes >= B_TO_MB) {
+    // B -> MB
+    return `${(bytes / B_TO_MB).toFixed(2)}MB`;
   }
-  // 小于1MB的情况，保持KB单位
-  return `${trafficKB.toFixed(2)}KB`;
+  if (bytes >= B_TO_KB) {
+    // B -> KB
+    return `${(bytes / B_TO_KB).toFixed(2)}KB`;
+  }
+  // 小于1KB的情况，保持B单位
+  return `${bytes.toFixed(2)}B`;
 };
 
 const packageOptions = ref<PackageOption[]>([]);
@@ -121,7 +129,10 @@ const selectPackage = (option: PackageOption) => {
   selectedPackage.value = option;
 };
 
-// 添加办理套餐的方法
+// 注入更新仪表盘的方法
+const updateDashboard = inject('updateDashboard') as () => Promise<void>;
+
+// 修改套餐办理方法
 const handleSubmitOrder = async () => {
   try {
     await submitOrder({
@@ -129,7 +140,7 @@ const handleSubmitOrder = async () => {
       packageId: selectedPackage.value.id
     });
     message.success('套餐办理成功！');
-    // 更新仪表盘数据
+    // 更新��表盘数据
     await updateDashboard();
   } catch (error) {
     message.error('套餐办理失败，请重试！');
@@ -149,12 +160,12 @@ onMounted(async () => {
       <div class="price">
         <span class="currency">¥</span>
         <span class="amount">{{ selectedPackage.price }}</span>
-        <span class="period"></span>
+        <span class="period">/月</span>
       </div>
       <div class="subtitle">{{ selectedPackage.packageName }}</div>
     </div>
 
-    <!-- 套餐选项 -->
+    <!-- 套餐选择 -->
     <div class="package-options">
       <h3 class="section-title">{{ t('page.setmeal.changablelevel') }}</h3>
       <div class="options-grid">