|
|
@ -11,15 +11,14 @@ import Right_2 from './basis/right_2'; |
|
|
import { POWER_STATIONS } from './shuizhan_detail'; |
|
|
import { POWER_STATIONS } from './shuizhan_detail'; |
|
|
import './basis.less' |
|
|
import './basis.less' |
|
|
|
|
|
|
|
|
const Basis = ({ actions, dispatch, setshowData }) => { |
|
|
const Basis = ({ actions, dispatch, setshowData, siteList, siteData }) => { |
|
|
|
|
|
|
|
|
const { bigScreen } = actions |
|
|
const { bigScreen } = actions |
|
|
const [siteList, setSiteList] = useState([]) //站点列表
|
|
|
// const [siteList, setSiteList] = useState([]) //站点列表
|
|
|
const [strucId, setStrucId] = useState() //站点ID
|
|
|
const [strucId, setStrucId] = useState() //站点ID
|
|
|
const [pageRefresh1, setPageRefresh1] = useState(false) |
|
|
const [pageRefresh1, setPageRefresh1] = useState(false) |
|
|
const [pageRefresh2, setPageRefresh2] = useState(0) |
|
|
const [pageRefresh2, setPageRefresh2] = useState(0) |
|
|
const [pageRefresh3, setPageRefresh3] = useState(0) |
|
|
const [pageRefresh3, setPageRefresh3] = useState(0) |
|
|
const [left2List, setleft2List] = useState([]) |
|
|
|
|
|
const [depthWater, setDepthWater] = useState([]) |
|
|
const [depthWater, setDepthWater] = useState([]) |
|
|
const [information, setInformation] = useState({}) |
|
|
const [information, setInformation] = useState({}) |
|
|
|
|
|
|
|
|
@ -28,92 +27,93 @@ const Basis = ({ actions, dispatch, setshowData }) => { |
|
|
const pumpNumber = useRef(0) |
|
|
const pumpNumber = useRef(0) |
|
|
|
|
|
|
|
|
useEffect(async () => { |
|
|
useEffect(async () => { |
|
|
await dispatch(bigScreen.axyData({ type: 'get', url: `organizations/{orgId}/structures` })).then(async res => { |
|
|
|
|
|
if (res.success) { |
|
|
if (siteData) { |
|
|
setSiteList(res.payload.data?.map(v => ({ value: v.id, label: v.name })) || []) |
|
|
setStrucId(siteData[0]?.id) |
|
|
setshowData(res.payload.data?.map(v => ({ name: v.name, lat: v.latitude, lng: v.longitude })) || []) |
|
|
for (let key in POWER_STATIONS) { |
|
|
setStrucId(res.payload.data[0]?.id) |
|
|
if (POWER_STATIONS[key]?.name == siteData[0]?.name) { |
|
|
for (let key in POWER_STATIONS) { |
|
|
setInformation(POWER_STATIONS[key]) |
|
|
if (POWER_STATIONS[key]?.name == res.payload.data[0]?.name) { |
|
|
|
|
|
setInformation(POWER_STATIONS[key]) |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
} |
|
|
//获取所有泵站的集水池液位
|
|
|
} |
|
|
res.payload.data?.map(async v => { |
|
|
//获取所有泵站的集水池液位
|
|
|
await dispatch(bigScreen.axyData({ type: 'get', url: `structures/${v.id}/factors` })).then(async r => { |
|
|
siteData?.map(async v => { |
|
|
//泵站信息
|
|
|
await dispatch(bigScreen.axyData({ type: 'get', url: `structures/${v.id}/factors` })).then(async r => { |
|
|
let informationId = r.payload.data?.find(v => v.name == '泵站信息')?.id |
|
|
//泵站信息
|
|
|
if (informationId) { |
|
|
let informationId = r.payload.data?.find(v => v.name == '泵站信息')?.id |
|
|
await dispatch(bigScreen.axyData({ |
|
|
if (informationId) { |
|
|
type: 'get', url: `structures/${v.id}/stations`, |
|
|
await dispatch(bigScreen.axyData({ |
|
|
params: { query: { factorId: informationId } } |
|
|
type: 'get', url: `structures/${v.id}/stations`, |
|
|
})).then(async p => { |
|
|
params: { query: { factorId: informationId } } |
|
|
if (p.success) { |
|
|
})).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().startOf('day').format('YYYY-MM-DD HH:mm:ss'), |
|
|
|
|
|
endTime: moment().endOf('day').format('YYYY-MM-DD HH:mm:ss'), |
|
|
|
|
|
limit: 1 |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
})).then(async d => { |
|
|
|
|
|
if (d.success) { |
|
|
|
|
|
left1Data.current?.push({ name: v.name, level: d.payload.data?.stations[0]?.data[0]?.sLiquid_level || 0 }) |
|
|
|
|
|
setPageRefresh1(moment().format('x')) |
|
|
|
|
|
} |
|
|
|
|
|
}) |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
}) |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
//水泵信息
|
|
|
|
|
|
let waterId = r.payload.data?.find(v => v.name == '泵站水泵')?.id |
|
|
|
|
|
if (waterId) { |
|
|
|
|
|
await dispatch(bigScreen.axyData({ |
|
|
|
|
|
type: 'get', url: `structures/${v.id}/stations`, |
|
|
|
|
|
params: { query: { factorId: waterId } } |
|
|
|
|
|
})).then(async p => { |
|
|
|
|
|
if (p.success) { |
|
|
|
|
|
pumpNumber.current += p.payload.data[0]?.groups[0]?.stations.length || 0 |
|
|
|
|
|
setPageRefresh3(!pageRefresh3) |
|
|
|
|
|
let dataId = [] |
|
|
|
|
|
p.payload.data?.map(v => { |
|
|
|
|
|
v.groups?.map(s => { |
|
|
|
|
|
s.stations?.map(f => { |
|
|
|
|
|
dataId.push(f.id) |
|
|
|
|
|
}) |
|
|
|
|
|
}) |
|
|
|
|
|
}) |
|
|
|
|
|
if (dataId.length) { |
|
|
|
|
|
// 当前时间
|
|
|
await dispatch(bigScreen.axyData({ |
|
|
await dispatch(bigScreen.axyData({ |
|
|
type: 'get', url: `stations/theme/data`, params: { |
|
|
type: 'get', url: `stations/theme/data`, params: { |
|
|
query: { |
|
|
query: { |
|
|
stations: p.payload.data[0]?.groups[0]?.stations[0]?.id, |
|
|
stations: dataId.join(), |
|
|
startTime: moment().startOf('day').format('YYYY-MM-DD HH:mm:ss'), |
|
|
startTime: moment().startOf('day').format('YYYY-MM-DD HH:mm:ss'), |
|
|
endTime: moment().endOf('day').format('YYYY-MM-DD HH:mm:ss'), |
|
|
endTime: moment().endOf('day').format('YYYY-MM-DD HH:mm:ss'), |
|
|
limit: 1 |
|
|
limit: 1 |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
})).then(async d => { |
|
|
})).then(d => { |
|
|
if (d.success) { |
|
|
if (d.success) { |
|
|
left1Data.current?.push({ name: v.name, level: d.payload.data?.stations[0]?.data[0]?.sLiquid_level || 0 }) |
|
|
left2Data.current?.push({ name: v.name, data: d.payload.data?.stations }) |
|
|
setPageRefresh1(moment().format('x')) |
|
|
setPageRefresh2(moment().format('x')) |
|
|
} |
|
|
} |
|
|
}) |
|
|
}) |
|
|
} |
|
|
} |
|
|
|
|
|
} |
|
|
}) |
|
|
}) |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
//水泵信息
|
|
|
|
|
|
let waterId = r.payload.data?.find(v => v.name == '泵站水泵')?.id |
|
|
|
|
|
if (waterId) { |
|
|
|
|
|
await dispatch(bigScreen.axyData({ |
|
|
|
|
|
type: 'get', url: `structures/${v.id}/stations`, |
|
|
|
|
|
params: { query: { factorId: waterId } } |
|
|
|
|
|
})).then(async p => { |
|
|
|
|
|
if (p.success) { |
|
|
|
|
|
pumpNumber.current += p.payload.data[0]?.groups[0]?.stations.length || 0 |
|
|
|
|
|
setPageRefresh3(!pageRefresh3) |
|
|
|
|
|
let dataId = [] |
|
|
|
|
|
p.payload.data?.map(v => { |
|
|
|
|
|
v.groups?.map(s => { |
|
|
|
|
|
s.stations?.map(f => { |
|
|
|
|
|
dataId.push(f.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) { |
|
|
|
|
|
left2Data.current?.push({ name: v.name, data: d.payload.data?.stations }) |
|
|
|
|
|
setPageRefresh2(moment().format('x')) |
|
|
|
|
|
} |
|
|
|
|
|
}) |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
}) |
|
|
|
|
|
} |
|
|
|
|
|
}) |
|
|
|
|
|
}) |
|
|
}) |
|
|
} |
|
|
}) |
|
|
}) |
|
|
} |
|
|
|
|
|
|
|
|
}, []) |
|
|
}, [siteData]) |
|
|
|
|
|
|
|
|
|
|
|
useEffect(() => { |
|
|
|
|
|
setStrucId(siteList[0]?.value) |
|
|
|
|
|
}, [siteList]) |
|
|
|
|
|
|
|
|
useEffect(async () => { |
|
|
useEffect(async () => { |
|
|
if (strucId) { |
|
|
if (strucId) { |
|
|
@ -161,10 +161,10 @@ const Basis = ({ actions, dispatch, setshowData }) => { |
|
|
<div style={{ |
|
|
<div style={{ |
|
|
width: '100%', height: 40, |
|
|
width: '100%', height: 40, |
|
|
backgroundImage: 'url(/assets/images/monitor/end.png)', backgroundSize: '100% 100%', backgroundPosition: 'center', backgroundRepeat: 'no-repeat', |
|
|
backgroundImage: 'url(/assets/images/monitor/end.png)', backgroundSize: '100% 100%', backgroundPosition: 'center', backgroundRepeat: 'no-repeat', |
|
|
display: 'flex', alignItems: 'flex-end', |
|
|
display: 'flex', alignItems: 'flex-end', lineHeight: "40px" |
|
|
}}> |
|
|
}}> |
|
|
<div style={{ width: 80 }}>地点</div> |
|
|
<div style={{ width: 80, fontFamily: "SourceHanSansCN-Normal", fontStyle: 'italic', textAlign: "center" }}>地点</div> |
|
|
<div>编号</div> |
|
|
<div style={{ fontFamily: "SourceHanSansCN-Normal", fontStyle: 'italic', width: "calc(100% - 80px)", textAlign: "center" }}>编号</div> |
|
|
</div> |
|
|
</div> |
|
|
<SimpleBar |
|
|
<SimpleBar |
|
|
style={{ |
|
|
style={{ |
|
|
@ -178,20 +178,15 @@ const Basis = ({ actions, dispatch, setshowData }) => { |
|
|
display: 'flex', alignItems: 'center', marginTop: 6, width: '100%', height: 36, |
|
|
display: 'flex', alignItems: 'center', marginTop: 6, width: '100%', height: 36, |
|
|
backgroundImage: 'linear-gradient(180deg, #000e28e6 1%, #021f48cc 100%)' |
|
|
backgroundImage: 'linear-gradient(180deg, #000e28e6 1%, #021f48cc 100%)' |
|
|
}}> |
|
|
}}> |
|
|
<div style={{ width: 76, overflow: 'hidden', whiteSpace: 'nowrap', textOverflow: 'ellipsis', }}>{v.name}</div> |
|
|
<div title={v.name} style={{ width: 76, margin: '0 12px', overflow: 'hidden', whiteSpace: 'nowrap', textOverflow: 'ellipsis', fontFamily: "SourceHanSansCN-Normal", fontStyle: 'italic' }}>{v.name}</div> |
|
|
<div > |
|
|
<div > |
|
|
{v.data?.map((s, i) => <img style={{ width: 20, height: 20, marginLeft: 3 }} src={`/assets/images/number/${[2, 4, 6].includes(s.data[0]?.sMotor_State) ? 'problem' : 'good'}${i + 1}.png`} />) |
|
|
{v.data?.map((s, i) => <img style={{ width: 20, height: 20, marginLeft: 3 }} src={`/assets/images/number/${[2, 4, 6].includes(s.data[0]?.sMotor_State) ? 'problem' : 'good'}${i + 1}.png`} />) |
|
|
|
|
|
|
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</div>)} |
|
|
</div>)} |
|
|
</SimpleBar> |
|
|
</SimpleBar> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
</div> |
|
|
</div> |
|
|
@ -207,7 +202,7 @@ const Basis = ({ actions, dispatch, setshowData }) => { |
|
|
backgroundImage: 'url(/assets/images/monitor/lower-left.png)', |
|
|
backgroundImage: 'url(/assets/images/monitor/lower-left.png)', |
|
|
backgroundSize: '100% 100%', backgroundPosition: 'center', backgroundRepeat: 'no-repeat', |
|
|
backgroundSize: '100% 100%', backgroundPosition: 'center', backgroundRepeat: 'no-repeat', |
|
|
}}> |
|
|
}}> |
|
|
<img style={{ width: 40, height: 40, position: 'absolute', left: 12, top: -18, }} src='/assets/images/monitor/pumpPO.png' /> |
|
|
<img style={{ width: 40, height: 40, position: 'absolute', left: 12, top: -18, }} src='/assets/images/monitor/pumpPo.png' /> |
|
|
泵站数量：{siteList?.length || 0} |
|
|
泵站数量：{siteList?.length || 0} |
|
|
</div> |
|
|
</div> |
|
|
<div style={{ |
|
|
<div style={{ |
|
|
|
