antissoft / antis-greenway

<template>
	<view class="page">
		<view style="display: flex;justify-content: space-between;padding: 20px;height: 64px;">
			<view @click="goHome"><image :src="$imgUrl('/right2.png')"  style="width: 20px;height: 20px; transform: rotate(180deg);"></image></view>
			<view>登录</view>
			<view class="">
			</view>
		</view>
		<view class="container flex-items-plus flex-column" v-if="denglu==false">
		
			<view class="login-logoBox">
				<text style="color:#3f9b6a;font-weight:bold;font-size:30px;">锦江绿道</text>
			</view>
			<view class="loginTitle-text flex-column-plus flex-items font-color-666 fs26">
				<text style="display: block;">为了给您提供更好的服务</text>
				<text style="display:block;	">我们需要您的授权哦~</text>
			</view>
			<view>
				<view class="loginBut" @click="goLogin">手机号登录</view>
			</view>
			<view class="flex-row-plus mar-top-30" style="margin-top: 30rpx;">
				<text class="font-color-C5AA7B">还没有账号，</text>
				<text class="register-text" @click="goRegister">去注册</text>
			</view>
		</view>
		
	<view class="" v-if="denglu">
		<!-- 填写区 -->
		<view class="input-info">
			<view class="login-logoBox" style="margin-bottom: 20px;text-align: center;">
				<text style="color:#3f9b6a;font-weight:bold;font-size:30px;">锦江绿道</text>
			</view>
			<view class="info">
				
				<input type="tel" maxlength="11" v-model="form.username" placeholder="请输入账号">
				<view class="more"></view>
			</view>
			
			<view class="info" >
				<input :password='!isPassword' v-model="form.password" maxlength="26" placeholder="请输入您的密码">
			<!-- 	<view class="more" @click="isPassword = !isPassword">
					<image src="../../static/login4.png"></image>
				</view> -->
			</view>
		</view>
		<!-- 按钮 -->
		<view class="btn-info">
			<view class="btn" @click="register">
				<text>登录</text>
			</view>
		</view>
	</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				isLogin: false,
				isLoginWay: false,
				isPassword: false,
				denglu:false,
				// 表单
				
				form: {
				username: '',
				password: '',
				rememberMe: false
				},
				ischange: false,
				isTrue: false,
				num: 60,
				time: null,
				// cid
				push_clientid:''
			};
		},
		onShow(option) {
		console.log(option)
		
		},
		methods: {
			goLogin(){
				this.denglu = true
			},
			register() {
					if (this.form.phone == '') {
						uni.showToast({
							icon: 'none',
							title: '请输入账号'
						})
						return
					}
					if (this.form.password == '') {
						uni.showToast({
							icon: 'none',
							title: '请输入密码'
						})
						return
					}
				const data = {
				  // username: JM.encrypt(this.form.username),
				  // password: JM.encrypt(this.form.password),
				  // rememberMe: this.form.rememberMe
				  
				}
				this.$http.sendRequest('/business/login', 'POST',this.form,2).then(res => {
					if(res.data.code == ''){
						uni.setStorageSync('token', res.data.data.token);
						uni.setStorageSync('shopId', res.data.data.shopId);
						uni.switchTab({
								url: '/pages/my/my'
						})
					}else{
						uni.showToast({
							icon: 'none',
							title: res.data.message
						})
					}
					
					
					
				})
			},
			change() {
				this.ischange = !this.ischange
			},
					
			goHome(){
				uni.switchTab({
					url: '/pages/home/home'
				})
			},
			/**
			 * 登录点击
			 */
			onLogin() {}
		},
		watch: {
			form: {
				handler(newValue, oldValue) {
					// 验证码
					if (this.isLoginWay) {
						this.isLogin = newValue.newPassword && newValue.phone ? true : false;
					}
					// 账号密码
					if (!this.isLoginWay) {
						this.isLogin = newValue.password && newValue.phone ? true : false;
					}
				},
				deep: true
			},
			num() {
				if (this.num == 0) {
					clearInterval(this.time)
					this.isTrue = false
				}
			}
		}
		
	}
</script>

<style scoped lang="scss">
	@import 'login.scss';
	.container {
		background-color: #FFFFFF;
		height: calc(100vh - 64px);
		display: flex;
		flex-direction: column;
		    align-items: center;
	justify-content: center;
		.login-logoBox {
			// margin-top: -200rpx;
	
			.login-logo {
				width: 200rpx;
				height: 167rpx;
			}
		}
	
		.loginTitle-text {
			margin-top: 100rpx;
			
		}
	
		.goToHome {
			background: none;
			border: none;
			width: auto;
			margin-top: 50rpx;
			color: #999999;
			text-decoration: underline;
	
			&:after {
				display: none;
			}
		}
	
		.loginWxBut {
			background: #3f9b6a;
			color: #FFEBC4;
			height: 88rpx;
			width: 600rpx;
			text-align: center;
			line-height: 88rpx;
			margin-top: 49rpx;
		}
	
		.loginBut {
			background-color: #3f9b6a;
			color: #FFEBC4;
			height: 88rpx;
			width: 600rpx;
			text-align: center;
			line-height: 88rpx;
			margin-top: 30rpx;
		}
	
		.register-text {
			color: #C5AA7B;
		}
		.font-color-C5AA7B{
			color: #C5AA7B;
		}
		.font-color-666{
			color: #666666;
			font-size: 12px;
		}
	}
</style>

<style scoped>
	.loginWxBut::after {
		border-radius: 0 !important;
	}
</style>