feat: SMF数据单位转换MB显示

src/utils/parse-utils.ts

@@ -192,17 +192,31 @@ export function parseSizeFromBits(bits: number | string): string {
 /**
  * 字节数转换单位
  * @param byte 字节Byte大小 64009540 = 512.08 MB
+ * @param unit 指定单位 B / KB / MB / GB / TB / PB / EB / ZB / YB
  * @returns xx B / KB / MB / GB / TB / PB / EB / ZB / YB
  */
-export function parseSizeFromByte(byte: number | string): string {
+export function parseSizeFromByte(
+  byte: number | string,
+  unit?: string
+): string {
   byte = Number(byte) || 0;
   if (byte <= 0) return '0 B';
   const units = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'];
-  const unitIndex = Math.floor(Math.log2(byte) / 10);
-  const unti = units[unitIndex];
+  let unitIndex = 0;
+  let unitStr = 'B';
+  if (unit) {
+    const index = units.indexOf(unit);
+    if (index > -1) {
+      unitIndex = index;
+      unitStr = unit;
+    }
+  } else {
+    unitIndex = Math.floor(Math.log2(byte) / 10);
+    unitStr = units[unitIndex];
+  }
   const value = byte / Math.pow(1000, unitIndex);
   if (unitIndex > 0) {
-    return `${value.toFixed(2)} ${unti}`;
+    return `${value.toFixed(2)} ${unitStr}`;
   }
-  return `${value} ${unti}`;
+  return `${value} ${unitStr}`;
 }

src/views/dashboard/smfCDR/index.vue

@@ -22,6 +22,7 @@ import saveAs from 'file-saver';
 import { listTenant } from '@/api/system/tenant';
 import dayjs, { Dayjs } from 'dayjs';
 import { useClipboard } from '@vueuse/core';
+import { parseSizeFromByte } from '@/utils/parse-utils';
 const { copy } = useClipboard({ legacy: true });
 const { t } = useI18n();
 const ws = new WS();
@@ -172,7 +173,7 @@ let tableColumns = ref<ColumnsType>([
           }
         }
       }
-      return dataVolumeUplink;
+      return parseSizeFromByte(dataVolumeUplink, 'MB');
     },
   },
   {
@@ -197,7 +198,7 @@ let tableColumns = ref<ColumnsType>([
           }
         }
       }
-      return dataVolumeDownlink;
+      return parseSizeFromByte(dataVolumeDownlink, 'MB');
     },
   },
   {
@@ -222,7 +223,7 @@ let tableColumns = ref<ColumnsType>([
           }
         }
       }
-      return dataTotalVolume;
+      return parseSizeFromByte(dataTotalVolume, 'MB');
     },
   },
   {
@@ -855,16 +856,16 @@ onBeforeUnmount(() => {
                   </strong> -->
                   <div>
                     <div>
-                      <span>Data Total Volume: </span>
-                      <span>{{ udata.dataTotalVolume }}</span>
+                      <span>Data Volume Uplink: </span>
+                      <span>{{ parseSizeFromByte(udata.dataVolumeUplink, 'MB') }}</span>
                     </div>
                     <div>
                       <span>Data Volume Downlink: </span>
-                      <span>{{ udata.dataVolumeDownlink }}</span>
+                      <span>{{ parseSizeFromByte(udata.dataVolumeDownlink, 'MB') }}</span>
                     </div>
                     <div>
-                      <span>Data Volume Uplink: </span>
-                      <span>{{ udata.dataVolumeUplink }}</span>
+                      <span>Data Total Volume: </span>
+                      <span>{{ parseSizeFromByte(udata.dataTotalVolume, 'MB') }}</span>
                     </div>
                     <!-- <div>
                       <span>Time: </span>

src/views/dashboard/smfCDRByIMSI/index.vue

@@ -69,8 +69,8 @@ const option = {
       } else {
         downlinkValue = params[1].value;
       }
-      const uplinkValueF = parseSizeFromByte(uplinkValue);
-      const downlinkValueF = parseSizeFromByte(downlinkValue);
+      const uplinkValueF = parseSizeFromByte(uplinkValue, 'MB');
+      const downlinkValueF = parseSizeFromByte(downlinkValue, 'MB');
       return `
       <div style="font-weight: bold;">${title}</div>
       <div>Downlink: ${downlinkValueF}</div>
@@ -466,8 +466,8 @@ function fnRanderChartDataUpdate() {
     downlinkTotal += dataVolumeDownlinkYSeriesData[index];
   }
   state.dataUsage = [
-    parseSizeFromByte(uplinkTotal),
-    parseSizeFromByte(downlinkTotal),
+    parseSizeFromByte(uplinkTotal, 'MB'),
+    parseSizeFromByte(downlinkTotal, 'MB'),
   ];
 }
 
@@ -684,7 +684,7 @@ onBeforeUnmount(() => {
       <!-- 图数据 -->
       <div ref="cdrChartDom" style="height: 600px; width: 100%"></div>
 
-      <a-descriptions title="Data Usage" bordered :column="2">
+      <a-descriptions title="Data Usage" bordered :column="2" style="width: 60%;">
         <a-descriptions-item label="Total Uplink">
           {{ state.dataUsage[0] }}
         </a-descriptions-item>