对接新版结算

src/views/home/components/settleAccount.vue

@@ -4,7 +4,7 @@
     <div class="drawer_wrap">
       <div class="cart_list">
         <div class="nav_wrap card">
-          <div class="return" @click="dialogVisible = false">
+          <div class="return" @click="returnHandle">
             <el-icon class="icon">
               <ArrowLeftBold />
             </el-icon>
@@ -12,12 +12,20 @@
           <div class="info">
             <div class="master_id">
               <span>{{ goodsStore.orderListInfo.tableCode || store.shopInfo.shopName }}</span>
-              <span class="member_info" v-if="goodsStore.vipUserInfo.id">
-                会员：{{ formatPhoneNumber(goodsStore.vipUserInfo.phone) }}
-              </span>
+              <div class="member_info" v-if="goodsStore.vipUserInfo.id">
+                <span>用户昵称：{{ formatPhoneNumber(goodsStore.vipUserInfo.phone) }}</span>
+                <span class="vip">白银会员</span>
+              </div>
+              <div class="member_info s" v-if="goodsStore.vipUserInfo.id">当前积分：
+                {{ goodsStore.vipUserInfo.accountPoints }}
+              </div>
+              <div class="member_info s between" v-if="goodsStore.vipUserInfo.id">
+                <span>当前余额：{{ goodsStore.vipUserInfo.amount }}</span>
+                <el-button size="small" @click="userChangeRef.show()">去充值</el-button>
+              </div>
             </div>
             <div class="btm">
-              <span class="p">服务员：{{ store.userInfo.name || "暂无" }}</span>
+              <span class="p">服务员：{{ store.userInfo.name || store.shopInfo.shopName }}</span>
               <span class="t">{{ dayjs().format("M月D日 HH:mm") }}</span>
             </div>
           </div>
@@ -75,6 +83,7 @@
       </div>
     </el-dialog> -->
   </el-drawer>
+  <user-charge ref="userChangeRef" :userInfo="goodsStore.vipUserInfo" @pay-success="chargeSuccess" />
 </template>
 
 <script setup>
@@ -84,7 +93,7 @@ import { useUser } from "@/store/user.js";
 import payCard from "@/components/payCard/payCard.vue";
 import SettleItem from './settleItem.vue'
 import { print } from "@/api/pay";
-import { shopStaffInfo } from '@/api/account.js'
+import { shopStaffInfo, shopUserDetail } from '@/api/account.js'
 import { dayjs, ElMessage } from "element-plus";
 import { formatPhoneNumber, getOrderByIdAjax, commOrderPrintData } from '@/utils/index.js'
 import useStorage from '@/utils/useStorage.js'
@@ -93,8 +102,12 @@ import { usePrint } from '@/store/print.js'
 import { useGoods } from '@/store/goods.js'
 import { useSocket } from '@/store/socket.js'
 import { orderPrint } from '@/api/order.js'
+import { } from '@/utils/coupon-utils.js'
 
 import { staffPermission } from '@/api/user.js'
+import UserCharge from "@/views/member/components/userCharge.vue";
+
+const userChangeRef = ref(null);
 
 const goodsStore = useGoods()
 
@@ -253,6 +266,34 @@ function show(t) {
   nextTick(() => {
     payCardRef.value.payCardInit()
   })
+
+  console.log('vipUserInfo===', goodsStore.vipUserInfo)
+}
+
+// 会员充值成功
+async function chargeSuccess() {
+  try {
+    const res = await shopUserDetail({
+      id: goodsStore.vipUserInfo.id,
+    })
+
+    console.log(res)
+    goodsStore.vipUserInfo = res
+  } catch (e) {
+    console.log(e)
+  }
+}
+
+// 不支付返回清楚所有优惠
+function returnHandle() {
+  dialogVisible.value = false
+  goodsStore.calcCartInfo({
+    pointsPerYuan: '',
+    maxDeductionAmount: '',
+    userPoints: '',
+    backendCoupons: [],
+    fixedAmount: ''
+  })
 }
 
 defineExpose({
@@ -312,7 +353,7 @@ defineExpose({
         $padding: 10px;
 
         .master_id {
-          height: 77px;
+          height: 127px;
           font-size: calc(var(--el-font-size-base) + 10px);
           border-bottom: 1px solid #ececec;
           padding: $padding 0;
@@ -321,8 +362,28 @@ defineExpose({
           justify-content: space-between;
 
           .member_info {
-            color: #999;
             font-size: 16px;
+            display: flex;
+            align-items: center;
+            gap: 10px;
+
+            &.s {
+              color: #999;
+              font-size: 14px;
+            }
+
+            &.between {
+              justify-content: space-between;
+            }
+
+            .vip {
+              background-color: #F8F8F8;
+              border-radius: 6px;
+              color: #333;
+              font-size: 12px;
+              padding: 4px 8px;
+              color: #333;
+            }
           }
         }
 
@@ -345,7 +406,7 @@ defineExpose({
 
     .list_wrap {
       padding: 0 var(--el-font-size-base);
-      height: calc(100vh - 222px);
+      height: calc(100vh - 270px);
       overflow-y: auto;
     }