fix: 订单管理页面增加退菜功能，修复代客下单清空后无法正常添加商品
This commit is contained in:
@@ -356,7 +356,6 @@ export const useCartsStore = defineStore("carts", () => {
|
||||
originAmount: 0
|
||||
}
|
||||
vipUser.value = {}
|
||||
table_code.value = ''
|
||||
}
|
||||
|
||||
// 寻找套餐商品sku
|
||||
|
||||
@@ -110,7 +110,18 @@
|
||||
<!-- <el-table-column type="selection" width="55" /> -->
|
||||
<el-table-column label="数量" type="selection">
|
||||
<template v-slot="scope">
|
||||
<el-checkbox v-model="scope.row.checked" />
|
||||
<div v-if="detail.status == 'unpaid'">
|
||||
<el-checkbox
|
||||
v-if="scope.row.num - scope.row.returnNum > 0"
|
||||
v-model="scope.row.checked"
|
||||
/>
|
||||
</div>
|
||||
<div v-else>
|
||||
<el-checkbox
|
||||
v-if="scope.row.num - scope.row.refundNum > 0"
|
||||
v-model="scope.row.checked"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="商品">
|
||||
@@ -141,20 +152,35 @@
|
||||
<el-table-column label="实付">
|
||||
<template v-slot="scope">￥{{ scope.row.payAmount }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="可退款数量" align="center">
|
||||
|
||||
<el-table-column v-if="detail.status == 'unpaid'" label="可退菜数量" align="center">
|
||||
<template v-slot="scope">
|
||||
<el-input-number
|
||||
v-if="scope.row.checked"
|
||||
:min="0"
|
||||
style="width: 120px"
|
||||
v-model="scope.row.selNumber"
|
||||
:max="scope.row.num - scope.row.returnNum"
|
||||
></el-input-number>
|
||||
<span class="" v-else>{{ scope.row.num - scope.row.returnNum }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column v-else label="可退款数量" align="center">
|
||||
<template v-slot="scope">
|
||||
<el-input-number
|
||||
v-if="scope.row.checked"
|
||||
:min="0"
|
||||
style="width: 120px"
|
||||
v-model="scope.row.selNumber"
|
||||
:max="scope.row.num - scope.row.refundNum"
|
||||
></el-input-number>
|
||||
<span class="" v-else>0</span>
|
||||
<span class="" v-else>{{ scope.row.num - scope.row.refundNum }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="已退" width="100" align="center">
|
||||
<template v-slot="scope">
|
||||
<span>{{ scope.row.refundNum }}</span>
|
||||
<span v-if="detail.status == 'unpaid'">{{ scope.row.returnNum }}</span>
|
||||
<span v-else>{{ scope.row.refundNum }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作">
|
||||
@@ -173,18 +199,19 @@
|
||||
<template v-if="detail.status == 'unpaid'">
|
||||
<el-button
|
||||
v-if="canTuicai(scope.row)"
|
||||
type="text"
|
||||
link
|
||||
size="small"
|
||||
@click="tuiCai(scope.row)"
|
||||
@click="tuicai(scope.row)"
|
||||
>
|
||||
<span>退菜</span>
|
||||
</el-button>
|
||||
<span class="color-999" v-if="scope.row == 'return'">已退菜</span>
|
||||
<span class="color-999" v-else>已退菜</span>
|
||||
</template>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</template>
|
||||
<!-- 退款 -->
|
||||
<div
|
||||
class="u-p-20 u-flex u-row-right"
|
||||
v-if="detail.status !== 'refund' && detail.status !== 'unpaid'"
|
||||
@@ -196,9 +223,19 @@
|
||||
></el-checkbox>
|
||||
<el-button type="danger" class="u-m-l-20" @click.stop="tuikuan('all')">退款</el-button>
|
||||
</div>
|
||||
<!-- 退菜 -->
|
||||
<div class="u-p-20 u-flex u-row-right" v-if="detail.status == 'unpaid'">
|
||||
<el-checkbox
|
||||
v-model="allSelected"
|
||||
@change="allSelectedChange"
|
||||
label="全选"
|
||||
></el-checkbox>
|
||||
<el-button type="danger" class="u-m-l-20" @click.stop="tuicai('all')">退菜</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-drawer>
|
||||
<!-- 退款 -->
|
||||
<return-money
|
||||
:modal="false"
|
||||
ref="refReturnMoney"
|
||||
@@ -206,11 +243,14 @@
|
||||
:goods="selGoods"
|
||||
@confirm="refReturnMoneyConfirm"
|
||||
></return-money>
|
||||
<!-- 退菜 -->
|
||||
<return-cart ref="refReturnCart" @confirm="refReturnCartConfirm"></return-cart>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import returnMoney from "./return-money.vue";
|
||||
import returnCart from "./return-cart.vue";
|
||||
import { ElMessage } from "element-plus";
|
||||
import { returnOptionsLabel } from "../config/config";
|
||||
import * as $util from "../order_goods_util.js";
|
||||
@@ -221,6 +261,7 @@ import dayjs from "dayjs";
|
||||
export default {
|
||||
components: {
|
||||
returnMoney,
|
||||
returnCart,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
@@ -366,10 +407,9 @@ export default {
|
||||
this.tbOrderInfoDetail(this.detail.id);
|
||||
},
|
||||
async refReturnCartConfirm(e) {
|
||||
const res = await $returnCart({
|
||||
const res = await orderApi.refundOrder({
|
||||
...e,
|
||||
cartId: this.selGoods.cartId,
|
||||
tableId: this.detail.tableId,
|
||||
orderId: this.detail.id,
|
||||
});
|
||||
ElMessage.success("退菜成功");
|
||||
this.update();
|
||||
@@ -393,10 +433,24 @@ export default {
|
||||
this.selGoods = item;
|
||||
this.$refs.refReturnMoney.open(arr, this.detail);
|
||||
},
|
||||
tuiCai(item) {
|
||||
this.selGoods = item;
|
||||
console.log(item);
|
||||
this.$refs.refReturnCart.open(item);
|
||||
tuicai(item) {
|
||||
let arr = [];
|
||||
if (item === "all") {
|
||||
for (let i in this.detail.detailMap) {
|
||||
this.detail.detailMap[i].map((v) => {
|
||||
if (v.checked && v.selNumber) {
|
||||
arr.push(v);
|
||||
}
|
||||
});
|
||||
}
|
||||
} else {
|
||||
arr = [item];
|
||||
}
|
||||
if (arr.length == 0) {
|
||||
return ElMessage.error("请选择要退菜的商品和数量");
|
||||
}
|
||||
console.log(arr);
|
||||
this.$refs.refReturnCart.open(arr, this.detail);
|
||||
},
|
||||
|
||||
// 获取订单详情
|
||||
@@ -411,10 +465,11 @@ export default {
|
||||
}
|
||||
for (let i in res.detailMap) {
|
||||
res.detailMap[i] = res.detailMap[i].map((v) => {
|
||||
console.log(v.num - (res.status == "unpaid" ? v.returnNum : v.refundNum));
|
||||
return {
|
||||
...v,
|
||||
checked: false,
|
||||
selNumber: v.num - v.returnNum,
|
||||
selNumber: v.num - (res.status == "unpaid" ? v.returnNum : v.refundNum),
|
||||
};
|
||||
});
|
||||
}
|
||||
|
||||
195
src/views/order/index/components/return-cart.vue
Normal file
195
src/views/order/index/components/return-cart.vue
Normal file
@@ -0,0 +1,195 @@
|
||||
<template>
|
||||
<el-dialog title="退菜" width="410px" v-model="show" @close="reset" :modal="modal">
|
||||
<div
|
||||
class="u-p-b-16 u-m-t-10 flex u-row-between border-bottom"
|
||||
v-for="(goods, index) in goodsList"
|
||||
:key="index"
|
||||
>
|
||||
<div class="">
|
||||
<div>菜品名称</div>
|
||||
<div class="u-m-t-10">
|
||||
{{ goods.productName || "" }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="">
|
||||
<div>退菜数量</div>
|
||||
<div class="u-flex u-m-t-10">
|
||||
<el-input-number
|
||||
:min="1"
|
||||
v-model="goods.selNumber"
|
||||
:max="goods.num - goods.refundNum"
|
||||
></el-input-number>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="u-m-t-20">
|
||||
<div>
|
||||
<span>退菜原因</span>
|
||||
<span class="color-red">*</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="u-flex u-flex-wrap tags">
|
||||
<div
|
||||
class="tag"
|
||||
v-for="(tag, index) in tags"
|
||||
@click="changeSel(tag)"
|
||||
:key="index"
|
||||
:class="{ active: tag.checked }"
|
||||
>
|
||||
{{ tag.label }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="u-m-t-20">
|
||||
<el-input v-model="note" placeholder="请输入自定义备注"></el-input>
|
||||
</div>
|
||||
<div class="u-m-t-20">
|
||||
<el-checkbox v-model="isPrint">打印退菜单</el-checkbox>
|
||||
</div>
|
||||
<template #footer>
|
||||
<div>
|
||||
<el-button @click="close">取消</el-button>
|
||||
<el-button type="primary" @click="confirm">确定</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
<script>
|
||||
import { ElMessage } from "element-plus";
|
||||
export default {
|
||||
props: {
|
||||
modal: {
|
||||
type: Boolean,
|
||||
default: true,
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
max: 1,
|
||||
number: 1,
|
||||
isPrint: false,
|
||||
tagSel: -1,
|
||||
show: false,
|
||||
tags: [
|
||||
{ label: "不想要了", checked: false },
|
||||
{ label: "食材不足", checked: false },
|
||||
{ label: "等待时间过长", checked: false },
|
||||
],
|
||||
note: "",
|
||||
goodsList: [],
|
||||
orderDetail: {},
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
isSeatFee() {
|
||||
return false;
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
changeSel(item) {
|
||||
item.checked = !item.checked;
|
||||
},
|
||||
reset() {
|
||||
this.note = "";
|
||||
this.number = 1;
|
||||
this.tags.map((v) => {
|
||||
v.checked = false;
|
||||
});
|
||||
console.log(this.number);
|
||||
},
|
||||
delTag(index) {
|
||||
this.tags.splice(index, 1);
|
||||
},
|
||||
addNote(tag) {
|
||||
if (this.note.length <= 0) {
|
||||
return (this.note = tag);
|
||||
}
|
||||
this.note = tag + "," + this.note;
|
||||
},
|
||||
open(arr, detail) {
|
||||
console.log(arr);
|
||||
console.log(detail);
|
||||
this.goodsList = arr;
|
||||
this.orderDetail = detail;
|
||||
this.show = true;
|
||||
if (item.productId != "-999") {
|
||||
this.number = 1;
|
||||
} else {
|
||||
this.number = this.max;
|
||||
}
|
||||
},
|
||||
close() {
|
||||
this.show = false;
|
||||
this.number = 1;
|
||||
},
|
||||
confirm() {
|
||||
const selTag = this.tags
|
||||
.filter((item) => item.checked)
|
||||
.map((item) => item.label)
|
||||
.join(",");
|
||||
const note = selTag + (this.note.length > 0 ? "," + this.note : "");
|
||||
console.log(note);
|
||||
if (!note) {
|
||||
return ElMessage.error("请输入退菜原因");
|
||||
}
|
||||
this.$emit("confirm", {
|
||||
refundReason: note,
|
||||
refundAmount: 0,
|
||||
refundDetails: this.goodsList
|
||||
.filter((v) => v.selNumber)
|
||||
.map((v) => {
|
||||
return {
|
||||
id: v.id,
|
||||
num: v.selNumber,
|
||||
returnAmount: 0,
|
||||
};
|
||||
}),
|
||||
});
|
||||
this.close();
|
||||
},
|
||||
},
|
||||
mounted() {},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
:deep(.el-dialog__body) {
|
||||
margin-bottom: 14px;
|
||||
margin-top: 14px;
|
||||
padding: 0 20px;
|
||||
}
|
||||
:deep(.el-tag) {
|
||||
margin-top: 10px;
|
||||
margin-right: 10px;
|
||||
margin-bottom: 5px;
|
||||
cursor: pointer;
|
||||
font-size: 15px;
|
||||
line-height: 35px;
|
||||
height: 35px;
|
||||
}
|
||||
.tags {
|
||||
.tag {
|
||||
margin: 10px 10px 0 0;
|
||||
border: 1px solid #dcdfe6;
|
||||
border-radius: 4px;
|
||||
padding: 10px 13px;
|
||||
font-size: 14px;
|
||||
color: #000;
|
||||
cursor: pointer;
|
||||
&.active {
|
||||
color: #1890ff;
|
||||
background: #e8f4ff;
|
||||
border-color: #a3d3ff;
|
||||
}
|
||||
}
|
||||
}
|
||||
:deep(.number-box .el-input__inner::-webkit-inner-spin-button) {
|
||||
-webkit-appearance: none;
|
||||
margin: 0;
|
||||
}
|
||||
:deep(.number-box .el-input__inner::-webkit-outer-spin-button) {
|
||||
-webkit-appearance: none;
|
||||
margin: 0;
|
||||
}
|
||||
</style>
|
||||
@@ -13,7 +13,7 @@ export function returnPackFee(arr) {
|
||||
}
|
||||
|
||||
export function canTuicai(orderInfo, item) {
|
||||
return true;
|
||||
return orderInfo.status == "unpaid" && item.num - item.returnNum > 0;
|
||||
}
|
||||
export function canTuiKuan(orderInfo, item) {
|
||||
return (orderInfo.status != "refund" && orderInfo.status != "unpaid") || item.status != "refund";
|
||||
|
||||
Reference in New Issue
Block a user