Merge branch 'main' into lichang

This commit is contained in:
TsMask
2023-10-18 10:31:56 +08:00
13 changed files with 1447 additions and 617 deletions

View File

@@ -157,6 +157,70 @@ export function exportSet(data: Record<string, any>) {
});
}
/**
* 导入网元配置文件
* @param data 网元对象
* @returns object
*/
export function importFile(data: Record<string, any>) {
let dataType: 'json' | 'form-data' = 'json';
let url = `/systemManagement/v1/elementType/${data.neType}/objectType/cm?ne_id=${data.neId}`;
let obj: any = { fileName: data.fileName };
if (data.importType === 'local') {
let formData = new FormData();
formData.append('nfType', data.neType);
formData.append('nfId', data.neId);
formData.append('file', data.file);
obj = formData;
dataType = 'form-data';
}
// 处理FormData类型的data
return request({
url,
method: 'post',
data: obj,
dataType,
});
if (data instanceof FormData) {
// 处理FormData类型的data
return request({
url: `/systemManagement/v1/elementType/${data.get(
'nfType'
)}/objectType/cm?ne_id=${data.get('nfId')}`,
method: 'post',
data,
dataType: 'form-data',
});
} else {
// 处理普通对象类型的data
return request({
url: `/systemManagement/v1/elementType/${data.nfType}/objectType/cm?ne_id=${data.nfId}`,
method: 'post',
data: { fileName: data.fileName },
});
}
}
/**
* 查询远程服务器上网元配置文件
* @param data 网元对象
* @returns object
*/
export async function listServerFile(data: Record<string, any>) {
const result = await request({
url: `databaseManagement/v1/omc_db/ne_backup?SQL= select * from ne_backup where ne_type ='${data.neType}'`,
method: 'get',
});
// 解析数据
if (result.code === RESULT_CODE_SUCCESS && Array.isArray(result.data.data)) {
let data = result.data.data[0];
return Object.assign(result, {
data: parseObjLineToHump(data['ne_backup']),
});
}
return result;
}
/**
* 启动网元
@@ -192,4 +256,4 @@ export function stopNf(data: Record<string, any>) {
url: `/api/rest/systemManagement/v1/elementType/${data.neType}/objectType/service/stop?ne_id=${data.neId}`,
method: 'post',
});
}
}

View File

@@ -14,23 +14,38 @@ export async function listAct(query: Record<string, any>, filterSQl: string) {
let rowsSQL = `select * from alarm where alarm_status='1' ${filterSQl}`;
// 查询
let querySQL = '';
querySQL += query.alarm_code
? ` and alarm_code = '${query.alarm_code}' `
: '';
querySQL += query.alarm_type
? ` and alarm_type = '${query.alarm_type}' `
: '';
querySQL += query.pv_flag ? ` and pv_flag = '${query.pv_flag}' ` : '';
querySQL += query.orig_severity
? ` and orig_severity in('${query.orig_severity}' )`
: '';
querySQL += query.ne_id ? ` and ne_id like '%${query.ne_id}%' ` : '';
querySQL += query.ne_name ? ` and ne_name like '%${query.ne_name}%' ` : '';
querySQL += query.ne_type ? ` and ne_type like '%${query.ne_type}%' ` : '';
querySQL +=
query.beginTime && query.endTime
? ` and event_time BETWEEN '${query.beginTime}' and ' ${query.endTime}'`
: '';
if (query.alarmCode) {
querySQL += ` and alarm_code = '${query.alarmCode}' `;
}
if (query.alarmType) {
querySQL += ` and alarm_type = '${query.alarmType}' `;
}
if (query.pvFlag) {
querySQL += ` and pv_flag = '${query.pvFlag}' `;
}
if (query.origSeverity) {
querySQL += ` and orig_severity in('${query.origSeverity}' )`;
}
if (query.neId) {
querySQL += ` and ne_id like '%${query.neId}%' `;
}
if (query.neName) {
querySQL += ` and ne_name like '%${query.neName}%' `;
}
if (query.neType) {
querySQL += ` and ne_type like '%${query.neType}%' `;
}
if (query.beginTime && query.endTime) {
querySQL += ` and event_time BETWEEN '${query.beginTime}' and ' ${query.endTime}'`;
}
// 分页
const pageNum = (query.pageNum - 1) * query.pageSize;
@@ -237,7 +252,6 @@ export async function exportAll(query: Record<string, any>) {
},
});
if (result.code === RESULT_CODE_SUCCESS) {
let v = result.data.data[0];
const vArr = parseObjLineToHump(v['alarm']);

View File

@@ -10,6 +10,7 @@ export async function listMain() {
const result = await request({
url: '/api/rest/systemManagement/v1/elementType/all/objectType/systemState',
method: 'get',
timeout: 30 * 1000,
});
// console.log(result);
let realData = result.data.data;

View File

@@ -0,0 +1,69 @@
import { RESULT_CODE_SUCCESS } from '@/constants/result-constants';
import { request } from '@/plugins/http-fetch';
import { parseObjLineToHump } from '@/utils/parse-utils';
/**
* 查询日志列表
* @param query 查询参数
* @returns object
*/
export async function listperfData(query: Record<string, any>) {
let totalSQL = 'select count(*) as total from measure_data where 1=1 ';
let rowsSQL = 'select * from measure_data where 1=1 ';
// 查询
let querySQL = '';
if (query.neType) {
querySQL += ` and ne_type like '%${query.neType}%' `;
}
if (query.beginTime) {
querySQL += ` and start_time >= '${query.beginTime}' `;
}
if (query.endTime) {
querySQL += ` and start_time <= '${query.endTime}' `;
}
// 排序
let sortSql = ' order by start_time ';
if (query.sortOrder === 'asc') {
sortSql += ' asc ';
} else {
sortSql += ' desc ';
}
// 分页
const pageNum = (query.pageNum - 1) * query.pageSize;
const limtSql = ` limit ${pageNum},${query.pageSize} `;
// 发起请求
const result = await request({
url: `/databaseManagement/v1/select/omc_db/measure_data`,
method: 'get',
params: {
totalSQL: totalSQL + querySQL,
rowsSQL: rowsSQL + querySQL + sortSql + limtSql,
},
});
// 解析数据
if (result.code === RESULT_CODE_SUCCESS) {
const data: DataList = {
total: 0,
rows: [],
code: result.code,
msg: result.msg,
};
result.data.data.forEach((item: any) => {
const itemData = item['measure_data'];
if (Array.isArray(itemData)) {
if (itemData.length === 1 && itemData[0]['total'] >= 0) {
data.total = itemData[0]['total'];
} else {
data.rows = itemData.map(v => parseObjLineToHump(v));
}
}
});
return data;
}
return result;
}

View File

@@ -0,0 +1,140 @@
import { RESULT_CODE_SUCCESS } from '@/constants/result-constants';
import { request } from '@/plugins/http-fetch';
import { parseObjLineToHump } from '@/utils/parse-utils';
/**
* 查询任务列表
* @param query 查询参数
* @returns object
*/
export async function listPerfTask(query: Record<string, any>) {
let totalSQL = 'select count(*) as total from measure_task where 1=1 ';
let rowsSQL = 'select * from measure_task where 1=1 ';
// 查询
let querySQL = '';
if (query.neType) {
querySQL += ` and ne_type like '%${query.neType}%' `;
}
// 分页
const pageNum = (query.pageNum - 1) * query.pageSize;
const limtSql = ` limit ${pageNum},${query.pageSize} `;
// 发起请求
const result = await request({
url: `/databaseManagement/v1/select/omc_db/measure_task`,
method: 'get',
params: {
totalSQL: totalSQL + querySQL,
rowsSQL: rowsSQL + querySQL + limtSql,
},
});
// 解析数据
if (result.code === RESULT_CODE_SUCCESS) {
const data: DataList = {
total: 0,
rows: [],
code: result.code,
msg: result.msg,
};
result.data.data.forEach((item: any) => {
const itemData = item['measure_task'];
if (Array.isArray(itemData)) {
if (itemData.length === 1 && itemData[0]['total'] >= 0) {
data.total = itemData[0]['total'];
} else {
data.rows = itemData.map(v => parseObjLineToHump(v));
}
}
});
return data;
}
return result;
}
/**
* 查询任务详细
* @param id 网元ID
* @returns object
*/
export async function getTraceTask(id: string | number) {
// 发起请求
const result = await request({
url: `/databaseManagement/v1/select/omc_db/trace_task`,
method: 'get',
params: {
SQL: `select * from trace_task where id = ${id}`,
},
});
// 解析数据
if (result.code === RESULT_CODE_SUCCESS && Array.isArray(result.data.data)) {
let data = result.data.data[0];
return Object.assign(result, {
data: parseObjLineToHump(data['trace_task'][0]),
});
}
return result;
}
/**
* 新增任务
* @param data 网元对象
* @returns object
*/
export function addTraceTask(data: Record<string, any>) {
return request({
url: `/traceManagement/v1/subscriptions`,
method: 'post',
data: data,
});
}
/**
* 修改任务
* @param data 网元对象
* @returns object
*/
export function updateTraceTask(data: Record<string, any>) {
return request({
url: `/traceManagement/v1/subscriptions`,
method: 'put',
data: data,
});
}
/**
* 删除任务
* @param noticeId 网元ID
* @returns object
*/
export async function delTraceTask(id: string) {
return request({
url: `/traceManagement/v1/subscriptions?id=${id}`,
method: 'delete',
});
}
/**
* 获取网元跟踪接口列表
* @returns object
*/
export async function getNePerformanceList() {
// 发起请求
const result = await request({
url: `/databaseManagement/v1/elementType/omc_db/objectType/measure_title`,
method: 'get',
params: {
SQL: `SELECT * FROM measure_title`,
},
});
// 解析数据
if (result.code === RESULT_CODE_SUCCESS && Array.isArray(result.data.data)) {
let data = result.data.data[0];
return Object.assign(result, {
data: parseObjLineToHump(data['measure_title']),
});
}
return result;
}

View File

@@ -109,6 +109,10 @@ export default {
start: 'Start',
export: 'Export',
import: 'Import',
selectPlease:'Please select the source of the import file',
server:'Server File',
local:'Local File',
fileSelect:'Please select the current import file',
},
backupManage: {
setBackupTask: 'Set automatic backup time',
@@ -200,6 +204,17 @@ export default {
neType: 'IMS Type',
},
},
perfManage: {
taskManage:{
taskId: 'Task ID',
neType: 'Type',
size: 'Measurement Dimensionality',
taskStatus: 'Task Status',
addUser: 'Creator',
addTime: 'Creation time',
granulOption:'Particle',
},
},
traceManage: {
analysis: {
imsi: 'IMSI',

View File

@@ -109,6 +109,10 @@ export default {
start: '启动',
export: '导出',
import: '导入',
selectPlease:'请选择导入文件来源',
server:'服务器文件',
local:'本地文件',
fileSelect:'请选择当前导入文件',
},
backupManage: {
setBackupTask: '设置自动备份时间',
@@ -200,6 +204,17 @@ export default {
neType: 'IMS网元类型',
},
},
perfManage: {
taskManage:{
taskId: '任务ID',
neType: '网元类型',
size: '测量粒度',
taskStatus: '任务状态',
addUser: '创建人',
addTime: '创建时间',
granulOption:'测量粒度',
},
},
traceManage: {
analysis: {
imsi: 'IMSI',

View File

@@ -3,6 +3,7 @@ import { RESULT_CODE_SUCCESS } from '@/constants/result-constants';
import { getNelistAll } from '@/api/configManage/neManage';
import { parseDataToOptions } from '@/utils/parse-tree-utils';
import { getNeTraceInterfaceAll } from '@/api/traceManage/task';
import { getNePerformanceList } from '@/api/perfManage/taskManage';
/**网元信息类型 */
type NeInfo = {
@@ -14,6 +15,8 @@ type NeInfo = {
neSelectOtions: Record<string, any>[];
/**跟踪接口列表 */
traceInterfaceList: Record<string, any>[];
/**性能测量数据集 */
perMeasurementList: Record<string, any>[];
};
const useNeInfoStore = defineStore('neinfo', {
@@ -22,6 +25,7 @@ const useNeInfoStore = defineStore('neinfo', {
neCascaderOtions: [],
neSelectOtions: [],
traceInterfaceList: [],
perMeasurementList: [],
}),
getters: {
/**
@@ -91,6 +95,18 @@ const useNeInfoStore = defineStore('neinfo', {
}
return res;
},
// 获取性能测量数据集列表
async fnNeTaskPerformance() {
// 有数据不请求
if (this.perMeasurementList.length > 0) {
return { code: 1, data: this.perMeasurementList, msg: 'success' };
}
const res = await getNePerformanceList();
if (res.code === RESULT_CODE_SUCCESS && Array.isArray(res.data)) {
this.perMeasurementList = res.data;
}
return res;
},
},
});

View File

@@ -16,9 +16,13 @@ import {
startNf,
restartNf,
stopNf,
importFile,
listServerFile,
} from '@/api/configManage/neManage';
import { parseDateToStr } from '@/utils/date-utils';
import useI18n from '@/hooks/useI18n';
import { FileType } from 'ant-design-vue/lib/upload/interface';
import { UploadRequestOption } from 'ant-design-vue/lib/vc-upload/interface';
import { RESULT_CODE_SUCCESS } from '@/constants/result-constants';
const { t } = useI18n();
const route = useRoute();
@@ -26,6 +30,15 @@ const route = useRoute();
/**路由标题 */
let title = ref<string>((route.meta.title as string) ?? '标题');
/**表格所需option */
const neManageOption = reactive({
importType: [
{ label: t('views.configManage.neManage.server'), value: 'server' },
{ label: t('views.configManage.neManage.local'), value: 'local' },
],
serverFileName: <any[]>[],
});
/**查询参数 */
let queryParams = reactive({
/**网元类型 */
@@ -183,10 +196,14 @@ type ModalStateType = {
visibleByView: boolean;
/**新增框或修改框是否显示 */
visibleByEdit: boolean;
/**导入是否显示 */
visibleByImport: boolean;
/**标题 */
title: string;
/**表单数据 */
from: Record<string, any>;
/**导入表单数据 */
importFrom: Record<string, any>;
/**确定按钮 loading */
confirmLoading: boolean;
};
@@ -195,6 +212,7 @@ type ModalStateType = {
let modalState: ModalStateType = reactive({
visibleByView: false,
visibleByEdit: false,
visibleByImport: false,
title: '网元',
from: {
dn: '',
@@ -209,6 +227,14 @@ let modalState: ModalStateType = reactive({
rmUid: '',
vendorName: '',
},
importFrom: {
neId: '',
neType: '',
importType: '',
file: undefined,
fileList: [],
fileName: '',
},
confirmLoading: false,
});
@@ -226,6 +252,31 @@ const modalStateFrom = Form.useForm(
})
);
/**导入对话框内表单属性和校验规则 */
const importStateFrom = Form.useForm(
modalState.importFrom,
reactive({
file: [
{
required: true,
message: t('views.configManage.softwareManage.updateFilePlease'),
},
],
importType: [
{
required: true,
message: t('views.configManage.neManage.selectPlease'),
},
],
fileName: [
{
required: true,
message: t('views.configManage.neManage.fileSelect'),
},
],
})
);
/**
* 对话框弹出显示为 新增或者修改
* @param noticeId 网元id, 不传为新增
@@ -292,6 +343,72 @@ function fnModalOk() {
});
}
/**
* 导入对话框弹出确认执行函数
* 进行表达规则校验
*/
function fnImportModalOk() {
const from = toRaw(modalState.importFrom);
let validateName = ['importType'];
if (from.file) {
validateName.push('file');
} else {
validateName.push('fileName');
}
importStateFrom
.validate(validateName)
.then(e => {
modalState.confirmLoading = true;
const hide = message.loading({ content: t('common.loading') });
// let result = importFile(from);
// if (from.importType === 'local') {
// let formData = new FormData();
// formData.append('nfType', from.neType);
// formData.append('nfId', from.neId);
// formData.append('file', from.file);
// result = importFile(formData);
// }
importFile(from)
.then(res => {
if (res.code === RESULT_CODE_SUCCESS) {
message.success({
content: t('common.msgSuccess', { msg: modalState.title }),
duration: 3,
});
modalState.visibleByEdit = false;
modalStateFrom.resetFields();
} else {
message.error({
content: `${res.msg}`,
duration: 3,
});
}
})
.finally(() => {
hide();
modalState.confirmLoading = false;
// 获取列表数据
fnGetList();
});
})
.catch(e => {
console.error(e)
message.error(t('common.errorFields', { num: e.errorFields.length }), 3);
});
}
/**
* 导入对话框弹出关闭执行函数
* 进行表达规则校验
*/
function fnImportModalCancel() {
modalState.visibleByView = false;
modalState.visibleByImport = false;
importStateFrom.resetFields();
}
/**
* 对话框弹出关闭执行函数
* 进行表达规则校验
@@ -472,6 +589,12 @@ function fnRecordMore(type: string | number, row: Record<string, any>) {
if (type === 'stop') {
fnRecordStop(row);
}
if (type === 'import') {
modalState.importFrom = Object.assign(modalState.importFrom, row);
modalState.title = '导入';
modalState.visibleByImport = true;
}
}
/**查询网元列表 */
@@ -491,6 +614,53 @@ function fnGetList() {
});
}
/**查询网元远程服务器备份文件 */
function typeChange(value: any) {
if (value === 'server') {
listServerFile(modalState.importFrom).then(res => {
if (res.code === RESULT_CODE_SUCCESS && Array.isArray(res.data)) {
neManageOption.serverFileName = [];
res.data.forEach((item: any) => {
neManageOption.serverFileName.push({
label: item.fileName,
value: item.fileName,
});
});
}
// else if (res.code === RESULT_CODE_SUCCESS && !res.data) {
// message.error({
// content: `当前网元没有远程服务器备份文件`,
// key: 'importServer',
// duration: 2,
// });
// }
});
}
}
/**上传前检查或转换压缩 */
function fnBeforeUploadFile(file: FileType) {
if (modalState.confirmLoading) return false;
const fileName = file.name;
const suff = fileName.substring(fileName.lastIndexOf('.'));
const isLt60M = file.size / 1024 / 1024 > 60;
if (isLt60M) {
message.error('有效软件文件大小应不小于 60MB', 3);
return false;
}
return true;
}
/**上传文件 */
function fnUploadFile(up: UploadRequestOption) {
// 改为完成状态
const file = modalState.importFrom.fileList[0];
file.percent = 100;
file.status = 'done';
// 预置到表单
modalState.importFrom.file = up.file;
}
onMounted(() => {
// 获取列表数据
fnGetList();
@@ -846,6 +1016,97 @@ onMounted(() => {
</a-row>
</a-form>
</a-modal>
<!-- 导入框 -->
<a-modal
width="800px"
:keyboard="false"
:mask-closable="false"
:visible="modalState.visibleByImport"
:title="modalState.title"
:confirm-loading="modalState.confirmLoading"
@ok="fnImportModalOk"
@cancel="fnImportModalCancel"
>
<a-form name="importStateFrom" layout="horizontal">
<a-row :gutter="16">
<a-col :lg="12" :md="12" :xs="24">
<a-form-item
label="网元类型"
name="neType"
v-bind="importStateFrom.validateInfos.neType"
>
<a-input
v-model:value="modalState.importFrom.neType"
disabled
allow-clear
>
</a-input>
</a-form-item>
</a-col>
<a-col :lg="12" :md="12" :xs="24">
<a-form-item
label="网元内部标识"
name="neId"
v-bind="importStateFrom.validateInfos.neId"
>
<a-input
v-model:value="modalState.importFrom.neId"
disabled
></a-input>
</a-form-item>
</a-col>
</a-row>
<a-form-item
label="文件来源"
name="importType"
v-bind="importStateFrom.validateInfos.importType"
>
<a-select
v-model:value="modalState.importFrom.importType"
default-value="server"
:options="neManageOption.importType"
@change="typeChange"
>
</a-select>
</a-form-item>
<a-form-item
label="导入远程文件"
name="fileName"
v-bind="importStateFrom.validateInfos.fileName"
v-show="modalState.importFrom.importType === 'server'"
>
<a-select
v-model:value="modalState.importFrom.fileName"
:options="neManageOption.serverFileName"
>
</a-select>
</a-form-item>
<a-form-item
label="导入本地文件"
name="file"
v-bind="importStateFrom.validateInfos.file"
v-show="modalState.importFrom.importType === 'local'"
>
<a-upload
name="file"
v-model:file-list="modalState.importFrom.fileList"
list-type="text"
:max-count="1"
:show-upload-list="true"
:before-upload="fnBeforeUploadFile"
:custom-request="fnUploadFile"
>
<a-button type="default" :loading="modalState.confirmLoading">
{{ t('views.configManage.neManage.fileSelect') }}
</a-button>
</a-upload>
</a-form-item>
</a-form>
</a-modal>
</PageContainer>
</template>

View File

@@ -1,6 +1,5 @@
<script setup lang="ts">
import { useRoute } from 'vue-router';
import dayjs, { Dayjs } from 'dayjs';
import { reactive, ref, onMounted, toRaw } from 'vue';
import { PageContainer } from '@ant-design-vue/pro-layout';
import { message, Modal } from 'ant-design-vue/lib';
@@ -18,7 +17,6 @@ import {
getPass,
exportAll,
} from '@/api/faultManage/actAlarm';
import useNeInfoStore from '@/store/modules/neinfo';
import useI18n from '@/hooks/useI18n';
import saveAs from 'file-saver';
import { writeSheet } from '@/utils/execl-utils';
@@ -26,7 +24,6 @@ import { RESULT_CODE_SUCCESS } from '@/constants/result-constants';
import { readLoalXlsx } from '@/utils/execl-utils';
const { t } = useI18n();
const route = useRoute();
type RangeValue = [Dayjs, Dayjs];
/**路由标题 */
let title = ref<string>((route.meta.title as string) ?? '标题');
@@ -36,23 +33,23 @@ let queryRangePicker = ref<[string, string]>(['', '']);
/**查询参数 */
let queryParams = reactive({
/**告警设备类型 */
ne_type: '',
neType: '',
/**告警网元名称 */
ne_name: '',
neName: '',
/**告警网元标识 */
ne_id: '',
neId: '',
/**告警编号 */
alarm_code: '',
alarmCode: '',
/**告警级别 */
orig_severity: '',
origSeverity: '',
beginTime: '',
endTime: '',
/**告警产生时间 */
eventTime: (queryRangePicker.value = ['', '']),
/**虚拟化标识 */
pv_flag: '',
pvFlag: '',
/**告警类型 */
alarm_type: '',
alarmType: '',
/**当前页数 */
pageNum: 1,
/**每页条数 */
@@ -63,21 +60,21 @@ let queryParams = reactive({
function fnQueryReset() {
queryParams = Object.assign(queryParams, {
/**告警设备类型 */
ne_type: '',
neType: '',
/**告警网元名称 */
ne_name: '',
neName: '',
/**告警网元标识 */
ne_id: '',
neId: '',
/**告警编号 */
alarm_code: '',
alarmCode: '',
/**告警级别 */
orig_severity: '',
origSeverity: '',
/**告警产生时间 */
eventTime: (queryRangePicker.value = ['', '']),
/**虚拟化标识 */
pv_flag: '',
pvFlag: '',
/**告警类型 */
alarm_type: '',
alarmType: '',
/**当前页数 */
});
tablePagination.current = 1;
@@ -295,20 +292,6 @@ let alarmTableColumns: ColumnsType = [
},
];
/**告警帮助文档 */
let pronInfo: any = reactive({
告警名称: '',
告警定位信息: '',
告警帮助信息: '',
告警类型: '',
告警级别: '',
告警编号: '',
告警问题原因: '',
清除类型: '',
英文标题: '',
适用网元: '',
});
/**表格分页器参数 */
let tablePagination = reactive({
/**当前页数 */
@@ -774,7 +757,7 @@ onMounted(() => {
name="ne_type"
>
<a-input
v-model:value="queryParams.ne_type"
v-model:value="queryParams.neType"
allow-clear
placeholder="查询告警设备类型"
></a-input>
@@ -786,7 +769,7 @@ onMounted(() => {
name="ne_name"
>
<a-input
v-model:value="queryParams.ne_name"
v-model:value="queryParams.neName"
allow-clear
placeholder="查询告警网元名称"
></a-input>
@@ -798,7 +781,7 @@ onMounted(() => {
name="ne_id"
>
<a-input
v-model:value="queryParams.ne_id"
v-model:value="queryParams.neId"
allow-clear
placeholder="查询告警网元标识"
></a-input>
@@ -827,7 +810,7 @@ onMounted(() => {
name="alarm_code"
>
<a-input
v-model:value="queryParams.alarm_code"
v-model:value="queryParams.alarmCode"
allow-clear
placeholder="查询告警编号"
></a-input>
@@ -839,7 +822,7 @@ onMounted(() => {
name="orig_severity"
>
<a-select
v-model:value="queryParams.orig_severity"
v-model:value="queryParams.origSeverity"
placeholder="Select alarm Type"
show-search
allow-clear
@@ -869,7 +852,7 @@ onMounted(() => {
name="pv_flag"
>
<a-select
v-model:value="queryParams.pv_flag"
v-model:value="queryParams.pvFlag"
placeholder="Select a person"
show-search
:options="actAlarmOption.pvFlag"
@@ -885,7 +868,7 @@ onMounted(() => {
name="alarm_type"
>
<a-select
v-model:value="queryParams.alarm_type"
v-model:value="queryParams.alarmType"
placeholder="Select alarm Type"
show-search
:options="actAlarmOption.alarmType"
@@ -1025,7 +1008,7 @@ onMounted(() => {
>
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'origSeverity'">
<a-tag :color="profile.color[record.origSeverity]">{{
<a-tag :color="profile.color[record.origSeverity.toLowerCase()]">{{
record.origSeverity
}}</a-tag>
</template>

View File

@@ -767,7 +767,7 @@ onMounted(() => {
>
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'origSeverity'">
<a-tag :color="profile.color[record.origSeverity]">{{
<a-tag :color="profile.color[record.origSeverity.toLowerCase()]">{{
record.origSeverity
}}</a-tag>
</template>

View File

@@ -1,28 +1,41 @@
<script setup lang="ts">
import { useRoute } from 'vue-router';
import { reactive, ref, onMounted, toRaw, nextTick } from 'vue';
import { reactive, ref, onMounted, toRaw } from 'vue';
import { PageContainer } from '@ant-design-vue/pro-layout';
import { message, Modal } from 'ant-design-vue/lib';
import { SizeType } from 'ant-design-vue/lib/config-provider';
import { MenuInfo } from 'ant-design-vue/lib/menu/src/interface';
import { ColumnsType } from 'ant-design-vue/lib/table';
import { parseDateToStr } from '@/utils/date-utils';
import { RESULT_CODE_SUCCESS } from '@/constants/result-constants';
import { saveAs } from 'file-saver';
import { listperfData } from '@/api/perfManage/perfData';
import useNeInfoStore from '@/store/modules/neinfo';
import useDictStore from '@/store/modules/dict';
import useI18n from '@/hooks/useI18n';
import { getTraceRawInfo, listTraceData } from '@/api/traceManage/analysis';
const { getDict } = useDictStore();
const { t } = useI18n();
const route = useRoute();
/**路由标题 */
let title = ref<string>((route.meta.title as string) ?? '标题');
/**字典数据 */
let dict: {
/**告警状态 */
alarmStatus: DictType[];
} = reactive({
alarmStatus: [],
});
/**记录开始结束时间 */
let queryRangePicker = ref<[string, string]>(['', '']);
/**查询参数 */
let queryParams = reactive({
/**移动号 */
imsi: '',
/**移动号 */
msisdn: '',
/**网元类型 */
neType: '',
/**记录时间 */
beginTime: '',
endTime: '',
/**当前页数 */
pageNum: 1,
/**每页条数 */
@@ -32,10 +45,13 @@ let queryParams = reactive({
/**查询参数重置 */
function fnQueryReset() {
queryParams = Object.assign(queryParams, {
imsi: '',
neType: '',
beginTime: '',
endTime: '',
pageNum: 1,
pageSize: 20,
});
queryRangePicker.value = ['', ''];
tablePagination.current = 1;
tablePagination.pageSize = 20;
fnGetList();
@@ -64,48 +80,49 @@ let tableState: TabeStateType = reactive({
/**表格字段列 */
let tableColumns: ColumnsType = [
{
title: t('views.traceManage.analysis.trackTaskId'),
title: t('common.rowId'),
dataIndex: 'id',
align: 'center',
},
{
title: '任务ID',
dataIndex: 'taskId',
align: 'center',
},
{
title: t('views.traceManage.analysis.imsi'),
dataIndex: 'imsi',
title: '网元类型',
dataIndex: 'neType',
align: 'center',
},
{
title: t('views.traceManage.analysis.msisdn'),
dataIndex: 'msisdn',
title: '网元名称',
dataIndex: 'neName',
align: 'center',
},
{
title: t('views.traceManage.analysis.srcIp'),
dataIndex: 'srcAddr',
title: '颗粒度',
dataIndex: 'granulOption',
align: 'center',
},
{
title: t('views.traceManage.analysis.dstIp'),
dataIndex: 'dstAddr',
title: '统计编码',
dataIndex: 'kpiCode',
align: 'center',
},
{
title: t('views.traceManage.analysis.signalType'),
dataIndex: 'ifType',
title: '统计指标项',
dataIndex: 'kpiId',
//key: 'alarmTitle',
align: 'left',
},
{
title: '值',
dataIndex: 'value',
align: 'center',
},
{
title: t('views.traceManage.analysis.msgType'),
dataIndex: 'msgType',
align: 'center',
},
{
title: t('views.traceManage.analysis.msgDirect'),
dataIndex: 'msgDirect',
align: 'center',
},
{
title: t('views.traceManage.analysis.rowTime'),
dataIndex: 'timestamp',
title: '开始时间',
dataIndex: 'startTime',
align: 'center',
customRender(opt) {
if (!opt.value) return '';
@@ -113,10 +130,14 @@ let tableColumns: ColumnsType = [
},
},
{
title: t('common.operate'),
key: 'id',
title: '结束时间',
dataIndex: 'endTime',
align: 'center',
},
customRender(opt) {
if (!opt.value) return '';
return parseDateToStr(opt.value);
},
}
];
/**表格分页器参数 */
@@ -156,7 +177,12 @@ function fnTableSize({ key }: MenuInfo) {
function fnGetList() {
if (tableState.loading) return;
tableState.loading = true;
listTraceData(toRaw(queryParams)).then(res => {
if (!queryRangePicker.value) {
queryRangePicker.value = ['', ''];
}
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;
@@ -165,176 +191,15 @@ function fnGetList() {
});
}
/**抽屉对象信息状态类型 */
type ModalStateType = {
/**抽屉框是否显示 */
visible: boolean;
/**标题 */
title: string;
/**表单数据 */
from: Record<string, any>;
};
/**抽屉对象信息状态 */
let modalState: ModalStateType = reactive({
visible: false,
title: '',
from: {
rawData: '',
rawDataHTML: '',
downBtn: false,
},
});
/**
* 对话框弹出显示
* @param row 记录信息
*/
function fnModalVisible(row: Record<string, any>) {
// 进制转数据
const hexString = parseBase64Data(row.rawMsg);
const rawData = convertToReadableFormat(hexString);
modalState.from.rawData = rawData;
// RAW解析HTML
getTraceRawInfo(row.id).then(res => {
if (res.code === RESULT_CODE_SUCCESS) {
const htmlString = rawDataHTMLScript(res.msg);
modalState.from.rawDataHTML = htmlString;
modalState.from.downBtn = true;
} else {
modalState.from.rawDataHTML = t('views.traceManage.analysis.noData');
}
});
modalState.title = t('views.traceManage.analysis.taskTitle', {
num: row.imsi,
});
modalState.visible = true;
}
/**
* 对话框弹出关闭
*/
function fnModalVisibleClose() {
modalState.visible = false;
modalState.from.downBtn = false;
modalState.from.rawDataHTML = '';
modalState.from.rawData = '';
}
// 将Base64编码解码为字节数组
function parseBase64Data(hexData: string) {
// 将Base64编码解码为字节数组
const byteString = atob(hexData);
const byteArray = new Uint8Array(byteString.length);
for (let i = 0; i < byteString.length; i++) {
byteArray[i] = byteString.charCodeAt(i);
}
// 将每一个字节转换为2位16进制数表示并拼接起来
let hexString = '';
for (let i = 0; i < byteArray.length; i++) {
const hex = byteArray[i].toString(16);
hexString += hex.length === 1 ? '0' + hex : hex;
}
return hexString;
}
// 转换十六进制字节流为可读格式和ASCII码表示
function convertToReadableFormat(hexString: string) {
let result = '';
let asciiResult = '';
let arr = [];
let row = 100;
for (let i = 0; i < hexString.length; i += 2) {
const hexChars = hexString.substring(i, i + 2);
const decimal = parseInt(hexChars, 16);
const asciiChar =
decimal >= 32 && decimal <= 126 ? String.fromCharCode(decimal) : '.';
result += hexChars + ' ';
asciiResult += asciiChar;
if ((i + 2) % 32 === 0) {
arr.push({
row: row,
code: result,
asciiText: asciiResult,
});
result = '';
asciiResult = '';
row += 10;
}
if (2 + i == hexString.length) {
arr.push({
row: row,
code: result,
asciiText: asciiResult,
});
result = '';
asciiResult = '';
row += 10;
}
}
return arr;
}
// 信息详情HTMl内容处理
function rawDataHTMLScript(htmlString: string) {
// 删除所有 <a> 标签
// const withoutATags = htmlString.replace(/<a\b[^>]*>(.*?)<\/a>/gi, '');
// 删除所有 <script> 标签
let withoutScriptTags = htmlString.replace(
/<script\b[^>]*>([\s\S]*?)<\/script>/gi,
''
);
// 默认全展开
// const withoutHiddenElements = withoutScriptTags.replace(
// /style="display:none"/gi,
// 'style="background:#ffffff"'
// );
function set_node(node: any, str: string) {
if (!node) return;
node.style.display = str;
node.style.background = '#ffffff';
}
Reflect.set(window, 'set_node', set_node);
function toggle_node(node: any) {
node = document.getElementById(node);
if (!node) return;
set_node(node, node.style.display != 'none' ? 'none' : 'block');
}
Reflect.set(window, 'toggle_node', toggle_node);
function hide_node(node: any) {
node = document.getElementById(node);
if (!node) return;
set_node(node, 'none');
}
Reflect.set(window, 'hide_node', hide_node);
// 展开第一个
withoutScriptTags = withoutScriptTags.replace(
'id="f1c" style="display:none"',
'id="f1c" style="display:block"'
);
return withoutScriptTags;
}
/**信息文件下载 */
function fnDownloadFile() {
Modal.confirm({
title: t('common.tipTitle'),
content: t('views.traceManage.analysis.taskDownTip'),
onOk() {
const blob = new Blob([modalState.from.rawDataHTML], {
type: 'text/plain',
});
saveAs(blob, `${modalState.title}_${Date.now()}.html`);
},
});
}
onMounted(() => {
// 初始字典数据
Promise.allSettled([getDict('alarm_status')]).then(resArr => {
if (resArr[0].status === 'fulfilled') {
dict.alarmStatus = resArr[0].value;
}
});
// 获取网元网元列表
useNeInfoStore().fnNelist();
// 获取列表数据
fnGetList();
});
@@ -351,29 +216,30 @@ onMounted(() => {
<a-form :model="queryParams" name="queryParams" layout="horizontal">
<a-row :gutter="16">
<a-col :lg="6" :md="12" :xs="24">
<a-form-item
:label="t('views.traceManage.analysis.imsi')"
name="imsi"
>
<a-input
v-model:value="queryParams.imsi"
:allow-clear="true"
:placeholder="t('views.traceManage.analysis.imsiPlease')"
></a-input>
<a-form-item label="网元类型" name="neType">
<a-auto-complete
v-model:value="queryParams.neType"
:options="useNeInfoStore().getNeSelectOtions"
allow-clear
placeholder="查询网元类型"
/>
</a-form-item>
</a-col>
<a-col :lg="6" :md="12" :xs="24">
<a-form-item
:label="t('views.traceManage.analysis.msisdn')"
name="imsi"
>
<a-input
v-model:value="queryParams.msisdn"
:allow-clear="true"
:placeholder="t('views.traceManage.analysis.msisdnPlease')"
></a-input>
<a-col :lg="8" :md="12" :xs="24">
<a-form-item label="开始时间" name="queryRangePicker">
<a-range-picker
v-model:value="queryRangePicker"
allow-clear
bordered
show-time
value-format="YYYY-MM-DD HH:mm:ss"
format="YYYY-MM-DD HH:mm:ss"
:placeholder="['开始', '结束']"
style="width: 100%"
></a-range-picker>
</a-form-item>
</a-col>
<a-col :lg="6" :md="12" :xs="24">
<a-form-item>
<a-space :size="8">
@@ -416,7 +282,7 @@ onMounted(() => {
</a-tooltip>
<a-tooltip>
<template #title>{{ t('common.sizeText') }}</template>
<a-dropdown trigger="click">
<a-dropdown trigger="click" placement="bottomRight">
<a-button type="text">
<template #icon><ColumnHeightOutlined /></template>
</a-button>
@@ -425,15 +291,15 @@ onMounted(() => {
:selected-keys="[tableState.size as string]"
@click="fnTableSize"
>
<a-menu-item key="default">{{
t('common.size.default')
}}</a-menu-item>
<a-menu-item key="middle">{{
t('common.size.middle')
}}</a-menu-item>
<a-menu-item key="small">{{
t('common.size.small')
}}</a-menu-item>
<a-menu-item key="default">
{{ t('common.size.default') }}
</a-menu-item>
<a-menu-item key="middle">
{{ t('common.size.middle') }}
</a-menu-item>
<a-menu-item key="small">
{{ t('common.size.small') }}
</a-menu-item>
</a-menu>
</template>
</a-dropdown>
@@ -453,57 +319,15 @@ onMounted(() => {
:scroll="{ x: true }"
>
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'id'">
<a-space :size="8" align="center">
<a-tooltip>
<template #title>查看详情</template>
<a-button type="link" @click.prevent="fnModalVisible(record)">
<template #icon><ProfileOutlined /></template>
</a-button>
</a-tooltip>
</a-space>
<template v-if="column.key === 'alarmTitle'">
<a-tooltip>
<template #title>{{ record.operResult }}</template>
<div class="alarmTitleText">{{ record.alarmTitle }}</div>
</a-tooltip>
</template>
</template>
</a-table>
</a-card>
<!-- 详情框 -->
<a-modal
width="800px"
:title="modalState.title"
:visible="modalState.visible"
@cancel="fnModalVisibleClose"
>
<div class="raw-title">
{{ t('views.traceManage.analysis.signalData') }}
</div>
<a-row
class="raw"
:gutter="16"
v-for="v in modalState.from.rawData"
:key="v.row"
>
<a-col class="num" :span="2">{{ v.row }}</a-col>
<a-col class="code" :span="12">{{ v.code }}</a-col>
<a-col class="txt" :span="10">{{ v.asciiText }}</a-col>
</a-row>
<a-divider />
<div class="raw-title">
{{ t('views.traceManage.analysis.signalDetail') }}
<a-button
type="dashed"
size="small"
@click.prevent="fnDownloadFile"
v-if="modalState.from.downBtn"
>
<template #icon>
<DownloadOutlined />
</template>
{{ t('views.traceManage.analysis.taskDownText') }}
</a-button>
</div>
<div class="raw-html" v-html="modalState.from.rawDataHTML"></div>
</a-modal>
</PageContainer>
</template>
@@ -511,26 +335,8 @@ onMounted(() => {
.table :deep(.ant-pagination) {
padding: 0 24px;
}
.raw {
&-title {
color: #000000d9;
font-size: 24px;
line-height: 1.8;
}
.num {
background-color: #e5e5e5;
}
.code {
background-color: #e7e6ff;
}
.txt {
background-color: #ffe3e5;
}
&-html {
max-height: 300px;
overflow-y: scroll;
}
.alarmTitleText {
max-width: 300px;
cursor: pointer;
}
</style>

File diff suppressed because it is too large Load Diff