fe / yoho-blk · Commits

Go to a project

Authored by zhangxiaoru
Commit 4ace67d443b815df1c26196f8d49820849b16bc0 2 parents 84be921a 7ab45555

exchange

Inline Side-by-side
Showing 19 changed files with 705 additions and 21 deletions
... ... @@ -35,7 +35,6 @@ const refund = (req, res, next) => {
let uid = req.user.uid || '8050560';
let code = parseInt(req.params.orderCode, 10) || '160192757';
code = '160192757';
if (!uid || !code) {
return next();
}
... ... @@ -67,8 +66,46 @@ const refundApply = (req, res, next) => {
};
const refundDetail = (req, res, next) => {
let applyId = parseInt(req.params.applyId, 10) || '429528',
uid = req.user.uid || '8050560';
if (!uid || !applyId) {
return next();
}
returns.getRefundDetailData(applyId, uid).then(result => {
res.display('index', {
page: 'returns-refund',
content: result
});
}).catch(next);
};
const exchange = (req, res, next) => {
next();
const code = req.params.orderCode;
const uid = req.user.uid || '8050560';
returns.getChangeGoodsList(code, uid).then(result => {
res.display('index', {
page: 'returns-change',
isMe: true,
content: Object.assign({
nav: mcHandler.getMeCrumb('我的退/换货'),
navigation: mcHandler.getSideMenu('我的退/换货'),
banner: 'http://placehold.it/{width}x{height}'
}, result)
});
}).catch(next);
};
const getProductInfo = (req, res, next) => {
const productId = req.query.productId;
const productSkn = req.query.productSkn;
returns.getProductInfo(productId, productSkn).then(result => {
res.json(result);
}).catch(next);
};
const detailExchange = (req, res) => {
... ... @@ -132,5 +169,7 @@ module.exports = {
refund,
refundApply,
exchange,
getProductInfo,
refundDetail,
detailExchange
};
... ...
... ... @@ -24,6 +24,14 @@ const getRefundGoodsAsync = (orderCode, uid) => {
}, {code: 200});
};
const getRefundDetailAsync = (applyId, uid) => {
return api.get('', {
method: 'app.refund.detail',
id: applyId,
uid: uid
}, {code: 200});
};
const refundSubmitAsync = (orderCode, uid, goods, payment) => {
return api.get('', {
method: 'app.refund.submit',
... ... @@ -34,9 +42,28 @@ const refundSubmitAsync = (orderCode, uid, goods, payment) => {
}, {code: 200});
};
const getChangeGoodsListAsync = (orderCode, uid) => {
return api.get('', {
method: 'app.change.goodsList',
order_code: orderCode,
uid: uid
});
};
const getProductInfoAsync = (productId, productSkn) => {
return api.get('', {
method: 'app.product.data',
product_id: productId,
product_skn: productSkn
});
};
module.exports = {
getOrderInfoAsync,
getRefundGoodsAsync,
getChangeGoodsListAsync,
getProductInfoAsync,
getRefundDetailAsync,
refundSubmitAsync
};
... ...
... ... @@ -16,6 +16,20 @@ const helpers = global.yoho.helpers;
const pageSize = 10;
const _reduceArrByProductSku = data => {
const d = [];
d.push(data[0]);
data.reduce((p, c) => { //eslint-disable-line
if (p && c && p.productSku !== c.productSku) {
d.push[c];
}
});
return d;
};
const getUserReturn = (uid, page) => {
return api.get('', {
... ... @@ -104,6 +118,32 @@ const _setRefundGoodList = (data) => {
return resData;
};
const _setRefundDetailData = (data) => {
let resData = {};
switch (data.status) {
case 10:
resData.orderReview = {pass: true};
resData.refundExpress = true;
resData.refundAddress = true;
break;
case 20:
resData.refundExpress = true;
break;
case 30:
resData.backStorage = true;
break;
case 40:
resData.refundSure = true;
break;
default:
resData.orderReview = true;
break;
}
return resData;
};
const getRefundGoodsData = (orderCode, uid) => {
return returnsAPI.getRefundGoodsAsync(orderCode, uid).then(result => {
let resData = {};
... ... @@ -124,12 +164,36 @@ const getRefundGoodsData = (orderCode, uid) => {
});
};
const getRefundDetailData = (applyId, uid) => {
return returnsAPI.getRefundDetailAsync(applyId, uid).then(result => {
let resData = {};
Object.assign(resData, _setSideMenu('我的退/换货'));
resData = {
title: '退货申请',
refundDetail: {}
};
if (result.data) {
// console.log(_setRefundDetailData(result.data));
Object.assign(resData.refundDetail, _setRefundDetailData(result.data));
}
return {returns: resData};
});
};
const saveRefund = (orderCode, uid, goods, payment) => {
return returnsAPI.getOrderInfoAsync(orderCode, uid, '').then(result => {
if (!_.isEmpty(result)) {
return returnsAPI.refundSubmitAsync(orderCode, uid, goods, payment).then(subRes => {
if (subRes && subRes.data) {
return {code: 200, data: {refer: subRes.data.apply_id}};
return {
code: 200,
data: {
refer: helpers.urlFormat(`/return/refund/detail/${subRes.data.apply_id}`)
}
};
}
return {code: 400, message: '申请失败'};
});
... ... @@ -139,8 +203,53 @@ const saveRefund = (orderCode, uid, goods, payment) => {
});
};
const getProductInfo = (productId, productSkn) => {
return returnsAPI.getProductInfoAsync(productId, productSkn).then(result => {
if (result.code === 200) {
camelCase(result);
result.data.goodsList.forEach(good => {
good.colorImage = helpers.image(good.colorImage, 20, 20);
});
}
return result;
});
};
const getChangeGoodsList = (orderCode, uid) => {
return returnsAPI.getChangeGoodsListAsync(orderCode, uid).then(result => {
const basicData = {
title: '申请退货'
};
let data;
console.log(result);
if (result && result.data) {
data = camelCase(result.data);
data.goodsList = _reduceArrByProductSku(data.goodsList);
data.hidePrice = true;
data.goodsList.forEach(good => {
good.showCheckbox = true;
good.hidePrice = true;
good.buyNumber = good.num;
});
}
return {
returnsChange: Object.assign(basicData, data)
};
});
};
module.exports = {
getUserReturn,
getRefundGoodsData,
getChangeGoodsList,
getProductInfo,
getRefundDetailData,
saveRefund
};
... ...
... ... @@ -30,9 +30,11 @@ router.get('/editOrder', order.editOrder);
router.get('/return', returns.index);
router.get('/return/refund/:orderCode', returns.refund);
router.get('/return/exchange/:orderCode', returns.exchange);
router.get('/return/refund/detail/:applyId', returns.refundDetail);
router.get('/return/exchange/detail', returns.detailExchange);
router.get('/return/:returnId', returns.detail);
router.post('/return/refund/apply', returns.refundApply);
router.get('/return/getProductInfo', returns.getProductInfo);
// 个人中心首页/收货地址
router.get('/address', address.index);
... ...
... ... @@ -46,6 +46,11 @@
{{> returns-list}}
{{/if}}
{{!-- 发起换货申请 --}}
{{#if returnsChange}}
{{> returns-change}}
{{/if}}
{{!-- 我的收藏 --}}
{{#if collection}}
{{> collection}}
... ...
<div class="good-info {{#if @last}}last{{/if}}">
<img src="{{image goodsImage 65 90}}">
<div class="detail">
<p class="with-bottom-space">{{productName}}</p>
<span class="with-space">颜色：{{colorName}}</span>
<span>尺码：
<span class="bold">{{sizeName}}</span>
</span>
<p class="bold buy-number">{{> icon/error-round}}{{buyNumber}}</p>
</div>
</div>
... ...
<div class="goods-container special-border {{#if hidePrice}}no-price{{/if}}">
{{#orderGoods}}
<div class="good-info {{#if @last}}last{{/if}}">
<img src="{{image goodsImage 65 90}}">
<div class="detail">
<p class="with-bottom-space">{{productName}}</p>
<span class="with-space">颜色：{{colorName}}</span>
<span>尺码：
<span class="bold">{{sizeName}}</span>
</span>
<p class="bold buy-number">{{> icon/error-round}}{{buyNumber}}</p>
</div>
</div>
{{> order/good-info}}
{{#unless hidePrice}}
<div class="sub-column right-border bold">
<p class="{{#if @last}}last{{/if}}">¥{{goodsPrice}}</p>
</div>
{{/unless}}
<div class="sub-column right-border special-column bold">
<p class="bold">{{buyNumber}}</p>
</div>
<div class="sub-column special-column bold">
<p class="bold">¥{{goodsAmount}}</p>
</div>
{{/unless}}
{{/orderGoods}}
</div>
... ...
... ... @@ -28,7 +28,9 @@
{{#if showEditOption}}
<p class="subtext">评价晒单</p>
<p class="subtext">申请退货</p>
<p class="subtext">申请换货</p>
<a href="/return/exchange?code={{orderCode}}&id={{productId}}&skn={{productSkn}}">
<p class="subtext">申请换货</p>
</a>
<p class="subtext delete">删除订单</p>
{{/if}}
{{#if showGetBtn}}
... ...
{{# refundDetail}}
<div class="refund-datail-wrap">
{{> returns/returns-status}}
{{# orderReview}}
<div class="top-tip">
{{#if pass}}
<p class="tip-status">
<span class="iconfont blue">&#xe618;</span>
<span class="blue">退货申请已通过</span>
</p>
{{^}}
<p class="tip-status">
<span class="iconfont blue">&#xe618;</span>
<span class="blue">退货申请审核中</span>
</p>
{{/if}}
<p class="tip-text">
请将商品连同吊牌、包装、发货单（如无发货单，您可找张白纸上注明订单编号，收货人姓名及手机号码）、发票（如有）、 赠品（如有）一并寄回，如有 遗漏将影响您的退换货进度，敬请谅解<br>
非我司原因的退换货，寄回运费由您承担。商品客观问题的退换货，请您先行垫付运费，邮费会在退款中补贴给您，
<b>我们不接受平邮和到付</b>
，感谢您的理解与支持
</p>
<p>
如果您不想退货了，您可以
<span class="cancel-btn btn">取消申请</span>
</p>
</div>
{{/ orderReview}}
{{# backStorage}}
<div class="storage-tip top-tip">
<p class="tip-status">
<span class="iconfont blue">&#xe618;</span>
<span class="blue">您寄回的商品已收到</span>
</p>
<p>
我们会在入库后的1-3个工作日内处理您的退款，如有疑问，请联系
<span>在线客服</span>
</p>
</div>
{{/ backStorage}}
{{# refundSure}}
<div class="success-tip top-tip">
<p class="tip-status">
<span class="iconfont blue">&#xe618;</span>
<span class="blue">退款完成</span>
</p>
<p>退款方式：<em>由于银行内部处理流程的差异，储蓄卡需要3-7个工作日到账，信用卡需要7-15个工作日到账</em></p>
<p class="tip-pad-top">退款账户：</p>
<p class="tip-pad-top">金额：</p>
<p class="tip-pad-top">有货币：</p>
</div>
{{/ refundSure}}
{{# refundExpress}}
<div class="return-express">
<h4 class="third-title">填写物流</h4>
<p>请您在<span class="blue">7月30日24:00</span>前将商品寄回并填写物流，逾期将自动取消申请</p>
<dl class="express-wrap">
<dd>
物流公司：
<select>
<option>顺丰</option>
<option>申通</option>
</select>
</dd>
<dd>
快递单号：
<input type="text">
</dd>
<dd>
<span class="submit-express btn">提交</span>
</dd>
</dl>
</div>
{{/ refundExpress}}
{{# refundAddress}}
<div class="return-address">
<h4 class="third-title">寄回地址</h4>
<p>地址：{{address}}</p>
<p>收件人：{{name}}</p>
<p>邮编：{{code}}</p>
<p>联系电话：{{phone}}</p>
</div>
{{/ refundAddress}}
<div class="refund-detail-goods">
<ul class="goods-header">
<li class="info">商品信息</li>
<li>退货原因</li>
<li>退货数量</li>
</ul>
{{# goods}}
<div class="goods-item clearfix">
<div class="img">
<img class="lazy" data-original="{{image img 70 90}}">
</div>
<div class="info">
<p>{{name}}</p>
<p>颜色：{{color}}&nbsp;尺码：{{size}}</p>
<p>×{{num}}</p>
</div>
<div class="reason">dsa{{reason}}</div>
<div class="num">dasd{{num}}</div>
<dl class="special-info hide">
<dd>问题描述：</dd>
<dd>照片凭证：</dd>
</dl>
</div>
{{/ goods}}
</div>
</div>
{{/ refundDetail}}
\ No newline at end of file
... ...
<div class="return-wrap user-order change">
{{#returnsChange}}
{{> common/subtitle}}
<div class="order">
<div class="table returns">
<ul class="header">
<li class="info">商品信息</li>
<li class="change-reason">换货原因</li>
<li class="change-num">换货数量</li>
</ul>
{{#goodsList}}
<div class="table-body">
<div class="goods-container no-price" data-id="{{productId}}" data-skn="{{productSkn}}">
{{# showCheckbox}}
{{> icon/checkbox}}
<!--
<span class="iconfont checkbox {{#if checked}}checked{{/if}}">{{#if checked}}&#xe602;{{^}}&#xe601;{{/if}}</span>
-->
{{/ showCheckbox}}
{{> order/good-info}}
<div class="sub-column">
退货原因
</div>
<div class="sub-column">
数量
</div>
</div>
</div>
<div class="form">
<div class="group color">
<span class="title">
<span class="artirisk">*</span>
换货Color： <span class="color-text" data-color={{colorId}}>{{colorName}}</span>
</span>
</div>
<div class="group size">
<span class="title">
<span class="artirisk">*</span>
换货Size： <span class="size-text" data-size="{{sizeId}}">{{sizeName}}</span>
</span>
</div>
</div>
{{/goodsList}}
</div>
</div>
{{/returnsChange}}
</div>
... ...
... ... @@ -4,6 +4,8 @@
{{> refund}}
{{> refund-detail}}
{{> exchange}}
{{/ returns}}
</div>
... ...
<div class="returns-status">
<div class="back-wrap">
<div class="progress"></div>
<div class="visual-state">
<ul>
{{# statusList}}
<li{{#if act}} class="act"{{/if}}>
<span class="iconfont state-bg">&#xe611;</span>
<div class="number">{{step}}</div>
<div>{{name}}</div>
</li>
{{/ statusList}}
</ul>
</div>
</div>
</div>
\ No newline at end of file
... ...
... ... @@ -19,7 +19,7 @@ module.exports = {
},
cookieDomain: 'yohoblk.com',
domains: {
api: 'http://testapi.yoho.cn:28078/', // devapi.yoho.cn:58078 testapi.yoho.cn:28078 devapi.yoho.cn:58078
api: 'http://devapi.yoho.cn:58078/', // devapi.yoho.cn:58078 testapi.yoho.cn:28078 devapi.yoho.cn:58078
service: 'http://testservice.yoho.cn:28077/', // testservice.yoho.cn:28077 devservice.yoho.cn:58077
search: 'http://192.168.102.216:8080/yohosearch/'
},
... ...
var colorTpl = require('../../tpl/me/color-list.hbs');
var sizeTpl = require('../../tpl/me/size-list.hbs');
// var scope = {
// 1: {
// min: true,
// do: function() {
// console.log('min');
// }
// }
// }
function renderList(data) {
var cTpl;
var sTpl;
var $c = $('.group.color');
var $s = $('.group.size');
if (data) {
cTpl = colorTpl(data);
sTpl = sizeTpl(data);
$c.append(cTpl);
$s.append(sTpl);
}
}
function bindColorEvent() {
$('.color-list img').on('click', function() {
var $this = $(this);
var $sizeList = $('.size-list');
var index = $this.data('index');
var colorId = $this.data('color');
var colorText = $this.attr('alt');
var $c = $('.group.color .color-text');
$c.text(colorText);
$c.attr('data-color', colorId);
$sizeList.removeClass('hide');
$sizeList.addClass('hide');
$sizeList.eq(index).removeClass('hide');
});
}
function initSizeId() {
var s = $('.size-list:not("hide")').find('span').eq(0).data('size');
$('.group.size .size-text').eq(0).attr('data-size', s);
}
function bindSizeEvent() {
$('.size-list span').on('click', function() {
var $this = $(this);
var s = $this.text();
var id = $this.data('size');
var $s = $('.group.size .size-text');
$s.text(s);
$s.attr('data-size', id);
});
}
// function bindNumberEvent() {
// $('.number .minus').on('click', function() {
// var val = $('.number .value').text();
//
// if (scope[val].min) {
// scope[val].do();
// }
// });
// }
function getProductInfo() {
var $el = $('.goods-container');
var id = $el.data('id');
var skn = $el.data('skn');
if (id && skn) {
$.ajax({
url: '/me/return/getProductInfo',
data: {
productId: id,
productSkn: skn
}
}).done(function(result) {
console.log(result);
if (result.code === 200) {
renderList(result.data);
initSizeId();
bindColorEvent();
bindSizeEvent();
}
});
}
}
getProductInfo();
... ...
@import "list"
.returns-wrap {
.returns-status {
padding: 30px 0 50px;
.back-wrap {
width: 800px;
height: 6px;
background: #eee;
border-radius: 3px;
margin: 0 auto;
}
.progress {
height: 6px;
background: #1d1d1d;
border-radius: 3px;
width: 30%;
}
.visual-state {
width: 100%;
display: table;
position: relative;
top: -15px;
> ul {
display: table-row;
}
li {
display: table-cell;
text-align: center;
}
.state-bg {
color: #eee;
}
.number {
position: relative;
top: -17px;
}
.cur .state-bg {
color: #1d1d1d;
}
.cur .number {
color: #fff;
}
}
}
}
@import "list";
@import "refund-detail";
... ...
.return-wrap {
.table {
width: 100%;
max-width: 990px;
.header {
.info {
... ... @@ -9,12 +10,26 @@
}
.st,
.op {
.op,
.change-reason,
.change-num {
width: 206px;
}
}
&.returns {
.good-info {
border: none;
.detail {
width: 380px !important;
}
}
}
.goods-container {
width: 990px;
.for-return {
display: block;
}
... ... @@ -23,24 +38,36 @@
.no-price {
.good-info {
border-right: none;
}
.good-info {
.detail {
width: 408px;
}
}
}
.sub-column {
width: 204px !important;
}
.checkbox-column {
display: table-cell;
width: 100px;
}
.common-column {
width: 208px;
.refund-status {
margin-bottom: 10px;
}
.refund-type {
position: static;
}
&.no-border {
width: 204px !important;
}
}
}
... ...
.refund-datail-wrap {
font-size: 14px;
.top-tip {
padding: 40px 0 20px;
border-bottom: 1px solid #eee;
.blue {
font-size: 16px;
line-height: 16px;
}
.tip-status {
padding-bottom: 20px;
.iconfont {
position: relative;
top: -1px;
}
}
.tip-text {
line-height: 2;
padding: 0 20px 20px 0;
}
.tip-pad-top {
padding-top: 15px;
}
b {
font-weight: 700;
}
em {
color: #9a9a9a;
}
.cancel-btn {
display: inline-block;
}
}
.return-express {
padding: 40px 0 20px;
border-bottom: 1px solid #eee;
.express-wrap {
padding-top: 10px;
> dd {
padding-top: 12px;
}
}
.submit-express {
margin-left: 74px;
}
}
.return-address {
padding: 40px 0 20px;
border-bottom: 1px solid #eee;
> p {
padding-top: 10px;
}
> p:first-child {
padding-top: 0;
}
}
.refund-detail-goods {
.goods-header {
height: 40px;
line-height: 40px;
background-color: #f5f5f5;
border: 1px solid #f1f1f1;
> * {
float: left;
width: 270px;
text-align: center;
}
.info {
width: 384px;
padding-left: 20px;
text-align: left;
}
}
.goods-item {
padding: 30px 0;
border: 1px solid #f1f1f1;
border-top: 0;
> * {
width: 270px;
height: 90px;
float: left;
text-align: center;
}
.img {
width: 100px;
}
.info {
width: 284px;
text-align: left;
}
.special-info {
width: 100%;
height: auto;
padding-top: 30px;
text-align: left;
}
}
}
}
... ...
<div class="color-list">
{{#goodsList}}
<img src="{{colorImage}}" alt="{{colorName}}" data-index="{{@index}}" data-color={{colorId}}>
{{/goodsList}}
</div>
... ...
<div>
{{#goodsList}}
<div class="{{#unless @first}}hide{{/unless}} size-list" data-index="{{@index}}">
{{#sizeList}}
<span data-size="{{sizeId}}">{{sizeName}}</span>
{{/sizeList}}
</div>
{{/goodsList}}
</div>
... ...