From 5f8af6df38a89b115e0aa408e0ab35fafee61c01 Mon Sep 17 00:00:00 2001
From: Fine <fanxue0830@gmail.com>
Date: Mon, 25 Nov 2024 19:05:33 +0800
Subject: [PATCH] analyze profiling

---
 src/graphql/fragments/async-profile.ts        |  2 +-
 src/store/modules/async-profiling.ts          | 33 +++++++++++++++++--
 src/types/async-profiling.ts                  | 22 +++++++++++++
 .../async-profiling/components/Filter.vue     | 29 +++++++++++++++-
 4 files changed, 82 insertions(+), 4 deletions(-)

diff --git a/src/graphql/fragments/async-profile.ts b/src/graphql/fragments/async-profile.ts
index 1ee72fdf..7d3362a4 100644
--- a/src/graphql/fragments/async-profile.ts
+++ b/src/graphql/fragments/async-profile.ts
@@ -64,7 +64,7 @@ export const CreateAsyncProfileTask = {
 export const GetAsyncProfileAnalyze = {
   variable: "$request: AsyncProfilerAnalyzationRequest!",
   query: `
-  analyze: queryAsyncProfilerAnalyze(request: $request) {
+  analysisResult: queryAsyncProfilerAnalyze(request: $request) {
     trees {
       type
       elements {
diff --git a/src/store/modules/async-profiling.ts b/src/store/modules/async-profiling.ts
index 7234aa78..2419290c 100644
--- a/src/store/modules/async-profiling.ts
+++ b/src/store/modules/async-profiling.ts
@@ -16,7 +16,12 @@
  */
 import { defineStore } from "pinia";
 import type { Option } from "@/types/app";
-import type { AsyncProfilingTaskList, AsyncProfileTaskCreationRequest } from "@/types/async-profiling";
+import type {
+  AsyncProfilingTaskList,
+  AsyncProfileTaskCreationRequest,
+  AsyncProfilerStackElement,
+  AsyncProfilerTaskProgress,
+} from "@/types/async-profiling";
 import { store } from "@/store";
 import graphql from "@/graphql";
 import { useAppStoreWithOut } from "@/store/modules/app";
@@ -28,8 +33,9 @@ interface AsyncProfilingState {
   labels: Option[];
   asyncProfilingTips: string;
   selectedTask: Recordable<AsyncProfilingTaskList>;
-  taskProgress: Recordable<any>;
+  taskProgress: Recordable<AsyncProfilerTaskProgress>;
   instances: Instance[];
+  analyzeTrees: AsyncProfilerStackElement[];
 }
 
 export const asyncProfilingStore = defineStore({
@@ -41,6 +47,7 @@ export const asyncProfilingStore = defineStore({
     selectedTask: {},
     taskProgress: {},
     instances: [],
+    analyzeTrees: [],
   }),
   actions: {
     setSelectedTask(task: Recordable<AsyncProfilingTaskList>) {
@@ -98,6 +105,28 @@ export const asyncProfilingStore = defineStore({
       this.getTaskList();
       return res.data;
     },
+    async getAsyncProfilingAnalyze(params: { taskId: string; instanceIds: Array<string>; eventType: string }) {
+      if (!params.instanceIds.length) {
+        return new Promise((resolve) => resolve({}));
+      }
+      const res: AxiosResponse = await graphql.query("GetAsyncProfileAnalyze").params(params);
+
+      if (res.data.errors) {
+        this.analyzeTrees = [];
+        return res.data;
+      }
+      const { analysisResult } = res.data.data;
+      if (!analysisResult) {
+        this.analyzeTrees = [];
+        return res.data;
+      }
+      if (analysisResult.tip) {
+        this.analyzeTrees = [];
+        return res.data;
+      }
+      this.analyzeTrees = analysisResult.elements;
+      return res.data;
+    },
   },
 });
 
diff --git a/src/types/async-profiling.ts b/src/types/async-profiling.ts
index 79623c3d..1c9560d3 100644
--- a/src/types/async-profiling.ts
+++ b/src/types/async-profiling.ts
@@ -32,3 +32,25 @@ export type AsyncProfileTaskCreationRequest = {
   events: string[];
   execArgs: string;
 };
+
+export type AsyncProfilerStackElement = {
+  id: string;
+  parentId: string;
+  codeSignature: string;
+  total: number;
+  self: number;
+};
+
+export type AsyncProfilerTaskProgress = {
+  errorInstanceIds: string[];
+  successInstanceIds: string[];
+  logs: AsyncProfilerTaskLog[];
+};
+
+type AsyncProfilerTaskLog = {
+  id: string;
+  instanceId: string;
+  instanceName: string;
+  operationType: string;
+  operationTime: number;
+};
diff --git a/src/views/dashboard/related/async-profiling/components/Filter.vue b/src/views/dashboard/related/async-profiling/components/Filter.vue
index 5902deb1..33fb3117 100644
--- a/src/views/dashboard/related/async-profiling/components/Filter.vue
+++ b/src/views/dashboard/related/async-profiling/components/Filter.vue
@@ -23,6 +23,14 @@ limitations under the License. -->
       placeholder="Select instances"
       @change="changeInstances"
     />
+    <Selector
+      class="profile-input"
+      :value="selectedEventType"
+      size="small"
+      :options="eventTypes"
+      placeholder="Select a event"
+      @change="changeEventType"
+    />
     <el-button type="primary" size="small" @click="analyzeProfiling">
       {{ t("analyze") }}
     </el-button>
@@ -31,6 +39,7 @@ limitations under the License. -->
 <script lang="ts" setup>
   import { computed, ref } from "vue";
   import { useI18n } from "vue-i18n";
+  import { ElMessage } from "element-plus";
   import { useAsyncProfilingStore } from "@/store/modules/async-profiling";
   import type { Instance } from "@/types/selector";
   import type { Option } from "@/types/app";
@@ -38,6 +47,10 @@ limitations under the License. -->
   const { t } = useI18n();
   const asyncProfilingStore = useAsyncProfilingStore();
   const serviceInstanceIds = ref<string[]>([]);
+  const selectedEventType = ref<string>("");
+  const eventTypes = computed(() =>
+    asyncProfilingStore.selectedTask.eventTypes((d: string) => ({ label: d, value: d })),
+  );
   const instances = computed(() =>
     asyncProfilingStore.instances.filter((d: Instance) =>
       asyncProfilingStore.selectedTask.serviceInstanceIds.includes(d.id),
@@ -48,7 +61,21 @@ limitations under the License. -->
     serviceInstanceIds.value = options.map((d: Option) => d.value);
   }
 
-  function analyzeProfiling() {}
+  function changeEventType(options: Option[]) {
+    selectedEventType.value = options[0].value;
+  }
+
+  async function analyzeProfiling() {
+    const res = await asyncProfilingStore.getAsyncProfilingAnalyze({
+      instanceIds: serviceInstanceIds.value,
+      taskId: asyncProfilingStore.selectedTask.id,
+      eventType: selectedEventType.value,
+    });
+    if (res.data && res.data.errors) {
+      ElMessage.error(res.data.errors);
+      return;
+    }
+  }
 </script>
 <style>
   .profile-input {