hookehuyr

新增首页跳转逻辑

<!--
* @Date: 2023-06-21 10:23:09
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-01-15 13:12:53
* @LastEditTime: 2024-01-16 14:09:56
* @FilePath: /xysBooking/src/views/index.vue
* @Description: 预约页首页
-->
......@@ -16,29 +16,29 @@
</van-swipe>
</div>
<div class="index-control">
<div class="booking">
<van-icon size="1.5rem" color="#FFFFFF" name="todo-list" />
立即预约
<div class="booking" @click="toBooking">
<van-icon size="1.5rem" color="#FFFFFF" name="https://cdn.ipadbiz.cn/xys/booking/%E7%AB%8B%E5%8D%B3%E9%A2%84%E7%BA%A6@2x.png" />
&nbsp;立即预约
</div>
<div class="record">
<van-icon size="1.5rem" color="#A67939" name="todo-list" />
预约记录
<div class="record" @click="toRecord">
<van-icon size="1.5rem" color="#A67939" name="https://cdn.ipadbiz.cn/xys/booking/%E9%A2%84%E7%BA%A6%E8%AE%B0%E5%BD%95@2x.png" />
&nbsp;预约记录
</div>
</div>
<div class="logo"></div>
</div>
<div class="index-nav">
<div class="nav-logo">
<van-icon size="1.5rem" name="wap-home" color="#A67939" />
<van-icon size="1.5rem" name="https://cdn.ipadbiz.cn/xys/booking/%E9%A6%96%E9%A1%B502@2x.png" color="#A67939" />
首页
</div>
<div class="nav-logo">
<van-icon size="5rem" name="wap-home" color="#A67939" style="position: absolute; top: -4rem;" />
<van-icon size="1.5rem" name="wap-home" color="#FFF" />
<div class="nav-logo" @click="toCode">
<van-icon size="5rem" name="https://cdn.ipadbiz.cn/xys/booking/%E4%BA%8C%E7%BB%B4%E7%A0%81@2x%20(1).png" color="#A67939" style="position: absolute; top: -4rem;" />
<van-icon size="1.5rem" name="wap-home" color="#FFF" style="opacity: 0;" />
预约码
</div>
<div class="nav-logo">
<van-icon size="1.5rem" name="manager-o" color="#A67939" />
<div class="nav-logo" @click="toMy">
<van-icon size="1.5rem" name="https://cdn.ipadbiz.cn/xys/booking/%E6%88%91%E7%9A%8401@2x.png" color="#A67939" />
我的
</div>
</div>
......@@ -54,11 +54,26 @@ import { Cookies, $, _, axios, storeToRefs, mainStore, Toast, useTitle } from '@
//import { } from '@/utils/generateIcons.js'
//import { } from '@/composables'
import { showSuccessToast, showFailToast } from 'vant';
import { useGo } from '@/hooks/useGo'
const $route = useRoute();
const $router = useRouter();
useTitle($route.meta.title);
const go = useGo();
const toBooking = () => {
go('/notice');
}
const toRecord = () => {
go('/bookingList');
}
const toCode = () => {
go('/bookingCode');
}
const toMy = () => {
go('/me');
}
onMounted(async () => {
});
......@@ -83,6 +98,9 @@ onMounted(async () => {
// font-weight: bold;
font-size: 1.15rem;
.booking {
display: flex;
justify-content: center;
align-items: center;
background-color: #A67939;
border-radius: 7px;
color: #FFFFFF;
......@@ -90,6 +108,9 @@ onMounted(async () => {
border: 1px solid #A67939;
}
.record {
display: flex;
justify-content: center;
align-items: center;
color: #A67939;
border-radius: 7px;
padding: 0.7rem 4rem;
......