106 lines
3.2 KiB
Vue
106 lines
3.2 KiB
Vue
|
<template>
|
|||
|
<div class="apply-result-container">
|
|||
|
<div class="result-header flex">
|
|||
|
<img style="width: 40px;height: 40px;align-self: flex-start" src="~/static/images/pay_success.png" />
|
|||
|
<div class="m-l-16">
|
|||
|
<div class="apply-title" style="font-weight: 500;">提交申请</div>
|
|||
|
<div class="muted m-t-8">申请已提交,请耐心等待商家处理…</div>
|
|||
|
</div>
|
|||
|
</div>
|
|||
|
<div class="result-content">
|
|||
|
<div class="result-item flex">
|
|||
|
<div class="label">退款类型:</div>
|
|||
|
<div class="desc">{{lists.refund_type_text}}</div>
|
|||
|
</div>
|
|||
|
<div class="result-item flex">
|
|||
|
<div class="label">退款原因:</div>
|
|||
|
<div class="desc">{{lists.refund_reason}}</div>
|
|||
|
</div>
|
|||
|
<div class="result-item flex">
|
|||
|
<div class="label">退款金额:</div>
|
|||
|
<div class="desc">
|
|||
|
<price-formate :price="lists.refund_price" showSubscript color="red" />
|
|||
|
</div>
|
|||
|
</div>
|
|||
|
<div class="result-item flex">
|
|||
|
<div class="label">退款说明:</div>
|
|||
|
<div class="column desc">
|
|||
|
<div class="m-b-16">{{lists.refund_remark}}</div>
|
|||
|
<el-image style="width: 76px;height: 76px;" :src="lists.refund_image" v-if="lists.refund_image" :preview-src-list="[lists.refund_image]" />
|
|||
|
</div>
|
|||
|
</div>
|
|||
|
</div>
|
|||
|
</div>
|
|||
|
</template>
|
|||
|
|
|||
|
<script>
|
|||
|
export default {
|
|||
|
head() {
|
|||
|
return {
|
|||
|
title: this.$store.getters.headTitle,
|
|||
|
link: [{ rel: "icon", type: "image/x-icon", href: this.$store.getters.favicon}],
|
|||
|
};
|
|||
|
},
|
|||
|
layout: "user",
|
|||
|
async asyncData({$get, query}) {
|
|||
|
const data = {
|
|||
|
id: query.afterSaleId
|
|||
|
};
|
|||
|
let lists = {}
|
|||
|
let res = await $get("after_sale/detail", {params: data});
|
|||
|
if(res.code == 1) {
|
|||
|
lists = res.data;
|
|||
|
}
|
|||
|
return {
|
|||
|
lists,
|
|||
|
}
|
|||
|
},
|
|||
|
data() {
|
|||
|
return {
|
|||
|
|
|||
|
}
|
|||
|
},
|
|||
|
methods: {
|
|||
|
|
|||
|
}
|
|||
|
}
|
|||
|
</script>
|
|||
|
|
|||
|
<style lang="scss" scoped>
|
|||
|
.apply-result-container {
|
|||
|
padding: 10px;
|
|||
|
.result-header {
|
|||
|
padding: 46px 20px;
|
|||
|
border-bottom: 1px solid #E5E5E5;
|
|||
|
.apply-title {
|
|||
|
font-size: 24px;
|
|||
|
}
|
|||
|
}
|
|||
|
.result-content {
|
|||
|
padding: 24px 20px;
|
|||
|
.result-item {
|
|||
|
margin-bottom: 16px;
|
|||
|
&:not(:last-of-type) {
|
|||
|
.label {
|
|||
|
width: 82px;
|
|||
|
align-self: flex-start;
|
|||
|
text-align: right;
|
|||
|
&::before {
|
|||
|
content: '* ';
|
|||
|
color: red;
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
.label {
|
|||
|
width: 82px;
|
|||
|
align-self: flex-start;
|
|||
|
text-align: right;
|
|||
|
}
|
|||
|
.desc {
|
|||
|
margin-left: 24px;
|
|||
|
width: 680px;
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
</style>
|