feat: 设置导航栏的颜色
This commit is contained in:
1
.gitignore
vendored
1
.gitignore
vendored
@@ -22,3 +22,4 @@ dist
|
|||||||
*.sw?
|
*.sw?
|
||||||
unpackage
|
unpackage
|
||||||
.hbuilderx
|
.hbuilderx
|
||||||
|
.claude
|
||||||
|
|||||||
@@ -1,37 +1,23 @@
|
|||||||
<template>
|
<template>
|
||||||
<view :class="navBarClass" :style="navBarStyle">
|
<view :class="navBarClass" :style="navBarStyle">
|
||||||
<!-- 状态栏占位 -->
|
<!-- 状态栏占位 -->
|
||||||
<view
|
<view :style="{ height: statusBarHeight + 'px' }" v-if="!hideStatusBar"></view>
|
||||||
:style="{ height: statusBarHeight + 'px' }"
|
|
||||||
v-if="!hideStatusBar"
|
|
||||||
></view>
|
|
||||||
|
|
||||||
<!-- 导航栏内容 -->
|
<!-- 导航栏内容 -->
|
||||||
<view
|
<view class="flex flex-items-center flex-justify-between border-box pl-8 pr-8"
|
||||||
class="flex flex-items-center flex-justify-between border-box pl-8 pr-8"
|
:style="{ height: navBarHeight + 'px' }">
|
||||||
:style="{ height: navBarHeight + 'px' }"
|
|
||||||
>
|
|
||||||
<!-- 左侧返回按钮 -->
|
<!-- 左侧返回按钮 -->
|
||||||
<view
|
<view class="nav-bar-left flex flex-items-center flex-justify-center" v-if="showBack" @click="handleBack">
|
||||||
class="nav-bar-left flex flex-items-center flex-justify-center"
|
|
||||||
v-if="showBack"
|
|
||||||
@click="handleBack"
|
|
||||||
>
|
|
||||||
<uni-icons type="left" size="20" :color="backIconColor" />
|
<uni-icons type="left" size="20" :color="backIconColor" />
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<!-- 中间标题区域 -->
|
<!-- 中间标题区域 -->
|
||||||
<view
|
<view :class="[
|
||||||
:class="[
|
|
||||||
'nav-bar-center flex flex-items-center flex-justify-center',
|
'nav-bar-center flex flex-items-center flex-justify-center',
|
||||||
`nav-bar-center--${titleAlign}`,
|
`nav-bar-center--${titleAlign}`,
|
||||||
]"
|
]">
|
||||||
>
|
|
||||||
<slot name="title">
|
<slot name="title">
|
||||||
<text
|
<text class="font-size-17 font-500 color-000" :style="{ color: titleColor }">
|
||||||
class="font-size-17 font-500 color-000"
|
|
||||||
:style="{ color: titleColor }"
|
|
||||||
>
|
|
||||||
{{ title }}
|
{{ title }}
|
||||||
</text>
|
</text>
|
||||||
</slot>
|
</slot>
|
||||||
@@ -68,7 +54,7 @@ const props = defineProps({
|
|||||||
// 背景颜色
|
// 背景颜色
|
||||||
background: {
|
background: {
|
||||||
type: String,
|
type: String,
|
||||||
default: "#d9eeff",
|
default: "$theme-color-100",
|
||||||
},
|
},
|
||||||
// 标题颜色
|
// 标题颜色
|
||||||
titleColor: {
|
titleColor: {
|
||||||
|
|||||||
@@ -2,7 +2,7 @@
|
|||||||
<z-paging ref="paging" v-model="dataList" use-virtual-list :force-close-inner-list="true" cell-height-mode="dynamic"
|
<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">
|
safe-area-inset-bottom @query="queryList">
|
||||||
<template #top>
|
<template #top>
|
||||||
<TopNavBar title="快速预定" />
|
<TopNavBar title="快速预定" :background="$theme-color-100" />
|
||||||
|
|
||||||
<Tabs @change="handleTabChange" />
|
<Tabs @change="handleTabChange" />
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user