对接服务端

1.个人信息-我的帮助

src/entity.ts

@@ -71,23 +71,12 @@ export interface ActivityDetail extends BaseHelp,ActivityId{
     activityStartTime:number;
     //活动结束时间
     activityEndTime:number;
+    //是否已报名
+    hasApply:boolean;
+    //是否已开始
+    hasStart:boolean;
 }
 
-//我的帮助信息
-export interface MyHelpState extends ActivityDetail{
-    //求助时间
-    seekHelpTime:number;
-    //报名时间
-    applyTime:number;
-    //参与时间
-    joinTime:number|null;
-    //完成时间
-    completeTime:number|null;
-    //活动评价分
-    score: number|null;
-}
-
-
 //我的求助信息
 export interface SeekHelpState extends BaseHelp,ActivityId{
     //求助时间
@@ -276,6 +265,7 @@ export interface FormInputProps {
     type?:
         | "text"
         | "password"
+        | "number"
     as?: React.ElementType;
     //值改变事件
     onChange: Function
@@ -369,6 +359,9 @@ export interface LeaveWord {
     content:string;
 }
 
+/**
+ * 留言类型
+ */
 export enum LeaveWordType {
     //推荐
     recommend = "recommend",
@@ -381,3 +374,39 @@ export enum LeaveWordType {
     //好友验证
     friend = "friend"
 }
+
+/**
+ *帮助信息实体
+ */
+export interface HelpEntity {
+    //    活动id
+    activityId:number;
+    //历史id
+    historyId:number;
+//    活动背景图
+   activityImg:string;
+//    活动标题
+    title:string;
+//    活动内容
+    content:string;
+//    求助时间
+    seekHelpTime:number;
+//    活动开始时间
+    activityStartTime:number;
+//    活动结束时间
+    activityEndTime:number;
+//    状态
+    status:string;
+//    报名时间
+    applyTime:number;
+//    参与时间
+    joinTime:number;
+//    完成时间
+    completeTime:number;
+//    评分
+    activityScore:number;
+    //活动开始状态
+    hasStart:boolean;
+    //活动结束状态
+    hasEnd:boolean;
+}

src/interface.ts

@@ -34,7 +34,11 @@ export const API={
             //求助信息统计
             seekHelp:prefix.activity+"/seekHelp",
             //求助信息志愿者
-            seekHelpUser:prefix.activity+"/seekHelpUser"
+            seekHelpUser:prefix.activity+"/seekHelpUser",
+            //帮助信息
+            myHelp:prefix.activity+"/help",
+            //活动评价
+            score:prefix.activity+'/score'
         }
     }
 }

src/my/MyHelp.tsx

@@ -1,88 +1,147 @@
 import React from "react";
 import {Button, Col, Container, Image, Row} from "react-bootstrap";
-import {MyHelpState} from "../entity";
+import {ActivityStatus, HelpEntity, PageProps} from "../entity";
 import moment from "moment";
-import {myActivityObj} from "../ui/TestData";
+import {API, JSONResponse, Method, prefix, request} from "../interface";
+import {EmptyBodyTransform, HelpRes, HelpTransform, PageDataMessage, SimpleMessage} from "../result";
+import {MyDialog} from "../ui/MyDialog";
+import {changeActivity} from "../public";
+import {Input} from "../ui/InputGroup";
 
 const classList="border-info border d-flex justify-content-center align-items-center"
 
 /**
  * 我的帮助
  */
-export class MyHelp extends React.Component<{ undefined?:undefined }, { data:Array<MyHelpState> }>{
+export class MyHelp extends React.Component<{ undefined?:undefined },
+
+    {
+        data?:Array<HelpEntity>,
+        page?:PageProps ,
+        result:JSX.Element|null,
+        //活动评价
+        activeScore:number,
+        historyId:number|null;
+    }>{
 
 
     constructor(props: Readonly<any>) {
         super(props);
 
         this.state= {
-            data: []
+            activeScore: 5,
+            result:null,
+            historyId:null
         }
     }
 
     componentDidMount() {
-        this.loadMyHelp()
+        this.loadMyHelp(1)
     }
 
-    /**
-     * 完成活动
-     * @param help
-     */
-    complete(help:MyHelpState){
-
-    }
-
-    /**
-     * 参与活动
-     * @param help
-     */
-    join(help:MyHelpState){
 
+    score(){
+        let that=this
+        request(API.main.activity.score,Method.POST ,{
+            score:this.state.activeScore+"",
+            historyId:this.state.historyId+""
+        },new EmptyBodyTransform(),function (res:JSONResponse<SimpleMessage>) {
+            switch (res.customResult) {
+                case SimpleMessage.ok:
+                    that.setState({
+                        historyId:null,
+                        result:<h3 className="text-center text-info">活动评价成功</h3>
+                    })
+                    that.loadMyHelp(1)
+                    break
+                case SimpleMessage.fail:
+                    that.setState({
+                        result:<h3 className="text-center text-danger">活动评价失败，请联系管理员</h3>
+                    })
+                    break
+            }
+        })
     }
 
     /**
      * 获取操作布局
      * @param help
      */
-    getAction(help:MyHelpState){
+    getAction(help:HelpEntity){
-        if(help.joinTime&&help.completeTime){
+        if(help.activityScore){
+            return (<Row>
+                <Col className={classList}>已评价</Col>
+                <Col className={classList}/>
+                <Col className={classList}>{help.activityScore}</Col>
+            </Row>)
+        }
+        else if(help.joinTime&&help.completeTime){
             return (<Row>
                         <Col className={classList}>已完成</Col>
+                        <Col className={classList+" p-3"}>
+                            <Button className="w-100" onClick={()=>this.setState({historyId:help.historyId})}>评价活动</Button>
+                        </Col>
                         <Col className={classList}/>
-                        <Col className={classList}>{help.score}</Col>
                     </Row>)
         }else if(help.joinTime){
             return (<Row>
-                        <Col className={classList}>待完成</Col>
+                        <Col className={classList}>{help.hasEnd?"已超时":"待完成"}</Col>
-                        <Col className={classList+" p-3"}><Button className="w-100" onClick={()=>this.complete(help)} variant={"info"}>完成</Button></Col>
+                        <Col className={classList+" p-3"}>
+                            {help.hasEnd?null:
+                            <Button className="w-100" onClick={()=>{
+                            let that=this
+                            changeActivity(help.activityId,ActivityStatus.complete, this,function () {
+                                that.loadMyHelp(1)
+                            })
+                        }} variant={"info"}>完成</Button>}</Col>
                         <Col className={classList}/>
                     </Row>)
         }else{
             return (
                 <Row>
-                    <Col className={classList}>待参与</Col>
+                    <Col className={classList}>{help.hasStart?"待参与":"待活动开始"}</Col>
-                    <Col className={classList+" p-3"}><Button className="w-100" onClick={()=>this.join(help)} variant={"info"}>参与</Button></Col>
+                    <Col className={classList+" p-3"}>
+                        {help.hasStart?
+                        <Button className="w-100" onClick={()=> {
+                        let that=this
+                        changeActivity(help.activityId,ActivityStatus.join, this,function () {
+                            that.loadMyHelp(1)
+                        })
+                    }} variant={"info"}>参与</Button>:null}
+                    </Col>
                     <Col className={classList}/>
                 </Row>
             )
         }
     }
 
-    loadMyHelp(){
+    loadMyHelp(page:number){
-        this.setState({
+        let that=this
-            data:[myActivityObj,myActivityObj,myActivityObj]
+      request(API.main.activity.myHelp+"?currentPage="+page,Method.GET,{},new HelpTransform(),function (res:HelpRes) {
-        })
+            switch (res.customResult) {
+                case PageDataMessage.ok:
+                    that.setState({
+                        data:res.dataList
+                    })
+                    break
+                case PageDataMessage.fail:
+                    that.setState({
+                        result:<h3 className="text-center text-danger">帮助信息加载失败，请联系管理员</h3>
+                    })
+                    break
+            }
+      })
     }
 
     render() {
         return (
-            <div className="overflow-auto my-help-height">
+            <div className="overflow-auto my-help-height w-100">
-                {this.state.data.map((help:MyHelpState,index:number)=>
+                {this.state.data?this.state.data.length===0?<h3 className="text-info text-center">没有找到帮助记录</h3>:this.state.data.map((help:HelpEntity,index:number)=>
                     <div key={"list"+index} className="mt-3 mb-3 border-info border">
                         <Container>
                             <Row>
                                 <Col xs={4}>
-                                    <Image src={help.activityImg} className="activityImage"/>
+                                    <Image src={prefix.image+help.activityImg} className="activityImage"/>
                                 </Col>
                                 <Col>
                                     <h5>{help.title}</h5>
@@ -117,7 +176,25 @@ export class MyHelp extends React.Component<{ undefined?:undefined }, { data:Arr
                             {this.getAction(help)}
                         </Container>
                     </div>
-                )}
+                ):<h3 className="text-center text-info">帮助信息加载中</h3>}
+
+                <MyDialog content={this.state.result} open={this.state.result!==null} titleId="my_help_dialog" menuName="提示" onClose={()=>this.setState({
+                    result:null
+                })}/>
+
+                <MyDialog content={
+                    <div>
+                    <Input name="activeScore" type={"number"} value={this.state.activeScore+""} desc="评分" placeholder={"请输入评分(0-10)"} onChange={(value:string)=>{
+                        if(+value<0||+value>10){
+                            value="5"
+                        }
+                        this.setState({
+                            activeScore:+value
+                        })
+                    }}/>
+
+                    <Button variant={"info"} block={true} className="col-3 ml-auto mr-auto mt-3" onClick={()=>this.score()}>评价</Button>
+                </div>} open={this.state.historyId!==null} titleId="score-dialog" menuName="评分" onClose={()=>this.setState({historyId:null})}/>
 
             </div>
         )

src/my/SeekHelp.tsx

@@ -10,6 +10,7 @@ import {MyDialog} from "../ui/MyDialog";
 import {MyInfo} from "./MyInfo";
 import {API, Method, prefix, request} from "../interface";
 import {SeekHelpInfoRes, SeekHelpInfoTransform, SeekHelpUser, SeekHelpUserTransform, SimpleMessage} from "../result";
+import {getStatus} from "../public";
 
 const titleId="seek-help-dialog"
 
@@ -63,10 +64,10 @@ export class SeekHelp extends React.Component<{ user:string },
                         });
                         break
                     case SimpleMessage.ok:
-                        console.debug("求助信息"+res.dataList)
                         that.setState({
                             data:res.dataList
                         })
+                        break
                 }
         })
 
@@ -87,26 +88,19 @@ export class SeekHelp extends React.Component<{ user:string },
                         that.setState({
                             volunteerList:res.dataList,
                             open:true,
-                            status:that.getStatus(status)
+                            status:getStatus(status)
                         })
                         break
                 }
         })
     }
 
-    //活动状态转换
+
-    getStatus(status:ActivityStatus){
-        switch (status) {
-            case ActivityStatus.apply:return "报名"
-            case ActivityStatus.join:return "参与"
-            case ActivityStatus.complete:return "完成"
-        }
-    }
 
     render() {
         return (
             <div className="overflow-auto seek-help-height w-100">
-                {this.state.data?this.state.data.map((help:SeekHelpState, index:number)=>
+                {this.state.data?this.state.data.length===0?<h3 className="text-info text-center">没有找到求助记录</h3>:this.state.data.map((help:SeekHelpState, index:number)=>
                     <div key={"list"+index} className="mt-3 mb-3 border-info border">
                         <Container>
                             <Row>

src/public.tsx

@@ -0,0 +1,34 @@
+// 一些组件公用函数
+import {API, JSONResponse, Method, request} from "./interface";
+import {ActivityStatus} from "./entity";
+import {EmptyBodyTransform, SimpleMessage} from "./result";
+import React from "react";
+
+export function changeActivity(activityId:number,activityStatus:ActivityStatus,that:React.Component,callback:Function){
+
+    request(API.main.activity.apply,Method.POST,{
+        activityId:activityId+"",
+        activityStatus:activityStatus.toString()
+    },new EmptyBodyTransform(),function (res:JSONResponse<SimpleMessage>) {
+        switch (res.customResult) {
+            case SimpleMessage.ok:
+                callback()
+                that.setState({
+                    result:<h3 className="text-info text-center">{getStatus(activityStatus)}成功</h3>
+                });break
+            case SimpleMessage.fail:
+                that.setState({
+                    result:<h3 className="text-danger text-center">{getStatus(activityStatus)}失败，请联系管理员</h3>
+        });break
+    }
+    })
+}
+
+//活动状态转换
+export function getStatus(status:ActivityStatus){
+    switch (status) {
+        case ActivityStatus.apply:return "报名"
+        case ActivityStatus.join:return "参与"
+        case ActivityStatus.complete:return "完成"
+    }
+}

src/result.ts

@@ -2,7 +2,7 @@
  * 返回信息
  */
 import {JSONResponse, Result, TransformData} from "./interface";
-import {ActivityDetail, LeaveWord, PageProps, SeekHelpState, User, UserEdit, UserType} from "./entity";
+import {ActivityDetail, HelpEntity, LeaveWord, PageProps, SeekHelpState, User, UserEdit, UserType} from "./entity";
 
 /**
  * 空body响应
@@ -248,3 +248,17 @@ export class LeaveWordTransform extends PageDataTransform<LeaveWordRes>{
     }
 }
 
+/**
+ * 帮助信息转换
+ */
+export class HelpRes extends PageDataRes{
+    dataList?:Array<HelpEntity>
+}
+
+export class HelpTransform extends PageDataTransform<HelpRes>{
+    protected newObject(): HelpRes {
+        return new HelpRes();
+    }
+
+}
+

src/sub/IndexMenu.tsx

@@ -6,10 +6,11 @@ import {ActivityDetail, ActivityStatus, PageProps, UserType} from "../entity";
 import {MyDialog} from "../ui/MyDialog";
 import {Activity} from "../ui/Activity";
 import {Input} from "../ui/InputGroup";
-import {API, JSONResponse, Method, prefix, request} from "../interface";
+import {API, Method, prefix, request} from "../interface";
-import {EmptyBodyTransform, FindActivityRes, FindActivityTransform, PageDataMessage, SimpleMessage} from "../result";
+import {FindActivityRes, FindActivityTransform, PageDataMessage} from "../result";
 import {Cookies} from "react-cookie";
-import {user_type_cookie} from "../account/PropCookie";
+import {user_cookie, user_type_cookie} from "../account/PropCookie";
+import {changeActivity} from "../public";
 
 /**
  * 首页
@@ -43,33 +44,6 @@ export class IndexMenu extends React.Component<{ cookies:Cookies },
         this.loadActivity(1)
     }
 
-    /**
-     * 报名活动
-     * @param activityId 活动id
-     */
-    apply(activityId:number){
-        console.debug("报名id"+activityId)
-
-        let that=this
-
-        request(API.main.activity.apply,Method.POST,{
-            activityId:activityId+"",
-            activityStatus:ActivityStatus.apply.toString()
-        },new EmptyBodyTransform(),function (res:JSONResponse<SimpleMessage>) {
-            switch (res.customResult) {
-                case SimpleMessage.ok:
-                    that.loadActivity(1)
-                    that.setState({
-                        result:<h3 className="text-info text-center">报名成功</h3>
-                    });break
-                case SimpleMessage.fail:
-                    that.setState({
-                        result:<h3 className="text-danger text-center">报名失败，请联系管理员</h3>
-                    });break
-            }
-        })
-    }
-
     /**
      * 加载活动列表
      * @param page
@@ -94,7 +68,6 @@ export class IndexMenu extends React.Component<{ cookies:Cookies },
                     that.setState({
                         activityList:[],
                         page:res.page,
-                        result:<h3 className="text-info text-center">当前没有活动记录！！！</h3>
                     });break;
             }
         })
@@ -102,7 +75,7 @@ export class IndexMenu extends React.Component<{ cookies:Cookies },
 
 
     render() {
-        const rowList=this.state.activityList?this.state.activityList.map((activities:Array<ActivityDetail>, index:number)=>
+        const rowList=this.state.activityList?this.state.activityList.length===0?<h3 className="text-center text-info">当前没有活动可报名</h3>:this.state.activityList.map((activities:Array<ActivityDetail>, index:number)=>
            <Row className="p-3" key={"row"+index}>{activities.map((activity:ActivityDetail, subIndex:number)=>
                <Col className="col-4" key={"col"+subIndex}>
                    <Card>
@@ -121,7 +94,12 @@ export class IndexMenu extends React.Component<{ cookies:Cookies },
                        </Card.Body>
                        <Card.Footer>
                            <Button variant={"info"} onClick={()=>this.setState({activeId:activity.activityId})} className="mr-2">查看活动详情</Button>
-                           {this.props.cookies.get(user_type_cookie)===UserType.help?<Button variant="primary" onClick={()=>this.apply(activity.activityId)}>帮助</Button>:null}
+                           {this.props.cookies.get(user_type_cookie)===UserType.seekHelp||activity.userId===this.props.cookies.get(user_cookie)||activity.hasApply||activity.hasStart?null:<Button variant="primary" onClick={()=> {
+                               let that=this
+                               changeActivity(activity.activityId,ActivityStatus.apply, this,function(){
+                                   that.loadActivity(1)
+                               })
+                           }}>帮助</Button>}
                        </Card.Footer>
                    </Card>
                </Col>)}
@@ -144,7 +122,10 @@ export class IndexMenu extends React.Component<{ cookies:Cookies },
                 {this.state.page?<Page onClick={(page:number)=>this.loadActivity(page)} currentPage={this.state.page.currentPage} totalPage={this.state.page.totalPage} pageSize={this.state.page.pageSize}/>:null}
 
                 <MyDialog content={<Activity activityId={this.state.activeId} showButton={true} applyFunction={(activeId:number)=>{
-                    this.apply(activeId)
+                    let that=this
+                    changeActivity(activeId,ActivityStatus.apply, this,function () {
+                        that.loadActivity(1)
+                    })
                     this.setState({activeId:null})
                 }} />}
                           open={this.state.activeId!=null} titleId="view-active" menuName="活动详情"

src/sub/Volunteer.tsx

@@ -46,11 +46,12 @@ export class Volunteer extends React.Component<{ undefined?:undefined },
 
         let that=this
         request(API.account.find+'?info='+this.state.form.keyword+'&serviceAddress='+this.state.form.serviceAddress
-            +'&currentPage='+page+'&userTypes=seekHelp',Method.GET,{},new FindUserTransform(),function(res:FindUserRes){
+            +'&currentPage='+page+'&userTypes=help',Method.GET,{},new FindUserTransform(),function(res:FindUserRes){
             switch (res.customResult) {
                 case PageDataMessage.ok:
                     that.setState({
                         volunteerList:res.dataList,
+                        page:res.page,
                         form:{
                             keyword:that.state.form.keyword,
                             serviceAddress:that.state.form.serviceAddress
@@ -67,8 +68,9 @@ export class Volunteer extends React.Component<{ undefined?:undefined },
                     });break
                 case PageDataMessage.empty:
                     that.setState({
-                        result:<h3 className="text-center text-info">当前没有任何志愿者！！！</h3>
+                        volunteerList:[]
-                    });break
+                    });
+                    break
             }
         })
     }
@@ -98,7 +100,7 @@ export class Volunteer extends React.Component<{ undefined?:undefined },
                 {/*<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.map((volunteers:Array<User>, index:number)=>
+                    {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" key={"row"+index}>{volunteers.map((volunteer:User, subIndex:number)=>
                             <div  key={"col"+subIndex} className="mr-3">
                                     <div className="border-info border">

src/ui/TestData.ts

@@ -21,39 +21,3 @@ export const userObj={
     flag:false,
     userType:UserType.seekHelp.toString()
 }
-
-export const activityObj={
-    activityId:0,
-    userId:"123",
-    title:"活动标题1",
-    content:"活动内容活动内容活动活动内容活动内容活动活动内容活动内容活动活动内容活动内容活动活动内容活动内容活动活动内容活动内容活动活动内容活动内容活动活动内容活动内容活动活动内容活动内容活动",
-    activityImg:"logo512.png",
-    activityStartTime:new Date().getTime(),
-    activityEndTime:new Date().getTime()
-}
-
-export const myActivityObj={
-    //活动Id
-    activityId:123,
-    userId:"123",
-    //活动标题
-    title:"活动标题",
-    //活动内容
-    content:"活动内容",
-    //活动背景图
-    activityImg: "logo512.png",
-    //求助时间
-    seekHelpTime:new Date().getTime(),
-    //活动开始时间
-    activityStartTime:new Date().getTime(),
-    //活动结束时间
-    activityEndTime:new Date().getTime(),
-    //报名时间
-    applyTime:new Date().getTime(),
-    //参与时间
-    joinTime:new Date().getTime(),
-    //完成时间
-    completeTime:new Date().getTime(),
-    //活动评价分
-    score: Math.ceil(Math.random()*10),
-}