新增预约人员信息逻辑

 <!--
 <!--
  * @Date: 2024-01-15 16:25:51
  * @Date: 2024-01-15 16:25:51
  * @LastEditors: hookehuyr hookehuyr@gmail.com
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2024-01-15 17:30:46
+ * @LastEditTime: 2024-01-16 15:39:18
  * @FilePath: /xysBooking/src/views/submit.vue
  * @FilePath: /xysBooking/src/views/submit.vue
  * @Description: 文件描述
  * @Description: 文件描述
 -->
 -->
 <template>
 <template>
   <div class="submit-page">
   <div class="submit-page">
-    <div class="visit-time">
+    <div @click="goToBooking" class="visit-time">
       <div>参访时间</div>
       <div>参访时间</div>
-      <div>2024-01-10 05:00-08:00&nbsp;<van-icon name="arrow" /></div>
+      <div>{{ date }} {{ time }}&nbsp;<van-icon name="arrow" /></div>
     </div>
     </div>
-    <div class="add-visitors">
+    <div @click="goToVisitor" class="add-visitors">
       <div><van-icon name="plus" /> 添加参观者</div>
       <div><van-icon name="plus" /> 添加参观者</div>
     </div>
     </div>
     <div class="visitors-list">
     <div class="visitors-list">
@@ -31,10 +31,10 @@
     <div class="submit-wrapper">
     <div class="submit-wrapper">
       <div class="left">
       <div class="left">
         <div style="margin-left: 1rem; display: flex;align-items: center;">
         <div style="margin-left: 1rem; display: flex;align-items: center;">
-          订单金额&nbsp;&nbsp;<div style="color: #FF1919;display: inline-block;">¥<div style="font-size: 1.5rem;display: inline-block;">50</div></div>
+          订单金额&nbsp;&nbsp;<div style="color: #FF1919;display: inline-block;">¥<div style="font-size: 1.5rem;display: inline-block;">&nbsp;{{ total }}</div></div>
         </div>
         </div>
       </div>
       </div>
-      <div class="right">提交订单</div>
+      <div @click="submitBtn" class="right">提交订单</div>
     </div>
     </div>
   </div>
   </div>
 </template>
 </template>
@@ -47,10 +47,14 @@ import { Cookies, $, _, axios, storeToRefs, mainStore, Toast, useTitle } from '@
 //import { } from '@/utils/generateModules.js'
 //import { } from '@/utils/generateModules.js'
 //import { } from '@/utils/generateIcons.js'
 //import { } from '@/utils/generateIcons.js'
 //import { } from '@/composables'
 //import { } from '@/composables'
+import { useGo } from '@/hooks/useGo'
+import { showSuccessToast, showFailToast, showToast } from 'vant';
 const $route = useRoute();
 const $route = useRoute();
 const $router = useRouter();
 const $router = useRouter();
 useTitle($route.meta.title);
 useTitle($route.meta.title);
 
 
+const go = useGo();
+
 const visitorList = ref([{ id: '1', name: '张雨燕1', idCard: '3101******234' }, {  id: '2', name: '张雨燕2', idCard: '3101******234' }, {  id: '3',name: '张雨燕3', idCard: '3101******234' }, {  id: '4',name: '张雨燕4', idCard: '3101******234' }]);
 const visitorList = ref([{ id: '1', name: '张雨燕1', idCard: '3101******234' }, {  id: '2', name: '张雨燕2', idCard: '3101******234' }, {  id: '3',name: '张雨燕3', idCard: '3101******234' }, {  id: '4',name: '张雨燕4', idCard: '3101******234' }]);
 
 
 const checked_visitors = ref([]);
 const checked_visitors = ref([]);
@@ -61,6 +65,34 @@ const addVisitor = (item) => {
     checked_visitors.value.push(item.id);
     checked_visitors.value.push(item.id);
   }
   }
 }
 }
+
+const date = $route.query.date;
+const time = $route.query.time;
+const price = $route.query.price;
+
+const total = computed(() => {
+  return price * checked_visitors.value.length;
+})
+
+const goToBooking = () => {
+  go('/booking');
+}
+const goToVisitor = () => {
+  go('/addVisitor');
+}
+
+const submitBtn = () => {
+  if (!checked_visitors.value.length) {
+    showToast('请先添加参观者！')
+  } else {
+    // TODO: 提交订单跳转到支付页面
+    go('/success');
+  }
+}
+
+onMounted(() => {
+
+});
 </script>
 </script>
 
 
 <style lang="less" scoped>
 <style lang="less" scoped>