diff --git a/src/types/ebpf.d.ts b/src/types/ebpf.d.ts
index b40597ef..4598528e 100644
--- a/src/types/ebpf.d.ts
+++ b/src/types/ebpf.d.ts
@@ -52,7 +52,7 @@ export type Process = {
instanceName: string;
agentId: string;
detectType: string;
- attributes: { name: string; value: string };
+ attributes: { name: string; value: string }[];
labels: string[];
};
export type StackElement = {
diff --git a/src/views/dashboard/related/ebpf/Content.vue b/src/views/dashboard/related/ebpf/Content.vue
index e4b0653b..024ecf04 100644
--- a/src/views/dashboard/related/ebpf/Content.vue
+++ b/src/views/dashboard/related/ebpf/Content.vue
@@ -16,7 +16,7 @@ limitations under the License. -->
-
+
@@ -44,7 +44,11 @@ import EBPFStack from "./components/EBPFStack.vue";
.item {
width: 100%;
overflow: auto;
- height: calc(50% - 10px);
+ height: calc(100% - 200px);
padding-bottom: 10px;
}
+
+.schedules {
+ height: 190px;
+}
diff --git a/src/views/dashboard/related/ebpf/components/EBPFSchedules.vue b/src/views/dashboard/related/ebpf/components/EBPFSchedules.vue
index a584e40f..2e144ad4 100644
--- a/src/views/dashboard/related/ebpf/components/EBPFSchedules.vue
+++ b/src/views/dashboard/related/ebpf/components/EBPFSchedules.vue
@@ -34,7 +34,7 @@ limitations under the License. -->
placeholder="Please input name"
class="input-with-search"
size="small"
- @change="searchProcesses"
+ @change="searchProcesses(0)"
>
@@ -180,7 +180,7 @@ function visTimeline() {
};
}
);
- searchProcesses();
+ searchProcesses(0);
if (!timeline.value) {
return;
}
@@ -190,6 +190,8 @@ function visTimeline() {
height: h,
width: "100%",
locale: "en",
+ selectable: false,
+ zoomable: false,
};
visGraph.value = new Timeline(timeline.value, items, options);
}
@@ -198,18 +200,38 @@ function changePage(pageIndex: number) {
searchProcesses(pageIndex);
}
-function searchProcesses(pageIndex?: any) {
+function searchProcesses(pageIndex: number) {
const arr = processes.value.filter(
- (d: { name: string; instanceName: string }) =>
+ (d: {
+ name: string;
+ instanceName: string;
+ attributes: { name: string; value: string }[];
+ }) =>
d.name.includes(searchText.value) ||
- d.instanceName.includes(searchText.value)
+ d.instanceName.includes(searchText.value) ||
+ searchAttribute(d.attributes, searchText.value)
);
- currentProcesses.value = arr.splice(
- (pageIndex - 1 || 0) * pageSize,
- pageSize * (pageIndex || 1)
+ currentProcesses.value = arr.filter(
+ (d, index: number) =>
+ (pageIndex - 1 || 0) * pageSize <= index &&
+ pageSize * (pageIndex || 1) > index
);
}
+function searchAttribute(
+ attributes: { name: string; value: string }[],
+ text: string
+) {
+ const item = attributes.find(
+ (d: { name: string; value: string }) => d.name === "command_line"
+ );
+
+ if (!item) {
+ return false;
+ }
+ return item.value.includes(text);
+}
+
watch(
() => ebpfStore.eBPFSchedules,
() => {
diff --git a/src/views/dashboard/related/ebpf/components/EBPFStack.vue b/src/views/dashboard/related/ebpf/components/EBPFStack.vue
index 9ff7832a..a363b19f 100644
--- a/src/views/dashboard/related/ebpf/components/EBPFStack.vue
+++ b/src/views/dashboard/related/ebpf/components/EBPFStack.vue
@@ -78,6 +78,7 @@ function drawGraph() {
.sort(true)
.title("")
.selfValue(false)
+ .inverted(true)
.setColorMapper((d, originalColor) =>
d.highlight ? "#6aff8f" : originalColor
);
@@ -86,8 +87,9 @@ function drawGraph() {
.direction("w")
.html(
(d: { data: StackElement }) =>
- `Symbol: ${d.data.name}
Dump Count: ${d.data.dumpCount}
`
- );
+ `Symbol: ${d.data.name}
Dump Count: ${d.data.dumpCount}
`
+ )
+ .style("max-width", "500px");
flameChart.value.tooltip(tip);
d3.select("#graph-stack").datum(stackTree.value).call(flameChart.value);
}
@@ -176,4 +178,8 @@ watch(
color: red;
margin-top: 20px;
}
+
+.name {
+ word-wrap: break-word;
+}
diff --git a/src/views/dashboard/related/ebpf/components/NewTask.vue b/src/views/dashboard/related/ebpf/components/NewTask.vue
index 5a0e63cc..f5d2597b 100644
--- a/src/views/dashboard/related/ebpf/components/NewTask.vue
+++ b/src/views/dashboard/related/ebpf/components/NewTask.vue
@@ -111,10 +111,6 @@ function changeType(opt: any[]) {
}
async function createTask() {
- if (!labels.value.length) {
- ElMessage.warning("no labels");
- return;
- }
const date = monitorTime.value === "0" ? new Date() : time.value;
const params = {
serviceId: selectorStore.currentService.id,