diff --git a/src/entity.ts b/src/entity.ts index b1291c4..58d44ef 100644 --- a/src/entity.ts +++ b/src/entity.ts @@ -191,7 +191,9 @@ export interface User{ //身份 userType:string; //用户状态 - status?:boolean; + chatStatus?:boolean; + //是否我的好友 + isMyFriend?:boolean; } /** @@ -230,7 +232,6 @@ export interface UserEdit{ newPassword:string; //确认新密码 confirmNewPwd:string; - result:JSX.Element|null; //缓存用户身份 oldUserType?:String; } diff --git a/src/interface.ts b/src/interface.ts index e9e5bc4..c29f603 100644 --- a/src/interface.ts +++ b/src/interface.ts @@ -27,7 +27,13 @@ export const API={ //拒绝好友邀请 refuse:prefix.user+"/refuse", //同意好友邀请 - agree:prefix.user+"/agree" + agree:prefix.user+"/agree", + //我的好友 + myFriend:prefix.user+"/friend/list", + //刷新聊天室状态 + refreshChat:prefix.user+"/chat/status", + //查找用户 + findUser:prefix.user+"/find/name" }, main:{ activity: { diff --git a/src/my/MyFriend.tsx b/src/my/MyFriend.tsx index 04ea33e..2a82f56 100644 --- a/src/my/MyFriend.tsx +++ b/src/my/MyFriend.tsx @@ -6,20 +6,25 @@ import moment from "moment"; import {MyInfo} from "./MyInfo"; import {MyDialog} from "../ui/MyDialog"; import {userObj} from "../ui/TestData"; - +import {API, JSONResponse, Method, request} from "../interface"; +import {EmptyBodyTransform, PageDataMessage, SimpleMessage, UserRes, UserTransform} from "../result"; const maxLength=150 /** * 我的好友 */ -export class MyFriend extends React.Component<{ user:string }, +export class MyFriend extends React.Component< + { user:string }, + { //好友列表 - friendList:Array; + friendList?:Array; //查找好友关键字 queryFriend:string; + //查找用户关键字 + queryUser:string; //用户列表 - userList:Array; + userList?:Array; //聊天记录 chatList:Array; //当前选中好友 @@ -28,6 +33,9 @@ export class MyFriend extends React.Component<{ user:string }, sendContent:String; //查看用户ID userId:string|null; + //操作反馈 + result:JSX.Element|null; + // } >{ @@ -40,37 +48,100 @@ export class MyFriend extends React.Component<{ user:string }, friendList:[], //查找好友关键字 queryFriend:"", - //用户列表 - userList:[], + queryUser:"", //聊天记录 chatList:[], //当前选中好友 friendIndex:null, //发送内容 sendContent:'', - userId:null + userId:null, + result:null } } componentDidMount() { - this.loadMyFriend("") + this.loadMyFriend() + this.joinChat() + } + + componentWillUnmount() { + this.leaveChat() } /** - * 查找用户 - * @param keyword + * 进入聊天室 */ - queryUser(keyword:string){ - this.setState({ - userList:[userObj,userObj,userObj] + joinChat(){ + this.refreshStatus(true) + } + + + /** + * 刷新聊天室状态 + */ + refreshStatus(chatStatus:boolean){ + let that=this + request(API.account.refreshChat,Method.POST, {chatStatus:String(chatStatus)},new EmptyBodyTransform(),function (res:JSONResponse) { + switch (res.customResult) { + case SimpleMessage.fail: + that.setState({ + result:

{chatStatus?"进入":"退出"}聊天室失败，请联系管理员

+ }) + break + } }) } + /** + * 离开聊天室 + */ + leaveChat(){ + this.refreshStatus(false) + } + + /** + * 查找用户 + */ + queryUser(name:string){ + + if(!name){ + this.setState({ + userList:[] + }) + }else { + + let that = this + request(API.account.findUser + "?name=" + name, Method.GET, {}, new UserTransform(), function (res: UserRes) { + switch (res.customResult) { + case PageDataMessage.ok: + that.setState({ + userList: res.dataList + }) + break + } + }) + } + } + //查找我的好友 - loadMyFriend(keyword:string){ - this.setState({ - friendList:[userObj,userObj,userObj] + loadMyFriend(){ + + let that=this + request(API.account.myFriend+"?currentPage=1",Method.GET, {},new UserTransform(),function (res:UserRes) { + switch (res.customResult) { + case PageDataMessage.ok: + that.setState({ + friendList:res.dataList + }) + break + case PageDataMessage.fail: + that.setState({ + result:

查找好友失败，请联系管理员

+ }) + } }) + } //加载聊天记录 @@ -90,35 +161,51 @@ export class MyFriend extends React.Component<{ user:string }, 我的好友 - this.loadMyFriend(e.target.value)}/> + { + this.setState({ + queryFriend:e.target.value + }) + this.loadMyFriend() + }}/> - {this.state.friendList.map((friend:User,index:number)=> - - - { - this.setState({ - friendIndex:index - }) - this.loadMyChat(friend) - }} className={index===this.state.friendIndex?"text-success":"text-dark"} - style={{cursor:"pointer"}} variant={friend.status?"info":"secondary"}>{friend.name} + {this.state.friendList?this.state.friendList.map((friend:User,index:number)=> + + + + + { + this.setState({ + friendIndex:index + }) + this.loadMyChat(friend) + }}>{friend.name} + + + 查看用户信息this.setState({userId:friend.userId})}/> + - )} + ):null} 添加好友 - this.queryUser(e.target.value)}/> + { + this.setState({ + queryUser:e.target.value + }) + this.queryUser(e.target.value) + }}/> - {this.state.userList.map((user:User,index:number)=> + {this.state.userList?this.state.userList.length>0?this.state.userList.map((user:User,index:number)=> {user.name} 查看用户信息this.setState({userId:user.userId})}/> - )} + ):没有匹配任何用户:null} @@ -127,7 +214,7 @@ export class MyFriend extends React.Component<{ user:string }, {this.state.chatList.map((chat:Chat,index:number)=> this.props.user===chat.userId? - + {chat.name} @@ -137,7 +224,7 @@ export class MyFriend extends React.Component<{ user:string },

{chat.content}

: - +
{moment(chat.time).format("YYYY-MM-DD HH:mm:ss")}

{chat.content}

@@ -149,7 +236,7 @@ export class MyFriend extends React.Component<{ user:string }, )} - + { if(e.target.innerText.length>=maxLength){ @@ -174,8 +261,12 @@ export class MyFriend extends React.Component<{ user:string }, + this.setState({ + result:null + })}/> + } + content={} open={this.state.userId!==null} onClose={()=>this.setState({userId:null})}/> ); diff --git a/src/my/MyInfo.tsx b/src/my/MyInfo.tsx index 8527b5a..3a12678 100644 --- a/src/my/MyInfo.tsx +++ b/src/my/MyInfo.tsx @@ -1,6 +1,6 @@ import React from "react"; import {Button, Col, Container, Form, FormControl, Image, Row} from "react-bootstrap"; -import {UserEdit, UserType} from "../entity"; +import {User, UserEdit, UserType} from "../entity"; import {Input} from "../ui/InputGroup"; import {API, JSONResponse, Method, prefix, request} from "../interface"; import { @@ -21,12 +21,14 @@ import {user_type_cookie} from "../account/PropCookie"; */ export class MyInfo extends React.Component< { + //查看用户id userId:string; + //查看本人 isOwn:boolean; - isMyFriend:boolean; + //是否添加好友 isAdd:boolean; cookies?:Cookies; - }, UserEdit>{ + }, { userEdit:UserEdit,userInfo?:User,result:JSX.Element|null }>{ private ages:Array @@ -36,12 +38,14 @@ export class MyInfo extends React.Component< this.ages=this.createAge() this.state={ - contentEditable:false, - modifyPassword:false, - oldPassword:"", - newPassword:"", - confirmNewPwd:"", - result:null + userEdit:{ + contentEditable:false, + modifyPassword:false, + oldPassword:"", + newPassword:"", + confirmNewPwd:"", + }, + result:null, } } @@ -59,6 +63,9 @@ export class MyInfo extends React.Component< */ loadInfo(){ + if(!this.props.userId){ + return + } let that=this request(API.account.find+"/"+this.props.userId,Method.GET, {},new FindUserInfoTransform(),function(res:FindUserInfo){ @@ -69,17 +76,26 @@ export class MyInfo extends React.Component< });break case SimpleMessage.ok: that.setState({ - headImg:res.info?.headImg, - userId:res.info?.userId, - name:res.info?.name, - age:res.info?.age, - mobile:res.info?.mobile, - email:res.info?.email, - serviceAddress:res.info?.serviceAddress, - info:res.info?.info, - userType:res.info?.userType, - sex:res.info?.sex, - oldUserType:res.info?.userType + userInfo:res.info, + userEdit: { + headImg:res.info?.headImg, + userId:res.info?.userId, + name:res.info?.name, + age:res.info?.age, + mobile:+(res.info?.mobile||""), + email:res.info?.email, + serviceAddress:res.info?.serviceAddress, + info:res.info?.info, + userType:res.info?.userType, + sex:res.info?.sex, + oldUserType:res.info?.userType, + + contentEditable:false, + modifyPassword:false, + oldPassword:"", + newPassword:"", + confirmNewPwd:"", + } });break } @@ -95,7 +111,7 @@ export class MyInfo extends React.Component< */ openEdit(){ this.setState({ - contentEditable:true + userEdit:{...this.state.userEdit,...{contentEditable:true}} }) } @@ -104,7 +120,7 @@ export class MyInfo extends React.Component< */ openModifyPwd(){ this.setState({ - modifyPassword:true + userEdit:{...this.state.userEdit,...{ modifyPassword:true}} }) } @@ -113,14 +129,14 @@ export class MyInfo extends React.Component< */ modifyPwd(){ this.setState({ - modifyPassword:false + userEdit:{...this.state.userEdit,...{ modifyPassword:false}} }) let that=this request(API.account.updatePwd,Method.POST, { - newPassword:this.state.newPassword, - oldPassword:this.state.oldPassword + newPassword:this.state.userEdit.newPassword, + oldPassword:this.state.userEdit.oldPassword },new ModifyPwdTransform(),function (res:JSONResponse) { switch (res.customResult) { case ModifyPwdMessage.fail: @@ -144,24 +160,24 @@ export class MyInfo extends React.Component< */ doSave(){ this.setState({ - contentEditable:false + userEdit:{...this.state.userEdit,...{ contentEditable:false}} }) let that=this - let isUpdateUserType=this.state.userType!==this.state.oldUserType + let isUpdateUserType=this.state.userEdit.userType!==this.state.userEdit.oldUserType if(isUpdateUserType&&this.props.cookies){ - this.props.cookies.set(user_type_cookie,this.state.userType) + this.props.cookies.set(user_type_cookie,this.state.userEdit.userType) } request(API.account.update,Method.POST, { - headImg:this.state.headImg||"", - name:this.state.name||"", - age:this.state.age+""||"", - mobile:this.state.mobile+""||"", - email:this.state.email||"", - serviceAddress:this.state.serviceAddress||"", - info:this.state.info||"", - userType:this.state.userType||"", - sex:this.state.sex||"" + headImg:this.state.userEdit.headImg||"", + name:this.state.userEdit.name||"", + age:this.state.userEdit.age+""||"", + mobile:this.state.userEdit.mobile+""||"", + email:this.state.userEdit.email||"", + serviceAddress:this.state.userEdit.serviceAddress||"", + info:this.state.userEdit.info||"", + userType:this.state.userEdit.userType||"", + sex:this.state.userEdit.sex||"" },new EmptyBodyTransform(),function (res:JSONResponse) { switch (res.customResult) { case SimpleMessage.fail: @@ -217,74 +233,96 @@ export class MyInfo extends React.Component< - + {/*TODO 表单校验*/} - {this.state.userId} + {this.state.userInfo?.userId} - {this.state.contentEditable? - this.setState({name:e.target.value})}/> - :this.state.name} + {this.state.userEdit.contentEditable? + this.setState({ + userEdit:{...this.state.userEdit,...{ name:e.target.value}} + })}/> + :this.state.userInfo?.name} - {this.state.contentEditable? - this.setState({age:+e.target.value})}> + {this.state.userEdit.contentEditable? + this.setState({ + userEdit:{...this.state.userEdit,...{ age:+e.target.value}} + })}> {this.ages.map(value=>)} - :this.state.age} + :this.state.userInfo?.age} - {this.state.contentEditable? - this.setState({mobile:+e.target.value})}/> - :this.state.mobile} + {this.state.userEdit.contentEditable? + this.setState({ + userEdit:{...this.state.userEdit,...{ mobile:+e.target.value}} + })}/> + :this.state.userInfo?.mobile} - {this.state.contentEditable? - this.setState({email:e.target.value})}/> - :this.state.email} + {this.state.userEdit.contentEditable? + this.setState({ + userEdit:{...this.state.userEdit,...{ email:e.target.value}} + })}/> + :this.state.userInfo?.email} - {this.state.contentEditable? - this.setState({sex:event.target.value})}> + {this.state.userEdit.contentEditable? + this.setState({ + userEdit:{...this.state.userEdit,...{ sex:event.target.value}} + })}> - :this.state.sex==='man'?"男":"女"} + :this.state.userInfo?.sex==='man'?"男":"女"} - {this.state.contentEditable? -
this.setState({serviceAddress:value})}/>:this.state.serviceAddress} + {this.state.userEdit.contentEditable? +
this.setState({ + userEdit:{...this.state.userEdit,...{ serviceAddress:value}} + })}/>:this.state.userInfo?.serviceAddress} - {this.state.contentEditable? - this.setState({userType:e.target.value})}> + {this.state.userEdit.contentEditable? + this.setState({ + userEdit:{...this.state.userEdit,...{ userType:e.target.value}} + })}> : - this.state.userType===UserType.help?"等待前往帮助":"等待接受帮助"} + this.state.userInfo?.userType===UserType.help?"等待前往帮助":"等待接受帮助"} - {this.state.contentEditable? - this.setState({info:e.target.value})}/> - :this.state.info} + {this.state.userEdit.contentEditable? + this.setState({ + userEdit:{...this.state.userEdit,...{ info:e.target.value}} + })}/> + :this.state.userInfo?.info} - {this.state.modifyPassword? + {this.state.userEdit.modifyPassword?
- this.setState({oldPassword:value})}/> + this.setState({ + userEdit:{...this.state.userEdit,...{ oldPassword:value}} + })}/> - this.setState({newPassword:value})}/> + this.setState({ + userEdit:{...this.state.userEdit,...{newPassword:value}} + })}/> - this.setState({confirmNewPwd:value})}/> + this.setState({ + userEdit:{...this.state.userEdit,...{confirmNewPwd:value}} + })}/>
@@ -294,19 +332,19 @@ export class MyInfo extends React.Component< {this.props.isOwn? - {this.state.contentEditable? + {this.state.userEdit.contentEditable? : - } + } - {this.state.modifyPassword? + {this.state.userEdit.modifyPassword? : - } + } : - {this.props.isMyFriend?null:this.props.isAdd? + {this.state.userInfo?.isMyFriend===undefined||this.state.userInfo.isMyFriend?null:this.props.isAdd? : diff --git a/src/my/MyLeaveWord.tsx b/src/my/MyLeaveWord.tsx index 0534a03..db31e60 100644 --- a/src/my/MyLeaveWord.tsx +++ b/src/my/MyLeaveWord.tsx @@ -115,12 +115,12 @@ export class MyLeaveWord extends React.Component< },new EmptyBodyTransform(),function (res:JSONResponse) { switch (res.customResult) { case SimpleMessage.ok: + that.loadLeaveWord(1) that.setState({ result:

添加好友成功

}) break case SimpleMessage.fail: - that.loadLeaveWord(1) that.setState({ result:

添加好友失败，请联系管理员

}) @@ -194,7 +194,7 @@ export class MyLeaveWord extends React.Component<
{this.state.data?this.state.data.length===0?

没有留言记录

:this.state.data.map((data,index) =>this.getData(data,index)):

留言加载中

} } + content={} open={this.state.openUserInfo} onClose={()=>this.setState({openUserInfo:false})}/> } diff --git a/src/my/MyMessage.tsx b/src/my/MyMessage.tsx index f49c283..f585956 100644 --- a/src/my/MyMessage.tsx +++ b/src/my/MyMessage.tsx @@ -22,7 +22,7 @@ export class MyMessage extends React.Component<{ user:string,cookies:Cookies }, this.state={ subMenu:Menu.info, - page: + page: } } @@ -31,7 +31,7 @@ export class MyMessage extends React.Component<{ user:string,cookies:Cookies }, this.setState({subMenu:menu}) switch (menu) { case Menu.info: - this.setState({page:}) + this.setState({page:}) break case Menu.help: this.setState({page:}) diff --git a/src/my/SeekHelp.tsx b/src/my/SeekHelp.tsx index 9734637..5779fba 100644 --- a/src/my/SeekHelp.tsx +++ b/src/my/SeekHelp.tsx @@ -149,7 +149,7 @@ export class SeekHelp extends React.Component<{ user:string }, } + content={} open={this.state.openUserInfo} onClose={()=>this.setState({openUserInfo:false})}/> { - info?:UserEdit + info?:User } //查找用户信息转换 export class FindUserInfoTransform extends TransformData{ @@ -262,3 +262,16 @@ export class HelpTransform extends PageDataTransform{ } +/** + * 我的好友信息转换 + */ +export class UserRes extends PageDataRes{ + dataList?:Array +} + +export class UserTransform extends PageDataTransform{ + protected newObject(): UserRes { + return new UserRes(); + } +} +