topnuomi
/
xx-worker-applets
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

修改hasPaddingTop为showHeader

This commit is contained in:
TOP糯米 2023-03-02 16:30:10 +08:00
parent 128b11525a
commit ece85b81c6
4 changed files with 22 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
src/components/layout/layout.vue
View File

@ -1,30 +1,31 @@
<template> <template>
<view class="page-layout" :style="{ backgroundColor: backgroundColor, minHeight: minHeight }"> <view class="page-layout" :style="{ backgroundColor: backgroundColor, minHeight: minHeight }">
<view <view
v-if="showHeader"
class="page-header" class="page-header"
:class="[textColor]" :class="[textColor]"
:style="{ :style="{
height: header.height + 'px', paddingTop: statusBarHeight + 'px',
paddingTop: header.pt + 'px', height: headerHeight + 'px',
backgroundColor: headerBackgroundColor, backgroundColor: headerBackgroundColor,
}" }"
> >
<block v-if="btnType === 'city'"> <block v-if="btnType === 'city'">
<view class="page-index-btn change-city" :style="{ height: header.height + 'px' }" @click="changeCity"> <view class="page-index-btn change-city" :style="{ height: headerHeight + 'px' }" @click="changeCity">
<text class="iconfont icon-31dingwei"></text> <text class="iconfont icon-31dingwei"></text>
<text class="city">成都市</text> <text class="city">成都市</text>
</view> </view>
</block> </block>
<block v-if="btnType === 'back'"> <block v-if="btnType === 'back'">
<view class="page-index-btn back" :style="{ height: header.height + 'px' }" @click="onClick"> <view class="page-index-btn back" :style="{ height: headerHeight + 'px' }" @click="onClick">
<text class="iconfont icon-fanhui"></text> <text class="iconfont icon-fanhui"></text>
</view> </view>
</block> </block>
<view class="page-title"> <view class="page-title">
<text class="title-text" :style="{ lineHeight: header.height + 'px' }">{{ title }}</text> <text class="title-text" :style="{ lineHeight: headerHeight + 'px' }">{{ title }}</text>
</view> </view>
</view> </view>
<view class="page-body" :style="{ paddingTop: bodyPt + 'px' }"> <view class="page-body" :style="{ paddingTop: bodyPaddingTop + 'px' }">
<slot></slot> <slot></slot>
</view> </view>
<view class="page-footer"></view> <view class="page-footer"></view>
@ -37,12 +38,9 @@ export default {
name: "component-layout", name: "component-layout",
data() { data() {
return { return {
header: { headerHeight: 0,
height: 0, statusBarHeight: 0,
pt: 0, bodyPaddingTop: 0,
},
bodyPt: 0,
bodyPb: 0,
}; };
}, },
components: {}, components: {},
@ -75,7 +73,7 @@ export default {
type: String, type: String,
default: "dark", default: "dark",
}, },
hasPaddingTop: { showHeader: {
type: Boolean, type: Boolean,
default: true, default: true,
}, },
@ -88,17 +86,17 @@ export default {
mounted() { mounted() {
const { statusBarHeight, headerHeight } = this.config; const { statusBarHeight, headerHeight } = this.config;
// #ifndef H5 // #ifndef H5
this.header.pt = statusBarHeight; this.statusBarHeight = statusBarHeight;
this.header.height = headerHeight; this.headerHeight = headerHeight;
// #endif // #endif
// #ifdef H5 // #ifdef H5
this.header.pt = 0; this.statusBarHeight = 0;
this.header.height = this.$utils.rpx2px(headerHeight * 2); this.headerHeight = this.$utils.rpx2px(headerHeight * 2);
// #endif // #endif
let safePt = this.header.pt + this.header.height; let safePaddingTop = this.statusBarHeight + this.headerHeight;
this.$emit("input", safePt); this.$emit("input", safePaddingTop);
if (this.hasPaddingTop) { if (this.showHeader) {
this.bodyPt = safePt; this.bodyPaddingTop = safePaddingTop;
} }
}, },
methods: { methods: {

2
src/pages/auth/auth.vue
View File

@ -1,5 +1,5 @@
<template> <template>
<app-layout v-model="safePt" btnType="unset" headerBackgroundColor="unset" :hasPaddingTop="false"> <app-layout v-model="safePt" btnType="unset" headerBackgroundColor="unset" :showHeader="false">
<view class="auth-container"> <view class="auth-container">
<view class="immerse-image"> <view class="immerse-image">
<image class="image" :src="backgroundImage" mode="aspectFill" /> <image class="image" :src="backgroundImage" mode="aspectFill" />

2
src/pages/index/index.vue
View File

@ -1,5 +1,5 @@
<template> <template>
<app-layout v-model="safePt" btnType="unset" headerBackgroundColor="unset" :hasPaddingTop="false"> <app-layout v-model="safePt" btnType="unset" headerBackgroundColor="unset" :showHeader="false">
<view class="index-container"> <view class="index-container">
<view class="immerse-image"> <view class="immerse-image">
<image class="image" :src="backgroundImage" mode="aspectFill" /> <image class="image" :src="backgroundImage" mode="aspectFill" />

2
src/pages/member/member.vue
View File

@ -1,5 +1,5 @@
<template> <template>
<app-layout v-model="safePt" btnType="unset" headerBackgroundColor="unset" :hasPaddingTop="false"> <app-layout v-model="safePt" btnType="unset" headerBackgroundColor="unset" :showHeader="false">
<view class="member-container"> <view class="member-container">
<view class="immerse-image"> <view class="immerse-image">
<image class="image" :src="backgroundImage" mode="aspectFill" /> <image class="image" :src="backgroundImage" mode="aspectFill" />