Authored by Aiden Xu

分期订单

... ... @@ -304,7 +304,23 @@ const orderDetail = (req, res) => {
page: 'installment.order-detail',
navTitle: '分期详情',
order: result.data,
navBtn: false
navBtn: false,
helpers: {
isPaymentComplete: function(status, options) {
if (status === 2) { // 已结清
return options.fn(this);
}
return options.inverse(this);
},
isPaymentIncomplete: function(status, options) {
if (status !== 2) { // 其他状态
return options.fn(this);
}
return options.inverse(this);
}
}
});
});
};
... ...
<div class="installment-order-page">
{{#order}}
<div class="order-info">
<div class="order-detail">
{{#orderGoods}}
<div class="image-box">
<img src="{{image goodsImage 90 120}}" alt="{{productName}}">
</div>
<div class="info-box">
<h3>{{productName}}</h3>
<h4>订单编号: {{../orderCode}}</h4>
<div class="date-box">{{../createTime}}</div>
</div>
{{/orderGoods}}
</div>
<div class="order-detail">
{{#orderGoods}}
<div class="image-box">
<img src="{{image goodsImage 90 120}}" alt="{{productName}}">
</div>
<div class="info-box">
<h3>{{productName}}</h3>
<h4>订单编号: {{../orderCode}}</h4>
<div class="date-box">{{../createTime}}</div>
</div>
{{/orderGoods}}
</div>
<div class="installment-summary">
<div class="installment-summary">
<div class="installment-box">
<div>分期应还</div>
<div>{{avgPrincipalAmt}}</div>
</div>
<div class="installment-box">
<div>分期应还</div>
<div>{{avgPrincipalAmt}}</div>
</div>
<div class="installment-box">
<div>分期服务费</div>
<div>{{avgFeeAmt}}</div>
</div>
<div class="installment-box">
<div>分期服务费</div>
<div>{{avgFeeAmt}}</div>
</div>
<div class="installment-box">
<div>总计应还</div>
<div>{{amount}}</div>
<div class="installment-box">
<div>总计应还</div>
<div>{{amount}}</div>
</div>
</div>
</div>
<ul class="installment-list">
<ul class="installment-list repay-list">
{{#each packageList}}
<li>
<span class="detail-index">{{sortId}}.</span>
<div class="detail-box">
{{#isPaymentIncomplete status}}
<input id="sort-{{@index}}" type="checkbox" class="installment-check-btn"/>
{{/isPaymentIncomplete}}
<label for="sort-{{@index}}">
{{#isPaymentComplete status}}
<span class="detail-index">{{sortId}}.</span>
{{/isPaymentComplete}}
<span class="amount">{{currAmt}}</span>
<div class="fee">
{{currDate}}
... ... @@ -51,12 +57,12 @@
逾期服务费:{{currDealyFeeAmt}}
{{/if}}
</div>
</div>
<div class="status">
{{desc}}
<span class="iconfont notice">&#xe639;</span>
</div>
<div class="clearfix"></div>
<div class="status">
{{desc}}
<span class="iconfont notice">&#xe639;</span>
</div>
<div class="clearfix"></div>
</label>
</li>
{{/each}}
</ul>
... ...
... ... @@ -15,12 +15,13 @@ module.exports = {
port: 6001,
siteUrl: '//m.yohobuy.com',
domains: {
//api: 'http://192.168.102.14:8080/gateway/',
//service: 'http://192.168.102.14:8080/gateway/'
//api: 'http://172.16.6.179:8080/gateway/',
//service: 'http://172.16.6.179:8080/gateway/'
api: 'http://api.yoho.cn',
service: 'http://service.yoho.cn'
api: 'http://192.168.102.14:8080/gateway/',
service: 'http://192.168.102.14:8080/gateway/'
// api: 'http://172.16.6.179:8080/gateway/',
// service: 'http://172.16.6.179:8080/gateway/'
// api: 'http://api.yoho.cn',
// service: 'http://service.yoho.cn'
},
subDomains: {
host: '.m.yohobuy.com',
... ...
require('./overdue-notice');
/**
* 订单状态样式
*/
... ...
var $notice = $('.installment-overdue-notice');
$('.repay-list .notice').on('click', function() {
$notice.show();
return false;
});
$('.think-ok, .mask-bg').on('click', function() {
$notice.hide();
});
... ...
... ... @@ -6,17 +6,8 @@
var $ = require('yoho-jquery');
var $notice = $('.installment-overdue-notice');
require('./overdue-notice');
$('.repay-list .notice').on('click', function() {
$notice.show();
return false;
});
$('.think-ok, .mask-bg').on('click', function() {
$notice.hide();
});
$('.repay-list .cont').on('click', function() {
var $currAmt = $('.repayment-bottom').find('.curr-amt');
... ...
.installment-order-page {
background: #f0f0f0;
.order-info {
position: fixed;
width: 100%;
top: 0;
}
.header-tab {
text-align: center;
height: 90px;
... ... @@ -121,11 +127,12 @@
}
.installment-list {
margin-top: 30px;
padding-top: 330px;
border-top: 1px solid #e0e0e0;
overflow: scroll;
li {
padding: 30px 0 30px 30px;
padding: 30px 0 30px 45px;
border-bottom: 1px solid #e0e0e0;
height: 120px;
background: #fff;
... ... @@ -135,6 +142,7 @@
.detail-index {
float: left;
margin-top: 20px;
margin-right: 20px;
}
.detail-box {
... ... @@ -154,19 +162,30 @@
.status {
position: absolute;
top: 35px;
right: 30px;
.iconfont {
display: none;
}
&.faded {
color: #b0b0b0;
.iconfont {
display: none;
}
}
&.expired {
color: #d0021b;
.iconfont {
display: inline-block;
}
}
}
.installment-check-btn + label:before {
margin-top: 20px;
margin-left: -28px;
}
}
}
... ...