diff --git a/src/store/modules/continous-profiling.ts b/src/store/modules/continous-profiling.ts index d1897c8b..9e426481 100644 --- a/src/store/modules/continous-profiling.ts +++ b/src/store/modules/continous-profiling.ts @@ -15,6 +15,7 @@ * limitations under the License. */ import { defineStore } from "pinia"; +import { ElMessage } from "element-plus"; import { useAppStoreWithOut } from "@/store/modules/app"; import { useNetworkProfilingStore } from "@/store/modules/network-profiling"; import type { StrategyItem, CheckItems } from "@/types/continous-profiling"; @@ -137,8 +138,6 @@ export const continousProfilingStore = defineStore({ return res.data; } this.taskList = res.data.data.queryEBPFTasks || []; - this.selectedTask = this.taskList[0] || {}; - this.setselectedTask(this.selectedTask); if (!this.taskList.length) { const networkProfilingStore = useNetworkProfilingStore(); networkProfilingStore.seNodes([]); @@ -146,6 +145,9 @@ export const continousProfilingStore = defineStore({ this.eBPFSchedules = []; this.analyzeTrees = []; } + this.selectedTask = this.taskList[0] || {}; + this.setselectedTask(this.selectedTask); + this.preAnalyzeTask(); return res.data; }, async getServiceInstances(serviceId: string): Promise> { @@ -178,6 +180,7 @@ export const continousProfilingStore = defineStore({ if (!params.taskId) { return new Promise((resolve) => resolve({})); } + params.taskId = "71d96efb81b0be93b1322be1b17334c87d45d6216e299504a778264f94692d1b"; const res: AxiosResponse = await graphql.query("getEBPFSchedules").params({ ...params }); if (res.data.errors) { @@ -225,6 +228,19 @@ export const continousProfilingStore = defineStore({ this.analyzeTrees = analysisEBPFResult.trees; return res.data; }, + async preAnalyzeTask() { + if (this.selectedStrategy.type === "NETWORK") { + const networkProfilingStore = useNetworkProfilingStore(); + await networkProfilingStore.setSelectedNetworkTask(this.selectedTask); + return; + } + const res = await this.getEBPFSchedules({ + taskId: this.selectedTask.taskId, + }); + if (res.errors) { + ElMessage.error(res.errors); + } + }, }, }); diff --git a/src/views/dashboard/related/continuous-profiling/Content.vue b/src/views/dashboard/related/continuous-profiling/Content.vue index 3f51d5ac..eb19b0db 100644 --- a/src/views/dashboard/related/continuous-profiling/Content.vue +++ b/src/views/dashboard/related/continuous-profiling/Content.vue @@ -40,24 +40,4 @@ limitations under the License. --> height: calc(100% - 30px); width: 100%; } - - .vis-graph { - height: 100%; - flex-grow: 2; - min-width: 700px; - overflow: auto; - } - - .item { - width: 100%; - overflow: auto; - height: calc(100% - 100px); - padding-bottom: 10px; - } - - .schedules { - height: 90px; - border-bottom: 1px solid #ccc; - padding-right: 10px; - } diff --git a/src/views/dashboard/related/continuous-profiling/components/EBPFStack.vue b/src/views/dashboard/related/continuous-profiling/components/EBPFStack.vue new file mode 100644 index 00000000..0854e835 --- /dev/null +++ b/src/views/dashboard/related/continuous-profiling/components/EBPFStack.vue @@ -0,0 +1,211 @@ + + + + diff --git a/src/views/dashboard/related/continuous-profiling/components/GraphPanel.vue b/src/views/dashboard/related/continuous-profiling/components/GraphPanel.vue index aef3d9de..582b9c66 100644 --- a/src/views/dashboard/related/continuous-profiling/components/GraphPanel.vue +++ b/src/views/dashboard/related/continuous-profiling/components/GraphPanel.vue @@ -34,15 +34,15 @@ limitations under the License. --> placeholder="Select a process" @change="changeProcess" /> - + -
+
@@ -64,17 +64,13 @@ limitations under the License. --> import { ref, watch } from "vue"; import type { PropType } from "vue"; import { useI18n } from "vue-i18n"; - import { ElMessage } from "element-plus"; import { useSelectorStore } from "@/store/modules/selectors"; import { useContinousProfilingStore } from "@/store/modules/continous-profiling"; import { useNetworkProfilingStore } from "@/store/modules/network-profiling"; - import { useAppStoreWithOut } from "@/store/modules/app"; import ProcessTopology from "@/views/dashboard/related/network-profiling/components/ProcessTopology.vue"; import EBPFSchedules from "@/views/dashboard/related/ebpf/components/EBPFSchedules.vue"; import EBPFStack from "@/views/dashboard/related/ebpf/components/EBPFStack.vue"; import { TargetTypes, ComponentType } from "../data"; - import dateFormatStep from "@/utils/dateFormat"; - import getLocalTime from "@/utils/localtime"; /*global defineProps */ defineProps({ @@ -85,7 +81,6 @@ limitations under the License. --> }); const continousProfilingStore = useContinousProfilingStore(); const networkProfilingStore = useNetworkProfilingStore(); - const appStore = useAppStoreWithOut(); const selectorStore = useSelectorStore(); const { t } = useI18n(); const processId = ref(""); @@ -99,43 +94,6 @@ limitations under the License. --> processId.value = opt[0].id; } - async function analyzeTask() { - if (continousProfilingStore.selectedTask.type === TargetTypes[2].value) { - await networkProfilingStore.setSelectedNetworkTask(continousProfilingStore.selectedTask); - await getTopology(); - - return; - } - const res = await continousProfilingStore.getEBPFSchedules({ - taskId: continousProfilingStore.selectedTask.taskId, - }); - if (res.errors) { - ElMessage.error(res.errors); - } - } - - async function getTopology() { - const { taskStartTime, fixedTriggerDuration } = networkProfilingStore.selectedNetworkTask; - const startTime = - fixedTriggerDuration > 1800 ? taskStartTime + fixedTriggerDuration * 1000 - 30 * 60 * 1000 : taskStartTime; - let endTime = taskStartTime + fixedTriggerDuration * 1000; - if (taskStartTime + fixedTriggerDuration * 1000 > new Date().getTime()) { - endTime = new Date().getTime(); - } - const resp = await networkProfilingStore.getProcessTopology({ - serviceInstanceId: instanceId.value, - duration: { - start: dateFormatStep(getLocalTime(appStore.utc, new Date(startTime)), appStore.duration.step, true), - end: dateFormatStep(getLocalTime(appStore.utc, new Date(endTime)), appStore.duration.step, true), - step: appStore.duration.step, - }, - }); - if (resp.errors) { - ElMessage.error(resp.errors); - } - return resp; - } - async function getSelectors() { const serviceId = (selectorStore.currentService && selectorStore.currentService.id) || ""; @@ -174,11 +132,17 @@ limitations under the License. --> } .vis-graph-topology { - height: 100%; + height: calc(100% - 20px); flex-grow: 2; min-width: 700px; overflow: hidden; position: relative; width: calc(100% - 330px); } + + .policy-graph { + height: calc(100% - 20px); + flex-grow: 2; + overflow: auto; + } diff --git a/src/views/dashboard/related/continuous-profiling/components/PolicyList.vue b/src/views/dashboard/related/continuous-profiling/components/PolicyList.vue index a86d069e..49546821 100644 --- a/src/views/dashboard/related/continuous-profiling/components/PolicyList.vue +++ b/src/views/dashboard/related/continuous-profiling/components/PolicyList.vue @@ -144,7 +144,7 @@ limitations under the License. -->