138 lines
2.7 KiB
Vue
138 lines
2.7 KiB
Vue
<!-- 底部导航栏：我的 -->
|
||
<template>
|
||
<view class="content">
|
||
|
||
<view class="userInfo">
|
||
<uv-image src="../../static/avatar.png" width="120rpx" height="120rpx" shape="circle" />
|
||
<view class="right">
|
||
<h3 class="nickName">{{ userInfo?.nickName }}</h3>
|
||
<p class="tag">{{ userInfo?.dept.deptName }}</p>
|
||
</view>
|
||
|
||
</view>
|
||
|
||
<view style="margin-top: 24rpx;">
|
||
<uni-list>
|
||
<uni-list-item v-for="(item, index) in menuList" :key="item.id" :title="item.title" :thumb="item.thumb"
|
||
thumb-size="sm" link @click="item.click" clickable />
|
||
</uni-list>
|
||
</view>
|
||
<uni-popup ref="popupRef" type="center" background-color="#fff" borderRadius="8px">
|
||
<view class="popup-wrap" style="width: 200rpx; ">
|
||
<view class="popup-body">
|
||
<p>确定退出登录吗？</p>
|
||
<view class="popup-btn">
|
||
<uv-button type="primary" @click="toLogout" text="确定"></uv-button>
|
||
<uv-button @click="close" type="info " text="取消"></uv-button>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</uni-popup>
|
||
</view>
|
||
</template>
|
||
|
||
<script setup>
|
||
import { ref } from "vue";
|
||
import { logout } from "@/api/login"
|
||
|
||
const userInfo = ref(null)
|
||
const popupRef = ref()
|
||
const menuList = [
|
||
{
|
||
id: 1,
|
||
title: '用户协议',
|
||
thumb: '../../static/userAgreement.svg',
|
||
click: () => {
|
||
console.log('用户协议')
|
||
}
|
||
},
|
||
{
|
||
id: 2,
|
||
title: '发布交易信息',
|
||
thumb: '../../static/postTradeInfo.svg',
|
||
click: () => {
|
||
console.log('发布交易信息')
|
||
}
|
||
},
|
||
{
|
||
id: 3,
|
||
title: '退出登录',
|
||
thumb: '../../static/exit.svg',
|
||
click: () => {
|
||
console.log('退出登录')
|
||
popupRef.value.open()
|
||
}
|
||
}
|
||
]
|
||
// 退出登录
|
||
const toLogout = () => {
|
||
logout().then((res) => {
|
||
uni.removeStorage('app_user')
|
||
uni.removeStorage('app_roles')
|
||
uni.removeStorage('app_permissions')
|
||
uni.navigateTo({
|
||
url: '/pages/login/login'
|
||
});
|
||
})
|
||
}
|
||
// 弹窗：关闭登录二次确认弹窗
|
||
const close = () => {
|
||
popupRef.value.close()
|
||
}
|
||
// 获取缓存内的用户信息
|
||
const getUserInfo = () => {
|
||
uni.getStorage({
|
||
key: 'app_user',
|
||
success: ({ data }) => {
|
||
userInfo.value = data
|
||
},
|
||
fail: (error) => { }
|
||
})
|
||
}
|
||
getUserInfo();
|
||
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.userInfo {
|
||
background-color: #fff;
|
||
padding: 36rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.right {
|
||
margin-left: 48rpx;
|
||
}
|
||
|
||
.tag {
|
||
margin-top: 36rpx;
|
||
padding: 6rpx 16rpx;
|
||
font-size: 12px;
|
||
color: #fff;
|
||
border-radius: 8px;
|
||
background-color: #4682B4;
|
||
}
|
||
}
|
||
|
||
.popup-wrap {
|
||
padding: 24rpx;
|
||
border-radius: 8px;
|
||
}
|
||
.popup-body{
|
||
p{
|
||
font-size: 14px;
|
||
font-weight: 500;
|
||
}
|
||
}
|
||
.popup-btn {
|
||
margin-top: 20px;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
.uv-button-wrapper{
|
||
width: 40%;
|
||
margin-left: 8rpx;
|
||
|
||
}
|
||
}
|
||
</style>
|