<template>
	<view class="container">
		<view class="fit-content"></view>
		<view class="operation" v-if="isCustom">
			<slot></slot>
		</view>
		<view class="" v-else>
			<view class="operation" v-if="isTab">
				<text class="title">{{ title }}</text>
			</view>
			<view class="operation wd-flex wd-flex-row wd-items-center" style="gap: 10px" v-else @tap="goback()">
				<view class="icon-box">
					<u-icon name="arrow-left" size="12"></u-icon>
				</view>
				<text class="title wd-text-16">{{ title }}</text>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	name: 's-header',
	data() {
		return {}
	},
	props: {
		title: String,
		isTab: {
			type: Boolean,
			default: false
		},
		isCustom: {
			type: Boolean,
			default: false
		}
	},
	methods: {
		goback() {
			uni.switchTab({
				url: '/pages/owner'
			})
		}
	}
}
</script>

<style lang="scss" scoped>
.container {
	background-color: #fff;
	box-shadow: 0 1px 2px 1px $cs-shadow-color;
	.fit-content {
		height: 8vh;
	}
	.operation {
		padding: 5px 10px;
		.title {
			color: #000;
		}
		.icon-box {
			padding: 5px;
			border-radius: 50%;
			box-shadow: 0 0 4px 2px $cs-shadow-color;
		}
	}
}
</style>
