public/crmeb_java
1
0
Fork 0
mirror of https://gitee.com/ZhongBangKeJi/crmeb_java.git synced 2026-04-29 21:51:26 +08:00
Code Issues Packages Projects Releases Wiki Activity

小程序授权登录回复正常

Browse Source
This commit is contained in:
337031187
2021-05-07 18:31:36 +08:00
parent cc8230497e
commit c3c875267f
85 changed files with 524 additions and 600 deletions
Download Patch File Download Diff File Expand all files Collapse all files

394
app/pages/users/login/index.vue
View File

@@ -1,36 +1,47 @@
<template>
<div class="login-wrapper">
<div class="register absolute">
<div class="shading">
<image :src="logoUrl" v-if="logoUrl" />
<image src="/static/images/logo2.png" v-else />
<div class="pictrue acea-row row-center-wrapper">
<image :src="logoUrl" v-if="logoUrl" />
<image src="/static/images/logo2.png" v-else />
</div>
</div>
<div class="whiteBg" v-if="formItem === 1">
<div class="list" v-if="current !== 1">
<div class="title acea-row row-center-wrapper">
<div class="item" :class="current === index ? 'on' : ''" v-for="(item, index) in navList" @click="navTap(index)"
:key="index">
{{ item }}
</div>
</div>
<div class="list" :hidden="current !== 1">
<form @submit.prevent="submit">
<div class="item">
<div class="acea-row row-middle">
<image src="/static/images/phone_1.png" style="width: 24rpx; height: 34rpx;"></image>
<image src="/static/images/phone_1.png"></image>
<input type="text" placeholder="输入手机号码" v-model="account" required />
</div>
</div>
<div class="item">
<div class="acea-row row-middle">
<image src="/static/images/code_2.png" style="width: 28rpx; height: 32rpx;"></image>
<image src="/static/images/code_2.png"></image>
<input type="password" placeholder="填写登录密码" v-model="password" required />
</div>
</div>
</form>
<!-- <navigator class="forgetPwd" hover-class="none" url="/pages/users/retrievePassword/index">
<span class="iconfont icon-wenti"></span>忘记密码
</navigator> -->
</div>
<div class="list" v-if="current !== 0 || appLoginStatus || appleLoginStatus">
<div class="list" :hidden="current !== 0">
<div class="item">
<div class="acea-row row-middle">
<image src="/static/images/phone_1.png" style="width: 24rpx; height: 34rpx;"></image>
<image src="/static/images/phone_1.png"></image>
<input type="text" placeholder="输入手机号码" v-model="account" />
</div>
</div>
<div class="item">
<div class="acea-row row-middle">
<image src="/static/images/code_2.png" style="width: 28rpx; height: 32rpx;"></image>
<image src="/static/images/code_2.png"></image>
<input type="text" placeholder="填写验证码" class="codeIput" v-model="captcha" />
<button class="code" :disabled="disabled" :class="disabled === true ? 'on' : ''" @click="code">
{{ text }}
@@ -39,44 +50,59 @@
</div>
<div class="item" v-if="isShowCode">
<div class="acea-row row-middle">
<image src="/static/images/code_2.png" style="width: 28rpx; height: 32rpx;"></image>
<image src="/static/images/code_2.png"></image>
<input type="text" placeholder="填写验证码" class="codeIput" v-model="codeVal" />
<div class="code" @click="again"><img :src="codeUrl" /></div>
</div>
</div>
</div>
<div class="logon" @click="loginMobile" v-if="current !== 0">登录</div>
<div class="logon" @click="submit" v-if="current === 0">登录</div>
<!-- #ifndef APP-PLUS -->
<div class="tips">
<div v-if="current==0" @click="current = 1">快速登录</div>
<div v-if="current==1" @click="current = 0">账号登录</div>
<div class="logon" @click="loginMobile" :hidden="current !== 0">登录</div>
<div class="logon" @click="submit" :hidden="current === 0">登录</div>
<div class="tip">
<div :hidden="current !== 1">
没有账号?
<span @click="current = 0" class="font-color-red">快速登录</span>
</div>
</div>
<!-- #endif -->
<!-- #ifdef APP-PLUS -->
<view class="appLogin" v-if="!appLoginStatus && !appleLoginStatus">
<view class="hds">
<span class="line"></span>
<p>其他方式登录</p>
<span class="line"></span>
</view>
<view class="btn-wrapper">
<view class="btn wx" @click="wxLogin">
<span class="iconfont icon-s-weixindenglu1"></span>
</view>
<view class="btn mima" v-if="current == 1" @click="current =0">
<span class="iconfont icon-s-mimadenglu1"></span>
</view>
<view class="btn yanzheng" v-if="current == 0" @click="current =1">
<span class="iconfont icon-s-yanzhengmadenglu1"></span>
</view>
<view class="apple-btn" @click="appleLogin" v-if="appleShow">
<view class="iconfont icon-s-pingguo"></view>通过Apple登录
</view>
</view>
</view>
<!-- #endif -->
</div>
<!-- <div class="whiteBg" v-else>
<div class="title">注册账号</div>
<div class="list">
<div class="item">
<div class="acea-row row-middle">
<image src="/static/images/phone_1.png"></image>
<input type="text" placeholder="输入手机号码" v-model="account" />
</div>
</div>
<div class="item">
<div class="acea-row row-middle">
<image src="/static/images/code_2.png"></image>
<input type="text" placeholder="填写验证码" class="codeIput" v-model="captcha" />
<button class="code" :disabled="disabled" :class="disabled === true ? 'on' : ''" @click="code">
{{ text }}
</button>
</div>
</div>
<div class="item">
<div class="acea-row row-middle">
<image src="/static/images/code_1.png"></image>
<input type="password" placeholder="填写您的登录密码" v-model="password" />
</div>
</div>
<div class="item" v-if="isShowCode">
<div class="acea-row row-middle">
<image src="/static/images/code_2.png"></image>
<input type="text" placeholder="填写验证码" class="codeIput" v-model="codeVal" />
<div class="code" @click="again"><img :src="codeUrl" /></div>
</div>
</div>
</div>
<div class="logon" @click="register">注册</div>
<div class="tip">
已有账号?
<span @click="formItem = 1" class="font-color-red">立即登录</span>
</div>
</div> -->
<div class="bottom"></div>
</div>
</template>
@@ -124,12 +150,7 @@
keyCode: "",
codeUrl: "",
codeVal: "",
isShowCode: false,
appLoginStatus: false, // 微信登录强制绑定手机号码状态
appUserInfo: null, // 微信登录保存的用户信息
appleLoginStatus: false, // 苹果登录强制绑定手机号码状态
appleUserInfo: null,
appleShow: false // 苹果登录版本必须要求ios13以上的
isShowCode: false
};
},
watch:{
@@ -146,133 +167,6 @@
this.getLogoImage();
},
methods: {
// 苹果登录
appleLogin() {
let self = this
this.account = ''
this.captcha = ''
uni.showLoading({
title: '登录中'
})
uni.login({
provider: 'apple',
timeout: 10000,
success(loginRes) {
uni.getUserProfile({
provider: 'apple',
success: function(infoRes) {
console.log(infoRes.userInfo, 'yyyy')
self.appleUserInfo = infoRes.userInfo
self.appleLoginApi()
},
fail() {
uni.showToast({
title: '获取用户信息失败',
icon: 'none',
duration: 2000
})
},
complete() {
uni.hideLoading()
}
});
},
fail(error) {
console.log(error)
}
})
},
// 苹果登录Api
appleLoginApi() {
let self = this
appleLogin({
openId: self.appleUserInfo.openId,
email: self.appleUserInfo.email || '',
phone: this.account,
captcha: this.captcha
}).then(({
data
}) => {
if (data.isbind) {
uni.showModal({
title: '提示',
content: '请绑定手机号后，继续操作',
showCancel: false,
success: function(res) {
if (res.confirm) {
self.current = 1
self.appleLoginStatus = true
}
}
});
} else {
self.$store.commit("LOGIN", {
'token': data.token,
'time': data.expires_time - self.$Cache.time()
});
let backUrl = self.$Cache.get(BACK_URL) || "/pages/index/index";
self.$Cache.clear(BACK_URL);
self.$store.commit("SETUID", data.userInfo.uid);
uni.reLaunch({
url: backUrl
});
}
}).catch(error => {
uni.showModal({
title: '提示',
content: `错误信息${error}`,
success: function(res) {
if (res.confirm) {
console.log('用户点击确定');
} else if (res.cancel) {
console.log('用户点击取消');
}
}
});
})
},
// App微信登录
wxLogin() {
let self = this
this.account = ''
this.captcha = ''
uni.showLoading({
title: '登录中'
})
uni.login({
provider: 'weixin',
success: function(loginRes) {
// 获取用户信息
uni.getUserProfile({
provider: 'weixin',
success: function(infoRes) {
self.appUserInfo = infoRes.userInfo
self.wxLoginApi()
console.log(self.$store);
console.log(infoRes.userInfo);
},
fail() {
uni.showToast({
title: '获取用户信息失败',
icon: 'none',
duration: 2000
})
},
complete() {
uni.hideLoading()
}
});
},
fail() {
uni.showToast({
title: '登录失败',
icon: 'none',
duration: 2000
})
}
});
},
again() {
this.codeUrl =
VUE_APP_API_URL +
@@ -327,9 +221,8 @@
});
const backUrl = that.$Cache.get(BACK_URL) || "/pages/index/index";
that.$Cache.clear(BACK_URL);
getUserInfo().then(res => {
that.$store.commit("UPDATE_USERINFO", res.data);
that.$store.commit("SETUID", res.data.uid);
// getUserInfo().then(res => {
that.$store.commit("SETUID", res.data.user.uid);
if (backUrl === '/pages/index/index' || backUrl === '/pages/order_addcart/order_addcart' || backUrl ===
'/pages/user/index') {
@@ -338,12 +231,11 @@
});
} else {
uni.navigateBack()
// uni.switchTab({
// url: '/pages/index/index'
// });
uni.switchTab({
url: '/pages/index/index'
});
}
})
// })
})
.catch(res => {
that.$util.Tips({
@@ -445,7 +337,6 @@
const backUrl = that.$Cache.get(BACK_URL) || "/pages/index/index";
that.$Cache.clear(BACK_URL);
getUserInfo().then(res => {
that.$store.commit("UPDATE_USERINFO", res.data);
that.$store.commit("SETUID", res.data.uid);
if (backUrl === '/pages/index/index' || backUrl === '/pages/order_addcart/order_addcart' || backUrl ==='/pages/user/index') {
uni.switchTab({
@@ -467,81 +358,7 @@
}
};
</script>
<style lang="scss" scoped>
.appLogin {
margin-top: 60rpx;
.hds {
display: flex;
justify-content: center;
align-items: center;
font-size: 24rpx;
color: #B4B4B4;
.line {
width: 68rpx;
height: 1rpx;
background: #CCCCCC;
}
p {
margin: 0 20rpx;
}
}
.btn-wrapper {
display: flex;
align-items: center;
justify-content: center;
margin-top: 30rpx;
.btn {
display: flex;
align-items: center;
justify-content: center;
width: 68rpx;
height: 68rpx;
border-radius: 50%;
}
.apple-btn {
display: flex;
align-items: center;
justify-content: center;
width: 246rpx;
height: 66rpx;
margin-left: 30rpx;
background: #EAEAEA;
border-radius: 34rpx;
font-size: 24rpx;
.icon-s-pingguo {
color: #333;
margin-right: 10rpx;
font-size: 34rpx;
}
}
.iconfont {
font-size: 40rpx;
color: #fff;
}
.wx {
margin-right: 30rpx;
background-color: #61C64F;
}
.mima {
background-color: #28B3E9;
}
.yanzheng {
background-color: #F89C23;
}
}
}
<style lang="scss">
.code img {
width: 100%;
height: 100%;
@@ -550,67 +367,6 @@
.acea-row.row-middle {
input {
margin-left: 20rpx;
display: block;
}
}
.login-wrapper{
padding: 30rpx;
.shading{
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 200rpx;
margin-top: 200rpx;
image{
width: 180rpx;
height: 180rpx;
}
}
.whiteBg{
margin-top: 100rpx;
.list{
border-radius: 16rpx;
overflow: hidden;
.item{
border-bottom: 1px solid #F0F0F0;
background: #fff;
.row-middle{
position: relative;
padding: 30rpx 45rpx;
input{
flex: 1;
font-size: 28rpx;
height: 80rpx;
}
.code{
position: absolute;
right: 30rpx;
top: 50%;
color: #E93323;
font-size: 26rpx;
transform: translateY(-50%);
}
}
}
}
.logon{
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 86rpx;
margin-top: 100rpx;
background-color: $theme-color;
border-radius: 120rpx;
color: #FFFFFF;
font-size: 30rpx;
}
.tips{
margin:30rpx;
text-align: center;
color: #999;
}
}
}
</style>
</style>