feat: update metric config

src/locales/lang/en.ts

@@ -380,5 +380,6 @@ const msg = {
   document: "Documentation",
   metricMode: "Metric Mode",
   addExpressions: "Add Expressions",
+  expressions: "Expression",
 };
 export default msg;

src/locales/lang/es.ts

@@ -380,5 +380,6 @@ const msg = {
   document: "Documentation",
   metricMode: "Metric Mode",
   addExpressions: "Add Expressions",
+  expressions: "Expression",
 };
 export default msg;

src/locales/lang/zh.ts

@@ -378,5 +378,6 @@ const msg = {
   document: "文档",
   metricMode: "指标模式",
   addExpressions: "添加表达式",
+  expressions: "表达式",
 };
 export default msg;

src/store/modules/topology.ts

@@ -353,7 +353,6 @@ export const topologyStore = defineStore({
         this.setLinkServerMetrics({});
         return;
       }
-      console.log(this.calls);
       const idsS = this.calls.filter((i: Call) => i.detectPoints.includes("SERVER")).map((b: Call) => b.id);
       if (!idsS.length) {
         return;
@@ -457,7 +456,6 @@ export const topologyStore = defineStore({
       if (res.data.errors) {
         return res.data;
       }
-      console.log(res.data.data);
       this.setLinkServerMetrics(res.data.data);
       return res.data;
     },

src/views/dashboard/related/topology/components/Metrics.vue

@@ -15,7 +15,9 @@ limitations under the License. -->
 <template>
   <div class="config-panel">
     <div class="item mb-10">
-      <span class="label">{{ t("metrics") }}</span>
+      <span class="label">{{
+        t(dashboardStore.selectedGrid.metricMode === MetricModes.General ? "metrics" : "expressions")
+      }}</span>
       <SelectSingle :value="currentMetric" :options="metrics" @change="changeMetric" class="selectors" />
     </div>
     <div class="item mb-10">
@@ -38,7 +40,7 @@ limitations under the License. -->
         @change="changeConfigs({ label: currentConfig.label })"
       />
     </div>
-    <div class="item mb-10">
+    <div class="item mb-10" v-if="dashboardStore.selectedGrid.metricMode === MetricModes.General">
       <span class="label">{{ t("aggregation") }}</span>
       <SelectSingle
         :value="currentConfig.calculation"
@@ -54,7 +56,7 @@ limitations under the License. -->
   import { ref, computed, watch } from "vue";
   import type { PropType } from "vue";
   import { useI18n } from "vue-i18n";
-  import { CalculationOpts } from "../../../data";
+  import { CalculationOpts, MetricModes } from "../../../data";
   import { useDashboardStore } from "@/store/modules/dashboard";
   import type { Option } from "element-plus/es/components/select-v2/src/select.types";
 

src/views/dashboard/related/topology/components/Settings.vue

@@ -38,13 +38,22 @@ limitations under the License. -->
     />
     <div class="label">
       <span>{{ t("linkServerMetrics") }}</span>
-      <el-popover placement="left" :width="400" trigger="click" v-if="states.linkServerMetrics.length">
+      <el-popover
+        placement="left"
+        :width="400"
+        trigger="click"
+        v-if="isExpression ? states.linkServerExpressions.length : states.linkServerMetrics.length"
+      >
         <template #reference>
           <span @click="setConfigType('linkServerMetricConfig')">
             <Icon class="cp ml-5" iconName="mode_edit" size="middle" />
           </span>
         </template>
-        <Metrics :type="configType" :metrics="states.linkServerMetrics" @update="changeLinkServerMetrics" />
+        <Metrics
+          :type="configType"
+          :metrics="isExpression ? states.linkServerExpressions : states.linkServerMetrics"
+          @update="updateSettings"
+        />
       </el-popover>
     </div>
     <div v-if="isExpression">
@@ -68,13 +77,22 @@ limitations under the License. -->
     <span v-show="dashboardStore.entity !== EntityType[2].value">
       <div class="label">
         <span>{{ t("linkClientMetrics") }}</span>
-        <el-popover placement="left" :width="400" trigger="click" v-if="states.linkClientMetrics.length">
+        <el-popover
+          placement="left"
+          :width="400"
+          trigger="click"
+          v-if="isExpression ? states.linkClientExpressions.length : states.linkClientMetrics.length"
+        >
           <template #reference>
             <span @click="setConfigType('linkClientMetricConfig')">
               <Icon class="cp ml-5" iconName="mode_edit" size="middle" />
             </span>
           </template>
-          <Metrics :type="configType" :metrics="states.linkClientMetrics" @update="changeLinkClientMetrics" />
+          <Metrics
+            :type="configType"
+            :metrics="isExpression ? states.linkClientExpressions : states.linkClientMetrics"
+            @update="updateSettings"
+          />
         </el-popover>
       </div>
       <div v-if="isExpression">
@@ -139,13 +157,22 @@ limitations under the License. -->
     </div>
     <div class="label">
       <span>{{ t("nodeMetrics") }}</span>
-      <el-popover placement="left" :width="400" trigger="click" v-if="states.nodeMetrics.length">
+      <el-popover
+        placement="left"
+        :width="400"
+        trigger="click"
+        v-if="isExpression ? states.nodeExpressions.length : states.nodeMetrics.length"
+      >
         <template #reference>
           <span @click="setConfigType('nodeMetricConfig')">
             <Icon class="cp ml-5" iconName="mode_edit" size="middle" />
           </span>
         </template>
-        <Metrics :type="configType" :metrics="states.nodeMetrics" @update="changeNodeMetrics" />
+        <Metrics
+          :type="configType"
+          :metrics="isExpression ? states.nodeExpressions : states.nodeMetrics"
+          @update="updateSettings"
+        />
       </el-popover>
     </div>
     <div v-if="isExpression">
@@ -524,6 +551,11 @@ limitations under the License. -->
     topologyStore.queryNodeExpressions(states.nodeExpressions);
   }
   function changeMetricMode() {
+    const config = {
+      linkServerMetricConfig: [],
+      linkClientMetricConfig: [],
+      nodeMetricConfig: [],
+    };
     if (isExpression.value) {
       states.linkServerMetrics = [];
       states.linkClientMetrics = [];
@@ -533,7 +565,8 @@ limitations under the License. -->
       states.linkClientExpressions = [];
       states.nodeExpressions = [];
     }
-    updateSettings();
+
+    updateSettings(config);
   }
 </script>
 <style lang="scss" scoped>