优化 监控中心 前台页面

hx-ai-intelligent/src/view/equipmentManage/group/config.ts

@@ -149,7 +149,7 @@ export const formSchema = [
     component: 'NsInput',
     componentProps: {
       placeholder: '请输入',
-      maxLength: 32,
+      maxLength: 20,
     },
     rules: [
       {
@@ -410,25 +410,26 @@ export const tableConfigCal = (
           }
         },
       },
-      isCarbon
+      {
-        ? {
+        label: '关联因子值',
-            label: '关联因子值',
+        name: 'SetFactor',
-            name: 'SetFactor',
+        type: 'primary',
-            type: 'primary',
+        dynamicDisabled: (data: any) => {
-            dynamicDisabled: (data: any) => {
+          return data.list.length === 0;
-              return data.list.length === 0;
+        },
-            },
+        ifShow: (data: any) => {
-            handle: ({ list }) => {
+          return isCarbon;
-              // 过滤出 id 大于 0 的项
+        },
-              const filteredList = list.filter(({ id }) => id > 0);
+        handle: ({ list }) => {
+          // 过滤出 id 大于 0 的项
+          const filteredList = list.filter(({ id }) => id > 0);
 
-              // 提取出 id 值
+          // 提取出 id 值
-              const ids = filteredList.map(({ id }) => id);
+          const ids = filteredList.map(({ id }) => id);
 
-              setFactorRef.value.toggle(ids);
+          setFactorRef.value.toggle(ids);
-            },
+        },
-          }
+      },
-        : {},
       {
         label: '批量删除',
         name: 'GroupPointDelete',
@@ -518,10 +519,29 @@ export const tableConfigCal = (
       actions: [
         {
           label: '关联因子',
+          // label: (record) => {
+          //   // 根据record的某个字段值判断显示'关联因子'或'修改因子'
+          //   return record.emissionFactor ? '修改因子' : '关联因子';
+          // },
           name: 'SetFactor',
-          dynamicDisabled: (record) => {
+          ifShow: (record) => {
             // 这里根据record的某个字段值判断是否禁用删除按钮
-            return record.id < 0;
+            return isCarbon && record.id >= 0 && !record.emissionFactor;
+          },
+          handle: (row) => {
+            setFactorRef.value.toggle([row.id]);
+          },
+        },
+        {
+          label: '修改关联',
+          // label: (record) => {
+          //   // 根据record的某个字段值判断显示'关联因子'或'修改因子'
+          //   return record.emissionFactor ? '修改因子' : '关联因子';
+          // },
+          name: 'SetFactor',
+          ifShow: (record) => {
+            // 这里根据record的某个字段值判断是否禁用删除按钮
+            return isCarbon && record.id >= 0 && record.emissionFactor;
           },
           handle: (row) => {
             setFactorRef.value.toggle([row.id]);
@@ -530,9 +550,9 @@ export const tableConfigCal = (
         {
           label: '删除',
           name: 'GroupPointDelete',
-          dynamicDisabled: (record) => {
+          ifShow: (record) => {
             // 这里根据record的某个字段值判断是否禁用删除按钮
-            return record.id < 0;
+            return record.id >= 0;
           },
           dynamicParams: isCarbon
             ? {
@@ -797,7 +817,7 @@ export const editCarbonEquipmentConfig = (orgId) => {
       ],
       params: {},
     },
-    // pagination: { pageSizeOptions: false },
+    pagination: true,
     rowKey: 'deviceInfoCode',
   });
 };

hx-ai-intelligent/src/view/equipmentManage/group/editCal.vue

@@ -9,7 +9,9 @@
     :cancel="() => (visible = false)"
     placement="right">
     <div class="drawerContainer">
-      <ns-tree-api v-bind="config" @select="treeSelect" />
+      <div style="padding: 10px; border: 1px solid #d9d9d9; border-radius: 4px">
+        <ns-tree-api v-bind="config" @select="treeSelect" />
+      </div>
       <a-transfer
         v-model:target-keys="targetKeys"
         :data-source="dataSource"

hx-ai-intelligent/src/view/equipmentManage/group/editCarbonEquipment.vue

@@ -120,4 +120,7 @@
     right: 50px; /* Adjust based on your modal's positioning */
     // z-index: 1050; /* Ensure it's above the modal's backdrop */
   }
+  ::v-deep .ant-table-pagination.ant-pagination {
+    margin: 26px 0 !important; /* 根据需要调整 padding 大小 */
+  }
 </style>

hx-ai-intelligent/src/view/equipmentManage/group/index.vue

@@ -22,7 +22,9 @@
                     ? 'fenzujiedian'
                     : 'jisuanjiedian'
                 " />
-              <span style="padding-left: 8px">{{ data.pointName }}</span>
+              <span style="padding-left: 8px" :title="data.pointName">
+                {{ truncatedName(data.pointName) }}
+              </span>
             </div>
             <a-dropdown>
               <ns-icon name="actionMore" size="14" class="actionMore" />
@@ -52,15 +54,7 @@
       v-show="!defaultType && isCarbon"
       class="table"
       v-bind="configCarbon"
-      ref="tableCalRef">
+      ref="tableCalRef" />
-      <!-- <template #bodyCell="{ column, record }">
-        <template v-if="column.title === '操作'">
-          <a-button type="link" @click="setStandard(record)" v-if="record.id != selectedKey[0]"
-            >设为目标值</a-button
-          >
-        </template>
-      </template> -->
-    </ns-view-list-table>
   </div>
 </template>
 <script lang="ts" setup>
@@ -208,6 +202,12 @@
     const res = actions.filter(({ key, name }) => list.includes(key) && checkAllPermission(name));
     return res;
   };
+  const truncatedName = (name) => {
+    if (name.length > 8) {
+      return name.substring(0, 8) + '...';
+    }
+    return name;
+  };
   const actionList = [
     { title: '新增子节点', name: 'GroupAdd', key: 'addNodeSon', func: (data) => addNodeSon(data) },
     { title: '编辑', name: 'GroupEdit', key: 'editNode', func: (data) => editNode(data) },

hx-ai-intelligent/src/view/monitor/energyMonitor/graphGraph/index.vue

@@ -155,7 +155,7 @@
         chartInstance.setOption(option);
       };
       onMounted(() => {
-        // draw();
+        draw();
       });
 
       // 下载图表

hx-ai-intelligent/src/view/monitor/energyMonitor/page.vue

@@ -32,9 +32,9 @@
               <ns-icon :name="iconName" size="18" style="margin-right: 10px" @click="change" />
             </div>
           </div>
-          <span style="padding-left: 10px; line-height: 20px"
+          <span style="padding-left: 10px; line-height: 20px">
-            ><ns-icon name="title" size="11" style="margin-right: 3px" />统计数据</span
+            <ns-icon name="title" size="11" style="margin-right: 3px" />统计数据
-          >
+          </span>
         </div>
 
         <div v-if="activeKey == '1'" style="height: 72%; width: 100%">

hx-ai-intelligent/src/view/monitor/energyMonitor/tree/index.vue

@@ -171,7 +171,7 @@
       // 日期类型
       const dateTypeValue = ref();
 
-      const frequencyValue = ref();
+      const frequencyValue = ref(0);
 
       const activeKey = ref('1');
 
@@ -284,13 +284,13 @@
       const getSelectGraph = (key: any) => {
         if (key) {
           activeKey.value = key;
-          if (
+          // if (
-            pageData.graphTableList.length > 0 &&
+          //   pageData.graphTableList.length > 0 &&
-            pageData.graphTableColumns.length > 0 &&
+          //   pageData.graphTableColumns.length > 0 &&
-            pageData.graphGraphList.length > 0
+          //   pageData.graphGraphList.length > 0
-          ) {
+          // ) {
-            return;
+          //   return;
-          }
+          // }
         }
 
         let startTime = '';
@@ -364,9 +364,9 @@
       const getSelectAnalyse = (key: any) => {
         if (key) {
           activeKey.value = key;
-          if (pageData.analysisGraphList.length > 0 && pageData.analysisTableList.length > 0) {
+          // if (pageData.analysisGraphList.length > 0 && pageData.analysisTableList.length > 0) {
-            return;
+          //   return;
-          }
+          // }
         }
         let startTime = '';
         let endTime = '';

hx-ai-intelligent/src/view/monitor/environmentMonitor/aggregateData/index.vue

@@ -811,6 +811,26 @@
             lineHeight: 20,
           },
         },
+        dataZoom: [
+          {
+            show: true,
+            type: 'slider',
+            zoomLock: true,
+            startValue: 0, // 从头开始。
+            endValue: 23,
+            bottom: 20,
+            height: 10,
+            showDetail: false,
+          },
+          {
+            show: true,
+            type: 'inside',
+            xAxisIndex: 0,
+            zoomOnMouseWheel: false, // 滚轮是否触发缩放
+            moveOnMouseMove: true, // 鼠标滚轮触发滚动
+            moveOnMouseWheel: true,
+          },
+        ],
         visualMap: {
           show: false,
           min: min,

hx-ai-intelligent/src/view/monitor/environmentMonitor/averageData/config.ts

@@ -4,10 +4,14 @@ export const tableColumns = [
     customRender: (text: any) => {
       return text.index + 1;
     },
+    width: 150,
+    align: 'center',
   },
   {
     title: '时间',
     dataIndex: 'time',
+    width: 150,
+    align: 'center',
   },
   // {
   //   title: '温度（℃）',

hx-ai-intelligent/src/view/monitor/environmentMonitor/averageData/index.vue

@@ -9,7 +9,7 @@
         bordered
         :pagination="false"
         style="height: 75%"
-        :scroll="{ x: 100, y: 450 }">
+        :scroll="{ x: 200, y: 450 }">
         <template #title>
           <div
             style="display: flex; align-items: center; justify-content: space-between; width: 100%">
@@ -84,6 +84,7 @@
   });
 
   const loading = ref(false);
+  const x = ref(1200);
 
   const typeList = ref();
   // 采集频率
@@ -181,8 +182,11 @@
           tableColumnsB.push({
             title: headerList[i],
             dataIndex: headerList[i],
+            width: 150,
+            align: 'center',
           });
         }
+        x.value = 300 + headerList.length * 150;
         let columnA: any[] = [...tableColumnsA];
         columnA.push(...tableColumnsB);
         tableColumns.value = columnA;
@@ -222,7 +226,7 @@
     display: flex;
   }
   ::v-deep .ant-table-container {
-    padding: 0px 16px;
+    margin: 0px 16px;
   }
 </style>
 <style scoped>
@@ -233,4 +237,7 @@
   ::v-deep .ant-table.ant-table-bordered > .ant-table-title {
     border: none !important;
   }
+  /* ::v-deep .ant-table-title + .ant-table-container table > thead > tr:first-child th:last-child {
+    display: none !important;
+  } */
 </style>

hx-ai-intelligent/src/view/monitor/environmentMonitor/historyData/index.vue

@@ -8,7 +8,7 @@
         bordered
         :pagination="false"
         :height="500"
-        :scroll="{ x: 3000, y: 440 }">
+        :scroll="{ x: x, y: 440 }">
         <template #title>
           <div
             style="
@@ -123,6 +123,8 @@
   const tableColumnsA: TableColumnType[] = [
     {
       title: '序号',
+      width: 50,
+      align: 'center',
       customRender: ({ record, index }) => {
         // 自定义单元格内容，这里返回序号
         if (index == 0) {
@@ -159,6 +161,7 @@
       title: '区域名称',
       dataIndex: 'location',
       width: 100,
+      align: 'center',
       customCell: (record, rowIndex) => {
         if (rowIndex == undefined) {
           return {
@@ -182,6 +185,7 @@
       title: '点位',
       dataIndex: 'pointName',
       width: 100,
+      align: 'center',
       customCell: (record, rowIndex) => {
         if (rowIndex == undefined) {
           return {
@@ -209,6 +213,7 @@
       title: '日期',
       dataIndex: 'time',
       width: 110,
+      align: 'center',
     },
   ];
 
@@ -236,6 +241,7 @@
     pageSize: 10,
   });
   const orgId = ref('');
+  const x = ref(2000);
   const result = JSON.parse(sessionStorage.getItem('ORGID')!);
   orgId.value = result;
 
@@ -310,8 +316,11 @@
           tableColumnsB.push({
             title: headerList[i],
             dataIndex: headerList[i],
+            width: 60,
+            align: 'center',
           });
         }
+        x.value = 360 + headerList.length * 60;
         let columnA: any[] = [...tableColumnsA];
         columnA.push(...tableColumnsB);
         tableColumns.value = columnA;
@@ -370,7 +379,7 @@
     display: flex;
   }
   ::v-deep .ant-table-container {
-    padding: 0px 16px;
+    margin: 0px 16px;
   }
 </style>
 <style scoped>
@@ -381,4 +390,7 @@
   ::v-deep .ant-table.ant-table-bordered > .ant-table-title {
     border: none !important;
   }
+  ::v-deep .ant-table-title + .ant-table-container table > thead > tr:first-child th:last-child {
+    display: none !important;
+  }
 </style>

hx-ai-intelligent/src/view/monitor/environmentMonitor/index.vue

@@ -40,7 +40,7 @@
     @ok="handleOk"
     @cancel="closeOpenUpload">
     <div style="display: flex">
-      <div style="width: 15%">
+      <div style="width: 15%; height: 100%; position: sticky; top: 0; align-self: flex-start">
         <a-tabs
           v-model:activeKey="typeValue"
           tab-position="left"
@@ -76,25 +76,6 @@
               ">
               <div style="display: flex; align-items: center; width: 85%">
                 <div style="width: 10%">数据列表</div>
-                <!-- <a-select
-                  v-model:value="typeValue"
-                  placeholder="请选择环境参数"
-                  style="width: 15%"
-                  :options="typeList" /> -->
-                <!-- <a-tree-select
-                  v-model:value="quyuvalue"
-                  style="width: 35%; margin-left: 10px"
-                  :tree-data="treeData2"
-                  :field-names="{
-                    children: 'childList',
-                    label: 'name',
-                    value: 'id',
-                  }"
-                  tree-checkable
-                  allow-clear
-                  placeholder="请选择区域"
-                  tree-node-filter-prop="label"
-                  :maxTagCount="1" /> -->
                 <a-cascader
                   :options="treeData2"
                   v-model:value="quyuvalue"
@@ -115,18 +96,11 @@
                   v-model:value="areaName"
                   placeholder="请输入设备名称"
                   style="width: 20%; margin-left: 1%" />
-                <!-- <a-select
-                  v-model:value="frequencyValue"
-                  placeholder="请选择采集频率"
-                  style="width: 15%; margin-left: 10px"
-                  :options="frequencyOptions" /> -->
-                <!-- <a-date-picker style="width: 15%; margin-left: 10px" v-model:value="timeValue" /> -->
                 <a-button style="margin-left: 10px" @click="resetting"> 重置 </a-button>
                 <a-button type="primary" style="margin-left: 10px" @click="queryDeviceInfoListPage">
                   搜索
                 </a-button>
               </div>
-              <!-- <a-button type="primary"> 导出 </a-button> -->
             </div>
             <div>
               <a-divider />