123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899 |
- import React from 'react'
- import { connect } from 'react-redux'
- import PropTypes from 'prop-types'
- import { translate } from 'react-i18next'
- import {newFlashMessage} from '../../action-creator.sync.js'
-
- require('./PersonalData.styl')
-
- export class PersonalData extends React.Component {
- constructor (props) {
- super(props)
- this.state = {
- newName: '',
- newEmail: '',
- checkPassword: ''
- }
- }
-
- handleChangeName = e => this.setState({newName: e.target.value})
-
- handleChangeEmail = e => this.setState({newEmail: e.target.value})
-
- handleChangeCheckPassword = e => this.setState({checkPassword: e.target.value})
-
- handleClickSubmit = () => {
- const { props, state } = this
-
- if (state.newEmail !== '' && state.checkPassword === '') {
- props.dispatch(newFlashMessage(props.t('Please type your password in order to change your email. (For security reasons)'), 'info'))
- return
- }
-
- props.onClickSubmit(state.newName, state.newEmail, state.checkPassword)
- }
-
- render () {
- const { props } = this
- return (
- <div className='account__userpreference__setting__personaldata'>
- <div className='personaldata__sectiontitle subTitle ml-2 ml-sm-0'>
- {props.t('Account information')}
- </div>
-
- <div className='personaldata__text ml-2 ml-sm-0' />
-
- <form className='personaldata__form'>
- <div className='personaldata__form__title'>
- {props.t('Name:')}
- </div>
-
- <div className='d-flex align-items-center flex-wrap mb-4'>
- <input
- className='personaldata__form__txtinput primaryColorBorderLighten form-control mt-3 mt-sm-0'
- type='text'
- placeholder={props.t('Change your name')}
- onChange={this.handleChangeName}
- />
- </div>
-
- <div className='personaldata__form__title'>
- {props.t('Email Address:')}
- </div>
-
- <div className='d-flex align-items-center flex-wrap mb-4'>
- <input
- className='personaldata__form__txtinput primaryColorBorderLighten form-control mt-3 mt-sm-0'
- type='email'
- placeholder={props.t('Change your email')}
- onChange={this.handleChangeEmail}
- />
-
- <input
- className='personaldata__form__txtinput checkPassword primaryColorBorderLighten form-control mt-3 mt-sm-0'
- type='password'
- placeholder={props.t('Check your password')}
- onChange={this.handleChangeCheckPassword}
- />
- </div>
-
- <button
- type='button'
- className='personaldata__form__button primaryColorBorderLighten btn'
- onClick={this.handleClickSubmit}
- >
- {props.t('Send')}
- </button>
- </form>
- </div>
- )
- }
- }
-
- PersonalData.propTypes = {
- onClickSubmit: PropTypes.func
- }
-
- const mapStateToProps = () => ({})
- export default connect(mapStateToProps)(translate()(PersonalData))
|