优化

src/views/order/console.vue

@@ -17,7 +17,7 @@
                             <span>{{ data.currentNum + '/' + data.deskCap }}</span>
                         </div>
                     </template>
-                    <el-scrollbar ref="scrollbarRef" height="500px">
+                    <el-scrollbar ref="scrollbarRef" class="scrollbar">
                         <div ref="innerRef">
                             <el-empty
                                 v-if="data.selectGoods.length == 0 ? true : false"
@@ -43,26 +43,36 @@
                         type="textarea"
                     />
                     <el-divider />
-                    <el-alert :closable="false">
+                    <el-alert :closable="false" style="padding: 8px 0px;">
                         <template #title>
                             <div class="justify-between flex w-full">
-                                <div class="text-xl">
-                                    价格：<b
+                                <div class="text-xl" style="font-size: 14px;">
+                                    出单价格：<b
                                         style="color: sandybrown"
                                         v-text="orderData.priceSum.toFixed(2)"
                                     ></b>
                                 </div>
+                                <div class="text-xl">
+                                    总价格：<b
+                                        style="color: sandybrown"
+                                        v-text="orderData.sumPriceSum.toFixed(2)"
+                                    ></b>
+                                </div>
                             </div>
                         </template>
                         <template #default>
-                            <div>
+                            <div class="flex" style="justify-content: space-between;">
+                                <div class="text-xl" style="font-size: 14px;">
+                                    出单数量：<b v-text="orderData.numSum.toString()"></b>
+                                </div>
                                 <div class="text-xl">
-                                    数量：<b v-text="orderData.numSum.toString()"></b>
+                                    总数量：<b v-text="orderData.sumNumSum.toString()"></b>
                                 </div>
-                            </div> </template
+                            </div> 
+                        </template
                     ></el-alert>
                     <div class="pt-2 justify-between flex">
-                        <el-button @click="toEmpty()">清空</el-button
+                        <el-button @click="toEmpty()">清空未出单菜品</el-button
                         ><span>
                             <!-- <el-button type="primary">打折</el-button> -->
                             <el-button type="primary" @click="submit()">出单</el-button></span
@@ -158,7 +168,7 @@ const innerRef = ref<HTMLDivElement>()
 const dishCate = ref<any[]>([])
 const dishList = ref<any[]>([])
 let dishListall: any[] = []
-const orderLoading = ref(false)
+var orderLoading = ref(false)
 const scrollbarRef = ref<InstanceType<typeof ElScrollbar>>()
 const search = ref('')
 const emit = defineEmits(['init'])
@@ -173,7 +183,10 @@ const data = reactive<any>({
 })
 const orderData = reactive<any>({
     priceSum: 0,
-    numSum: 0
+    sumPriceSum: 0,
+    numSum: 0,
+    sumNumSum: 0,
+    
 })
 const params = reactive({
     remark: '', //订单备注
@@ -190,9 +203,14 @@ const submit = () => {
         // data.selectGoods.length = 0
         // orderData.priceSum = 0
         // orderData.numSum = 0
+        //把所有餐品的状态修改为出单
+        data.selectGoods.forEach((good: { status: number }) => {
+            good.status = 1
+        })
         emit('init')
         feedback.closeLoading()
         feedback.notifySuccess('出单成功')
+        
     })
 }
 const open = (item: any, num?: number, orderNumber?: any) => {
@@ -201,14 +219,23 @@ const open = (item: any, num?: number, orderNumber?: any) => {
     data.deskCap = item.num
     data.currentNum = item.userNum ? item.userNum : num
     params.number = item.ordersId ? item.ordersId : orderNumber
-
+    //查询当前订单下的所有菜品
     deskOrderedDishListAll({ id: params.number }).then((res) => {
         data.selectGoods = res
         data.oldGoods = JSON.parse(JSON.stringify(res));//记录下进入时当前餐桌已有的食物
         if (res.length > 0) {
-            params.remark = res[0].remark
-            orderData.priceSum = res.reduce((accumulator, currentValue) => accumulator + (currentValue.summary * currentValue.num), 0);
-            orderData.numSum = res.reduce((accumulator, currentValue) => accumulator + currentValue.num, 0);
+            params.remark = res[0].remark;
+            let _list = res.filter((it: { status: number })=>it.status!=1);//找到没有出单的餐品来计算价格
+            orderData.priceSum = _list.reduce((accumulator, currentValue) => accumulator + (currentValue.summary * currentValue.num), 0);
+            orderData.numSum = _list.reduce((accumulator, currentValue) => accumulator + currentValue.num, 0);
+            //所有餐品的总价以及总数量
+            orderData.sumPriceSum = res.reduce((accumulator, currentValue) => accumulator + (currentValue.summary * currentValue.num), 0);
+            orderData.sumNumSum = res.reduce((accumulator, currentValue) => accumulator + currentValue.num, 0);
+        }else{
+            orderData.priceSum = 0
+            orderData.numSum = 0
+            orderData.sumPriceSum = 0
+            orderData.sumNumSum = 0
         }
     })
 }
@@ -223,11 +250,20 @@ const clickSortButton = (name: any) => {
         })
     }
 }
+//清空订单下的菜品
 const toEmpty = () => {
     if (data.selectGoods.length != 0) {
-        data.selectGoods.length = 0
+        //清空未出单的餐品-保留出单餐品
+        data.selectGoods = data.selectGoods.filter((good) => {
+            return good.status == 1
+        })
+        orderData.sumPriceSum = data.selectGoods.reduce((accumulator, currentValue) => accumulator + (currentValue.summary * currentValue.num), 0);
+        orderData.sumNumSum = data.selectGoods.reduce((accumulator, currentValue) => accumulator + currentValue.num, 0);
+        // data.selectGoods.length = 0
         orderData.priceSum = 0
         orderData.numSum = 0
+        // orderData.sumPriceSum = 0
+        // orderData.sumNumSum = 0
         toEmptyy({ id: params.number })
     }
 }
@@ -259,22 +295,29 @@ const isEqual = (obj1: { [x: string]: any } | null, obj2: { [x: string]: any } |
 }
 const beforeClose = () => {
     //data.oldGoods
-    if(isEqual(data.selectGoods,data.oldGoods)){
-        showOrderConsole.value = false;
-        return false;
-    }
-    if (data.selectGoods && data.selectGoods.length > 0) {
-        feedback.confirm('所点菜品信息将不被保存，确认关闭？').then(() => {
-            toEmpty()
-        })
-    }
+    // if(isEqual(data.selectGoods,data.oldGoods)){
+    //     showOrderConsole.value = false;
+    //     emit('init')
+    //     return false;
+    // }
+    // if (data.selectGoods && data.selectGoods.length > 0) {
+    //     feedback.confirm('所点菜品信息将不被保存，确认关闭？').then(() => {
+    //         toEmpty()
+    //     })
+    // }
     showOrderConsole.value = false
+    emit('init')
 }
 const add = (item: any) => {
     addGoods(item)
 }
 const addGoods = (item: any) => {
+    console.warn("***addGoods-reject0***",orderLoading.value)
+    if(orderLoading.value){
+        return false;
+    }
     orderLoading.value = true
+    console.warn("***addGoods-reject1***",orderLoading.value)
     const tempGoods = data.selectGoods.filter((element: any) => {
         return element.id == item.id
     })
@@ -288,22 +331,38 @@ const addGoods = (item: any) => {
             item.ordersDishId = res
             data.selectGoods.push(item)
             feedback.msgSuccess('成功添加商品' + item.title)
-            orderLoading.value = false
-            console.log(item)
+            addHandle(item)
+        }).finally(()=>{
+            orderLoading.value = false;
+            nextTick(() => {
+                scrollbarRef.value!.setScrollTop(innerRef.value!.clientHeight)
+            })
         })
     } else {
-        dishInc({ id: item.ordersDishId })
-        data.selectGoods[data.selectGoods.indexOf(tempGoods[0])].num++
-        orderLoading.value = false
+        dishInc({ id: item.ordersDishId || item.id }).then(()=>{
+            data.selectGoods[data.selectGoods.indexOf(tempGoods[0])].num++
+            addHandle(item);
+        }).finally(()=>{
+            orderLoading.value = false;
+            nextTick(() => {
+                scrollbarRef.value!.setScrollTop(innerRef.value!.clientHeight)
+            })
+        })
     }
+    
+}
+//只有正常执行了接口才触发
+const addHandle = (item: { summary: any })=>{
     console.warn("***addGoods-dish***",item,data.selectGoods)
     orderData.numSum++
+    orderData.sumNumSum++
     orderData.priceSum += Number(item.summary)
-    nextTick(() => {
-        scrollbarRef.value!.setScrollTop(innerRef.value!.clientHeight)
-    })
+    orderData.sumPriceSum += Number(item.summary)
 }
 const reduce = (item: any) => {
+    if(orderLoading.value){
+        return false;
+    }
     orderLoading.value = true
     const tempGoods = data.selectGoods.filter((element: any) => {
         return element.id == item.id
@@ -311,26 +370,40 @@ const reduce = (item: any) => {
     const t = data.selectGoods.indexOf(tempGoods[0])
     const n = data.selectGoods[t].num
     if (n > 1) {
-        dishDec({ id: item.ordersDishId }).then(() => {
+        dishDec({ id: item.ordersDishId || item.id}).then(() => {
             data.selectGoods[t].num--
-            orderLoading.value = false
+            reduceHandle(item)
+        }).finally(()=>{
+            orderLoading.value = false;
         })
     } else {//餐品数量为0，要删减该餐品
-        dishDel({ id: item.ordersDishId }).then(() => {
+        dishDel({ id: item.ordersDishId || item.id}).then(() => {
             data.selectGoods.splice(t, 1)
-            orderLoading.value = false
+            reduceHandle(item)
+        }).finally(()=>{
+            orderLoading.value = false;
         })
     }
+}
+//只有正常执行了接口才触发
+const reduceHandle = (item: { summary: number })=>{
     console.warn("***reduce-dish***",item,data.selectGoods)
     orderData.numSum--
+    orderData.sumNumSum--
     orderData.priceSum -= item.summary
+    orderData.sumPriceSum -= item.summary
     if(orderData.priceSum <= 0){
         orderData.priceSum = 0;
     }
     if(orderData.numSum <= 0){
         orderData.numSum = 0;
     }
-    orderLoading.value = false
+    if(orderData.sumPriceSum <= 0){
+        orderData.sumPriceSum = 0;
+    }
+    if(orderData.sumNumSum <= 0){
+        orderData.sumNumSum = 0;
+    }
 }
 onMounted(() => {
     dishCateAll().then((res) => {
@@ -345,4 +418,11 @@ defineExpose({
     open
 })
 </script>
-<style></style>
+<style lang="scss">
+    .el-alert__content{
+        width: 100%;
+    }
+    .scrollbar{
+        height:calc(100vh - 54px - 32px - 16px - 61px - 20px - 52px - 49px - 64px - 40px);
+    }
+</style>

src/views/order/goodsItem.vue

@@ -1,16 +1,18 @@
 <template>
     <div class="goods-item">
         <el-card class="w-full" shadow="never" :body-style="{ padding: '10px' }">
-            <p class="text-xl font-bold">{{ props.goodsItem.title }}</p>
+            <p class="text-xl font-bold flex" style="justify-content: space-between;">{{ props.goodsItem.title }}
+            <span v-if="props.goodsItem.status==1" class="p-1 rounded ml-2" style="background-color: #e0eee0;font-size: 12px;color:red;height: 20px;padding: 2px;">已出单</span>
+            </p>
             <div>
                 <b style="color: coral">{{ props.goodsItem.summary }}</b
                 ><span class="p-1 rounded ml-2" style="background-color: #e0eee0">{{
                     '×' + props.goodsItem.num
                 }}</span>
                 <span class="float-right">
-                    <el-button-group size="small">
-                        <el-button @click="reduce()"> - </el-button>
-                        <el-button @click="add()"> + </el-button>
+                    <el-button-group size="small" >
+                        <el-button @click="reduce()" :disabled="props.goodsItem.status==1"> - </el-button>
+                        <el-button @click="add()" :disabled="props.goodsItem.status==1"> + </el-button>
                     </el-button-group></span
                 >
             </div>

src/views/order/index.vue

@@ -130,11 +130,11 @@ const order = () => {
         init()
     })
     console.warn("***order***",currentDesk)
-    router.push({ path: '/order/console', query: { deskID: id } })
+    // router.push({ path: '/order/console', query: { deskID: id } })
 }
 const reorder = () => {
     dialogVisible.value = false
-    consoleRef.value?.open(currentDesk)
+    consoleRef.value?.open(currentDesk);//继续下单时会把当前餐桌上的订单号ordersId传进去
     console.warn("***reorder***",currentDesk)
 }
 const refresh = () => {