<template>
  <a-spin :tip="description" :size="'large'" :spinning="changePathFlag !== 0" style="width: 100%;height: 100%">
    <result
      v-show="changePathFlag === 0"
      :isSuccess="true"
      :content="false"
      :title="email"
      :type="'error'"
      :description="description">

      <template slot="action">
        <a-button size="large" @click="showErrorStr" >查看信息</a-button>
        <a-button size="large" type="primary" style="margin-left: 8px" @click="goHomeHandle">{{ buttonStr }}</a-button>
      </template>

    </result>
  </a-spin>
</template>

<script>
import { Result } from '@/components'
import { mapActions } from 'vuex'
import { GlobalConstant } from '@/constant'
import { timeFix } from '@/utils/util'

export default {
  name: 'RegisterResult',
  components: {
    Result
  },
  data () {
    return {
      description: '正在登录请稍后...',
      form: {},
      errorStr: '',
      buttonStr: '正在登录...',
      changePathFlag: 3
    }
  },
  computed: {
    email () {
      return '自动登录'
    }
  },
  created () {
    this.form = this.$route.params
    const name = this.$route.query.n
    const password = this.$route.query.p
    const loginParams = {
      username: name,
      randomStr: this.randomStr,
      password: password,
      grant_type: 'password',
      scope: 'server',
      loginType: 1
    }
    this.Login(loginParams)
      .then((res) => this.loginSuccess(res))
      .catch(err => {
        console.log(err)
        this.errorStr = err.data.message
        this.changePathFlag = 0
        this.buttonStr = '返回登录页'
        this.description = '自动登录失败,请手动登录'
      })
  },
  methods: {
    ...mapActions(['Login']),
    goHomeHandle () {
      if (this.changePathFlag === 0) {
        this.$router.push({ name: 'login' })
      }
      if (this.changePathFlag === 1) {
        this.$router.push({ path: GlobalConstant.PC_INDEX_PATH })
      }
    },
    showErrorStr () {
      if (this.changePathFlag === 0) {
        this.$message.error(this.errorStr)
      }
      if (this.changePathFlag === 1) {
        this.$message.success(this.errorStr)
      }
    },
    loginSuccess () {
      this.buttonStr = '手动跳转'
      this.description = '登录成功,正在跳转...'
      this.errorStr = '登录成功'
      this.changePathFlag = 1
      this.$router.push({ path: GlobalConstant.PC_INDEX_PATH })
      // 延迟 1 秒显示欢迎信息
      setTimeout(() => {
        this.$notification.success({
          message: '欢迎',
          description: `${timeFix()}，欢迎回来`
        })
      }, 1000)
    }
  }
}
</script>

<style scoped>
  .spin-content {
    border: 1px solid #91d5ff;
    background-color: #e6f7ff;
    padding: 80px;
  }
</style>
