87 lines
2.7 KiB
JavaScript
87 lines
2.7 KiB
JavaScript
import { Button, makeStyles } from '@material-ui/core';
|
||
import { Email } from '@material-ui/icons';
|
||
import React, { useMemo } from 'react';
|
||
import { BXSKLIST } from '../../../../models/_/bxsk';
|
||
import moment from 'moment';
|
||
const useStyles = makeStyles({
|
||
root: {
|
||
padding: '1.5rem 0.75rem 0.75rem 0.75rem',
|
||
color: 'rgb(224, 246, 247)',
|
||
fontSize: '0.9rem',
|
||
lineHeight: '1.8rem',
|
||
},
|
||
|
||
titleDate: {
|
||
fontSize: '1.2rem',
|
||
margin: '0.2rem',
|
||
color: '#00deff',
|
||
},
|
||
|
||
number: {
|
||
color: '#ffd220',
|
||
fontSize: '1.2rem',
|
||
margin: '0.2rem',
|
||
},
|
||
|
||
sttype: {
|
||
color: '#92f0ff',
|
||
},
|
||
stname: {
|
||
fontWeight: 'bold',
|
||
fontSize: '1rem',
|
||
margin: '0.25rem',
|
||
cursor: 'pointer'
|
||
},
|
||
|
||
action: {
|
||
textAlign: 'right',
|
||
color: '#fff',
|
||
}
|
||
})
|
||
|
||
export default function OverallContent({ data, skAll }) {
|
||
const classes = useStyles();
|
||
const start = moment().format('D日');
|
||
const end = moment().add(1,'day').format('D日');
|
||
|
||
const stat = useMemo(() => {
|
||
const dataF = data.filter(o => o.dbczwt);
|
||
const 中型 = dataF?.filter(o => o.gcgm === '中型');
|
||
const 小一型 = dataF?.filter(o => o.gcgm === '小（1）型');
|
||
const 小二型 = dataF?.filter(o => o.gcgm === '小（2）型');
|
||
const 超汛限 = dataF?.filter(o => o.rzWarning === 1 && o.rzState === 1);
|
||
|
||
return {
|
||
all: dataF,
|
||
中型,
|
||
小一型,
|
||
小二型,
|
||
超汛限
|
||
};
|
||
}, [data]);
|
||
|
||
return (
|
||
<div className={classes.root}>
|
||
<div>
|
||
<span className={classes.titleDate}>{start}9时</span>至<span className={classes.titleDate}>{end}9时</span>
|
||
24小时中共有<span className={classes.number}>1</span>
|
||
个站点雨量为<span className={classes.sttype}>暴雨</span>，雨量值
|
||
<span className={classes.number}>50.2mm</span>；
|
||
共产生<span className={classes.number}>3</span>个山洪预警（2个内部预警，1个外部预警），均已处置；<span className={classes.number}>1</span>个水库超汛限，已短信通知责任人；<span className={classes.number}>1</span>个超警戒河道预警。
|
||
|
||
</div>
|
||
{/* <div>
|
||
共有水库<span className={classes.number}>{skAll?.length || '-'}</span>坐，
|
||
病险水库共有<span className={classes.number}>{stat.all?.length || '-'}</span>坐
|
||
(
|
||
中型<span className={classes.number}>{stat.中型?.length || '-'}</span>坐，
|
||
小一型<span className={classes.number}>{stat.小一型?.length || '-'}</span>坐，
|
||
小二型<span className={classes.number}>{stat.小二型?.length || '-'}</span>坐
|
||
)
|
||
|
||
，其中超汛限<span className={classes.number}>{stat.超汛限?.length || '-'}</span>座。
|
||
</div> */}
|
||
</div>
|
||
)
|
||
}
|