feat(core): 初始化项目基础架构和CMS功能模块
- 添加Docker相关配置文件(.dockerignore, .env.example, .gitignore) - 实现服务端API代理功能,支持文件、模块和服务器API转发 - 创建文章详情页、栏目文章列表页和单页内容展示页面 - 集成Ant Design Vue组件库并实现SSR样式提取功能 - 定义API响应数据结构类型和应用布局组件 - 开发开发者应用中心和文章管理页面 - 实现CMS导航菜单获取和多租户切换功能
This commit is contained in:
86
app/pages/profile.vue
Normal file
86
app/pages/profile.vue
Normal file
@@ -0,0 +1,86 @@
|
||||
<template>
|
||||
<div class="mx-auto max-w-screen-md px-4 py-8">
|
||||
<a-card title="个人资料" :bordered="false">
|
||||
<div class="flex items-center gap-4">
|
||||
<a-avatar :size="64" :src="avatarUrl">
|
||||
<template v-if="!avatarUrl" #icon>
|
||||
<UserOutlined />
|
||||
</template>
|
||||
</a-avatar>
|
||||
<div class="min-w-0">
|
||||
<div class="text-lg font-semibold text-gray-900">
|
||||
{{ user?.nickname || user?.username || '未命名用户' }}
|
||||
</div>
|
||||
<div class="text-gray-500">
|
||||
{{ user?.phone || (user as any)?.mobile || '' }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<a-divider />
|
||||
|
||||
<a-descriptions :column="1" size="small" bordered>
|
||||
<a-descriptions-item label="用户ID">{{ user?.userId }}</a-descriptions-item>
|
||||
<a-descriptions-item label="账号">{{ user?.username }}</a-descriptions-item>
|
||||
<a-descriptions-item label="昵称">{{ user?.nickname }}</a-descriptions-item>
|
||||
<a-descriptions-item label="手机号">{{ user?.phone || (user as any)?.mobile }}</a-descriptions-item>
|
||||
<a-descriptions-item label="租户ID">{{ tenantId }}</a-descriptions-item>
|
||||
</a-descriptions>
|
||||
|
||||
<div class="mt-6 flex justify-end gap-2">
|
||||
<a-button @click="navigateTo('/')">返回首页</a-button>
|
||||
<a-button danger type="primary" @click="logout">退出登录</a-button>
|
||||
</div>
|
||||
</a-card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { computed, onMounted, ref } from 'vue'
|
||||
import { message } from 'ant-design-vue'
|
||||
import { UserOutlined } from '@ant-design/icons-vue'
|
||||
import { getUserInfo } from '@/api/layout'
|
||||
import type { User } from '@/api/system/user/model'
|
||||
import { getTenantId } from '@/utils/domain'
|
||||
import { getToken, removeToken } from '@/utils/token-util'
|
||||
|
||||
const user = ref<User | null>(null)
|
||||
const tenantId = computed(() => getTenantId())
|
||||
const avatarUrl = computed(() => {
|
||||
const candidate =
|
||||
user.value?.avatarUrl ||
|
||||
user.value?.avatar ||
|
||||
user.value?.merchantAvatar ||
|
||||
user.value?.logo ||
|
||||
''
|
||||
if (typeof candidate !== 'string') return ''
|
||||
const normalized = candidate.trim()
|
||||
if (!normalized || normalized === 'null' || normalized === 'undefined') return ''
|
||||
return normalized
|
||||
})
|
||||
|
||||
function logout() {
|
||||
removeToken()
|
||||
try {
|
||||
localStorage.removeItem('TenantId')
|
||||
localStorage.removeItem('UserId')
|
||||
} catch {
|
||||
// ignore
|
||||
}
|
||||
navigateTo('/')
|
||||
}
|
||||
|
||||
onMounted(async () => {
|
||||
if (!getToken()) {
|
||||
message.error('请先登录')
|
||||
await navigateTo('/login?from=/profile')
|
||||
return
|
||||
}
|
||||
try {
|
||||
user.value = await getUserInfo()
|
||||
} catch (e: unknown) {
|
||||
console.error(e)
|
||||
message.error('获取用户信息失败')
|
||||
}
|
||||
})
|
||||
</script>
|
||||
Reference in New Issue
Block a user