/*
|
* @Company: hugeInfo
|
* @Author: ldh
|
* @Date: 2022-08-13 14:27:46
|
* @LastEditTime: 2023-03-15 08:54:49
|
* @LastEditors: lwh
|
* @Version: 1.0.0
|
* @Description: 房间详情页 - 居民信息
|
*/
|
import React from 'react';
|
import { useHistory } from 'react-router-dom';
|
import { Button } from 'dingtalk-design-mobile';
|
import { RightArrow2Outlined, AddMembersOutlined } from 'dd-icons';
|
import { dateFormat, setLocal } from '../../utils/utility';
|
|
const ResidentMsg = ({ houseId, onlyCheck, data, onClickFamily }) => {
|
const history = useHistory();
|
|
return (
|
<div className="roomDetail-resident">
|
{data?.map((x, t) => {
|
let persons = x.residentInfoDTO || [];
|
return (
|
<div className="roomDetail-resident-item" key={t}>
|
<div onClick={() => onClickFamily(x, t)} className="roomDetail-resident-item-top">
|
<div>
|
分户{t + 1}（{persons.length}人）
|
</div>
|
{!onlyCheck && (
|
<div className="roomDetail-resident-item-top-icon">
|
<RightArrow2Outlined />
|
</div>
|
)}
|
</div>
|
<div className="roomDetail-resident-item-main">
|
{persons.length === 0 && !onlyCheck ? (
|
<>
|
<div className="roomDetail-resident-item-person">
|
<Button
|
onClick={() => {
|
history.push(`/hztGrid/person/personForm?houseId=${houseId}&formType=1&familyId=${x.familyId}`);
|
setLocal('familyData', { list: [], familyPage: 0, hoverPerson: 0 });
|
}}
|
icon={<AddMembersOutlined />}
|
size="middle"
|
style={{ width: '100%', '--background-color': '#edeef0', border: 'none' }}
|
>
|
点击添加住户信息
|
</Button>
|
</div>
|
</>
|
) : (
|
<>
|
{persons.map((item, index) => {
|
return (
|
<div
|
onClick={() => {
|
if (!onlyCheck) {
|
history.push(`/hztGrid/person/detail?personId=${item.personId}&familyId=${x.familyId}&houseId=${houseId}`);
|
}
|
}}
|
className="roomDetail-resident-item-person"
|
key={index}
|
>
|
<div className={`roomDetail-resident-item-person-${item.roleofhold === '户主' ? 'left1' : 'left2'}`}>
|
{item.roleofhold?.substring(0, 2)}
|
</div>
|
<div className="roomDetail-resident-item-person-right">
|
<div className="roomDetail-resident-item-person-title ellipsis-text-1">
|
<span>{item.personName}</span>
|
<span>{item.contact}</span>
|
{item.updateTime && <span className="public-tag2">{dateFormat(item.updateTime)}更新</span>}
|
</div>
|
<div style={{ height: '4px' }}></div>
|
<div className="roomDetail-resident-item-person-desc ellipsis-text-1">
|
<span>{item.idcard || '-'}</span>
|
{item.createTime && <span className="public-rightBorder">{dateFormat(item.createTime)}登记</span>}
|
</div>
|
{/* TODO:暂无迁出返回 <div className={`roomDetail-resident-item-person-${'red'}`}>
|
<span className="public-rightBorder">迁出</span>
|
</div> */}
|
</div>
|
</div>
|
);
|
})}
|
</>
|
)}
|
</div>
|
</div>
|
);
|
})}
|
</div>
|
);
|
};
|
|
export default ResidentMsg;
|
