From 513be798a677672644770e2b2f7025b6d4d20414 Mon Sep 17 00:00:00 2001
From: 付延余 <f-yanyu@outlook.com>
Date: 星期三, 07 九月 2022 14:44:04 +0800
Subject: [PATCH] 完善登录，登录授权
---
pages/login/login.vue | 135 +++++++++++++++++++++++++++++++++++++++-----
1 files changed, 119 insertions(+), 16 deletions(-)
diff --git a/pages/login/login.vue b/pages/login/login.vue
index 5654590..fe8c0c7 100644
--- a/pages/login/login.vue
+++ b/pages/login/login.vue
@@ -1,7 +1,32 @@
<template>
<view class="login">
<image src="@/static/login/banner.png" class="background"></image>
- <view class="loginBtn"><u-button throttleTime="3000" text="寰俊璐﹀彿蹇嵎鐧诲綍" type="success" shape="circle" icon="weixin-fill" @click="wxLogin"></u-button></view>
+ <view class="login-container">
+ <view class="loginBtn"><u-button text="寰俊璐﹀彿蹇嵎鐧诲綍" type="success" shape="circle" icon="weixin-fill" @click="toGrantAuthorization"></u-button></view>
+ <view class="utils"><text @click="toBindPage">缁戝畾绯荤粺璐﹀彿</text></view>
+ </view>
+ <!-- 鐗瑰畾鑼冨洿璇存槑 -->
+ <view class="loginBottom"><text>灏忕▼搴忎粎渚涘凡鎷ユ湁绯荤粺璐﹀彿鐗瑰畾鍐呴儴浜哄憳浣跨敤</text></view>
+ <u-modal
+ @confirm="wxLoginConfirm"
+ @cancel="wxLoginCancel"
+ @close="wxLoginClose"
+ :show="wxLoginModal.show"
+ :title="wxLoginModal.title"
+ :content="wxLoginModal.content"
+ :showCancelButton="true"
+ ></u-modal>
+ <view class="toGrantAuthorization-container">
+ <u-popup :show="popupShow" mode="bottom" @close="closePopup" @open="openPopup" round="10" :safeAreaInsetBottom="true">
+ <view class="popup-warp">
+ <view class="body"><text>鏈皬绋嬪簭锛屼粎渚涘凡鎷ユ湁绯荤粺璐﹀彿鐗瑰畾鍐呴儴浜哄憳鐧诲綍浣跨敤锛岀偣鍑诲悓鎰忓嵆琛ㄧず鎮ㄥ凡鍚屾剰鐩稿簲淇℃伅鎺堟潈銆�</text></view>
+ <view class="btn">
+ <u-button @click="popupShow = false" type="error" text="涓嶅悓鎰�" shape="circle" :plain="true"></u-button>
+ <u-button @click="wxLogin" type="error" text="鍚屾剰" throttleTime="3000" shape="circle"></u-button>
+ </view>
+ </view>
+ </u-popup>
+ </view>
</view>
</template>
@@ -10,7 +35,13 @@
export default {
data() {
return {
- wxcode: ''
+ wxcode: '', //寰俊code
+ wxLoginModal: {
+ show: false,
+ title: '鎻愮ず',
+ content: ''
+ },
+ popupShow: false
};
},
onShow() {
@@ -20,7 +51,11 @@
}
},
methods: {
+ toGrantAuthorization() {
+ this.popupShow = true;
+ },
wxLogin() {
+ this.popupShow = false;
uni.showLoading({
title: '鍔犺浇涓�...'
});
@@ -32,12 +67,9 @@
this.wxSmallLogin(this.wxcode)
.then(res => {
if (res.data.data == '鐢ㄦ埛涓嶅瓨鍦�') {
- this.$u.toast('鏈粦瀹氱郴缁熻处鍙凤紝鍗冲皢璺宠浆缁戝畾椤甸潰锛�')
- setTimeout(()=>{
- uni.navigateTo({
- url: '/pages/register/register'
- });
- },1000)
+ // this.$u.toast('鏈粦瀹氱郴缁熻处鍙凤紝鍗冲皢璺宠浆缁戝畾椤甸潰锛�');
+ this.wxLoginModal.content = '鏈粦瀹氱郴缁熻处鍙凤紝鏄惁璺宠浆璐﹀彿缁戝畾椤甸潰锛�';
+ this.wxLoginModal.show = true;
} else if (res.data.active && res.data.active == true) {
const { access_token, refresh_token, token_type, scope } = res.data;
try {
@@ -66,6 +98,32 @@
}
}
});
+ },
+ toBindPage() {
+ uni.navigateTo({
+ url: '/pages/register/register'
+ });
+ },
+ // 妯℃�佹
+ wxLoginConfirm() {
+ uni.navigateTo({
+ url: '/pages/register/register'
+ });
+ this.wxLoginModal.show = false;
+ },
+ wxLoginCancel() {
+ this.wxLoginModal.show = false;
+ },
+ wxLoginClose() {
+ this.wxLoginModal.show = false;
+ },
+ // 寮瑰嚭妗�
+ openPopup() {
+ console.log('open');
+ },
+ closePopup() {
+ this.popupShow = false;
+ console.log('close');
}
}
};
@@ -80,20 +138,65 @@
// height: vww(289);
height: vww(246);
}
-
- .loginBtn {
+ .login-container {
margin: vww(60) auto;
width: 80%;
- .u-button {
- .u-icon {
- .u-icon__icon {
- font-size: vww(30) !important;
+ .loginBtn {
+ .u-button {
+ .u-icon {
+ .u-icon__icon {
+ font-size: vww(30) !important;
+ }
}
+ .u-button__text {
+ font-size: vww(17) !important;
+ font-weight: 530;
+ }
+ }
+
+ .u-button--success {
+ border-style: none;
+ background-color: #3ebc17;
}
}
- .u-button--success {
- border-style: none;
+ .utils {
+ font-size: vww(14);
+ margin-top: vww(20);
+ text-align: center;
+ color: #346a9d;
+ }
+ }
+
+ .loginBottom {
+ color: #aaaaaa;
+ margin-top: vww(180);
+ font-size: vww(14);
+ text-align: center;
+ }
+
+ // 寮瑰嚭妗�
+ .toGrantAuthorization-container {
+ .u-popup {
+ .u-transition {
+ .u-popup__content {
+ .popup-warp {
+ height: vww(200);
+ padding: vww(10) vww(20);
+ .body {
+ width: 100%;
+ height: 70%;
+ }
+ .btn {
+ display: flex;
+ justify-content: space-between;
+ .u-button {
+ width: 40%;
+ }
+ }
+ }
+ }
+ }
}
}
}
--
Gitblit v1.9.1