50 lines
1.7 KiB
JavaScript
50 lines
1.7 KiB
JavaScript
|
import { useEffect, useState, useMemo } from "react"
|
||
|
|
import {useDispatch, useSelector} from "react-redux";
|
||
|
|
import {Descriptions} from "antd";
|
||
|
|
import ReactEcharts from 'echarts-for-react';
|
||
|
|
import drpOption from './drpOption'
|
||
|
|
import { httppost2 } from "../../../../utils/request";
|
||
|
|
import apiurl from "../../../../service/apiurl";
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
const Page = () => {
|
||
|
|
const [data,setData] = useState([])
|
||
|
|
const option = useMemo(() => {
|
||
|
|
return drpOption({data});
|
||
|
|
}, [data])
|
||
|
|
|
||
|
|
useEffect(()=>{
|
||
|
|
(async()=>{
|
||
|
|
const {data,code} = await httppost2(apiurl.dataResourcesCenter.projectAndWater.xl.list,{stcd:'61610700'})
|
||
|
|
if(code!==200){
|
||
|
|
return
|
||
|
|
}
|
||
|
|
setData(data)
|
||
|
|
})()
|
||
|
|
},[])
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
return (
|
||
|
|
<>
|
||
|
|
<div style={{width:'100%',height:'240px'}}>
|
||
|
|
<ReactEcharts
|
||
|
|
option={option}
|
||
|
|
style={{width: "100%", height: '100%'}}
|
||
|
|
/>
|
||
|
|
</div>
|
||
|
|
<div style={{padding:'15px 0px 10px 15px'}}>
|
||
|
|
<Descriptions column={2}>
|
||
|
|
<Descriptions.Item labelStyle={{color:"#8c8c8c"}} label="实时水位">{103.89}m</Descriptions.Item>
|
||
|
|
<Descriptions.Item labelStyle={{color:"#70B603"}} label="转换溢洪流量">{0.20}m³/s</Descriptions.Item>
|
||
|
|
<Descriptions.Item labelStyle={{color:"#8c8c8c"}} label="近24h溢洪量">{8.67}万m³</Descriptions.Item>
|
||
|
|
<Descriptions.Item labelStyle={{color:"#8c8c8c"}} label="采集时间">{'06-24 09:30'}</Descriptions.Item>
|
||
|
|
</Descriptions>
|
||
|
|
</div>
|
||
|
|
</>
|
||
|
|
)
|
||
|
|
}
|
||
|
|
|
||
|
|
export default Page
|