lishenfeng
/
mcfxkh-Web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'master' of http://10.0.41.100:3000/lishenfeng/mcfxkh-Web

lsf-dev
秦子超 2025-06-13 14:23:38 +08:00
parent 21de3667bb 13868ee323
commit 704557e995
19 changed files with 354 additions and 101 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
public/assets/jrx.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 64 KiB

After

Width:  |  Height:  |  Size: 80 KiB

BIN
public/assets/潭家河村山洪灾害防御预案.pdf Normal file
View File

Binary file not shown.

2
src/models/map/index.js
View File

@ -266,7 +266,7 @@ const map = {
RealSkLayer: false,
RainDrpLayer: true,
ShuikuLayer: false,
BxSkLayer: true,
BxSkLayer: false,
FzdxLayer: false,
WataLayer: false,
AdcdLayer: true,

1
src/models/map/layout.js
View File

@ -272,6 +272,7 @@ export default function calcLayout(view, rightStack, hidePanels) {
} else if (view === 3) {
right = [
{ key: '网格', style: { height: '40rem' } },
{ key: '单个预案', style: { height: '10rem',flexGrow: 1 } },
]
//rightFullHeight = true;
} else if (view === 4) {

4
src/models/runtime/index.js
View File

@ -14,6 +14,7 @@ function initState() {
layerSetting: {
},
yyObj: {},
yuananType:'sh',
duibifxNum:[],
shkshObj:undefined,
gwobj: undefined,
@ -67,6 +68,9 @@ const runtime = {
setInfoDlg(state, props) {
return { ...state, infoDlg: props }
},
setYuananType(state, props) {
return { ...state, yuananType: props }
},
setYyfa(state, props) {
return { ...state, yyObj: props }
},

4
src/models/shyjview/index.js
View File

@ -34,7 +34,7 @@ const shyjview = {
}
// dispatch.runtime.setHome();
dispatch.runtime.setHome();
},
async showWeatherRadar(_, state) {
dispatch.map.setCalculating(true);
@ -49,7 +49,7 @@ const shyjview = {
}
// dispatch.runtime.setHome();
dispatch.runtime.setHome();
},
async showYj24hContour(latest) {

6
src/views/Home/PanelIndex.js
View File

@ -143,7 +143,7 @@ import Gsfhqx from './panels/Gsfhqx'
import JbqkRight from './panels/JbqkRight'
import RainSta from './panels/RainSta'
import DrpSta from './panels/DrpSta'
import Yuanan from './panels/SigelYuanan'
export default function PanelIndex({ name, style, ...params }) {
if (name === '天气') {
return (
@ -426,7 +426,9 @@ export default function PanelIndex({ name, style, ...params }) {
return <Zdgzsq style={style} />
} else if (name === '测站到报率') {
return <Czdbl style={style} />
}
} else if (name === '单个预案') {
return <Yuanan style={style} />
}
return (
<PanelBox style={style} title={name} color="red">
<p>not impl</p>

18
src/views/Home/index.js
View File

@ -23,6 +23,7 @@ export default function Demo1() {
const isSc = useSelector(s => s.runtime.scya);
const wg = useSelector(s => s.runtime.shkshObj)
const showGw = useSelector(s => s.runtime.showGw)
const yuananType = useSelector(s => s.runtime.yuananType);
console.log('wg', wg);
@ -64,11 +65,22 @@ export default function Demo1() {
!hp && (
<TransitionGroup className={clsx('left', 'dp-panel-container', layout.leftFullHeight && 'fullheight')}>
{
layout.left.map(({ key, ...params }) => (
layout.left.map(({ key, ...params }) => {
if (key != '辅助决策列表') {
return (
<CSSTransition key={key} unmountOnExit exit={false} timeout={500} classNames="dp-panelgroup">
<PanelIndex name={key} {...params} />
</CSSTransition>
))
)
} else if (yuananType == 'sh') {
return (
<CSSTransition key={key} unmountOnExit exit={false} timeout={500} classNames="dp-panelgroup">
<PanelIndex name={key} {...params} />
</CSSTransition>
)
}
}
)
}
</TransitionGroup>
@ -82,7 +94,7 @@ export default function Demo1() {
<TransitionGroup className={clsx('right', 'dp-panel-container', layout.rightFullHeight && 'fullheight')}>
{
layout.right.map(({ key, ...params }) => {
if (key != '网格') {
if (key != '网格' && key != '单个预案') {
return (
<CSSTransition key={key} unmountOnExit exit={false} timeout={500} classNames="dp-panelgroup">
<PanelIndex name={key} {...params} />

4
src/views/Home/panels/BxSkOverall/OverallContent.js
View File

@ -65,8 +65,8 @@ export default function OverallContent({ data, skAll }) {
<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}>261mm</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>

80
src/views/Home/panels/Byjc/index.js
View File

@ -915,39 +915,47 @@ function DrpReal({ style }) {
"aRz": -17.4
}
]
const removePoint = () => {
const map = window.__mapref;
const layer = map.getLayer('关联站点')
dispatch?.runtime.setFeaturePop({})
if (layer) {
map.removeLayer('关联站点');
map.removeSource('关联站点');
}
}
const [showbx, setShowdbx] = useState(0)
const [showsy, setShowdsy] = useState(0)
const [showsl, setShowdsl] = useState(0)
const [showby, setShowdby] = useState(0)
useEffect(() => {
const map = window.__mapref;
if (map) {
if (tab === '1' && data1 && showbx) {
setLayer(data1, '变形')
}
if (tab === '2' && data2 && showsy) {
// useEffect(() => {
// const map = window.__mapref;
// if (map) {
// if (tab === '1' && data1 && showbx) {
// setLayer(data1, '变形')
// }
// if (tab === '2' && data2 && showsy) {
setLayer(data2, '渗压')
}
if (tab === '3' && data3 && showsl) {
setLayer(data3, '渗流')
}
if (tab === '4' && data4 && showby) {
setLayer(data4, '白蚁')
}
}
else {
const dsq = setInterval(() => {
const map = window.__mapref;
if (map && skdata.length > 0) {
clearInterval(dsq)
setLayer(skdata, 'sk')
}
}, 500);
}
// setLayer(data2, '渗压')
// }
// if (tab === '3' && data3 && showsl) {
// setLayer(data3, '渗流')
// }
// if (tab === '4' && data4 && showby) {
// setLayer(data4, '白蚁')
// }
// }
// else {
// const dsq = setInterval(() => {
// const map = window.__mapref;
// if (map && skdata.length > 0) {
// clearInterval(dsq)
// setLayer(skdata, 'sk')
// }
// }, 500);
// }
}, [data1, data2, data3, data4, tab, showbx, showsy, showsl, showby])
// }, [data1, data2, data3, data4, tab, showbx, showsy, showsl, showby])
const setLayer = (data = [], type) => {
const map = window.__mapref;
@ -1229,8 +1237,10 @@ function DrpReal({ style }) {
key={row.stcd}
onClick={() => {
const { lgtd, lttd, res_nm: stnm } = row;
removePoint()
if (stnm == '浮桥河水库') {
setShowdbx(1)
setShowdbx(showbx == 1 ? 0 : 1)
setLayer([row],'变形')
if (lgtd && lttd) {
dispatch.runtime.setCameraTarget({
center: [lgtd, lttd],
@ -1274,8 +1284,10 @@ function DrpReal({ style }) {
key={row.stcd}
onClick={() => {
const { lgtd, lttd, res_nm: stnm } = row;
removePoint()
if (stnm == '浮桥河水库') {
setShowdsy(1)
setShowdsy(showsy == 1 ? 0 : 1)
setLayer([row],'渗压')
if (lgtd && lttd) {
dispatch.runtime.setCameraTarget({
center: [lgtd, lttd],
@ -1315,7 +1327,9 @@ function DrpReal({ style }) {
key={row.stcd}
onClick={() => {
const { lgtd, lttd } = row;
setShowdsl(1)
removePoint()
setShowdsl(showsl == 1 ? 0 : 1)
setLayer([row],'渗流')
if (row.cd == 1) {
if (lgtd && lttd) {
dispatch.runtime.setCameraTarget({
@ -1356,8 +1370,12 @@ function DrpReal({ style }) {
<DpTableRow
key={row.stcd}
onClick={() => {
removePoint()
const { lgtd, lttd } = row;
setShowdby(1)
setShowdby(showby == 1 ? 0 : 1)
setLayer([row],'白蚁')
if (row.cd == '0AB3ED') {
if (lgtd && lttd) {
dispatch.runtime.setCameraTarget({

23
src/views/Home/panels/DrpSta/index.js
View File

@ -447,6 +447,29 @@ export default function Overall({ style }) {
10, 10,
14, 16,
],
'text-max-width': 30,
'text-font': ['Roboto Black'],
'text-field': [
'step',
['zoom'],
[
'case',
['!=', ['get', 'state'], 1], '',
['concat', ['get', 'rz'], 'm']
],
12, [
'case',
['!=', ['get', 'state'], 1], ['get', 'stnm'],
[
'format',
['get', 'stnm'], { 'font-scale': 0.8, 'text-color': '#fff' },
'\n', {},
['concat', ['get', 'rz'], 'm'], {}
]
],
],
'text-anchor': 'top',
'text-offset': [0, 1],
},
'paint': {
'text-color': [

4
src/views/Home/panels/Drpfx/index.js
View File

@ -262,8 +262,8 @@ export default function Overall({ style }) {
<TableRow onClick={() =>flyTo(item)}>
<DpTableCell style={{ width: '53%' }}>{item.stnm}</DpTableCell>
<DpTableCell style={{ width: '10%' }}>{item.today}</DpTableCell>
<DpTableCell style={{ width: '20%' }}>阎家河镇</DpTableCell>
<DpTableCell style={{ width: '27%' }}>桃林河</DpTableCell>
<DpTableCell style={{ width: '20%' }}>福田河镇</DpTableCell>
<DpTableCell style={{ width: '27%' }}>长江流域</DpTableCell>
</TableRow>
))
}

8
src/views/Home/panels/FzjcLayers/index.js
View File

@ -169,13 +169,7 @@ function FzjcLayers({ style }) {
}
const [type, setType] = useState('sh')
const toggleStType = (type) => {
// if (type == 'sz') {
// dispatch.map.setLayerVisible({'ShuiZhaLayer':true})
// dispatch.map.setLayerVisible({'BzLayer':false})
// } else {
// dispatch.map.setLayerVisible({'ShuiZhaLayer':false})
// dispatch.map.setLayerVisible({'BzLayer':true})
// }
dispatch.runtime.setYuananType(type)
setType(type)
}

99
src/views/Home/panels/Glzd/index.js
View File

@ -892,35 +892,36 @@ function DrpReal({ style }) {
const [showDrp, setShowdDrp] = useState(0)
const [showHd, setShowdHd] = useState(0)
useEffect(() => {
const map = window.__mapref;
if (map) {
if (tab === '1' && drpData && showDrp) {
setLayer(drpData, 'drp')
}
if (tab === '2' && hdData && showHd) {
setLayer(hdData, 'hd')
}
if (tab === '3' && data3) {
setLayer(data3, 'll')
}
if (tab === '4' && data4) {
setLayer(data4, 'tx')
}
if (tab === '5' && data5) {
setLayer(data5, 'sk')
}
} else {
const dsq = setInterval(() => {
const map = window.__mapref;
if (map && drpData.length > 0) {
clearInterval(dsq)
setLayer(drpData, 'drp')
}
}, 500);
}
// useEffect(() => {
// const map = window.__mapref;
// if (map) {
// debugger
// if (tab === '1' && drpData) {
// setLayer(drpData, 'drp')
// }
// if (tab === '2' && hdData ) {
// setLayer(hdData, 'hd')
// }
// if (tab === '3' && data3) {
// setLayer(data3, 'll')
// }
// if (tab === '4' && data4) {
// setLayer(data4, 'tx')
// }
// if (tab === '5' && data5) {
// setLayer(data5, 'sk')
// }
// } else {
// const dsq = setInterval(() => {
// const map = window.__mapref;
// if (map && drpData.length > 0) {
// clearInterval(dsq)
// setLayer(drpData, 'drp')
// }
// }, 500);
// }
}, [drpData, hdData, skObj, tab, showDrp, showHd])
// }, [drpData, hdData, skObj, showDrp, showHd])
@ -991,6 +992,7 @@ function DrpReal({ style }) {
'features': [],
},
},
'paint': {
'circle-color': [
'case',
@ -1064,6 +1066,29 @@ function DrpReal({ style }) {
10, 10,
14, 16,
],
'text-max-width': 30,
'text-font': ['Roboto Black'],
'text-field': [
'step',
['zoom'],
[
'case',
['!=', ['get', 'state'], 1], '',
['concat', ['get', 'rz'], 'm']
],
12, [
'case',
['!=', ['get', 'state'], 1], ['get', 'stnm'],
[
'format',
['get', 'stnm'], { 'font-scale': 0.8, 'text-color': '#fff' },
'\n', {},
['concat', ['get', 'rz'], 'm'], {}
]
],
],
'text-anchor': 'top',
'text-offset': [0, 1],
},
'paint': {
'text-color': [
@ -1079,6 +1104,7 @@ function DrpReal({ style }) {
},
'visibility': 'visible',
});
}
if (type === 'll') {
map.addLayer({
@ -1223,7 +1249,15 @@ function DrpReal({ style }) {
setShowdDrp(0)
}, [tab])
const removePoint = () => {
dispatch?.runtime.setFeaturePop({})
const map = window.__mapref;
const layer = map.getLayer('关联站点')
// if (layer) {
// map.removeLayer('关联站点');
// map.removeSource('关联站点');
// }
}
return (
<PanelBox
@ -1270,8 +1304,10 @@ function DrpReal({ style }) {
key={row.stcd}
onClick={() => {
const { lgtd, lttd } = row;
removePoint()
if (row.stnm == '浮桥河') {
setShowdDrp(1)
setShowdDrp(showDrp == 1 ? 0 : 1)
setLayer([row],'drp')
if (lgtd && lttd) {
dispatch.runtime.setFeaturePop({ type: 'RealDrpPop', properties: row, coordinates: [row.lgtd, row.lttd] });
dispatch.runtime.setCameraTarget({
@ -1313,7 +1349,8 @@ function DrpReal({ style }) {
<div className="table-ellipsis cursor-pointer" onClick={() => {
const { lgtd, lttd } = row;
if (row.stnm == '浮桥河') {
setShowdHd(1)
setShowdHd(showHd == 1 ? 0: 1)
setLayer([row],'hd')
if (lgtd && lttd) {
dispatch.runtime.setFeaturePop({ type: 'RealHDPop', properties: row, coordinates: [row.lgtd, row.lttd] });
dispatch.runtime.setCameraTarget({

57
src/views/Home/panels/HDReal/index.js
View File

@ -70,16 +70,16 @@ function HDReal({ style }) {
const toggleAutoRefresh = () => {
dispatch.realview.setHdAutoRefresh(!hdAutoRefresh);
}
const setLayer = (data = [], type) => {
const map = window.__mapref;
const layer = map.getLayer('关联站点')
if (layer) {
map.removeLayer('关联站点');
map.removeSource('关联站点');
}
if (data.length === 0) { return }
if (type === 'hd') {
map.addLayer({
const setLayer = (data = [], type) => {
const map = window.__mapref;
const layer = map.getLayer('关联站点')
if (layer) {
map.removeLayer('关联站点');
map.removeSource('关联站点');
}
if (data.length === 0) { return }
if (type === 'hd') {
map.addLayer({
'id': '关联站点',//+new Date().getTime(),
'type': 'symbol',
'source': {
@ -103,6 +103,29 @@ function HDReal({ style }) {
10, 10,
14, 16,
],
'text-max-width': 30,
'text-font': ['Roboto Black'],
'text-field': [
'step',
['zoom'],
[
'case',
['!=', ['get', 'state'], 1], '',
['concat', ['get', 'rz'], 'm']
],
12, [
'case',
['!=', ['get', 'state'], 1], ['get', 'stnm'],
[
'format',
['get', 'stnm'], { 'font-scale': 0.8, 'text-color': '#fff' },
'\n', {},
['concat', ['get', 'rz'], 'm'], {}
]
],
],
'text-anchor': 'top',
'text-offset': [0, 1],
},
'paint': {
'text-color': [
@ -118,11 +141,11 @@ function HDReal({ style }) {
},
'visibility': 'visible',
});
}
map.getSource('关联站点').setData(parseGeoJSON(data))
}
map.getSource('关联站点').setData(parseGeoJSON(data))
}
return (
<PanelBox
style={style}
@ -153,13 +176,13 @@ function HDReal({ style }) {
</TableHead>
<TableBody>
{showData.map((row) => (
<DpTableRow key={row.stcd} onClick={() => { flyTo(row); setLayer([row],'hd')}}>
<DpTableRow key={row.stcd} onClick={() => { flyTo(row); setLayer([row], 'hd') }}>
<DpTableCell component="th" scope="row">
<div className="table-ellipsis cursor-pointer">{row.stnm}</div>
</DpTableCell>
<DpTableCell align="right">{renderHDRz(row)}{row.stnm == '浮桥河'? '↑':""}</DpTableCell>
{rzRender(row.rz, row.rz+5.5)}
{rzRender(row.rz, row.rz+4)}
<DpTableCell align="right">{renderHDRz(row)}{row.stnm == '浮桥河' ? '↑' : ""}</DpTableCell>
{rzRender(row.rz, row.rz + 5.5)}
{rzRender(row.rz, row.rz + 4)}
</DpTableRow>
))}
</TableBody>

4
src/views/Home/panels/RainSta/index.js
View File

@ -248,8 +248,8 @@ export default function Overall({ style }) {
station.id == 'storm' && drpData.map(item => (
<TableRow onClick={() =>flyTo(item)}>
<DpTableCell style={{ width: '53%' }}>{item.stnm}</DpTableCell>
<DpTableCell style={{ width: timeRange == '1h' ?'27%':"30%" }}>{item.today}</DpTableCell>
<DpTableCell style={{ width: timeRange == '1h' ?'20%':'17%' }}>{timeRange == '1h' ? '福田河镇':'福田河'}</DpTableCell>
<DpTableCell style={{ width: timeRange == '1h' ?'27%':"28%" }}>{item.today}</DpTableCell>
<DpTableCell style={{ width: timeRange == '1h' ?'20%':'19%' }}>{timeRange == '1h' ? '福田河镇':'长江流域'}</DpTableCell>
</TableRow>
))
}

2
src/views/Home/panels/Shksh/index.js
View File

@ -199,7 +199,7 @@ const useStyles = makeStyles({
return (
<PanelBox
style={style}
title="山洪可视化"
title="山洪可视化预案"
color="green"
>
<div style={{padding:'10px 8px'}}>

48
src/views/Home/panels/SigelYuanan/index.js Normal file
View File

@ -0,0 +1,48 @@
import React, { useMemo, useState } from 'react';
import useRequest from '../../../../utils/useRequest';
import PanelBox from '../../components/PanelBox';
import Table from '@material-ui/core/Table';
import TableContainer from '@material-ui/core/TableContainer';
import TableBody from '@material-ui/core/TableBody';
import TableHead from '@material-ui/core/TableHead';
import TableRow from '@material-ui/core/TableRow';
import DpTableCell from '../../../../layouts/mui/DpTableCell';
import DpTableRow from '../../../../layouts/mui/DpTableRow';
import { useDispatch, useSelector } from 'react-redux';
import { DrpRealPromise } from '../../../../models/_/real';
import useRefresh from '../../../../utils/useRefresh';
import clsx from 'clsx';
import { renderDrp } from '../../../../utils/renutils';
import { TableSortLabel } from '@material-ui/core';
import { InfoPopNames } from '../../InfoPops';
// import AreaDrpChart from './chart';
import config from '../../../../config';
import TablePage from './table.js'
function DrpReal({ style }) {
const dispatch = useDispatch();
const [ tab, setTab ] = useState('1')
const [ tab2, setTab2 ] = useState('1')
const flyTo = (row) => {
dispatch?.runtime.setInfoDlg({ layerId: 'PdfLayer', properties: row })
}
return (
<PanelBox
style={style}
title="预案"
color="green"
>
<div style={{ color: "#fff",display:'flex',padding:'10px',cursor:'pointer' }} onClick={() => flyTo({planName:'潭家河村山洪灾害防御预案'})}>
<span>潭家河村山洪灾害防御预案</span>
</div>
</PanelBox>
)
}
export default DrpReal;

91
src/views/Home/panels/SigelYuanan/table.js Normal file
View File

@ -0,0 +1,91 @@
import React, { useMemo, useState } from 'react';
import useRequest from '../../../../utils/useRequest';
import PanelBox from '../../components/PanelBox';
import Table from '@material-ui/core/Table';
import TableContainer from '@material-ui/core/TableContainer';
import TableBody from '@material-ui/core/TableBody';
import TableHead from '@material-ui/core/TableHead';
import TableRow from '@material-ui/core/TableRow';
import DpTableCell from '../../../../layouts/mui/DpTableCell';
import DpTableRow from '../../../../layouts/mui/DpTableRow';
import appconsts from '../../../../models/appconsts';
import { renderDrp, renderSkArz, renderSkRz } from '../../../../utils/renutils';
const data = [
{ name:'雨量站', name2:'10', name3:'8', name4:'2', name5:'80' },
{ name:'水位站', name2:'15', name3:'15', name4:'0', name5:'100' },
{ name:'图像站', name2:'10', name3:'10', name4:'0', name5:'100' },
{ name:'合计', name2:'35', name3:'33', name4:'2', name5:'94.29' },
]
const data2 = [
{ name:'合计', name2:'64', name3:'64', name4:'0', name5:'100' },
]
const data3 = [
{ name:'合计', name2:'12', name3:'12', name4:'0', name5:'100' },
]
function Page({ tab }) {
return (
<TableContainer style={{ height: '12rem' }}>
<Table size="small" stickyHeader>
<TableHead>
<TableRow>
<DpTableCell style={{ minWidth: '2rem' }} align="left"></DpTableCell>
<DpTableCell style={{ minWidth: '3rem' }} align="center">总数</DpTableCell>
<DpTableCell style={{ minWidth: '5rem' }} align="center">在线数量</DpTableCell>
<DpTableCell style={{ minWidth: '5rem' }} align="center">离线数量</DpTableCell>
<DpTableCell style={{ minWidth: '5rem' }} align="center">到报率（%）</DpTableCell>
</TableRow>
</TableHead>
<TableBody>
{
tab==='1'?data.map((row) => (
<DpTableRow key={row.name}>
<DpTableCell component="th" scope="row">
<div className="table-ellipsis cursor-pointer" onClick={() => {}}>{row.name}</div>
</DpTableCell>
<DpTableCell align="center">{row.name2}</DpTableCell>
<DpTableCell align="center">{row.name3}</DpTableCell>
<DpTableCell align="center">{row.name4}</DpTableCell>
<DpTableCell align="center">{row.name5}</DpTableCell>
</DpTableRow>
)):null
}
{
tab==='2'?data2.map((row) => (
<DpTableRow key={row.name}>
<DpTableCell component="th" scope="row">
<div className="table-ellipsis cursor-pointer" onClick={() => {}}>{row.name}</div>
</DpTableCell>
<DpTableCell align="center">{row.name2}</DpTableCell>
<DpTableCell align="center">{row.name3}</DpTableCell>
<DpTableCell align="center">{row.name4}</DpTableCell>
<DpTableCell align="center">{row.name5}</DpTableCell>
</DpTableRow>
)):null
}
{
tab==='3'?data3.map((row) => (
<DpTableRow key={row.name}>
<DpTableCell component="th" scope="row">
<div className="table-ellipsis cursor-pointer" onClick={() => {}}>{row.name}</div>
</DpTableCell>
<DpTableCell align="center">{row.name2}</DpTableCell>
<DpTableCell align="center">{row.name3}</DpTableCell>
<DpTableCell align="center">{row.name4}</DpTableCell>
<DpTableCell align="center">{row.name5}</DpTableCell>
</DpTableRow>
)):null
}
</TableBody>
</Table>
</TableContainer>
)
}
export default React.memo(Page);