<template>
  <div class="code">
    <verify-code
      v-model="options"
      @on-getCode="getCode"
    />
  </div>
</template>
<script>
import { VerifyCode } from '../components/_index'

export default {
  components: {
    VerifyCode
  },
  data () {
    return {
      options: {
        show: false,
        time: 3,
        start: false,
        codeText: '恭喜发财'
      }
    }
  },
  methods: {
    getCode() {
      let n = 0
      this.options.show = true
      let time = setInterval(() => {
        n++
        if (n === 5) {
          this.options.show = false
          this.options.start = true
          clearInterval(time)
        }
      }, 1000)
    }
  }
}
</script>
<style lang="less" scoped>
@import "../styles/cui/base/fn";
// 自定义loading旋转样式
// @width: 4.14/@w;
// @height: 2.08/@w;
// @transX: 3.5/@w;
// .code .verifyCode{
//   position: absolute;
//   top: 45%;
//   left: 15/@w2;
// }
</style>
