<template>
	<view class="content">
		<view class="contentbox" :style="'background:url('+(shopExtend?shopExtend.value:'https://czg-qr-order.oss-cn-beijing.aliyuncs.com/indexs/shuangbackground.png')+') no-repeat center center / cover' ">
			<view class="contentboxitem flex-between">
				<view class="contentboxitemleft flex-colum" @click="scanCodehandle(0)">
					<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/indexs/Xdiancan.png" mode="aspectFill">
					</image>
					<text class="contentboxitemlefttextone">点餐</text>
					<text class="contentboxitemlefttexttow">在线点不排队</text>
				</view>
				<view class="contentboxitemright">
					<view class="contentboxitemright_item flex-between" @click="scanCodehandle(1)">
						<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/indexs/Xvip.png" mode="aspectFill">
						</image>
						<view class="contentboxitemright_itembox flex-colum">
							<text>会员</text>
							<text>入会享权益</text>
						</view>
					</view>
					<view class="contentboxitemright_item flex-between" @click="memberindex(0)">
						<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/indexs/Xchong.png"
							mode="aspectFill"></image>
						<view class="contentboxitemright_itembox flex-colum">
							<text>充值</text>
							<text>充值享更多优惠</text>
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {};
		},
		props: {
			usershopUserinfo: {
				type: Object,
				default () {
					return {
						amount: '',
						shopName: ""
					}
				}
			},
			userInfo: {
				type: Object,
				default () {
					return {}
				}
			},
			shopExtend: {
				type: Object,
				default () {
					return {}
				}
			},
		},
		methods: {
			scanCodehandle(i) {
				console.log(1)
				if (i == 0) {
					uni.scanCode({
						success: (res) => {
							let tableCode = this.getQueryString(decodeURIComponent(res.result), 'code')
							uni.cache.set('tableCode', tableCode)
							if (tableCode) {
								uni.cache.set('forceUpdate',true)
								uni.pro.navigateTo('order_food/order_food', {
									// shopId_id: uni.cache.get('shopUser'),
								})
							}

						}
					})
				} else {
					uni.pro.navigateTo('member/memberdetails', {
						shopId_id: uni.cache.get('shopUser'),
					})
				}
			},
			memberindex(i) {
				console.log(2)
				if (i == 0) {
					uni.pro.navigateTo('member/index', {
						shopId: uni.cache.get('shopUser'),
						type: 'index',
					})
				} else {
					let data = {
						shopName: this.usershopUserinfo.shopName,
						amount: this.usershopUserinfo.amount,
						shopId: uni.cache.get('shopUser')
					}
					uni.navigateTo({
						url: '/pages/pay_code/pay_code?shopInfo=' + JSON.stringify(data)
					})
				}


			},
			getQueryString(url, name) { //解码
				var reg = new RegExp('(^|&|/?)' + name + '=([^&|/?]*)(&|/?|$)', 'i')
				var r = url.substr(1).match(reg)
				if (r != null) {
					return r[2]
				}
				return null;
			},

			// / 更换头像
			onChooseAvatar(e) {
				uni.showLoading({
					title: '上传中',
					mask: true
				})
				console.log(e.detail.avatarUrl)
				let file = e.detail.avatarUrl;
				uploadImage(file, 'avatar',
					result => {
						//将上传后的图片以对象（官方要求的格式）的形式存入uni-file-picker的value值imageValue（imageValue值的结构为数组包对象）用于图片回显
						// let objAge = {
						// 	'url': result,
						// 	'extname': 'png',
						// 	'name': 'imgss.png'
						// };
						// this.userlist.avatar.push(objAge)
						this.userInfo.avatar = result
						console.log(this.userInfo.avatar)
						uni.hideLoading()
					}, result => {
						uni.hideLoading()
					})
			},
		}

	};
</script>

<style scoped lang="scss">
	page {
		background: #F6F8FA;
	}

	.content {
		.contentbox {
			position: relative;
			width: 100%;
			height: 1046rpx;
			padding: 0 24rpx;

			.contentboxitem {
				position: absolute;
				bottom: 0;
				width: 90%;
				left: 50%;
				transform: translate(-50%, 50%);
				padding: 38rpx 0 26rpx 0;
				background: rgba(255, 255, 255, 0.98);
				box-shadow: 0rpx 6rpx 12rpx 2rpx rgba(0, 0, 0, 0.16);
				border-radius: 20rpx 20rpx 20rpx 20rpx;

				.contentboxitemleft {
					width: 50%;
					border-right: 2rpx solid #623618;

					image {
						width: 134rpx;
						height: 134rpx;
					}

					.contentboxitemlefttextone {
						margin-top: 10rpx;
						font-family: Source Han Sans CN, Source Han Sans CN;
						font-weight: 400;
						font-size: 32rpx;
						color: #333333;
					}

					.contentboxitemlefttexttow {
						margin-top: 2rpx;
						font-family: Source Han Sans CN, Source Han Sans CN;
						font-weight: 400;
						font-size: 24rpx;
						color: #999999;
					}
				}

				.contentboxitemright {
					width: 50%;
					padding: 0 34rpx;

					.contentboxitemright_item:nth-child(2) {
						margin-top: 30rpx;
					}

					.contentboxitemright_item {
						image {
							width: 96rpx;
							height: 96rpx;
						}

						.contentboxitemright_itembox {
							width: 170rpx;

							text:nth-child(1) {
								font-family: Source Han Sans CN, Source Han Sans CN;
								font-weight: 400;
								font-size: 32rpx;
								color: #333333;
							}

							text:nth-child(2) {
								margin-top: 2rpx;
								font-family: Source Han Sans CN, Source Han Sans CN;
								font-weight: 400;
								font-size: 24rpx;
								color: #999999;
							}
						}

					}
				}
			}
		}
	}
</style>