✨ feat(del): 添加删除弹窗

package.json

@@ -1,5 +1,5 @@
 {
-  "name": "fuintCashier",
+  "name": "fuint-cashier",
   "version": "1.0.0",
   "author": "延禾技术",
   "description": "海南延禾信息技术有限公司旗下收银系统",

src/renderer/views/cashier/components/hangUpDialog.vue

@@ -1,188 +1,230 @@
 <template>
-    <el-dialog class="common-dialog" title="挂单列表" :visible="showDialog" @close="close" width="1000px" destroy-on-close>
-        <el-alert title="提示：请选择一个空白位置挂单" type="warning" :closable="false"></el-alert>
-        <div class="order-list">
-          <div class="order-item" v-for="orderInfo in orderList">
-            <div class="info" v-if="!orderInfo.isEmpty">
-              <div class="sn">{{ orderInfo.hangNo }} <span @click="remove(orderInfo.hangNo)" class="remove el-icon-delete"></span></div>
-              <div class="order" v-if="!orderInfo.isEmpty" @click="getHangUp(orderInfo.hangNo, orderInfo.memberInfo)">
-                <div class="item">会员：{{ orderInfo.memberInfo ? orderInfo.memberInfo.name : '游客' }}</div>
-                <div class="item">件数：{{ orderInfo.num }}</div>
-                <div class="item">金额：￥{{ orderInfo.amount }}</div>
-                <div class="item time">{{ orderInfo.dateTime }}</div>
-              </div>
-            </div>
-            <div v-if="orderInfo.isEmpty" class="none" @click="doHangUp(orderInfo.hangNo)">
-              <div class="sn">{{ orderInfo.hangNo }} <span @click="remove(orderInfo.hangNo)" class="remove el-icon-delete"></span></div>
-              <div class="tips">空白位置</div>
+  <el-dialog
+    class="common-dialog"
+    title="挂单列表"
+    :visible="showDialog"
+    @close="close"
+    width="1000px"
+    destroy-on-close
+  >
+    <el-alert title="提示：请选择一个空白位置挂单" type="warning" :closable="false"></el-alert>
+    <div class="order-list">
+      <div class="order-item" v-for="orderInfo in orderList">
+        <div class="info" v-if="!orderInfo.isEmpty">
+          <div class="sn">
+            {{ orderInfo.hangNo }}
+            <span @click="remove(orderInfo.hangNo)" class="remove el-icon-delete"></span>
+          </div>
+          <div
+            class="order"
+            v-if="!orderInfo.isEmpty"
+            @click="getHangUp(orderInfo.hangNo, orderInfo.memberInfo)"
+          >
+            <div class="item">
+              会员：{{ orderInfo.memberInfo ? orderInfo.memberInfo.name : '游客' }}
             </div>
+            <div class="item">件数：{{ orderInfo.num }}</div>
+            <div class="item">金额：￥{{ orderInfo.amount }}</div>
+            <div class="item time">{{ orderInfo.dateTime }}</div>
           </div>
         </div>
-        <div class="clearfix"></div>
-        <div slot="footer" class="dialog-footer">
-            <el-button type="primary" class="main-button" @click="close()">关闭</el-button>
+        <div v-if="orderInfo.isEmpty" class="none" @click="doHangUp(orderInfo.hangNo)">
+          <div class="sn">
+            {{ orderInfo.hangNo }}
+            <span @click="remove(orderInfo.hangNo)" class="remove el-icon-delete"></span>
+          </div>
+          <div class="tips">空白位置</div>
         </div>
-    </el-dialog>
+      </div>
+    </div>
+    <div class="clearfix"></div>
+    <div slot="footer" class="dialog-footer">
+      <el-button type="primary" class="main-button" @click="close()">关闭</el-button>
+    </div>
+  </el-dialog>
 </template>
 <script>
-import { doHangUp, getHangUpList, removeHangUp } from "@/api/cashier";
-import { Message } from "element-ui";
+import { doHangUp, getHangUpList, removeHangUp } from '@/api/cashier'
+import { Message } from 'element-ui'
 export default {
-    props: {
-      showDialog: {
-        type:[Boolean],
-        default:()=>false
-      },
-      memberInfo: {
-         type:[Object],
-         default:()=>{}
-      },
-      cartList: {
-        type:[Array],
-        default:()=>[]
-      },
+  props: {
+    showDialog: {
+      type: [Boolean],
+      default: () => false,
     },
-    watch: {
-      showDialog(value) {
-        if (value) {
-            console.log('memberInfo = ', this.memberInfo)
-            this.getHangUpList();
-        }
-      }
+    memberInfo: {
+      type: [Object],
+      default: () => {},
     },
-    data(){
-        return {
-          loading: false,
-          orderList: []
-        }
+    cartList: {
+      type: [Array],
+      default: () => [],
+    },
+  },
+  watch: {
+    showDialog(value) {
+      if (value) {
+        console.log('memberInfo = ', this.memberInfo)
+        this.getHangUpList()
+      }
     },
-    methods: {
-        // 删除挂单
-        remove(hangNo) {
-          const app = this;
-          const param = { hangNo: hangNo };
-          removeHangUp(param).then( response => {
-            if (response) {
+  },
+  data() {
+    return {
+      loading: false,
+      orderList: [],
+    }
+  },
+  methods: {
+    // 删除挂单
+    remove(hangNo) {
+      const app = this
+      const param = { hangNo: hangNo }
+      this.$confirm('此操作将删除挂单, 是否继续?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning',
+      })
+        .then(() => {
+          removeHangUp(param)
+            .then((response) => {
+              if (response) {
                 Message({
-                  message: "删除挂单成功",
-                  type: "success"
-                });
-                app.getHangUpList();
-            }
-          }).catch(() => {
-             // empty
-          });
-        },
-        // 执行挂单
-        doHangUp(hangNo) {
-           const app = this;
-           if (!app.cartList || app.cartList.length < 1) {
-               Message({
-                 message: "请先添加结算商品",
-                 type: "error"
-               });
-               return false;
-           }
-           let cartIds = [];
-           app.cartList.forEach(function(cart) {
-              cartIds.push(cart.cartId);
-           })
-           const param = { hangNo: hangNo, userId: app.memberInfo ? app.memberInfo : '', cartIds: cartIds.join(',') };
-           doHangUp(param).then( response => {
-               if (response) {
-                   Message({
-                     message: "挂单成功",
-                     type: "success"
-                   });
-                   app.getHangUpList();
-                   app.$emit('doHangUp');
-               }
-           }).catch(() => {
+                  message: '删除挂单成功',
+                  type: 'success',
+                })
+                app.getHangUpList()
+              }
+            })
+            .catch(() => {
               // empty
-           });
-        },
-        // 获取挂单列表
-        getHangUpList() {
-          const app = this;
-          getHangUpList().then( response => {
-            if (response.data) {
-                app.orderList = response.data;
-            }
-          }).catch(() => {
-             // empty
-          });
-        },
-        // 取单
-        getHangUp(hangNo, memberInfo) {
-           this.$emit('getHangNo', { 'hangNo': hangNo, 'memberInfo': memberInfo });
-        },
-        close() {
-           this.$emit('closeDialog','hangUpDialog');
-        }
-    }
+            })
+        })
+        .catch(() => {
+          this.$message({
+            type: 'info',
+            message: '已取消删除',
+          })
+        })
+    },
+    // 执行挂单
+    doHangUp(hangNo) {
+      const app = this
+      if (!app.cartList || app.cartList.length < 1) {
+        Message({
+          message: '请先添加结算商品',
+          type: 'error',
+        })
+        return false
+      }
+      let cartIds = []
+      app.cartList.forEach(function (cart) {
+        cartIds.push(cart.cartId)
+      })
+      const param = {
+        hangNo: hangNo,
+        userId: app.memberInfo ? app.memberInfo : '',
+        cartIds: cartIds.join(','),
+      }
+      doHangUp(param)
+        .then((response) => {
+          if (response) {
+            Message({
+              message: '挂单成功',
+              type: 'success',
+            })
+            app.getHangUpList()
+            app.$emit('doHangUp')
+          }
+        })
+        .catch(() => {
+          // empty
+        })
+    },
+    // 获取挂单列表
+    getHangUpList() {
+      const app = this
+      getHangUpList()
+        .then((response) => {
+          if (response.data) {
+            app.orderList = response.data
+          }
+        })
+        .catch(() => {
+          // empty
+        })
+    },
+    // 取单
+    getHangUp(hangNo, memberInfo) {
+      this.$emit('getHangNo', { hangNo: hangNo, memberInfo: memberInfo })
+    },
+    close() {
+      this.$emit('closeDialog', 'hangUpDialog')
+    },
+  },
 }
 </script>
 <style lang="scss" scoped>
-  .order-list {
-     margin-top: 6px;
-     .order-item {
-         width: 20%;
-         float: left;
-         height: 200px;
-         cursor: pointer;
-         padding: 5px;
-         .info {
-           border: solid 1px #cccccc;
-           padding: 5px;
-           height: 100%;
-           border-radius: 4px;
-           background: #e6f7f7;
-           border: #113a28 solid 1px;
-           .sn {
-             font-weight: bold;
-             font-size: 20px;
-             color: #ff5b57;
-             .remove {
-               float: right;
-               font-size: 12px;
-               color: #666666;
-               font-weight: bold;
-             }
-           }
-           .order {
-              margin: 10px;
-              .item {
-                 margin-bottom: 3px;
-              }
-              .time {
-                 position: relative;
-                 bottom : -50px;
-                 color: #909399;
-              }
-           }
-         }
-         .none {
-            height: 100%;
-            color: #666666;
-            border: solid 1px #cccccc;
-            border-radius: 4px;
-            padding: 10px;
-            .tips {
-               line-height: 150px;
-               text-align: center;
-            }
-           .sn {
-             font-weight: bold;
-             font-size: 20px;
-             color: #ff5b57;
-             .remove {
-               float: right;
-               font-size: 12px;
-               color: #666666;
-               font-weight: bold;
-             }
-           }
-         }
-     }
+.order-list {
+  margin-top: 6px;
+  .order-item {
+    width: 20%;
+    float: left;
+    height: 200px;
+    cursor: pointer;
+    padding: 5px;
+    .info {
+      border: solid 1px #cccccc;
+      padding: 5px;
+      height: 100%;
+      border-radius: 4px;
+      background: #e6f7f7;
+      border: #113a28 solid 1px;
+      .sn {
+        font-weight: bold;
+        font-size: 20px;
+        color: #ff5b57;
+        .remove {
+          float: right;
+          font-size: 12px;
+          color: #666666;
+          font-weight: bold;
+        }
+      }
+      .order {
+        margin: 10px;
+        .item {
+          margin-bottom: 3px;
+        }
+        .time {
+          position: relative;
+          bottom: -50px;
+          color: #909399;
+        }
+      }
+    }
+    .none {
+      height: 100%;
+      color: #666666;
+      border: solid 1px #cccccc;
+      border-radius: 4px;
+      padding: 10px;
+      .tips {
+        line-height: 150px;
+        text-align: center;
+      }
+      .sn {
+        font-weight: bold;
+        font-size: 20px;
+        color: #ff5b57;
+        .remove {
+          float: right;
+          font-size: 12px;
+          color: #666666;
+          font-weight: bold;
+        }
+      }
+    }
   }
+}
 </style>

src/renderer/views/cashier/index.vue

@@ -65,7 +65,10 @@
                   <div class="cart-item" v-for="cartInfo in cartList">
                     <img class="image" :src="cartInfo.logo" />
                     <div class="info">
-                      <div class="name">{{ cartInfo.name }}</div>
+                      <div class="name">
+                        <template v-if="hangNo">{{ hangNo }}-</template>
+                        {{ cartInfo.name }}
+                      </div>
                       <div class="spec" v-if="cartInfo.specList && cartInfo.specList.length > 0">
                         <span class="item" v-for="spec in cartInfo.specList" :title="spec.value">
                           {{ spec.value }}
@@ -303,7 +306,7 @@ import {
   removeFromCart,
   submitSettlement,
   doPay,
-  getMemberInfoById
+  getMemberInfoById,
 } from '@/api/cashier'
 import { getOrderInfo } from '@/api/order'
 import { getUserId, setUserId, removeUserId } from '@/utils/auth'
@@ -331,7 +334,7 @@ export default {
     memberList,
     couponConfirm,
     noGoodsCashier,
-    bindStaffDialog
+    bindStaffDialog,
   },
   data() {
     return {
@@ -359,7 +362,7 @@ export default {
       menuList: [
         { name: '收银主页', key: 'cashier', logo: require('../../assets/images/cashier.png') },
         { name: '订单管理', key: 'order', logo: require('../../assets/images/order.png') },
-        { name: '退出', key: 'exit', logo: require('../../assets/images/order.png') }
+        { name: '退出', key: 'exit', logo: require('../../assets/images/order.png') },
         //  { name: '会员管理', key: 'member', logo: require('../../assets/images/hot.png') },
         //  { name: '卡券核销', key: 'coupon', logo: require('../../assets/images/life.png') }
       ],
@@ -411,7 +414,7 @@ export default {
       couponList: [],
       // 挂单序号
       hangNo: '',
-      isSearch: false
+      isSearch: false,
     }
   },
   mounted() {
@@ -540,7 +543,7 @@ export default {
                 logo: item.goodsInfo.logo,
                 price: item.goodsInfo.price,
                 buyNum: item.num,
-                specList: specList
+                specList: specList,
               }
               app.cartList.push(cartInfo)
             })
@@ -673,7 +676,7 @@ export default {
         skuId: skuId,
         userId: getUserId(),
         hangNo: app.hangNo,
-        buyNum: app.goodsNum
+        buyNum: app.goodsNum,
       }
       app.loading = true
       saveCart(cartInfo)
@@ -694,15 +697,32 @@ export default {
     // 删除购物车
     removeFromCart(cartId) {
       const app = this
-      removeFromCart({ cartId: [cartId], userId: getUserId() })
-        .then((response) => {
-          if (response.data) {
-            app.getCartList()
-          }
+      this.$confirm('此操作将清空, 是否继续?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning',
+      })
+        .then(() => {
+          removeFromCart({ cartId: [cartId], userId: getUserId() })
+            .then((response) => {
+              if (response.data) {
+                app.getCartList()
+                this.$message({
+                  type: 'success',
+                  message: '删除成功!',
+                })
+              }
+            })
+            .catch((err) => {
+              app.loading = false
+              console.log(err.toString())
+            })
         })
-        .catch((err) => {
-          app.loading = false
-          console.log(err.toString())
+        .catch(() => {
+          this.$message({
+            type: 'info',
+            message: '已取消删除',
+          })
         })
     },
     // 购物车数量变化
@@ -715,7 +735,7 @@ export default {
         action: '=',
         userId: app.memberInfo ? app.memberInfo.id : null,
         hangNo: app.hangNo,
-        buyNum: cartInfo.buyNum
+        buyNum: cartInfo.buyNum,
       }
       app.loading = true
       saveCart(param)
@@ -812,14 +832,14 @@ export default {
             payType: param.payType,
             cashierPayAmount: param.totalPrice,
             cashierDiscountAmount: param.discountPrice,
-            userId: getUserId()
+            userId: getUserId(),
           }).then((response) => {
             app.openSettlementDialog = false
             if (response.data.orderInfo.payStatus == 'B') {
               app.showPayResult({
                 isSuccess: true,
                 payAmount: response.data.orderInfo.payAmount,
-                orderId: response.data.orderInfo.id
+                orderId: response.data.orderInfo.id,
               })
             } else {
               app.$alert(response.data.message ? response.data.message : '抱歉，订单操作异常！')
@@ -843,7 +863,7 @@ export default {
         type: app.cartList.length > 0 ? 'goods' : 'payment',
         couponId: param.userCouponId ? param.userCouponId : 0,
         userId: getUserId(),
-        staffId: app.staffInfo ? app.staffInfo.id : 0
+        staffId: app.staffInfo ? app.staffInfo.id : 0,
       }
       if (app.loading) {
         return false
@@ -874,7 +894,7 @@ export default {
               app.showPayResult({
                 isSuccess: true,
                 payAmount: response.data.orderInfo.payAmount,
-                orderId: response.data.orderInfo.id
+                orderId: response.data.orderInfo.id,
               })
             } else {
               app.$alert(response.data.message)
@@ -981,8 +1001,8 @@ export default {
     // 确认关闭
     handleClose() {
       return false
-    }
-  }
+    },
+  },
 }
 </script>