张泽世 / yohobuywap-node · Commits

Go to a project

Authored by Aiden Xu
Commit 876ab86393bd00459f5d00310b43ec7b2dd44921 2 parents dcab757a f9aa11cc

开通有货分期

Inline Side-by-side
Showing 14 changed files with 531 additions and 76 deletions
@@ -3,47 +3,109 @@ @@ -3,47 +3,109 @@
3 * @author: wsl<shuiling.wang@yoho.cn> 3 * @author: wsl<shuiling.wang@yoho.cn>
4 * @date: 2016/08/01 4 * @date: 2016/08/01
5 */ 5 */
  6 +'use strict';
  7 +
6 const headerModel = require('../../../doraemon/models/header'); 8 const headerModel = require('../../../doraemon/models/header');
  9 +const installmentModel = require('../models/installment');
  10 +const _ = require('lodash');
  11 +const helpers = global.yoho.helpers;
7 12
8 const index = (req, res) => { 13 const index = (req, res) => {
9 - res.render('installment/open-index', {  
10 - module: 'home',  
11 - page: 'installment',  
12 - title: '有货分期',  
13 - pageHeader: headerModel.setNav({  
14 - navTitle: '有货分期',  
15 - navBtn: false  
16 - }),  
17 - bannerTop: {  
18 - data: [  
19 - {  
20 - url: '',  
21 - src: '//img11.static.yhbimg.com/yhb-img01/2016/07/29/11/0112d076e4fa0c53635ed93b118ee3f74e.jpg?imageView2/2/w/640/h/240/q/70' // eslint-disable-line  
22 - }  
23 - ]  
24 - },  
25 - installmentOnly: {  
26 - title: '分期专享',  
27 - goods: [  
28 - { 14 + let query = req.query.query || '';
  15 + let uid = req.user.uid || 3236556;
  16 +
  17 + installmentModel.getStauts(uid).then((openStatus) => {
  18 + if (openStatus === 0) {
  19 + return {
  20 + bannerTop: {
  21 + data: [
  22 + {
  23 + url: '',
  24 + src: '//img11.static.yhbimg.com/yhb-img01/2016/07/29/11/0112d076e4fa0c53635ed93b118ee3f74e.jpg?imageView2/2/w/640/h/240/q/70' // eslint-disable-line
  25 + }
  26 + ]
  27 + },
  28 + notOpen: true,
  29 + installmentOnly: {
  30 + title: '分期专享',
  31 + goods: [
  32 + {
29 33
  34 + }
  35 + ]
30 } 36 }
31 - ]  
32 - },  
33 - pageFooter: true 37 + };
  38 + } else if (openStatus === 2) {
  39 + if (query === 'usable') {
  40 + return installmentModel.getQueryCreditInfo(uid).then((data) => {
  41 + return _.assign({
  42 + isUnable: true
  43 + }, data);
  44 + });
  45 + } else {
  46 + return installmentModel.getQueryAmtInfo(uid).then((data) => {
  47 + return _.assign({
  48 + isRepay: true
  49 + }, data);
  50 + });
  51 + }
  52 +
  53 + }
  54 + }).then((result) => {
  55 + res.render('installment/open-index', _.assign({
  56 + module: 'home',
  57 + page: 'installment',
  58 + title: '有货分期',
  59 + pageHeader: headerModel.setNav({
  60 + navTitle: '有货分期',
  61 + navBtn: false
  62 + })
  63 + }, result));
34 }); 64 });
35 }; 65 };
36 66
37 const review = (req, res) => { 67 const review = (req, res) => {
38 - res.render('installment/result', {  
39 - module: 'home',  
40 - page: 'installment',  
41 - title: '有货分期',  
42 - pageHeader: headerModel.setNav({  
43 - navTitle: '有货分期',  
44 - navBtn: false  
45 - }),  
46 - pageFooter: true 68 + let uid = req.user.uid || 20000032;
  69 + let params = {};
  70 +
  71 + installmentModel.getStauts(uid).then((status) => {
  72 + if (status === 1) {
  73 + params = {
  74 + review: {
  75 + url: helpers.urlFormat('/?go=1')
  76 + }
  77 + };
  78 + } else if (status === 2) {
  79 + params = {
  80 + success: {
  81 + price: '5000',
  82 + installmentOnly: {
  83 + title: '分期专享',
  84 + goods: [
  85 + {
  86 +
  87 + }
  88 + ]
  89 + }
  90 + }
  91 + };
  92 + } else {
  93 + params = {
  94 + error: {
  95 + url: helpers.urlFormat('/?go=1')
  96 + }
  97 + };
  98 + }
  99 +
  100 + res.render('installment/open-result', _.assign({
  101 + module: 'home',
  102 + page: 'installment',
  103 + title: '有货分期',
  104 + pageHeader: headerModel.setNav({
  105 + navTitle: '有货分期',
  106 + navBtn: false
  107 + })
  108 + }, params));
47 }); 109 });
48 }; 110 };
49 111
@@ -3,4 +3,94 @@ @@ -3,4 +3,94 @@
3 * @author: wsl<shuiling.wang@yoho.cn> 3 * @author: wsl<shuiling.wang@yoho.cn>
4 * @date: 2016/08/01 4 * @date: 2016/08/01
5 */ 5 */
  6 +'use strict';
6 7
  8 +const api = global.yoho.API;
  9 +const logger = global.yoho.logger;
  10 +
  11 +// const camelCase = global.yoho.camelCase;
  12 +
  13 +
  14 +// 获取分期开通状态
  15 +const getStauts = (uid) => {
  16 + return api.get('', {
  17 + method: 'user.instalment.getStatus',
  18 + uid: uid
  19 + }).then((result) => {
  20 + result = {
  21 + alg: 'SALT_MD5',
  22 + code: 200,
  23 + data: {
  24 + status: 2
  25 + },
  26 + md5: '6d729d4b35f10fc73531210bd7ecff91',
  27 + message: 'success'
  28 + };
  29 + if (result && result.code === 200) {
  30 + return result.data.status;
  31 + } else {
  32 + logger.error('get installment open status return is not 200');
  33 + return '';
  34 + }
  35 + });
  36 +};
  37 +
  38 +// 获取用户可用额度信息
  39 +const getQueryCreditInfo = (uid) => {
  40 + return api.get('', {
  41 + method: 'order.queryCreditInfo',
  42 + uid: uid
  43 + }).then((result) => {
  44 + result = {
  45 + alg: 'SALT_MD5',
  46 + code: 200,
  47 + data: {
  48 + initCredit: '8000.00',
  49 + currCredit: '5000.00',
  50 + status: 1
  51 + },
  52 + md5: 'c1d725306fb09dcbf504776d276521cb',
  53 + message: 'ok'
  54 + };
  55 + if (result && result.code === 200) {
  56 + return result.data;
  57 + } else {
  58 + logger.error('get user installment usable price info return is not 200');
  59 + return '';
  60 + }
  61 + });
  62 +};
  63 +
  64 +// 获取用户待还款金额
  65 +const getQueryAmtInfo = (uid) => {
  66 + return api.get('', {
  67 + method: 'order.queryAmtInfo',
  68 + uid: uid
  69 + }).then((result) => {
  70 + result = {
  71 + alg: 'SALT_MD5',
  72 + code: 200,
  73 + data: {
  74 + totalAmt: '2000.00',
  75 + monthAmt: '800.00',
  76 + _7daysAmt: '400.00',
  77 + overAmt: '400.00'
  78 + },
  79 + md5: 'c1d725306fb09dcbf504776d276521cb',
  80 + message: 'ok'
  81 + };
  82 + if (result && result.code === 200) {
  83 + result.data.dayAmt = result.data._7daysAmt;
  84 + return result.data;
  85 + } else {
  86 + logger.error('get user installment repay info return is not 200');
  87 + return '';
  88 + }
  89 + });
  90 +};
  91 +
  92 +module.exports = {
  93 + getStauts,
  94 + getQueryCreditInfo,
  95 + getQueryAmtInfo
  96 +};
@@ -13,7 +13,7 @@ const installment = require(cRoot + '/installment'); @@ -13,7 +13,7 @@ const installment = require(cRoot + '/installment');
13 const router = express.Router(); // eslint-disable-line 13 const router = express.Router(); // eslint-disable-line
14 14
15 // 分期付款 15 // 分期付款
16 -router.get('/installment', installment.index); // 开通分期首页 16 +router.get('/installment/index', installment.index);// 开通分期首页
17 router.get('/installment/review', installment.review); // 开通分期首页 17 router.get('/installment/review', installment.review); // 开通分期首页
18 router.get('/installment/starting-service', installment.startingService); // 分期付款开通 18 router.get('/installment/starting-service', installment.startingService); // 分期付款开通
19 19
1 <div class="installment-page"> 1 <div class="installment-page">
2 - {{# bannerTop}}  
3 - {{> resources/banner-top}}  
4 - {{/ bannerTop}}  
5 - <div class="open-index">  
6 - <ul class="open-info">  
7 - <li>  
8 - <span class="open-icon-1"></span>  
9 - <span>先消费<br>后还款</span>  
10 - </li>  
11 - <li>  
12 - <span class="open-icon-2"></span>  
13 - <span>30天免息<br>灵活分期</span>  
14 - </li>  
15 - <li>  
16 - <span class="open-icon-3"></span>  
17 - <span>制定商品<br>立享优惠</span>  
18 - </li>  
19 - </ul> 2 + {{#if notOpen}}
  3 + {{# bannerTop}}
  4 + {{> resources/banner-top}}
  5 + {{/ bannerTop}}
  6 + <div class="open-index">
  7 + <ul class="open-info">
  8 + <li>
  9 + <span class="open-icon-1"></span>
  10 + <span>先消费<br>后还款</span>
  11 + </li>
  12 + <li>
  13 + <span class="open-icon-2"></span>
  14 + <span>30天免息<br>灵活分期</span>
  15 + </li>
  16 + <li>
  17 + <span class="open-icon-3"></span>
  18 + <span>制定商品<br>立享优惠</span>
  19 + </li>
  20 + </ul>
20 21
21 - <div class="open-btn">立即开通</div>  
22 - </div> 22 + <div class="open-btn">立即开通</div>
  23 + </div>
23 24
24 - {{# installmentOnly}}  
25 - {{> installment/installment-only}}  
26 - {{/ installmentOnly}} 25 + {{# installmentOnly}}
  26 + {{> installment/installment-only}}
  27 + {{/ installmentOnly}}
  28 + {{else}}
  29 + <div class="detail-tab">
  30 + <a href="/home/installment/index?query=repay"><span class="{{#if isRepay}}on{{/if}}">待还款金额</span></a>
  31 + <a href="/home/installment/index?query=usable"><span class="{{#if isUnable}}on{{/if}}">可用额度</span></a>
  32 + </div>
  33 + {{#if isRepay}}
  34 + <div class="repay-area detail-bg">
  35 + <p class="detail-txt1">近7日代还款</p>
  36 + <p class="detail-txt1">¥<span class="detail-txt2">{{round dayAmt}}</span></p>
  37 + <P class="detail-txt3">您有¥{{round dayAmt}}已逾期3天，点击<a href="">查看详情</a></P>
  38 + <a href="" class="see-btn">明细</a>
  39 + </div>
  40 + <ul class="group-list">
  41 + <li><a href="">本月待还金额：<div class="iconfont"><span class="list-r-txt">¥{{monthAmt}}</span> &#xe604;</div></a></li>
  42 + <li><a href="">待还总金额：<div class="iconfont"><span class="list-r-txt">¥{{totalAmt}}</span> &#xe604;</div></a></li>
  43 + <li><a href="">还款记录：<div class="iconfont">&#xe604;</div></a></li>
  44 + <li><a href="">分期订单：<div class="iconfont">&#xe604;</div></a></li>
  45 + </ul>
  46 +
  47 + <ul class="group-list">
  48 + <li><a href="">账户管理：<span class="iconfont">&#xe604;</span></a></li>
  49 + </ul>
  50 + {{/if}}
  51 +
  52 + {{#if isUnable}}
  53 + <div class="usable-area detail-bg">
  54 + {{#replayStatus}}<div class="replay-status">{{.}}</div>{{/replayStatus}}
  55 + <p class="detail-txt1">可用额度</p>
  56 + <p class="detail-txt1">¥<span class="detail-txt2">{{round currCredit}}</span></p>
  57 + <p class="detail-txt1">总额度：¥{{round initCredit}}</p>
  58 + <a href="" class="terms">服务条款</a>
  59 + </div>
  60 + {{# installmentOnly}}
  61 + {{> installment/installment-only}}
  62 + {{/ installmentOnly}}
  63 + {{/if}}
  64 + {{/if}}
27 </div> 65 </div>
1 <div class="installment-page"> 1 <div class="installment-page">
2 {{# review}} 2 {{# review}}
3 <i class="review-icon"></i> 3 <i class="review-icon"></i>
4 - <p class="review-txt1">审核中</p>  
5 - <p>审核结果会在5分钟内短信通知您</p>  
6 - <div class="open-btn">先去逛逛</div> 4 + <p class="font-b">审核中</p>
  5 + <p class="font-p">审核结果会在5分钟内短信通知您</p>
  6 + <a href="{{url}}" class="open-btn">先去逛逛</a>
7 {{/review}} 7 {{/review}}
8 {{#success}} 8 {{#success}}
9 <div class="success"> 9 <div class="success">
10 <i class="success-icon"></i> 10 <i class="success-icon"></i>
11 - <p>可用额度</p>  
12 - <p>¥5000.00</p> 11 + <p class="font-b">可用额度</p>
  12 + <p class="installment-price">¥<span>{{round price}}</span></p>
13 <div class="open-btn">去逛逛</div> 13 <div class="open-btn">去逛逛</div>
14 </div> 14 </div>
15 {{# installmentOnly}} 15 {{# installmentOnly}}
16 - {{< installment-only}} 16 + {{> installment/installment-only}}
17 {{/ installmentOnly}} 17 {{/ installmentOnly}}
18 {{/success}} 18 {{/success}}
19 {{#error}} 19 {{#error}}
20 <div class="error"> 20 <div class="error">
21 <i class="success-icon"></i> 21 <i class="success-icon"></i>
22 - <p>审核未通过,暂时无法授信</p>  
23 - <p>在有货更多的消费，增加信用度,<br>会大大提升审核通过率噢</p>  
24 - <div class="open-btn">去逛逛</div> 22 + <p class="error-txt1">审核未通过,暂时无法授信</p>
  23 + <p class="error-txt2">在有货更多的消费，增加信用度,<br>会大大提升审核通过率噢</p>
  24 + <a href="{{url}}" class="open-btn">去逛逛</a>
25 </div> 25 </div>
26 {{/error}} 26 {{/error}}
27 </div> 27 </div>
1 <div class="installment-only"> 1 <div class="installment-only">
2 <h2>{{title}}</h2> 2 <h2>{{title}}</h2>
3 - <div id="goods-container" class="goods-container">  
4 - <div class="container clearfix">  
5 - {{# goods}}  
6 - {{> common/goods}}  
7 - {{/ goods}}  
8 - </div> 3 + <div id="goods-list" class="goods-list clearfix">
  4 + {{# goods}}
  5 + {{> common/goods}}
  6 + {{/ goods}}
9 </div> 7 </div>
10 </div> 8 </div>
@@ -18,8 +18,11 @@ module.exports = { @@ -18,8 +18,11 @@ module.exports = {
18 // api: 'http://devapi.yoho.cn:58078/', 18 // api: 'http://devapi.yoho.cn:58078/',
19 // service: 'http://devservice.yoho.cn:58077/' 19 // service: 'http://devservice.yoho.cn:58077/'
20 20
21 - api: 'http://testapi.yoho.cn:28078/',  
22 - service: 'http://testservice.yoho.cn:28077/' 21 + // api: 'http://testapi.yoho.cn:28078/',
  22 + // service: 'http://testservice.yoho.cn:28077/'
  23 +
  24 + api: 'http://api.yoho.cn/',
  25 + service: 'http://service.yoho.cn/'
23 }, 26 },
24 subDomains: { 27 subDomains: {
25 host: '.m.yohobuy.com', 28 host: '.m.yohobuy.com',
1 -var $ = require('yoho-jquery'); 1 +var $ = require('yoho-jquery'),
  2 + ellipsis = require('yoho-mlellipsis'),
  3 + tip = require('../plugin/tip'),
  4 + loading = require('../plugin/loading');
  5 +
  6 +var winH = $(window).height(),
  7 + $installmentOnly = $('.installment-only'),
  8 + searching = false,
  9 + page = 0;
2 10
3 const Timer = function() { 11 const Timer = function() {
4 this.counter = 0; 12 this.counter = 0;
5 this.countdownTimer = null; 13 this.countdownTimer = null;
6 }; 14 };
7 15
  16 +ellipsis.init();
  17 +
  18 +function search() {
  19 + if (searching) {
  20 + return;
  21 + }
  22 + searching = true;
  23 +
  24 + loading.showLoadingMask();
  25 +
  26 + $.ajax({
  27 + type: 'GET',
  28 + url: '/product/recom/maylike?gender=1,3',
  29 + data: {
  30 + page: page + 1
  31 + },
  32 + success: function(data) {
  33 +
  34 + if (data === '') {
  35 + loading.hideLoadingMask();
  36 + } else {
  37 + searching = false;
  38 + $('#goods-list').append(data);
  39 +
  40 + loading.hideLoadingMask();
  41 + page++;
  42 +
  43 + $('.good-detail-text .name').each(function() {
  44 + var $this = $(this),
  45 + $title = $this.find('a');
  46 +
  47 + $title[0].mlellipsis(2);
  48 + });
  49 + }
  50 + },
  51 + error: function() {
  52 + tip.show('网络断开连接了~');
  53 + searching = false;
  54 + loading.hideLoadingMask();
  55 + }
  56 + });
  57 +}
  58 +
  59 +function scrollHandler() {
  60 + if ($(window).scrollTop() + winH >= $(document).height() - 200) {
  61 + search();
  62 + }
  63 +}
  64 +
  65 +// srcoll to load more
  66 +$(window).scroll(function() {
  67 + if ($installmentOnly.length > 0) {
  68 + window.requestAnimationFrame(scrollHandler);
  69 + }
  70 +});
  71 +
  72 +
  73 +if ($installmentOnly.length > 0) {
  74 + $('.installment-page').css({
  75 + background: '#efefef'
  76 + });
  77 +
  78 + search();
  79 +}
  80 +
8 /** 81 /**
9 * 倒计时 82 * 倒计时
10 * 83 *
11 * @param progress 进度回调 84 * @param progress 进度回调
12 * @param complete 完成回调 85 * @param complete 完成回调
13 */ 86 */
14 -  
15 Timer.prototype.startCountdown = function(progress, complete) { 87 Timer.prototype.startCountdown = function(progress, complete) {
16 if (this.counter > 0 || this.countdownTimer) { 88 if (this.counter > 0 || this.countdownTimer) {
17 return; 89 return;
1 @import "installment"; 1 @import "installment";
2 @import "starting-service"; 2 @import "starting-service";
  3 +
1 .installment-page { 1 .installment-page {
2 - background: #efefef;  
3 2
4 .open-index { 3 .open-index {
5 background: #fff; 4 background: #fff;
@@ -53,6 +52,7 @@ @@ -53,6 +52,7 @@
53 line-height: 88px; 52 line-height: 88px;
54 border-radius: 6px; 53 border-radius: 6px;
55 margin: 0 auto; 54 margin: 0 auto;
  55 + display: block;
56 } 56 }
57 57
58 .installment-only { 58 .installment-only {
@@ -68,4 +68,195 @@ @@ -68,4 +68,195 @@
68 border-bottom: 1px solid #dedee0; 68 border-bottom: 1px solid #dedee0;
69 } 69 }
70 } 70 }
  71 +
  72 + .review-icon {
  73 + background: resolve("home/review-img-1.png") no-repeat;
  74 + background-size: contain;
  75 + width: 154px;
  76 + height:197px;
  77 + display: block;
  78 + margin: 214px auto 50px;
  79 + }
  80 +
  81 + .success-icon {
  82 + background: resolve("home/review-img-2.png") no-repeat;
  83 + background-size: contain;
  84 + width: 208px;
  85 + height:208px;
  86 + display: block;
  87 + margin: 94px auto 60px;
  88 + }
  89 +
  90 + .font-b {
  91 + font-size: 30px;
  92 + text-align: center;
  93 + color: #444;
  94 + }
  95 +
  96 + .font-p {
  97 + color: #bbb;
  98 + line-height: 100px;
  99 + text-align: center;
  100 + margin-bottom: 60px;
  101 + }
  102 +
  103 + .installment-price {
  104 + font-size: 40px;
  105 + text-align: center;
  106 + color: #444;
  107 + line-height: 100px;
  108 + margin-bottom: 60px;
  109 +
  110 + span {
  111 + font-size: 70px;
  112 + }
  113 + }
  114 +
  115 + .success {
  116 + padding-bottom: 70px;
  117 + border-bottom: 1px solid #dedee0;
  118 + margin-bottom: 30px;
  119 + background: #fff;
  120 + }
  121 +
  122 + .error {
  123 + p {
  124 + text-align: center;
  125 + }
  126 +
  127 + .error-txt1 {
  128 + font-size: 32px;
  129 + }
  130 +
  131 + .error-txt2 {
  132 + color: #bbb;
  133 + line-height: 40px;
  134 + margin: 30px 0 90px;
  135 + }
  136 + }
  137 +
  138 + .detail-tab {
  139 + background: #000;
  140 + height: 90px;
  141 + line-height: 45px;
  142 + font-size: 28px;
  143 +
  144 + span {
  145 + float: left;
  146 + color: #b1b1b1;
  147 + width: 50%;
  148 + box-sizing: border-box;
  149 + margin-top: 23px;
  150 + text-align: center;
  151 + }
  152 +
  153 + .on {
  154 + color: #fff;
  155 + }
  156 +
  157 + a:first-child span {
  158 + border-right: 1px solid #fff;
  159 + }
  160 + }
  161 +
  162 + .detail-bg {
  163 + background: resolve("me/index/header-bg.jpg") no-repeat;
  164 + height: auto;
  165 + overflow: hidden;
  166 + text-align: center;
  167 + padding: 50px 0 30px;
  168 +
  169 + .detail-txt1 {
  170 + font-size: 26px;
  171 + color: #fff;
  172 + }
  173 +
  174 + .detail-txt2 {
  175 + font-size: 60px;
  176 + }
  177 +
  178 + .detail-txt3 {
  179 + color: #ce051d;
  180 + font-size: 14px;
  181 +
  182 + a {
  183 + color: #ce051d;
  184 + text-decoration: underline;
  185 + }
  186 + }
  187 +
  188 + .see-btn {
  189 + border-radius: 30px;
  190 + width: 190px;
  191 + height: 60px;
  192 + line-height: 60px;
  193 + background: #454a4c;
  194 + color: #fff;
  195 + display: block;
  196 + margin: 30px auto 0;
  197 + font-size: 26px;
  198 + }
  199 + }
  200 +
  201 + .group-list {
  202 + background: #fff;
  203 + margin-top: 30px;
  204 + border-top: 1px solid #e1e1e1;
  205 + border-bottom: 1px solid #e1e1e1;
  206 + padding-left: 26px;
  207 +
  208 + li {
  209 + height: 88px;
  210 + line-height: 88px;
  211 + border-bottom: 1px solid #e1e1e1;
  212 + font-size: 28px;
  213 +
  214 + .iconfont {
  215 + float: right;
  216 + margin-right: 30px;
  217 + color: #e9e9e9;
  218 + }
  219 +
  220 + .list-r-txt {
  221 + color: #b1b1b1;
  222 + }
  223 + }
  224 +
  225 + li:last-child {
  226 + border-bottom: none;
  227 + }
  228 + }
  229 +
  230 + .repay-area {
  231 + height: 345px;
  232 + }
  233 +
  234 + .usable-area {
  235 + position: relative;
  236 + height: 510px;
  237 +
  238 + .detail-txt1 {
  239 + margin-top: 15px;
  240 + }
  241 +
  242 + .replay-status {
  243 + position: absolute;
  244 + right: 0;
  245 + top: 30px;
  246 + background: rgba(0, 0, 0, 0.5);
  247 + border-radius: 20px 0 0 20px;
  248 + height: 40px;
  249 + line-height: 40px;
  250 + color: #d4031a;
  251 + text-align: center;
  252 + padding: 0 30px;
  253 + }
  254 +
  255 + .terms {
  256 + display: block;
  257 + margin: 155px auto 0;
  258 + color: #fff;
  259 + text-decoration: underline;
  260 + }
  261 + }
71 } 262 }