/*
|
* @Company: hugeInfo
|
* @Author: ldh
|
* @Date: 2022-09-16 16:35:20
|
* @LastEditTime: 2023-06-10 21:27:08
|
* @LastEditors: lwh
|
* @Version: 1.0.0
|
* @Description: 楼栋列表 - 列表组件
|
*/
|
import React, { useEffect } from 'react';
|
import { useHistory } from 'react-router-dom';
|
import { Space } from 'dingtalk-design-mobile';
|
import MyList from '../MyList';
|
import { dateFormat, getUpdateStr, searchTitle } from '../../utils/utility';
|
import routerStatus from '../../status/router';
|
|
const BuildingList = ({ search, data, hasMore, getScrollTopKey, scrollTop, searchValue, getBuildingData }) => {
|
const history = useHistory();
|
|
// 加载更多数据
|
function handleLoadMore(callback) {
|
getBuildingData({ ...search, page: search.page + 1 }, '', callback);
|
}
|
|
// 楼栋更新
|
useEffect(() => {
|
if (routerStatus.spinPage['building']) {
|
getBuildingData({ ...search, page: 1, size: search.page * search.size }, 'spin');
|
routerStatus.setPageScrollTopNow('building');
|
routerStatus.clearSpinPage('building');
|
}
|
}, [routerStatus.spinPage['building']]);
|
|
return (
|
<MyList
|
data={data}
|
hasMore={hasMore}
|
loadMore={handleLoadMore}
|
getScrollTopKey={getScrollTopKey}
|
scrollTop={scrollTop}
|
itemDom={(item, index) => {
|
return (
|
<div
|
className="building-card-bottom"
|
key={'building' + index}
|
style={index === 0 ? { marginTop: 0 } : null}
|
onClick={() => history.push(`/hztGrid/room?id=${item.id}&address=${item.address}&gridCode=${item.gridCode}`)}
|
>
|
<div className="building-card">
|
<div className="building-title">
|
{item.taskTagList?.map((x, t) => (
|
<span key={t} className={`public-tag public-tag-${x === '21_00016-1' ? 'blue' : x === '21_00016-2' ? 'red' : 'green'}`}>
|
{x === '21_00016-1' ? '待排查' : x === '21_00016-2' ? '待核实' : '地址未同步'}
|
</span>
|
))}
|
<span>{searchValue ? searchTitle(item.address, searchValue) : item.address}</span>
|
</div>
|
<div className="building-subtitle">
|
<div className="building-subtitle-text">{item.floorcount || 0}层</div>
|
<div className="public-split" />
|
<div className="building-subtitle-text">{item.roomcount || 0}房间</div>
|
<div className="public-split" />
|
<div className="building-subtitle-text">{item.familyCount || 0}分户</div>
|
<div className="public-split" />
|
<div className="building-subtitle-text">{item.personcount || 0}人口</div>
|
<div className="public-split" />
|
<div className="building-subtitle-text">{item.updateTime ? `${dateFormat(item.updateTime)}更新` : '-'}</div>
|
</div>
|
<Space>
|
{getUpdateStr(item.updateTime) ? <div className="public-tag2">{getUpdateStr(item.updateTime)}</div> : null}
|
<div className="public-tag2">{item.communityName + item.gridNum}</div>
|
</Space>
|
</div>
|
</div>
|
);
|
}}
|
/>
|
);
|
};
|
|
export default BuildingList;
|
