<template>
	<view class="codes">
		<view class="canvasbox">
			<canvas style="width: 200px;height: 200px;" canvas-id="myQrcode"></canvas>
		</view>
		<view class="text">
			请将二维码对准设备摄像头
		</view>
	</view>
</template>

<script>
	import drawQrcode from 'weapp-qrcode'
	export default {
		data() {
			return {
				qrcode: null
			}
		},
		onLoad() {
			this.creatQrCode()
		},
		methods: {
			creatQrCode() {
			  let userData = this.$store.state.vuex_userData
			  console.log(userData)
			  drawQrcode({
			    width: 200,
			    height: 200,
			    canvasId: 'myQrcode',
			    text: `userId=${userData.customNo}&type=user`
			  })
			}
		}
	}
</script>

<style>
.codes{
	width: 100%;
	padding: 50rpx;
}
.canvasbox{
	box-shadow: 3upx 3upx 6upx #eee;
	background: #FFFFFF;
	height: 230px;
	width: 230px;
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 50rpx auto;
}
.text{
	text-align: center;
	padding: 20rpx;
	color: #999999;
}
</style>
