fix: navbar commpontents

This commit is contained in:
zzc
2026-01-31 23:44:00 +08:00
parent 6f08363701
commit 790f0c19fb
3 changed files with 12 additions and 48 deletions

View File

@@ -2,7 +2,7 @@
<view> <view>
<!-- Placeholder to occupy space if fixed --> <!-- Placeholder to occupy space if fixed -->
<view <view
v-if="fixed && placeholder" v-if="fixed && placeholder && !transparent"
class="nav-placeholder" class="nav-placeholder"
:style="{ height: navBarHeight + 'px' }" :style="{ height: navBarHeight + 'px' }"
></view> ></view>
@@ -14,7 +14,7 @@
:style="{ :style="{
height: navBarHeight + 'px', height: navBarHeight + 'px',
paddingTop: statusBarHeight + 'px', paddingTop: statusBarHeight + 'px',
backgroundColor: background, backgroundColor: transparent ? 'transparent' : background,
color: color color: color
}" }"
> >
@@ -60,6 +60,10 @@ const props = defineProps({
type: Boolean, type: Boolean,
default: true, default: true,
}, },
transparent: {
type: Boolean,
default: false,
},
}); });
const navBarHeight = ref(64); const navBarHeight = ref(64);

View File

@@ -1,6 +1,6 @@
<template> <template>
<view class="fortune-detail-page"> <view class="fortune-detail-page">
<NavBar title="2026 灵马贺岁" /> <NavBar title="2026 灵马贺岁" :transparent="true"/>
<!-- 顶部提示条 --> <!-- 顶部提示条 -->
<view class="top-banner" v-if="inviterName"> <view class="top-banner" v-if="inviterName">

View File

@@ -1,10 +1,6 @@
<template> <template>
<view class="fortune-page" :style="{ paddingTop: getBavBarHeight() + 'px' }"> <view class="fortune-page" >
<!-- 顶部导航 --> <NavBar title="2026 新年运势" :transparent="true" color="#ffd700"/>
<view class="nav-bar">
<view class="back" @tap="goBack"></view>
<text class="nav-title">2026 新年运势</text>
</view>
<!-- 初始状态签筒 --> <!-- 初始状态签筒 -->
<view class="state-initial" v-if="status !== 'result'"> <view class="state-initial" v-if="status !== 'result'">
@@ -119,7 +115,7 @@
<script setup> <script setup>
import { ref, onUnmounted, computed } from "vue"; import { ref, onUnmounted, computed } from "vue";
import { getBavBarHeight, getDeviceInfo } from "@/utils/system"; import { getDeviceInfo } from "@/utils/system";
import { onLoad, onShow, onShareAppMessage } from "@dcloudio/uni-app"; import { onLoad, onShow, onShareAppMessage } from "@dcloudio/uni-app";
import { abilityCheck } from "@/api/system.js"; import { abilityCheck } from "@/api/system.js";
import { drawFortune } from "@/api/fortune.js"; import { drawFortune } from "@/api/fortune.js";
@@ -127,6 +123,7 @@ import { createShareToken, getShareReward } from "@/api/system.js";
import LoginPopup from "@/components/LoginPopup/LoginPopup.vue"; import LoginPopup from "@/components/LoginPopup/LoginPopup.vue";
import { useUserStore } from "@/stores/user"; import { useUserStore } from "@/stores/user";
import { saveRemoteImageToLocal, saveRecordRequest } from "@/utils/common.js"; import { saveRemoteImageToLocal, saveRecordRequest } from "@/utils/common.js";
import NavBar from "@/components/NavBar/NavBar.vue";
const userStore = useUserStore(); const userStore = useUserStore();
const loginPopupRef = ref(null); const loginPopupRef = ref(null);
@@ -199,14 +196,6 @@ const checkDrawStatus = async () => {
const currentFortune = ref({}); const currentFortune = ref({});
const cardId = ref(""); const cardId = ref("");
const goBack = () => {
if (status.value === "result") {
status.value = "initial";
} else {
uni.navigateBack();
}
};
const goToRecord = () => { const goToRecord = () => {
uni.navigateTo({ uni.navigateTo({
url: "/pages/fortune/record", url: "/pages/fortune/record",
@@ -391,35 +380,6 @@ const saveCard = () => {
z-index: 0; z-index: 0;
} }
/* 导航栏 */
.nav-bar {
width: 100%;
height: 44px;
display: flex;
align-items: center;
padding: 0 24rpx;
z-index: 100;
position: relative;
}
.back {
font-size: 50rpx;
color: #ffd700;
margin-right: 24rpx;
line-height: 1;
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
padding: 20rpx;
margin-left: -20rpx;
}
.nav-title {
font-size: 34rpx;
font-weight: 600;
color: #ffd700;
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
flex: 1;
text-align: center;
margin-right: 50rpx;
}
/* 初始状态 */ /* 初始状态 */
.state-initial { .state-initial {
width: 100%; width: 100%;
@@ -435,7 +395,7 @@ const saveCard = () => {
.header-text { .header-text {
text-align: center; text-align: center;
margin-bottom: 50px; margin-bottom: 150rpx;
} }
.title { .title {
font-size: 22px; font-size: 22px;