65 lines
2.6 KiB
JavaScript
65 lines
2.6 KiB
JavaScript
|
import React, { useState } from 'react'
|
|||
|
|
import {
|
|||
|
|
CloseOutlined,
|
|||
|
|
} from '@ant-design/icons';
|
|||
|
|
import "./YbyjPreviewPop.less"
|
|||
|
|
import {levelRender} from "../../../../utils/renutils";
|
|||
|
|
import appconsts from "../../../../service/appconsts";
|
|||
|
|
|
|||
|
|
function RiskPop({ id, data, dispatch }) {
|
|||
|
|
const closePop = () => {
|
|||
|
|
dispatch.runtime.closeFeaturePop(id);
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
const width = 420;
|
|||
|
|
|
|||
|
|
return (
|
|||
|
|
<>
|
|||
|
|
<div className="dp-popup" style={{ position: 'absolute', top: 0, left: 0, width, lineHeight: 1, transform: 'translateX(-50%)' }}>
|
|||
|
|
<div className="dp-popup-tip"></div>
|
|||
|
|
<div className="dp-popup-content">
|
|||
|
|
<div className="boxhead"></div>
|
|||
|
|
<div className="content-body">
|
|||
|
|
<div className="title">
|
|||
|
|
<div className="name">
|
|||
|
|
<span style={{fontWeight:"bold"}}>{data.adnm}</span>
|
|||
|
|
<span style={{fontSize:"13px"}}>（24H平均雨量：{data.av}mm） </span>
|
|||
|
|
<span style={{fontWeight:"bold"}}>
|
|||
|
|
{appconsts.yjLevel[data.maxLv]}
|
|||
|
|
</span>
|
|||
|
|
<span style={{position:"relative",top:"2px",left:"5px"}}>{levelRender(data.maxLv, 6)}</span>
|
|||
|
|
</div>
|
|||
|
|
<div className="extra">
|
|||
|
|
<CloseOutlined onClick={closePop} style={{color:"#333"}}/>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div style={{margin:"15px 0 20px 20px"}}>
|
|||
|
|
{
|
|||
|
|
data.children && data.children.length>0?data.children.map((item, index)=>
|
|||
|
|
<>
|
|||
|
|
<div style={{padding:"10px 15px"}}>
|
|||
|
|
<span style={{display:"inline-block",width:"20px",height:"20px",lineHeight:"18px",background:"blue",borderRadius:"50%",color:"#fff",textAlign:"center",marginRight:"10px"}}>{index+1}</span>
|
|||
|
|
<span>名称：</span><span style={{fontWeight:"bold"}}>{item.adnm}</span>
|
|||
|
|
</div>
|
|||
|
|
<div style={{padding:"10px 15px 10px 45px"}}>
|
|||
|
|
<span>24H平均雨量：</span><span style={{fontWeight:"bold"}}>{item.av}mm</span>
|
|||
|
|
</div>
|
|||
|
|
<div style={{padding:"10px 15px 10px 45px"}}>
|
|||
|
|
<span>预警等级：</span>
|
|||
|
|
<span style={{fontWeight:"bold"}}>{appconsts.yjLevel[item.maxLv]}</span>
|
|||
|
|
<span style={{position:"relative",top:"4px",left:"6px"}}>{levelRender(item.maxLv, 6)}</span>
|
|||
|
|
</div>
|
|||
|
|
</>):null
|
|||
|
|
}
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div className="boxfoot"></div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</>
|
|||
|
|
)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
export default React.memo(RiskPop);
|