上下行统计以及转换单位

src/views/dashboard/overview/index.vue

@@ -9,15 +9,15 @@ import AlarnTypeBar from './components/AlarnTypeBar/index.vue';
 import UPFFlow from './components/UPFFlow/index.vue';
 import { listSub } from '@/api/neUser/sub';
 import { listUENum } from '@/api/neUser/ue';
-
+import { listUPFIndex } from '@/api/perfManage/goldTarget';
+import { listBase5G } from '@/api/neUser/base5G';
+import { formatBytes } from '@/utils/parse-utils';
 import { graphNodeClickID } from './hooks/useTopology';
 import { useFullscreen } from '@vueuse/core';
 import useAppStore from '@/store/modules/app';
 const appStore = useAppStore();
 const { t } = useI18n();
 
-// let subNum = ref<number>(0);
-
 /**用户在线信息 */
 let onlineInfo: {
   /**签约用户数量 */
@@ -35,6 +35,17 @@ let onlineInfo: {
   activeAlarmSeverity: [],
 });
 
+/**用户在线信息 */
+let upfFlowInfo: {
+  /**上行字节数 */
+  up: number;
+  /**下行字节数 */
+  down: any;
+} = reactive({
+  up: 0,
+  down: 0,
+});
+
 /**总览节点 */
 const viewportDom = ref<HTMLElement | null>(null);
 const { isFullscreen, toggle } = useFullscreen(viewportDom);
@@ -48,16 +59,28 @@ onMounted(() => {
       pageNum: '1',
       pageSize: '20',
     }),
- //    listUENum('001'),
+    listUPFIndex(),
+    listUENum('001'),
   ]).then(resArr => {
-    console.log(resArr)
     if (resArr[0].status === 'fulfilled') {
-      onlineInfo.subNum=resArr[0].value.total;
+      onlineInfo.subNum = resArr[0].value.total;
+    }
+    if (resArr[1].status === 'fulfilled') {
+      resArr[1].value['data'].map((item: any) => {
+        switch (item.kpiId) {
+          case 'UPF.03':
+            upfFlowInfo.up = item.Total;
+            break;
+          case 'UPF.06':
+            upfFlowInfo.down = item.Total;
+        }
+      });
+    }
+
+    if (resArr[2].status === 'fulfilled') {
+      console.log(resArr)
+     
     }
-    // if (resArr[1].status === 'fulfilled') {
-    //   console.log(resArr[1].value)
-    //   onlineInfo.ueNum=resArr[1].value.data?.ueNum;
-    // }
   });
 });
 </script>
@@ -78,7 +101,7 @@ onMounted(() => {
       <div class="overview panel">
         <div class="inner">
           <div class="item">
-            <h4>{{onlineInfo.subNum}}</h4>
+            <h4>{{ onlineInfo.subNum }}</h4>
             <span>
               <UserOutlined style="color: #006cff" />
               签约用户
@@ -157,20 +180,20 @@ onMounted(() => {
           <!-- 筛选 -->
           <div class="filter">
             <span data-key="1" class="active">24小时</span>
-            <span data-key="7">7天</span>
-            <span data-key="30">30天</span>
+            <!-- <span data-key="7">7天</span>
+            <span data-key="30">30天</span> -->
           </div>
           <!-- 数据 -->
           <div class="data">
             <div class="item">
-              <h4>20,301 TB</h4>
+              <h4>{{formatBytes(upfFlowInfo.up)}} </h4>
               <span>
                 <ArrowUpOutlined style="color: #ed3f35" />
                 上行
               </span>
             </div>
             <div class="item">
-              <h4>99834 TB</h4>
+              <h4>{{formatBytes(upfFlowInfo.down)}} </h4>
               <span>
                 <ArrowDownOutlined style="color: #eacf19" />
                 下行