| | |
| | | <u-navbar :custom-back="back" title="小程序登录"></u-navbar> |
| | | <u-modal v-model="phoneAuthPopup" :mask-close-able="true" :title="projectName+'商城'" |
| | | :show-confirm-button="false"> |
| | | |
| | | <div class="tips"> |
| | | 为了更好地用户体验,需要您授权手机号 |
| | | 为了更好地用户体验,需要您授权手机号和昵称 |
| | | </div> |
| | | <button class="register" type="primary" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber"> |
| | | 去授权 |
| | | <view class="auth-row"> |
| | | <text class="label">昵称:</text> |
| | | <input |
| | | class="register" |
| | | type="nickname" |
| | | v-model="nickName" |
| | | placeholder="请输入昵称" |
| | | > |
| | | </input> |
| | | </view> |
| | | <button :class="isDisabled ? 'noRegister' : 'register'" type="primary" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber" :disabled="isDisabled"> |
| | | 下一步 |
| | | </button> |
| | | |
| | | </u-modal> |
| | | |
| | | <view class="wx-auth-container"> |
| | | <div class="box"> |
| | | <view class="logo-info"> |
| | | <text class="title">欢迎进入{{ projectName }}</text> |
| | | </view> |
| | | <view> |
| | | <text class="small-title">你好,此服务仅绿满筐会员使用</text> |
| | | </view> |
| | | <view class="small-tips"> |
| | | <view>为您提供优质服务,{{ projectName }}需要获取以下信息</view> |
| | |
| | | </u-checkbox> |
| | | </div> |
| | | </div> |
| | | |
| | | </view> |
| | | </view> |
| | | </template> |
| | | |
| | | <script> |
| | | import '@/components/uview-components/uview-ui'; |
| | | import { |
| | | mpAutoLogin |
| | | } from "@/api/connect.js"; |
| | |
| | | whetherNavigate |
| | | } from "@/utils/Foundation"; //登录跳转 |
| | | import { |
| | | getUserInfo |
| | | getUserInfo,updateMemberNickName |
| | | } from "@/api/members"; |
| | | import storage from "@/utils/storage.js"; |
| | | import config from '@/config/config' |
| | | export default { |
| | | data() { |
| | | return { |
| | | isDisabled:true, |
| | | lightColor:this.$lightColor, |
| | | checked:false, |
| | | configs:config, |
| | |
| | | }); |
| | | |
| | | }, |
| | | watch:{ |
| | | nickName(newVal){ |
| | | if(this.nickName.trim().length === 0){ |
| | | this.isDisabled = true; |
| | | }else{ |
| | | this.isDisabled = false |
| | | } |
| | | } |
| | | }, |
| | | methods: { |
| | | /** |
| | | * TODO 此方法不一定是最优解,如果有更好的办法请在 https://gitee.com/beijing_hongye_huicheng/lilishop/issues 中提出 |
| | |
| | | url: `/pages/tabbar/home/index`, |
| | | }); |
| | | }, |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | //获取用户信息 |
| | | getUserProfile(e) { |
| | | if(!this.checked){ |
| | |
| | | uni.getUserProfile({ |
| | | desc: "用于完善会员资料", // 声明获取用户个人信息后的用途,后续会展示在弹窗中,请谨慎填写 |
| | | success: (res) => { |
| | | console.log("success", res) |
| | | this.nickName = res.userInfo.nickName; |
| | | this.image = res.userInfo.avatarUrl; |
| | | |
| | | // console.log("success", res) |
| | | //重置按钮显示 |
| | | |
| | | |
| | | // this.$refs.nicknameInput.focus(); |
| | | // this.nickName = res.userInfo.nickName; |
| | | // this.image = res.userInfo.avatarUrl; |
| | | // 打印微信名称 |
| | | // console.log("微信昵称:", this.nickName); |
| | | /** |
| | | * 根据公有的配置设置登录方式 |
| | | */ |
| | |
| | | image, |
| | | nickName, |
| | | }).then((apiRes) => { |
| | | console.log(apiRes) |
| | | storage.setAccessToken(apiRes.data.result.accessToken); |
| | | storage.setRefreshToken(apiRes.data.result.refreshToken); |
| | | // 登录成功 |
| | |
| | | title: "登录成功!", |
| | | icon: "none", |
| | | }); |
| | | |
| | | //获取用户信息 |
| | | getUserInfo().then((user) => { |
| | | storage.setUserInfo(user.data.result); |
| | |
| | | this.logingFlag = false; |
| | | } |
| | | }, |
| | | |
| | | //获取手机号授权 |
| | | getPhoneNumber(e) { |
| | | getPhoneNumber(e) { |
| | | |
| | | let iv = e.detail.iv; |
| | | let encryptedData = e.detail.encryptedData; |
| | | |
| | | if (!e.detail.encryptedData) { |
| | | uni.showToast({ |
| | | title: "请授予手机号码权限,手机号码会和会员系统用户绑定!", |
| | |
| | | }); |
| | | return; |
| | | } |
| | | |
| | | |
| | | let code = this.code; |
| | | let image = this.image; |
| | | let nickName = this.nickName; |
| | | |
| | | console.log('getPhoneNumber:' + code) |
| | | |
| | | console.log('getPhoneNumber:' + image) |
| | | |
| | | console.log('getPhoneNumber:' + nickName) |
| | | |
| | | |
| | | mpAutoLogin({ |
| | | encryptedData, |
| | | iv, |
| | |
| | | image, |
| | | nickName, |
| | | }).then((res) => { |
| | | //登录成功修改用户的昵称 |
| | | storage.setAccessToken(res.data.result.accessToken); |
| | | storage.setRefreshToken(res.data.result.refreshToken); |
| | | // 登录成功 |
| | |
| | | icon: "none", |
| | | }); |
| | | //获取用户信息 |
| | | getUserInfo().then((user) => { |
| | | storage.setUserInfo(user.data.result); |
| | | storage.setHasLogin(true); |
| | | |
| | | getUserInfo().then(async (user) => { |
| | | console.log(user) |
| | | const form ={ |
| | | memberId:user.data.result.id, |
| | | nickName:this.nickName |
| | | } |
| | | let name = ''; |
| | | await updateMemberNickName(form).then(res =>{ |
| | | if(res.statusCode === 200){ |
| | | name = res.data.data; |
| | | } |
| | | }) |
| | | user.data.result.nickName = name |
| | | storage.setUserInfo(user.data.result); |
| | | storage.setHasLogin(true); |
| | | |
| | | |
| | | uni.navigateBack({ |
| | | delta: 1, |
| | | }); |
| | | }); |
| | | |
| | | |
| | | }); |
| | | }, |
| | | |
| | |
| | | }; |
| | | </script> |
| | | <style lang="scss" scoped> |
| | | .auth-row { |
| | | text-align: left; |
| | | margin: 6% 10%; |
| | | display: flex; |
| | | align-items: center; |
| | | margin-bottom: 30rpx; |
| | | } |
| | | |
| | | .label { |
| | | width: 150rpx; |
| | | font-size: 32rpx; |
| | | color: #333; |
| | | } |
| | | /*微信授权*/ |
| | | page { |
| | | background-color: #ffffff; |
| | |
| | | .box { |
| | | margin: 0 32rpx; |
| | | } |
| | | |
| | | .small-title { |
| | | width: 94%; |
| | | padding: 20rpx; |
| | | font-size: 34rpx; |
| | | margin: 0 0 20rpx; |
| | | } |
| | | /* 文字提示*/ |
| | | .small-tips { |
| | | width: 94%; |
| | |
| | | margin-top: 48rpx; |
| | | line-height: 1.75; |
| | | } |
| | | |
| | | .noRegister{ |
| | | color: #b8b8b8 !important; |
| | | border: none !important; |
| | | background: #fff !important; |
| | | } |
| | | .register { |
| | | color: $weChat-color !important; |
| | | border: none !important; |