Init project
This commit is contained in:
lifizer
@@ -0,0 +1,408 @@
|
||||
<template>
|
||||
<view class="pages-auth">
|
||||
<view class="tip-1">为了提供更优质的服务，需要获取</view>
|
||||
<view class="tip-2">您的头像、昵称</view>
|
||||
|
||||
<view class="wechat flex jc-between ai-center">
|
||||
<view class="flex ai-end">
|
||||
<image class="avatar" :src="avatarUrl"></image>
|
||||
<view>
|
||||
<view class="name">微信用户</view>
|
||||
<view class="info">微信个人信息</view>
|
||||
</view>
|
||||
</view>
|
||||
<image class="select" :src="webUrl+'/20220613104953149068.png'" mode="scaleToFill"/>
|
||||
</view>
|
||||
|
||||
<view class="agree-box">
|
||||
<checkbox-group @change="changeAgree">
|
||||
<label>
|
||||
<checkbox value="yes" style="transform:scale(0.8)"/>
|
||||
</label>
|
||||
<text @click="show=true">我已阅读并同意
|
||||
<text class="btn-show">《用户服务协议及隐私政策》</text>
|
||||
</text>
|
||||
</checkbox-group>
|
||||
</view>
|
||||
|
||||
<view class="dialog-mask" v-if="show">
|
||||
<view class="dialog-body">
|
||||
<image class="btn-close" :src="webUrl+'/20221230200935413332.png'" @click="show=false"/>
|
||||
<view class="content">
|
||||
<view class="title tc bold">《用户协议及隐私政策》</view>
|
||||
<view class="popup-content" v-html="agreeInfo.privacyPolicy"></view>
|
||||
<view class="title tc">
|
||||
<button size="mini" @click="show=false">关闭</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="dialog-mask" v-if="showFillOut">
|
||||
<view class="dialog-fill flex flex-col ai-center">
|
||||
<view class="title bold">请完善您的头像和昵称</view>
|
||||
<button class="avatar-wrapper" open-type="chooseAvatar" @chooseavatar="onChooseAvatar">
|
||||
<image class="avatar" :src="avatarUrl"></image>
|
||||
</button>
|
||||
<input type="nickname" class="input-wrapper" placeholder="请输入昵称" @input="inputName" @confirm="inputName"
|
||||
@blur="inputName"/>
|
||||
<view class="btn-submit" @click="onSubmit">确认</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="btn-box">
|
||||
<button class="btn-yes" type="default" v-if="canIUseGetUserProfile" @tap="getUserInfoProfile">同意</button>
|
||||
<button class="btn-no" type="default" @tap="back">拒绝</button>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {mapActions, mapMutations, mapState} from 'vuex'
|
||||
import cookie from '@/utils/store/cookie'
|
||||
import {login, uploadImage} from '@/utils'
|
||||
import {getAgree} from "@/api/public";
|
||||
import {postUserEdit} from "@/api/user";
|
||||
|
||||
const defaultAvatarUrl = "/20230506100714762257.png"
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
webUrl: this.$VUE_APP_RESOURCES_URL,
|
||||
authorize: false,
|
||||
canIUseGetUserProfile: false,
|
||||
agreeInfo: {},
|
||||
isAgree: false,
|
||||
show: false,
|
||||
|
||||
showFillOut: false,
|
||||
nickname: "",
|
||||
avatarUrl: this.$VUE_APP_RESOURCES_URL + defaultAvatarUrl,
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapState(['isAuthorization', '$deviceType', 'token']),
|
||||
},
|
||||
onLoad() {
|
||||
if (wx.getUserProfile) {
|
||||
this.canIUseGetUserProfile = true
|
||||
}
|
||||
// 先校验用户是否授权，如果没有授权，显示授权按钮
|
||||
getAgree().then(({data}) => this.agreeInfo = data);
|
||||
},
|
||||
onHide() {
|
||||
this.updateAuthorizationPage(false)
|
||||
this.changeAuthorization(false)
|
||||
},
|
||||
onUnload() {
|
||||
this.updateAuthorizationPage(false)
|
||||
this.changeAuthorization(false)
|
||||
},
|
||||
methods: {
|
||||
...mapActions(['changeAuthorization', 'setUserInfo']),
|
||||
...mapMutations(['updateAuthorizationPage']),
|
||||
changeAgree(event) {
|
||||
this.isAgree = event.detail.value.length > 0
|
||||
},
|
||||
toLogin() {
|
||||
this.$yrouter.push({
|
||||
path: '/pages/user/Login/index',
|
||||
query: {},
|
||||
})
|
||||
},
|
||||
back() {
|
||||
this.$yrouter.switchTab({
|
||||
path: '/pages/home/index',
|
||||
query: {},
|
||||
})
|
||||
},
|
||||
doneRedirect() {
|
||||
let redirectUrl = cookie.get('redirect') || "";
|
||||
redirectUrl = redirectUrl.replace(/\ /g, '');
|
||||
//如果已经是授权页，跳转主页
|
||||
if (redirectUrl == '/pages/authorization/index' || redirectUrl.length === 0) {
|
||||
redirectUrl = '/pages/home/index';
|
||||
}
|
||||
this.$yrouter.reLaunch({
|
||||
path: redirectUrl,
|
||||
})
|
||||
},
|
||||
getUserInfoProfile() {
|
||||
if (!this.isAgree) {
|
||||
uni.showToast({
|
||||
title: "请先阅读并同意《用户服务协议及隐私政策》",
|
||||
icon: "none",
|
||||
duration: 5000
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
wx.getUserProfile({
|
||||
lang: 'zh_CN',
|
||||
desc: '需要获取您的信息用来展示',
|
||||
success: res => {
|
||||
uni.showLoading({
|
||||
title: '登录中',
|
||||
})
|
||||
login(res).then(e => {
|
||||
let db_nickname = e.data.nickname;
|
||||
|
||||
if (db_nickname === null || db_nickname === undefined || db_nickname === "" || db_nickname === "微信用户") {
|
||||
this.showFillOut = true;
|
||||
} else {
|
||||
this.doneRedirect();
|
||||
}
|
||||
}).catch(error => {
|
||||
uni.showToast({
|
||||
title: error,
|
||||
icon: 'none',
|
||||
duration: 2000,
|
||||
})
|
||||
})
|
||||
},
|
||||
})
|
||||
},
|
||||
|
||||
onChooseAvatar(e) {
|
||||
const {avatarUrl} = e.detail;
|
||||
this.avatarUrl = avatarUrl;
|
||||
},
|
||||
inputName(e) {
|
||||
this.nickname = e.detail.value;
|
||||
},
|
||||
onSubmit() {
|
||||
let that = this;
|
||||
|
||||
this.nickname = this.nickname.trim();
|
||||
if (this.nickname.length === 0) {
|
||||
uni.showToast({
|
||||
title: "请输入您的昵称",
|
||||
icon: "none",
|
||||
duration: 5000
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
// 临时地址图片上传
|
||||
if (that.avatarUrl.indexOf("/tmp/") > -1 || that.avatarUrl.indexOf("wxfile") > -1) {
|
||||
uploadImage(this.avatarUrl, img => {
|
||||
that.avatarUrl = img;
|
||||
})
|
||||
|
||||
let timer = setInterval(() => {
|
||||
if (that.avatarUrl.indexOf("/tmp/") === -1 && that.avatarUrl.indexOf("wxfile") === -1) {
|
||||
clearInterval(timer);
|
||||
that.saveUserInfo();
|
||||
}
|
||||
}, 100)
|
||||
} else {
|
||||
that.saveUserInfo();
|
||||
}
|
||||
},
|
||||
|
||||
saveUserInfo() {
|
||||
let param = {
|
||||
nickname: this.nickname,
|
||||
avatar: this.avatarUrl
|
||||
}
|
||||
postUserEdit(param).then(res => {
|
||||
this.doneRedirect()
|
||||
}).catch(error => {
|
||||
uni.showToast({
|
||||
title: error,
|
||||
icon: "none",
|
||||
duration: 5000
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.pages-auth {
|
||||
padding: 148rpx 48rpx;
|
||||
|
||||
.tip-1 {
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.tip-2 {
|
||||
margin-top: 20rpx;
|
||||
font-size: 40rpx;
|
||||
line-height: 58rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.wechat {
|
||||
margin-top: 80rpx;
|
||||
|
||||
.avatar {
|
||||
width: 112rpx;
|
||||
height: 112rpx;
|
||||
margin-right: 24rpx;
|
||||
border-radius: 8rpx;
|
||||
}
|
||||
|
||||
.name {
|
||||
font-size: 32rpx;
|
||||
line-height: 48rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.info {
|
||||
margin-top: 28rpx;
|
||||
font-size: 24rpx;
|
||||
line-height: 34rpx;
|
||||
color: #CECECE;
|
||||
}
|
||||
|
||||
.select {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.agree-box {
|
||||
margin: 200rpx 0 60rpx;
|
||||
font-size: 28rpx;
|
||||
color: #666;
|
||||
|
||||
.btn-show {
|
||||
color: #000;
|
||||
}
|
||||
}
|
||||
|
||||
.dialog-mask {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
background: rgba(0, 0, 0, .4);
|
||||
z-index: 99;
|
||||
|
||||
.dialog-body {
|
||||
position: fixed;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: 630rpx;
|
||||
height: 70vh;
|
||||
box-sizing: border-box;
|
||||
padding: 60rpx;
|
||||
border-radius: 10rpx;
|
||||
background: #fff;
|
||||
overflow: hidden;
|
||||
|
||||
.btn-close {
|
||||
position: absolute;
|
||||
top: 20rpx;
|
||||
right: 20rpx;
|
||||
width: 28rpx;
|
||||
height: 28rpx;
|
||||
}
|
||||
|
||||
.content {
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.title {
|
||||
margin: 30rpx auto;
|
||||
}
|
||||
}
|
||||
|
||||
.dialog-fill {
|
||||
position: fixed;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
box-sizing: border-box;
|
||||
overflow: hidden;
|
||||
width: 516rpx;
|
||||
height: 576rpx;
|
||||
border-radius: 24rpx;
|
||||
background: #fff;
|
||||
|
||||
.title {
|
||||
margin-top: 60rpx;
|
||||
color: #333;
|
||||
font-size: 36rpx;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.avatar-wrapper {
|
||||
width: 180rpx;
|
||||
height: 180rpx;
|
||||
margin-top: 38rpx;
|
||||
padding: 0;
|
||||
background: none;
|
||||
|
||||
.avatar {
|
||||
width: 180rpx;
|
||||
height: 180rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
|
||||
.avatar-wrapper::after {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.input-wrapper {
|
||||
width: 360rpx;
|
||||
height: 72rpx;
|
||||
margin-top: 32rpx;
|
||||
background: rgba(248, 249, 251, 1);
|
||||
color: #999;
|
||||
font-size: 32rpx;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.btn-submit {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100rpx;
|
||||
box-sizing: border-box;
|
||||
border-top: 2rpx solid #E0E0E0;
|
||||
color: #3A87FC;
|
||||
font-size: 32rpx;
|
||||
line-height: 100rpx;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.btn-box {
|
||||
width: 338rpx;
|
||||
margin: 0 auto;
|
||||
|
||||
button::after {
|
||||
border: none;
|
||||
}
|
||||
|
||||
button {
|
||||
height: 72rpx;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
|
||||
.btn-yes {
|
||||
background: #FF564A;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.btn-no {
|
||||
margin-top: 32rpx;
|
||||
background: #eee;
|
||||
color: #FF564A;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,310 @@
|
||||
<template>
|
||||
<view class="pages-auth">
|
||||
<view class="tip-1">为了提供更优质的服务，需要获取</view>
|
||||
<view class="tip-2">您的头像、昵称</view>
|
||||
|
||||
<view class="wechat flex jc-between ai-center">
|
||||
<view class="flex ai-end">
|
||||
<open-data class="avatar" type="userAvatarUrl"></open-data>
|
||||
<view>
|
||||
<open-data class="name" type="userNickName"></open-data>
|
||||
<view class="info">微信个人信息</view>
|
||||
</view>
|
||||
</view>
|
||||
<image class="select" :src="webUrl+'/20220613104953149068.png'" mode="scaleToFill"/>
|
||||
</view>
|
||||
|
||||
<view class="agree-box">
|
||||
<checkbox-group @change="changeAgree">
|
||||
<label>
|
||||
<checkbox value="yes" style="transform:scale(0.8)"/>
|
||||
</label>
|
||||
<text @click="show=true">我已阅读并同意
|
||||
<text class="btn-show">《用户服务协议及隐私政策》</text>
|
||||
</text>
|
||||
</checkbox-group>
|
||||
</view>
|
||||
|
||||
<view class="dialog-mask" v-if="show">
|
||||
<view class="dialog-body">
|
||||
<image class="btn-close" :src="webUrl+'/20221230200935413332.png'" @click="show=false"/>
|
||||
<view class="content">
|
||||
<view class="title tc bold">《用户协议及隐私政策》</view>
|
||||
<view class="popup-content" v-html="agreeInfo.privacyPolicy"></view>
|
||||
<view class="title tc">
|
||||
<button size="mini" @click="show=false">关闭</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="btn-box">
|
||||
<button class="btn-yes" type="default" v-if="canIUseGetUserProfile" @tap="getUserInfoProfile">同意</button>
|
||||
<button class="btn-yes" type="default" v-else @getuserinfo="getUserInfo" open-type="getUserInfo">同意</button>
|
||||
<button class="btn-no" type="default" @tap="back">拒绝</button>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {mapActions, mapMutations, mapState} from 'vuex'
|
||||
import cookie from '@/utils/store/cookie'
|
||||
import {login} from '@/utils'
|
||||
import {getAgree} from "@/api/public";
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
webUrl: this.$VUE_APP_RESOURCES_URL,
|
||||
authorize: false,
|
||||
canIUseGetUserProfile: false,
|
||||
agreeInfo: {},
|
||||
isAgree: false,
|
||||
show: false
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapState(['isAuthorization', '$deviceType', 'token']),
|
||||
},
|
||||
onLoad() {
|
||||
if (wx.getUserProfile) {
|
||||
this.canIUseGetUserProfile = true
|
||||
}
|
||||
// // 先校验用户是否授权，如果没有授权，显示授权按钮
|
||||
getAgree().then(({data}) => this.agreeInfo = data);
|
||||
},
|
||||
onHide() {
|
||||
this.updateAuthorizationPage(false)
|
||||
this.changeAuthorization(false)
|
||||
},
|
||||
onUnload() {
|
||||
this.updateAuthorizationPage(false)
|
||||
this.changeAuthorization(false)
|
||||
},
|
||||
methods: {
|
||||
...mapActions(['changeAuthorization', 'setUserInfo']),
|
||||
...mapMutations(['updateAuthorizationPage']),
|
||||
changeAgree(event) {
|
||||
this.isAgree = event.detail.value.length > 0
|
||||
},
|
||||
toLogin() {
|
||||
this.$yrouter.push({
|
||||
path: '/pages/user/Login/index',
|
||||
query: {},
|
||||
})
|
||||
},
|
||||
back() {
|
||||
this.$yrouter.switchTab({
|
||||
path: '/pages/home/index',
|
||||
query: {},
|
||||
})
|
||||
},
|
||||
getUserInfo(data) {
|
||||
console.log("auth",data)
|
||||
if (!this.isAgree) {
|
||||
uni.showToast({
|
||||
title: "请先阅读并同意《用户服务协议及隐私政策》",
|
||||
icon: "none",
|
||||
duration: 5000
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
if (data.detail.errMsg == 'getUserInfo:fail auth deny') {
|
||||
uni.showToast({
|
||||
title: '取消授权',
|
||||
icon: 'none',
|
||||
duration: 2000,
|
||||
})
|
||||
return
|
||||
}
|
||||
uni.showLoading({
|
||||
title: '登录中',
|
||||
})
|
||||
login()
|
||||
.then(e => {
|
||||
uni.hideLoading()
|
||||
this.$yrouter.reLaunch({
|
||||
path: cookie.get('redirect').replace(/\ /g, ''),
|
||||
})
|
||||
})
|
||||
.catch(error => {
|
||||
uni.hideLoading()
|
||||
uni.showToast({
|
||||
title: error,
|
||||
icon: 'none',
|
||||
duration: 2000,
|
||||
})
|
||||
})
|
||||
},
|
||||
getUserInfoProfile(data) {
|
||||
if (!this.isAgree) {
|
||||
uni.showToast({
|
||||
title: "请先阅读并同意《用户服务协议及隐私政策》",
|
||||
icon: "none",
|
||||
duration: 5000
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
wx.getUserProfile({
|
||||
lang: 'zh_CN',
|
||||
desc: '需要获取您的信息用来展示',
|
||||
success: res => {
|
||||
uni.showLoading({
|
||||
title: '登录中',
|
||||
})
|
||||
login(res)
|
||||
.then(e => {
|
||||
var redirectUrl = cookie.get('redirect').replace(/\ /g, '');
|
||||
//如果已经是授权页，跳转主页
|
||||
if (redirectUrl == '/pages/authorization/index') {
|
||||
redirectUrl = '/pages/home/index';
|
||||
}
|
||||
|
||||
this.$yrouter.reLaunch({
|
||||
path: redirectUrl,
|
||||
})
|
||||
})
|
||||
.catch(error => {
|
||||
uni.showToast({
|
||||
title: error,
|
||||
icon: 'none',
|
||||
duration: 2000,
|
||||
})
|
||||
})
|
||||
},
|
||||
})
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
if (wx.getUserProfile) {
|
||||
this.canIUseGetUserProfile = true
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.pages-auth {
|
||||
padding: 148rpx 48rpx;
|
||||
|
||||
.tip-1 {
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.tip-2 {
|
||||
margin-top: 20rpx;
|
||||
font-size: 40rpx;
|
||||
line-height: 58rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.wechat {
|
||||
margin-top: 80rpx;
|
||||
|
||||
.avatar {
|
||||
width: 112rpx;
|
||||
height: 112rpx;
|
||||
margin-right: 24rpx;
|
||||
border-radius: 8rpx;
|
||||
}
|
||||
|
||||
.name {
|
||||
font-size: 32rpx;
|
||||
line-height: 48rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.info {
|
||||
margin-top: 28rpx;
|
||||
font-size: 24rpx;
|
||||
line-height: 34rpx;
|
||||
color: #CECECE;
|
||||
}
|
||||
|
||||
.select {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.agree-box {
|
||||
margin: 200rpx 0 60rpx;
|
||||
font-size: 28rpx;
|
||||
color: #666;
|
||||
|
||||
.btn-show {
|
||||
color: #000;
|
||||
}
|
||||
}
|
||||
|
||||
.dialog-mask {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
background: rgba(0, 0, 0, .4);
|
||||
z-index: 99;
|
||||
|
||||
.dialog-body {
|
||||
position: fixed;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: 630rpx;
|
||||
height: 70vh;
|
||||
box-sizing: border-box;
|
||||
padding: 60rpx;
|
||||
border-radius: 10rpx;
|
||||
background: #fff;
|
||||
overflow: hidden;
|
||||
|
||||
.btn-close{
|
||||
position: absolute;
|
||||
top: 20rpx;
|
||||
right: 20rpx;
|
||||
width: 28rpx;
|
||||
height: 28rpx;
|
||||
}
|
||||
|
||||
.content {
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.title {
|
||||
margin: 30rpx auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.btn-box {
|
||||
width: 338rpx;
|
||||
margin: 0 auto;
|
||||
|
||||
button::after {
|
||||
border: none;
|
||||
}
|
||||
|
||||
button {
|
||||
height: 72rpx;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
|
||||
.btn-yes {
|
||||
background: #FF564A;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.btn-no {
|
||||
margin-top: 32rpx;
|
||||
background: #eee;
|
||||
color: #FF564A;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,346 @@
|
||||
<template>
|
||||
<view class="pages-auth">
|
||||
<view class="tip-1">为了提供更优质的服务</view>
|
||||
<view class="tip-2">请完善您的头像和昵称</view>
|
||||
|
||||
<view class="flex flex-col ai-center">
|
||||
<button class="avatar-wrapper" open-type="chooseAvatar" @chooseavatar="onChooseAvatar">
|
||||
<image class="avatar" :src="avatarUrl"></image>
|
||||
</button>
|
||||
<input type="nickname" class="input-wrapper" placeholder="请输入昵称" @input="inputName" @confirm="inputName"
|
||||
@blur="inputName"/>
|
||||
</view>
|
||||
|
||||
<view class="agree-box">
|
||||
<checkbox-group @change="changeAgree">
|
||||
<label>
|
||||
<checkbox value="yes" style="transform:scale(0.8)"/>
|
||||
</label>
|
||||
<text @click="show=true">我已阅读并同意
|
||||
<text class="btn-show">《用户服务协议及隐私政策》</text>
|
||||
</text>
|
||||
</checkbox-group>
|
||||
</view>
|
||||
|
||||
<view class="dialog-mask" v-if="show">
|
||||
<view class="dialog-body">
|
||||
<image class="btn-close" :src="webUrl+'/20221230200935413332.png'" @click="show=false"/>
|
||||
<view class="content">
|
||||
<view class="title tc bold">《用户协议及隐私政策》</view>
|
||||
<view class="popup-content" v-html="agreeInfo.privacyPolicy"></view>
|
||||
<view class="title tc">
|
||||
<button size="mini" @click="show=false">关闭</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="btn-box">
|
||||
<button class="btn-yes" type="default" v-if="canIUseGetUserProfile" @tap="getUserInfoProfile">同意</button>
|
||||
<!-- <button class="btn-yes" type="default" v-else @getuserinfo="getUserInfo" open-type="getUserInfo">同意</button>-->
|
||||
<button class="btn-no" type="default" @tap="back">拒绝</button>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {mapActions, mapMutations, mapState} from 'vuex'
|
||||
import cookie from '@/utils/store/cookie'
|
||||
import {login} from '@/utils'
|
||||
import {getAgree} from "@/api/public";
|
||||
import {postUserEdit} from "@/api/user";
|
||||
|
||||
const defaultAvatarUrl = "/20230506100714762257.png"
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
webUrl: this.$VUE_APP_RESOURCES_URL,
|
||||
authorize: false,
|
||||
canIUseGetUserProfile: false,
|
||||
agreeInfo: {},
|
||||
isAgree: false,
|
||||
show: false,
|
||||
|
||||
nickname: "",
|
||||
avatarUrl: this.$VUE_APP_RESOURCES_URL + defaultAvatarUrl,
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapState(['isAuthorization', '$deviceType', 'token']),
|
||||
},
|
||||
onLoad() {
|
||||
if (wx.getUserProfile) {
|
||||
this.canIUseGetUserProfile = true
|
||||
}
|
||||
// 先校验用户是否授权，如果没有授权，显示授权按钮
|
||||
getAgree().then(({data}) => this.agreeInfo = data);
|
||||
},
|
||||
onHide() {
|
||||
this.updateAuthorizationPage(false)
|
||||
this.changeAuthorization(false)
|
||||
},
|
||||
onUnload() {
|
||||
this.updateAuthorizationPage(false)
|
||||
this.changeAuthorization(false)
|
||||
},
|
||||
methods: {
|
||||
...mapActions(['changeAuthorization', 'setUserInfo']),
|
||||
...mapMutations(['updateAuthorizationPage']),
|
||||
onChooseAvatar(e) {
|
||||
const {avatarUrl} = e.detail;
|
||||
this.avatarUrl = avatarUrl;
|
||||
},
|
||||
inputName(event) {
|
||||
this.nickname = event.detail.value;
|
||||
},
|
||||
changeAgree(event) {
|
||||
this.isAgree = event.detail.value.length > 0
|
||||
},
|
||||
toLogin() {
|
||||
this.$yrouter.push({
|
||||
path: '/pages/user/Login/index',
|
||||
query: {},
|
||||
})
|
||||
},
|
||||
back() {
|
||||
this.$yrouter.switchTab({
|
||||
path: '/pages/home/index',
|
||||
query: {},
|
||||
})
|
||||
},
|
||||
// getUserInfo(data) {
|
||||
// let that = this;
|
||||
// if (!this.isAgree) {
|
||||
// uni.showToast({
|
||||
// title: "请先阅读并同意《用户服务协议及隐私政策》",
|
||||
// icon: "none",
|
||||
// duration: 5000
|
||||
// })
|
||||
// return
|
||||
// }
|
||||
//
|
||||
// this.nickname = this.nickname.trim();
|
||||
// if (this.nickname.length === 0) {
|
||||
// uni.showToast({
|
||||
// title: "请输入您的昵称",
|
||||
// icon: "none",
|
||||
// duration: 5000
|
||||
// })
|
||||
// return
|
||||
// }
|
||||
//
|
||||
// if (data.detail.errMsg == 'getUserInfo:fail auth deny') {
|
||||
// uni.showToast({
|
||||
// title: '取消授权',
|
||||
// icon: 'none',
|
||||
// duration: 2000,
|
||||
// })
|
||||
// return
|
||||
// }
|
||||
// uni.showLoading({
|
||||
// title: '登录中',
|
||||
// })
|
||||
// login()
|
||||
// .then(e => {
|
||||
// uni.hideLoading()
|
||||
// this.$yrouter.reLaunch({
|
||||
// path: cookie.get('redirect').replace(/\ /g, ''),
|
||||
// })
|
||||
// })
|
||||
// .catch(error => {
|
||||
// uni.hideLoading()
|
||||
// uni.showToast({
|
||||
// title: error,
|
||||
// icon: 'none',
|
||||
// duration: 2000,
|
||||
// })
|
||||
// })
|
||||
// },
|
||||
getUserInfoProfile(data) {
|
||||
let that = this;
|
||||
if (!this.isAgree) {
|
||||
uni.showToast({
|
||||
title: "请先阅读并同意《用户服务协议及隐私政策》",
|
||||
icon: "none",
|
||||
duration: 5000
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
this.nickname = this.nickname.trim();
|
||||
if (this.nickname.length === 0) {
|
||||
uni.showToast({
|
||||
title: "请输入您的昵称",
|
||||
icon: "none",
|
||||
duration: 5000
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
wx.getUserProfile({
|
||||
lang: 'zh_CN',
|
||||
desc: '需要获取您的信息用来展示',
|
||||
success: res => {
|
||||
uni.showLoading({
|
||||
title: '登录中',
|
||||
})
|
||||
login(res)
|
||||
.then(e => {
|
||||
uni.hideLoading()
|
||||
postUserEdit({
|
||||
nickname: that.nickname,
|
||||
avatar: that.avatarUrl
|
||||
}).then(result => {
|
||||
let redirectUrl = cookie.get('redirect') || "";
|
||||
redirectUrl = redirectUrl.replace(/\ /g, '');
|
||||
//如果已经是授权页，跳转主页
|
||||
if (redirectUrl == '/pages/authorization/index' || redirectUrl.length === 0) {
|
||||
redirectUrl = '/pages/home/index';
|
||||
}
|
||||
|
||||
that.$yrouter.reLaunch({
|
||||
path: redirectUrl,
|
||||
})
|
||||
}).catch(err => console.error(err))
|
||||
})
|
||||
.catch(error => {
|
||||
uni.showToast({
|
||||
title: error,
|
||||
icon: 'none',
|
||||
duration: 2000,
|
||||
})
|
||||
})
|
||||
},
|
||||
})
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.pages-auth {
|
||||
height: 100vh;
|
||||
box-sizing: border-box;
|
||||
padding: 148rpx 48rpx;
|
||||
background: #fff;
|
||||
overflow: hidden;
|
||||
|
||||
.tip-1 {
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.tip-2 {
|
||||
margin-top: 20rpx;
|
||||
font-size: 40rpx;
|
||||
line-height: 58rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.avatar-wrapper {
|
||||
width: 180rpx;
|
||||
height: 180rpx;
|
||||
margin: 32rpx 0 0 0;
|
||||
padding: 0;
|
||||
background: none;
|
||||
|
||||
.avatar {
|
||||
width: 180rpx;
|
||||
height: 180rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
|
||||
.avatar-wrapper::after {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.input-wrapper {
|
||||
width: 360rpx;
|
||||
height: 72rpx;
|
||||
margin-top: 30rpx;
|
||||
background: rgba(248, 249, 251, 1);
|
||||
color: #999;
|
||||
font-size: 32rpx;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.agree-box {
|
||||
margin: 120rpx 0 60rpx;
|
||||
font-size: 28rpx;
|
||||
color: #666;
|
||||
|
||||
.btn-show {
|
||||
color: #000;
|
||||
}
|
||||
}
|
||||
|
||||
.dialog-mask {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
background: rgba(0, 0, 0, .4);
|
||||
z-index: 99;
|
||||
|
||||
.dialog-body {
|
||||
position: fixed;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: 630rpx;
|
||||
height: 70vh;
|
||||
box-sizing: border-box;
|
||||
padding: 60rpx;
|
||||
border-radius: 10rpx;
|
||||
background: #fff;
|
||||
overflow: hidden;
|
||||
|
||||
.btn-close {
|
||||
position: absolute;
|
||||
top: 20rpx;
|
||||
right: 20rpx;
|
||||
width: 28rpx;
|
||||
height: 28rpx;
|
||||
}
|
||||
|
||||
.content {
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.title {
|
||||
margin: 30rpx auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.btn-box {
|
||||
width: 338rpx;
|
||||
margin: 0 auto;
|
||||
|
||||
button::after {
|
||||
border: none;
|
||||
}
|
||||
|
||||
button {
|
||||
height: 72rpx;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
|
||||
.btn-yes {
|
||||
background: #FF564A;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.btn-no {
|
||||
margin-top: 32rpx;
|
||||
background: #eee;
|
||||
color: #FF564A;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user