qzc修改首页

qzc-dev-demo
秦子超 2025-04-02 09:38:49 +08:00
parent c5b4fbdebd
commit 521c2d75b0
28 changed files with 379 additions and 445 deletions

View File

@ -125,7 +125,7 @@ export const SkRealPromiseWX = new CachePromise(
// }) // })
// .catch(() => null), // .catch(() => null),
// 5000 // 5000
() => httppost2(apiurl.home.sk) () => httppost2(apiurl.sssq.reservoirlist)//home.sk
.then(({ data }) => data || []) .then(({ data }) => data || [])
.then((data) => { .then((data) => {
// if (config.notShowPOI?.hd) { // if (config.notShowPOI?.hd) {

View File

@ -96,8 +96,12 @@ const apiurl = {
azd: service_fxdd + '/shpPlacement/getDetailsAndAddvcdDataList',//安置点 azd: service_fxdd + '/shpPlacement/getDetailsAndAddvcdDataList',//安置点
getqsydw: service_fxdd + '/iaCBsnssinfo/getDetailsAndAddvcdDataList',//企事业单位list getqsydw: service_fxdd + '/iaCBsnssinfo/getDetailsAndAddvcdDataList',//企事业单位list
getyhjmh: service_fxdd + '/iaCFlrvvlg/getDetailsAndAddvcdDataList',//沿河居民户list getyhjmh: service_fxdd + '/iaCFlrvvlg/getDetailsAndAddvcdDataList',//沿河居民户list
turangshangqing: '', turangshangqing: service_fxdd + '/soilMoisture/stationList',
turangList: service_fxdd + '/soilMoisture/page',
turangCount: service_fxdd + '/soilMoisture/count/',
yihongList: service_fxdd + '/stZqrlB/flowList',
yihongCount: service_fxdd + '/stZqrlB/count/',
yihongCount24: service_fxdd + '/stZqrlB/count24/',
wxqdetail: service_fxdd + '/iaCDanad/detail', wxqdetail: service_fxdd + '/iaCDanad/detail',
anzhidian: service_fxdd + '/shpPlacement/getDetailsAndAddvcdDataList',//安置点 anzhidian: service_fxdd + '/shpPlacement/getDetailsAndAddvcdDataList',//安置点
@ -938,7 +942,7 @@ const apiurl = {
list: service_fxdd + '/river/water/list', //实时水情-河道水情列表 list: service_fxdd + '/river/water/list', //实时水情-河道水情列表
warn: service_fxdd + '/current/situation/rv/warn', //实时水情-河道水情统计 warn: service_fxdd + '/current/situation/rv/warn', //实时水情-河道水情统计
summaryInfo: service_fxdd + '/river/water/summaryInfo', //实时水情-河道水情汇总 summaryInfo: service_fxdd + '/river/water/summaryInfo', //实时水情-河道水情汇总
reservoirlist: service_fxdd + '/reservoir/water/list', //实时水情-水库水情列表 reservoirlist: service_fxdd + '/reservoir/water/listV2',//'/reservoir/water/list', //实时水情-水库水情列表
reswarn: service_fxdd + '/current/situation/res/warn', //实时水情-水库水情统计 reswarn: service_fxdd + '/current/situation/res/warn', //实时水情-水库水情统计
reservoirsummaryInfo: service_fxdd + '/reservoir/water/summaryInfo', //实时水情-水库水情汇总 reservoirsummaryInfo: service_fxdd + '/reservoir/water/summaryInfo', //实时水情-水库水情汇总
//河道弹框详情 //河道弹框详情

View File

@ -25,7 +25,7 @@ export async function reservoirlist(params) {
} }
// const list = data?.filter(o => o.lgtd && o.lttd) // const list = data?.filter(o => o.lgtd && o.lttd)
return data; return data||[];
} }
@ -91,8 +91,9 @@ export async function getDetail(params) {
if (code !== 200) { if (code !== 200) {
message.error(msg || '请求失败'); message.error(msg || '请求失败');
return []
} }
return data; return data||[];
} }
//详情-水位流量关系 //详情-水位流量关系
@ -138,8 +139,9 @@ export async function reservoirmonitor(params) {
if (code !== 200) { if (code !== 200) {
message.error(msg || '请求失败'); message.error(msg || '请求失败');
return []
} }
return data; return data||[];
} }
//基本信息 //基本信息

View File

@ -94,7 +94,7 @@ export default class ShuiKuLayer extends BaseLayer {
// } // }
// }); // });
// } // }
const list = [...data,sj].map((i)=>{ const list = data.map((i)=>{
return { return {
id : i.stcd, id : i.stcd,
name: i.stnm, name: i.stnm,

View File

@ -1,7 +1,7 @@
// import clone from "clone"; // import clone from "clone";
import { PicStMapDataPromise } from "../../../../models/_/real"; import { PicStMapDataPromise } from "../../../../models/_/real";
import apiurl from "../../../../service/apiurl"; import apiurl from "../../../../service/apiurl";
import { httppost2 } from "../../../../utils/request"; import { httpget2, httppost2 } from "../../../../utils/request";
import BaseLayer from "../baselayer"; import BaseLayer from "../baselayer";
import TuRangMarker from "./TuRangMarker"; import TuRangMarker from "./TuRangMarker";
@ -19,29 +19,32 @@ export default class TuRangLayer extends BaseLayer {
} }
async onAdd() { async onAdd() {
// const res = await httppost2(apiurl.home.turangshangqing) const {data,code} = await httpget2(apiurl.home.turangshangqing)
const list = [ if(code !== 200){
{ return
id:'1', }
stcd: '10001', // const list = [
stnm: '水田站', // {
wd: '53', // id:'1',
tm: '2025-03-19 15:00:00', // stcd: '10001',
lgtd: "114.7684000", // stnm: '水田站',
lttd: "31.4941000" // wd: '53',
}, // tm: '2025-03-19 15:00:00',
{ // lgtd: "114.7684000",
id:'2', // lttd: "31.4941000"
stcd: '10002', // },
stnm: '旱田站', // {
wd: '21', // id:'2',
tm: '2025-03-19 15:00:00', // stcd: '10002',
lgtd: "114.7984000", // stnm: '旱田站',
lttd: "31.4941000" // wd: '21',
}, // tm: '2025-03-19 15:00:00',
] // lgtd: "114.7984000",
// lttd: "31.4941000"
// },
// ]
this._dispatch.runtime.setMarkers({ this._dispatch.runtime.setMarkers({
[this.getLayerName()]: list || [] [this.getLayerName()]: data || []
}); });
} }

View File

@ -6,8 +6,8 @@ import moment from 'moment'
const Tabledata = ({tableData}) => { const Tabledata = ({tableData}) => {
const columns = [ const columns = [
{ title: '序号', key: '', dataIndex: '', align: 'center',width:'40px',render:(a,b,c)=>c+1}, { title: '序号', key: '', dataIndex: '', align: 'center',width:'40px',render:(a,b,c)=>c+1},
{ title: '数据时间', key: 'tm', dataIndex: 'tm', align: 'center',width:'200px',render: (rec) => <span>{rec ?? "-"}</span> }, { title: '数据时间', key: 'createTime', dataIndex: 'createTime', align: 'center',width:'200px',render: (rec) => <span>{rec ?? "-"}</span> },
{ title: '度', key: '', dataIndex: '', align: 'center',render: (rec) => <span>{rec ?? "-"}</span> }, { title: '湿度', key: 'val', dataIndex: 'val', align: 'center',render: (rec) => <span>{rec ?? "-"}</span> },
]; ];
return ( return (

View File

@ -46,7 +46,7 @@ export default function drpOption(data,yjData) {
xAxis: [ xAxis: [
{ {
type: 'category', type: 'category',
data: data.map(o => o.tm), data: data.map(o => o.createTime),
inverse: false, inverse: false,
splitLine: { splitLine: {
show: false show: false
@ -150,7 +150,7 @@ export default function drpOption(data,yjData) {
lineStyle: { lineStyle: {
// type: "dashed" // type: "dashed"
}, },
data: data.map(o => o.value), data: data.map(o => o.val),
symbol: 'none', // 设置标记点为'none',即去掉圆点 symbol: 'none', // 设置标记点为'none',即去掉圆点
smooth: 0.5 smooth: 0.5
}, },

View File

@ -23,19 +23,22 @@ function ShenLiu({ id, data, dispatch, onCancel }) {
}; };
const getData = async(tms,stcd)=>{ const getData = async(tms,stcd)=>{
// const params = { const params = {
// type: 2, dateRangeSo: {
// dateTimeRangeSo: { start: moment(tms[0]).format('YYYY-MM-DD HH:mm:ss'),
// start: moment(tms[0]).format('YYYY-MM-DD HH:mm:ss'), end: moment(tms[1]).format('YYYY-MM-DD HH:mm:ss'),
// end: moment(tms[1]).format('YYYY-MM-DD HH:mm:ss'), },
// }, pageSo:{
// stcd pageSize:10,
// } pageNumber:1
// const { code, data} = await httppost2(apiurl.home.syslList,params) },
// if(code!==200){ stcd
// return }
// } const { code, data} = await httppost2(apiurl.home.turangList,params)
setTableData([]) if(code!==200){
return
}
setTableData(data?.records||[])
} }
useEffect(()=>{ useEffect(()=>{

View File

@ -90,6 +90,7 @@ function FeaturePops({ mapobj }) {
</Modal> </Modal>
) )
}else if (type === 'turangshangqing') { }else if (type === 'turangshangqing') {
//土壤墒情
return ( return (
<Modal width={1050} bodyStyle={{padding:0}} title={null} closable={false} footer={null} open={true} onCancel={()=>dispatch.runtime.closeFeaturePop(id)} destroyOnClose={true}> <Modal width={1050} bodyStyle={{padding:0}} title={null} closable={false} footer={null} open={true} onCancel={()=>dispatch.runtime.closeFeaturePop(id)} destroyOnClose={true}>
<TuRang id={id} data={data} dispatch={dispatch} record={data}/> <TuRang id={id} data={data} dispatch={dispatch} record={data}/>

View File

@ -91,8 +91,7 @@ const Page = () => {
const getData = async (params) => { const getData = async (params) => {
const data1 = await reservoirlist(params) const data1 = await reservoirlist(params)
const data2 = [...data1,sj] setData(data1)
setData(data2)
} }
const getShuiKu = ()=>{ const getShuiKu = ()=>{
@ -144,7 +143,7 @@ const Page = () => {
溢洪情况 溢洪情况
</div> </div>
</div> </div>
<Ykqk/> <Ykqk record={data[checked]}/>
</> </>
) )
} }

View File

@ -2,10 +2,6 @@ import echarts from 'echarts/lib/echarts';
export default function drpOption({data}) { export default function drpOption({data}) {
let arr =[]
data.forEach(item=>{
arr.push([item.w,item.rz])
})
return { return {
title: { title: {
// text: "库容曲线图", // text: "库容曲线图",
@ -34,7 +30,7 @@ export default function drpOption({data}) {
// name: "流量m³/s", // name: "流量m³/s",
nameGap: 0, nameGap: 0,
type: 'category', type: 'category',
data: data.map(o => o.bgtm), data: data.map(o => o.tm),
splitLine: { splitLine: {
show: false show: false
}, },
@ -89,7 +85,7 @@ export default function drpOption({data}) {
type: 'line', type: 'line',
name: '溢洪流量', name: '溢洪流量',
color: "#7699f3", color: "#7699f3",
data: data.map(o => o.q), data: data.map(o => o.flowNum),
// symbol: 'none' // 设置标记点为'none',即去掉圆点 // symbol: 'none' // 设置标记点为'none',即去掉圆点
symbolSize:8, symbolSize:8,
areaStyle: { areaStyle: {

View File

@ -3,26 +3,49 @@ import {useDispatch, useSelector} from "react-redux";
import {Descriptions} from "antd"; import {Descriptions} from "antd";
import ReactEcharts from 'echarts-for-react'; import ReactEcharts from 'echarts-for-react';
import drpOption from './drpOption' import drpOption from './drpOption'
import { httppost2 } from "../../../../utils/request"; import { httpget2, httppost2 } from "../../../../utils/request";
import apiurl from "../../../../service/apiurl"; import apiurl from "../../../../service/apiurl";
import moment from "moment";
const Page = () => { const Page = ({record}) => {
const [data,setData] = useState([]) const [data,setData] = useState([])
const [count ,setCount] = useState({})
const option = useMemo(() => { const option = useMemo(() => {
return drpOption({data}); return drpOption({data});
}, [data]) }, [data])
useEffect(()=>{ useEffect(()=>{
(async()=>{ if(record?.stcd){
const {data,code} = await httppost2(apiurl.dataResourcesCenter.projectAndWater.xl.list,{stcd:'61610700'}) getData(record.stcd)
if(code!==200){ getCount(record.stcd)
return }
} },[record])
setData(data)
})()
},[]) const getData = async(stcd)=>{
const pam = {
dateSo:{
start:moment().add(-1,'month').format('YYYY-MM-DD HH:mm:ss'),
end:moment().format('YYYY-MM-DD HH:mm:ss'),
},
stcd
}
const { code, data } = await httppost2(apiurl.home.yihongList,pam)
if(code!==200){
return
}
setData(data)
}
const getCount = async(stcd)=>{
const { code, data } = await httpget2(apiurl.home.yihongCount24+stcd)
if(code!==200){
return
}
setCount(data)
}
@ -36,10 +59,10 @@ const Page = () => {
</div> </div>
<div style={{padding:'15px 0px 10px 15px'}}> <div style={{padding:'15px 0px 10px 15px'}}>
<Descriptions column={2}> <Descriptions column={2}>
<Descriptions.Item labelStyle={{color:"#8c8c8c"}} label="实时水位">{103.89}m</Descriptions.Item> <Descriptions.Item labelStyle={{color:"#8c8c8c"}} label="实时水位">{count.currWaterLevel}m</Descriptions.Item>
<Descriptions.Item labelStyle={{color:"#70B603"}} label="转换溢洪流量">{0.20}/s</Descriptions.Item> <Descriptions.Item labelStyle={{color:"#70B603"}} label="转换溢洪流量">{count.flowNum}/s</Descriptions.Item>
<Descriptions.Item labelStyle={{color:"#8c8c8c"}} label="近24h溢洪量">{8.67}万m³</Descriptions.Item> <Descriptions.Item labelStyle={{color:"#8c8c8c"}} label="近24h溢洪量"><span style={{letterSpacing:'-1px'}}>{count.sum24} </span></Descriptions.Item>
<Descriptions.Item labelStyle={{color:"#8c8c8c"}} label="采集时间">{'06-24 09:30'}</Descriptions.Item> <Descriptions.Item labelStyle={{color:"#8c8c8c"}} label="采集时间"><span style={{letterSpacing:'-1px'}}>{count.createTime?.slice(5,16)}</span></Descriptions.Item>
</Descriptions> </Descriptions>
</div> </div>
</> </>

View File

@ -1,17 +1,16 @@
import { useEffect, useState } from "react" import { useEffect, useState } from "react"
import {useDispatch, useSelector} from "react-redux"; import {useDispatch, useSelector} from "react-redux";
import { Table, Modal, message } from 'antd'; import { Table, Modal, message } from 'antd';
import { httppost2 } from '../../../utils/request'; import { httpget2, httppost2 } from '../../../utils/request';
import apiurl from '../../../service/apiurl'; import apiurl from '../../../service/apiurl';
const Page = () => { const Page = () => {
const dispatch = useDispatch(); const dispatch = useDispatch();
const [ tableData, setTableData ] = useState([])//在线 const [ tableData, setTableData ] = useState([])//在线
const columns = [ const columns = [
{ title: '站点', key: 'stnm', dataIndex: 'stnm',align: "center",width:80, ellipsis: true, }, { title: '站点', key: 'stnm', dataIndex: 'stnm',align: "center",width:80, ellipsis: true, },
{ title: '温度', key: 'wd', dataIndex: 'wd',align: "center",width:80, ellipsis: true, }, { title: '湿度', key: 'val', dataIndex: 'val',align: "center",width:80, ellipsis: true,render:(v)=>typeof v ==='number'?v.toFixed(2):'' },
{ title: '监测时间', key: 'tm', dataIndex: 'tm',align: "center",width: 150, ellipsis: true }, { title: '监测时间', key: 'tm', dataIndex: 'tm',align: "center",width: 150, ellipsis: true },
]; ];
@ -24,34 +23,12 @@ const Page = () => {
},[]) },[])
const getData = async()=>{ const getData = async()=>{
// const { code, data} = await httppost2(apiurl.home.turangshangqing) const { code, data} = await httpget2(apiurl.home.turangshangqing)
// if(code!==200){ if(code!==200){
// return return
// } }
const list = [
{
id:'1',
stcd: '10001',
stnm: '水田站',
wd: '53',
tm: '2025-03-19 15:00:00',
lgtd: "114.7684000",
lttd: "31.4941000"
},
{
id:'2',
stcd: '10002',
stnm: '旱田站',
wd: '21',
tm: '2025-03-19 15:00:00',
lgtd: "114.7984000",
lttd: "31.4941000"
},
]
setTableData(data||[])
setTableData(list)
} }

View File

@ -59,24 +59,11 @@ export default function Page({isHome}) {
const getSyData = async()=>{ const getSyData = async()=>{
const {code, data} = await httpget2(apiurl.home.sy) const {code, data} = await httpget2(apiurl.home.sy)
const list = []
const c = ['01','04','07','16','10','13','02','05','08','17','11','14','03','06','09','12','15','24','26','28','25','27','29','18','19','20','21','22','23']
.map((i)=>{
list.push({
"stationCode": "SY"+i,
"profileName": "B0+250",
"tm": "2024-10-10 08:00:00",
"value": 195.3,
"flag": 1,
"status": 0
})
})
if(code!==200){ if(code!==200){
return return
} }
setSyList(list) setSyList(data||[])
} }
const getSlData = async()=>{ const getSlData = async()=>{
@ -85,15 +72,7 @@ export default function Page({isHome}) {
return return
} }
const list = [{ setSlList(data||[])
"stationCode": "SL01",
"profileName": null,
"tm": "2024-10-27 08:00:00",
"value": 1.18,
"flag": 1,
"status": 0
}]
setSlList(list)
} }
const getWyData = async()=>{ const getWyData = async()=>{
@ -101,35 +80,7 @@ export default function Page({isHome}) {
if(code!==200){ if(code!==200){
return return
} }
const list = [] setWyList(data||[])
for(let a=1; a<33; a++){
list.push({
"stationCode": "WY"+(a<10?('0'+a):a),
"tm": "2024-10-15 08:00:00",
"flag": 1,
"x": -0.09,
"y": 0.1,
"h": 0.12,
"xstatus": 0,
"ystatus": 0,
"hstatus": 0
})
}
for(let b=1; b<37; b++){
list.push({
"stationCode": "ZY"+(b<10?('0'+b):b),
"tm": "2024-10-15 08:00:00",
"flag": 1,
"x": -0.09,
"y": 0.1,
"h": 0.12,
"xstatus": 0,
"ystatus": 0,
"hstatus": 0
})
}
setWyList(list)
} }
const getDmData = async()=>{ const getDmData = async()=>{

View File

@ -288,280 +288,280 @@
top: 1490px; top: 1490px;
} }
.gcaqjc_bzt_wy_WY01{ .gcaqjc_bzt_wy_WY-01{
left: 961px; left: 961px;
top: 1003px; top: 1003px;
} }
.gcaqjc_bzt_wy_WY02{ .gcaqjc_bzt_wy_WY-02{
left: 971px; left: 971px;
top: 872px; top: 872px;
} }
.gcaqjc_bzt_wy_WY03{ .gcaqjc_bzt_wy_WY-03{
left: 979px; left: 979px;
top: 764px; top: 764px;
} }
.gcaqjc_bzt_wy_WY04{ .gcaqjc_bzt_wy_WY-04{
left: 986px; left: 986px;
top: 650px; top: 650px;
} }
.gcaqjc_bzt_wy_WY05{ .gcaqjc_bzt_wy_WY-05{
left: 981px; left: 981px;
top: 547px; top: 547px;
} }
.gcaqjc_bzt_wy_WY06{ .gcaqjc_bzt_wy_WY-06{
left: 973px; left: 973px;
top: 443px; top: 443px;
} }
.gcaqjc_bzt_wy_WY07{ .gcaqjc_bzt_wy_WY-07{
left: 965px; left: 965px;
top: 327px; top: 327px;
} }
.gcaqjc_bzt_wy_WY08{ .gcaqjc_bzt_wy_WY-08{
left: 974px; left: 974px;
top: 1004px; top: 1004px;
} }
.gcaqjc_bzt_wy_WY09{ .gcaqjc_bzt_wy_WY-09{
left: 983px; left: 983px;
top: 876px; top: 876px;
} }
.gcaqjc_bzt_wy_WY10{ .gcaqjc_bzt_wy_WY-10{
left: 992px; left: 992px;
top: 766px; top: 766px;
} }
.gcaqjc_bzt_wy_WY11{ .gcaqjc_bzt_wy_WY-11{
left: 996px; left: 996px;
top: 656px; top: 656px;
} }
.gcaqjc_bzt_wy_WY12{ .gcaqjc_bzt_wy_WY-12{
left: 993px; left: 993px;
top: 546px; top: 546px;
} }
.gcaqjc_bzt_wy_WY13{ .gcaqjc_bzt_wy_WY-13{
left: 986px; left: 986px;
top: 436px; top: 436px;
} }
.gcaqjc_bzt_wy_WY14{ .gcaqjc_bzt_wy_WY-14{
left: 978px; left: 978px;
top: 325.5px; top: 325.5px;
} }
.gcaqjc_bzt_wy_WY15{ .gcaqjc_bzt_wy_WY-15{
left: 1031px; left: 1031px;
top: 1009px; top: 1009px;
} }
.gcaqjc_bzt_wy_WY16{ .gcaqjc_bzt_wy_WY-16{
left: 1045px; left: 1045px;
top: 879px; top: 879px;
} }
.gcaqjc_bzt_wy_WY17{ .gcaqjc_bzt_wy_WY-17{
left: 1049px; left: 1049px;
top: 771px; top: 771px;
} }
.gcaqjc_bzt_wy_WY18{ .gcaqjc_bzt_wy_WY-18{
left: 1061px; left: 1061px;
top: 663px; top: 663px;
} }
.gcaqjc_bzt_wy_WY19{ .gcaqjc_bzt_wy_WY-19{
left: 1050px; left: 1050px;
top: 543px; top: 543px;
} }
.gcaqjc_bzt_wy_WY20{ .gcaqjc_bzt_wy_WY-20{
left: 1045px; left: 1045px;
top: 434px; top: 434px;
} }
.gcaqjc_bzt_wy_WY21{ .gcaqjc_bzt_wy_WY-21{
left: 1037px; left: 1037px;
top: 322px; top: 322px;
} }
.gcaqjc_bzt_wy_WY22{ .gcaqjc_bzt_wy_WY-22{
left: 1070px; left: 1070px;
top: 1012px; top: 1012px;
} }
.gcaqjc_bzt_wy_WY23{ .gcaqjc_bzt_wy_WY-23{
left: 1079px; left: 1079px;
top: 882px; top: 882px;
} }
.gcaqjc_bzt_wy_WY24{ .gcaqjc_bzt_wy_WY-24{
left: 1088px; left: 1088px;
top: 774px; top: 774px;
} }
.gcaqjc_bzt_wy_WY25{ .gcaqjc_bzt_wy_WY-25{
left: 1091px; left: 1091px;
top: 666px; top: 666px;
} }
.gcaqjc_bzt_wy_WY26{ .gcaqjc_bzt_wy_WY-26{
left: 1088px; left: 1088px;
top: 542px; top: 542px;
} }
.gcaqjc_bzt_wy_WY27{ .gcaqjc_bzt_wy_WY-27{
left: 1081px; left: 1081px;
top: 432.5px; top: 432.5px;
} }
.gcaqjc_bzt_wy_WY28{ .gcaqjc_bzt_wy_WY-28{
left: 1040px; left: 1040px;
top: 20px; top: 20px;
} }
.gcaqjc_bzt_wy_WY29{ .gcaqjc_bzt_wy_WY-29{
left: 974px; left: 974px;
top: 95px; top: 95px;
} }
.gcaqjc_bzt_wy_WY30{ .gcaqjc_bzt_wy_WY-30{
left: 1057px; left: 1057px;
top: 34px; top: 34px;
} }
.gcaqjc_bzt_wy_WY31{ .gcaqjc_bzt_wy_WY-31{
left: 991px; left: 991px;
top: 111px; top: 111px;
} }
.gcaqjc_bzt_wy_WY32{ .gcaqjc_bzt_wy_WY-32{
left: 660px; left: 660px;
top: 1266px; top: 1266px;
} }
.gcaqjc_bzt_wy_ZY01{ .gcaqjc_bzt_wy_ZY-01{
left: 55px; left: 55px;
top: 1465px; top: 1465px;
} }
.gcaqjc_bzt_wy_ZY02{ .gcaqjc_bzt_wy_ZY-02{
left: 23px; left: 23px;
top: 1455px; top: 1455px;
} }
.gcaqjc_bzt_wy_ZY03{ .gcaqjc_bzt_wy_ZY-03{
left: 48px; left: 48px;
top: 1503px; top: 1503px;
} }
.gcaqjc_bzt_wy_ZY04{ .gcaqjc_bzt_wy_ZY-04{
left: 16px; left: 16px;
top: 1493px; top: 1493px;
} }
.gcaqjc_bzt_wy_ZY05{ .gcaqjc_bzt_wy_ZY-05{
left: 1080px; left: 1080px;
top: 67px; top: 67px;
} }
.gcaqjc_bzt_wy_ZY06{ .gcaqjc_bzt_wy_ZY-06{
left: 1104px; left: 1104px;
top: 98px; top: 98px;
} }
.gcaqjc_bzt_wy_ZY07{ .gcaqjc_bzt_wy_ZY-07{
left: 1128px; left: 1128px;
top: 129px; top: 129px;
} }
.gcaqjc_bzt_wy_ZY08{ .gcaqjc_bzt_wy_ZY-08{
left: 1151px; left: 1151px;
top: 158px; top: 158px;
} }
.gcaqjc_bzt_wy_ZY09{ .gcaqjc_bzt_wy_ZY-09{
left: 1176px; left: 1176px;
top: 185px; top: 185px;
} }
.gcaqjc_bzt_wy_ZY10{ .gcaqjc_bzt_wy_ZY-10{
left: 1203px; left: 1203px;
top: 208px; top: 208px;
} }
.gcaqjc_bzt_wy_ZY11{ .gcaqjc_bzt_wy_ZY-11{
left: 1233px; left: 1233px;
top: 234px; top: 234px;
} }
.gcaqjc_bzt_wy_ZY12{ .gcaqjc_bzt_wy_ZY-12{
left: 1259px; left: 1259px;
top: 255px; top: 255px;
} }
.gcaqjc_bzt_wy_ZY13{ .gcaqjc_bzt_wy_ZY-13{
left: 1288px; left: 1288px;
top: 281px; top: 281px;
} }
.gcaqjc_bzt_wy_ZY14{ .gcaqjc_bzt_wy_ZY-14{
left: 1314px; left: 1314px;
top: 304px; top: 304px;
} }
.gcaqjc_bzt_wy_ZY15{ .gcaqjc_bzt_wy_ZY-15{
left: 1344px; left: 1344px;
top: 328px; top: 328px;
} }
.gcaqjc_bzt_wy_ZY16{ .gcaqjc_bzt_wy_ZY-16{
left: 1026px; left: 1026px;
top: 133px; top: 133px;
} }
.gcaqjc_bzt_wy_ZY17{ .gcaqjc_bzt_wy_ZY-17{
left: 1058px; left: 1058px;
top: 153px; top: 153px;
} }
.gcaqjc_bzt_wy_ZY18{ .gcaqjc_bzt_wy_ZY-18{
left: 1092px; left: 1092px;
top: 172px; top: 172px;
} }
.gcaqjc_bzt_wy_ZY19{ .gcaqjc_bzt_wy_ZY-19{
left: 1124px; left: 1124px;
top: 192px; top: 192px;
} }
.gcaqjc_bzt_wy_ZY20{ .gcaqjc_bzt_wy_ZY-20{
left: 1152px; left: 1152px;
top: 213px; top: 213px;
} }
.gcaqjc_bzt_wy_ZY21{ .gcaqjc_bzt_wy_ZY-21{
left: 1181px; left: 1181px;
top: 234px; top: 234px;
} }
.gcaqjc_bzt_wy_ZY22{ .gcaqjc_bzt_wy_ZY-22{
left: 1210px; left: 1210px;
top: 259px; top: 259px;
} }
.gcaqjc_bzt_wy_ZY23{ .gcaqjc_bzt_wy_ZY-23{
left: 1237px; left: 1237px;
top: 283px; top: 283px;
} }
.gcaqjc_bzt_wy_ZY24{ .gcaqjc_bzt_wy_ZY-24{
left: 1266px; left: 1266px;
top: 308px; top: 308px;
} }
.gcaqjc_bzt_wy_ZY25{ .gcaqjc_bzt_wy_ZY-25{
left: 1292px; left: 1292px;
top: 330px; top: 330px;
} }
.gcaqjc_bzt_wy_ZY26{ .gcaqjc_bzt_wy_ZY-26{
left: 1320px; left: 1320px;
top: 354px; top: 354px;
} }
.gcaqjc_bzt_wy_ZY27{ .gcaqjc_bzt_wy_ZY-27{
left: 1213px; left: 1213px;
top: 198px; top: 198px;
} }
.gcaqjc_bzt_wy_ZY28{ .gcaqjc_bzt_wy_ZY-28{
left: 1242px; left: 1242px;
top: 224px; top: 224px;
} }
.gcaqjc_bzt_wy_ZY29{ .gcaqjc_bzt_wy_ZY-29{
left: 1268px; left: 1268px;
top: 245px; top: 245px;
} }
.gcaqjc_bzt_wy_ZY30{ .gcaqjc_bzt_wy_ZY-30{
left: 1297px; left: 1297px;
top: 271px; top: 271px;
} }
.gcaqjc_bzt_wy_ZY31{ .gcaqjc_bzt_wy_ZY-31{
left: 1324px; left: 1324px;
top: 293px; top: 293px;
} }
.gcaqjc_bzt_wy_ZY32{ .gcaqjc_bzt_wy_ZY-32{
left: 1251px; left: 1251px;
top: 213px; top: 213px;
} }
.gcaqjc_bzt_wy_ZY33{ .gcaqjc_bzt_wy_ZY-33{
left: 1277px; left: 1277px;
top: 234px; top: 234px;
} }
.gcaqjc_bzt_wy_ZY34{ .gcaqjc_bzt_wy_ZY-34{
left: 1307px; left: 1307px;
top: 259px; top: 259px;
} }
.gcaqjc_bzt_wy_ZY35{ .gcaqjc_bzt_wy_ZY-35{
left: 1261px; left: 1261px;
top: 202px; top: 202px;
} }
.gcaqjc_bzt_wy_ZY36{ .gcaqjc_bzt_wy_ZY-36{
left: 1289px; left: 1289px;
top: 219px; top: 219px;
} }

View File

@ -8,72 +8,7 @@ import { helpers } from '@turf/turf';
import { Label } from 'react-konva'; import { Label } from 'react-konva';
const sj = {
"stcd": "61610701",
"stnm": "檀树岗2",
"rvnm": "檀树岗河",
"hnnm": "长江中游下段北岸",
"bsnm": "长江",
"lgtd": "114.744317000",
"lttd": "31.505000000",
"stlc": "黄冈市红安县七里镇檀树岗村",
"alt": null,
"mdbz": null,
"mdpr": null,
"dtmnm": "吴淞",
"dtmel": null,
"dtpr": "0.000",
"sttp": "RR",
"dfrtms": null,
"fritm": null,
"frgrd": "3",
"esstym": "197103",
"bgfrym": "197103",
"edfrym": null,
"atcunit": "黄冈市水利和湖泊局",
"admauth": "黄冈水文",
"locality": "湖北水文",
"stbk": null,
"stazt": null,
"dstrvm": null,
"drna": "78",
"phcd": "TSG",
"usfl": "1",
"comments": "中小河流改造",
"moditime": "2022-02-23 00:00:00",
"remGd": null,
"ogid": null,
"vlfl": null,
"atid": null,
"sdfl": null,
"rma": null,
"mdps": null,
"mddt": null,
"stindex": null,
"starea": null,
"stlevel": null,
"code": null,
"ispbj": null,
"issxst": null,
"stpq": null,
"sthday": null,
"source": "SW",
"importancy": 0,
"clgtd": "114.744317000",
"clttd": "31.505000000",
"elev": null,
"crucial": 0,
"buildYear": null,
"adcd": null,
"lyid": null,
"resCode": "42120250085",
"rvCode": null,
"status": 1,
"agreement": null,
"simCard": null,
"bdCard": null,
"v": 104.1
}
export default function Sksq() { export default function Sksq() {
@ -81,8 +16,8 @@ export default function Sksq() {
const [selected, setSelected] = useState(0) const [selected, setSelected] = useState(0)
const getData = async (params) => { const getData = async (params) => {
const data = await await reservoirlist(params) const data = await reservoirlist(params)
setTableData([...data,sj]); setTableData(data);
} }
useEffect(() => { useEffect(() => {
let option = { let option = {

View File

@ -1,4 +1,4 @@
export default function drpOption(data,yjData) { export default function drpOption(data,records) {
console.log("data",data); console.log("data",data);
// const maxVal = 0//Math.max(...data.map(obj => obj.drp)) // const maxVal = 0//Math.max(...data.map(obj => obj.drp))
// const max1 = Math.max(...[...data.map(obj => obj.value),...yjData?.map(obj => obj.value)]) // const max1 = Math.max(...[...data.map(obj => obj.value),...yjData?.map(obj => obj.value)])
@ -28,26 +28,26 @@ export default function drpOption(data,yjData) {
}, },
grid: [ grid: [
{ {
top: "12%", top: "7%",
left: "10%", left: "15%",
right: "8%", right: "8%",
width: '80%', width: '83%',
height: '35%' height: '40%'
}, },
{ {
bottom: '5%', bottom: '5%',
left: '10%', left: '10%',
right: '8%', right: '8%',
width: '80%', width: '82%',
height: '35%' height: '38%'
} }
], ],
legend: { legend: {
top:'3%', top:'1%',
// 显示图例 // 显示图例
show: true, show: true,
// 图例的位置 // 图例的位置
data: ["库容","水位","汛限水位","设计水位","校核水位","溢洪流量"], data: ["溢洪流量","校核水位","设计水位","汛限水位","水位", "库容"],
}, },
xAxis: [ xAxis: [
{ {
@ -120,7 +120,7 @@ export default function drpOption(data,yjData) {
axisLabel: { axisLabel: {
color: '#8c8c8c', color: '#8c8c8c',
fontSize: 12, fontSize: 12,
formatter: val => val+'%' formatter: val => val+'m³/s'
}, },
axisLine: { axisLine: {
show: false show: false
@ -176,13 +176,13 @@ export default function drpOption(data,yjData) {
splitLine: { splitLine: {
show: false, show: false,
lineStyle: { lineStyle: {
color: '#07a6ff', color: '#bfbfbf',
width: 0.25, width: 0.5,
type: 'dotted' type: 'dotted'
} }
}, },
axisLabel: { axisLabel: {
color: '#333', color: '#8c8c8c',
fontSize: 12, fontSize: 12,
}, },
axisLine: { axisLine: {
@ -199,8 +199,10 @@ export default function drpOption(data,yjData) {
name: '溢洪流量', name: '溢洪流量',
type: 'line', type: 'line',
color: "#3478f4", color: "#3478f4",
data: data.map(o => o.kr), itemStyle: {
// symbol: 'none', // 设置标记点为'none',即去掉圆点 color: '#678ef2',
borderWidth: '0.3'
},
symbolSize:8, symbolSize:8,
areaStyle: { areaStyle: {
// 开启阴影 // 开启阴影
@ -210,51 +212,59 @@ export default function drpOption(data,yjData) {
shadowOffsetY: 5, // 阴影垂直方向上的偏移 shadowOffsetY: 5, // 阴影垂直方向上的偏移
opacity: 0.3 // 区域颜色的透明度 opacity: 0.3 // 区域颜色的透明度
}, },
data: data.map(o => o.flowNum),
// symbol: 'none', // 设置标记点为'none',即去掉圆点
}, },
{ {
xAxisIndex: 1,
yAxisIndex: 1,
name: '校核水位',
type: 'line',
color: "#da2f2d",
symbol: 'none', // 设置标记点为'none',即去掉圆点
data: data.map(o => records.calFloodLev),
// symbol: 'none', // 设置标记点为'none',即去掉圆点
},
{
xAxisIndex: 1,
yAxisIndex: 1,
name: '设计水位',
type: 'line',
color: "#e89e42",
symbol: 'none', // 设置标记点为'none',即去掉圆点
data: data.map(o => records.desFloodLev),
// symbol: 'none', // 设置标记点为'none',即去掉圆点
},
{
xAxisIndex: 1,
yAxisIndex: 1,
name: '汛限水位',
type: 'line',
color: "#f8dda7",
symbol: 'none', // 设置标记点为'none',即去掉圆点
data: data.map(o => records.flLowLimLev),
// symbol: 'none', // 设置标记点为'none',即去掉圆点
},
{
xAxisIndex: 1,
yAxisIndex: 1,
xAxisIndex: 1, xAxisIndex: 1,
yAxisIndex: 1, yAxisIndex: 1,
name: '水位', name: '水位',
type: 'line', type: 'line',
color: "#67ddb7", color: "#67ddb7",
symbol: 'none', // 设置标记点为'none',即去掉圆点 symbol: 'none', // 设置标记点为'none',即去掉圆点
data: data.map(o => o.sw), data: data.map(o => o.waterLevel),
// symbol: 'none', // 设置标记点为'none',即去掉圆点 // symbol: 'none', // 设置标记点为'none',即去掉圆点
}, },
{ {
name: '汛限水位', xAxisIndex: 1,
yAxisIndex: 2,
name: '库容',
type: 'line', type: 'line',
color: "#f8dda7", color: "#3478f4",
data: data.map(o => o.boxNum),
symbol: 'none', // 设置标记点为'none',即去掉圆点 symbol: 'none', // 设置标记点为'none',即去掉圆点
data: data.map(o => 130),
// symbol: 'none', // 设置标记点为'none',即去掉圆点
},
{
name: '设计水位',
type: 'line',
color: "#e89e42",
symbol: 'none', // 设置标记点为'none',即去掉圆点
data: data.map(o => 100),
// symbol: 'none', // 设置标记点为'none',即去掉圆点
},
{
name: '校核水位',
type: 'line',
color: "#da2f2d",
symbol: 'none', // 设置标记点为'none',即去掉圆点
data: data.map(o => 160),
// symbol: 'none', // 设置标记点为'none',即去掉圆点
},
{
name: '溢洪流量',
type: 'bar',
barWidth: '20%',
itemStyle: {
color: '#678ef2',
borderWidth: '0.3'
},
data: data.map(o => o.ll),
// symbol: 'none', // 设置标记点为'none',即去掉圆点
}, },
] ]
}; };

View File

@ -11,11 +11,16 @@ import { helpers } from '@turf/turf';
import NormalSelect from '../../../../components/Form/NormalSelect'; import NormalSelect from '../../../../components/Form/NormalSelect';
export default function Sksq() { export default function Sksq() {
const [selectList, setSelectList] = useState([]) const [selectList, setSelectList] = useState([])
// const [selected, setSelected] = useState(0) const [selected, setSelected] = useState(0)
const getList = async() => { const getList = async() => {
try { try {
const data = await reservoirlist() const data = await reservoirlist()
setSelectList(data) const list = data?.map((item,index)=>({
label:item.stnm,
value:index,
data:item
}))
setSelectList(list)
} catch (error) { } catch (error) {
console.log(error); console.log(error);
} }
@ -34,22 +39,22 @@ export default function Sksq() {
<div className='comomn-title'> <div className='comomn-title'>
<div style={{display:"flex",alignItems:"center",columnGap:0}}> <div style={{display:"flex",alignItems:"center",columnGap:0}}>
<img alt='' src={`${process.env.PUBLIC_URL}/assets/panelTitle.png`} /> <img alt='' src={`${process.env.PUBLIC_URL}/assets/panelTitle.png`} />
<span style={{marginLeft:10}}>土壤墒情</span> <span style={{marginLeft:10}}>实时数据</span>
</div> </div>
<div style={{display:"flex",columnGap:10,width:"25%",alignItems:"center"}}> <div style={{display:"flex",columnGap:10,width:"45%",alignItems:"center"}}>
<span>站点</span> <span style={{width:"18%"}}>站点</span>
{selectList?.[0]?.stnm} {/* {selectList?.[0]?.stnm} */}
{/* <NormalSelect <NormalSelect
style={{ width: '77%' }} style={{ width: '77%' }}
allowClear allowClear
options={selectList} options={selectList}
value={selected} value={selected}
onChange={(e) => setSelected(e)} onChange={(e) => setSelected(e)}
/> */} />
</div> </div>
</div> </div>
<div className='sssw-content'> <div className='sssw-content'>
<Sssw data={selectList?.[0] || {}}/> <Sssw data={selectList?.[selected]?.data || {}}/>
</div> </div>
</div> </div>
<div className='content-right' style={{display:'flex',flexDirection:'column'}}> <div className='content-right' style={{display:'flex',flexDirection:'column'}}>
@ -60,7 +65,7 @@ export default function Sksq() {
</div> </div>
</div> </div>
<div className='sjcx-content' style={{flex:1}}> <div className='sjcx-content' style={{flex:1}}>
<Sjcx data={selectList?.[0]?.data || {}}/> <Sjcx data={selectList?.[selected]?.data || {}}/>
</div> </div>
</div> </div>
</div> </div>

View File

@ -87,6 +87,7 @@
padding: 0 10px; padding: 0 10px;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
min-height: 600px;
.qth_skyh_sjcx_center_left{ .qth_skyh_sjcx_center_left{
width: 55%; width: 55%;
height: 100%; height: 100%;

View File

@ -12,40 +12,37 @@ export default function Sjcx({ data }) {
const stcd = data?.stcd||'' const stcd = data?.stcd||''
const [tms, setTms] = useState([moment().add(-1,'months'),moment()]) const [tms, setTms] = useState([moment().add(-1,'months'),moment()])
const [list, setList] = useState([]) const [list, setList] = useState([])
const option = useMemo(() => drpOption(list), [list]) const option = useMemo(() => drpOption(list,data), [list])
const columns = [ const columns = [
{ title: '时间', key: 'tm', dataIndex: 'tm', align: 'center',width:'120px',render: (rec) => <span>{rec.slice(5,16) ?? "-"}</span> }, { title: '时间', key: 'tm', dataIndex: 'tm', align: 'center',width:'120px',render: (rec) => <span>{rec.slice(5,16) ?? "-"}</span> },
{ title: '水位(m)', key: 'sw', dataIndex: 'sw', align: 'center',width:'80px',render: (rec) => <span>{rec ?? "-"}</span> }, { title: '水位(m)', key: 'waterLevel', dataIndex: 'waterLevel', align: 'center',render: (rec) => <span>{rec ?? "-"}</span> },
{ title: '库容(万m³)', key: 'kr', dataIndex: 'kr', align: 'center',render: (rec) => <span>{rec ?? "-"}</span> }, { title: '库容(万m³)', key: 'boxNum', dataIndex: 'boxNum', align: 'center',render: (rec) => <span>{rec ?? "-"}</span> },
{ title: '溢洪流量(m³/s)', key: 'll', dataIndex: 'll', align: 'center',render: (rec) => <span>{rec ?? "-"}</span> }, { title: '溢洪流量(m³/s)', key: 'flowNum', dataIndex: 'flowNum', align: 'center',render: (rec) => <span>{rec ?? "-"}</span> },
{ title: '累计溢洪量(万m³)', key: 'lj', dataIndex: 'lj', align: 'center',render: (rec) => <span>{rec ?? "-"}</span> }, { title: '累计溢洪量(万m³)', key: 'qtotal', dataIndex: 'qtotal', align: 'center',render: (rec) => <span>{ rec ?? "-"}</span> },
]; ];
useEffect(()=>{ useEffect(()=>{
getList(stcd,tms) if(stcd){
getList(stcd,tms)
}
},[stcd,tms]) },[stcd,tms])
const getList = async (stcd,tms)=>{ const getList = async (stcd,tms)=>{
const pam = { const pam = {
stm:tms[0].format('YYYY-MM-DD HH:mm:ss'), dateSo:{
etm:tms[1].format('YYYY-MM-DD HH:mm:ss'), start:moment(tms[0]).format('YYYY-MM-DD HH:mm:ss'),
end:moment(tms[1]).format('YYYY-MM-DD HH:mm:ss'),
},
stcd stcd
} }
// const res = await httppost2(apiurl) const { code, data } = await httppost2(apiurl.home.yihongList,pam)
const list = [] if(code!==200){
for (let i=0;i<10;i++){ return
list.push({
tm:'2023-02-07 12:'+(i+10)+':00',
sw:i+1+'.91',
kr:i+22+'.91',
ll:i+15+'.91',
lj:i+41+'.91',
})
} }
setList(list) setList(data)
} }
return ( return (
@ -56,7 +53,7 @@ export default function Sjcx({ data }) {
<div className='qth_skyh_sjcx_center'> <div className='qth_skyh_sjcx_center'>
<div className='qth_skyh_sjcx_center_left'> <div className='qth_skyh_sjcx_center_left'>
<Table <Table
owKey="adcd" owKey="tm"
sticky sticky
columns={columns} columns={columns}
pagination={false} pagination={false}

View File

@ -1,12 +1,15 @@
import React,{useState,useEffect} from 'react' import React,{useState,useEffect} from 'react'
import {queryStPptnDetails} from '../../../../service/ssyq' import {queryStPptnDetails} from '../../../../service/ssyq'
import { httppost2 } from '../../../../utils/request' import { httpget2, httppost2 } from '../../../../utils/request'
import apiurl from '../../../../service/apiurl' import apiurl from '../../../../service/apiurl'
export default function Sssw({ data }) { export default function Sssw({ data }) {
const [detail, setDetail] = useState({}) const [detail, setDetail] = useState({})
const getDetail = async (stcd) => { const getDetail = async (stcd) => {
// const res = await httppost2(apiurlhome.turangshangqing.{stcd}) const {code, data} = await httpget2(apiurl.home.yihongCount+stcd)
// setDetail{res} if(code!==200){
return
}
setDetail(data)
} }
useEffect(() => { useEffect(() => {
if (data.stcd) { if (data.stcd) {
@ -14,38 +17,45 @@ export default function Sssw({ data }) {
} }
}, [data]) }, [data])
const getVal = (v)=>{
if(typeof v === 'number'){
return v.toFixed(2)
}else{
return '-'
}
}
return ( return (
<div className="ssjc"> <div className="ssjc">
<div className="root"> <div className="root">
<div className="realinfo"> <div className="realinfo">
<div <div
className='report-time' className='report-time'
>数据更新时间: {detail?.tm}</div> >数据更新时间: {detail?.createTime}</div>
<div className='drp-content'> <div className='drp-content'>
<div className='drp-item'> <div className='drp-item'>
<div className='value'>{detail?.h ?? '-' }&nbsp;<span style={{fontSize:14}}>/s</span></div> <div className='value'>{getVal(detail?.val) ?? '-' }&nbsp;<span style={{fontSize:14}}>/s</span></div>
<div className='name'>溢洪流量</div> <div className='name'>溢洪流量</div>
</div> </div>
<div className='drp-item'> <div className='drp-item'>
<div className='value'>{detail?.h3 ?? '-' }&nbsp;<span style={{fontSize:14}}>万m³</span></div> <div className='value'>{getVal(detail?.currDayValSum) ?? '-' }&nbsp;<span style={{fontSize:14}}>万m³</span></div>
<div className='name'>当日溢洪量</div> <div className='name'>当日溢洪量</div>
</div> </div>
<div className='drp-item'> <div className='drp-item'>
<div className='value'>{detail?.h6 ?? '-' }&nbsp;<span style={{fontSize:14}}>万m³</span></div> <div className='value'>{getVal(detail?.currMonthSum) ?? '-' }&nbsp;<span style={{fontSize:14}}>万m³</span></div>
<div className='name'>当月溢洪量</div> <div className='name'>当月溢洪量</div>
</div> </div>
<div className='drp-item'> <div className='drp-item'>
<div className='value'>{detail?.h12 ?? '-' }&nbsp;<span style={{fontSize:14}}>万m³</span></div> <div className='value'>{getVal(detail?.currYearSum) ?? '-' }&nbsp;<span style={{fontSize:14}}>万m³</span></div>
<div className='name'>当年溢洪量</div> <div className='name'>当年溢洪量</div>
</div> </div>
<div className='drp-item'> <div className='drp-item'>
<div className='value'>{detail?.h24 ?? '-' }&nbsp;<span style={{fontSize:14}}></span></div> <div className='value'>{getVal(detail?.currYearCount) ?? '-' }&nbsp;<span style={{fontSize:14}}></span></div>
<div className='name'>本年溢洪次数</div> <div className='name'>本年溢洪次数</div>
</div> <div className='drp-item'> </div> <div className='drp-item'>
<div className='value'>{detail?.h48 ?? '-' }&nbsp;<span style={{fontSize:14}}>万m³</span></div> <div className='value'>{getVal(detail?.currYearMaxVal) ?? '-' }&nbsp;<span style={{fontSize:14}}>万m³</span></div>
<div className='name'>本年单次最大溢洪量</div> <div className='name'>本年单次最大溢洪量</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>

View File

@ -30,10 +30,10 @@ export default function drpOption(data,yjData) {
grid: [ grid: [
{ {
top: "12%", top: "12%",
left: "10%", left: "8%",
right: "8%", right: "1%",
width: '80%', width: '90%',
height: '75%' height: '80%'
}, },
], ],
legend: { legend: {
@ -46,7 +46,7 @@ export default function drpOption(data,yjData) {
xAxis: [ xAxis: [
{ {
type: 'category', type: 'category',
data: data.map(o => o.tm), data: data.map(o => o.createTime),
inverse: false, inverse: false,
splitLine: { splitLine: {
show: false show: false
@ -149,7 +149,7 @@ export default function drpOption(data,yjData) {
lineStyle: { lineStyle: {
// type: "dashed" // type: "dashed"
}, },
data: data.map(o => o.sd), data: data.map(o => o.val),
symbol: 'none', // 设置标记点为'none',即去掉圆点 symbol: 'none', // 设置标记点为'none',即去掉圆点
smooth: 0.5 smooth: 0.5
}, },

View File

@ -5,7 +5,7 @@ import Sssw from './sssw';
// import Sjcx from '../../../Home/MapCtrl/components/Jcsj/index' // import Sjcx from '../../../Home/MapCtrl/components/Jcsj/index'
import Sjcx from './sjcx' import Sjcx from './sjcx'
import "./index.less" import "./index.less"
import { httppost2 } from '../../../../utils/request'; import { httpget2, httppost2 } from '../../../../utils/request';
import apiurl from '../../../../service/apiurl'; import apiurl from '../../../../service/apiurl';
import { helpers } from '@turf/turf'; import { helpers } from '@turf/turf';
import NormalSelect from '../../../../components/Form/NormalSelect'; import NormalSelect from '../../../../components/Form/NormalSelect';
@ -29,28 +29,12 @@ export default function Sksq() {
const [selected, setSelected] = useState(0) const [selected, setSelected] = useState(0)
const getList = async() => { const getList = async() => {
try { try {
// const res = await httppost2(apiurl.home.turangshangqing) const {code, data} = await httpget2(apiurl.home.turangshangqing)
const res = [ if(code!==200){
{ return
id:'1', }
stcd: '10001',
stnm: '水田站', const list = data?.map((item,index)=>({
wd: '53',
tm: '2025-03-19 15:00:00',
lgtd: "114.7684000",
lttd: "31.4941000"
},
{
id:'2',
stcd: '10002',
stnm: '旱田站',
wd: '21',
tm: '2025-03-19 15:00:00',
lgtd: "114.7984000",
lttd: "31.4941000"
},
]
const list = res?.map((item,index)=>({
label:item.stnm, label:item.stnm,
value:index, value:index,
data:item data:item

View File

@ -86,6 +86,7 @@
padding: 0 10px; padding: 0 10px;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
// min-height: 600px;
.qth_trsq_sjcx_center_left{ .qth_trsq_sjcx_center_left{
width: 45%; width: 45%;
margin-bottom: 10px; margin-bottom: 10px;

View File

@ -2,7 +2,7 @@ import React,{useState,useEffect, useMemo} from 'react'
import {Table} from 'antd'; import {Table} from 'antd';
import ReactEcharts from 'echarts-for-react'; import ReactEcharts from 'echarts-for-react';
import {queryStPptnDetails} from '../../../../service/ssyq' import {queryStPptnDetails} from '../../../../service/ssyq'
import { httppost2 } from '../../../../utils/request' import { httpget2, httppost2 } from '../../../../utils/request'
import apiurl from '../../../../service/apiurl' import apiurl from '../../../../service/apiurl'
import moment from 'moment'; import moment from 'moment';
import Toolbar from './toolbar' import Toolbar from './toolbar'
@ -16,8 +16,8 @@ export default function Sjcx({ data }) {
const option = useMemo(() => drpOption(list), [list]) const option = useMemo(() => drpOption(list), [list])
const columns = [ const columns = [
{ title: '序号', key: '', dataIndex: '', align: 'center',width:'80px',render:(a,b,c)=>c+1}, { title: '序号', key: '', dataIndex: '', align: 'center',width:'80px',render:(a,b,c)=>c+1},
{ title: '数据时间', key: 'tm', dataIndex: 'tm', align: 'center',width:'200px',render: (rec) => <span>{rec ?? "-"}</span> }, { title: '数据时间', key: 'createTime', dataIndex: 'createTime', align: 'center',width:'200px',render: (rec) => <span>{rec ?? "-"}</span> },
{ title: '湿度', key: 'sd', dataIndex: 'sd', align: 'center',render: (rec) => <span>{rec ?? "-"}</span> }, { title: '湿度', key: 'val', dataIndex: 'val', align: 'center',render: (rec) => <span>{rec ?? "-"}</span> },
]; ];
@ -29,26 +29,45 @@ export default function Sjcx({ data }) {
},[stcd,tms]) },[stcd,tms])
const getList = async (stcd,tms)=>{ const getList = async (stcd,tms)=>{
const pam = { const params = {
stm:tms[0].format('YYYY-MM-DD HH:mm:ss'), dateRangeSo: {
etm:tms[1].format('YYYY-MM-DD HH:mm:ss'), start: moment(tms[0]).format('YYYY-MM-DD HH:mm:ss'),
end: moment(tms[1]).format('YYYY-MM-DD HH:mm:ss'),
},
pageSo:{
pageSize:10,
pageNumber:1
},
stcd stcd
} }
// const res = await httppost2(apiurl) const { code, data} = await httppost2(apiurl.home.turangList,params)
const list = [] if(code!==200){
for (let i=0;i<30;i++){ return
list.push({
tm:'2023-02-07 12:'+(i+10)+':00',
sd:i+7+'.91'
})
} }
setList(list) // const list = []
// for (let i=0;i<30;i++){
// list.push({
// tm:'2023-02-07 12:'+(i+10)+':00',
// sd:i+7+'.91'
// })
// }
setList(data?.records||[])
} }
const getCount = async (stcd)=>{ const getCount = async (stcd)=>{
// const res = await httppost2(apiurl) const {code, data} = await httpget2(apiurl.home.turangCount+stcd)
setCountObj({}) if(code!==200){
return
}
setCountObj(data)
} }
const getVal = (v)=>{
if(typeof v === 'number'){
return v.toFixed(2)
}else{
return '-'
}
}
return ( return (
<div className='qth_trsq_sjcx'> <div className='qth_trsq_sjcx'>
<div className='qth_trsq_sjcx_top'> <div className='qth_trsq_sjcx_top'>
@ -68,7 +87,7 @@ export default function Sjcx({ data }) {
<div className='qth_trsq_sjcx_center_right'> <div className='qth_trsq_sjcx_center_right'>
{ {
list.length>0? list.length>0?
<ReactEcharts option={option} style={{width: "100%", height: '100%'}}/> <ReactEcharts option={option} style={{width: "100%", height: '400px'}}/>
:<div style={{textAlign: "center", margin: "10%"}}><img src={`${process.env.PUBLIC_URL}/assets/noData.png`} alt=""/></div> :<div style={{textAlign: "center", margin: "10%"}}><img src={`${process.env.PUBLIC_URL}/assets/noData.png`} alt=""/></div>
} }
</div> </div>
@ -77,37 +96,37 @@ export default function Sjcx({ data }) {
<div className="footer-row"> <div className="footer-row">
<div className="footer-item"> <div className="footer-item">
<div className="footer-name">本周(极值,RH)</div> <div className="footer-name">本周(极值,RH)</div>
<div className="footer-num">{countObj?.h1||0}</div> <div className="footer-num">{getVal(countObj?.currWeekValMax)+'/'+getVal(countObj?.currWeekValMin)||0}</div>
</div> </div>
<div className="footer-item"> <div className="footer-item">
<div className="footer-name">本月(极值,RH)</div> <div className="footer-name">本月(极值,RH)</div>
<div className="footer-num">{countObj?.h3||0}</div> <div className="footer-num">{getVal(countObj?.currMonthValMax)+'/'+getVal(countObj?.currMonthValMin)||0}</div>
</div> </div>
<div className="footer-item"> <div className="footer-item">
<div className="footer-name">本年(极值,RH)</div> <div className="footer-name">本年(极值,RH)</div>
<div className="footer-num">{countObj?.h6||0}</div> <div className="footer-num">{getVal(countObj?.currYearValMax)+'/'+getVal(countObj?.currYearValMin)||0}</div>
</div> </div>
<div className="footer-item"> <div className="footer-item">
<div className="footer-name">近1周(极值,RH)</div> <div className="footer-name">近1周(极值,RH)</div>
<div className="footer-num">{countObj?.h12||0}</div> <div className="footer-num">{getVal(countObj?.nearWeekValMax)+'/'+getVal(countObj?.nearWeekValMin)||0}</div>
</div> </div>
<div className="footer-item"> <div className="footer-item">
<div className="footer-name">近1月(极值,RH)</div> <div className="footer-name">近1月(极值,RH)</div>
<div className="footer-num"><span style={{color:"#E69224"}}>{countObj?.yearDrpDay}</span>/{countObj?.C}</div> <div className="footer-num">{getVal(countObj?.nearMonthValMax)+'/'+getVal(countObj?.nearMonthValMin)||0}</div>
</div> </div>
</div> </div>
<div className="footer-row"> <div className="footer-row">
<div className="footer-item"> <div className="footer-item">
<div className="footer-name">近3月(极值,RH)</div> <div className="footer-name">近3月(极值,RH)</div>
<div className="footer-num">{countObj.today}</div> <div className="footer-num">{getVal(countObj?.nearThreeMonthValMax)+'/'+getVal(countObj?.nearThreeMonthValMin)||0}</div>
</div> </div>
<div className="footer-item"> <div className="footer-item">
<div className="footer-name">近6月(极值,RH)</div> <div className="footer-name">近6月(极值,RH)</div>
<div className="footer-num">{countObj?.yesterdayDrp}</div> <div className="footer-num">{getVal(countObj?.nearSixMonthValMax)+'/'+getVal(countObj?.nearSixMonthValMin)||0}</div>
</div> </div>
<div className="footer-item"> <div className="footer-item">
<div className="footer-name">近1年(极值,RH)</div> <div className="footer-name">近1年(极值,RH)</div>
<div className="footer-num">{countObj?.monthDrp}</div> <div className="footer-num">{getVal(countObj?.nearYearValMax)+'/'+getVal(countObj?.nearYearValMin)||0}</div>
</div> </div>
<div className="footer-item"> <div className="footer-item">
<div className="footer-name">&nbsp;</div> <div className="footer-name">&nbsp;</div>

View File

@ -1,12 +1,15 @@
import React,{useState,useEffect} from 'react' import React,{useState,useEffect} from 'react'
import {queryStPptnDetails} from '../../../../service/ssyq' import {queryStPptnDetails} from '../../../../service/ssyq'
import { httppost2 } from '../../../../utils/request' import { httpget2, httppost2 } from '../../../../utils/request'
import apiurl from '../../../../service/apiurl' import apiurl from '../../../../service/apiurl'
export default function Sssw({ data }) { export default function Sssw({ data }) {
const [detail, setDetail] = useState({}) const [detail, setDetail] = useState({})
const getDetail = async (stcd) => { const getDetail = async (stcd) => {
// const res = await httppost2(apiurlhome.turangshangqing.{stcd}) const {code, data} = await httpget2(apiurl.home.turangCount+stcd)
// setDetail{res} if(code!==200){
return
}
setDetail(data)
} }
useEffect(() => { useEffect(() => {
if (data.stcd) { if (data.stcd) {
@ -14,35 +17,43 @@ export default function Sssw({ data }) {
} }
}, [data]) }, [data])
const getVal = (v)=>{
if(typeof v === 'number'){
return v.toFixed(2)
}else{
return '-'
}
}
return ( return (
<div className="ssjc"> <div className="ssjc">
<div className="root"> <div className="root">
<div className="realinfo"> <div className="realinfo">
<div <div
className='report-time' className='report-time'
>墒情最新上报时间: {detail?.tm}</div> >墒情最新上报时间: {detail?.createTime}</div>
<div className='drp-content'> <div className='drp-content'>
<div className='drp-item'> <div className='drp-item'>
<div className='value'>{detail?.h ?? '-' }%&nbsp;<span style={{fontSize:14}}>RH</span></div> <div className='value'>{getVal(detail?.currVal) ?? '-' }%&nbsp;<span style={{fontSize:14}}>RH</span></div>
<div className='name'>实时数据</div> <div className='name'>实时数据</div>
</div> </div>
<div className='drp-item'> <div className='drp-item'>
<div className='value'>{detail?.h3 ?? '-' }%&nbsp;<span style={{fontSize:14}}>RH</span></div> <div className='value'>{getVal(detail?.nearWeekValMax)+'/'+getVal(detail?.nearWeekValMin) ?? '-' }%&nbsp;<span style={{fontSize:14}}>RH</span></div>
<div className='name'>近1周极值</div> <div className='name'>近1周极值</div>
</div> </div>
<div className='drp-item'> <div className='drp-item'>
<div className='value'>{detail?.h6 ?? '-' }%&nbsp;<span style={{fontSize:14}}>RH</span></div> <div className='value'>{getVal(detail?.nearMonthValMax)+'/'+getVal(detail.nearMonthValMin) ?? '-' }%&nbsp;<span style={{fontSize:14}}>RH</span></div>
<div className='name'>近1月极值</div> <div className='name'>近1月极值</div>
</div> </div>
<div className='drp-item'> <div className='drp-item'>
<div className='value'>{detail?.h12 ?? '-' }%&nbsp;<span style={{fontSize:14}}>RH</span></div> <div className='value'>{getVal(detail?.nearThreeMonthValMax)+'/'+getVal(detail.nearThreeMonthValMin) ?? '-' }%&nbsp;<span style={{fontSize:14}}>RH</span></div>
<div className='name'>近3月极值</div> <div className='name'>近3月极值</div>
</div> </div>
<div className='drp-item'> <div className='drp-item'>
<div className='value'>{detail?.h24 ?? '-' }%&nbsp;<span style={{fontSize:14}}>RH</span></div> <div className='value'>{getVal(detail?.nearSixMonthValMax)+'/'+getVal(detail.nearSixMonthValMin) ?? '-' }%&nbsp;<span style={{fontSize:14}}>RH</span></div>
<div className='name'>近6月极值</div> <div className='name'>近6月极值</div>
</div> <div className='drp-item'> </div> <div className='drp-item'>
<div className='value'>{detail?.h48 ?? '-' }%&nbsp;<span style={{fontSize:14}}>RH</span></div> <div className='value'>{getVal(detail?.nearYearValMax)+'/'+getVal(detail.nearYearValMin) ?? '-' }%&nbsp;<span style={{fontSize:14}}>RH</span></div>
<div className='name'>近1年极值</div> <div className='name'>近1年极值</div>
</div> </div>

View File

@ -455,7 +455,9 @@ export default function ProjectBasciInfo() {
{ {
skdisabled ? <Button type="primary" onClick={() => setSkDisabled(false)}>编辑</Button> : skdisabled ? <Button type="primary" onClick={() => setSkDisabled(false)}>编辑</Button> :
<div style={{ display: 'flex', columnGap: 20 }}> <div style={{ display: 'flex', columnGap: 20 }}>
<Button onClick={() => setSkDisabled(true)}>取消</Button> <Button onClick={() => {
setSkDisabled(true)
}}>取消</Button>
<Button type="primary" onClick={() => { onFinish() }}>保存</Button> <Button type="primary" onClick={() => { onFinish() }}>保存</Button>
</div> </div>
} }

View File

@ -34,7 +34,7 @@ const ModalForm = ({ mode, record,onEdit,onSave,onCrudSuccess }) => {
<Col span={24}> <Col span={24}>
<Form.Item <Form.Item
label="水位(m)" label="水位(m)"
name="q" name="z"
labelCol={{ span: 4, offset: 0 }} labelCol={{ span: 4, offset: 0 }}
wrapperCol={{span:20,offset:0}} wrapperCol={{span:20,offset:0}}
rules={[{ required: true }]} rules={[{ required: true }]}
@ -51,7 +51,7 @@ const ModalForm = ({ mode, record,onEdit,onSave,onCrudSuccess }) => {
<Col span={24}> <Col span={24}>
<Form.Item <Form.Item
label="流量(m³/s)" label="流量(m³/s)"
name="z" name="q"
labelCol={{ span: 4, offset: 0 }} labelCol={{ span: 4, offset: 0 }}
wrapperCol={{ span: 20, offset: 0 }} wrapperCol={{ span: 20, offset: 0 }}
rules={[{ required: true }]} rules={[{ required: true }]}