feat: filter tasks with current process ID (#282)

src/graphql/fragments/ebpf.ts

@@ -43,11 +43,27 @@ export const queryEBPFTasks = {
     serviceInstanceId
     serviceInstanceName
     processLabels
+    processName
+    processId
     taskStartTime
     triggerType
     fixedTriggerDuration
     targetType
     createTime
+    continuousProfilingCauses {
+      type
+      singleValue {
+        threshold
+        current
+      }
+      uri {
+        uriRegex
+        uriPath
+        threshold
+        current
+      }
+      message
+    }
   }`,
 };
 export const queryEBPFSchedules = {

src/store/modules/continous-profiling.ts

@@ -121,7 +121,7 @@ export const continousProfilingStore = defineStore({
           id: index,
         };
       });
-      this.setSelectedStrategy(list[0] || {});
+      this.setSelectedStrategy(this.strategyList[0]);
       if (!this.selectedStrategy.type) {
         return res.data;
       }

src/store/modules/task-timeline.ts

@@ -64,7 +64,10 @@ export const taskTimelineStore = defineStore({
       if (res.data.errors) {
         return res.data;
       }
-      this.taskList = res.data.data.queryEBPFTasks || [];
+      const selectorStore = useSelectorStore();
+      this.taskList = (res.data.data.queryEBPFTasks || []).filter(
+        (d: EBPFTaskList) => selectorStore.currentProcess && d.processId === selectorStore.currentProcess.id,
+      );
       // this.selectedTask = this.taskList[0] || {};
       // await this.getGraphData();
       return res.data;

src/views/dashboard/related/continuous-profiling/components/Policy.vue

@@ -53,10 +53,6 @@ limitations under the License. -->
         @change="changeMonitorType($event, index)"
       />
     </div>
-    <div>
-      <div class="label">{{ t("count") }}</div>
-      <el-input-number size="small" class="profile-input" :min="0" v-model="item.count" @change="changeParam" />
-    </div>
     <div>
       <div class="label">
         <span class="mr-5">{{ t("threshold") }}</span>
@@ -70,6 +66,10 @@ limitations under the License. -->
         @change="changeThreshold(index)"
       />
     </div>
+    <div>
+      <div class="label">{{ t("count") }}</div>
+      <el-input-number size="small" class="profile-input" :min="0" v-model="item.count" @change="changeParam" />
+    </div>
     <div>
       <div class="label">{{ t("period") }}</div>
       <el-input-number size="small" class="profile-input" :min="0" v-model="item.period" @change="changeParam" />

src/views/dashboard/related/task-timeline/components/ProfilingPanel.vue

@@ -71,7 +71,7 @@ limitations under the License. -->
   .item {
     width: 100%;
     overflow: auto;
-    height: calc(100% - 100px);
+    height: calc(100% - 270px);
     padding-bottom: 10px;
   }
 

src/views/dashboard/related/task-timeline/components/Timeline.vue

@@ -101,22 +101,19 @@ limitations under the License. -->
         template(item: EBPFTaskList | any) {
           const data = item.data || {};
           const end = data.taskStartTime ? visDate(data.taskStartTime + data.fixedTriggerDuration * 1000) : "";
-
+          let str = "";
+          for (const item of data.continuousProfilingCauses || []) {
+            str += `${item.message};`;
+          }
           let tmp = `
           <div>Task ID: ${data.taskId || ""}</div>
-          <div>Service Name: ${data.serviceName || ""}</div>
-          <div>Service Instance Name: ${data.serviceInstanceName || ""}</div>
-          <div>Service Process Name: ${data.processName || ""}</div>
           <div>Target Type: ${data.targetType || ""}</div>
           <div>Trigger Type: ${data.triggerType || ""}</div>
           <div>Start Time: ${data.taskStartTime ? visDate(data.taskStartTime) : ""}</div>
           <div>End Time: ${end}</div>
+          <div>Causes: ${str}</div>
           <div>Process Labels: ${data.processLabels.join("; ") || ""}</div>`;
-          let str = "";
+          return tmp;
-          for (const item of data.continuousProfilingCauses || []) {
-            str += `<div>${item.type}: ${getURI(item.uri)}${item.uri.threshold}>=${item.uri.current}</div>`;
-          }
-          return tmp + str;
         },
       },
     };
@@ -132,7 +129,7 @@ limitations under the License. -->
   }
 
   function getURI(uri: { uriRegex: string; uriPath: string }) {
-    return uri ? `(${uri.uriRegex || ""} | ${uri.uriPath || ""})` : "";
+    return uri && uri.uriRegex && uri.uriPath ? `(${uri.uriRegex || ""} | ${uri.uriPath || ""})` : "";
   }
 
   function resize() {
@@ -156,7 +153,7 @@ limitations under the License. -->
     taskTimelineStore.setTaskList([]);
   });
   watch(
-    () => selectorStore.currentPod,
+    () => selectorStore.currentProcess,
     () => {
       init();
     },