From ba8bd5c015d6943f1fb12ae74c82b0afd1ce1e21 Mon Sep 17 00:00:00 2001
From: TsMask <340112800@qq.com>
Date: Tue, 30 Jan 2024 18:25:43 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E7=9C=8B=E6=9D=BF=E9=80=9A=E8=AF=9D?=
 =?UTF-8?q?=E6=97=B6=E9=95=BF=E6=A0=BC=E5=BC=8F=E5=8C=96hms?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/utils/date-utils.ts                       |  8 +--
 .../components/UserActivity/index.vue         | 63 ++++++++++++++-----
 2 files changed, 51 insertions(+), 20 deletions(-)

diff --git a/src/utils/date-utils.ts b/src/utils/date-utils.ts
index c82d78d4..eb84e7b0 100644
--- a/src/utils/date-utils.ts
+++ b/src/utils/date-utils.ts
@@ -80,10 +80,10 @@ export function diffValue(
  */
 export function parseDuration(seconds: number | string) {
   seconds = Number(seconds) || 0;
-  const duration = dayjs().startOf('day').subtract(seconds, 'seconds');
-  const secondsLeft = duration.format('s');
-  const minutes = duration.format('m');
-  const hours = duration.format('H');
+  const duration = new Date(seconds * 1000);
+  const hours = duration.getUTCHours();
+  const minutes = duration.getUTCMinutes();
+  const secondsLeft = duration.getUTCSeconds(); 
   if (+hours > 0) {
     return `${hours}h${minutes}m${secondsLeft}s`;
   }
diff --git a/src/views/dashboard/overview/components/UserActivity/index.vue b/src/views/dashboard/overview/components/UserActivity/index.vue
index b531a2ae..3836edf3 100644
--- a/src/views/dashboard/overview/components/UserActivity/index.vue
+++ b/src/views/dashboard/overview/components/UserActivity/index.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { parseDuration } from '@/utils/date-utils';
+import { parseDuration, parseDateToStr } from '@/utils/date-utils';
 import { eventData, eventId } from '../../hooks/useUserActivity';
 import useI18n from '@/hooks/useI18n';
 const { t } = useI18n();
@@ -8,6 +8,7 @@ const { t } = useI18n();
 <template>
   <div class="activty">
     <template v-for="item in eventData" :key="item.eId">
+      <!-- CDR事件 -->
       <div
         class="card-cdr"
         :class="{ active: item.eId === eventId }"
@@ -15,29 +16,34 @@ const { t } = useI18n();
       >
         <div class="card-cdr-item">
           <div>
-            {{ t('views.dashboard.overview.userActivity.type') }}: 
+            {{ t('views.dashboard.overview.userActivity.type') }}:
             <span>{{ item.data.callType }}</span>
           </div>
           <div>
-            {{ t('views.dashboard.overview.userActivity.duration') }}: 
+            {{ t('views.dashboard.overview.userActivity.duration') }}:
             <span>{{ parseDuration(item.data.callDuration) }}</span>
           </div>
+          <div>
+            {{ t('views.dashboard.overview.userActivity.time') }}:
+            <span>{{ parseDateToStr(item.data.releaseTime * 1000) }}</span>
+          </div>
         </div>
         <div class="card-cdr-item">
           <div>
-            {{ t('views.dashboard.overview.userActivity.caller') }}: 
+            {{ t('views.dashboard.overview.userActivity.caller') }}:
             <span>{{ item.data.callerParty }}</span>
           </div>
           <div>
-            {{ t('views.dashboard.overview.userActivity.called') }}: 
+            {{ t('views.dashboard.overview.userActivity.called') }}:
             <span>{{ item.data.calledParty }}</span>
           </div>
-        </div>
-        <div>
-          {{ t('views.dashboard.overview.userActivity.result') }}: 
-          <span>{{ item.data.cause }}</span>
+          <div>
+            {{ t('views.dashboard.overview.userActivity.result') }}:
+            <span>{{ item.data.cause }}</span>
+          </div>
         </div>
       </div>
+      <!-- UE事件 -->
       <div
         class="card-ue"
         :class="{ active: item.eId === eventId }"
@@ -45,11 +51,14 @@ const { t } = useI18n();
       >
         <div class="card-ue-item">
           <div>
-            {{ t('views.dashboard.overview.userActivity.type') }}: 
+            {{ t('views.dashboard.overview.userActivity.type') }}:
             <span>{{ item.type }}</span>
           </div>
           <div>
-            {{ t('views.dashboard.overview.userActivity.time') }}: 
+            IMSI: <span>{{ item.data.imei }}</span>
+          </div>
+          <div>
+            {{ t('views.dashboard.overview.userActivity.time') }}:
             <span v-if="item.type === 'auth-result'">
               {{ item.data.authTime }}
             </span>
@@ -61,8 +70,8 @@ const { t } = useI18n();
             </span>
           </div>
         </div>
-        <div>IMSI: <span>{{ item.data.imei }}</span></div>
-        <div class="card-ue-auth" v-if="item.type === 'auth-result'">
+
+        <div class="card-ue-w33" v-if="item.type === 'auth-result'">
           <div>
             GNB ID: <span>{{ item.data.gNBID }}</span>
           </div>
@@ -70,7 +79,29 @@ const { t } = useI18n();
             Cell ID: <span>{{ item.data.cellID }}</span>
           </div>
           <div>
-            Tac ID: <span>{{ item.data.tacID }}</span>
+            TAC ID: <span>{{ item.data.tacID }}</span>
+          </div>
+        </div>
+        <div class="card-ue-w33" v-if="item.type === 'auth-result'">
+          <div>
+            Code: <span>{{ item.data.authCode }}</span>
+          </div>
+          <div>
+            OnlineNumber: <span>{{ item.data.onlineNumber }}</span>
+          </div>
+        </div>
+        <div v-if="item.type === 'auth-result'">
+          Message: <span>{{ item.data.authMessage }}</span>
+        </div>
+        <div v-if="item.type === 'detach'">
+          Message: <span>{{ item.data.detachResult }}</span>
+        </div>
+        <div class="card-ue-w33" v-if="item.type === 'cm-state'">
+          <div>
+            Status: <span>{{ item.data.status }}</span>
+          </div>
+          <div>
+            OnlineNumber: <span>{{ item.data.onlineNumber }}</span>
           </div>
         </div>
       </div>
@@ -186,7 +217,7 @@ const { t } = useI18n();
         width: 50%;
       }
     }
-    &-auth {
+    &-w33 {
       display: flex;
       flex-direction: row;
       justify-content: flex-start;
@@ -211,7 +242,7 @@ const { t } = useI18n();
       flex-direction: row;
       justify-content: flex-start;
       & > div {
-        width: 50%;
+        flex: 1;
       }
     }
   }