<style lang="less">
  @import './login.less';
</style>

<template>
  <div class="login">
    <div class="login__logomini">
      <img src="@/assets/images/logo-min.png" alt="">
      <p>{{name}}{{$t('Management_System')}}</p>
    </div>
    <p class="login__title">{{$t('login')}}</p>
    <div class="login__loginyuan"></div>
    <div class="login__loginyuan-rightcen"></div>
    <!-- <img class="login__img" src="./pic_illustration.png" alt=""> -->
    <img class="login__img" src="../../assets/images/pic_illustration.png" alt="">
    <div class="login-con">
      <div class="form-con">
        <login-form :logincaptcha="admin_login_captcha" @on-success-valid="handleSubmit"></login-form>
      </div>
    </div>
    <div class="login-tip">
      <p class="login-tip-p">©2020 PhalApi Pro All Rights Reserved.</p>
    </div>
    <!-- <div class="login-con">
        <div class="login-title">{{name}}管理后台</div>
      <Card icon="log-in" title="欢迎登录" :bordered="false">
        <div class="form-con">
          <login-form @on-success-valid="handleSubmit"></login-form>
          <p class="login-tip">©2020 PhalApi Pro All Rights Reserved.</p>
        </div>
      </Card>
    </div> -->
  </div>
</template>

<script>
import LoginForm from '_c/login-form'
import { mapActions } from 'vuex'
import Cookies from 'js-cookie'
import { siteIndexData } from '@/api/home'
import { Profile } from '@/api/user'
import { setCookies } from '@/libs/util'
export default {
  components: {
    LoginForm
  },
  data () {
    return {
      loginToken: '',
      name: '',
      a_member_level_name: '',
      admin_login_captcha: false
    }
  },
  created () {
    const data = new FormData()
    siteIndexData(data).then(res => {
      this.name = res.data.name
      this.admin_login_captcha = res.data.catpcha_switch.admin_login_captcha
      // this.admin_login_captcha = true
      if (!this.$i18n.locale) {
        let lang = res.data.language_list[0].language
        this.$i18n.locale = lang
        setCookies('language', lang)
      }
      localStorage.setItem('a_name', this.name)
      // localStorage.setItem('minLogo', res.data.ico)
      localStorage.setItem('maxLogo', res.data.logo)
    })
  },
  methods: {
    ...mapActions([
      'handleLogin'
      // 'getUserInfo'
    ]),
    handleSubmit ({ username, password, captcha, cookiesExp }) {
      this.handleLogin({ username, password, captcha, cookiesExp }).then((res) => {
        const loginStatus = res.ret
        this.loginToken = res.data.access_token
        if (loginStatus === 200 && this.loginToken) {
          this.$Message.success(this.$t('login_success'))
          this.$router.push({ name: 'home' })
          Cookies.set('username', username, { expires: 1 })
        } else { this.$Message.warning(res.msg) }
        if (this.loginToken) {
          this.ProfileFunction()
        }
      })
    },
    ProfileFunction () {
      const formdata = new FormData()
      formdata.append('access_token', this.loginToken)
      Profile(formdata).then(res => {
        const backData = res.data.profile
        if (res.ret === 200) {
          this.a_member_level_name = backData.member_level_name
          Cookies.set('a_member_level_name', escape(this.a_member_level_name))
          // this.level = Cookies.get('a_member_level_name')
        } else {
          this.$router.push({ name: 'login' })
        }
      })
    }
  }
}
</script>

<style>

</style>
