lvdao-miniapp/pages/login/login.vue

<template>
	<view class="page" :style="{backgroundImage:`url(${$imgUrl('/homePhoto.png')})`}">
		<view style="height: 100vh;width: 100%;position: fixed;bottom: 0;left: 0;">
			<view style="width: 45%;margin: 0 auto;margin-top: 15vh;">
				<image src="../../static/login/logo1.png" style="width: 100%;" mode="widthFix"></image>
			</view>
			<view style="width:60%;margin: 0 auto;">
				<image src="../../static/login/logo2.png" style="width: 100%;" mode="widthFix"></image>
			</view>
			<!-- 填写区 -->
			<view class="input-info" style="margin-top: 5vh;">
				<view class="info">
					<view class="info-icon">
						<image src="../../static/login/icon1.png" mode="heightFix"></image>
					</view>
					<input type="tel" maxlength="11" v-model="phone" placeholder="请输入您的手机号">
					<view class="more"></view>
				</view>
				<view class="info">
					<view class="info-icon">
						<image src="../../static/login/icon2.png" mode="heightFix"></image>
					</view>
					<input type="tel" v-model="code" maxlength="6" placeholder="请输入验证码">
					<view class="more">
						<text class="mo" v-if="!isTrue" @click="sendCode">获取验证码</text>
						<text class="mo" v-else>{{num}}秒后重试</text>
					</view>
				</view>
			</view>
			<!-- 按钮 -->
			<view class="btn-info">
				<view class="btn" @click="register">
					<text>登录</text>
				</view>
			</view>
		</view>
		<view
			style="position: fixed;left: 0;bottom: 49rpx;display: flex;flex-direction: row;justify-content: center;width: 100%;">
			<u-checkbox-group @change="checkboxGroupChange" shape="circle" :label-disabled="true">
				<u-checkbox active-color="#3f9b6a" v-model="checked" name="tongyi">我已阅读并同意<span style="color:#3f9b6a;"
						@click="goyinsi">《隐私政策》</span></u-checkbox>
			</u-checkbox-group>
		</view>
	</view>
</template>
<script>
	export default {
		data() {
			return {
				checked: null,
				phone: '',
				code: '',
				isTrue: false,
				num: 60,
				time: null,
			};
		},
		watch: {
			num() {
				if (this.num == 0) {
					clearInterval(this.time)
					this.time = null
					this.isTrue = false
					this.num = 60
				}
			}
		},
		onShow() {
		},
		methods: {
			goyinsi() {
				uni.navigateTo({
					url: '/pages/privacy/privacy'
				});
			},
			checkboxGroupChange(val) {
				this.showTong = val[0]
				console.log(this.showTong)
			},
			register() {
				if(this.showTong == 'tongyi'){
							
				}else{
					uni.showToast({
						icon: 'none',
						title: '请阅读并同意隐私政策'
					})
					return
				}
				if (this.phone == '') {
					uni.showToast({
						icon: 'none',
						title: '请输入手机号'
					})
					return
				}
				if (this.code == '') {
					uni.showToast({
						icon: 'none',
						title: '请输入验证码'
					})
					return
				}
				const data = {
					username:this.phone,
					 code:this.code
				}
				this.$http.sendRequest('/business/login', 'POST', data, 2).then(res => {
					if (res.data.code == '') {
						uni.setStorageSync('token', res.data.data.token);
						uni.setStorageSync('user', res.data.data);
						// uni.setStorageSync('shopId', res.data.data.shopId);
						uni.switchTab({
							url: '/pages/home/home'
						})
					} else {
						uni.showToast({
							icon: 'none',
							title: res.data.message
						})
					}
				})
			},
			sendCode() {
				if (!this.phone) {
					uni.showToast({
						title: '请填写手机号',
						icon: 'none'
					})
					return
				}
				this.$http.sendRequest('/business/verification', 'POST', {
					phone: this.phone
				}).then(res => {
					console.log('获取验证码', res)
					if (res.data.code == 200) {
						uni.showToast({
							icon: 'none',
							title: '发送成功'
						})
						if (this.num > 0) {
							this.isTrue = true
							this.time = setInterval(() => {
								this.num--
							}, 1000)
						} else {
							this.isTrue = false
							clearInterval(this.time)
						}
					} else {
						uni.showToast({
							icon: 'none',
							title: '请稍等再试'
						})
					}
				})
			},
		}
	}
</script>
<style scoped lang="scss">
	@import 'login.scss';
</style>