|
|
|
|
@ -2,9 +2,9 @@ import React from "react"; |
|
|
|
|
import {Button, Card, Col, Container, ListGroup, Row} from "react-bootstrap"; |
|
|
|
|
|
|
|
|
|
import {Page} from "../ui/Page"; |
|
|
|
|
import {ActiveDetail, BaseHelp, PageProps} from "../entity"; |
|
|
|
|
import {ActivityDetail, BaseHelp, PageProps} from "../entity"; |
|
|
|
|
import {MyDialog} from "../ui/MyDialog"; |
|
|
|
|
import {Active} from "../ui/Active"; |
|
|
|
|
import {Activity} from "../ui/Activity"; |
|
|
|
|
import {Input} from "../ui/InputGroup"; |
|
|
|
|
|
|
|
|
|
/** |
|
|
|
|
@ -13,13 +13,13 @@ import {Input} from "../ui/InputGroup"; |
|
|
|
|
export class IndexMenu extends React.Component<{ user:string }, |
|
|
|
|
{ |
|
|
|
|
//活动数据
|
|
|
|
|
activeList:Array<Array<BaseHelp>>; |
|
|
|
|
activityList:Array<Array<BaseHelp>>; |
|
|
|
|
//分页信息
|
|
|
|
|
page:PageProps; |
|
|
|
|
//活动
|
|
|
|
|
active?:ActiveDetail; |
|
|
|
|
activity?:ActivityDetail; |
|
|
|
|
//打开活动
|
|
|
|
|
openActive:boolean; |
|
|
|
|
openActivity:boolean; |
|
|
|
|
//检索活动标题
|
|
|
|
|
title:string; |
|
|
|
|
}>{ |
|
|
|
|
@ -30,41 +30,41 @@ export class IndexMenu extends React.Component<{ user:string }, |
|
|
|
|
super(props); |
|
|
|
|
|
|
|
|
|
this.state={ |
|
|
|
|
activeList:[], |
|
|
|
|
activityList:[], |
|
|
|
|
page:{ |
|
|
|
|
currentPage:1, |
|
|
|
|
totalPage:3, |
|
|
|
|
pageSize:9 |
|
|
|
|
}, |
|
|
|
|
openActive:false, |
|
|
|
|
openActivity:false, |
|
|
|
|
title:"" |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
componentDidMount() { |
|
|
|
|
this.loadActive(1) |
|
|
|
|
this.loadActivity(1) |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
/** |
|
|
|
|
* 报名活动 |
|
|
|
|
* @param activeId |
|
|
|
|
* @param activityId |
|
|
|
|
*/ |
|
|
|
|
applyActive(activeId:number){ |
|
|
|
|
console.debug("报名活动"+activeId) |
|
|
|
|
applyActivity(activityId:number){ |
|
|
|
|
console.debug("报名活动"+activityId) |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
/** |
|
|
|
|
* 查找活动 |
|
|
|
|
* @param activeId |
|
|
|
|
* @param activityId |
|
|
|
|
*/ |
|
|
|
|
loadActiveWithId(activeId:number):ActiveDetail{ |
|
|
|
|
loadActivityWithId(activityId:number):ActivityDetail{ |
|
|
|
|
return { |
|
|
|
|
activeId:123, |
|
|
|
|
activeImg:"logo512.png", |
|
|
|
|
activityId:123, |
|
|
|
|
activityImg:"logo512.png", |
|
|
|
|
content: "活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容", |
|
|
|
|
title: "标题标题标题标题标题标题标题", |
|
|
|
|
activeEndTime:new Date().getTime(), |
|
|
|
|
activeStartTime:new Date().getTime() |
|
|
|
|
activityEndTime:new Date().getTime(), |
|
|
|
|
activityStartTime:new Date().getTime() |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
@ -72,85 +72,85 @@ export class IndexMenu extends React.Component<{ user:string }, |
|
|
|
|
* 加载活动列表 |
|
|
|
|
* @param page |
|
|
|
|
*/ |
|
|
|
|
loadActive(page:number){ |
|
|
|
|
loadActivity(page:number){ |
|
|
|
|
console.debug("检索活动关键字:"+this.state.title) |
|
|
|
|
|
|
|
|
|
this.setState({ |
|
|
|
|
activeList:[[{ |
|
|
|
|
activeId: 123, |
|
|
|
|
activityList:[[{ |
|
|
|
|
activityId: 123, |
|
|
|
|
//活动标题
|
|
|
|
|
title: "活动标题", |
|
|
|
|
//活动内容
|
|
|
|
|
content: "活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容", |
|
|
|
|
//活动图片
|
|
|
|
|
activeImg: "/logo512.png" |
|
|
|
|
activityImg: "/logo512.png" |
|
|
|
|
},{ |
|
|
|
|
activeId: 123, |
|
|
|
|
activityId: 123, |
|
|
|
|
//活动标题
|
|
|
|
|
title: "活动标题", |
|
|
|
|
//活动内容
|
|
|
|
|
content: "活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容", |
|
|
|
|
//活动图片
|
|
|
|
|
activeImg: "/logo512.png" |
|
|
|
|
activityImg: "/logo512.png" |
|
|
|
|
},{ |
|
|
|
|
activeId: 123, |
|
|
|
|
activityId: 123, |
|
|
|
|
//活动标题
|
|
|
|
|
title: "活动标题", |
|
|
|
|
//活动内容
|
|
|
|
|
content: "活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容", |
|
|
|
|
//活动图片
|
|
|
|
|
activeImg: "/logo512.png" |
|
|
|
|
activityImg: "/logo512.png" |
|
|
|
|
}],[{ |
|
|
|
|
activeId: 123, |
|
|
|
|
activityId: 123, |
|
|
|
|
//活动标题
|
|
|
|
|
title: "活动标题", |
|
|
|
|
//活动内容
|
|
|
|
|
content: "活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容", |
|
|
|
|
//活动图片
|
|
|
|
|
activeImg: "/logo512.png" |
|
|
|
|
activityImg: "/logo512.png" |
|
|
|
|
},{ |
|
|
|
|
activeId: 123, |
|
|
|
|
activityId: 123, |
|
|
|
|
//活动标题
|
|
|
|
|
title: "活动标题", |
|
|
|
|
//活动内容
|
|
|
|
|
content: "活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容", |
|
|
|
|
//活动图片
|
|
|
|
|
activeImg: "/logo512.png" |
|
|
|
|
activityImg: "/logo512.png" |
|
|
|
|
},{ |
|
|
|
|
activeId: 123, |
|
|
|
|
activityId: 123, |
|
|
|
|
//活动标题
|
|
|
|
|
title: "活动标题", |
|
|
|
|
//活动内容
|
|
|
|
|
content: "活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容活动内容", |
|
|
|
|
//活动图片
|
|
|
|
|
activeImg: "/logo512.png" |
|
|
|
|
activityImg: "/logo512.png" |
|
|
|
|
}]] |
|
|
|
|
}) |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
render() { |
|
|
|
|
const rowList=this.state.activeList.map((actives:Array<BaseHelp>, index:number)=> |
|
|
|
|
<Row className="p-3" key={"row"+index}>{actives.map((active:BaseHelp, subIndex:number)=> |
|
|
|
|
const rowList=this.state.activityList.map((activities:Array<BaseHelp>, index:number)=> |
|
|
|
|
<Row className="p-3" key={"row"+index}>{activities.map((activity:BaseHelp, subIndex:number)=> |
|
|
|
|
<Col className="col-4" key={"col"+subIndex}> |
|
|
|
|
<Card> |
|
|
|
|
<Card.Header> |
|
|
|
|
<img src={active.activeImg} alt="活动图片" className="activeImage"/> |
|
|
|
|
<img src={activity.activityImg} alt="活动图片" className="activityImage"/> |
|
|
|
|
</Card.Header> |
|
|
|
|
<Card.Body> |
|
|
|
|
<ListGroup> |
|
|
|
|
<ListGroup.Item className="bg-info" style={{color:"white",fontWeight:"bold"}}> |
|
|
|
|
{active.title} |
|
|
|
|
{activity.title} |
|
|
|
|
</ListGroup.Item> |
|
|
|
|
<ListGroup.Item> |
|
|
|
|
<p className="active-text-limit text-ellipsis">{active.content}</p> |
|
|
|
|
<p className="activity-text-limit text-ellipsis">{activity.content}</p> |
|
|
|
|
</ListGroup.Item> |
|
|
|
|
</ListGroup> |
|
|
|
|
</Card.Body> |
|
|
|
|
<Card.Footer> |
|
|
|
|
<Button variant={"info"} onClick={()=>this.setState({ |
|
|
|
|
active:this.loadActiveWithId(active.activeId), |
|
|
|
|
openActive:true |
|
|
|
|
activity:this.loadActivityWithId(activity.activityId), |
|
|
|
|
openActivity:true |
|
|
|
|
})} className="mr-2">查看活动详情</Button> |
|
|
|
|
<Button variant="primary" >帮助</Button> |
|
|
|
|
</Card.Footer> |
|
|
|
|
@ -165,7 +165,7 @@ export class IndexMenu extends React.Component<{ user:string }, |
|
|
|
|
|
|
|
|
|
<Input name="keyword" desc="活动标题" onChange={(value:string)=>this.setState({title:value})}/> |
|
|
|
|
|
|
|
|
|
<Button className="mt-3 mb-3" variant={"info"} onClick={()=>this.loadActive(1)}>检索活动</Button> |
|
|
|
|
<Button className="mt-3 mb-3" variant={"info"} onClick={()=>this.loadActivity(1)}>检索活动</Button> |
|
|
|
|
|
|
|
|
|
{/*<Page onClick={(page:number)=>this.loadActive(page)} currentPage={this.state.page.currentPage} totalPage={this.state.page.totalPage} pageSize={this.state.page.pageSize}/>*/} |
|
|
|
|
|
|
|
|
|
@ -173,11 +173,11 @@ export class IndexMenu extends React.Component<{ user:string }, |
|
|
|
|
{rowList} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<Page onClick={(page:number)=>this.loadActive(page)} currentPage={this.state.page.currentPage} totalPage={this.state.page.totalPage} pageSize={this.state.page.pageSize}/> |
|
|
|
|
<Page onClick={(page:number)=>this.loadActivity(page)} currentPage={this.state.page.currentPage} totalPage={this.state.page.totalPage} pageSize={this.state.page.pageSize}/> |
|
|
|
|
|
|
|
|
|
{this.state.active?<MyDialog content={<Active active={this.state.active} showButton={true} applyFunction={(activeId:number)=>this.applyActive(activeId)} />} |
|
|
|
|
open={this.state.openActive} titleId="view-active" menuName="活动详情" |
|
|
|
|
onClose={()=>this.setState({active:undefined,openActive:false})}/>:null} |
|
|
|
|
{this.state.activity?<MyDialog content={<Activity activity={this.state.activity} showButton={true} applyFunction={(activeId:number)=>this.applyActivity(activeId)} />} |
|
|
|
|
open={this.state.openActivity} titleId="view-active" menuName="活动详情" |
|
|
|
|
onClose={()=>this.setState({activity:undefined,openActivity:false})}/>:null} |
|
|
|
|
|
|
|
|
|
</Container> |
|
|
|
|
) |
|
|
|
|
|
pan
4 years ago