登录

pages/login/login.vue

@@ -2,17 +2,26 @@
 	<view class="container" style="background-image: url('../../static/login.gif');height:100vh;">
 		<view :style="{ height: height }" />
 		<view class="logo">
-			<u--image src="/static/img/logo.png" width="39.200vw" height="12.533vw" mode="scaleToFill">
+			<u--image src="/static/img/LOGO-c1524a7d.svg" width="39.200vw" height="12.533vw" mode="scaleToFill">
 				<template v-slot:loading>
 					<u-loading-icon color="red"></u-loading-icon>
 				</template>
 				<view slot="error" style="font-size: 12px;">加载失败</view>
 			</u--image>
 		</view>
-		<account v-show="loginMethod == 'account'" />
-		<phone v-show="loginMethod == 'phone'" />
+		<account :isAgreement="isAgreement" v-show="loginMethod == 'account'" />
+		<phone :isAgreement="isAgreement" v-show="loginMethod == 'phone'" />
 		<view style="height: 25px;" />
-		<other-login :loginMethod="loginMethod" @onChange="changeLoginMethod" />
+
+		<view class="agreement">
+			<u-checkbox :checked="isAgreement" shape="circle" @change="changeAgreement" />
+			<view @click="changeAgreement">
+				已阅读并同意
+			</view>
+			<text class="nav">《隐私协议》</text>
+		</view>
+
+		<other-login :isAgreement="isAgreement" :loginMethod="loginMethod" @onChange="changeLoginMethod" />
 	</view>
 </template>
 <script>
@@ -29,17 +38,22 @@ export default {
 	data() {
 		return {
 			loginMethod: "",
-			height: this.usePort == 'h5' ? "100px" : "150px"
+			height: this.usePort == 'h5' ? "100px" : "150px",
+			isAgreement: false
 		};
 	},
 	onLoad() {
 		this.loginMethod = uni.getStorageSync('loginMethod') || 'account';//登录方式
 		getCity.bind(this)().then(res => res && uni.setStorageSync("city", res))
+		if (uni.getStorageSync("isAgreement")) this.isAgreement = true;
 	},
 	methods: {
 		/* 修改登录方式 */
 		changeLoginMethod(Method) {
 			this.loginMethod = Method;
+		},
+		changeAgreement() {
+			this.isAgreement = !this.isAgreement;
 		}
 	}
 }
@@ -56,5 +70,29 @@ export default {
 		height: 42px;
 		margin: 0 auto 50px;
 	}
+
+	.agreement {
+		display: flex;
+		justify-content: center;
+		margin: 0 auto;
+		height: 17px;
+		font-size: 12px;
+		font-weight: 400;
+		color: #fff;
+
+		.nav {
+			color: #16FFF6;
+		}
+	}
+
+	/deep/.u-checkbox__icon-wrap,
+	/deep/.u-checkbox__icon-wrap--circle {
+		width: 16px !important;
+		height: 16px !important;
+
+		.u-icon__icon {
+			font-size: 10px !important;
+		}
+	}
 }
 </style>

pages/login/modules/account.vue

@@ -30,6 +30,9 @@ import { hexMD5 } from "./md5";
 import { loginMsg } from "./dispose";
 export default {
 	name: "Account",
+	props: {
+		isAgreement: Boolean
+	},
 	data() {
 		return {
 			memory: 1,//是否记忆密码
@@ -66,6 +69,10 @@ export default {
 		/* 开始登录 */
 		startLogging() {
 			if (this.loading) return;
+			if (!this.isAgreement) return uni.showToast({
+				title: '请阅读并勾选用户协议',
+				icon: 'none',
+			})
 			this.loading = true;
 			this.$Http.login({
 				"accountno": this.account.account,
@@ -157,7 +164,7 @@ input {
 	opacity: 0.65;
 }
 
-/deep/ .uni-checkbox-input  {
+/deep/ .uni-checkbox-input {
 	width: 14px !important;
 	height: 14px !important;
 	margin-right: 6px;

pages/login/modules/dispose.js

@@ -3,9 +3,9 @@ import {
     parsingAuth
 } from "../../../utils/auth";
 
-function loginMsg(account_list, _Http) {
-    uni.setStorageSync("account_list", account_list);
-    console.log(account_list)
+function loginMsg(account_list, _Http, storage = true) {
+    if (storage) uni.setStorageSync("account_list", account_list);
+    uni.setStorageSync("isAgreement", true);
     if (account_list.length == 1) {
         uni.setStorageSync('userMsg', account_list[0])
         query_userauth(_Http);

pages/login/modules/otherLogin.vue

@@ -2,41 +2,71 @@
     <view class="container">
         <u-divider text="其他登录方式" textSize="3.2vw" textColor="#fff" lineColor="#fff" />
         <view class="grid-box">
-            <view class="item">
-                微信
-            </view>
             <view class="item" @click="changeLoginMethod">
-                {{ loginMethod == 'phone' ? '账号' : '手机' }}
+                <text class="iconfont" :class="loginMethod == 'phone' ? 'icon-zhanghaodenglu' : 'icon-shoujidenglu'" />
+            </view>
+            <view class="item" style="background-color: #28C445;" v-if="port == 'wechat'" @click="wechatLogin">
+                <u-icon name="weixin-fill" size="8vw" color="#fff"></u-icon>
             </view>
         </view>
     </view>
 </template>
 
 <script>
+import { loginMsg } from "./dispose";
 export default {
     name: "OtherLogin",
     props: {
         "loginMethod": String,
-        onChange: Function
+        onChange: Function,
+        isAgreement: Boolean
+    },
+    data() {
+        return {
+            port: 'wechat'
+        }
+    },
+    created() {
+        // #ifndef MP
+        this.port = 'h5'
+        // #endif
+        // #ifdef MP-WEIXIN
+        this.port = 'wechat'
+        // #endif
     },
     methods: {
         /* 改变登录方式 */
         changeLoginMethod() {
             this.$emit("onChange", this.loginMethod == 'account' ? 'phone' : 'account')
-        }
+        },
+        /* 微信登录 */
+        wechatLogin() {
+            if (!this.isAgreement) return uni.showToast({
+                title: '请阅读并勾选用户协议',
+                icon: 'none',
+            })
+            let that = this;
+            uni.login({
+                success(res) {
+                    that.$Http.loginbywechat({
+                        wechat_code: res.code,
+                        "systemclient": "wechat"
+                    }).then(res => {
+                        console.log("微信快捷登录", res)
+                        if (that.cutoff(res.msg)) return;
+                        loginMsg(res.account_list, this.$Http)
+                    })
+                }
+            })
+        },
     },
 }
 </script>
 
 <style lang="scss" scoped>
-page {
-    width: 100vw;
-    background: #282C35 !important;
-}
-
 .container {
     width: 275px !important;
-    margin: -20px auto 0;
+    margin: 0 auto;
 
     .grid-box {
         display: flex;
@@ -45,15 +75,20 @@ page {
         flex-wrap: wrap;
 
         .item {
+            display: flex;
+            justify-content: center;
+            align-items: center;
             width: 40px;
             height: 40px;
             border-radius: 50%;
-            background-color: red;
+            background-color: rgba($color: #fff, $alpha: .3);
             flex-shrink: 0;
             margin: 0 7px 7px;
-            text-align: center;
-            line-height: 40px;
             color: #fff;
+
+            .iconfont {
+                font-size: 20px;
+            }
         }
     }
 }

pages/login/modules/phone.vue

@@ -30,6 +30,9 @@ import { loginMsg } from "./dispose";
 
 export default {
 	name: "Phone",
+	props: {
+		isAgreement: Boolean
+	},
 	data() {
 		return {
 			loading: false,
@@ -89,6 +92,10 @@ export default {
 		/* 开始登录 */
 		startLogging() {
 			if (this.loading) return;
+			if (!this.isAgreement) return uni.showToast({
+				title: '请阅读并勾选用户协议',
+				icon: 'none',
+			})
 			if (!CheckPhoneNumber(this.phoneNumber, '请输入正确的手机号码')) return;
 			if (this.password == "") return uni.showToast({
 				title: '还未填写验证码',
@@ -97,7 +104,7 @@ export default {
 			});
 			this.loading = true;
 			this.$Http.plogin({
-				"phonenumber": this.phonenumber,
+				"phonenumber": this.phoneNumber,
 				"password": hexMD5(this.password),
 				"systemclient": "wechat"
 			}).then(res => {

pages/login/selectSite.vue

@@ -7,8 +7,8 @@
                 选择登录站点
             </block>
         </cu-custom>
-        <navigator class="site" url="#" v-for="item in account_list" :key="item.userid" @click="selectSite(item)">
-            {{ item.name }}
+        <navigator class="site" v-for="(item, i) in account_list" :key="item.userid" url="#" @click="selectSite(i)">
+            {{ item.sitename }}-{{ item.name }}
         </navigator>
     </view>
 </template>
@@ -23,15 +23,14 @@ export default {
         }
     },
     methods: {
-        selectSite(site) {
-            let that = this;
+        selectSite(index) {
+            let that = this,
+                site = this.account_list[index];
             uni.showModal({
                 title: '提示',
                 content: `是否确定登录“${site.sitename}”站点的“${site.name}”账号`,
                 success: ({ confirm }) => {
-                    if (confirm) {
-                        loginMsg([site], this.$Http);
-                    }
+                    if (confirm) loginMsg([site], that.$Http, false);
                 }
             })
         },