diff --git a/jjb.config.js b/jjb.config.js index cb61baf..83db5b2 100644 --- a/jjb.config.js +++ b/jjb.config.js @@ -9,15 +9,13 @@ module.exports = { // 应用后端分支名称,部署上线需要 javaGitBranch: "", // 接口服务地址 - // API_HOST: "https://gbs-gateway.qhdsafety.com", - API_HOST: "http://192.168.20.100:30140", + API_HOST: "https://gbs-gateway.qhdsafety.com", }, production: { // 应用后端分支名称,部署上线需要 javaGitBranch: "", // 接口服务地址 - // API_HOST: "", - API_HOST: "https://gbs-gateway.qhdsafety.com", + API_HOST: "", }, }, // 应用唯一标识符 diff --git a/src/api/bi/index.js b/src/api/bi/index.js index ea3d85c..f3844e5 100644 --- a/src/api/bi/index.js +++ b/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', -); \ No newline at end of file + "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", +); diff --git a/src/enumerate/namespace/index.js b/src/enumerate/namespace/index.js index e5d3676..fba902d 100644 --- a/src/enumerate/namespace/index.js +++ b/src/enumerate/namespace/index.js @@ -6,4 +6,4 @@ import { defineNamespace } from "@cqsjjb/jjb-dva-runtime"; export const NS_GLOBAL = defineNamespace("global"); -export const NS_BI = defineNamespace("bi"); \ No newline at end of file +export const NS_BI = defineNamespace("bi"); diff --git a/src/pages/Container/Map/components/BottomUtils/portUtilsList.js b/src/pages/Container/Map/components/BottomUtils/portUtilsList.js index 64ccc36..66b23f3 100644 --- a/src/pages/Container/Map/components/BottomUtils/portUtilsList.js +++ b/src/pages/Container/Map/components/BottomUtils/portUtilsList.js @@ -199,7 +199,7 @@ export const portUtilsList = [ { img: bottomImg6, checkImg: bottomImg6On, - label: "危险作业", + label: "重点作业", type: "danger", list: [ { diff --git a/src/pages/Container/Map/components/Content/IndexInfo/Bottom/index.js b/src/pages/Container/Map/components/Content/IndexInfo/Bottom/index.js index a2d6b04..eaf8ada 100644 --- a/src/pages/Container/Map/components/Content/IndexInfo/Bottom/index.js +++ b/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 (
@@ -28,59 +65,66 @@ function BottomScreen() {
- <div className="main" style={{ backgroundImage: `url(${img2})` }}> - <div className="table"> - <div className="head"> - <div>备案类型</div> - <div>主管部门</div> - <div>相关方单位备案情况</div> - <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> - - <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> + <Spin spinning={props.bi.indexInfoXgfManagerProjectLoading}> + <div className="main" style={{ backgroundImage: `url(${img2})` }}> + <div className="table"> + <div className="head"> + <div>备案类型</div> + <div>主管部门</div> + <div>相关方单位备案情况</div> + <div>项目执行情况统计</div> + <div>人员培训情况统计</div> + </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> + ))} + </SeamlessScroll> + </div> </div> </div> - </div> + </Spin> </div> <div className="right"> <Title title="视频巡屏" /> <div className="main"> - <div className="menu"> - <div className="list active">新益公司</div> - <div className="list">二公司</div> - <div className="list">六公司</div> - <div className="list">七公司</div> - <div className="list">九公司</div> - </div> + <Spin spinning={props.bi.indexInfoVideoPatrolLoading}> + <div className="menu"> + { + 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); diff --git a/src/pages/Container/Map/components/Content/IndexInfo/Bottom/index.less b/src/pages/Container/Map/components/Content/IndexInfo/Bottom/index.less index 20da28e..3d64784 100644 --- a/src/pages/Container/Map/components/Content/IndexInfo/Bottom/index.less +++ b/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; + } } } } diff --git a/src/pages/Container/Map/components/Content/IndexInfo/LeftPanel/echarts.js b/src/pages/Container/Map/components/Content/IndexInfo/LeftPanel/echarts.js index 37b585c..7098c11 100644 --- a/src/pages/Container/Map/components/Content/IndexInfo/LeftPanel/echarts.js +++ b/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, }, ], }; diff --git a/src/pages/Container/Map/components/Content/IndexInfo/LeftPanel/index.js b/src/pages/Container/Map/components/Content/IndexInfo/LeftPanel/index.js index 5e469f4..991e3fe 100644 --- a/src/pages/Container/Map/components/Content/IndexInfo/LeftPanel/index.js +++ b/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,47 +70,51 @@ function LeftScreen() { <div className="left-container_bg" style={{ backgroundImage: `url(${rightbg})` }}></div> <div className="block1"> <Title title="天气预报情况" /> - <div className="main"> - <div className="list1"> - <img src={getWeatherIcon(weather?.text)} alt="" className="img1" /> - <div>{weather?.text || "暂无数据"}</div> - </div> - <div className="list1"> - <img src={img3} alt="" className="img" /> - <div className="info"> - <div>温度:</div> - <div className="temp">{weather?.temp ? `${weather?.temp}℃` : "--"}</div> + <Spin spinning={props.bi.indexInfoWeatherLoading}> + <div className="main"> + <div className="list1"> + <img src={getWeatherIcon(weather?.text)} alt="" className="img1" /> + <div>{weather?.text || "暂无"}</div> + </div> + <div className="list1"> + <img src={img3} alt="" className="img" /> + <div className="info"> + <div>温度:</div> + <div className="temp">{weather?.temp ? `${weather?.temp}℃` : "--"}</div> + </div> + </div> + <div className="list1"> + <img src={img4} alt="" className="img" /> + <div className="info"> + <div>风速:</div> + <div className="temp">{weather?.wind_class || "--"}</div> + </div> </div> </div> - <div className="list1"> - <img src={img4} alt="" className="img" /> - <div className="info"> - <div>风速:</div> - <div className="temp">{weather?.wind_class || "--"}</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> + <div>报警处置状态</div> + <div>应急报警信息</div> </div> - </div> - </div> - <div className="info">{weather?.alertTitle || "天气数据加载失败"}</div> - <div className="table"> - <div className="head" style={{ backgroundImage: `url(${img5})` }}> - <div>公司名称</div> - <div>报警处置状态</div> - <div>应急报警信息</div> - </div> - <div className="scroll"> - <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="scroll"> + <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.executorCorpName}</div> + <div className="table-item"> + {{ 1: "未执行", 2: "已执行", 3: "进行中", 4: "已完成" }[item.isRescueExecuted]} + </div> + <div className="table-item">{item.eventTitle}</div> </div> - <div className="table-item">{item.preventiveMeasures}</div> - </div> - ))} - </SeamlessScroll> + ))} + </SeamlessScroll> + </div> </div> - </div> + </Spin> </div> <div className="block2"> <Title title="重大危险源运行情况" /> @@ -184,39 +175,43 @@ function LeftScreen() { </div> <div className="block3"> <Title title="领域工作情况统计" /> - <div className="main"> - <div ref={main1Ref} style={{ width: "100%", height: "180px" }} /> - </div> + <Spin spinning={props.bi.indexInfoDomainLoading}> + <div className="main"> + <div ref={main1Ref} style={{ width: "100%", height: "180px" }} /> + </div> + </Spin> </div> <div className="block4"> <Title title="当前各公司隐患整改情况" /> - <div className="main"> - <div className="table"> - <div className="head" style={{ backgroundImage: `url(${img5})` }}> - <div>公司名称</div> - <div>发现隐患数</div> - <div>整改隐患数</div> - <div>待整改</div> - <div>待验收</div> - </div> - <div className="scroll"> - <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> - ))} - </SeamlessScroll> + <Spin spinning={props.bi.indexInfoHiddenLoading}> + <div className="main"> + <div className="table"> + <div className="head" style={{ backgroundImage: `url(${img5})` }}> + <div>公司名称</div> + <div>发现隐患数</div> + <div>整改隐患数</div> + <div>待整改</div> + <div>待验收</div> + </div> + <div className="scroll"> + <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.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> - </div> + </Spin> </div> </div> ); } -export default LeftScreen; +export default Connect([NS_BI], true)(LeftScreen); diff --git a/src/pages/Container/Map/components/Content/IndexInfo/LeftPanel/index.less b/src/pages/Container/Map/components/Content/IndexInfo/LeftPanel/index.less index 9993e29..70fcabd 100644 --- a/src/pages/Container/Map/components/Content/IndexInfo/LeftPanel/index.less +++ b/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; - } } } } diff --git a/src/pages/Container/Map/components/Content/IndexInfo/RightPanel/index.js b/src/pages/Container/Map/components/Content/IndexInfo/RightPanel/index.js index 4ab51e3..7e5bc65 100644 --- a/src/pages/Container/Map/components/Content/IndexInfo/RightPanel/index.js +++ b/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,115 +11,101 @@ 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="相关方单位情况统计" /> - <div className="main"> - <div className="table"> - <div className="head" style={{ backgroundImage: `url(${img5})` }}> - <div>相关方单位名称</div> - <div>资质申请情况</div> - <div>项目执行情况</div> - <div>执行人员情况</div> - </div> - <div className="scroll"> - <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> - ))} - </SeamlessScroll> + <Spin spinning={props.bi.indexInfoXgfManagerLoading}> + <div className="main"> + <div className="table"> + <div className="head" style={{ backgroundImage: `url(${img5})` }}> + <div>相关方单位名称</div> + <div>资质申请情况</div> + <div>项目执行情况</div> + <div>执行人员情况</div> + </div> + <div className="scroll"> + <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.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> - </div> + </Spin> </div> <div className="block2"> <Title title="重点作业管理统计" /> - <div className="main"> - <div className="item"> - <div className="img"> - <img src={img2} alt="" /> - </div> - <div className="info"> - <div className="title">三人以上作业</div> - <div> - <p> 当前作业数:13</p> - <p>申请数:14</p> - </div> - </div> + <Spin spinning={props.bi.indexInfoEightWorkLoading}> + <div className="main"> + { + block2List.map((item, index) => ( + <div className="item" key={index}> + <div className="img"> + <img src={item.img} alt="" /> + </div> + <div className="info"> + <div className="title">{item.name}</div> + <div> + <p> + <span>当前作业数:</span> + <span>{item.doingCount}</span> + </p> + <p> + <span>申请数:</span> + <span>{item.appliedCount}</span> + </p> + </div> + </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> - </div> - </div> - </div> - </div> + </Spin> </div> <div className="block3"> <Title title="当前口门、封闭区情况" /> @@ -154,31 +142,33 @@ function RightScreen() { </div> <div className="block4"> <Title title="物联网设备报警情况" /> - <div className="main"> - <div className="table"> - <div className="head" style={{ backgroundImage: `url(${img5})` }}> - <div>设备类型</div> - <div>所属单位</div> - <div>报警类型</div> - <div>处置状态</div> - </div> - <div className="scroll"> - <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> - ))} - </SeamlessScroll> + <Spin spinning={props.bi.indexInfoIotalarmLoading}> + <div className="main"> + <div className="table"> + <div className="head" style={{ backgroundImage: `url(${img5})` }}> + <div>设备类型</div> + <div>所属单位</div> + <div>报警类型</div> + <div>处置状态</div> + </div> + <div className="scroll"> + <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.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> - </div> + </Spin> </div> </div> ); } -export default RightScreen; +export default Connect([NS_BI], true)(RightScreen); diff --git a/src/pages/Container/Map/components/Content/IndexInfo/RightPanel/index.less b/src/pages/Container/Map/components/Content/IndexInfo/RightPanel/index.less index 079f868..21aefed 100644 --- a/src/pages/Container/Map/components/Content/IndexInfo/RightPanel/index.less +++ b/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; - } } } } diff --git a/src/pages/Container/Map/components/Content/branchOffice/IndexLeft/index.js b/src/pages/Container/Map/components/Content/branchOffice/IndexLeft/index.js index c24e72b..4939f6a 100644 --- a/src/pages/Container/Map/components/Content/branchOffice/IndexLeft/index.js +++ b/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"> diff --git a/src/pages/Container/Map/components/Content/branchOffice/QiXiang/index.js b/src/pages/Container/Map/components/Content/branchOffice/QiXiang/index.js index 7571fc8..f567355 100644 --- a/src/pages/Container/Map/components/Content/branchOffice/QiXiang/index.js +++ b/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"> diff --git a/src/pages/Container/Map/js/context.js b/src/pages/Container/Map/js/context.js index 437d6c0..0d8b058 100644 --- a/src/pages/Container/Map/js/context.js +++ b/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: diff --git a/src/pages/Container/White/BranchOffice/components/CenterPanel/index.js b/src/pages/Container/White/BranchOffice/components/CenterPanel/index.js index 8c2e1ea..1e09941 100644 --- a/src/pages/Container/White/BranchOffice/components/CenterPanel/index.js +++ b/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"> diff --git a/src/utils/weather.js b/src/utils/weather.js index c3168b6..d14483d 100644 --- a/src/utils/weather.js +++ b/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("天气接口请求失败,请检查网络或稍后再试");