hookehuyr

修改弹框形式

...@@ -18,10 +18,12 @@ declare module '@vue/runtime-core' { ...@@ -18,10 +18,12 @@ declare module '@vue/runtime-core' {
18 NutCalendar: typeof import('@nutui/nutui-taro')['Calendar'] 18 NutCalendar: typeof import('@nutui/nutui-taro')['Calendar']
19 NutCol: typeof import('@nutui/nutui-taro')['Col'] 19 NutCol: typeof import('@nutui/nutui-taro')['Col']
20 NutConfigProvider: typeof import('@nutui/nutui-taro')['ConfigProvider'] 20 NutConfigProvider: typeof import('@nutui/nutui-taro')['ConfigProvider']
21 + NutDialog: typeof import('@nutui/nutui-taro')['Dialog']
21 NutEmpty: typeof import('@nutui/nutui-taro')['Empty'] 22 NutEmpty: typeof import('@nutui/nutui-taro')['Empty']
22 NutImagePreview: typeof import('@nutui/nutui-taro')['ImagePreview'] 23 NutImagePreview: typeof import('@nutui/nutui-taro')['ImagePreview']
23 NutInput: typeof import('@nutui/nutui-taro')['Input'] 24 NutInput: typeof import('@nutui/nutui-taro')['Input']
24 NutInputNumber: typeof import('@nutui/nutui-taro')['InputNumber'] 25 NutInputNumber: typeof import('@nutui/nutui-taro')['InputNumber']
26 + NutOverlay: typeof import('@nutui/nutui-taro')['Overlay']
25 NutPopup: typeof import('@nutui/nutui-taro')['Popup'] 27 NutPopup: typeof import('@nutui/nutui-taro')['Popup']
26 NutPrice: typeof import('@nutui/nutui-taro')['Price'] 28 NutPrice: typeof import('@nutui/nutui-taro')['Price']
27 NutRadio: typeof import('@nutui/nutui-taro')['Radio'] 29 NutRadio: typeof import('@nutui/nutui-taro')['Radio']
...@@ -29,7 +31,6 @@ declare module '@vue/runtime-core' { ...@@ -29,7 +31,6 @@ declare module '@vue/runtime-core' {
29 NutRow: typeof import('@nutui/nutui-taro')['Row'] 31 NutRow: typeof import('@nutui/nutui-taro')['Row']
30 NutSwiper: typeof import('@nutui/nutui-taro')['Swiper'] 32 NutSwiper: typeof import('@nutui/nutui-taro')['Swiper']
31 NutSwiperItem: typeof import('@nutui/nutui-taro')['SwiperItem'] 33 NutSwiperItem: typeof import('@nutui/nutui-taro')['SwiperItem']
32 - NutTable: typeof import('@nutui/nutui-taro')['Table']
33 NutTabPane: typeof import('@nutui/nutui-taro')['TabPane'] 34 NutTabPane: typeof import('@nutui/nutui-taro')['TabPane']
34 NutTabs: typeof import('@nutui/nutui-taro')['Tabs'] 35 NutTabs: typeof import('@nutui/nutui-taro')['Tabs']
35 NutTag: typeof import('@nutui/nutui-taro')['Tag'] 36 NutTag: typeof import('@nutui/nutui-taro')['Tag']
......
...@@ -18,23 +18,6 @@ ...@@ -18,23 +18,6 @@
18 .index-list { 18 .index-list {
19 background-color: #f9f9f9; overflow: auto; 19 background-color: #f9f9f9; overflow: auto;
20 } 20 }
21 -
22 - .notice-wrapper {
23 - padding: 1rem;
24 - .notice-content {
25 - .title {
26 - font-weight: bold;
27 - text-align: center;
28 - margin-bottom: 0.5rem;
29 - }
30 - .content {
31 - margin-bottom: 0.5rem;
32 - }
33 - .mb-1 {
34 - margin-bottom: 1rem !important;
35 - }
36 - }
37 - }
38 } 21 }
39 .slide-box { 22 .slide-box {
40 height: 15rem; 23 height: 15rem;
...@@ -95,3 +78,37 @@ ...@@ -95,3 +78,37 @@
95 .fade-leave-to { 78 .fade-leave-to {
96 opacity: 0; 79 opacity: 0;
97 } 80 }
81 +
82 +.overlay-body {
83 + display: flex;
84 + height: 100%;
85 + align-items: center;
86 + justify-content: center;
87 +}
88 +.overlay-content {
89 + display: flex;
90 + width: 85%;
91 + height: 80%;
92 + background: #fff;
93 + border-radius: 8px;
94 + // align-items: center;
95 + // justify-content: center;
96 + overflow: scroll;
97 +}
98 +
99 +.notice-wrapper {
100 + padding: 1rem;
101 + .notice-content {
102 + .title {
103 + font-weight: bold;
104 + text-align: center;
105 + margin-bottom: 0.5rem;
106 + }
107 + .content {
108 + margin-bottom: 0.5rem;
109 + }
110 + .mb-1 {
111 + margin-bottom: 1rem !important;
112 + }
113 + }
114 +}
......
1 <!-- 1 <!--
2 * @Date: 2022-09-19 14:11:06 2 * @Date: 2022-09-19 14:11:06
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2024-05-24 17:36:51 4 + * @LastEditTime: 2024-05-24 19:23:29
5 * @FilePath: /meihuaApp/src/pages/index/index.vue 5 * @FilePath: /meihuaApp/src/pages/index/index.vue
6 * @Description: 首页 6 * @Description: 首页
7 --> 7 -->
...@@ -24,11 +24,11 @@ ...@@ -24,11 +24,11 @@
24 </scroll-view> 24 </scroll-view>
25 <view style="height: 6rem;"></view> 25 <view style="height: 6rem;"></view>
26 <nav-bar activated="index" /> 26 <nav-bar activated="index" />
27 - <nut-popup 27 + <nut-overlay
28 v-model:visible="show_notice" 28 v-model:visible="show_notice"
29 - position="right"
30 - :style="{ height: '100%' }"
31 > 29 >
30 + <div class="overlay-body">
31 + <div class="overlay-content">
32 <view class="notice-wrapper"> 32 <view class="notice-wrapper">
33 <!-- <view style="text-align: center; margin-bottom: 1rem;">梅花岛的描述和入住须知</view> --> 33 <!-- <view style="text-align: center; margin-bottom: 1rem;">梅花岛的描述和入住须知</view> -->
34 <view class="notice-content"> 34 <view class="notice-content">
...@@ -71,8 +71,11 @@ ...@@ -71,8 +71,11 @@
71 <view class="content">若入住当天取消,扣除100%费用。</view> 71 <view class="content">若入住当天取消,扣除100%费用。</view>
72 </view> 72 </view>
73 <nut-button @tap="onCloseNotice" color="#6a4925" block type="primary" style="margin-top: 1rem;">关闭</nut-button> 73 <nut-button @tap="onCloseNotice" color="#6a4925" block type="primary" style="margin-top: 1rem;">关闭</nut-button>
74 + <view style="height: 1rem;"></view>
74 </view> 75 </view>
75 - </nut-popup> 76 + </div>
77 + </div>
78 + </nut-overlay>
76 </view> 79 </view>
77 </template> 80 </template>
78 81
......