refactor(map): 7月28日需求修改 对接接口

master
LiuJiaNan 2026-07-29 11:35:18 +08:00
parent 07aea5d5fc
commit dbe87198b2
39 changed files with 202 additions and 154 deletions

View File

@ -164,3 +164,27 @@ export const getPersonLocationCompanyOnlineStat = declareRequest(
"getPersonLocationCompanyOnlineStatLoading",
"Post > @/personnelPosition/bi/personLocation/companyOnlineStat",
);
export const getPersonStatistics = declareRequest(
"getPersonStatisticsLoading",
"Post > @/xgfManager/project/personStatistics",
);
export const getScreenWorkStatusStatistics = declareRequest(
"getScreenWorkStatusStatisticsLoading",
"Post > @/eightwork/eightworkInfo/screenWorkStatusStatistics",
);
export const getScreenWorkPieStatistics = declareRequest(
"getScreenWorkPieStatisticsLoading",
"Post > @/eightwork/eightworkInfo/screenWorkPieStatistics",
);
export const getScreenXgfStatistics = declareRequest(
"getScreenXgfStatisticsLoading",
"Post > @/keyProject/keyProject/largeScreenXgfStatistics",
);
export const getScreenWorkPage = declareRequest(
"getScreenWorkPageLoading",
"Post > @/eightwork/eightworkInfo/screenWorkPage",
);
export const getScreenFireCheckList = declareRequest(
"getScreenFireCheckListLoading",
"Post > @/fireCheck/fireCheckList/screen/list",
);

View File

@ -11,8 +11,8 @@ import "./index.less";
function WorkStatusPanel(props) {
const chartInstance = useRef(null);
const chartRef = useRef(null);
const initEcharts = (main1Ref, chartInstance, data) => {
chartInstance.current = echarts.init(main1Ref.current);
const initEcharts = (data) => {
chartInstance.current = echarts.init(chartRef.current);
const domainTypeName = data.map(item => item.domainTypeName);
const scoredCount = data.map(item => item.scoredCount);
@ -138,7 +138,7 @@ function WorkStatusPanel(props) {
useMount(() => {
const loadData = async () => {
const { data } = await props.getProjectTaskScoreCount();
initEcharts(chartRef, chartInstance, data || []);
initEcharts(data || []);
};
loadData();

View File

@ -58,8 +58,8 @@ function WorkPanel(props) {
spinning={props.biStatistics.getEightWorkInfoDangerWorkStatisticsLoading || props.biStatistics.getKeyProjectLargeScreenStatisticsLoading}
>
<div className="index-info-work__list">
{data.map(item => (
<div className="index-info-work__item" key={item.name}>
{data.map((item, index) => (
<div className="index-info-work__item" key={index}>
<img src={item.image} alt="" />
<div>
<strong>{item.name}</strong>

View File

@ -15,10 +15,10 @@ function ClosedAreaStatsPanel() {
return (
<Panel title="封闭区域统计">
<div className="branch-office-closed-area-stats__content">
{statistics.map(item => (
{statistics.map((item, index) => (
<div
className="branch-office-closed-area-stats__item"
key={item.title}
key={index}
>
<div className="branch-office-closed-area-stats__image">
<img src={item.img} alt="" />

View File

@ -24,8 +24,8 @@ function EntryExitTrendPanel() {
const chartInstance = useRef(null);
const chartRef = useRef(null);
const initEcharts = (mainRef, chartInstance, data) => {
chartInstance.current = echarts.init(mainRef.current);
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));
@ -164,7 +164,7 @@ function EntryExitTrendPanel() {
};
useMount(() => {
initEcharts(chartRef, chartInstance, records);
initEcharts(records);
return () => {
if (chartInstance.current) {

View File

@ -15,8 +15,8 @@ function DepartmentResponsibilityPanel(props) {
const chartInstance = useRef(null);
const chartRef = useRef(null);
const initEcharts = (mainRef, chartInstance, data) => {
chartInstance.current = echarts.init(mainRef.current);
const initEcharts = (data) => {
chartInstance.current = echarts.init(chartRef.current);
const option = {
color: ["#7d4449", "#009944", "#167ce4", "#00ffff"],
@ -143,7 +143,7 @@ function DepartmentResponsibilityPanel(props) {
useMount(() => {
const loadData = async () => {
const { data } = await props.getDepartmentDuty({ portArea, corpinfoId: currentBranchOffice });
initEcharts(chartRef, chartInstance, data);
initEcharts(data);
};
loadData();

View File

@ -32,12 +32,12 @@ function RiskHazardPanel(props) {
<Panel title="风险点隐患" className="branch-office-index-left__risk-hazard">
<Spin spinning={props.biStatistics.getRiskPointHiddenLoading}>
<div className="branch-office-risk-hazard__content">
{data.map((item) => {
{data.map((item, index) => {
const color = levelColor[item.level];
return (
<div
className="branch-office-risk-hazard__item"
key={item.levelName}
key={index}
>
<div
className="branch-office-risk-hazard__decoration"

View File

@ -1,39 +1,47 @@
import { Connect } from "@cqsjjb/jjb-dva-runtime";
import { Spin } from "antd";
import { useEffect, useState } from "react";
import { useContext, useEffect, useState } from "react";
import SeamlessScroll from "zy-react-library/components/SeamlessScroll";
import temperatureIcon from "~/assets/images/public/bigScreen/img10.png";
import windIcon from "~/assets/images/public/bigScreen/img11.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 { getAlertColor, getWeatherIcon } from "~/utils/weather";
import "./index.less";
const statistics = [
{ label: "部门数", value: 10 },
{ label: "人员数", value: 1250 },
{ label: "相关单位数", value: 23 },
{ label: "相关方人员数", value: 1680 },
{ label: "部门数", value: 0, key: "departmentCount" },
{ label: "人员数", value: 0, key: "userCount" },
{ label: "相关单位数", value: 0, key: "relatedCorpCount" },
{ label: "相关方人员数", value: 0, key: "relatedUserCount" },
];
/** 负责查询并展示天气、预警及人员相关统计。 */
function WeatherPreventionPanel(props) {
const { portArea, currentBranchOffice } = useContext(Context);
const [weather, setWeather] = useState({});
const [alerts, setAlerts] = useState([]);
const [data, setData] = useState([]);
useEffect(() => {
const loadData = async () => {
const { result = {} } = await props.getWeather();
const [{ result }, { data }] = await Promise.all([
await props.getWeather(),
await props.getPersonStatistics({ portArea, corpinfoId: currentBranchOffice }),
]);
setWeather(result.now || {});
setAlerts(Array.isArray(result.alerts) ? result.alerts : []);
setData(statistics.map(item => ({ ...item, value: (data || {})[item.key] || 0 })));
};
loadData();
}, []);
return (
<Panel title="天气预防情况">
<Spin spinning={props.biStatistics.getWeatherLoading}>
<div className="branch-office-weather-prevention__content">
<div className="branch-office-weather-prevention__content">
<Spin spinning={props.biStatistics.getWeatherLoading}>
<div className="branch-office-weather-prevention__weather">
<div className="branch-office-weather-prevention__condition">
<div className="branch-office-weather-prevention__condition-image">
@ -80,9 +88,11 @@ function WeatherPreventionPanel(props) {
: <div className="branch-office-weather-prevention__no-alerts">当前暂无气象预警</div>
}
</div>
<Statistics />
</div>
</Spin>
</Spin>
<Spin spinning={props.biStatistics.getPersonStatisticsLoading}>
<Statistics data={data} />
</Spin>
</div>
</Panel>
);
}
@ -105,11 +115,11 @@ function WeatherMetric({ icon, label, value }) {
}
/** 天气预防区块内的部门及相关方统计块。 */
function Statistics() {
function Statistics({ data }) {
return (
<div className="branch-office-weather-prevention__statistics">
{statistics.map(item => (
<div className="branch-office-weather-prevention__statistic" key={item.label}>
{data.map((item, index) => (
<div className="branch-office-weather-prevention__statistic" key={index}>
<div className="branch-office-weather-prevention__statistic-label">{item.label}</div>
<div className="branch-office-weather-prevention__statistic-value">{item.value}</div>
</div>

View File

@ -43,10 +43,10 @@ function GateAndClosedAreaPanel() {
return (
<Panel title="口门及封闭区域">
<div className="branch-office-gate-closed-area__content">
{records.map(item => (
{records.map((item, index) => (
<div
className="branch-office-gate-closed-area__item"
key={item.title}
key={index}
style={{ backgroundImage: `url(${item.background})` }}
>
<div className="branch-office-gate-closed-area__title">

View File

@ -14,7 +14,7 @@ function KeyWorkStatsPanel(props) {
useEffect(() => {
const loadData = async () => {
const { data } = await props.getKeyProjectLargeScreenDepartmentStatistics({
const { data } = await props.getScreenXgfStatistics({
portArea,
corpinfoId: currentBranchOffice,
});
@ -31,29 +31,22 @@ function KeyWorkStatsPanel(props) {
<div className="branch-office-key-work-stats__content">
<div className="branch-office-key-work-stats__table">
<div className="branch-office-key-work-stats__row">
<div>部门名称</div>
<div>相关方名称</div>
<div>三人以上作业数</div>
<div>夜间作业数</div>
<div>其他作业数</div>
<div>四新作业数</div>
</div>
<div className="branch-office-key-work-stats__body">
<Spin
spinning={
props.biStatistics
.getKeyProjectLargeScreenDepartmentStatisticsLoading
}
>
<Spin spinning={props.biStatistics.getScreenXgfStatisticsLoading}>
<SeamlessScroll list={data} step={0.5}>
{data.map((item, index) => (
<div
className="branch-office-key-work-stats__row"
key={index}
>
<div>{item.departmentName}</div>
<div>{item.xgfCorpinfoName}</div>
<div>{item.morePeopleCount}</div>
<div>{item.nightWorkCount}</div>
<div>{item.otherWorkCount}</div>
<div>{item.fourNewHomeworkCount}</div>
</div>
))}

View File

@ -17,7 +17,7 @@
.branch-office-key-work-stats__row {
display: grid;
grid-template-columns: 1fr 1.5fr 1fr 1fr 1fr;
grid-template-columns: repeat(4, 1fr);
margin-top: 5px;
background-color: rgba(17, 51, 112, 0.8);
}

View File

@ -42,8 +42,8 @@ function ClosedAreaStatsPanel(props) {
<Panel title="封闭区域统计">
<Spin spinning={props.biStatistics.getPrimeportClosedAreaCorpStatLoading}>
<div className="branch-office-gate-stats__content">
{data.map(item => (
<div className="branch-office-gate-stats__item" key={item.label}>
{data.map((item, index) => (
<div className="branch-office-gate-stats__item" key={index}>
<div className="branch-office-gate-stats__image">
<img src={item.icon} alt="" />
</div>

View File

@ -24,8 +24,8 @@ function EntryExitTrendPanel() {
const chartInstance = useRef(null);
const chartRef = useRef(null);
const initEcharts = (mainRef, chartInstance, data) => {
chartInstance.current = echarts.init(mainRef.current);
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));
@ -164,7 +164,7 @@ function EntryExitTrendPanel() {
};
useMount(() => {
initEcharts(chartRef, chartInstance, records);
initEcharts(records);
return () => {
if (chartInstance.current) {

View File

@ -15,8 +15,8 @@ function AlarmTypeChartPanel(props) {
const chartInstance = useRef(null);
const chartRef = useRef(null);
const initEcharts = (mainRef, chartInstance, data) => {
chartInstance.current = echarts.init(mainRef.current);
const initEcharts = (data) => {
chartInstance.current = echarts.init(chartRef.current);
const option = {
tooltip: {
@ -49,7 +49,7 @@ function AlarmTypeChartPanel(props) {
useMount(() => {
const loadData = async () => {
const { data } = await props.getAlarmType({ portArea, corpinfoId: currentBranchOffice });
initEcharts(chartRef, chartInstance, data || []);
initEcharts(data || []);
};
loadData();

View File

@ -15,8 +15,8 @@ function ClosedAreaPersonnelPanel(props) {
const chartInstance = useRef(null);
const chartRef = useRef(null);
const initEcharts = (mainRef, chartInstance, data) => {
chartInstance.current = echarts.init(mainRef.current);
const initEcharts = (data) => {
chartInstance.current = echarts.init(chartRef.current);
const unitPersonnelData = data.map(item => Number.parseInt(item.unitCount));
const relatedPartyPersonnelData = data.map(item => Number.parseInt(item.relatedCount));
@ -157,7 +157,7 @@ function ClosedAreaPersonnelPanel(props) {
useMount(() => {
const loadData = async () => {
const { data } = await props.getPersonStat({ portArea, corpinfoId: currentBranchOffice });
initEcharts(chartRef, chartInstance, data || []);
initEcharts(data || []);
};
loadData();

View File

@ -11,12 +11,15 @@ import "./index.less";
function DepartmentWorkPanel(props) {
const { portArea, currentBranchOffice } = useContext(Context);
const [data, setData] = useState([]);
useEffect(() => {
const loadData = async () => {
const { data } = await props.getScreenWorkPage({ portArea, corpinfoId: currentBranchOffice, pageIndex: 1, pageSize: 9999 });
setData(data);
};
loadData();
}, []);
return (
<Panel
title="部门作业统计"
@ -30,15 +33,13 @@ function DepartmentWorkPanel(props) {
<div>作业状态</div>
</div>
<div className="branch-office-department-work__body">
<Spin
spinning={false}
>
<Spin spinning={props.biStatistics.getScreenWorkPageLoading}>
<SeamlessScroll list={data} step={0.5}>
{data.map((item, index) => (
<div className="branch-office-department-work__row" key={index}>
<div>{item.departmentName}</div>
<div>{item.fourNewHomeworkCount}</div>
<div>{item.eightWorkCount}</div>
<div>{item.workTypeName}</div>
<div>{item.currentStep}</div>
</div>
))}
</SeamlessScroll>

View File

@ -1,27 +1,20 @@
import { Connect } from "@cqsjjb/jjb-dva-runtime";
import { Spin } from "antd";
import * as echarts from "echarts";
import { useEffect, useRef } from "react";
import { useContext, useEffect, 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: "动火作业", archivedCount: 24, workingCount: 6, approvalCount: 3 },
{ name: "受限空间", archivedCount: 18, workingCount: 4, approvalCount: 2 },
{ name: "高处作业", archivedCount: 32, workingCount: 8, approvalCount: 5 },
{ name: "吊装作业", archivedCount: 16, workingCount: 3, approvalCount: 1 },
{ name: "临时用电", archivedCount: 27, workingCount: 7, approvalCount: 4 },
{ name: "动土作业", archivedCount: 12, workingCount: 2, approvalCount: 2 },
{ name: "断路作业", archivedCount: 15, workingCount: 5, approvalCount: 3 },
{ name: "盲板抽堵", archivedCount: 9, workingCount: 1, approvalCount: 1 },
];
/** 展示八类危险作业在已归档、作业中和审批中三个状态下的数量。 */
function KeyWorkPanel() {
function KeyWorkPanel(props) {
const { portArea, currentBranchOffice } = useContext(Context);
const chartRef = useRef(null);
const chartInstance = useRef(null);
useEffect(() => {
const initEcharts = (data) => {
chartInstance.current = echarts.init(chartRef.current);
chartInstance.current.setOption({
color: ["#74CB3F", "#00AEFF", "#FFA800"],
@ -49,7 +42,7 @@ function KeyWorkPanel() {
},
xAxis: {
type: "category",
data: records.map(item => item.name),
data: data.map(item => item.workTypeName),
axisTick: { show: false },
axisLine: {
lineStyle: { color: "rgba(255, 255, 255, 0.25)" },
@ -75,11 +68,20 @@ function KeyWorkPanel() {
},
},
series: [
{ name: "已归档", type: "bar", barMaxWidth: 14, data: records.map(item => item.archivedCount) },
{ name: "作业中", type: "bar", barMaxWidth: 14, data: records.map(item => item.workingCount) },
{ name: "审批中", type: "bar", barMaxWidth: 14, data: records.map(item => item.approvalCount) },
{ name: "已归档", type: "bar", barMaxWidth: 14, data: data.map(item => item.archivedCount) },
{ name: "作业中", type: "bar", barMaxWidth: 14, data: data.map(item => item.workingCount) },
{ name: "审批中", type: "bar", barMaxWidth: 14, data: data.map(item => item.approvingCount) },
],
});
};
useEffect(() => {
const loadData = async () => {
const { data } = await props.getScreenWorkPieStatistics({ portArea, corpinfoId: currentBranchOffice });
initEcharts(data || []);
};
loadData();
return () => {
chartInstance.current?.dispose();
@ -89,7 +91,9 @@ function KeyWorkPanel() {
return (
<Panel title="危险作业汇总" className="branch-office-danger-work__key-work">
<div ref={chartRef} className="branch-office-key-work__chart" />
<Spin spinning={props.biStatistics.getScreenWorkPieStatisticsLoading}>
<div ref={chartRef} className="branch-office-key-work__chart" />
</Spin>
</Panel>
);
}

View File

@ -10,39 +10,40 @@ import Panel from "~/pages/Container/Map/components/Content/branchOffice/Panel";
import { Context } from "~/pages/Container/Map/js/context";
import "./index.less";
const defaultStatistics = [
{ title: "审批中", icon: fourNewIcon, count: 0 },
{ title: "作业中", icon: dangerIcon, count: 0 },
{ title: "已归档", icon: multiPersonIcon, count: 0 },
const statistics = [
{ title: "审批中", icon: fourNewIcon, count: 0, key: "approvingCount" },
{ title: "作业中", icon: dangerIcon, count: 0, key: "workingCount" },
{ title: "已归档", icon: multiPersonIcon, count: 0, key: "archivedCount" },
];
/** 负责查询并展示重点作业当前数量与申请数量。 */
function KeyWorkStatsPanel(props) {
const { portArea, currentBranchOffice } = useContext(Context);
const [data, setData] = useState(defaultStatistics);
const [data, setData] = useState(statistics);
useEffect(() => {
const loadData = async () => {
const { data } = await props.getScreenWorkStatusStatistics({ portArea, corpinfoId: currentBranchOffice });
setData(statistics.map(item => ({ ...item, count: (data || {})[item.key] || 0 })));
};
loadData();
}, []);
return (
<Panel title="危险作业统计">
<Spin spinning={false}>
<Spin spinning={props.biStatistics.getScreenWorkStatusStatisticsLoading}>
<div className="branch-office-key-work-stats__list">
{data.map(item => (
{data.map((item, index) => (
<div
key={item.title}
key={index}
className="branch-office-key-work-stats__item"
>
<div className="branch-office-key-work-stats__title">
{item.title}
</div>
<div className="branch-office-key-work-stats__icon">
<img src={item.icon} alt="" />
</div>
<div className="branch-office-key-work-stats__title">
{item.title}
</div>
<div className="branch-office-key-work-stats__info">
<CountUp end={+item.count} />
</div>

View File

@ -1,19 +1,19 @@
.branch-office-key-work-stats__list {
display: flex;
align-items: center;
justify-content: space-between;
justify-content: space-around;
padding: 10px 15px;
color: #fff;
}
.branch-office-key-work-stats__title {
font-size: 14px;
font-weight: bold;
.branch-office-key-work-stats__icon {
text-align: center;
}
.branch-office-key-work-stats__icon {
.branch-office-key-work-stats__title {
margin-top: 13px;
font-size: 14px;
font-weight: bold;
text-align: center;
}

View File

@ -1,19 +1,27 @@
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 = [
{ inspectionForm: "码头消防点位检查表", principal: "张建国", pointCount: 28, status: "已完成" },
{ inspectionForm: "堆场消防点位检查表", principal: "李海峰", pointCount: 36, status: "已完成" },
{ inspectionForm: "仓储区消防点位检查表", principal: "王立新", pointCount: 22, status: "点检中" },
{ inspectionForm: "办公区消防点位检查表", principal: "赵明远", pointCount: 18, status: "待点检" },
{ inspectionForm: "散货区消防点位检查表", principal: "陈志强", pointCount: 31, status: "已完成" },
{ inspectionForm: "危化品区消防点位检查表", principal: "刘海涛", pointCount: 16, status: "异常" },
{ inspectionForm: "维修区消防点位检查表", principal: "孙志伟", pointCount: 24, status: "点检中" },
];
const STATE = { 0: "启用", 1: "禁用" };
/** 展示消防点位检查表的负责人、点位数量和当前点检状态。 */
function FireInspectionRecordPanel() {
function FireInspectionRecordPanel(props) {
const { portArea, currentBranchOffice } = useContext(Context);
const [data, setData] = useState([]);
useEffect(() => {
const loadData = async () => {
const { data } = await props.getScreenFireCheckList({ portArea, corpinfoId: currentBranchOffice, pageIndex: 1, pageSize: 9999 });
setData(data);
};
loadData();
}, []);
return (
<Panel title="消防点检记录" className="branch-office-fire__inspection-record">
<div className="branch-office-fire-inspection-record__content">
@ -25,16 +33,18 @@ function FireInspectionRecordPanel() {
<div>状态</div>
</div>
<div className="branch-office-fire-inspection-record__body">
<SeamlessScroll list={records} step={0.5}>
{records.map(item => (
<div className="branch-office-fire-inspection-record__row" key={item.inspectionForm}>
<div>{item.inspectionForm}</div>
<div>{item.principal}</div>
<div>{item.pointCount}</div>
<div>{item.status}</div>
</div>
))}
</SeamlessScroll>
<Spin spinning={props.biStatistics.getScreenFireCheckListLoading}>
<SeamlessScroll list={data} step={0.5}>
{data.map((item, index) => (
<div className="branch-office-fire-inspection-record__row" key={index}>
<div>{item.fireCheckName}</div>
<div>{item.userName}</div>
<div>{item.firePointCount}</div>
<div>{STATE[item.state]}</div>
</div>
))}
</SeamlessScroll>
</Spin>
</div>
</div>
</div>
@ -42,4 +52,4 @@ function FireInspectionRecordPanel() {
);
}
export default FireInspectionRecordPanel;
export default Connect([NS_BI_STATISTICS], true)(FireInspectionRecordPanel);

View File

@ -14,8 +14,8 @@ function ContractProjectPanel(props) {
const chartInstance = useRef(null);
const chartRef = useRef(null);
const initEcharts = (mainRef, chartInstance, data) => {
chartInstance.current = echarts.init(mainRef.current);
const initEcharts = (data) => {
chartInstance.current = echarts.init(chartRef.current);
const waitStartData = data.map(item =>
Number.parseInt(item.pendingProjectCount),
@ -165,7 +165,7 @@ function ContractProjectPanel(props) {
pageIndex: 1,
pageSize: 9999,
});
initEcharts(chartRef, chartInstance, data || []);
initEcharts(data || []);
};
loadData();

View File

@ -39,10 +39,10 @@ function ProjectStatsPanel(props) {
<Spin spinning={props.biStatistics.getProjectVisualProjectStatisticsLoading}>
<div className="branch-office-project-stats__content">
<div className="branch-office-project-stats__list">
{data.map(item => (
{data.map((item, index) => (
<div
className="branch-office-project-stats__item"
key={item.label}
key={index}
>
<div className="branch-office-project-stats__icon">
<img src={item.icon} alt="" />

View File

@ -17,8 +17,8 @@ function ClosedAreaStatsPanel() {
return (
<Panel title="封闭区域统计">
<div className="port-closed-area-stats__list">
{statistics.map(item => (
<div className="port-closed-area-stats__item" key={item.name}>
{statistics.map((item, index) => (
<div className="port-closed-area-stats__item" key={index}>
<img
className="port-closed-area-stats__image"
src={item.image}

View File

@ -36,8 +36,8 @@ function EntryExitRecordPanel() {
</div>
<div className="port-closed-area-record__table-body">
<SeamlessScroll list={records} step={0.5}>
{records.map(item => (
<div key={item.NAME} className="port-closed-area-record__row">
{records.map((item, index) => (
<div key={index} className="port-closed-area-record__row">
<div className="port-closed-area-record__cell">
{item.NAME}
</div>

View File

@ -24,8 +24,8 @@ function EntryExitTrendPanel() {
const chartRef = useRef(null);
const chartInstance = useRef(null);
const initEcharts = (mainRef, chartInstance, data) => {
chartInstance.current = echarts.init(mainRef.current);
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));
@ -120,7 +120,7 @@ function EntryExitTrendPanel() {
};
useMount(() => {
initEcharts(chartRef, chartInstance, records);
initEcharts(records);
return () => chartInstance.current?.dispose();
});

View File

@ -46,8 +46,8 @@ function BasicInfoPanel(props) {
<Panel title="单位基础信息">
<Spin spinning={props.biStatistics.getCorpInfoCorpUserSummaryLoading}>
<div className="port-basic-info__options">
{data.map(item => (
<div key={item.label} className="port-basic-info__option">
{data.map((item, index) => (
<div key={index} className="port-basic-info__option">
<img
src={item.image}
className="port-basic-info__option-icon"

View File

@ -48,7 +48,7 @@ function PersonnelStatsPanel(props) {
<div className="port-personnel-stats__tabs">
{tabs.map((item, index) => (
<div
key={item}
key={index}
className="port-personnel-stats__tab"
style={{
backgroundImage: `url(${index === activeTab ? activeTabBackground : tabBackground})`,

View File

@ -62,7 +62,7 @@ function EntryExitTrendPanel() {
const chartRef = useRef(null);
const chartInstance = useRef(null);
const initEcharts = (mainRef, chartInstance, data) => {
const initEcharts = (data) => {
const xAxisData = data.map(item => item.AREA_NAME);
const enterData = data.map(
item => Number(item.CAR_IN) + Number(item.PEOPLE_IN),
@ -70,7 +70,7 @@ function EntryExitTrendPanel() {
const exitData = data.map(
item => Number(item.CAR_OUT) + Number(item.PEOPLE_OUT),
);
chartInstance.current = echarts.init(mainRef.current);
chartInstance.current = echarts.init(chartRef.current);
chartInstance.current.setOption({
tooltip: { trigger: "axis", axisPointer: { type: "shadow" } },
grid: {
@ -171,7 +171,7 @@ function EntryExitTrendPanel() {
};
useMount(() => {
initEcharts(chartRef, chartInstance, records);
initEcharts(records);
return () => chartInstance.current?.dispose();
});

View File

@ -147,7 +147,7 @@ function GateRecordPanel() {
<div className="port-gate-record__tabs">
{tabs.map((item, index) => (
<div
key={item}
key={index}
className="port-gate-record__tab"
style={{
backgroundImage: `url(${index === activeTab ? activeTabBackground : tabBackground})`,

View File

@ -63,7 +63,7 @@ function DeviceDetailPanel() {
<div className="port-weather-detail__tabs">
{tabs.map((item, index) => (
<div
key={item}
key={index}
className="port-weather-detail__tab"
style={{
backgroundImage: `url(${index === activeTab ? activeTabBackground : tabBackground})`,

View File

@ -20,8 +20,8 @@ function DeviceStatusPanel() {
return (
<Panel title="监测设备状态" className="port-weather__device-status">
<div className="port-weather-device-status__options">
{defaultStatistics.map(item => (
<div key={item.title} className="port-weather-device-status__option">
{defaultStatistics.map((item, index) => (
<div key={index} className="port-weather-device-status__option">
<div className="port-weather-device-status__title">
{item.title}
</div>

View File

@ -39,8 +39,8 @@ function WeatherDataPanel() {
className="port-weather-data__background"
style={{ backgroundImage: `url(${weatherBackground})` }}
/>
{statistics.map(item => (
<div key={item.title} className="port-weather-data__option">
{statistics.map((item, index) => (
<div key={index} className="port-weather-data__option">
<div className="port-weather-data__label">
{item.title}

View File

@ -38,8 +38,8 @@ function LocationInfoPanel(props) {
<Panel title="定位基础信息">
<Spin spinning={props.biStatistics.getPersonLocationCompanyOnlineStatLoading}>
<div className="port-location-info__options">
{data.map(item => (
<div key={item.title} className="port-location-info__option">
{data.map((item, index) => (
<div key={index} className="port-location-info__option">
<div
className="port-location-info__icon"
style={{ backgroundImage: `url(${iconBackground})` }}

View File

@ -25,8 +25,8 @@ function OnlineLocationInfoPanel() {
</div>
<div className="port-online-location-info__body">
<SeamlessScroll list={records} step={0.5}>
{records.map(item => (
<div className="port-online-location-info__row" key={item.corpName}>
{records.map((item, index) => (
<div className="port-online-location-info__row" key={index}>
<div className="port-online-location-info__cell">{item.corpName}</div>
<div className="port-online-location-info__cell">{item.onlinePersonnelCount}</div>
<div className="port-online-location-info__cell">{item.onlineVehicleCount}</div>

View File

@ -48,8 +48,8 @@ function WorkStatusPanel(props) {
<Panel title="安全作业状态统计">
<Spin spinning={props.biStatistics.getEightWorkInfoScreenStatusStatisticsLoading}>
<div className="port-danger-work-status__options">
{data.map(item => (
<div key={item.label} className="port-danger-work-status__option">
{data.map((item, index) => (
<div key={index} className="port-danger-work-status__option">
<div
className="port-danger-work-status__icon"
style={{ backgroundImage: `url(${iconBackground})` }}

View File

@ -31,7 +31,7 @@ function WorkTrendPanel(props) {
const chartRef = useRef(null);
const chartInstance = useRef(null);
const initEcharts = (mainRef, chartInstance, data) => {
const initEcharts = (data) => {
const colors = [
"29,128,219",
"1,245,255",
@ -69,7 +69,7 @@ function WorkTrendPanel(props) {
},
data: seriesData,
}));
chartInstance.current = echarts.init(mainRef.current);
chartInstance.current = echarts.init(chartRef.current);
chartInstance.current.setOption({
tooltip: { trigger: "axis" },
legend: {
@ -118,7 +118,7 @@ function WorkTrendPanel(props) {
const { data } = await props.getEightWorkInfoScreenWorkTrend({
portArea,
});
initEcharts(chartRef, chartInstance, formatWorkTrendData(data || []));
initEcharts(formatWorkTrendData(data || []));
};
loadData();

View File

@ -42,8 +42,8 @@ function KeyProjectPanel(props) {
<Panel title="重点工程" className="port-key-supervision__project">
<Spin spinning={props.biStatistics.getKeyProjectLargeScreenProjectStatisticsLoading}>
<div className="port-key-project__options">
{data.map(item => (
<div key={item.label} className="port-key-project__option">
{data.map((item, index) => (
<div key={index} className="port-key-project__option">
<div
className="port-key-project__icon"
style={{ backgroundImage: `url(${iconBackground})` }}

View File

@ -46,9 +46,9 @@ function VideoLocationPanel(props) {
style={{ backgroundImage: `url(${videoBackground})` }}
/>
<div>
{data.map(item => (
{data.map((item, index) => (
<div
key={item.label}
key={index}
className="port-video-location__statistic"
>
<div>

View File

@ -105,6 +105,11 @@ function Map(props) {
mapMethods.current.addPortPoint();
}, 500);
}
}).catch(() => {
setTimeout(() => {
mapMethods.current.flyTo();
mapMethods.current.addPortPoint();
}, 500);
}).finally(() => {
setIsRenderContent(true);
});