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.
183 lines
7.1 KiB
183 lines
7.1 KiB
import React from "react";
|
|
import {Button, Form, ListGroup, Tab, Table, Tabs} from "react-bootstrap";
|
|
import {ManagerActivity} from "./entity";
|
|
import {JSONResponse, Method, request} from "./interface";
|
|
import {API} from "./api";
|
|
import {EmptyBodyTransform, FindActivityRes, FindActivityTransform, PageDataMessage, SimpleMessage} from "./result";
|
|
import {MyDialog} from "./ui/MyDialog";
|
|
import moment from "moment";
|
|
import {Input} from "./ui/InputGroup";
|
|
|
|
const contentMaxLength=50
|
|
|
|
class EditActive extends React.Component<
|
|
{
|
|
onClick:Function;
|
|
activity:ManagerActivity;
|
|
},
|
|
{
|
|
activity:ManagerActivity;
|
|
}>{
|
|
|
|
|
|
constructor(props: Readonly<{ onClick: Function; activity: ManagerActivity }>) {
|
|
super(props);
|
|
|
|
this.state={
|
|
activity:this.props.activity
|
|
}
|
|
}
|
|
|
|
render() {
|
|
return (
|
|
<Form>
|
|
<Input name="title" desc="活动标题" value={this.state.activity.title} onChange={(value:string)=>
|
|
this.setState({
|
|
activity:{...this.state.activity,...{title:value}}
|
|
})} valid={{check:this.isNotEmpty(this.state.activity.title)}}/>
|
|
|
|
<Input name="content" desc="活动内容" value={this.state.activity.content} as="textarea" valid=
|
|
{{check:this.state.activity.content.length>0,valid:this.state.activity.content.length===0?
|
|
"验证失败":"您还可输入"+(contentMaxLength-this.state.activity.content.length+"个字符")}}
|
|
maxLength={contentMaxLength} onChange={(value:string)=>this.setState({activity:{...this.state.activity,...{content:value}}})}/>
|
|
|
|
<Button variant={"info"} block={true} className="ml-auto mr-auto col-3 mt-3" onClick={()=>this.props.onClick(this.state.activity)}>提交</Button>
|
|
</Form>
|
|
);
|
|
}
|
|
|
|
private isNotEmpty(name: any) {
|
|
return String(name).length>0;
|
|
}
|
|
}
|
|
|
|
/**
|
|
* 活动管理
|
|
*/
|
|
export class Active extends React.Component<any, {
|
|
activeList?:Array<ManagerActivity>;
|
|
tipContent:JSX.Element|null
|
|
dialog:JSX.Element|null
|
|
}>{
|
|
|
|
|
|
constructor(props: Readonly<any>) {
|
|
super(props);
|
|
|
|
this.state={
|
|
tipContent:null,
|
|
dialog:null
|
|
}
|
|
}
|
|
|
|
//加载活动信息
|
|
loadActive(page:number){
|
|
let that=this
|
|
request(API.account.findActivity,Method.GET,{
|
|
currentPage:String(page)
|
|
},new FindActivityTransform(),function (res:FindActivityRes) {
|
|
switch (res.customResult) {
|
|
case PageDataMessage.ok:
|
|
that.setState({
|
|
activeList:res.dataList
|
|
})
|
|
// that.loadActive(1)
|
|
break
|
|
case PageDataMessage.fail:
|
|
that.setState({
|
|
tipContent:<h3>查询活动失败,请联系管理员</h3>
|
|
})
|
|
break
|
|
}
|
|
} )
|
|
}
|
|
|
|
componentDidMount() {
|
|
this.loadActive(1)
|
|
}
|
|
|
|
render() {
|
|
|
|
|
|
return (
|
|
<Tabs defaultActiveKey="info" id="uncontrolled-tab-example">
|
|
<Tab eventKey="info" title="活动管理">
|
|
<Table striped bordered hover className="mt-3">
|
|
<thead>
|
|
<tr>
|
|
<th>#</th>
|
|
<th>活动标题</th>
|
|
<th>活动内容</th>
|
|
<th>开始时间</th>
|
|
<th>结束时间</th>
|
|
<th>求助用户id</th>
|
|
<th>帮助用户id</th>
|
|
<th>操作</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{this.state.activeList?this.state.activeList.length>0?this.state.activeList.map((active:ManagerActivity,index:number)=>
|
|
<tr key={"tr"+index}>
|
|
<td>{index+1}</td>
|
|
<td>{active.title}</td>
|
|
<td>{active.content}</td>
|
|
<td>{moment(active.activityStartTime).format("YYYY-MM-DD HH:mm:ss")}</td>
|
|
<td>{moment(active.activityEndTime).format("YYYY-MM-DD HH:mm:ss")}</td>
|
|
<td>{active.seekHelpUser}</td>
|
|
<td>
|
|
{active.helpUser != null ?
|
|
<ListGroup>
|
|
{active.helpUser.map((userId,index) =>
|
|
<ListGroup.Item key={'item'+index}>{userId}</ListGroup.Item>)}
|
|
</ListGroup>:'无'
|
|
}
|
|
</td>
|
|
<td><Button variant={"info"} onClick={()=>this.setState({
|
|
dialog:<MyDialog content={<EditActive onClick={(activity:ManagerActivity)=>this.modifyActivity(activity)} activity={active}/>} open={true} titleId={"activity-dialog"} menuName={"修改活动信息"}
|
|
onClose={()=>this.setState({dialog:null})}/>
|
|
})}>修改活动信息</Button></td>
|
|
</tr>
|
|
):<h3 className="text-center text-info">没有活动信息</h3>:null
|
|
}
|
|
</tbody>
|
|
</Table>
|
|
|
|
{this.state.dialog}
|
|
|
|
<MyDialog content={this.state.tipContent} open={this.state.tipContent!=null} titleId={"user-dialog"} menuName={"操作提示"}
|
|
onClose={()=>this.setState({
|
|
tipContent:null
|
|
})}/>
|
|
</Tab>
|
|
</Tabs>
|
|
);
|
|
}
|
|
|
|
/**
|
|
* 修改活动信息
|
|
* @param activity
|
|
*/
|
|
private modifyActivity(activity: ManagerActivity) {
|
|
let that=this
|
|
request(API.account.updateActivity+activity.activityId,Method.POST, {
|
|
title:activity.title,
|
|
content:activity.content
|
|
},
|
|
new EmptyBodyTransform(),function (res:JSONResponse<SimpleMessage>) {
|
|
switch (res.customResult) {
|
|
case SimpleMessage.ok:
|
|
that.setState({
|
|
tipContent:<h3 className="text-info text-center">修改成功</h3>,
|
|
dialog:null
|
|
})
|
|
that.loadActive(1)
|
|
break
|
|
case SimpleMessage.fail:
|
|
that.setState({
|
|
tipContent:<h3 className="text-danger text-center">修改失败,请联系管理员</h3>
|
|
})
|
|
break
|
|
}
|
|
})
|
|
}
|
|
}
|
|
|