完善地址

src/pages/cashier/cashier.vue

@@ -6,25 +6,23 @@
     }
 }
 </route>
-
-
 <template>
-    <view class="">
+    <view>
         <view>
-			<navbar title="收银台" custom-class='!bg-[#F6F7F8]'></navbar>
-		</view>
+			<navbar title="收银台" custom-class='!bg-[#F6F7F8]' :leftArrow="false"></navbar>
+		</view> 
 
         <!-- 支付信息 -->
         <view class="mt-56rpx text-center">
-            <view class="text-28rpx leading-40rpx text-#606266">顾客打赏-茶艺师名字</view>
+            <view class="text-28rpx leading-40rpx text-#606266">顾客打赏-{{ info.name }}</view>
             <view class="mt-24rpx">
-                <price-format color="#303133" :first-size="44" :second-size="44" :subscript-size="28" :price="100"></price-format>
+                <price-format color="#303133" :first-size="44" :second-size="44" :subscript-size="28" :price="tipMoney"></price-format>
             </view>
             <view class="mt-12rpx flex items-center justify-center">
                 <view class="text-24rpx leading-34rpx text-#606266">
                     支付剩余时间           
                 </view>             
-                <wd-count-down :time="time" custom-class="!text-[#606266] !text-24rpx !leading-34rpx"	/>
+                <wd-count-down :time="time" custom-class="!text-[#606266] !text-24rpx !leading-34rpx" />
             </view>
         </view>
 
@@ -35,20 +33,86 @@
             <pay hide-store-balance @pay="Cashier.handleGetPayValue"></pay>
         </view>
 
-        <view class="fixed bottom-70rpx left-0 right-0 bg-#4C9F44 text-#fff font-bold text-30rpx leading-42rpx mx-60rpx h-90rpx leading-90rpx text-center rounded-8rpx">立即支付</view>
+        <view
+            class="fixed bottom-70rpx left-0 right-0 bg-#4C9F44 text-#fff font-bold text-30rpx leading-42rpx mx-60rpx h-90rpx leading-90rpx text-center rounded-8rpx" 
+            @click="Cashier.handleToPay">立即支付
+        </view>
     </view>
 </template>
 
 <script lang="ts" setup>
     import Pay from '@/components/Pay.vue'
+    import { getTeaSpecialistDetails } from '@/api/tea'
+    import { ITeaSpecialistDetailsFields } from '@/api/types/tea'
+    import { toast } from '@/utils/toast'
+	import { router } from '@/utils/tools'
+    import { payTipTeaSpecialist } from '@/api/pay'
 
     // 支付倒计时取消
     const time = ref<number>(30 * 60 * 60 * 1000)
 
+    // 打赏金额
+    const tipMoney = ref<number>(0)
+    
+    // 茶艺师详情
+    const id = ref<number>(0)
+    const info = reactive<ITeaSpecialistDetailsFields>({ 
+        name: '',
+        star: 0,
+        image: '',
+        reservation_num: 0,
+        distance: 0,
+        speed: 0,
+        real: { gender: 1, both: 18, height: 165, weight: 53, interests: '爱好茶艺，喜欢旅游，把爱好当工作' },
+        teamasterlabel: [],
+        teamasterLevel: [],
+        price: 0,
+        fare_price: 0,
+        collect: 0
+    })
+
+    // 支付方式
+    const pay = ref<number>(0)
+    
+    onLoad(async (args) => {
+        if (args.id && args.lat && args.lng && args.user_id && args.money) {
+            id.value = Number(args.id)
+            tipMoney.value = Number(args.money)
+
+            // 获取茶艺师详情
+            const res = await getTeaSpecialistDetails({
+                id: args.id,
+                latitude: args.lat,
+                longitude: args.lng,
+                user_id: args.user_id
+            })
+            // 将返回的数据合并到 reactive 对象中
+            Object.assign(info, res.teamaster || {})
+
+        } else {
+            toast.info('参数错误')
+            return
+        }
+
+        console.log('页面加载')
+    })
+
     const Cashier = {
         // 获取支付方式
-        handleGetPayValue(value: number) {
-            console.log('支付方式', value)
+        handleGetPayValue: (value: number) => {
+            pay.value = value
+        },
+
+        // 去支付
+        handleToPay: () => {
+            payTipTeaSpecialist({
+                id: id.value,
+                tip_price: tipMoney.value,
+                pay_type: pay.value
+            }).then(res => {
+                router.navigateTo('/pages/notice/reserve?type=tipSuccess')
+                console.log("🚀 ~ res:", res)
+            })
         }
     }
 </script>