educoder/public/react/src/modules/message/js/MessagePrivate.js

import React, { Component } from 'react';
import {
	Spin,
	Pagination,
} from "antd";
import axios from 'axios';
import moment from 'moment';
import {getImageUrl} from 'educoder';
import "../css/messagemy.css"
import WriteaprivateletterModal from '../messagemodal/WriteaprivateletterModal';
//私信页面
class MessagePrivate extends Component{
	constructor(props) {
		super(props);
		this.state={
			page:1,
			limit:10,
			count:0,
			data:undefined,
			isSpin:false,
			modalsType:false,
		};
		console.log("MessagePrivate");
	 console.log(this.props);
	}

	componentDidMount(){
      this.getdata(1);
	};

 //获取数据地方
	getdata=(page)=>{
		this.setState({
			isSpin:true,
		});
		let{limit}=this.state;
		let url = `/users/${this.props.current_user.user_id}/private_messages.json`;
		// let url = `/users/71519/private_messages.json`;
		axios.get((url),{params:{
				page:page,
				per_page:limit,
			}}).then((result) => {
			if (result) {
				// console.log(types);
				// console.log(result);
				if(result.data.message!==undefined){
					// console.log("5151515151");
					return;
				}
				// console.log("调用了消失的方法");
				// console.log("5454545454");
				this.setState({
					page:page,
					count:result.data.count,
					isSpin:false,
					data:result.data.private_messages===null?undefined:result.data.private_messages===undefined?undefined:result.data.private_messages===[]?undefined:result.data.private_messages==="[]"?undefined:result.data.private_messages.length===0?undefined:result.data.private_messages,
				})
			}
		}).catch((error) => {
			console.log(error);
			this.setState({
				isSpin:false,
			})
		})
	};

	paginationonChanges=(pageNumber)=>{
		this.setState({
			page: pageNumber,
		})
		this.getdata(pageNumber);
	};
	okmodalsType=()=>{
		this.setState({
			modalsType:true,
		})
	}
	cancelmodalsType=()=>{
		this.setState({
			modalsType:false,
		})
	};
	// 跳转页面
	smyJump =(i,item)=>{
		console.log("跳转页面");
		console.log(i);
		this.props.Modifyur(i,item);
	};
	myCome=(e)=>{
		window.location.href="/users/innov";
	}
	render() {
		let{page,limit,typeysl,count,isSpin,data,modalsType}=this.state;
		// console.log(	this.props);
		// console.log("37");
		return (
			<div>
				{
					modalsType===true?
						<WriteaprivateletterModal {...this.state} {...this.props} modalsType={modalsType} cancelmodalsType={this.cancelmodalsType} smyJump={(is,item)=>this.smyJump(is,item)} ></WriteaprivateletterModal>
						:""
				}
			<div className="edu-back-white ml25">
      <p className="clearfix font-16 padding30-20 bor-bottom-greyE">
      <span className="fl">全部私信</span>
      <a  className="color-blue fr" onClick={()=>this.okmodalsType()}>写私信</a>
			</p>
			<Spin size="large" className="myw100baifenbi" spinning={isSpin}>

					{
						data===undefined?
							<div className="edu-tab-con-box clearfix edu-txt-center">
								<img className="edu-nodata-img mb20"  src={getImageUrl("images/educoder/nodata.png")}/>
								<p className="edu-nodata-p mb20">暂无数据哦~</p>
							</div>
							:data.map((item,key)=>{
								return(

										<div className="private-item clearfix df" key={key} onClick={(i)=>this.smyJump(3,item.target)}>
											<a className="fl mr10 private_message_a">
												<img src={item.target.image_url} className="radius myimgw48 myimgh48"/>
											</a>
											<div className="fl flex1">
												<p>
													<a onClick={()=>this.myCome(item)} className="mr20 private_message_a">{item.target.name}</a>
													<span>与你的私信</span>
													<span className="color-grey-c mr20">[{item.message_count}{"条"}]</span>
													<span className="color-grey-c">{moment(item.send_time).fromNow()}</span>
												</p>
												<span className="color-grey-6 break_word_firefox " 		dangerouslySetInnerHTML={{__html:item.content}}></span>

											</div>
											{item.unread === true ?<span className="new-point fr mt22"></span>:""}
										</div>

								)
							})}
				</Spin>


			</div>

        {/*页数*/}
				{ data===undefined?""
					:
					(count>10?
							<div style={{textAlign: "center"}} className="new_expand mt10">
								<div className="edu-txt-center mt30">
									<Pagination showQuickJumper current={page}
															onChange={this.paginationonChanges} pageSize={limit}
															total={count}></Pagination>
								</div>
							</div>
							:""
					)

				}
			</div>

		)
	}
}
export default MessagePrivate;