kano1.1/pages/index/successPage/index.vue

<template>
	
	<view class="content">
		 <view class="success-bg-box">
			 <image src="/static/success-new.png" mode="aspectFit"></image>
			 <!-- <view class="number-box">编号：{{userCodeNumber}}</view> -->
			 <view >
				 <view class="number-box" >提交成功</view>
				<!-- <view class="show-tips-box">方可入内，截图无效。</view> -->
			 </view>
			 
			 <view class="title-font">科尔卡诺展馆入场登记</view>
		 <!--    <view v-show="pageTypes==='dealer'">
				 <view class="show-tips-box">尊敬的超级VIP客户，请将此编码，</view>
				 <view class="show-tips-box">展示给工作人员，方可入内，截图无效。</view>
		     </view> -->
		 </view>
		<!-- <view class="phone-box">
			 <view class="phone-value-box">您的专属顾问：{{salePhone}} （{{saleName}}）</view>
			 <view class="phone-tips">请保存此电话，展馆内有问题均可咨询！</view>
			 <button type="primary" @tap="callPhone">拨打</button>
		 </view> -->
		 <view class="footer-box">
			 <view>登记时间：{{registerDate || '2021-3-3 11:05'}}</view>
		 </view>
	</view>
	
</template>

<script>
	export default {
		components: {
		},
		data() {
			return {
				pageTypes:'custom',
				registerDate:getApp().globalData.addTime,
				userCodeNumber:getApp().globalData.userCodeNumber
			}
		},
		onLoad(option) {
			this.pageTypes = option.types;
			wx.hideHomeButton();
		},
		onShow() {
		},
		methods: {
			callPhone(){
				let that = this;
				uni.makePhoneCall({
					phoneNumber: that.salePhone
				})
			}
		}
	}
</script>

<style>
	 page{
		background: #f7f7f7!important;
	 }
	.content {
		width: 100%;
		/* height: 100%; */
		display: flex;
		flex-direction: column;
		align-items: center;
		/* justify-content: center; */
	}
	.success-bg-box {
		width: 100%;
	/* 	height: 500rpx; */
		margin-top: 10%;
		display: flex;
		flex-direction: column;
		align-items: center;
		font-size: 28rpx;
	} 
	.success-bg-box image {
		width: 200rpx;
		height: 200rpx;
	}
	
	
	.title-font {
		font-size: 24rpx;
	    margin-top: 5%;
	    margin-bottom: 8%;
	    opacity: .9;
	    letter-spacing: 8rpx;
	}
	.number-box {
		font-size: 48rpx;
		margin-top: 1.5em;
		margin-bottom: 10%;
	}
	.show-tips-box {
		opacity: 0.8;
	    font-size: 28rpx;
		color: #FFFFFF;
		letter-spacing: 0.3rpx;
		text-align: center;
	}
	.phone-box {
		width: 89%;
		height: 360rpx;
		background: #fff;
		display: flex;
		flex-direction: column;
		align-items: center;
		z-index: 99;
		margin-top: -10px;
	}
	.phone-value-box {
		font-size: 28rpx;
		color: #4E4E4E;
		margin-top: 10%;
		margin-bottom: 3%;
	}
	.phone-tips {
		font-size: 24rpx;
		color: #4E4E4E;
	}
	.phone-box button {
		width: 25%;
		height: 60rpx;
		line-height: 60rpx;
		font-size: 24rpx;
		border-radius: 50rpx;
		background-image: linear-gradient(-135deg, #43DC7A 0%, #0EBD66 100%)!important;
		margin-top: 10%;
	}
	.footer-box {
		width: 100%;
		position: fixed;
		bottom: 3%;
		height: 50rpx;
		line-height: 50rpx;
		font-size: 24rpx;
		color: #B7B7B7;
		letter-spacing: 0.26rpx;
		text-align: center;
	}
</style>