import React, { useEffect, useState } from 'react'; import { connect } from 'react-redux'; import { Select } from 'antd'; import moment from 'moment' import ReactECharts from 'echarts-for-react'; import RealTimeStatus from '../components/electrity/realTimeStatus'; import LineBoxStatus from '../components/electrity/lineBoxStatus'; import VoltageTrend from '../components/electrity/voltageTrend'; import LevelTrend from '../components/electrity/levelTrend'; const Electrical = ({ dispatch, actions, siteList}) => { const { bigScreen } = actions const [pageLeft, setPageLeft] = useState(0) //左边翻页 const [pageRight, setPageRight] = useState(0) //左边翻页 // const [siteList, setSiteList] = useState([]) //站点列表 const [pumpList, setPumpList] = useState([]) //水泵列表 const [cabinetList, setCabinetList] = useState([]) //水泵列表 const [strucId, setStrucId] = useState() //站点ID const [pumpId, setPumpId] = useState() //水泵id const [cabinetId, setCabinetId] = useState() //进线柜id const [usePumpId, setUsePumpId] = useState() //水泵id const [voltagePumpId, setVoltagePumpId] = useState([]) //水泵电压id const [pumpOne, setPumpOne] = useState({ data: [] }) //单个水泵数据 const [voltagepump, setVoltagePump] = useState([]) //单个水泵数据 const [cabinetOne, setCabinetOne] = useState({ data: [] }) //单个进线柜数据 const [cabinetData, setCabinetData] = useState([]) //进线柜数据 const [centreData, setCentreData] = useState({}) //中间数据 const [depthWater, setDepthWater] = useState([]) //液位趋势 const [electricityTrend, setElectricityTrend] = useState([]) //电流趋势 const [useTrend, setUseTrend] = useState([]) //用电趋势 useEffect(() => { setStrucId(siteList[0]?.value) }, [siteList]) useEffect(async () => { if (strucId) { await dispatch(bigScreen.axyData({ type: 'get', url: `structures/${strucId}/factors` })).then(async r => { if (r.success) { //水泵信息 let waterId = r.payload.data?.find(v => v.name == '泵站水泵')?.id if (waterId) { await dispatch(bigScreen.axyData({ type: 'get', url: `structures/${strucId}/stations`, params: { query: { factorId: waterId } } })).then(async p => { if (p.success) { let dataId = [] let voltageId = [] p.payload.data?.map(v => { v.groups?.map(s => { s.stations?.map(f => { dataId.push(f.id) if (voltageId?.length < 3) { voltageId.push(f.id) } }) }) }) setPumpList(p.payload.data[0]?.groups[0]?.stations) setPumpId(p.payload.data[0]?.groups[0]?.stations[0]?.id) setVoltagePumpId(voltageId) setUsePumpId(p.payload.data[0]?.groups[0]?.stations[0]?.id) // if (dataId.length) { // // 当前时间 // await dispatch(bigScreen.axyData({ // type: 'get', url: `stations/theme/data`, params: { // query: { // stations: dataId.join(), // startTime: moment().startOf('day').format('YYYY-MM-DD HH:mm:ss'), // endTime: moment().endOf('day').format('YYYY-MM-DD HH:mm:ss'), // limit: 1 // } // } // })).then(d => { // if (d.success) { // } // }) // } } }) } // 进线柜 let wireCabinetId = r.payload.data?.find(v => v.name == '泵站进线柜')?.id if (wireCabinetId) { await dispatch(bigScreen.axyData({ type: 'get', url: `structures/${strucId}/stations`, params: { query: { factorId: wireCabinetId } } })).then(async p => { if (p.success) { let dataId = [] p.payload.data?.map(v => { v.groups?.map(s => { s.stations?.map(f => { dataId.push({ value: f.id, label: f.name }) }) }) }) setCabinetList(dataId) setCabinetId(p.payload.data[0]?.groups[0]?.stations[0]?.id) } }) } // //泵站信息 let informationId = r.payload.data?.find(v => v.name == '泵站信息')?.id if (informationId) { await dispatch(bigScreen.axyData({ type: 'get', url: `structures/${strucId}/stations`, params: { query: { factorId: informationId } } })).then(async p => { if (p.success) { // 液位趋势 await dispatch(bigScreen.axyData({ type: 'get', url: `stations/theme/data`, params: { query: { stations: p.payload.data[0]?.groups[0]?.stations[0]?.id, startTime: moment().add(-12, 'hours').format('YYYY-MM-DD HH:mm:ss'), endTime: moment().format('YYYY-MM-DD HH:mm:ss'), limit: 1440 } } })).then(d => { if (d.success) { setDepthWater(d.payload.data?.stations[0]?.data) } }) } }) } } }) } }, [strucId]) useEffect(async () => { if (pumpId) { await dispatch(bigScreen.axyData({ type: 'get', url: `stations/theme/data`, params: { query: { stations: pumpId, startTime: moment().startOf('day').format('YYYY-MM-DD HH:mm:ss'), endTime: moment().format('YYYY-MM-DD HH:mm:ss'), limit: 1 } } })).then(d => { if (d.success) { setPumpOne(d.payload.data?.stations[0] || { data: [] }) } }) } }, [pumpId]) useEffect(async () => { if (cabinetId) { await dispatch(bigScreen.axyData({ type: 'get', url: `stations/theme/data`, params: { query: { stations: cabinetId, startTime: moment().startOf('day').format('YYYY-MM-DD HH:mm:ss'), endTime: moment().format('YYYY-MM-DD HH:mm:ss'), limit: 1 } } })).then(d => { if (d.success) { setCabinetOne(d.payload.data?.stations[0] || { data: [] }) } }) } }, [cabinetId]) useEffect(async () => { if (voltagePumpId?.length > 0) { await dispatch(bigScreen.axyData({ type: 'get', url: `stations/theme/data`, params: { query: { stations: voltagePumpId?.join(), startTime: moment().add(-12, 'hours').format('YYYY-MM-DD HH:mm:ss'), endTime: moment().format('YYYY-MM-DD HH:mm:ss'), limit: 1440 } } })).then(d => { if (d.success) { setVoltagePump(d.payload.data?.stations || []) } }) } }, [voltagePumpId]) return
环境湿度：
{depthWater[0]?.sHumidity || "--"} %
环境湿度：
{depthWater[0]?.sTEMP || "--"} ℃
信号：
{depthWater[0]?.CSQ4G || "--"}
集水池水位{depthWater[0]?.sLiquid_level?.toFixed(2) || 0}米
池前上游水位{depthWater[0]?.sGrille_level?.toFixed(2) || 0}米
{siteList?.filter(v => v.value == strucId)[0]?.label}