diff --git a/pages/API/login/login.vue b/pages/API/login/login.vue index c6595c2d6bd2657dfd2d6baf087a9be6d265627f..1e145ec48ec0d0cabe1204489d8d60f3fb60000e 100644 --- a/pages/API/login/login.vue +++ b/pages/API/login/login.vue @@ -4,7 +4,12 @@ - 已登录 + 已登录 + + + ({{phoneNumber}}) + + 每个账号仅需登录 1 次,\n后续每次进入页面即可自动拉取用户信息。 @@ -23,7 +28,8 @@ - + @@ -34,16 +40,19 @@ mapState, mapMutations } from 'vuex' + const univerifyInfoKey = 'univerifyInfo'; export default { data() { return { title: 'login', - providerList: [] + providerList: [], + phoneNumber: '', + univerifyBtnDisabled: true } }, computed: { - ...mapState(['hasLogin']) + ...mapState(['hasLogin', 'isUniverifyLogin']) }, onLoad() { uni.getProvider({ @@ -76,6 +85,25 @@ case 'apple': providerName = '苹果登录' break; + case 'univerify': + uni.preLogin({ + provider: value, + success: (res) => { + // 成功 + console.log("preLogin success: ", res); + this.univerifyBtnDisabled = false; + }, + fail: (res) => { + // 失败 + console.log("preLogin fail: ", res); + // 失败 + console.log("preLogin fail: ", res.errCode) + console.log("preLogin fail: ", res.errMsg) + this.setUniverifyLogin(false); + } + }) + providerName = '一键登录' + break; } return { name: providerName, @@ -88,9 +116,25 @@ console.log('获取登录通道失败', error); } }); + + uni.onAuthViewOtherLoginButtonClick(() => { + uni.closeAuthView(); + this.Toast({ + title: '其他登录方式' + }) + }) + + if (this.hasLogin && this.isUniverifyLogin) { + this.getPhoneNumber(uni.getStorageSync(univerifyInfoKey)) + } }, methods: { - ...mapMutations(['login']), + ...mapMutations(['login', 'setUniverifyLogin']), + Toast(data, duration = 1000) { + uni.showToast(Object.assign({}, data, { + duration + })) + }, tologin(provider) { uni.login({ provider: provider.id, @@ -101,19 +145,40 @@ console.log('login success:', res); // 更新保存在 store 中的登录状态 this.login(provider.id); - // #ifdef MP-WEIXIN + + if (provider.id === 'univerify') { + this.setUniverifyLogin(true); + uni.closeAuthView(); + + const { + access_token, + openid + } = res.authResult + + // 注意大小写 + const univerifyInfo = { + provider: provider.id, + accessToken: access_token, + openid + } + + this.getPhoneNumber(univerifyInfo); + } else { + this.setUniverifyLogin(false); + } + // #ifdef MP-WEIXIN console.warn('如需获取openid请参考uni-id: https://uniapp.dcloud.net.cn/uniCloud/uni-id') - uni.request({ - url: 'https://97fca9f2-41f6-449f-a35e-3f135d4c3875.bspapp.com/http/user-center', - method:'POST', + uni.request({ + url: 'https://97fca9f2-41f6-449f-a35e-3f135d4c3875.bspapp.com/http/user-center', + method: 'POST', data: { action: 'loginByWeixin', params: { - code: res.code, + code: res.code, platform: 'mp-weixin' } }, - success(res) { + success(res) { console.log(res); if (res.data.code !== 0) { console.log('获取openid失败:', res.result.msg); @@ -131,6 +196,35 @@ console.log('login fail:', err); } }); + }, + getPhoneNumber(univerifyInfo) { + uni.request({ + url: 'https://97fca9f2-41f6-449f-a35e-3f135d4c3875.bspapp.com/http/univerify-login', + method: 'POST', + data: univerifyInfo, + success: (res) => { + console.log(res); + const { + data + } = res; + if (data.success) { + this.phoneNumber = data.phoneNumber; + uni.setStorageSync(univerifyInfoKey, univerifyInfo) + } else { + this.Toast({ + icon: 'none', + title: `手机号获取失败` + }) + console.error(res); + } + + }, + fail: (err) => { + this.Toast({ + title: '一键登录失败' + }) + } + }) } } } diff --git a/store/index.js b/store/index.js index 1a415431faa77abc6e6cc7f978add881f5dfb04f..f9cd56405b8e25c23e7e5f0132e061a234853340 100644 --- a/store/index.js +++ b/store/index.js @@ -5,7 +5,8 @@ Vue.use(Vuex) const store = new Vuex.Store({ state: { - hasLogin: false, + hasLogin: false, + isUniverifyLogin: false, loginProvider: "", openid: null, testvuex:false, @@ -52,6 +53,10 @@ const store = new Vuex.Store({ }, setMenu(state, menu){ state.menu = menu + }, + setUniverifyLogin(state, payload){ + typeof payload !== 'boolean' ? payload = !!payload : ''; + state.isUniverifyLogin = payload; } }, getters:{