From e0cb82c8dbf83fabc0cab548abc873926366fb75 Mon Sep 17 00:00:00 2001 From: zhengyiming <540361168@qq.com> Date: 星期三, 21 五月 2025 17:29:15 +0800 Subject: [PATCH] fix: 修改ui --- apps/taro/src/components/Layout/PageLayout.vue | 106 +++++++++++++++++++++++++++-------------------------- 1 files changed, 54 insertions(+), 52 deletions(-) diff --git a/apps/taro/src/components/Layout/PageLayout.vue b/apps/taro/src/components/Layout/PageLayout.vue index 474d352..d67b575 100644 --- a/apps/taro/src/components/Layout/PageLayout.vue +++ b/apps/taro/src/components/Layout/PageLayout.vue @@ -1,18 +1,8 @@ <template> <Portal.Host> - <div class="page-layout-wrapper" v-bind="$attrs"> - <slot v-if="showNavigationBar" name="navigationBar"> + <div :class="['page-layout-wrapper', { isWeb: isWeb, hasBgColor }]"> + <slot v-if="_showNavigationBar" name="navigationBar"> <CommonNavigationBar v-bind="_commonNavigationBarProps" /> - </slot> - - <slot name="bg"> - <div - v-if="hasLinearBg" - class="page-layout-linear-bg" - :style="{ - height: Taro.pxTransform(props.linearBgHeight), - }" - ></div> </slot> <div class="page-layout-scroll-view-wrapper" :style="{ height: scrollViewHeight }"> @@ -42,36 +32,37 @@ import { useSystemStore } from '@/stores/modules/system'; import Taro from '@tarojs/taro'; import { TabBarPageRouter } from '@/constants'; -import { useAuth } from '@/hooks'; +import { useAuth, useTabRouteEnhance } from '@/hooks'; import { Portal } from 'senin-mini/components'; import { usePickProps } from 'senin-mini/hooks'; +import { isWeb, isInAlipay, isInWeChat } from '@/utils/env'; +//@ts-ignore +import { setPageTitle } from '@/utils'; +import { pageLayoutProps } from './layout'; defineOptions({ name: 'PageLayout', inheritAttrs: false, }); -const props = defineProps({ - ...commonNavigationBarProps, - needAuth: { - type: Boolean, - default: true, - }, - useView: { - type: Boolean, - default: false, - }, - hasLinearBg: { - type: Boolean, - default: false, - }, - linearBgHeight: { - type: Number, - default: 388, - }, -}); +const props = defineProps(pageLayoutProps); + +setPageTitle(props.title); + +useTabRouteEnhance(); const _commonNavigationBarProps = usePickProps(props, commonNavigationBarProps); + +const _showNavigationBar = computed(() => { + if (props.showNavigationBar) { + // if (isWeb) { + // return !isInAlipay && !isInWeChat; + // } + return true; + } else { + return false; + } +}); const { isAuth } = useAuth({ needAuth: props.needAuth, @@ -85,33 +76,39 @@ ); const navigationBarHeight = computed( - () => systemStore.info.statusBarHeight + systemStore.navigationBarHeight + () => (systemStore.info.statusBarHeight || 0) + systemStore.navigationBarHeight ); const scrollViewHeight = computed(() => { let pageHeight = pageHeightWithTabBar.value ? systemStore.pageHeightWithTab : systemStore.pageHeight; - pageHeight = pageHeight + (props.showNavigationBar ? 0 : navigationBarHeight.value); + pageHeight = pageHeight + (_showNavigationBar.value ? 0 : navigationBarHeight.value); return pageHeight + 'px'; -}); - -Taro.getSetting({ - success: function (res) { - if (!res.authSetting['scope.userLocation']) { - Taro.authorize({ - scope: 'scope.userLocation', - }); - } - }, }); </script> <style lang="scss"> @import '@/styles/common.scss'; +.page-layout-container { + height: 100%; + position: relative; + + .page-layout-wrapper { + width: 100%; + height: 100%; + position: absolute; + z-index: 100; + } +} + .page-layout-wrapper { - // background-color: $body-background-color; + /* background-color: $body-background-color; */ + + &.hasBgColor { + background-color: $body-background-color; + } .page-layout-scroll-view-wrapper { display: flex; @@ -128,14 +125,19 @@ top: 0; left: 0; width: 100%; - background: linear-gradient( - 180deg, - boleGetCssVar('color', 'primary') 0%, - #5a86f6 56%, - #f9f9fb 100% - ); - filter: blur(0px); + background: linear-gradient(180deg, #7cd0ff 0%, rgba(255, 255, 255, 0) 43%, #ffffff 100%); border-radius: 0px 0px 20px 20px; } + + &.isWeb { + height: 100%; + display: flex; + flex-direction: column; + + .page-layout-scroll-view-wrapper { + flex: 1; + min-height: 0; + } + } } </style> -- Gitblit v1.9.1