import Taro, { useState, useDidShow } from '@tarojs/taro'
import { View, Text } from '@tarojs/components'
import { AtButton, AtInput } from 'taro-ui'
import { getItem } from '../../util'
import { loginService } from '../../service/global'
import { version } from '../../config'
import './index.scss'


const Login: React.FC = () => {
  const [username, setUsername] = useState('admin')
  const [password, setPassword] = useState('admin@district2019')

  useDidShow(() => {
    if (getItem('token')) {
      Taro.redirectTo({ url: '/pages/index/index' })
    }
  })

  const login = () => {
    loginService({
      username,
      password
    }).then(res => {
      if (res.code === '0') {
        Taro.setStorage({
          key: 'userInfo',
          data: res.content
        })
        Taro.redirectTo({
          url: '/pages/index/index'
        })
      } else {
        Taro.showToast({
          title: res.message,
          icon: 'none'
        })
      }
    })
  }

  return (
    <View className='container'>
      <AtInput
        name='username'
        title='用户名'
        type='text'
        placeholder='请输入用户名'
        value={username}
        onChange={(value: string) => setUsername(value)}
      />
      <AtInput
        name='password'
        title='密码'
        type='password'
        placeholder='请输入'
        value={password}
        onChange={(value: string) => setPassword(value)}
      />
      <AtButton type='primary' onClick={login} className='btn'>登录</AtButton>
      <View style={{ textAlign: 'center', marginTop: '20px' }}>
        <Text>v{version}</Text>
      </View>
    </View>
  )
}

export default Login