fix: KPI接收指定对应neId，实时数据不支持搜索

src/views/perfManage/goldTarget/index.vue

@@ -254,15 +254,7 @@ function fnGetListTitle() {
     .then(res => {
       if (res.code === RESULT_CODE_SUCCESS && Array.isArray(res.data)) {
         tableColumns.value = [];
-        const columns: ColumnsType = [
+        const columns: ColumnsType = [];
-          {
-            title: t('views.perfManage.perfData.neName'),
-            dataIndex: 'neName',
-            key: 'neName',
-            align: 'left',
-            width: 100,
-          },
-        ];
         for (const item of res.data) {
           const kpiDisplay = item[`${language}Title`];
           const kpiValue = item[`kpiId`];
@@ -277,6 +269,13 @@ function fnGetListTitle() {
             maxWidth: 300,
           });
         }
+        columns.push({
+          title: t('views.perfManage.perfData.neName'),
+          dataIndex: 'neName',
+          key: 'neName',
+          align: 'left',
+          width: 100,
+        });
         columns.push({
           title: t('views.perfManage.goldTarget.time'),
           dataIndex: 'timeGroup',
@@ -458,7 +457,7 @@ function fnRanderChartData() {
   }
 
   for (const item of orgData) {
-    chartDataXAxisData.push(item['timeGroup']);
+    chartDataXAxisData.push(parseDateToStr(+item['timeGroup']));
     const keys = Object.keys(item);
     for (const y of chartDataYSeriesData) {
       for (const key of keys) {
@@ -505,21 +504,23 @@ function fnLegendSelected(bool: any) {
 /**图表实时统计 */
 function fnRealTimeSwitch(bool: any) {
   if (bool) {
+    tableState.seached = false;
     // 建立链接
     const options: OptionsType = {
       url: '/ws',
       params: {
         /**订阅通道组
          *
-         * 指标(GroupID:10)
+         * 指标(GroupID:10_neType_neId)
          */
-        subGroupID: '10',
+        subGroupID: `10_${queryParams.neType}_${queryParams.neId}`,
       },
       onmessage: wsMessage,
       onerror: wsError,
     };
     ws.connect(options);
   } else {
+    tableState.seached = true;
     ws.close();
   }
 }
@@ -543,39 +544,40 @@ function wsMessage(res: Record<string, any>) {
     return;
   }
   // kpiEvent 黄金指标指标事件
-  if (data.groupId === '10') {
+  const kpiEvent = data.data;
-    const kpiEvent = data.data;
+  tableState.data.unshift(kpiEvent);
-    // 非对应网元类型
+  tablePagination.total++;
-    if (kpiEvent.neType !== queryParams.neType) return;
 
-    for (const key of Object.keys(data.data)) {
+  // 非对应网元类型
-      const v = kpiEvent[key];
+  if (kpiEvent.neType !== queryParams.neType) return;
-      // x轴
+
-      if (key === 'timeGroup') {
+  for (const key of Object.keys(data.data)) {
-        // chartDataXAxisData.shift();
+    const v = kpiEvent[key];
-        chartDataXAxisData.push(v);
+    // x轴
-        continue;
+    if (key === 'timeGroup') {
-      }
+      // chartDataXAxisData.shift();
-      // y轴
+      chartDataXAxisData.push(parseDateToStr(+v));
-      const yItem = chartDataYSeriesData.find(item => item.key === key);
+      continue;
-      if (yItem) {
+    }
-        // yItem.data.shift();
+    // y轴
-        yItem.data.push(v);
+    const yItem = chartDataYSeriesData.find(item => item.key === key);
-      }
+    if (yItem) {
+      // yItem.data.shift();
+      yItem.data.push(+v);
     }
-
-    // 绘制图数据
-    kpiChart.value.setOption({
-      xAxis: {
-        data: chartDataXAxisData,
-      },
-      series: chartDataYSeriesData,
-    });
   }
+
+  // 绘制图数据
+  kpiChart.value.setOption({
+    xAxis: {
+      data: chartDataXAxisData,
+    },
+    series: chartDataYSeriesData,
+  });
 }
 
 onMounted(() => {
-  // 目前支持的 AMF AUSF MME MOCNGW NSSF SMF UDM UPF
+  // 目前支持的 AMF AUSF MME MOCNGW NSSF SMF UDM UPF PCF
   // 获取网元网元列表
   neInfoStore.fnNelist().then(res => {
     if (res.code === RESULT_CODE_SUCCESS && Array.isArray(res.data)) {
@@ -583,15 +585,9 @@ onMounted(() => {
         // 过滤不可用的网元
         neCascaderOptions.value = neInfoStore.getNeCascaderOptions.filter(
           (item: any) => {
-            return ![
+            return !['OMC', 'NSSF', 'NEF', 'NRF', 'LMF', 'N3IWF'].includes(
-              'OMC',
+              item.value
-              'PCF',
+            );
-              'NSSF',
-              'NEF',
-              'NRF',
-              'LMF',
-              'N3IWF',
-            ].includes(item.value);
           }
         );
         if (neCascaderOptions.value.length === 0) {
@@ -619,9 +615,9 @@ onMounted(() => {
         // 查询当前小时
         const nowDate: Date = new Date();
         nowDate.setMinutes(0, 0, 0);
-        queryRangePicker.value[0] = parseDateToStr(nowDate);
+        queryRangePicker.value[0] = `${nowDate.getTime()}`;
         nowDate.setMinutes(59, 59, 59);
-        queryRangePicker.value[1] = parseDateToStr(nowDate);
+        queryRangePicker.value[1] = `${nowDate.getTime()}`;
         fnGetListTitle();
         // 绘图
         fnRanderChart();
@@ -666,15 +662,17 @@ onBeforeUnmount(() => {
           <a-col :lg="10" :md="12" :xs="24">
             <a-form-item
               :label="t('views.perfManage.goldTarget.timeFrame')"
-              name="eventTime"
+              name="timeFrame"
             >
               <a-range-picker
                 v-model:value="queryRangePicker"
-                value-format="YYYY-MM-DD HH:mm:ss"
+                bordered
-                format="YYYY-MM-DD HH:mm:ss"
                 :allow-clear="false"
-                show-time
+                :show-time="{ format: 'HH:mm:ss' }"
-              />
+                format="YYYY-MM-DD HH:mm:ss"
+                value-format="x"
+                style="width: 100%"
+              ></a-range-picker>
             </a-form-item>
           </a-col>
           <a-col :lg="4" :md="12" :xs="24">
@@ -747,15 +745,6 @@ onBeforeUnmount(() => {
       <!-- 插槽-卡片右侧 -->
       <template #extra>
         <a-space :size="8" align="center" v-show="tableState.showTable">
-          <a-tooltip>
-            <template #title>{{ t('common.searchBarText') }}</template>
-            <a-switch
-              v-model:checked="tableState.seached"
-              :checked-children="t('common.switch.show')"
-              :un-checked-children="t('common.switch.hide')"
-              size="small"
-            />
-          </a-tooltip>
           <a-tooltip>
             <template #title>{{ t('common.reloadText') }}</template>
             <a-button type="text" @click.prevent="fnGetList()">
@@ -833,11 +822,16 @@ onBeforeUnmount(() => {
         :data-source="tableState.data"
         :size="tableState.size"
         :pagination="tablePagination"
-        :scroll="{ x: tableColumnsDnd.length * 200, y: 450 }"
+        :scroll="{ x: tableColumnsDnd.length * 200, y: 'calc(100vh - 480px)' }"
         @resizeColumn="(w:number, col:any) => (col.width = w)"
         :show-expand-column="false"
         @change="fnTableChange"
       >
+        <template #bodyCell="{ column, record }">
+          <template v-if="column.key === 'timeGroup'">
+            {{ parseDateToStr(+record.timeGroup) }}
+          </template>
+        </template>
       </a-table>
 
       <!-- 图表 -->