faiz
/
offline_mer
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

1

This commit is contained in:
faiz 2024-09-24 17:29:54 +08:00
parent 91d0e0b49c
commit 845032833a
2 changed files with 183 additions and 107 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
public/index.html
View File

@ -1,17 +1,22 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="renderer" content="webkit">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<title><%= webpackConfig.name %></title>
<script src="<%= VUE_APP_BASE_API %>/api/script"></script>
</head>
<body>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>
<head>
<meta charset="utf-8">
<meta name="referrer" content="no-referrer" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="renderer" content="webkit">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<title>
<%= webpackConfig.name %>
</title>
<script src="<%= VUE_APP_BASE_API %>/api/script"></script>
</head>
<body>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>

257
src/views/order/orderRefund/refundDetail.vue
View File

@ -9,54 +9,118 @@
<div class="description"> <div class="description">
<div class="title">用户信息</div> <div class="title">用户信息</div>
<div class="acea-row"> <div class="acea-row">
<div class="description-term">用户昵称：{{ orderDatalist.user.nickname }}</div> <div class="description-term">
<div class="description-term">退货人：{{ orderDatalist.order.real_name }}</div> 用户昵称：{{ orderDatalist.user.nickname }}
<div class="description-term">联系电话：{{ orderDatalist.order.user_phone }}</div> </div>
<div class="description-term">退货地址：{{ orderDatalist.order.user_address }}</div> <div class="description-term">
退货人：{{ orderDatalist.order.real_name }}
</div>
<div class="description-term">
联系电话：{{ orderDatalist.order.user_phone }}
</div>
<div class="description-term">
退货地址：{{ orderDatalist.order.user_address }}
</div>
<div class="description-term">备注：{{ orderDatalist.mark }}</div> <div class="description-term">备注：{{ orderDatalist.mark }}</div>
</div> </div>
<el-divider /> <el-divider />
<div class="title">{{orderDatalist.refund_type == 1 ? '退款信息' : '退回商品信息'}}</div> <div class="title">
{{ orderDatalist.refund_type == 1 ? "退款信息" : "退回商品信息" }}
</div>
<div class="acea-row"> <div class="acea-row">
<div class="description-term">订单编号：{{ orderDatalist.order.order_sn }}</div> <div class="description-term">
<div class="description-term">订单状态：{{ orderDatalist.status | orderRefundFilter }}</div> 订单编号：{{ orderDatalist.order.order_sn }}
<div class="description-term100">退款单号：{{ orderDatalist.refund_order_sn }}</div> </div>
<div class="description-term100">退款商品名称： <div class="description-term">
<div class="product_name"> 订单状态：{{ orderDatalist.status | orderRefundFilter }}
<div v-for="(item,index) in orderDatalist.refundProduct" :key="index"> </div>
<span v-if="item.product && item.product.cart_info && item.product.cart_info.product">{{item.product.cart_info.product.store_name}}</span> <div class="description-term100">
</div> 退款单号：{{ orderDatalist.refund_order_sn }}
</div> </div>
<div class="description-term100">
退款商品名称：
<div class="product_name">
<div
v-for="(item, index) in orderDatalist.refundProduct"
:key="index"
>
<span
v-if="
item.product &&
item.product.cart_info &&
item.product.cart_info.product
"
>{{ item.product.cart_info.product.store_name }}</span
>
</div>
</div>
</div>
<div class="description-term">
退款发起方：{{ orderDatalist.create_user }}
</div>
<div class="description-term">
退款商品件数：{{ orderDatalist.refund_num }}件
</div>
<div class="description-term">
退款总金额：{{ orderDatalist.refund_price }}元
</div>
<div v-if="orderDatalist.delivery_id" class="description-term">
退货快递单号：{{ orderDatalist.delivery_id }}
</div>
<div class="description-term">
创建时间：{{ orderDatalist.create_time }}
</div>
<div class="description-term">
退货金额：{{ orderDatalist.refund_good_price }}
</div> </div>
<div class="description-term">退款发起方：{{ orderDatalist.create_user }}</div>
<div class="description-term">退款商品件数：{{ orderDatalist.refund_num }}件</div>
<div class="description-term">退款总金额：{{ orderDatalist.refund_price }}元</div>
<div v-if="orderDatalist.delivery_id" class="description-term">退货快递单号：{{ orderDatalist.delivery_id }}</div>
<div class="description-term">创建时间：{{ orderDatalist.create_time }}</div>
<div class="description-term">退货金额：{{ orderDatalist.refund_price-orderDatalist.refund_postage }}</div>
<div class="description-term">退折扣：{{ orderDatalist.amount }}</div> <div class="description-term">退折扣：{{ orderDatalist.amount }}</div>
<div class="description-term">退运费金额：{{ orderDatalist.refund_postage }}</div> <div class="description-term">
<div class="description-term">商家备注：{{ orderDatalist.mer_mark }}</div> 退运费金额：{{ orderDatalist.refund_postage }}
<div class="description-term100">退款凭证： </div>
<div class="description-term">
商家备注：{{ orderDatalist.mer_mark }}
</div>
<div class="description-term100">
退款凭证：
<div class="product_name" style="margin-left: 70px;"> <div class="product_name" style="margin-left: 70px;">
<div class="demo-image__preview"> <div class="demo-image__preview">
<el-image <el-image
v-for="(item,index) in orderDatalist.pics" v-for="(item, index) in orderDatalist.pics"
:key="index" :key="index"
:src="item" :src="item"
class="mr5" class="mr5"
:preview-src-list="[item]" :preview-src-list="[item]"
/> />
</div>
</div> </div>
</div>
</div> </div>
</div> </div>
<el-divider /> <el-divider />
<div class="title">订单记录</div> <div class="title">订单记录</div>
<el-table v-loading="LogLoading" border :data="tableDataLog.data" style="width: 100%"> <el-table
<el-table-column prop="order_id" align="center" label="退款单ID" min-width="80" /> v-loading="LogLoading"
<el-table-column prop="change_message" label="操作记录" align="center" min-width="280" /> border
<el-table-column prop="change_time" label="操作时间" align="center" min-width="280" /> :data="tableDataLog.data"
style="width: 100%"
>
<el-table-column
prop="order_id"
align="center"
label="退款单ID"
min-width="80"
/>
<el-table-column
prop="change_message"
label="操作记录"
align="center"
min-width="280"
/>
<el-table-column
prop="change_time"
label="操作时间"
align="center"
min-width="280"
/>
</el-table> </el-table>
<div class="block"> <div class="block">
<el-pagination <el-pagination
@ -69,27 +133,36 @@
/> />
</div> </div>
<el-divider /> <el-divider />
<div v-if="(orderDatalist.status == 2 || orderDatalist.status == 3) && orderDatalist.refund_type == 2"> <div
v-if="
(orderDatalist.status == 2 || orderDatalist.status == 3) &&
orderDatalist.refund_type == 2
"
>
<div class="title">退货物流信息</div> <div class="title">退货物流信息</div>
<div class="acea-row"> <div class="acea-row">
<div class="description-term"> <div class="description-term">
快递公司：{{ orderDatalist.delivery_type }} 快递公司：{{ orderDatalist.delivery_type }}
<el-button size="small" type="text" style="margin-left: 10px;" @click="getLoginstics">物流查询</el-button> <el-button
size="small"
type="text"
style="margin-left: 10px;"
@click="getLoginstics"
>物流查询</el-button
>
</div>
<div class="description-term">
快递单号：{{ orderDatalist.delivery_id }}
</div> </div>
<div class="description-term">快递单号：{{ orderDatalist.delivery_id }}</div>
</div> </div>
</div> </div>
</div> </div>
</el-dialog> </el-dialog>
</template> </template>
<script> <script>
import { refundorderLogApi } from "@/api/order";
import {
refundorderLogApi
} from '@/api/order'
export default { export default {
name: 'OrderDetail', name: "OrderDetail",
props: { props: {
orderDatalist: { orderDatalist: {
type: Object, type: Object,
@ -103,85 +176,83 @@ export default {
// orderDatalist: null, // orderDatalist: null,
loading: false, loading: false,
listLoading: true, listLoading: true,
order_id: '', order_id: "",
tableDataLog: { tableDataLog: {
data: [], data: [],
total: 0, total: 0
}, },
tableFromLog: { tableFromLog: {
page: 1, page: 1,
limit: 5 limit: 5
}, }
} };
},
mounted() {
}, },
mounted() {},
methods: { methods: {
// 订单记录 // 订单记录
onOrderLog(id) { onOrderLog(id) {
this.LogLoading = true this.LogLoading = true;
this.order_id = id; this.order_id = id;
refundorderLogApi(id, this.tableFromLog) refundorderLogApi(id, this.tableFromLog)
.then(res => { .then(res => {
this.tableDataLog.data = res.data.list this.tableDataLog.data = res.data.list;
this.tableDataLog.total = res.data.count this.tableDataLog.total = res.data.count;
this.LogLoading = false this.LogLoading = false;
}) })
.catch(res => { .catch(res => {
this.$message.error(res.message) this.$message.error(res.message);
this.LogLoading = false this.LogLoading = false;
}) });
}, },
/**查看物流 */ /**查看物流 */
getLoginstics(){ getLoginstics() {
this.$emit('get-logistics',this.orderDatalist) this.$emit("get-logistics", this.orderDatalist);
}, },
pageChangeLog(page) { pageChangeLog(page) {
this.tableFromLog.page = page this.tableFromLog.page = page;
this.onOrderLog(this.order_id) this.onOrderLog(this.order_id);
}, },
handleSizeChangeLog(val) { handleSizeChangeLog(val) {
this.tableFromLog.limit = val this.tableFromLog.limit = val;
this.onOrderLog(this.order_id) this.onOrderLog(this.order_id);
}, }
} }
} };
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.title{ .title {
margin-bottom: 16px; margin-bottom: 16px;
color: #17233d; color: #17233d;
font-weight: 500; font-weight: 500;
font-size: 14px; font-size: 14px;
} }
.description{ .description {
&-term { &-term {
display: table-cell;
padding-bottom: 10px;
line-height: 20px;
width: 50%;
font-size: 12px;
}
}
.description-term100{
display: table-cell; display: table-cell;
padding-bottom: 10px; padding-bottom: 10px;
line-height: 20px; line-height: 20px;
width: 100%; width: 50%;
font-size: 12px; font-size: 12px;
} }
.product_name{ }
margin-left: 90px; .description-term100 {
position: relative; display: table-cell;
top: -20px; padding-bottom: 10px;
} line-height: 20px;
.demo-image__preview { width: 100%;
.el-image,img{ font-size: 12px;
}
.product_name {
margin-left: 90px;
position: relative;
top: -20px;
}
.demo-image__preview {
.el-image,
img {
width: 40px; width: 40px;
height: 40px; height: 40px;
} }
} }
</style> </style>