<template>
<view>
<!-- #ifdef MP-WEIXIN -->
<view v-if="isCanUse">
<view>
<view class='header'>
<image src='../../static/pen2.png'></image>
</view>
<view class='content'>
<view>申请获取以下权限</view>
<text>获得你的公开信息(昵称，头像、地区等)</text>
</view>
<button class="bottom" type='primary' @click="getUserProfile">
登录授权
</button>
</view>
</view>
<view v-if="isCanUse2">
<view>
<view class='header'>
<image src='../../static/pen2.png'></image>
</view>
<view class='content'>
<view>申请获取以下权限</view>
<!-- <text>获得你的手机号用于绑定登录</text> -->
</view>
<button class='bottom' type='primary' style="background: #0083c9;" open-type="getPhoneNumber" @getphonenumber="PhoneNumber">
授权手机登录
</button>
</view>
</view>
<!-- 登录 -->
<view class="content2" v-if="isCanUse3">
<view class='header' style="margin-left: 0px;">
<image src='../../static/pen2.png'></image>
</view>
<view>
<input type="text" v-model="username" class="username" placeholder="请输入账号">
<input type="password" v-model="password" class="username" placeholder="请输入密码">
</view>
</view>
<view v-if="isCanUse3">
<button type="primary" class="bottom" @click="submit">登录</button>
</view>
<!-- 登录结束 -->
<!-- #endif -->
</view>
</template>
<script>
import basesevers from '../../common/basesevers.js'
export default {
data() {
return {
username:"",
password:"",
encry:"",
iv:"",
code: "",
SessionKey: '',
OpenId: '',
avatar: '',
nick_name: "",
avatarUrl: null,
isCanUse: false, //默认为true
isCanUse2: false ,//默认为true
isCanUse3:false
};
},
methods: {
//第一授权获取用户信息===》按钮触发
// 调用wx.getUserProfile接口
getUserProfile() {
var that = this
// #ifdef MP-WEIXIN
uni.getProvider({
service: 'oauth',
success: function(res) {
if (~res.provider.indexOf('weixin')) {
wx.login({
success: (res) => {
that.code = res.code
console.log('获取信息code', res.code);
}
})
uni.getUserProfile({
desc: '登录',
success: async (res) => {
uni.setStorageSync('isCanUse', false);
that.isCanUse = false
that.isCanUse2 = true
// 后端接口
console.log('获取信息getUserProfile', res);
that.avatar = res.userInfo.avatarUrl
that.nick_name = res.userInfo.nickName
},
fail: (res) => {
console.log(res)
}
});
} else {
uni.showToast({
title: '请先安装微信或升级版本',
icon: "none"
});
}
}
});
//#endif
},
//登录
login() {
let _this = this;
uni.showLoading({
title: '登录中...'
});
},
PhoneNumber(e) {
var _this = this
var encry = e.detail.encryptedData;
_this.encry=e.detail.encryptedData;
var iv = e.detail.iv;
_this.iv=e.detail.iv;
// 不允许授权
if (e.detail.errMsg !== "getPhoneNumber:ok") {
console.log("没有授权")
_this.isCanUse = true;
_this.isCanUse2 = false;
return;
}else{
_this.isCanUse2 = false;
_this.isCanUse3 = true;
}
console.log('获取信息手机', e);
},
// 点击登录
submit(){
var _this=this
uni.showLoading({
title: '登录中...'
});
uni.request({
url: basesevers.request2 + '/connect/token',
//url: 'http://192.192.192.183:7003/connect/token',
method: 'post',
dateType: "json",
header: {
'content-Type': 'application/x-www-form-urlencoded' //自定义请求头信息
},
data: {
grant_type: 'wechat_mini_code', //你的小程序的APPID
client_id: 'client.custom', //你的小程序秘钥secret,
//code: _this.code, //wx.login 登录成功后的code
phonenumber: _this.encry,
iv: _this.iv,
avatar: _this.avatar,
nick_name: _this.nick_name,
username:_this.username,
password:_this.password,
code:_this.code
},
success: (cts) => {
if (cts.statusCode == 200) {
if (!("access_token" in cts.data)) {
console.log('获取失败'); //
} else {
uni.setStorageSync('access_token', cts.data.access_token);
console.log('获取成功'); //
// 请求头像开始
uni.request({
url: basesevers.request2 + '/api/identity/my-profile',
method: 'get',
dateType: "json",
header: {
'content-Type': 'application/x-www-form-urlencoded', //自定义请求头信息
"Authorization": 'Bearer ' + cts.data.access_token
},
data: {
// grant_type: 'wechat_mini_code', //你的小程序的APPID
},
success: (cts2) => {
uni.hideLoading();
if (cts.statusCode == 200) {
console.log("获取后端返回数据", cts2)
console.log(cts2.data.extraProperties.NickName)
uni.setStorageSync('avatar', cts2.data.extraProperties.AvatarUrl);
uni.setStorageSync('name', cts2.data.name);
uni.setStorageSync('username', cts2.data.userName);
uni.setStorageSync('DeptName', cts2.data.extraProperties.DeptName);
uni.reLaunch({ //信息更新成功后跳转到小程序首页
url: '/pages/index/index'
});
} else {
console.log("失败")
}
}
});
}
} else {
console.log(cts.data.error_description)
var stat=cts.data.error_description
var tex=""
if(stat=="-51001"){
tex="授权码为空"
}else if(stat=="-51002"){
tex="iv为空"
}else if(stat=="-52001"){
tex="换取token错误"
}else if(stat=="-52002"){
tex="用户不存在"
}else if(stat=="-52003"){
tex="用户已锁定"
}else if(stat=="-52004"){
tex="该用户不允许登录"
}else if(stat=="-52005"){
tex="用户验证错误"
}else if(stat=="-52006"){
tex="绑定用户失败,请联系管理员"
}
uni.hideLoading();
uni.showModal({
title: '提示',
content: tex,
success: function (res) {
if (res.confirm) {
console.log('用户点击确定');
} else if (res.cancel) {
console.log('用户点击取消');
}
}
});
// uni.hideLoading(300);
console.log("没有授权")
_this.isCanUse = true;
_this.isCanUse2 = false
_this.isCanUse3 = false
}
}
});
}
},
onLoad() {
//默认加载
var _this=this
wx.login({
success: (res) => {
_this.code = res.code
console.log('获取信息code', res.code);
uni.request({
url: basesevers.request2 + '/connect/token',
method: 'post',
dateType: "json",
header: {
'content-Type': 'application/x-www-form-urlencoded' //自定义请求头信息
},
data: {
grant_type: 'wechat_mini_code', //你的小程序的APPID
client_id: 'client.custom', //你的小程序秘钥secret,
code: _this.code, //wx.login 登录成功后的code
},
success: (cts) => {
if (cts.statusCode == 200) {
//
if(!uni.getStorageSync('name')){
uni.request({
url: basesevers.request2 + '/api/identity/my-profile',
method: 'get',
dateType: "json",
header: {
'content-Type': 'application/x-www-form-urlencoded', //自定义请求头信息
"Authorization": 'Bearer ' + cts.data.access_token
},
data: {
// grant_type: 'wechat_mini_code', //你的小程序的APPID
},
success: (cts2) => {
uni.hideLoading();
if (cts.statusCode == 200) {
console.log("获取后端返回数据", cts2)
console.log(cts2.data.extraProperties.NickName)
uni.setStorageSync('avatar', cts2.data.extraProperties.AvatarUrl);
uni.setStorageSync('name', cts2.data.name);
uni.setStorageSync('username', cts2.data.userName);
uni.setStorageSync('DeptName', cts2.data.extraProperties.DeptName);
// uni.reLaunch({ //信息更新成功后跳转到小程序首页
// url: '/pages/index/index'
// });
} else {
console.log("失败")
}
}
});
}else{
}
//
console.log("第一次验证成功")
uni.setStorageSync('access_token', cts.data.access_token);
uni.reLaunch({ //信息更新成功后跳转到小程序首页
url: '/pages/index/index'
});
return
//_this.isCanUse3=true
}else{
_this.isCanUse = true;
_this.isCanUse2 = false;
_this.isCanUse3=false
wx.login({
success: (res) => {
_this.code = res.code
console.log('获取信息code', res.code);
}
})
return;
}
}
});
}
})
// this.login();
console.log(this.isCanUse)
console.log(uni.getStorageSync('isCanUse'))
// if (uni.getStorageSync('access_token') != "") {
// uni.reLaunch({ //信息更新成功后跳转到小程序首页
// url: '/pages/index/index'
// });
// } else {
// this.isCanUse = true
// }
}
}
</script>
<style>
.header {
margin: 90rpx 0 90rpx 50rpx;
border-bottom: 1px solid #ccc;
text-align: center;
width: 650rpx;
height: 300rpx;
line-height: 450rpx;
}
.header image {
width: 200rpx;
height: 200rpx;
}
.content {
margin-left: 50rpx;
margin-bottom: 90rpx;
}
.content text {
display: block;
color: #9d9d9d;
margin-top: 40rpx;
}
.bottom {
border-radius: 80rpx;
margin: 70rpx 50rpx;
font-size: 35rpx;
}
/* 登录 */
.title{
font-weight: bold;
margin: 10rpx 0 40rpx 0;
font-size: 44rpx;
color: white;
}
.username{
height: 80rpx;
margin:10rpx 0 40rpx 0;
width: 100%;
border-radius: 80rpx;
background-color: white;
text-align: center;
}
.content2 {
margin: 70rpx 50rpx;
}
</style>
网友评论