diff --git a/src/api/biStatistics/index.js b/src/api/biStatistics/index.js index 84d930f..cd244d7 100644 --- a/src/api/biStatistics/index.js +++ b/src/api/biStatistics/index.js @@ -204,3 +204,7 @@ export const getScreenMkmjRecord = declareRequest( "getScreenMkmjRecordLoading", "Post > @/primeport/dashboard/mkmjRecord", ); +export const getScreenRelatedCorpStatistics = declareRequest( + "getScreenRelatedCorpStatisticsLoading", + "Post > @/xgfManager/project/relatedCorpStatistics", +); diff --git a/src/pages/Container/Map/components/BottomUtils/portUtilsList.js b/src/pages/Container/Map/components/BottomUtils/portUtilsList.js index 7963dd6..c64161d 100644 --- a/src/pages/Container/Map/components/BottomUtils/portUtilsList.js +++ b/src/pages/Container/Map/components/BottomUtils/portUtilsList.js @@ -12,8 +12,8 @@ import bottomImg10 from "~/assets/images/map_bi/bottom_utils/first/img10.png"; import bottomImg10On from "~/assets/images/map_bi/bottom_utils/first/img10_on.png"; import bottomImg12 from "~/assets/images/map_bi/bottom_utils/first/img12.png"; import bottomImg12On from "~/assets/images/map_bi/bottom_utils/first/img12_on.png"; -import bottomImg13 from "~/assets/images/map_bi/bottom_utils/first/img13.png"; -import bottomImg13On from "~/assets/images/map_bi/bottom_utils/first/img13_on.png"; +// import bottomImg13 from "~/assets/images/map_bi/bottom_utils/first/img13.png"; +// import bottomImg13On from "~/assets/images/map_bi/bottom_utils/first/img13_on.png"; // 二级菜单图片资源 import ico1 from "~/assets/images/map_bi/bottom_utils/second/ico1.png"; import ico1On from "~/assets/images/map_bi/bottom_utils/second/ico1_on.png"; @@ -414,11 +414,11 @@ export const portUtilsList = [ }, ], }, - { - img: bottomImg13, - checkImg: bottomImg13On, - label: "封闭区域", - type: "closedArea", - list: [], - }, + // { + // img: bottomImg13, + // checkImg: bottomImg13On, + // label: "封闭区域", + // type: "closedArea", + // list: [], + // }, ]; diff --git a/src/pages/Container/Map/components/Content/branchOffice/IndexLeft/RelatedPartyStatsPanel/index.js b/src/pages/Container/Map/components/Content/branchOffice/IndexLeft/RelatedPartyStatsPanel/index.js index 047926c..f4926cb 100644 --- a/src/pages/Container/Map/components/Content/branchOffice/IndexLeft/RelatedPartyStatsPanel/index.js +++ b/src/pages/Container/Map/components/Content/branchOffice/IndexLeft/RelatedPartyStatsPanel/index.js @@ -1,82 +1,28 @@ +import { Connect } from "@cqsjjb/jjb-dva-runtime"; +import { Spin } from "antd"; +import { useContext, useEffect, useState } from "react"; import SeamlessScroll from "zy-react-library/components/SeamlessScroll"; +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 = [ - { - relatedPartyCategory: "承包商", - firstLevelUnits: 15, - firstLevelPersonnel: 120, - secondLevelUnits: 25, - secondLevelPersonnel: 320, - }, - { - relatedPartyCategory: "供应商", - firstLevelUnits: 8, - firstLevelPersonnel: 85, - secondLevelUnits: 18, - secondLevelPersonnel: 210, - }, - { - relatedPartyCategory: "分包商", - firstLevelUnits: 12, - firstLevelPersonnel: 95, - secondLevelUnits: 30, - secondLevelPersonnel: 450, - }, - { - relatedPartyCategory: "监理单位", - firstLevelUnits: 5, - firstLevelPersonnel: 40, - secondLevelUnits: 10, - secondLevelPersonnel: 80, - }, - { - relatedPartyCategory: "设计单位", - firstLevelUnits: 6, - firstLevelPersonnel: 55, - secondLevelUnits: 12, - secondLevelPersonnel: 120, - }, - { - relatedPartyCategory: "施工单位", - firstLevelUnits: 18, - firstLevelPersonnel: 200, - secondLevelUnits: 40, - secondLevelPersonnel: 680, - }, - { - relatedPartyCategory: "检测机构", - firstLevelUnits: 3, - firstLevelPersonnel: 25, - secondLevelUnits: 8, - secondLevelPersonnel: 65, - }, - { - relatedPartyCategory: "咨询公司", - firstLevelUnits: 7, - firstLevelPersonnel: 60, - secondLevelUnits: 15, - secondLevelPersonnel: 180, - }, - { - relatedPartyCategory: "运维单位", - firstLevelUnits: 9, - firstLevelPersonnel: 75, - secondLevelUnits: 22, - secondLevelPersonnel: 320, - }, - { - relatedPartyCategory: "其他单位", - firstLevelUnits: 4, - firstLevelPersonnel: 35, - secondLevelUnits: 14, - secondLevelPersonnel: 150, - }, -]; - /** 负责展示相关方单位及其人员统计。 */ -function RelatedPartyStatsPanel() { +function RelatedPartyStatsPanel(props) { + const { portArea, currentBranchOffice } = useContext(Context); + const [data, setData] = useState([]); + + useEffect(() => { + const loadData = async () => { + const { data } = await props.getScreenRelatedCorpStatistics({ + portArea, + corpinfoId: currentBranchOffice, + }); + setData(data || []); + }; + loadData(); + }, []); + return ( 二级人数
- - {records.map((item, index) => ( -
-
{item.relatedPartyCategory}
-
{item.firstLevelUnits}
-
{item.firstLevelPersonnel}
-
{item.secondLevelUnits}
-
{item.secondLevelPersonnel}
-
- ))} - + + + {data.map((item, index) => ( +
+
{item.corpTypeName}
+
{item.oneLevelCorpCount}
+
{item.oneLevelUserCount}
+
{item.twoLevelCorpCount}
+
{item.twoLevelUserCount}
+
+ ))} + +
@@ -113,4 +61,4 @@ function RelatedPartyStatsPanel() { ); } -export default RelatedPartyStatsPanel; +export default Connect([NS_BI_STATISTICS], true)(RelatedPartyStatsPanel); diff --git a/src/pages/Container/Map/components/Content/branchOffice/IndexRight/GateAndClosedAreaPanel/index.js b/src/pages/Container/Map/components/Content/branchOffice/IndexRight/GateAndClosedAreaPanel/index.js index b2ed7a0..8f94104 100644 --- a/src/pages/Container/Map/components/Content/branchOffice/IndexRight/GateAndClosedAreaPanel/index.js +++ b/src/pages/Container/Map/components/Content/branchOffice/IndexRight/GateAndClosedAreaPanel/index.js @@ -1,74 +1,87 @@ +import { Connect } from "@cqsjjb/jjb-dva-runtime"; +import { Spin } from "antd"; +import { useContext, useEffect, useState } from "react"; import gateBackground from "~/assets/images/map_bi/content/bg4.png"; import areaBackground from "~/assets/images/map_bi/content/bg5.png"; +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 = [ { - title: "口门进出统计", - label1: "人数", - label2: "车数", - count1: 123, - count2: 123, + title: "一级口门进出统计", + personKey: "oneLevelInoutPersonCount", + carKey: "oneLevelInoutCarCount", background: gateBackground, }, { - title: "进入申请待审批", - label1: "人数", - label2: "车数", - count1: 123, - count2: 123, + title: "一级口门进出审批", + personKey: "oneLevelApprovalPersonCount", + carKey: "oneLevelApprovalCarCount", background: gateBackground, }, { - title: "封闭区域人员情况", - label1: "区域数", - label2: "人数", - count1: 123, - count2: 123, + title: "封闭区域进出统计", + personKey: "closedAreaInoutPersonCount", + carKey: "closedAreaInoutCarCount", background: areaBackground, }, { - title: "封闭区域作业情况", - label1: "区域数", - label2: "作业数", - count1: 123, - count2: 123, + title: "封闭区域进出审批", + personKey: "closedAreaApprovalPersonCount", + carKey: "closedAreaApprovalCarCount", background: areaBackground, }, ]; -/** 负责展示口门和封闭区域的基础统计。 */ -function GateAndClosedAreaPanel() { +/** 查询并展示当前分公司的口门与封闭区域人员、车辆统计。 */ +function GateAndClosedAreaPanel(props) { + const { portArea, currentBranchOffice } = useContext(Context); + const [data, setData] = useState({}); + + useEffect(() => { + const loadData = async () => { + // 分公司维度必须同时传入所属港区和企业 ID，避免获取到总览数据。 + const { data } = await props.getScreenRecordStat({ + portArea, + corpinfoId: currentBranchOffice, + }); + setData(data || {}); + }; + + loadData(); + }, []); + return ( -
- {records.map((item, index) => ( -
-
- {item.title} -
-
-
- {item.label1} - ： - {item.count1} + +
+ {records.map(item => ( +
+
+ {item.title}
-
- {item.label2} - ： - {item.count2} +
+
+ 人数： + {data[item.personKey] ?? 0} +
+
+ 车数： + {data[item.carKey] ?? 0} +
-
- ))} -
+ ))} +
+ ); } -export default GateAndClosedAreaPanel; +export default Connect([NS_BI_STATISTICS], true)(GateAndClosedAreaPanel); diff --git a/src/pages/Container/Map/components/Content/branchOffice/MenJin/EntryExitTrendPanel/index.js b/src/pages/Container/Map/components/Content/branchOffice/MenJin/EntryExitTrendPanel/index.js index 574be9f..6d37423 100644 --- a/src/pages/Container/Map/components/Content/branchOffice/MenJin/EntryExitTrendPanel/index.js +++ b/src/pages/Container/Map/components/Content/branchOffice/MenJin/EntryExitTrendPanel/index.js @@ -1,35 +1,34 @@ +import { Connect } from "@cqsjjb/jjb-dva-runtime"; import { useMount } from "ahooks"; +import { Spin } from "antd"; import * as echarts from "echarts"; -import { useRef, useState } from "react"; +import { useContext, useRef, 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 tabs = ["人员", "车辆"]; -const records = [ - { NAME: "零号门", IN: "0", OUT: "0" }, - { NAME: "一号门", IN: "15", OUT: "12" }, - { NAME: "二号门", IN: "8", OUT: "10" }, - { NAME: "三号门", IN: "22", OUT: "18" }, - { NAME: "四号门", IN: "5", OUT: "7" }, - { NAME: "五号门", IN: "30", OUT: "25" }, - { NAME: "六号门", IN: "12", OUT: "14" }, - { NAME: "七号门", IN: "18", OUT: "16" }, - { NAME: "八号门", IN: "9", OUT: "11" }, - { NAME: "九号门", IN: "25", OUT: "20" }, -]; /** 负责展示封闭区域进出趋势并管理图表实例生命周期。 */ -function EntryExitTrendPanel() { +function EntryExitTrendPanel(props) { + const { portArea, currentBranchOffice } = useContext(Context); + const [activeIndex, setActiveIndex] = useState(0); const chartInstance = useRef(null); const chartRef = useRef(null); + // 切换数据类型前释放旧实例，避免同一容器重复初始化 ECharts。 + const disposeChart = () => { + chartInstance.current?.dispose(); + chartInstance.current = null; + }; + const initEcharts = (data) => { chartInstance.current = echarts.init(chartRef.current); - - const inData = data.map(item => Number.parseInt(item.IN)); - const outData = data.map(item => Number.parseInt(item.OUT)); - const names = data.map(item => item.NAME); + const inData = data.map(item => Number.parseInt(item.inCount)); + const outData = data.map(item => Number.parseInt(item.outCount)); + const names = data.map(item => item.mkmjName); const option = { tooltip: { @@ -162,18 +161,33 @@ function EntryExitTrendPanel() { chartInstance.current.setOption(option); }; + const loadData = async (mkmjType) => { + const { data } = await props.getScreenMkmjRecord({ + portArea, + corpinfoId: currentBranchOffice, + mkmjLevel: "2", + mkmjType, + }); + initEcharts(data); + }; useMount(() => { - initEcharts(records); + loadData("1"); return () => { - if (chartInstance.current) { - chartInstance.current.dispose(); - chartInstance.current = null; - } + disposeChart(); }; }); + const handleTabClick = (index) => { + if (index === activeIndex) + return; + + disposeChart(); + setActiveIndex(index); + loadData(index === 0 ? "1" : "2"); + }; + return ( setActiveIndex(index)} + onClick={() => handleTabClick(index)} > {item}
@@ -193,10 +207,12 @@ function EntryExitTrendPanel() { )} >
-
+ +
+
); } -export default EntryExitTrendPanel; +export default Connect([NS_BI_STATISTICS], true)(EntryExitTrendPanel);