update processor

src/hooks/useListConfig.ts

@@ -30,8 +30,10 @@ export function useListConfig(config: any, index: string) {
     config.metricTypes[i] === MetricQueryTypes.ReadMetricsValues &&
     !types.includes(calculation);
   const isAvg =
-    config.metricTypes[i] === MetricQueryTypes.ReadMetricsValues &&
+    [
-    types.includes(calculation);
+      MetricQueryTypes.ReadMetricsValues,
+      MetricQueryTypes.ReadLabeledMetricsValues,
+    ].includes(config.metricTypes[i]) && types.includes(calculation);
   return {
     isLinear: line,
     isAvg,

src/hooks/useProcessor.ts

@@ -298,10 +298,12 @@ export function useQueryPodsMetrics(
         };
         let labelStr = "";
         if (metricType === MetricQueryTypes.ReadLabeledMetricsValues) {
+          console.log(config);
           variables.push(`$labels${index}${idx}: [String!]!`);
           labelStr = `labels: $labels${index}${idx}, `;
           conditions[`labels${index}${idx}`] = (
-            config.metricConfig[idx].label || ""
+            (config.metricConfig[idx] && config.metricConfig[idx].label) ||
+            ""
           ).split(",");
         }
         return `${name}${index}${idx}: ${metricType}(condition: $condition${index}${idx}, ${labelStr}duration: $duration)${RespFields[metricType]}`;
@@ -314,6 +316,7 @@ export function useQueryPodsMetrics(
 
   return { queryStr, conditions };
 }
+
 export function usePodsSource(
   pods: Array<Instance | Endpoint>,
   resp: { errors: string; data: { [key: string]: any } },
@@ -327,13 +330,16 @@ export function usePodsSource(
     ElMessage.error(resp.errors);
     return {};
   }
-  console.log(config);
+  const names: string[] = [];
   const data = pods.map((d: Instance | any, idx: number) => {
     config.metrics.map((name: string, index: number) => {
       const c: any = (config.metricConfig && config.metricConfig[index]) || {};
       const key = name + idx + index;
       if (config.metricTypes[index] === MetricQueryTypes.ReadMetricsValue) {
         d[name] = aggregation(resp.data[key], c);
+        if (idx === 0) {
+          names.push(name);
+        }
       }
       if (config.metricTypes[index] === MetricQueryTypes.ReadMetricsValues) {
         d[name] = {};
@@ -344,36 +350,73 @@ export function usePodsSource(
             Calculations.PercentageAvg,
           ].includes(c.calculation)
         ) {
-          if (Array.isArray(d[resp.data[key]])) {
-            for (const item of d[resp.data[key]]) {
-              d[item.label]["avg"] = calculateExp(
-                resp.data[key][item.label].values.values,
-                c
-              );
-            }
-          } else {
           d[name]["avg"] = calculateExp(resp.data[key].values.values, c);
         }
-        }
-        if (Array.isArray(d[resp.data[key]])) {
-          for (const item of d[resp.data[key]]) {
-            d[item.label]["values"] = resp.data[key][
-              item.label
-            ].values.values.map((val: { value: number }) =>
-              aggregation(val.value, c)
-            );
-          }
-        } else {
         d[name]["values"] = resp.data[key].values.values.map(
           (val: { value: number }) => aggregation(val.value, c)
         );
+        if (idx === 0) {
+          names.push(name);
+        }
+      }
+      if (
+        config.metricTypes[index] === MetricQueryTypes.ReadLabeledMetricsValues
+      ) {
+        const resVal = resp.data[key] || [];
+        const labels = (c.label || "")
+          .split(",")
+          .map((item: string) => item.replace(/^\s*|\s*$/g, ""));
+        const labelsIdx = (c.labelsIndex || "")
+          .split(",")
+          .map((item: string) => item.replace(/^\s*|\s*$/g, ""));
+        console.log(resVal);
+        for (const item of resVal) {
+          const values = item.values.values.map((d: { value: number }) =>
+            aggregation(Number(d.value), c)
+          );
+          const indexNum = labelsIdx.findIndex((d: string) => d === item.label);
+          if (
+            [
+              Calculations.Average,
+              Calculations.ApdexAvg,
+              Calculations.PercentageAvg,
+            ].includes(c.calculation)
+          ) {
+            if (labels[indexNum] && indexNum > -1) {
+              if (!d[labels[indexNum]]) {
+                d[labels[indexNum]] = {};
+              }
+              d[labels[indexNum]]["avg"] = calculateExp(item.values.values, c);
+            } else {
+              if (!d[item.label]) {
+                d[item.label] = {};
+              }
+              d[item.label]["avg"] = calculateExp(item.values.values, c);
+            }
+          }
+          if (labels[indexNum] && indexNum > -1) {
+            if (!d[labels[indexNum]]) {
+              d[labels[indexNum]] = {};
+            }
+            d[labels[indexNum]]["values"] = values;
+            if (idx === 0) {
+              names.push(labels[indexNum]);
+            }
+          } else {
+            if (!d[item.label]) {
+              d[item.label] = {};
+            }
+            d[item.label]["values"] = values;
+            if (idx === 0) {
+              names.push(item.label);
+            }
+          }
         }
       }
     });
-
     return d;
   });
-  return data;
+  return { data, names };
 }
 export function useQueryTopologyMetrics(metrics: string[], ids: string[]) {
   const appStore = useAppStoreWithOut();

src/views/dashboard/controls/Widget.vue

@@ -62,7 +62,7 @@ limitations under the License. -->
           metricTypes: data.metricTypes || [''],
           i: data.i,
           id: data.id,
-          metricConfig: data.metricConfig,
+          metricConfig: data.metricConfig || [],
           filters: data.filters || {},
           relatedTrace: data.relatedTrace || {},
         }"

src/views/dashboard/graphs/EndpointList.vue

@@ -143,7 +143,7 @@ async function queryEndpointMetrics(currentPods: Endpoint[]) {
     endpoints.value = usePodsSource(currentPods, json, {
       ...props.config,
       metricConfig: metricConfig,
-    });
+    }).data;
     return;
   }
   endpoints.value = currentPods;

src/views/dashboard/graphs/InstanceList.vue

@@ -172,7 +172,7 @@ async function queryInstanceMetrics(currentInstances: Instance[]) {
     instances.value = usePodsSource(currentInstances, json, {
       ...props.config,
       metricConfig,
-    });
+    }).data;
     return;
   }
   instances.value = currentInstances;

src/views/dashboard/graphs/ServiceList.vue

@@ -75,7 +75,7 @@ limitations under the License. -->
   </div>
 </template>
 <script setup lang="ts">
-import { watch, ref, computed } from "vue";
+import { watch, ref } from "vue";
 import { ElMessage } from "element-plus";
 import type { PropType } from "vue";
 import { ServiceListConfig } from "@/types/dashboard";
@@ -102,7 +102,9 @@ const props = defineProps({
         metrics: string[];
         metricTypes: string[];
         isEdit: boolean;
-      } & { metricConfig: MetricConfigOpt[] }
+        names: string[];
+        metricConfig: MetricConfigOpt[];
+      }
     >,
     default: () => ({ dashboardName: "", fontSize: 12 }),
   },
@@ -115,12 +117,11 @@ const appStore = useAppStoreWithOut();
 const chartLoading = ref<boolean>(false);
 const pageSize = 10;
 const services = ref<Service[]>([]);
+const colMetrics = ref<string[]>([]);
 const searchText = ref<string>("");
 const groups = ref<any>({});
 const sortServices = ref<(Service & { merge: boolean })[]>([]);
-const colMetrics = computed(() =>
+const metricConfig = ref<MetricConfigOpt[]>(props.config.metricConfig || []);
-  (props.config.metrics || []).filter((d: string) => d)
-);
 queryServices();
 
 async function queryServices() {
@@ -194,7 +195,6 @@ function clickService(scope: any) {
   router.push(path);
 }
 async function queryServiceMetrics(currentServices: Service[]) {
-  // console.log(services.value);
   if (!currentServices.length) {
     return;
   }
@@ -213,14 +213,18 @@ async function queryServiceMetrics(currentServices: Service[]) {
       ElMessage.error(json.errors);
       return;
     }
-    const metricConfig = props.config.metricConfig || [];
+
-    services.value = usePodsSource(currentServices, json, {
+    if (!metricConfig.value.length) {
-      ...props.config,
+      return;
-      metricConfig,
+    }
-    });
+    const { data, names } = usePodsSource(currentServices, json, {
+      ...props.config,
+      metricConfig: metricConfig.value,
+    });
+    services.value = data;
+    colMetrics.value = names;
     return;
   }
-  console.log(services.value);
   services.value = currentServices;
 }
 function objectSpanMethod(param: any): any {