This commit is contained in:
Fine 2024-11-26 11:34:36 +08:00
parent f9b84ada01
commit 6fc0c89239
4 changed files with 15 additions and 12 deletions

View File

@ -82,13 +82,12 @@ export const asyncProfilingStore = defineStore({
this.taskProgress = res.data.data.taskProgress; this.taskProgress = res.data.data.taskProgress;
return res.data; return res.data;
}, },
async getServiceInstances(param?: { serviceId: string; isRelation: boolean }): Promise<Nullable<AxiosResponse>> { async getServiceInstances(param: { serviceId: string; isRelation: boolean }): Promise<Nullable<AxiosResponse>> {
const serviceId = param ? param.serviceId : this.currentService?.id; if (!param.serviceId) {
if (!serviceId) {
return null; return null;
} }
const res: AxiosResponse = await graphql.query("queryInstances").params({ const res: AxiosResponse = await graphql.query("queryInstances").params({
serviceId, serviceId: param.serviceId,
duration: useAppStoreWithOut().durationTime, duration: useAppStoreWithOut().durationTime,
}); });
if (!res.data.errors) { if (!res.data.errors) {

View File

@ -29,16 +29,18 @@ limitations under the License. -->
import { onMounted } from "vue"; import { onMounted } from "vue";
import { ElMessage } from "element-plus"; import { ElMessage } from "element-plus";
import { useAsyncProfilingStore } from "@/store/modules/async-profiling"; import { useAsyncProfilingStore } from "@/store/modules/async-profiling";
import { useSelectorStore } from "@/store/modules/selectors";
import TaskList from "./components/TaskList.vue"; import TaskList from "./components/TaskList.vue";
import Filter from "./components/Filter.vue"; import Filter from "./components/Filter.vue";
import EBPFStack from "@/views/dashboard/related/ebpf/components/EBPFStack.vue"; import EBPFStack from "@/views/dashboard/related/ebpf/components/EBPFStack.vue";
import { ComponentType } from "@/views/dashboard/related/ebpf/components/data"; import { ComponentType } from "@/views/dashboard/related/ebpf/components/data";
const asyncProfilingStore = useAsyncProfilingStore(); const asyncProfilingStore = useAsyncProfilingStore();
const selectorStore = useSelectorStore();
onMounted(async () => { onMounted(async () => {
const resp = await asyncProfilingStore.getServiceInstances(); const resp = await asyncProfilingStore.getServiceInstances({ serviceId: selectorStore.currentService.id });
if (resp.errors) { if (resp && resp.errors) {
ElMessage.error(resp.errors); ElMessage.error(resp.errors);
} }
}); });

View File

@ -19,6 +19,7 @@ limitations under the License. -->
style="width: 240px" style="width: 240px"
placeholder="Please input create time to search" placeholder="Please input create time to search"
@change="searchTasks()" @change="searchTasks()"
size="small"
> >
<template #append> <template #append>
<el-button size="small"> <el-button size="small">
@ -26,7 +27,7 @@ limitations under the License. -->
</el-button> </el-button>
</template> </template>
</el-input> </el-input>
<el-button class="search-btn ml-10" @click="createTask"> <el-button class="search-btn ml-10" size="small" @click="createTask">
{{ t("newTask") }} {{ t("newTask") }}
</el-button> </el-button>
</div> </div>

View File

@ -15,7 +15,7 @@ limitations under the License. -->
<template> <template>
<div class="flex-h"> <div class="flex-h">
<Selector <Selector
class="profile-input" class="filter-selector"
:multiple="true" :multiple="true"
:value="serviceInstanceIds" :value="serviceInstanceIds"
size="small" size="small"
@ -24,7 +24,7 @@ limitations under the License. -->
@change="changeInstances" @change="changeInstances"
/> />
<Selector <Selector
class="profile-input" class="filter-selector"
:value="selectedEventType" :value="selectedEventType"
size="small" size="small"
:options="eventTypes" :options="eventTypes"
@ -49,11 +49,11 @@ limitations under the License. -->
const serviceInstanceIds = ref<string[]>([]); const serviceInstanceIds = ref<string[]>([]);
const selectedEventType = ref<string>(""); const selectedEventType = ref<string>("");
const eventTypes = computed(() => const eventTypes = computed(() =>
(asyncProfilingStore.selectedTask.eventTypes || []).map((d: string) => ({ label: d, value: d })), (asyncProfilingStore.selectedTask.eventTypes ?? []).map((d: string) => ({ label: d, value: d })),
); );
const instances = computed(() => const instances = computed(() =>
asyncProfilingStore.instances.filter((d: Instance) => asyncProfilingStore.instances.filter((d: Instance) =>
asyncProfilingStore.selectedTask.serviceInstanceIds.includes(d.id), (asyncProfilingStore.selectedTask.serviceInstanceIds ?? []).includes(d.id),
), ),
); );
@ -78,7 +78,8 @@ limitations under the License. -->
} }
</script> </script>
<style> <style>
.profile-input { .filter-selector {
width: 300px; width: 300px;
margin-right: 10px;
} }
</style> </style>