fix: 看板用户数切换展示

src/views/dashboard/overview/index.vue

@@ -104,16 +104,16 @@ function fnGetNeState() {
 /**获取概览信息 */
 async function fnGetSkim() {
   const neHandlers = new Map([
-    [
-      'UDM',
-      {
-        request: (neId: string) =>
-          listUDMSub({ neId: neId, pageNum: 1, pageSize: 1 }),
-        process: (res: any) =>
-          res.code === RESULT_CODE_SUCCESS &&
-          (skimState.udmSubNum += res.data.total),
-      },
-    ],
+    // [
+    //   'UDM',
+    //   {
+    //     request: (neId: string) =>
+    //       listUDMSub({ neId: neId, pageNum: 1, pageSize: 1 }),
+    //     process: (res: any) =>
+    //       res.code === RESULT_CODE_SUCCESS &&
+    //       (skimState.udmSubNum += res.data.total),
+    //   },
+    // ],
     [
       'SMF',
       {
@@ -206,6 +206,13 @@ async function fnGetSkim() {
       requests[index].process(result.value);
     }
   });
+
+  // UDM
+  listUDMSub({ neId: udmNeId.value, pageNum: 1, pageSize: 1 }).then(res => {
+    if (res.code === RESULT_CODE_SUCCESS) {
+      skimState.udmSubNum = res.data.total;
+    }
+  });
 }
 
 /**初始数据函数 */
@@ -261,6 +268,18 @@ function fnSelectNe(value: any, option: any) {
   // loadData();
 }
 
+let udmNeId = ref<string>('001');
+let udmOtions = ref<Record<string, any>[]>([]);
+/**用户数量-选择UDM */
+function fnSelectUDM(e: any) {
+  udmNeId.value = e.key;
+  listUDMSub({ neId: udmNeId.value, pageNum: 1, pageSize: 1 }).then(res => {
+    if (res.code === RESULT_CODE_SUCCESS) {
+      skimState.udmSubNum = res.data.total;
+    }
+  });
+}
+
 // 定义一个方法返回 views 容器
 const getPopupContainer = () => {
   // 使用 ref 或其他方式来引用你的 views 容器
@@ -275,19 +294,31 @@ onMounted(() => {
     .then(res => {
       if (res.code === RESULT_CODE_SUCCESS) {
         if (res.data.length > 0) {
+          // UPF
           let arr: Record<string, any>[] = [];
           res.data.forEach((v: any) => {
             if (v.neType === 'UPF') {
               arr.push({ value: v.neId, label: v.neName, rmUid: v.rmUid });
             }
           });
-
           neOtions.value = arr;
           if (arr.length > 0) {
             //queryParams.neRealId = arr[0].value;
             fnSelectNe(arr[0].value, arr[0]);
           }
 
+          // UDM
+          let arr1: Record<string, any>[] = [];
+          res.data.forEach((v: any) => {
+            if (v.neType === 'UDM') {
+              arr1.push({ value: v.neId, label: v.neName, rmUid: v.rmUid });
+            }
+          });
+          udmOtions.value = arr1;
+          if (arr1.length > 0) {
+            fnSelectUDM(arr1[0].value);
+          }
+
           // 过滤不可用的网元
           neCascaderOptions.value = neInfoStore.getNeCascaderOptions.filter(
             (item: any) => {
@@ -352,17 +383,28 @@ onBeforeUnmount(() => {
           <div class="data">
             <div
               class="item toRouter"
-              @click="fnToRouter('Sub_2010')"
               :title="t('views.dashboard.overview.toRouter')"
             >
-              <div>
+              <div @click="fnToRouter('Sub_2010')">
                 <UserOutlined
                   style="color: #4096ff; margin-right: 8px; font-size: 1.1rem"
                 />
                 {{ skimState.udmSubNum }}
               </div>
               <span>
-                {{ t('views.dashboard.overview.skim.users') }}
+                <a-dropdown :trigger="['click']">
+                  <div class="toDeep-text">
+                    {{ t('views.dashboard.overview.skim.users') }}
+                    <DownOutlined style="margin-left: 12px; font-size: 12px" />
+                  </div>
+                  <template #overlay>
+                    <a-menu @click="fnSelectUDM">
+                      <a-menu-item v-for="v in udmOtions" :key="v.value">
+                        {{ v.label }}
+                      </a-menu-item>
+                    </a-menu>
+                  </template>
+                </a-dropdown>
               </span>
             </div>
             <div
@@ -641,4 +683,15 @@ onBeforeUnmount(() => {
 .toDeep :deep(.ant-select-selection-item) {
   color: #fff;
 }
+
+.toDeep-text {
+  color: #4c9bfd !important;
+  font-size: 0.844rem !important;
+  position: relative !important;
+  line-height: 2rem !important;
+  white-space: nowrap !important;
+  text-align: start !important;
+  text-overflow: ellipsis !important;
+  overflow: hidden !important;
+}
 </style>