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

src/pages/Center/index.js

@@ -1,7 +1,7 @@
 import PageContent from '@/components/PageContent';
+import PageTitle from '@/components/PageTitle';
 import { version } from '@/constants';
 import { UnityAction } from '@/utils/utils';
-import { CloseOutlined } from '@ant-design/icons';
 import { useModel, useNavigate, useParams } from '@umijs/max';
 import styles from './index.less';
 const Center = () => {
@@ -26,12 +26,10 @@ const Center = () => {
     navigate(`/center/my-task/${projectId}?user_id=${user.ID}`);
   };
 
-  const handleClose = () => {
-    UnityAction.sendMsg('closePage');
-  };
   return (
-    <PageContent closeable={false}>
-      {/* <div className={styles.page}> */}
+    <PageContent>
+      <PageTitle>个人中心</PageTitle>
+
       <div className={styles.head}>
         <div className={styles.profile} />
         <div className={styles.textContent}>
@@ -42,16 +40,6 @@ const Center = () => {
             {version}
           </div>
         </div>
-
-        <CloseOutlined
-          style={{
-            position: 'absolute',
-            top: '20px',
-            right: '20px',
-            fontSize: '30px',
-          }}
-          onClick={handleClose}
-        />
       </div>
       <div className={styles.center}>
         <div
@@ -84,7 +72,6 @@ const Center = () => {
       <div className={styles.loginOut} onClick={handleLogOutClick}>
         退出登录
       </div>
-      {/* </div> */}
     </PageContent>
   );
 };

src/pages/Center/index.less

@@ -5,14 +5,14 @@
   background-color: #ffffff;
 }
 .box {
-  background: rgba(255, 255, 255, 0.78);
+  background: rgba(255, 255, 255);
   box-shadow: 0px 0px 8px 4px rgba(212, 212, 212, 0.5);
   border-radius: 20px;
 }
 .head {
   .box;
   position: relative;
-  margin-bottom: 30px;
+  margin: 30px 0;
   padding: 64px 76px;
   display: flex;
   .profile {
@@ -79,7 +79,7 @@
   width: 329px;
   height: 97px;
   text-align: center;
-  background: rgba(74, 144, 226, 0.85);
+  background: rgba(74, 144, 226);
   border-radius: 49px;
   font-size: 32px;
   font-family: PingFangSC, PingFang SC;

src/pages/Controller/index.js

@@ -1,7 +1,7 @@
 import PageContent from '@/components/PageContent';
 import PageTitle from '@/components/PageTitle';
 import { UnityAction } from '@/utils/utils';
-import { history, useParams } from '@umijs/max';
+import { useParams } from '@umijs/max';
 import styles from './index.less';
 
 const HardwareController = (props) => {

src/pages/DeviceManager/storage.js

@@ -124,69 +124,71 @@ const StorageOverview = () => {
   return (
     <PageContent closeable={false}>
       <PageTitle children="备品统计" returnable />
-      <div className={`card-box content-title ${styles.main}`}>
-        <Spin spinning={loading}>
-          <ModuleTitle title="物料种类库存占比" />
-          <div style={{ height: '330px' }}>
-            {data?.pieData && <PieChartModule data={data.pieData} />}
-          </div>
-          <div className={styles.thereItem}>
-            <ModuleTitle title="物料库存排名前十统计" />
-            <ul
-              style={{
-                height: '330px',
-                display: 'flex',
-                flexDirection: 'column',
-              }}
-            >
-              {data?.kind && data.kind.length != 0 ? (
-                data.kind
-                  ?.sort((a, b) => b.value - a.value)
-                  .map((item) => {
-                    return (
-                      <li
-                        className={styles.li}
-                        key={`kind_${item.item}`}
-                        style={{ flexGrow: 1 }}
-                      >
-                        <div
-                          style={{
-                            width: '80px',
-                            textAlign: 'right',
-                            fontSize: '18px',
-                            whiteSpace: 'nowrap',
-                          }}
-                        >
-                          {item.item}
-                        </div>
-                        <div
-                          className={styles.line}
-                          style={{
-                            width: `${(70 * item.value) / data?.maxKind}%`,
-                          }}
-                        />
-                        {item.value}
-                      </li>
-                    );
-                  })
-              ) : (
-                <Empty />
-              )}
-            </ul>
-          </div>
-          <div className={styles.thereItem}>
-            <ModuleTitle title="物料报废统计" />
+      <div className="content-title">
+        <div className={`card-box${styles.main}`}>
+          <Spin spinning={loading}>
+            <ModuleTitle title="物料种类库存占比" />
             <div style={{ height: '330px' }}>
-              {data?.radarData && <RadarChartModule {...data.radarData} />}
+              {data?.pieData && <PieChartModule data={data.pieData} />}
             </div>
-          </div>
-          <div className={styles.twoItem}>
-            <ModuleTitle title="出入库统计" />
-            <div style={{ height: '330px' }}>
-              {data?.barData && <BarChartModule {...data.barData} />}
+            <div className={styles.thereItem}>
+              <ModuleTitle title="物料库存排名前十统计" />
+              <ul
+                style={{
+                  height: '330px',
+                  display: 'flex',
+                  flexDirection: 'column',
+                }}
+              >
+                {data?.kind && data.kind.length != 0 ? (
+                  data.kind
+                    ?.sort((a, b) => b.value - a.value)
+                    .map((item) => {
+                      return (
+                        <li
+                          className={styles.li}
+                          key={`kind_${item.item}`}
+                          style={{ flexGrow: 1 }}
+                        >
+                          <div
+                            style={{
+                              width: '80px',
+                              textAlign: 'right',
+                              fontSize: '18px',
+                              whiteSpace: 'nowrap',
+                            }}
+                          >
+                            {item.item}
+                          </div>
+                          <div
+                            className={styles.line}
+                            style={{
+                              width: `${(70 * item.value) / data?.maxKind}%`,
+                            }}
+                          />
+                          {item.value}
+                        </li>
+                      );
+                    })
+                ) : (
+                  <Empty />
+                )}
+              </ul>
+            </div>
+            <div className={styles.thereItem}>
+              <ModuleTitle title="物料报废统计" />
+              <div style={{ height: '330px' }}>
+                {data?.radarData && <RadarChartModule {...data.radarData} />}
+              </div>
+            </div>
+            <div className={styles.twoItem}>
+              <ModuleTitle title="出入库统计" />
+              <div style={{ height: '330px' }}>
+                {data?.barData && <BarChartModule {...data.barData} />}
+              </div>
             </div>
-          </div>
-        </Spin>
+          </Spin>
+        </div>
       </div>
     </PageContent>
   );

src/pages/Smart/index.js

@@ -139,7 +139,7 @@ const Work = (props) => {
       </Row>
       <Row gutter={16}>
         <Col span={12}>
-          <div className={styles.card2}>
+          <div className={styles.card2} style={{ marginBottom: 0 }}>
             <h3>能耗数据</h3>
             <ul>
               <li>
@@ -152,7 +152,7 @@ const Work = (props) => {
           </div>
         </Col>
         <Col span={12}>
-          <div className={styles.card2}>
+          <div className={styles.card2} style={{ marginBottom: 0 }}>
             <h3>药耗数据</h3>
             <ul>
               <li>

src/pages/Smart/index.less

@@ -76,7 +76,6 @@
 
 .card2 {
   .card;
-
   i {
     background-color: #ffc800;
   }

src/pages/SmartOps/components/VideoAnalysis.js

@@ -3,12 +3,16 @@ import TabsContent from '@/components/TabsContent';
 import ThresholdDetail from '@/components/ThresholdDetail';
 import { UnityAction } from '@/utils/utils';
 import { Collapse, Spin, Table, Tabs } from 'antd';
-import { useEffect, useState } from 'react';
-import ThresholdBar from './ThresholdBar';
+import { useMemo, useState } from 'react';
 import styles from './VideoAnalysis.less';
 
 const { TabPane } = Tabs;
 const { Panel } = Collapse;
+const TYPE = {
+  video: 1,
+  fill: 2,
+  water: 3,
+};
 
 function VideoAnalysis(props) {
   const { videoNum, data, videoData, loading } = props;
@@ -21,33 +25,48 @@ function VideoAnalysis(props) {
   const [prevKey, setPrevKey] = useState();
   const [selectedName, setSelectedName] = useState('');
 
-  const handleCollapse = (key) => {
-    if (key === prevKey) return;
-    setPrevKey(key);
-    const device = data.list.find((item) => item.id === key)?.device_name;
-    if (device) {
-      UnityAction.sendMsg('SynCam', device);
-    }
-  };
+  const errorData = useMemo(() => {
+    const list1 =
+      videoData.dumu_list?.map((item) => {
+        return { ...item, type_name: '视频报警', type: TYPE.video };
+      }) || [];
+    const list2 =
+      videoData.environment_list
+        ?.filter((item) => item.status)
+        .map((item) => {
+          return { ...item, type_name: '环境监测', type: TYPE.fill };
+        }) || [];
+    const list3 =
+      videoData.fluid_level_list
+        ?.filter((item) => item.status)
+        .map((item) => {
+          return { ...item, type_name: '液位监测', type: TYPE.water };
+        }) || [];
+    return [...list1, ...list2, ...list3];
+  }, [videoData]);
 
-  useEffect(() => {
-    UnityAction.on('SynCam', selectedItem);
-    return () => UnityAction.off('SynCam', selectedItem);
-  }, [data?.list]);
+  // useEffect(() => {
+  //   UnityAction.on('SynCam', selectedItem);
+  //   UnityAction.on('SynDev', selectedItem);
+  //   return () => {
+  //     UnityAction.off('SynDev', selectedItem);
+  //     UnityAction.off('SynCam', selectedItem);
+  //   };
+  // }, [data?.list]);
 
-  //滚动到相应位置
-  const selectedItem = (e) => {
-    setSelectedName(e);
-    const dom = document.querySelector(`div[data-name="${e}"]`);
-    if (dom) {
-      let v = document.getElementById('videoContent');
-      v.scrollTop = dom.offsetTop;
-    }
-  };
+  // //滚动到相应位置
+  // const selectedItem = (e) => {
+  //   setSelectedName(e);
+  //   const dom = document.querySelector(`div[data-name="${e}"]`);
+  //   if (dom) {
+  //     let v = document.getElementById('videoContent');
+  //     v.scrollTop = dom.offsetTop;
+  //   }
+  // };
 
   const onTabChange = (tab) => {
     setTab(tab);
-    // UnityAction.sendMsg('ProcessAnalysisType', tab);
+    UnityAction.sendMsg('SensorAnalysisType', tab);
   };
 
   return (
@@ -62,10 +81,8 @@ function VideoAnalysis(props) {
             key: '1',
             children: (
               <AnalysisContent
-                data={data}
-                videoData={videoData}
+                errorData={errorData}
                 selectedName={selectedName}
-                prevKey={prevKey}
               />
             ),
           },
@@ -81,11 +98,19 @@ function VideoAnalysis(props) {
   );
 }
 
-function AnalysisContent({ data, selectedName, prevKey }) {
+function AnalysisContent({ errorData, selectedName }) {
+  const [prevKey, setPrevKey] = useState();
   const handleImgClick = (item) => {
     localStorage.setItem('preview', JSON.stringify(item.data));
     UnityAction.sendMsg('SensorPic');
   };
+  const handleCollapse = (item) => {
+    const key = item.type == TYPE.video ? item.device_name : item.device_code;
+    const name = item.type == TYPE.video ? 'SynCam' : 'SynDev';
+    if (key === prevKey) return;
+    setPrevKey(key);
+    UnityAction.sendMsg(name, key);
+  };
 
   const renderContent = (key, item) => {
     let content = '';
@@ -98,7 +123,7 @@ function AnalysisContent({ data, selectedName, prevKey }) {
               {item.event_type}
               <img
                 className={styles.img}
-                src={item.url}
+                src={item.path}
                 onClick={() => handleImgClick(item)}
               />
             </div>
@@ -109,16 +134,28 @@ function AnalysisContent({ data, selectedName, prevKey }) {
         content = (
           <>
             <div className={styles.contentFlex}>
-              <div>参数：温度</div>
+              <div>参数：{item.patrol_name}</div>
               <div className={styles.threshold}>
                 <span>阈值范围：</span>
                 <div style={{ width: '180px' }}>
-                  <ThresholdBar current={0.5} thresholds={[0, 1]} />
+                  <ThresholdDetail
+                    current={item.value || 0}
+                    data={{
+                      JsonNumThreshold: item?.json_num_threshold,
+                      Type: 2,
+                    }}
+                  />
                 </div>
               </div>
-
               <div>
-                状态：<span className={styles.textAbnormal}>异常</span>
+                状态：
+                {item?.status <= 0 ? (
+                  <span className={styles.textNormal}>正常</span>
+                ) : item.status == 1 ? (
+                  <span className={styles.textAbnormal}>异常</span>
+                ) : (
+                  <span className={styles.textWarning}>警告</span>
+                )}
               </div>
             </div>
           </>
@@ -128,11 +165,29 @@ function AnalysisContent({ data, selectedName, prevKey }) {
         content = (
           <>
             <div className={styles.contentFlex}>
-              <div>原液位：12.01</div>
-              <div> 仪表液位：12.12 </div>
-
+              <div>原液位：{item.origin_value}</div>
+              <div> 差值：{item.value} </div>
+              <div className={styles.threshold}>
+                <span>阈值范围：</span>
+                <div style={{ width: '180px' }}>
+                  <ThresholdDetail
+                    current={item.value || 0}
+                    data={{
+                      JsonNumThreshold: item?.json_num_threshold,
+                      Type: 2,
+                    }}
+                  />
+                </div>
+              </div>
               <div>
-                状态：<span className={styles.textAbnormal}>异常</span>
+                状态：
+                {item?.status <= 0 ? (
+                  <span className={styles.textNormal}>正常</span>
+                ) : item.status == 1 ? (
+                  <span className={styles.textAbnormal}>异常</span>
+                ) : (
+                  <span className={styles.textWarning}>警告</span>
+                )}
               </div>
             </div>
           </>
@@ -141,31 +196,36 @@ function AnalysisContent({ data, selectedName, prevKey }) {
     }
     return content;
   };
-
+  const getClassName = (item) => {
+    const key = item.type == TYPE.video ? item.device_name : item.device_code;
+    return selectedName == key || prevKey == key
+      ? styles.tableSelect
+      : styles.table;
+  };
   return (
     <div
       className={styles.page}
       style={{ height: 'calc(100vh - 630px)', overflow: 'auto' }}
     >
-      {data?.length > 0 ? (
-        data?.map((item) => (
+      {errorData?.length > 0 ? (
+        errorData?.map((item) => (
           <div data-name={item.device_name}>
             <Collapse
-              defaultActiveKey={[item.id]}
-              key={item.id}
-              className={
-                selectedName == item.device_name || prevKey == item.id
-                  ? styles.tableSelect
-                  : styles.table
-              }
-              expandIcon={() => <div className={styles.typeText}>视频报警</div>}
+              defaultActiveKey={[item.device_name]}
+              key={item.device_name}
+              className={getClassName(item)}
+              expandIcon={() => (
+                <div className={styles.typeText}>{item.type_name}</div>
+              )}
               onChange={(e) => {
-                handleCollapse(item.id);
+                handleCollapse(item);
               }}
             >
-              <Panel header={item.device_name} key={item.id}>
+              <Panel header={item.device_name} key={item.device_name}>
                 <div className={styles.box}>
-                  <div className={styles.item}>{renderContent(1, item)}</div>
+                  <div className={styles.item}>
+                    {renderContent(item.type, item)}
+                  </div>
                 </div>
               </Panel>
             </Collapse>
@@ -179,7 +239,11 @@ function AnalysisContent({ data, selectedName, prevKey }) {
 }
 
 function AllContent({ data = [], videoData = {} }) {
-  const { environment_list = [], fluid_level_list = [] } = videoData;
+  const {
+    environment_list = [],
+    fluid_level_list = [],
+    dumu_list = [],
+  } = videoData;
   const [selectedRowKeys, setSelectedRowKeys] = useState([]);
   const columns1 = [
     {
@@ -339,24 +403,26 @@ function AllContent({ data = [], videoData = {} }) {
       render: (item) => (
         <img
           className={styles.img}
-          src={item.url}
+          src={item.path}
           onClick={() => handleImgClick(item)}
         />
       ),
     },
   ];
 
-  const onSelectRow = (record, index) => {
+  const onSelectRow = (item, type) => {
+    const key = type == TYPE.video ? item.device_name : item.device_code;
+    const name = type == TYPE.video ? 'SynCam' : 'SynDev';
     const selectedList = [...selectedRowKeys];
-    if (selectedList[0] === index) return;
-    selectedList[0] = index;
+    if (selectedList[0] === key) return;
+    selectedList[0] = key;
     setSelectedRowKeys(selectedList);
-    UnityAction.sendMsg('SynDev', record.DeviceCode);
+    UnityAction.sendMsg(name, key);
   };
 
-  const setRowClassName = (record, index) => {
-    return index === selectedRowKeys[0] ||
-      record.DeviceCode == selectedRowKeys[0]
+  const setRowClassName = (item) => {
+    const key = item.type == TYPE.video ? item.device_name : item.device_code;
+    return selectedRowKeys.length > 0 && key == selectedRowKeys[0]
       ? styles.tableSelect
       : '';
   };
@@ -371,10 +437,10 @@ function AllContent({ data = [], videoData = {} }) {
         <Table
           dataSource={environment_list}
           columns={columns1}
-          // rowClassName={setRowClassName}
-          // onRow={(record, index) => ({
-          //   onClick: () => onSelectRow(record, index),
-          // })}
+          rowClassName={setRowClassName}
+          onRow={(record, index) => ({
+            onClick: () => onSelectRow(record, TYPE.fill),
+          })}
           pagination={false}
           scroll={{ y: 400 }}
         />
@@ -384,10 +450,10 @@ function AllContent({ data = [], videoData = {} }) {
         <Table
           dataSource={fluid_level_list}
           columns={columns2}
-          // rowClassName={setRowClassName}
-          // onRow={(record, index) => ({
-          //   onClick: () => onSelectRow(record, index),
-          // })}
+          rowClassName={setRowClassName}
+          onRow={(record, index) => ({
+            onClick: () => onSelectRow(record, TYPE.water),
+          })}
           pagination={false}
           scroll={{ y: 400 }}
         />
@@ -395,12 +461,12 @@ function AllContent({ data = [], videoData = {} }) {
       <div className={`card-box ${styles.box}`}>
         <ModuleTitle title="感知监测" />
         <Table
-          dataSource={data}
+          dataSource={dumu_list}
           columns={columns3}
-          // rowClassName={setRowClassName}
-          // onRow={(record, index) => ({
-          //   onClick: () => onSelectRow(record, index),
-          // })}
+          rowClassName={setRowClassName}
+          onRow={(record, index) => ({
+            onClick: () => onSelectRow(record, TYPE.video),
+          })}
           pagination={false}
           scroll={{ y: 400 }}
         />

src/pages/SmartOps/components/VideoAnalysis.less

@@ -42,10 +42,10 @@
 }
 .page {
   .tableSelect {
-    background-color: #2466a4 !important;
+    background-color: #b0d5f7 !important;
   }
   .table {
-    background-color: #064779;
+    background-color: #ffffff;
   }
   .typeText {
     color: #4a90e2 !important;
@@ -66,11 +66,17 @@
   }
 
   :global {
+    .ant-collapse .ant-collapse-content {
+      background-color: transparent !important;
+    }
+    .ant-collapse-item {
+      background-color: transparent !important;
+    }
     .ant-collapse > .ant-collapse-item {
       border-radius: 8px;
       box-shadow: 0px 0px 8px 2px rgba(191, 191, 191, 0.2);
       border: 1px solid #eee;
-      background: rgba(255, 255, 255);
+      // background: rgba(255, 255, 255);
       padding: 0 15px;
       margin-bottom: 15px;
       &.ant-collapse-item-active > .ant-collapse-header {

src/pages/SmartOps/index.js

@@ -6,7 +6,7 @@ import {
   queryProjectConfig,
   querySimulationProfit,
 } from '@/services/SmartOps';
-import { getDetail, getPatrolPerception } from '@/services/dumu';
+import { getPatrolPerception } from '@/services/dumu';
 import { GetTokenFromUrl, UnityAction } from '@/utils/utils';
 import {
   connect,
@@ -41,7 +41,6 @@ function SmartOps(props) {
   const patrolId = searchParams.get('patrolId');
   const [videoNum, setVideoNum] = useState(0);
 
-  const [tableData, setTableData] = useState([]);
   const signalRef = useRef();
 
   const {
@@ -156,75 +155,32 @@ function SmartOps(props) {
     () =>
       getPatrolPerception({
         project_id: projectId * 1,
-        patrol_id: patrolId || reportData.PatrolId,
+        patrol_id: patrolId || reportData?.PatrolId,
       }),
     {
       onSuccess: (data) => {
-        if (data.dumu_list?.length > 0) {
-          setTableData(data?.dumu_list);
-          data.dumu_list.forEach((item) => {
-            detailRun(item.id, { signal: signalRef.current.signal });
-          });
-        }
         const count1 = data.dumu_list?.length || 0;
         const count2 =
           data.environment_list?.filter((item) => item.status)?.length || 0;
         const count3 =
           data.fluid_level_list?.filter((item) => item.status)?.length || 0;
         setVideoNum(count1 + count2 + count3);
+        const Cam = data.dumu_list?.map((item) => item.device_name) || [];
+        const Dev1 =
+          data.environment_list?.map((item) => {
+            return { DeviceCode: item.device_code, grade_alarm: item.status };
+          }) || [];
+        const Dev2 =
+          data.fluid_level_list?.map((item) => {
+            return { DeviceCode: item.device_code, grade_alarm: item.status };
+          }) || [];
+        const params = { Cam, Dev: [...Dev1, ...Dev2] };
       },
     },
   );
 
-  const { run: detailRun } = useRequest(getDetail, {
-    manual: true,
-    fetchKey: (id) => id,
-    cacheKey: (id) => id,
-    onSuccess: (data) => {
-      var item = tableData?.find((child) => child.id === data.id);
-      if (item) {
-        item.url = base64ToImageUrl(data.event_bg);
-        item.data = data;
-      }
-      setTableData([...tableData]);
-    },
-  });
-  // const { run, loading: loadingVideo } = useRequest(
-  //   () =>
-  //     getCameraList(projectId, {
-  //       s_time: dayjs().subtract(10, 'month').format('YYYY-MM-DD HH:mm:ss'), //sTime,
-  //       e_time: eTime,
-  //       pageSize: 999,
-  //     }),
-  //   {
-  //     manual: true,
-  //     onSuccess: (data) => {
-  //       setTableData(data);
-  //       sendUnityMsg(data?.list);
-  //       // data?.list?.forEach(item => {
-  //       //   detailRun(item.id, { signal: signalRef.current.signal });
-  //       // });
-  //     },
-  //   },
-  // );
-
-  // const videoAnalysisNumber = tableData?.pagination?.total || 0;
   const AnalysisNumber = list?.pagenation?.total || 0;
 
-  function base64ToImageUrl(base64String) {
-    const byteCharacters = atob(base64String);
-    const byteArrays = [];
-
-    for (let i = 0; i < byteCharacters.length; i++) {
-      byteArrays.push(byteCharacters.charCodeAt(i));
-    }
-
-    const byteArray = new Uint8Array(byteArrays);
-    const blob = new Blob([byteArray], { type: 'image/png' });
-    const imageUrl = URL.createObjectURL(blob);
-
-    return imageUrl;
-  }
   // 利润
   const { data: profitData, run: getProfit } = useRequest(
     () =>
@@ -251,26 +207,14 @@ function SmartOps(props) {
     return dayjs(eTime).format('MM-DD HH:mm');
   }, [eTime]);
 
-  const sendUnityMsg = (list) => {
-    if (!list || list?.length == 0) return;
-    const names = list.map((item) => item.device_name);
-    UnityAction.sendMsg('SensorAnalysis', names.join(','));
-  };
-
   const onChangeTab = (type) => {
     UnityAction.sendMsg('SmartAnalysisTab', type);
-    if (type == '3') {
-      tableData?.list?.forEach((item) => {
-        detailRun(item.id, { signal: signalRef.current.signal });
-      });
-    }
   };
 
   useEffect(() => {
     if (!eTime) return;
     initDate();
     runWork();
-    // run();
     runVideo();
     getProfit();
   }, [eTime]);
@@ -374,7 +318,6 @@ function SmartOps(props) {
               children: (
                 <VideoAnalysis
                   videoNum={videoNum}
-                  data={tableData}
                   videoData={videoData}
                   loading={loadingVideo}
                 />

src/pages/SmartReport/index.js

@@ -1,5 +1,7 @@
 import ModuleTitle from '@/components/ManagementPage/moduleTitle';
+import PageContent from '@/components/PageContent';
 import { queryWorkReport } from '@/services/smartReport';
+import { LeftOutlined } from '@ant-design/icons';
 import { useNavigate, useParams, useRequest } from '@umijs/max';
 import { ConfigProvider, DatePicker, Select, Spin } from 'antd';
 import zhCN from 'antd/es/locale/zh_CN';
@@ -236,12 +238,22 @@ const SmartReport = () => {
     setDate(date);
   };
 
+  const handleOnClick = () => {
+    history.back();
+  };
+
   return (
-    <ConfigProvider locale={zhCN}>
-      <div className={styles.page}>
+    <PageContent closeable={false}>
+      <ConfigProvider locale={zhCN}>
         <div className={styles.head}>
           <div>
-            <div className={styles.name}>智慧运营报告</div>
+            <div className={styles.name}>
+              <LeftOutlined
+                onClick={handleOnClick}
+                style={{ fontSize: 36, cursor: 'pointer', marginRight: '20px' }}
+              />
+              智慧运营报告
+            </div>
             <div className={styles.photo}>
               {dayjs(date.stime).format('MM月DD日')}-
               {dayjs(date.etime).format('MM月DD日')}
@@ -386,8 +398,8 @@ const SmartReport = () => {
             </div>
           </div>
         </Spin>
-      </div>
-    </ConfigProvider>
+      </ConfigProvider>
+    </PageContent>
   );
 };
 export default SmartReport;

src/pages/SmartReport/index.less

@@ -16,9 +16,12 @@
   color: #4a4a4a;
   line-height: 48px;
 }
+.photo {
+  margin-left: 60px;
+}
 
 .head {
-  padding: 48px 0 10px;
+  padding-left: 10px;
   display: flex;
   justify-content: space-between;
   align-items: center;

src/pages/SystemDaily/index.js

@@ -1,5 +1,6 @@
 import PageContent from '@/components/PageContent';
 import { queryDailyWorkReport } from '@/services/user';
+import { LeftOutlined } from '@ant-design/icons';
 import { useParams, useRequest } from '@umijs/max';
 import { Spin } from 'antd';
 import dayjs from 'dayjs';
@@ -36,40 +37,47 @@ const SystemDaily = (props) => {
     user_name = '',
     user_name_count = 0,
   } = data;
+  const handleOnClick = () => {
+    history.back();
+  };
   return (
-    <PageContent>
+    <PageContent closeable={false}>
       <Spin spinning={loading}>
-        <div className={styles.main}>
-          <div className={styles.titleContent}>
-            <div className={styles.title}>系统工作日报</div>
-            <div className={styles.time}>{dayjs().format('MM月DD日')}</div>
+        <div className={styles.titleContent}>
+          <div className={styles.title}>
+            <LeftOutlined
+              onClick={handleOnClick}
+              style={{ fontSize: 36, cursor: 'pointer', marginRight: '20px' }}
+            />
+            系统工作日报
           </div>
-          <div className={styles.content}>
-            <div className={styles.text}>
-              执行自控指令次数：{automatic_task}次
-            </div>
-            <div className={styles.text}>
-              推送优化建议：{push_optimize_task}条
-            </div>
-            <div className={styles.text}>
-              系统自检次数：{self_inspection_task}条
-              &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;正常次数：
-              {self_inspection_normal_task}条
-              &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;异常次数：
-              {self_inspection_abnormal_task}条
-            </div>
-            <div className={styles.text}>
-              推送任务：{push_task}条&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
-              任务完成率：{task_percent}%
-            </div>
-            <div className={styles.text}>
-              工单数量：{work_order_task}条
-              &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;工单完成率：
-              {work_percent}%
-            </div>
-            <div className={styles.text}>
-              工单完成人员第一名：{user_name}完成{user_name_count}个工单
-            </div>
+          <div className={styles.time}>{dayjs().format('MM月DD日')}</div>
+        </div>
+        <div className={styles.content}>
+          <div className={styles.text}>
+            执行自控指令次数：{automatic_task}次
+          </div>
+          <div className={styles.text}>
+            推送优化建议：{push_optimize_task}条
+          </div>
+          <div className={styles.text}>
+            系统自检次数：{self_inspection_task}条
+            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;正常次数：
+            {self_inspection_normal_task}条
+            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;异常次数：
+            {self_inspection_abnormal_task}条
+          </div>
+          <div className={styles.text}>
+            推送任务：{push_task}条&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
+            任务完成率：{task_percent}%
+          </div>
+          <div className={styles.text}>
+            工单数量：{work_order_task}条
+            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;工单完成率：
+            {work_percent}%
+          </div>
+          <div className={styles.text}>
+            工单完成人员第一名：{user_name}完成{user_name_count}个工单
           </div>
         </div>
       </Spin>

src/pages/SystemDaily/index.less

@@ -3,13 +3,13 @@
   width: 90%;
   margin: 60px auto;
   background-color: #ffffff;
-  background: rgba(255, 255, 255, 0.78);
+  background: rgba(255, 255, 255);
   box-shadow: 0px 0px 8px 4px rgba(212, 212, 212, 0.5);
   border-radius: 20px;
 }
 .titleContent {
   width: 100%;
-  text-align: center;
+  // text-align: center;
   font-family: PingFangSC, PingFang SC;
   color: #4a4a4a;
   margin: auto;
@@ -18,6 +18,7 @@
     line-height: 48px;
   }
   .time {
+    margin-left: 60px;
     font-size: 22px;
     line-height: 30px;
   }
@@ -25,7 +26,6 @@
 .content {
   padding: 60px 30px;
   margin: 20px auto;
-  width: 80%;
   box-shadow: 0px 0px 8px 4px rgba(212, 212, 212, 0.5);
   border-radius: 20px;
   background: #e7f1fe;