mirror of
http://git.coreshop.cn/jianweie/coreshoppro.git
synced 2025-12-06 17:23:26 +08:00
uniapp【修复】:修复同步导行栏高度
This commit is contained in:
@@ -1,5 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
<uv-navbar :bgColor="props.bgColor">
|
<uv-navbar :bgColor="props.bgColor" placeholder :height="menuButtonHeight+'px'">
|
||||||
<template #left>
|
<template #left>
|
||||||
<view class="page-back">
|
<view class="page-back">
|
||||||
<image v-if="props.isBack" @click="hanlderBack" class="back"
|
<image v-if="props.isBack" @click="hanlderBack" class="back"
|
||||||
@@ -15,7 +15,9 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
|
import { useSystemInfo } from '@/core/hooks';
|
||||||
import { handleStaticResources } from '@/core/utils';
|
import { handleStaticResources } from '@/core/utils';
|
||||||
|
const { menuButtonHeight } = useSystemInfo();
|
||||||
|
|
||||||
const props = withDefaults(defineProps<{
|
const props = withDefaults(defineProps<{
|
||||||
isBack : boolean,
|
isBack : boolean,
|
||||||
|
|||||||
@@ -3,7 +3,7 @@
|
|||||||
<coreshop-navbar :isBack="props.isBack" :bgColor="props.bgColor" :mode="props.mode" :title="props.title"
|
<coreshop-navbar :isBack="props.isBack" :bgColor="props.bgColor" :mode="props.mode" :title="props.title"
|
||||||
:titleColor="props.titleColor" :handleCustomRouteJump="props.handleCustomRouteJump"></coreshop-navbar>
|
:titleColor="props.titleColor" :handleCustomRouteJump="props.handleCustomRouteJump"></coreshop-navbar>
|
||||||
<view class="layout-page-content"
|
<view class="layout-page-content"
|
||||||
:style="{ 'padding-top': `${props.isShowStatusBarHeight ? statusBarHeight : 0}px`, ...props.contentStyle }">
|
:style="{ ...props.contentStyle }">
|
||||||
<slot></slot>
|
<slot></slot>
|
||||||
</view>
|
</view>
|
||||||
<template v-if="props.showLoginModalDom">
|
<template v-if="props.showLoginModalDom">
|
||||||
|
|||||||
@@ -30,7 +30,7 @@
|
|||||||
skeletonLoading : boolean;
|
skeletonLoading : boolean;
|
||||||
}>(), {
|
}>(), {
|
||||||
isBack: true,
|
isBack: true,
|
||||||
bgColor: '#EEF3F7',
|
bgColor: '#D33123',
|
||||||
titleColor: '#000',
|
titleColor: '#000',
|
||||||
mode: 'center',
|
mode: 'center',
|
||||||
title: '',
|
title: '',
|
||||||
|
|||||||
@@ -4,16 +4,20 @@ export const useSystemInfo = () => {
|
|||||||
const state = reactive<{
|
const state = reactive<{
|
||||||
systemInfo : any;
|
systemInfo : any;
|
||||||
statusBarHeight : number;
|
statusBarHeight : number;
|
||||||
|
menuButtonHeight : number;
|
||||||
}>({
|
}>({
|
||||||
systemInfo: {},
|
systemInfo: {},
|
||||||
statusBarHeight: 0,
|
statusBarHeight: 0,
|
||||||
|
menuButtonHeight: 44
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
|
const menuButton = uni.getMenuButtonBoundingClientRect();
|
||||||
const systemInfo = await uni.getSystemInfo();
|
const systemInfo = await uni.getSystemInfo();
|
||||||
state.systemInfo = systemInfo;
|
state.systemInfo = systemInfo;
|
||||||
state.statusBarHeight = systemInfo.statusBarHeight + systemInfo.safeArea.top;
|
state.menuButtonHeight = menuButton.height + (menuButton.top - systemInfo.statusBarHeight) * 2;
|
||||||
|
state.statusBarHeight = systemInfo.statusBarHeight + state.menuButtonHeight;
|
||||||
})
|
})
|
||||||
|
|
||||||
return toRefs(state);
|
return toRefs(state);
|
||||||
|
|||||||
@@ -10,7 +10,7 @@
|
|||||||
</template>
|
</template>
|
||||||
</uv-navbar>
|
</uv-navbar>
|
||||||
|
|
||||||
<view class="content-box p-25" :style="{ 'padding-top': `${statusBarHeight + 10}px` }">
|
<view class="content-box p-25">
|
||||||
<CustomPage ref="homePage" :coreshopData="state.coreshopData"></CustomPage>
|
<CustomPage ref="homePage" :coreshopData="state.coreshopData"></CustomPage>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
|
|||||||
@@ -11,8 +11,7 @@
|
|||||||
.content-box {
|
.content-box {
|
||||||
position: relative;
|
position: relative;
|
||||||
margin: 25rpx;
|
margin: 25rpx;
|
||||||
padding-top: 200rpx;
|
|
||||||
|
|
||||||
.title-box {
|
.title-box {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
|||||||
@@ -1,3 +1,6 @@
|
|||||||
|
.layout-seckill-box{
|
||||||
|
padding-top: 80rpx;
|
||||||
|
}
|
||||||
.navbar-box {
|
.navbar-box {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
left: 0;
|
left: 0;
|
||||||
@@ -31,8 +34,6 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.seckill-box {
|
.seckill-box {
|
||||||
padding-top: 100rpx;
|
|
||||||
|
|
||||||
.card-box {
|
.card-box {
|
||||||
margin-bottom: 35rpx;
|
margin-bottom: 35rpx;
|
||||||
margin: 25rpx;
|
margin: 25rpx;
|
||||||
|
|||||||
Reference in New Issue
Block a user