refactor(map): 增加分公司人员进入直接进入对应公司功能

src/api/biMark/index.js

@@ -52,3 +52,7 @@ export const getPrimeportVideoScreenList = declareRequest(
   "biFullLoading",
   "Post > @/primeport/video/screenList",
 );
+export const getPeopleTrajectory = declareRequest(
+  "biFullLoading",
+  "Post > @/personnelPosition/bi/personTrace",
+);

src/api/biPeople/index.js

@@ -1,7 +0,0 @@
-import { declareRequest } from "@cqsjjb/jjb-dva-runtime";
-
-// 人员轨迹按终端或人员编号、时间范围查询，接口参数由轨迹筛选面板传入。
-export const getPeopleTrajectory = declareRequest(
-  "getPeopleTrajectoryLoading",
-  "Post > @/personnelPosition/bi/personTrace",
-);

src/api/biStatistics/index.js

@@ -1,5 +1,9 @@
 import { declareRequest } from "@cqsjjb/jjb-dva-runtime";
 
+export const getCorpInfo = declareRequest(
+  "biFullLoading",
+  "Get > /basicInfo/corpInfo/info/self",
+);
 export const getWeather = declareRequest(
   "getWeatherLoading",
   "Get > /bi/weather/info",
@@ -140,3 +144,7 @@ export const getDepartmentDuty = declareRequest(
   "getDepartmentDutyLoading",
   "Post > @/risk/listManager/departmentDuty",
 );
+export const getAlarmType = declareRequest(
+  "getAlarmTypeLoading",
+  "Post > @/personnelPosition/alarmRecord/bi/alarmType",
+);

src/enumerate/namespace/index.js

@@ -9,4 +9,3 @@ export const NS_GLOBAL = defineNamespace("global");
 export const NS_BI_STATISTICS = defineNamespace("biStatistics");
 export const NS_BI_MARK = defineNamespace("biMark");
 export const NS_BI_MARK_INFO = defineNamespace("biMarkInfo");
-export const NS_BI_PEOPLE = defineNamespace("biPeople");

src/pages/Container/Map/components/Content/branchOffice/RenYuan/AlarmTypeChartPanel/index.js

@@ -1,23 +1,17 @@
+import { Connect } from "@cqsjjb/jjb-dva-runtime";
 import { useMount } from "ahooks";
+import { Spin } from "antd";
 import * as echarts from "echarts";
-import { useRef } from "react";
+import { useContext, useRef } 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 = [
-  { name: "SOS紧急告警", value: "120" },
-  { name: "静止/滞留告警", value: "10" },
-  { name: "电子围栏越界", value: "10" },
-  { name: "非授权区域停留", value: "20" },
-  { name: "设备及信号类告警", value: "30" },
-  { name: "聚集告警", value: "40" },
-  { name: "单独作业告警", value: "50" },
-  { name: "超员/缺员告警", value: "60" },
-  { name: "已处置报警数/报警数", value: "10" },
-];
-
 /** 负责展示报警类型占比图，并管理图表实例生命周期。 */
-function AlarmTypeChartPanel() {
+function AlarmTypeChartPanel(props) {
+  const { portArea, currentBranchOffice } = useContext(Context);
+
   const chartInstance = useRef(null);
   const chartRef = useRef(null);
 
@@ -45,7 +39,7 @@ function AlarmTypeChartPanel() {
             color: "#fff",
           },
         },
-        data,
+        data: data.map(item => ({ name: item.alarmName, value: item.alarmCount })),
       }],
     };
 
@@ -53,7 +47,12 @@ function AlarmTypeChartPanel() {
   };
 
   useMount(() => {
-    initEcharts(chartRef, chartInstance, records);
+    const loadData = async () => {
+      const { data } = await props.getAlarmType({ portArea, corpinfoId: currentBranchOffice });
+      initEcharts(chartRef, chartInstance, data);
+    };
+
+    loadData();
 
     return () => {
       if (chartInstance.current) {
@@ -65,11 +64,13 @@ function AlarmTypeChartPanel() {
 
   return (
     <Panel title="报警类型">
+      <Spin spinning={props.biStatistics.getAlarmTypeLoading}>
         <div className="branch-office-alarm-type-chart__content">
           <div ref={chartRef} className="branch-office-alarm-type-chart__chart" />
         </div>
+      </Spin>
     </Panel>
   );
 }
 
-export default AlarmTypeChartPanel;
+export default Connect([NS_BI_STATISTICS], true)(AlarmTypeChartPanel);

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

@@ -15,21 +15,25 @@ const headerAnimation = {
   exit: { y: -100, opacity: 0, transition: { duration: 0.3, ease: "easeIn" } },
 };
 
-function Header() {
+function Header(props) {
   const { currentPort, currentBranchOffice, mapMethods, portArea, headerTitle, actions, closePopup } = useContext(Context);
 
   const isPortTitle = headerTitle === "秦港股份安全监管平台";
 
-  const onBack = () => {
-    closePopup();
-    sessionStorage.removeItem("mapCurrentBranchOfficeId");
-    if (!currentPort) {
+  const closeWindow = () => {
     window.close();
     setTimeout(() => {
       if (!window.closed && !window.opener) {
         window.location.href = "https://gbs-gateway.qhdsafety.com/";
       }
     }, 500);
+  };
+
+  const onBack = () => {
+    closePopup();
+    sessionStorage.removeItem("mapCurrentBranchOfficeId");
+    if (!currentPort) {
+      closeWindow();
     }
     else if (currentPort !== "00003" && currentBranchOffice) {
       actions.selectPort({ id: "", name: "秦港股份" });
@@ -42,6 +46,10 @@ function Header() {
       mapMethods.current.addPortPoint();
     }
     else if (currentBranchOffice) {
+      if (props.isBranchCompanyUser) {
+        closeWindow();
+        return;
+      }
       actions.selectBranchOffice({ id: "", corpName: "秦港股份" });
       mapMethods.current.removeBranchOfficePoint();
       mapMethods.current.removeMarkPoint();

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

@@ -2,7 +2,7 @@ import { Connect } from "@cqsjjb/jjb-dva-runtime";
 import { Button, DatePicker, Form, message, Select, Spin } from "antd";
 import dayjs from "dayjs";
 import { useContext, useEffect, useMemo, useState } from "react";
-import { NS_BI_PEOPLE } from "~/enumerate/namespace";
+import { NS_BI_MARK } from "~/enumerate/namespace";
 import { Context } from "~/pages/Container/Map/js/context";
 import "./index.less";
 
@@ -114,4 +114,4 @@ function PeopleTrajectorySelect(props) {
   );
 }
 
-export default Connect([NS_BI_PEOPLE], true)(PeopleTrajectorySelect);
+export default Connect([NS_BI_MARK], true)(PeopleTrajectorySelect);

src/pages/Container/Map/index.js

@@ -2,9 +2,9 @@ import { Connect } from "@cqsjjb/jjb-dva-runtime";
 import { useFullscreen, useMount } from "ahooks";
 import { message, Spin } from "antd";
 import autoFit from "autofit.js";
-import { useEffect, useMemo, useReducer, useRef, useState } from "react";
+import { useMemo, useReducer, useRef, useState } from "react";
 import useGetUrlQuery from "zy-react-library/hooks/useGetUrlQuery";
-import { NS_BI_MARK, NS_BI_MARK_INFO } from "~/enumerate/namespace";
+import { NS_BI_MARK, NS_BI_MARK_INFO, NS_BI_STATISTICS } from "~/enumerate/namespace";
 import BottomUtils from "./components/BottomUtils";
 import CenterUtils from "./components/CenterUtils";
 import Content from "./components/Content";
@@ -25,13 +25,14 @@ import "./index.less";
 
 function Map(props) {
   const query = useGetUrlQuery();
-  const { viewer, mapMethods, initMap, externalEntryPort, closePopup } = useInitMap({
+  const { viewer, mapMethods, initMap, closePopup } = useInitMap({
     request: {
       getCorpInfoListAll: props.getCorpInfoListAll,
     },
   });
 
-  const [isRenderContent, setIsRenderContent] = useState(false);
+  const [isBranchCompanyUser, setIsBranchCompanyUser] = useState(false); // 是否分公司用户
+  const [isRenderContent, setIsRenderContent] = useState(false); // 是否渲染内容
   const fullscreenRef = useRef(null); // 全屏容器的ref
   const [isFullscreen, { toggleFullscreen }] = useFullscreen(fullscreenRef);
   const [state, dispatch] = useReducer(mapReducer, initialMapState);
@@ -57,18 +58,6 @@ function Map(props) {
 
     initMap();
 
-    if (query.markType === "港口") {
-      const entered = externalEntryPort(query);
-      if (!entered)
-        message.warning("港口入口参数不完整，无法定位到对应港口");
-    }
-    else {
-      setTimeout(() => {
-        mapMethods.current.flyTo();
-        mapMethods.current.addPortPoint();
-      }, 500);
-    }
-
     // Cesium 工具层暂时通过 mitt 通知；所有事件在根组件统一转成 reducer action。
     const handlePortClick = data => actions.selectPort(data);
     const handleBranchOfficeClick = data => actions.selectBranchOffice(data);
@@ -86,6 +75,42 @@ function Map(props) {
     mitt.on(changeCoverMaskVisibleMittKey, handleCoverMaskVisible);
     mitt.on(resetBottomUtilsMittKey, handleResetBottomUtils);
 
+    query.accessTicket && window.sessionStorage.setItem("accessTicket", query.accessTicket);
+    query.clientId && window.sessionStorage.setItem("clientId", query.clientId);
+    query.orgId && window.sessionStorage.setItem("orgId", query.orgId);
+    query.token && window.sessionStorage.setItem("token", query.token);
+
+    setTimeout(() => {
+      if (window.sessionStorage.getItem("token")) {
+        props.getCorpInfo().then(({ data }) => {
+          if ([0, 1, 6].includes(data.type)) {
+            const id = data.id;
+            const name = data.corpName;
+            const longitude = data.longitude;
+            const latitude = data.latitude;
+
+            if (!id || !name || !longitude || !latitude)
+              return message.warning("参数不完整，无法定位到对应分公司");
+
+            handlePortClick({ id: "00003" });
+            handleBranchOfficeClick(data);
+            mapMethods.current.addBranchOfficePoint(undefined, data);
+            mapMethods.current.flyTo({ longitude, latitude, height: 2000 });
+            sessionStorage.setItem("mapCurrentBranchOfficeId", id);
+            setIsBranchCompanyUser(true);
+          }
+          else {
+            setTimeout(() => {
+              mapMethods.current.flyTo();
+              mapMethods.current.addPortPoint();
+            }, 500);
+          }
+        }).finally(() => {
+          setIsRenderContent(true);
+        });
+      }
+    });
+
     return () => {
       autoFit.off();
       mitt.off(clickPortPointMittKey, handlePortClick);
@@ -96,17 +121,6 @@ function Map(props) {
     };
   });
 
-  useEffect(() => {
-    query.accessTicket && window.sessionStorage.setItem("accessTicket", query.accessTicket);
-    query.clientId && window.sessionStorage.setItem("clientId", query.clientId);
-    query.orgId && window.sessionStorage.setItem("orgId", query.orgId);
-    query.token && window.sessionStorage.setItem("token", query.token);
-    setTimeout(() => {
-      if (window.sessionStorage.getItem("token"))
-        setIsRenderContent(true);
-    });
-  }, []);
-
   const providerValues = useMemo(
     () => ({ viewer, mapMethods, closePopup, ...state, actions }),
     [viewer, mapMethods, closePopup, state, actions],
@@ -120,7 +134,7 @@ function Map(props) {
           <div id="contentContainer">
             {isRenderContent && (
               <>
-                <Header />
+                <Header isBranchCompanyUser={isBranchCompanyUser} />
                 <CenterUtils />
                 <RightUtils history={props.history} isFullscreen={isFullscreen} toggleFullscreen={toggleFullscreen} />
                 <BottomUtils />
@@ -140,4 +154,4 @@ function Map(props) {
   );
 }
 
-export default Connect([NS_BI_MARK, NS_BI_MARK_INFO], true)(Map);
+export default Connect([NS_BI_MARK, NS_BI_MARK_INFO, NS_BI_STATISTICS], true)(Map);

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

@@ -8,7 +8,7 @@ export const initialMapState = {
   currentPort: "",
   currentBranchOffice: "",
   portArea: "",
-  bottomUtilsCurrentIndex: "",
+  bottomUtilsCurrentIndex: -1,
   pureMap: false,
   headerTitle: "秦港股份安全监管平台",
   bottomUtilsResetVersion: 0,

src/pages/Container/Map/js/useInitMap.js

@@ -1,5 +1,6 @@
 import { useRef } from "react";
 import { createObliquePhotography } from "~/pages/Container/Map/js/mapUtils";
+
 import useMapMethods from "./useMapMethods";
 import usePointClickEvent from "./usePointClickEvent";
 
@@ -128,44 +129,10 @@ export default function useInitMap(options) {
     return { mapMethods: mapMethods.current, viewer: getViewer() };
   };
 
-  // 外部入口进入港口：只有港口标识、名称和有效坐标齐全时才进入，避免 Cesium 接收到无效坐标。
-  const externalEntryPort = (data) => {
-    const id = data.id || data.portId;
-    const name = data.name || data.portName;
-    const longitude = data.position?.x ?? data.longitude ?? data.lng ?? data.x;
-    const latitude = data.position?.y ?? data.latitude ?? data.lat ?? data.y;
-    // 空字符串会被 Number 转成 0，需要先排除空值，再判断是否为有效数字。
-    const hasCoordinate = value => value !== "" && value !== null && value !== undefined;
-    const hasValidPosition
-      = hasCoordinate(longitude)
-        && hasCoordinate(latitude)
-        && Number.isFinite(Number(longitude))
-        && Number.isFinite(Number(latitude));
-
-    if (!id || !name || !hasValidPosition)
-      return false;
-
-    pointClickEventRef.current.pointClickEvent({
-      monitorItems: {
-        data: {
-          ...data,
-          id,
-          name,
-          corpinfoId: data.corpinfoId,
-          markType: "港口",
-          isExternalEntry: "1",
-          position: { x: Number(longitude), y: Number(latitude) },
-        },
-      },
-    });
-    return true;
-  };
-
   return {
     viewer,
     mapMethods,
     initMap,
-    externalEntryPort,
     closePopup: () => pointClickEventRef.current.closePopup(),
   };
 }

src/pages/Container/Map/js/usePointClickEvent.js

@@ -41,13 +41,13 @@ export default function usePointClickEvent(viewerRef, mapMethods) {
       mapMethods.flyTo({ longitude: data.position.x, latitude: data.position.y, height: 2000 });
       mapMethods.addBranchOfficePoint(undefined, {
         corpName: data.name,
-        corpinfoId: data.corpinfoId,
+        id: data.id,
         longitude: data.position.x,
         latitude: data.position.y,
       });
       mitt.emit(clickPortPointMittKey, data);
       mitt.emit(clickBranchOfficePointMittKey, data);
-      sessionStorage.setItem("mapCurrentBranchOfficeId", data.corpinfoId);
+      sessionStorage.setItem("mapCurrentBranchOfficeId", data.id);
     }
     // }, 2000);
     mitt.emit(resetBottomUtilsMittKey);
@@ -79,7 +79,7 @@ export default function usePointClickEvent(viewerRef, mapMethods) {
     mapMethods.removeWall();
     mapMethods.flyTo({ longitude: data.longitude, latitude: data.latitude, height: 2000 });
     mitt.emit(clickBranchOfficePointMittKey, data);
-    sessionStorage.setItem("mapCurrentBranchOfficeId", data.corpinfoId);
+    sessionStorage.setItem("mapCurrentBranchOfficeId", data.id);
     mitt.emit(resetBottomUtilsMittKey);
   };