|
|
|
<template>
|
|
|
|
<div class="refund">
|
|
|
|
<product-list v-bind:title="title" v-bind:list="list" v-bind:refund-data="refundData"></product-list>
|
|
|
|
<div class="return-amount">
|
|
|
|
<div class="return-amount-item">
|
|
|
|
退款方法
|
|
|
|
|
|
|
|
<span class="icon icon-right"></span>
|
|
|
|
<select v-model="amount.return_amount_mode" name="amount-mode">
|
|
|
|
<option v-for="mode in refundData.returnAmountMode" v-bind:value="mode.id">{{mode.name}}</option>
|
|
|
|
</select>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<template v-if="amount.return_amount_mode === 2">
|
|
|
|
<div class="return-amount-item">
|
|
|
|
<span class="name">银行</span>
|
|
|
|
|
|
|
|
<input v-model="amount.bank_name" type="text" placeholder="请填写银行名称">
|
|
|
|
</div>
|
|
|
|
<div class="return-amount-item">
|
|
|
|
<span class="name">卡号</span>
|
|
|
|
|
|
|
|
<input v-model="amount.bank_card" type="text" placeholder="请填写银行卡卡号">
|
|
|
|
</div>
|
|
|
|
<div class="return-amount-item">
|
|
|
|
<span class="name">姓名</span>
|
|
|
|
|
|
|
|
<input v-model="amount.payee_name" type="text" placeholder="收款人姓名">
|
|
|
|
</div>
|
|
|
|
</template>
|
|
|
|
<template v-if="amount.return_amount_mode === 3">
|
|
|
|
<div class="return-amount-item">
|
|
|
|
<span class="name">帐号</span>
|
|
|
|
|
|
|
|
<input v-model="amount.alipay_account" type="text" placeholder="请填写支付宝帐号">
|
|
|
|
</div>
|
|
|
|
<div class="return-amount-item">
|
|
|
|
<span class="name">姓名</span>
|
|
|
|
|
|
|
|
<input v-model="amount.alipay_name" type="text" placeholder="收款人姓名">
|
|
|
|
</div>
|
|
|
|
</template>
|
|
|
|
</div>
|
|
|
|
<div v-if="refundData.returnAmountInfo" class="return-amount-info">
|
|
|
|
{{refundData.returnAmountInfo}}
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</template>
|
|
|
|
|
|
|
|
<script>
|
|
|
|
const $ = require('yoho-jquery');
|
|
|
|
const qs = require('yoho-qs');
|
|
|
|
|
|
|
|
const productList = require('home/refund/product-list.vue');
|
|
|
|
|
|
...
|
...
|
@@ -14,12 +58,42 @@ |
|
|
|
return {
|
|
|
|
title: '请选择退货商品',
|
|
|
|
list: [],
|
|
|
|
amount: {},
|
|
|
|
refundData: {}
|
|
|
|
};
|
|
|
|
},
|
|
|
|
computed: {
|
|
|
|
submitData() {
|
|
|
|
let goods = [];
|
|
|
|
|
|
|
|
this.list.forEach(product => {
|
|
|
|
if (product.checked) {
|
|
|
|
goods.push({
|
|
|
|
last_price: product.lastPrice,
|
|
|
|
remark: product.remark || '',
|
|
|
|
returned_reason: this.refundData.returnReason[product.reason.id].id + '',
|
|
|
|
evidence_images: product.imageList || [],
|
|
|
|
goods_type: product.goodsTypeId + '',
|
|
|
|
product_skn: product.productSkn,
|
|
|
|
product_skc: product.productSkc,
|
|
|
|
product_sku: product.productSku
|
|
|
|
});
|
|
|
|
}
|
|
|
|
});
|
|
|
|
|
|
|
|
return {
|
|
|
|
order_code: qs.orderId,
|
|
|
|
goods: JSON.stringify(goods),
|
|
|
|
payment: JSON.stringify(this.amount)
|
|
|
|
};
|
|
|
|
}
|
|
|
|
},
|
|
|
|
created() {
|
|
|
|
$.ajax({
|
|
|
|
url: '/home/refund/order'
|
|
|
|
url: '/home/refund/order',
|
|
|
|
data: {
|
|
|
|
orderId: qs.orderId
|
|
|
|
}
|
|
|
|
}).then(res => {
|
|
|
|
if (res.data && res.data.goodsList) {
|
|
|
|
res.data.goodsList.forEach(product => {
|
|
...
|
...
|
@@ -27,13 +101,59 @@ |
|
|
|
product.reason = {
|
|
|
|
id: 0
|
|
|
|
};
|
|
|
|
product.imageList = [];
|
|
|
|
});
|
|
|
|
res.data.returnAmountMode.forEach(mode => {
|
|
|
|
if (mode.isDefault === 'Y') {
|
|
|
|
this.$set('amount.return_amount_mode', mode.id);
|
|
|
|
}
|
|
|
|
});
|
|
|
|
this.list = res.data.goodsList;
|
|
|
|
this.refundData = res.data;
|
|
|
|
}
|
|
|
|
});
|
|
|
|
},
|
|
|
|
methods: {},
|
|
|
|
methods: {
|
|
|
|
checkSubmitData() {
|
|
|
|
const data = this.submitData;
|
|
|
|
|
|
|
|
if (!data.order_code) {
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
|
|
|
|
// 退到银行卡
|
|
|
|
if (this.amount.return_amount_mode === 2) {
|
|
|
|
if (!this.amount.bank_name || !this.amount.bank_card || !this.amount.payee_name) {
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
// 退到支付宝
|
|
|
|
if (this.amount.return_amount_mode === 3) {
|
|
|
|
if (!this.amount.alipay_account || !this.amount.alipay_name) {
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
return true;
|
|
|
|
},
|
|
|
|
submit() {
|
|
|
|
if (!this.checkSubmitData()) {
|
|
|
|
alert('请填写完整退换货信息');
|
|
|
|
}
|
|
|
|
$.ajax({
|
|
|
|
method: 'POST',
|
|
|
|
url: '/home/refund/submit',
|
|
|
|
data: this.submitData
|
|
|
|
}).then(result => {
|
|
|
|
if (result.code === 200) {
|
|
|
|
console.log(result);
|
|
|
|
} else {
|
|
|
|
alert(result.message);
|
|
|
|
}
|
|
|
|
});
|
|
|
|
}
|
|
|
|
},
|
|
|
|
components: {
|
|
|
|
productList
|
|
|
|
}
|
|
...
|
...
|
@@ -44,4 +164,61 @@ |
|
|
|
.main-wrap {
|
|
|
|
background: #f6f6f6;
|
|
|
|
}
|
|
|
|
|
|
|
|
.refund {
|
|
|
|
.return-amount {
|
|
|
|
padding: 0 30px;
|
|
|
|
font-size: 32px;
|
|
|
|
line-height: 90px;
|
|
|
|
background: #fff;
|
|
|
|
border-top: 1px solid #eee;
|
|
|
|
border-bottom: 1px solid #eee;
|
|
|
|
}
|
|
|
|
|
|
|
|
.return-amount-info {
|
|
|
|
padding: 0 30px 30px;
|
|
|
|
font-size: 24px;
|
|
|
|
line-height: 2.5;
|
|
|
|
color: #b0b0b0;
|
|
|
|
}
|
|
|
|
|
|
|
|
.return-amount-item {
|
|
|
|
position: relative;
|
|
|
|
width: 100%;
|
|
|
|
height: 90px;
|
|
|
|
|
|
|
|
&:after {
|
|
|
|
content: "";
|
|
|
|
position: absolute;
|
|
|
|
left: 0;
|
|
|
|
bottom: -1px;
|
|
|
|
width: 690px;
|
|
|
|
height: 0;
|
|
|
|
border-bottom: 1px solid #eee;
|
|
|
|
z-index: 1;
|
|
|
|
}
|
|
|
|
|
|
|
|
.name {
|
|
|
|
float: left;
|
|
|
|
width: 160px;
|
|
|
|
color: #000;
|
|
|
|
}
|
|
|
|
|
|
|
|
input {
|
|
|
|
width: 500px;
|
|
|
|
}
|
|
|
|
|
|
|
|
span,
|
|
|
|
select {
|
|
|
|
float: right;
|
|
|
|
height: 90px;
|
|
|
|
line-height: 90px;
|
|
|
|
color: #b0b0b0;
|
|
|
|
}
|
|
|
|
|
|
|
|
select {
|
|
|
|
direction: rtl;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
</style> |
...
|
...
|
|
