fix: 基站状态列宽拖动，状态结果统计

src/views/ne-data/base-station/components/list.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { reactive, ref, onMounted, toRaw } from 'vue';
+import { reactive, ref, onMounted, toRaw, computed } from 'vue';
 import { Form, message, Modal } from 'ant-design-vue';
 import { SizeType } from 'ant-design-vue/es/config-provider';
 import { ColumnsType } from 'ant-design-vue/es/table';
@@ -74,50 +74,68 @@ let tableState: TabeStateType = reactive({
 
 /**表格字段列 */
 let tableColumns = ref<ColumnsType>([
-  {
+  // {
-    title: t('common.rowId'),
+  //   title: t('common.rowId'),
-    dataIndex: 'index',
+  //   dataIndex: 'index',
-    align: 'left',
+  //   align: 'left',
-    width: 80,
+  //   width: 80,
-  },
+  // },
   {
     title: t('views.neData.baseStation.name'),
     dataIndex: 'name',
     align: 'left',
-    width: 150,
+    resizable: true,
+    width: 120,
+    minWidth: 100,
+    maxWidth: 250,
     ellipsis: true,
   },
   {
     title: t('views.neData.baseStation.position'),
     dataIndex: 'position',
     align: 'left',
+    resizable: true,
     width: 150,
+    minWidth: 100,
+    maxWidth: 400,
     ellipsis: true,
   },
   {
     title: t('views.neData.baseStation.address'),
     dataIndex: 'address',
     align: 'left',
+    resizable: true,
     width: 100,
+    minWidth: 100,
+    maxWidth: 200,
   },
   {
     title: t('views.neData.baseStation.nbName'),
     dataIndex: 'nbName',
     align: 'left',
+    resizable: true,
     width: 100,
+    minWidth: 100,
+    maxWidth: 200,
   },
   {
     title: t('views.neData.baseStation.ueNum'),
     dataIndex: 'ueNum',
     align: 'left',
+    resizable: true,
     width: 80,
+    minWidth: 80,
+    maxWidth: 120,
   },
   {
     title: t('views.neData.baseStation.state'),
     dataIndex: 'state',
     key: 'state',
     align: 'left',
+    resizable: true,
     width: 80,
+    minWidth: 80,
+    maxWidth: 120,
   },
   {
     title: t('views.neData.baseStation.time'),
@@ -260,6 +278,20 @@ function fnGetList() {
   });
 }
 
+const stateNum = computed(() => {
+  let onNum = 0;
+  let offNum = 0;
+  tableState.data.forEach((item: any) => {
+    if (item.state === 'ON') {
+      onNum += 1;
+    }
+    if (item.state === 'OFF') {
+      offNum += 1;
+    }
+  });
+  return [onNum, offNum];
+});
+
 /**对话框对象信息状态类型 */
 type ModalStateType = {
   /**新增框或修改框是否显示 */
@@ -505,6 +537,14 @@ onMounted(() => {
       <!-- 插槽-卡片右侧 -->
       <template #extra>
         <a-space :size="8" align="center">
+          <div>
+            {{ t('views.neData.baseStation.online') }}:
+            <strong style="color: green">{{ stateNum[0] }} </strong>
+            {{ t('views.neData.baseStation.offline') }}:
+            <strong style="color: red">
+              {{ stateNum[1] }}
+            </strong>
+          </div>
           <a-tooltip>
             <template #title>{{ t('common.reloadText') }}</template>
             <a-button type="text" @click.prevent="fnGetList()">
@@ -523,12 +563,13 @@ onMounted(() => {
         :data-source="tableState.data"
         :size="tableState.size"
         :pagination="tablePagination"
-        :scroll="{ x: tableColumns.length * 120 }"
         :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)"
       >
         <template #bodyCell="{ column, record }">
           <template v-if="column.key === 'state'">