unity通讯

src/pages/Controller/components/AirConditioner.js

@@ -2,10 +2,12 @@ import { queryIotList } from '@/services/controller';
 import { UnityAction } from '@/utils/utils';
 import { useParams, useRequest } from '@umijs/max';
 import { Spin } from 'antd';
+import { useEffect, useState } from 'react';
 import styles from '../index.less';
 
 const Work = (props) => {
   const { projectId } = useParams();
+  const [select, setSelect] = useState();
 
   const { data, loading } = useRequest(queryIotList, {
     defaultParams: [projectId],
@@ -20,6 +22,19 @@ const Work = (props) => {
     if (status == 3) return styles.error;
   };
 
+  const onHandleSelect = (item) => {
+    setSelect(item.id);
+    UnityAction.sendMsg('ACItem', String(item.id));
+  };
+
+  useEffect(() => {
+    UnityAction.addEventListener('ACItem', (id) => {
+      setSelect(id);
+    });
+
+    return () => UnityAction.off('ACItem');
+  }, []);
+
   return (
     <div>
       <div className={styles.top}>
@@ -46,7 +61,13 @@ const Work = (props) => {
       <Spin spinning={loading}>
         <div className={styles.listContent}>
           {data?.list?.map((item) => (
-            <div key={item.id} className={`card-box ${styles.item}`}>
+            <div
+              key={item.id}
+              onClick={() => onHandleSelect(item)}
+              className={`card-box ${styles.item} ${
+                select == item.id ? styles.select : ''
+              }`}
+            >
               <i className={`${styles.icon} ${getIconStatus(item.status)}`}></i>
               {item.name}
             </div>

src/pages/Controller/components/Light.js

@@ -2,10 +2,12 @@ import { queryLightList } from '@/services/controller';
 import { UnityAction } from '@/utils/utils';
 import { useParams, useRequest } from '@umijs/max';
 import { Spin } from 'antd';
+import { useEffect, useState } from 'react';
 import styles from '../index.less';
 
 const Work = (props) => {
   const { projectId } = useParams();
+  const [select, setSelect] = useState();
 
   const { data, loading } = useRequest(queryLightList, {
     defaultParams: [projectId],
@@ -20,6 +22,19 @@ const Work = (props) => {
     if (status == 3) return styles.error;
   };
 
+  const onHandleSelect = (item) => {
+    setSelect(item.id);
+    UnityAction.sendMsg('lightItem', String(item.id));
+  };
+
+  useEffect(() => {
+    UnityAction.addEventListener('lightItem', (id) => {
+      setSelect(id);
+    });
+
+    return () => UnityAction.off('lightItem');
+  }, []);
+
   return (
     <div>
       <div className={styles.top}>
@@ -46,7 +61,13 @@ const Work = (props) => {
       <Spin spinning={loading}>
         <div className={styles.listContent}>
           {data?.list?.map((item) => (
-            <div key={item.id} className={`card-box ${styles.item}`}>
+            <div
+              key={item.id}
+              onClick={() => onHandleSelect(item)}
+              className={`card-box ${styles.item} ${
+                select == item.id ? styles.select : ''
+              }`}
+            >
               <i className={`${styles.icon} ${getIconStatus(item.status)}`}></i>{' '}
               {item.name}
             </div>

src/pages/Controller/index.less

@@ -54,6 +54,9 @@
   align-items: center;
   width: 48%;
 }
+.select {
+  border: 1px solid #66ccff;
+}
 .icon {
   width: 0.2rem;
   height: 0.2rem;