diff --git a/frontend/src/views/workbench/homePage/components/overview.vue b/frontend/src/views/workbench/homePage/components/overview.vue
index ee61af2e21..6948e6fc07 100644
--- a/frontend/src/views/workbench/homePage/components/overview.vue
+++ b/frontend/src/views/workbench/homePage/components/overview.vue
@@ -37,7 +37,7 @@
-
+
@@ -67,7 +67,7 @@
} from '@/models/workbench/homePage';
import { WorkCardEnum } from '@/enums/workbenchEnum';
- import { getColorScheme, getSeriesData } from '../utils';
+ import { createCustomTooltip, getColorScheme, getSeriesData } from '../utils';
const { t } = useI18n();
@@ -176,6 +176,7 @@
});
}
}
+ const chartRef = ref>();
async function handleRefreshKeyChange() {
await nextTick(() => {
@@ -187,8 +188,15 @@
}, 0);
}
- onMounted(() => {
- initOverViewDetail();
+ onMounted(async () => {
+ await initOverViewDetail();
+
+ setTimeout(() => {
+ const chartDom = chartRef.value?.chartRef;
+ if (chartDom && chartDom.chart) {
+ createCustomTooltip(chartDom);
+ }
+ }, 0);
});
watch(
diff --git a/frontend/src/views/workbench/homePage/components/overviewMember.vue b/frontend/src/views/workbench/homePage/components/overviewMember.vue
index d4e3c98e6c..2695c634b8 100644
--- a/frontend/src/views/workbench/homePage/components/overviewMember.vue
+++ b/frontend/src/views/workbench/homePage/components/overviewMember.vue
@@ -37,7 +37,7 @@
-
+
@@ -60,7 +60,7 @@
import type { SelectedCardItem, TimeFormParams } from '@/models/workbench/homePage';
- import { getColorScheme, getSeriesData } from '../utils';
+ import { createCustomTooltip, getColorScheme, getSeriesData } from '../utils';
const { t } = useI18n();
const appStore = useAppStore();
@@ -132,6 +132,7 @@
value: e.id,
}));
}
+ const chartRef = ref>();
async function handleProjectChange(isRefreshKey: boolean = false, setAll = false) {
await nextTick();
@@ -146,7 +147,14 @@
}
}
await nextTick();
- initOverViewMemberDetail();
+ await initOverViewMemberDetail();
+
+ setTimeout(() => {
+ const chartDom = chartRef.value?.chartRef;
+ if (chartDom && chartDom.chart) {
+ createCustomTooltip(chartDom);
+ }
+ }, 0);
}
async function changeProject() {
diff --git a/frontend/src/views/workbench/homePage/components/testPlanOverview.vue b/frontend/src/views/workbench/homePage/components/testPlanOverview.vue
index eee48e42e0..934205c57f 100644
--- a/frontend/src/views/workbench/homePage/components/testPlanOverview.vue
+++ b/frontend/src/views/workbench/homePage/components/testPlanOverview.vue
@@ -6,36 +6,41 @@
{{ t(props.item.label) }}
-
-
+
-
-
-
+
+
+
{{ labelPath }}
-
-
- {{ t(data.label) }}
-
-
+
+
+
+ {{ t(data.label) }}
+
+
+
@@ -81,7 +86,7 @@
-
+
@@ -110,7 +115,7 @@
import { TestPlanStatusEnum } from '@/enums/testPlanEnum';
import { WorkOverviewEnum, WorkOverviewIconEnum } from '@/enums/workbenchEnum';
- import { getSeriesData } from '../utils';
+ import { createCustomTooltip, getSeriesData } from '../utils';
const { t } = useI18n();
@@ -152,6 +157,7 @@
const options = ref>({});
const hasPermission = ref(false);
+ const chartRef = ref>();
const contentTabList: ModuleCardItem[] = [
{
@@ -205,7 +211,10 @@
},
];
+ const selectValue = ref([]);
+
const detail = ref();
+
const execOptions = ref>({
...commonRatePieOptions,
title: {
@@ -241,7 +250,6 @@
const totalCount = detail.value?.caseCountMap?.totalCount ?? 0;
const executeCount = detail.value?.caseCountMap?.executeCount ?? 0;
-
const executeData = [
{
name: t('common.executed'),
@@ -312,32 +320,36 @@
}
});
- const labelPath = ref('');
+ const labelPath = ref();
const projectOptions = ref<{ value: string; label: string }[]>([]);
+ const childrenData = ref>({});
function getLabelPath(id: string) {
- const modules = findNodePathByKey(projectOptions.value, id, undefined, 'value');
+ const [newProjectId] = innerProjectIds.value;
+ const projectName = projectOptions.value.find((e) => e.value === newProjectId)?.label;
+
+ const treeList = childrenData.value[newProjectId];
+
+ const modules = findNodePathByKey(treeList, id, undefined, 'value');
if (modules) {
const moduleName = (modules || [])?.treePath.map((item: any) => item.label);
if (moduleName.length === 1) {
- return moduleName[0];
+ return `${projectName}/${moduleName[0]}`;
}
- return `${moduleName.join(' / ')}`;
+ return `${projectName}/${moduleName.join(' / ')}`;
}
}
async function changeHandler(value: string) {
- innerPlanId.value = value;
+ innerPlanId.value = value[value.length - 1];
+ innerProjectIds.value = [value[0]];
+ await nextTick();
labelPath.value = getLabelPath(innerPlanId.value);
initOverViewDetail();
emit('change');
}
- onMounted(() => {
- initOverViewDetail();
- });
-
async function loadMore(option: CascaderOption, done: (children?: CascaderOption[]) => void) {
try {
let testPlanOptionsNode = await getWorkTestPlanListUrl(option.value as string);
@@ -350,36 +362,38 @@
});
done(testPlanOptionsNode);
- projectOptions.value = projectOptions.value.map((item) => {
- return {
- ...item,
- children: testPlanOptionsNode,
- };
- });
+ childrenData.value[option.value as string] = testPlanOptionsNode;
+ labelPath.value = getLabelPath(innerPlanId.value);
} catch (error) {
// eslint-disable-next-line no-console
console.log(error);
}
}
- let loadingProjectId: string | null = null;
-
- function refreshHandler(newProjectId: string) {
+ async function refreshHandler(newProjectId: string) {
const cascaderOption = projectOptions.value.find((e) => e.value === newProjectId);
if (cascaderOption) {
- loadMore(cascaderOption, (children) => {
+ loadMore(cascaderOption, (_children) => {
+ childrenData.value[cascaderOption.value as string] = _children?.length ? _children : [];
projectOptions.value = projectOptions.value.map((item) => {
return {
...item,
- children: cascaderOption.value === item.value ? children : [],
+ children: childrenData.value[item.value]?.length ? childrenData.value[item.value] : null,
+ isLeaf: false,
};
});
-
- labelPath.value = getLabelPath(innerPlanId.value);
});
}
- initOverViewDetail();
+
+ await initOverViewDetail();
+
+ setTimeout(() => {
+ const chartDom = chartRef.value?.chartRef;
+ if (chartDom && chartDom.chart) {
+ createCustomTooltip(chartDom);
+ }
+ }, 0);
}
async function handleRefreshKeyChange() {
@@ -392,21 +406,17 @@
labelPath.value = getLabelPath(innerPlanId.value);
}
- watch(
- () => props.item.projectIds,
- async (val) => {
- if (val) {
- const [newProjectId] = val;
- projectOptions.value = appStore.projectList.map((e) => ({ value: e.id, label: e.name }));
+ const defaultValue = computed(() => {
+ const [newProjectId] = innerProjectIds.value;
+ return [newProjectId, innerPlanId.value];
+ });
- if (loadingProjectId !== newProjectId) {
- loadingProjectId = newProjectId;
- refreshHandler(newProjectId);
- }
- }
- },
- { immediate: true }
- );
+ onMounted(() => {
+ projectOptions.value = appStore.projectList.map((e) => ({ value: e.id, label: e.name }));
+ const [newProjectId] = props.item.projectIds;
+ selectValue.value = [newProjectId, props.item.planId];
+ refreshHandler(newProjectId);
+ });
watch(
() => timeForm.value,
@@ -457,6 +467,11 @@
@apply flex flex-col justify-center;
}
}
+ .cascader-wrapper-self {
+ :deep(.arco-trigger-position-bl) {
+ transform: translateX(-8%);
+ }
+ }