<template>
	<view>
		<navBar leftText="登录" :hideNavBg="true" :backBlack="true"></navBar>
		<image class="logo" :style="'margin-top:'+contentTop+'px;'" src="/static/image/login/logo.png" mode="widthFix"></image>
		<view class="loginTitle">欢迎登录价值前沿平台</view>
		<view class="btn oneClickLogin" @click="clickOneClickLogin()">授权手机号一键登录</view>
		<view class="btn codeLogin" @click="clickCodeLogin()">使用短信验证登录</view>
		<view class="agreeProtocolC fixed flexCenter">
			<view class="agreeC" @click="clickAgree()">
				<image class="icon" src="" mode="widthFix"></image>
			</view>
			阅读并同意我们的<text class="protocol" @click="clickProtocol()">《用户服务协议》</text>和<text class="protocol"@click="clickProtocol()">《隐私政策》</text>
		</view>
	</view>
</template>

<script>
	import { inject } from 'vue';
	import { loginByWx } from '@/request/api';

	export default {
		data() {
			return {
				contentTop:''
			}
		},
		onLoad() {
			this.contentTop = inject('navHeight')+230/750*inject('windowWidth')
		},
		methods: {
			/**
			 * 点击一键登录
			 */
			clickOneClickLogin()
			{
				uni.login({
					provider:'weixin',
					success(res) {
						let param = {code:res.code,isJson:1}
						loginByWx(param).then(res=>{
							
						}).catch(error=>{
							
						})
					},
					fail() {
						
					}
				})
				
			},
			/**
			 * 点击验证码登录
			 */
			clickCodeLogin()
			{
				uni.navigateTo({
					url:'/pages/login/codeLogin/codeLogin'
				})
			},
			/**
			 * 点击同意
			 */
			clickAgree()
			{
				
			},
			/**
			 * 点击查看协议
			 */
			clickProtocol()
			{
				
			}
		}
	}
</script>

<style lang="less">
.logo 
{
	margin-left: calc((100% - 144rpx)/2);
	width: 144rpx;
	height: auto;
}
.loginTitle 
{
	margin: 40rpx 80rpx 0;
	font-size: 40rpx;
	font-weight: bold;
	text-align: center;
}
.btn 
{
	margin: 0 75rpx;
	line-height: 80rpx;
	border-radius: 20rpx;
	font-size: 26rpx;
	font-weight: 500;
	text-align: center;
}
.btn.oneClickLogin
{
	background-color: #F97316;
	margin-top: 60rpx;
	color: white;
}
.btn.codeLogin 
{
	background-color: #FFF1E8;
	margin-top: 28rpx;
	color: #F97316;
}
.agreeProtocolC
{
	left: 0;
	right: 0;
	bottom: calc(120rpx + env(safe-area-inset-bottom));
	font-size: 26rpx;
	font-weight: 500;
	.agreeC 
	{
		padding: 14rpx;
		.icon 
		{
			width: 28rpx;
			height: auto;
		}
	}
	.protocol 
	{
		color: #F97316;
	}
}
</style>
