feat: 设置导航栏的颜色

This commit is contained in:
2026-03-10 16:53:53 +08:00
parent 5031a710db
commit b69d24b96a
3 changed files with 12 additions and 25 deletions

1
.gitignore vendored
View File

@@ -22,3 +22,4 @@ dist
*.sw?
unpackage
.hbuilderx
.claude

View File

@@ -1,37 +1,23 @@
<template>
<view :class="navBarClass" :style="navBarStyle">
<!-- 状态栏占位 -->
<view
:style="{ height: statusBarHeight + 'px' }"
v-if="!hideStatusBar"
></view>
<view :style="{ height: statusBarHeight + 'px' }" v-if="!hideStatusBar"></view>
<!-- 导航栏内容 -->
<view
class="flex flex-items-center flex-justify-between border-box pl-8 pr-8"
:style="{ height: navBarHeight + 'px' }"
>
<view class="flex flex-items-center flex-justify-between border-box pl-8 pr-8"
:style="{ height: navBarHeight + 'px' }">
<!-- 左侧返回按钮 -->
<view
class="nav-bar-left flex flex-items-center flex-justify-center"
v-if="showBack"
@click="handleBack"
>
<view class="nav-bar-left flex flex-items-center flex-justify-center" v-if="showBack" @click="handleBack">
<uni-icons type="left" size="20" :color="backIconColor" />
</view>
<!-- 中间标题区域 -->
<view
:class="[
'nav-bar-center flex flex-items-center flex-justify-center',
`nav-bar-center--${titleAlign}`,
]"
>
<view :class="[
'nav-bar-center flex flex-items-center flex-justify-center',
`nav-bar-center--${titleAlign}`,
]">
<slot name="title">
<text
class="font-size-17 font-500 color-000"
:style="{ color: titleColor }"
>
<text class="font-size-17 font-500 color-000" :style="{ color: titleColor }">
{{ title }}
</text>
</slot>
@@ -68,7 +54,7 @@ const props = defineProps({
// 背景颜色
background: {
type: String,
default: "#d9eeff",
default: "$theme-color-100",
},
// 标题颜色
titleColor: {

View File

@@ -2,7 +2,7 @@
<z-paging ref="paging" v-model="dataList" use-virtual-list :force-close-inner-list="true" cell-height-mode="dynamic"
safe-area-inset-bottom @query="queryList">
<template #top>
<TopNavBar title="快速预定" />
<TopNavBar title="快速预定" :background="$theme-color-100" />
<Tabs @change="handleTabChange" />