wxThird/pages/partner/myQr.vue

<template>
<view class="box">
	<view style="height: 20vh;"></view>
	<view class="cont">
		<view class="contTop">
			<image src="../../static/timg/hl1.png" mode="" class="contTopImg"></image>
			<view class="contTopTitle">专属二维码</view>
			<image src="../../static/timg/hl2.png" mode="" class="contTopImg"></image>
		</view>
		<view class="headImgBox">
			<image :src="userInfo.headImg" mode="" class="headImg"></image>
		</view>
		<view class="nickName">{{userInfo.nickName}}</view>
		<view class="ms">很不错的店铺 值得推荐！</view>
		<view class="wqmBox">
			<view class="ewmLeft">
				<image :src="userInfo.headImg" mode="" class="ewmImg"></image>
			</view>
			<view class="ewmRight">
				<view class="ewmRight1">长按二维码立即关注</view>
				<view class="ewmRight2">登记个人信息即可享受新人优惠</view>
			</view>
		</view>
	</view>
</view>
</template>

<script>
	export default {
		components: {
			
		},
		
		data() {
			return {
				headImg: '',
				themeColor:'',
				userInfo:'',
			}
		},
		onLoad(opt) {
			this.themeColor = uni.getStorageSync("themeColor");
			this.userInfo = uni.getStorageSync("userInfo");
			
		},
		onShow() {
			
		},
		methods: {
			
			
		}
	}
</script>

<style scoped lang="less">
.box {
	width: 100vw;
	min-height: 100vh;
	background: url('http://dmsphoto.66km.com.cn/thFiles/D3702233-AB0E-415A-95C6-C7835283E8BC.png') no-repeat;
	background-size:100% 100% ;
}
.cont{
	width: 650rpx;
	height: 651rpx;
	background: #FFFFFF;
	border-radius: 20rpx;
	border: 10rpx solid #FFCE11;
	margin-left: 50rpx;
	
}
.contTopImg{
	height: 28rpx;width: 155rpx;margin-top: 11rpx;
}
.contTopTitle{
	font-size: 36rpx;
	font-family: PingFangSC-Medium, PingFang SC;
	font-weight: 500;
	color: #FFAF18;
	line-height: 50rpx;
}
.contTop{
	display: flex;
	justify-content: space-around;
	padding-top: 60rpx;
}
.headImg{
	width: 103rpx;height: 103rpx;border-radius: 50%;
}
.headImgBox{
	text-align: center;padding-top: 50rpx;
}
.nickName{
	color: #999999;font-size: 26rpx;text-align: center;padding-top: 16rpx;
}
.ms{
	color: #FFAF18;font-size: 30rpx;padding-top: 16rpx;text-align: center;
}
.wqmBox{
	border-top:1px solid #EEEEEE;margin-top: 40rpx;
	display: flex;
	padding: 30rpx 0 0 70rpx;
}
.ewmImg{
	width: 148rpx;
	height: 148rpx;
}
.ewmRight1{
	color: #999999;font-size: 24rpx;padding-top: 30rpx;padding-left: 24rpx;
}
.ewmRight2{
	color: #999999;font-size: 24rpx;padding-top: 16rpx;padding-left: 24rpx;
}
</style>