<template>
	<view class="page">
		<view class="wrap">
			<image class="logo" src="https://eduvessel.com/images/occupationlab/hjyz-logo.png" mode="widthFix"></image>
			<uni-forms>
				<input type="text" v-model.trim="form.account" placeholder="请输入账号" />
				<input type="password" v-model.trim="form.password" placeholder="请输入密码" />
				<view class="phone">绑定的手机号：{{ phone }}</view>
			</uni-forms>
			<button class="btn" type="primary" @click="submit">登录</button>
		</view>
	</view>
</template>

<script>
	import { captcha, weChatToken } from '@/apis/modules/user.js'
	import WXBizDataCrypt from '@/libs/WXBizDataCrypt'
	export default {
		data() {
			return {
				openid: uni.getStorageSync('openid'),
				unionid: uni.getStorageSync('unionid'),
				phone: uni.getStorageSync('phone'),
				form: {
					account: '',
					password: '',
					random: '',
				},
				verImg: '',
			}
		},
		onShow() {
			
		},
		methods: {
			// 提交
			async submit() {
				const { form } = this
				if (!form.account) return this.$util.errMsg('请输入账号！')
				if (!form.password) return this.$util.errMsg('请输入密码！')
				const { data } = await weChatToken({
					...form,
					openid: this.openid,
					unionid: this.unionid,
					phone: this.phone,
					platformId: 1,
				})
				uni.setStorageSync('token', data.token)
				uni.switchTab({
					url: '/pages/index/index'
				})
			},
		}
	}
</script>

<style scoped lang="scss">
.page {
	padding-top: 170rpx;
	min-height: 100%;
	text-align: center;
	background: url(https://eduvessel.com/images/occupationlab/login1.png) 0 0/175rpx auto no-repeat,
		url(https://eduvessel.com/images/occupationlab/login2.png) bottom right/123rpx auto no-repeat;
	box-sizing: border-box;
	.logo {
		width: 500rpx;
		margin-bottom: 80rpx;
	}
}
.wrap {
	position: relative;
	height: 60vh;
	padding: 214rpx 74rpx 28rpx;
	margin: 0 61rpx;
	text-align: center;
	border-radius: 20rpx;
	background-color: #fff;
	input {
		padding: 10rpx 16rpx;
		margin-bottom: 40rpx;
		font-size: 28rpx;
		text-align: left;
		color: #333;
		border-bottom: 1px solid #f3f3f3;
	}
	.btn {
		width: 100%;
		height: 88rpx;
		margin-top: 80rpx;
		font-size: 32rpx;
		color: #fff;
		background-color: #007EFF;
		border-radius: 10rpx;
	}
	.phone {
		padding-left: 16rpx;
		font-size: 24rpx;
		text-align: left;
		color: #8e8e8e;
	}
}
</style>
