import React, { Component } from 'react'
import PropTypes from 'prop-types'
import { Button } from 'components/Form'

import { LOG } from 'utils'

export default class ChangAccountData extends Component {
    static propTypes = {
        onSuccess: PropTypes.func,
        styles: PropTypes.object

    }
    static defaultProps = {
        onSuccess: () => { LOG('重置密码成功prop未定义') }

    }
    handelSendEmail = () => {
        alert('验证码已经发送到您的邮箱，请查收，并通过验证码进行修改操作')
    }
    handelReset = () => {
        this.props.onSuccess()
    }
    state = {errorInfo: '', loading: false}

    render () {
        const {styles} = this.props

        return (
            <div className={`${styles.changeEmail} ${styles.form}`}>
                <div>
                    <p className={styles.title}>修改账户资料</p>
                    <div className={`${styles.UserAvatar}`} >用户头像</div>
                    <input className={`${styles.inputText}`} placeholder='用户名' type='text' />
                    <input className={`${styles.inputText}`} placeholder='注册电话' type='text' />
                    <input readOnly value='microduino.com' className={`${styles.inputText} ${styles.readonly} ${styles.email}`} type='text' />
                    <p className={styles.error}>{this.state.errorInfo}</p>
                    <Button onClick={this.handelReset}>确认</Button>
                </div>
            </div>
        )
    }
}