create tasks

src/graphql/fragments/ebpf.ts

@@ -0,0 +1,34 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements.  See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License.  You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+export const queryCreateTaskData = {
+  variable: "$serviceId: ID!",
+  query: `
+  createTaskData: queryPrepareCreateEBPFProfilingTaskData(serviceId: $serviceId) {
+    couldProfiling
+    processLabels
+    }`,
+};
+export const createEBPFTask = {
+  variable: "$request: EBPFProfilingTaskFixedTimeCreationRequest!",
+  query: `
+  createTaskData: createEBPFProfilingFixedTimeTask(request: $request) {
+    status
+    errorReason
+    id
+  }`,
+};

src/graphql/index.ts

@@ -25,6 +25,7 @@ import * as log from "./query/log";
 import * as profile from "./query/profile";
 import * as alarm from "./query/alarm";
 import * as event from "./query/event";
+import * as ebpf from "./query/ebpf";
 
 const query: { [key: string]: string } = {
   ...app,
@@ -36,6 +37,7 @@ const query: { [key: string]: string } = {
   ...profile,
   ...alarm,
   ...event,
+  ...ebpf,
 };
 class Graphql {
   private queryData = "";

src/graphql/query/ebpf.ts

@@ -0,0 +1,22 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements.  See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License.  You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { queryCreateTaskData, createEBPFTask } from "../fragments/ebpf";
+
+export const getCreateTaskData = `query queryCreateTaskData(${queryCreateTaskData.variable}) {${queryCreateTaskData.query}}`;
+
+export const saveEBPFTask = `mutation createEBPFTask(${createEBPFTask.variable}) {${createEBPFTask.query}}`;

src/store/modules/ebpf.ts

@@ -16,14 +16,13 @@
  */
 import { defineStore } from "pinia";
 import { Duration, Option } from "@/types/app";
-import { Endpoint } from "@/types/selector";
 import {
   TaskListItem,
   SegmentSpan,
   ProfileAnalyzationTrees,
   TaskLog,
-  ProfileTaskCreationRequest,
 } from "@/types/profile";
+import { EBPFTaskCreationRequest } from "@/types/ebpf";
 import { Trace, Span } from "@/types/trace";
 import { store } from "@/store";
 import graphql from "@/graphql";
@@ -31,8 +30,6 @@ import { AxiosResponse } from "axios";
 import { useAppStoreWithOut } from "@/store/modules/app";
 
 interface EbpfStore {
-  endpoints: Endpoint[];
-  taskEndpoints: Endpoint[];
   durationTime: Duration;
   condition: { serviceId: string; endpointName: string };
   taskList: TaskListItem[];
@@ -44,13 +41,12 @@ interface EbpfStore {
   taskLogs: TaskLog[];
   highlightTop: boolean;
   labels: Option[];
+  couldProfiling: boolean;
 }
 
 export const ebpfStore = defineStore({
-  id: "profile",
+  id: "eBPF",
   state: (): EbpfStore => ({
-    endpoints: [{ value: "", label: "All" }],
-    taskEndpoints: [{ value: "", label: "All" }],
     durationTime: useAppStoreWithOut().durationTime,
     condition: { serviceId: "", endpointName: "" },
     taskList: [],
@@ -62,6 +58,7 @@ export const ebpfStore = defineStore({
     taskLogs: [],
     highlightTop: true,
     labels: [{ value: "", label: "" }],
+    couldProfiling: false,
   }),
   actions: {
     setConditions(data: { serviceId?: string; endpointName?: string }) {
@@ -79,28 +76,19 @@ export const ebpfStore = defineStore({
     setHighlightTop() {
       this.highlightTop = !this.highlightTop;
     },
-    async getEndpoints(serviceId: string, keyword?: string) {
-      const res: AxiosResponse = await graphql.query("queryEndpoints").params({
-        serviceId,
-        duration: this.durationTime,
-        keyword: keyword || "",
-      });
+    async getCreateTaskData(serviceId: string) {
+      const res: AxiosResponse = await graphql
+        .query("getCreateTaskData")
+        .params({ serviceId });
+
       if (res.data.errors) {
         return res.data;
       }
-      this.endpoints = [{ value: "", label: "All" }, ...res.data.data.pods];
-      return res.data;
-    },
-    async getTaskEndpoints(serviceId: string, keyword?: string) {
-      const res: AxiosResponse = await graphql.query("queryEndpoints").params({
-        serviceId,
-        duration: this.durationTime,
-        keyword: keyword || "",
+      const json = res.data.data.createTaskData;
+      this.couldProfiling = json.couldProfiling || [];
+      this.labels = json.processLabels.map((d: string) => {
+        return { label: d, value: d };
       });
-      if (res.data.errors) {
-        return res.data;
-      }
-      this.taskEndpoints = [{ value: "", label: "All" }, ...res.data.data.pods];
       return res.data;
     },
     async getTaskList() {
@@ -197,15 +185,16 @@ export const ebpfStore = defineStore({
       this.analyzeTrees = analyze.trees;
       return res.data;
     },
-    async createTask(param: ProfileTaskCreationRequest) {
+    async createTask(param: EBPFTaskCreationRequest) {
       const res: AxiosResponse = await graphql
-        .query("saveProfileTask")
-        .params({ creationRequest: param });
+        .query("saveEBPFTask")
+        .params({ request: param });
 
       if (res.data.errors) {
         return res.data;
       }
-      this.getTaskList();
+      console.log(res.data.data);
+      // this.getTaskList();
       return res.data;
     },
     async getTaskLogs(param: { taskID: string }) {

src/types/ebpf.d.ts

@@ -0,0 +1,24 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements.  See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License.  You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+export interface EBPFTaskCreationRequest {
+  serviceId: string;
+  processLabels: string[];
+  startTime: number;
+  duration: number;
+  targetType: string;
+}

src/views/dashboard/related/ebpf/Header.vue

@@ -14,27 +14,6 @@ See the License for the specific language governing permissions and
 limitations under the License. -->
 <template>
   <div class="flex-h header">
-    <div class="mr-10">
-      <span class="grey mr-5">{{ t("endpointName") }}:</span>
-      <Selector
-        class="name"
-        size="small"
-        :value="endpointName"
-        :options="ebpfStore.endpoints"
-        placeholder="Select a endpoint"
-        :isRemote="true"
-        @change="changeEndpoint"
-        @query="searchEndpoints"
-      />
-    </div>
-    <el-button
-      class="search-btn"
-      size="small"
-      type="primary"
-      @click="searchTasks"
-    >
-      {{ t("search") }}
-    </el-button>
     <el-button class="search-btn" size="small" @click="createTask">
       {{ t("newTask") }}
     </el-button>
@@ -67,26 +46,7 @@ const { t } = useI18n();
 const endpointName = ref<string>("");
 const newTask = ref<boolean>(false);
 
-searchTasks();
-searchEndpoints("");
-
-async function searchEndpoints(keyword: string) {
-  if (!selectorStore.currentService) {
-    return;
-  }
-  const service = selectorStore.currentService.value;
-  const res = await ebpfStore.getEndpoints(service, keyword);
-
-  if (res.errors) {
-    ElMessage.error(res.errors);
-    return;
-  }
-  endpointName.value = ebpfStore.endpoints[0].value;
-}
-
-function changeEndpoint(opt: any[]) {
-  endpointName.value = opt[0].value;
-}
+// searchTasks();
 
 async function searchTasks() {
   ebpfStore.setConditions({
@@ -101,8 +61,12 @@ async function searchTasks() {
   }
 }
 
-function createTask() {
+async function createTask() {
+  if (!selectorStore.currentService) {
+    return;
+  }
   newTask.value = true;
+  await ebpfStore.getCreateTaskData(selectorStore.currentService.id);
 }
 
 watch(

src/views/dashboard/related/ebpf/components/NewTask.vue

@@ -14,25 +14,35 @@ See the License for the specific language governing permissions and
 limitations under the License. -->
 
 <template>
-  <div class="profile-task">
+  <div class="ebpf-task" v-if="eBPFStore.couldProfiling">
     <div>
-      <div class="label">{{ t("endpointName") }}</div>
+      <div class="label">{{ t("labels") }}</div>
       <Selector
         class="profile-input"
         size="small"
-        :value="endpointName"
-        :options="eBPFStore.taskEndpoints"
-        placeholder="Select a endpoint"
+        :value="labels"
+        :options="eBPFStore.labels"
+        placeholder="Select labels"
+        :multiple="true"
+        @change="changeLabel"
+      />
+    </div>
+    <div>
+      <div class="label">{{ t("labels") }}</div>
+      <Selector
+        class="profile-input"
+        size="small"
+        :value="type"
+        :options="TargetTypes"
+        placeholder="Select a type"
         :isRemote="true"
-        @change="changeEndpoint"
-        @query="searchEndpoints"
+        @change="changeType"
       />
     </div>
     <div>
       <div class="label">{{ t("monitorTime") }}</div>
       <div>
         <Radio
-          class="mb-5"
           :value="monitorTime"
           :options="InitTaskField.monitorTimeEn"
           @change="changeMonitorTime"
@@ -49,40 +59,14 @@ limitations under the License. -->
     </div>
     <div>
       <div class="label">{{ t("monitorDuration") }}</div>
-      <Radio
-        class="mb-5"
-        :value="monitorDuration"
-        :options="InitTaskField.monitorDuration"
-        @change="changeMonitorDuration"
-      />
-    </div>
-    <div>
-      <div class="label">{{ t("minThreshold") }} (ms)</div>
-      <el-input-number
-        size="small"
+      <el-input
         class="profile-input"
-        :min="0"
-        v-model="minThreshold"
-      />
-    </div>
-    <div>
-      <div class="label">{{ t("dumpPeriod") }}</div>
-      <Radio
-        class="mb-5"
-        :value="dumpPeriod"
-        :options="InitTaskField.dumpPeriod"
-        @change="changeDumpPeriod"
-      />
-    </div>
-    <div>
-      <div class="label">{{ t("maxSamplingCount") }}</div>
-      <Selector
+        v-model="monitorDuration"
         size="small"
-        :value="maxSamplingCount"
-        :options="InitTaskField.maxSamplingCount"
-        placeholder="Select a data"
-        @change="changeMaxSamplingCount"
-        class="profile-input"
+        placeholder="none"
+        type="number"
+        :min="1"
+        :max="60"
       />
     </div>
     <div>
@@ -91,6 +75,7 @@ limitations under the License. -->
       </el-button>
     </div>
   </div>
+  <div v-else>Don't have process could profiling</div>
 </template>
 <script lang="ts" setup>
 import { ref } from "vue";
@@ -99,67 +84,40 @@ import { useEbpfStore } from "@/store/modules/ebpf";
 import { useSelectorStore } from "@/store/modules/selectors";
 import { useAppStoreWithOut } from "@/store/modules/app";
 import { ElMessage } from "element-plus";
-import { InitTaskField } from "./data";
+import { InitTaskField, TargetTypes } from "./data";
 /* global defineEmits */
 const emits = defineEmits(["close"]);
 const eBPFStore = useEbpfStore();
 const selectorStore = useSelectorStore();
 const appStore = useAppStoreWithOut();
 const { t } = useI18n();
-const endpointName = ref<string>("");
+const labels = ref<string[]>([]);
+const type = ref<string>(TargetTypes[0].value);
 const monitorTime = ref<string>(InitTaskField.monitorTimeEn[0].value);
-const monitorDuration = ref<string>(InitTaskField.monitorDuration[0].value);
+const monitorDuration = ref<number>(10);
 const time = ref<Date>(appStore.durationRow.start);
-const minThreshold = ref<number>(0);
-const dumpPeriod = ref<string>(InitTaskField.dumpPeriod[0].value);
-const maxSamplingCount = ref<string>(InitTaskField.maxSamplingCount[0].value);
-
-async function searchEndpoints(keyword: string) {
-  if (!selectorStore.currentService) {
-    return;
-  }
-  const service = selectorStore.currentService.value;
-  const res = await eBPFStore.getEndpoints(service, keyword);
-
-  if (res.errors) {
-    ElMessage.error(res.errors);
-    return;
-  }
-  endpointName.value = eBPFStore.taskEndpoints[0].value;
-}
 
 function changeMonitorTime(opt: string) {
   monitorTime.value = opt;
 }
 
-function changeMonitorDuration(val: string) {
-  monitorDuration.value = val;
+function changeLabel(opt: any[]) {
+  labels.value = opt.map((d) => d.value);
 }
 
-function changeDumpPeriod(val: string) {
-  dumpPeriod.value = val;
-}
-
-function changeMaxSamplingCount(opt: any[]) {
-  maxSamplingCount.value = opt[0].value;
-}
-
-function changeEndpoint(opt: any[]) {
-  endpointName.value = opt[0].value;
+function changeType(opt: any[]) {
+  type.value = opt[0].value;
 }
 
 async function createTask() {
-  emits("close");
   const date =
     monitorTime.value === "0" ? appStore.durationRow.start : time.value;
   const params = {
     serviceId: selectorStore.currentService.id,
-    endpointName: endpointName.value,
+    processLabels: labels.value,
     startTime: date.getTime(),
-    duration: Number(monitorDuration.value),
-    minDurationThreshold: Number(minThreshold.value),
-    dumpPeriod: Number(dumpPeriod.value),
-    maxSamplingCount: Number(maxSamplingCount.value),
+    duration: monitorDuration.value * 60,
+    targetType: "ON_CPU",
   };
   const res = await eBPFStore.createTask(params);
   if (res.errors) {
@@ -172,13 +130,14 @@ async function createTask() {
     return;
   }
   ElMessage.success("Task created successfully");
+  emits("close");
 }
 function changeTimeRange(val: Date) {
   time.value = val;
 }
 </script>
 <style lang="scss" scoped>
-.profile-task {
+.ebpf-task {
   margin: 0 auto;
   width: 400px;
 }

src/views/dashboard/related/ebpf/components/data.ts

@@ -28,8 +28,9 @@ export const NewTaskField = {
   maxSamplingCount: { key: 5, label: "5" },
 };
 
+export const TargetTypes = [{ label: "ON_CPU", value: "ON_CPU" }];
+
 export const InitTaskField = {
-  serviceSource: [{ key: "", label: "None" }],
   monitorTimeEn: [
     { value: "0", label: "monitor now" },
     { value: "1", label: "set start time" },
@@ -43,21 +44,4 @@ export const InitTaskField = {
     { value: "10", label: "10 min" },
     { value: "15", label: "15 min" },
   ],
-  dumpPeriod: [
-    { value: "10", label: "10 ms" },
-    { value: "20", label: "20 ms" },
-    { value: "50", label: "50 ms" },
-    { value: "100", label: "100 ms" },
-  ],
-  maxSamplingCount: [
-    { value: "1", label: "1" },
-    { value: "2", label: "2" },
-    { value: "3", label: "3" },
-    { value: "4", label: "4" },
-    { value: "5", label: "5" },
-    { value: "6", label: "6" },
-    { value: "7", label: "7" },
-    { value: "8", label: "8" },
-    { value: "9", label: "9" },
-  ],
 };