medical/pages/signIn/signIn.vue

<template>
	<view>
		<view class="title">
			<image src="../../static/title.png"></image>
		</view>
		
		<view class="an" @click="to(1)">
			账号密码登录
		</view>
		
		<!-- <view class="anTwo" @click="to(2)">
			验证码登录
		</view> -->
		
		<view class="w">
			<u-checkbox-group v-model="checkboxValue1" @change="checkboxChange" style="display: flex; justify-content: center;">
				<u-checkbox shape="circle" ></u-checkbox>我已阅读并同意《用户协议》和 《隐私政策》
			</u-checkbox-group>
		</view>
	</view>
</template>

<script>
	export default {

		data() {
			return {
				checkboxValue1: [],
				checkbox: '',
				
			}
		},
		onLoad() {

		},
		methods: {
			 checkboxChange(n) {
			    console.log('change', n, n.length);
				this.checkbox = n.length
			},
			
			to(type){
				if(this.checkbox != 1){
					this.$u.toast('请勾选下方同意')
					return
				}
				
				if(type == 1){
					// 跳转账号密码登录
					uni.navigateTo({
						url: `/pages/signIn/logOn?type=${type}`
					})
				}else{
					// 跳转验证码登录
					uni.navigateTo({
						url: `/pages/signIn/logOn?type=${type}`
					})
				}
				
			}
			
		}
	}
</script>

<style lang="scss" scoped>
	page{
		padding: 0 32rpx;
		/* background-color: #D9D9D9; */
		background-color: #fff !important;
	}

	.title{
		width: 372rpx;
		height: 208rpx;
		margin: 0 auto;
		margin-top: 118rpx;
		
		image{
			width: 100%;
			height: 100%;
		} 
	}
	
	.inp{
		height: 100rpx;
		background: #ededed;
		border-radius: 64rpx;
		display: flex;
		align-items: center;
		padding-left: 95rpx;
		margin-bottom: 52rpx;
		position: relative;
		
		.i{
			position: absolute;
			right: 52rpx;
		}
		
		text{
			position: absolute;
			left: 96rpx;
			font-size: 32rpx;
			color: rgba(0,0,0,0.38);
		}
	}
		
	.an{
		width: 564rpx;
		height: 112rpx;
		color: #fff;
		background-color: #846FFE;
		text-align: center;
		line-height: 112rpx;
		margin: 0 auto;
		border-radius: 64rpx;
		font-size: 32rpx;
		margin-top: 236rpx;
	}
	
	.anTwo{
		width: 564rpx;
		height: 112rpx;
		color: #846FFE;
		// background-color: #846FFE;
		border: 2rpx solid #846FFE;
		text-align: center;
		line-height: 112rpx;
		margin: 0 auto;
		border-radius: 64rpx;
		font-size: 32rpx;
		margin-top: 50rpx;
	}
	
	.w{
		font-size: 25rpx;
		color: rgba(0,0,0,0.60);
		margin-top: 476rpx;
	}
</style>