weapp-online/pages/written_off/written_off.vue

<template>
	<!-- <view class="voucher" style="background: url(/static/sign_in_off.jpg) no-repeat;background-size: cover;"> -->
	<view class="voucher">
		<image src="../../static/imgs/sign_in_off.jpg" class="bgImg"></image>
		<view class="voucher_con">
			<view class="line"></view>
			<view class="title">第{{ signInfo.season ? signInfo.season : '' }}届大卫博士创业{{ Number(signInfo.type) == 0 ? '实战营' : '密训营' }}</view>
			<view class="voucher_icon">
				<image src="../../static/imgs/written_off.png"></image>
				<view>签到成功</view>
			</view>
			<view class="info">
				<view class="flexS">
					<text>报名人：</text>
					<view>{{ signInfo.nickname ? signInfo.nickname : '' }}</view>
				</view>
				<view class="flexS">
					<text>手机号：</text>
					<view>{{ signInfo.phone ? signInfo.phone : '' }}</view>
				</view>
				<view class="flexS">
					<text>报名时间：</text>
					<view>{{ signInfo.created_at ? signInfo.created_at : '' }}</view>
				</view>
			</view>
			<view class="btn" v-if="signInfo.path == 1">
				<view class="flexC" @click="scanCode">继续扫码</view>
				<view class="flexC" @click="skipSignIn">手动签到</view>
			</view>
			<view class="btn" v-else><view class="flexC" @click="goBack">返回首页</view></view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			signInfo: '', //已报名的信息
			userInfo: '', //用户信息
			seasonInfo: '', //历史赛季信息
			id: ''
		};
	},
	onLoad(options) {
		if (uni.getStorageSync('userInfo')) {
			this.userInfo = uni.getStorageSync('userInfo');
		}
		this.signInfo = options;
	},
	methods: {
		//返回首页
		goBack() {
			uni.switchTab({
				url: '../index/index'
			});
		},
		//继续扫码
		scanCode() {
			uni.scanCode({
				success: function(res) {
					let str = res.path;
					let id = str.replace(/[^0-9]/gi, '');
					if (id) {
						uni.navigateTo({
							url: '../sign_in_voucher/sign_in_voucher?id=' + id
						});
					}
				}
			});
		},
		// 手动签到
		skipSignIn() {
			uni.navigateTo({
				url: '../sign_in/sign_in'
			});
		}
	}
};
</script>

<style lang="scss" scoped>
.voucher {
	hieght: 100vh;
	min-height: 100vh;
	width: 100vw;
	position: relative;
	.bgImg {
		height: 100vh;
		width: 100vw;
		position: fixed;
		top: 0;
		left: 0;
	}
	.voucher_con {
		position: fixed;
		height: 85%;
		width: 100%;
		bottom: 0;
		left: 0;
		background: #fff;
		border-top-left-radius: 60rpx;
		border-top-right-radius: 60rpx;
		.line {
			width: 128rpx;
			height: 8rpx;
			background: #f1f3f5;
			margin: 36rpx auto 0;
		}
		.title {
			color: #333;
			font-size: 42rpx;
			margin: 48rpx auto 48rpx;
			text-align: center;
			font-weight: bold;
		}
		.voucher_icon {
			text-align: center;
			image {
				height: 192rpx;
				width: 192rpx;
				margin-bottom: 30rpx;
			}
			view {
				font-size: 48rpx;
				color: #333;
			}
		}
		.info {
			margin: 30rpx 0 40rpx 100rpx;
			> view {
				margin-top: 34rpx;
				font-size: 28rpx;
				text {
					color: #656565;
				}
				view {
					color: #333333;
				}
			}
		}
		.btn {
			view {
				width: 640rpx;
				margin: 0 auto;
				height: 88rpx;
				color: #fff;
				background: rgba(233, 73, 65, 0.6);
				border-radius: 44rpx;
				letter-spacing: 2rpx;
			}
			view:last-child {
				margin-top: 30rpx;
				border: 2rpx solid #e94941;
				background: #fff;
				color: #e94941;
			}
		}
	}
}
</style>