设备定位以及智能管控样式修改

.umirc.ts

@@ -83,24 +83,29 @@ export default defineConfig({
       component: './Smart/Simulate',
     },
     {
-      name: '智能监控',
-      path: '/hardware-controller/:projectId',
-      component: './HardwareController',
+      name: '智能管控',
+      path: '/controller/:projectId',
+      component: './Controller',
     },
     {
       name: '感知监控',
-      path: '/hardware/:projectId',
-      component: './HardwareController/Hardware',
+      path: '/controller/hardware/:projectId',
+      component: './Controller/Hardware',
+    },
+    {
+      name: '设备定位',
+      path: '/controller/device/:projectId',
+      component: './Controller/Device',
     },
     // {
     //   name: '空调监控',
     //   path: '/hardware-controller/air-conditioner/:projectId',
-    //   component: './HardwareController/AirConditioner',
+    //   component: './Controller/AirConditioner',
     // },
     // {
     //   name: '灯光监控',
     //   path: '/hardware-controller/light/:projectId',
-    //   component: './HardwareController/Light',
+    //   component: './Controller/Light',
     // },
     {
       name: '系统自检',

src/components/PageTitle/index.js

@@ -3,7 +3,7 @@ import { history } from '@umijs/max';
 import styles from './index.less';
 
 export default (props) => {
-  const { children, returnable = false, onReturn } = props;
+  const { tabs = false, children, returnable = false, onReturn } = props;
 
   const handleOnClick = () => {
     if (onReturn) {
@@ -14,7 +14,10 @@ export default (props) => {
   };
 
   return (
-    <div className={styles.titleBox} onClick={handleOnClick}>
+    <div
+      className={`${styles.titleBox} ${tabs ? styles.tabs : ''}`}
+      onClick={handleOnClick}
+    >
       {returnable || onReturn ? (
         <LeftOutlined
           style={{ fontSize: 36, cursor: 'pointer', marginRight: '40px' }}

src/components/PageTitle/index.less

@@ -7,6 +7,7 @@
   height: 26px;
   background: #4a90e2;
   float: left;
+  margin-right: 18px;
 }
 .title {
   font-size: 36px;
@@ -14,3 +15,7 @@
   color: #000000;
   line-height: 50px;
 }
+.tabs {
+  position: absolute;
+  top: 52px;
+}

src/global.less

@@ -109,7 +109,7 @@ input[type='reset'] {
   border-radius: 8px;
   box-shadow: 0px 0px 8px 2px rgba(191, 191, 191, 0.2);
   border: 1px solid #eee;
-  background: rgba(255, 255, 255, 0.6);
+  background: rgba(255, 255, 255);
 }
 
 .password-eye {

src/pages/Controller/Device.js

@@ -0,0 +1,57 @@
+import PageContent from '@/components/PageContent';
+import PageTitle from '@/components/PageTitle';
+import { queryDevice } from '@/services/controller';
+import { UnityAction } from '@/utils/utils';
+import { useParams, useRequest } from '@umijs/max';
+import { Spin } from 'antd';
+import styles from './index.less';
+
+function Hardware() {
+  const { projectId } = useParams();
+
+  const { data, loading } = useRequest(queryDevice, {
+    defaultParams: [projectId],
+  });
+
+  const getIconStatus = (status) => {
+    if (status == 1) return '';
+    if (status == 2) return styles.offline;
+    if (status == 3) return styles.error;
+  };
+
+  return (
+    <PageContent closeable={false}>
+      <PageTitle onReturn={() => UnityAction.sendMsg('menuItem', '智能管控')}>
+        设备定位
+      </PageTitle>
+
+      <Spin spinning={loading}>
+        {data?.list?.map((item) => (
+          <div key={item.id} className={`card-box ${styles.item}`}>
+            <i className={`${styles.icon} ${getIconStatus(item.status)}`}></i>
+            {item.name}
+            <div>
+              <div>定位</div>
+              {/* <div>历史轨迹</div> */}
+            </div>
+          </div>
+        ))}
+
+        <div
+          className={`card-box ${styles.item}`}
+          style={{ justifyContent: 'space-between' }}
+        >
+          <div>
+            <i className={`${styles.icon}`}></i>
+            设备1
+          </div>
+          <div>
+            <div>定位</div>
+          </div>
+        </div>
+      </Spin>
+    </PageContent>
+  );
+}
+
+export default Hardware;

src/pages/HardwareController/Hardware.js → src/pages/Controller/Hardware.js

@@ -1,16 +1,24 @@
 import PageContent from '@/components/PageContent';
+import PageTitle from '@/components/PageTitle';
 import TabsContent from '@/components/TabsContent';
-import AirConditioner from './AirConditioner';
-import Light from './Light';
+import { UnityAction } from '@/utils/utils';
+import AirConditioner from './components/AirConditioner';
+import Light from './components/Light';
 
 function Hardware() {
   const handleTabsChange = (tab) => {};
   return (
     <PageContent tabs>
+      <PageTitle
+        tabs
+        onReturn={() => UnityAction.sendMsg('menuItem', '智能管控')}
+      >
+        感知监控
+      </PageTitle>
       <TabsContent
-        center={false}
         defaultActiveKey="1"
         onChange={handleTabsChange}
+        center={true}
         items={[
           {
             label: `空调控制`,

src/pages/HardwareController/AirConditioner.js → src/pages/Controller/components/AirConditioner.js

@@ -1,7 +1,7 @@
-import { queryIotList } from '@/services/HardwareController';
+import { queryIotList } from '@/services/controller';
 import { useParams, useRequest } from '@umijs/max';
 import { Spin } from 'antd';
-import styles from './index.less';
+import styles from '../index.less';
 
 const Work = (props) => {
   const { projectId } = useParams();
@@ -33,10 +33,6 @@ const Work = (props) => {
           <div className={styles.row}>
             <i className={styles.icon}></i> 在线：{data?.online_count}
           </div>
-          <div className={styles.row}>
-            <i className={`${styles.icon} ${styles.error}`}></i> 故障：
-            {data?.fault_count}
-          </div>
           <div className={styles.row}>
             <i className={`${styles.icon} ${styles.offline}`}></i> 离线：
             {data?.offline_count}

src/pages/HardwareController/Light.js → src/pages/Controller/components/Light.js

@@ -1,7 +1,7 @@
-import { queryLightList } from '@/services/HardwareController';
+import { queryLightList } from '@/services/controller';
 import { useParams, useRequest } from '@umijs/max';
 import { Spin } from 'antd';
-import styles from './index.less';
+import styles from '../index.less';
 
 const Work = (props) => {
   const { projectId } = useParams();
@@ -33,10 +33,6 @@ const Work = (props) => {
           <div className={styles.row}>
             <i className={styles.icon}></i> 在线：{data?.online_count}
           </div>
-          <div className={styles.row}>
-            <i className={`${styles.icon} ${styles.error}`}></i> 故障：
-            {data?.fault_count}
-          </div>
           <div className={styles.row}>
             <i className={`${styles.icon} ${styles.offline}`}></i> 离线：
             {data?.offline_count}

src/pages/HardwareController/index.js → src/pages/Controller/index.js

@@ -19,9 +19,7 @@ const HardwareController = (props) => {
       </div>
       <div
         className={`card-box ${styles.item}`}
-        onClick={() =>
-          history.push(`/hardware-controller/air-conditioner/${projectId}`)
-        }
+        onClick={() => UnityAction.sendMsg('innerItem', 'sensor')}
       >
         感知监控
       </div>

src/pages/HardwareController/index.less → src/pages/Controller/index.less

@@ -1,28 +1,21 @@
-.desc {
-  position: absolute;
-  top: 20px;
-  left: 50%;
-  transform: translateX(-50%);
-  font-size: 22px;
-}
 .top {
   display: flex;
-  padding: 20px;
+  padding: 48px 60px 25px;
   .left {
     width: 50%;
-    font-size: 24px;
+    font-size: 28px;
     display: flex;
     align-items: center;
   }
   .img {
-    width: 200px;
-    margin-right: 30px;
+    width: 152px;
+    margin-right: 45px;
   }
   .number {
-    font-size: 48px;
+    font-size: 80px;
     font-weight: bold;
     margin-bottom: 10px;
-    color: #4a90e2;
+    color: #4A90E2;
   }
   .right {
     display: flex;
@@ -30,22 +23,24 @@
     justify-content: space-around;
   }
   .row {
-    font-size: 24px;
+    font-size: 32px;
   }
 }
 .item {
-  padding: 20px;
-  font-size: 28px;
-  margin-top: 30px;
-  vertical-align: middle;
+  padding: 40px 60px;
+  
+  font-size: 36px;
+  margin-top: 28px;
+  display: flex;
+  align-items: center;
 }
 .icon {
-  width: 12px;
-  height: 12px;
+  width: 20px;
+  height: 20px;
   border-radius: 50%;
   display: inline-block;
   background-color: #12ceb3;
-  margin-right: 10px;
+  margin-right: 44px;
   vertical-align: middle;
   &.error {
     background-color: #fe5850;
@@ -54,3 +49,6 @@
     background-color: #9b9b9b;
   }
 }
+.btns {
+  flex: right;
+}

src/pages/EqSelfInspection/index.js

@@ -113,9 +113,9 @@ const EqSelfInspection = (props) => {
       <Spin spinning={loading} tip="正在自检中...">
         <div
           className={`${styles.itemMain} card-box`}
-          style={{ padding: '10px 20px' }}
+          style={{ padding: '15px 24px' }}
         >
-          <div style={{ fontSize: 20, color: 'rgba(110, 110, 110, 1)' }}>
+          <div style={{ fontSize: 28, color: 'rgba(110, 110, 110, 1)' }}>
             自检间隔：{autoReport?.RouteInfo?.PlanDur}h
           </div>
 

src/pages/EqSelfInspection/index.less

@@ -1,17 +1,17 @@
 .icon {
   position: absolute;
-  top: 10px;
+  top: 15px;
   right: 18px;
   display: flex;
   .iconDiffFilled,
   .iconFundFilled {
-    width: 28px;
-    height: 31px;
+    width: 37px;
+    height: 41px;
     cursor: pointer;
     background: url('@/assets/iconDiffFilled.png') no-repeat;
   }
   .iconFundFilled {
-    margin-left: 20px;
+    margin-left: 28px;
     background-image: url('@/assets/iconFundFilled.png');
   }
 }
@@ -102,6 +102,9 @@
     font-weight: bold;
   }
 }
+.btns {
+  float: right;
+}
 .warningItem {
   // border-bottom: 2px solid #555;
   height: 60px;

src/pages/Home/index.less

@@ -62,13 +62,13 @@
     margin-bottom: 14px;
   }
   .grade {
-    font-size: 18px;
+    font-size: 20px;
     margin-top: 10px;
   }
 }
 
 .time {
-  font-size: 18px;
+  font-size: 20px;
   margin-bottom: 20px;
   text-align: center;
 }

src/pages/Menu/index.js

@@ -38,13 +38,10 @@ const menuList = [
 ];
 
 function Menu() {
-  const { projectId } = useParams();
   const [active, setActive] = useState('首页');
   const handleClick = (item) => {
     setActive(item.name);
-    const path = item?.path(projectId);
-    // history.push(path);
-    console.log(path);
+    
     UnityAction.sendMsg("menuItem", item.name)
   };
 

src/services/HardwareController.js → src/services/controller.js

@@ -10,3 +10,8 @@ export async function queryLightList(project_id) {
     params: { project_id },
   });
 }
+export async function queryDevice(project_id) {
+  return request(`/api/iot/v1/lamp/list`, {
+    params: { project_id },
+  });
+}