github/skywalking-booster-ui
2
0
Fork 1
mirror of https://github.com/apache/skywalking-booster-ui.git synced 2025-07-18 14:05:25 +00:00
Code Issues Packages Projects Releases Wiki Activity

add range time

Browse Source
This commit is contained in:
Qiuxia Fan 2022-05-18 19:37:00 +08:00
parent 9055e51e16
commit ae548c9201
2 changed files with 20 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/views/dashboard/related/ebpf/Content.vue
View File

@ -39,6 +39,8 @@ import EBPFStack from "./components/EBPFStack.vue";
.vis-graph { .vis-graph {
height: 100%; height: 100%;
width: calc(100% - 300px); width: calc(100% - 300px);
min-width: 700px;
overflow: auto;
} }
.item { .item {

34
src/views/dashboard/related/ebpf/components/EBPFSchedules.vue
View File

@ -13,7 +13,7 @@ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and See the License for the specific language governing permissions and
limitations under the License. --> limitations under the License. -->
<template> <template>
<div class="filters"> <div class="filters flex-h">
<Selector <Selector
:value="selectedLabels" :value="selectedLabels"
:options="labels" :options="labels"
@ -23,6 +23,11 @@ limitations under the License. -->
class="inputs mr-10" class="inputs mr-10"
:multiple="true" :multiple="true"
/> />
<el-button type="primary" size="small">
<span>{{ duration[0] }}</span>
<span> ~ </span>
<span>{{ duration[1] }}</span>
</el-button>
<el-popover placement="bottom" :width="680" trigger="click"> <el-popover placement="bottom" :width="680" trigger="click">
<template #reference> <template #reference>
<el-button type="primary" size="small"> <el-button type="primary" size="small">
@ -91,7 +96,6 @@ import { ElMessage, ElTable } from "element-plus";
const { t } = useI18n(); const { t } = useI18n();
const ebpfStore = useEbpfStore(); const ebpfStore = useEbpfStore();
const pageSize = 5; const pageSize = 5;
/*global Nullable */
const multipleTableRef = ref<InstanceType<typeof ElTable>>(); const multipleTableRef = ref<InstanceType<typeof ElTable>>();
const selectedProcesses = ref<string[]>([]); const selectedProcesses = ref<string[]>([]);
const labels = ref<Option[]>([{ label: "All", value: "0" }]); const labels = ref<Option[]>([{ label: "All", value: "0" }]);
@ -99,8 +103,9 @@ const processes = ref<Process[]>([]);
const currentProcesses = ref<Process[]>([]); const currentProcesses = ref<Process[]>([]);
const selectedLabels = ref<string[]>(["0"]); const selectedLabels = ref<string[]>(["0"]);
const searchText = ref<string>(""); const searchText = ref<string>("");
const duration = ref<string[]>([]);
const dateFormat = (date: number, pattern = "YYYY-MM-DD HH:mm:ss") => const dateFormat = (date: number, pattern = "YYYY-MM-DD HH:mm:ss") =>
new Date(dayjs(date).format(pattern)); dayjs(date).format(pattern);
function changeLabels(opt: any[]) { function changeLabels(opt: any[]) {
const arr = opt.map((d) => d.value); const arr = opt.map((d) => d.value);
@ -158,20 +163,17 @@ function visTimeline() {
labels.value = [{ label: "All", value: "0" }]; labels.value = [{ label: "All", value: "0" }];
selectedLabels.value = ["0"]; selectedLabels.value = ["0"];
processes.value = []; processes.value = [];
const schedules = ebpfStore.eBPFSchedules.map( const ranges = ebpfStore.eBPFSchedules.map((d: EBPFProfilingSchedule) => {
(d: EBPFProfilingSchedule, index: number) => { for (const l of d.process.labels) {
for (const l of d.process.labels) { labels.value.push({ label: l, value: l });
labels.value.push({ label: l, value: l });
}
processes.value.push(d.process);
return {
id: index + 1,
content: d.process.name,
start: dateFormat(d.startTime),
end: dateFormat(d.endTime),
};
} }
); processes.value.push(d.process);
return [d.startTime / 10000, d.endTime / 10000];
});
const arr = ranges.flat(1);
const min = Math.min(...arr);
const max = Math.max(...arr);
duration.value = [dateFormat(min * 10000), dateFormat(max * 10000)];
searchProcesses(0); searchProcesses(0);
} }