1.监控中心 - 设备监测 根据UI设计图进行页面优化

2.监控中心 - 能耗监测  根据UI设计图进行页面优化
3.监控中心 - 环境监测  修改bug，添加loading

hx-ai-intelligent/src/view/monitor/deviceMonitor/table/index.vue

@@ -3,19 +3,41 @@
     :columns="columns"
     :data-source="data"
     bordered
-    style="width: 100%"
-    :scroll="{ x: 2000 }" />
+    :pagination="false"
+    style="width: 99%; height: 75%"
+    :scroll="{ x: 2000, y: 450 }" />
+  <a-pagination
+    :total="total"
+    :show-total="(total, range) => ` 共 ${total} 条`"
+    show-size-changer
+    show-quick-jumper
+    @change="onChange"
+    style="display: flex; justify-content: right; margin-top: 10px; margin-right: 30px" />
 </template>
 
 <script lang="ts">
   import { defineComponent, watch, ref, onMounted } from 'vue';
   import type { TableColumnType } from 'ant-design-vue';
+  import { Pagination } from 'ant-design-vue';
   import { inject } from 'vue';
 
+  // defineOptions({
+  //   name: 'EnvironmentTable', // 与页面路由name一致缓存才可生效
+  //   components: {
+  //     'a-pagination': Pagination,
+  //   },
+  // });
   export default defineComponent({
     name: 'EnvironmentTable',
+    components: {
+      'a-pagination': Pagination,
+    },
     setup() {
+      const total = ref<number>();
+      // 分页后的展示数据
       let data = ref<any[]>([]);
+      // 原始数据
+      let dataList = ref<any[]>([]);
       let columns = ref<TableColumnType[]>([]);
 
       let index = ref(0);
@@ -30,6 +52,12 @@
       if (!pageData) {
         throw new Error('pageData is not provided');
       }
+      // 分页器
+      const onChange = (pageNumber: number, size: number) => {
+        const start = (pageNumber - 1) * size;
+        const end = start + size;
+        data.value = dataList.value.slice(start, end);
+      };
       // 监听 pageData 的变化
       watch(
         () => pageData as PageData,
@@ -69,7 +97,6 @@
         {
           title: '序号',
           customRender: ({ record, index }) => {
-            debugger;
             // 自定义单元格内容，这里返回序号
             if (index == 0) {
               data.value[index].index = 1;
@@ -194,7 +221,7 @@
 
       const init = () => {
         index.value = 0;
-        data.value = pageData.tableList;
+        dataList.value = pageData.tableList;
 
         let columnA: any[] = [...column];
         let columnB: any[] = [];
@@ -203,6 +230,8 @@
         });
         columnA.push(...columnB);
         columns.value = columnA;
+        total.value = dataList.value.length;
+        onChange(1, 10);
       };
       onMounted(() => {
         init();
@@ -212,6 +241,8 @@
         column,
         columns,
         pageData,
+        total,
+        onChange,
       };
     },
   });