refactor(布局): 移除AppLayout中的title必填项并调整样式
移除AppLayout组件中title属性的必填限制,并根据是否传入title动态调整页面布局样式。同时,在多个页面中移除了不再需要的title属性,以简化代码并提高组件灵活性。
Showing
5 changed files
with
15 additions
and
8 deletions
| ... | @@ -24,7 +24,6 @@ declare module 'vue' { | ... | @@ -24,7 +24,6 @@ declare module 'vue' { |
| 24 | SummerCampCard: typeof import('./components/ui/SummerCampCard.vue')['default'] | 24 | SummerCampCard: typeof import('./components/ui/SummerCampCard.vue')['default'] |
| 25 | TermsPopup: typeof import('./components/ui/TermsPopup.vue')['default'] | 25 | TermsPopup: typeof import('./components/ui/TermsPopup.vue')['default'] |
| 26 | VanButton: typeof import('vant/es')['Button'] | 26 | VanButton: typeof import('vant/es')['Button'] |
| 27 | - VanCell: typeof import('vant/es')['Cell'] | ||
| 28 | VanCellGroup: typeof import('vant/es')['CellGroup'] | 27 | VanCellGroup: typeof import('vant/es')['CellGroup'] |
| 29 | VanCheckbox: typeof import('vant/es')['Checkbox'] | 28 | VanCheckbox: typeof import('vant/es')['Checkbox'] |
| 30 | VanDatePicker: typeof import('vant/es')['DatePicker'] | 29 | VanDatePicker: typeof import('vant/es')['DatePicker'] | ... | ... |
| 1 | +<!-- | ||
| 2 | + * @Date: 2025-03-20 20:36:36 | ||
| 3 | + * @LastEditors: hookehuyr hookehuyr@gmail.com | ||
| 4 | + * @LastEditTime: 2025-03-24 14:05:01 | ||
| 5 | + * @FilePath: /mlaj/src/components/layout/AppLayout.vue | ||
| 6 | + * @Description: 文件描述 | ||
| 7 | +--> | ||
| 1 | <template> | 8 | <template> |
| 2 | <div class="bg-gradient-to-br from-green-50 via-teal-50 to-blue-50 min-h-screen pb-16"> | 9 | <div class="bg-gradient-to-br from-green-50 via-teal-50 to-blue-50 min-h-screen pb-16"> |
| 3 | <GradientHeader | 10 | <GradientHeader |
| 11 | + v-if="title" | ||
| 4 | :title="title" | 12 | :title="title" |
| 5 | :showBackButton="showBackButton" | 13 | :showBackButton="showBackButton" |
| 6 | :onBack="handleBack" | 14 | :onBack="handleBack" |
| 7 | :rightContent="rightContent" | 15 | :rightContent="rightContent" |
| 8 | /> | 16 | /> |
| 9 | - <main class="pb-16"> | 17 | + <main :class="{ 'pb-16': title, 'py-4': !title }"> |
| 10 | <slot></slot> | 18 | <slot></slot> |
| 11 | </main> | 19 | </main> |
| 12 | <BottomNav v-if="!hideBottomNav" /> | 20 | <BottomNav v-if="!hideBottomNav" /> |
| ... | @@ -20,7 +28,7 @@ import GradientHeader from '../ui/GradientHeader.vue' | ... | @@ -20,7 +28,7 @@ import GradientHeader from '../ui/GradientHeader.vue' |
| 20 | const props = defineProps({ | 28 | const props = defineProps({ |
| 21 | title: { | 29 | title: { |
| 22 | type: String, | 30 | type: String, |
| 23 | - required: true | 31 | + required: false |
| 24 | }, | 32 | }, |
| 25 | showBackButton: { | 33 | showBackButton: { |
| 26 | type: Boolean, | 34 | type: Boolean, | ... | ... |
| ... | @@ -6,7 +6,7 @@ | ... | @@ -6,7 +6,7 @@ |
| 6 | * @Description: 文件描述 | 6 | * @Description: 文件描述 |
| 7 | --> | 7 | --> |
| 8 | <template> | 8 | <template> |
| 9 | - <AppLayout title="帮助中心"> | 9 | + <AppLayout> |
| 10 | <div class="bg-gradient-to-br from-green-50 via-green-100/30 to-blue-50/30 min-h-screen"> | 10 | <div class="bg-gradient-to-br from-green-50 via-green-100/30 to-blue-50/30 min-h-screen"> |
| 11 | <div class="px-4 py-6"> | 11 | <div class="px-4 py-6"> |
| 12 | <FrostedGlass class="rounded-xl overflow-hidden"> | 12 | <FrostedGlass class="rounded-xl overflow-hidden"> | ... | ... |
| 1 | <!-- | 1 | <!-- |
| 2 | * @Date: 2025-03-24 12:56:07 | 2 | * @Date: 2025-03-24 12:56:07 |
| 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com | 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com |
| 4 | - * @LastEditTime: 2025-03-24 13:07:40 | 4 | + * @LastEditTime: 2025-03-24 14:05:34 |
| 5 | * @FilePath: /mlaj/src/views/profile/MessagesPage.vue | 5 | * @FilePath: /mlaj/src/views/profile/MessagesPage.vue |
| 6 | * @Description: 消息中心页面 | 6 | * @Description: 消息中心页面 |
| 7 | --> | 7 | --> |
| 8 | <template> | 8 | <template> |
| 9 | - <AppLayout title="消息中心"> | 9 | + <AppLayout> |
| 10 | <div class="bg-gradient-to-br from-green-50 via-green-100/30 to-blue-50/30 min-h-screen"> | 10 | <div class="bg-gradient-to-br from-green-50 via-green-100/30 to-blue-50/30 min-h-screen"> |
| 11 | <van-list | 11 | <van-list |
| 12 | v-model:loading="loading" | 12 | v-model:loading="loading" | ... | ... |
| 1 | <!-- | 1 | <!-- |
| 2 | * @Date: 2025-03-24 13:04:21 | 2 | * @Date: 2025-03-24 13:04:21 |
| 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com | 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com |
| 4 | - * @LastEditTime: 2025-03-24 13:22:18 | 4 | + * @LastEditTime: 2025-03-24 14:05:18 |
| 5 | * @FilePath: /mlaj/src/views/profile/SettingsPage.vue | 5 | * @FilePath: /mlaj/src/views/profile/SettingsPage.vue |
| 6 | * @Description: 用户设置页面 | 6 | * @Description: 用户设置页面 |
| 7 | --> | 7 | --> |
| 8 | <template> | 8 | <template> |
| 9 | - <AppLayout title="设置"> | 9 | + <AppLayout> |
| 10 | <div class="bg-gradient-to-br from-green-50 via-green-100/30 to-blue-50/30 min-h-screen"> | 10 | <div class="bg-gradient-to-br from-green-50 via-green-100/30 to-blue-50/30 min-h-screen"> |
| 11 | <div class="px-4 py-6"> | 11 | <div class="px-4 py-6"> |
| 12 | <FrostedGlass class="rounded-xl overflow-hidden"> | 12 | <FrostedGlass class="rounded-xl overflow-hidden"> | ... | ... |
-
Please register or login to post a comment