提交 d9820861 编写于 作者: DCloud_JSON's avatar DCloud_JSON

v1.1.1

上级 ff810503
...@@ -107,7 +107,7 @@ ...@@ -107,7 +107,7 @@
"quickapp" : {}, "quickapp" : {},
/* 小程序特有相关 */ /* 小程序特有相关 */
"mp-weixin" : { "mp-weixin" : {
"appid" : "wx1002f172d7719592", "appid" : "wx999bf02c8e05dfc9",
"setting" : { "setting" : {
"urlCheck" : false "urlCheck" : false
}, },
......
## 1.1.1(2023-02-02) ## 1.1.1(2023-02-02)
- 修复 Vue3下 一键登录条款勾选框选中状态未同步到页面 的问题 - 新增 微信小程序端 支持选择使用微信资料的“头像”和“昵称” 设置用户资料 [详情参考](https://wdoc-76491.picgzc.qpic.cn/MTY4ODg1MDUyNzQyMDUxNw_21263_rTNhg68FTngQGdvQ_1647431233?w=1280&h=695.7176470588236)
## 1.1.0(2023-01-31) ## 1.1.0(2023-01-31)
- 【重要】优化 小程序端资源包大小(运行时大小为:731KB,发行后为:583KB;注:可以直接将本插件作为分包使用) - 【重要】优化 小程序端资源包大小(运行时大小为:731KB,发行后为:583KB;注:可以直接将本插件作为分包使用)
- 更新 微信小程序端 上传头像功能 用`wx.cropImage`实现图片裁剪 - 更新 微信小程序端 上传头像功能 用`wx.cropImage`实现图片裁剪
......
...@@ -67,8 +67,7 @@ let mixin = { ...@@ -67,8 +67,7 @@ let mixin = {
} }
} }
}, },
set(agree) { set(agree) {
console.log('set(agree)',agree);
if (this.$refs.agreements) { if (this.$refs.agreements) {
this.$refs.agreements.isAgree = agree this.$refs.agreements.isAgree = agree
} else { } else {
......
<template> <template>
<view @click="uploadAvatarImg" class="box" :class="{'showBorder':border}" :style="{width,height,lineHeight:height}"> <button open-type="chooseAvatar" @chooseavatar="bindchooseavatar" @click="uploadAvatarImg" class="box" :class="{'showBorder':border}" :style="{width,height,lineHeight:height}">
<cloud-image v-if="avatar_file" :src="avatar_file.url" :width="width" :height="height"></cloud-image> <cloud-image v-if="avatar_file" :src="avatar_file.url" :width="width" :height="height"></cloud-image>
<uni-icons v-else :style="{width,height,lineHeight:height}" class="chooseAvatar" type="plusempty" size="30" <uni-icons v-else :style="{width,height,lineHeight:height}" class="chooseAvatar" type="plusempty" size="30"
color="#dddddd"></uni-icons> color="#dddddd"></uni-icons>
</view> </button>
</template> </template>
<script> <script>
...@@ -65,13 +65,71 @@ ...@@ -65,13 +65,71 @@
setAvatarFile(avatar_file) { setAvatarFile(avatar_file) {
// 使用 clientDB 提交数据 // 使用 clientDB 提交数据
mutations.updateUserInfo({avatar_file}) mutations.updateUserInfo({avatar_file})
},
async bindchooseavatar(res){
let avatarUrl = res.detail.avatarUrl
let avatar_file = {
extname: avatarUrl.split('.')[avatarUrl.split('.').length - 1],
name:'',
url:avatarUrl
}
// 裁剪
let filePath = await new Promise((callback) => {
wx.cropImage({
src:avatarUrl,
cropScale:"1:1",
success: res => {
callback(res.tempFilePath)
},
fail(e){
console.error(e)
uni.showModal({
content: 'wx.cropImage ' + e.errMsg,
showCancel: false,
confirmText:"跳过裁剪",
complete() {
callback(avatarUrl)
}
});
}
})
})
//上传到服务器
let cloudPath = this.userInfo._id + '' + Date.now()
avatar_file.name = cloudPath
try{
uni.showLoading({
title: "更新中",
mask: true
});
let {
fileID
} = await uniCloud.uploadFile({
filePath,
cloudPath,
fileType: "image"
});
avatar_file.url = fileID
uni.hideLoading()
}catch(e){
console.error(e);
}
this.setAvatarFile(avatar_file)
}, },
uploadAvatarImg(res) { uploadAvatarImg(res) {
// #ifdef MP-WEIXIN
return false // 微信小程序走 bindchooseavatar方法
// #endif
if(!this.hasLogin){ if(!this.hasLogin){
return uni.navigateTo({ return uni.navigateTo({
url:'/uni_modules/uni-id-pages/pages/login/login-withoutpwd' url:'/uni_modules/uni-id-pages/pages/login/login-withoutpwd'
}) })
} }
const crop = { const crop = {
quality: 100, quality: 100,
width: 600, width: 600,
...@@ -113,27 +171,6 @@ ...@@ -113,27 +171,6 @@
}); });
} }
// #endif // #endif
// #ifdef MP-WEIXIN
wx.cropImage({
src:filePath,
cropScale:"1:1",
success: res => {
callback(res.tempFilePath)
},
fail(e){
console.error(e)
uni.showModal({
content: 'wx.cropImage ' + e.errMsg,
showCancel: false,
confirmText:"跳过裁剪",
complete() {
callback(filePath)
}
});
}
})
// #endif
}) })
// #endif // #endif
...@@ -166,13 +203,15 @@ ...@@ -166,13 +203,15 @@
overflow: hidden; overflow: hidden;
} }
/* #endif */ /* #endif */
.box{
padding: 0;
}
.chooseAvatar { .chooseAvatar {
/* #ifndef APP-NVUE */ /* #ifndef APP-NVUE */
display: inline-block; display: inline-block;
box-sizing: border-box; box-sizing: border-box;
/* #endif */ /* #endif */
border: dotted 1px #ddd;
border-radius: 10px; border-radius: 10px;
text-align: center; text-align: center;
padding: 1px; padding: 1px;
......
...@@ -7,9 +7,6 @@ ...@@ -7,9 +7,6 @@
<text class="login-title">{{item.text}}</text> <text class="login-title">{{item.text}}</text>
</view> </view>
</view> </view>
<!-- #ifdef MP-WEIXIN -->
<uni-id-pages-user-profile @next="doUserProfileNext" ref="userProfile"></uni-id-pages-user-profile>
<!-- #endif -->
</view> </view>
</template> </template>
<script> <script>
...@@ -442,17 +439,6 @@ ...@@ -442,17 +439,6 @@
icon: 'none', icon: 'none',
duration: 2000 duration: 2000
}); });
// #ifdef MP-WEIXIN
//如果是微信小程序端的微信登录,且为首次登录,就弹出获取微信昵称+头像用于绑定资料
if (['weixin', 'weixinMobile'].includes(type) && result.type == "register") {
mutations.loginSuccess({
...result,
showToast: false,
autoBack: false
})
return this.$refs.userProfile.open(result.uid)
}
// #endif
// #ifdef H5 // #ifdef H5
result.loginType = type result.loginType = type
// #endif // #endif
...@@ -472,13 +458,6 @@ ...@@ -472,13 +458,6 @@
uni.hideLoading() uni.hideLoading()
}) })
}, },
doUserProfileNext() {
try {
mutations.loginSuccess()
} catch (e) {
console.log(e);
}
},
async getUserInfo(e) { async getUserInfo(e) {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
uni.getUserInfo({ uni.getUserInfo({
......
<template>
<uni-popup ref="popup" type="bottom">
<view class="box">
<text class="headBox">绑定资料</text>
<text class="tip">获取你的微信头像和昵称,完善你的个人资料</text>
<view class="btnBox">
<text @click="closeMe" class="close">关闭</text>
<button class="agree uni-btn" type="primary" @click="getUserProfile">确定</button>
</view>
</view>
</uni-popup>
</template>
<script>
const db = uniCloud.database();
const usersTable = db.collection('uni-id-users')
let userId = ''
export default {
emits:['next'],
data() {
return {}
},
methods: {
async open(uid){
userId = uid
this.$refs.popup.open()
},
async getUserProfile(){
uni.showLoading();
let res = await new Promise((callBack) => {
uni.getUserProfile({
desc: "用于设置账户昵称和头像",
complete: (e) => {
callBack(e)
}
})
})
if(res.errMsg != "getUserProfile:ok"){
return this.closeMe()
}
let {avatarUrl,nickName} = res.userInfo;
let tempFilePath = await new Promise((callBack)=>{
uni.downloadFile({
url: avatarUrl,
success: (res) => {
if (res.statusCode === 200) {
// console.log('下载成功');
callBack(res.tempFilePath)
}
callBack()
},
fail: (err) => {
console.error(err)
},
complete: (e) => {
// console.log("downloadFile",e);
}
});
})
const extName = tempFilePath.split('.').pop() || 'jpg'
const cloudPath = 'user/avatar/'+ userId+'/'+Date.now()+'-avatar.'+extName;
const result = await uniCloud.uploadFile({
filePath: tempFilePath,
cloudPath,
fileType:'image'
});
let userInfo = {
"nickname":nickName,
"avatar_file":{
name:cloudPath,
extname:"jpg",
url:result.fileID
}
}
this.doUpdate(userInfo,()=>{
this.$refs.popup.close()
})
},
closeMe(e){
uni.showLoading();
this.doUpdate({nickname:"匿名微信用户"},()=>{
uni.hideLoading()
this.$refs.popup.close()
})
},
doUpdate(data,callback){
// 使用 clientDB 提交数据
usersTable.where('_id==$env.uid').update(data).then((res) => {
callback(res)
}).catch((err) => {
uni.showModal({
content: err.message || '请求服务失败',
showCancel: false
})
callback(err)
}).finally(() => {
this.$emit('next')
uni.hideLoading()
})
}
}
}
</script>
<style lang="scss" scoped>
@import "@/uni_modules/uni-id-pages/common/login-page.scss";
view{
display: flex;
}
.box{
background-color: #FFFFFF;
height:200px;
width: 750rpx;
flex-direction: column;
border-top-left-radius: 15px;
border-top-right-radius: 15px;
}
.headBox{
padding:20rpx;
height:80rpx;
line-height:80rpx;
text-align: left;
font-size:16px;
color:#333333;
margin-left: 15rpx;
}
.tip{
color:#666666;
text-align: left;
justify-content: center;
margin:10rpx 30rpx;
font-size:18px;
}
.btnBox{
margin-top:45rpx;
justify-content: center;
flex-direction: row;
}
.close,.agree{
text-align: center;
width:200rpx;
height:80upx;
line-height:80upx;
border-radius:5px;
margin:0 20rpx;
font-size:14px;
}
.close{
color:#999999;
border-color: #EEEEEE;
border-style: solid;
border-width: 1px;
background-color:#FFFFFF;
}
.close:active{
color:#989898;
background-color:#E2E2E2;
}
.agree{
color:#FFFFFF;
}
/* #ifdef MP */
.agree::after {
border: none;
}
/* #endif */
.agree:active{
background-color:#F5F5F6;
}
</style>
{ {
"id": "uni-id-pages", "id": "uni-id-pages",
"displayName": "uni-id-pages", "displayName": "uni-id-pages",
"version": "1.1.0", "version": "1.1.1",
"description": "云端一体简单、统一、可扩展的用户中心页面模版", "description": "云端一体简单、统一、可扩展的用户中心页面模版",
"keywords": [ "keywords": [
"用户管理", "用户管理",
......
<!-- 免密登录页 --> <!-- 免密登录页 -->
<template> <template>
<view class="uni-content"> <view class="uni-content">
<view class="login-logo"> <view class="login-logo">
<image :src="logo"></image> <image :src="logo"></image>
</view> </view>
<!-- 顶部文字 --> <!-- 顶部文字 -->
<text class="title">请选择登录方式</text> <text class="title">请选择登录方式</text>
<!-- 快捷登录框 当url带参数时有效 --> <!-- 快捷登录框 当url带参数时有效 -->
<template v-if="['apple','weixin', 'weixinMobile'].includes(type)"> <template v-if="['apple','weixin', 'weixinMobile'].includes(type)">
<text class="tip">将根据第三方账号服务平台的授权范围获取你的信息</text> <text class="tip">将根据第三方账号服务平台的授权范围获取你的信息</text>
<view class="quickLogin"> <view class="quickLogin">
<image v-if="type !== 'weixinMobile'" @click="quickLogin" :src="imgSrc" mode="widthFix" <image v-if="type !== 'weixinMobile'" @click="quickLogin" :src="imgSrc" mode="widthFix"
class="quickLoginBtn"></image> class="quickLoginBtn"></image>
<button v-else type="primary" open-type="getPhoneNumber" @getphonenumber="quickLogin" <button v-else type="primary" open-type="getPhoneNumber" @getphonenumber="quickLogin"
class="uni-btn">微信授权手机号登录</button> class="uni-btn">微信授权手机号登录</button>
<uni-id-pages-agreements scope="register" ref="agreements"></uni-id-pages-agreements> <uni-id-pages-agreements scope="register" ref="agreements"></uni-id-pages-agreements>
</view> </view>
</template> </template>
<template v-else> <template v-else>
<text class="tip">未注册的账号验证通过后将自动注册</text> <text class="tip">未注册的账号验证通过后将自动注册</text>
<view class="phone-box"> <view class="phone-box">
<view @click="chooseArea" class="area">+86</view> <view @click="chooseArea" class="area">+86</view>
<uni-easyinput :focus="focusPhone" @blur="focusPhone = false" class="input-box" type="number" <uni-easyinput :focus="focusPhone" @blur="focusPhone = false" class="input-box" type="number"
:inputBorder="false" v-model="phone" maxlength="11" placeholder="请输入手机号" /> :inputBorder="false" v-model="phone" maxlength="11" placeholder="请输入手机号" />
</view> </view>
<uni-id-pages-agreements scope="register" ref="agreements"></uni-id-pages-agreements> <uni-id-pages-agreements scope="register" ref="agreements"></uni-id-pages-agreements>
<button class="uni-btn" type="primary" @click="toSmsPage">获取验证码</button> <button class="uni-btn" type="primary" @click="toSmsPage">获取验证码</button>
</template> </template>
<!-- 固定定位的快捷登录按钮 --> <!-- 固定定位的快捷登录按钮 -->
<uni-id-pages-fab-login ref="uniFabLogin"></uni-id-pages-fab-login> <uni-id-pages-fab-login ref="uniFabLogin"></uni-id-pages-fab-login>
</view> </view>
</template> </template>
<script> <script>
let currentWebview; //当前窗口对象 let currentWebview; //当前窗口对象
import config from '@/uni_modules/uni-id-pages/config.js' import config from '@/uni_modules/uni-id-pages/config.js'
import mixin from '@/uni_modules/uni-id-pages/common/login-page.mixin.js'; import mixin from '@/uni_modules/uni-id-pages/common/login-page.mixin.js';
export default { export default {
mixins: [mixin], mixins: [mixin],
data() { data() {
return { return {
type: "", //快捷登录方式 type: "", //快捷登录方式
phone: "", //手机号码 phone: "", //手机号码
focusPhone: false, focusPhone: false,
logo: "/static/logo.png" logo: "/static/logo.png"
} }
}, },
computed: { computed: {
async loginTypes() { //读取配置的登录优先级 async loginTypes() { //读取配置的登录优先级
return config.loginTypes return config.loginTypes
}, },
isPhone() { //手机号码校验正则 isPhone() { //手机号码校验正则
return /^1\d{10}$/.test(this.phone); return /^1\d{10}$/.test(this.phone);
}, },
imgSrc() { //大快捷登录按钮图 imgSrc() { //大快捷登录按钮图
return this.type == 'weixin' ? '/uni_modules/uni-id-pages/static/login/weixin.png' : return this.type == 'weixin' ? '/uni_modules/uni-id-pages/static/login/weixin.png' :
'/uni_modules/uni-id-pages/static/app-plus/apple.png' '/uni_modules/uni-id-pages/static/app-plus/apple.png'
} }
}, },
async onLoad(e) { async onLoad(e) {
//获取通过url传递的参数type设置当前登录方式,如果没传递直接默认以配置的登录 //获取通过url传递的参数type设置当前登录方式,如果没传递直接默认以配置的登录
let type = e.type || config.loginTypes[0] let type = e.type || config.loginTypes[0]
this.type = type this.type = type
// console.log("this.type: -----------",this.type); // console.log("this.type: -----------",this.type);
if (type != 'univerify') { if (type != 'univerify') {
this.focusPhone = true this.focusPhone = true
} }
this.$nextTick(() => { this.$nextTick(() => {
//关闭重复显示的登录快捷方式 //关闭重复显示的登录快捷方式
if (['weixin', 'apple'].includes(type)) { if (['weixin', 'apple'].includes(type)) {
this.$refs.uniFabLogin.servicesList = this.$refs.uniFabLogin.servicesList.filter(item => this.$refs.uniFabLogin.servicesList = this.$refs.uniFabLogin.servicesList.filter(item =>
item.id != type) item.id != type)
} }
}) })
uni.$on('uni-id-pages-setLoginType', type => { uni.$on('uni-id-pages-setLoginType', type => {
this.type = type this.type = type
}) })
}, },
onShow() { onShow() {
// #ifdef H5 // #ifdef H5
document.onkeydown = event => { document.onkeydown = event => {
var e = event || window.event; var e = event || window.event;
if (e && e.keyCode == 13) { //回车键的键值为13 if (e && e.keyCode == 13) { //回车键的键值为13
this.toSmsPage() this.toSmsPage()
} }
}; };
// #endif // #endif
}, },
onUnload() { onUnload() {
uni.$off('uni-id-pages-setLoginType') uni.$off('uni-id-pages-setLoginType')
}, },
onReady() { onReady() {
// 是否优先启动一键登录。即:页面一加载就启动一键登录 // 是否优先启动一键登录。即:页面一加载就启动一键登录
//#ifdef APP-PLUS //#ifdef APP-PLUS
if (this.type == "univerify") { if (this.type == "univerify") {
const pages = getCurrentPages(); const pages = getCurrentPages();
currentWebview = pages[pages.length - 1].$getAppWebview(); currentWebview = pages[pages.length - 1].$getAppWebview();
currentWebview.setStyle({ currentWebview.setStyle({
"top": "2000px" // 隐藏当前页面窗体 "top": "2000px" // 隐藏当前页面窗体
}) })
this.type == this.loginTypes[1] this.type == this.loginTypes[1]
// console.log('开始一键登录'); // console.log('开始一键登录');
this.$refs.uniFabLogin.login_before('univerify') this.$refs.uniFabLogin.login_before('univerify')
} }
//#endif //#endif
}, },
methods: { methods: {
showCurrentWebview(){ showCurrentWebview(){
// 恢复当前页面窗体的显示 一键登录,默认不显示当前窗口 // 恢复当前页面窗体的显示 一键登录,默认不显示当前窗口
currentWebview.setStyle({ currentWebview.setStyle({
"top": 0 "top": 0
}) })
}, },
quickLogin(e) { quickLogin(e) {
let options = {} let options = {}
if (e.detail?.code) { if (e.detail?.code) {
options.phoneNumberCode = e.detail.code options.phoneNumberCode = e.detail.code
} }
if (this.type === 'weixinMobile' && !e.detail?.code) return if (this.type === 'weixinMobile' && !e.detail?.code) return
this.$refs.uniFabLogin.login_before(this.type, true, options) this.$refs.uniFabLogin.login_before(this.type, true, options)
}, },
toSmsPage() { toSmsPage() {
if (!this.isPhone) { if (!this.isPhone) {
this.focusPhone = true this.focusPhone = true
return uni.showToast({ return uni.showToast({
title: "手机号码格式不正确", title: "手机号码格式不正确",
icon: 'none', icon: 'none',
duration: 3000 duration: 3000
}); });
} }
if (this.needAgreements && !this.agree) { if (this.needAgreements && !this.agree) {
return this.$refs.agreements.popup(this.toSmsPage) return this.$refs.agreements.popup(this.toSmsPage)
} }
// 发送验证吗 // 发送验证吗
uni.navigateTo({ uni.navigateTo({
url: '/uni_modules/uni-id-pages/pages/login/login-smscode?phoneNumber=' + this.phone url: '/uni_modules/uni-id-pages/pages/login/login-smscode?phoneNumber=' + this.phone
}); });
}, },
//去密码登录页 //去密码登录页
toPwdLogin() { toPwdLogin() {
uni.navigateTo({ uni.navigateTo({
url: '../login/password' url: '../login/password'
}) })
}, },
chooseArea() { chooseArea() {
uni.showToast({ uni.showToast({
title: '暂不支持其他国家', title: '暂不支持其他国家',
icon: 'none', icon: 'none',
duration: 3000 duration: 3000
}); });
}, },
} }
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@import "@/uni_modules/uni-id-pages/common/login-page.scss"; @import "@/uni_modules/uni-id-pages/common/login-page.scss";
@media screen and (min-width: 690px) { @media screen and (min-width: 690px) {
.uni-content { .uni-content {
height: 350px; height: 350px;
} }
} }
.uni-content, .uni-content,
.quickLogin { .quickLogin {
/* #ifndef APP-NVUE */ /* #ifndef APP-NVUE */
display: flex; display: flex;
flex-direction: column; flex-direction: column;
/* #endif */ /* #endif */
} }
.phone-box { .phone-box {
position: relative; position: relative;
/* #ifndef APP-NVUE */ /* #ifndef APP-NVUE */
display: flex; display: flex;
/* #endif */ /* #endif */
} }
.area { .area {
position: absolute; position: absolute;
left: 10px; left: 10px;
z-index: 9; z-index: 9;
top: 12px; top: 12px;
font-size: 14px; font-size: 14px;
} }
.area::after { .area::after {
content: ""; content: "";
border: 3px solid transparent; border: 3px solid transparent;
border-top-color: #000; border-top-color: #000;
top: 12px; top: 12px;
left: 3px; left: 3px;
position: relative; position: relative;
} }
/* #ifdef MP */ /* #ifdef MP */
// 解决小程序端开启虚拟节点virtualHost引起的 class = input-box丢失的问题 [详情参考](https://uniapp.dcloud.net.cn/matter.html#%E5%90%84%E5%AE%B6%E5%B0%8F%E7%A8%8B%E5%BA%8F%E5%AE%9E%E7%8E%B0%E6%9C%BA%E5%88%B6%E4%B8%8D%E5%90%8C-%E5%8F%AF%E8%83%BD%E5%AD%98%E5%9C%A8%E7%9A%84%E5%B9%B3%E5%8F%B0%E5%85%BC%E5%AE%B9%E9%97%AE%E9%A2%98) // 解决小程序端开启虚拟节点virtualHost引起的 class = input-box丢失的问题 [详情参考](https://uniapp.dcloud.net.cn/matter.html#%E5%90%84%E5%AE%B6%E5%B0%8F%E7%A8%8B%E5%BA%8F%E5%AE%9E%E7%8E%B0%E6%9C%BA%E5%88%B6%E4%B8%8D%E5%90%8C-%E5%8F%AF%E8%83%BD%E5%AD%98%E5%9C%A8%E7%9A%84%E5%B9%B3%E5%8F%B0%E5%85%BC%E5%AE%B9%E9%97%AE%E9%A2%98)
.phone-box ::v-deep .uni-easyinput__content, .phone-box ::v-deep .uni-easyinput__content,
/* #endif */ /* #endif */
.input-box { .input-box {
/* #ifndef APP-NVUE */ /* #ifndef APP-NVUE */
box-sizing: border-box; box-sizing: border-box;
/* #endif */ /* #endif */
flex: 1; flex: 1;
padding-left: 45px; padding-left: 45px;
margin-bottom: 10px; margin-bottom: 10px;
border-radius: 0; border-radius: 0;
} }
.quickLogin { .quickLogin {
height: 350px; height: 350px;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
} }
.quickLoginBtn { .quickLoginBtn {
margin: 20px 0; margin: 20px 0;
width: 450rpx; width: 450rpx;
/* #ifndef APP-NVUE */ /* #ifndef APP-NVUE */
max-width: 230px; max-width: 230px;
/* #endif */ /* #endif */
height: 82rpx; height: 82rpx;
} }
.tip { .tip {
margin-top: -15px; margin-top: -15px;
margin-bottom: 20px; margin-bottom: 20px;
} }
@media screen and (min-width: 690px) { @media screen and (min-width: 690px) {
.quickLogin { .quickLogin {
height: auto; height: auto;
} }
} }
</style> </style>
<!-- 用户资料页 --> <!-- 用户资料页 -->
<template> <template>
<view class="uni-content"> <view class="uni-content">
<view class="avatar"> <view class="avatar">
<uni-id-pages-avatar width="260rpx" height="260rpx"></uni-id-pages-avatar> <uni-id-pages-avatar width="260rpx" height="260rpx"></uni-id-pages-avatar>
</view> </view>
<uni-list> <uni-list>
<uni-list-item class="item" @click="setNickname('')" title="昵称" :rightText="userInfo.nickname||'未设置'" link> <uni-list-item class="item" @click="setNickname('')" title="昵称" :rightText="userInfo.nickname||'未设置'" link>
</uni-list-item> </uni-list-item>
<uni-list-item class="item" @click="bindMobile" title="手机号" :rightText="userInfo.mobile||'未绑定'" link> <uni-list-item class="item" @click="bindMobile" title="手机号" :rightText="userInfo.mobile||'未绑定'" link>
</uni-list-item> </uni-list-item>
<uni-list-item v-if="userInfo.email" class="item" title="电子邮箱" :rightText="userInfo.email"> <uni-list-item v-if="userInfo.email" class="item" title="电子邮箱" :rightText="userInfo.email">
</uni-list-item> </uni-list-item>
<uni-list-item v-if="hasPwd" class="item" @click="changePassword" title="修改密码" link> <uni-list-item v-if="hasPwd" class="item" @click="changePassword" title="修改密码" link>
</uni-list-item> </uni-list-item>
</uni-list> </uni-list>
<!-- #ifndef MP --> <!-- #ifndef MP -->
<uni-list class="mt10"> <uni-list class="mt10">
<uni-list-item @click="deactivate" title="注销账号" link="navigateTo"></uni-list-item> <uni-list-item @click="deactivate" title="注销账号" link="navigateTo"></uni-list-item>
</uni-list> </uni-list>
<!-- #endif --> <!-- #endif -->
<uni-popup ref="dialog" type="dialog"> <uni-popup ref="dialog" type="dialog">
<uni-popup-dialog mode="input" :value="userInfo.nickname" @confirm="setNickname" title="设置昵称" <uni-popup-dialog mode="input" :value="userInfo.nickname" @confirm="setNickname" :inputType="setNicknameIng?'nickname':'text'"
placeholder="请输入要设置的昵称"> title="设置昵称" placeholder="请输入要设置的昵称">
</uni-popup-dialog> </uni-popup-dialog>
</uni-popup> </uni-popup>
<uni-id-pages-bind-mobile ref="bind-mobile-by-sms" @success="bindMobileSuccess"></uni-id-pages-bind-mobile> <uni-id-pages-bind-mobile ref="bind-mobile-by-sms" @success="bindMobileSuccess"></uni-id-pages-bind-mobile>
<template v-if="showLoginManage"> <template v-if="showLoginManage">
<button v-if="userInfo._id" @click="logout">退出登录</button> <button v-if="userInfo._id" @click="logout">退出登录</button>
<button v-else @click="login">去登录</button> <button v-else @click="login">去登录</button>
</template> </template>
</view> </view>
</template> </template>
<script> <script>
const uniIdCo = uniCloud.importObject("uni-id-co") const uniIdCo = uniCloud.importObject("uni-id-co")
import { import {
store, store,
mutations mutations
} from '@/uni_modules/uni-id-pages/common/store.js' } from '@/uni_modules/uni-id-pages/common/store.js'
export default { export default {
computed: { computed: {
userInfo() { userInfo() {
return store.userInfo return store.userInfo
} }
}, },
data() { data() {
return { return {
univerifyStyle: { univerifyStyle: {
authButton: { authButton: {
"title": "本机号码一键绑定", // 授权按钮文案 "title": "本机号码一键绑定", // 授权按钮文案
}, },
otherLoginButton: { otherLoginButton: {
"title": "其他号码绑定", "title": "其他号码绑定",
} }
}, },
// userInfo: { // userInfo: {
// mobile:'', // mobile:'',
// nickname:'' // nickname:''
// }, // },
hasPwd:false, hasPwd: false,
showLoginManage:false//通过页面传参隐藏登录&退出登录按钮 showLoginManage: false ,//通过页面传参隐藏登录&退出登录按钮
} setNicknameIng:false
}, }
async onShow() { },
this.univerifyStyle.authButton.title = "本机号码一键绑定" async onShow() {
this.univerifyStyle.otherLoginButton.title = "其他号码绑定" this.univerifyStyle.authButton.title = "本机号码一键绑定"
}, this.univerifyStyle.otherLoginButton.title = "其他号码绑定"
async onLoad(e) { },
if(e.showLoginManage){ async onLoad(e) {
this.showLoginManage = true//通过页面传参隐藏登录&退出登录按钮 if (e.showLoginManage) {
} this.showLoginManage = true //通过页面传参隐藏登录&退出登录按钮
//判断当前用户是否有密码,否则就不显示密码修改功能 }
let res = await uniIdCo.getAccountInfo() //判断当前用户是否有密码,否则就不显示密码修改功能
this.hasPwd = res.isPasswordSet let res = await uniIdCo.getAccountInfo()
}, this.hasPwd = res.isPasswordSet
methods: { },
login() { methods: {
uni.navigateTo({ login() {
url: '/uni_modules/uni-id-pages/pages/login/login-withoutpwd', uni.navigateTo({
complete: (e) => { url: '/uni_modules/uni-id-pages/pages/login/login-withoutpwd',
// console.log(e); complete: (e) => {
} // console.log(e);
}) }
}, })
logout(){ },
mutations.logout() logout() {
}, mutations.logout()
bindMobileSuccess(){ },
mutations.updateUserInfo() bindMobileSuccess() {
}, mutations.updateUserInfo()
changePassword(){ },
uni.navigateTo({ changePassword() {
url: '/uni_modules/uni-id-pages/pages/userinfo/change_pwd/change_pwd', uni.navigateTo({
complete: (e) => { url: '/uni_modules/uni-id-pages/pages/userinfo/change_pwd/change_pwd',
// console.log(e); complete: (e) => {
} // console.log(e);
}) }
}, })
bindMobile() { },
// #ifdef APP-PLUS bindMobile() {
uni.preLogin({ // #ifdef APP-PLUS
provider: 'univerify', uni.preLogin({
success: this.univerify(), //预登录成功 provider: 'univerify',
fail: (res) => { // 预登录失败 success: this.univerify(), //预登录成功
// 不显示一键登录选项(或置灰) fail: (res) => { // 预登录失败
console.log(res) // 不显示一键登录选项(或置灰)
this.bindMobileBySmsCode() console.log(res)
} this.bindMobileBySmsCode()
}) }
// #endif })
// #endif
// #ifdef MP-WEIXIN
this.$refs['bind-mobile-by-sms'].open() // #ifdef MP-WEIXIN
// #endif this.$refs['bind-mobile-by-sms'].open()
// #endif
// #ifdef H5
//...去用验证码绑定 // #ifdef H5
this.bindMobileBySmsCode() //...去用验证码绑定
// #endif this.bindMobileBySmsCode()
}, // #endif
univerify() { },
uni.login({ univerify() {
"provider": 'univerify', uni.login({
"univerifyStyle": this.univerifyStyle, "provider": 'univerify',
success: async e => { "univerifyStyle": this.univerifyStyle,
uniIdCo.bindMobileByUniverify(e.authResult).then(res => { success: async e => {
mutations.updateUserInfo() uniIdCo.bindMobileByUniverify(e.authResult).then(res => {
}).catch(e => { mutations.updateUserInfo()
console.log(e); }).catch(e => {
}).finally(e=>{ console.log(e);
// console.log(e); }).finally(e => {
uni.closeAuthView() // console.log(e);
}) uni.closeAuthView()
}, })
fail: (err) => { },
console.log(err); fail: (err) => {
if (err.code == '30002' || err.code == '30001') { console.log(err);
this.bindMobileBySmsCode() if (err.code == '30002' || err.code == '30001') {
} this.bindMobileBySmsCode()
} }
}) }
}, })
bindMobileBySmsCode() { },
uni.navigateTo({ bindMobileBySmsCode() {
url: './bind-mobile/bind-mobile' uni.navigateTo({
}) url: './bind-mobile/bind-mobile'
}, })
setNickname(nickname) { },
if (nickname) { setNickname(nickname) {
mutations.updateUserInfo({nickname}) if (nickname) {
this.$refs.dialog.close() mutations.updateUserInfo({
} else { nickname
this.$refs.dialog.open()
}
},
deactivate(){
uni.navigateTo({
url:"/uni_modules/uni-id-pages/pages/userinfo/deactivate/deactivate"
})
},
async bindThirdAccount(provider) {
const uniIdCo = uniCloud.importObject("uni-id-co")
const bindField = {
weixin: 'wx_openid',
alipay: 'ali_openid',
apple: 'apple_openid',
qq: 'qq_openid'
}[provider.toLowerCase()]
if (this.userInfo[bindField]) {
await uniIdCo['unbind' + provider]()
await mutations.updateUserInfo()
} else {
uni.login({
provider: provider.toLowerCase(),
onlyAuthorize: true,
success: async e => {
const res = await uniIdCo['bind' + provider]({code: e.code})
if (res.errCode) {
uni.showToast({
title: res.errMsg || '绑定失败',
duration: 3000
})
}
await mutations.updateUserInfo()
},
fail: async (err) => {
console.log(err);
uni.hideLoading()
}
}) })
} this.setNicknameIng = false
} this.$refs.dialog.close()
} } else {
} this.setNicknameIng = true
</script> this.$refs.dialog.open()
<style lang="scss" scoped> }
},
@import "@/uni_modules/uni-id-pages/common/login-page.scss"; deactivate() {
uni.navigateTo({
.uni-content { url: "/uni_modules/uni-id-pages/pages/userinfo/deactivate/deactivate"
padding: 0; })
} },
async bindThirdAccount(provider) {
/* #ifndef APP-NVUE */ const uniIdCo = uniCloud.importObject("uni-id-co")
view { const bindField = {
display: flex; weixin: 'wx_openid',
box-sizing: border-box; alipay: 'ali_openid',
flex-direction: column; apple: 'apple_openid',
} qq: 'qq_openid'
@media screen and (min-width: 690px) { } [provider.toLowerCase()]
.uni-content {
padding: 0; if (this.userInfo[bindField]) {
max-width: 690px; await uniIdCo['unbind' + provider]()
margin-left: calc(50% - 345px); await mutations.updateUserInfo()
border: none; } else {
max-height: none; uni.login({
border-radius: 0; provider: provider.toLowerCase(),
box-shadow: none; onlyAuthorize: true,
} success: async e => {
} const res = await uniIdCo['bind' + provider]({
/* #endif */ code: e.code
.avatar { })
align-items: center; if (res.errCode) {
justify-content: center; uni.showToast({
margin: 22px 0; title: res.errMsg || '绑定失败',
width: 100%; duration: 3000
} })
}
.item { await mutations.updateUserInfo()
flex: 1; },
flex-direction: row; fail: async (err) => {
justify-content: space-between; console.log(err);
align-items: center; uni.hideLoading()
} }
})
button { }
margin: 10%; }
margin-top: 40px; }
border-radius: 0; }
background-color: #FFFFFF; </script>
width: 80%; <style lang="scss" scoped>
} @import "@/uni_modules/uni-id-pages/common/login-page.scss";
.mt10{ .uni-content {
margin-top: 10px; padding: 0;
} }
/* #ifndef APP-NVUE */
view {
display: flex;
box-sizing: border-box;
flex-direction: column;
}
@media screen and (min-width: 690px) {
.uni-content {
padding: 0;
max-width: 690px;
margin-left: calc(50% - 345px);
border: none;
max-height: none;
border-radius: 0;
box-shadow: none;
}
}
/* #endif */
.avatar {
align-items: center;
justify-content: center;
margin: 22px 0;
width: 100%;
}
.item {
flex: 1;
flex-direction: row;
justify-content: space-between;
align-items: center;
}
button {
margin: 10%;
margin-top: 40px;
border-radius: 0;
background-color: #FFFFFF;
width: 80%;
}
.mt10 {
margin-top: 10px;
}
</style> </style>
...@@ -330,6 +330,15 @@ ...@@ -330,6 +330,15 @@
}, },
"title": "角色" "title": "角色"
}, },
"tags":{
"bsonType": "array",
"description": "用户标签",
"permission": {
"read": "doc._id == auth.uid || 'READ_UNI_ID_USERS' in auth.permission",
"write": "'CREATE_UNI_ID_USERS' in auth.permission || 'UPDATE_UNI_ID_USERS' in auth.permission"
},
"title": "标签"
},
"score": { "score": {
"bsonType": "int", "bsonType": "int",
"description": "用户积分,积分变更记录可参考:uni-id-scores表定义", "description": "用户积分,积分变更记录可参考:uni-id-scores表定义",
...@@ -369,7 +378,7 @@ ...@@ -369,7 +378,7 @@
"bsonType": "array", "bsonType": "array",
"description": "用户token", "description": "用户token",
"permission": { "permission": {
"read": "'READ_UNI_ID_USERS' in auth.permission", "read": false,
"write": "'CREATE_UNI_ID_USERS' in auth.permission || 'UPDATE_UNI_ID_USERS' in auth.permission" "write": "'CREATE_UNI_ID_USERS' in auth.permission || 'UPDATE_UNI_ID_USERS' in auth.permission"
} }
}, },
...@@ -379,7 +388,7 @@ ...@@ -379,7 +388,7 @@
"title": "用户名", "title": "用户名",
"trim": "both", "trim": "both",
"permission": { "permission": {
"read": "doc._id == auth.uid || 'READ_UNI_ID_USERS' in auth.permission", "read": true,
"write": "'CREATE_UNI_ID_USERS' in auth.permission || 'UPDATE_UNI_ID_USERS' in auth.permission" "write": "'CREATE_UNI_ID_USERS' in auth.permission || 'UPDATE_UNI_ID_USERS' in auth.permission"
} }
}, },
......
## 1.8.2(2023-02-02)
- uni-popup-dialog 组件新增 inputType 属性
## 1.8.1(2022-12-01)
- 修复 nvue 下 v-show 报错
## 1.8.0(2022-11-29)
- 优化 主题样式
## 1.7.9(2022-04-02) ## 1.7.9(2022-04-02)
- 修复 弹出层内部无法滚动的bug - 修复 弹出层内部无法滚动的bug
## 1.7.8(2022-03-28) ## 1.7.8(2022-03-28)
......
...@@ -10,7 +10,7 @@ ...@@ -10,7 +10,7 @@
</view> </view>
<view v-else class="uni-dialog-content"> <view v-else class="uni-dialog-content">
<slot> <slot>
<input class="uni-dialog-input" v-model="val" type="text" :placeholder="placeholderText" :focus="focus" > <input class="uni-dialog-input" v-model="val" :type="inputType" :placeholder="placeholderText" :focus="focus" >
</slot> </slot>
</view> </view>
<view class="uni-dialog-button-group"> <view class="uni-dialog-button-group">
...@@ -56,7 +56,11 @@ ...@@ -56,7 +56,11 @@
name: "uniPopupDialog", name: "uniPopupDialog",
mixins: [popup], mixins: [popup],
emits:['confirm','close'], emits:['confirm','close'],
props: { props: {
inputType:{
type: String,
default: 'text'
},
value: { value: {
type: [String, Number], type: [String, Number],
default: '' default: ''
......
{ {
"id": "uni-popup", "id": "uni-popup",
"displayName": "uni-popup 弹出层", "displayName": "uni-popup 弹出层",
"version": "1.7.9", "version": "1.8.2",
"description": " Popup 组件,提供常用的弹层", "description": " Popup 组件,提供常用的弹层",
"keywords": [ "keywords": [
"uni-ui", "uni-ui",
...@@ -17,12 +17,8 @@ ...@@ -17,12 +17,8 @@
"directories": { "directories": {
"example": "../../temps/example_temps" "example": "../../temps/example_temps"
}, },
"dcloudext": { "dcloudext": {
"category": [ "sale": {
"前端组件",
"通用组件"
],
"sale": {
"regular": { "regular": {
"price": "0.00" "price": "0.00"
}, },
...@@ -38,7 +34,8 @@ ...@@ -38,7 +34,8 @@
"data": "无", "data": "无",
"permissions": "无" "permissions": "无"
}, },
"npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui" "npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui",
"type": "component-vue"
}, },
"uni_modules": { "uni_modules": {
"dependencies": [ "dependencies": [
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册