diff --git a/src/graphql/fragments/selector.ts b/src/graphql/fragments/selector.ts index a5c70392..8a84bee5 100644 --- a/src/graphql/fragments/selector.ts +++ b/src/graphql/fragments/selector.ts @@ -58,6 +58,23 @@ export const Endpoints = { } `, }; +export const Processes = { + variable: "$instanceId: ID!, $duration: Duration!", + query: ` + processes: listProcesses(instanceId: $instanceId, duration: $duration) { + id + value: name + label: name + serviceId + serviceName + instanceId + instanceName + agentId + detectType + attributes + labels +`, +}; export const getService = { variable: "$serviceId: String!", @@ -102,3 +119,22 @@ export const getEndpoint = { } `, }; + +export const getProcess = { + variable: "$processId: ID!", + query: ` + process: getProcess(processId: $processId) { + id + value: name + label: name + serviceId + serviceName + instanceId + instanceName + agentId + detectType + attributes + labels + } + `, +}; diff --git a/src/graphql/query/selector.ts b/src/graphql/query/selector.ts index cbbccc30..dc8d446f 100644 --- a/src/graphql/query/selector.ts +++ b/src/graphql/query/selector.ts @@ -22,6 +22,8 @@ import { getService, getInstance, getEndpoint, + Processes, + getProcess, } from "../fragments/selector"; export const queryServices = `query queryServices(${Services.variable}) {${Services.query}}`; @@ -31,3 +33,5 @@ export const queryLayers = `query listLayer {${Layers.query}}`; export const queryService = `query queryService(${getService.variable}) {${getService.query}}`; export const queryInstance = `query queryInstance(${getInstance.variable}) {${getInstance.query}}`; export const queryEndpoint = `query queryInstance(${getEndpoint.variable}) {${getEndpoint.query}}`; +export const queryProcesses = `query queryProcesses(${Processes.variable}) {${Processes.query}}`; +export const queryProcess = `query queryProcess(${getProcess.variable}) {${getProcess.query}}`; diff --git a/src/store/modules/selectors.ts b/src/store/modules/selectors.ts index f393052c..4c61dd6c 100644 --- a/src/store/modules/selectors.ts +++ b/src/store/modules/selectors.ts @@ -1,3 +1,4 @@ +import { getProcess } from "./../../graphql/fragments/selector"; /** * Licensed to the Apache Software Foundation (ASF) under one or more * contributor license agreements. See the NOTICE file distributed with @@ -15,7 +16,7 @@ * limitations under the License. */ import { defineStore } from "pinia"; -import { Service, Instance, Endpoint } from "@/types/selector"; +import { Service, Instance, Endpoint, Process } from "@/types/selector"; import { store } from "@/store"; import graphql from "@/graphql"; import { AxiosResponse } from "axios"; @@ -24,11 +25,15 @@ interface SelectorState { services: Service[]; destServices: Service[]; pods: Array; + processes: Process[]; + destProcesses: Process[]; currentService: Nullable; currentPod: Nullable; + currentProcess: Nullable; currentDestService: Nullable; currentDestPod: Nullable; destPods: Array; + currentDestProcess: Nullable; } export const selectorStore = defineStore({ @@ -38,10 +43,14 @@ export const selectorStore = defineStore({ destServices: [], pods: [], destPods: [], + processes: [], + destProcesses: [], currentService: null, currentPod: null, + currentProcess: null, currentDestService: null, currentDestPod: null, + currentDestProcess: null, }), actions: { setCurrentService(service: Nullable) { @@ -56,6 +65,12 @@ export const selectorStore = defineStore({ setCurrentDestPod(pod: Nullable) { this.currentDestPod = pod; }, + setCurrentProcess(process: Nullable) { + this.currentPod = process; + }, + setCurrentDestProcess(process: Nullable) { + this.currentDestPod = process; + }, async fetchLayers(): Promise { const res: AxiosResponse = await graphql.query("queryLayers").params({}); @@ -93,6 +108,27 @@ export const selectorStore = defineStore({ } return res.data; }, + async getProcesses(param?: { + instanceId: string; + isRelation: boolean; + }): Promise> { + const instanceId = param ? param.instanceId : this.currentPod?.id; + if (!instanceId) { + return null; + } + const res: AxiosResponse = await graphql.query("queryInstances").params({ + instanceId, + duration: useAppStoreWithOut().durationTime, + }); + if (!res.data.errors) { + if (param && param.isRelation) { + this.destProcesses = res.data.data.processes || []; + return res.data; + } + this.processes = res.data.data.processes || []; + } + return res.data; + }, async getEndpoints(params: { keyword?: string; serviceId?: string; @@ -176,6 +212,25 @@ export const selectorStore = defineStore({ this.pods = [res.data.data.endpoint]; } + return res.data; + }, + async getProcess(instanceId: string, isRelation?: boolean) { + if (!instanceId) { + return; + } + const res: AxiosResponse = await graphql.query("queryProcess").params({ + instanceId, + }); + if (!res.data.errors) { + if (isRelation) { + this.currentDestProcess = res.data.data.process || null; + this.destProcesses = [res.data.data.process]; + return; + } + this.currentProcess = res.data.data.process || null; + this.processes = [res.data.data.process]; + } + return res.data; }, }, diff --git a/src/types/ebpf.d.ts b/src/types/ebpf.d.ts index 3259f524..5dfca0ef 100644 --- a/src/types/ebpf.d.ts +++ b/src/types/ebpf.d.ts @@ -15,6 +15,7 @@ * limitations under the License. */ +import { Process } from "./selector"; export interface EBPFTaskCreationRequest { serviceId: string; processLabels: string[]; @@ -43,18 +44,7 @@ export interface EBPFProfilingSchedule { startTime: number; } -export type Process = { - id: string; - name: string; - serviceId: string; - serviceName: string; - instanceId: string; - instanceName: string; - agentId: string; - detectType: string; - attributes: { name: string; value: string }[]; - labels: string[]; -}; +export type Process = Process; export type StackElement = { id: string; originId: string; diff --git a/src/types/selector.d.ts b/src/types/selector.d.ts index 293ef469..fe4dd163 100644 --- a/src/types/selector.d.ts +++ b/src/types/selector.d.ts @@ -46,3 +46,16 @@ export type Service = { layers: string[]; shortName: string; }; + +export type Process = { + id: string; + name: string; + serviceId: string; + serviceName: string; + instanceId: string; + instanceName: string; + agentId: string; + detectType: string; + attributes: { name: string; value: string }[]; + labels: string[]; +}; diff --git a/src/views/dashboard/data.ts b/src/views/dashboard/data.ts index c0b96fd2..c2a8830e 100644 --- a/src/views/dashboard/data.ts +++ b/src/views/dashboard/data.ts @@ -159,6 +159,7 @@ export const EntityType = [ key: 4, }, { value: "EndpointRelation", label: "Endpoint Relation", key: 4 }, + { value: "ProcessRelation", label: "Process Relation", key: 5 }, ]; export const ListEntity: any = { InstanceList: EntityType[3].value, diff --git a/src/views/dashboard/panel/Tool.vue b/src/views/dashboard/panel/Tool.vue index 2e7b4feb..8474241e 100644 --- a/src/views/dashboard/panel/Tool.vue +++ b/src/views/dashboard/panel/Tool.vue @@ -26,7 +26,7 @@ limitations under the License. --> class="selectors" /> -
+
{{ ["EndpointRelation", "Endpoint"].includes(dashboardStore.entity) @@ -47,7 +47,18 @@ limitations under the License. --> " />
-
+
+ $Process + +
+
$DestinationService class="selectors" />
-
+
{{ dashboardStore.entity === "EndpointRelation" @@ -77,6 +88,17 @@ limitations under the License. --> :isRemote="dashboardStore.entity === 'EndpointRelation'" />
+
+ $DestinationProcess + +
diff --git a/src/views/dashboard/related/network-profiling/components/metrics-panel/Index.vue b/src/views/dashboard/related/network-profiling/components/metrics-panel/Index.vue deleted file mode 100644 index 7e7cf45e..00000000 --- a/src/views/dashboard/related/network-profiling/components/metrics-panel/Index.vue +++ /dev/null @@ -1,68 +0,0 @@ - - - diff --git a/src/views/dashboard/related/network-profiling/components/metrics-panel/MetricWidget.vue b/src/views/dashboard/related/network-profiling/components/metrics-panel/MetricWidget.vue deleted file mode 100644 index 13a0d584..00000000 --- a/src/views/dashboard/related/network-profiling/components/metrics-panel/MetricWidget.vue +++ /dev/null @@ -1,218 +0,0 @@ - - - -