硬件控制页面

.gitignore

@@ -12,3 +12,4 @@
 /.mfsu
 .swc
 /.idea
+dist.zip

.umirc.ts

@@ -80,6 +80,11 @@ export default defineConfig({
       path: '/hardware-controller/air-conditioner/:projectId',
       component: './HardwareController/AirConditioner',
     },
+    {
+      name: '空调监控',
+      path: '/hardware-controller/light/:projectId',
+      component: './HardwareController/Light',
+    },
     {
       name: '系统自检',
       path: '/self-inspection/:projectId',

src/pages/EqSelfInspection/components/Detail.js

@@ -371,19 +371,9 @@ export function DeviceTable(props) {
         columns={columns}
         dataSource={items}
         rowKey="Id"
-        onRow={(data) => {
-          return {
-            onClick: () => {
-              handleClickItem(data);
-            },
-          };
-        }}
         locale={{
           emptyText: <Empty />,
         }}
-        rowClassName={(record) =>
-          `DeviceTable-${record.Id}` == select ? styles.select : null
-        }
       />
       <ThresholdModal
         open={visible}
@@ -447,21 +437,9 @@ function AalysisTable(props) {
         columns={columns}
         dataSource={FaultAnalysis}
         rowKey="device_code"
-        onRow={(data) => {
-          return {
-            onClick: () => {
-              onClickItem(`AalysisTable-${data.device_code}`, {
-                deviceCode: data.device_code,
-              });
-            }, // 点击行
-          };
-        }}
         locale={{
           emptyText: <Empty />,
         }}
-        rowClassName={(record) =>
-          `AalysisTable-${record.device_code}` == select ? styles.select : null
-        }
       />
     </div>
   );
@@ -704,24 +682,14 @@ export function WarningTable(props) {
 
   return (
     <div>
-      {/* <div className="table-total">当前列表总数 {Items?.length || 0}</div> */}
       <Table
         columns={columns}
         dataSource={items}
         rowKey="Id"
-        onRow={(data) => {
-          return {
-            onClick: () => {
-              handleClickItem(data);
-            },
-          };
-        }}
         locale={{
           emptyText: <Empty />,
         }}
-        rowClassName={(record) =>
-          `DeviceTable-${record.Id}` == select ? styles.select : null
-        }
+     
       />
       <ThresholdModal
         open={visible}

src/pages/HardwareController/AirConditioner.js

@@ -2,7 +2,7 @@ import PageContent from '@/components/PageContent';
 import PageTitle from '@/components/PageTitle';
 import { queryConditionSnapshot } from '@/services/SmartOps';
 import { useParams, useRequest } from '@umijs/max';
-import styles from './AirConditioner.less';
+import styles from './index.less';
 
 const Work = (props) => {
   const { projectId } = useParams();
@@ -39,13 +39,13 @@ const Work = (props) => {
           </div>
         </div>
       </div>
-      <div className="card-box">
+      <div className={`card-box ${styles.item}`}>
         <i className={styles.icon}></i> 空调1
       </div>
-      <div className="card-box">
+      <div className={`card-box ${styles.item}`}>
         <i className={styles.icon}></i> 空调2
       </div>
-      <div className="card-box">
+      <div className={`card-box ${styles.item}`}>
         <i className={`${styles.icon} ${styles.error}`}></i> 空调3
       </div>
     </PageContent>

src/pages/HardwareController/AirConditioner.less

@@ -1,28 +0,0 @@
-.desc {
-  position: absolute;
-  top: 20px;
-  left: 50%;
-  transform: translateX(-50%);  
-  font-size: 22px;
-}
-.top {
-  display: flex;
-  margin-top: 40px;
-  padding: 20px;
-  .left {
-    width: 50%;
-    font-size: 24px;
-    display: flex;
-    align-items: center;
-  }
-  .img {
-    width: 200px;
-    margin-right: 30px;
-  }
-  .number {
-    font-size: 48px;
-    font-weight: bold;
-    margin-bottom: 10px;
-    color: #4A90E2;
-  }
-}

src/pages/HardwareController/Light.js

@@ -0,0 +1,54 @@
+import PageContent from '@/components/PageContent';
+import PageTitle from '@/components/PageTitle';
+import { queryConditionSnapshot } from '@/services/SmartOps';
+import { useParams, useRequest } from '@umijs/max';
+import styles from './index.less';
+
+const Work = (props) => {
+  const { projectId } = useParams();
+
+  const { data, loading } = useRequest(queryConditionSnapshot, {
+    defaultParams: [{ project_id: projectId }],
+    initialData: {},
+  });
+
+  return (
+    <PageContent>
+      <PageTitle>照明控制</PageTitle>
+      <div className={`card-box ${styles.top}`}>
+        <div className={styles.left}>
+          <img
+            className={styles.img}
+            src={require('@/assets/air-conditioner.png')}
+          />
+          <div>
+            <div className={styles.number}>23</div>
+            照明数量
+          </div>
+        </div>
+        <div className={styles.right}>
+          <div className={styles.row}>
+            <i className={styles.icon}></i> 在线：137
+          </div>
+          <div className={styles.row}>
+            <i className={`${styles.icon} ${styles.error}`}></i> 在线：137
+          </div>
+          <div className={styles.row}>
+            <i className={`${styles.icon} ${styles.offline}`}></i> 在线：137
+          </div>
+        </div>
+      </div>
+      <div className={`card-box ${styles.item}`}>
+        <i className={styles.icon}></i> 照明1
+      </div>
+      <div className={`card-box ${styles.item}`}>
+        <i className={styles.icon}></i> 照明2
+      </div>
+      <div className={`card-box ${styles.item}`}>
+        <i className={`${styles.icon} ${styles.error}`}></i> 照明3
+      </div>
+    </PageContent>
+  );
+};
+
+export default Work;

src/pages/HardwareController/index.less

@@ -0,0 +1,57 @@
+.desc {
+  position: absolute;
+  top: 20px;
+  left: 50%;
+  transform: translateX(-50%);
+  font-size: 22px;
+}
+.top {
+  display: flex;
+  margin-top: 40px;
+  padding: 20px;
+  .left {
+    width: 50%;
+    font-size: 24px;
+    display: flex;
+    align-items: center;
+  }
+  .img {
+    width: 200px;
+    margin-right: 30px;
+  }
+  .number {
+    font-size: 48px;
+    font-weight: bold;
+    margin-bottom: 10px;
+    color: #4a90e2;
+  }
+  .right {
+    display: flex;
+    flex-direction: column;
+    justify-content: space-around;
+  }
+  .row {
+    font-size: 24px;
+  }
+}
+.item {
+  padding: 20px;
+  font-size: 28px;
+  margin-top: 30px;
+  vertical-align: middle;
+}
+.icon {
+  width: 12px;
+  height: 12px;
+  border-radius: 50%;
+  display: inline-block;
+  background-color: #12ceb3;
+  margin-right: 10px;
+  vertical-align: middle;
+  &.error {
+    background-color: #fe5850;
+  }
+  &.offline {
+    background-color: #9b9b9b;
+  }
+}