46 lines
2.9 KiB
JavaScript
46 lines
2.9 KiB
JavaScript
import React, { useMemo, useState } from 'react';
|
|
import PanelBox from '../../components/PanelBox';
|
|
|
|
function DrpReal({ style }) {
|
|
|
|
return (
|
|
<PanelBox
|
|
style={style}
|
|
title="供水数据概览"
|
|
color="green"
|
|
>
|
|
{/* <img src='/assets/供水数据概览.jpg' style={{width:'419.81px', height:'200px',marginLeft:'1px'}}/> */}
|
|
<div style={{color:"#ffffff",padding:'1rem'}}>
|
|
<div style={{display:'flex',marginBottom:'10px'}}>
|
|
<div style={{width:'6rem',textAlign:'center'}}>供水量</div>
|
|
<div style={{width:'12rem',textAlign:'center'}}>取水量</div>
|
|
<div style={{width:'9rem',textAlign:'center'}}>原水达标率</div>
|
|
<div style={{width:'9rem',textAlign:'center'}}>出厂水达标率</div>
|
|
</div>
|
|
<div style={{display:'flex',marginBottom:'0px'}}>
|
|
<div style={{width:'6rem',textAlign:'center',display:'flex',lineHeight:'24px', marginLeft:"0"}}><span style={{color:'#86fabd',fontSize:'22px',marginRight:'5px'}}>27463</span>m³</div>
|
|
<div style={{width:'6rem',textAlign:'center',display:'flex',lineHeight:'24px', marginLeft:"10px"}}><span style={{color:'#86fabd',fontSize:'22px',marginRight:'5px'}}>38745</span>m³</div>
|
|
<div style={{width:'6rem',textAlign:'center',display:'flex',lineHeight:'24px', marginLeft:"50px"}}><span style={{color:'#86fabd',fontSize:'22px',marginRight:'5px'}}>76</span>%</div>
|
|
<div style={{width:'6rem',textAlign:'center',display:'flex',lineHeight:'24px', marginLeft:"30px"}}><span style={{color:'#86fabd',fontSize:'22px',marginRight:'5px'}}>89</span>%</div>
|
|
</div>
|
|
</div>
|
|
<div style={{color:"#ffffff",padding:'1rem'}}>
|
|
<div style={{display:'flex',marginBottom:'10px'}}>
|
|
<div style={{width:'6rem',textAlign:'center'}}>耗电量</div>
|
|
<div style={{width:'12rem',textAlign:'center'}}>漏损率</div>
|
|
<div style={{width:'9rem',textAlign:'center'}}>设备运行率</div>
|
|
<div style={{width:'9rem',textAlign:'center'}}>紧急事件</div>
|
|
</div>
|
|
<div style={{display:'flex',marginBottom:'20px'}}>
|
|
<div style={{width:'6rem',textAlign:'center',display:'flex',lineHeight:'24px', marginLeft:"0"}}><span style={{color:'#86fabd',fontSize:'22px',marginRight:'5px'}}>8562</span>kwh</div>
|
|
<div style={{width:'6rem',textAlign:'center',display:'flex',lineHeight:'24px', marginLeft:"25px"}}><span style={{color:'#86fabd',fontSize:'22px',marginRight:'5px'}}>2.9</span>%</div>
|
|
<div style={{width:'6rem',textAlign:'center',display:'flex',lineHeight:'24px', marginLeft:"40px"}}><span style={{color:'#86fabd',fontSize:'22px',marginRight:'5px'}}>98.2</span>%</div>
|
|
<div style={{width:'6rem',textAlign:'center',display:'flex',lineHeight:'24px', marginLeft:"40px"}}><span style={{color:'#86fabd',fontSize:'22px',marginRight:'5px'}}>2</span>个</div>
|
|
</div>
|
|
</div>
|
|
</PanelBox>
|
|
)
|
|
}
|
|
|
|
export default DrpReal;
|