优化订单退款

This commit is contained in:
gyq
2025-03-12 09:55:07 +08:00
parent 1e66b2ad1f
commit 48c9f24d4c
17 changed files with 191 additions and 16211 deletions

View File

@@ -29,11 +29,11 @@
<template #prepend></template>
</el-input>
<template v-else>
退款金额{{ formatDecimal(refundType == 1 ? item.originAmount : amount) }}
退款金额{{ formatDecimal(refundType == 1 ? item.originAmount - item.refundAmount : amount) }}
</template>
</div>
</div>
<el-table ref="tableRef" :data="item.goods" brder stripe @selection-change="tabSelectChange">
<el-table ref="tableRef" :data="item.onGoods" brder stripe @selection-change="tabSelectChange">
<el-table-column type="selection" width="35" :selectable="selectable"></el-table-column>
<el-table-column label="商品信息">
<template v-slot="scope">
@@ -57,12 +57,45 @@
</el-table-column>
<el-table-column label="退款数量" width="170">
<template v-slot="scope">
<el-input-number v-model="scope.row.refundNum" :min="1" :max="+scope.row.num"
<el-input-number v-model="scope.row.refund_number" :min="1" :max="scope.row.num"
style="width: 130px;" @change="numberChange">
</el-input-number>
</template>
</el-table-column>
</el-table>
<template v-if="item.returnGoods.length">
<div class="tips" style="margin-top: 20px;padding-bottom: 10px;">以下为已退部分退单/退菜</div>
<el-table :data="item.returnGoods" brder stripe>
<el-table-column label="商品信息">
<template v-slot="scope">
<div class="goods_info">
<el-image :src="scope.row.productImg" style="width: 50px;height: 50px;"></el-image>
<div class="info">
<div class="name">
<span>{{ scope.row.productName }}</span>
</div>
<div class="sku" v-if="scope.row.skuName">{{ scope.row.skuName }}</div>
<div class="sku">{{ formatDecimal(+scope.row.payAmount) }}</div>
</div>
</div>
</template>
</el-table-column>
<el-table-column label="订单数量" prop="num" width="100"></el-table-column>
<el-table-column label="支付金额" width="100">
<template v-slot="scope">
{{ formatDecimal(+scope.row.payAmount) }}
</template>
</el-table-column>
<el-table-column label="已退款数量" width="170">
<template v-slot="scope">
<div class="column">
<div class="row">退单数量{{ scope.row.refundNum }}</div>
<div class="row">退菜数量{{ scope.row.returnNum }}</div>
</div>
</template>
</el-table-column>
</el-table>
</template>
<div class="ipt">
<el-input type="textarea" v-model="remark" placeholder="请输入退单原因" />
</div>
@@ -153,9 +186,9 @@ async function refundHandle(cash = false) {
if (refundType.value != 1) {
refundDetails = tableRef.value.getSelectionRows().map(val => {
return {
id: item.value.id,
id: val.id,
returnAmount: val.payAmount,
num: val.refundNum
num: val.refund_number
}
})
}
@@ -209,7 +242,7 @@ function numberChange() {
function tabSelectChange(val) {
amount.value = 0
val.map(item => {
amount.value += item.refundNum * item.payAmount
amount.value += item.refund_number * item.payAmount
})
}
@@ -230,10 +263,29 @@ function resetDrawer() {
function show(row) {
isShow.value = true
item.value = { ...row }
let onGoods = []
let returnGoods = []
item.value.goods.map(item => {
item.refundNum = item.num
// 可退的最大数量,下单数量 - 已退数量 - 退菜数量
let refundMaxNum = item.num - item.refundNum - item.returnNum
if (refundMaxNum <= 0) {
// 已经退过,不在允许操作
returnGoods.push(item)
} else {
// 可以操作的退款数量
item.refund_number = item.num
onGoods.push(item)
}
})
item.value.onGoods = onGoods
item.value.returnGoods = returnGoods
console.log('item.value===', item.value);
resetDrawer()
setTimeout(() => {

View File

@@ -17,11 +17,17 @@
<div class="table_wrap">
<div class="table">
<el-table :data="tableData.list" v-loading="tableData.loading" border strip height="100%">
<el-table-column label="台桌" prop="tableName" width="80"></el-table-column>
<el-table-column label="订单信息" width="240">
<el-table-column label="台桌" prop="tableName" width="80" align="center">
<template v-slot="scope">
<span v-if="scope.row.tableName">{{ scope.row.tableName }}</span>
<span v-else></span>
</template>
</el-table-column>
<el-table-column label="订单信息" width="340">
<template v-slot="scope">
<div class="column">
<div class="row">订单号{{ scope.row.orderNo }}</div>
<div class="row">下单时间{{ scope.row.createTime }}</div>
<div class="row">
订单类型{{ filterLable("orderType", scope.row.orderType) }}
</div>
@@ -69,9 +75,14 @@
<template v-slot="scope">
<div class="column">
<div class="row">
<el-button type="primary" @click="RefundDrawerRef.show(scope.row)">订单退款</el-button>
<el-button type="warning" :disabled="scope.row.status != 'unpaid'" :loading="scope.row.payLoading"
@click="orderDoneHandle(scope.row)">结算订单</el-button>
</div>
<div class="row" style="margin-top: 10px">
<div class="row">
<el-button type="primary" :disabled="refundState(scope.row.status)"
@click="RefundDrawerRef.show(scope.row)">订单退款</el-button>
</div>
<div class="row">
<el-button type="success" @click="PrintDrawerRef.show(scope.row)">
订单打印
</el-button>
@@ -92,19 +103,26 @@
<RefundDrawer ref="RefundDrawerRef" @success="queryFormHandle" />
<!-- 打印操作 -->
<PrintDrawer ref="PrintDrawerRef" />
<!-- 结算订单 -->
<SettleAccount ref="SettleAccountRef" @success="orderListAjax" />
</template>
<script setup>
import { onMounted, ref, reactive } from "vue";
import { orderList } from "@/api/order.js";
import { useGlobal } from "@/store/global.js";
import { useGoods } from '@/store/goods.js'
import DateRange from "./components/dateRange.vue";
import RefundDrawer from "./components/refundDrawer.vue";
import PrintDrawer from "./components/printDrawer.vue";
import SettleAccount from '@/views/home/components/settleAccount.vue'
const RefundDrawerRef = ref(null);
const PrintDrawerRef = ref(null);
const DateRangeRef = ref(null);
const SettleAccountRef = ref(null)
const goodsStore = useGoods()
const globalStore = useGlobal();
const queryForm = ref({
@@ -154,11 +172,51 @@ function filterLable(key, type) {
}
}
// 过滤退款条件
function refundState(state) {
switch (state) {
case 'unpaid':
return true;
case 'in-production':
return false;
case 'wait-out':
return false;
case 'done':
return false;
case 'refunding':
return false;
case 'refund':
return true;
case 'part-refund':
return false;
case 'cancelled':
return true;
default:
break;
}
}
// 结算订单
async function orderDoneHandle(row) {
try {
row.payLoading = true
await goodsStore.historyOrderAjax('', row.id)
row.payLoading = false
goodsStore.calcCartInfo()
SettleAccountRef.value.show()
} catch (error) {
console.log(error);
}
}
// 获取订单列表
async function orderListAjax() {
try {
tableData.loading = true;
const res = await orderList(queryForm.value);
res.records.map(item => {
item.payLoading = false
})
tableData.list = [];
tableData.list = res.records;
tableData.total = +res.totalRow;
@@ -218,7 +276,7 @@ onMounted(() => {
.column {
display: flex;
flex-direction: column;
padding: 10px 0;
gap: 10px;
.row {
width: 100%;