<template>
    <div class="common_register_pc_1 common_popbg" v-show="open"><!--使用此组件，请复制此div-->
        <div class="register-pop common_pop">
            <span class="common_pop_close" @click="changeStstus"></span>
            <span class="register-pop-title">{{title}}</span>
            <div class="register-pop-hd" v-if="isShow && isreg">
                <ul>
                    <li :class="{on:active===0}" @click="grxy">个人学员</li>
                    <li :class="{on:active===1}" @click="cyqy">参训企业</li>
                    <!--<li :class="{on:active===2}" @click="pxjg">培训机构</li> -->
                </ul>
            </div>
            <div class="register-pop-bd">
                <div class="register-pop-part"><!--个人学员-->
                    <div  :class="{'register-pop-part-inp':defaultClass,'wrong-inp':isName}"  v-if="isShow && isreg">
                        <span class="wrong-tip" v-show="isName">请输入中文姓名</span>
                        <input type="text" @input="inname" v-model="obj.custName" placeholder="请输入您的姓名" class="inp1">
                    </div>
                    <div :class="{'register-pop-part-inp':defaultClass,'wrong-inp':isCard}" v-if="isShow && isreg">
                        <span class="wrong-tip" v-show="isCard">请输入正确身份证号</span>
                        <input type="text" @input="incard" v-model="obj.idcarNo" placeholder="请输入您的身份证号码" class="inp1">
                    </div>
                    <div :class="{'register-pop-part-inp':defaultClass,'wrong-inp':isPhone}">
                        <span class="wrong-tip" v-show="isPhone">请输入正确的手机号</span>
                        <input type="text" @input="inphone" v-model="obj.phone" placeholder="请输入手机号" class="inp1">
                    </div>
                    <div :class="{'register-pop-part-inp':defaultClass, 'wrong-inp':isCode}">
                        <span class="wrong-tip" v-show="isCode">请输入正确的验证码</span>
                        <input type="text" @input="inCode" placeholder="手机验证码" v-model="obj.code" class="inp2">
                        <input type="button" @click="getCode($event)" value="获取验证码" class="inp3">
                    </div>

                    <div class="register-pop-part-inp" v-if="!isreg">
                     <select name="" id=""  v-model="couponSelected" class="select1">
                       <option value="" disabled selected style='display:none;'>请验证手机号选择绑定账号</option>
                        <option v-for="(list,i) in userList" :key="i" :value="list.custId">{{list.custName}}</option>
                     </select>
                  </div>
                    <div class="register-pop-part-inp" v-if="isShow">
                        <input type="password" v-model="obj.password" placeholder="输入新密码" class="inp1">
                    </div>
                    <div class="register-pop-part-inp" v-if="isShow && !isreg">
                        <input type="password" v-model="newpwd" placeholder="再次输入新密码" class="inp1">
                    </div>
                    <button v-if="isreg" class="register-pop-part-sub" @click="autoLogin">确认并注册</button>
                    <button v-else class="register-pop-part-sub" @click="findPwd">确认并找回</button>
                </div>

            </div>
        </div>
    </div>
</template>

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

  export default {
    name: 'ElLogin',
    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: {
          custName: '',
          idcarNo: '',
          phone: '',
          code: '',
          password: ''
        },
        newpwd:'',
        timer:null,
        ele:null,
        isreg:true,
        title:'注册',
        userList:[],
        couponSelected:'',
        time:60,
      };
    },
    mounted() {

      this.init();
    },
    methods: {
      findPwd(){

        if(!$.string.equal(this.obj.password,this.newpwd)){
          msg.warning("两次密码不一致！");
          return  false;
        }else if(!this.obj.phone) {
          msg.warning('手机号不能为空！');
          return false;
        } else if (!this.obj.code) {
          msg.warning('验证码不能为空！');
          return false;
        }
        $.util
        .ajax(
            lenye_base.base_data.getapiUrl() +
            '/base-service/common/forgetPassword.do',
            lenye_base.base_data.getformatting({
              CUST_ID:this.couponSelected,
              LOGIN_NAME:this.obj.phone,
              DYN_CODE:this.obj.code,
              NEW_PWD:this.obj.password
            })
          ).then(res=>{
            if(res.success=='1'){
              msg.success("重置密码成功！");
               this.$emit('setOpen', false);
            }else{
              msg.error(res.message);
            }
          })

      },
      pwd(){
        this.isreg = false;
        this.title = "找回密码";
      },
      reg(){
        this.isreg = true;
        this.title = "注册";
      },
      clearData() {
        this.obj.phone = '';
        this.obj.code = '';


        this.$emit('dataNull', false);
      },
      init() {
        var oEle = $._.default('.common_pop');
        oEle.css({
          //position:'absolute',
          'margin-top': '10%'
          //left:$._._.default(window).width() / 2 - oEle.width() / 2
        });
      },
     async phoneReg(){
       var idtCode = '';

       switch(this.active){
          case 1:
            idtCode = 'company';
            break;
          case 2:
            idtCode = 'business';
            break;
       }
       this.obj['idtCode'] = idtCode;
        let phoneReg = await $.util
        .ajax(
            lenye_base.base_data.getapiUrl() +
            '/base-service/common/userPhoneRegist.do',
            lenye_base.base_data.getformatting(this.obj)
          );
          if(phoneReg.success=='1'){
             msg.success("注册成功！")
             this.$emit('setOpen', false);
          }else{
            msg.error(phoneReg.message);
            return  false;
          }
      },
      async autoLogin() {
        if (!this.obj.phone) {
          msg.warning('手机号不能为空！');
          return false;
        } else if (!this.obj.code) {
          msg.warning('验证码不能为空！');
          return false;
        }
        let isBy = await this.checkCode(this.obj.code);
        if(!isBy){
          msg.warning("验证码错误！");
          return  false;
        }
        this.phoneReg();

      },
      inphone() {
        if ($.validation.isPhone(this.obj.phone)) {
          this.$emit('isphone', false);
        } else {
          this.$emit('isphone', true);
        }
      },
      inname(){
        if ($.validation.isZh(this.obj.custName)) {
          this.$emit('isname', false);
        } else {
          this.$emit('isname', true);
        }
      },
      incard(){
        if ($.validation.isCard(this.obj.idcarNo)) {
          this.$emit('iscard', false);
        } else {
          this.$emit('iscard', true);
        }
      },
      inCode() {
         // debugger;
        //console.log($.validation.isAllNumber(this.obj.code));
        if ($.validation.isAllNumber(this.obj.code) && this.obj.code.length=='4') {
          if ($.validation.isPhone(this.obj.phone) && this.title!='注册') {
            this.dynMobileCodeCheck();
          }
          this.$emit('iscode', false);
        } else {
          this.$emit('iscode', true);
        }
      },
      dynMobileCodeCheck(){
         $.util
        .ajax(
            lenye_base.base_data.getapiUrl() +
            '/base-service/common/dynMobileCodeCheck.do',
            lenye_base.base_data.getformatting({
              LOGIN_NAME:this.obj.phone,
              DYN_CODE:this.obj.code
            })
          ).then(phoneReg=>{
            if(phoneReg.success=='1'){
              this.getUser();
            }else{
              msg.error(phoneReg.message);

            }
          })

      },
      getUser(){
         // '/base-service/common/cust/custInfo/queryCustPage.do',
         $.util
        .ajax(
            lenye_base.base_data.getapiUrl() +
             '/base-service/common/cust/custInfo/queryCustList.do',
            lenye_base.base_data.getformatting({
              phone:this.obj.phone,
            })
          ).then(phoneReg=>{
            if(phoneReg.success=='1'){
              if(phoneReg.data){
                this.isreg = false;
                this.couponSelected = phoneReg.data[0].custId;
                this.userList = phoneReg.data;
              }else{
                msg.warning('该手机号未绑定用户！')
              }
            }else{
              msg.error(phoneReg.message);

            }
          })
      },
      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', 'inherit');
            ele.val('获取验证码');
            this.time = 60;
          }
        }, 1000);
      },
     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;
        }
      },
      getCode(ev) {
        var ele = $._.default(ev.target);
        this.ele = ele;
        ele.val('发送中...');
        ele.attr('disabled', 'disabled');
        ele.css('color', 'gray');

        if (!this.isPhone && this.obj.phone) {
          $.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("请输入正确手机号！");
        }
      },
      changeStstus() {
        this.$emit('setOpen', false);
      },
      setNull(){
        this.obj={
          custName: '',
          idcarNo: '',
          phone: '',
          code: '',
          password: ''
        }

        this.$emit('isname', false);
        this.$emit('iscard', false);
        this.$emit('iscode', false);
        this.$emit('isphone', false);

      },
      grxy() {
        this.setNull();
        this.active = 0;
      },
      cyqy() {
        this.setNull();
        this.active = 1;
      },
      pxjg() {
        this.setNull();
        this.active = 2;
      }
    }
  };
</script>
