style: UE终端表格优化

This commit is contained in:
TsMask
2023-11-30 16:45:55 +08:00
parent f2d5379506
commit 805785ccb7
7 changed files with 92 additions and 57 deletions

View File

@@ -26,5 +26,38 @@ export async function listUE(query: Record<string, any>) {
data.total = rows.length;
data.rows = rows;
}
// 模拟数据
// data.rows = [
// {
// imsi: 'imsi-460029004200044',
// msisdn: 'msisdn-12346002044',
// pduSessionInfo: [
// {
// activeTime: '2023-11-29 18:39:06',
// dnn: 'ims',
// ipv4: '10.10.48.97',
// ipv6: '',
// pduSessionID: 6,
// ranN3IP: '192.168.8.223',
// sstSD: '1-000001',
// tai: '46000-0001',
// upfN3IP: '192.168.1.161',
// },
// {
// activeTime: '2023-11-29 18:39:05',
// dnn: 'cmnet',
// ipv4: '10.10.48.62',
// ipv6: '',
// pduSessionID: 5,
// ranN3IP: '192.168.8.223',
// sstSD: '1-000001',
// tai: '46000-0001',
// upfN3IP: '192.168.1.163',
// },
// ],
// ratType: 'EUTRAN',
// },
// ];
return data;
}

View File

@@ -86,21 +86,21 @@ let tableColumns: ColumnsType = [
{
title: 'IMSI',
dataIndex: 'imsi',
align: 'left',
align: 'center',
sorter: true,
width: 150,
},
{
title: 'AMF',
dataIndex: 'amf',
align: 'left',
width: 100,
align: 'center',
width: 80,
},
{
title: 'Status',
dataIndex: 'status',
align: 'left',
width: 100,
align: 'center',
width: 80,
},
// {
// title: 'KI',
@@ -117,7 +117,7 @@ let tableColumns: ColumnsType = [
{
title: 'Algo Index',
dataIndex: 'algoIndex',
align: 'left',
align: 'center',
width: 100,
},
{

View File

@@ -69,26 +69,25 @@ let tableColumns: ColumnsType = [
{
title: 'NodeB ID',
dataIndex: 'id',
align: 'left',
width: 150,
align: 'center',
width: 100,
},
{
title: 'UE Number',
dataIndex: 'ueNum',
align: 'left',
width: 150,
align: 'center',
width: 100,
},
{
title: 'NodeB Name',
dataIndex: 'name',
align: 'left',
align: 'center',
width: 150,
},
{
title: 'NodeB Address',
dataIndex: 'address',
align: 'left',
minWidth: 150,
},
];

View File

@@ -72,32 +72,32 @@ let tableColumns: ColumnsType = [
{
title: 'IMSI',
dataIndex: 'imsi',
align: 'left',
align: 'center',
width: 150,
},
{
title: 'MSISDN',
dataIndex: 'msisdn',
align: 'left',
align: 'center',
width: 150,
},
{
title: 'Barring',
dataIndex: 'barring',
align: 'left',
width: 150,
align: 'center',
width: 80,
},
{
title: 'Registration State',
dataIndex: 'regState',
align: 'left',
align: 'center',
width: 150,
},
{
title: 'Active Time',
dataIndex: 'activeTime',
align: 'left',
align: 'center',
width: 150,
},
{

View File

@@ -61,26 +61,26 @@ let tableColumns: ColumnsType = [
{
title: 'IMSI',
dataIndex: 'imsi',
align: 'left',
align: 'center',
width: 150,
},
{
title: 'ActiveTime',
dataIndex: 'activeTime',
align: 'left',
align: 'center',
width: 150,
},
{
title: 'RegState',
dataIndex: 'regState',
align: 'left',
align: 'center',
width: 100,
},
{
title: 'Network Access Identity',
dataIndex: 'nai',
align: 'left',
minWidth: 100,
width: 500,
},
];
@@ -150,7 +150,7 @@ onMounted(() => {
<!-- 表格搜索栏 -->
<a-form :model="queryParams" name="queryParams" layout="horizontal">
<a-row :gutter="16">
<a-col :lg="6" :md="12" :xs="24">
<a-col :lg="8" :md="12" :xs="24">
<a-form-item :label="t('views.neUser.n3iwf.neType')" name="neId ">
<a-select
v-model:value="queryParams.neId"
@@ -262,7 +262,7 @@ onMounted(() => {
:size="tableState.size"
:row-class-name="fnTableStriped"
:pagination="false"
:scroll="{ y: 450 }"
:scroll="{ y: 'calc(100vh - 480px)' }"
>
</a-table>
</a-card>

View File

@@ -89,7 +89,7 @@ let tableColumns: ColumnsType = [
{
title: 'IMSI',
dataIndex: 'imsi',
align: 'left',
align: 'center',
fixed: 'left',
sorter: true,
resizable: true,
@@ -100,60 +100,61 @@ let tableColumns: ColumnsType = [
{
title: 'MSISDN',
dataIndex: 'msisdn',
align: 'left',
align: 'center',
fixed: 'left',
sorter: true,
resizable: true,
width: 150,
minWidth: 150,
maxWidth: 300,
},
{
title: 'Subscribed AMBR Temp',
title: 'Subscribed AMBR',
dataIndex: 'ambr',
align: 'left',
width: 200,
align: 'center',
width: 100,
},
{
title: 'Subscribed SNSSAIs Temp',
title: 'Subscribed SNSSAIs',
dataIndex: 'sar',
align: 'left',
width: 200,
align: 'center',
width: 100,
},
{
title: 'RAT Restriction',
title: 'RAT',
dataIndex: 'rat',
align: 'left',
width: 200,
align: 'center',
width: 50,
},
{
title: 'Forbidden Areas Temp',
title: 'Forbidden Areas',
dataIndex: 'arfb',
align: 'left',
width: 200,
align: 'center',
width: 100,
},
{
title: 'Service Area Restrict Temp',
title: 'Service Area Restrict',
dataIndex: 'nssai',
align: 'left',
width: 200,
align: 'center',
width: 100,
},
{
title: 'CN Type Restriction',
title: 'CN Type',
dataIndex: 'cn',
align: 'left',
width: 200,
align: 'center',
width: 100,
},
{
title: 'EPS Flag',
title: 'EPS',
dataIndex: 'epsFlag',
align: 'left',
align: 'center',
width: 100,
},
{
title: 'Subscribed Data',
dataIndex: 'smData',
align: 'left',
resizable: true,
width: 500,
minWidth: 150,
maxWidth: 500,
},
{
title: t('common.operate'),
@@ -1100,7 +1101,7 @@ onMounted(() => {
:size="tableState.size"
:row-class-name="fnTableStriped"
:pagination="tablePagination"
:scroll="{ x: tableColumnsDnd.length * 200, y: 'calc(100vh - 480px)' }"
:scroll="{ y: 'calc(100vh - 480px)' }"
@change="fnTableChange"
@resizeColumn="(w:number, col:any) => (col.width = w)"
>
@@ -1137,6 +1138,7 @@ onMounted(() => {
<!-- 新增框或修改框 -->
<DraggableModal
style="top: 0px"
width="800px"
:body-style="{ maxHeight: '650px', 'overflow-y': 'auto' }"
:keyboard="false"
@@ -1568,6 +1570,7 @@ onMounted(() => {
<!-- 批量增加框 -->
<DraggableModal
style="top: 0px"
width="800px"
:body-style="{ maxHeight: '650px', 'overflow-y': 'auto' }"
:keyboard="false"
@@ -1999,6 +2002,7 @@ onMounted(() => {
<!-- 批量删除框 -->
<DraggableModal
style="top: 0px"
width="500px"
:keyboard="false"
:mask-closable="false"

View File

@@ -80,7 +80,7 @@ let tableColumns: ColumnsType = [
}
return opt.value;
},
width: 3,
width: 150,
},
{
title: 'MSISDN',
@@ -93,18 +93,18 @@ let tableColumns: ColumnsType = [
}
return opt.value;
},
width: 3,
width: 150,
},
{
title: 'RAT Type',
dataIndex: 'ratType',
align: 'center',
width: 3,
width: 100,
},
{
title: 'DNN List',
dataIndex: 'pduSessionInfo',
align: 'center',
align: 'left',
customRender(opt) {
if (opt.value) {
let arr = [];
@@ -117,13 +117,12 @@ let tableColumns: ColumnsType = [
}
return '';
},
width: 5,
width: 150,
},
{
title: t('common.operate'),
key: 'imsi',
align: 'center',
width: 3,
align: 'left',
},
];