优化订单打印 新增小票订单数

src/views/home/index.vue

@@ -86,13 +86,24 @@
           <div class="order_list_wrap">
             <div class="order_title" :class="{ border: !goodsStore.cartList.length }"
               v-if="goodsStore.orderList.length">
-              历史下单
+              <span class="l">历史下单</span>
+              <div class="del" @click="goodsStore.clearHistoryOrder()">
+                <el-icon class="icon">
+                  <Delete />
+                </el-icon>
+                <span>清空历史订单</span>
+              </div>
             </div>
             <CartItem
               :item="{ product_name: '客座费', number: goodsStore.tableInfo.num, lowPrice: store.shopInfo.tableFee, memberPrice: store.shopInfo.tableFee }"
               v-if="!store.shopInfo.isTableFee && goodsStore.tableInfo.id" />
             <div class="order_list_item" v-for="(arr, index) in goodsStore.orderList" :key="index">
-              <div class="order_num">{{ `第${arr.orderNum}次下单` }}</div>
+              <div class="order_num">
+                <span class="l">{{ `第${arr.orderNum}次下单` }}</span>
+                <div class="del" @click="goodsStore.deleteHistoryOrder(arr.orderNum)">
+                  <span>删除</span>
+                </div>
+              </div>
               <CartItem type="order" :border="false" :item="item" :index="index" :i="i" :key="item.id"
                 v-for="(item, i) in arr.goods" />
             </div>
@@ -380,20 +391,38 @@ function clearVipUserHandle() {
 
   .order_title {
     display: flex;
-    justify-content: center;
-    font-size: 14px;
-    color: #999;
-    padding: 10px 0;
+    align-items: center;
+    justify-content: space-between;
+    padding: 10px var(--el-font-size-base);
 
     &.border {
       border-top: 1px solid #ececec;
     }
+
+    .l {
+      color: var(--el-color-warning);
+    }
+
+    .del {
+      font-size: 12px;
+      display: flex;
+      align-items: center;
+
+      .icon {
+        margin-right: 4px;
+        position: relative;
+        top: 1px;
+      }
+    }
   }
 
   .order_num {
     font-size: 12px;
     color: #999;
     padding: var(--el-font-size-base) var(--el-font-size-base) 10px;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
   }
 }