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

refactor task list

Browse Source
This commit is contained in:
Qiuxia Fan 2022-08-04 15:04:02 +08:00
parent f2c987370d
commit 93b76e7762
2 changed files with 19 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/store/modules/ebpf.ts
View File

@ -135,17 +135,19 @@ export const ebpfStore = defineStore({
return res.data; return res.data;
} }
this.networkTasks = res.data.data.queryEBPFTasks || []; this.networkTasks = res.data.data.queryEBPFTasks || [];
this.selectedNetworkTask = this.networkTasks[0] || {};
this.setSelectedNetworkTask(this.selectedNetworkTask);
if (!this.networkTasks.length) { if (!this.networkTasks.length) {
return res.data; return res.data;
} }
this.selectedNetworkTask = this.networkTasks[0] || {};
this.setSelectedNetworkTask(this.selectedNetworkTask);
} else { } else {
this.tip = ""; this.tip = "";
if (res.data.errors) { if (res.data.errors) {
return res.data; return res.data;
} }
this.taskList = res.data.data.queryEBPFTasks || []; this.taskList = res.data.data.queryEBPFTasks || [];
this.selectedTask = this.taskList[0] || {};
this.setSelectedTask(this.selectedTask);
if (!this.taskList.length) { if (!this.taskList.length) {
return res.data; return res.data;
} }

33
src/views/dashboard/related/ebpf/components/TaskList.vue
View File

@ -30,7 +30,7 @@ limitations under the License. -->
<td <td
class="profile-td" class="profile-td"
:class="{ :class="{
selected: selectedTask.taskId === i.taskId, selected: ebpfStore.selectedTask.taskId === i.taskId,
}" }"
> >
<div class="ell"> <div class="ell">
@ -73,45 +73,51 @@ limitations under the License. -->
<div class="mb-10 clear item"> <div class="mb-10 clear item">
<span class="g-sm-4 grey">{{ t("taskId") }}:</span> <span class="g-sm-4 grey">{{ t("taskId") }}:</span>
<span class="g-sm-8 wba"> <span class="g-sm-8 wba">
{{ selectedTask.taskId }} {{ ebpfStore.selectedTask.taskId }}
</span> </span>
</div> </div>
<div class="mb-10 clear item"> <div class="mb-10 clear item">
<span class="g-sm-4 grey">{{ t("service") }}:</span> <span class="g-sm-4 grey">{{ t("service") }}:</span>
<span class="g-sm-8 wba">{{ selectedTask.serviceName }}</span> <span class="g-sm-8 wba">{{
ebpfStore.selectedTask.serviceName
}}</span>
</div> </div>
<div class="mb-10 clear item"> <div class="mb-10 clear item">
<span class="g-sm-4 grey">{{ t("labels") }}:</span> <span class="g-sm-4 grey">{{ t("labels") }}:</span>
<span class="g-sm-8 wba"> <span class="g-sm-8 wba">
{{ selectedTask.processLabels.join(";") }} {{ ebpfStore.selectedTask.processLabels.join(";") }}
</span> </span>
</div> </div>
<div class="mb-10 clear item"> <div class="mb-10 clear item">
<span class="g-sm-4 grey">{{ t("monitorTime") }}:</span> <span class="g-sm-4 grey">{{ t("monitorTime") }}:</span>
<span class="g-sm-8 wba"> <span class="g-sm-8 wba">
{{ dateFormat(selectedTask.taskStartTime) }} {{ dateFormat(ebpfStore.selectedTask.taskStartTime) }}
</span> </span>
</div> </div>
<div class="mb-10 clear item"> <div class="mb-10 clear item">
<span class="g-sm-4 grey">{{ t("monitorDuration") }}:</span> <span class="g-sm-4 grey">{{ t("monitorDuration") }}:</span>
<span class="g-sm-8 wba"> <span class="g-sm-8 wba">
{{ selectedTask.fixedTriggerDuration / 60 }} min {{ ebpfStore.selectedTask.fixedTriggerDuration / 60 }} min
</span> </span>
</div> </div>
<div class="mb-10 clear item"> <div class="mb-10 clear item">
<span class="g-sm-4 grey">{{ t("triggerType") }}:</span> <span class="g-sm-4 grey">{{ t("triggerType") }}:</span>
<span class="g-sm-8 wba">{{ selectedTask.triggerType }}</span> <span class="g-sm-8 wba">{{
ebpfStore.selectedTask.triggerType
}}</span>
</div> </div>
<div class="mb-10 clear item"> <div class="mb-10 clear item">
<span class="g-sm-4 grey">{{ t("targetType") }}:</span> <span class="g-sm-4 grey">{{ t("targetType") }}:</span>
<span class="g-sm-8 wba">{{ selectedTask.targetType }}</span> <span class="g-sm-8 wba">{{
ebpfStore.selectedTask.targetType
}}</span>
</div> </div>
</div> </div>
</div> </div>
</el-dialog> </el-dialog>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { ref, watch } from "vue"; import { ref } from "vue";
import dayjs from "dayjs"; import dayjs from "dayjs";
import { useI18n } from "vue-i18n"; import { useI18n } from "vue-i18n";
import { useEbpfStore } from "@/store/modules/ebpf"; import { useEbpfStore } from "@/store/modules/ebpf";
@ -122,11 +128,9 @@ const { t } = useI18n();
const ebpfStore = useEbpfStore(); const ebpfStore = useEbpfStore();
const dateFormat = (date: number, pattern = "YYYY-MM-DD HH:mm:ss") => const dateFormat = (date: number, pattern = "YYYY-MM-DD HH:mm:ss") =>
dayjs(date).format(pattern); dayjs(date).format(pattern);
const selectedTask = ref<EBPFTaskList | Record<string, never>>({});
const viewDetail = ref<boolean>(false); const viewDetail = ref<boolean>(false);
async function changeTask(item: EBPFTaskList) { async function changeTask(item: EBPFTaskList) {
selectedTask.value = item;
ebpfStore.setSelectedTask(item); ebpfStore.setSelectedTask(item);
const res = await ebpfStore.getEBPFSchedules({ const res = await ebpfStore.getEBPFSchedules({
taskId: item.taskId, taskId: item.taskId,
@ -135,13 +139,6 @@ async function changeTask(item: EBPFTaskList) {
ElMessage.error(res.errors); ElMessage.error(res.errors);
} }
} }
watch(
() => ebpfStore.taskList,
() => {
selectedTask.value = ebpfStore.taskList[0] || {};
ebpfStore.setSelectedTask(selectedTask.value);
}
);
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.profile-task-list { .profile-task-list {