77 lines
1.9 KiB
JavaScript
77 lines
1.9 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';
|
|||
|
|
|
|||
|
|
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 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.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>
|
|||
|
|
)
|
|||
|
|
}
|