Merge branch 'main-v2' into lite-ba

public/default/config.js

@@ -15,7 +15,7 @@
   const protocol = window.location.protocol
   let wsprotocol = "ws:"
   const hostname = window.location.hostname
-  let host = `${hostname}:33030`;
+  let host = `${hostname}:33080`;
   if (protocol === 'https:') {
     host = `${hostname}:33443`;
     wsprotocol = "wss:"
@@ -25,4 +25,4 @@
   sessionStorage.setItem('baseUrl', `${protocol}//${host}`);
   // websocket Address
   sessionStorage.setItem('wsUrl', `${wsprotocol}//${host}`);
-})();
+})();

public/neDataImput/pcf_template.txt

@@ -1,2 +1,2 @@
-#imsi,msisdn,sess_rules,pcc_rules,hdr_enrich,rfsp,sar,qos_audio,qos_video,online,offline
-460996650000580,62357000580,internet|ims_sig,internet|ims_sig,dnn,1,def_sar,qos_audio,qos_video,0,0
+imsi,msisdn,sess_rules,pcc_rules,hdr_enrich,rfsp,sar,qos_audio,qos_video
+001012082101039,1234,internet|ims_sig,internet|ims_sig,321321,255,321312,32131,32131

public/neDataImput/udm_auth_template.txt

@@ -1,2 +1,2 @@
-460996650000580,1234567890ABCDEF1234567890ABCDEF,0,8000
-460996650000581,1234567890ABCDEF1234567890ABCDEF,0,8000
+001011100001157,1234567890ABCDEF1234567890ABCDEF,0,8000,11111111111111111111111111111111
+001011100001158,1234567890ABCDEF1234567890ABCDEF,0,8000,11111111111111111111111111111111

public/neDataImput/udm_sub_template.txt

@@ -1,2 +1,2 @@
-460996650000580,62357000580,def_ambr,def_nssai,def_arfb,def_sar,0,3,def_snssai,1-000001&content&ims,1,64,24,65,def_eps,1,010200000000,-
-460996650000581,62357000581,def_ambr,def_nssai,def_arfb,def_sar,0,3,def_snssai,1-000001&content&ims,1,64,24,65,def_eps,1,010200000000,-
+001011100001157,62357000583,def_ambr,def_nssai,def_arfb,def_sar,0,3,def_snssai,1-000001&internet&ims,1,64,24,65,def_eps,1,010200000000,-
+001011100001158,62357000585,def_ambr,def_nssai,def_arfb,def_sar,0,3,def_snssai,1-000001&internet&ims,1,64,24,65,def_eps,1,010200000000,-

src/router/index.ts

@@ -66,14 +66,14 @@ router.beforeEach(async (to, from, next) => {
     await appStore.fnSysConf();
   }
 
-  // 需要系统引导跳转
-  if (appStore.bootloader && to.path !== '/quick-start') {
-    next({ name: 'QuickStart' });
-  }
-  // 不重复引导
-  if (!appStore.bootloader && to.path === '/quick-start') {
-    next({ name: 'Index' });
-  }
+  // // 需要系统引导跳转
+  // if (appStore.bootloader && to.path !== '/quick-start') {
+  //   next({ name: 'QuickStart' });
+  // }
+  // // 不重复引导
+  // if (!appStore.bootloader && to.path === '/quick-start') {
+  //   next({ name: 'Index' });
+  // }
 
   let token = getAccessToken();
 

src/store/modules/app.ts

@@ -22,7 +22,7 @@ type AppStore = {
   /**版本号 */
   version: string;
   /**系统引导使用 */
-  bootloader: boolean;
+  // bootloader: boolean;
   /**服务版本 */
   serverVersion: string;
   // 用户登录认证
@@ -59,7 +59,7 @@ const useAppStore = defineStore('app', {
     appVersion: import.meta.env.VITE_APP_VERSION,
 
     version: '-',
-    bootloader: false,
+    // bootloader: false,
     serverVersion: '-',
     loginAuth: true,
     cryptoApi: true,
@@ -91,12 +91,12 @@ const useAppStore = defineStore('app', {
       if (res.code === RESULT_CODE_SUCCESS && res.data) {
         this.version = res.data.version;
         this.serverVersion = res.data.serverVersion;
-        this.bootloader = res.data.bootloader === 'true';
-        // 引导时
-        if (this.bootloader) {
-          delAccessToken();
-          delRefreshToken();
-        }
+        // this.bootloader = res.data.bootloader === 'true';
+        // // 引导时
+        // if (this.bootloader) {
+        //   delAccessToken();
+        //   delRefreshToken();
+        // }
         this.loginAuth = res.data.loginAuth !== 'false';
         this.cryptoApi = res.data.cryptoApi !== 'false';
         sessionSet(CACHE_SESSION_CRYPTO_API, res.data.cryptoApi);

src/views/account/components/reset-passwd.vue

@@ -90,7 +90,7 @@ function fnFinish() {
       :rules="[
         {
           required: true,
-          min: 6,
+          min: 5,
           max: 26,
           message: t('views.account.settings.oldPasswordTip'),
         },

src/views/configManage/neOverview/index.vue

@@ -63,7 +63,7 @@ let tableColumns: ColumnsType = [
     align: 'left',
     customRender(opt) {
       if (opt.value?.refreshTime) {
-        return parseDateToStr(opt.value?.refreshTime);
+        return parseDateToStr(opt.value?.refreshTime, 'HH:mm:ss');
       }
       return '-';
     },
@@ -94,8 +94,11 @@ let tableColumns: ColumnsType = [
   },
   {
     title: t('views.index.ipAddress'),
-    dataIndex: 'ip',
+    dataIndex: 'serverState',
     align: 'left',
+    customRender(opt) {
+      return opt.value?.neIP || '-';
+    },
   },
 ];
 
@@ -148,10 +151,10 @@ async function fnGetList(reload: boolean = false) {
   if (!reload) {
     // 选择第一个
     if (tableState.data.length > 0) {
-      const item = tableState.data.find((item: any) => item.status === 1)
+      const item = tableState.data.find((item: any) => item.status === 1) 
       if (item) {
         const id = item.id;
-        fnTableSelectedRowKeys([id]);
+        fnTableSelectedRowKeys([id]); 
       }
     } else {
       fnTableSelectedRowKeys(tableState.selectedRowKeys);
@@ -247,9 +250,8 @@ function fnTableSelectedRowKeys(keys: (string | number)[]) {
 
   serverState.value = Object.assign(
     {
-      // cpuUse: `NE:${nfCpuP}%; SYS:${sysCpuP}%`,
-      // memoryUse: `Total: ${totalMemInMB}MB; NE: ${nfUsedMemInMB}MB; SYS: ${sysMemUsageInMB}MB`,
-      neIP: row.ip,
+     // cpuUse: `NE:${nfCpuP}%; SYS:${sysCpuP}%`,
+     // memoryUse: `Total: ${totalMemInMB}MB; NE: ${nfUsedMemInMB}MB; SYS: ${sysMemUsageInMB}MB`,
     },
     neState
   );
@@ -313,13 +315,16 @@ onBeforeUnmount(() => {
     <a-row :gutter="16">
       <a-col :lg="14" :md="16" :xs="24">
         <!-- 表格列表 -->
-        <a-table class="table" row-key="id" size="small" :columns="tableColumns" :data-source="tableState.data"
-          :loading="tableState.loading" :pagination="false" :scroll="{ x: true }" :row-selection="{
-            type: 'radio',
-            columnWidth: '48px',
-            selectedRowKeys: tableState.selectedRowKeys,
-            onChange: fnTableSelectedRowKeys,
-          }">
+        <a-table
+          class="table"
+          row-key="id"
+          size="small"
+          :columns="tableColumns"
+          :data-source="tableState.data"
+          :loading="tableState.loading"
+          :pagination="false"
+          :scroll="{ x: true }"
+        >
           <template #bodyCell="{ column, record }">
             <template v-if="column.key === 'status'">
               <DictTag :options="dict.neInfoStatus" :value="record.status" />
@@ -328,12 +333,25 @@ onBeforeUnmount(() => {
         </a-table>
       </a-col>
       <a-col :lg="10" :md="8" :xs="24">
-        <a-card :title="t('views.index.runStatus')" style="margin-bottom: 16px" size="small">
+        <a-card
+          :title="t('views.index.runStatus')"
+          style="margin-bottom: 16px"
+          size="small"
+        >
           <div style="width: 100%; min-height: 200px" ref="statusBar"></div>
         </a-card>
-        <a-card :loading="tableState.loading" :title="`${t('views.index.mark')} - ${serverState.neName || 'OMC'}`"
-          style="margin-top: 16px" size="small">
-          <a-descriptions bordered :column="1" :label-style="{ width: '160px' }">
+        <a-card
+          :loading="tableState.loading"
+          :title="`${t('views.index.mark')} - ${serverState.neName || 'OMC'}`"
+          style="margin-top: 16px"
+          size="small"
+          v-if="false"
+        >
+          <a-descriptions
+            bordered
+            :column="1"
+            :label-style="{ width: '160px' }"
+          >
             <a-descriptions-item :label="t('views.index.hostName')">
               {{ serverState.hostname }}
             </a-descriptions-item>

src/views/dashboard/overview/components/NeResources/index.vue

@@ -247,7 +247,42 @@ function fnChangeData(data: any[], itemID: string) {
   // console.log(info.neState.cpu.sysCpuUsage);
   // console.log(info.neState.mem);
   // console.log(info.neState.disk);
-  const { nfCpuUsage, sysCpuUsage, sysMemUsage, sysDiskUsage } = info.neState
+  let sysCpuUsage = 0;
+  let nfCpuUsage = 0;
+  if (info.neState.cpu) {
+    nfCpuUsage = info.neState.cpu.nfCpuUsage;
+    const nfCpu = +(info.neState.cpu.nfCpuUsage / 100);
+    nfCpuUsage = +nfCpu.toFixed(2);
+    if (nfCpuUsage > 100) {
+      nfCpuUsage = 100;
+    }
+
+    sysCpuUsage = info.neState.cpu.sysCpuUsage;
+    let sysCpu = +(info.neState.cpu.sysCpuUsage / 100);
+    sysCpuUsage = +sysCpu.toFixed(2);
+    if (sysCpuUsage > 100) {
+      sysCpuUsage = 100;
+    }
+  }
+
+  let sysMemUsage = 0;
+  if (info.neState.mem) {
+    const men = info.neState.mem.sysMemUsage;
+    sysMemUsage = +(men / 100).toFixed(2);
+    if (sysMemUsage > 100) {
+      sysMemUsage = 100;
+    }
+  }
+
+  let sysDiskUsage = 0;
+  if (info.neState.disk && Array.isArray(info.neState.disk.partitionInfo)) {
+    let disks: any[] = info.neState.disk.partitionInfo;
+    disks = disks.sort((a, b) => +b.used - +a.used);
+    if (disks.length > 0) {
+      const { total, used } = disks[0];
+      sysDiskUsage = +((used / total) * 100).toFixed(2);
+    }
+  }
 
   category.value[0].value = sysDiskUsage;
   category.value[1].value = sysMemUsage;

src/views/dashboard/overview/hooks/useTopology.ts

@@ -74,7 +74,8 @@ export function neStateParse(neType: string, data: Record<string, any>) {
 
   // 更新网元状态
   const newNeState = Object.assign(node.neState, data, {
-    refreshTime: parseDateToStr(data.refreshTime, 'MM-DD HH:mm:ss'),
+    refreshTime: parseDateToStr(data.refreshTime, 'HH:mm:ss'),
+    online: !!data.cpu,
   });
 
   // 通过 ID 查询节点实例

src/views/dashboard/overview/index.vue

@@ -679,7 +679,6 @@ onBeforeUnmount(() => {
 .toDeep :deep(.ant-select-selection-item) {
   color: #fff;
 }
-
 .toDeep-text {
   color: #4c9bfd !important;
   font-size: 0.844rem !important;

src/views/dashboard/overview2/components/NeResources/index.vue

@@ -71,8 +71,9 @@ const optionData: any = {
       label: {
         normal: {
           formatter: () => {
-            return `${t('views.dashboard.overview.resources.neCpu')}\n${resourceData.value.neCpu
-              }%`;
+            return `${t('views.dashboard.overview.resources.neCpu')}\n${
+              resourceData.value.neCpu
+            }%`;
           },
           textStyle: {
             fontSize: 12,
@@ -102,8 +103,9 @@ const optionData: any = {
       label: {
         normal: {
           formatter: () => {
-            return `${t('views.dashboard.overview.resources.sysCpu')}\n${resourceData.value.sysCpu
-              }%`;
+            return `${t('views.dashboard.overview.resources.sysCpu')}\n${
+              resourceData.value.sysCpu
+            }%`;
           },
           textStyle: {
             fontSize: 12,
@@ -133,8 +135,9 @@ const optionData: any = {
       label: {
         normal: {
           formatter: () => {
-            return `${t('views.dashboard.overview.resources.sysMem')}\n${resourceData.value.sysMem
-              }%`;
+            return `${t('views.dashboard.overview.resources.sysMem')}\n${
+              resourceData.value.sysMem
+            }%`;
           },
           textStyle: {
             fontSize: 12,
@@ -164,8 +167,9 @@ const optionData: any = {
       label: {
         normal: {
           formatter: () => {
-            return `${t('views.dashboard.overview.resources.sysDisk')}\n${resourceData.value.sysDisk
-              }%`;
+            return `${t('views.dashboard.overview.resources.sysDisk')}\n${
+              resourceData.value.sysDisk
+            }%`;
           },
           textStyle: {
             fontSize: 12,
@@ -209,7 +213,45 @@ function fnChangeData(data: any[], itemID: string) {
   let info = data.find((item: any) => item.id === neType);
   if (!info || !info.neStateMap[neID]?.online) return;
 
-  const { nfCpuUsage, sysCpuUsage, sysMemUsage, sysDiskUsage } = info.neStateMap[neID]
+  let sysCpuUsage = 0;
+  let nfCpuUsage = 0;
+  if (info.neStateMap[neID].cpu) {
+    nfCpuUsage = info.neStateMap[neID].cpu.nfCpuUsage;
+    const nfCpu = +(info.neStateMap[neID].cpu.nfCpuUsage / 100);
+    nfCpuUsage = +nfCpu.toFixed(2);
+    if (nfCpuUsage > 100) {
+      nfCpuUsage = 100;
+    }
+
+    sysCpuUsage = info.neStateMap[neID].cpu.sysCpuUsage;
+    let sysCpu = +(info.neStateMap[neID].cpu.sysCpuUsage / 100);
+    sysCpuUsage = +sysCpu.toFixed(2);
+    if (sysCpuUsage > 100) {
+      sysCpuUsage = 100;
+    }
+  }
+
+  let sysMemUsage = 0;
+  if (info.neStateMap[neID].mem) {
+    const men = info.neStateMap[neID].mem.sysMemUsage;
+    sysMemUsage = +(men / 100).toFixed(2);
+    if (sysMemUsage > 100) {
+      sysMemUsage = 100;
+    }
+  }
+
+  let sysDiskUsage = 0;
+  if (
+    info.neStateMap[neID].disk &&
+    Array.isArray(info.neStateMap[neID].disk.partitionInfo)
+  ) {
+    let disks: any[] = info.neStateMap[neID].disk.partitionInfo;
+    disks = disks.sort((a, b) => +b.used - +a.used);
+    if (disks.length > 0) {
+      const { total, used } = disks[0];
+      sysDiskUsage = +((used / total) * 100).toFixed(2);
+    }
+  }
 
   resourceData.value = {
     neCpu: nfCpuUsage,
@@ -227,8 +269,9 @@ function fnChangeData(data: any[], itemID: string) {
         label: {
           normal: {
             formatter: () => {
-              return `${t('views.dashboard.overview.resources.neCpu')}\n${resourceData.value.neCpu
-                }%`;
+              return `${t('views.dashboard.overview.resources.neCpu')}\n${
+                resourceData.value.neCpu
+              }%`;
             },
           },
         },
@@ -239,8 +282,9 @@ function fnChangeData(data: any[], itemID: string) {
         label: {
           normal: {
             formatter: () => {
-              return `${t('views.dashboard.overview.resources.sysCpu')}\n${resourceData.value.sysCpu
-                }%`;
+              return `${t('views.dashboard.overview.resources.sysCpu')}\n${
+                resourceData.value.sysCpu
+              }%`;
             },
           },
         },
@@ -251,8 +295,9 @@ function fnChangeData(data: any[], itemID: string) {
         label: {
           normal: {
             formatter: () => {
-              return `${t('views.dashboard.overview.resources.sysMem')}\n${resourceData.value.sysMem
-                }%`;
+              return `${t('views.dashboard.overview.resources.sysMem')}\n${
+                resourceData.value.sysMem
+              }%`;
             },
           },
         },
@@ -263,8 +308,9 @@ function fnChangeData(data: any[], itemID: string) {
         label: {
           normal: {
             formatter: () => {
-              return `${t('views.dashboard.overview.resources.sysDisk')}\n${resourceData.value.sysDisk
-                }%`;
+              return `${t('views.dashboard.overview.resources.sysDisk')}\n${
+                resourceData.value.sysDisk
+              }%`;
             },
           },
         },

src/views/dashboard/overview2/hooks/useTopology.ts

@@ -38,16 +38,18 @@ export const graphG6 = ref<any>(null);
 export const graphNodeClickID = ref<string>('UPF_001');
 
 /**图节点网元信息状态 */
-export const graphNodeState = computed(() => {
-  return graphState.data.nodes.map((item: any) => ({
+export const graphNodeState = computed(() =>{
+ return  graphState.data.nodes.map((item: any) => ({
     id: item.id,
     label: item.label,
     neInfo: item.neInfo,
     neState: item.neState,
-    neInfoList: item.neInfoList,
+    neInfoList:item.neInfoList,
     neStateMap: item.neStateMap,
-  }));
-});
+  }))
+}
+
+);
 
 /**图节点网元状态数量 */
 export const graphNodeStateNum = computed(() => {
@@ -70,12 +72,8 @@ export const graphNodeStateNum = computed(() => {
 export const neStateRequestMap = ref<Map<string, boolean>>(new Map());
 
 /**neStateParse 网元状态 数据解析 */
-export function neStateParse(
-  neType: string,
-  data: Record<string, any>,
-  neId: string
-) {
-  // console.log('neStateParse',neType, data, neId);
+export function neStateParse(neType: string, data: Record<string, any>,neId: string) {
+ // console.log('neStateParse',neType, data, neId);
 
   const { combos, edges, nodes } = graphState.data;
 
@@ -84,24 +82,25 @@ export function neStateParse(
 
   if (!node) return;
 
-  // 初始化状态映射
-  if (!node.neStateMap) node.neStateMap = {};
+    // 初始化状态映射
+    if (!node.neStateMap) node.neStateMap = {};
 
   // 更新网元状态
-  const newNeState: any = {
-    ...data, // 先展开data对象
-    refreshTime: parseDateToStr(data.refreshTime, 'MM-DD HH:mm:ss'),
-    neId: neId,
+  const newNeState :any = {
+    ...data,  // 先展开data对象
+    refreshTime: parseDateToStr(data.refreshTime, 'HH:mm:ss'),
+    online: !!data.cpu,
+    neId: neId
   };
-  // 如果是001，更新节点状态。neInfo为主要的网元信息
-  if (node.neInfo && node.neInfo.neId === neId) {
-    Object.assign(node.neState, newNeState);
-  }
+    // 如果是001，更新节点状态。neInfo为主要的网元信息
+    if (node.neInfo && node.neInfo.neId === neId) {
+      Object.assign(node.neState, newNeState);
+    }
 
-  //console.log(node.neState)
-  // 无论是否为主要网元，都更新状态映射
-  node.neStateMap[neId] = { ...newNeState };
-  // 通过 ID 查询节点实例
+    //console.log(node.neState)
+    // 无论是否为主要网元，都更新状态映射
+    node.neStateMap[neId] = {...newNeState};
+      // 通过 ID 查询节点实例
   const item = graphG6.value.findById(node.id);
   if (item) {
     // 检查当前节点下所有网元的状态
@@ -110,33 +109,32 @@ export function neStateParse(
     let stateColor = '#52c41a'; // 默认绿色（所有网元都正常）
     if (allStates.some((state: any) => !state.online)) {
       // 如果有任何一个网元不正常
-      stateColor = allStates.every((state: any) => !state.online)
-        ? '#f5222d'
-        : '#faad14'; // 红色（全部不正常）或黄色（部分不正常）
+      stateColor = allStates.every((state: any) => !state.online) ? '#f5222d' : '#faad14'; // 红色（全部不正常）或黄色（部分不正常）
     }
 
-    // 图片类型不能填充
-    if (node.type && node.type.startsWith('image')) {
-      // 更新节点
-      if (node.label !== newNeState.neType) {
+      // 图片类型不能填充
+      if (node.type && node.type.startsWith('image')) {
+        // 更新节点
+        if (node.label !== newNeState.neType) {
+          graphG6.value.updateItem(item, {
+            label: newNeState.neType,
+          });
+        }
+        // 设置状态
+        graphG6.value.setItemState(item, 'top-right-dot', stateColor);
+      } else {
+        // 更新节点
         graphG6.value.updateItem(item, {
           label: newNeState.neType,
+          style: {
+            fill: stateColor, // 填充色
+            stroke: stateColor, // 填充色
+          },
         });
+        // 设置状态
+        graphG6.value.setItemState(item, 'stroke', newNeState.online);
       }
-      // 设置状态
-      graphG6.value.setItemState(item, 'top-right-dot', stateColor);
-    } else {
-      // 更新节点
-      graphG6.value.updateItem(item, {
-        label: newNeState.neType,
-        style: {
-          fill: stateColor, // 填充色
-          stroke: stateColor, // 填充色
-        },
-      });
-      // 设置状态
-      graphG6.value.setItemState(item, 'stroke', newNeState.online);
-    }
+
   }
 
   // 设置边状态

src/views/login/components/CardLogin.vue

@@ -165,7 +165,7 @@ onMounted(() => {
         :rules="[
           {
             required: true,
-            min: 6,
+            min: 5,
             max: 26,
             message: t('valid.passwordPlease'),
           },

src/views/login/components/CardLoginForLDAP.vue

@@ -87,7 +87,7 @@ function fnFinish() {
         :rules="[
           {
             required: true,
-            min: 6,
+            min: 5,
             max: 26,
             message: t('valid.passwordPlease'),
           },

src/views/login/components/CardLoginForSMTP.vue

@@ -87,7 +87,7 @@ function fnFinish() {
         :rules="[
           {
             required: true,
-            min: 6,
+            min: 5,
             max: 26,
             message: t('valid.passwordPlease'),
           },

src/views/monitor/topologyArchitecture/index.vue

@@ -143,10 +143,11 @@ const graphNodeTooltip = new Tooltip({
         "
         >
         <div><strong>${t('views.monitor.topology.state')}：</strong><span>
-        ${neState.online
-        ? t('views.monitor.topology.normalcy')
-        : t('views.monitor.topology.exceptions')
-      }
+        ${
+          neState.online
+            ? t('views.monitor.topology.normalcy')
+            : t('views.monitor.topology.exceptions')
+        }
         </span></div>
         <div><strong>${t('views.monitor.topology.refreshTime')}：</strong><span>
         ${neState.refreshTime ?? '--'}
@@ -398,10 +399,11 @@ function wsMessage(res: Record<string, any>) {
   const [neType, neId] = requestId.split('_');
   const { combos, edges, nodes } = graphState.data;
   const node = nodes.find((item: Record<string, any>) => item.id === neType);
-  console.log(data)
+
   // 更新网元状态
   const newNeState = Object.assign(node.neState, data, {
-    refreshTime: parseDateToStr(data.refreshTime, 'MM-DD HH:mm:ss'),
+    refreshTime: parseDateToStr(data.refreshTime, 'HH:mm:ss'),
+    online: !!data.cpu,
   });
 
   // 通过 ID 查询节点实例
@@ -503,7 +505,11 @@ onBeforeUnmount(() => {
 
 <template>
   <PageContainer>
-    <a-card :bordered="false" :body-style="{ marginBottom: '24px' }" size="small">
+    <a-card
+      :bordered="false"
+      :body-style="{ marginBottom: '24px' }"
+      size="small"
+    >
       <!-- 插槽-卡片左侧侧 -->
       <template #title>
         <a-space :size="8" align="center">
@@ -515,10 +521,12 @@ onBeforeUnmount(() => {
       </template>
       <!-- 插槽-卡片右侧 -->
       <template #extra>
-        <a-button type="default" size="small" @click.prevent="fnGraphDataLoad(true)">
-          <template #icon>
-            <ReloadOutlined />
-          </template>
+        <a-button
+          type="default"
+          size="small"
+          @click.prevent="fnGraphDataLoad(true)"
+        >
+          <template #icon><ReloadOutlined /></template>
           {{ t('common.reloadText') }}
         </a-button>
       </template>

src/views/ne/neInfo/components/EditModal.vue

@@ -636,10 +636,10 @@ onMounted(() => {
       </a-form-item>
 
       <!-- 主机连接配置 -->
-      <a-divider orientation="left">
+      <a-divider orientation="left" v-if="false">
         {{ t('views.ne.neInfo.hostConfig') }}
       </a-divider>
-      <a-collapse class="collapse" ghost>
+      <a-collapse class="collapse" ghost v-if="false">
         <a-collapse-panel
           v-for="host in modalState.from.hosts.filter(
             (s:any) => !(s.hostType === 'telnet' &&  modalState.from.neType === 'OMC')

src/views/ne/neInfo/index.vue

@@ -5,6 +5,7 @@ import {
   toRaw,
   defineAsyncComponent,
   ref,
+  computed,
 } from 'vue';
 import { PageContainer } from 'antdv-pro-layout';
 import { message, Modal } from 'ant-design-vue/es';
@@ -271,6 +272,8 @@ function reloadRowInfo(row: Record<string, any>) {
           item.status = '0';
         }
         Object.assign(item.serverState, res.data);
+        const resouresUsage = parseResouresUsage(item.serverState);
+        Reflect.set(item, 'resoures', resouresUsage);
       }
     })
     .finally(() => {
@@ -398,7 +401,23 @@ function fnGetList(pageNum?: number) {
         }
         const { total, rows } = res.data;
         tablePagination.total = total;
-        tableState.data = rows
+        // 遍历处理资源情况数值
+        tableState.data = rows.map((item: any) => {
+          let resouresUsage = {
+            sysDiskUsage: 0,
+            sysMemUsage: 0,
+            sysCpuUsage: 0,
+            nfCpuUsage: 0,
+          };
+          const neState = item.serverState;
+          if (neState) {
+            resouresUsage = parseResouresUsage(neState);
+          } else {
+            item.serverState = { online: false };
+          }
+          Reflect.set(item, 'resoures', resouresUsage);
+          return item;
+        });
       }
       tableState.loading = false;
     })
@@ -423,29 +442,33 @@ onMounted(() => {
 
 <template>
   <PageContainer>
-    <a-card v-show="tableState.seached" :bordered="false" :body-style="{ marginBottom: '24px', paddingBottom: 0 }">
+    <a-card
+      v-show="tableState.seached"
+      :bordered="false"
+      :body-style="{ marginBottom: '24px', paddingBottom: 0 }"
+    >
       <!-- 表格搜索栏 -->
       <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.ne.common.neType')" name="neType ">
-              <a-auto-complete v-model:value="queryParams.neType" :options="neListStore.getNeSelectOtions" allow-clear
-                :placeholder="t('common.inputPlease')" />
+              <a-auto-complete
+                v-model:value="queryParams.neType"
+                :options="neListStore.getNeSelectOtions"
+                allow-clear
+                :placeholder="t('common.inputPlease')"
+              />
             </a-form-item>
           </a-col>
           <a-col :lg="6" :md="12" :xs="24">
             <a-form-item>
               <a-space :size="8">
                 <a-button type="primary" @click.prevent="fnGetList(1)">
-                  <template #icon>
-                    <SearchOutlined />
-                  </template>
+                  <template #icon><SearchOutlined /></template>
                   {{ t('common.search') }}
                 </a-button>
                 <a-button type="default" @click.prevent="fnQueryReset">
-                  <template #icon>
-                    <ClearOutlined />
-                  </template>
+                  <template #icon><ClearOutlined /></template>
                   {{ t('common.reset') }}
                 </a-button>
               </a-space>
@@ -459,25 +482,32 @@ onMounted(() => {
       <!-- 插槽-卡片左侧侧 -->
       <template #title>
         <a-space :size="8" align="center">
-          <a-button type="primary" @click.prevent="fnModalVisibleByEdit()" v-perms:has="['ne:neInfo:add']">
-            <template #icon>
-              <PlusOutlined />
-            </template>
+          <a-button
+            type="primary"
+            @click.prevent="fnModalVisibleByEdit()"
+            v-perms:has="['ne:neInfo:add']"
+          >
+            <template #icon><PlusOutlined /></template>
             {{ t('common.addText') }}
           </a-button>
-          <a-button type="default" :loading="modalState.confirmLoading" @click.prevent="fnRecordMore('quickOAM', {})"
-            v-perms:has="['ne:neInfo:oam']">
-            <template #icon>
-              <SettingOutlined />
-            </template>
+          <a-button
+            type="default"
+            :loading="modalState.confirmLoading"
+            @click.prevent="fnRecordMore('quickOAM', {})"
+            v-perms:has="['ne:neInfo:oam']"
+          >
+            <template #icon><SettingOutlined /></template>
             {{ t('views.ne.neInfo.quickOam.title') }}
           </a-button>
-          <a-button type="default" danger :disabled="tableState.selectedRowKeys.length <= 0"
-            :loading="modalState.confirmLoading" @click.prevent="fnRecordDelete('0')"
-            v-perms:has="['ne:neInfo:delete']">
-            <template #icon>
-              <DeleteOutlined />
-            </template>
+          <a-button
+            type="default"
+            danger
+            :disabled="tableState.selectedRowKeys.length <= 0"
+            :loading="modalState.confirmLoading"
+            @click.prevent="fnRecordDelete('0')"
+            v-perms:has="['ne:neInfo:delete']"
+          >
+            <template #icon><DeleteOutlined /></template>
             {{ t('common.deleteText') }}
           </a-button>
         </a-space>
@@ -488,27 +518,30 @@ onMounted(() => {
         <a-space :size="8" align="center">
           <a-tooltip>
             <template #title>{{ t('common.searchBarText') }}</template>
-            <a-switch v-model:checked="tableState.seached" :checked-children="t('common.switch.show')"
-              :un-checked-children="t('common.switch.hide')" size="small" />
+            <a-switch
+              v-model:checked="tableState.seached"
+              :checked-children="t('common.switch.show')"
+              :un-checked-children="t('common.switch.hide')"
+              size="small"
+            />
           </a-tooltip>
           <a-tooltip>
             <template #title>{{ t('common.reloadText') }}</template>
             <a-button type="text" @click.prevent="fnGetList()">
-              <template #icon>
-                <ReloadOutlined />
-              </template>
+              <template #icon><ReloadOutlined /></template>
             </a-button>
           </a-tooltip>
           <a-tooltip>
             <template #title>{{ t('common.sizeText') }}</template>
             <a-dropdown trigger="click" placement="bottomRight">
               <a-button type="text">
-                <template #icon>
-                  <ColumnHeightOutlined />
-                </template>
+                <template #icon><ColumnHeightOutlined /></template>
               </a-button>
               <template #overlay>
-                <a-menu :selected-keys="[tableState.size as string]" @click="fnTableSize">
+                <a-menu
+                  :selected-keys="[tableState.size as string]"
+                  @click="fnTableSize"
+                >
                   <a-menu-item key="default">
                     {{ t('common.size.default') }}
                   </a-menu-item>
@@ -526,14 +559,22 @@ onMounted(() => {
       </template>
 
       <!-- 表格列表 -->
-      <a-table class="table" row-key="id" :columns="tableColumns" :loading="tableState.loading"
-        :data-source="tableState.data" :size="tableState.size" :pagination="tablePagination"
-        :scroll="{ x: tableColumns.length * 120 }" :row-selection="{
+      <a-table
+        class="table"
+        row-key="id"
+        :columns="tableColumns"
+        :loading="tableState.loading"
+        :data-source="tableState.data"
+        :size="tableState.size"
+        :pagination="tablePagination"
+        :scroll="{ x: tableColumns.length * 120 }"
+        :row-selection="{
           type: 'checkbox',
           columnWidth: '48px',
           selectedRowKeys: tableState.selectedRowKeys,
           onChange: fnTableSelectedRowKeys,
-        }">
+        }"
+      >
         <template #bodyCell="{ column, record }">
           <template v-if="column.key === 'status'">
             <DictTag :options="dict.neInfoStatus" :value="record.status" />
@@ -542,42 +583,49 @@ onMounted(() => {
             <a-space :size="8" align="center">
               <a-tooltip>
                 <template #title>{{ t('common.editText') }}</template>
-                <a-button type="link" @click.prevent="fnModalVisibleByEdit(record)" v-perms:has="['ne:neInfo:edit']">
-                  <template #icon>
-                    <FormOutlined />
-                  </template>
+                <a-button
+                  type="link"
+                  @click.prevent="fnModalVisibleByEdit(record)"
+                  v-perms:has="['ne:neInfo:edit']"
+                >
+                  <template #icon><FormOutlined /></template>
                 </a-button>
               </a-tooltip>
               <a-tooltip>
                 <template #title>
                   {{ t('views.ne.common.restart') }}
                 </template>
-                <a-button type="link" @click.prevent="fnRecordMore('restart', record)"
-                  v-perms:has="['ne:neInfo:restart']">
-                  <template #icon>
-                    <UndoOutlined />
-                  </template>
+                <a-button
+                  type="link"
+                  @click.prevent="fnRecordMore('restart', record)"
+                  v-perms:has="['ne:neInfo:restart']"
+                >
+                  <template #icon><UndoOutlined /></template>
                 </a-button>
               </a-tooltip>
               <a-tooltip placement="left">
                 <template #title>{{ t('common.moreText') }}</template>
                 <a-dropdown placement="bottomRight" trigger="click">
                   <a-button type="link">
-                    <template #icon>
-                      <EllipsisOutlined />
-                    </template>
+                    <template #icon><EllipsisOutlined /> </template>
                   </a-button>
                   <template #overlay>
-                    <a-menu @click="({ key }: any) => fnRecordMore(key, record)">
+                    <a-menu @click="({ key }:any) => fnRecordMore(key, record)">
                       <a-menu-item key="log">
                         <FileTextOutlined />
                         {{ t('views.ne.common.log') }}
                       </a-menu-item>
-                      <a-menu-item key="start" v-if="hasPermissions(['ne:neInfo:start'])">
+                      <a-menu-item
+                        key="start"
+                        v-if="hasPermissions(['ne:neInfo:start'])"
+                      >
                         <ThunderboltOutlined />
                         {{ t('views.ne.common.start') }}
                       </a-menu-item>
-                      <a-menu-item key="stop" v-if="hasPermissions(['ne:neInfo:stop'])">
+                      <a-menu-item
+                        key="stop"
+                        v-if="hasPermissions(['ne:neInfo:stop'])"
+                      >
                         <CloseSquareOutlined />
                         {{ t('views.ne.common.stop') }}
                       </a-menu-item>
@@ -585,23 +633,35 @@ onMounted(() => {
                         <SyncOutlined />
                         {{ t('views.ne.common.reload') }}
                       </a-menu-item>
-                      <a-menu-item key="delete" v-if="hasPermissions(['ne:neInfo:delete'])">
+                      <a-menu-item
+                        key="delete"
+                        v-if="hasPermissions(['ne:neInfo:delete'])"
+                      >
                         <DeleteOutlined />
                         {{ t('common.deleteText') }}
                       </a-menu-item>
-                      <a-menu-item key="oam" v-if="
-                        !['OMC'].includes(record.neType) ||
-                        hasPermissions(['ne:neInfo:oam'])
-                      ">
+                      <a-menu-item
+                        key="oam"
+                        v-if="
+                          !['OMC'].includes(record.neType) ||
+                          hasPermissions(['ne:neInfo:oam'])
+                        "
+                      >
                         <FileTextOutlined />
                         {{ t('views.ne.common.oam') }}
                       </a-menu-item>
                       <!-- 配置备份 -->
-                      <a-menu-item key="backConfExport" v-if="hasPermissions(['ne:neInfo:export'])">
+                      <a-menu-item
+                        key="backConfExport"
+                        v-if="hasPermissions(['ne:neInfo:export'])"
+                      >
                         <ExportOutlined />
                         {{ t('views.ne.neInfo.backConf.export') }}
                       </a-menu-item>
-                      <a-menu-item key="backConfImport" v-if="hasPermissions(['ne:neInfo:import'])">
+                      <a-menu-item
+                        key="backConfImport"
+                        v-if="hasPermissions(['ne:neInfo:import'])"
+                      >
                         <ImportOutlined />
                         {{ t('views.ne.neInfo.backConf.import') }}
                       </a-menu-item>
@@ -641,39 +701,59 @@ onMounted(() => {
               </a-divider>
               <div>
                 <span>{{ t('views.ne.neInfo.neCpu') }}：</span>
-                <a-progress status="normal" :stroke-color="record.serverState.nfCpuUsage < 30
-                  ? '#52c41a'
-                  : record.serverState.nfCpuUsage > 70
-                    ? '#ff4d4f'
-                    : '#1890ff'
-                  " :percent="record.serverState.nfCpuUsage" />
+                <a-progress
+                  status="normal"
+                  :stroke-color="
+                    record.resoures.nfCpuUsage < 30
+                      ? '#52c41a'
+                      : record.resoures.nfCpuUsage > 70
+                      ? '#ff4d4f'
+                      : '#1890ff'
+                  "
+                  :percent="record.resoures.nfCpuUsage"
+                />
               </div>
               <div>
                 <span>{{ t('views.ne.neInfo.sysCpu') }}：</span>
-                <a-progress status="normal" :stroke-color="record.serverState.sysCpuUsage < 30
-                  ? '#52c41a'
-                  : record.serverState.sysCpuUsage > 70
-                    ? '#ff4d4f'
-                    : '#1890ff'
-                  " :percent="record.serverState.sysCpuUsage" />
+                <a-progress
+                  status="normal"
+                  :stroke-color="
+                    record.resoures.sysCpuUsage < 30
+                      ? '#52c41a'
+                      : record.resoures.sysCpuUsage > 70
+                      ? '#ff4d4f'
+                      : '#1890ff'
+                  "
+                  :percent="record.resoures.sysCpuUsage"
+                />
               </div>
               <div>
                 <span>{{ t('views.ne.neInfo.sysMem') }}：</span>
-                <a-progress status="normal" :stroke-color="record.serverState.sysMemUsage < 30
-                  ? '#52c41a'
-                  : record.serverState.sysMemUsage > 70
-                    ? '#ff4d4f'
-                    : '#1890ff'
-                  " :percent="record.serverState.sysMemUsage" />
+                <a-progress
+                  status="normal"
+                  :stroke-color="
+                    record.resoures.sysMemUsage < 30
+                      ? '#52c41a'
+                      : record.resoures.sysMemUsage > 70
+                      ? '#ff4d4f'
+                      : '#1890ff'
+                  "
+                  :percent="record.resoures.sysMemUsage"
+                />
               </div>
               <div>
                 <span>{{ t('views.ne.neInfo.sysDisk') }}：</span>
-                <a-progress status="normal" :stroke-color="record.serverState.sysDiskUsage < 30
-                  ? '#52c41a'
-                  : record.serverState.sysDiskUsage > 70
-                    ? '#ff4d4f'
-                    : '#1890ff'
-                  " :percent="record.serverState.sysDiskUsage" />
+                <a-progress
+                  status="normal"
+                  :stroke-color="
+                    record.resoures.sysDiskUsage < 30
+                      ? '#52c41a'
+                      : record.resoures.sysDiskUsage > 70
+                      ? '#ff4d4f'
+                      : '#1890ff'
+                  "
+                  :percent="record.resoures.sysDiskUsage"
+                />
               </div>
             </a-col>
           </a-row>
@@ -682,19 +762,35 @@ onMounted(() => {
     </a-card>
 
     <!-- 新增框或修改框 -->
-    <EditModal v-model:open="modalState.openByEdit" :edit-id="modalState.editId" @ok="fnModalEditOk"
-      @cancel="fnModalEditCancel"></EditModal>
+    <EditModal
+      v-model:open="modalState.openByEdit"
+      :edit-id="modalState.editId"
+      @ok="fnModalEditOk"
+      @cancel="fnModalEditCancel"
+    ></EditModal>
 
     <!-- OAM编辑框 -->
-    <OAMModal v-model:open="modalState.openByOAM" :ne-id="modalState.neId" :ne-type="modalState.neType"
-      @cancel="fnModalEditCancel"></OAMModal>
+    <OAMModal
+      v-model:open="modalState.openByOAM"
+      :ne-id="modalState.neId"
+      :ne-type="modalState.neType"
+      @cancel="fnModalEditCancel"
+    ></OAMModal>
 
     <!-- 配置文件备份框 -->
-    <BackConfModal ref="backConf" v-model:open="modalState.openByBackConf" :ne-id="modalState.neId"
-      :ne-type="modalState.neType" @cancel="fnModalEditCancel"></BackConfModal>
+    <BackConfModal
+      ref="backConf"
+      v-model:open="modalState.openByBackConf"
+      :ne-id="modalState.neId"
+      :ne-type="modalState.neType"
+      @cancel="fnModalEditCancel"
+    ></BackConfModal>
 
     <!-- 快速OAM配置框 -->
-    <QuickOAMModal v-model:open="modalState.openByQuickOAM" @cancel="fnModalEditCancel"></QuickOAMModal>
+    <QuickOAMModal
+      v-model:open="modalState.openByQuickOAM"
+      @cancel="fnModalEditCancel"
+    ></QuickOAMModal>
   </PageContainer>
 </template>
 

src/views/ne/neQuickSetup/components/Para5GForm.vue

@@ -45,8 +45,8 @@ let fromState = ref({
     ue_pool: '10.2.1.0/24',
     // 非指定属性
     mmes1_ip: '192.168.8.220/20',
-    mmes10_ip: '172.16.5.221/24',
-    mmes11_ip: '172.16.5.220/24',
+    mmes10_ip: '127.0.0.221/24',
+    mmes11_ip: '127.0.0.220/24',
     ims_sip_ip: '192.168.8.110',
     upf_type: 'LightUPF',
     upf_driver_type: 'vmxnet3',
@@ -58,22 +58,22 @@ let fromState = ref({
     upfn6_mac: '00:00:00:00:00:00',
   },
   sbi: {
-    omc_ip: '172.16.5.100',
-    ims_ip: '172.16.5.110',
-    amf_ip: '172.16.5.120',
-    ausf_ip: '172.16.5.130',
-    udm_ip: '172.16.5.140',
-    db_ip: '0.0.0.0',
-    smf_ip: '172.16.5.150',
-    pcf_ip: '172.16.5.160',
-    nssf_ip: '172.16.5.170',
-    nrf_ip: '172.16.5.180',
-    upf_ip: '172.16.5.190',
-    lmf_ip: '172.16.5.200',
-    nef_ip: '172.16.5.210',
-    mme_ip: '172.16.5.220',
-    n3iwf_ip: '172.16.5.230',
-    smsc_ip: '172.16.5.240',
+    omc_ip: '127.0.0.100',
+    ims_ip: '127.0.0.110',
+    amf_ip: '127.0.0.120',
+    ausf_ip: '127.0.0.130',
+    udm_ip: '127.0.0.140',
+    db_ip: '127.0.0.1',
+    smf_ip: '127.0.0.150',
+    pcf_ip: '127.0.0.160',
+    nssf_ip: '127.0.0.170',
+    nrf_ip: '127.0.0.180',
+    upf_ip: '127.0.0.190',
+    lmf_ip: '127.0.0.200',
+    nef_ip: '127.0.0.210',
+    mme_ip: '127.0.0.220',
+    n3iwf_ip: '127.0.0.230',
+    smsc_ip: '127.0.0.240',
   },
 });
 

src/views/neData/udm-auth/index.vue

@@ -920,7 +920,7 @@ onMounted(() => {
             v-perms:has="['neData:udm-auth:export-dec']"
           >
             <template #icon><ExportOutlined /></template>
-            Export Dec
+            {{ t('views.neUser.auth.export') }}
           </a-button>
 
           <a-button

src/views/neData/udm-sub/index.vue

@@ -24,6 +24,7 @@ import {
   resetUDMSub,
   updateUDMSub,
 } from '@/api/neData/udm_sub';
+import { getNeConfigData, addNeConfigData } from '@/api/ne/neConfig';
 import { uploadFile } from '@/api/tool/file';
 import { getNeViewFile } from '@/api/tool/neFile';
 import { parseDateToStr } from '@/utils/date-utils';
@@ -112,39 +113,42 @@ let tableColumns = ref<ColumnsType>([
   {
     title: 'Subscribed AMBR',
     dataIndex: 'ambr',
-    align: 'center',
-    width: 100,
+    align: 'left',
+    resizable: true,
+    width: 150,
+    minWidth: 150,
+    maxWidth: 300,
   },
   {
     title: 'Subscribed SNSSAIs',
     dataIndex: 'nssai',
-    align: 'center',
+    align: 'left',
     width: 100,
   },
   {
     title: 'Forbidden Areas',
     dataIndex: 'arfb',
-    align: 'center',
+    align: 'left',
     width: 100,
   },
   {
     title: 'Service Area Restrict',
     dataIndex: 'sar',
-    align: 'center',
+    align: 'left',
     width: 100,
   },
   {
     title: '5G',
     dataIndex: 'cn',
     key: 'cnFlag',
-    align: 'center',
+    align: 'left',
     width: 100,
   },
   {
     title: '4G',
     dataIndex: 'epsFlag',
     key: 'epsFlag',
-    align: 'center',
+    align: 'left',
     width: 100,
   },
   {
@@ -248,6 +252,10 @@ type ModalStateType = {
   confirmLoading: boolean;
   /**更新加载数据按钮 loading */
   loadDataLoading: boolean;
+  /**5G Subscribed UE AMBR 模板对象 */
+  ambr: Record<string, any>;
+  /**已有AMBE数据 */
+  ambrData: Record<string, any>[];
 };
 
 /**对话框对象信息状态 */
@@ -299,6 +307,36 @@ let modalState: ModalStateType = reactive({
   },
   confirmLoading: false,
   loadDataLoading: false,
+  // 5G Subscribed UE AMBR
+  ambr: {
+    uplink: 1,
+    uplinkUnit: 'Gbps',
+    downlink: 2,
+    downlinkUnit: 'Gbps',
+    options: [
+      {
+        label: 'bps',
+        value: 'bps',
+      },
+      {
+        label: 'Kbps',
+        value: 'Kbps',
+      },
+      {
+        label: 'Mbps',
+        value: 'Mbps',
+      },
+      {
+        label: 'Gbps',
+        value: 'Gbps',
+      },
+      {
+        label: 'Tbps',
+        value: 'Tbps',
+      },
+    ],
+  },
+  ambrData: [],
 });
 
 /**表单中多选的OPTION */
@@ -397,7 +435,23 @@ function fnModalVisibleByBatch() {
  * 对话框弹出显示为 新增或者修改
  * @param noticeId 网元id, 不传为新增
  */
-function fnModalVisibleByEdit(imsi?: string) {
+async function fnModalVisibleByEdit(imsi?: string) {
+  const neId = queryParams.neId || '-';
+
+  // 获取AMBR数据
+  const ambrRes = await getNeConfigData({
+    neType: 'UDM',
+    neId: neId,
+    paramName: 'subsUEAmbr',
+  });
+  if (ambrRes.code === RESULT_CODE_SUCCESS) {
+    modalState.ambr.uplink = 1;
+    modalState.ambr.uplinkUnit = 'Gbps';
+    modalState.ambr.downlink = 2;
+    modalState.ambr.downlinkUnit = 'Gbps';
+    modalState.ambrData = ambrRes.data;
+  }
+
   if (!imsi) {
     modalStateFrom.resetFields();
     modalState.title = t('common.addText') + t('views.neUser.sub.subInfo');
@@ -406,60 +460,68 @@ function fnModalVisibleByEdit(imsi?: string) {
     if (modalState.confirmLoading) return;
     const hide = message.loading(t('common.loading'), 0);
     modalState.confirmLoading = true;
-    const neId = queryParams.neId || '-';
-    getUDMSub(neId, imsi)
-      .then(res => {
-        if (res.code === RESULT_CODE_SUCCESS) {
-          transformFormData(res.data.smData);
-          let ardAll = parseInt(res.data.ard).toString(2).padStart(8, '0');
-          let hplAll = parseInt(res.data.hplmnOdb).toString(2).padStart(8, '0');
-          let odbAll = parseInt(res.data.epsOdb).toString(2).padStart(9, '0');
-          const ardArray: any[] = [];
-          const hplmnArray: any[] = [];
-          const epsOdbArray: any[] = [];
-          for (let i = 0; i < ardAll.length; i++) {
-            if (PrefixZero(ardAll, ardAll.length).charAt(i) === '1') {
-              ardArray.push(i);
-            }
-          }
-
-          for (let i = 0; i < hplAll.length; i++) {
-            if (PrefixZero(hplAll, hplAll.length).charAt(i) === '1') {
-              hplmnArray.push(i);
-            }
-          }
-          for (let i = 0; i < odbAll.length; i++) {
-            if (PrefixZero(odbAll, odbAll.length).charAt(i) === '1') {
-              epsOdbArray.push(i);
-            }
-          }
-          res.data.ard = ardArray;
-          res.data.hplmnOdb = hplmnArray;
-          res.data.epsOdb = epsOdbArray;
-
-          // 4G APN Context List
-          const apnContextStr = res.data.apnContext;
-          const apnContextArr = [];
-          for (let i = 0; i < apnContextStr.length; i += 2) {
-            const num = Number(`${apnContextStr[i]}${apnContextStr[i + 1]}`);
-            apnContextArr.push(num);
-          }
-
-          modalState.from = Object.assign(modalState.from, res.data, {
-            apnContext: apnContextArr,
-          });
-
-          modalState.title =
-            t('common.editText') + t('views.neUser.sub.subInfo');
-          modalState.openByEdit = true;
-        } else {
-          message.error(t('common.getInfoFail'), 2);
+    // 获取IMSI数据
+    const res = await getUDMSub(neId, imsi);
+    if (res.code === RESULT_CODE_SUCCESS) {
+      transformFormData(res.data.smData);
+      let ardAll = parseInt(res.data.ard).toString(2).padStart(8, '0');
+      let hplAll = parseInt(res.data.hplmnOdb).toString(2).padStart(8, '0');
+      let odbAll = parseInt(res.data.epsOdb).toString(2).padStart(9, '0');
+      const ardArray: any[] = [];
+      const hplmnArray: any[] = [];
+      const epsOdbArray: any[] = [];
+      for (let i = 0; i < ardAll.length; i++) {
+        if (PrefixZero(ardAll, ardAll.length).charAt(i) === '1') {
+          ardArray.push(i);
         }
-      })
-      .finally(() => {
-        hide();
-        modalState.confirmLoading = false;
+      }
+
+      for (let i = 0; i < hplAll.length; i++) {
+        if (PrefixZero(hplAll, hplAll.length).charAt(i) === '1') {
+          hplmnArray.push(i);
+        }
+      }
+      for (let i = 0; i < odbAll.length; i++) {
+        if (PrefixZero(odbAll, odbAll.length).charAt(i) === '1') {
+          epsOdbArray.push(i);
+        }
+      }
+      res.data.ard = ardArray;
+      res.data.hplmnOdb = hplmnArray;
+      res.data.epsOdb = epsOdbArray;
+
+      // 4G APN Context List
+      const apnContextStr = res.data.apnContext;
+      const apnContextArr = [];
+      for (let i = 0; i < apnContextStr.length; i += 2) {
+        const num = Number(`${apnContextStr[i]}${apnContextStr[i + 1]}`);
+        apnContextArr.push(num);
+      }
+
+      modalState.from = Object.assign(modalState.from, res.data, {
+        apnContext: apnContextArr,
       });
+
+      // AMBR数据
+      const ambrItem = modalState.ambrData.find(
+        item => item.name === modalState.from.ambr
+      );
+      if (ambrItem) {
+        const uplinkItme = ambrItem.uplink.split(' ');
+        modalState.ambr.uplink = uplinkItme[0] || 1;
+        modalState.ambr.uplinkUnit = uplinkItme[1] || 'Gbps';
+        const downlinkItme = ambrItem.downlink.split(' ');
+        modalState.ambr.downlink = downlinkItme[0] || 2;
+        modalState.ambr.downlinkUnit = downlinkItme[1] || 'Gbps';
+      }
+
+      modalState.title = t('common.editText') + t('views.neUser.sub.subInfo');
+      modalState.openByEdit = true;
+    } else {
+      message.error(t('common.getInfoFail'), 2);
+    }
+    hide();
+    modalState.confirmLoading = false;
   }
 }
 
@@ -625,7 +687,7 @@ function fnModalOk() {
 
   modalStateFrom
     .validate()
-    .then(e => {
+    .then(async e => {
       modalState.confirmLoading = true;
       let ardArr = [0, 0, 0, 0, 0, 0, 0, 0];
       let hplmnArr = [0, 0, 0, 0, 0, 0, 0, 0];
@@ -657,58 +719,107 @@ function fnModalOk() {
       from.regTimer = `${from.regTimer}`;
       from.ueUsageType = `${from.ueUsageType}`;
       from.neId = queryParams.neId || '-';
-      const result = from.id
-        ? updateUDMSub(from)
-        : from.num === 1
-        ? addUDMSub(from)
-        : batchAddUDMSub(from, from.num);
+
+      // 组合检查ambr
+      from.ambr = await fnAMBRName();
+
+      let res = null;
+      if (from.id) {
+        res = await updateUDMSub(from);
+      } else {
+        if (from.num === 1) {
+          res = await addUDMSub(from);
+        } else {
+          res = await batchAddUDMSub(from, from.num);
+        }
+      }
+      if (!res) return;
+
       const hide = message.loading(t('common.loading'), 0);
-      result
-        .then(res => {
-          if (res.code === RESULT_CODE_SUCCESS) {
-            if (from.num === 1) {
-              message.success({
-                content: t('common.msgSuccess', { msg: modalState.title }),
-                duration: 3,
-              });
-              fnGetList(1);
-            } else {
-              const timerS = Math.ceil(+from.num / 800) + 1;
-              notification.success({
-                message: modalState.title,
-                description: t('common.operateOk'),
-                duration: timerS,
-              });
-              setTimeout(() => {
-                fnGetList(1);
-              }, timerS * 1000);
-            }
-          } else {
-            if (from.num === 1) {
-              message.error({
-                content: `${res.msg}`,
-                duration: 3,
-              });
-            } else {
-              notification.error({
-                message: modalState.title,
-                description: res.msg,
-                duration: 3,
-              });
-            }
-          }
-        })
-        .finally(() => {
-          hide();
-          fnModalCancel();
-          modalState.confirmLoading = false;
-        });
+      if (res.code === RESULT_CODE_SUCCESS) {
+        if (from.num === 1) {
+          message.success({
+            content: t('common.msgSuccess', { msg: modalState.title }),
+            duration: 3,
+          });
+          fnGetList(1);
+        } else {
+          const timerS = Math.ceil(+from.num / 800) + 1;
+          notification.success({
+            message: modalState.title,
+            description: t('common.operateOk'),
+            duration: timerS,
+          });
+          setTimeout(() => {
+            fnGetList(1);
+          }, timerS * 1000);
+        }
+      } else {
+        if (from.num === 1) {
+          message.error({
+            content: `${res.msg}`,
+            duration: 3,
+          });
+        } else {
+          notification.error({
+            message: modalState.title,
+            description: res.msg,
+            duration: 3,
+          });
+        }
+      }
+
+      hide();
+      fnModalCancel();
+      modalState.confirmLoading = false;
     })
     .catch(e => {
       message.error(t('common.errorFields', { num: e.errorFields.length }), 3);
     });
 }
 
+/**
+ * 检查ambr是否存在，不存在则新增
+ */
+async function fnAMBRName() {
+  const ambrItem = modalState.ambrData.find(
+    item =>
+      item.downlink ===
+        `${modalState.ambr.downlink} ${modalState.ambr.downlinkUnit}` &&
+      item.uplink === `${modalState.ambr.uplink} ${modalState.ambr.uplinkUnit}`
+  );
+  if (ambrItem) {
+    return ambrItem.name;
+  } else {
+    // 新增
+    const ambrData = modalState.ambrData.sort((a: any, b: any) => {
+      return b.index - a.index;
+    });
+    if (ambrData.length > 0) {
+      const neId = queryParams.neId || '-';
+      const loc = ambrData[0].index + 1;
+      const name = `ambr_${modalState.ambr.uplink}${modalState.ambr.uplinkUnit}_${modalState.ambr.downlink}${modalState.ambr.downlinkUnit}`;
+      const ambrRes = await addNeConfigData({
+        neType: 'UDM',
+        neId: neId,
+        paramName: 'subsUEAmbr',
+        paramData: {
+          index: loc,
+          name: name,
+          uplink: `${modalState.ambr.uplink} ${modalState.ambr.uplinkUnit}`,
+          downlink: `${modalState.ambr.downlink} ${modalState.ambr.downlinkUnit}`,
+        },
+        loc: `${loc}`,
+      });
+      if (ambrRes.code === RESULT_CODE_SUCCESS) {
+        return name;
+      }
+    } else {
+      return 'def_ambr';
+    }
+  }
+}
+
 /**对话框内批量添加表单属性和校验规则 */
 const modalStateBatchDelFrom = Form.useForm(
   modalState.BatchDelForm,
@@ -1709,7 +1820,7 @@ onMounted(() => {
                   </a-select>
                 </a-form-item>
               </a-col>
-              <a-col :lg="24" :md="24" :xs="24">
+              <!-- <a-col :lg="24" :md="24" :xs="24">
                 <a-form-item
                   label="5G Subscribed UE AMBR Template"
                   name="ambr"
@@ -1732,7 +1843,41 @@ onMounted(() => {
                     </template>
                   </a-input>
                 </a-form-item>
+              </a-col> -->
+
+              <a-col :lg="24" :md="24" :xs="24">
+                <a-form-item label="5G Subscribed UE AMBR" name="ambr">
+                  <a-row :gutter="8">
+                    <a-col :span="12">
+                      <a-input v-model:value="modalState.ambr.uplink">
+                        <template #addonBefore>Uplink</template>
+                        <template #addonAfter>
+                          <a-select
+                            v-model:value="modalState.ambr.uplinkUnit"
+                            style="width: 100px"
+                            :options="modalState.ambr.options"
+                          >
+                          </a-select>
+                        </template>
+                      </a-input>
+                    </a-col>
+                    <a-col :span="12">
+                      <a-input v-model:value="modalState.ambr.downlink">
+                        <template #addonBefore>Downlink</template>
+                        <template #addonAfter>
+                          <a-select
+                            v-model:value="modalState.ambr.downlinkUnit"
+                            style="width: 100px"
+                            :options="modalState.ambr.options"
+                          >
+                          </a-select>
+                        </template>
+                      </a-input>
+                    </a-col>
+                  </a-row>
+                </a-form-item>
               </a-col>
+
               <a-col :lg="24" :md="24" :xs="24">
                 <a-form-item
                   label="5G Subscribed SNSSAIs Template"

src/views/register.vue

@@ -169,7 +169,7 @@ onMounted(() => {
           :rules="[
             {
               required: true,
-              min: 6,
+              min: 5,
               max: 26,
               validator: fnEqualToPassword,
             },

src/views/system/quick-start/components/Done.vue

@@ -4,7 +4,6 @@ import { Modal } from 'ant-design-vue/es';
 import { RESULT_CODE_SUCCESS } from '@/constants/result-constants';
 import { delAccessToken, delRefreshToken } from '@/plugins/auth-token';
 import { useRouter } from 'vue-router';
-import useAppStore from '@/store/modules/app';
 import useI18n from '@/hooks/useI18n';
 import { onMounted, ref } from 'vue';
 import { bootloaderDone } from '@/api/system/quick-start/bootloader';
@@ -56,8 +55,9 @@ function fnGuideDone() {
       bootloaderDone()
         .then(res => {
           if (res.code === RESULT_CODE_SUCCESS) {
-            useAppStore().bootloader = false;
+            // useAppStore().bootloader = false;
             delAccessToken();
+            delRefreshToken();
           }
         })
         .finally(() => {

src/views/system/user/index.vue

@@ -834,46 +834,6 @@ onMounted(() => {
     >
       <!-- 表格搜索栏 -->
       <a-form :model="queryParams" name="queryParams" layout="horizontal">
-        <a-row :gutter="16">
-          <a-col :lg="18" :md="12" :xs="24">
-            <a-form-item
-              :label="t('views.system.user.className')"
-              name="deptId"
-            >
-              <a-tree-select
-                v-model:value="queryParams.deptId"
-                show-search
-                tree-default-expand-all
-                :tree-data="deptTreeData"
-                :field-names="{
-                  children: 'children',
-                  label: 'label',
-                  value: 'id',
-                }"
-                tree-node-label-prop="label"
-                tree-node-filter-prop="label"
-                style="width: 100%"
-                :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
-                :placeholder="t('common.selectPlease')"
-              >
-              </a-tree-select>
-            </a-form-item>
-          </a-col>
-          <a-col :lg="6" :md="12" :xs="24">
-            <a-form-item>
-              <a-space :size="8">
-                <a-button type="primary" @click.prevent="fnGetList(1)">
-                  <template #icon><SearchOutlined /></template>
-                  {{ t('common.search') }}
-                </a-button>
-                <a-button type="default" @click.prevent="fnQueryReset">
-                  <template #icon><ClearOutlined /></template>
-                  {{ t('common.reset') }}
-                </a-button>
-              </a-space>
-            </a-form-item>
-          </a-col>
-        </a-row>
         <a-row :gutter="16">
           <a-col :lg="6" :md="12" :xs="24">
             <a-form-item
@@ -937,11 +897,52 @@ onMounted(() => {
                 bordered
                 :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>
         </a-row>
+        <a-row :gutter="16">
+          <a-col :lg="18" :md="12" :xs="24" v-if="false">
+            <a-form-item
+              :label="t('views.system.user.className')"
+              name="deptId"
+            >
+              <a-tree-select
+                v-model:value="queryParams.deptId"
+                show-search
+                tree-default-expand-all
+                :tree-data="deptTreeData"
+                :field-names="{
+                  children: 'children',
+                  label: 'label',
+                  value: 'id',
+                }"
+                tree-node-label-prop="label"
+                tree-node-filter-prop="label"
+                style="width: 100%"
+                :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
+                :placeholder="t('common.selectPlease')"
+              >
+              </a-tree-select>
+            </a-form-item>
+          </a-col>
+          <a-col :lg="6" :md="12" :xs="24">
+            <a-form-item>
+              <a-space :size="8">
+                <a-button type="primary" @click.prevent="fnGetList(1)">
+                  <template #icon><SearchOutlined /></template>
+                  {{ t('common.search') }}
+                </a-button>
+                <a-button type="default" @click.prevent="fnQueryReset">
+                  <template #icon><ClearOutlined /></template>
+                  {{ t('common.reset') }}
+                </a-button>
+              </a-space>
+            </a-form-item>
+          </a-col>
+        </a-row>
       </a-form>
     </a-card>
 
@@ -971,6 +972,7 @@ onMounted(() => {
             type="dashed"
             @click.prevent="fnModalUploadImportOpen()"
             v-perms:has="['system:user:import']"
+            v-if="false"
           >
             <template #icon><ImportOutlined /></template>
             {{ t('common.import') }}
@@ -979,6 +981,7 @@ onMounted(() => {
             type="dashed"
             @click.prevent="fnExportList()"
             v-perms:has="['system:user:export']"
+            v-if="false"
           >
             <template #icon><ExportOutlined /></template>
             {{ t('common.export') }}
@@ -1255,6 +1258,7 @@ onMounted(() => {
           name="deptId"
           :label-col="{ span: 3 }"
           :label-wrap="true"
+          v-if="false"
         >
           <a-tree-select
             :value="modalState.from.deptId"
@@ -1274,7 +1278,7 @@ onMounted(() => {
         </a-form-item>
 
         <a-row>
-          <a-col :lg="12" :md="12" :xs="24">
+          <a-col :lg="12" :md="12" :xs="24" v-if="false">
             <a-form-item
               :label="t('views.system.user.userWork')"
               name="postIds"
@@ -1407,6 +1411,7 @@ onMounted(() => {
             :md="12"
             :xs="24"
             v-perms:has="['system:user:editPost']"
+            v-if="false"
           >
             <a-form-item
               :label="t('views.system.user.userWork')"
@@ -1519,6 +1524,7 @@ onMounted(() => {
           :label="t('views.system.user.fromClass')"
           name="deptId"
           :label-col="{ span: 3 }"
+          v-if="false"
         >
           <a-tree-select
             v-model:value="modalState.from.deptId"

src/views/tool/terminal-more/index.vue

@@ -0,0 +1,339 @@
+<script lang="ts" setup>
+import { PageContainer } from 'antdv-pro-layout';
+import { Modal } from 'ant-design-vue/es';
+import { useFullscreen } from '@vueuse/core';
+import { defineAsyncComponent, reactive, ref } from 'vue';
+import { parseDuration } from '@/utils/date-utils';
+import useI18n from '@/hooks/useI18n';
+const { t } = useI18n();
+const TerminalSSH = defineAsyncComponent(
+  () => import('@/components/TerminalSSH/index.vue')
+);
+const TerminalTelnet = defineAsyncComponent(
+  () => import('@/components/TerminalTelnet/index.vue')
+);
+const TerminalRedis = defineAsyncComponent(
+  () => import('@/components/TerminalRedis/index.vue')
+);
+const HostList = defineAsyncComponent(
+  () => import('./components/hostList.vue')
+);
+
+// 全屏
+const terminalCard = ref<HTMLElement | null>(null);
+const { isFullscreen, toggle } = useFullscreen(terminalCard);
+
+/**主机对象信息状态类型 */
+type HostStateType = {
+  /**显示主机列表 */
+  show: boolean;
+  /**加载等待 */
+  loading: boolean;
+  /**查询参数 */
+  params: {
+    pageNum: number;
+    pageSize: number;
+  };
+  /**数据总数 */
+  total: number;
+  data: Record<string, any>[];
+};
+
+/**主机对象信息状态 */
+const hostState: HostStateType = reactive({
+  show: false,
+  loading: false,
+  params: {
+    pageNum: 1,
+    pageSize: 20,
+  },
+  total: 0,
+  data: [],
+});
+
+/**连接主机 */
+function fnConnectHost(data: Record<string, any>) {
+  const id = `${Date.now()}`;
+  tabState.panes.push({
+    id,
+    status: false,
+    host: data,
+  });
+  tabState.activeKey = id;
+}
+
+/**标签对象信息状态类型 */
+type TabStateType = {
+  /**激活选中 */
+  activeKey: string;
+  /**页签数据 */
+  panes: {
+    id: string;
+    status: boolean;
+    host: Record<string, any>;
+    connectStamp?: string;
+  }[];
+};
+
+/**标签对象信息状态 */
+const tabState: TabStateType = reactive({
+  activeKey: '0',
+  panes: [
+    {
+      id: '0',
+      host: {
+        id: 0,
+        title: t('views.tool.terminal.start'),
+        type: '0',
+      },
+      status: true,
+    },
+  ],
+});
+
+/**
+ * 终端连接状态
+ * @param data 主机连接结果
+ */
+function fnTerminalConnect(data: Record<string, any>) {
+  const { id, timeStamp } = data;
+  const seconds = timeStamp / 1000;
+  // 获取当前项下标
+  const tab = tabState.panes.find(item => item.id === id);
+  if (tab) {
+    tab.status = true;
+    tab.connectStamp = parseDuration(seconds);
+  }
+}
+
+/**
+ * 终端关闭状态
+ * @param data 主机连接结果
+ */
+function fnTerminalClose(data: Record<string, any>) {
+  const { id } = data;
+  // 获取当前项下标
+  const tab = tabState.panes.find(item => item.id === id);
+  if (tab) {
+    tab.status = false;
+  }
+}
+
+/**
+ * 标签更多菜单项
+ * @param key 菜单key
+ */
+function fnTabMenu(key: string | number) {
+  // 刷新当前
+  if (key === 'reload') {
+    const tabIndex = tabState.panes.findIndex(
+      item => item.id === tabState.activeKey
+    );
+    if (tabIndex) {
+      const tab = tabState.panes[tabIndex];
+      Modal.confirm({
+        title: t('common.tipTitle'),
+        content: t('views.tool.terminal.reloadTip', {
+          num: `${tab.host.hostType} - ${tab.host.title}`,
+        }),
+        onOk() {
+          tabState.panes.splice(tabIndex, 1);
+          tab.host && fnConnectHost(tab.host);
+        },
+      });
+    }
+  }
+  // 关闭当前
+  if (key === 'current') {
+    fnTabClose(tabState.activeKey);
+  }
+  // 关闭其他
+  if (key === 'other') {
+    Modal.confirm({
+      title: t('common.tipTitle'),
+      content: t('views.tool.terminal.otherTip'),
+      onOk() {
+        hostState.show = false;
+        tabState.panes = tabState.panes.filter(
+          tab => tab.id === '0' || tab.id === tabState.activeKey
+        );
+        tabState.activeKey = tabState.activeKey;
+      },
+    });
+  }
+  // 关闭全部
+  if (key === 'all') {
+    Modal.confirm({
+      title: t('common.tipTitle'),
+      content: t('views.tool.terminal.allTip'),
+      onOk() {
+        hostState.show = false;
+        tabState.panes.splice(1);
+        tabState.activeKey = '0';
+      },
+    });
+  }
+}
+
+/**
+ * 导航标签关闭
+ * @param id 标签的key
+ */
+function fnTabClose(id: string) {
+  if (isFullscreen.value) toggle();
+
+  // 获取当前项下标
+  const tabIndex = tabState.panes.findIndex(tab => tab.id === id);
+  if (tabIndex === -1) return;
+  const item = tabState.panes[tabIndex];
+  Modal.confirm({
+    title: t('common.tipTitle'),
+    content: t('views.tool.terminal.closeTip', {
+      num: `${item.host.hostType.toUpperCase()} - ${item.host.title}`,
+    }),
+    onOk() {
+      tabState.panes.splice(tabIndex, 1);
+      // 激活前一项标签
+      tabState.activeKey = tabState.panes[tabIndex - 1].id;
+    },
+  });
+}
+</script>
+
+<template>
+  <PageContainer>
+    <a-card
+      :bordered="false"
+      size="small"
+      :body-style="{ padding: '12px' }"
+      ref="terminalCard"
+    >
+      <a-tabs
+        class="terminal-tabs"
+        hide-add
+        size="small"
+        tab-position="top"
+        type="editable-card"
+        :tab-bar-gutter="8"
+        :tab-bar-style="{ margin: '0' }"
+        v-model:activeKey="tabState.activeKey"
+        @edit="(id:any) => fnTabClose(id)"
+      >
+        <a-tab-pane
+          v-for="pane in tabState.panes"
+          :key="pane.id"
+          :closable="pane.id !== '0'"
+        >
+          <template #tab>
+            <a-badge
+              :status="pane.status ? 'success' : 'error'"
+              :text="pane.host.title"
+            />
+          </template>
+
+          <div class="pane-box">
+            <!-- 非开始页的ssh主机 -->
+            <TerminalSSH
+              v-if="pane.id !== '0' && pane.host.hostType === 'ssh'"
+              :id="pane.id"
+              :hostId="pane.host.id"
+              @connect="fnTerminalConnect"
+              @close="fnTerminalClose"
+            >
+            </TerminalSSH>
+
+            <!-- 非开始页的telnet主机 -->
+            <TerminalTelnet
+              v-if="pane.id !== '0' && pane.host.hostType === 'telnet'"
+              :id="pane.id"
+              :hostId="pane.host.id"
+              init-cmd="help"
+              :disable="true"
+              @connect="fnTerminalConnect"
+              @close="fnTerminalClose"
+            >
+            </TerminalTelnet>
+
+            <!-- 非开始页的redis主机 -->
+            <TerminalRedis
+              v-if="pane.id !== '0' && pane.host.hostType === 'redis'"
+              :id="pane.id"
+              :hostId="pane.host.id"
+              @connect="fnTerminalConnect"
+              @close="fnTerminalClose"
+            >
+            </TerminalRedis>
+
+            <!-- 开始页 -->
+            <div v-if="pane.id === '0'">
+              <!-- 主机列表 -->
+              <HostList
+                v-show="tabState.activeKey === '0'"
+                @modal="() => (isFullscreen ? toggle() : null)"
+                @link="fnConnectHost"
+              ></HostList>
+            </div>
+          </div>
+        </a-tab-pane>
+
+        <template #rightExtra>
+          <a-space :size="8" align="center">
+            <a-tooltip placement="topRight">
+              <template #title>
+                {{ t('loayouts.rightContent.fullscreen') }}
+              </template>
+              <a-button
+                type="default"
+                shape="circle"
+                size="small"
+                style="color: inherit"
+                @click="toggle"
+              >
+                <template #icon>
+                  <FullscreenExitOutlined v-if="isFullscreen" />
+                  <FullscreenOutlined v-else />
+                </template>
+              </a-button>
+            </a-tooltip>
+            <!-- 非开始页的更多操作 -->
+            <div v-show="tabState.activeKey !== '0'">
+              <a-tooltip placement="topRight">
+                <template #title>
+                  {{ t('views.tool.terminal.more') }}
+                </template>
+                <a-dropdown trigger="click" placement="bottomRight">
+                  <a-button type="ghost" shape="circle" size="small">
+                    <template #icon><EllipsisOutlined /></template>
+                  </a-button>
+                  <template #overlay>
+                    <a-menu @click="({ key }:any) => fnTabMenu(key)">
+                      <a-menu-item key="reload">
+                        {{ t('views.tool.terminal.reload') }}
+                      </a-menu-item>
+                      <a-menu-item key="current">
+                        {{ t('views.tool.terminal.current') }}
+                      </a-menu-item>
+                      <a-menu-item key="other">
+                        {{ t('views.tool.terminal.other') }}
+                      </a-menu-item>
+                      <a-menu-item key="all">
+                        {{ t('views.tool.terminal.all') }}
+                      </a-menu-item>
+                    </a-menu>
+                  </template>
+                </a-dropdown>
+              </a-tooltip>
+            </div>
+          </a-space>
+        </template>
+      </a-tabs>
+    </a-card>
+  </PageContainer>
+</template>
+
+<style lang="less" scoped>
+.pane-box {
+  height: calc(100vh - 200px);
+  overflow-x: hidden;
+}
+</style>

src/views/tool/terminal/index.vue

@@ -1,203 +1,76 @@
 <script lang="ts" setup>
 import { PageContainer } from 'antdv-pro-layout';
-import { Modal } from 'ant-design-vue/es';
-import { useFullscreen } from '@vueuse/core';
-import { defineAsyncComponent, reactive, ref } from 'vue';
-import { parseDuration } from '@/utils/date-utils';
-import useI18n from '@/hooks/useI18n';
-const { t } = useI18n();
+import { listNeHost } from '@/api/ne/neHost';
+import { defineAsyncComponent, onMounted, reactive } from 'vue';
+import { RESULT_CODE_SUCCESS } from '@/constants/result-constants';
 const TerminalSSH = defineAsyncComponent(
   () => import('@/components/TerminalSSH/index.vue')
 );
-const TerminalTelnet = defineAsyncComponent(
-  () => import('@/components/TerminalTelnet/index.vue')
-);
-const TerminalRedis = defineAsyncComponent(
-  () => import('@/components/TerminalRedis/index.vue')
-);
-const HostList = defineAsyncComponent(
-  () => import('./components/hostList.vue')
-);
-
-// 全屏
-const terminalCard = ref<HTMLElement | null>(null);
-const { isFullscreen, toggle } = useFullscreen(terminalCard);
 
 /**主机对象信息状态类型 */
 type HostStateType = {
-  /**显示主机列表 */
-  show: boolean;
   /**加载等待 */
   loading: boolean;
   /**查询参数 */
   params: {
-    pageNum: number;
-    pageSize: number;
+    /**主机类型 */
+    hostType: 'ssh';
+    /**分组 */
+    groupId: '1';
+    /**名称 */
+    title: 'OMC';
+    /**当前页数 */
+    pageNum: 1;
+    /**每页条数 */
+    pageSize: 10;
+    sortField: 'createTime';
+    sortOrder: 'desc';
   };
-  /**数据总数 */
-  total: number;
-  data: Record<string, any>[];
+  /**OMC主机 */
+  host: Record<string, any>;
 };
 
 /**主机对象信息状态 */
 const hostState: HostStateType = reactive({
-  show: false,
   loading: false,
   params: {
+    /**主机类型 */
+    hostType: 'ssh',
+    /**分组 */
+    groupId: '1',
+    /**名称 */
+    title: 'OMC',
+    /**当前页数 */
     pageNum: 1,
-    pageSize: 20,
+    /**每页条数 */
+    pageSize: 10,
+    sortField: 'createTime',
+    sortOrder: 'desc',
   },
-  total: 0,
-  data: [],
+  host: {},
 });
 
-/**连接主机 */
-function fnConnectHost(data: Record<string, any>) {
-  const id = `${Date.now()}`;
-  tabState.panes.push({
-    id,
-    status: false,
-    host: data,
-  });
-  tabState.activeKey = id;
+/**查询信息列表, pageNum初始页数 */
+function fnGetList() {
+  hostState.loading = true;
+  listNeHost(hostState.params)
+    .then(res => {
+      if (res.code === RESULT_CODE_SUCCESS) {
+        const { total, rows } = res.data;
+        if (total > 0) {
+          hostState.host = rows[0];
+        }
+      }
+    })
+    .finally(() => {
+      hostState.loading = false;
+    });
 }
 
-/**标签对象信息状态类型 */
-type TabStateType = {
-  /**激活选中 */
-  activeKey: string;
-  /**页签数据 */
-  panes: {
-    id: string;
-    status: boolean;
-    host: Record<string, any>;
-    connectStamp?: string;
-  }[];
-};
-
-/**标签对象信息状态 */
-const tabState: TabStateType = reactive({
-  activeKey: '0',
-  panes: [
-    {
-      id: '0',
-      host: {
-        id: 0,
-        title: t('views.tool.terminal.start'),
-        type: '0',
-      },
-      status: true,
-    },
-  ],
+onMounted(() => {
+  // 获取列表数据
+  fnGetList();
 });
-
-/**
- * 终端连接状态
- * @param data 主机连接结果
- */
-function fnTerminalConnect(data: Record<string, any>) {
-  const { id, timeStamp } = data;
-  const seconds = timeStamp / 1000;
-  // 获取当前项下标
-  const tab = tabState.panes.find(item => item.id === id);
-  if (tab) {
-    tab.status = true;
-    tab.connectStamp = parseDuration(seconds);
-  }
-}
-
-/**
- * 终端关闭状态
- * @param data 主机连接结果
- */
-function fnTerminalClose(data: Record<string, any>) {
-  const { id } = data;
-  // 获取当前项下标
-  const tab = tabState.panes.find(item => item.id === id);
-  if (tab) {
-    tab.status = false;
-  }
-}
-
-/**
- * 标签更多菜单项
- * @param key 菜单key
- */
-function fnTabMenu(key: string | number) {
-  // 刷新当前
-  if (key === 'reload') {
-    const tabIndex = tabState.panes.findIndex(
-      item => item.id === tabState.activeKey
-    );
-    if (tabIndex) {
-      const tab = tabState.panes[tabIndex];
-      Modal.confirm({
-        title: t('common.tipTitle'),
-        content: t('views.tool.terminal.reloadTip', {
-          num: `${tab.host.hostType} - ${tab.host.title}`,
-        }),
-        onOk() {
-          tabState.panes.splice(tabIndex, 1);
-          tab.host && fnConnectHost(tab.host);
-        },
-      });
-    }
-  }
-  // 关闭当前
-  if (key === 'current') {
-    fnTabClose(tabState.activeKey);
-  }
-  // 关闭其他
-  if (key === 'other') {
-    Modal.confirm({
-      title: t('common.tipTitle'),
-      content: t('views.tool.terminal.otherTip'),
-      onOk() {
-        hostState.show = false;
-        tabState.panes = tabState.panes.filter(
-          tab => tab.id === '0' || tab.id === tabState.activeKey
-        );
-        tabState.activeKey = tabState.activeKey;
-      },
-    });
-  }
-  // 关闭全部
-  if (key === 'all') {
-    Modal.confirm({
-      title: t('common.tipTitle'),
-      content: t('views.tool.terminal.allTip'),
-      onOk() {
-        hostState.show = false;
-        tabState.panes.splice(1);
-        tabState.activeKey = '0';
-      },
-    });
-  }
-}
-
-/**
- * 导航标签关闭
- * @param id 标签的key
- */
-function fnTabClose(id: string) {
-  if (isFullscreen.value) toggle();
-
-  // 获取当前项下标
-  const tabIndex = tabState.panes.findIndex(tab => tab.id === id);
-  if (tabIndex === -1) return;
-  const item = tabState.panes[tabIndex];
-  Modal.confirm({
-    title: t('common.tipTitle'),
-    content: t('views.tool.terminal.closeTip', {
-      num: `${item.host.hostType.toUpperCase()} - ${item.host.title}`,
-    }),
-    onOk() {
-      tabState.panes.splice(tabIndex, 1);
-      // 激活前一项标签
-      tabState.activeKey = tabState.panes[tabIndex - 1].id;
-    },
-  });
-}
 </script>
 
 <template>
@@ -205,136 +78,13 @@ function fnTabClose(id: string) {
     <a-card
       :bordered="false"
       size="small"
-      :body-style="{ padding: '12px' }"
-      ref="terminalCard"
+      :body-style="{ padding: '12px', height: 'calc(100vh - 200px)' }"
+      :loading="hostState.loading"
     >
-      <a-tabs
-        class="terminal-tabs"
-        hide-add
-        size="small"
-        tab-position="top"
-        type="editable-card"
-        :tab-bar-gutter="8"
-        :tab-bar-style="{ margin: '0' }"
-        v-model:activeKey="tabState.activeKey"
-        @edit="(id:any) => fnTabClose(id)"
-      >
-        <a-tab-pane
-          v-for="pane in tabState.panes"
-          :key="pane.id"
-          :closable="pane.id !== '0'"
-        >
-          <template #tab>
-            <a-badge
-              :status="pane.status ? 'success' : 'error'"
-              :text="pane.host.title"
-            />
-          </template>
-
-          <div class="pane-box">
-            <!-- 非开始页的ssh主机 -->
-            <TerminalSSH
-              v-if="pane.id !== '0' && pane.host.hostType === 'ssh'"
-              :id="pane.id"
-              :hostId="pane.host.id"
-              @connect="fnTerminalConnect"
-              @close="fnTerminalClose"
-            >
-            </TerminalSSH>
-
-            <!-- 非开始页的telnet主机 -->
-            <TerminalTelnet
-              v-if="pane.id !== '0' && pane.host.hostType === 'telnet'"
-              :id="pane.id"
-              :hostId="pane.host.id"
-              init-cmd="help"
-              :disable="true"
-              @connect="fnTerminalConnect"
-              @close="fnTerminalClose"
-            >
-            </TerminalTelnet>
-
-            <!-- 非开始页的redis主机 -->
-            <TerminalRedis
-              v-if="pane.id !== '0' && pane.host.hostType === 'redis'"
-              :id="pane.id"
-              :hostId="pane.host.id"
-              init-cmd="PING"
-              @connect="fnTerminalConnect"
-              @close="fnTerminalClose"
-            >
-            </TerminalRedis>
-
-            <!-- 开始页 -->
-            <div v-if="pane.id === '0'">
-              <!-- 主机列表 -->
-              <HostList
-                v-show="tabState.activeKey === '0'"
-                @modal="() => (isFullscreen ? toggle() : null)"
-                @link="fnConnectHost"
-              ></HostList>
-            </div>
-          </div>
-        </a-tab-pane>
-
-        <template #rightExtra>
-          <a-space :size="8" align="center">
-            <a-tooltip placement="topRight">
-              <template #title>
-                {{ t('loayouts.rightContent.fullscreen') }}
-              </template>
-              <a-button
-                type="default"
-                shape="circle"
-                size="small"
-                style="color: inherit"
-                @click="toggle"
-              >
-                <template #icon>
-                  <FullscreenExitOutlined v-if="isFullscreen" />
-                  <FullscreenOutlined v-else />
-                </template>
-              </a-button>
-            </a-tooltip>
-            <!-- 非开始页的更多操作 -->
-            <div v-show="tabState.activeKey !== '0'">
-              <a-tooltip placement="topRight">
-                <template #title>
-                  {{ t('views.tool.terminal.more') }}
-                </template>
-                <a-dropdown trigger="click" placement="bottomRight">
-                  <a-button type="ghost" shape="circle" size="small">
-                    <template #icon><EllipsisOutlined /></template>
-                  </a-button>
-                  <template #overlay>
-                    <a-menu @click="({ key }:any) => fnTabMenu(key)">
-                      <a-menu-item key="reload">
-                        {{ t('views.tool.terminal.reload') }}
-                      </a-menu-item>
-                      <a-menu-item key="current">
-                        {{ t('views.tool.terminal.current') }}
-                      </a-menu-item>
-                      <a-menu-item key="other">
-                        {{ t('views.tool.terminal.other') }}
-                      </a-menu-item>
-                      <a-menu-item key="all">
-                        {{ t('views.tool.terminal.all') }}
-                      </a-menu-item>
-                    </a-menu>
-                  </template>
-                </a-dropdown>
-              </a-tooltip>
-            </div>
-          </a-space>
-        </template>
-      </a-tabs>
+      <TerminalSSH :id="hostState.host.title" :hostId="hostState.host.id">
+      </TerminalSSH>
     </a-card>
   </PageContainer>
 </template>
 
-<style lang="less" scoped>
-.pane-box {
-  height: calc(100vh - 200px);
-  overflow-x: hidden;
-}
-</style>
+<style lang="less" scoped></style>