个人信息

This commit is contained in:
xiaoshan
2023-10-13 14:56:49 +08:00
parent b69a0adc5e
commit 57e0dc875c
14 changed files with 462 additions and 113 deletions

View File

@@ -21,7 +21,7 @@ export function getUserProfile() {
// 修改用户个人信息
export function updateUserProfile(data) {
return request({
url: '/system/user/profile',
url: '/ums/user/updateProfile',
method: 'put',
data: data
})
@@ -30,8 +30,8 @@ export function updateUserProfile(data) {
// 用户头像上传
export function uploadAvatar(data) {
return upload({
url: '/system/user/profile/avatar',
name: data.name,
filePath: data.filePath
url: '/ums/user/avatar',
name: data.name,
filePath: data.filePath
})
}

View File

@@ -14,7 +14,9 @@
"autoclose" : true,
"delay" : 0
},
"modules" : {},
"modules" : {
"Camera" : {}
},
"distribute" : {
"android" : {
"permissions" : [

View File

@@ -4,13 +4,13 @@
<view class="text-area">
<text class="title">Hello RuoYi</text>
</view>
<button @click="$tab.navigateTo('/pages/componentsTest')">跳转组件测试页</button>
</view>
</template>
<script>
export default {
onLoad: function() {
}
onLoad: function() {}
}
</script>

View File

@@ -4,8 +4,7 @@
<image :src="globalConfig.appInfo.logo" mode="widthFix" />
<text class="title">若依移动端登录</text>
</view>
<!-- <button @click="$tab.navigateTo('/pages/componentsTest')">跳转组件测试页</button> -->
<!-- #ifdef APP -->
<view class="login-form-content">
<view class="phone-enter flex align-center justify-between border-bottom border-eee pz-1">
<view class="flex align-center">
@@ -21,10 +20,16 @@
border="none" />
</view>
</view>
<u-button class="mb-3" :disabled="!phoneNumber" :color="!phoneNumber && '#000'" type="primary" shape="circle" @click="sendCode">发送验证码</u-button>
<u-button
class="mb-3"
type="primary"
shape="circle"
:disabled="phoneNumber.length!=11"
:color="phoneNumber.length != 11 ? '#000' : ''"
@click="sendCode">发送验证码</u-button>
<text @click="$tab.navigateTo('/pages/login/login-password')">使用密码登录</text>
</view>
<!-- #endif -->
<!-- #ifdef MP-WEIXIN -->
<view class="weixin">
<open-data class="user-avatar" type="userAvatarUrl"></open-data>
@@ -39,12 +44,13 @@
</view>
<!-- #endif -->
<view class="xieyi text-center ml-3 flex align-center">
<!-- #ifdef APP -->
<u-checkbox-group v-model="agreeStatus">
<u-checkbox name="同意"></u-checkbox>
</u-checkbox-group>
<text class="text-grey1">我同意并遵守</text>
<!-- #endif -->
<!-- #ifdef MP-WEIXIN -->
<text class="text-grey1">登录即代表同意</text>
<!-- #endif -->

View File

@@ -19,7 +19,6 @@
</view>
</view>
<view @click="handleToInfo" class="flex align-center">
<text>个人信息</text>
<view class="iconfont icon-right"></view>
</view>
</view>

View File

@@ -1,44 +1,269 @@
<template>
<view class="container">
<uni-list>
<uni-list-item showExtraIcon="true" :extraIcon="{type: 'person-filled'}" title="昵称" :rightText="user.nickName" />
<uni-list-item showExtraIcon="true" :extraIcon="{type: 'phone-filled'}" title="手机号码" :rightText="user.phonenumber" />
<uni-list-item showExtraIcon="true" :extraIcon="{type: 'email-filled'}" title="邮箱" :rightText="user.email" />
<uni-list-item showExtraIcon="true" :extraIcon="{type: 'auth-filled'}" title="岗位" :rightText="postGroup" />
<uni-list-item showExtraIcon="true" :extraIcon="{type: 'staff-filled'}" title="角色" :rightText="roleGroup" />
<uni-list-item showExtraIcon="true" :extraIcon="{type: 'calendar-filled'}" title="创建日期" :rightText="user.createTime" />
</uni-list>
<view class="flex align-center justify-between p-3 bg-fff">
<view class="">
头像
</view>
<view class="flex align-center" @click="openPopup('avatar')">
<u-avatar :src="avatar" />
<u-icon name="arrow-right" />
</view>
</view>
<u-list class="mt-2">
<u-list-item class="bg-fff" >
<u-cell title="用户名" :value="userName"></u-cell>
<u-cell title="昵称" isLink :value="nickName" rightIcon="arrow-right" @click="openPopup('nickname')"></u-cell>
<u-cell title="性别" isLink :value="showSex(sex)" rightIcon="arrow-right" @click="openPopup('sex')"></u-cell>
<u-cell title="出生日期" isLink :value="parseTime(birthDay, '{y}-{m}-{d}')" rightIcon="arrow-right" @click="openPopup('birthDay')"></u-cell>
</u-list-item>
</u-list>
<u-datetime-picker
mode="date"
title="出生日期"
closeOnClickOverlay
v-model="user.birthDay"
:show="dateShow"
:minDate="-2209017600000"
:maxDate="new Date().getTime()"
@close="close"
@cancel="close"
@confirm="dateConfirm">
</u-datetime-picker>
<u-popup :show="nicknameShow" round="15" mode="bottom" @close="close" closeable>
<view class="popup-box-1">
<view class="title text-center f-28">
修改昵称
</view>
<view class="input-box border-bottom border-eee flex align-center" round="15">
<text>昵称</text>
<u--input
border="none"
inputAlign="center"
type="text"
maxlength="15"
v-model="user.nickName"
/>
</view>
<view class="mt-2 text-right aaa">
{{ user.nickName ? user.nickName.length : 0}}/15
</view>
<view class="mz-30">
<u-button type="primary" shape="circle" @click="changeNickname">保存</u-button>
</view>
</view>
</u-popup>
<u-popup bgColor="transparent" :show="show" @close="close">
<view class="popup-box px-2">
<view class="popup-content text-center bg-fff">
<view class="popup-title">
<text v-if="popupType == 'sex'">请选择性别</text>
<text v-else>使用第三方头像将绑定第三方账号</text>
</view>
<view
v-if="popupType == 'sex'"
class="popup-item border-top border-eee text-center"
v-for="(item, index) in sexList" :key="index"
@click="check(index)">
{{ item }}
</view>
<view
v-if="popupType == 'avatar'"
class="popup-item border-top border-eee text-center"
v-for="(item, index) in avatarSetList"
:key="index"
@click="check(index)">
{{ item }}
</view>
</view>
<view class="popup-close text-center bg-fff f-32 mt-3" @click="show = false">
取消
</view>
</view>
</u-popup>
</view>
</template>
<script>
import { getUserProfile } from "@/api/system/user"
import { getUserProfile, updateUserProfile, uploadAvatar } from "@/api/system/user"
import avatarUpload from "@/components/image-upload/image-upload.vue"
import { uploadImg, parseTime } from "@/utils/index"
var fs = require('fs');
export default {
components: {
avatarUpload
},
data() {
return {
parseTime,
sexList: [ '男', '女' ],
avatarSetList: [ '拍照上传', '从相册中选'],
user: {},
roleGroup: "",
postGroup: ""
postGroup: "",
popupType: "",
show: false,
nicknameShow: false,
dateShow: false
}
},
onLoad() {
this.getUser()
},
computed: {
avatar() {
return this.$store.state.user.avatar
},
userName() {
return this.$store.state.user.name
},
sex() {
return this.$store.state.user.sex
},
nickName() {
return this.$store.state.user.nickname
},
phonenumber() {
return this.$store.state.user.phonenumber
},
birthDay() {
return this.$store.state.user.birthDay
},
},
methods: {
// 选择生日
dateConfirm(e) {
console.log(e);
this.user.birthDay = e.value
this.updataUser(this.user)
},
// 选中
check(index) {
if(this.popupType == 'sex') {
this.user.sex = index
if(this.user.sex == this.sex) {
this.close()
} else {
this.updataUser(this.user)
}
} else {
this.uploadImage(index)
}
},
// 保存昵称
changeNickname() {
this.updataUser(this.user)
},
// 选择图片
uploadImage(index) {
let sourceType
if(index == 0) sourceType = ['camera']
else sourceType = ['album']
uni.chooseImage({
count: 1,
sourceType,
crop: {
width: 100,
height: 100
},
success: (res) => {
// let data = {
// avatarfile: {
// value: fs.createReadStream(res.tempFilePaths[0]),
// options: {
// filename: res.tempFilePaths[0],
// contentType: null
// }
// },
// }
let data = {name: 'avatarfile', filePath: res.tempFilePaths[0]}
uploadAvatar(data).then(res => {
this.$store.dispatch('GetInfo')
this.close()
}).catch(err => {
console.log(err);
})
},
fail: (err) => {
console.log(err);
}
})
},
// 打开头像/性别弹窗
openPopup(e) {
if(e == 'nickname') {
this.nicknameShow = true
} else if (e == 'birthDay') {
this.user.birthDay = this.birthDay*1 || new Date().getTime()
this.dateShow = true
} else {
this.popupType = e
this.show = true
}
},
close() {
this.show = false
this.nicknameShow = false
this.dateShow = false
},
// 展示性别
showSex(e){
return this.sexList[e]
},
// 获取用户信息
getUser() {
getUserProfile().then(response => {
this.user = response.data
this.roleGroup = response.roleGroup
this.postGroup = response.postGroup
})
}
this.$store.dispatch('GetInfo')
// getUserProfile().then(response => {
// this.user = response.data
// this.roleGroup = response.roleGroup
// this.postGroup = response.postGroup
// })
},
// 修改用户信息
updataUser(user) {
uni.showLoading('修改中')
updateUserProfile(user).then(res => {
this.$toast({title: '修改成功'})
this.$store.dispatch('GetInfo')
}).catch(err => {
console.log('修改失败', err);
}).finally(() => {
this.close()
uni.hideLoading()
})
}
}
}
</script>
<style lang="scss">
page {
background-color: #ffffff;
background-color: #f5f5f5;
}
.popup-box {
padding: 20rpx;
.popup-content {
border-radius: 20rpx;
.popup-title {
line-height: 68rpx;
}
.popup-item {
line-height: 88rpx;
}
}
.popup-close {
border-radius: 20rpx;
line-height: 88rpx;
}
}
.popup-box-1 {
padding: 0 38rpx;
border-radius: 15rpx 15rpx 0 0;
overflow: hidden;
.title {
line-height: 100rpx;
}
.input-box {
height: 100rpx;
}
}
</style>

View File

@@ -3,6 +3,12 @@
.f-26 {
font-size: 26rpx;
}
.f-28 {
font-size: 28rpx;
}
.f-32 {
font-size: 32rpx;
}
.f-38 {
font-size: 38rpx;
}
@@ -19,6 +25,16 @@
.ccc {
color: #ccc;
}
.bg-fff {
background-color: #fff;
}
/* 文字对齐 */
.text-left {
text-align: left;
}
.text-right {
text-align: right;
}
/* 边框 */
.border-bottom {
border-bottom: 1rpx solid #000;
@@ -44,10 +60,17 @@
padding-left: 10rpx;
padding-right: 10rpx;
}
.px-2 {
padding-left: 20rpx;
padding-right: 20rpx;
}
.px-3 {
padding-left: 30rpx;
padding-right: 30rpx;
}
.p-3 {
padding: 30rpx;
}
/* 外边距 */
.mt-1 {
margin-top: 10rpx;
@@ -73,6 +96,9 @@
.m-auto {
margin: 0 auto;
}
.mz-30 {
margin: 30rpx 0;
}
/* 布局 */
.flex-wrap {
display: flex;

View File

@@ -2,6 +2,10 @@ const getters = {
token: state => state.user.token,
avatar: state => state.user.avatar,
name: state => state.user.name,
sex: state => state.user.sex,
nickname: state => state.user.nickname,
phonenumber: state => state.user.phonenumber,
birthDay: state => state.user.birthDay,
roles: state => state.user.roles,
permissions: state => state.user.permissions
}

View File

@@ -15,7 +15,8 @@ const user = {
permissions: storage.get(constant.permissions),
sex: storage.get(constant.sex),
nickname: storage.get(constant.nickname),
phonenumber: storage.get(constant.phonenumber)
phonenumber: storage.get(constant.phonenumber),
birthDay: storage.get(constant.birthDay)
},
mutations: {
@@ -42,6 +43,10 @@ const user = {
state.sex = sex
storage.set(constant.sex, sex)
},
SET_BIRTHDAY: (state, birthDay) => {
state.birthDay = birthDay
storage.set(constant.birthDay, birthDay)
},
SET_ROLES: (state, roles) => {
state.roles = roles
storage.set(constant.roles, roles)
@@ -96,13 +101,13 @@ const user = {
GetInfo({ commit, state }) {
return new Promise((resolve, reject) => {
getInfo().then(res => {
console.log('获取用户信息', res);
const user = res.data
const avatar = (user == null || user.avatar == "" || user.avatar == null) ? require("@/static/images/profile.jpg") : baseUrl + user.avatar
const avatar = (user == null || user.avatar == "" || user.avatar == null) ? require("@/static/images/profile.jpg") : user.avatar
const username = (user == null || user.userName == "" || user.userName == null) ? "" : user.userName
const nickname = (user == null || user.nickName == "" || user.nickName == null) ? "" : user.nickName
const phonenumber = (user == null || user.phonenumber == "" || user.phonenumber == null) ? "" : user.phonenumber
const sex = (user == null || user.sex == "" || user.sex == null) ? "" : user.sex
const birthDay = (user == null || user.birthDay == "" || user.birthDay == null) ? "" : user.birthDay
if (res.roles && res.roles.length > 0) {
commit('SET_ROLES', res.roles)
commit('SET_PERMISSIONS', res.permissions)
@@ -114,6 +119,7 @@ const user = {
commit('SET_NICK', nickname)
commit('SET_PHONE', phonenumber)
commit('SET_SEX', sex)
commit('SET_BIRTHDAY', birthDay)
resolve(res)
}).catch(error => {
reject(error)

View File

@@ -1,11 +1,12 @@
const constant = {
avatar: 'vuex_avatar',
name: 'vuex_name',
roles: 'vuex_roles',
permissions: 'vuex_permissions',
sex: 'vuex_sex',
phonenumber: 'vuex_phonenumber',
nickname: 'vuex_nickname'
nickname: 'vuex_nickname',
birthDay: 'vuex_birthDay',
roles: 'vuex_roles',
permissions: 'vuex_permissions'
}
export default constant

74
utils/index.js Normal file
View File

@@ -0,0 +1,74 @@
import { getToken } from '@/utils/auth'
import config from '@/config'
export function uploadImg(url) {
// 默认请求地址
let baseURL = config.fileUploadUrl;
let token = getToken();
return new Promise((resolve, reject) => {
uni.uploadFile({
url: baseURL, // 仅为示例,非真实的接口地址
filePath: url,
name: 'file',
header: {
'Authorization': token ? 'Bearer' + ' ' + token : ''
},
success: (res) => {
console.log('上传成功', res);
uni.hideLoading();
let url = JSON.parse(res.data).data.url;
resolve(url)
},
fail: (error) => {
console.log('上传失败', error);
uni.hideLoading();
uni.showToast({
title: error.msg,
icon: 'none'
})
reject(error)
}
})
})
}
// 日期格式化
export function parseTime(time, pattern) {
if (arguments.length === 0 || !time) {
return null
}
const format = pattern || '{y}-{m}-{d} {h}:{i}:{s}'
let date
if (typeof time === 'object') {
date = time
} else {
if ((typeof time === 'string') && (/^[0-9]+$/.test(time))) {
time = parseInt(time)
} else if (typeof time === 'string') {
time = time.replace(new RegExp(/-/gm), '/').replace('T', ' ').replace(new RegExp(/\.[\d]{3}/gm), '');
}
if ((typeof time === 'number') && (time.toString().length === 10)) {
time = time * 1000
}
date = new Date(time)
}
const formatObj = {
y: date.getFullYear(),
m: date.getMonth() + 1,
d: date.getDate(),
h: date.getHours(),
i: date.getMinutes(),
s: date.getSeconds(),
a: date.getDay()
}
const time_str = format.replace(/{(y|m|d|h|i|s|a)+}/g, (result, key) => {
let value = formatObj[key]
// Note: getDay() returns 0 on Sunday
if (key === 'a') { return ['日', '一', '二', '三', '四', '五', '六'][value] }
if (result.length > 0 && value < 10) {
value = '0' + value
}
return value || 0
})
return time_str
}

View File

@@ -6,7 +6,6 @@ import { toast, showConfirm, tansParams } from '@/utils/common'
let timeout = 10000
const baseUrl = config.baseUrl
console.log(baseUrl)
const request = config => {
// 是否需要设置 token
const isToken = (config.headers || {}).isToken === false
@@ -21,8 +20,6 @@ const request = config => {
config.url = url
}
return new Promise((resolve, reject) => {
console.log('config', config)
console.log('baseUrl', baseUrl)
uni.request({
method: config.method || 'get',
timeout: config.timeout || timeout,
@@ -31,7 +28,6 @@ const request = config => {
header: config.header,
dataType: 'json'
}).then(response => {
console.log(response);
let [error, res] = response
if (error) {
toast('后端接口连接异常')

View File

@@ -4,13 +4,23 @@ import constant from './constant'
let storageKey = 'storage_data'
// 存储节点变量名
let storageNodeKeys = [constant.avatar, constant.name, constant.roles, constant.permissions]
let storageNodeKeys = [
constant.avatar,
constant.name,
constant.sex,
constant.nickname,
constant.phonenumber,
constant.birthDay,
constant.roles,
constant.permissions
]
// 存储的数据
let storageData = uni.getStorageSync(storageKey) || {}
const storage = {
set: function(key, value) {
// console.log(key, value, storageNodeKeys.indexOf(key));
if (storageNodeKeys.indexOf(key) != -1) {
let tmp = uni.getStorageSync(storageKey)
tmp = tmp ? tmp : {}

View File

@@ -1,70 +1,70 @@
import store from '@/store'
import config from '@/config'
import { getToken } from '@/utils/auth'
import errorCode from '@/utils/errorCode'
import { toast, showConfirm, tansParams } from '@/utils/common'
let timeout = 10000
const baseUrl = config.baseUrl
const upload = config => {
// 是否需要设置 token
const isToken = (config.headers || {}).isToken === false
config.header = config.header || {}
if (getToken() && !isToken) {
config.header['Authorization'] = 'Bearer ' + getToken()
}
// get请求映射params参数
if (config.params) {
let url = config.url + '?' + tansParams(config.params)
url = url.slice(0, -1)
config.url = url
}
return new Promise((resolve, reject) => {
uni.uploadFile({
timeout: config.timeout || timeout,
url: baseUrl + config.url,
filePath: config.filePath,
name: config.name || 'file',
header: config.header,
formData: config.formData,
success: (res) => {
let result = JSON.parse(res.data)
const code = result.code || 200
const msg = errorCode[code] || result.msg || errorCode['default']
if (code === 200) {
resolve(result)
} else if (code == 401) {
showConfirm("登录状态已过期,您可以继续留在该页面,或者重新登录?").then(res => {
if (res.confirm) {
store.dispatch('LogOut').then(res => {
uni.reLaunch({ url: '/pages/login/login' })
})
}
})
reject('无效的会话,或者会话已过期,请重新登录。')
} else if (code === 500) {
toast(msg)
reject('500')
} else if (code !== 200) {
toast(msg)
reject(code)
}
},
fail: (error) => {
let { message } = error
if (message == 'Network Error') {
message = '后端接口连接异常'
} else if (message.includes('timeout')) {
message = '系统接口请求超时'
} else if (message.includes('Request failed with status code')) {
message = '系统接口' + message.substr(message.length - 3) + '异常'
}
toast(message)
reject(error)
}
})
})
}
export default upload
import store from '@/store'
import config from '@/config'
import { getToken } from '@/utils/auth'
import errorCode from '@/utils/errorCode'
import { toast, showConfirm, tansParams } from '@/utils/common'
let timeout = 10000
const baseUrl = config.baseUrl
const upload = config => {
// 是否需要设置 token
const isToken = (config.headers || {}).isToken === false
config.header = config.header || {}
if (getToken() && !isToken) {
config.header['Authorization'] = 'Bearer ' + getToken()
}
// get请求映射params参数
if (config.params) {
let url = config.url + '?' + tansParams(config.params)
url = url.slice(0, -1)
config.url = url
}
return new Promise((resolve, reject) => {
uni.uploadFile({
timeout: config.timeout || timeout,
url: baseUrl + config.url,
filePath: config.filePath,
name: config.name || 'file',
header: config.header,
formData: config.formData,
success: (res) => {
let result = JSON.parse(res.data)
const code = result.code || 200
const msg = errorCode[code] || result.msg || errorCode['default']
if (code === 200) {
resolve(result)
} else if (code == 401) {
showConfirm("登录状态已过期,您可以继续留在该页面,或者重新登录?").then(res => {
if (res.confirm) {
store.dispatch('LogOut').then(res => {
uni.reLaunch({ url: '/pages/login/login' })
})
}
})
reject('无效的会话,或者会话已过期,请重新登录。')
} else if (code === 500) {
toast(msg)
reject('500')
} else if (code !== 200) {
toast(msg)
reject(code)
}
},
fail: (error) => {
let { message } = error
if (message == 'Network Error') {
message = '后端接口连接异常'
} else if (message.includes('timeout')) {
message = '系统接口请求超时'
} else if (message.includes('Request failed with status code')) {
message = '系统接口' + message.substr(message.length - 3) + '异常'
}
toast(message)
reject(error)
}
})
})
}
export default upload