Commit 4a711212 authored by LiZongLin's avatar LiZongLin

获取手机号

parent 1e86947b
......@@ -11,11 +11,22 @@ import {
// })
// }
// export function getToken(code,token,userInfo) {
// export function getToken(code,userInfo,token) {
// return request({
// url: `/wx/user/login/${code}`,
// method: 'post',
// data:userInfo,
// headers: {
// isToken : false,
// "token":token
// }
// })
// }
export function getToken(code,token) {
return request({
url: `/wx/user/login/${code}`,
method: 'post',
// data:userInfo,
headers: {
isToken : false,
"token":token
......@@ -23,6 +34,14 @@ export function getToken(code,token) {
})
}
export function addPhone(customerWxLoginVo) {
return request({
url: `/wx/user/phone`,
method: 'post',
data:customerWxLoginVo
})
}
export function addUserInfo(userInfo) {
return request({
......@@ -30,4 +49,6 @@ export function addUserInfo(userInfo) {
method: 'post',
data:userInfo
})
}
\ No newline at end of file
}
<template>
<view class="login-page">
<view class="user-avatar">
<image :src="avatarUrl"></image>
<button class="avatar-wrapper" open-type="chooseAvatar" @chooseavatar="onChooseAvatar">
</button>
<view class="content">
<view class="info">
<form @submit="formSubmit">
<view class="item">
<text>头像</text>
<!-- open-type="chooseAvatar"是最新加的属性用于获取微信头像 @chooseavatar是获取头像的回调-->
<button open-type="chooseAvatar" @chooseavatar="bindchooseavatar">
<image :src="userInfoForm.userPortrait" mode="aspectFill"></image>
</button>
</view>
<view class="item">
<text>昵称</text>
<!-- type="nickname"是最新加的属性用于获取微信昵称 @nicknamereview是校验昵称是否违规-->
<input :value="userInfoForm.nickname" @nicknamereview="bindnicknamereview" name="nickname"
type="nickname" class="name" placeholder="请输入昵称">
</view>
<view class="" style="margin: 15rpx 0 40rpx 10rpx;color: #888;font-size: 26rpx;">昵称限2~32个字符,一个汉字为2个字符
</view>
<button :disabled="flag" type="primary" class="btn-login" form-type="submit">一键登录</button>
<button :disabled="flag" class="cancel-login" @click="gotoAbove()">返回</button>
<!-- <button class="btn" type="primary" form-type="submit">提交</button> -->
</form>
</view>
<view style="margin: 0 4%;">
<divider></divider>
<view style="display: flex;justify-content: space-between;">
<view style="width: 20%; height: 80rpx;line-height: 2.5;">昵称:</view>
<input type="nickname" class="weui-input" placeholder="请输入昵称" v-model="nickName" @blur="onNickName" />
</view>
<divider></divider>
</view>
<button class="btn-login" @click="uploadFilePromise">一键登录</button>
</view>
</template>
<script>
import {
addUserInfo,
getToken
} from '@/api/login.js'
// 1. 按需导入 mapMutations 辅助函数
import {
mapMutations,
mapState
} from 'vuex'
function compareVersion(v1, v2) {
v1 = v1.split('.')
v2 = v2.split('.')
const len = Math.max(v1.length, v2.length)
while (v1.length < len) {
v1.push('0')
}
while (v2.length < len) {
v2.push('0')
}
for (let i = 0; i < len; i++) {
const num1 = parseInt(v1[i])
const num2 = parseInt(v2[i])
if (num1 > num2) {
return 1
} else if (num1 < num2) {
return -1
}
}
return 0
}
const version = wx.getAppBaseInfo().SDKVersion
export default {
data() {
return {
avatarUrl: '../../static/logo.png',
nickName: ''
url: "",
userInfoForm: {
userPortrait: '../../static/logo.png',
nickname: '',
userName: '',
userSex: ''
}
// userInfo: {
// avatarUrl: '../../static/logo.png',
// nickName: '',
// }
}
},
onLoad(options) {
this.url = options.url
if (compareVersion(version, '2.21.0') >= 0) {
console.log(compareVersion(version, '2.21.0'), "当前2.21.0大于此版本");
} else {
// 如果希望用户在最新版本的客户端上体验您的小程序,可以这样子提示
wx.showModal({
title: '提示',
content: '当前微信版本过低,无法使用该功能,请升级到最新微信版本后重试。',
showCancel: false,
success: res => {
if (res.confirm) {
uni.navigateBack({
data: 1
})
}
}
})
}
if (uni.getStorageSync("userInfo")) {
this.userInfo = uni.getStorageSync("userInfo")
}
},
computed: {
...mapState('m_user', ['token'])
},
methods: {
onChooseAvatar(e) {
console.log("头像", e.detail.avatarUrl);
// this.uploadFilePromise(e.detail.avatarUrl)
this.avatarUrl = e.detail.avatarUrl
// 2. 调用 mapMutations 辅助方法,把 m_user 模块中的 updateUserInfo 映射到当前组件中使用
...mapMutations('m_user', ['updateToken']),
...mapMutations('m_user', ['updateUserInfo']),
//获取昵称回调
bindnicknamereview(e) {
console.log(e);
if (e.detail.pass) {
//处理逻辑
}
},
onNickName(e) {
console.log("昵称", e.detail.value);
// this.uploadFilePromise(e.detail.value)
//获取头像回调
bindchooseavatar(e) {
console.log(e.detail.avatarUrl);
this.userInfoForm.userPortrait = e.detail.avatarUrl
// uni.setStorageSync("userInfo", this.userInfo)
},
// uploadFilePromise(value) {
// uni.uploadFile({
// url: 'https://example.weixin.qq.com/upload',
// filePath: tempFilePaths[0],
// name: 'file',
// success(res) {
// const data = res.data
// //do something
// completeMemberInfo(res.data.avatarUrl) //参数返回依接口而定
// }
// })
// },
//接收 avatarUrl / nickName
// completeMemberInfo(url) {
// //接收 avatarUrl / nickName 调接口完善头像信息
// },
//提交事件
formSubmit(e) {
console.log(e);
this.userInfoForm.nickname = e.detail.value.nickname
console.log(this.userInfoForm);
if (this.userInfoForm.nickname && this.userInfoForm.userPortrait) {
console.log(this.userInfoForm, '用户表单信息');
// uni.setStorageSync("userInfo", this.userInfo)
// this.updateUserInfo(this.userInfo)
// uni.showToast({
// icon: 'success',
// duration: 1500,
// title: '保存成功!'
// })
uni.login({
provider: 'weixin',
success: res => {
console.log("uni.login res", res.code)
let code = res.code
getToken(code, this.userInfoForm, this.token).then(res => {
console.log(res);
this.updateToken(res.data.token)
this.updateUserInfo(res.data.user)
uni.redirectTo({
url: this.url
})
// this.flag = false
})
}
});
} else {
uni.showToast({
icon: 'error',
duration: 1500,
title: '请填写完整!'
})
}
},
gotoAbove() {
uni.reLaunch({
url: '/pages_home/tjty_home_page/tjty_home_page',
})
}
}
}
</script>
<style lang="scss" scoped>
.login-page {
width: 100%;
<style lang="less" scoped>
.content {
background: linear-gradient(226deg, #4a8ef5, #3b7cdd 100%);
height: 100vh;
.user-avatar {
height: 15%;
// margin-left: 4%;
.info {
height: 100%;
.item {
display: flex;
justify-content: space-between;
align-items: center;
padding: 20rpx 20rpx;
border-bottom: 1rpx solid #ebebeb;
height: 70rpx;
.avatar-label {
height: 100rpx;
width: 20%;
font-size: 36rpx;
font-family: Source Han Sans CN, Source Han Sans CN-Medium;
font-weight: 500;
text-align: left;
line-height: 2.5;
}
button {
margin: 0;
background: none;
padding: 0;
height: auto;
line-height: 1;
image {
height: 80rpx;
width: 80rpx;
margin-left: 44%;
margin-top: 10%;
}
image {
width: 70rpx;
height: 70rpx;
border-radius: 50%;
}
}
.avatar-wrapper {
position: fixed;
height: 80rpx;
width: 80rpx;
margin-left: 44%;
margin-top: -12%;
z-index: 1;
opacity: 0;
button::after {
background: none !important;
border: 0;
}
button .button-hover {
background: none !important;
color: none;
}
.name {
width: 170rpx;
flex-flow: row-reverse;
}
}
}
.weui-input{
height: 80rpx;
width: 60%;
margin: 0 4%;
text-align: end;
}
// 登录按钮的样式
.btn-login {
width: 60%;
border-radius: 100px;
margin: 40px 20%;
background-color: #3b7cde;
position: relative;
z-index: 1;
width: 400rpx;
height: 88rpx;
background: #ffffff;
border-radius: 16px;
font-size: 18px;
font-family: Source Han Sans CN, Source Han Sans CN-Medium;
font-weight: 500;
text-align: center;
color: #3b7cde;
line-height: 88rpx;
top: 50%;
}
.cancel-login {
position: relative;
z-index: 1;
width: 400rpx;
height: 88rpx;
border: 1px solid #ffffff;
border-radius: 16px;
font-size: 18px;
font-family: Source Han Sans CN, Source Han Sans CN-Medium;
font-weight: 500;
text-align: center;
color: #ffffff;
line-height: 88rpx;
top: 56%;
background-color: transparent;
}
// .btn {
// position: relative;
// z-index: 1;
// width: 400rpx;
// height: 88rpx;
// background: #ffffff;
// border-radius: 16px;
// font-size: 18px;
// font-family: Source Han Sans CN, Source Han Sans CN-Medium;
// font-weight: 500;
// text-align: center;
// color: #3b7cde;
// line-height: 88rpx;
// top: 50%;
// }
}
</style>
......@@ -4,10 +4,13 @@
<view class="logo-image">
<image src="../../static/login/denglu_logo.png" style="width: 88px;height: 88px;"></image>
</view>
<button :disabled="flag" type="primary" class="btn-login" @click="getWXUserCode()">一键登录</button>
<button :disabled="flag" type="primary" class="btn-login" open-type="getPhoneNumber"
@getphonenumber="getPhoneNumber">一键登录</button>
<!-- <button :disabled="flag" type="primary" class="btn-login" @click="getWXUserCode()">一键登录</button> -->
<button :disabled="flag" class="cancel-login" @click="gotoAbove()">返回</button>
<view class="logo-bottom">
<image src="../../static/login/pic_denglu.png" mode="aspectFit" style="width: 100%;height: 100%;"></image>
<image src="../../static/login/pic_denglu.png" mode="aspectFit" style="width: 100%;height: 100%;">
</image>
</view>
<!-- 提示登录的图标 -->
<!-- <uni-icons type="contact-filled" size="100" color="#AFAFAF"></uni-icons> -->
......@@ -30,7 +33,8 @@
<script>
import {
addUserInfo,
getToken
getToken,
addPhone
} from '@/api/login.js'
// 1. 按需导入 mapMutations 辅助函数
import {
......@@ -46,42 +50,88 @@
// openid: "",
// loginstate: "0",
url: '',
userInfo: {
userInfoForm: {
userPortrait: '',
nickName: '',
userName: '',
userSex: ''
},
customerWxLoginVo: {
wechatId: '',
code: '',
encryptedData: '',
iv: ''
}
}
},
computed: {
...mapState('m_user', ['token'])
...mapState('m_user', ['token']),
...mapState('m_user', ['userInfo'])
},
methods: {
// 2. 调用 mapMutations 辅助方法,把 m_user 模块中的 updateUserInfo 映射到当前组件中使用
...mapMutations('m_user', ['updateToken']),
...mapMutations('m_user', ['updateUserInfo']),
getWXUserCode() {
console.log("点击了按钮");
this.flag = true
console.log(this.token);
console.log("获取登录信息")
uni.login({
provider: 'weixin',
success: res => {
console.log("uni.login res", res.code)
let code = res.code
getToken(code, this.token).then(res => {
// 获取用户手机号
getPhoneNumber(e) {
this.getWXUserCode().then(()=>{
console.log(e);
this.flag = true
// this.customerWxLoginVo.wechartId = this.userInfo.wechartId
this.customerWxLoginVo.code = e.detail.code
this.customerWxLoginVo.iv = e.detail.iv
this.customerWxLoginVo.encryptedData = e.detail.encryptedData
// console.log(e.detail.errMsg) // 判断用户是否允许获取手机号
// console.log(e.detail.iv) // 参数 iv
// console.log(e.detail.encryptedData) // 参数encryptedData
if (e.detail.errMsg == "getPhoneNumber:ok") { // 用户允许或去手机号
//
console.log(this.userInfo);
console.log(this.customerWxLoginVo)
addPhone(this.customerWxLoginVo).then(res => {
console.log(res);
this.updateToken(res.data.token)
this.updateUserInfo(res.data.user)
uni.redirectTo({
url: this.url
})
// this.flag = false
if (res.code == 200) {
uni.redirectTo({
url: this.url
})
this.flag = false
} else {
this.updateToken('')
this.updateUserInfo('')
uni.showToast({
title: '授权失败,请重试!'
})
this.flag = false
}
})
}
});
})
},
getWXUserCode() {
return new Promise((resolve, reject) => {
console.log("点击了按钮");
console.log(this.token);
console.log("获取登录信息")
uni.login({
provider: 'weixin',
success: res => {
console.log("uni.login res", res.code)
let code = res.code
getToken(code, this.token).then(res => {
// console.log(res);
if (res.code == 200) {
this.updateToken(res.data.token)
this.updateUserInfo(res.data.user)
this.customerWxLoginVo.wechatId = res.data.user.wechatId
console.log("haha", this.customerWxLoginVo);
resolve()
}
})
}
});
})
},
gotoAbove() {
uni.reLaunch({
......@@ -103,15 +153,16 @@
success: res => {
console.log("uni.login res", res.code)
let code = res.code
getToken(code, this.token, this.userInfo).then(res => {
getToken(code, this.token).then(res => {
// console.log(this.userInfo);
this.updateToken(res.data.token)
this.updateUserInfo(res.data.user)
this.customerWxLoginVo.wechartId = res.data.user
.wechartId
console.log("返回信息", res);
uni.redirectTo({
url: this.url
})
})
}
})
......@@ -134,7 +185,6 @@
})
}
},
onLoad(options) {
// this.getWXUserCode()
this.url = options.url
......
......@@ -81,20 +81,21 @@
<image style="width: 51px; height: 16px; float: right; margin-right: 11px;"
src="../../static/home-imgs/home_pic_gengduo@2x.png" @click="toExeMore()"></image>
</view>
<view class="home_exercise_item" v-for="(item,index) in exerciseList" :key="index" @click="toAppoint(item)">
<view class="home_exercise_item" v-for="(item,index) in exerciseList" :key="index"
@click="toAppoint(item)">
<view class="ima">
<image style="width: 116px;height:116px;border-radius:16px "
:src="'https://www.aiwanyundong.com/stage-api' + item.image"></image>
</view>
<view style="width: 66%; margin-left: 10rpx;">
<view class="a-card">
{{item.mechanismName}}
</view>
<view class="c-card">
适用人群:&nbsp;&nbsp;{{item.propertyPeople}}
</view>
<view class="a-card">
{{item.mechanismName}}
</view>
<view class="c-card">
适用人群:&nbsp;&nbsp;{{item.propertyPeople}}
</view>
<!-- <view>
<button class="b-card" @click="toAppoint(item)">
详情
......@@ -202,7 +203,7 @@
success: res => {
console.log("uni.login res", res.code)
let code = res.code
getToken(code, this.token).then(res => {
getToken(code, this.userInfo, this.token).then(res => {
// console.log(res);
this.updateToken(res.data.token)
this.updateUserInfo(res.data.user)
......@@ -237,6 +238,7 @@
if (!this.token) {
uni.reLaunch({
url: '/pages/login/login?url=' + this.url
// url: '/pages/home/home?url=' + this.url
})
} else {
uni.navigateTo({
......@@ -259,6 +261,7 @@
console.log("没有token")
uni.reLaunch({
url: '/pages/login/login?url=' + this.url
// url: '/pages/home/home?url=' + this.url
})
} else {
if (item.type == '1') {
......
......@@ -157,6 +157,7 @@
console.log("没有token")
uni.reLaunch({
url: '/pages/login/login?url=' + this.url
// url: '/pages/home/home?url=' + this.url
})
} else {
this.getWXUserCode()
......@@ -193,7 +194,7 @@
// console.log("uni.login res", res)
let code = res.code
// getToken(code,this.token,this.userInfo).then(res => {
getToken(code, this.token).then(res => {
getToken(code, this.userInfo ,this.token).then(res => {
if (res.code === 200) {
this.updateToken(res.data.token)
this.updateUserInfo(res.data.user)
......
......@@ -74,7 +74,7 @@ import { userInfo } from 'os';
...mapState('m_user', ['userInfo']),
},
onLoad() {
this.wechatId=userInfo.wechatId
this.wechatId=this.userInfo.wechatId
this.getList(this.wechatId)
},
methods:{
......
......@@ -74,6 +74,7 @@
console.log("token", this.token);
uni.reLaunch({
url: '/pages/login/login?url=' + this.url
// url: '/pages/home/home?url=' + this.url
})
} else {
this.getWXUserCode()
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment