You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
141 lines
5.6 KiB
141 lines
5.6 KiB
import React from "react";
|
|
import {Button, Table} from "react-bootstrap";
|
|
import {Input} from "../ui/InputGroup";
|
|
import {PageProps, User, UserType} from "../entity";
|
|
import {Page} from "../ui/Page";
|
|
import {Address} from "../ui/Address";
|
|
import {Method, request} from "../interface"
|
|
import {FindUserRes, FindUserTransform, PageDataMessage} from "../result";
|
|
import {MyDialog} from "../ui/MyDialog";
|
|
import {Api} from "../api";
|
|
|
|
/**
|
|
* 志愿者信息
|
|
*/
|
|
export class Volunteer extends React.Component<{ undefined?:undefined },
|
|
{
|
|
form:{
|
|
keyword:string;
|
|
serviceAddress:string|null;
|
|
};
|
|
volunteerList?:Array<Array<User>>;
|
|
page?:PageProps;
|
|
result:JSX.Element|null;
|
|
}>{
|
|
|
|
|
|
constructor(props: Readonly<any>) {
|
|
super(props);
|
|
|
|
this.state={
|
|
result: null,
|
|
form:{
|
|
keyword:"",
|
|
serviceAddress:""
|
|
}
|
|
}
|
|
}
|
|
|
|
componentDidMount() {
|
|
this.loadVolunteerList(1)
|
|
}
|
|
|
|
/**
|
|
* 加载志愿者列表
|
|
*/
|
|
loadVolunteerList(page:number){
|
|
|
|
let that=this
|
|
request(Api.account.find,Method.GET,{
|
|
currentPage:String(page),
|
|
userTypes:[UserType.help],
|
|
info:this.state.form.keyword,
|
|
serviceAddress:this.state.form.serviceAddress?this.state.form.serviceAddress:""
|
|
},new FindUserTransform(),function(res:FindUserRes){
|
|
switch (res.customResult) {
|
|
case PageDataMessage.ok:
|
|
|
|
that.setState({
|
|
volunteerList: page===1?res.dataList||[]:(that.state.volunteerList||[]).concat(res.dataList||[]),
|
|
page: res.page,
|
|
form:{
|
|
keyword:that.state.form.keyword,
|
|
serviceAddress:that.state.form.serviceAddress
|
|
}
|
|
})
|
|
break
|
|
case PageDataMessage.fail:
|
|
that.setState({
|
|
form:{
|
|
keyword:that.state.form.keyword,
|
|
serviceAddress:that.state.form.serviceAddress
|
|
},
|
|
result:<h3 className="text-center text-danger">志愿者搜索失败,请联系管理员</h3>
|
|
});break
|
|
case PageDataMessage.empty:
|
|
that.setState({
|
|
volunteerList:[]
|
|
});
|
|
break
|
|
}
|
|
})
|
|
}
|
|
|
|
render() {
|
|
return (
|
|
<div className="p-5">
|
|
|
|
<h3>搜索志愿者</h3>
|
|
|
|
<Input col={3} name="keyword" desc="描述信息关键字" onChange={(value:string)=>this.setState({form:{
|
|
keyword:value,
|
|
serviceAddress:this.state.form.serviceAddress
|
|
}})}/>
|
|
|
|
<div className="mt-3">
|
|
<Address onChange={(value:string)=>this.setState({
|
|
form:{
|
|
keyword:this.state.form.keyword,
|
|
serviceAddress:value
|
|
}
|
|
})}/>
|
|
</div>
|
|
|
|
<Button className="col-1 mt-3 mb-3" variant="info" onClick={()=>this.loadVolunteerList(1)}>搜索</Button>
|
|
|
|
{/*<Page onClick={(page:number)=>this.loadVolunteerList(page)} currentPage={this.state.page.currentPage} totalPage={this.state.page.totalPage} pageSize={this.state.page.pageSize}/>*/}
|
|
|
|
|
|
{this.state.volunteerList?this.state.volunteerList.length===0?<h3 className="text-info text-center">当前没有志愿者</h3>:this.state.volunteerList.map((volunteers:Array<User>, index:number)=>
|
|
<div className="p-3 d-flex ml-auto mr-auto volunteer overflow-auto justify-content-center" key={"row"+index}>{volunteers.map((volunteer:User, subIndex:number)=>
|
|
<div key={"col"+subIndex} className="mr-3">
|
|
<div className="border-info border">
|
|
志愿者个人简介
|
|
</div>
|
|
<div>
|
|
<p className="border-info border m-0">{volunteer.info}</p>
|
|
</div>
|
|
<div >
|
|
<Table>
|
|
<tbody>
|
|
{[[volunteer.name,volunteer.sex,volunteer.age],[volunteer.mobile,volunteer.email,volunteer.serviceAddress]].map((tr, index)=>
|
|
<tr key={"tr"+index}>
|
|
{tr.map((td,index)=><td key={"td"+index} className="border border-info">{td}</td>)}
|
|
</tr>
|
|
)}
|
|
</tbody>
|
|
</Table>
|
|
</div>
|
|
</div>
|
|
)}</div>
|
|
):null}
|
|
|
|
<MyDialog content={this.state.result} open={this.state.result!==null} titleId="find-volunteer" menuName="搜索志愿者" onClose={()=>this.setState({result:null})}/>
|
|
|
|
{this.state.page?<Page onClick={(page:number)=>this.loadVolunteerList(page)} currentPage={this.state.page.currentPage} totalPage={this.state.page.totalPage} pageSize={this.state.page.pageSize}/>:null}
|
|
|
|
</div>
|
|
|
|
)
|
|
}
|
|
}
|
|
|