fe / yohobuywap-node · Commits

Go to a project

Authored by 陈峰
Commit 15f007043ab703a04d2bf2e62c9828b5df55a89b 2 parents 0a4beeb6 f2031470

Merge branch 'hotfix/login' into 'gray' 

Hotfix/login



See merge request !366
Inline Side-by-side
Showing 5 changed files with 229 additions and 5 deletions
@@ -44,16 +44,40 @@ const _step1 = (req, res, next) => { @@ -44,16 +44,40 @@ const _step1 = (req, res, next) => {
44 } 44 }
45 45
46 let template = 'sms/login'; 46 let template = 'sms/login';
  47 +
  48 + // 登陆切换到短信登陆
  49 + // let viewData = {
  50 + // width750: true,
  51 + // module: 'passport',
  52 + // page: 'sms-login',
  53 + // title: '手机短信登录',
  54 + // isPassportPage: true,
  55 + // headerText: '手机号码快捷登录',
  56 + // captchaUrl: helpers.urlFormat('/passport/sms_login/captcha.png', {t: Date.now()}),
  57 + // areaCode: '+86', // 默认的区号
  58 + // countrys: RegService.getAreaData() // 地区信息列表
  59 + // };
47 let viewData = { 60 let viewData = {
48 width750: true, 61 width750: true,
49 module: 'passport', 62 module: 'passport',
50 page: 'sms-login', 63 page: 'sms-login',
  64 + backUrl: 'javascript:history.go(-1)', // eslint-disable-line
  65 + showHeaderImg: true, // 控制显示头部图片
51 title: '手机短信登录', 66 title: '手机短信登录',
52 isPassportPage: true, 67 isPassportPage: true,
53 - headerText: '手机号码快捷登录',  
54 captchaUrl: helpers.urlFormat('/passport/sms_login/captcha.png', {t: Date.now()}), 68 captchaUrl: helpers.urlFormat('/passport/sms_login/captcha.png', {t: Date.now()}),
  69 + smsLoginUrl: '/passport/sms_login',
  70 + registerUrl: '/passport/reg/index', // 注册的URL链接
  71 + aliLoginUrl: '/passport/login/alipay', // 支付宝快捷登录的URL链接
  72 + weiboLoginUrl: '/passport/login/sina', // 微博登录的URL链接
  73 + qqLoginUrl: '/passport/login/qq', // 腾讯QQ登录的URL链接
  74 + wechatLoginUrl: '/passport/login/wechat', // 微信登录的URL链接
  75 + internationalUrl: '/passport/international', // 国际号登录的URL链接
  76 + phoneRetriveUrl: '/passport/back/mobile', // 通过手机号找回密码的URL链接
  77 + emailRetriveUrl: '/passport/back/email', // 通过邮箱找回密码的URL链接
55 areaCode: '+86', // 默认的区号 78 areaCode: '+86', // 默认的区号
56 - countrys: RegService.getAreaData() // 地区信息列表 79 + countrys: RegService.getAreaData(), // 地区信息列表
  80 + reg: true
57 }; 81 };
58 82
59 res.render(template, viewData); 83 res.render(template, viewData);
@@ -22,7 +22,8 @@ const agreement = require(cRoot + '/app-agreement'); @@ -22,7 +22,8 @@ const agreement = require(cRoot + '/app-agreement');
22 const router = express.Router(); // eslint-disable-line 22 const router = express.Router(); // eslint-disable-line
23 23
24 // 兼容老的路由 24 // 兼容老的路由
25 -router.get('/signin.html', login.common.beforeLogin, login.local.loginPage); 25 +// router.get('/signin.html', login.common.beforeLogin, login.local.loginPage);
  26 +router.get('/signin.html', smsLogin.loginPage);
26 router.get('/reg.html', disableBFCahce, reg.index); 27 router.get('/reg.html', disableBFCahce, reg.index);
27 router.get('/login.html', login.common.beforeLogin, login.local.international); 28 router.get('/login.html', login.common.beforeLogin, login.local.international);
28 router.get('/phoneback.html', back.indexMobilePage); 29 router.get('/phoneback.html', back.indexMobilePage);
@@ -32,7 +33,8 @@ router.get('/emailback.html', back.indexEmailPage); @@ -32,7 +33,8 @@ router.get('/emailback.html', back.indexEmailPage);
32 router.get('/passport/signout/index', login.local.logout); 33 router.get('/passport/signout/index', login.local.logout);
33 34
34 // 登录页面 35 // 登录页面
35 -router.get('/passport/login', login.common.beforeLogin, login.local.loginPage); 36 +// router.get('/passport/login', login.common.beforeLogin, login.local.loginPage);
  37 +router.get('/passport/login', smsLogin.loginPage);
36 router.get('/passport/international', login.common.beforeLogin, login.local.international); 38 router.get('/passport/international', login.common.beforeLogin, login.local.international);
37 39
38 // 本地登录 40 // 本地登录
@@ -13,5 +13,35 @@ @@ -13,5 +13,35 @@
13 </div> 13 </div>
14 {{!--图片验证 end--}} 14 {{!--图片验证 end--}}
15 <button id="btn-next" class="btn btn-next disable row" disabled>获取短信验证码</button> 15 <button id="btn-next" class="btn btn-next disable row" disabled>获取短信验证码</button>
  16 + <p class="op-container">
  17 + <a class="op-item internat" href={{internationalUrl}}>海外手机</a>
  18 + {{!--<a class="op-item sms-login" href={{smsLoginUrl}}>快速登录</a>--}}
  19 + <span id="forget-pwd" class="op-item forget-pwd">忘记密码</span>
  20 + </p>
  21 + <div class="third-party-login">
  22 + <div class="tp-link">
  23 + <a class="qq" href={{qqLoginUrl}}></a>
  24 + <a class="wechat" href={{wechatLoginUrl}}></a>
  25 + <a class="weibo" href={{weiboLoginUrl}}></a>
  26 + <a class="alipay" href={{aliLoginUrl}}></a>
  27 + </div>
  28 + </div>
  29 + <div class="login-tip">
  30 + <div class="info-icon"></div>
  31 + Yoho!Family账号可登录Yoho!Buy有货
  32 + </div>
  33 +
  34 + <div id="retrive-pwd-mask" class="mask"></div>
  35 + <ul id="retrive-pwd-ways" class="retrive-pwd-ways">
  36 + <li>
  37 + <a href={{phoneRetriveUrl}}>通过手机找回密码</a>
  38 + </li>
  39 + <li>
  40 + <a href={{emailRetriveUrl}}>通过邮箱找回密码</a>
  41 + </li>
  42 + <li id="cancel-retrive">
  43 + 取消
  44 + </li>
  45 + </ul>
16 </div> 46 </div>
17 </div> 47 </div>
@@ -8,7 +8,9 @@ var $countrySelect, @@ -8,7 +8,9 @@ var $countrySelect,
8 $resetBtn, 8 $resetBtn,
9 $captcha, 9 $captcha,
10 $captchaPNG, 10 $captchaPNG,
11 - $phoneNum; 11 + $phoneNum,
  12 + $mask = $('#retrive-pwd-mask'),
  13 + $ways = $('#retrive-pwd-ways');
12 14
13 var page; 15 var page;
14 16
@@ -31,7 +33,31 @@ let imgCheck = new ImgCheck('#js-img-check', { @@ -31,7 +33,31 @@ let imgCheck = new ImgCheck('#js-img-check', {
31 imgCheck.init(); 33 imgCheck.init();
32 34
33 35
  36 +// 显示找回密码面板
  37 +function showRetrivePanel() {
  38 + $mask.show();
  39 + $ways.show();
  40 +}
34 41
  42 +// 隐藏找回密码面板
  43 +function hideRetrivePanel() {
  44 + $mask.hide();
  45 + $ways.hide();
  46 +}
  47 +
  48 +
  49 +$('#forget-pwd').on('touchstart', function() {
  50 + showRetrivePanel();
  51 +});
  52 +
  53 +$mask.on('touchstart', function() {
  54 + hideRetrivePanel();
  55 +});
  56 +
  57 +$('#cancel-retrive').on('touchstart', function(e) {
  58 + e.preventDefault();
  59 + hideRetrivePanel();
  60 +});
35 page = { 61 page = {
36 init: function() { 62 init: function() {
37 this.domInit(); 63 this.domInit();
@@ -44,3 +44,145 @@ @@ -44,3 +44,145 @@
44 color: #858585; 44 color: #858585;
45 } 45 }
46 } 46 }
  47 +
  48 +.op-container {
  49 + position: relative;
  50 + width: 100%;
  51 + margin: 20PX 0;
  52 + text-align: center;
  53 + font-size: 16PX;
  54 + display: flex;
  55 +
  56 + .op-item {
  57 + flex: 1;
  58 + color: #fff;
  59 + }
  60 +
  61 + .internat {
  62 + text-align: left;
  63 + }
  64 +
  65 + .forget-pwd {
  66 + text-align: right;
  67 + }
  68 +}
  69 +
  70 +.third-party-login {
  71 + text-align: left;
  72 +
  73 + > span {
  74 + font-size: 16PX;
  75 + color: #858585;
  76 + }
  77 +
  78 + .tp-link {
  79 + text-align: center;
  80 + padding: 20PX 0;
  81 +
  82 + > a {
  83 + display: inline-block;
  84 + width: 44PX;
  85 + height: 44PX;
  86 + margin: 0 7PX;
  87 + border-radius: 50%;
  88 + background-color: #333;
  89 + background-repeat: no-repeat;
  90 + background-size: 100% 100%;
  91 + }
  92 +
  93 + .alipay {
  94 + background-image: resolve("passport/alipay.png");
  95 + }
  96 +
  97 + .weibo {
  98 + background-image: resolve("passport/weibo.png");
  99 + }
  100 +
  101 + .qq {
  102 + background-image: resolve("passport/qq.png");
  103 + }
  104 +
  105 + .wechat {
  106 + display: none;
  107 + background-image: resolve("passport/wechat.png");
  108 + }
  109 + }
  110 +}
  111 +
  112 +.international {
  113 + display: block;
  114 + width: 200PX;
  115 + padding: 5PX 10PX;
  116 + background-color: #333;
  117 + border: none;
  118 + border-radius: 20PX;
  119 + margin: 0 auto 28px;
  120 + font-size: 16PX;
  121 + color: #d8d8d8;
  122 +}
  123 +
  124 +.go-register {
  125 + color: #858585;
  126 +
  127 + a {
  128 + color: inherit;
  129 + }
  130 +}
  131 +
  132 +.login-tip {
  133 + font-size: 14PX;
  134 + position: relative;
  135 + color: #d8d8d8;
  136 + margin: 15PX 0;
  137 +
  138 + .info-icon {
  139 + display: inline-block;
  140 + height: 12PX;
  141 + width: 12PX;
  142 + background-image: resolve("passport/info.png");
  143 + background-size: 100% 100%;
  144 + }
  145 +}
  146 +
  147 +.mask {
  148 + position: fixed;
  149 + display: none;
  150 + top: 0;
  151 + bottom: 0;
  152 + right: 0;
  153 + left: 0;
  154 + background-color: rgba(0, 0, 0, 0.5);
  155 +}
  156 +
  157 +.retrive-pwd-ways {
  158 + position: fixed;
  159 + display: none;
  160 + bottom: 5PX;
  161 + left: 10PX;
  162 + right: 10PX;
  163 + font-size: 16PX;
  164 +
  165 + li {
  166 + background-color: #fff;
  167 + width: 100%;
  168 + height: 40PX;
  169 + line-height: 40PX;
  170 + text-align: center;
  171 +
  172 + &:nth-child(1) {
  173 + border-top-left-radius: 5PX;
  174 + border-top-right-radius: 5PX;
  175 + border-bottom: 1PX solid #9f9f9f;
  176 + }
  177 +
  178 + &:nth-child(2) {
  179 + border-bottom-left-radius: 5PX;
  180 + border-bottom-right-radius: 5PX;
  181 + }
  182 +
  183 + &:last-child {
  184 + margin-top: 10PX;
  185 + border-radius: 5PX;
  186 + }
  187 + }
  188 +}