fix(工作台): 修复工作台首页成员概览展示&饼图bug

This commit is contained in:
xinxin.wu 2024-11-19 17:13:51 +08:00 committed by Craftsman
parent a9e6c8a0ed
commit 7ffdb5f3c9
6 changed files with 65 additions and 39 deletions

View File

@ -1,6 +1,7 @@
import { cloneDeep } from 'lodash-es'; import { cloneDeep } from 'lodash-es';
import { commonConfig, toolTipConfig } from '@/config/testPlan'; import { commonConfig, toolTipConfig } from '@/config/testPlan';
import { addCommasToNumber } from '@/utils';
import type { ModuleCardItem } from '@/models/workbench/homePage'; import type { ModuleCardItem } from '@/models/workbench/homePage';
import { WorkCardEnum, WorkOverviewEnum, WorkOverviewIconEnum } from '@/enums/workbenchEnum'; import { WorkCardEnum, WorkOverviewEnum, WorkOverviewIconEnum } from '@/enums/workbenchEnum';
@ -193,7 +194,7 @@ export const defaultValueMap: Record<string, any> = {
[WorkCardEnum.PLAN_LEGACY_BUG]: { [WorkCardEnum.PLAN_LEGACY_BUG]: {
legacy: { legacy: {
defaultList: cloneDeep(defaultLegacy), defaultList: cloneDeep(defaultLegacy),
color: ['#D4D4D8', '#00C261'], color: ['#00C261', '#D4D4D8'],
defaultName: 'workbench.homePage.legacyRate', defaultName: 'workbench.homePage.legacyRate',
}, },
}, },
@ -201,7 +202,7 @@ export const defaultValueMap: Record<string, any> = {
[WorkCardEnum.BUG_COUNT]: { [WorkCardEnum.BUG_COUNT]: {
legacy: { legacy: {
defaultList: cloneDeep(defaultLegacy), defaultList: cloneDeep(defaultLegacy),
color: ['#D4D4D8', '#00C261'], color: ['#00C261', '#D4D4D8'],
defaultName: 'workbench.homePage.legacyRate', defaultName: 'workbench.homePage.legacyRate',
}, },
}, },
@ -209,7 +210,7 @@ export const defaultValueMap: Record<string, any> = {
[WorkCardEnum.HANDLE_BUG_BY_ME]: { [WorkCardEnum.HANDLE_BUG_BY_ME]: {
legacy: { legacy: {
defaultList: cloneDeep(defaultLegacy), defaultList: cloneDeep(defaultLegacy),
color: ['#D4D4D8', '#00C261'], color: ['#00C261', '#D4D4D8'],
defaultName: 'workbench.homePage.legacyRate', defaultName: 'workbench.homePage.legacyRate',
}, },
}, },
@ -230,7 +231,7 @@ export const defaultValueMap: Record<string, any> = {
[WorkCardEnum.CREATE_BUG_BY_ME]: { [WorkCardEnum.CREATE_BUG_BY_ME]: {
legacy: { legacy: {
defaultList: cloneDeep(defaultLegacy), defaultList: cloneDeep(defaultLegacy),
color: ['#D4D4D8', '#00C261'], color: ['#00C261', '#D4D4D8'],
defaultName: 'workbench.homePage.legacyRate', defaultName: 'workbench.homePage.legacyRate',
}, },
}, },

View File

@ -133,12 +133,25 @@
countOptions.value = handlePieData(props.item.key, hasPermission.value, statusPercentList); countOptions.value = handlePieData(props.item.key, hasPermission.value, statusPercentList);
const { options, valueList } = handleUpdateTabPie( const [rate, totalBug, legacy] = statusStatisticsMap?.retentionRate || [];
statusStatisticsMap?.retentionRate || [],
hasPermission.value, const unLegacy = totalBug && legacy ? totalBug.count - legacy.count : 0;
`${props.item.key}-legacy`
); const unLegacyItem = { name: t('workbench.homePage.notLegacyDefectsNumber'), count: unLegacy };
legacyValueList.value = valueList;
const legacyData = [rate, legacy, unLegacyItem];
const { options, valueList } = handleUpdateTabPie(legacyData, hasPermission.value, `${props.item.key}-legacy`);
legacyValueList.value = hasPermission.value
? (statusStatisticsMap?.retentionRate || []).slice(1).map((item) => {
return {
value: item.count,
label: item.name,
name: item.name,
};
})
: valueList;
legacyOptions.value = options; legacyOptions.value = options;
} catch (error) { } catch (error) {
// eslint-disable-next-line no-console // eslint-disable-next-line no-console

View File

@ -48,7 +48,7 @@
import MsChart from '@/components/pure/chart/index.vue'; import MsChart from '@/components/pure/chart/index.vue';
import MsSelect from '@/components/business/ms-select'; import MsSelect from '@/components/business/ms-select';
import { getProjectOptions } from '@/api/modules/project-management/projectMember'; import { getProjectMemberOptions } from '@/api/modules/project-management/projectMember';
import { workMemberViewDetail } from '@/api/modules/workbench'; import { workMemberViewDetail } from '@/api/modules/workbench';
import { contentTabList } from '@/config/workbench'; import { contentTabList } from '@/config/workbench';
import { useI18n } from '@/hooks/useI18n'; import { useI18n } from '@/hooks/useI18n';
@ -100,43 +100,48 @@
options.value.graphic.style.text = text; options.value.graphic.style.text = text;
options.value.xAxis.data = detail.xaxis.map((e) => characterLimit(e, 10)); options.value.xAxis.data = detail.xaxis.map((e) => characterLimit(e, 10));
const rawData: number[][] = []; let maxAxis = 5;
detail.projectCountList.forEach((item: any) => {
rawData.push(item.count);
});
const totalData: number[] = [];
for (let i = 0; i < rawData[0].length; ++i) {
let sum = 0;
for (let j = 0; j < rawData.length; ++j) {
sum += rawData[j][i];
}
totalData.push(sum);
}
// data
options.value.series = detail.projectCountList.map((item, sid) => { options.value.series = detail.projectCountList.map((item, sid) => {
const dataList = rawData[sid].map((d, did) => (totalData[did] <= 0 ? 0 : d / totalData[did])); const countData: Record<string, any>[] = item.count.map((e) => {
const data = dataList.map((e, i) => {
return { return {
name: t(contentTabList[sid].label), name: item.name,
value: e, value: e,
originValue: item.count[i], originValue: e,
}; };
}); });
const itemMax = Math.max(...item.count);
maxAxis = Math.max(itemMax, maxAxis);
return { return {
name: t(contentTabList[sid].label), name: t(contentTabList[sid].label),
type: 'bar', type: 'bar',
stack: 'total',
barWidth: 12, barWidth: 12,
legendHoverLink: true,
large: true,
itemStyle: { itemStyle: {
borderRadius: [2, 2, 0, 0], borderRadius: [2, 2, 0, 0],
}, },
data, data: countData,
barMinHeight: ((optionData: Record<string, any>[]) => {
optionData.forEach((itemValue: any, index: number) => {
if (itemValue.value === 0) optionData[index].value = null;
});
let hasZero = false;
for (let i = 0; i < optionData.length; i++) {
if (optionData[i].value === 0) {
hasZero = true;
break;
}
}
return hasZero ? 0 : 5;
})(countData),
}; };
}); });
options.value.yAxis[0].max = maxAxis < 100 ? 50 : maxAxis + 50;
} }
async function initOverViewMemberDetail() { async function initOverViewMemberDetail() {
@ -162,7 +167,7 @@
async function getMemberOptions() { async function getMemberOptions() {
const [newProjectId] = innerProjectIds.value; const [newProjectId] = innerProjectIds.value;
const res = await getProjectOptions(newProjectId); const res = await getProjectMemberOptions(newProjectId);
memberOptions.value = res.map((e: any) => ({ memberOptions.value = res.map((e: any) => ({
label: e.name, label: e.name,
value: e.id, value: e.id,
@ -227,9 +232,7 @@
); );
onMounted(() => { onMounted(() => {
if (appStore.projectList.length) { getMemberOptions();
getMemberOptions();
}
initOverViewMemberDetail(); initOverViewMemberDetail();
}); });
</script> </script>

View File

@ -45,6 +45,7 @@ export default {
'workbench.homePage.defectProcessingNumber': 'Statistics of defect handlers', 'workbench.homePage.defectProcessingNumber': 'Statistics of defect handlers',
'workbench.homePage.defectTotal': 'Total defect', 'workbench.homePage.defectTotal': 'Total defect',
'workbench.homePage.legacyDefectsNumber': 'Legacy defects number', 'workbench.homePage.legacyDefectsNumber': 'Legacy defects number',
'workbench.homePage.notLegacyDefectsNumber': 'Completed defect count',
'workbench.homePage.createdBugByMe': 'My created defects', 'workbench.homePage.createdBugByMe': 'My created defects',
'workbench.homePage.remainingBugOfPlan': 'Number of remaining program defects', 'workbench.homePage.remainingBugOfPlan': 'Number of remaining program defects',
'workbench.homePage.apiCount': 'Number of interfaces', 'workbench.homePage.apiCount': 'Number of interfaces',

View File

@ -45,6 +45,7 @@ export default {
'workbench.homePage.defectProcessingNumber': '缺陷处理人统计', 'workbench.homePage.defectProcessingNumber': '缺陷处理人统计',
'workbench.homePage.defectTotal': '缺陷总数', 'workbench.homePage.defectTotal': '缺陷总数',
'workbench.homePage.legacyDefectsNumber': '遗留缺陷数', 'workbench.homePage.legacyDefectsNumber': '遗留缺陷数',
'workbench.homePage.notLegacyDefectsNumber': '已完成缺陷数',
'workbench.homePage.createdBugByMe': '我创建的缺陷', 'workbench.homePage.createdBugByMe': '我创建的缺陷',
'workbench.homePage.remainingBugOfPlan': '计划遗留缺陷数', 'workbench.homePage.remainingBugOfPlan': '计划遗留缺陷数',
'workbench.homePage.apiCount': '接口数', 'workbench.homePage.apiCount': '接口数',

View File

@ -67,7 +67,7 @@ export const colorMapConfig: Record<string, string[]> = {
[WorkCardEnum.REVIEW_CASE_COUNT]: ['#D4D4D8', '#3370FF', '#00C261', '#ED0303', '#FFA200'], [WorkCardEnum.REVIEW_CASE_COUNT]: ['#D4D4D8', '#3370FF', '#00C261', '#ED0303', '#FFA200'],
[WorkCardEnum.TEST_PLAN_COUNT]: ['#9441B1', '#3370FF', '#00C261', '#D4D4D8'], [WorkCardEnum.TEST_PLAN_COUNT]: ['#9441B1', '#3370FF', '#00C261', '#D4D4D8'],
[WorkCardEnum.PLAN_LEGACY_BUG]: ['#9441B1', '#3370FF', '#00C261', '#D4D4D8'], [WorkCardEnum.PLAN_LEGACY_BUG]: ['#9441B1', '#3370FF', '#00C261', '#D4D4D8'],
[WorkCardEnum.BUG_COUNT]: ['#FFA200', '#D4D4D8', '#00C261'], [WorkCardEnum.BUG_COUNT]: ['#FFA200', '#3370FF', '#D4D4D8', '#00C261', ...getColorScheme(13)],
[WorkCardEnum.HANDLE_BUG_BY_ME]: ['#9441B1', '#3370FF', '#00C261', '#D4D4D8'], [WorkCardEnum.HANDLE_BUG_BY_ME]: ['#9441B1', '#3370FF', '#00C261', '#D4D4D8'],
[WorkCardEnum.CREATE_BY_ME]: ['#9441B1', '#3370FF', '#00C261', '#D4D4D8'], [WorkCardEnum.CREATE_BY_ME]: ['#9441B1', '#3370FF', '#00C261', '#D4D4D8'],
[WorkCardEnum.API_COUNT]: ['#811FA3', '#00C261', '#3370FF', '#FFA1FF', '#EE50A3', '#FF9964', '#F9F871', '#C3DD40'], [WorkCardEnum.API_COUNT]: ['#811FA3', '#00C261', '#3370FF', '#FFA1FF', '#EE50A3', '#FF9964', '#F9F871', '#C3DD40'],
@ -86,6 +86,9 @@ export function getCommonBarOptions(hasRoom: boolean, color: string[]): Record<s
width: 50, width: 50,
overflow: 'truncate', overflow: 'truncate',
}, },
showDelay: 0,
hideDelay: 100,
triggerOn: 'mousemove',
displayMode: 'single', displayMode: 'single',
enterable: true, enterable: true,
axisPointer: { axisPointer: {
@ -293,6 +296,7 @@ export function getPieCharOptions(key: WorkCardEnum, hasPermission: boolean) {
color: colorMapConfig[key], color: colorMapConfig[key],
tooltip: { tooltip: {
...toolTipConfig, ...toolTipConfig,
trigger: 'item',
position: 'right', position: 'right',
show: !!hasPermission, show: !!hasPermission,
}, },
@ -317,6 +321,9 @@ export function getPieCharOptions(key: WorkCardEnum, hasPermission: boolean) {
icon: 'circle', icon: 'circle',
bottom: 'center', bottom: 'center',
left: 180, left: 180,
tooltip: {
show: false, // 禁用图例的 tooltip
},
textStyle: { textStyle: {
color: '#333', color: '#333',
fontSize: 14, // 字体大小 fontSize: 14, // 字体大小
@ -520,7 +527,7 @@ export function handleUpdateTabPie(
name: item.name, name: item.name,
}; };
}); });
options.series.data = lastCountList; options.series.data = lastCountList.every((e) => e.value === 0) ? [] : lastCountList;
options.title.text = countList[0].name ?? ''; options.title.text = countList[0].name ?? '';
options.title.subtext = `${countList[0].count ?? 0}%`; options.title.subtext = `${countList[0].count ?? 0}%`;