import $ from 'yoho-jquery'; import tip from 'js/plugin/tip'; import Page from 'js/yoho-page'; import api from '../api'; import dialog from 'js/plugin/dialog'; import bindDialogHbs from 'hbs/passport/bind-dialog-tip.hbs'; import Validate from 'js/plugin/validata'; const validate = new Validate('#js-img-check', { useREM: { rootFontSize: 40, picWidth: 150 } }); const showErrTip = tip.show; class ThirdBindMobile extends Page { constructor() { super(); this.selector = { itime: 0, openId: $.trim($.queryString().openId), sourceType: $.trim($.queryString().sourceType), countrySelect: $('.mobile-form-login select.country-select'), mobileInput: $('.mobile-form-login input.mobile-input'), clearMobile: $('.mobile-form-login .clear'), verifyCodeInput: $('.mobile-form-login input.verify-code-input'), verifyCodeBtn: $('.mobile-form-login .get-verify-code'), loginBtn: $('.mobile-form-login .sms-login-btn'), $captcha: $('#js-img-check') }; this.init(); } init() { if (this.selector.$captcha.data('userverify')) { validate.init(); } this.bindEvents(); } bindEvents() { this.selector.countrySelect.on('change', this.changeBtnStatus.bind(this)); this.selector.mobileInput.on('input', this.changeBtnStatus.bind(this)); this.selector.clearMobile.on('click', this.clearMobile.bind(this)); this.selector.verifyCodeInput.on('input', this.changeBtnStatus.bind(this, true)); this.selector.verifyCodeBtn.on('click', this.getVerifyCode.bind(this)); this.selector.loginBtn.on('click', this.login.bind(this)); } /** * 清除输入的手机号 */ clearMobile() { this.selector.mobileInput.val(''); this.selector.verifyCodeInput.val(''); this.selector.clearMobile.addClass('hide'); this.selector.countrySelect.trigger('change'); } /** * 输入监听,改变按钮状态 */ changeBtnStatus(isVerifycode) { let areaCode = $.trim(this.selector.countrySelect.val()); let phoneNum = $.trim(this.selector.mobileInput.val()); let verifyCode = $.trim(this.selector.verifyCodeInput.val()); if (!api.phoneRegx[areaCode]) { return showErrTip('出错了,请重新刷新页面'); } if (phoneNum) { this.selector.clearMobile.removeClass('hide'); } // 验证码输入框单独处理 if (isVerifycode === true) { // 提交表单按钮激活 if (verifyCode && api.phoneRegx[areaCode].test(phoneNum)) { this.selector.loginBtn.addClass('active'); } else { this.selector.loginBtn.removeClass('active'); } return; } clearInterval(this.selector.itime); this.selector.verifyCodeBtn.text('获取验证码'); if (api.phoneRegx[areaCode].test(phoneNum)) { this.selector.verifyCodeBtn.addClass('active'); if (verifyCode) { this.selector.loginBtn.addClass('active'); } } else { this.selector.verifyCodeBtn.removeClass('active'); this.selector.loginBtn.removeClass('active'); } } /** * 获取验证码倒计时 */ countDown(during) { let count = parseInt(during, 10) || 59; if (!this.selector.verifyCodeBtn.hasClass('active')) { return; } this.selector.verifyCodeBtn.removeClass('active'); this.selector.itime = setInterval(() => { window.setCookie('intTimer', count, {path: '/' }); if (count <= 0) { this.selector.verifyCodeBtn.text('重新获取').addClass('active'); clearInterval(this.selector.itime); } else { this.selector.verifyCodeBtn.text('重新获取 (' + count-- + '秒)'); } }, 1000); } /** * 获取验证码 */ getVerifyCode() { let pn = $.trim(this.selector.mobileInput.val()); let area = $.trim(this.selector.countrySelect.val()); if (!this.selector.verifyCodeBtn.hasClass('active') || this.selector.verifyCodeBtn.data('oneClick')) { return; } if (!api.phoneRegx[area]) { return showErrTip('出错了,请重新刷新页面'); } else if (!api.phoneRegx[area].test(pn)) { return showErrTip('手机号格式不正确,请重新输入'); } this.selector.verifyCodeBtn.data('oneClick', true); validate.getResults().then(result => { let params = { area: area.replace('+', ''), mobile: pn }; $.extend(params, result); this.ajax({ url: '/passport/bind/thirdSendMsg', type: 'POST', data: params }).then(codeResult => { this.selector.verifyCodeBtn.data('oneClick', false); validate.type === 2 && validate.refresh(); if (codeResult.code === 200) { this.countDown(); return; } else { showErrTip(codeResult.message); } (codeResult.changeCaptcha && validate.type !== 2) && validate.refresh(); }).catch(() => { this.selector.verifyCodeBtn.data('oneClick', false); showErrTip('出错了,请重试'); validate.refresh(); }); }).catch(() => { this.selector.verifyCodeBtn.data('oneClick', false); }); } login() { let pn = $.trim(this.selector.mobileInput.val()); let area = $.trim(this.selector.countrySelect.val()); let verifyCode = $.trim(this.selector.verifyCodeInput.val()); if (!this.selector.loginBtn.hasClass('active')) { return; } if (!api.phoneRegx[area]) { return showErrTip('出错了,请重新刷新页面'); } else if (!api.phoneRegx[area].test(pn)) { return showErrTip('手机号格式不正确,请重新输入'); } let params = { area: area.replace('+', ''), mobile: pn, code: verifyCode, open_id: this.selector.openId, source_type: this.selector.sourceType, }; this.ajax({ url: '/passport/bind/thirdMobileCheck', type: 'POST', data: params }).then(codeResult => { if (codeResult.code === 200) { this.continueBind( $.extend({isBind: 'N', isRegister: 'N'}, codeResult.data), params ); } else { showErrTip(codeResult.message); } }).catch(() => { showErrTip('出错了,请重试'); }); } continueBind(codeResult, params) { let that = this; let goUrl = '/passport/bind/success'; let bindParams = { isBind: codeResult.isBind === 'Y', isRegister: codeResult.isRegister === 'Y' }; // 如果没有绑定没有注册,直接注册 if (!(bindParams.isBind || bindParams.isRegister)) { document.location.href = goUrl; return; } dialog.showDialog({ dialogText: bindDialogHbs(bindParams), fast: true, hasFooter: { leftBtnText: '去登录', rightBtnText: '继续' } }, function() { return that.ajax({ url: '/passport/bind/thirdContinueMobile', type: 'POST', data: params }).then(cresult => { if (cresult.code === 200) { document.location.href = goUrl; return; } else { showErrTip(cresult.message); } }).catch(() => { showErrTip('出错了,请重试'); }); }, function() { document.location.href = '//m.yohobuy.com/signin.html?area=' + params.area + '&mobile=' + params.mobile; }); $('.dialog-wrapper').addClass('s-dialog-bind'); } } module.exports = ThirdBindMobile;