1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889 |
- import React from 'react';
- import { connect } from 'react-redux';
- // import { bindActionCreators } from 'redux'
- // import {} from './../../../actions'
- import axios from 'axios';
- // redux-connected container
- class profilePage extends React.Component {
- state = {
- user: {}
- }
- getUser = () => {
- const randomUserId = Math.ceil(Math.random() * 10);
- axios.post(`https://quiz.maxcrc.de/api/v1/user`,{
- "login": 'ddd',
- "password":"jhgfhgg"
- })
- .then(({ data }) => this.setState({
- user: data
- }))
- .catch(({ message }) => console.warn(message))
- }
- componentDidMount() {
- this.getUser();
- }
- render() {
- const { user } = this.state;
- console.log(user);
- return (
- <div className="page page--bottom-only profile-page">
- <section className="container section section--about">
- <h2 className="section__element section__element--header">{user.login}</h2>
- <img className="section__element section__element--image" src={user.avatar} alt="avatar" />
- <div className="sedtion__element section__element--login">
- <h3>Login</h3>
- <p>{user.login}<button className="link link--btn right">Change login</button></p>
- </div>
- <div className="section__element section__element--">
- <h3>E-mail</h3>
- <p>{user.email}<button className="link link--btn right">Change e-mail</button></p>
- </div>
- <div className="section__element section__element--">
- <h3>Status</h3>
- <p>{user.description}</p>
- </div>
- </section>
- <section className="container section section--stats">
- <div className="section__element section__element--">
- <h3>Member Since</h3>
- <p>{new Date(user.createdAt).toLocaleString()}</p>
- </div>
- <div className="section__element section__element--comments">
- <h3>Last comments</h3>
- <p className="comments-block">
- {
- user.comments && user.comments
- .slice(0, 60)
- .map(el =>
- <p>
- <h4>{new Date(el.createdAt).toLocaleString()}</h4>
- {el.text}
- </p>)
- }
- </p>
- </div>
- </section>
- </div>
- )
- }
- }
- const
- mapStateToProps = state => ({
- user: state.user
- })
- // mapDispatchToProps = dispatch => bindActionCreators({}, dispatch)
- export default connect(mapStateToProps)(profilePage);
|