index.js 7.67 KB
/**
 * 第三方登录绑定手机
 * @author: wq
 * @date: 2016/1/21
 */
var $ = require('yoho-jquery');
var Captcha = require('../../plugins/captcha');
var phoneRegx = require('../common/mail-phone-regx').phoneRegx;

var nopermissionoption = $('#nopermissionmessage').html(); // 倒计时dom
var sendmessagehtml = $('.validatewrapper').html(); // 发送短信dom
var second = +$('.second').text(); // 倒计时秒数
var choosedpic = 'https://cdn.yoho.cn/yohobuy/assets/img/passport/choosed.png';// 已选择图片

var $wrapper = $('.bindwrapper'),
    $phoneTip = $wrapper.find('.phone-err-tip'),
    $nextBtn = $wrapper.find('.yohobindbtn');

var thirdOpenId = $('#openId').val(),
    thirdSourceType = $('#sourceType').val();

var Alert = require('../../common/dialog').Alert;
var dialog = require('../cert/dialog');
var passwordCaptchaImg = new Captcha('.captcha-wrap', {checkURI: ''}).init();

passwordCaptchaImg.onSuccess(function() {
    $('#sendmessage').trigger('click');
});


require('../../simple-header');


/**
 * 选择协议
 * @return {[type]} [description]
 */
function chooseProtocol() {
    $('.choosetag').on('change', function() {
        var btnColor = '#f02200';

        if ($(this).attr('checked') === 'checked') {
            $('.choosewrapper').css({
                'background-image': 'url("' + choosedpic + '")'
            });
        } else {
            $('.choosewrapper').css({
                'background-image': 'none'
            });
            btnColor = '#CCCCCC';
        }
        $nextBtn.css({
            'background-color': btnColor
        });
    });
}

/**
 * 判断是否同意协议
 * @return {[type]} [description]
 */
function isagree() {
    return $('.choosetag').attr('checked') === 'checked';
}

/**
 * 选择区域的开关
 * @return {[type]} [description]
 */
function chooseAreaToogle() {
    $('.optionshow').on('click', function() {
        $('.optionslist').toggleClass('hide');
    });
}

/**
 * 选择区域
 * @return {[type]} [description]
 */
function chooseArea() {
    $('.optionitem').on('click', function() {
        var $option = $(this);
        var areanum = $option.attr('areanum');
        var areaname = $option.text();

        $('#areaname').text(areaname);
        $('#areanum').text(areanum);
        $('#areacode').val(areanum);
        $('.optionslist').addClass('hide');
    });
}

/**
 * 取消选择区域
 * @return {[type]} [description]
 */
function cancelChooseArea() {
    $(document).on('click', 'body', function(e) {
        var $target = $(e.target);

        if ($target.hasClass('yohoselectarea') ||
            $target.hasClass('areaname') ||
            $target.hasClass('righttag') ||
            $target.hasClass('optionslist') ||
            $target.hasClass('optionitem')) {
            return;
        } else {
            $('.optionslist').addClass('hide');
        }
    });
}

/**
 * 去掉区域号的加号
 * @return {[type]} [description]
 */
function fixAreaNum() {
    var $opitem = '';
    var itemarecode = '';

    $('.optionitem').each(function() {
        $opitem = $(this);
        itemarecode = $opitem.attr('areanum').replace(/\+/g, '');
        $opitem.attr('areanum', itemarecode);
    });
}

/**
 * 发送短信的时间变换动画
 * @return {[type]} [description]
 */
function changeSecond() {
    second -= 1;
    if (second < 0) {
        second = 60;
        $('.validatewrapper').html(sendmessagehtml);
        return;
    } else {
        $('.second').text(second);
        window.setTimeout(changeSecond, 1000);
    }

}

/**
 * 时间循环
 * @param  {[type]} phonenum [description]
 * @return {[type]}          [description]
 */
function circleTime() {
    $('.validatewrapper').html(nopermissionoption);
    window.setTimeout(changeSecond, 1000);
}

/**
 * 发送短信
 * @return {[type]} [description]
 */
function sendMessageValidate() {
    $(document).on('click', '#sendmessage', function() {
        if ($('#sendmessage').attr('disabled') === 'disabled') {
            return;
        }

        $.ajax({
            type: 'POST',
            url: '/passport/autouserinfo/sendBindMsg',
            data: {
                mobile: $('#mobile').val(),
                area: $('#areacode').val(),
                verifyCode: passwordCaptchaImg.getResults(),
            }
        }).then(function(data) {

            if (data.code !== 200) {
                alert(data.message); // eslint-disable-line
            } else {
                circleTime($('#mobile').val());
            }
        });

    });
}

/**
 * 最终提交表单
 */
function actionSubmit() {
    $.ajax({
        type: 'POST',
        url: '/passport/autouserinfo/bindMobile',
        data: {
            area: $('#areacode').val(),
            openId: thirdOpenId,
            sourceType: thirdSourceType,
            nickName: $('#nickName').val(),
            mobile: $('#mobile').val(),
            code: $('#smscode').val()
        }
    }).then(function(data) {
        if (data.code === 200) {
            if (data.data && data.data.refer) {
                window.location.href = data.data.refer;
            } else {
                window.location.href = '/passport/thirdlogin/bindsuccess';
            }
        } else {
            alert(data.message); // eslint-disable-line
        }
    });
}


function goLogin(account) {
    account ? window.jumpUrl(`/signin.html?account=${account}`) : window.jumpUrl('/signin.html');
}

/**
 * 点击下一步
 * @return {[type]} [description]
 */
function nextStep() {
    var mobile = '';
    var areaCode = '';
    var smsCode = '';

    $('#bindfirststep').on('click', function(e) {
        var regx;

        e.preventDefault();
        mobile = $('.phonenum').val();
        areaCode = $('#areanum').text();
        regx = phoneRegx['+' + areaCode];

        if (!isagree()) {
            return;
        }
        if (mobile === '' || !regx || !regx.test(mobile)) {
            $phoneTip.find('em').text('手机格式错误');
            $phoneTip.removeClass('hide');
            return;
        }

        smsCode = $('#smscode').val();

        if (!smsCode) {
            return;
        }

        $.ajax({
            type: 'post',
            url: '/passport/cert/check',
            data: {
                mobile: mobile,
                area: areaCode,
                code: smsCode,
                openId: thirdOpenId,
                sourceType: thirdSourceType
            },
            dataType: 'json',
            success: function(data) {
                var isBind;
                var isRegister;

                if (data.code === 200) {
                    isBind = data.data && data.data.isBind;
                    isRegister = data.data && data.data.isRegister;

                    if (isRegister === 'Y') {
                        if (isBind === 'N') {
                            dialog.showBind(() => goLogin(mobile), actionSubmit);
                        } else {
                            dialog.showBind2(() => goLogin(mobile), actionSubmit);
                        }
                    } else {
                        actionSubmit();
                    }
                } else {
                    if (data && data.message) {
                        new Alert(data.message).show();
                    }
                }
            }
        });
    });
}

$wrapper.on('keydown', '.phonenum', function(e) {
    if (e.keyCode === 13) {
        $nextBtn.trigger('click');
        return false;
    }
});

function init() {
    fixAreaNum(); // 去掉所有区域的+
    sendMessageValidate(); // 有交互的发送短信
    chooseProtocol(); // 选择协议
    chooseArea(); // 选择区域
    chooseAreaToogle(); // 选择区域展示或关闭
    cancelChooseArea(); // 取消选择区域
    nextStep(); // 下一步
}
init();