fix: 页面字段/接口调整

This commit is contained in:
TsMask
2025-02-20 10:47:23 +08:00
parent 814bae0b94
commit 485fa89833
85 changed files with 1133 additions and 1792 deletions

View File

@@ -106,6 +106,12 @@ let tableColumns: ColumnsType = [
key: 'status',
align: 'left',
width: 100,
customRender: ({ text }) => {
if (text === '1') {
return 'Active';
}
return 'Inactive';
},
},
{
title: t('common.operate'),
@@ -190,13 +196,14 @@ function fnGetList(pageNum?: number) {
queryParams.pageNum = pageNum;
}
listCustom(toRaw(queryParams)).then(res => {
if (res.code === RESULT_CODE_SUCCESS && Array.isArray(res.data)) {
if (res.code === RESULT_CODE_SUCCESS) {
// 取消勾选
if (tableState.selectedRowKeys.length > 0) {
tableState.selectedRowKeys = [];
}
tablePagination.total = res.total;
tableState.data = res.data;
const { total, rows } = res.data;
tablePagination.total = total;
tableState.data = rows;
if (
tablePagination.total <=
@@ -247,7 +254,7 @@ let modalState: ModalStateType = reactive({
neType: 'UDM',
title: '',
expression: '',
status: 'Active',
status: '1',
unit: '',
description: '',
},
@@ -316,7 +323,7 @@ function fnSelectPerformanceInit(value: any) {
if (language === 'zh') language = 'cn';
// 获取表头文字
getKPITitle(value).then(res => {
if (res.code === RESULT_CODE_SUCCESS && Array.isArray(res.data)) {
if (res.code === RESULT_CODE_SUCCESS) {
for (const item of res.data) {
const kpiDisplay = item[`${language}Title`];
const kpiValue = item[`kpiId`];
@@ -622,12 +629,12 @@ onMounted(() => {
:options="[
{
label: t('views.perfManage.customTarget.active'),
value: 'Active',
value: '1',
tagType: 'success',
},
{
label: t('views.perfManage.customTarget.inactive'),
value: 'Inactive',
value: '0',
tagType: 'error',
},
]"
@@ -685,11 +692,11 @@ onMounted(() => {
:options="[
{
label: t('views.perfManage.customTarget.active'),
value: 'Active',
value: '1',
},
{
label: t('views.perfManage.customTarget.inactive'),
value: 'Inactive',
value: '0',
},
]"
:placeholder="t('common.selectPlease')"

View File

@@ -25,6 +25,7 @@ import {
h,
watch,
} from 'vue';
import dayjs, { Dayjs } from 'dayjs';
import { PageContainer } from 'antdv-pro-layout';
import { message, Modal, TableColumnType } from 'ant-design-vue/es';
import { SizeType } from 'ant-design-vue/es/config-provider';
@@ -61,14 +62,6 @@ echarts.use([
UniversalTransition,
]);
type EChartsOption = echarts.ComposeOption<
| TooltipComponentOption
| GridComponentOption
| LegendComponentOption
| DataZoomComponentOption
| LineSeriesOption
>;
/**图DOM节点实例对象 */
const kpiChartDom = ref<HTMLElement | undefined>(undefined);
@@ -78,8 +71,26 @@ const kpiChart = ref<any>(null);
/**网元参数 */
let neCascaderOptions = ref<Record<string, any>[]>([]);
/**记录开始结束时间 */
let queryRangePicker = ref<[string, string]>(['', '']);
/**开始结束时间 */
let queryRangePicker = ref<[Dayjs, Dayjs] | undefined>([
dayjs().startOf('hour'),
dayjs().endOf('hour'),
]);
/**时间范围 */
let rangePickerPresets = ref([
{
label: 'Now hour',
value: [dayjs().startOf('hour'), dayjs().endOf('hour')],
},
{ label: 'Today', value: [dayjs().startOf('day'), dayjs().endOf('day')] },
{
label: 'Yesterday',
value: [
dayjs().subtract(1, 'day').startOf('day'),
dayjs().subtract(1, 'day').endOf('day'),
],
},
]);
/**表格字段列 */
let tableColumns = ref<any[]>([]);
@@ -150,9 +161,9 @@ let queryParams: any = reactive({
/**颗粒度 */
interval: 900,
/**开始时间 */
startTime: '',
beginTime: undefined as undefined | number,
/**结束时间 */
endTime: '',
endTime: undefined as undefined | number,
/**排序字段 */
sortField: 'timeGroup',
/**排序方式 */
@@ -314,7 +325,7 @@ function fnGetListTitle() {
getKPITitle(state.neType[0])
.then(res => {
//处理getKPITitle返回的结果
if (res.code === RESULT_CODE_SUCCESS && Array.isArray(res.data)) {
if (res.code === RESULT_CODE_SUCCESS) {
//检查值
tableColumns.value = []; //设为空数组
const columns: any[] = []; //初始化,构建新表头
@@ -374,12 +385,23 @@ function fnGetList() {
tableState.loading = true;
queryParams.neType = state.neType[0];
queryParams.neId = state.neType[1];
queryParams.startTime = queryRangePicker.value[0];
queryParams.endTime = queryRangePicker.value[1];
// 时间范围
if (
Array.isArray(queryRangePicker.value) &&
queryRangePicker.value.length > 0
) {
queryParams.beginTime = queryRangePicker.value[0].valueOf();
queryParams.endTime = queryRangePicker.value[1].valueOf();
} else {
queryParams.beginTime = undefined;
queryParams.endTime = undefined;
}
listKPIData(toRaw(queryParams))
.then(res => {
tableState.loading = false;
if (res.code === RESULT_CODE_SUCCESS && Array.isArray(res.data)) {
if (res.code === RESULT_CODE_SUCCESS) {
tablePagination.total = res.data.length;
tableState.data = res.data;
@@ -804,7 +826,7 @@ onMounted(() => {
// 目前支持的 AMF AUSF MME MOCNGW NSSF SMF UDM UPF PCF
// 获取网元网元列表
neInfoStore.fnNelist().then(res => {
if (res.code === RESULT_CODE_SUCCESS && Array.isArray(res.data)) {
if (res.code === RESULT_CODE_SUCCESS) {
if (res.data.length > 0) {
// 过滤不可用的网元
neCascaderOptions.value = neInfoStore.getNeCascaderOptions.filter(
@@ -836,17 +858,6 @@ onMounted(() => {
queryParams.neId = info.neId;
}
// 查询当前小时
const now = new Date();
now.setMinutes(0, 0, 0);
// 设置起始时间为整点前一小时
const startTime = new Date(now);
startTime.setHours(now.getHours() - 1);
queryRangePicker.value[0] = `${startTime.getTime()}`;
// 设置结束时间为整点
const endTime = new Date(now);
endTime.setMinutes(59, 59, 59);
queryRangePicker.value[1] = `${endTime.getTime()}`;
fnGetListTitle();
// 绘图
fnRanderChart();
@@ -892,12 +903,12 @@ onBeforeUnmount(() => {
>
<a-range-picker
v-model:value="queryRangePicker"
bordered
:presets="rangePickerPresets"
:bordered="true"
:allow-clear="false"
style="width: 100%"
:show-time="{ format: 'HH:mm:ss' }"
format="YYYY-MM-DD HH:mm:ss"
value-format="x"
style="width: 100%"
></a-range-picker>
</a-form-item>
</a-col>

View File

@@ -329,10 +329,10 @@ function fnGetListTitle() {
if (!state.neType[0]) return false;
// 获取表头文字
listCustom({ neType: state.neType[0], status: 'Active' })
listCustom({ neType: state.neType[0], status: '1' })
.then(res => {
if (res.code === RESULT_CODE_SUCCESS && Array.isArray(res.data)) {
if (res.data.length === 0) {
if (res.code === RESULT_CODE_SUCCESS) {
if (res.data.rows.length === 0) {
message.error({
content: t('views.perfManage.customTarget.kpiIdTip'),
duration: 2,
@@ -346,7 +346,7 @@ function fnGetListTitle() {
}
tableColumns.value = [];
const columns: any[] = [];
for (const item of res.data) {
for (const item of res.data.rows) {
const kpiDisplay = item[`unit`]
? item[`title`] + `(${item['unit']})`
: item[`title`];
@@ -407,7 +407,7 @@ function fnGetList() {
listCustomData(toRaw(queryParams))
.then(res => {
tableState.loading = false;
if (res.code === RESULT_CODE_SUCCESS && Array.isArray(res.data)) {
if (res.code === RESULT_CODE_SUCCESS) {
tablePagination.total = res.data.length;
tableState.data = res.data;
if (!res.data.length) {
@@ -834,9 +834,9 @@ watch(
onMounted(() => {
// 目前支持的 AMF AUSF MME MOCNGW NSSF SMF UDM UPF PCF
// 获取网元网元列表
listCustom({ status: 'Active' }).then((res: any) => {
if (res.code === RESULT_CODE_SUCCESS && Array.isArray(res.data)) {
if (!res.data.length) {
listCustom({ status: '1' }).then((res: any) => {
if (res.code === RESULT_CODE_SUCCESS) {
if (!res.data.rows.length) {
message.warning({
content: '无可用的自定义指标,请先添加自定义指标',
duration: 2,
@@ -844,12 +844,12 @@ onMounted(() => {
return false;
}
let typeArr: any = [];
res.data.forEach((item: any) => {
res.data.rows.forEach((item: any) => {
typeArr.push(item.neType);
});
typeArr = Array.from(new Set(typeArr));
neInfoStore.fnNelist().then(res => {
if (res.code === RESULT_CODE_SUCCESS && Array.isArray(res.data)) {
neInfoStore.fnNelist().then(res => {
if (res.code === RESULT_CODE_SUCCESS) {
if (res.data.length > 0) {
// 过滤不可用的网元
neCascaderOptions.value = neInfoStore.getNeCascaderOptions.filter(

View File

@@ -301,14 +301,9 @@ const chartStates: Record<
> = Object.fromEntries(
networkElementTypes.value.map(type => [type, createChartState(type)])
) as Record<AllChartType, ReturnType<typeof createChartState>>;
//期择器
interface RangePicker extends Record<AllChartType, [string, string]> {
placeholder: [string, string];
}
// 日期选择器状态
const rangePicker = reactive<RangePicker>({
const rangePicker = reactive({
...(Object.fromEntries(
networkElementTypes.value.map(type => [
type,
@@ -533,18 +528,18 @@ const fetchData = async (type: AllChartType) => {
try {
const dateRange = rangePicker[type] as [string, string];
const [startTime, endTime] = dateRange;
const [beginTime, endTime] = dateRange;
const res = await listKPIData({
neType: type.toUpperCase(),
neId: '001',
startTime,
beginTime,
endTime,
sortField: 'timeGroup',
sortOrder: 'desc',
interval: 60 * 15,
});
if (res.code === RESULT_CODE_SUCCESS && Array.isArray(res.data)) {
if (res.code === RESULT_CODE_SUCCESS) {
state.tableState.data = res.data;
await renderChart(type);
}
@@ -810,7 +805,7 @@ const fetchKPITitle = async (type: AllChartType) => {
: currentLocale.value.split('_')[0];
try {
const res = await getKPITitle(type.toUpperCase());
if (res.code === RESULT_CODE_SUCCESS && Array.isArray(res.data)) {
if (res.code === RESULT_CODE_SUCCESS) {
// 保存现有的颜色映
const existingColors = new Map(chartStates[type].seriesColors);
@@ -827,7 +822,7 @@ const fetchKPITitle = async (type: AllChartType) => {
return dayjs(Number(text)).format('YYYY-MM-DD HH:mm:ss');
},
},
...res.data.map(item => {
...res.data.map((item:any) => {
const kpiId = item.kpiId;
// 如果没有现有的颜色,生成新的颜色
if (!existingColors.has(kpiId)) {

View File

@@ -83,9 +83,9 @@ const ranges = ref([
},
]);
//日期范围响应式变量
const dateRange = ref<[string, string]>([
dayjs().subtract(1, 'hour').startOf('hour').valueOf().toString(), // 上一小时开始
dayjs().startOf('hour').add(1, 'hour').valueOf().toString(), // 当前小时结束
const dateRange = ref<[Dayjs, Dayjs] | undefined>([
dayjs().subtract(1, 'hour').startOf('hour'), // 上一小时开始
dayjs().startOf('hour').add(1, 'hour'), // 当前小时结束
]);
//实时数据状态
const isRealtime = ref(false);
@@ -108,10 +108,7 @@ const handleDateChange = (
return;
}
dateRange.value = [
dayjs(dateStrings[0]).valueOf().toString(),
dayjs(dateStrings[1]).valueOf().toString(),
];
dateRange.value = [dayjs(dateStrings[0]), dayjs(dateStrings[1])];
fetchChartData();
};
@@ -226,8 +223,14 @@ const fetchChartData = async () => {
tableLoading.value = true;
rangeLoading.value = true;
try {
const [startTime, endTime] = dateRange.value;
if (!startTime || !endTime) {
let beginTime = 0;
let endTime = 0;
// 时间范围
if (Array.isArray(dateRange.value) && dateRange.value.length > 0) {
beginTime = dateRange.value[0].valueOf();
endTime = dateRange.value[1].valueOf();
}
if (beginTime == 0 || endTime == 0) {
console.warn('Invalid date range:', dateRange.value);
return;
}
@@ -237,8 +240,8 @@ const fetchChartData = async () => {
const params = {
neType,
neId: '001',
startTime: String(startTime),
endTime: String(endTime),
beginTime: beginTime,
endTime: endTime,
sortField: 'timeGroup',
sortOrder: 'asc',
interval: 60 * 15,
@@ -247,7 +250,7 @@ const fetchChartData = async () => {
try {
const res = await listKPIData(params);
if (res.code === RESULT_CODE_SUCCESS && Array.isArray(res.data)) {
if (res.code === RESULT_CODE_SUCCESS) {
return res.data;
}
return [];
@@ -651,8 +654,8 @@ const fetchSpecificKPI = async () => {
for (const neType of ALL_NE_TYPES) {
const res = await getKPITitle(neType.toUpperCase());
if (res.code === RESULT_CODE_SUCCESS && Array.isArray(res.data)) {
const formattedKPIs = res.data.map(item => ({
if (res.code === RESULT_CODE_SUCCESS) {
const formattedKPIs = res.data.map((item: any) => ({
title: item[`${language}Title`],
dataIndex: item.kpiId,
key: item.kpiId,

View File

@@ -190,9 +190,10 @@ function fnGetList(pageNum?: number) {
queryParams.beginTime = queryRangePicker.value[0];
queryParams.endTime = queryRangePicker.value[1];
listperfData(toRaw(queryParams)).then(res => {
if (res.code === RESULT_CODE_SUCCESS && Array.isArray(res.rows)) {
tablePagination.total = res.total;
tableState.data = res.rows;
if (res.code === RESULT_CODE_SUCCESS) {
const { total, rows } = res.data;
tablePagination.total = total;
tableState.data = rows;
if (tablePagination.total <=(queryParams.pageNum - 1) * tablePagination.pageSize &&queryParams.pageNum !== 1) {
tableState.loading = false;
fnGetList(queryParams.pageNum - 1);

View File

@@ -189,13 +189,14 @@ function fnGetList(pageNum?: number) {
queryParams.pageNum = pageNum;
}
listPerfThreshold(toRaw(queryParams)).then(res => {
if (res.code === RESULT_CODE_SUCCESS && Array.isArray(res.rows)) {
if (res.code === RESULT_CODE_SUCCESS) {
// 取消勾选
if (tableState.selectedRowKeys.length > 0) {
tableState.selectedRowKeys = [];
}
tablePagination.total = res.total;
tableState.data = res.rows;
const { total, rows } = res.data;
tablePagination.total = total;
tableState.data = rows;
if (
tablePagination.total <=
(queryParams.pageNum - 1) * tablePagination.pageSize &&

View File

@@ -222,13 +222,14 @@ function fnGetList(pageNum?: number) {
queryParams.pageNum = pageNum;
}
listPerfTask(toRaw(queryParams)).then(res => {
if (res.code === RESULT_CODE_SUCCESS && Array.isArray(res.rows)) {
if (res.code === RESULT_CODE_SUCCESS) {
// 取消勾选
if (tableState.selectedRowKeys.length > 0) {
tableState.selectedRowKeys = [];
}
tablePagination.total = res.total;
tableState.data = res.rows;
const { total, rows } = res.data;
tablePagination.total = total;
tableState.data = rows;
if (
tablePagination.total <=
(queryParams.pageNum - 1) * tablePagination.pageSize &&