登录组件封装

This commit is contained in:
”chenxuelian“
2023-01-06 22:19:31 +08:00
parent 91b8f57154
commit d42219873d
2 changed files with 108 additions and 35 deletions

View File

@@ -95,11 +95,21 @@
</view>
</view>
</u--form>
<view>
<u-overlay :show="!isLoad">
<login @success="reOnLoad()" @fail="failToLoad()"></login>
</u-overlay>
</view>
</view>
</template>
<script>
import login from '../my/login/login.vue'
export default {
components: {
login
},
data() {
return {
tabsList: [{
@@ -134,7 +144,8 @@
categoryPickerList: [
['类别1', '类别', '类别']
],
fileList1: []
fileList1: [],
isLoad: true
}
},
onLoad(options) {
@@ -144,6 +155,15 @@
} else if (options.index == 1) {
this.tabCurrent = 1
}
if (!uni.getStorageSync('token') || uni.getStorageSync('token').length === 0) {
console.log(uni.getStorageSync('token'))
this.isLoad = false
// uni.navigateTo({
// url: '../../pages/my/login/login'
// })
return
}
this.isLoad = true
},
methods: {
tabChange(data) {
@@ -230,6 +250,22 @@
// });
// })
},
reOnLoad() {
console.log('----------------true')
if (!uni.getStorageSync('token') || uni.getStorageSync('token').length === 0) {
this.$toast.warn('登录失败请重试')
this.isLoad = false
// uni.navigateTo({
// url: '../../pages/my/login/login'
// })
return
}
this.isLoad = true
},
failToLoad() {
console.log('----------------false')
this.$toast.warn('登录失败请重试')
}
}
}
</script>

View File

@@ -1,7 +1,9 @@
<template>
<view>
<u-button type="primary" open-type="getPhoneNumber" size="medium" @getphonenumber="getphonenumber">
获取电话号码</u-button>
<view style="width: 100%;position: absolute;bottom: 0; padding-top: 30rpx; background-color: #fff;">
<view style="padding-left: 30rpx;padding-right: 30rpx;">
<u-button open-type="getPhoneNumber" size="medium" class="custom-style" @getphonenumber="getphonenumber"
color='#12CA64'>登录</u-button>
</view>
</view>
</template>
@@ -11,46 +13,81 @@
} from '@/service/request.js'
export default {
data() {
return {
}
return {}
},
methods: {
getphonenumber(e) {
const {
phoneCode
} = e.detail;
console.log("手机code : ", phoneCode);
uni.login({
"provider": "weixin",
"onlyAuthorize": true, // 微信登录仅请求授权认证
success: function(event) {
const {
code
} = event
var that = this
console.log(e)
if (e.detail.errMsg === 'getPhoneNumber:ok') {
//调用接口利用 e.detail.encryptedData, e.detail.iv 信息来解密手机号
uni.login({
"provider": "weixin",
"onlyAuthorize": true, // 微信登录仅请求授权认证
success: function(event) {
const {
code
} = event
that.$apiServe.login({
code: code
}).then(res => {
var data = res.data.data
// console.log('登录code换取的信息', data);
uni.setStorageSync('token', data.token);
that.$toast.warn('登录成功')
that.$emit('success')
})
},
fail: function(err) {
// 登录授权失败
// err.code是错误码
that.$emit('fail')
}
})
} else {
// 拒绝授权
that.$emit('fail')
}
}
// getphonenumber(e) {
// const {
// phoneCode
// } = e.detail;
// console.log("手机code : ", phoneCode);
// uni.login({
// "provider": "weixin",
// "onlyAuthorize": true, // 微信登录仅请求授权认证
// success: function(event) {
// const {
// code
// } = event
console.log("登录code", code);
//客户端成功获取授权临时票据code,向业务服务器发起登录请求。
// console.log("登录code", code);
// //客户端成功获取授权临时票据code,向业务服务器发起登录请求。
// 调用登录接口 拿到token 传手机code,更新手机号码
loginSys(code).then(res => {
console.log(res);
// // 调用登录接口 拿到token 传手机code,更新手机号码
// loginSys(code).then(res => {
// console.log(res);
//登录完成后使用手机code换取手机号,调用/user/getMobileByMnp接口
//接口详细链接 https://docs.apipost.cn/preview/468be606f65cae75/3f2f988ddf82dd8e
})
},
fail: function(err) {
// 登录授权失败
// err.code是错误码
}
})
},
// //登录完成后使用手机code换取手机号,调用/user/getMobileByMnp接口
// //接口详细链接 https://docs.apipost.cn/preview/468be606f65cae75/3f2f988ddf82dd8e
// })
// },
// fail: function(err) {
// // 登录授权失败
// // err.code是错误码
// }
// })
// },
}
}
</script>
<style>
<style lang="less" scoped>
.custom-style {
width: 200rpx;
padding-left: 30rpx;
padding-right: 30rpx;
}
</style>