Files
hht-ximenzi-uni/components/NavBar.vue
2024-08-19 15:45:30 +08:00

65 lines
1.3 KiB
Vue

<template>
<view class="zd-row jcflexstart header">
<view class="zd-col-4">
<uni-icons @tap="goBack" type="back" size="26" color="#fff"></uni-icons>
</view>
<view class="zd-col-16 page_name">{{title}}</view>
<view v-if="searchActive" class="zd-col-4" style="text-align: right">
<uni-icons @tap="toSearch" type="search" size="26" color="#fff"></uni-icons>
</view>
</view>
</template>
<script>
export default {
data() {
return {
};
},
props: {
title: String,
inner: {
type: Boolean,
default: false
},
inner2: {
type: Boolean,
default: false
},
searchActive: {
type: Boolean,
default: false
}
},
methods: {
goBack () {
if (this.inner) {
uni.navigateBack()
} else if (this.inner2) {
this.$emit('goIn')
} else {
uni.redirectTo({
url: '/pages/home/home'
})
}
},
toSearch () {
this.$emit('toSearch')
}
}
}
</script>
<style lang="stylus">
@import '@/common/style/mixin.styl';
.header
position fixed
_wh(100%, calc(var(--status-bar-height) + 72rpx))
// background: linear-gradient(to bottom, #ff6800 0%, #ff6400 100%)
background-color $red
z-index 200
padding var(--status-bar-height) 20rpx 0
.page_name
_font(32rpx, 32rpx, #fff,700,center)
</style>