refactor(map): branchOffice IndexLeft RiskHazardPanel 对接

src/api/biStatistics/index.js

@@ -132,3 +132,7 @@ export const getPrimeportClosedAreaPersonApplyScreenList = declareRequest(
   "getPrimeportClosedAreaPersonApplyScreenListLoading",
   "Post > @/primeport/closedAreaPersonApply/screenList",
 );
+export const getRiskPointHidden = declareRequest(
+  "getRiskPointHiddenLoading",
+  "Post > @/risk/listManager/riskPointHidden",
+);

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

@@ -1,27 +1,37 @@
+import { Connect } from "@cqsjjb/jjb-dva-runtime";
+import { useContext, useEffect, useState } from "react";
+import { NS_BI_STATISTICS } from "~/enumerate/namespace";
 import Panel from "~/pages/Container/Map/components/Content/branchOffice/Panel";
+import { Context } from "~/pages/Container/Map/js/context";
 import "./index.less";
 
-const records = [
-  { levelName: "重大风险", riskCount: 21, notRiskCount: 3 },
-  { levelName: "较大风险", riskCount: 21, notRiskCount: 3 },
-  { levelName: "一般风险", riskCount: 21, notRiskCount: 3 },
-  { levelName: "低风险", riskCount: 21, notRiskCount: 3 },
-];
-
 const levelColor = {
-  重大风险: "#ff0000",
+  levelA: "#ff0000",
-  较大风险: "#ff3c00",
+  levelB: "#ff3c00",
-  一般风险: "#e5e72f",
+  levelC: "#e5e72f",
-  低风险: "#0e7dfa",
+  levelD: "#0e7dfa",
 };
 
 /** 负责展示不同风险等级的风险点与隐患覆盖情况。 */
-function RiskHazardPanel() {
+function RiskHazardPanel(props) {
+  const { portArea, currentBranchOffice } = useContext(Context);
+  const [data, setData] = useState([]);
+
+  useEffect(() => {
+    const loadData = async () => {
+      const { data } = await props.getRiskPointHidden({ portArea, corpinfoId: currentBranchOffice });
+
+      setData(data);
+    };
+
+    loadData();
+  }, []);
+
   return (
     <Panel title="风险点隐患" className="branch-office-index-left__risk-hazard">
       <div className="branch-office-risk-hazard__content">
-        {records.map((item) => {
+        {data.map((item) => {
-          const color = levelColor[item.levelName];
+          const color = levelColor[item.level];
           return (
             <div
               className="branch-office-risk-hazard__item"
@@ -40,13 +50,16 @@ function RiskHazardPanel() {
               <div className="branch-office-risk-hazard__info">
                 <div>
                   风险点数：
-                  {item.riskCount}
+                  {item.riskPointCount}
                 </div>
                 <div className="branch-office-risk-hazard__details">
-                  <div>检查覆盖率：100%</div>
+                  <div>
+                    检查覆盖率：
+                    {item.checkCoverRate}
+                  </div>
                   <div>
                     未覆盖风险点数：
-                    {item.notRiskCount}
+                    {item.uncoveredRiskPointCount}
                   </div>
                 </div>
               </div>
@@ -58,4 +71,4 @@ function RiskHazardPanel() {
   );
 }
 
-export default RiskHazardPanel;
+export default Connect([NS_BI_STATISTICS], true)(RiskHazardPanel);

src/pages/Container/Map/components/Header/index.js

@@ -16,11 +16,12 @@ const headerAnimation = {
 };
 
 function Header() {
-  const { currentPort, currentBranchOffice, mapMethods, portArea, headerTitle, actions } = useContext(Context);
+  const { currentPort, currentBranchOffice, mapMethods, portArea, headerTitle, actions, closePopup } = useContext(Context);
 
   const isPortTitle = headerTitle === "秦港股份安全监管平台";
 
   const onBack = () => {
+    closePopup();
     sessionStorage.removeItem("mapCurrentBranchOfficeId");
     if (!currentPort) {
       window.close();

src/pages/Container/Map/components/popup/components/BranchOffice.js

@@ -42,7 +42,7 @@ const BranchOffice = ({ info, close, enter }) => {
             <div className="data-label textColor">地址：</div>
             <div className="data-value">
               <span className="label-num textColor line-3">
-                {info?.address}
+                {info?.addressBusiness}
               </span>
             </div>
           </div>

src/pages/Container/Map/index.js

@@ -25,7 +25,7 @@ import "./index.less";
 
 function Map(props) {
   const query = useGetUrlQuery();
-  const { viewer, mapMethods, initMap, externalEntryPort } = useInitMap({
+  const { viewer, mapMethods, initMap, externalEntryPort, closePopup } = useInitMap({
     request: {
       getCorpInfoListAll: props.getCorpInfoListAll,
     },
@@ -108,8 +108,8 @@ function Map(props) {
   }, []);
 
   const providerValues = useMemo(
-    () => ({ viewer, mapMethods, ...state, actions }),
+    () => ({ viewer, mapMethods, closePopup, ...state, actions }),
-    [viewer, mapMethods, state, actions],
+    [viewer, mapMethods, closePopup, state, actions],
   );
 
   return (

src/pages/Container/Map/js/initMap.js

@@ -14,6 +14,8 @@ export default function useInitMap(options) {
   mapMethods.current = mapMethodsValue;
   // 点位点击处理集合：替代原 PointClickEvent class 实例，负责弹窗和层级进入。
   const pointClickEvent = usePointClickEvent(viewer, mapMethodsValue);
+  // Cesium 点击事件只在初始化时注册，必须始终使用首次创建的处理器，才能关闭其维护的 Popup 实例。
+  const pointClickEventRef = useRef(pointClickEvent);
 
   // 获取当前 Cesium 实例，减少内部方法对 ref 结构的重复感知。
   const getViewer = () => viewer.current;
@@ -56,10 +58,10 @@ export default function useInitMap(options) {
     screenSpaceEventHandler.setInputAction((movement) => {
       const pick = getViewer().scene.pick(movement.position);
       if (Cesium.defined(pick) && pick.id?.id) {
-        pointClickEvent.pointClickEvent(pick.id);
+        pointClickEventRef.current.pointClickEvent(pick.id);
       }
       else {
-        pointClickEvent.closePopup();
+        pointClickEventRef.current.closePopup();
       }
     }, Cesium.ScreenSpaceEventType.LEFT_CLICK);
   };
@@ -143,7 +145,7 @@ export default function useInitMap(options) {
     if (!id || !name || !hasValidPosition)
       return false;
 
-    pointClickEvent.pointClickEvent({
+    pointClickEventRef.current.pointClickEvent({
       monitorItems: {
         data: {
           ...data,
@@ -164,5 +166,6 @@ export default function useInitMap(options) {
     mapMethods,
     initMap,
     externalEntryPort,
+    closePopup: () => pointClickEventRef.current.closePopup(),
   };
 }