|
|
|
@ -1,6 +1,6 @@ |
|
|
|
import React from "react"; |
|
|
|
import React from "react"; |
|
|
|
import {Button, ButtonGroup, Col, Container, Image, ListGroup, Row} from "react-bootstrap"; |
|
|
|
import {Button, ButtonGroup, Col, Container, Image, ListGroup, Row} from "react-bootstrap"; |
|
|
|
import {SeekHelpState, User, VolunteerStatus} from "../entity"; |
|
|
|
import {ActivityStatus, SeekHelpState, User} from "../entity"; |
|
|
|
import moment from "moment"; |
|
|
|
import moment from "moment"; |
|
|
|
import Dialog from "@material-ui/core/Dialog"; |
|
|
|
import Dialog from "@material-ui/core/Dialog"; |
|
|
|
import {CloseDialog} from "../ui/CloseDialog"; |
|
|
|
import {CloseDialog} from "../ui/CloseDialog"; |
|
|
|
@ -8,21 +8,30 @@ import {Paper, Tooltip} from "@material-ui/core"; |
|
|
|
import Draggable from "react-draggable"; |
|
|
|
import Draggable from "react-draggable"; |
|
|
|
import {MyDialog} from "../ui/MyDialog"; |
|
|
|
import {MyDialog} from "../ui/MyDialog"; |
|
|
|
import {MyInfo} from "./MyInfo"; |
|
|
|
import {MyInfo} from "./MyInfo"; |
|
|
|
import {userObj} from "../ui/TestData"; |
|
|
|
import {API, Method, prefix, request} from "../interface"; |
|
|
|
|
|
|
|
import {SeekHelpInfoRes, SeekHelpInfoTransform, SeekHelpUser, SeekHelpUserTransform, SimpleMessage} from "../result"; |
|
|
|
|
|
|
|
|
|
|
|
const titleId="seek-help-dialog" |
|
|
|
const titleId="seek-help-dialog" |
|
|
|
|
|
|
|
|
|
|
|
/** |
|
|
|
/** |
|
|
|
* 我的帮助 |
|
|
|
* 我的求助 |
|
|
|
*/ |
|
|
|
*/ |
|
|
|
export class SeekHelp extends React.Component<{ user:string }, |
|
|
|
export class SeekHelp extends React.Component<{ user:string }, |
|
|
|
{ |
|
|
|
{ |
|
|
|
data:Array<SeekHelpState>; |
|
|
|
//求助信息
|
|
|
|
|
|
|
|
data?:Array<SeekHelpState>; |
|
|
|
|
|
|
|
//志愿者列表弹框打开状态
|
|
|
|
open:boolean; |
|
|
|
open:boolean; |
|
|
|
|
|
|
|
//筛选的活动状态
|
|
|
|
status?:string; |
|
|
|
status?:string; |
|
|
|
|
|
|
|
//志愿者列表
|
|
|
|
volunteerList?:Array<User>; |
|
|
|
volunteerList?:Array<User>; |
|
|
|
|
|
|
|
//打开用户信息弹框
|
|
|
|
openUserInfo:boolean; |
|
|
|
openUserInfo:boolean; |
|
|
|
|
|
|
|
//查看用户信息用户id
|
|
|
|
userId?:string; |
|
|
|
userId?:string; |
|
|
|
|
|
|
|
//操作反馈弹窗
|
|
|
|
|
|
|
|
result:JSX.Element|null; |
|
|
|
}>{ |
|
|
|
}>{ |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
@ -32,7 +41,8 @@ export class SeekHelp extends React.Component<{ user:string }, |
|
|
|
this.state={ |
|
|
|
this.state={ |
|
|
|
data:[], |
|
|
|
data:[], |
|
|
|
open:false, |
|
|
|
open:false, |
|
|
|
openUserInfo:false |
|
|
|
openUserInfo:false, |
|
|
|
|
|
|
|
result:null |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
@ -44,63 +54,64 @@ export class SeekHelp extends React.Component<{ user:string }, |
|
|
|
* 加载我的求助信息 |
|
|
|
* 加载我的求助信息 |
|
|
|
*/ |
|
|
|
*/ |
|
|
|
loadHelp(){ |
|
|
|
loadHelp(){ |
|
|
|
this.setState({data:[ |
|
|
|
let that=this |
|
|
|
{ |
|
|
|
request(API.main.activity.seekHelp,Method.GET, {},new SeekHelpInfoTransform(),function (res:SeekHelpInfoRes) { |
|
|
|
applyVolunteerList: [userObj,userObj], |
|
|
|
switch (res.customResult) { |
|
|
|
completeVolunteerList: [], |
|
|
|
case SimpleMessage.fail: |
|
|
|
joinVolunteerList: [], |
|
|
|
that.setState({ |
|
|
|
activityImg: "logo512.png", |
|
|
|
result:<h3 className="text-danger text-center">获取求助信息失败，请联系管理员</h3> |
|
|
|
content: "活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容", |
|
|
|
}); |
|
|
|
time: new Date().getTime(), |
|
|
|
break |
|
|
|
title:"活动标题", |
|
|
|
case SimpleMessage.ok: |
|
|
|
//活动Id
|
|
|
|
console.debug("求助信息"+res.dataList) |
|
|
|
activityId:123, |
|
|
|
that.setState({ |
|
|
|
}, |
|
|
|
data:res.dataList |
|
|
|
{ |
|
|
|
}) |
|
|
|
applyVolunteerList: [], |
|
|
|
|
|
|
|
completeVolunteerList: [], |
|
|
|
|
|
|
|
joinVolunteerList: [], |
|
|
|
|
|
|
|
activityImg: "logo512.png", |
|
|
|
|
|
|
|
content: "活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容", |
|
|
|
|
|
|
|
time: new Date().getTime(), |
|
|
|
|
|
|
|
title:"活动标题", |
|
|
|
|
|
|
|
//活动Id
|
|
|
|
|
|
|
|
activityId:123, |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
{ |
|
|
|
|
|
|
|
applyVolunteerList: [], |
|
|
|
|
|
|
|
completeVolunteerList: [], |
|
|
|
|
|
|
|
joinVolunteerList: [], |
|
|
|
|
|
|
|
activityImg: "logo512.png", |
|
|
|
|
|
|
|
content: "活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容", |
|
|
|
|
|
|
|
time: new Date().getTime(), |
|
|
|
|
|
|
|
title:"活动标题", |
|
|
|
|
|
|
|
//活动Id
|
|
|
|
|
|
|
|
activityId:123, |
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
]}) |
|
|
|
}) |
|
|
|
|
|
|
|
|
|
|
|
console.debug(this.state) |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
//打开志愿者列表
|
|
|
|
|
|
|
|
openVolunteerList(activityId:number,status:ActivityStatus){ |
|
|
|
|
|
|
|
let that=this |
|
|
|
|
|
|
|
request(API.main.activity.seekHelpUser+"?activityId="+activityId+"&activityStatus="+status,Method.GET,{}, |
|
|
|
|
|
|
|
new SeekHelpUserTransform(),function (res:SeekHelpUser) { |
|
|
|
|
|
|
|
switch (res.customResult) { |
|
|
|
|
|
|
|
case SimpleMessage.fail: |
|
|
|
|
|
|
|
that.setState({ |
|
|
|
|
|
|
|
result:<h3 className="text-danger text-center">获取志愿者信息失败，请联系管理员</h3> |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
break |
|
|
|
|
|
|
|
case SimpleMessage.ok: |
|
|
|
|
|
|
|
that.setState({ |
|
|
|
|
|
|
|
volunteerList:res.dataList, |
|
|
|
|
|
|
|
open:true, |
|
|
|
|
|
|
|
status:that.getStatus(status) |
|
|
|
|
|
|
|
}) |
|
|
|
|
|
|
|
break |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
}) |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
getStatus(status:VolunteerStatus){ |
|
|
|
//活动状态转换
|
|
|
|
|
|
|
|
getStatus(status:ActivityStatus){ |
|
|
|
switch (status) { |
|
|
|
switch (status) { |
|
|
|
case VolunteerStatus.apply:return "报名" |
|
|
|
case ActivityStatus.apply:return "报名" |
|
|
|
case VolunteerStatus.join:return "参加" |
|
|
|
case ActivityStatus.join:return "参与" |
|
|
|
case VolunteerStatus.complete:return "完成" |
|
|
|
case ActivityStatus.complete:return "完成" |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
render() { |
|
|
|
render() { |
|
|
|
return ( |
|
|
|
return ( |
|
|
|
<div className="overflow-auto seek-help-height"> |
|
|
|
<div className="overflow-auto seek-help-height w-100"> |
|
|
|
{this.state.data.map((help:SeekHelpState, index:number)=> |
|
|
|
{this.state.data?this.state.data.map((help:SeekHelpState, index:number)=> |
|
|
|
<div key={"list"+index} className="mt-3 mb-3 border-info border"> |
|
|
|
<div key={"list"+index} className="mt-3 mb-3 border-info border"> |
|
|
|
<Container> |
|
|
|
<Container> |
|
|
|
<Row> |
|
|
|
<Row> |
|
|
|
<Col xs={4}> |
|
|
|
<Col xs={4}> |
|
|
|
<Image src={help.activityImg} className="activityImage"/> |
|
|
|
<Image src={help.activityImg?prefix.image+help.activityImg:""} className="activityImage"/> |
|
|
|
</Col> |
|
|
|
</Col> |
|
|
|
<Col> |
|
|
|
<Col> |
|
|
|
<h5>{help.title}</h5> |
|
|
|
<h5>{help.title}</h5> |
|
|
|
@ -109,20 +120,20 @@ export class SeekHelp extends React.Component<{ user:string }, |
|
|
|
</Row> |
|
|
|
</Row> |
|
|
|
<Row> |
|
|
|
<Row> |
|
|
|
<Col xs={4} className="mt-auto mb-auto"> |
|
|
|
<Col xs={4} className="mt-auto mb-auto"> |
|
|
|
<span>{moment(help.time).format("YYYY-MM-DD HH:mm:ss")}</span> |
|
|
|
<span>{moment(help.seekHelpTime).format("YYYY-MM-DD HH:mm:ss")}</span> |
|
|
|
</Col> |
|
|
|
</Col> |
|
|
|
<Col> |
|
|
|
<Col> |
|
|
|
<ButtonGroup> |
|
|
|
<ButtonGroup> |
|
|
|
<Button variant={"primary"} disabled={help.applyVolunteerList.length===0} onClick={()=>this.setState({open:true,status:this.getStatus(VolunteerStatus.apply),volunteerList:help.applyVolunteerList})}>报名人数:{help.applyVolunteerList.length}</Button> |
|
|
|
<Button variant={"primary"} disabled={help.apply===0} onClick={()=>this.openVolunteerList(help.activityId,ActivityStatus.apply)}>报名人数:{help.apply}</Button> |
|
|
|
<Button variant={"success"} disabled={help.joinVolunteerList.length===0} onClick={()=>this.setState({open:true,status:this.getStatus(VolunteerStatus.join),volunteerList:help.joinVolunteerList})}>参与人数:{help.joinVolunteerList.length}</Button> |
|
|
|
<Button variant={"success"} disabled={help.join===0} onClick={()=>this.openVolunteerList(help.activityId,ActivityStatus.join)}>参与人数:{help.join}</Button> |
|
|
|
<Button variant={"light"} disabled={help.completeVolunteerList.length===0} onClick={()=>this.setState({open:true,status:this.getStatus(VolunteerStatus.complete),volunteerList:help.completeVolunteerList})}>完成人数:{help.completeVolunteerList.length}</Button> |
|
|
|
<Button variant={"light"} disabled={help.complete===0} onClick={()=>this.openVolunteerList(help.activityId,ActivityStatus.complete)}>完成人数:{help.complete}</Button> |
|
|
|
</ButtonGroup> |
|
|
|
</ButtonGroup> |
|
|
|
</Col> |
|
|
|
</Col> |
|
|
|
</Row> |
|
|
|
</Row> |
|
|
|
</Container> |
|
|
|
</Container> |
|
|
|
|
|
|
|
|
|
|
|
</div> |
|
|
|
</div> |
|
|
|
)} |
|
|
|
):null} |
|
|
|
|
|
|
|
|
|
|
|
<Dialog hideBackdrop={true} open={this.state.open} |
|
|
|
<Dialog hideBackdrop={true} open={this.state.open} |
|
|
|
PaperComponent={(props)=> |
|
|
|
PaperComponent={(props)=> |
|
|
|
@ -146,6 +157,9 @@ export class SeekHelp extends React.Component<{ user:string }, |
|
|
|
<MyDialog titleId="view-user" menuName="用户信息" |
|
|
|
<MyDialog titleId="view-user" menuName="用户信息" |
|
|
|
content={<MyInfo isOwn={false} isMyFriend={false} isAdd={true} userId={this.state.userId?this.state.userId:""}/>} |
|
|
|
content={<MyInfo isOwn={false} isMyFriend={false} isAdd={true} userId={this.state.userId?this.state.userId:""}/>} |
|
|
|
open={this.state.openUserInfo} onClose={()=>this.setState({openUserInfo:false})}/> |
|
|
|
open={this.state.openUserInfo} onClose={()=>this.setState({openUserInfo:false})}/> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<MyDialog content={this.state.result} open={this.state.result!==null} titleId="seek-help-dialog" |
|
|
|
|
|
|
|
menuName="求助信息提示" onClose={()=>this.setState({result:null})} /> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
) |
|
|
|
) |
|
|
|
} |
|
|
|
} |
|
|
|
|
pan
5 years ago