fix: view related trace

src/hooks/data.ts

@@ -122,9 +122,9 @@ export const RespFields: Indexable = {
         }
       }
       values {
-        id
+        name: id
         value
-        traceID
+        refId: traceID
       }
     }
     error

src/views/dashboard/Widget.vue

@@ -37,7 +37,7 @@ limitations under the License. -->
           metricConfig: config.metricConfig,
           metricMode: config.metricMode,
           expressions: config.expressions || [],
-          typesOfMQE: config.typesOfMQE || [],
+          typesOfMQE: typesOfMQE || [],
           subExpressions: config.subExpressions || [],
           subTypesOfMQE: config.subTypesOfMQE || [],
         }"
@@ -80,6 +80,7 @@ limitations under the License. -->
       const dashboardStore = useDashboardStore();
       const title = computed(() => (config.value.widget && config.value.widget.title) || "");
       const tips = computed(() => (config.value.widget && config.value.widget.tips) || "");
+      const typesOfMQE = ref<string[]>([]);
 
       init();
       async function init() {
@@ -137,8 +138,10 @@ limitations under the License. -->
             metricConfig: config.value.metricConfig || [],
             subExpressions: config.value.subExpressions || [],
           });
+
           loading.value = false;
           source.value = params.source || {};
+          typesOfMQE.value = params.typesOfMQE;
           return;
         }
         const params = await useQueryProcessor({ ...config.value });
@@ -173,6 +176,7 @@ limitations under the License. -->
         config,
         title,
         tips,
+        typesOfMQE,
       };
     },
   });

src/views/dashboard/graphs/TopList.vue

@@ -20,7 +20,7 @@ limitations under the License. -->
         <div class="desc">
           <span class="calls mr-10">{{ i.value }}</span>
           <span class="cp mr-20">
-            {{ i.name || i.id }}
+            {{ i.name }}
           </span>
         </div>
         <el-popover placement="bottom" trigger="click">
@@ -64,21 +64,23 @@ limitations under the License. -->
   import copy from "@/utils/copy";
   import { TextColors } from "@/views/dashboard/data";
   import Trace from "@/views/dashboard/related/trace/Index.vue";
-  import { QueryOrders, Status, RefIdTypes, ProtocolTypes } from "../data";
+  import { QueryOrders, Status, RefIdTypes, ProtocolTypes, ExpressionResultType } from "../data";
 
   /*global defineProps */
   const props = defineProps({
     data: {
       type: Object as PropType<{
-        [key: string]: { name: string; value: number; id: string }[];
+        [key: string]: { name: string; value: number; refId: string }[];
       }>,
       default: () => ({}),
     },
     config: {
       type: Object as PropType<{
+        metricMode: string;
         color: string;
         metrics: string[];
         metricTypes: string[];
+        typesOfMQE: string[];
         relatedTrace: any;
       }>,
       default: () => ({ color: "purple" }),
@@ -107,14 +109,17 @@ limitations under the License. -->
   function handleClick(i: string) {
     copy(i);
   }
-  function viewTrace(item: { name: string; id: string; value: unknown }) {
+  function viewTrace(item: { name: string; refId: string; value: unknown }) {
     const filters = {
       ...item,
       queryOrder: QueryOrders[1].value,
       status: Status[2].value,
-      id: item.id || item.name,
+      id: item.refId,
       metricValue: [{ label: props.config.metrics[0], data: item.value, value: item.name }],
-      isReadRecords: props.config.metricTypes.includes(ProtocolTypes.ReadRecords) || undefined,
+      isReadRecords:
+        props.config.typesOfMQE.includes(ExpressionResultType.RECORD_LIST) ||
+        props.config.metricTypes.includes(ProtocolTypes.ReadRecords) ||
+        undefined,
     };
     traceOptions.value = {
       ...traceOptions.value,
@@ -163,7 +168,7 @@ limitations under the License. -->
   }
 
   .chart-slow-link {
-    padding: 4px 10px 7px 10px;
+    padding: 4px 10px 7px;
     border-radius: 4px;
     border: 1px solid #ddd;
     color: #333;