feat: 基站状态补充randId列

2025-10-23 14:15:46 +08:00
parent 0d13400229
commit a658852772
5 changed files with 122 additions and 217 deletions
--- a/src/i18n/locales/en-US.ts
+++ b/src/i18n/locales/en-US.ts
@@ -875,6 +875,7 @@ export default {
        list: "List",
        topology: "Topology",
        nbName: "RAN Node Name",
+        nbId: "RAN Node ID",
        ueNum: "UE Number",
        topologyTitle: "Radio State Graph",
        name: "Name",
--- a/src/i18n/locales/zh-CN.ts
+++ b/src/i18n/locales/zh-CN.ts
@@ -875,6 +875,7 @@ export default {
        list: "列表",
        topology: "拓扑图",
        nbName: "设备名称",
+        nbId: "设备ID",
        ueNum: "在线用户数",
        topologyTitle: "基站状态关系图",
        name: "基站名称",
--- a/src/views/neData/base-station/components/history.vue
+++ b/src/views/neData/base-station/components/history.vue
@@ -150,6 +150,15 @@ let tableColumns = ref<ColumnsType>([
    minWidth: 100,
    maxWidth: 200,
  },
+  {
+    title: t('views.neData.baseStation.nbId'),
+    dataIndex: 'nbId',
+    align: 'left',
+    resizable: true,
+    width: 100,
+    minWidth: 100,
+    maxWidth: 200,
+  },
  {
    title: t('views.neData.baseStation.state'),
    dataIndex: 'state',
@@ -247,7 +256,7 @@ function fnGetList(pageNum?: number) {
  }

  listNBState(toRaw(queryParams)).then(res => {
-     if (res.code === RESULT_CODE_SUCCESS) {
+    if (res.code === RESULT_CODE_SUCCESS) {
      // 取消勾选
      if (tableState.selectedRowKeys.length > 0) {
        tableState.selectedRowKeys = [];
@@ -258,7 +267,7 @@ function fnGetList(pageNum?: number) {
      tableState.data = rows;
      if (
        tablePagination.total <=
-          (queryParams.pageNum - 1) * tablePagination.pageSize &&
+        (queryParams.pageNum - 1) * tablePagination.pageSize &&
        queryParams.pageNum !== 1
      ) {
        tableState.loading = false;
@@ -290,62 +299,43 @@ watch(
 </script>

 <template>
-  <ProModal
-    :drag="true"
-    :destroyOnClose="true"
-    :width="1200"
-    :title="props.title"
-    :open="props.open"
-    :keyboard="false"
-    :mask-closable="false"
-    @cancel="fnModalCancel"
-    :footer="null"
-  >
+  <ProModal :drag="true" :destroyOnClose="true" :width="1200" :title="props.title" :open="props.open" :keyboard="false"
+    :mask-closable="false" @cancel="fnModalCancel" :footer="null">
    <!-- 表格搜索栏 -->
    <a-form :model="queryParams" name="queryParams" layout="horizontal">
      <a-row :gutter="16" style="margin-left: 0; margin-right: 0">
        <a-col :lg="6" :md="12" :xs="24">
-          <a-form-item
-            :label="t('views.neData.baseStation.state')"
-            name="status"
-          >
-            <a-select
-              v-model:value="queryParams.status"
-              allow-clear
-              :placeholder="t('common.selectPlease')"
-              :options="nbStateOptions"
-            >
+          <a-form-item :label="t('views.neData.baseStation.state')" name="status">
+            <a-select v-model:value="queryParams.status" allow-clear :placeholder="t('common.selectPlease')"
+              :options="nbStateOptions">
            </a-select>
          </a-form-item>
        </a-col>
        <a-col :lg="16" :md="12" :xs="24">
-          <a-form-item
-            :label="t('views.neData.baseStation.time')"
-            name="queryRangePicker"
-          >
-            <a-range-picker
-              v-model:value="queryRangePicker"
-              :bordered="true"
-              :allow-clear="true"
-              style="width: 100%"
-              :show-time="{ format: 'HH:mm:ss' }"
-              format="YYYY-MM-DD HH:mm:ss"
-            ></a-range-picker>
+          <a-form-item :label="t('views.neData.baseStation.time')" name="queryRangePicker">
+            <a-range-picker v-model:value="queryRangePicker" :bordered="true" :allow-clear="true" style="width: 100%"
+              :show-time="{ format: 'HH:mm:ss' }" format="YYYY-MM-DD HH:mm:ss"></a-range-picker>
          </a-form-item>
        </a-col>
        <a-col :lg="24" :md="24" :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-button type="dashed" @click.prevent="fnExportList()">
-                <template #icon><ExportOutlined /></template>
+                <template #icon>
+                  <ExportOutlined />
+                </template>
                {{ t('common.export') }}
              </a-button>
            </a-space>
@@ -355,24 +345,13 @@ watch(
    </a-form>

    <!-- 表格列表 -->
-    <a-table
-      class="table"
-      row-key="id"
-      :columns="tableColumns"
-      :loading="tableState.loading"
-      :data-source="tableState.data"
-      :size="tableState.size"
-      :pagination="tablePagination"
+    <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, y: 'calc(100vh - 480px)' }"
-      @resizeColumn="(w:number, col:any) => (col.width = w)"
-    >
+      @resizeColumn="(w: number, col: any) => (col.width = w)">
      <template #bodyCell="{ column, record }">
        <template v-if="column.key === 'state'">
-          <DictTag
-            :options="nbStateOptions"
-            :value="record.state"
-            value-default="OFF"
-          />
+          <DictTag :options="nbStateOptions" :value="record.state" value-default="OFF" />
        </template>
      </template>
    </a-table>
--- a/src/views/neData/base-station/list.vue
+++ b/src/views/neData/base-station/list.vue
@@ -140,6 +140,12 @@ let tableColumns = ref<ColumnsType>([
    minWidth: 100,
    maxWidth: 200,
  },
+  {
+    title: t('views.neData.baseStation.nbId'),
+    dataIndex: 'ranId',
+    align: 'left',
+    width: 120,
+  },
  {
    title: t('views.neData.baseStation.ueNum'),
    dataIndex: 'ueNum',
@@ -641,13 +647,12 @@ function fnModalImportUpload(file: File) {
 /**对话框表格信息导入模板 */
 async function fnModalImportTemplate() {
  const baseUrl = import.meta.env.VITE_HISTORY_BASE_URL;
-  const xlsxUrl = `${
-    baseUrl.length === 1 && baseUrl.indexOf('/') === 0
+  const xlsxUrl = `${baseUrl.length === 1 && baseUrl.indexOf('/') === 0
      ? ''
      : baseUrl.indexOf('/') === -1
-      ? '/' + baseUrl
-      : baseUrl
-  }/nbStateImput`;
+        ? '/' + baseUrl
+        : baseUrl
+    }/nbStateImput`;
  const lang = currentLocale.value.split('_')[0];
  saveAs(
    `${xlsxUrl}/${lang}.xlsx`,
@@ -669,7 +674,7 @@ onMounted(() => {
    });
    return;
  }
-  
+
  // 无查询参数neType时 默认选择AMF
  const queryNeType = (route.query.neType as string) || 'AMF';
  const item = neCascaderOptions.value.find(s => s.value === queryNeType);
@@ -688,46 +693,35 @@ onMounted(() => {

 <template>
  <div>
-    <a-card
-      :bordered="false"
-      :body-style="{ marginBottom: '24px', paddingBottom: 0 }"
-    >
+    <a-card :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-cascader
-                v-model:value="neTypeAndId"
-                :options="neCascaderOptions"
-                :allow-clear="false"
-                :placeholder="t('common.selectPlease')"
-                @change="fnGetList"
-              />
+              <a-cascader v-model:value="neTypeAndId" :options="neCascaderOptions" :allow-clear="false"
+                :placeholder="t('common.selectPlease')" @change="fnGetList" />
            </a-form-item>
          </a-col>
          <a-col :lg="4" :md="6" :xs="24">
-            <a-form-item
-              :label="t('views.neData.baseStation.state')"
-              name="state"
-            >
-              <a-select
-                v-model:value="queryParams.state"
-                :options="nbState"
-                :placeholder="t('common.selectPlease')"
-                @change="fnGetList"
-              />
+            <a-form-item :label="t('views.neData.baseStation.state')" name="state">
+              <a-select v-model:value="queryParams.state" :options="nbState" :placeholder="t('common.selectPlease')"
+                @change="fnGetList" />
            </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()">
-                  <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>
@@ -747,35 +741,36 @@ onMounted(() => {
            </template>
            {{ t('common.addText') }}
          </a-button>
-          <a-button
-            type="default"
-            :disabled="tableState.selectedRowKeys.length != 1"
-            :loading="modalState.confirmLoading"
-            @click.prevent="fnModalVisibleByEdit('0')"
-          >
-            <template #icon><FormOutlined /></template>
+          <a-button type="default" :disabled="tableState.selectedRowKeys.length != 1"
+            :loading="modalState.confirmLoading" @click.prevent="fnModalVisibleByEdit('0')">
+            <template #icon>
+              <FormOutlined />
+            </template>
            {{ t('common.editText') }}
          </a-button>
-          <a-button
-            type="default"
-            danger
-            :disabled="tableState.selectedRowKeys.length <= 0"
-            :loading="modalState.confirmLoading"
-            @click.prevent="fnRecordDelete('0')"
-          >
-            <template #icon><DeleteOutlined /></template>
+          <a-button type="default" danger :disabled="tableState.selectedRowKeys.length <= 0"
+            :loading="modalState.confirmLoading" @click.prevent="fnRecordDelete('0')">
+            <template #icon>
+              <DeleteOutlined />
+            </template>
            {{ t('common.deleteText') }}
          </a-button>
          <a-button type="dashed" @click.prevent="fnModalImportOpen()">
-            <template #icon><ImportOutlined /></template>
+            <template #icon>
+              <ImportOutlined />
+            </template>
            {{ t('common.import') }}
          </a-button>
          <a-button type="dashed" @click.prevent="fnExportList()">
-            <template #icon><ExportOutlined /></template>
+            <template #icon>
+              <ExportOutlined />
+            </template>
            {{ t('common.export') }}
          </a-button>
          <a-button type="default" @click.prevent="fnHistoryView()">
-            <template #icon><ContainerOutlined /></template>
+            <template #icon>
+              <ContainerOutlined />
+            </template>
            {{ t('views.neData.baseStation.history') }}
          </a-button>
        </a-space>
@@ -785,19 +780,15 @@ onMounted(() => {
      <template #extra>
        <a-space :size="8" align="center">
          <div>
-            <template
-              v-if="
-                queryParams.state === undefined || queryParams.state === 'ON'
-              "
-            >
+            <template v-if="
+              queryParams.state === undefined || queryParams.state === 'ON'
+            ">
              {{ t('views.neData.baseStation.online') }}:
              <strong style="color: green">{{ stateNum[0] }} </strong>
            </template>
-            <template
-              v-if="
-                queryParams.state === undefined || queryParams.state === 'OFF'
-              "
-            >
+            <template v-if="
+              queryParams.state === undefined || queryParams.state === 'OFF'
+            ">
              &nbsp;
              {{ t('views.neData.baseStation.offline') }}:
              <strong style="color: red">
@@ -808,139 +799,72 @@ onMounted(() => {
          <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-space>
      </template>

      <!-- 表格列表 -->
-      <a-table
-        class="table"
-        row-key="index"
-        :columns="tableColumns"
-        :loading="tableState.loading"
-        :data-source="tableState.data"
-        :size="tableState.size"
-        :pagination="tablePagination"
-        :row-selection="{
+      <a-table class="table" row-key="index" :columns="tableColumns" :loading="tableState.loading"
+        :data-source="tableState.data" :size="tableState.size" :pagination="tablePagination" :row-selection="{
          type: 'checkbox',
          selectedRowKeys: tableState.selectedRowKeys,
          onChange: fnTableSelectedRowKeys,
-        }"
-        :scroll="{ x: tableColumns.length * 120, y: 'calc(100vh - 480px)' }"
-        @resizeColumn="(w:number, col:any) => (col.width = w)"
-      >
+        }" :scroll="{ x: tableColumns.length * 120, y: 'calc(100vh - 480px)' }"
+        @resizeColumn="(w: number, col: any) => (col.width = w)">
        <template #bodyCell="{ column, record }">
          <template v-if="column.key === 'state'">
-            <DictTag
-              :options="nbState"
-              :value="record.state"
-              value-default="OFF"
-            />
+            <DictTag :options="nbState" :value="record.state" value-default="OFF" />
          </template>
        </template>
      </a-table>
    </a-card>

    <!-- 新增框或修改框 -->
-    <ProModal
-      :drag="true"
-      :width="500"
-      :destroyOnClose="true"
-      :keyboard="false"
-      :mask-closable="false"
-      :open="modalState.openByEdit"
-      :title="modalState.title"
-      :confirm-loading="modalState.confirmLoading"
-      @ok="fnModalOk"
-      @cancel="fnModalCancel"
-    >
-      <a-form
-        name="modalStateFrom"
-        layout="horizontal"
-        :label-col="{ span: 6 }"
-        :labelWrap="true"
-      >
-        <a-form-item
-          :label="t('views.neData.baseStation.name')"
-          name="name"
-          v-bind="modalStateFrom.validateInfos.name"
-        >
-          <a-input
-            v-model:value="modalState.from.name"
-            allow-clear
-            :maxlength="64"
-          >
+    <ProModal :drag="true" :width="500" :destroyOnClose="true" :keyboard="false" :mask-closable="false"
+      :open="modalState.openByEdit" :title="modalState.title" :confirm-loading="modalState.confirmLoading"
+      @ok="fnModalOk" @cancel="fnModalCancel">
+      <a-form name="modalStateFrom" layout="horizontal" :label-col="{ span: 6 }" :labelWrap="true">
+        <a-form-item :label="t('views.neData.baseStation.name')" name="name" v-bind="modalStateFrom.validateInfos.name">
+          <a-input v-model:value="modalState.from.name" allow-clear :maxlength="64">
          </a-input>
        </a-form-item>
-        <a-form-item
-          :label="t('views.neData.baseStation.position')"
-          name="position"
-          v-bind="modalStateFrom.validateInfos.position"
-        >
-          <a-input
-            v-model:value="modalState.from.position"
-            allow-clear
-            :maxlength="64"
-          >
+        <a-form-item :label="t('views.neData.baseStation.position')" name="position"
+          v-bind="modalStateFrom.validateInfos.position">
+          <a-input v-model:value="modalState.from.position" allow-clear :maxlength="64">
          </a-input>
        </a-form-item>
-        <a-form-item
-          v-if="!modalState.from.state"
-          :label="t('views.neData.baseStation.address')"
-          name="address"
-          v-bind="modalStateFrom.validateInfos.address"
-        >
-          <a-input
-            v-model:value="modalState.from.address"
-            allow-clear
-            :maxlength="64"
-          >
+        <a-form-item v-if="!modalState.from.state" :label="t('views.neData.baseStation.address')" name="address"
+          v-bind="modalStateFrom.validateInfos.address">
+          <a-input v-model:value="modalState.from.address" allow-clear :maxlength="64">
          </a-input>
        </a-form-item>
      </a-form>
    </ProModal>

    <!-- 状态历史框 -->
-    <HistoryModal
-      v-if="neTypeAndId.length > 1"
-      v-model:open="modalState.openByHistory"
-      :title="t('views.neData.baseStation.history')"
-      :ne-type="neTypeAndId[0]"
-      :ne-id="neTypeAndId[1]"
-      @cancel="fnModalCancel"
-    ></HistoryModal>
+    <HistoryModal v-if="neTypeAndId.length > 1" v-model:open="modalState.openByHistory"
+      :title="t('views.neData.baseStation.history')" :ne-type="neTypeAndId[0]" :ne-id="neTypeAndId[1]"
+      @cancel="fnModalCancel"></HistoryModal>

    <!-- 上传导入表格数据文件框 -->
-    <UploadModal
-      :title="t('common.import')"
-      @upload="fnModalImportUpload"
-      @close="fnModalImportClose"
-      v-model:open="modalState.openByImport"
-      :ext="['.xls', '.xlsx']"
-      :size="10"
-    >
+    <UploadModal :title="t('common.import')" @upload="fnModalImportUpload" @close="fnModalImportClose"
+      v-model:open="modalState.openByImport" :ext="['.xls', '.xlsx']" :size="10">
      <template #default>
        <a-row justify="space-between" align="middle">
          <a-col :span="12"> </a-col>
          <a-col :span="6">
-            <a-button
-              type="link"
-              :title="t('views.system.user.downloadObj')"
-              @click.prevent="fnModalImportTemplate"
-            >
+            <a-button type="link" :title="t('views.system.user.downloadObj')" @click.prevent="fnModalImportTemplate">
              {{ t('views.system.user.downloadObj') }}
            </a-button>
          </a-col>
        </a-row>
-        <a-textarea
-          :disabled="true"
-          :hidden="modalState.importMsgArr.length <= 0"
-          :value="modalState.importMsgArr.join('\r\n')"
-          :auto-size="{ minRows: 2, maxRows: 8 }"
-          style="background-color: transparent; color: rgba(0, 0, 0, 0.85)"
-        />
+        <a-textarea :disabled="true" :hidden="modalState.importMsgArr.length <= 0"
+          :value="modalState.importMsgArr.join('\r\n')" :auto-size="{ minRows: 2, maxRows: 8 }"
+          style="background-color: transparent; color: rgba(0, 0, 0, 0.85)" />
      </template>
    </UploadModal>
  </div>
--- a/src/views/neData/base-station/topology.vue
+++ b/src/views/neData/base-station/topology.vue
@@ -132,10 +132,9 @@ const graphNodeTooltip = new Tooltip({
        "
        >
        <div><strong>${t('views.neData.baseStation.state')}：</strong><span>
-        ${
-          nInfo.state === 'ON'
-            ? t('views.neData.baseStation.online')
-            : t('views.neData.baseStation.offline')
+        ${nInfo.state === 'ON'
+          ? t('views.neData.baseStation.online')
+          : t('views.neData.baseStation.offline')
        }
        </span></div>
        <div><strong>${t('views.neData.baseStation.time')}：</strong><span>
@@ -147,6 +146,8 @@ const graphNodeTooltip = new Tooltip({
        ${nInfo.address ?? '--'}</span></div>
        <div><strong>${t('views.neData.baseStation.nbName')}：</strong><span>
        ${nInfo.nbName ?? '--'}</span></div>
+        <div><strong>${t('views.neData.baseStation.nbId')}：</strong><span>
+        ${nInfo.ranId ?? '--'}</span></div>
        <div><strong>${t('views.neData.baseStation.ueNum')}：</strong><span>
        ${nInfo.ueNum ?? '--'}</span></div>
        <div><strong>${t('views.neData.baseStation.name')}：</strong><span>
@@ -169,11 +170,10 @@ const graphNodeTooltip = new Tooltip({
        "
        >
        <div><strong>${t('views.monitor.topology.state')}：</strong><span>
-        ${
-          nInfo.online
-            ? t('views.monitor.topology.normalcy')
-            : t('views.monitor.topology.exceptions')
-        }
+        ${nInfo.online
+        ? t('views.monitor.topology.normalcy')
+        : t('views.monitor.topology.exceptions')
+      }
        </span></div>
        <div><strong>${t('views.monitor.topology.refreshTime')}：</strong><span>
        ${nInfo.refreshTime ?? '--'}
@@ -359,7 +359,7 @@ function handleRanderGraph(container: HTMLElement | null, data: GraphData) {
 /**
 * 获取图组数据渲染到画布
 */
-async function fnGraphDataLoad() { 
+async function fnGraphDataLoad() {
  const dataNe = await fnGraphDataBase();
  Object.assign(graphData, dataNe);
  graphG6.value = handleRanderGraph(graphG6Dom.value, dataNe);
@@ -417,7 +417,7 @@ async function fnGraphDataBase() {
          target: id,
        });
      }
-      item.children.forEach((v: any) => {});
+      item.children.forEach((v: any) => { });
      continue;
    }
  }