Merge branch 'develop' of http://120.55.44.4:10080/xujunjie/gt_client_pad into develop

src/components/TabsContent/index.js

@@ -5,7 +5,7 @@ import styles from './index.less';
 const TabsContent = (props) => {
   const {
     defaultActiveKey = '1',
-    center = false,
+    center = true,
     small = false,
     items = {},
     onChange,

src/components/TabsContent/index.less

@@ -1,11 +1,10 @@
 .tabsTitle {
   display: flex;
-  justify-content: space-evenly;
   align-items: center;
   height: 0.8rem;
   margin-bottom: 0.1rem;
-  padding-left: 0.4rem;
-  width: calc(100% - 0.4rem);
+  // padding-left: 0.4rem;
+  // width: calc(100% - 0.4rem);
   overflow-x: auto;
   overflow-y: hidden;
   border-bottom: 0.015rem solid #bcbaba;

src/global.less

@@ -243,7 +243,7 @@ input[type='reset'] {
 
 .ant-btn-primary {
   background: #4a90e2;
-  font-size: 0.16rem;
+  font-size: 0.22rem;
   padding-top: 0;
   padding-bottom: 0;
 }

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;

src/pages/Menu/index.less

@@ -1,8 +1,8 @@
 .main {
   // margin-top: calc(100vh - 15.2rem);
   float: right;
-  width: 2.29rem;
-  height: 13.2rem;
+  width: 100%;
+  height: 100vh;
   display: flex;
   flex-direction: column;
   align-items: flex-end;
@@ -13,7 +13,7 @@
 .menu {
   // margin-top: 0.6rem;
   width: 100%;
-  height: 11.8rem;
+  height: calc(100vh - 1.6rem);
   display: flex;
   flex-direction: column;
   overflow-y: auto;
@@ -40,7 +40,7 @@ icon:first-child {
   margin-top: 0;
 }
 .arrowCon {
-  width: 2rem;
+  width: 100%;
   height: 1.6rem;
   // text-align: center;
   display: flex;

src/pages/MessageCenter/index.js

@@ -13,15 +13,22 @@ const icon2 = require('@/assets/message/check.png');
 const MessageCenter = () => {
   const { projectId } = useParams();
   const [tab, setTab] = useState('1');
-  const { data, run, loading } = useRequest(getNotificationList, {
-    defaultParams: [{ projectId, msgType: 11 }], //, msgType: 工况：11， 自检：12
+  //, msgType: 工况：11， 自检：12
+  const { data, run, loading } = useRequest(() =>
+    getNotificationList({ projectId, msgType: 11 }),
+  );
+
+  const {
+    data: dataSelf,
+    run: runSelf,
+    loading: loadingSelf,
+  } = useRequest(() => getNotificationList({ projectId, msgType: 12 }), {
+    manual: true,
   });
 
   const handleTabsChange = (tab) => {
     setTab(tab);
-    tab == '1'
-      ? run({ projectId, msgType: 11 })
-      : run({ projectId, msgType: 12 });
+    tab == '1' ? run() : runSelf();
   };
 
   const handleReadClick = () => {
@@ -78,8 +85,8 @@ const MessageCenter = () => {
             label: `系统自检`,
             key: '2',
             children: (
-              <Spin spinning={loading}>
-                {data?.list?.map((item) => renderItem(item))}
+              <Spin spinning={loadingSelf}>
+                {dataSelf?.list?.map((item) => renderItem(item))}
               </Spin>
             ),
           },

src/pages/Projects/index.less

@@ -1,8 +1,8 @@
 .main {
   width: 100%;
   height: 100vh;
-  // background: url('@/assets/projects/bg.png') no-repeat center;
-  // background-size: 100% 100%;
+  background: url('@/assets/projects/bg.png') no-repeat center;
+  background-size: 100% 100%;
   .titleCon {
     margin: 0 1.8rem;
     padding: 2.64rem 0 0.4rem;

src/pages/SmartOps/Analysis.js

@@ -104,9 +104,7 @@ const Analysis = (props) => {
     console.log(data);
     // alert(e)
     const itemIndex = data?.findIndex((item) => item.type == tab);
-    const item = data[itemIndex]?.data?.find(
-      (item) => item.DeviceCode == e,
-    );
+    const item = data[itemIndex]?.data?.find((item) => item.DeviceCode == e);
     if (item) {
       const dom = document.querySelector(`tr[data-row-key="${item.index}"]`);
       if (dom) {
@@ -157,7 +155,7 @@ const Analysis = (props) => {
     // selectedList[0] = index;
     setSelectedRowKeys(index);
     UnityAction.sendMsg('SynDev', record.DeviceCode);
-      };
+  };
 
   const setRowClassName = (record, index) => {
     if (!selectedRowKeys && selectedRowKeys !== 0) return;
@@ -168,32 +166,34 @@ const Analysis = (props) => {
 
   return (
     <Spin spinning={loading}>
-      <TabsContent
-        small={true}
-        center={false}
-        defaultActiveKey="1"
-        items={data?.map((item) => {
-          return {
-            label: `${item.name}(${item.data?.length || 0})`,
-            key: item.type,
-            children: (
-              <Table
-                dataSource={item.data}
-                columns={columns}
-                rowKey={'index'}
-                // rowSelection={rowSelection}
-                rowClassName={setRowClassName}
-                onRow={(record, index) => ({
-                  onClick: () => onSelectRow(record, index),
-                })}
-                pagination={false}
-                scroll={{ y: document.body.clientHeight - 730 }}
-              />
-            ),
-          };
-        })}
-        onChange={onTabChange}
-      />
+      <div style={{ height: 'calc(100vh - 5.6rem)', overflow: 'auto' }}>
+        <TabsContent
+          small={true}
+          center={false}
+          defaultActiveKey="1"
+          items={data?.map((item) => {
+            return {
+              label: `${item.name}(${item.data?.length || 0})`,
+              key: item.type,
+              children: (
+                <Table
+                  dataSource={item.data}
+                  columns={columns}
+                  rowKey={'index'}
+                  // rowSelection={rowSelection}
+                  rowClassName={setRowClassName}
+                  onRow={(record, index) => ({
+                    onClick: () => onSelectRow(record, index),
+                  })}
+                  pagination={false}
+                  scroll={{ y: document.body.clientHeight - 730 }}
+                />
+              ),
+            };
+          })}
+          onChange={onTabChange}
+        />
+      </div>
     </Spin>
   );
 };

src/pages/SmartOps/components/DeviceAnalysis.js

@@ -168,7 +168,7 @@ const DeviceAnalysis = (props) => {
 
   return (
     <Spin spinning={loading}>
-      <div>
+      <div style={{ height: 'calc(100vh - 5.6rem)', overflow: 'auto' }}>
         <TabsContent
           small={true}
           center={false}

src/pages/SmartOps/components/VideoAnalysis.js

@@ -72,36 +72,38 @@ function VideoAnalysis(props) {
 
   return (
     <Spin spinning={loading}>
-      <TabsContent
-        small={true}
-        center={false}
-        defaultActiveKey="1"
-        items={[
-          {
-            label: `异常(${videoNum})`,
-            key: '1',
-            children: (
-              <AnalysisContent
-                errorData={errorData}
-                selectedName={selectedName}
-                setSelectedName={setSelectedName}
-              />
-            ),
-          },
-          {
-            label: `全部(${allCount})`,
-            key: '2',
-            children: (
-              <AllContent
-                videoData={videoData}
-                selectedName={selectedName}
-                setSelectedName={setSelectedName}
-              />
-            ),
-          },
-        ]}
-        onChange={onTabChange}
-      />
+      <div style={{ height: 'calc(100vh - 5.6rem)', overflow: 'auto' }}>
+        <TabsContent
+          small={true}
+          center={false}
+          defaultActiveKey="1"
+          items={[
+            {
+              label: `异常(${videoNum})`,
+              key: '1',
+              children: (
+                <AnalysisContent
+                  errorData={errorData}
+                  selectedName={selectedName}
+                  setSelectedName={setSelectedName}
+                />
+              ),
+            },
+            {
+              label: `全部(${allCount})`,
+              key: '2',
+              children: (
+                <AllContent
+                  videoData={videoData}
+                  selectedName={selectedName}
+                  setSelectedName={setSelectedName}
+                />
+              ),
+            },
+          ]}
+          onChange={onTabChange}
+        />
+      </div>
     </Spin>
   );
 }

src/pages/SmartReport/index.js

@@ -291,211 +291,220 @@ const SmartReport = () => {
         <div className={styles.title}>无锡锡山水厂</div>
 
         <Spin spinning={loading}>
-          <Box title="概览">
-            <div className={styles.content}>
-              <TwoBoxItem label="累计进水：" value={in_water} />
-              <TwoBoxItem label="累计出水：" value={out_water} />
+          <div className={styles.scrollContent}>
+            <Box title="概览">
+              <div className={styles.content}>
+                <TwoBoxItem label="累计进水：" value={in_water} />
+                <TwoBoxItem label="累计出水：" value={out_water} />
+
+                <ThreeBoxContent
+                  data={[
+                    {
+                      label: '吨水能耗',
+                      value: water_electricity,
+                      unit: 'kwh',
+                    },
+                    { label: '吨水药耗', value: water_medicine, unit: 'kg/m³' },
+                    {
+                      label: '系统自检次数',
+                      value: self_inspection_task,
+                      unit: '次',
+                    },
+                  ]}
+                />
 
-              <ThreeBoxContent
+                <TwoBoxItem
+                  label="优化建议："
+                  value={push_optimize_task}
+                  unit="条"
+                />
+                <TwoBoxItem
+                  label="任务完成："
+                  value={push_complete_task}
+                  unit="个"
+                />
+
+                <ThreeBoxContent
+                  data={[
+                    {
+                      label: '工单完成',
+                      value: work_order_complete_task,
+                      unit: '个',
+                    },
+                    { label: '设备维修', value: repair_record, unit: '个' },
+                    {
+                      label: '设备保养',
+                      value: maintain_record,
+                      unit: '个',
+                    },
+                  ]}
+                />
+              </div>
+            </Box>
+            <Box title="水量">
+              <CircleContent
                 data={[
-                  { label: '吨水能耗', value: water_electricity, unit: 'kwh' },
-                  { label: '吨水药耗', value: water_medicine, unit: 'kg/m³' },
-                  {
-                    label: '系统自检次数',
-                    value: self_inspection_task,
-                    unit: '次',
-                  },
+                  { label: '累计进水', value: in_water },
+                  { label: '累计出水', value: out_water },
                 ]}
               />
+            </Box>
 
-              <TwoBoxItem
-                label="优化建议："
-                value={push_optimize_task}
-                unit="条"
-              />
-              <TwoBoxItem
-                label="任务完成："
-                value={push_complete_task}
-                unit="个"
-              />
-
-              <ThreeBoxContent
+            <Box title="能耗">
+              <CircleContent
                 data={[
-                  {
-                    label: '工单完成',
-                    value: work_order_complete_task,
-                    unit: '个',
-                  },
-                  { label: '设备维修', value: repair_record, unit: '个' },
-                  {
-                    label: '设备保养',
-                    value: maintain_record,
-                    unit: '个',
-                  },
+                  { label: '吨水能耗', value: water_electricity, unit: '' },
+                  { label: '累计耗电量', value: electricity, unit: 'kwh' },
                 ]}
               />
-            </div>
-          </Box>
-          <Box title="水量">
-            <CircleContent
-              data={[
-                { label: '累计进水', value: in_water },
-                { label: '累计出水', value: out_water },
-              ]}
-            />
-          </Box>
-
-          <Box title="能耗">
-            <CircleContent
-              data={[
-                { label: '吨水能耗', value: water_electricity, unit: '' },
-                { label: '累计耗电量', value: electricity, unit: 'kwh' },
-              ]}
-            />
-          </Box>
-
-          <Box title="药耗">
-            <CircleContent
-              data={[
-                { label: '吨水药耗', value: water_medicine, unit: 'kg/m³' },
-                { label: '累计用药量', value: medicine },
-              ]}
-            />
-          </Box>
-
-          <div className={styles.box}>
-            <div className={styles.main_in}>
-              <div className={styles.titleContent}>系统自检</div>
-              <CircleThreeContent
+            </Box>
+
+            <Box title="药耗">
+              <CircleContent
                 data={[
-                  { label: '自检次数', value: self_inspection_task },
-                  { label: '异常次数', value: self_inspection_abnormal_task },
-                  { label: '正常次数', value: self_inspection_normal_task },
+                  { label: '吨水药耗', value: water_medicine, unit: 'kg/m³' },
+                  { label: '累计用药量', value: medicine },
                 ]}
               />
-              <div className={styles.paddingContent}>
-                <div className={styles.cutLine}></div>
-              </div>
-              <div style={{ padding: '0.43rem 0.4rem 0' }}>
-                <div className={styles.unit}>异常类型统计：</div>
-                <div
-                  ref={eqDomRef}
-                  style={{
-                    height: '6rem',
-                    width: 'calc(100% - 1.2rem)',
-                    margin: '0 0 0 0.8rem',
-                  }}
+            </Box>
+
+            <div className={styles.box}>
+              <div className={styles.main_in}>
+                <div className={styles.titleContent}>系统自检</div>
+                <CircleThreeContent
+                  data={[
+                    { label: '自检次数', value: self_inspection_task },
+                    { label: '异常次数', value: self_inspection_abnormal_task },
+                    { label: '正常次数', value: self_inspection_normal_task },
+                  ]}
                 />
+                <div className={styles.paddingContent}>
+                  <div className={styles.cutLine}></div>
+                </div>
+                <div style={{ padding: '0.43rem 0.4rem 0' }}>
+                  <div className={styles.unit}>异常类型统计：</div>
+                  <div
+                    ref={eqDomRef}
+                    style={{
+                      height: '6rem',
+                      margin: '0 0 0 0.8rem',
+                    }}
+                  />
+                </div>
               </div>
             </div>
-          </div>
 
-          <div className={styles.box}>
-            <div className={styles.main_in}>
-              <div className={styles.titleContent}>智慧运营</div>
-              <CircleThreeContent
-                data={[
-                  { label: '优化条数', value: push_optimize_task, unit: '条' },
-                  { label: '超滤能耗', value: ele_65 },
-                  { label: '反渗透能耗', value: ele_66 },
-                ]}
-              />
-              <div className={styles.paddingContent}>
-                <div className={styles.cutLine}></div>
-              </div>
-              <div style={{ padding: '0.43rem 0.4rem 0' }}>
-                <div className={styles.unit}>工况评估统计：</div>
-                <div
-                  ref={workScoreDomRef}
-                  style={{
-                    height: '6rem',
-                    width: 'calc(100% - 1.2rem)',
-                    margin: '0 0 0 0.8rem',
-                  }}
+            <div className={styles.box}>
+              <div className={styles.main_in}>
+                <div className={styles.titleContent}>智慧运营</div>
+                <CircleThreeContent
+                  data={[
+                    {
+                      label: '优化条数',
+                      value: push_optimize_task,
+                      unit: '条',
+                    },
+                    { label: '超滤能耗', value: ele_65 },
+                    { label: '反渗透能耗', value: ele_66 },
+                  ]}
                 />
-              </div>
-              {/* <div style={{ padding: '0.2rem 0.2rem 0 0.2rem' }}>
+                <div className={styles.paddingContent}>
+                  <div className={styles.cutLine}></div>
+                </div>
+                <div style={{ padding: '0.43rem 0.4rem 0' }}>
+                  <div className={styles.unit}>工况评估统计：</div>
+                  <div
+                    ref={workScoreDomRef}
+                    style={{
+                      height: '6rem',
+                      width: 'calc(100% - 1.2rem)',
+                      margin: '0 0 0 0.8rem',
+                    }}
+                  />
+                </div>
+                {/* <div style={{ padding: '0.2rem 0.2rem 0 0.2rem' }}>
                 <div className={styles.smartText}>
                   优化条数:{push_optimize_task}条
                 </div>
                 <div className={styles.smartText}>超滤能耗：{ele_65}</div>
                 <div className={styles.smartText}>反渗透能耗：{ele_66}</div>
               </div> */}
-              {/* <div
+                {/* <div
                 ref={workScoreDomRef}
                 style={{ height: '3.4rem', margin: '0.1rem 0 0.1rem 0' }}
               ></div> */}
+              </div>
             </div>
-          </div>
-          <div className={styles.box}>
-            <div className={styles.main_in}>
-              <div className={styles.titleContent}>任务工单</div>
-              <CircleContent
-                data={[
-                  { label: '任务数量', value: push_task },
-                  { label: '工单数量', value: work_order_task },
-                ]}
-              />
-              <CircleContent
-                data={[
-                  { label: '任务完成数量', value: push_complete_task },
-                  { label: '工单完成数量', value: work_order_complete_task },
-                ]}
-              />
+            <div className={styles.box}>
+              <div className={styles.main_in}>
+                <div className={styles.titleContent}>任务工单</div>
+                <CircleContent
+                  data={[
+                    { label: '任务数量', value: push_task },
+                    { label: '工单数量', value: work_order_task },
+                  ]}
+                />
+                <CircleContent
+                  data={[
+                    { label: '任务完成数量', value: push_complete_task },
+                    { label: '工单完成数量', value: work_order_complete_task },
+                  ]}
+                />
+                <CircleContent
+                  data={[
+                    {
+                      label: '任务完成率',
+                      value: push_complete_task_per,
+                      unit: '%',
+                    },
+                    {
+                      label: '工单完成率',
+                      value: work_order_complete_task_per,
+                      unit: '%',
+                    },
+                  ]}
+                />
+                <div style={{ display: 'flex', padding: '0 0.4rem' }}>
+                  <div className={styles.item}>
+                    <div className={styles.unit}>任务类型统计：</div>
+                    <div
+                      ref={taskDomRef}
+                      style={{
+                        height: '6rem',
+                        width: '100%',
+                        marginTop: '0.2rem',
+                      }}
+                    ></div>
+                  </div>
+                  <div className={styles.item}>
+                    <div className={styles.unit}>工单类型统计：</div>
+                    <div
+                      ref={workDomRef}
+                      style={{
+                        height: '6rem',
+                        width: '100%',
+                        marginTop: '0.2rem',
+                      }}
+                    ></div>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <Box title="设备维修保养">
               <CircleContent
                 data={[
                   {
-                    label: '任务完成率',
-                    value: push_complete_task_per,
-                    unit: '%',
+                    label: '维修数量',
+                    value: repair_record,
                   },
                   {
-                    label: '工单完成率',
-                    value: work_order_complete_task_per,
-                    unit: '%',
+                    label: '保养数量',
+                    value: maintain_record,
                   },
                 ]}
               />
-              <div style={{ display: 'flex', padding: '0 0.4rem' }}>
-                <div className={styles.item}>
-                  <div className={styles.unit}>任务类型统计：</div>
-                  <div
-                    ref={taskDomRef}
-                    style={{
-                      height: '6rem',
-                      width: '100%',
-                      marginTop: '0.2rem',
-                    }}
-                  ></div>
-                </div>
-                <div className={styles.item}>
-                  <div className={styles.unit}>工单类型统计：</div>
-                  <div
-                    ref={workDomRef}
-                    style={{
-                      height: '6rem',
-                      width: '100%',
-                      marginTop: '0.2rem',
-                    }}
-                  ></div>
-                </div>
-              </div>
-            </div>
+            </Box>
           </div>
-          <Box title="设备维修保养">
-            <CircleContent
-              data={[
-                {
-                  label: '维修数量',
-                  value: repair_record,
-                },
-                {
-                  label: '保养数量',
-                  value: maintain_record,
-                },
-              ]}
-            />
-          </Box>
         </Spin>
       </ConfigProvider>
     </PageContent>
@@ -542,6 +551,7 @@ const getPieOption = (chartData, isLeft = false) => {
         type: 'pie',
         top: isLeft ? 0 : '20%',
         radius: isLeft ? '60%' : '40%',
+        left: isLeft ? '20%' : 0,
         label: isLeft ? {} : { fontSize: 10 },
         data: chartData,
         emphasis: {

src/pages/SmartReport/index.less

@@ -63,7 +63,7 @@
   }
 }
 .title {
-  margin: 0.82rem 0.4rem;
+  margin: 0.4rem 0.4rem 0.2rem 0.4rem;
   font-size: 0.54rem;
   font-family: Helvetica;
   color: #3b3b3b;
@@ -82,6 +82,11 @@
   color: #ffffff;
   letter-spacing: 0.04rem;
 }
+.scrollContent {
+  height: calc(100vh - 2.2rem);
+  overflow: auto;
+  padding-top: 0.4rem;
+}
 
 .box {
   position: relative;
@@ -112,7 +117,7 @@
   .content {
     display: flex;
     justify-content: space-between;
-    padding: 0.8rem 0.9rem 0.64rem;
+    padding: 0.4rem 0.6rem 0.2rem;
     flex-wrap: wrap;
   }
   .item {