feat:黄金指标bytes改MB/GB
This commit is contained in:
@@ -288,6 +288,10 @@ const statsColumns: TableColumnType<any>[] = [
|
|||||||
if (value === '' || value === null || value === undefined) {
|
if (value === '' || value === null || value === undefined) {
|
||||||
return '';
|
return '';
|
||||||
}
|
}
|
||||||
|
// 检查是否为UPF字节类指标,需要进行格式化
|
||||||
|
if (isUPFBytesKpiId(record.rawKpiId)) {
|
||||||
|
return formatUPFBytesToMBGB(value);
|
||||||
|
}
|
||||||
// 黄金指标多为次数类,使用累计值
|
// 黄金指标多为次数类,使用累计值
|
||||||
return `${value} `;
|
return `${value} `;
|
||||||
},
|
},
|
||||||
@@ -304,6 +308,10 @@ const statsColumns: TableColumnType<any>[] = [
|
|||||||
if (value === '' || value === null || value === undefined) {
|
if (value === '' || value === null || value === undefined) {
|
||||||
return '';
|
return '';
|
||||||
}
|
}
|
||||||
|
// 检查是否为UPF字节类指标,需要进行格式化
|
||||||
|
if (isUPFBytesKpiId(record.rawKpiId)) {
|
||||||
|
return formatUPFBytesToMBGB(value);
|
||||||
|
}
|
||||||
// 黄金指标多为次数类,使用累计值
|
// 黄金指标多为次数类,使用累计值
|
||||||
return `${value} `;
|
return `${value} `;
|
||||||
},
|
},
|
||||||
@@ -320,12 +328,47 @@ const statsColumns: TableColumnType<any>[] = [
|
|||||||
if (value === '' || value === null || value === undefined) {
|
if (value === '' || value === null || value === undefined) {
|
||||||
return '';
|
return '';
|
||||||
}
|
}
|
||||||
|
// 检查是否为UPF字节类指标,需要进行格式化
|
||||||
|
if (isUPFBytesKpiId(record.rawKpiId)) {
|
||||||
|
return formatUPFBytesToMBGB(value);
|
||||||
|
}
|
||||||
// 黄金指标多为次数类,使用累计值
|
// 黄金指标多为次数类,使用累计值
|
||||||
return `${value} `;
|
return `${value} `;
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 判断指标是否需要进行字节格式化
|
||||||
|
* @param rawKpiId 原始指标ID
|
||||||
|
* @returns boolean
|
||||||
|
*/
|
||||||
|
function isUPFBytesKpiId(rawKpiId: string): boolean {
|
||||||
|
const bytesKpiIds = ['UPF.03', 'UPF.04', 'UPF.05', 'UPF.06'];
|
||||||
|
return bytesKpiIds.includes(rawKpiId);
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* UPF字节数据格式化,只显示MB和GB两个级别
|
||||||
|
* @param bytes 字节数
|
||||||
|
* @returns 格式化后的字符串
|
||||||
|
*/
|
||||||
|
function formatUPFBytesToMBGB(bytes: number | string): string {
|
||||||
|
const byteValue = Number(bytes) || 0;
|
||||||
|
if (byteValue <= 0) return '0 MB';
|
||||||
|
|
||||||
|
const MB = 1024 * 1024;
|
||||||
|
const GB = 1024 * 1024 * 1024;
|
||||||
|
|
||||||
|
if (byteValue >= GB) {
|
||||||
|
// 大于等于1GB,显示为GB
|
||||||
|
return `${(byteValue / GB).toFixed(2)} GB`;
|
||||||
|
} else {
|
||||||
|
// 小于1GB的都显示为MB(包括KB级别的数据)
|
||||||
|
return `${(byteValue / MB).toFixed(2)} MB`;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
/**初始化黄金指标统计表格数据 */
|
/**初始化黄金指标统计表格数据 */
|
||||||
function fnInitGoldStatsData() {
|
function fnInitGoldStatsData() {
|
||||||
// 先初始化表格,显示指标×网元的列表和默认值
|
// 先初始化表格,显示指标×网元的列表和默认值
|
||||||
@@ -1058,6 +1101,37 @@ function fnRanderChart() {
|
|||||||
? '#CACADA'
|
? '#CACADA'
|
||||||
: '#333',
|
: '#333',
|
||||||
},
|
},
|
||||||
|
formatter: (params: any) => {
|
||||||
|
if (!params || params.length === 0) return '';
|
||||||
|
|
||||||
|
let result = `<div>${params[0].name}</div>`;
|
||||||
|
params.forEach((item: any) => {
|
||||||
|
// 从系列名称中提取rawKpiId
|
||||||
|
const seriesName = item.seriesName;
|
||||||
|
// 解析系列名称,获取指标标题和网元名称
|
||||||
|
const match = seriesName.match(/^(.+)\((.+)\)$/);
|
||||||
|
if (match) {
|
||||||
|
const kpiTitle = match[1];
|
||||||
|
// 通过kpiTitle查找对应的rawKpiId
|
||||||
|
const kpiColumn = tableColumns.value.find((col: any) => col.title === kpiTitle);
|
||||||
|
const rawKpiId = kpiColumn ? kpiColumn.key : '';
|
||||||
|
|
||||||
|
// 格式化数值
|
||||||
|
let formattedValue = item.value;
|
||||||
|
if (isUPFBytesKpiId(rawKpiId) && typeof item.value === 'number') {
|
||||||
|
formattedValue = formatUPFBytesToMBGB(item.value);
|
||||||
|
} else {
|
||||||
|
formattedValue = item.value;
|
||||||
|
}
|
||||||
|
|
||||||
|
result += `<div>${item.marker} ${seriesName}: ${formattedValue}</div>`;
|
||||||
|
} else {
|
||||||
|
result += `<div>${item.marker} ${seriesName}: ${item.value}</div>`;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
return result;
|
||||||
|
},
|
||||||
},
|
},
|
||||||
xAxis: {
|
xAxis: {
|
||||||
//x类别轴
|
//x类别轴
|
||||||
@@ -1436,6 +1510,37 @@ watch(
|
|||||||
textStyle: {
|
textStyle: {
|
||||||
color: newValue === 'dark' ? '#CACADA' : '#333',
|
color: newValue === 'dark' ? '#CACADA' : '#333',
|
||||||
},
|
},
|
||||||
|
formatter: (params: any) => {
|
||||||
|
if (!params || params.length === 0) return '';
|
||||||
|
|
||||||
|
let result = `<div>${params[0].name}</div>`;
|
||||||
|
params.forEach((item: any) => {
|
||||||
|
// 从系列名称中提取rawKpiId
|
||||||
|
const seriesName = item.seriesName;
|
||||||
|
// 解析系列名称,获取指标标题和网元名称
|
||||||
|
const match = seriesName.match(/^(.+)\((.+)\)$/);
|
||||||
|
if (match) {
|
||||||
|
const kpiTitle = match[1];
|
||||||
|
// 通过kpiTitle查找对应的rawKpiId
|
||||||
|
const kpiColumn = tableColumns.value.find((col: any) => col.title === kpiTitle);
|
||||||
|
const rawKpiId = kpiColumn ? kpiColumn.key : '';
|
||||||
|
|
||||||
|
// 格式化数值
|
||||||
|
let formattedValue = item.value;
|
||||||
|
if (isUPFBytesKpiId(rawKpiId) && typeof item.value === 'number') {
|
||||||
|
formattedValue = formatUPFBytesToMBGB(item.value);
|
||||||
|
} else {
|
||||||
|
formattedValue = item.value;
|
||||||
|
}
|
||||||
|
|
||||||
|
result += `<div>${item.marker} ${seriesName}: ${formattedValue}</div>`;
|
||||||
|
} else {
|
||||||
|
result += `<div>${item.marker} ${seriesName}: ${item.value}</div>`;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
return result;
|
||||||
|
},
|
||||||
},
|
},
|
||||||
xAxis: {
|
xAxis: {
|
||||||
axisLabel: {
|
axisLabel: {
|
||||||
|
|||||||
Reference in New Issue
Block a user