Authored by 郭成尧

event-ok

const _ = require('lodash');
// const passport = require('passport');
// const uuid = require('uuid');
// const co = Promise.coroutine;
// const cookie = global.yoho.cookie;
// const helpers = global.yoho.helpers;
// const log = global.yoho.logger;
// const config = global.yoho.config;
// const cache = global.yoho.cache;
// const utils = require(global.utils);
// const RegService = require('../models/reg-service');
// const AuthHelper = require('../models/auth-helper');
// const resources = {
// yohobuy: '',
// yohomars: '',
// yohocoffee: ''
// };
const RegService = require('../models/reg-service');
class Login {
/**
... ... @@ -69,6 +52,7 @@ class Login {
page: 'international-new',
width750: true,
captchaShow: req.yoho.captchaShow,
countrys: RegService.getAreaData()
});
}
}
... ...
... ... @@ -179,7 +179,12 @@ router.get('/passport/login-new',
login.common.clearCookie,
login.loginShowCaptchaByIp,
loginNew.loginPage); // 普通登录
router.get('/passport/international-new', loginNew.international); // 国际账号登录
router.get('/passport/international-new',
validateCode.load,
login.common.beforeLogin,
login.common.clearCookie,
login.loginShowCaptchaByIp,
loginNew.international); // 国际账号登录
router.get('/passport/reg-new', validateCode.load, regNew.regPage); // 注册页面
router.post('/passport/register-new',
reg.sendCodeBusyBoy,
... ...
... ... @@ -6,11 +6,17 @@
</div>
<div class="international-form">
<div class="form-group mobile">
<label for="mobile" class="iconfont">&#xe727;</label><button class="country-code">+86<i class="iconfont">&#xe613;</i></button><i class="line">|</i><input type="text" name="mobile" placeholder="请输入手机号/邮箱" class="mobile-input"><i class="iconfont clear">&#xe72a;</i>
<label for="mobile" class="iconfont">&#xe727;</label>
<select name="" id="countryCodeSelector" class="country-select">
{{# countrys}}
<option value={{areaCode}} {{#if selected}}selected{{/if}}>{{name}}</option>
{{/ countrys}}
</select>
<i class="line">|</i><input type="text" name="mobile" placeholder="请输入手机号/邮箱" class="mobile-input"><i id="clearMobile" class="iconfont clear">&#xe72a;</i>
</div>
<div class="form-group password">
<label for="password" class="iconfont">&#xe723;</label><input type="password" name="password" placeholder="请输入密码"><i class="iconfont eye-open">&#xe714;</i>
<label for="password" class="iconfont">&#xe723;</label><input type="password" name="password" placeholder="请输入密码"><span id="passwordEyeIcon" class="eye"><i class="iconfont eye-close">&#xe716;</i><i class="iconfont eye-open hide">&#xe714;</i></span>
</div>
<button class="international-login-btn">登录</button>
<button id="internationalLoginBtn" class="international-login-btn">登录</button>
</div>
</div>
\ No newline at end of file
... ...
require('passport/international-new.page.css');
const InternationalNew = require('./login/international-new.js');
new InternationalNew();
... ...
import Page from 'yoho-page';
class InternationalNew extends Page {
constructor() {
super();
this.selector = {
clearMobile: $('#clearMobile'),
mobileInput: $('input[name=mobile]'),
passwordInput: $('input[name=password]'),
passwordEyeIcon: $('#passwordEyeIcon'),
eyeClose: $('.eye-close'),
eyeOpen: $('.eye-open'),
internationalLoginBtn: $('#internationalLoginBtn')
};
this.init();
}
init() {
this.bindEvents();
}
bindEvents() {
this.selector.clearMobile.on('click', this.clearMobile.bind(this));
this.selector.passwordEyeIcon.on('click', this.passwordShowStatus.bind(this));
this.selector.internationalLoginBtn.on('click', this.internationalLogin.bind(this));
this.selector.mobileInput.bind('input', this.changeLoginBtnStatus.bind(this));
this.selector.passwordInput.bind('input', this.changeLoginBtnStatus.bind(this));
}
/**
* 改变登录按钮的状态
*/
changeLoginBtnStatus() {
// 登录按钮
if (this.selector.mobileInput.val() && this.selector.passwordInput.val()) {
this.selector.internationalLoginBtn.addClass('active');
} else {
this.selector.internationalLoginBtn.removeClass('active');
}
}
/**
* 国际账号登录
*/
internationalLogin() {
}
/**
* 隐藏显示密码
*/
passwordShowStatus() {
if (this.selector.eyeOpen.hasClass('hide')) {
this.selector.passwordInput.attr('type', 'text');
this.selector.eyeClose.addClass('hide');
this.selector.eyeOpen.removeClass('hide');
} else {
this.selector.passwordInput.attr('type', 'password');
this.selector.eyeOpen.addClass('hide');
this.selector.eyeClose.removeClass('hide');
}
}
/**
* 清除输入的手机号
*/
clearMobile() {
this.selector.mobileInput.val('');
}
}
module.exports = InternationalNew;
... ...
... ... @@ -4,6 +4,7 @@
}
$top-bar-font-color: #444;
$disable-gray: $b0b0b0;
.international-new-page {
@extend padding-75;
... ... @@ -12,6 +13,10 @@ $top-bar-font-color: #444;
color: #444;
}
.active {
background-color: #444 !important;
}
.top-operation-bar {
width: 600px;
height: 50px;
... ... @@ -78,9 +83,15 @@ $top-bar-font-color: #444;
}
}
&.mobile > .clear {
color: #e0e0e0;
margin-right: 8px;
&.mobile {
> .clear {
color: #e0e0e0;
margin-right: 8px;
}
> .country-select {
width: 100px;
}
}
&.password > .eye {
... ... @@ -108,7 +119,7 @@ $top-bar-font-color: #444;
width: 600px;
height: 70px;
border-radius: 4px;
background-color: #444;
background-color: $disable-gray;
margin-top: 100px;
font-size: 32px;
color: #fff;
... ...
... ... @@ -4,6 +4,7 @@
}
$top-bar-font-color: #444;
$disable-gray: $b0b0b0;
.sms-login-new-page {
@extend padding-75;
... ... @@ -112,7 +113,7 @@ $top-bar-font-color: #444;
height: 50px;
line-height: 50px;
border-radius: 25px;
background-color: #e0e0e0;
background-color: $disable-gray;
color: #fff;
font-size: 22px;
float: right;
... ... @@ -124,7 +125,7 @@ $top-bar-font-color: #444;
width: 600px;
height: 70px;
border-radius: 4px;
background-color: #e0e0e0;
background-color: $disable-gray;
margin-top: 100px;
font-size: 32px;
color: #fff;
... ...