<template>
	<view class="top">
		<view v-show="showBack" class="back" @click="toBack()">
			<text class="arrow"></text>
		</view>
		<view class="title"><slot></slot> </view>
	</view>
</template>

<script>
	export default {
		props:{
			backUrl:{
				type:String,
				default:''
			},
			showBack:{
				type:Boolean,
				default:false
			}
		},
		data() {
			return {
				
			}
		},
		methods: {
			toBack(){
				if(this.backUrl!=''){
					if(this.backUrl == '/pages/my/index'){
						uni.switchTab({
							url:this.backUrl
						})
					}else{						
						uni.navigateTo({
							url:this.backUrl
						});
					}
				}else{
					let pages =getCurrentPages();
					//console.log(pages);
					const prevPage=pages[pages.length-2];
					if(!prevPage){
						uni.switchTab({
							url:'/pages/index/index'
						})
					}else{
						uni.navigateBack();
					}
					
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.top{
		height: 40px;
		// display: none;
		// background:linear-gradient(to bottom,#6BA0FC, #6297FD);
		background-color: #fff;
		.back{
			float: left;
			color: #000;
			padding-top:8px;
			padding-left: 15px;
		}
		.title{
			text-align: center;
			font-size: 16px;
			color: #000;
			height: 40px;
			text-align: center;
			width: 80%;
			white-space: nowrap;
			overflow: hidden;
			text-overflow: ellipsis;
			line-height: 40px;
		}
	}
	 .arrow:before {
	    content: " ";
	    display: inline-block;
	    -webkit-transform: rotate(45deg);
	    -ms-transform: rotate(45deg);
	    transform: rotate(45deg);
	    height: .5rem;
	    width: .5rem;
	    border-width: 0 0 2px 2px;
	    border-color: #FFFFFF;
	    border-style: solid;
	    position: relative;
	    top: 0
	    }
</style>
