Showing
3 changed files
with
44 additions
and
23 deletions
| ... | @@ -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 | ... | ... |
-
Please register or login to post a comment