146 lines
3.3 KiB
Vue
146 lines
3.3 KiB
Vue
<template>
|
||
<view class="w-user-info">
|
||
<avatar :name="userDetail.username" :src="userDetail.avatar" :size="70" :showName="false"></avatar>
|
||
<view class="w-user-name">{{userDetail.username}}</view>
|
||
<uni-tag class="w-user-role" type="warning" size="mini" :text="role" inverted v-for="(role, i) in (userDetail.roles || [])"
|
||
:key="`r${i}`"></uni-tag>
|
||
</view>
|
||
<uni-list class="w-user-items">
|
||
<uni-list-item thumb="/static/image/dept.png" clickable>
|
||
<template v-slot:body>
|
||
<text class="w-items-t">所属部门</text>
|
||
</template>
|
||
<template v-slot:footer>
|
||
<text class="w-items-f">{{userDept}}</text>
|
||
</template>
|
||
</uni-list-item>
|
||
<uni-list-item thumb="/static/image/entry.png" clickable>
|
||
<template v-slot:body>
|
||
<text class="w-items-t">入职时间</text>
|
||
</template>
|
||
<template v-slot:footer>
|
||
<text class="w-items-f">{{userDetail.entryDate}}</text>
|
||
</template>
|
||
</uni-list-item>
|
||
<!-- #ifdef APP-VUE -->
|
||
<uni-list-item thumb="/static/image/download.png" clickable showArrow>
|
||
<template v-slot:body>
|
||
<text class="w-items-t">已下载的附件</text>
|
||
</template>
|
||
</uni-list-item>
|
||
<!-- #endif -->
|
||
<uni-list-item thumb="/static/image/agent.png" clickable showArrow @click="editAgent">
|
||
<template v-slot:body>
|
||
<text class="w-items-t">设置代理人</text>
|
||
</template>
|
||
<template v-slot:footer>
|
||
<text class="w-items-f">{{userAgentText}}</text>
|
||
</template>
|
||
</uni-list-item>
|
||
</uni-list>
|
||
<button class="w-user-logout" @click="logout" plain="true" type="warn">退出/切换 账号</button>
|
||
</template>
|
||
|
||
<script setup>
|
||
import Avatar from '@/components/Avatar.vue'
|
||
import { getUserDetail } from '@/api/org.js'
|
||
import { onShow } from "@dcloudio/uni-app";
|
||
import { computed, onBeforeMount, ref } from "vue";
|
||
|
||
const userDetail = ref({})
|
||
|
||
//当前登录的用户
|
||
const loginUser = uni.getStorageSync('loginUser')
|
||
|
||
const userDept = computed(() => {
|
||
return (userDetail.value.depts || []).length === 0 ? '未设置部门' : userDetail.value.depts.join('、')
|
||
})
|
||
|
||
const userAgentText = computed(() => {
|
||
const agent = userDetail.value.userAgent
|
||
if (!agent) {
|
||
return '未设置'
|
||
} else {
|
||
return `（${agent.user.name}）${agent.effective ? '代理中':'代理未生效'}`
|
||
}
|
||
})
|
||
|
||
onShow(() => {
|
||
getUserDept()
|
||
})
|
||
|
||
function getUserDept() {
|
||
getUserDetail(loginUser.userId).then(rsp => {
|
||
userDetail.value = rsp.data
|
||
}).catch(err => {
|
||
|
||
})
|
||
}
|
||
|
||
function logout() {
|
||
uni.clearStorage()
|
||
uni.navigateTo({
|
||
url: '/pages/login/login'
|
||
})
|
||
}
|
||
|
||
function editAgent() {
|
||
uni.navigateTo({
|
||
url: '/pages/my/UserAgent'
|
||
})
|
||
}
|
||
</script>
|
||
|
||
<style lang="less" scoped>
|
||
.w-user-info {
|
||
font-size: 32rpx;
|
||
padding: 64rpx 0 6rpx 0;
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: center;
|
||
align-items: center;
|
||
background-color: white;
|
||
|
||
.uni-tag {
|
||
font-weight: 400;
|
||
}
|
||
|
||
|
||
.w-user-name {
|
||
font-size: 35rpx;
|
||
margin: 10rpx 0;
|
||
}
|
||
|
||
.w-user-role {
|
||
margin: 16rpx 0;
|
||
}
|
||
}
|
||
|
||
.w-user-logout {
|
||
width: 90%;
|
||
margin-top: 48rpx;
|
||
font-size: 30rpx;
|
||
}
|
||
|
||
.w-user-items {
|
||
margin-top: 16rpx;
|
||
}
|
||
|
||
.w-items-t {
|
||
padding: 16rpx 0;
|
||
font-size: 32rpx;
|
||
display: flex;
|
||
flex: 1;
|
||
color: #3b4144;
|
||
flex-direction: column;
|
||
justify-content: space-between;
|
||
overflow: hidden;
|
||
}
|
||
|
||
.w-items-f {
|
||
font-size: 29rpx;
|
||
color: #797171;
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
</style> |