From 73f7101e1dcff8fec1b1807af863aea5464ec4c7 Mon Sep 17 00:00:00 2001
From: TsMask <340112800@qq.com>
Date: Tue, 30 Jan 2024 21:23:10 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E7=9C=8B=E6=9D=BF=E7=94=A8=E6=88=B7?=
 =?UTF-8?q?=E8=A1=8C=E4=B8=BA=E5=AD=97=E5=85=B8=E6=95=B0=E6=8D=AE=E7=BF=BB?=
 =?UTF-8?q?=E8=AF=91?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/UserActivity/index.vue         | 88 ++++++++++++++-----
 .../overview/hooks/useUserActivity.ts         |  4 +-
 2 files changed, 67 insertions(+), 25 deletions(-)

diff --git a/src/views/dashboard/overview/components/UserActivity/index.vue b/src/views/dashboard/overview/components/UserActivity/index.vue
index 3836edf3..ed12601f 100644
--- a/src/views/dashboard/overview/components/UserActivity/index.vue
+++ b/src/views/dashboard/overview/components/UserActivity/index.vue
@@ -2,7 +2,50 @@
 import { parseDuration, parseDateToStr } from '@/utils/date-utils';
 import { eventData, eventId } from '../../hooks/useUserActivity';
 import useI18n from '@/hooks/useI18n';
+import useDictStore from '@/store/modules/dict';
+import { onMounted, reactive } from 'vue';
 const { t } = useI18n();
+const { getDict } = useDictStore();
+
+/**字典数据 */
+let dict: {
+  /**CDR SIP响应代码类别类型 */
+  cdrSipCode: DictType[];
+  /**CDR 呼叫类型 */
+  cdrCallType: DictType[];
+  /**UE 事件认证代码类型 */
+  ueAauthCode: DictType[];
+  /**UE 事件认证代码类型 */
+  ueEventType: DictType[];
+} = reactive({
+  cdrSipCode: [],
+  cdrCallType: [],
+  ueAauthCode: [],
+  ueEventType: [],
+});
+
+onMounted(() => {
+  // 初始字典数据
+  Promise.allSettled([
+    getDict('cdr_sip_code'),
+    getDict('cdr_call_type'),
+    getDict('ue_auth_code'),
+    getDict('ue_event_type'),
+  ]).then(resArr => {
+    if (resArr[0].status === 'fulfilled') {
+      dict.cdrSipCode = resArr[0].value;
+    }
+    if (resArr[1].status === 'fulfilled') {
+      dict.cdrCallType = resArr[1].value;
+    }
+    if (resArr[2].status === 'fulfilled') {
+      dict.ueAauthCode = resArr[2].value;
+    }
+    if (resArr[3].status === 'fulfilled') {
+      dict.ueEventType = resArr[3].value;
+    }
+  });
+});
 </script>
 
 <template>
@@ -17,12 +60,14 @@ const { t } = useI18n();
         <div class="card-cdr-item">
           <div>
             {{ t('views.dashboard.overview.userActivity.type') }}:
-            <span>{{ item.data.callType }}</span>
-          </div>
-          <div>
-            {{ t('views.dashboard.overview.userActivity.duration') }}:
-            <span>{{ parseDuration(item.data.callDuration) }}</span>
+            <span>
+              <DictTag
+                :options="dict.cdrCallType"
+                :value="item.data.callType"
+              />
+            </span>
           </div>
+          <div></div>
           <div>
             {{ t('views.dashboard.overview.userActivity.time') }}:
             <span>{{ parseDateToStr(item.data.releaseTime * 1000) }}</span>
@@ -38,10 +83,16 @@ const { t } = useI18n();
             <span>{{ item.data.calledParty }}</span>
           </div>
           <div>
-            {{ t('views.dashboard.overview.userActivity.result') }}:
-            <span>{{ item.data.cause }}</span>
+            {{ t('views.dashboard.overview.userActivity.duration') }}:
+            <span>{{ parseDuration(item.data.callDuration) }}</span>
           </div>
         </div>
+        <div>
+          {{ t('views.dashboard.overview.userActivity.result') }}:
+          <span>
+            <DictTag :options="dict.cdrSipCode" :value="item.data.cause" />
+          </span>
+        </div>
       </div>
       <!-- UE事件 -->
       <div
@@ -52,7 +103,9 @@ const { t } = useI18n();
         <div class="card-ue-item">
           <div>
             {{ t('views.dashboard.overview.userActivity.type') }}:
-            <span>{{ item.type }}</span>
+            <span>
+              <DictTag :options="dict.ueEventType" :value="item.type" />
+            </span>
           </div>
           <div>
             IMSI: <span>{{ item.data.imei }}</span>
@@ -82,16 +135,11 @@ const { t } = useI18n();
             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>
+          {{ t('views.dashboard.overview.userActivity.result') }}:
+          <span>
+            <DictTag :options="dict.ueAauthCode" :value="item.data.authCode" />
+          </span>
         </div>
         <div v-if="item.type === 'detach'">
           Message: <span>{{ item.data.detachResult }}</span>
@@ -100,9 +148,6 @@ const { t } = useI18n();
           <div>
             Status: <span>{{ item.data.status }}</span>
           </div>
-          <div>
-            OnlineNumber: <span>{{ item.data.onlineNumber }}</span>
-          </div>
         </div>
       </div>
     </template>
@@ -193,14 +238,12 @@ const { t } = useI18n();
 
 <style lang="less" scoped>
 .activty {
-  // background-color: rgb(253, 180, 180);
   overflow-x: hidden;
   overflow-y: auto;
   height: 94%;
   color: #61a8ff;
   font-size: 0.75rem;
   & .card-ue {
-    // background-color: rgb(185, 241, 168);
     border: 1px #61a8ff solid;
     border-radius: 4px;
     padding: 0.2rem 0.5rem;
@@ -228,7 +271,6 @@ const { t } = useI18n();
   }
 
   & .card-cdr {
-    // background-color: rgb(184, 168, 241);
     border: 1px #61a8ff solid;
     border-radius: 4px;
     padding: 0.2rem 0.5rem;
diff --git a/src/views/dashboard/overview/hooks/useUserActivity.ts b/src/views/dashboard/overview/hooks/useUserActivity.ts
index 3652edb4..29c47a35 100644
--- a/src/views/dashboard/overview/hooks/useUserActivity.ts
+++ b/src/views/dashboard/overview/hooks/useUserActivity.ts
@@ -22,7 +22,7 @@ export function ueEventParse(item: Record<string, any>) {
 
   return {
     eType: 'ue',
-    eId: `ue_${item.timestamp}`,
+    eId: `ue_${item.id}_${item.timestamp}`,
     id: item.id,
     type: item.eventType,
     data: evData,
@@ -52,7 +52,7 @@ export function cdrEventParse(item: Record<string, any>) {
 
   return {
     eType: 'cdr',
-    eId: `cdr_${item.timestamp}`,
+    eId: `cdr_${item.id}_${item.timestamp}`,
     id: item.id,
     data: evData,
   };