<template>
  <!-- 获取验证码 -->
  <div class="getCheckCode" :class="time<60?'disabledBox':''" >
      <span class="gain" @click="getCode()">{{text}}</span>
  </div>
</template>

<script>
// import {commonSend} from '@/api/conmmon.js'
  export default {
    props:['value','type'],
    data(){
      return{
          text:"获取验证码",
          time:60,
          phone:"",
          formData:{
            phone:'',
            send_type:'', //login 登录  reset重置
          }
      }
    },
    mounted() {
      this.formData.send_type = this.type
    },
    watch:{
      value(val){
        this.formData.phone = val
      },
    },
    methods:{
      verification(){
        // var reg_tel = /^1(3[0-9]|4[01456879]|5[0-35-9]|6[2567]|7[0-8]|8[0-9]|9[0-35-9])\d{8}$/;
        var reg_tel = /^1\d{10}$/;
        if(this.formData.phone === ''){
          this.popFun('提示','请输入手机号','error')
          return false
        }
        if(!reg_tel.test(this.formData.phone)){
          this.popFun('提示','请输入正确的手机号','error')
          return false
        }
        return true
      },
      popFun(title,msg,type){
        this.$notify({title: title,message: msg,type: type,});
      },
      getCode(){
        if(this.verification()){
          commonSend(this.formData).then((res)=>{
            if(res.code === 1){
              this.popFun('成功','获取短信验证码成功','success')
            }
          })
          var timer = setInterval(()=>{
             this.time--;
             this.text = this.time + "秒";
             if (this.time==0) {
               this.time = 60;
               clearInterval(timer);
               this.text = "获取验证码";
             }
           },1000);
        }
      },

    },
  }
</script>

<style scoped lang="scss">
  .disabledBox{
    pointer-events: none;
  }
  .getCheckCode{
    .gain {
      font-size: 14px;
      color: #2A82E4;
    }
    .gain:hover {
      cursor: pointer;
    }
  }
</style>
