index.vue
3.19 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
<!--
* @Date: 2024-01-15 11:43:01
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-02-04 22:29:54
* @FilePath: /xyxBooking-weapp/src/pages/notice/index.vue
* @Description: 文件描述
-->
<template>
<view class="notice-page">
<view class="content">
<view style="text-align: center; font-size: 1.1rem; margin-bottom: 0.5rem;">温馨提示</view>
<view>
为了您和他人的健康与安全，维护清净庄严的寺院环境，营造一个喜悦而祥和的节日氛围，请您留意并遵守以下注意事项：
</view>
<view v-for="(item, index) in note_text" :key="index" style="margin-top: 0.5rem;">{{ item }}</view>
<view style="margin-top: 0.5rem;">谢谢您的支持与配合。祝您新春吉祥、万事如意。</view>
</view>
<view style="height: 8rem"></view>
<view class="footer">
<nut-checkbox-group v-model="checked">
<nut-checkbox label="1" icon-size="1rem">
<text style="color: #a67939; font-size: 1rem">我已阅读并同意以上内容</text>
</nut-checkbox>
</nut-checkbox-group>
<view @tap="confirmBtn" class="confirm-btn">确认，下一步</view>
</view>
</view>
</template>
<script setup>
import { ref } from "vue";
import Taro, { useDidShow } from '@tarojs/taro'
import { useGo } from "@/hooks/useGo";
const go = useGo();
const note_text = [
'1、敬香贵在心诚，不在数量多少。三支清香，可表心诚。请带着虔诚心、恭敬心和清净心敬香礼佛。',
'2、请不要自带香烛进寺院。山门殿两侧设有赠香处，凭香花券可免费领取三支清香。',
'3、点燃香烛时请多加小心，以免灼伤自己与他人。',
'4、请在指定燃香处燃香，禁止将香烛带入殿堂。禁止燃放烟花爆竹。',
'5、请爱护公共绿地，请不要踩踏及在草坪上点烛燃香。',
'6、请照看好身边的家人，以免走散。',
'7、请保管好自己随身携带的钱物，以免丢失给您带来麻烦。',
'8、您若有任何问题和困难，请向身边的法师或义工咨询、求助，或直接与客堂联系。电话:0512-65349545。',
'9、预约如需退款，请在初七之后，到客堂办理。'
];
const checked = ref([]);
const confirmBtn = () => {
if (checked.value.includes("1")) {
go("/booking");
} else {
Taro.showToast({ title: "请勾选同意须知", icon: "none" });
}
};
</script>
<style lang="less">
.notice-page {
position: relative;
min-height: 100vh;
background-color: #F6F6F6;
padding-top: 1px; // 防止 margin collapse
.content {
margin: 1rem;
background-color: #ffffff;
border-radius: 8px;
padding: 1rem;
color: #333;
font-size: 0.9rem;
line-height: 1.5;
}
.footer {
position: fixed;
bottom: 0;
width: 100vw;
background-color: #FFF;
display: flex;
flex-direction: column;
padding: 1rem;
box-sizing: border-box;
box-shadow: 0rem -0.33rem 0.25rem 0rem rgba(0,0,0,0.12);
.confirm-btn {
background-color: #A67939;
color: #FFF;
text-align: center;
padding: 0.8rem 0;
border-radius: 8px;
margin-top: 1rem;
font-size: 1.1rem;
}
}
}
</style>