<template>
  <div class="login-reg-popbg"  style="display:none;">
    <div class="login-reg-pop">
      <span class="login-reg-pop-close" @click="closeWin"><img src="../../theme-chalk/src/images/close-icon.png" alt=""></span>
      <div class="login-reg-pop-left login-reg-pop-left-line">
                <span class="banner-login-btitle">
                    <span>注册</span>
                    <ul>
                        <li :class="{on:active===0}" @click="phoneSelReg">手机号丨</li>
                        <li :class="{on:active===1}" @click="idcardSelReg">身份证</li>
                    </ul>
                    <div class="clear"></div>
                </span>
        <div class="login-bd">
          <ul>
            <li id="phoneRegDiv">
              <p class="login-bd-p1">
                <span class="wrong-tip" v-show="isPhone">请输入正确的手机号</span>
                <input type="text" v-model="obj.phone" class="login-input login-reg-icon01" placeholder="请输入手机号" style="width: 60%"/>
                <input type="button" @click="getCode($event)" value="获取验证码" class="login-btn getnum" style="width: 36%; margin-left: 4%"/>
              </p>
              <p class="login-bd-p2"><input type="text" v-model="obj.code" class="login-input login-reg-icon02"
                                            placeholder="请输入验证码"></p>
              <p class="login-bd-p2"><input type="password" v-model="obj.password" class="login-input login-reg-icon03"
                                            placeholder="设置登录密码"></p>
              <p class="login-bd-p2"><input type="password" v-model="newpwd" class="login-input login-reg-icon03"
                                            placeholder="再次输入密码"></p>
              <p class="login-bd-p1"><input type="button" value="确认注册" @click="phoneReg" class="login-btn"></p>
            </li>
            <li style="display: none;" id="idcardRegDiv">
              <p class="login-bd-p1"><input type="text" v-model="idcardObj.idcarNo" class="login-input login-reg-icon04"
                                            placeholder="请输入身份证号"></p>
              <p class="login-bd-p2"><input type="text" v-model="idcardObj.custName" class="login-input login-reg-icon05"
                                            placeholder="请输入姓名"></p>
              <p class="login-bd-p2"><input type="password" v-model="idcardObj.password" class="login-input login-reg-icon03"
                                            placeholder="设置登录密码"></p>
              <p class="login-bd-p2"><input type="password" v-model="newpwd" class="login-input login-reg-icon03"
                                            placeholder="再次输入密码"></p>
              <p class="login-bd-p1"><input type="button" value="确认注册" @click="idcardReg" class="login-btn"></p>
            </li>
          </ul>
        </div>
        <div class="wrong-tip redtxt" style="display: none">该手机号已注册，请选择登录！若忘记密码，请在登录页选择【找回密码】</div>
      </div>
      <div class="clear"></div>
    </div>
  </div>
</template>

<script>
  import {httpPost} from '../../../src/utils/utils';
  import formMixin from '../../../src/mixins/formMixin';
  import lenye_base from 'lenye_base';
  import  $ from 'fy-kit';
  import msg from '../../message';

  export default {
    name: 'ElRegPop',
    mixins: [formMixin],
    components: {
      msg
    },
    props: {
      placeholder: {
        type: String,
        default: '总访问量a'
      },
      isShow: {
        type: Boolean,
        default: true
      },
      isPhone: {
        type: Boolean,
        default: false
      },
      isCard:{
        type:Boolean,
        default: false
      },
      isName: {
        type: Boolean,
        default: false
      },
      isCode: {
        type: Boolean,
        default: false
      },
      defaultClass: {
        type: Boolean,
        default: true
      },

      open: {
        type: Boolean,
        default: true
      }
    },
    data() {
      return {
        active: 0,
        obj: {
          phone: '',
          code: '',
          password: ''
        },
        idcardObj: {
          custName: '',
          idcarNo: '',
          password: ''
        },
        newpwd:'',
        timer:null,
        time:60
      }
    },
    mounted() {
      //this.init();
      this.setNull();
    },
    computed: {},
    methods: {
      phoneSelReg(){
        $._.default("#idcardRegDiv").hide();
        $._.default("#phoneRegDiv").show();
        this.active = 0;
        this.setNull();
      },
      idcardSelReg(){
        $._.default("#phoneRegDiv").hide();
        $._.default("#idcardRegDiv").show();
        this.active = 1;
        this.setNull();
      },
      getCode(ev) {
        if (this.obj.phone && $.validation.isPhone(this.obj.phone)) {
          var ele = $._.default(ev.target);
          this.ele = ele;
          ele.val('发送中...');
          ele.attr('disabled', 'disabled');
          ele.css('color', 'gray');
          $.util.ajax(
                  lenye_base.base_data.getapiUrl() +
                  lenye_base.api_url.base.dynCodeSend,
                  lenye_base.base_data.getformatting({
                    stType: 2,
                    mobile: this.obj.phone
                  })
          )
                  .then(res => {
                    this.djs(ele);
                  });
        }else{
          msg.warning("请输入正确手机号！");
        }
      },
      djs(ele) {
        //var time = Number(t);
        this.timer = setInterval(() => {
          ele.attr('disabled', 'disabled');
          ele.css('color', 'gray');
          ele.val('重新发送(' + this.time + ')');
          this.time -= 1;
          if (this.time === 0) {
            clearInterval(this.timer);
            ele.removeAttr('disabled');
            ele.css('color', '#fff');
            ele.val('获取验证码');
            this.time = 60;
          }
        }, 1000);
      },
      async phoneReg(){
        if (!this.obj.phone) {
          msg.warning('手机号不能为空！');
          return false;
        }else if (!this.obj.code) {
          msg.warning('验证码不能为空！');
          return false;
        }else if (!this.obj.password) {
          msg.warning('密码不能为空！');
          return false;
        }else if (!this.obj.code) {
          msg.warning('验证码不能为空！');
          return false;
        }else if(!$.string.equal(this.obj.password,this.newpwd)){
          msg.warning('两次密码不一致！');
          return false;
        }
        let isBy = await this.checkCode(this.obj.code);
        if(!isBy){
          return  false;
        }
        let regResult = await $.util
                .ajax(
                        lenye_base.base_data.getapiUrl() +
                        '/base-service/common/userPhoneRegist.do',
                        lenye_base.base_data.getformatting(this.obj)
                );
        if(regResult.success=='1'){
          msg.success("注册成功！")
          this.closeWin();
        }else{
          msg.error(regResult.message);
          return  false;
        }
      },
      async idcardReg(){
        if (!this.idcardObj.idcarNo) {
          msg.warning('身份证号不能为空！');
          return false;
        }else if(!$.validation.isCard(this.idcardObj.idcarNo)){
          msg.warning('身份证号不合法！');
          return false;
        }else if (!this.idcardObj.custName) {
          msg.warning('姓名不能为空！');
          return false;
        }else if(!$.validation.isZh(this.idcardObj.custName)){
          msg.warning('姓名不全是中文！');
          return false;
        }else if (!this.idcardObj.password) {
          msg.warning('密码不能为空！');
          return false;
        }else if(!$.string.equal(this.idcardObj.password,this.newpwd)){
          msg.warning('两次密码不一致！');
          return false;
        }
        let regResult = await $.util
                .ajax(
                        lenye_base.base_data.getapiUrl() +
                        '/base-service/common/userIdcarRegist.do',
                        lenye_base.base_data.getformatting(this.idcardObj)
                );
        if(regResult.success=='1'){
          msg.success("注册成功！")
          this.closeWin();
        }else{
          msg.error(regResult.message);
          return  false;
        }
      },
      async checkCode(DYN_CODE){
        //common/dynCodeCheck.do
        let res =   await  $.util
                .ajax(
                        lenye_base.base_data.getapiUrl() +
                        "/base-service/common/dynCodeCheck.do",
                        lenye_base.base_data.getformatting({
                          DYN_CODE
                        })
                )
        if(res.success=='1'){
          return true;
        }else{
          msg.error(res.message);
          return false;
        }
      },
      closeWin(){
        $._.default(".login-reg-popbg").hide();

      },
      showPop(){
        $._.default(".login-reg-popbg").show();

      },
      setNull(){
        this.obj={
          phone: '',
          code: '',
          password: ''
        };
        this.idcardObj= {
          custName: '',
          idcarNo: '',
          password: ''
        };
        this.newpwd = '';
      }
    },
  };

</script>
