import { Component } from 'react'
import Taro from '@tarojs/taro'
import { connect } from 'react-redux'
import {View, Map, Button, Input} from '@tarojs/components'
import {login} from '../../utils/servers/servers';

import { add, minus, asyncAdd } from '../../actions/counter'

import './index.less'


@connect(({ counter }) => ({
  counter
}), (dispatch) => ({
  add () {
    dispatch(add())
  },
  dec () {
    dispatch(minus())
  },
  asyncAdd () {
    dispatch(asyncAdd())
  }
}))
class Login extends Component {
  constructor(props) {
    super(props);
    this.state={
      username:'',
      password:''
    }
    this.login = this.login.bind(this);
  }

  componentDidShow () {

  }

  componentDidMount() {

  }

  login(){
    if(!this.state.username){
      Taro.showToast({
        title: '请输入用户名',
        icon: 'none',
        duration: 2000
      })
      return;
    }
    if(!this.state.password){
      Taro.showToast({
        title: '请输入密码',
        icon: 'none',
        duration: 2000
      })
      return;
    }
    this.setState({
      loading:true,
    })
    login({
      username:this.state.username,
      password:this.state.password
    }).then(()=>{
      this.setState({
        loading:false
      });
      Taro.switchTab({
        url: '/pages/applyDepart/index',
      })
    }).catch(()=>{
      this.setState({
        loading:false
      })
    })
  }

  render () {
    return (
      <View>
        <View>
          <View>用户名</View>
          <Input
            type='text'
            placeholder='请输入用户名'
            value={this.state.username}
            onInput={(v)=>{
              this.setState({
                username: v.detail.value
              })
            }}
          />
        </View>
        <View>
          <View>密码</View>
          <Input
            type='password'
            password
            placeholder='请输入密码'
            value={this.state.password}
            onInput={(v)=>{
              this.setState({
                password: v.detail.value
              })
            }}
          />
        </View>
        <Button type='primary' loading={this.state.loading} onClick={this.login}>登录</Button>
      </View>
    )
  }
}

export default Login

