63 lines
2.2 KiB
JavaScript
63 lines
2.2 KiB
JavaScript
|
import React, { useEffect, useState } from 'react';
|
||
|
|
import { Descriptions } from 'antd';
|
||
|
|
import moment from "moment"
|
||
|
|
import {CloseOutlined} from '@ant-design/icons';
|
||
|
|
import genDamImage from '../../../../components/DamGraph/DamImage';
|
||
|
|
import './TangYanBa.less'
|
||
|
|
|
||
|
|
function TangYanBa({ id, data, dispatch }) {
|
||
|
|
|
||
|
|
const closePop = () => {
|
||
|
|
dispatch.runtime.closeFeaturePop(id);
|
||
|
|
};
|
||
|
|
|
||
|
|
const width = 780;
|
||
|
|
|
||
|
|
const mapOb={
|
||
|
|
1:'混凝土坝',
|
||
|
|
2:'土坝',
|
||
|
|
3:'堆石坝',
|
||
|
|
4:'其他四种类型'
|
||
|
|
}
|
||
|
|
return (
|
||
|
|
<>
|
||
|
|
<div className="dp-popup" style={{ position: 'absolute', top: '10px', left: 0, width, lineHeight: 1, background:'#ffffff' ,transform: 'translateX(-50%)' }}>
|
||
|
|
<div className="dp-popup-tip" style={{marginTop:'-10px',borderBottomColor:'#f7f7f7'}}></div>
|
||
|
|
<div className="dp-popup-content">
|
||
|
|
<div className="content-body tyb" id='tyb'>
|
||
|
|
<div className="title">
|
||
|
|
<div className="name flex flexac">
|
||
|
|
<div className='nameBorder'></div>
|
||
|
|
{data.damname}
|
||
|
|
</div>
|
||
|
|
<div className="extra">
|
||
|
|
<CloseOutlined onClick={closePop} style={{color:"#333"}}/>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div className="body">
|
||
|
|
<Descriptions size="small" column={2}>
|
||
|
|
<Descriptions.Item label="所属行政位置">{data.adnm}</Descriptions.Item>
|
||
|
|
<Descriptions.Item label="所属流域">{data.basName}</Descriptions.Item>
|
||
|
|
<Descriptions.Item label="容积(m³)">{data.xhst}</Descriptions.Item>
|
||
|
|
<Descriptions.Item label="坝高(m)">{data.height}</Descriptions.Item>
|
||
|
|
<Descriptions.Item label="坝长(m)" >{data.width}</Descriptions.Item>
|
||
|
|
<Descriptions.Item label="挡水主坝类型" >{data.mt}</Descriptions.Item>
|
||
|
|
<Descriptions.Item label="附件" span={3}>
|
||
|
|
{data.imgs.map((item)=>{
|
||
|
|
return <img src={item}/>
|
||
|
|
})}</Descriptions.Item>
|
||
|
|
</Descriptions>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
|
||
|
|
</div>
|
||
|
|
<div className="boxfoot"></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</>
|
||
|
|
)
|
||
|
|
}
|
||
|
|
|
||
|
|
export default React.memo(TangYanBa);
|