feat: 跟踪任务功能详情文件页面

This commit is contained in:
TsMask
2024-09-06 16:12:33 +08:00
parent 757f2ec20a
commit ddd8930af4
4 changed files with 233 additions and 53 deletions

View File

@@ -50,3 +50,16 @@ export function stopTaskHLR(data: Record<string, any>) {
data: data,
});
}
/**
* 跟踪任务文件
* @param data 对象
* @returns object
*/
export function fileTaskHLR(data: Record<string, any>) {
return request({
url: '/trace/task/hlr/file',
method: 'post',
data: data,
});
}

View File

@@ -1158,10 +1158,13 @@ export default {
editTask: 'Modify Task',
viewTask: 'View Task',
errorTaskInfo: 'Failed to obtain task information',
delTask: 'Successfully deleted task {num}',
delTaskTip: 'Are you sure to delete the data item with record number {num}?',
stopTask: 'Successful cessation of tasks {num}',
stopTaskTip: 'Confirm stopping the task with record number {num}?',
delTask: 'Successfully deleted task {id}',
delTaskTip: 'Are you sure to delete the data item with record ID {id} ?',
stopTask: 'Successful cessation of tasks {id}',
stopTaskTip: 'Confirm stopping the task with record ID {id} ?',
traceFile: "Tracking File",
errMsg: "Error Message",
imsiORmsisdn: "imsi or msisdn is null, cannot start task",
},
},
faultManage: {

View File

@@ -1120,6 +1120,9 @@ export default {
stopOk: "{title} 任务已结束",
stopErr: "{title} 任务异常",
stopNotRun: "{title} 任务未运行",
traceFile: "跟踪文件",
errMsg: "错误信息",
imsiORmsisdn: "imsi 或 msisdn 是空值,不能开始任务",
},
task: {
neTypePlease: '请选择网元类型',
@@ -1158,10 +1161,10 @@ export default {
editTask: '修改任务',
viewTask: '查看任务',
errorTaskInfo: '获取任务信息失败',
delTask: '成功删除任务 {num}',
delTaskTip: '确认删除记录编号为 {num} 的数据项?',
stopTask: '成功停止任务 {num}',
stopTaskTip: '确认停止记录编号为 {num} 的任务?',
delTask: '成功删除任务 {id}',
delTaskTip: '确认删除记录编号为 {id} 的数据项?',
stopTask: '成功停止任务 {id}',
stopTaskTip: '确认停止记录编号为 {id} 的任务?',
},
},
faultManage: {

View File

@@ -12,7 +12,10 @@ import {
listTaskHLR,
startTaskHLR,
stopTaskHLR,
fileTaskHLR,
} from '@/api/traceManage/taskHLR';
import { getNeFile } from '@/api/tool/neFile';
import saveAs from 'file-saver';
const { t } = useI18n();
/**开始结束时间 */
@@ -47,6 +50,7 @@ function fnQueryReset() {
pageNum: 1,
pageSize: 20,
});
queryRangePicker.value = ['', ''];
tablePagination.current = 1;
tablePagination.pageSize = 20;
fnGetList();
@@ -81,22 +85,26 @@ let tableColumns: ColumnsType = reactive([
title: t('common.rowId'),
dataIndex: 'id',
align: 'right',
width: 50,
},
{
title: t('views.traceManage.task.imsi'),
dataIndex: 'imsi',
align: 'left',
width: 150,
},
{
title: t('views.traceManage.task.msisdn'),
dataIndex: 'msisdn',
align: 'left',
width: 150,
},
{
title: t('views.traceManage.task.status'),
dataIndex: 'status',
align: 'left',
},
// {
// title: t('views.traceManage.task.status'),
// dataIndex: 'status',
// align: 'left',
// width: 100,
// },
{
title: t('views.traceManage.task.startTime'),
dataIndex: 'startTime',
@@ -105,6 +113,7 @@ let tableColumns: ColumnsType = reactive([
if (!opt.value) return '';
return parseDateToStr(opt.value);
},
width: 150,
},
{
title: t('views.traceManage.task.endTime'),
@@ -114,6 +123,7 @@ let tableColumns: ColumnsType = reactive([
if (!opt.value) return '';
return parseDateToStr(opt.value);
},
width: 150,
},
{
title: t('common.operate'),
@@ -150,21 +160,30 @@ let tablePagination = reactive({
},
});
/**表格多选 */
function fnTableSelectedRowKeys(keys: (string | number)[]) {
tableState.selectedRowKeys = keys;
}
/**
* 信息删除
* @param row 记录编号ID
*/
function fnRecordDelete(id: string) {
function fnRecordDelete(row: Record<string, any>) {
Modal.confirm({
title: t('common.tipTitle'),
content: t('views.traceManage.task.delTaskTip', { num: id }),
content: t('views.traceManage.task.delTaskTip', { id: row.id }),
onOk() {
const key = 'delTraceTask';
message.loading({ content: t('common.loading'), key });
delTaskHLR(id).then(res => {
// 进行中的先停止任务后删除记录
if (row.status === '1') {
stopTaskHLR({ id: row.id });
}
delTaskHLR(row.id).then(res => {
if (res.code === RESULT_CODE_SUCCESS) {
message.success({
content: t('views.traceManage.task.delTask', { num: id }),
content: t('views.traceManage.task.delTask', { id: row.id }),
key,
duration: 2,
});
@@ -188,6 +207,11 @@ function fnGetList(pageNum?: number) {
if (pageNum) {
queryParams.pageNum = pageNum;
}
if (!queryRangePicker.value) {
queryRangePicker.value = ['', ''];
}
queryParams.startTime = queryRangePicker.value[0];
queryParams.endTime = queryRangePicker.value[1];
listTaskHLR(toRaw(queryParams)).then(res => {
if (res.code === RESULT_CODE_SUCCESS && Array.isArray(res.rows)) {
// 取消勾选
@@ -214,16 +238,21 @@ function fnGetList(pageNum?: number) {
* @param row 记录编号ID
*/
function fnRecordStop(id: string) {
if (!id || modalState.confirmLoading) return;
if (id === '0') {
id = tableState.selectedRowKeys.join(',');
}
Modal.confirm({
title: t('common.tipTitle'),
content: t('views.traceManage.task.stopTaskTip', { num: id }),
content: t('views.traceManage.task.stopTaskTip', { id }),
onOk() {
const key = 'delTraceTask';
message.loading({ content: t('common.loading'), key });
stopTaskHLR({ id }).then(res => {
if (res.code === RESULT_CODE_SUCCESS) {
message.success({
content: t('views.traceManage.task.stopTask', { num: id }),
content: t('views.traceManage.task.stopTask', { id }),
key,
duration: 2,
});
@@ -254,6 +283,10 @@ type ModalStateType = {
from: Record<string, any>;
/**确定按钮 loading */
confirmLoading: boolean;
/**文件列表数据 */
fileList: any[];
/**错误信息 */
fileErrMsg: string;
};
/**对话框对象信息状态 */
@@ -261,9 +294,6 @@ let modalState: ModalStateType = reactive({
visibleByView: false,
visibleByEdit: false,
title: '',
neType: [],
neTypeInterface: [],
neTypeInterfaceSelect: [],
timeRangePicker: ['', ''],
from: {
id: undefined,
@@ -275,6 +305,8 @@ let modalState: ModalStateType = reactive({
msisdn: '',
},
confirmLoading: false,
fileList: [],
fileErrMsg: '',
});
/**对话框内表单属性和校验规则 */
@@ -290,7 +322,7 @@ const modalStateFrom = Form.useForm(
// 跟踪用户
imsi: [
{
required: true,
required: false,
message: t('views.traceManage.task.imsiPlease'),
},
],
@@ -310,29 +342,34 @@ function fnRangePickerChange(item: any, _: any) {
}
/**
* 对话框弹出显示为 新增或者修改
* @param noticeId 网元id, 不传为新增
* 对话框弹出显示
*/
function fnModalVisibleByVive(row: Record<string, any>) {
function fnModalVisibleByVive(id: Record<string, any>) {
if (modalState.confirmLoading) return;
const hide = message.loading(t('common.loading'), 0);
modalState.confirmLoading = true;
// getTraceTask(id).then(res => {
// modalState.confirmLoading = false;
// hide();
// if (res.code === RESULT_CODE_SUCCESS) {
// modalState.neType = [res.data.neType, res.data.neId];
// modalState.timeRangePicker = [res.data.startTime, res.data.endTime];
// modalState.from = Object.assign(modalState.from, res.data);
fileTaskHLR({ id }).then(res => {
modalState.fileErrMsg = '';
modalState.fileList = [];
modalState.confirmLoading = false;
hide();
if (res.code === RESULT_CODE_SUCCESS) {
for (const item of res.data) {
if (item.err != '') {
modalState.fileErrMsg += `${item.neId}: ${item.err} \n`;
continue;
}
modalState.fileList.push(item);
}
// modalState.confirmLoading = false;
// hide();
// modalState.title = t('views.traceManage.task.viewTask');
// modalState.visibleByView = true;
// } else {
// message.error(t('views.traceManage.task.errorTaskInfo'), 3);
// }
// });
modalState.confirmLoading = false;
hide();
modalState.title = t('views.traceManage.task.viewTask');
modalState.visibleByView = true;
} else {
message.error(t('views.traceManage.task.errorTaskInfo'), 3);
}
});
}
/**
@@ -352,12 +389,21 @@ function fnModalVisibleByEdit(id?: string) {
* 进行表达规则校验
*/
function fnModalOk() {
const from = toRaw(modalState.from);
if (from.imsi === '' && from.msisdn === '') {
message.warning({
content: t('views.traceManage.task.imsiORmsisdn'),
duration: 3,
});
return;
}
modalStateFrom
.validate()
.then(e => {
modalState.confirmLoading = true;
const hide = message.loading(t('common.loading'), 0);
const from = toRaw(modalState.from);
startTaskHLR(from)
.then(res => {
if (res.code === RESULT_CODE_SUCCESS) {
@@ -396,6 +442,50 @@ function fnModalCancel() {
modalState.timeRangePicker = ['', ''];
}
/**下载触发等待 */
let downLoading = ref<boolean>(false);
/**信息文件下载 */
function fnDownloadFile(row: Record<string, any>) {
if (downLoading.value) return;
Modal.confirm({
title: t('common.tipTitle'),
content: t('views.logManage.neFile.downTip', { fileName: row.fileName }),
onOk() {
downLoading.value = true;
const hide = message.loading(t('common.loading'), 0);
const path = row.filePath.substring(0, row.filePath.lastIndexOf('/'));
getNeFile({
neType: row.neType,
neId: row.neId,
path: path,
fileName: row.fileName,
delTemp: true,
})
.then(res => {
if (res.code === RESULT_CODE_SUCCESS) {
message.success({
content: t('common.msgSuccess', {
msg: t('common.downloadText'),
}),
duration: 2,
});
saveAs(res.data, `${row.fileName}`);
} else {
message.error({
content: t('views.logManage.neFile.downTipErr'),
duration: 2,
});
}
})
.finally(() => {
hide();
downLoading.value = false;
});
},
});
}
onMounted(() => {
// 获取列表数据
fnGetList();
@@ -471,10 +561,22 @@ onMounted(() => {
<a-card :bordered="false" :body-style="{ padding: '0px' }">
<!-- 插槽-卡片左侧侧 -->
<template #title>
<a-button type="primary" @click.prevent="fnModalVisibleByEdit()">
<template #icon><PlusOutlined /></template>
{{ t('common.addText') }}
</a-button>
<a-space :size="8" align="center">
<a-button type="primary" @click.prevent="fnModalVisibleByEdit()">
<template #icon><PlusOutlined /></template>
{{ t('common.addText') }}
</a-button>
<a-button
type="default"
danger
:disabled="tableState.selectedRowKeys.length <= 0"
:loading="modalState.confirmLoading"
@click.prevent="fnRecordStop('0')"
>
<template #icon><StopOutlined /></template>
{{ t('views.traceManage.task.textStop') }}
</a-button>
</a-space>
</template>
<!-- 插槽-卡片右侧 -->
@@ -499,6 +601,12 @@ onMounted(() => {
:size="tableState.size"
:pagination="tablePagination"
:scroll="{ x: true }"
:row-selection="{
type: 'checkbox',
columnWidth: '48px',
selectedRowKeys: tableState.selectedRowKeys,
onChange: fnTableSelectedRowKeys,
}"
>
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'id'">
@@ -515,21 +623,18 @@ onMounted(() => {
<template #icon><StopOutlined /></template>
</a-button>
</a-tooltip>
<a-tooltip v-if="record.status === '0'">
<a-tooltip>
<template #title>{{ t('common.viewText') }}</template>
<a-button
type="link"
@click.prevent="fnModalVisibleByVive(record)"
@click.prevent="fnModalVisibleByVive(record.id)"
>
<template #icon><ProfileOutlined /></template>
</a-button>
</a-tooltip>
<a-tooltip v-if="record.status === '0'">
<a-tooltip>
<template #title>{{ t('common.deleteText') }}</template>
<a-button
type="link"
@click.prevent="fnRecordDelete(record.id)"
>
<a-button type="link" @click.prevent="fnRecordDelete(record)">
<template #icon><DeleteOutlined /></template>
</a-button>
</a-tooltip>
@@ -539,6 +644,56 @@ onMounted(() => {
</a-table>
</a-card>
<!-- 详情框 -->
<ProModal
:drag="true"
:visible="modalState.visibleByView"
:title="modalState.title"
@cancel="fnModalCancel"
:footer="null"
>
<a-form
name="fileList"
layout="horizontal"
autocomplete="off"
:label-col="{ span: 5 }"
:label-wrap="true"
>
<a-form-item
:label="t('views.traceManage.task.traceFile')"
name="fileTree"
v-show="modalState.fileList.length > 0"
>
<a-tree
:height="250"
:tree-data="modalState.fileList"
:field-names="{ title: 'fileName', key: 'filePath' }"
>
<template #title="item">
<span>{{ item.fileName }}</span>
<span
class="fileTree-download"
@click.prevent="fnDownloadFile(item)"
>
{{ t('common.downloadText') }}
</span>
</template>
</a-tree>
</a-form-item>
<a-form-item
:label="t('views.traceManage.task.errMsg')"
name="fileErrMsg"
v-show="modalState.fileErrMsg.length > 0"
>
<a-textarea
v-model:value="modalState.fileErrMsg"
:auto-size="{ minRows: 2, maxRows: 6 }"
:disabled="true"
/>
</a-form-item>
</a-form>
</ProModal>
<!-- 新增框或修改框 -->
<ProModal
:drag="true"
@@ -638,4 +793,10 @@ onMounted(() => {
.table :deep(.ant-pagination) {
padding: 0 24px;
}
.fileTree-download {
margin-left: 12px;
color: #eb2f96;
text-decoration: underline;
}
</style>