地图首页接口对接

jjb.config.js

@@ -9,15 +9,13 @@ module.exports = {
       // 应用后端分支名称，部署上线需要
       javaGitBranch: "<branch-name>",
       // 接口服务地址
-      // API_HOST: "https://gbs-gateway.qhdsafety.com",
-      API_HOST: "http://192.168.20.100:30140",
+      API_HOST: "https://gbs-gateway.qhdsafety.com",
     },
     production: {
       // 应用后端分支名称，部署上线需要
       javaGitBranch: "<branch-name>",
       // 接口服务地址
-      // API_HOST: "",
-      API_HOST: "https://gbs-gateway.qhdsafety.com",
+      API_HOST: "",
     },
   },
   // 应用唯一标识符

src/api/bi/index.js

@@ -1,6 +1,42 @@
-import { declareRequest } from '@cqsjjb/jjb-dva-runtime';
+import { declareRequest } from "@cqsjjb/jjb-dva-runtime";
 
 export const getWeather = declareRequest(
-    'biLoading',
-    'Get > https://api.map.baidu.com/weather/v1/?district_id=130300&data_type=all&ak=dIqOi34IlTg5FkNck1vqoBpLhPAj36S1',
+  "indexInfoWeatherLoading",
+  "Get > /bi/weather/info",
+);
+export const getEventReportListUnfinished = declareRequest(
+  "indexInfoEmergencyRescueLoading",
+  "Post > @/emergencyRescue/eventReport/listUnfinished",
+);
+export const getProjectTaskScoreCount = declareRequest(
+  "indexInfoDomainLoading",
+  "Get > /domain/projectTask/scoreCount",
+);
+export const getHiddenStatisticsByCorp = declareRequest(
+  "indexInfoHiddenLoading",
+  "Post > @/hidden/hidden/statisticsByCorp",
+);
+export const getXgfStatisticsListCorpStatistics = declareRequest(
+  "indexInfoXgfManagerLoading",
+  "Post > @/xgfManager/xgfStatistics/listCorpStatistics",
+);
+export const getAlarmRecordScreenIotDeviceAlarmPage = declareRequest(
+  "indexInfoIotalarmLoading",
+  "Post > @/iotalarm/alarmRecord/screenIotDeviceAlarmPage",
+);
+export const getXgfStatisticsListRecordProjectStatistics = declareRequest(
+  "indexInfoXgfManagerProjectLoading",
+  "Get > /xgfManager/xgfStatistics/listRecordProjectStatistics",
+);
+export const getFixedCameraVideoList = declareRequest(
+  "indexInfoVideoPatrolLoading",
+  "Post > @/videopatrol/fixedCamera/getVideoList",
+);
+export const getFixedCameraPlayUrl = declareRequest(
+  "indexInfoVideoPatrolUrlLoading",
+  "Get > /videopatrol/fixedCamera/getPlayUrl",
+);
+export const getEightWorkInfoDangerWorkStatistics = declareRequest(
+  "indexInfoEightWorkLoading",
+  "Post > @/eightwork/eightworkInfo/dangerWorkStatistics",
 );

src/pages/Container/Map/components/BottomUtils/portUtilsList.js

@@ -199,7 +199,7 @@ export const portUtilsList = [
   {
     img: bottomImg6,
     checkImg: bottomImg6On,
-    label: "危险作业",
+    label: "重点作业",
     type: "danger",
     list: [
       {

src/pages/Container/Map/components/Content/IndexInfo/Bottom/index.js

@@ -1,11 +1,48 @@
+import { Connect } from "@cqsjjb/jjb-dva-runtime";
+import { message, Spin } from "antd";
+import { useEffect, useState } from "react";
+import SeamlessScroll from "zy-react-library/components/SeamlessScroll";
 import AliPlayer from "zy-react-library/components/Video/AliPlayer";
+import { randoms } from "zy-react-library/utils";
 import img2 from "~/assets/images/public/bigScreen/bg13.png";
 import img3 from "~/assets/images/public/bigScreen/bg14.png";
 import img4 from "~/assets/images/public/bigScreen/more1.png";
+import { NS_BI } from "~/enumerate/namespace";
 import Title from "~/pages/Container/Map/components/Content/IndexInfo/Title";
 import "./index.less";
 
-function BottomScreen() {
+function BottomScreen(props) {
+  const [block1List, setBlock1List] = useState([]);
+  const [block2List, setBlock2List] = useState([]);
+  const [active, setActive] = useState("");
+  const [playUrl, setPlayUrl] = useState("");
+
+  const getXgfStatisticsListRecordProjectStatistics = async () => {
+    const { data } = await props["getXgfStatisticsListRecordProjectStatistics"]();
+    setBlock1List(data);
+  };
+  const getFixedCameraPlayUrl = async (indexCode) => {
+    const { data, success } = await props["getFixedCameraPlayUrl"]({ indexCode });
+    if (success) {
+      setPlayUrl(data.url);
+    }
+  };
+  const getFixedCameraVideoList = async () => {
+    const { data } = await props["getFixedCameraVideoList"]();
+    setBlock2List(data);
+    if (data.length > 0) {
+      setActive(data[0].corpinfoName);
+      if (data[0].fixedCameraCOList.length > 0) {
+        getFixedCameraPlayUrl(data[0].fixedCameraCOList[Math.floor(randoms(0, data[0].fixedCameraCOList.length - 1))].cameraNumber);
+      }
+    }
+  };
+
+  useEffect(() => {
+    getXgfStatisticsListRecordProjectStatistics();
+    getFixedCameraVideoList();
+  }, []);
+
   return (
     <div className="bottom-container_con">
       <div className="top_container">
@@ -28,6 +65,7 @@ function BottomScreen() {
       <div className="bottom-container">
         <div className="left">
           <Title title="相关方单位备案与项目执行统计" />
+          <Spin spinning={props.bi.indexInfoXgfManagerProjectLoading}>
             <div className="main" style={{ backgroundImage: `url(${img2})` }}>
               <div className="table">
                 <div className="head">
@@ -37,50 +75,56 @@ function BottomScreen() {
                   <div>项目执行情况统计</div>
                   <div>人员培训情况统计</div>
                 </div>
-              <div className="table-container">
-                <div className="table-item">新益公司</div>
-                <div className="table-item">23/26</div>
-                <div className="table-item">23/26</div>
-                <div className="table-item">23/26</div>
-                <div className="table-item">23/26</div>
+                <div className="scroll">
+                  <SeamlessScroll list={block1List} step={0.5}>
+                    {block1List.map((item, index) => (
+                      <div className="table-container" key={index}>
+                        <div className="table-item">{item.qualificationsTypeName}</div>
+                        <div className="table-item">{item.managerDeptName}</div>
+                        <div className="table-item">{`${item.completedRecordCount}/${item.applyRecordCount}`}</div>
+                        <div className="table-item">{`${item.executingProjectCount}/${item.projectCount}`}</div>
+                        <div className="table-item">{`${item.trainingPassedCount}/${item.projectUserCount}`}</div>
                       </div>
-
-              <div className="table-container">
-                <div className="table-item">新益公司</div>
-                <div className="table-item">23/26</div>
-                <div className="table-item">23/26</div>
-                <div className="table-item">23/26</div>
-                <div className="table-item">23/26</div>
-              </div>
-              <div className="table-container">
-                <div className="table-item">新益公司</div>
-                <div className="table-item">23/26</div>
-                <div className="table-item">23/26</div>
-                <div className="table-item">23/26</div>
-                <div className="table-item">23/26</div>
-              </div>
-              <div className="table-container">
-                <div className="table-item">新益公司</div>
-                <div className="table-item">23/26</div>
-                <div className="table-item">23/26</div>
-                <div className="table-item">23/26</div>
-                <div className="table-item">23/26</div>
+                    ))}
+                  </SeamlessScroll>
                 </div>
               </div>
             </div>
+          </Spin>
         </div>
         <div className="right">
           <Title title="视频巡屏" />
           <div className="main">
+            <Spin spinning={props.bi.indexInfoVideoPatrolLoading}>
               <div className="menu">
-              <div className="list active">新益公司</div>
-              <div className="list">二公司</div>
-              <div className="list">六公司</div>
-              <div className="list">七公司</div>
-              <div className="list">九公司</div>
+                {
+                  block2List.map((item, index) => (
+                    <div
+                      className={`list ${item.corpinfoName === active ? "active" : ""}`}
+                      key={index}
+                      onClick={() => {
+                        setActive(item.corpinfoName);
+                        if (item.fixedCameraCOList.length > 0) {
+                          getFixedCameraPlayUrl(item.fixedCameraCOList[Math.floor(randoms(0, item.fixedCameraCOList.length - 1))].cameraNumber);
+                        }
+                        else {
+                          message.warning("暂无视频");
+                          setPlayUrl("");
+                        }
+                      }}
+                    >
+                      {item.corpinfoName}
                     </div>
+                  ))
+                }
+              </div>
+            </Spin>
             <div className="video-container" style={{ backgroundImage: `url(${img3})` }}>
-              <AliPlayer source="https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/2minute-demo.mp4" height="100%" isLive />
+              <Spin spinning={props.bi.indexInfoVideoPatrolLoading || props.bi.indexInfoVideoPatrolUrlLoading}>
+                {
+                  playUrl ? <AliPlayer source={playUrl} height="100%" isLive /> : <div className="no-video">暂无视频</div>
+                }
+              </Spin>
             </div>
           </div>
         </div>
@@ -89,4 +133,4 @@ function BottomScreen() {
   );
 }
 
-export default BottomScreen;
+export default Connect([NS_BI], true)(BottomScreen);

src/pages/Container/Map/components/Content/IndexInfo/Bottom/index.less

@@ -73,6 +73,11 @@
               font-weight: bold;
             }
 
+            .scroll{
+              height: 140px;
+              overflow-y: hidden;
+            }
+
             .table-container {
               display: grid;
               grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
@@ -81,18 +86,6 @@
               margin: 0 auto;
               text-align: center;
 
-              .fc1 {
-                color: #0c90ff;
-              }
-
-              .fc2 {
-                color: #62b13f;
-              }
-
-              .fc3 {
-                color: #ffa105;
-              }
-
               &:hover {
                 background-color: rgba(14, 197, 208, 0.1);
                 box-shadow: 0 0 1px #00e7ff;
@@ -124,6 +117,7 @@
             text-align: center;
             line-height: 30px;
             padding: 5px;
+            overflow-y: auto;
 
             .list {
               border-radius: 5px;
@@ -151,6 +145,12 @@
             flex: 1;
             margin-left: 10px;
             padding: 10px;
+
+            .no-video{
+              color: #fff;
+              text-align: center;
+              line-height: 160px;
+            }
           }
         }
       }

src/pages/Container/Map/components/Content/IndexInfo/LeftPanel/echarts.js

@@ -3,9 +3,9 @@ import * as echarts from "echarts";
 export const initEcharts1 = (main1Ref, chartInstance, data) => {
   chartInstance.current = echarts.init(main1Ref.current);
 
-  const companyNames = data.map(item => item.name);
-  const hazardCounts = data.map(item => item.hazardCount);
-  const unrectifiedCounts = data.map(item => item.unrectifiedCount);
+  const domainTypeName = data.map(item => item.domainTypeName);
+  const scoredCount = data.map(item => item.scoredCount);
+  const noScoreCount = data.map(item => item.noScoreCount);
 
   const option = {
     tooltip: {
@@ -16,7 +16,7 @@ export const initEcharts1 = (main1Ref, chartInstance, data) => {
     },
     grid: {
       left: "10%",
-      top: "28%",
+      top: "20%",
       right: "10%",
       bottom: "25%",
     },
@@ -30,6 +30,15 @@ export const initEcharts1 = (main1Ref, chartInstance, data) => {
       },
     },
     dataZoom: [
+      {
+        type: "inside",
+        xAxisIndex: 0,
+        start: 0,
+        end: 50,
+        zoomOnMouseWheel: "shift",
+        moveOnMouseWheel: true,
+        moveOnMouseMove: true,
+      },
       {
         type: "slider",
         height: 6,
@@ -47,7 +56,7 @@ export const initEcharts1 = (main1Ref, chartInstance, data) => {
       },
     ],
     xAxis: {
-      data: companyNames,
+      data: domainTypeName,
       axisLine: {
         show: false,
       },
@@ -60,7 +69,6 @@ export const initEcharts1 = (main1Ref, chartInstance, data) => {
         color: "#FFFFFF",
         fontSize: 12,
         margin: 12,
-        interval: 0,
       },
     },
     yAxis: [
@@ -73,8 +81,8 @@ export const initEcharts1 = (main1Ref, chartInstance, data) => {
         splitLine: {
           show: true,
           lineStyle: {
-            color: "#000000",
-            type: "solid",
+            color: "#fff",
+            type: "dashed",
           },
         },
         axisTick: {
@@ -97,9 +105,9 @@ export const initEcharts1 = (main1Ref, chartInstance, data) => {
         barWidth: 10,
         yAxisIndex: 0,
         itemStyle: {
-          color: "#C5993B",
+          color: "#53ed06",
         },
-        data: hazardCounts,
+        data: scoredCount,
       },
       {
         name: "未评分",
@@ -109,7 +117,7 @@ export const initEcharts1 = (main1Ref, chartInstance, data) => {
         itemStyle: {
           color: "#FF0606",
         },
-        data: unrectifiedCounts,
+        data: noScoreCount,
       },
     ],
   };

src/pages/Container/Map/components/Content/IndexInfo/LeftPanel/index.js

@@ -1,4 +1,6 @@
+import { Connect } from "@cqsjjb/jjb-dva-runtime";
 import { useMount } from "ahooks";
+import { Spin } from "antd";
 import { useEffect, useRef, useState } from "react";
 import SeamlessScroll from "zy-react-library/components/SeamlessScroll";
 import img9 from "~/assets/images/public/bigScreen/bg9.png";
@@ -9,67 +11,52 @@ import img5 from "~/assets/images/public/bigScreen/tablebg1.png";
 import img6 from "~/assets/images/public/bigScreen/tablebg2.png";
 import img3 from "~/assets/images/public/bigScreen/w_ico1.png";
 import img4 from "~/assets/images/public/bigScreen/w_ico2.png";
+import { NS_BI } from "~/enumerate/namespace";
 import Title from "~/pages/Container/Map/components/Content/IndexInfo/Title";
-import { getWeather, getWeatherIcon } from "~/utils/weather";
+import { getWeatherIcon } from "~/utils/weather";
 import { initEcharts1 } from "./echarts";
 import "./index.less";
 
-function LeftScreen() {
+function LeftScreen(props) {
   const [weather, setWeather] = useState({});
-  const [block1List, setBlock1List] = useState([
-    { id: 1, companyName: "新益公司", status: 0, preventiveMeasures: "远离大树、电线杆、简易房等..." },
-    { id: 2, companyName: "华泰化工", status: 1, preventiveMeasures: "加固设备、检查管道连接..." },
-    { id: 3, companyName: "宏达制造", status: 2, preventiveMeasures: "暂停户外作业、检查电气设备..." },
-    { id: 4, companyName: "金鼎能源", status: 0, preventiveMeasures: "关闭通风设备、加强监测..." },
-    { id: 5, companyName: "瑞丰新材料", status: 1, preventiveMeasures: "疏散人员、设置警戒线..." },
-    { id: 6, companyName: "恒通物流", status: 2, preventiveMeasures: "暂停运输作业、固定货物..." },
-    { id: 7, companyName: "天成建筑", status: 0, preventiveMeasures: "停止高空作业、加固脚手架..." },
-    { id: 8, companyName: "绿源环保", status: 1, preventiveMeasures: "启动应急预案、检测环境指标..." },
-    { id: 9, companyName: "安泰消防", status: 2, preventiveMeasures: "配备消防器材、加强巡查..." },
-    { id: 10, companyName: "创新科技", status: 0, preventiveMeasures: "断电保护、转移重要设备..." },
-  ]);
-  const [block4List, setBlock4List] = useState([
-    { id: 1, companyName: "新益公司", foundHazards: 123, resolvedHazards: 120, pendingResolution: 2, pendingAcceptance: 1 },
-    { id: 2, companyName: "华泰化工", foundHazards: 85, resolvedHazards: 80, pendingResolution: 3, pendingAcceptance: 2 },
-    { id: 3, companyName: "宏达制造", foundHazards: 67, resolvedHazards: 65, pendingResolution: 1, pendingAcceptance: 1 },
-    { id: 4, companyName: "金鼎能源", foundHazards: 156, resolvedHazards: 145, pendingResolution: 8, pendingAcceptance: 3 },
-    { id: 5, companyName: "瑞丰新材料", foundHazards: 42, resolvedHazards: 40, pendingResolution: 1, pendingAcceptance: 1 },
-    { id: 6, companyName: "恒通物流", foundHazards: 78, resolvedHazards: 75, pendingResolution: 2, pendingAcceptance: 1 },
-    { id: 7, companyName: "天成建筑", foundHazards: 93, resolvedHazards: 88, pendingResolution: 4, pendingAcceptance: 1 },
-    { id: 8, companyName: "绿源环保", foundHazards: 56, resolvedHazards: 54, pendingResolution: 1, pendingAcceptance: 1 },
-    { id: 9, companyName: "安泰消防", foundHazards: 112, resolvedHazards: 110, pendingResolution: 1, pendingAcceptance: 1 },
-    { id: 10, companyName: "创新科技", foundHazards: 71, resolvedHazards: 69, pendingResolution: 1, pendingAcceptance: 1 },
-  ]);
+  const [block1List, setBlock1List] = useState([]);
+  const [block4List, setBlock4List] = useState([]);
 
   const chartInstance = useRef(null);
   const main1Ref = useRef(null);
 
   const loadWeather = async () => {
-    const result = await getWeather();
+    const { result } = await props["getWeather"]();
 
     setWeather({
       ...result.now,
       alertTitle: result.alerts?.[0]?.title || "当前暂无气象预警",
     });
   };
+
+  const getEventReportListUnfinished = async () => {
+    const { data } = await props["getEventReportListUnfinished"]();
+    setBlock1List(data);
+  };
+
+  const getProjectTaskScoreCount = async () => {
+    const { data } = await props["getProjectTaskScoreCount"]();
+    initEcharts1(main1Ref, chartInstance, data);
+  };
+
+  const getHiddenStatisticsByCorp = async () => {
+    const { data } = await props["getHiddenStatisticsByCorp"]({ pageIndex: 1, pageSize: 999 });
+    setBlock4List(data);
+  };
+
   useEffect(() => {
     loadWeather();
+    getEventReportListUnfinished();
+    getHiddenStatisticsByCorp();
   }, []);
 
   useMount(() => {
-    initEcharts1(main1Ref, chartInstance, [
-      { name: "新益公司", hazardCount: 123, unrectifiedCount: 23 },
-      { name: "华泰化工", hazardCount: 85, unrectifiedCount: 15 },
-      { name: "宏达制造", hazardCount: 67, unrectifiedCount: 12 },
-      { name: "金鼎能源", hazardCount: 156, unrectifiedCount: 32 },
-      { name: "瑞丰新材料", hazardCount: 42, unrectifiedCount: 8 },
-      { name: "恒通物流", hazardCount: 78, unrectifiedCount: 18 },
-      { name: "天成建筑", hazardCount: 93, unrectifiedCount: 23 },
-      { name: "绿源环保", hazardCount: 56, unrectifiedCount: 11 },
-      { name: "安泰消防", hazardCount: 112, unrectifiedCount: 22 },
-      { name: "创新科技", hazardCount: 71, unrectifiedCount: 16 },
-    ]);
-
+    getProjectTaskScoreCount();
     return () => {
       if (chartInstance.current) {
         chartInstance.current.dispose();
@@ -83,10 +70,11 @@ function LeftScreen() {
       <div className="left-container_bg" style={{ backgroundImage: `url(${rightbg})` }}></div>
       <div className="block1">
         <Title title="天气预报情况" />
+        <Spin spinning={props.bi.indexInfoWeatherLoading}>
           <div className="main">
             <div className="list1">
               <img src={getWeatherIcon(weather?.text)} alt="" className="img1" />
-            <div>{weather?.text || "暂无数据"}</div>
+              <div>{weather?.text || "暂无"}</div>
             </div>
             <div className="list1">
               <img src={img3} alt="" className="img" />
@@ -104,6 +92,8 @@ function LeftScreen() {
             </div>
           </div>
           <div className="info">{weather?.alertTitle || "天气数据加载失败"}</div>
+        </Spin>
+        <Spin spinning={props.bi.indexInfoEmergencyRescueLoading}>
           <div className="table">
             <div className="head" style={{ backgroundImage: `url(${img5})` }}>
               <div>公司名称</div>
@@ -114,16 +104,17 @@ function LeftScreen() {
               <SeamlessScroll list={block1List} step={0.5}>
                 {block1List.map((item, index) => (
                   <div className="table-container" style={{ backgroundImage: `url(${img6})` }} key={index}>
-                  <div className="table-item">{item.companyName}</div>
-                  <div className={`table-item ${item.status === 0 ? "fc1" : ""} ${item.status === 1 ? "fc2" : ""} ${item.status === 2 ? "fc3" : ""} `}>
-                    {item.status === 0 ? "未处置" : item.status === 1 ? "已处置" : "处置中"}
+                    <div className="table-item">{item.executorCorpName}</div>
+                    <div className="table-item">
+                      {{ 1: "未执行", 2: "已执行", 3: "进行中", 4: "已完成" }[item.isRescueExecuted]}
                     </div>
-                  <div className="table-item">{item.preventiveMeasures}</div>
+                    <div className="table-item">{item.eventTitle}</div>
                   </div>
                 ))}
               </SeamlessScroll>
             </div>
           </div>
+        </Spin>
       </div>
       <div className="block2">
         <Title title="重大危险源运行情况" />
@@ -184,12 +175,15 @@ function LeftScreen() {
       </div>
       <div className="block3">
         <Title title="领域工作情况统计" />
+        <Spin spinning={props.bi.indexInfoDomainLoading}>
           <div className="main">
             <div ref={main1Ref} style={{ width: "100%", height: "180px" }} />
           </div>
+        </Spin>
       </div>
       <div className="block4">
         <Title title="当前各公司隐患整改情况" />
+        <Spin spinning={props.bi.indexInfoHiddenLoading}>
           <div className="main">
             <div className="table">
               <div className="head" style={{ backgroundImage: `url(${img5})` }}>
@@ -203,20 +197,21 @@ function LeftScreen() {
                 <SeamlessScroll list={block4List} step={0.5}>
                   {block4List.map((item, index) => (
                     <div className="table-container" style={{ backgroundImage: `url(${img6})` }} key={index}>
-                    <div className="table-item">{item.companyName}</div>
-                    <div className="table-item">{item.foundHazards}</div>
-                    <div className="table-item">{item.resolvedHazards}</div>
-                    <div className="table-item">{item.pendingResolution}</div>
-                    <div className="table-item">{item.pendingAcceptance}</div>
+                      <div className="table-item">{item.corpName}</div>
+                      <div className="table-item">{item.findHiddenCount}</div>
+                      <div className="table-item">{item.rectifyHiddenCount}</div>
+                      <div className="table-item">{item.waitRectifyHiddenCount}</div>
+                      <div className="table-item">{item.waitAcceptHiddenCount}</div>
                     </div>
                   ))}
                 </SeamlessScroll>
               </div>
             </div>
           </div>
+        </Spin>
       </div>
     </div>
   );
 }
 
-export default LeftScreen;
+export default Connect([NS_BI], true)(LeftScreen);

src/pages/Container/Map/components/Content/IndexInfo/LeftPanel/index.less

@@ -74,22 +74,11 @@
           .table-container {
             display: grid;
             grid-template-columns: 1fr 1fr 2fr;
+            gap: 5px;
             color: #ffffff;
             padding: 5px;
             font-size: 12px;
             margin: 5px auto;
-
-            .fc1 {
-              color: #0c90ff;
-            }
-
-            .fc2 {
-              color: #62b13f;
-            }
-
-            .fc3 {
-              color: #ffa105;
-            }
           }
         }
       }

src/pages/Container/Map/components/Content/IndexInfo/RightPanel/index.js

@@ -1,4 +1,6 @@
-import { useState } from "react";
+import { Connect } from "@cqsjjb/jjb-dva-runtime";
+import { Spin } from "antd";
+import { useEffect, useState } from "react";
 import SeamlessScroll from "zy-react-library/components/SeamlessScroll";
 import img8 from "~/assets/images/public/bigScreen/bg11.png";
 import img9 from "~/assets/images/public/bigScreen/bg12.png";
@@ -9,40 +11,49 @@ import img7 from "~/assets/images/public/bigScreen/ico9.png";
 import rightbg from "~/assets/images/public/bigScreen/leftbg.png";
 import img5 from "~/assets/images/public/bigScreen/tablebg1.png";
 import img6 from "~/assets/images/public/bigScreen/tablebg2.png";
+import { NS_BI } from "~/enumerate/namespace";
 import Title from "~/pages/Container/Map/components/Content/IndexInfo/Title";
 import "./index.less";
 
-function RightScreen() {
-  const [block1List, setBlock1List] = useState([
-    { id: 1, companyName: "方宇物业", pendingApprovalProjects: 2, pendingTrainingSubmissions: 3, pendingTrainees: 4 },
-    { id: 2, companyName: "华泰建设工程", pendingApprovalProjects: 5, pendingTrainingSubmissions: 8, pendingTrainees: 12 },
-    { id: 3, companyName: "宏达设备维护", pendingApprovalProjects: 3, pendingTrainingSubmissions: 6, pendingTrainees: 9 },
-    { id: 4, companyName: "金鼎安全服务", pendingApprovalProjects: 7, pendingTrainingSubmissions: 10, pendingTrainees: 15 },
-    { id: 5, companyName: "瑞丰技术服务", pendingApprovalProjects: 4, pendingTrainingSubmissions: 5, pendingTrainees: 7 },
-    { id: 6, companyName: "恒通物流运输", pendingApprovalProjects: 6, pendingTrainingSubmissions: 9, pendingTrainees: 11 },
-    { id: 7, companyName: "天成环保科技", pendingApprovalProjects: 8, pendingTrainingSubmissions: 12, pendingTrainees: 18 },
-    { id: 8, companyName: "绿源消防设施", pendingApprovalProjects: 2, pendingTrainingSubmissions: 4, pendingTrainees: 6 },
-    { id: 9, companyName: "安泰检测评估", pendingApprovalProjects: 5, pendingTrainingSubmissions: 7, pendingTrainees: 10 },
-    { id: 10, companyName: "创新信息技术", pendingApprovalProjects: 3, pendingTrainingSubmissions: 5, pendingTrainees: 8 },
-  ]);
-  const [block4List, setBlock4List] = useState([
-    { id: 1, companyName: "新益公司", detectionSystem: "火灾检测系统", alarmReason: "燃气泄露", dispositionStatus: "未处置" },
-    { id: 2, companyName: "华泰化工", detectionSystem: "温度监控系统", alarmReason: "超温报警", dispositionStatus: "已处置" },
-    { id: 3, companyName: "宏达制造", detectionSystem: "压力检测系统", alarmReason: "压力异常", dispositionStatus: "处置中" },
-    { id: 4, companyName: "金鼎能源", detectionSystem: "气体检测系统", alarmReason: "有毒气体超标", dispositionStatus: "未处置" },
-    { id: 5, companyName: "瑞丰新材料", detectionSystem: "液位监控系统", alarmReason: "液位过高", dispositionStatus: "已处置" },
-    { id: 6, companyName: "恒通物流", detectionSystem: "烟雾探测系统", alarmReason: "烟雾浓度超标", dispositionStatus: "处置中" },
-    { id: 7, companyName: "天成建筑", detectionSystem: "振动监测系统", alarmReason: "设备振动异常", dispositionStatus: "未处置" },
-    { id: 8, companyName: "绿源环保", detectionSystem: "水质检测系统", alarmReason: "PH值异常", dispositionStatus: "已处置" },
-    { id: 9, companyName: "安泰消防", detectionSystem: "火警联动系统", alarmReason: "火焰探测报警", dispositionStatus: "处置中" },
-    { id: 10, companyName: "创新科技", detectionSystem: "电气监控系统", alarmReason: "电流过载", dispositionStatus: "未处置" },
+function RightScreen(props) {
+  const [block1List, setBlock1List] = useState([]);
+  const [block2List, setBlock2List] = useState([
+    { name: "三人以上作业", doingCount: 0, appliedCount: 0, img: img2 },
+    { name: "危险作业", doingCount: 0, appliedCount: 0, img: img3 },
+    { name: "夜间作业", doingCount: 0, appliedCount: 0, img: img4 },
+    { name: "四新作业", doingCount: 0, appliedCount: 0, img: img7 },
   ]);
+  const [block4List, setBlock4List] = useState([]);
+
+  const getXgfStatisticsListCorpStatistics = async () => {
+    const { data } = await props["getXgfStatisticsListCorpStatistics"]();
+    setBlock1List(data);
+  };
+  const getAlarmRecordScreenIotDeviceAlarmPage = async () => {
+    const { data } = await props["getAlarmRecordScreenIotDeviceAlarmPage"]();
+    setBlock4List(data);
+  };
+  const getEightWorkInfoDangerWorkStatistics = async () => {
+    const { data } = await props["getEightWorkInfoDangerWorkStatistics"]();
+    setBlock2List((prevState) => {
+      prevState[1].doingCount = data.doingCount;
+      prevState[1].appliedCount = data.appliedCount;
+      return [...prevState];
+    });
+  };
+
+  useEffect(() => {
+    getXgfStatisticsListCorpStatistics();
+    getAlarmRecordScreenIotDeviceAlarmPage();
+    getEightWorkInfoDangerWorkStatistics();
+  }, []);
 
   return (
     <div className="right-container">
       <div className="right-container_bg" style={{ backgroundImage: `url(${rightbg})` }}></div>
       <div className="block1">
         <Title title="相关方单位情况统计" />
+        <Spin spinning={props.bi.indexInfoXgfManagerLoading}>
           <div className="main">
             <div className="table">
               <div className="head" style={{ backgroundImage: `url(${img5})` }}>
@@ -55,69 +66,46 @@ function RightScreen() {
                 <SeamlessScroll list={block1List} step={0.5}>
                   {block1List.map((item, index) => (
                     <div className="table-container" style={{ backgroundImage: `url(${img6})` }} key={index}>
-                    <div className="table-item">{item.companyName}</div>
-                    <div className="table-item">{item.pendingApprovalProjects}</div>
-                    <div className="table-item">{item.pendingTrainingSubmissions}</div>
-                    <div className="table-item">{item.pendingTrainees}</div>
+                      <div className="table-item">{item.corpName}</div>
+                      <div className="table-item">{`${item.qualificationsPassedCount}/${item.qualificationsApplyCount}`}</div>
+                      <div className="table-item">{`${item.executingProjectCount}/${item.applyProjectCount}`}</div>
+                      <div className="table-item">{`${item.trainingPassedCount}/${item.projectUserCount}`}</div>
                     </div>
                   ))}
                 </SeamlessScroll>
               </div>
             </div>
           </div>
+        </Spin>
       </div>
       <div className="block2">
         <Title title="重点作业管理统计" />
+        <Spin spinning={props.bi.indexInfoEightWorkLoading}>
           <div className="main">
-          <div className="item">
+            {
+              block2List.map((item, index) => (
+                <div className="item" key={index}>
                   <div className="img">
-              <img src={img2} alt="" />
+                    <img src={item.img} alt="" />
                   </div>
                   <div className="info">
-              <div className="title">三人以上作业</div>
+                    <div className="title">{item.name}</div>
                     <div>
-                <p> 当前作业数：13</p>
-                <p>申请数：14</p>
-              </div>
-            </div>
-          </div>
-          <div className="item">
-            <div className="img">
-              <img src={img3} alt="" />
-            </div>
-            <div className="info">
-              <div className="title">危险作业</div>
-              <div>
-                <p> 当前作业数：13</p>
-                <p>申请数：14</p>
-              </div>
-            </div>
-          </div>
-          <div className="item">
-            <div className="img">
-              <img src={img4} alt="" />
-            </div>
-            <div className="info">
-              <div className="title">夜间作业</div>
-              <div>
-                <p> 当前作业数：13</p>
-                <p>申请数：14</p>
-              </div>
-            </div>
-          </div>
-          <div className="item">
-            <div className="img">
-              <img src={img7} alt="" />
-            </div>
-            <div className="info">
-              <div className="title">四新作业</div>
-              <div>
-                <p> 当前作业数：13</p>
-                <p>申请数：14</p>
+                      <p>
+                        <span>当前作业数：</span>
+                        <span>{item.doingCount}</span>
+                      </p>
+                      <p>
+                        <span>申请数：</span>
+                        <span>{item.appliedCount}</span>
+                      </p>
                     </div>
                   </div>
                 </div>
+              ))
+            }
           </div>
+        </Spin>
       </div>
       <div className="block3">
         <Title title="当前口门、封闭区情况" />
@@ -154,6 +142,7 @@ function RightScreen() {
       </div>
       <div className="block4">
         <Title title="物联网设备报警情况" />
+        <Spin spinning={props.bi.indexInfoIotalarmLoading}>
           <div className="main">
             <div className="table">
               <div className="head" style={{ backgroundImage: `url(${img5})` }}>
@@ -166,19 +155,20 @@ function RightScreen() {
                 <SeamlessScroll list={block4List} step={0.5}>
                   {block4List.map((item, index) => (
                     <div className="table-container" style={{ backgroundImage: `url(${img6})` }} key={index}>
-                    <div className="table-item">{item.companyName}</div>
-                    <div className="table-item">{item.detectionSystem}</div>
-                    <div className="table-item">{item.alarmReason}</div>
-                    <div className="table-item">{item.dispositionStatus}</div>
+                      <div className="table-item">{item.alarmSourceName}</div>
+                      <div className="table-item">{item.corpName}</div>
+                      <div className="table-item">{item.alarmTypeName}</div>
+                      <div className="table-item">{{ 10: "报警中", 20: "未处置", 30: "已消警" }[item.status]}</div>
                     </div>
                   ))}
                 </SeamlessScroll>
               </div>
             </div>
           </div>
+        </Spin>
       </div>
     </div>
   );
 }
 
-export default RightScreen;
+export default Connect([NS_BI], true)(RightScreen);

src/pages/Container/Map/components/Content/IndexInfo/RightPanel/index.less

@@ -33,7 +33,7 @@
 
           .head {
             display: grid;
-            grid-template-columns: 1fr 1fr 1.5fr 1fr;
+            grid-template-columns: 1.5fr 1fr 1fr 1fr;
             color: #ffffff;
             padding: 5px;
 
@@ -48,25 +48,13 @@
 
             .table-container {
               display: grid;
-              grid-template-columns: 1fr 1fr 1.5fr 1fr;
+              grid-template-columns: 1.5fr 1fr 1fr 1fr;
               color: #ffffff;
               padding: 5px;
 
               margin: 5px auto;
               background: rgba(17, 51, 122, 0.5);
               text-align: center;
-
-              .fc1 {
-                color: #0c90ff;
-              }
-
-              .fc2 {
-                color: #62b13f;
-              }
-
-              .fc3 {
-                color: #ffa105;
-              }
             }
           }
         }
@@ -174,18 +162,6 @@
               margin: 5px auto;
               background: rgba(17, 51, 122, 0.5);
               text-align: center;
-
-              .fc1 {
-                color: #0c90ff;
-              }
-
-              .fc2 {
-                color: #62b13f;
-              }
-
-              .fc3 {
-                color: #ffa105;
-              }
             }
           }
         }

src/pages/Container/Map/components/Content/branchOffice/IndexLeft/index.js

@@ -91,7 +91,7 @@ function IndexLeft() {
               <div className="img">
                 <img src={getWeatherIcon(weatherData.text)} alt="" />
               </div>
-              <div className="text">{weatherData.text || "暂无数据"}</div>
+              <div className="text">{weatherData.text || "暂无"}</div>
             </div>
             <div className="items">
               <div className="item">

src/pages/Container/Map/components/Content/branchOffice/QiXiang/index.js

@@ -55,7 +55,7 @@ function QiXiang() {
               <div className="img">
                 <img src={getWeatherIcon(weatherData.text)} alt="" />
               </div>
-              <div className="text">{weatherData.text || "暂无数据"}</div>
+              <div className="text">{weatherData.text || "暂无"}</div>
             </div>
             <div className="items">
               <div className="item">

src/pages/Container/Map/js/context.js

@@ -54,7 +54,7 @@ export function mapReducer(state, action) {
     case MAP_ACTION.RESET_BOTTOM_UTILS:
       return {
         ...state,
-        bottomUtilsCurrentIndex: state.bottomUtilsCurrentIndex || -1,
+        bottomUtilsCurrentIndex: -1,
         bottomUtilsResetVersion: state.bottomUtilsResetVersion + 1,
       };
     case MAP_ACTION.RESET_RIGHT_UTILS:

src/pages/Container/White/BranchOffice/components/CenterPanel/index.js

@@ -184,7 +184,7 @@ function CenterPanel() {
                   <div className="img">
                     <img src={getWeatherIcon(weatherData.text)} alt="" />
                   </div>
-                  <div className="text">{weatherData.text || "暂无数据"}</div>
+                  <div className="text">{weatherData.text || "暂无"}</div>
                 </div>
                 <div className="items">
                   <div className="item">

src/utils/weather.js

@@ -25,8 +25,6 @@ const WEATHER_URL = "https://api.map.baidu.com/weather/v1/?district_id=130300&da
  * @returns {Promise<object>} 百度天气接口 result 数据。
  */
 export async function getWeather(options = {}) {
-  return {}; // TODO: Remove this line
-
   const response = await fetch(WEATHER_URL, { signal: options.signal });
   if (!response.ok) {
     message.error("天气接口请求失败，请检查网络或稍后再试");