<template>
  <div class="code">
    <button type="button" class="code-button" :disabled="hasSend" @click="send()">{{sendTxt}}</button>
  </div>
</template>
<script>
  import base from '../../lib/base'
  export default {
    components: {

    },
    name: 'codeButton',
    data () {
      return {
        sendTxt:'发送验证码',
        hasSend:false,
        time:90
      }
    },
    props:['cb','cardNum','phone','trdType','verifyCode'],
    methods: {
      //发送验证码
      send(){
        //发送验证码前若需校验，就先进行校验
        console.log(this.cardNum)
        if (this.cb){
          //校验方法
          this.cb()
          //校验通过后，此处才可以发送验证码
          if (sessionStorage.vertifyPass){
            this.hasSend = true

            //发送验证码ajax
            base.$.http({
              app:'wxCheckText',
              func:'sendText',
              accno:this.cardNum,//卡号，由父组件传来
              phone:this.phone,//手机号，由父组件传来，可为空字符串，后台将预留手机赋给发送短信的手机号
              trdType:this.trdType,//交易类型，由父组件传来
              verifyCode:this.verifyCode,//附加码，由父组件传来
              flag:'1'//1:开启验证，0:不验证
            },data=>{
              data=JSON.parse(data);
              console.info(data);
              if(data.error)
              {
                base.msg.alert(data.error);
                return ;
              }
              base.msg.alert(data.success);
            })

            sessionStorage.vertifyPass = ''
            var timer = setInterval(()=>{
              if (this.time==0){
                this.hasSend = false
                this.sendTxt = '发送验证码'
                this.time = 90
                clearInterval(timer)
                return
              }
              this.sendTxt = this.time-- + 's 后重发'
            },1000)
          }
          return
        }
        //无需校验时
        this.hasSend = true
        //发送验证码ajax
        base.$.http({
          app:'wxCheckText',
          func:'sendText',
          accno:this.cardNum,//卡号，由父组件传来
          phone:this.phone,//手机号，由父组件传来，可为空字符串，后台将预留手机赋给发送短信的手机号
          trdType:this.trdType,//交易类型，由父组件传来
          flag:'1'//1:开启验证，0:不验证
        },data=>{
          data=JSON.parse(data);
          console.info(data);
          if(data.error)
          {
            base.msg.alert(data.error);
            return ;
          }
          base.msg.alert(data.success);
        })

        var timer = setInterval(()=>{
          if (this.time==0){
            this.hasSend = false
            this.sendTxt = '发送验证码'
            this.time = 90
            clearInterval(timer)
            return
          }
          this.sendTxt = this.time-- + 's 后重发'
        },1000)
      }
    }
  }
</script>
<style scoped>
  .code-button{
    width: 1.9rem;
    height: .6rem;
    border: 1px solid #9db6eb;
    border-radius: .3rem;
    color: #6590dc;
    font-size: .24rem;
  }
  .code-button:active{
    box-shadow:0 0 3px rgba(157,182,235,.5);
    background:rgba(245,245,245,.72);
    border: 1px solid #9db6eb;
  }
  .code-button[disabled]{
    background: #f5f5f5;
    color: #666;
    border-color: transparent;
    box-shadow: none;
  }
</style>
