feat: 提交订单页面搭建

src/pages-booking/index.vue

@@ -0,0 +1,61 @@
+<template>
+  <view class="booking h-screen flex flex-col">
+    <TopNavBar
+      titleAlign="center"
+      backgroundColor="#D9EEFF"
+      backIconColor="#000"
+      :shadow="false"
+    >
+      <template #title>
+        {{ title }}
+      </template>
+    </TopNavBar>
+
+    <view class="booking-content flex-full border-box p-12">
+      <!-- 预约内容 -->
+      <view class="border-box bg-white p-12 rounded-12 mb-12">
+        <view class="font-size-16 font-500 color-000 line-height-24"
+          >【温泉季】戏水单人票 +单人简餐</view
+        >
+
+        <view
+          class="border-box border-bottom font-size-12 color-99A0AE line-height-16 pb-12"
+          >温泉早鸟票2张 黄南武辣子鸡2人套餐1份</view
+        >
+
+        <view
+          class="border-box flex flex-items-center flex-justify-between pt-12"
+        >
+          <text class="font-size-12 color-43669A line-height-18"
+            >使用时间:周一至周日9:00-22:00</text
+          >
+          <view class="flex flex-items-center">
+            <text class="font-size-12 color-2D91FF line-height-16"
+              >取消政策</text
+            >
+            <uni-icons type="right" size="15" color="#99A0AE" />
+          </view>
+        </view>
+      </view>
+
+      <!-- 非酒店类型 -->
+      <ContactSection v-if="false" />
+
+      <!-- 酒店类型 -->
+      <UserSection />
+    </view>
+  </view>
+</template>
+
+<script setup>
+import { ref } from "vue";
+import TopNavBar from "@/components/TopNavBar/index.vue";
+import ContactSection from "./components/ConactSection/index.vue";
+import UserSection from "./components/UserSection/index.vue";
+
+const title = ref("预约");
+</script>
+
+<style scoped lang="scss">
+@import "./styles/index.scss";
+</style>