Merge branch 'feature_点餐支付优化' of elab-damai-h5/h5-dm-orderFront into master

src/api/order.ts

@@ -66,3 +66,30 @@ export function deskOrderedDishListAll(params?: any) {
 export function searchCoupons(params?: any) {
     return request.get({ url: '/orders/queryUserCouponList', params }) //已点商品
 }
+
+export function getUserIdByMobile(params ?: any) {
+    return request.post({
+        url: '/c_user/queryUserByBrandIdMobile', // 具体的接口路径
+        params
+    }, {
+        urlPrefix: '/elab-marketing-user' // 单独定义的 URL 前缀
+    })
+}
+
+export function queryUserMemberInfo(params ?: any) {
+    return request.post({
+        url: '/membership/queryUserMemberInfo', // 具体的接口路径
+        params
+    }, {
+        urlPrefix: '/elab-marketing-content' // 单独定义的 URL 前缀
+    })
+}
+
+export function cashPay(params ?: any) {
+    return request.post({
+        url: '/membership/cashPay', // 具体的接口路径
+        params
+    }, {
+        urlPrefix: '/elab-marketing-content' // 单独定义的 URL 前缀
+    })
+}

src/views/order/console.vue

@@ -13,9 +13,13 @@
                         <div
                             class="justify-between items-center flex text-xl font-semibold font-mono"
                         >
-                            <span>{{ (data.deskId > 0 ? '餐桌号：': '取餐号：') + data.deskName }}</span>
+                            <span>{{
+                                (data.deskId > 0 ? '餐桌号：' : '取餐号：') + data.deskName
+                            }}</span>
                             <div class="flex items-center">
-                                <span v-if="data.deskId > 0">{{ data.currentNum + '/' + data.deskCap }}</span>
+                                <span v-if="data.deskId > 0">{{
+                                    data.currentNum + '/' + data.deskCap
+                                }}</span>
                                 <el-icon class="ml-2 cursor-pointer" @click="refreshdishes">
                                     <Refresh />
                                 </el-icon>
@@ -287,7 +291,9 @@
                         class="coupon-item"
                         :class="{
                             'is-selected': params.couponId === coupon.ticketRecordId,
-                            'is-disabled': orderData.sumPriceSum < (coupon.consumeScore / 100) || orderData.sumPriceSum < (coupon.useThreshold / 100)
+                            'is-disabled':
+                                (orderData.sumPriceSum <= coupon.consumeScore / 100) ||
+                                (orderData.sumPriceSum <= coupon.useThreshold / 100)
                         }"
                         @click="handleCouponClick(coupon)"
                     >
@@ -299,8 +305,10 @@
                         </div>
                         <div class="right-part">
                             <div class="name">
-                              {{ coupon.productName }}
-                              <el-tag v-if="coupon.useThreshold">满{{coupon.useThreshold  / 100}}减</el-tag>
+                                {{ coupon.productName }}
+                                <el-tag v-if="coupon.useThreshold"
+                                    >满{{ coupon.useThreshold / 100 }}减</el-tag
+                                >
                             </div>
                             <div class="date">券码:{{ coupon.ticketNo }}</div>
                         </div>
@@ -353,11 +361,112 @@
             <p class="text-gray-600">正在支付中，请不要关闭或退出界面</p>
         </div>
     </el-dialog>
+
+  <!-- 支付方式选择弹框 -->
+  <el-dialog
+      v-model="paymentMethodDialogVisible"
+      title="选择支付方式"
+      width="500px"
+      :close-on-click-modal="false"
+      :show-close="false"
+      :close-on-press-escape="false"
+  >
+    <div class="payment-methods">
+      <div
+          class="payment-option"
+          @click="selectPaymentMethod('scan')"
+          @mouseenter="currentHoverPayment = 'scan'"
+          @mouseleave="currentHoverPayment = ''"
+      >
+        <el-icon size="40"><FullScreen /></el-icon>
+        <span>扫码支付</span>
+      </div>
+      <div
+          class="payment-option"
+          @click="selectPaymentMethod('balance')"
+          @mouseenter="currentHoverPayment = 'balance'"
+          @mouseleave="currentHoverPayment = ''"
+      >
+        <el-icon size="40"><Wallet /></el-icon>
+        <span>余额支付</span>
+      </div>
+      <div
+          class="payment-option"
+          @click="selectPaymentMethod('cash')"
+          @mouseenter="currentHoverPayment = 'cash'"
+          @mouseleave="currentHoverPayment = ''"
+      >
+        <el-icon size="40"><Money /></el-icon>
+        <span>现金支付</span>
+      </div>
+    </div>
+    <!-- 根据当前悬停的支付方式显示对应说明 -->
+    <div v-if="currentHoverPayment === 'scan'" class="payment-description">
+      需要客户出示支付二维码(如微信、支付宝)进行扫码支付
+    </div>
+    <div v-else-if="currentHoverPayment === 'balance'" class="payment-description">
+      需要输入客户手机号,并使用该用户充值的余额直接支付并下单
+    </div>
+    <div v-else-if="currentHoverPayment === 'cash'" class="payment-description">
+      需要收取现金
+    </div>
+    <div v-else class="payment-description">
+      请选择一种支付方式完成订单
+    </div>
+    <template #footer>
+      <span class="dialog-footer">
+        <el-button @click="paymentMethodDialogVisible = false">取消</el-button>
+      </span>
+    </template>
+  </el-dialog>
+
+    <!-- 余额支付弹框 -->
+    <el-dialog
+        v-model="balancePaymentDialogVisible"
+        title="余额支付"
+        width="500px"
+        :close-on-click-modal="false"
+        :close-on-press-escape="false"
+    >
+      <el-form>
+        <el-form-item label="手机号">
+          <el-input v-model="balancePaymentPhone" placeholder="请输入手机号"></el-input>
+        </el-form-item>
+        <el-form-item label="余&nbsp;&nbsp;额" v-if="balanceAmount && balanceAmount >= 0">
+          <span style="font-size: 20px;color: red;font-weight: bolder;">{{balanceAmount}}</span>
+          <span v-if="balanceAmount && balanceAmount >= 0">&nbsp;元</span>
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <span class="dialog-footer" style="display: flex; justify-content: center;">
+          <el-button @click="confirmBalancePayment" type="primary">确认支付</el-button>
+        </span>
+      </template>
+    </el-dialog>
+    <!-- 现金支付确认弹框 -->
+    <el-dialog
+        v-model="cashPaymentDialogVisible"
+        title="现金支付"
+        width="400px"
+        :close-on-click-modal="false"
+        :close-on-press-escape="false"
+    >
+      <div class="cash-payment-content">
+        <p>请收取现金：</p>
+        <p style="font-weight: bolder;font-size: 25px;color: red;">¥{{ orderData.payAmount }} </p>
+      </div>
+      <template #footer>
+        <span class="dialog-footer">
+          <el-button @click="cashPaymentDialogVisible = false">取消</el-button>
+          <el-button type="primary" @click="confirmCashPayment">确定</el-button>
+        </span>
+      </template>
+    </el-dialog>
 </template>
 
 <script setup lang="ts">
 import { ElScrollbar } from 'element-plus'
-import { Search, ShoppingCart } from '@element-plus/icons-vue'
+import { FullScreen, Wallet, Money, Search, ShoppingCart } from '@element-plus/icons-vue'
 import goodsItem from './goodsItem.vue'
 import {
     dishAdd,
@@ -372,7 +481,10 @@ import {
     searchCoupons,
     orderPay,
     queryPayStatus,
-    cancelOrder
+    cancelOrder,
+    getUserIdByMobile,
+    queryUserMemberInfo,
+    cashPay
 } from '@/api/order'
 import feedback from '@/utils/feedback'
 // const route = useRoute()
@@ -391,6 +503,19 @@ const showOrderConsole = ref(false)
 const scanDialogVisible = ref(false)
 const scanCode = ref('')
 
+// 添加用于跟踪当前悬停支付方式的响应式变量
+const currentHoverPayment = ref('')
+
+// 添加现金支付确认弹框的控制变量
+const cashPaymentDialogVisible = ref(false)
+
+// 添加新的响应式变量
+const paymentMethodDialogVisible = ref(false)
+const balancePaymentDialogVisible = ref(false)
+const balancePaymentPhone = ref('')
+const balanceAmount = ref('')
+const balancePayCode = ref('')
+
 // 添加支付中对话框的控制变量
 const payingDialogVisible = ref(false)
 const data = reactive<any>({
@@ -416,8 +541,10 @@ const params = reactive({
     number: '', //订单id
     userId: '', //用户id
     couponId: '', //优惠券id
+    couponNo: '',
+    couponName: '',
     couponAmount: '-',
-    diningMethods: 1, // 就餐方式：1店内就餐 2打包外带
+    diningMethods: 1 // 就餐方式：1店内就餐 2打包外带
 })
 const submit = () => {
     //出单
@@ -447,80 +574,181 @@ const submit = () => {
             // emit('init')
             feedback.closeLoading()
             // feedback.notifySuccess('出单成功')
-            checkout()
-        }).catch((e)=>{
-          if (e.msg === "券不存在" || e.msg === "券不存在或已过期") {
-            params.couponId = null
-            params.couponAmount = '-'
-            // 计算支付金额
-            orderData.payAmount = Number(orderData.sumPriceSum).toFixed(2)
-            searchUserCoupons()
-          }
-
-    })
+            // 显示支付方式选择对话框
+            paymentMethodDialogVisible.value = true
+            // checkout()
+        })
+        .catch((e) => {
+            if (e.msg === '券不存在' || e.msg === '券不存在或已过期') {
+                params.couponId = null
+                params.couponNo = ''
+                params.couponName = ''
+                params.couponAmount = '-'
+                // 计算支付金额
+                orderData.payAmount = Number(orderData.sumPriceSum).toFixed(2)
+                searchUserCoupons()
+            }
+        })
         .finally(() => {
             feedback.closeLoading()
-        });
+        })
+}
+
+
+// 添加选择支付方式的函数
+const selectPaymentMethod = (method: string) => {
+  paymentMethodDialogVisible.value = false
+
+  switch (method) {
+    case 'scan':
+      // 走现有逻辑
+      checkout()
+      break
+    case 'balance':
+      // 显示余额支付对话框
+      balancePaymentDialogVisible.value = true
+      break
+    case 'cash':
+      // 直接发起现金支付请求
+      cashPaymentDialogVisible.value = true
+      break
+  }
+}
+// 添加确认现金支付的函数
+const confirmCashPayment = () => {
+  cashPaymentDialogVisible.value = false
+  // 直接发起现金支付请求
+  processCashPayment()
+}
+// 处理现金支付
+const processCashPayment = () => {
+  feedback.loading('正在处理现金支付...')
+  const payParams = {
+    orderId: params.number,
+    id: params.couponId || null,
+    ticketNo: params.couponNo || null,
+    ticketName: params.couponName || null,
+    ticketAmount: params.couponAmount === '-' ? null : params.couponAmount || null,
+  }
+  cashPay({
+    userId: params.userId || null,
+    sceneCode: 5,
+    params: JSON.stringify(payParams),
+    payMethod: 0,
+    amount: orderData.payAmount * 100,
+  }).then((res) => {
+    console.log(res)
+    feedback.closeLoading()
+    feedback.notifySuccess('现金支付成功')
+    showOrderConsole.value = false
+    emit('init')
+  }).catch((e) => {
+    feedback.closeLoading()
+    feedback.notifyError('现金支付失败')
+  })
+}
+
+// 确认余额支付
+const confirmBalancePayment = () => {
+  if (!balancePaymentPhone.value) {
+    feedback.msgError('请输入手机号')
+    return
+  }
+  if (data.phone && balancePaymentPhone.value != data.phone){
+    feedback.msgError('用券的手机号和支付的手机号不一致')
+    return
+  }
+
+  // 验证手机号格式
+  if (!/^1[3-9]\d{9}$/.test(balancePaymentPhone.value)) {
+    feedback.msgError('请输入正确的手机号')
+    return
+  }
+  if (!balanceAmount.value || balanceAmount.value < 0) {
+    feedback.msgError('暂无余额')
+    return
+  }
+  if (balanceAmount.value && balanceAmount.value == 0) {
+    feedback.msgError('余额不足')
+    return
+  }
+
+  feedback.loading('正在处理余额支付...')
+
+  orderPay({ oid: params.number, code: balancePayCode.value })
+      .then((res) => {
+        console.log(res)
+        // 实际上支付成功之后,res返回的是[],如果不是实时成功,返回的是个对象, 形如:{orderId: '123456789', sn: '7895004131583689'}
+        if (res == null || res.length == 0) {
+          feedback.closeLoading()
+          feedback.notifySuccess('余额结账成功' + orderData.payAmount + '元')
+          balancePaymentDialogVisible.value = false
+          showOrderConsole.value = false
+          emit('init')
+        }
+      })
+      .catch((e) => {
+        console.log('=====---', e)
+        feedback.closeLoading()
+      })
 }
 
 // 添加扫码事件监听函数
 const handleScanInput = (event: KeyboardEvent) => {
+    console.log('event.key', event.key)
+    if (event.key === 'Enter') {
+        if (!data.canScan) {
+            feedback.notifyWarning('正在处理支付，请勿重复扫码')
+            return
+        }
+        data.canScan = false
+        document.removeEventListener('keydown', handleScanInput)
+        const code = scanCode.value
+        console.log('扫码内容：', code)
+        payingDialogVisible.value = true // 显示支付中对话框
 
-  console.log("event.key", event.key)
-  if (event.key === 'Enter') {
-    if (!data.canScan) {
-      feedback.notifyWarning('正在处理支付，请勿重复扫码')
-      return
-    }
-    data.canScan = false
-    document.removeEventListener('keydown', handleScanInput)
-    const code = scanCode.value
-    console.log('扫码内容：', code)
-    payingDialogVisible.value = true // 显示支付中对话框
-
-    // 修改支付处理逻辑
-    orderPay({ oid: params.number, code: code })
-        .then((res) => {
-          console.log(res)
-          // 实际上支付成功之后,res返回的是[],如果不是实时成功,返回的是个对象, 形如:{orderId: '123456789', sn: '7895004131583689'}
-          if (res == null || res.length == 0) {
-            feedback.notifySuccess('成功结账' + orderData.payAmount + '元')
-            scanDialogVisible.value = false
-            payingDialogVisible.value = false // 隐藏支付中对话框
-            showOrderConsole.value = false
-            emit('init')
-          } else {
-            console.log('支付中')
-            return queryPayStatusWithRetry(res)
-                .then((paySuccess) => {
-                  if (paySuccess) {
+        // 修改支付处理逻辑
+        orderPay({ oid: params.number, code: code })
+            .then((res) => {
+                console.log(res)
+                // 实际上支付成功之后,res返回的是[],如果不是实时成功,返回的是个对象, 形如:{orderId: '123456789', sn: '7895004131583689'}
+                if (res == null || res.length == 0) {
                     feedback.notifySuccess('成功结账' + orderData.payAmount + '元')
                     scanDialogVisible.value = false
                     payingDialogVisible.value = false // 隐藏支付中对话框
                     showOrderConsole.value = false
                     emit('init')
-                  }
-                })
-          }
-        })
-        .catch((e) => {
-          console.log("=====---", e)
-          // 支付失败
-          payingDialogVisible.value = false // 隐藏支付中对话框
-          feedback.notifySuccess('支付失败，请重试!')
-            data.canScan = true
-            scanDialogVisible.value = true
-            // 添加键盘事件监听
-            setTimeout(()=>{
-              scanCode.value = ''
-              document.removeEventListener('keydown', handleScanInput)
-              document.addEventListener('keydown', handleScanInput)
-            }, 2000)
-          })
-    scanCode.value = ''
-  } else {
-    scanCode.value += event.key
-  }
+                } else {
+                    console.log('支付中')
+                    return queryPayStatusWithRetry(res).then((paySuccess) => {
+                        if (paySuccess) {
+                            feedback.notifySuccess('成功结账' + orderData.payAmount + '元')
+                            scanDialogVisible.value = false
+                            payingDialogVisible.value = false // 隐藏支付中对话框
+                            showOrderConsole.value = false
+                            emit('init')
+                        }
+                    })
+                }
+            })
+            .catch((e) => {
+                console.log('=====---', e)
+                // 支付失败
+                payingDialogVisible.value = false // 隐藏支付中对话框
+                feedback.notifySuccess('支付失败，请重试!')
+                data.canScan = true
+                scanDialogVisible.value = true
+                // 添加键盘事件监听
+                setTimeout(() => {
+                    scanCode.value = ''
+                    document.removeEventListener('keydown', handleScanInput)
+                    document.addEventListener('keydown', handleScanInput)
+                }, 2000)
+            })
+        scanCode.value = ''
+    } else {
+        scanCode.value += event.key
+    }
 }
 
 // 定义查询支付状态的函数
@@ -579,6 +807,8 @@ const queryPayStatusWithRetry = (data): Promise<boolean> => {
 const ticketConfirm = () => {
     if (data.phone == '') {
         params.couponId = null
+        params.couponNo = ''
+        params.couponName = ''
         params.couponAmount = '-'
         params.userId = null
         // 计算支付金额
@@ -608,16 +838,24 @@ const checkout = () => {
 }
 // 添加优惠券点击处理方法
 const handleCouponClick = (coupon: any) => {
-    if (orderData.sumPriceSum < coupon.consumeScore / 100 || orderData.sumPriceSum < (coupon.useThreshold / 100)) {
+    if (
+        orderData.sumPriceSum < coupon.consumeScore / 100 ||
+        orderData.sumPriceSum < coupon.useThreshold / 100
+    ) {
         return
     }
     if (params.couponId === coupon.ticketRecordId) {
         params.couponId = ''
+        params.couponNo = ''
+        params.couponName = ''
         params.couponAmount = '-'
         orderData.payAmount = orderData.sumPriceSum
         return
     }
+    balancePaymentPhone.value = data.phone
     params.couponId = coupon.ticketRecordId
+    params.couponNo = coupon.ticketNo
+    params.couponName = coupon.productName
     params.couponAmount = (coupon.consumeScore / 100).toFixed(2)
     // 计算支付金额
     orderData.payAmount = (
@@ -626,7 +864,7 @@ const handleCouponClick = (coupon: any) => {
 }
 
 const open = (item: any, num?: number, orderNumber?: any) => {
-  console.log('***open***', item, num, orderNumber)
+    console.log('***open***', item, num, orderNumber)
     initData()
     data.couponList = []
     showOrderConsole.value = true
@@ -637,7 +875,10 @@ const open = (item: any, num?: number, orderNumber?: any) => {
     params.number = item.ordersId ? item.ordersId : orderNumber
     params.userId = ''
     params.couponId = ''
-    //查询当前订单下的所有菜品
+    params.couponNo = ''
+    params.couponName = ''
+    balancePaymentPhone.value = ''
+      //查询当前订单下的所有菜品
     deskOrderedDishListAll({ id: params.number }).then((res) => {
         res.forEach((good: { id: number; ordersDishId: number }) => {
             good.ordersDishId = good.id
@@ -647,6 +888,7 @@ const open = (item: any, num?: number, orderNumber?: any) => {
         data.oldGoods = JSON.parse(JSON.stringify(res)) //记录下进入时当前餐桌已有的食物
         if (res.length > 0) {
             data.phone = res[0].mobile
+            balancePaymentPhone.value = data.phone
             params.remark = res[0].remark
             params.userId = res[0].userId || null
             params.couponId = res[0].ticketId || null
@@ -692,6 +934,8 @@ const open = (item: any, num?: number, orderNumber?: any) => {
             params.remark = ''
             params.userId = ''
             params.couponId = ''
+            params.couponNo = ''
+            params.couponName = ''
             params.couponAmount = '-'
             orderData.payAmount = 0
             data.couponList = []
@@ -771,6 +1015,57 @@ watch(search, (value) => {
         })
     }
 })
+
+// 监听 balancePaymentPhone 的变化
+watch(balancePaymentPhone, (newVal) => {
+  // 检查是否为11位手机号
+  if (newVal && newVal.length === 11 && /^1[3-9]\d{9}$/.test(newVal)) {
+    feedback.loading('正在查询余额...')
+    getUserIdByMobile({
+      mobile: newVal,
+      terminal: 1
+    }).then((response) => {
+      console.log("**getUserIdByMobile**", response)
+      const userIdByMobile = response.success && response.single ? response.single.id : null
+      if (!userIdByMobile) {
+        balanceAmount.value = null
+        balancePayCode.value = ''
+        return
+      }
+      queryUserMemberInfo({
+        userId: userIdByMobile,
+      }).then((res) => {
+        console.log("**queryUserMemberInfo**", res)
+        // 假设返回的数据结构中有 accountAmount 字段表示余额
+        if (res && res.success && res.single) {
+          balanceAmount.value = res.single.accountAmount || null
+          balancePayCode.value = res.single.payCode
+        } else {
+          balanceAmount.value = '-1'
+          balancePayCode.value = ''
+        }
+      }).catch((error) => {
+        console.error('获取余额失败:', error)
+        balanceAmount.value = '-1'
+        balancePayCode.value = ''
+        feedback.msgError('获取余额失败')
+      }).finally(() => {
+        feedback.closeLoading()
+      })
+    }).catch((error) => {
+      feedback.msgError('手机号查询失败')
+    }).finally(() => {
+      feedback.closeLoading()
+    })
+  } else if (newVal && newVal.length > 11) {
+    // 如果输入超过11位，截取前11位
+    balancePaymentPhone.value = newVal.substring(0, 11)
+  } else {
+    // 清空余额显示
+    balanceAmount.value = null
+    balancePayCode.value = ''
+  }
+})
 const clickSortButton = (name: any) => {
     //重复点击不处理
     if (buttonType.value == name) {
@@ -790,39 +1085,41 @@ const clickSortButton = (name: any) => {
 const toEmpty = () => {
     if (data.selectGoods.length != 0) {
         orderLoading.value = true
-        toEmptyy({ id: params.number }).then(() => {
-            //清空未出单的餐品-保留出单餐品
-            data.selectGoods = []
-            orderData.sumPriceSum = data.selectGoods.reduce(
-                (accumulator: number, currentValue: { summary: number; num: number }) =>
-                    accumulator + currentValue.summary * currentValue.num,
-                0
-            )
-            orderData.sumNumSum = data.selectGoods.reduce(
-                (accumulator: number, currentValue: { summary: number; num: number }) =>
-                    accumulator + currentValue.num,
-                0
-            )
-            // data.selectGoods.length = 0
-            orderData.priceSum = 0
-            orderData.numSum = 0
-            // orderData.sumPriceSum = 0
-            // orderData.sumNumSum = 0
+        toEmptyy({ id: params.number })
+            .then(() => {
+                //清空未出单的餐品-保留出单餐品
+                data.selectGoods = []
+                orderData.sumPriceSum = data.selectGoods.reduce(
+                    (accumulator: number, currentValue: { summary: number; num: number }) =>
+                        accumulator + currentValue.summary * currentValue.num,
+                    0
+                )
+                orderData.sumNumSum = data.selectGoods.reduce(
+                    (accumulator: number, currentValue: { summary: number; num: number }) =>
+                        accumulator + currentValue.num,
+                    0
+                )
+                // data.selectGoods.length = 0
+                orderData.priceSum = 0
+                orderData.numSum = 0
+                // orderData.sumPriceSum = 0
+                // orderData.sumNumSum = 0
 
-            // 检查优惠券条件
-            if (params.couponId && orderData.sumPriceSum < Number(params.couponAmount)) {
-                // 如果订单金额小于优惠券金额，清空优惠券
-                params.couponId = ''
-                params.couponAmount = '-'
-                orderData.payAmount = orderData.sumPriceSum
-            }
-            orderData.payAmount = Number(
-                orderData.sumPriceSum -
-                    (params.couponAmount === '-' ? 0 : Number(params.couponAmount))
-            ).toFixed(2)
-        }).finally(()=>{
-          orderLoading.value = false
-        })
+                // 检查优惠券条件
+                if (params.couponId && orderData.sumPriceSum < Number(params.couponAmount)) {
+                    // 如果订单金额小于优惠券金额，清空优惠券
+                    params.couponId = ''
+                    params.couponAmount = '-'
+                    orderData.payAmount = orderData.sumPriceSum
+                }
+                orderData.payAmount = Number(
+                    orderData.sumPriceSum -
+                        (params.couponAmount === '-' ? 0 : Number(params.couponAmount))
+                ).toFixed(2)
+            })
+            .finally(() => {
+                orderLoading.value = false
+            })
     }
 }
 const isEqual = (obj1: { [x: string]: any } | null, obj2: { [x: string]: any } | null) => {
@@ -1107,8 +1404,29 @@ const searchUserCoupons = () => {
                 params.userId = res ? res.userId || null : null
                 if (data.couponList.length == 0) {
                     feedback.msgError('暂无可用优惠券')
+                    params.couponId = null
+                    params.couponNo = ''
+                    params.couponName = ''
+                    params.couponAmount = '-'
+                    params.userId = null
+                    // 计算支付金额
+                    orderData.payAmount = Number(orderData.sumPriceSum).toFixed(2)
+                    balancePaymentPhone.value = data.phone
                     return false
                 }
+                data.couponList.sort((a, b) => {
+                  // 判断优惠券是否可用
+                  const aAvailable = orderData.sumPriceSum > a.consumeScore / 100 && (!a.useThreshold || orderData.sumPriceSum > a.useThreshold / 100);
+                  const bAvailable = orderData.sumPriceSum > b.consumeScore / 100 && (!b.useThreshold || orderData.sumPriceSum > b.useThreshold / 100);
+                  return bAvailable - aAvailable; // 可用的排在前面
+                })
+                if (params.couponId) {
+                    const currentTicket = data.couponList.filter(el=>el.ticketRecordId === params.couponId)
+                    if (currentTicket && currentTicket.length > 0) {
+                        params.couponNo = currentTicket[0].ticketNo
+                        params.couponName = currentTicket[0].productName
+                    }
+                }
             }
         })
         .finally(() => {
@@ -1117,17 +1435,17 @@ const searchUserCoupons = () => {
 }
 
 const initData = () => {
-  dishCateAll().then((res) => {
-    dishCate.value = res
-  })
-  dishListAll().then((res) => {
-    dishList.value = res
-    dishListall = res
-  })
+    dishCateAll().then((res) => {
+        dishCate.value = res
+    })
+    dishListAll().then((res) => {
+        dishList.value = res
+        dishListall = res
+    })
 }
 
 onMounted(() => {
-  // initData()
+    // initData()
 })
 defineExpose({
     open
@@ -1327,4 +1645,44 @@ defineExpose({
     background-color: #ff7875;
     border-color: #ff7875;
 }
+
+
+.payment-methods {
+  display: flex;
+  justify-content: space-around;
+  padding: 20px 0;
+}
+
+.payment-option {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 20px;
+  border: 1px solid #ebeef5;
+  border-radius: 8px;
+  cursor: pointer;
+  transition: all 0.3s;
+  width: 120px;
+}
+
+.payment-option:hover {
+  border-color: var(--el-color-primary);
+  background-color: var(--el-color-primary-light-9);
+}
+
+.payment-option span {
+  margin-top: 10px;
+  font-size: 14px;
+}
+
+.payment-description {
+  margin-top: 20px;
+  padding: 10px;
+  background-color: #f5f5f5;
+  border-radius: 4px;
+  text-align: center;
+  color: #666;
+  font-size: 14px;
+}
 </style>

src/views/order/index.vue

@@ -11,15 +11,28 @@
                 ></el-tab-pane>
             </el-tabs>
             <div class="p-1 flex-wrap float-left text-center md:w-40 h-20" style="height: 100%">
-              <div style="margin-bottom: 2px">
-                <el-input v-model="data.mealCode" placeholder="请输入取餐号" maxlength="10" style="height: 48px;font-size: 20px;"/>
-              </div>
-              <div @click="startOrder" class="rounded w-full h-full pt-3 relative"
-                   style="background-color: #4A5DFF;color:rgba(255, 255, 255);cursor: pointer;height: 54px;padding-top: 8px;line-height: 42px;">
-                <p class="font-semibold text-xl" style="font-size: 20px;">
-                  吧台点餐
-                </p>
-              </div>
+                <div style="margin-bottom: 2px">
+                    <el-input
+                        v-model="data.mealCode"
+                        placeholder="请输入取餐号"
+                        maxlength="10"
+                        style="height: 48px; font-size: 20px"
+                    />
+                </div>
+                <div
+                    @click="startOrder"
+                    class="rounded w-full h-full pt-3 relative"
+                    style="
+                        background-color: #4a5dff;
+                        color: rgba(255, 255, 255);
+                        cursor: pointer;
+                        height: 54px;
+                        padding-top: 8px;
+                        line-height: 42px;
+                    "
+                >
+                    <p class="font-semibold text-xl" style="font-size: 20px">吧台点餐</p>
+                </div>
             </div>
             <div
                 v-for="i in deskList"
@@ -73,15 +86,15 @@
                     继续点餐
                 </el-button>
                 <br />
-<!--                <el-button-->
-<!--                    class="w-full mt-1"-->
-<!--                    plain-->
-<!--                    :disabled="currentDeskStatus == 2"-->
-<!--                    @click="checkout()"-->
-<!--                >-->
-<!--                    结账-->
-<!--                </el-button>-->
-<!--                <br />-->
+                <!--                <el-button-->
+                <!--                    class="w-full mt-1"-->
+                <!--                    plain-->
+                <!--                    :disabled="currentDeskStatus == 2"-->
+                <!--                    @click="checkout()"-->
+                <!--                >-->
+                <!--                    结账-->
+                <!--                </el-button>-->
+                <!--                <br />-->
             </div>
             <div v-if="currentDeskStatus == 2">
                 <el-radio-group v-model="data.userNum" size="small">
@@ -147,13 +160,14 @@
 import { Loading } from '@element-plus/icons-vue'
 import { postAll } from '@/api/org/post'
 import {
-  orderDeskList,
-  createOrders,
-  orderCheckout,
-  orderPay,
-  queryPayStatus,
-  cancelOrder,
-  rockoverDesk, toEmptyy
+    orderDeskList,
+    createOrders,
+    orderCheckout,
+    orderPay,
+    queryPayStatus,
+    cancelOrder,
+    rockoverDesk,
+    toEmptyy
 } from '@/api/order'
 import Console from './console.vue'
 import { getOrdersCurrent } from '@/api/orders'
@@ -174,15 +188,17 @@ const deskList = ref<any[]>([])
 let currentDesk: any = {}
 let deskListAll: any[] = []
 const consoleRef = ref<InstanceType<typeof Console>>()
+
 const data = reactive({
     userNum: 1, //当前就餐人数
     deskId: null,
     type: 0, //后台点餐类型：0
     canScan: false,
-    mealCode: null
+    mealCode: null,
+    creator: userStore.userInfo.id
 })
 const order_ = (i: any) => {
-  console.log('***order_***', i)
+    console.log('***order_***', i)
     dialogVisible.value = true
     currentDesk = i
     currentDeskStatus.value = i.status
@@ -200,20 +216,21 @@ const order = () => {
     // router.push({ path: '/order/console', query: { deskID: id } })
 }
 const startOrder = () => {
-  if(data.mealCode == null || data.mealCode == '') {
-    feedback.notifyError('请输入取餐号')
-    return
-  }
-  currentDeskStatus.value = 0
-  data.deskId = 0
-  currentDeskMaxNum.value = null
-  currentDesk = {
-    id: data.deskId,
-    name: data.mealCode,
-  }
-  order();
+    if (data.mealCode == null || data.mealCode == '') {
+        feedback.notifyError('请输入取餐号')
+        return
+    }
+    currentDeskStatus.value = 0
+    data.deskId = 0
+    currentDeskMaxNum.value = null
+    currentDesk = {
+        id: data.deskId,
+        name: data.mealCode
+    }
+    order()
 }
 const rockover = () => {
+    console.log('***rockover***', data)
     feedback
         .confirm('将重置桌号状态, 确定翻台吗？')
         .then(() => {
@@ -244,57 +261,56 @@ const payingDialogVisible = ref(false)
 
 // 添加扫码事件监听函数
 const handleScanInput = (event: KeyboardEvent) => {
-  if (event.key === 'Enter') {
-    const code = scanCode.value
-    console.log('扫码内容：', code)
-    if (!data.canScan) {
-      feedback.notifyWarning('正在处理支付，请勿重复扫码')
-      return
-    }
-    data.canScan = false
-    payingDialogVisible.value = true // 显示支付中对话框
+    if (event.key === 'Enter') {
+        const code = scanCode.value
+        console.log('扫码内容：', code)
+        if (!data.canScan) {
+            feedback.notifyWarning('正在处理支付，请勿重复扫码')
+            return
+        }
+        data.canScan = false
+        payingDialogVisible.value = true // 显示支付中对话框
 
-    document.removeEventListener('keydown', handleScanInput)
-    // 修改支付处理逻辑
-    orderPay({ oid: params.number, code: code })
-        .then((res) => {
-          console.log(res)
-          // 实际上支付成功之后,res返回的是[],如果不是实时成功,返回的是个对象, 形如:{orderId: '123456789', sn: '7895004131583689'}
-          if (res == null || res.length == 0) {
-            feedback.notifySuccess('成功结账' + orderData.payAmount + '元')
-            scanDialogVisible.value = false
-            payingDialogVisible.value = false // 隐藏支付中对话框
-            showOrderConsole.value = false
-            emit('init')
-          } else {
-            console.log('支付中')
-            return queryPayStatusWithRetry(res)
-                .then((paySuccess) => {
-                  if (paySuccess) {
+        document.removeEventListener('keydown', handleScanInput)
+        // 修改支付处理逻辑
+        orderPay({ oid: params.number, code: code })
+            .then((res) => {
+                console.log(res)
+                // 实际上支付成功之后,res返回的是[],如果不是实时成功,返回的是个对象, 形如:{orderId: '123456789', sn: '7895004131583689'}
+                if (res == null || res.length == 0) {
                     feedback.notifySuccess('成功结账' + orderData.payAmount + '元')
                     scanDialogVisible.value = false
                     payingDialogVisible.value = false // 隐藏支付中对话框
                     showOrderConsole.value = false
                     emit('init')
-                  }
+                } else {
+                    console.log('支付中')
+                    return queryPayStatusWithRetry(res).then((paySuccess) => {
+                        if (paySuccess) {
+                            feedback.notifySuccess('成功结账' + orderData.payAmount + '元')
+                            scanDialogVisible.value = false
+                            payingDialogVisible.value = false // 隐藏支付中对话框
+                            showOrderConsole.value = false
+                            emit('init')
+                        }
+                    })
+                }
+            })
+            .catch((e) => {
+                console.log(e)
+                // 支付失败
+                payingDialogVisible.value = false // 隐藏支付中对话框
+                feedback.confirm('支付失败，请重试').then(() => {
+                    data.canScan = true
+                    scanDialogVisible.value = true
+                    // 添加键盘事件监听
+                    document.addEventListener('keydown', handleScanInput)
                 })
-          }
-        })
-        .catch((e) => {
-          console.log(e)
-          // 支付失败
-          payingDialogVisible.value = false // 隐藏支付中对话框
-          feedback.confirm('支付失败，请重试').then(() => {
-            data.canScan = true
-            scanDialogVisible.value = true
-            // 添加键盘事件监听
-            document.addEventListener('keydown', handleScanInput)
-          })
-        })
-    scanCode.value = ''
-  } else {
-    scanCode.value += event.key
-  }
+            })
+        scanCode.value = ''
+    } else {
+        scanCode.value += event.key
+    }
 }
 
 // 定义查询支付状态的函数
@@ -387,7 +403,7 @@ const tabChange = (name: any) => {
     }
 }
 const init = async () => {
-  data.mealCode = ''
+    data.mealCode = ''
     let _list: any[] = []
     await orderDeskList().then((res: any) => {
         // deskList.value = res
@@ -397,7 +413,7 @@ const init = async () => {
             deskList.value = _list.map((item) => {
                 res.forEach((element: any) => {
                     if (element.deskId == 0) {
-                      data.mealCode = element.mealCode
+                        data.mealCode = element.mealCode
                     }
                     if (item.id == element.deskId) {
                         item.status = element.status

src/views/orders/list.vue

@@ -12,19 +12,25 @@
                 <el-form-item label="订单状态" class="w-[280px]">
                     <el-select class="w-[280px]" v-model="queryParams.status">
                         <el-option label="全部" value />
-<!--                        <el-option label="待下单" value="0" />-->
-<!--                        <el-option label="待结帐" value="1" />-->
+                        <!--                        <el-option label="待下单" value="0" />-->
+                        <!--                        <el-option label="待结帐" value="1" />-->
                         <el-option label="已下单" value="2" />
                         <el-option label="已退款" value="4" />
                     </el-select>
                 </el-form-item>
-<!--                <el-form-item label="创建时间" class="w-[280px]">-->
-<!--                    <el-date-picker v-model="createTime" @change="setCreateTime" type="datetimerange"-->
-<!--                        range-separator="-" start-placeholder="开始时间" end-placeholder="结束时间" />-->
-<!--                </el-form-item>-->
+                <!--                <el-form-item label="创建时间" class="w-[280px]">-->
+                <!--                    <el-date-picker v-model="createTime" @change="setCreateTime" type="datetimerange"-->
+                <!--                        range-separator="-" start-placeholder="开始时间" end-placeholder="结束时间" />-->
+                <!--                </el-form-item>-->
                 <el-form-item label="下单日期" class="w-[340px]">
-                    <el-date-picker v-model="checkoutTime" @change="setCheckoutTime" type="daterange"
-                        range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期" />
+                    <el-date-picker
+                        v-model="checkoutTime"
+                        @change="setCheckoutTime"
+                        type="daterange"
+                        range-separator="-"
+                        start-placeholder="开始日期"
+                        end-placeholder="结束日期"
+                    />
                 </el-form-item>
                 <el-form-item class="w-[280px]">
                     <el-button type="primary" @click="resetPage">查询</el-button>
@@ -34,68 +40,81 @@
             </el-form>
         </el-card>
         <el-card class="!border-none mt-4" shadow="never">
-<!--            :expand-row-keys="expandRowKeys" @expand-change="handleExpandChange"-->
+            <!--            :expand-row-keys="expandRowKeys" @expand-change="handleExpandChange"-->
             <el-table v-loading="pager.loading" :data="pager.lists" row-key="id">
-<!--                <el-table-column type="expand" >-->
-<!--                    <template #default="{ row }">-->
-<!--                        <div class="order-detail-wrapper" v-loading="!orderDetails[row.id]">-->
-<!--                            <template v-if="orderDetails[row.id]">-->
-<!--                                <div class="detail-header">-->
-<!--                                    <span>订单详情</span>-->
-<!--                                    <span class="time">下单时间：{{ timeFormat(orderDetails[row.id].createTime) }}</span>-->
-<!--                                </div>-->
-<!--                                <el-table :data="orderDetails[row.id].dishes" border class="detail-table">-->
-<!--                                    <el-table-column label="菜品图片" width="120" align="center">-->
-<!--                                        <template #default="{ row }">-->
-<!--                                            <el-image :src="row.image" :preview-src-list="[row.image]"-->
-<!--                                                class="dish-image" fit="cover" />-->
-<!--                                        </template>-->
-<!--                                    </el-table-column>-->
-<!--                                    <el-table-column prop="name" label="菜品名称">-->
-<!--                                        <template #default="{ row }">-->
-<!--                                            <div>-->
-<!--                                                {{ row.name }}-->
-<!--                                                <div v-if="row.specsList && row.specsList.length" class="mt-1">-->
-<!--                                                    <el-tag-->
-<!--                                                        v-for="spec in row.specsList"-->
-<!--                                                        :key="spec.id"-->
-<!--                                                        size="small"-->
-<!--                                                        class="mr-1 mb-1"-->
-<!--                                                    >-->
-<!--                                                        {{ spec.name }}: {{ spec.value }}-->
-<!--                                                    </el-tag>-->
-<!--                                                </div>-->
-<!--                                            </div>-->
-<!--                                        </template>-->
-<!--                                    </el-table-column>-->
-<!--                                    <el-table-column prop="amount" label="单价">-->
-<!--                                        <template #default="{ row }">-->
-<!--                                            ￥{{ row.amount }}-->
-<!--                                        </template>-->
-<!--                                    </el-table-column>-->
-<!--                                    <el-table-column prop="number" label="数量" width="120" align="center" />-->
-<!--                                    <el-table-column label="小计" width="120" align="right">-->
-<!--                                        <template #default="{ row }">-->
-<!--                                            ￥{{ row.amount * row.number}}-->
-<!--                                        </template>-->
-<!--                                    </el-table-column>-->
-<!--                                </el-table>-->
-<!--                                <div class="detail-footer">-->
-<!--                                    <div class="total-info">-->
-<!--                                        <span>共 {{ getTotalCount(orderDetails[row.id].dishes) }} 件商品</span>-->
-<!--                                        <span class="total-price">-->
-<!--                                            订单总价：<em>￥{{ orderDetails[row.id].amount}}</em>-->
-<!--                                        </span>-->
-<!--                                    </div>-->
-<!--                                </div>-->
-<!--                            </template>-->
-<!--                        </div>-->
-<!--                    </template>-->
-<!--                </el-table-column>-->
+                <!--                <el-table-column type="expand" >-->
+                <!--                    <template #default="{ row }">-->
+                <!--                        <div class="order-detail-wrapper" v-loading="!orderDetails[row.id]">-->
+                <!--                            <template v-if="orderDetails[row.id]">-->
+                <!--                                <div class="detail-header">-->
+                <!--                                    <span>订单详情</span>-->
+                <!--                                    <span class="time">下单时间：{{ timeFormat(orderDetails[row.id].createTime) }}</span>-->
+                <!--                                </div>-->
+                <!--                                <el-table :data="orderDetails[row.id].dishes" border class="detail-table">-->
+                <!--                                    <el-table-column label="菜品图片" width="120" align="center">-->
+                <!--                                        <template #default="{ row }">-->
+                <!--                                            <el-image :src="row.image" :preview-src-list="[row.image]"-->
+                <!--                                                class="dish-image" fit="cover" />-->
+                <!--                                        </template>-->
+                <!--                                    </el-table-column>-->
+                <!--                                    <el-table-column prop="name" label="菜品名称">-->
+                <!--                                        <template #default="{ row }">-->
+                <!--                                            <div>-->
+                <!--                                                {{ row.name }}-->
+                <!--                                                <div v-if="row.specsList && row.specsList.length" class="mt-1">-->
+                <!--                                                    <el-tag-->
+                <!--                                                        v-for="spec in row.specsList"-->
+                <!--                                                        :key="spec.id"-->
+                <!--                                                        size="small"-->
+                <!--                                                        class="mr-1 mb-1"-->
+                <!--                                                    >-->
+                <!--                                                        {{ spec.name }}: {{ spec.value }}-->
+                <!--                                                    </el-tag>-->
+                <!--                                                </div>-->
+                <!--                                            </div>-->
+                <!--                                        </template>-->
+                <!--                                    </el-table-column>-->
+                <!--                                    <el-table-column prop="amount" label="单价">-->
+                <!--                                        <template #default="{ row }">-->
+                <!--                                            ￥{{ row.amount }}-->
+                <!--                                        </template>-->
+                <!--                                    </el-table-column>-->
+                <!--                                    <el-table-column prop="number" label="数量" width="120" align="center" />-->
+                <!--                                    <el-table-column label="小计" width="120" align="right">-->
+                <!--                                        <template #default="{ row }">-->
+                <!--                                            ￥{{ row.amount * row.number}}-->
+                <!--                                        </template>-->
+                <!--                                    </el-table-column>-->
+                <!--                                </el-table>-->
+                <!--                                <div class="detail-footer">-->
+                <!--                                    <div class="total-info">-->
+                <!--                                        <span>共 {{ getTotalCount(orderDetails[row.id].dishes) }} 件商品</span>-->
+                <!--                                        <span class="total-price">-->
+                <!--                                            订单总价：<em>￥{{ orderDetails[row.id].amount}}</em>-->
+                <!--                                        </span>-->
+                <!--                                    </div>-->
+                <!--                                </div>-->
+                <!--                            </template>-->
+                <!--                        </div>-->
+                <!--                    </template>-->
+                <!--                </el-table-column>-->
                 <el-table-column type="index" min-width="80" />
-                <el-table-column label="下单时间" prop="checkoutTime" min-width="120"></el-table-column>
-                <el-table-column label="订单号" prop="number" min-width="150" show-overflow-tooltip></el-table-column>
-                <el-table-column label="类型" prop="type" :formatter="(row: any) => (row.type == 0 ? '吧台点单' : '扫码点单')"></el-table-column>
+                <el-table-column
+                    label="下单时间"
+                    prop="checkoutTime"
+                    min-width="120"
+                ></el-table-column>
+                <el-table-column
+                    label="订单号"
+                    prop="number"
+                    min-width="150"
+                    show-overflow-tooltip
+                ></el-table-column>
+                <el-table-column
+                    label="类型"
+                    prop="type"
+                    :formatter="(row: any) => (row.type == 0 ? '吧台点单' : '扫码点单')"
+                ></el-table-column>
                 <el-table-column label="桌号/餐号" prop="deskName">
                     <template #default="{ row }">{{
                         row.deskName ? row.deskName : row.mealCode
@@ -103,28 +122,66 @@
                 </el-table-column>
                 <el-table-column label="产品清单" min-width="120">
                     <template #default="{ row }">
-                      <div>
-                        <div v-for="orderDish in row.orderDishes" :key="orderDish.id">
-                            {{ orderDish.name }}<span style="margin: 0 15px 0 15px;">x</span>{{orderDish.number}}
-                            <div v-if="orderDish.specsList && orderDish.specsList.length > 0">
-                                <div v-for="spec in orderDish.specsList" :key="spec.id" class="refund-info" style="margin-left: 20px;margin-top: 0;">
-                                  <span v-if="spec.name && spec.value">- {{ spec.name }}: {{ spec.value }}</span>
+                        <div>
+                            <div v-for="orderDish in row.orderDishes" :key="orderDish.id">
+                                {{ orderDish.name }}<span style="margin: 0 15px 0 15px">x</span
+                                >{{ orderDish.number }}
+                                <div v-if="orderDish.specsList && orderDish.specsList.length > 0">
+                                    <div
+                                        v-for="spec in orderDish.specsList"
+                                        :key="spec.id"
+                                        class="refund-info"
+                                        style="margin-left: 20px; margin-top: 0"
+                                    >
+                                        <span v-if="spec.name && spec.value"
+                                            >- {{ spec.name }}: {{ spec.value }}</span
+                                        >
+                                    </div>
                                 </div>
                             </div>
                         </div>
-                      </div>
                     </template>
                 </el-table-column>
-                <el-table-column label="订单金额(元)" prop="amount" min-width="100"></el-table-column>
-                <el-table-column label="优惠金额(元)" prop="ticketAmount" min-width="100"></el-table-column>
-                <el-table-column label="实付金额(元)" prop="payAmount" min-width="100"></el-table-column>
-                <el-table-column label="备注" prop="remark"  min-width="100" show-tooltip-when-overflow></el-table-column>
-                <el-table-column label="状态" min-width="160" prop="status" >
+                <el-table-column
+                    label="订单金额(元)"
+                    prop="amount"
+                    min-width="100"
+                ></el-table-column>
+                <el-table-column
+                    label="优惠金额(元)"
+                    prop="ticketAmount"
+                    min-width="100"
+                ></el-table-column>
+                <el-table-column
+                    label="实付金额(元)"
+                    prop="payAmount"
+                    min-width="100"
+                ></el-table-column>
+                <el-table-column
+                    label="备注"
+                    prop="remark"
+                    min-width="100"
+                    show-tooltip-when-overflow
+                ></el-table-column>
+                <el-table-column label="状态" min-width="160" prop="status">
                     <template #default="{ row }">
                         <div>
-                            {{ row.status == 4 ? '已退款' : row.status == 2 ? '已下单' : row.status == 0 ? '待下单'
-                            : row.status == 1 ? '待支付' : row.status == 5 ? '退款中' : row.status == 3 ? '支付失败' : '已关闭' }}
-                            <div v-if="row.refundStatus=='SUCCESS'" class="refund-info">
+                            {{
+                                row.status == 4
+                                    ? '已退款'
+                                    : row.status == 2
+                                    ? '已下单'
+                                    : row.status == 0
+                                    ? '待下单'
+                                    : row.status == 1
+                                    ? '待支付'
+                                    : row.status == 5
+                                    ? '退款中'
+                                    : row.status == 3
+                                    ? '支付失败'
+                                    : '已关闭'
+                            }}
+                            <div v-if="row.refundStatus == 'SUCCESS'" class="refund-info">
                                 <div>退款时间:{{ row.refundTime }}</div>
                                 <div>退款金额:{{ row.refundAmount }}元</div>
                             </div>
@@ -133,8 +190,14 @@
                 </el-table-column>
                 <el-table-column label="操作" width="60" fixed="right">
                     <template #default="{ row }">
-<!--                        <el-button type="primary" link @click="showDetail(row)">查看已点菜品</el-button>-->
-                        <el-button v-if="row.status=='2' && !row.refundAmount" type="danger" link @click="refund(row)">退款</el-button>
+                        <!--                        <el-button type="primary" link @click="showDetail(row)">查看已点菜品</el-button>-->
+                        <el-button
+                            v-if="row.status == '2' && !row.refundAmount"
+                            type="danger"
+                            link
+                            @click="refund(row)"
+                            >退款</el-button
+                        >
                     </template>
                 </el-table-column>
             </el-table>
@@ -146,20 +209,23 @@
             v-model="refundDialogVisible"
             title="退款"
             width="400px"
-            @close="refundDialogVisible = false">
+            @close="refundDialogVisible = false"
+        >
             <div class="refund-dialog-content">
-                <el-input
-                    v-model="refundAmount"
-                    placeholder="请输入退款金额"
-                    type="number">
+                <el-input v-model="refundAmount" placeholder="请输入退款金额" type="number">
                     <template #prepend><icon :size="25" name="el-icon-money" /></template>
                     <template #append>元</template>
                 </el-input>
+                <div v-if="payMethod === 0" class="payment-description">
+                    请现金退款,本操作只做记录,不做真正的退款动作
+                </div>
             </div>
             <template #footer>
                 <span class="dialog-footer">
                     <el-button @click="refundDialogVisible = false">取 消</el-button>
-                    <el-button type="primary" :loading="refundLoading" @click="confirmRefund">确 定</el-button>
+                    <el-button type="primary" :loading="refundLoading" @click="confirmRefund"
+                        >确 定</el-button
+                    >
                 </span>
             </template>
         </el-dialog>
@@ -172,55 +238,55 @@
             width="300px"
             class="download-dialog"
         >
-          <div class="download-loading-content">
-            <el-icon class="is-loading" color="#409EFF" size="40">
-              <Loading />
-            </el-icon>
-            <div class="loading-text">下载中...</div>
-            <div class="loading-subtext">正在生成文件，请稍候</div>
-          </div>
+            <div class="download-loading-content">
+                <el-icon class="is-loading" color="#409EFF" size="40">
+                    <Loading />
+                </el-icon>
+                <div class="loading-text">下载中...</div>
+                <div class="loading-subtext">正在生成文件，请稍候</div>
+            </div>
         </el-dialog>
     </div>
 </template>
 
 <script setup lang="ts">
-    import { ordersList, getOrderDetail, refundReq, downloadOrders } from '@/api/orders'
-    import { usePaging } from '@/hooks/usePaging'
-    import { timeFormat } from '@/utils/util'
-    import feedback from '@/utils/feedback'
-    // import Money from '@/utils/money'
-    // 在其他 import 语句后添加 Loading 组件导入
-    import { Loading } from '@element-plus/icons-vue'
-
-    const downloadLoading = ref(false)
-    const createTime = ref()
-    const checkoutTime = ref()
-    const queryParams = reactive({
-        type: '',
-        status: '',
-        checkoutTime: '',
-        createTime: ''
-    })
-    const { pager, getLists, resetPage } = usePaging({
-        fetchFun: ordersList,
-        params: queryParams
-    })
-    const resetParams = () => {
-      queryParams.type = ''
-      queryParams.status = ''
-      checkoutTime.value = []
-      queryParams.checkoutTime = ''
-      getLists()
-    }
-    const setCreateTime = (v : any) => {
-        queryParams.createTime =
-            Math.round(v[0].getTime() / 1000).toString() +
-            ',' +
-            Math.round(v[1].getTime() / 1000).toString()
-    }
-    const setCheckoutTime = (v : any) => {
-      queryParams.checkoutTime = ''
-      if (v && v.length === 2) {
+import { ordersList, getOrderDetail, refundReq, downloadOrders } from '@/api/orders'
+import { usePaging } from '@/hooks/usePaging'
+import { timeFormat } from '@/utils/util'
+import feedback from '@/utils/feedback'
+// import Money from '@/utils/money'
+// 在其他 import 语句后添加 Loading 组件导入
+import { Loading } from '@element-plus/icons-vue'
+
+const downloadLoading = ref(false)
+const createTime = ref()
+const checkoutTime = ref()
+const queryParams = reactive({
+    type: '',
+    status: '',
+    checkoutTime: '',
+    createTime: ''
+})
+const { pager, getLists, resetPage } = usePaging({
+    fetchFun: ordersList,
+    params: queryParams
+})
+const resetParams = () => {
+    queryParams.type = ''
+    queryParams.status = ''
+    checkoutTime.value = []
+    queryParams.checkoutTime = ''
+    getLists()
+}
+const setCreateTime = (v: any) => {
+    queryParams.createTime =
+        Math.round(v[0].getTime() / 1000).toString() +
+        ',' +
+        Math.round(v[1].getTime() / 1000).toString()
+}
+const setCheckoutTime = (v: any) => {
+    queryParams.checkoutTime = ''
+    if (v && v.length === 2) {
         // 开始时间保持不变
         const startTime = Math.round(v[0].getTime() / 1000).toString()
 
@@ -231,260 +297,272 @@
         const endTime = Math.round(endDate.getTime() / 1000).toString()
 
         queryParams.checkoutTime = startTime + ',' + endTime
-      }
     }
-    // watch(queryParams, (newV, oldV) => {
-    //     console.log(JSON.stringify(newV))
-    // })
-
-    const expandRowKeys = ref<string[]>([])
-    const orderDetails = ref<Record<string, any>>({})
-    const handleExpandChange = (row: any, expandedRows: any) => {
-        // console.log('当前行展开状态改变：', row, expandedRows);
-        if (!orderDetails.value[row.id]) {
-            showDetail(row);
-        }
-    }
-    // 添加这些变量到组件顶层
-    const refundDialogVisible = ref(false)
-    const refundAmount = ref('')
-    var refundOrder: {
-        refundTime: string;
-        refundAmount: number;
-        payAmount: number;
-        amount: number;
-        status: number; id: any;
-    };
-    // 添加loading状态变量
-    const refundLoading = ref(false)
-    // 修改refund函数
-    const refund = async (row: any) => {
-        refundDialogVisible.value = true
-        refundAmount.value = ''
-        refundOrder = row;
+}
+// watch(queryParams, (newV, oldV) => {
+//     console.log(JSON.stringify(newV))
+// })
+
+const expandRowKeys = ref<string[]>([])
+const orderDetails = ref<Record<string, any>>({})
+const handleExpandChange = (row: any, expandedRows: any) => {
+    // console.log('当前行展开状态改变：', row, expandedRows);
+    if (!orderDetails.value[row.id]) {
+        showDetail(row)
     }
+}
+// 添加这些变量到组件顶层
+const refundDialogVisible = ref(false)
+const refundAmount = ref('')
+const payMethod = ref('')
+let refundOrder: {
+    refundTime: string
+    refundAmount: number
+    payAmount: number
+    amount: number
+    status: number
+    id: any
+}
+// 添加loading状态变量
+const refundLoading = ref(false)
+// 修改refund函数
+const refund = async (row: any) => {
+    refundOrder = row
+    payMethod.value = row.payMethod
+    refundAmount.value = ''
+    refundDialogVisible.value = true
+}
 
-    const confirmRefund = async () => {
-        try {
-            if(!refundAmount.value || refundAmount.value<=0){
-                return feedback.msgError('退款金额不合法')
-            }
-            if(refundAmount.value > (refundOrder.payAmount || refundOrder.amount)){
-                return feedback.msgError('退款金额不能大于订单实付金额')
-            }
-            refundLoading.value = true
-            const res = await refundReq({ orderId: refundOrder.id, payAmount: refundAmount.value })
-            if (res) {
-                feedback.msgSuccess('退款成功')
-                refundOrder.status = 5;
-                // refundOrder.refundAmount = refundAmount.value;
-                // refundOrder.refundTime = "待处理";
-                setTimeout(()=>{
-                    getLists();
-                },200)
-            } else {
-                feedback.msgError('退款失败')
-            }
-        } catch (error) {
-            console.error('退款失败:', error)
-        } finally {
-            refundLoading.value = false
-            refundDialogVisible.value = false
+const confirmRefund = async () => {
+    try {
+        if (!refundAmount.value || refundAmount.value <= 0) {
+            return feedback.msgError('退款金额不合法')
         }
+        if (refundAmount.value > (refundOrder.payAmount || refundOrder.amount)) {
+            return feedback.msgError('退款金额不能大于订单实付金额')
+        }
+        refundLoading.value = true
+        const res = await refundReq({ orderId: refundOrder.id, payAmount: refundAmount.value })
+        if (res) {
+            feedback.msgSuccess('退款成功')
+            // refundOrder.status = 5;
+            // refundOrder.refundAmount = refundAmount.value;
+            // refundOrder.refundTime = "待处理";
+            setTimeout(() => {
+                getLists()
+            }, 200)
+        } else {
+            feedback.msgError('退款失败')
+        }
+    } catch (error) {
+        console.error('退款失败:', error)
+    } finally {
+        refundLoading.value = false
+        refundDialogVisible.value = false
     }
+}
 
-    // 展示订单详情
-    const showDetail = async (row : any) => {
-        try {
-            // 如果已经加载过该订单详情，直接展开
-            if (orderDetails.value[row.id]) {
-                expandRowKeys.value = [row.id]
-                return
-            }
+// 展示订单详情
+const showDetail = async (row: any) => {
+    try {
+        // 如果已经加载过该订单详情，直接展开
+        if (orderDetails.value[row.id]) {
+            expandRowKeys.value = [row.id]
+            return
+        }
 
-            // 调用获取订单详情接口
-            const res = await getOrderDetail({id:row.id})
-            console.warn("***getOrderDetail***",res)
-            if (res) {
-                // 定义正确的类型
-                let orderDetail: Record<string, any> = {};
-                orderDetail.id = res.orderItem.id;
-                orderDetail.amount = res.orderItem.amount;//总价
-                orderDetail.createTime = res.orderItem.createTime;
-                orderDetail.dishes = res.orderDishList;
-                // 保存订单详情
-                orderDetails.value[row.id] = orderDetail
-                // 展开当前行
-                expandRowKeys.value = [row.id]
-            } else {
-                feedback.msgError('获取订单详情失败')
-            }
-        } catch (error) {
-            console.error('获取订单详情失败:', error)
+        // 调用获取订单详情接口
+        const res = await getOrderDetail({ id: row.id })
+        console.warn('***getOrderDetail***', res)
+        if (res) {
+            // 定义正确的类型
+            const orderDetail: Record<string, any> = {}
+            orderDetail.id = res.orderItem.id
+            orderDetail.amount = res.orderItem.amount //总价
+            orderDetail.createTime = res.orderItem.createTime
+            orderDetail.dishes = res.orderDishList
+            // 保存订单详情
+            orderDetails.value[row.id] = orderDetail
+            // 展开当前行
+            expandRowKeys.value = [row.id]
+        } else {
             feedback.msgError('获取订单详情失败')
         }
+    } catch (error) {
+        console.error('获取订单详情失败:', error)
+        feedback.msgError('获取订单详情失败')
     }
+}
 
-    // 计算商品总数
-    const getTotalCount = (dishes : any[]) => {
-        return dishes.reduce((total, dish) => total + dish.number, 0)
-    }
-    // 计算订单总价
-    // const getTotalPrice = (dishes: any[]) => {
-    //     return dishes.reduce((total, dish) => {
-    //         return Money.add(total, Money.multiply(dish.price, dish.count))
-    //     }, 0)
-    // }
-    const download = async () => {
-      try {
+// 计算商品总数
+const getTotalCount = (dishes: any[]) => {
+    return dishes.reduce((total, dish) => total + dish.number, 0)
+}
+// 计算订单总价
+// const getTotalPrice = (dishes: any[]) => {
+//     return dishes.reduce((total, dish) => {
+//         return Money.add(total, Money.multiply(dish.price, dish.count))
+//     }, 0)
+// }
+const download = async () => {
+    try {
         downloadLoading.value = true
         const res = await downloadOrders(queryParams)
-        console.warn("***downloadOrders***",res)
+        console.warn('***downloadOrders***', res)
         if (res) {
-          // 生成带当前时间的文件名
-          const timestamp = new Date()
-          const year = timestamp.getFullYear()
-          const month = String(timestamp.getMonth() + 1).padStart(2, '0')
-          const day = String(timestamp.getDate()).padStart(2, '0')
-          const hours = String(timestamp.getHours()).padStart(2, '0')
-          const minutes = String(timestamp.getMinutes()).padStart(2, '0')
-          const seconds = String(timestamp.getSeconds()).padStart(2, '0')
-          const filename = `订单列表_${year}${month}${day}_${hours}${minutes}${seconds}.xlsx`
-
-          downloadFile(res)
+            // 生成带当前时间的文件名
+            const timestamp = new Date()
+            const year = timestamp.getFullYear()
+            const month = String(timestamp.getMonth() + 1).padStart(2, '0')
+            const day = String(timestamp.getDate()).padStart(2, '0')
+            const hours = String(timestamp.getHours()).padStart(2, '0')
+            const minutes = String(timestamp.getMinutes()).padStart(2, '0')
+            const seconds = String(timestamp.getSeconds()).padStart(2, '0')
+            const filename = `订单列表_${year}${month}${day}_${hours}${minutes}${seconds}.xlsx`
+
+            downloadFile(res)
         }
-      } catch (error) {
+    } catch (error) {
         console.error('下载失败:', error)
         feedback.msgError('下载失败')
-      } finally {
+    } finally {
         downloadLoading.value = false
-      }
     }
+}
 
-    const downloadFile = (url: string) => {
-      const link = document.createElement('a');
-      link.href = url;
-      document.body.appendChild(link);
-      link.click();
-      document.body.removeChild(link);
-    };
+const downloadFile = (url: string) => {
+    const link = document.createElement('a')
+    link.href = url
+    document.body.appendChild(link)
+    link.click()
+    document.body.removeChild(link)
+}
 
-    getLists()
+getLists()
 </script>
 
 <style lang="scss" scoped>
 /* 在样式部分添加下载对话框的样式*/
 .download-dialog {
-  :deep(.el-dialog__header) {
-    display: none;
-  }
+    :deep(.el-dialog__header) {
+        display: none;
+    }
 
-  :deep(.el-dialog__body) {
-    padding: 30px 20px;
-  }
+    :deep(.el-dialog__body) {
+        padding: 30px 20px;
+    }
 }
 
 .download-loading-content {
-  text-align: center;
+    text-align: center;
 
-  .loading-text {
-    margin-top: 15px;
-    font-size: 16px;
-    color: #333;
-    font-weight: 500;
-  }
+    .loading-text {
+        margin-top: 15px;
+        font-size: 16px;
+        color: #333;
+        font-weight: 500;
+    }
 
-  .loading-subtext {
-    margin-top: 8px;
-    font-size: 12px;
-    color: #999;
-  }
+    .loading-subtext {
+        margin-top: 8px;
+        font-size: 12px;
+        color: #999;
+    }
 }
-    .order-detail-wrapper {
-        padding: 20px;
-        background: #f8f8f8;
-
-        .detail-header {
-            margin-bottom: 20px;
-            display: flex;
-            justify-content: space-between;
-            align-items: center;
-
-            span {
-                font-size: 14px;
-                color: #333;
-
-                &.time {
-                    color: #999;
-                }
+.order-detail-wrapper {
+    padding: 20px;
+    background: #f8f8f8;
+
+    .detail-header {
+        margin-bottom: 20px;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+
+        span {
+            font-size: 14px;
+            color: #333;
+
+            &.time {
+                color: #999;
             }
         }
+    }
 
-        .detail-table {
-            margin-bottom: 20px;
+    .detail-table {
+        margin-bottom: 20px;
 
-            :deep(.dish-image) {
-                width: 60px;
-                height: 60px;
-                border-radius: 4px;
-            }
+        :deep(.dish-image) {
+            width: 60px;
+            height: 60px;
+            border-radius: 4px;
         }
+    }
+
+    .detail-footer {
+        display: flex;
+        justify-content: flex-end;
+
+        .total-info {
+            text-align: right;
 
-        .detail-footer {
-            display: flex;
-            justify-content: flex-end;
-
-            .total-info {
-                text-align: right;
-
-                span {
-                    margin-left: 20px;
-                    font-size: 14px;
-                    color: #666;
-
-                    &.total-price {
-                        em {
-                            font-style: normal;
-                            font-size: 16px;
-                            color: #f56c6c;
-                            font-weight: bold;
-                        }
+            span {
+                margin-left: 20px;
+                font-size: 14px;
+                color: #666;
+
+                &.total-price {
+                    em {
+                        font-style: normal;
+                        font-size: 16px;
+                        color: #f56c6c;
+                        font-weight: bold;
                     }
                 }
             }
         }
     }
+}
 
-    .refund-dialog-content {
-        padding: 20px 0px;
+.refund-dialog-content {
+    padding: 20px 0px;
 
-        :deep(.el-input) {
-            width: 100%;
-        }
+    :deep(.el-input) {
+        width: 100%;
     }
+}
 
-    .dialog-footer {
-        text-align: right;
+.dialog-footer {
+    text-align: right;
 
-        .el-button + .el-button {
-            margin-left: 12px;
-        }
+    .el-button + .el-button {
+        margin-left: 12px;
     }
+}
 
-    .refund-info {
-        font-size: 12px;
-        color: #999;
-        margin-top: 4px;
-    }
+.refund-info {
+    font-size: 12px;
+    color: #999;
+    margin-top: 4px;
+}
 
-    .remark-text {
-        display: -webkit-box;
-        -webkit-box-orient: vertical;
-        -webkit-line-clamp: 2;
-        overflow: hidden;
-        text-overflow: ellipsis;
-        word-break: break-all;
-        line-height: 1.5;
-        max-height: 3em; // 2行的高度
-    }
+.remark-text {
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 2;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    word-break: break-all;
+    line-height: 1.5;
+    max-height: 3em; // 2行的高度
+}
+.payment-description {
+    margin-top: 20px;
+    padding: 10px;
+    background-color: #f5f5f5;
+    border-radius: 4px;
+    text-align: center;
+    color: #666;
+    font-size: 14px;
+}
 </style>