<template>
	<view class="content" style="background: url('/static/syb_bg.png') no-repeat;background-size: 100%;">
		<button class="scan-btn fixed-box" hover-class="scan-btn-hover" :style="{'backgroundColor': vdata.primaryColor}" @click="scanQrcFunc">扫码买单</button>		
	</view>
</template>

<script setup >
import { reactive } from 'vue'
import { onLoad } from '@dcloudio/uni-app'
import theme from '@/config/theme.js'
import navigateUtil from '@/util/navigateUtil.js'
import {toErrPageFunc} from '@/util/toErrorPageUtil.js'

const vdata = reactive({
	primaryColor: ''
})

onLoad(() => {
	vdata.primaryColor = theme.changeColors()
})

function scanQrcFunc() {
	uni.scanCode({
		success({ result }) {
			if (result.includes("pages/hub/lite") || result.includes("pages/hub/default")) {
				navigateUtil.to('/pages/hub/lite', { q: result, isNeedParseQrc: true })
			}else {
				return toErrPageFunc('不支持的二维码类型！');
			}
		}
	})
}
const toPayMember =()=>	navigateUtil.to('/pages/payway/index')

</script>

<style lang="scss">
	.content {
		// background:;
		background-size: cover;
		height: 100vh;
		position: relative;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		// background: #ffffff;
		// background-size: auto;
		 
		.content-top-bg {
			position: absolute;
			top: 0;
			left: 0;
			right: 0;
			width: 100%;
			height: 212rpx;
			border-radius: 0 0 30rpx 30rpx;
			z-index: 0;
		}
	}
	
	.tips {
		position: relative;
		width: 650rpx;
		margin-top: 20rpx;
		border-radius: 30rpx;
		background: #fff;
		z-index: 1;
		display: flex;
		flex-direction: column;
		align-items: center;
		padding: 70rpx 0;
		
		.tips-title {
			font-weight: bold;
			font-size: 33rpx;
			letter-spacing: 0.04em;
		}
		.tips-image {
			height: 150rpx;
			width: 150rpx;
			padding-top: 100rpx;
		}
		image {
			height: 100%;
			width: 100%;
		}
		.tips-content {
			display: flex;
			flex-direction: column;
			align-items: center;
			padding-top: 70rpx;
			font-size: 27rpx;
			letter-spacing: 0.04em;
			line-height: 51rpx;
			text-align: center;
			color: #000;
		}
	}
	.scan-btn {
		width: 80%;
		margin-top: 100rpx;
		border-radius: 10rpx;
		color: #fff;
	}
	.scan-btn-hover {
		color: #fff;
		opacity: 0.8;
	}
	.payment-no-keyboard {
		width: 500rpx;
		height: 120rpx;
		position: fixed;
		left: 0;
		right: 0;
		bottom: 240rpx;
		margin: 0 auto;
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 36rpx;
		color: $uni-text-color-inverse;
		border-radius: 8rpx;
	}
	.fixed-box {
	      position: fixed !important;
	      bottom: 0 !important;
	      left: 0 !important;
	      width: 90% !important;
	      // background-color: #07C160 !important;
	      background-color: #1678FF !important;
		  padding: 3px !important;
		  margin-left: 5%;
		  margin-bottom: 5%;
		  border-radius: 10px;
	    }
</style>
