<route lang="jsonc" type="page">{
	"layout": "default",
	"style": {
		"navigationStyle": "custom"
	}
}</route>

<template>
	<view class="">
		<view class="">
			<wd-navbar safeAreaInsetTop custom-class='!bg-[#fff]' :bordered="false" placeholder>
                <template #left>
                    <view></view>
                </template>
            </wd-navbar>
		</view>
		<view class="mt-84rpx flex justify-center items-center">
			<view v-if="type == OrderType.TeaRoomOrder">
				<reserve-notice :title="isGroupBuying ? '套餐购买成功' : '茶室预约成功'" desc="可以点击下方查看订单详情">
					<template #layout>
						<view class="pb-22rpx mt-40rpx mx-30rpx flex justify-between items-center text-[32rpx] text-center">
							<view class='bg-[#F6F7F8] text-[#303133] rounded-8rpx h-90rpx leading-90rpx mr-28rpx w-300rpx' @click="reserve.handleRoomSeeOrder">查看订单</view>
							<view class='bg-[#4C9F44] text-[#fff] rounded-8rpx h-90rpx leading-90rpx w-300rpx' @click="reserve.handleToUse">去使用</view>
						</view>
					</template>
				</reserve-notice>
			</view>
			<view v-if="type == OrderType.TeaSpecialist">
				<reserve-notice title="茶艺师预约成功" desc="可以点击下方查看预约单具体信息">
					<template #layout>
						<view class="pb-22rpx mt-40rpx mx-30rpx flex justify-between items-center text-[32rpx] text-center">
							<view class='bg-[#F6F7F8] text-[#303133] rounded-8rpx h-90rpx leading-90rpx mr-28rpx w-300rpx' @click="reserve.handleSeeTeaSpecialistOrder">查看订单</view>
							<view class='bg-[#4C9F44] text-[#fff] rounded-8rpx h-90rpx leading-90rpx w-300rpx' @click="reserve.handleRoomDone">完成</view>
						</view>
					</template>
				</reserve-notice>
			</view>
			<view v-if="type == OrderType.ReserveGroup">
				<reserve-notice title="团体茶艺师预约成功" desc="团体茶艺师预约成功">
					<template #layout>
						<view class="pb-22rpx mt-40rpx mx-30rpx flex justify-between items-center text-[32rpx] text-center">
							<view class='bg-[#4C9F44] text-[#fff] rounded-8rpx h-90rpx leading-90rpx w-632rpx' @click="reserve.handleRoomDone">完成</view>
						</view>
					</template>
				</reserve-notice>
			</view>
			<view v-if="type == OrderType.TeaPackage">
				<reserve-notice title="套餐购买" desc="套餐购买成功">
					<template #layout>
						<view class="pb-22rpx mt-40rpx mx-30rpx flex justify-between items-center text-[32rpx] text-center">
							<view class='bg-[#4C9F44] text-[#fff] rounded-8rpx h-90rpx leading-90rpx w-632rpx' @click="reserve.handleToTeaSpecialistOrder">完成</view>
						</view>
					</template>
				</reserve-notice>
			</view>
		</view>
	</view>
	
</template>


<script lang="ts" setup>
	import ReserveNotice from '@/components/notice/Reserve.vue'
    import { ReserveServiceCategory, OrderType } from '@/utils/order'
    import { router } from '@/utils/tools'

	// 购买类型 room: 预约茶室
	const type = ref<string>('')

	// 是否是团购套餐
	const isGroupBuying = ref<number>(0)
		
	const storeId = ref<number>(0) // 店铺ID
	const storeType = ref<number>(0) // 1. 直营 2. 加盟
	const orderId = ref<number>(0) // 订单ID

	onLoad((args) => {
		storeId.value = Number(args.storeId) || 0
		storeType.value = Number(args.storeType) || 0
		orderId.value = Number(args.orderId) || 0
		console.log("🚀 ~ orderId.value:", orderId.value)

		type.value = args.type || ''
		isGroupBuying.value = Number(args.isGroupBuying) || 0
	})

	const reserve = {
		/**
		 * 预约茶室 - 查看订单
		 */
		handleRoomSeeOrder: () => {
			if (isGroupBuying.value) {
				router.navigateTo('/bundle/order/platform/order-list')
			} else {
				router.navigateTo('/bundle/order/tea-room/order-list')
			}
		},
		
		/**
		 * 预约茶艺师 - 查看订单
		 */
		handleSeeTeaSpecialistOrder: () => {
			router.navigateTo('/bundle/order/tea-specialist/order-list')
		},

		/**
		 * 跳转到对应的茶室列表
		 */
		handleToUse: () => {
			router.redirectTo(`/bundle/tea-room/room?id=${storeId.value}&type=${storeType.value}`)
		},

		/**
		 * 完成
		 */
		handleRoomDone: () => {
			router.redirectTo('/bundle_b/pages/tea-specialist/list')
			// router.switchTab('/pages/index/index')
		},

		/**
		 * 套餐购买关闭所有页面跳转到茶艺师列表
		 */
		handleToTeaSpecialistOrder: () => {
			router.reLaunch('/bundle/order/tea-specialist/order-list')
		}
	}
</script>

<style lang="scss" scoped>
</style>
