tsg-web/src/views/Home/MapCtrl/Pops/Wxq.js

63 lines
2.3 KiB
JavaScript

import React, { useEffect, useState } from 'react';
import { Descriptions } from 'antd';
import {CloseOutlined} from '@ant-design/icons';
import { httpget2 } from '../../../../utils/request';
import apiurl from '../../../../service/apiurl';
import moment from "moment"
function Wxq({ id, data, dispatch }) {
console.log(data);
const width = 400;
const [detail, setDetail] = useState({})
const closePop = () => {
dispatch.runtime.closeFeaturePop(id);
};
const getDetailData = async(id) => {
try {
const res = await httpget2(`${apiurl.home.wxqdetail}/${id}`);
setDetail(res.data)
} catch (error) {
}
}
useEffect(() => {
if (data?.PID) {
getDetailData(data?.PID)
}
}, [data])
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.NAME || detail?.name}
</div>
<div className="extra">
<CloseOutlined onClick={closePop} style={{color:"#333"}}/>
</div>
</div>
<div className="body">
<Descriptions labelStyle={{padding:"5px 0"}}>
<Descriptions.Item label="行政区划" span={3} contentStyle={{ padding: "5px 0" }}>{data?.adnm || detail?.adnm}</Descriptions.Item>
<Descriptions.Item label="人口" span={3} contentStyle={{padding:"5px 0"}}>{data?.ptcount || detail?.ptcount}</Descriptions.Item>
<Descriptions.Item label="户数" span={3} contentStyle={{padding:"5px 0"}}>{data?.etcount || detail?.etcount}</Descriptions.Item>
<Descriptions.Item label="房屋数" span={3} contentStyle={{padding:"5px 0"}}>{data.htcount || detail?.htcount}</Descriptions.Item>
</Descriptions>
</div>
</div>
<div className="boxfoot"></div>
</div>
</div>
</>
)
}
export default React.memo(Wxq);