<template>
	<view class="header">
		<text>{{title}}</text>
		<status-tag class="status" v-if="status != ''" :text="status"></status-tag>
	</view>
</template>

<script>
	import statusTag from "@/components/tag/tag"
	export default {
		props: {
			title: {
				type: String,
				default: ''
			},
			status: {
				type: String,
				default: ''
			}
		},
		components: {
			statusTag
		}
	}
</script>

<style scoped>
	.header {
		width: 100%;
		height: 200rpx;
		background-image: url("~@/static/images/app_header_bg.jpg");
		background-repeat: no-repeat;
		background-position: cover;
		text-align: center;
		position: relative;
	}

	.header text {
		color: #FFFFFF;
		font-size: 36rpx;
		letter-spacing: 0.2em;
	}
	.status {
		position: absolute;
		right: 0;
		bottom: 20rpx;
	}
</style>
