|
|
<template>
|
|
|
<table cellspacing="0" cellpadding="0" class="order-table">
|
|
|
<thead>
|
|
|
<tr>
|
|
|
<template v-for="(cols, index) in tableCols">
|
|
|
<th :key="index" :style="'width:' + cols.width">{{ cols.title }}</th>
|
|
|
</template>
|
|
|
</tr>
|
|
|
</thead>
|
|
|
<tbody>
|
|
|
<template v-for="(item, index) in tableData">
|
|
|
<tr :key="index">
|
|
|
<td colspan="12" style="text-align: left">
|
|
|
<span>订单号:{{ item.orderCode }}</span>
|
|
|
<span>父订单号:{{ item.parentOrderCode }}</span>
|
|
|
<span>创建时间:{{ item.createTime }}</span>
|
|
|
</td>
|
|
|
</tr>
|
|
|
<template v-for="(goods, key) in item.returnedGoodsListBoArray">
|
|
|
<tr :key="key">
|
|
|
<td>
|
|
|
<img
|
|
|
:src="
|
|
|
'http://shopmanage.yohobuy.com/platform/product/getRemoteImageUrlBySku?sku_id=' +
|
|
|
goods.productSku +
|
|
|
'&size=40x60'
|
|
|
"
|
|
|
/>
|
|
|
</td>
|
|
|
<td style="text-align: left">
|
|
|
<p>{{ goods.prodcutName }}</p>
|
|
|
<p>{{ goods.prodcutCode }}</p>
|
|
|
<p>尺码:{{ goods.sizeName }} 颜色:{{ goods.colorName }}</p>
|
|
|
</td>
|
|
|
<td>{{ goods.lastPrice }}</td>
|
|
|
<td>{{ goods.buyNums }}</td>
|
|
|
<td>{{ goods.productSkn }}</td>
|
|
|
<td>{{ goods.productSku }}</td>
|
|
|
<template v-if="key == 0">
|
|
|
<td :rowspan="item.returnedGoodsListBoArray.length">{{ item.consigneeName }}</td>
|
|
|
<td :rowspan="item.returnedGoodsListBoArray.length">{{ item.paymentStatus }}</td>
|
|
|
<td :rowspan="item.returnedGoodsListBoArray.length">{{ item.realAmount }}</td>
|
|
|
<td :rowspan="item.returnedGoodsListBoArray.length">{{ item.orderStatus }}</td>
|
|
|
<td :rowspan="item.returnedGoodsListBoArray.length">
|
|
|
<i-button type="default" size="small" @click="goToDetail(item.orderCode)">查看订单</i-button>
|
|
|
<i-button type="primary" size="small" @click="goToHandle(item.id, item.orderCode)">处理</i-button>
|
|
|
</td>
|
|
|
</template>
|
|
|
</tr>
|
|
|
</template>
|
|
|
</template>
|
|
|
</tbody>
|
|
|
</table>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
export default {
|
|
|
name: 'ReturnedListTable',
|
|
|
props: ['tableData'],
|
|
|
data() {
|
|
|
return {
|
|
|
tableCols: [
|
|
|
{ title: '图片', width: '8%' },
|
|
|
{ title: '商品信息', width: '20%' },
|
|
|
{ title: '单价', width: '8%' },
|
|
|
{ title: '数量', width: '5%' },
|
|
|
{ title: 'SKN', width: '5%' },
|
|
|
{ title: 'SKU', width: '5%' },
|
|
|
{ title: '收货人', width: '5%' },
|
|
|
{ title: '支付状态', width: '5%' },
|
|
|
{ title: '实收金额', width: '5%' },
|
|
|
{ title: '订单状态', width: '5%' },
|
|
|
{ title: '操作', width: '10%' },
|
|
|
],
|
|
|
};
|
|
|
},
|
|
|
methods: {
|
|
|
goToDetail(code) {
|
|
|
this.$router.push({
|
|
|
name: 'order.detail',
|
|
|
params: {},
|
|
|
query: {
|
|
|
orderCode: code,
|
|
|
},
|
|
|
});
|
|
|
},
|
|
|
goToHandle(operateId, code) {
|
|
|
this.$router.push({
|
|
|
name: 'order.returned.operate',
|
|
|
params: {},
|
|
|
query: {
|
|
|
id: operateId,
|
|
|
orderCode: code,
|
|
|
},
|
|
|
});
|
|
|
},
|
|
|
},
|
|
|
};
|
|
|
</script>
|
|
|
<style lang="scss">
|
|
|
table.order-table {
|
|
|
width: 100%;
|
|
|
height: auto;
|
|
|
thead {
|
|
|
background: #000000;
|
|
|
th {
|
|
|
padding: 8px 0;
|
|
|
border: 1px solid #cccccc;
|
|
|
color: #ffffff;
|
|
|
text-align: center;
|
|
|
}
|
|
|
}
|
|
|
tbody {
|
|
|
tr {
|
|
|
height: 35px;
|
|
|
td {
|
|
|
border: 1px solid #cccccc;
|
|
|
border-top: none;
|
|
|
border-right: none;
|
|
|
text-align: center;
|
|
|
padding: 5px;
|
|
|
span {
|
|
|
margin-left: 10px;
|
|
|
margin-right: 20px;
|
|
|
}
|
|
|
}
|
|
|
td:last-child {
|
|
|
border-right: 1px solid #cccccc;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
</style> |
...
|
...
|
|