志愿者模块对接服务端

src/interface.ts

@@ -12,7 +12,9 @@ export const API={
         //注册
         register:prefix.user+"/register",
         //登录
-        login:prefix.user+"/login"
+        login:prefix.user+"/login",
+        //查找用户
+        find:prefix.user+"/find"
     },
     main:{
         activity: {
@@ -79,20 +81,18 @@ export abstract class TransformData<Q,T extends JSONResponse<Q>> {
 //发送请求
 export function request<Q,E extends JSONResponse<Q>,T extends TransformData<Q,E>>(api:string,method:Method,formParams: {[propName:string]: string | Blob},transform:T,callback:Function) {
     let formData
-    if(method!==Method.GET) {
+    if(method===Method.GET) {
+        formData=null
+    }else{
         formData=new FormData()
         for (let formParam in formParams) {
             formData.append(formParam, formParams[formParam])
         }
-    }else{
+
-        formData=''
-        for (let formParam in formParams) {
-            formData+='&'+formParam+'='+formParams[formParam]
-        }
     }
-    fetch(server+api+(method===Method.GET?"?"+formData.toString().substr(1):""),{
+    fetch(server+api,{
         method:method,
-        body:method===Method.GET?null:formData
+        body:formData
     })
     .then(
         response=>{if(response.status===200){

src/result.ts

@@ -2,7 +2,7 @@
  * 返回信息
  */
 import {JSONResponse, Result, TransformData} from "./interface";
-import {ActivityDetail, PageProps, UserType} from "./entity";
+import {ActivityDetail, PageProps, User, UserType} from "./entity";
 
 /**
  * 注册响应信息
@@ -106,7 +106,9 @@ export class SendHelpTransform extends TransformData<ActivityMessage, SendHelpRe
  */
 export enum FindActivityMessage {
     ok="ok",
-    fail="fail"
+    fail="fail",
+    //        空数据
+    empty="empty"
 }
 
 /**
@@ -138,3 +140,43 @@ export class FindActivityTransform extends TransformData<FindActivityMessage, Fi
 
     }
 }
+
+/**
+ * 查询活动
+ */
+export enum FindUserMessage {
+    ok="ok",
+    fail="fail",
+empty="empty"
+}
+
+/**
+ * 用户信息实体
+ */
+export class FindUserRes extends JSONResponse<FindUserMessage>{
+    dataList?:Array<Array<User>>
+    page?:PageProps
+}
+
+/**
+ * 用户数据转换
+ */
+export class FindUserTransform extends TransformData<FindUserMessage, FindUserRes>{
+    protected newObject(): FindUserRes {
+        return new FindUserRes();
+    }
+
+    protected transformBody(data: any) {
+        if(data.body!==null){
+            this.target.dataList=data.body.body
+            this.target.page={
+                currentPage:data.body.currentPage,
+                totalPage:data.body.totalPage,
+                pageSize:data.body.pageSize
+            }
+        }
+
+    }
+}
+
+

src/sub/IndexMenu.tsx

@@ -67,10 +67,7 @@ export class IndexMenu extends React.Component<{ user:string },
     loadActivity(page:number){
         console.debug("检索活动关键字:"+this.state.title)
         let that=this
-        request(API.main.activity.find,Method.GET,{
+        request(API.main.activity.find+'?title='+this.state.title+"&currentPage="+page,Method.GET, {},new FindActivityTransform(),function (res:FindActivityRes) {
-            title:this.state.title,
-            currentPage:page+""
-        },new FindActivityTransform(),function (res:FindActivityRes) {
 
 
             switch(res.customResult){
@@ -83,6 +80,11 @@ export class IndexMenu extends React.Component<{ user:string },
                         activityList:res.dataList,
                         page:res.page
                     });break
+                case FindActivityMessage.empty:
+                    that.setState({
+                        page:res.page,
+                        result:<h3 className="text-info text-center">当前没有活动记录！！！</h3>
+                    });break;
             }
         })
     }

src/sub/Volunteer.tsx

@@ -4,19 +4,22 @@ import {Input} from "../ui/InputGroup";
 import {PageProps, User} from "../entity";
 import {Page} from "../ui/Page";
 import {Address} from "../ui/Address";
-import {userObj} from "../ui/TestData";
+import {API, Method, request} from "../interface"
+import {FindUserMessage, FindUserRes, FindUserTransform} from "../result";
+import {MyDialog} from "../ui/MyDialog";
 
 /**
  * 志愿者信息
  */
-export class Volunteer extends React.Component<{ undefined?:undefined }, {
+export class Volunteer extends React.Component<{ undefined?:undefined },
+    {
     form:{
         keyword:string;
-        address:string;
+        serviceAddress:string|null;
     };
-    addressList:Array<{address:string}>;
+    volunteerList?:Array<Array<User>>;
-    volunteerList:Array<Array<User>>;
+    page?:PageProps;
-    page:PageProps;
+    result:JSX.Element|null;
 }>{
 
 
@@ -24,26 +27,10 @@ export class Volunteer extends React.Component<{ undefined?:undefined }, {
         super(props);
 
         this.state={
+            result: null,
             form:{
                 keyword:"",
-                address:""
+                serviceAddress:""
-            },
-            addressList:[
-                {
-                    address:"北京",
-                },
-                {
-                    address:"广州",
-                },
-                {
-                    address:"上海",
-                }
-            ],
-            volunteerList:[],
-            page:{
-                currentPage:1,
-                totalPage:3,
-                pageSize:9
             }
         }
     }
@@ -57,10 +44,32 @@ export class Volunteer extends React.Component<{ undefined?:undefined }, {
      */
     loadVolunteerList(page:number){
 
-        const array=[userObj,userObj,userObj,userObj]
+        let that=this
-
+        request(API.account.find+'?info='+this.state.form.keyword+'&serviceAddress='+this.state.form.serviceAddress
-        this.setState({
+            +'&currentPage='+page+'&userTypes=seekHelp',Method.GET,{},new FindUserTransform(),function(res:FindUserRes){
-            volunteerList:[array,array,array,array]
+            switch (res.customResult) {
+                case FindUserMessage.ok:
+                    that.setState({
+                        volunteerList:res.dataList,
+                        form:{
+                            keyword:that.state.form.keyword,
+                            serviceAddress:that.state.form.serviceAddress
+                        }
+                    })
+                    break
+                case FindUserMessage.fail:
+                    that.setState({
+                        form:{
+                            keyword:that.state.form.keyword,
+                            serviceAddress:that.state.form.serviceAddress
+                        },
+                        result:<h3 className="text-center text-danger">志愿者搜索失败，请联系管理员</h3>
+                    });break
+                case FindUserMessage.empty:
+                    that.setState({
+                        result:<h3 className="text-center text-info">当前没有任何志愿者！！！</h3>
+                    });break
+            }
         })
     }
 
@@ -72,13 +81,13 @@ export class Volunteer extends React.Component<{ undefined?:undefined }, {
 
                 <Input col={3} name="keyword" desc="描述信息关键字" onChange={(value:string)=>this.setState({form:{
                      keyword:value,
-                     address:this.state.form.address
+                     serviceAddress:this.state.form.serviceAddress
                      }})}/>
 
                 <Address onChange={(value:string)=>this.setState({
                     form:{
                         keyword:this.state.form.keyword,
-                        address:value
+                        serviceAddress:value
                     }
                 })}/>
 
@@ -87,7 +96,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.map((volunteers:Array<User>, index:number)=>
+                    {this.state.volunteerList?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">
@@ -109,10 +118,11 @@ export class Volunteer extends React.Component<{ undefined?:undefined }, {
                                     </div>
                             </div>
                         )}</div>
-                    )}
+                    ):null}
 
+                <MyDialog content={this.state.result} open={this.state.result!==null} titleId="find-volunteer" menuName="搜索志愿者" onClose={()=>this.setState({result:null})}/>
 
-                <Page onClick={(page:number)=>this.loadVolunteerList(page)} currentPage={this.state.page.currentPage} totalPage={this.state.page.totalPage} pageSize={this.state.page.pageSize}/>
+                {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>