ChuangHengWx/components/CusHeader/index.vue

<template>
	<u-navbar :title="title" :bgColor="bgColor" :titleStyle="titleStyle">
		<view class="u-nav-slot" slot="left" style="display: flex;background-color: transparent;">
			<u-icon v-if="showback" name="arrow-left" size="44" :color="leftIconColor" @tap="toBack(backUrl)"></u-icon>
		</view>
	</u-navbar>
</template>

<script>
	export default {
		options: {
			styleIsolation: 'shared'
		},
		props: {
			title: {
				typeof: String,
				default: ''
			},
			showback: {
				typeof: Boolean,
				default: true
			},
			backUrl: {
				typeof: String,
				default: ''
			},
			bgColor: {
				typeof: String,
				default: '#ffffff'
			},
			leftIconColor: {
				typeof: String,
				default: '#111111'
			},
			titleStyle: {
				typeof: Object,
				default: {
					fontSize: '36rpx',
					fontWeight: "bold",
					color: '#111111'
				}
			},
			backAlert:{
				typeof:Boolean,
				default:false
			}
		},
		data() {
			return {
				tabUrls: [
					'/pages/home',
					'/pages/my'
				]
			}
		},
		methods: {
			toBack(url) {
				if(this.backAlert){
					uni.showModal({
						title:'温馨提示',
						content:'您正在填写问卷中，系统仅保留当前问卷的作答进度，是否确认返回？',
						success: (res) => {
							if(res.confirm){
								this.dealBack(url)
							}
						}
					})
				}else this.dealBack(url)
			},
			dealBack(url){
				if (!url) {
					if (uni.getStorageSync('options')) {
						uni.redirectTo(JSON.parse(decodeURIComponent(uni.getStorageSync('options'))));
						return uni.removeStorageSync('options');
					}
					let canNavBack = getCurrentPages();
					if (canNavBack && canNavBack.length > 1) uni.navigateBack();
					else uni.reLaunch({
						url: '/pages/home'
					})
				} else {
					if (this.tabUrls.find(u => u == url)) uni.reLaunch({
						url
					});
					else uni.redirectTo({
						url
					});
				}
			}
		}
	}
</script>

<style lang="less" scoped>
	.u-navbar--fixed {
		z-index: 99999 !important;
	}
</style>