11

pages/login/template.vue

@@ -0,0 +1,106 @@
+<template>
+	<view class="login-body">
+		<view class="nothing" style="height: 100rpx;"></view>
+		<view class="titleText">{{title}}</view>
+		<slot></slot>
+		<view v-if="!hideBottom" class="bottomt">
+			<view class="bottomt-box">
+				<view class="check-icon" @click="checkChanged">
+					<image v-if="userChecked" src="../../static/img/checkOk.png" style="width: 30rpx;height:30rpx;"></image>
+					<view class="noneCheck" v-else></view>
+				</view>
+				已阅读并同意<text class="bottomtText" @click="goMent">《服务及隐私协议》</text>
+				
+			</view>
+			
+		</view>
+	</view>
+</template>
+
+<script>
+	import {mapGetters} from 'vuex'
+	export default {
+			
+		data(){
+			return{
+					
+			}
+		},
+		props: {
+			title: String,
+			hideBottom: Boolean
+		},
+		methods: {
+			goMent() {
+				uni.navigateTo({
+					url: '/pages/user/agreement'
+				})
+			},
+			checkChanged(){
+				let checkedValue=!this.userChecked;
+				this.$store.dispatch('UserCheckedBtn',checkedValue)
+				
+			}
+		},
+		computed:{
+			...mapGetters(['userChecked'])
+				},
+		mounted() {
+			
+		},
+	}
+</script>
+
+<style lang="scss">
+	.login-body {
+		min-height: 880rpx;
+		height: 100%;
+		position: relative;
+		width: 80%;
+		margin: 0 auto;
+	}
+
+	.titleText {
+		font-family: PingFangSC-Medium;
+		font-size: 46rpx;
+		color: #333333;
+		font-weight: bold;
+		padding: 30rpx 0;
+	}
+
+	.bottomtText {
+		color: #151515;
+	}
+
+	.bottomt {
+		font-family: PingFangSC-Regular;
+		font-size: 24rpx;
+		color: #999999;
+		position: absolute;
+		bottom: 80rpx;
+		left: 0;
+		width: 100%;
+		text-align: center;
+		.bottomt-box{
+			display: flex;
+			justify-content: center;
+			align-items: center;
+		}
+	}
+	.check-icon{
+		font-size: 28rpx;
+				font-weight: 400;
+				color: #999999;
+				align-items: center;
+				width: 30rpx;
+				height: 30rpx;
+				margin-right: 12rpx;
+				.noneCheck{
+					width: 26rpx;
+					height: 26rpx;
+					border-radius: 50%;
+					border: 2rpx solid #999999;
+					margin-right:12rpx;
+				}
+	}
+</style>