czg_team/cashier_desktop
7
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

订单列表新增更多商品

Browse Source
This commit is contained in:
gyq
2025-12-06 15:46:21 +08:00
parent 91e094ee6b
commit 4ce20c91bb
3 changed files with 149 additions and 16999 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17003
dist-electron/main.js
View File

File diff suppressed because one or more lines are too long

112
src/views/order/components/allGoodsDialog.vue Normal file
View File

@@ -0,0 +1,112 @@
<!-- 全部商品弹窗 -->
<template>
<el-dialog :title="`全部商品（${allOrderGoods.length}）`" width="600px" v-model="allOrderGoodsShow" top="2vh"
@close="allOrderGoodsShow = false">
<div class="goods_wrap">
<div class="row" v-for="item in allOrderGoods" :key="item.id">
<div class="cover">
<el-image :src="item.productImg" fit="cover"
style="width: 100px;height: 100px;border-radius: 8px;"></el-image>
</div>
<div class="info">
<div class="name">
<span class="t">{{ item.productName }}</span>
<span class="amount">￥{{ formatDecimal(+item.payAmount) }}</span>
</div>
<div class="num remark">
<span>备注: {{ item.remark || "无" }}</span>
<div class="n">
<span>￥{{ formatDecimal(+item.unitPrice) }}</span>
<span>x{{ item.num }}</span>
</div>
</div>
<div class="num">
<span>出菜时间：{{ item.dishOutTime }}</span>
</div>
<div class="num">
<span>上菜时间：{{ item.foodServeTime }}</span>
</div>
<div class="num" v-if="item.returnNum">
<span>退菜数量：{{ item.returnNum }}</span>
</div>
<div class="num" v-if="item.refundNum">
<span>退单数量：{{ item.refundNum }}</span>
</div>
</div>
</div>
</div>
</el-dialog>
</template>
<script setup>
import { ref } from 'vue'
import { formatDecimal } from '@/utils/index.js'
const allOrderGoods = ref([])
const allOrderGoodsShow = ref(false)
function show(obj) {
allOrderGoodsShow.value = true
allOrderGoods.value = obj
}
defineExpose({
show
})
</script>
<style scoped lang="scss">
.goods_wrap {
height: 75vh;
overflow-y: auto;
.row {
display: flex;
padding: 10px 0;
&:not(:last-child) {
border-bottom: 1px solid #ececec;
}
.info {
flex: 1;
padding-left: 10px;
.name {
display: flex;
gap: 10px;
justify-content: space-between;
.t {
font-size: 16px;
font-weight: bold;
}
.amount {
font-size: 16px;
color: var(--el-color-danger);
}
}
.num {
color: #555;
font-size: 14px;
display: flex;
gap: 10px;
margin-top: 6px;
&.remark {
color: #999;
justify-content: space-between;
}
.n {
color: #999;
display: flex;
gap: 4px;
}
}
}
}
}
</style>

33
src/views/order/index.vue
View File

@@ -23,18 +23,24 @@
<span v-else>无</span>
</template>
</el-table-column>
<el-table-column label="商品信息" width="250">
<el-table-column label="商品信息" width="320">
<template v-slot="scope">
<div class="goods_wrap">
<div class="row" v-for="item in scope.row.goods" :key="item.id">
<div class="row" v-for="item in scope.row.goods.slice(0, 2)" :key="item.id">
<div class="cover">
<el-image :src="item.productImg" style="width: 40px;height: 40px;"></el-image>
<el-image :src="item.productImg" fit="cover" style="width: 40px;height: 40px;"></el-image>
</div>
<div class="info">
<div class="name">
<span>{{ item.productName }}</span>
<span class="amount">￥{{ formatDecimal(+item.payAmount) }}</span>
</div>
<div class="num">
<span>出菜时间：{{ item.dishOutTime }}</span>
</div>
<div class="num">
<span>上菜时间：{{ item.foodServeTime }}</span>
</div>
<div class="num">
备注: {{ item.remark || "无" }}
</div>
@@ -50,6 +56,11 @@
</div>
</div>
</div>
<div class="row" v-if="scope.row.goods.length > 2">
<el-button type="primary" @click="showMoreGoodsHandle(scope.row.goods)">
查看全部（{{ scope.row.goods.length }}）
</el-button>
</div>
</div>
</template>
</el-table-column>
@@ -77,12 +88,6 @@
<div class="row">
用餐模式：{{ filterLable("dineMode", scope.row.dineMode) }}
</div>
<div class="row">
出菜时间：{{ scope.row.dishOutTime }}
</div>
<div class="row">
上菜时间：{{ scope.row.foodServeTime }}
</div>
<div class="row">订单备注：{{ scope.row.remark }}</div>
</div>
</template>
@@ -159,6 +164,8 @@
<PrintDrawer ref="PrintDrawerRef" />
<!-- 结算订单 -->
<SettleAccount ref="SettleAccountRef" @success="orderListAjax" />
<!-- 全部商品 -->
<allGoodsDialog ref="allGoodsDialogRef" />
</template>
<script setup>
@@ -171,12 +178,14 @@ 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'
import allGoodsDialog from './components/allGoodsDialog.vue'
const RefundDrawerRef = ref(null);
const PrintDrawerRef = ref(null);
const DateRangeRef = ref(null);
const SettleAccountRef = ref(null)
const tableRef = ref(null);
const allGoodsDialogRef = ref(null)
const goodsStore = useGoods()
const globalStore = useGlobal();
@@ -228,7 +237,6 @@ function filterLable(key, type) {
}
}
// 过滤退款条件
function refundState(row) {
switch (row.status) {
@@ -303,6 +311,11 @@ function goodsNameFilter(goods) {
return goods.map((item) => item.productName).join("、");
}
// 查看全部订单商品
function showMoreGoodsHandle(goods) {
allGoodsDialogRef.value.show(goods)
}
onMounted(() => {
resetQueryForm.value = { ...queryForm.value };
queryFormHandle();