import React, { PureComponent } from 'react';
import { browser } from "@/utils";
import './loginWays.scss'


class LoginWays extends PureComponent {

    state = {
        ways: this.props.loginWays
    }

    componentDidMount() {
        if (!browser.isWeixin) {
            this.setState({
                ways: this.state.ways.filter(item => item.text !== '微信')
            })
        }
    }


    handleClick = text => {
        this.props.onClick(text)
    }

    render() {
        return (
            <div className="login-ways">
                <div className="bottom-title">其他登录方式</div>
                <ul className='login-ways-container'>
                    {
                        this.state.ways.map((item, index) => {
                            return (
                                <li key={index} onClick={this.handleClick.bind(this, item.text)}>
                                    <img src={item.logo} alt=""/>
                                    <p>{item.text}</p>
                                </li>
                            )
                        })
                    }
                </ul>
            </div>
        );
    }
}


export default LoginWays;