<template>
	<view>
		<uni-nav-bar status-bar=true fixed=true left-icon="arrowthinleft" background-color="#03b6b3" color="#ffffff"
			@clickRight="goHome" @clickLeft="navigateBack">
			<text slot="default" style="text-align: center; flex: 1; font-size: 18px; font-weight: bold;">报名成功</text>
			<button slot="right" size="mini" hover-class="button-hover" type="home" class="back-to-home">
				<uni-icons type="home-filled" size="22" color="#ffffff"></uni-icons>
			</button>
		</uni-nav-bar>
		<view class="msg-container">
			<uni-icons type="checkbox-filled" size="60" color="#03b6b3"></uni-icons>
			<text class="msg-success">报名成功</text>
			<text class="msg-other">报名成功,审核结果会尽快通知您.</text>
		</view>
		<view class="btn-container">
			<button class="btn-back" type="back" plain="true" hover-class="button-hover" @click="toIndex">返回首页</button>
		</view>
	</view>
</template>

<script>
	import uniNavBar from "@/components/uni-nav-bar/uni-nav-bar.vue";

	export default {
		components: {
			uniNavBar,

		},
		data() {
			return {

			}
		},
		methods: {
			goHome() {
				this.$mRouter.reLaunch({
					route: '/pages/index/index'
				});
			},
			navigateBack() {
				uni.navigateBack()
			},
			toIndex() {
				uni.navigateTo({
					url: '/pages/conference/meetingIndexCh/meetingIndex'
				})
			}
		}
	}
</script>

<style scoped>
	uni-button:after {
		border: none;
	}

	.uni-icons {
		line-height: 30px;
	}

	.msg-container {
		background-color: #FFFFFF;
		text-align: center;
		padding: 200rpx 40rpx 100rpx 40rpx;
	}

	.msg-container text {
		display: block;
	}

	.msg-container .msg-success {
		font-size: 20px;
		padding: 20px 0 10px 0;
	}

	.msg-container .msg-other {
		color: #999;
	}

	.btn-container {
		padding: 20px;
	}

	.btn-container .btn-back {
		border-color: #03b6b3;
		color: #03b6b3;
		font-weight: bold;
	}

	.button-hover[type=back] {
		opacity: .75;
		transform: scale(0.95, 0.95);
	}

	.back-to-home {
		height: 30px;
		border-radius: 15px;
		background-color: #1e9694;
	}

	.button-hover[type=home] {
		opacity: .75;
		transform: scale(0.95, 0.95);
	}
</style>
