94 lines
2.9 KiB
TypeScript
94 lines
2.9 KiB
TypeScript
|
import React, { useEffect, useState } from 'react';
|
||
|
|
import '../style.less';
|
||
|
|
import { Input, List, Spin } from 'antd';
|
||
|
|
import { getBranchesList } from '../Home/service';
|
||
|
|
import person from '@/assets/topic/person.png'
|
||
|
|
import { history } from 'umi';
|
||
|
|
|
||
|
|
const { Search } = Input;
|
||
|
|
|
||
|
|
const PartyBranches: React.FC<{}> = (props: any) => {
|
||
|
|
//branches list
|
||
|
|
const [branchesData, setBranchesData] = useState<any[]>([]);
|
||
|
|
//loading
|
||
|
|
const [loading, setLoading] = useState<boolean>(false);
|
||
|
|
//get branches list
|
||
|
|
const getBranchesData = (belongBranchName: string) => {
|
||
|
|
setLoading(true);
|
||
|
|
getBranchesList({ branchName: props.location.state?.branchName || '', param: belongBranchName }).then(res => {
|
||
|
|
if (res?.code == 200) {
|
||
|
|
setBranchesData(res?.data);
|
||
|
|
}
|
||
|
|
}).finally(() => {
|
||
|
|
setLoading(false);
|
||
|
|
})
|
||
|
|
}
|
||
|
|
//to home
|
||
|
|
const toHome = () => {
|
||
|
|
history.push("/highQualityOperation/home");
|
||
|
|
}
|
||
|
|
//goback lastpage
|
||
|
|
const toGoBack = () => {
|
||
|
|
window.history.go(-1);
|
||
|
|
}
|
||
|
|
//onclick card
|
||
|
|
const onCardClick = (data: any) => {
|
||
|
|
history.push({ pathname: "/highQualityOperation/personInfor", state: data });
|
||
|
|
}
|
||
|
|
useEffect(() => {
|
||
|
|
getBranchesData('');
|
||
|
|
}, [])
|
||
|
|
|
||
|
|
return (
|
||
|
|
<div className="page-container">
|
||
|
|
<div className="top-banner">
|
||
|
|
<div className="back-home">
|
||
|
|
<span onClick={() => toHome()}>返回首页</span>
|
||
|
|
<span onClick={() => toGoBack()}>上一页</span>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<Spin spinning={loading}>
|
||
|
|
<div className="search">
|
||
|
|
<span className="text"><span>党支部名录</span>(当前共{branchesData.length}条)</span>
|
||
|
|
<div className="search-box">
|
||
|
|
<Search
|
||
|
|
placeholder="党支部名称"
|
||
|
|
allowClear
|
||
|
|
enterButton="搜索"
|
||
|
|
style={{ width: 322 }}
|
||
|
|
onSearch={getBranchesData}
|
||
|
|
/>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div className="mess-box mess-detail">
|
||
|
|
<List
|
||
|
|
grid={{ gutter: 16, column: 4 }}
|
||
|
|
dataSource={branchesData}
|
||
|
|
renderItem={item => (
|
||
|
|
<List.Item>
|
||
|
|
<div className="wrapper" onClick={() => onCardClick(item)}>
|
||
|
|
<div className="top-bg">
|
||
|
|
<div className="branch-title">
|
||
|
|
<span>{item.belongBranchName}</span>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div className="mess-content mess-content-branches">
|
||
|
|
<div className="mess-right">
|
||
|
|
<span>{item.count}</span>人
|
||
|
|
<div>
|
||
|
|
<img src={person} />
|
||
|
|
<span>党员数量</span>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</List.Item>
|
||
|
|
)}
|
||
|
|
/>
|
||
|
|
</div>
|
||
|
|
</Spin>
|
||
|
|
</div>
|
||
|
|
)
|
||
|
|
}
|
||
|
|
|
||
|
|
export default PartyBranches;
|