feat: use useDashboardQueryProcessor instead useExpressionsQueryProcessor

src/hooks/useExpressionsProcessor.ts

@@ -183,137 +183,6 @@ export async function useDashboardQueryProcessor(configArr: Indexable[]) {
   }
 }
 
-export async function useExpressionsQueryProcessor(config: Indexable) {
-  function expressionsGraphqlPods() {
-    if (!(config.metrics && config.metrics[0])) {
-      return;
-    }
-    const appStore = useAppStoreWithOut();
-    const dashboardStore = useDashboardStore();
-    const selectorStore = useSelectorStore();
-
-    if (!selectorStore.currentService && dashboardStore.entity !== "All") {
-      return;
-    }
-    const conditions: Recordable = {
-      duration: appStore.durationTime,
-    };
-    const variables: string[] = [`$duration: Duration!`];
-    const isRelation = ["ServiceRelation", "ServiceInstanceRelation", "EndpointRelation", "ProcessRelation"].includes(
-      dashboardStore.entity,
-    );
-    if (isRelation && !selectorStore.currentDestService) {
-      return;
-    }
-    const fragment = config.metrics.map((name: string, index: number) => {
-      variables.push(`$expression${index}: String!`, `$entity${index}: Entity!`);
-      conditions[`expression${index}`] = name;
-      const entity = {
-        serviceName: dashboardStore.entity === "All" ? undefined : selectorStore.currentService.value,
-        normal: dashboardStore.entity === "All" ? undefined : selectorStore.currentService.normal,
-        serviceInstanceName: ["ServiceInstance", "ServiceInstanceRelation", "ProcessRelation", "Process"].includes(
-          dashboardStore.entity,
-        )
-          ? selectorStore.currentPod && selectorStore.currentPod.value
-          : undefined,
-        endpointName: dashboardStore.entity.includes("Endpoint")
-          ? selectorStore.currentPod && selectorStore.currentPod.value
-          : undefined,
-        processName: dashboardStore.entity.includes("Process")
-          ? selectorStore.currentProcess && selectorStore.currentProcess.value
-          : undefined,
-        destNormal: isRelation ? selectorStore.currentDestService.normal : undefined,
-        destServiceName: isRelation ? selectorStore.currentDestService.value : undefined,
-        destServiceInstanceName: ["ServiceInstanceRelation", "ProcessRelation"].includes(dashboardStore.entity)
-          ? selectorStore.currentDestPod && selectorStore.currentDestPod.value
-          : undefined,
-        destEndpointName:
-          dashboardStore.entity === "EndpointRelation"
-            ? selectorStore.currentDestPod && selectorStore.currentDestPod.value
-            : undefined,
-        destProcessName: dashboardStore.entity.includes("ProcessRelation")
-          ? selectorStore.currentDestProcess && selectorStore.currentDestProcess.value
-          : undefined,
-      };
-      conditions[`entity${index}`] = entity;
-
-      return `expression${index}: execExpression(expression: $expression${index}, entity: $entity${index}, duration: $duration)${RespFields.execExpression}`;
-    });
-    const queryStr = `query queryData(${variables}) {${fragment}}`;
-
-    return {
-      queryStr,
-      conditions,
-    };
-  }
-
-  function expressionsSource(resp: { errors: string; data: Indexable }) {
-    if (resp.errors) {
-      ElMessage.error(resp.errors);
-      return { source: {}, tips: [], typesOfMQE: [] };
-    }
-    if (!resp.data) {
-      ElMessage.error("The query is wrong");
-      return { source: {}, tips: [], typesOfMQE: [] };
-    }
-    const tips: string[] = [];
-    const source: { [key: string]: unknown } = {};
-    const keys = Object.keys(resp.data);
-    const typesOfMQE: string[] = [];
-
-    for (let i = 0; i < config.metrics.length; i++) {
-      const c: MetricConfigOpt = (config.metricConfig && config.metricConfig[i]) || {};
-      const obj = resp.data[keys[i]] || {};
-      const results = obj.results || [];
-      const name = config.metrics[i];
-      const type = obj.type;
-
-      tips.push(obj.error);
-      typesOfMQE.push(type);
-      if (!obj.error) {
-        if ([ExpressionResultType.SINGLE_VALUE, ExpressionResultType.TIME_SERIES_VALUES].includes(type)) {
-          for (const item of results) {
-            const label =
-              item.metric &&
-              item.metric.labels.map((d: { key: string; value: string }) => `${d.key}=${d.value}`).join(",");
-            const values = item.values.map((d: { value: unknown }) => d.value) || [];
-            if (results.length === 1) {
-              source[label || c.label || name] = values;
-            } else {
-              source[label] = values;
-            }
-          }
-        }
-        if (([ExpressionResultType.RECORD_LIST, ExpressionResultType.SORTED_LIST] as string[]).includes(type)) {
-          source[name] = results[0].values;
-        }
-      }
-    }
-
-    return { source, tips, typesOfMQE };
-  }
-
-  const params = await expressionsGraphqlPods();
-  if (!params) {
-    return { source: {}, tips: [], typesOfMQE: [] };
-  }
-
-  const dashboardStore = useDashboardStore();
-  const json = await dashboardStore.fetchMetricValue(params);
-  if (json.errors) {
-    ElMessage.error(json.errors);
-    return { source: {}, tips: [], typesOfMQE: [] };
-  }
-  try {
-    const data = expressionsSource(json);
-
-    return data;
-  } catch (error) {
-    console.error(error);
-    return { source: {}, tips: [], typesOfMQE: [] };
-  }
-}
-
 export async function useExpressionsQueryPodsMetrics(
   allPods: Array<(Instance | Endpoint | Service) & Indexable>,
   config: {

src/views/dashboard/Widget.vue

@@ -53,7 +53,7 @@ limitations under the License. -->
   import { useRoute } from "vue-router";
   import { useSelectorStore } from "@/store/modules/selectors";
   import { useDashboardStore } from "@/store/modules/dashboard";
-  import { useExpressionsQueryProcessor } from "@/hooks/useExpressionsProcessor";
+  import { useDashboardQueryProcessor } from "@/hooks/useExpressionsProcessor";
   import graphs from "./graphs";
   import { EntityType } from "./data";
   import timeFormat from "@/utils/timeFormat";
@@ -128,12 +128,15 @@ limitations under the License. -->
       }
       async function queryMetrics() {
         loading.value = true;
-        const params = await useExpressionsQueryProcessor({
+        const metrics = await useDashboardQueryProcessor([
+          {
             metrics: config.value.expressions || [],
             metricConfig: config.value.metricConfig || [],
             subExpressions: config.value.subExpressions || [],
-        });
+            id: config.value.i,
-
+          },
+        ]);
+        const params = metrics[config.value.i];
         loading.value = false;
         source.value = params.source || {};
         typesOfMQE.value = params.typesOfMQE;

src/views/dashboard/configuration/widget/metric/Index.vue

@@ -110,7 +110,7 @@ limitations under the License. -->
     ExpressionResultType,
   } from "@/views/dashboard/data";
   import Icon from "@/components/Icon.vue";
-  import { useExpressionsQueryProcessor } from "@/hooks/useExpressionsProcessor";
+  import { useDashboardQueryProcessor } from "@/hooks/useExpressionsProcessor";
   import { useI18n } from "vue-i18n";
   import type { DashboardItem, MetricConfigOpt } from "@/types/dashboard";
   import Standard from "./Standard.vue";
@@ -240,12 +240,13 @@ limitations under the License. -->
   }
 
   async function queryMetricsWithExpressions() {
-    const { expressions, metricConfig } = dashboardStore.selectedGrid;
+    const { expressions, metricConfig, i } = dashboardStore.selectedGrid;
     if (!(expressions && expressions[0])) {
       return emit("update", {});
     }
 
-    const params: Indexable = (await useExpressionsQueryProcessor({ ...states, metricConfig })) || {};
+    const metrics: Indexable = (await useDashboardQueryProcessor([{ ...states, metricConfig, id: i }])) || {};
+    const params = metrics[i];
     states.tips = params.tips || [];
     states.metricTypes = params.typesOfMQE || [];
     dashboardStore.selectWidget({

src/views/dashboard/controls/Tab.vue

@@ -130,7 +130,7 @@ limitations under the License. -->
   import controls from "./tab";
   import { dragIgnoreFrom, WidgetType } from "../data";
   import copy from "@/utils/copy";
-  import { useExpressionsQueryProcessor } from "@/hooks/useExpressionsProcessor";
+  import { useDashboardQueryProcessor } from "@/hooks/useExpressionsProcessor";
 
   const props = {
     data: {
@@ -264,8 +264,10 @@ limitations under the License. -->
         if (!metrics.length) {
           return;
         }
-        const params: { [key: string]: any } = (await useExpressionsQueryProcessor({ metrics })) || {};
+        const values: { [key: string]: any } =
+          (await useDashboardQueryProcessor([{ metrics, id: props.data.i }])) || {};
         for (const child of tabsProps.children || []) {
+          const params = values[props.data.i];
           if (params.source[child.expression || ""]) {
             child.enable =
               !!Number(params.source[child.expression || ""]) &&

src/views/dashboard/controls/Widget.vue

@@ -110,7 +110,6 @@ limitations under the License. -->
       const dashboardStore = useDashboardStore();
       const graph = computed(() => props.data.graph || {});
       const widget = computed(() => props.data.widget || {});
-      const isList = computed(() => ListChartTypes.includes((props.data.graph && props.data.graph.type) || ""));
       const typesOfMQE = ref<string[]>([]);
 
       async function queryMetrics() {
@@ -120,8 +119,8 @@ limitations under the License. -->
           metricConfig: props.data.metricConfig || [],
           id: props.data.i,
         };
-        const values = (await useDashboardQueryProcessor([config])) || {};
+        const metrics = (await useDashboardQueryProcessor([config])) || {};
-        const params = values[data.value.i];
+        const params = metrics[data.value.i];
         loading.value = false;
         state.source = params.source || {};
         typesOfMQE.value = params.typesOfMQE;
@@ -160,7 +159,7 @@ limitations under the License. -->
         dashboardStore.selectWidget(props.data);
       }
       watch(
-        () => props.data.expressions,
+        () => props.data,
         () => {
           if (!dashboardStore.selectedGrid) {
             return;
@@ -169,7 +168,7 @@ limitations under the License. -->
             return;
           }
           const chart = dashboardStore.selectedGrid.graph || {};
-          if (ListChartTypes.includes(chart.type) || isList.value) {
+          if (ListChartTypes.includes(chart.type)) {
             return;
           }
           queryMetrics();