fix: KPI总览无数据时展示title
This commit is contained in:
@@ -240,27 +240,33 @@ const statsColumns: TableColumnType<any>[] = [
|
||||
title: t('views.perfManage.kpiOverView.kpiName'),
|
||||
dataIndex: 'title',
|
||||
key: 'title',
|
||||
width: '65%',
|
||||
},
|
||||
{
|
||||
title: t('views.perfManage.kpiOverView.avgValue'),
|
||||
dataIndex: 'avg',
|
||||
key: 'avg',
|
||||
width: '24%',
|
||||
sortDirections: ['ascend', 'descend'],
|
||||
},
|
||||
// {
|
||||
// title: t('views.perfManage.kpiOverView.totalValue'),
|
||||
// dataIndex: 'total',
|
||||
// key: 'total',
|
||||
// width: '12%',
|
||||
// sortDirections: ['ascend', 'descend'],
|
||||
// },
|
||||
// {
|
||||
// title: t('views.perfManage.kpiOverView.avgValue'),
|
||||
// dataIndex: 'avg',
|
||||
// key: 'avg',
|
||||
// width: '24%',
|
||||
// sortDirections: ['ascend', 'descend'],
|
||||
// },
|
||||
{
|
||||
title: t('views.perfManage.kpiOverView.maxValue'),
|
||||
dataIndex: 'max',
|
||||
key: 'max',
|
||||
width: '17%',
|
||||
width: '200px',
|
||||
sortDirections: ['ascend', 'descend'],
|
||||
},
|
||||
{
|
||||
title: t('views.perfManage.kpiOverView.minValue'),
|
||||
dataIndex: 'min',
|
||||
key: 'min',
|
||||
width: '17%',
|
||||
width: '200px',
|
||||
sortDirections: ['ascend', 'descend'],
|
||||
},
|
||||
];
|
||||
@@ -356,6 +362,7 @@ function fnGetListTitle() {
|
||||
dataIndex: kpiValue,
|
||||
align: 'left',
|
||||
key: kpiValue,
|
||||
unit: item[`unit`],
|
||||
resizable: true,
|
||||
width: 100,
|
||||
minWidth: 150,
|
||||
@@ -416,8 +423,8 @@ function fnGetList() {
|
||||
duration: 2,
|
||||
});
|
||||
tableState.data = [];
|
||||
tableColumns.value = [];
|
||||
tableColumnsDnd.value = [];
|
||||
// tableColumns.value = [];
|
||||
// tableColumnsDnd.value = [];
|
||||
kpiStats.value = []; //清空数据
|
||||
fnRanderChartData();
|
||||
return false;
|
||||
@@ -448,16 +455,37 @@ function fnGetList() {
|
||||
const total = Number(
|
||||
values.reduce((sum, val) => sum + val, 0).toFixed(2)
|
||||
);
|
||||
|
||||
// 计算平均值
|
||||
const avg =
|
||||
values.length > 0 ? Number((total / values.length).toFixed(2)) : 0;
|
||||
kpiStats.value.push({
|
||||
kpiId: columns.key,
|
||||
title: columns.title,
|
||||
unit: columns.unit,
|
||||
max: values.length > 0 ? Math.max(...values) : 0,
|
||||
min: values.length > 0 ? Math.min(...values) : 0,
|
||||
avg,
|
||||
total: total,
|
||||
});
|
||||
}
|
||||
} else {
|
||||
kpiStats.value = [];
|
||||
for (const columns of tableColumns.value) {
|
||||
if (
|
||||
columns.key === 'neName' ||
|
||||
columns.key === 'startIndex' ||
|
||||
columns.key === 'timeGroup'
|
||||
) {
|
||||
continue;
|
||||
}
|
||||
kpiStats.value.push({
|
||||
kpiId: columns.key,
|
||||
title: columns.title,
|
||||
unit: columns.unit,
|
||||
max: 0,
|
||||
min: 0,
|
||||
avg: 0,
|
||||
total: 0,
|
||||
});
|
||||
}
|
||||
}
|
||||
@@ -606,7 +634,7 @@ function fnRanderChartData() {
|
||||
|
||||
for (const item of orgData) {
|
||||
const keys = Object.keys(item);
|
||||
//console.log(keys,item);//
|
||||
//console.log(keys,item);
|
||||
for (const y of chartDataYSeriesData) {
|
||||
for (const key of keys) {
|
||||
if (y.key === key) {
|
||||
@@ -744,6 +772,7 @@ function wsMessage(res: Record<string, any>) {
|
||||
// 添加一个变量来跟踪当前选中的行
|
||||
const selectedRow = ref<string[]>([]);
|
||||
|
||||
const selectedUnit = ref<string | null>(null);
|
||||
// 添加处理行点击的方法
|
||||
function handleRowClick(record: any) {
|
||||
const index = selectedRow.value.indexOf(record.kpiId);
|
||||
@@ -752,17 +781,33 @@ function handleRowClick(record: any) {
|
||||
if (index > -1) {
|
||||
selectedRow.value.splice(index, 1);
|
||||
chartLegendSelected[record.title] = false;
|
||||
// 如果取消选中的是最后一个,重置 selectedUnit
|
||||
if (selectedRow.value.length === 0) {
|
||||
selectedUnit.value = null;
|
||||
}
|
||||
} else {
|
||||
// 检查单位是否一致
|
||||
if (selectedUnit.value && selectedUnit.value !== record.unit) {
|
||||
message.error(
|
||||
`${t('views.perfManage.customTarget.unitSelect')} ${selectedUnit.value}`
|
||||
);
|
||||
return;
|
||||
}
|
||||
|
||||
// 添加新的选中项
|
||||
selectedRow.value.push(record.kpiId);
|
||||
|
||||
// 设置选中的单位
|
||||
if (!selectedUnit.value) {
|
||||
selectedUnit.value = record.unit;
|
||||
}
|
||||
|
||||
// 如果只有一个选中项,重置为 false
|
||||
if (selectedRow.value.length === 1) {
|
||||
Object.keys(chartLegendSelected).forEach(key => {
|
||||
chartLegendSelected[key] = false;
|
||||
});
|
||||
}
|
||||
|
||||
chartLegendSelected[record.title] = true;
|
||||
}
|
||||
|
||||
@@ -928,6 +973,7 @@ onBeforeUnmount(() => {
|
||||
v-model:value="state.neType"
|
||||
:options="neCascaderOptions"
|
||||
:allow-clear="false"
|
||||
@change="fnGetListTitle()"
|
||||
:placeholder="t('common.selectPlease')"
|
||||
/>
|
||||
</a-form-item>
|
||||
@@ -1015,7 +1061,6 @@ onBeforeUnmount(() => {
|
||||
</a-tooltip>
|
||||
<TableColumnsDnd
|
||||
v-if="tableColumns.length > 0"
|
||||
:cache-id="`kpiTarget_${state.neType[0]}`"
|
||||
:columns="tableColumns"
|
||||
v-model:columns-dnd="tableColumnsDnd"
|
||||
></TableColumnsDnd>
|
||||
@@ -1103,7 +1148,7 @@ onBeforeUnmount(() => {
|
||||
|
||||
<div class="table-container">
|
||||
<a-table
|
||||
:columns="state.neType[0] !== 'UPF' ? statsColumns.filter(c => c.key !== 'total') : statsColumns"
|
||||
:columns="statsColumns"
|
||||
:data-source="kpiStats"
|
||||
:pagination="false"
|
||||
:scroll="{ y: 250 }"
|
||||
@@ -1169,6 +1214,14 @@ onBeforeUnmount(() => {
|
||||
</span>
|
||||
</template>
|
||||
</template>
|
||||
<template #bodyCell="{ column, record }">
|
||||
<template v-if="column.key === 'avg'">
|
||||
<span v-if="record.unit !== '%'">-</span>
|
||||
</template>
|
||||
<template v-if="column.key === 'total'">
|
||||
<span v-if="record.unit == '%'">-</span>
|
||||
</template>
|
||||
</template>
|
||||
</a-table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user