Authored by 郝肖肖

Merge branch 'feature/installment' of git.yoho.cn:fe/yohobuywap-node into feature/installment

1 -<div class="installment-starting-service-page"> 1 +<div class="installment-starting-service-page yoho-page">
2 {{> resources/banner-top}} 2 {{> resources/banner-top}}
3 - <div class="exclamation">  
4 - 基本信息的有效性决定您能否激活有货分期,以及最终可获得的额度!  
5 - </div> 3 + <div class="exclamation">
  4 + 基本信息的有效性决定您能否激活有货分期,以及最终可获得的额度!
  5 + </div>
6 6
7 - <form id="apply-form" method="post" class="apply-form">  
8 - <div class="field">  
9 - <label for="userName">姓名:</label> 7 + <form id="apply-form" method="post" class="apply-form">
  8 + <div class="field">
  9 + <label for="userName">姓名:</label>
10 10
11 - <input id="userName" name="userName" type="text" placeholder="真实姓名" maxlength="20"/>  
12 - <div class="clearfix"></div>  
13 - </div> 11 + <input id="userName" name="userName" type="text" placeholder="真实姓名" maxlength="20"/>
  12 + <div class="clearfix"></div>
  13 + </div>
14 14
15 - <div class="field">  
16 - <label for="identityCardNo">身份证号:</label> 15 + <div class="field">
  16 + <label for="identityCardNo">身份证号:</label>
17 17
18 - <input id="identityCardNo" name="identityCardNo" type="text" placeholder="请填写身份证号" maxlength="18"/>  
19 - <div class="clearfix"></div>  
20 - </div> 18 + <input id="identityCardNo" name="identityCardNo" type="text" placeholder="请填写身份证号" maxlength="18"/>
  19 + <div class="clearfix"></div>
  20 + </div>
21 21
22 - <div class="field">  
23 - <label for="name">卡号:</label> 22 + <div class="field">
  23 + <label for="name">卡号:</label>
24 24
25 - <input id="cardNo" name="cardNo" type="text" placeholder="银行卡号" size="26" maxlength="30"/>  
26 - <div class="clearfix"></div>  
27 - </div> 25 + <input id="cardNo" name="cardNo" type="text" placeholder="银行卡号" size="26" maxlength="30"/>
  26 + <div class="clearfix"></div>
  27 + </div>
28 28
29 - <div class="field" id="bank-desc" style="display: none;">  
30 - <div>  
31 - <img src="" alt="">  
32 - <span id="bank-name">中国工商银行</span>  
33 - </div>  
34 - </div> 29 + <div class="field" id="bank-desc" style="display: none;">
  30 + <div class="bank-info">
  31 + <img id="bank-icon" src="" alt="">
  32 + <span id="bank-name">中国工商银行</span>
  33 + </div>
  34 + </div>
35 35
36 - <div class="field">  
37 - <label for="name">手机号:</label>  
38 - <input id="name" name="mobile" type="text" placeholder="银行预留手机号码" maxlength="11"/>  
39 - <div class="clearfix"></div>  
40 - </div> 36 + <div class="field">
  37 + <label for="name">手机号:</label>
  38 + <input id="name" name="mobile" type="text" placeholder="银行预留手机号码" maxlength="11"/>
  39 + <div class="clearfix"></div>
  40 + </div>
41 41
42 - <div class="field">  
43 - <label for="name">验证码:</label>  
44 - <input id="name" name="snsCheckCode" type="text" placeholder="请输入验证码" size="14" maxlength="4"/>  
45 - <button id="send-sms" class="count-down">获取验证码</button>  
46 - <div class="clearfix"></div>  
47 - </div> 42 + <div class="field">
  43 + <label for="name">验证码:</label>
  44 + <input id="name" name="snsCheckCode" type="text" placeholder="请输入验证码" size="14" maxlength="4"/>
  45 + <button id="send-sms" class="count-down">获取验证码</button>
  46 + <div class="clearfix"></div>
  47 + </div>
48 48
49 - <div class="agreements">  
50 - <input id="accept-agreements" name="agreements" type="checkbox" class="installment-check-btn" />  
51 - <label for="accept-agreements">  
52 - <span>免费开通,详情见 <a href="#">《有货分期服务协议》&《第三方支付协议》</a></span>  
53 - </label>  
54 - <div class="clearfix"></div>  
55 - </div> 49 + <div class="agreements">
  50 + <input id="accept-agreements" name="agreements" type="checkbox" class="installment-check-btn"/>
  51 + <label for="accept-agreements">
  52 + <span>免费开通,详情见 <a href="#">《有货分期服务协议》&《第三方支付协议》</a></span>
  53 + </label>
  54 + <div class="clearfix"></div>
  55 + </div>
56 56
57 - <div class="bottom-block">  
58 - <div class="data-encryption">  
59 - 数据智能加密,保障您的用卡安全  
60 - </div> 57 + <div class="bottom-block">
  58 + <div class="data-encryption">
  59 + 数据智能加密,保障您的用卡安全
  60 + </div>
61 61
62 - <button id="apply-button" class="apply-button" type="submit">下一步</button>  
63 - <div class="provider-mark">  
64 - Yoho!Buy信而富联合提供  
65 - </div>  
66 - </div>  
67 - </form> 62 + <button id="apply-button" class="apply-button" type="submit">下一步</button>
  63 + <div class="provider-mark">
  64 + Yoho!Buy信而富联合提供
  65 + </div>
  66 + </div>
  67 + </form>
68 </div> 68 </div>
@@ -18,7 +18,7 @@ @@ -18,7 +18,7 @@
18 (function(d,c){var e=d.documentElement,a="orientationchange" in window?"orientationchange":"resize",b=function(){var f=e.clientWidth;if(!f){return}if(f>=640){e.style.fontSize="40px"}else{e.style.fontSize=40*(f/640)+"px"}};if(!d.addEventListener){return}b();c.addEventListener(a,b,false);d.addEventListener("DOMContentLoaded",b,false)})(document,window); 18 (function(d,c){var e=d.documentElement,a="orientationchange" in window?"orientationchange":"resize",b=function(){var f=e.clientWidth;if(!f){return}if(f>=640){e.style.fontSize="40px"}else{e.style.fontSize=40*(f/640)+"px"}};if(!d.addEventListener){return}b();c.addEventListener(a,b,false);d.addEventListener("DOMContentLoaded",b,false)})(document,window);
19 </script> 19 </script>
20 {{#if devEnv}} 20 {{#if devEnv}}
21 - <link rel="stylesheet" href="//localhost:5001/css/index.css"> 21 + <link rel="stylesheet" href="//172.16.11.32:5001/css/index.css">
22 {{^}} 22 {{^}}
23 <link rel="stylesheet" href="//cdn.yoho.cn/m-yohobuy-node/{{version}}/index.css"> 23 <link rel="stylesheet" href="//cdn.yoho.cn/m-yohobuy-node/{{version}}/index.css">
24 {{/if}} 24 {{/if}}
@@ -41,8 +41,8 @@ @@ -41,8 +41,8 @@
41 <script type="text/javascript" src="//res.wx.qq.com/open/js/jweixin-1.1.0.js"></script> 41 <script type="text/javascript" src="//res.wx.qq.com/open/js/jweixin-1.1.0.js"></script>
42 {{/wechatShare}} 42 {{/wechatShare}}
43 {{#if devEnv}} 43 {{#if devEnv}}
44 - <script src="//localhost:5001/libs.js"></script>  
45 - <script src="//localhost:5001/{{module}}.{{page}}.js"></script> 44 + <script src="//172.16.11.32:5001/libs.js"></script>
  45 + <script src="//172.16.11.32:5001/{{module}}.{{page}}.js"></script>
46 {{^}} 46 {{^}}
47 <script src="//cdn.yoho.cn/m-yohobuy-node/{{version}}/libs.js"></script> 47 <script src="//cdn.yoho.cn/m-yohobuy-node/{{version}}/libs.js"></script>
48 <script src="//cdn.yoho.cn/m-yohobuy-node/{{version}}/{{module}}.{{page}}.js"></script> 48 <script src="//cdn.yoho.cn/m-yohobuy-node/{{version}}/{{module}}.{{page}}.js"></script>
@@ -47,10 +47,10 @@ $('.header-tab a').click(function() { @@ -47,10 +47,10 @@ $('.header-tab a').click(function() {
47 return false; 47 return false;
48 }); 48 });
49 49
50 -// const  
51 // 默认加载第一页 50 // 默认加载第一页
52 loadOrderList(search.pageIndex, 1); 51 loadOrderList(search.pageIndex, 1);
53 52
  53 +// TODO: 滚屏分页
54 $(window).scroll(()=> { 54 $(window).scroll(()=> {
55 // var scrollTop = $(window).scrollTop(); 55 // var scrollTop = $(window).scrollTop();
56 56
1 const $ = require('yoho-jquery'); 1 const $ = require('yoho-jquery');
  2 +const tip = require('../plugin/tip');
2 3
3 const Timer = function() { 4 const Timer = function() {
4 this.counter = 0; 5 this.counter = 0;
@@ -98,9 +99,14 @@ $('#cardNo').keyup(function() { @@ -98,9 +99,14 @@ $('#cardNo').keyup(function() {
98 }).change(function() { 99 }).change(function() {
99 const cardNo = $(this).val().replace(/\s/, ''); 100 const cardNo = $(this).val().replace(/\s/, '');
100 101
  102 + // 获取银行信息
101 $.get('/home/installment/bank-info', {cardNo: cardNo}).then((result)=> { 103 $.get('/home/installment/bank-info', {cardNo: cardNo}).then((result)=> {
102 if (result.code === 200) { 104 if (result.code === 200) {
  105 + // 设置银行名称
103 $('#bank-name').text(result.data.bankName); 106 $('#bank-name').text(result.data.bankName);
  107 +
  108 + // 设置银行图标
  109 + $('#bank-icon').attr('src', '/img/home/bank-icons/' + result.data.bankCode + '.png');
104 $('#bank-desc').show(); 110 $('#bank-desc').show();
105 } 111 }
106 }); 112 });
@@ -148,8 +154,13 @@ setInterval(()=> { @@ -148,8 +154,13 @@ setInterval(()=> {
148 */ 154 */
149 $('#apply-form').submit(function() { 155 $('#apply-form').submit(function() {
150 $.post('/home/installment/activate-service', formModel).then((result)=> { 156 $.post('/home/installment/activate-service', formModel).then((result)=> {
  157 + const params = { action: 'go.instalmentRepayment' };
  158 +
151 if (result.code === 200) { 159 if (result.code === 200) {
152 - location.href = ''; 160 + location.href = `/home/installment/review?openby:yohobuy=${encodeURIComponent(JSON.stringify(params))}`;
  161 + } else {
  162 + tip.show(result.message);
  163 +
153 } 164 }
154 }); 165 });
155 return false; 166 return false;
@@ -27,12 +27,10 @@ const Repayment = function(options) { @@ -27,12 +27,10 @@ const Repayment = function(options) {
27 27
28 const params = { 28 const params = {
29 action: 'go.instalmentRepayment', 29 action: 'go.instalmentRepayment',
30 - params: {  
31 - amount: self.total  
32 - } 30 + list: self.getSelection()
33 }; 31 };
34 32
35 - $(this).attr('href', path + '?openby:yohobuy=' + JSON.stringify(params)); 33 + $(this).attr('href', path + '?openby:yohobuy=' + encodeURIComponent(JSON.stringify(params)));
36 }); 34 });
37 35
38 $('#repayment-total').click(()=> { 36 $('#repayment-total').click(()=> {
@@ -47,12 +47,29 @@ @@ -47,12 +47,29 @@
47 } 47 }
48 } 48 }
49 49
  50 + .bank-info {
  51 + padding-left: 100px;
  52 +
  53 + img {
  54 + width: 32px;
  55 + height: 32px;
  56 + display: inline-block;
  57 + }
  58 +
  59 + span {
  60 + line-height: 32px;
  61 + position: absolute;
  62 + margin-left: 10px;
  63 + margin-top: 1px;
  64 + }
  65 + }
  66 +
50 .count-down { 67 .count-down {
51 border: 1px solid #84c990; 68 border: 1px solid #84c990;
52 border-radius: 4px; 69 border-radius: 4px;
53 background: transparent; 70 background: transparent;
54 color: #84c990; 71 color: #84c990;
55 - width: 160px; 72 + width: 180px;
56 height: 55px; 73 height: 55px;
57 float: right; 74 float: right;
58 } 75 }
@@ -75,6 +92,8 @@ @@ -75,6 +92,8 @@
75 color: #444; 92 color: #444;
76 float: left; 93 float: left;
77 margin-top: 2px; 94 margin-top: 2px;
  95 + border: none;
  96 + background: transparent;
78 } 97 }
79 98
80 .provider-mark { 99 .provider-mark {
@@ -88,12 +107,10 @@ @@ -88,12 +107,10 @@
88 .bottom-block { 107 .bottom-block {
89 width: 100%; 108 width: 100%;
90 text-align: center; 109 text-align: center;
91 - position: fixed;  
92 - bottom: 0; 110 + margin-top: 30px;
93 } 111 }
94 } 112 }
95 113
96 -  
97 .installment-check-btn { 114 .installment-check-btn {
98 display: none; 115 display: none;
99 116
@@ -117,4 +134,4 @@ @@ -117,4 +134,4 @@
117 background-size: cover; 134 background-size: cover;
118 } 135 }
119 } 136 }
120 -}  
  137 +}