<template>
	<view class="successful">
		<u-navbar :back-text="i18n('Back')" :back-text-style="backStyle" :title-width="400"
			back-icon-color="#fff" title-color="#fff" 
			:background="background" :title="i18n('SubmittedSuccessfully')">
		</u-navbar>
		<view class="successBox">
			<image class="img" src="../../../static/img/cooperationNetwork/submit.png" mode=""></image>
			<view class="title">{{ i18n('SubmittedSuccessfully') }}</view>
			<view class="tips" v-if="$i18n.locale=='zh'">
				您的申请已受理，请留意{{value}}通知。
			</view>
			<view class="tips" v-if="$i18n.locale=='en'">
				Your application has been submitted, please pay attention to the {{value}} notice.
			</view>
		</view>
		<view class="submitBtn">
			<u-button type="primary" @click="toDetail">
				{{ viewDetails }}
			</u-button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				background:{
					backgroundImage: 'linear-gradient(270deg, #4BC0E2 0%, #538BE7 100%)',
				},
				backStyle:{
					color:'#fff'
				},
				value: '',
				key: '',
				name: '',
				viewDetails:  this.$i18n.locale=='zh'?'查看详情':'View details'
			}
		},
		onLoad(e) {
			this.name = e.value;
			this.key = e.key;
			if(this.name === 'member') {
				this.value = this.$i18n.locale=='zh'?'入会申请':'application';
			}else if(this.name === 'league') {
				this.value = this.$i18n.locale=='zh'?'入盟申请':'application';
			}else if(this.name === 'custom') {
				this.value = this.$i18n.locale=='zh'?'定制服务申请':'Costomized application';
			}else {
				this.value = this.$i18n.locale=='zh'?'资助洽商':'Donantion';
			}
		},
		methods: {
			i18n (data) {
			    return this.$t('common.'+data);
			},
			toDetail() {  //查看详情
				let type = '';
				if(this.name === 'member') {
					type = 0;
				}else if(this.name === 'league') {
					type = 1;
				}else if(this.name === 'custom') {
					type = 2;
				}else {
					type = 3;
				}
				uni.navigateTo({
					url: '/pages/service/others/applicationDetial?id='+this.key+'&type='+type+'&title='+encodeURIComponent(this.value)
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.successful {
		padding: 50upx;
		.successBox {
			width: 100%;
			margin-top: 25%;
			margin-left: 50%;
			transform: translateX(-50%);
			background-color: #FFFFFF;
			padding: 70upx 30upx;
			text-align: center;
			border-radius: 20upx;
			box-shadow: 0 0 10upx #F1F1F1;
			.img {
				width: 100upx;
				height: 100upx;
			}
			.title {
				color: #333333;
				font-size: 34upx;
				margin: 20upx 0;
			}
			.tips {
				color: #666666;
				font-size: 30upx;
			}
		}
		.submitBtn {
			width: 100%;
			margin-top: 200upx;
		}
	}
</style>
