feat: 个人中心(基础框架)
This commit is contained in:
parent
568705b9ab
commit
6d19560863
@ -1,9 +1,10 @@
|
|||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { computed, onMounted } from 'vue';
|
import { computed, onMounted } from 'vue';
|
||||||
|
import { useRouter } from 'vue-router';
|
||||||
|
|
||||||
import { AuthenticationLoginExpiredModal } from '@vben/common-ui';
|
import { AuthenticationLoginExpiredModal } from '@vben/common-ui';
|
||||||
import { VBEN_DOC_URL, VBEN_GITHUB_URL } from '@vben/constants';
|
import { VBEN_DOC_URL, VBEN_GITHUB_URL } from '@vben/constants';
|
||||||
import { BookOpenText, CircleHelp, MdiGithub } from '@vben/icons';
|
import { BookOpenText, CircleHelp, MdiGithub, ProfileIcon } from '@vben/icons';
|
||||||
import {
|
import {
|
||||||
BasicLayout,
|
BasicLayout,
|
||||||
LockScreen,
|
LockScreen,
|
||||||
@ -24,6 +25,7 @@ import { useAuthStore, useNotifyStore } from '#/store';
|
|||||||
const userStore = useUserStore();
|
const userStore = useUserStore();
|
||||||
const authStore = useAuthStore();
|
const authStore = useAuthStore();
|
||||||
const accessStore = useAccessStore();
|
const accessStore = useAccessStore();
|
||||||
|
const router = useRouter();
|
||||||
|
|
||||||
const menus = computed(() => [
|
const menus = computed(() => [
|
||||||
{
|
{
|
||||||
@ -35,6 +37,13 @@ const menus = computed(() => [
|
|||||||
icon: BookOpenText,
|
icon: BookOpenText,
|
||||||
text: $t('widgets.document'),
|
text: $t('widgets.document'),
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
handler: () => {
|
||||||
|
router.push('/profile');
|
||||||
|
},
|
||||||
|
icon: ProfileIcon,
|
||||||
|
text: $t('widgets.profile'),
|
||||||
|
},
|
||||||
{
|
{
|
||||||
handler: () => {
|
handler: () => {
|
||||||
openWindow(VBEN_GITHUB_URL, {
|
openWindow(VBEN_GITHUB_URL, {
|
||||||
|
@ -14,76 +14,11 @@ import { getAllMenusApi, type Menu } from '#/api';
|
|||||||
import { BasicLayout, IFrameView } from '#/layouts';
|
import { BasicLayout, IFrameView } from '#/layouts';
|
||||||
import { $t } from '#/locales';
|
import { $t } from '#/locales';
|
||||||
|
|
||||||
|
import { localMenuList } from './routes/local';
|
||||||
|
|
||||||
const forbiddenComponent = () => import('#/views/_core/fallback/forbidden.vue');
|
const forbiddenComponent = () => import('#/views/_core/fallback/forbidden.vue');
|
||||||
const NotFoundComponent = () => import('#/views/_core/fallback/not-found.vue');
|
const NotFoundComponent = () => import('#/views/_core/fallback/not-found.vue');
|
||||||
|
|
||||||
/**
|
|
||||||
* 这里放本地路由
|
|
||||||
*/
|
|
||||||
const localMenuList: RouteRecordStringComponent[] = [
|
|
||||||
{
|
|
||||||
component: 'BasicLayout',
|
|
||||||
meta: {
|
|
||||||
order: -1,
|
|
||||||
title: 'page.dashboard.title',
|
|
||||||
},
|
|
||||||
name: 'Dashboard',
|
|
||||||
path: '/',
|
|
||||||
redirect: '/analytics',
|
|
||||||
children: [
|
|
||||||
{
|
|
||||||
name: 'Analytics',
|
|
||||||
path: '/analytics',
|
|
||||||
component: '/dashboard/analytics/index',
|
|
||||||
meta: {
|
|
||||||
affixTab: true,
|
|
||||||
title: 'page.dashboard.analytics',
|
|
||||||
},
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: 'Workspace',
|
|
||||||
path: '/workspace',
|
|
||||||
component: '/dashboard/workspace/index',
|
|
||||||
meta: {
|
|
||||||
title: 'page.dashboard.workspace',
|
|
||||||
},
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: 'VbenDocument',
|
|
||||||
path: '/vben-admin/document',
|
|
||||||
component: 'IFrameView',
|
|
||||||
meta: {
|
|
||||||
icon: 'lucide:book-open-text',
|
|
||||||
iframeSrc: 'https://dapdap.top',
|
|
||||||
keepAlive: true,
|
|
||||||
title: $t('page.vben.document'),
|
|
||||||
},
|
|
||||||
},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
component: 'BasicLayout',
|
|
||||||
meta: {
|
|
||||||
hideChildrenInMenu: true,
|
|
||||||
icon: 'lucide:copyright',
|
|
||||||
order: 9999,
|
|
||||||
title: $t('page.vben.about'),
|
|
||||||
},
|
|
||||||
name: 'About',
|
|
||||||
path: '/about',
|
|
||||||
children: [
|
|
||||||
{
|
|
||||||
component: '/_core/about/index',
|
|
||||||
meta: {
|
|
||||||
title: $t('page.vben.about'),
|
|
||||||
},
|
|
||||||
name: 'VbenAbout',
|
|
||||||
path: '/vben-admin/about',
|
|
||||||
},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
];
|
|
||||||
|
|
||||||
async function generateAccess(options: GenerateMenuAndRoutesOptions) {
|
async function generateAccess(options: GenerateMenuAndRoutesOptions) {
|
||||||
const pageMap: ComponentRecordType = import.meta.glob('../views/**/*.vue');
|
const pageMap: ComponentRecordType = import.meta.glob('../views/**/*.vue');
|
||||||
|
|
||||||
|
102
apps/web-antd/src/router/routes/local.ts
Normal file
102
apps/web-antd/src/router/routes/local.ts
Normal file
@ -0,0 +1,102 @@
|
|||||||
|
import type { RouteRecordStringComponent } from '@vben/types';
|
||||||
|
|
||||||
|
import { $t } from '@vben/locales';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 该文件放非后台返回的路由 比如个人中心 等需要跳转显示的页面
|
||||||
|
*/
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 个人中心
|
||||||
|
*/
|
||||||
|
const profileRoute: RouteRecordStringComponent[] = [
|
||||||
|
{
|
||||||
|
component: 'BasicLayout',
|
||||||
|
meta: {
|
||||||
|
hideChildrenInMenu: true,
|
||||||
|
hideInMenu: true,
|
||||||
|
title: $t('widgets.profile'),
|
||||||
|
},
|
||||||
|
name: 'Profile',
|
||||||
|
path: '',
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
component: '/_core/profile/index',
|
||||||
|
meta: {
|
||||||
|
icon: 'mingcute:profile-line',
|
||||||
|
title: $t('widgets.profile'),
|
||||||
|
},
|
||||||
|
name: 'ProfileIndex',
|
||||||
|
path: '/profile',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 这里放本地路由
|
||||||
|
*/
|
||||||
|
export const localMenuList: RouteRecordStringComponent[] = [
|
||||||
|
{
|
||||||
|
component: 'BasicLayout',
|
||||||
|
meta: {
|
||||||
|
order: -1,
|
||||||
|
title: 'page.dashboard.title',
|
||||||
|
},
|
||||||
|
name: 'Dashboard',
|
||||||
|
path: '/',
|
||||||
|
redirect: '/analytics',
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
name: 'Analytics',
|
||||||
|
path: '/analytics',
|
||||||
|
component: '/dashboard/analytics/index',
|
||||||
|
meta: {
|
||||||
|
affixTab: true,
|
||||||
|
title: 'page.dashboard.analytics',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'Workspace',
|
||||||
|
path: '/workspace',
|
||||||
|
component: '/dashboard/workspace/index',
|
||||||
|
meta: {
|
||||||
|
title: 'page.dashboard.workspace',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'VbenDocument',
|
||||||
|
path: '/vben-admin/document',
|
||||||
|
component: 'IFrameView',
|
||||||
|
meta: {
|
||||||
|
icon: 'lucide:book-open-text',
|
||||||
|
iframeSrc: 'https://dapdap.top',
|
||||||
|
keepAlive: true,
|
||||||
|
title: $t('page.vben.document'),
|
||||||
|
},
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
component: 'BasicLayout',
|
||||||
|
meta: {
|
||||||
|
hideChildrenInMenu: true,
|
||||||
|
icon: 'lucide:copyright',
|
||||||
|
order: 9999,
|
||||||
|
title: $t('page.vben.about'),
|
||||||
|
},
|
||||||
|
name: 'About',
|
||||||
|
path: '/about',
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
component: '/_core/about/index',
|
||||||
|
meta: {
|
||||||
|
title: $t('page.vben.about'),
|
||||||
|
},
|
||||||
|
name: 'VbenAbout',
|
||||||
|
path: '/vben-admin/about',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
...profileRoute,
|
||||||
|
];
|
36
apps/web-antd/src/views/_core/profile/index.vue
Normal file
36
apps/web-antd/src/views/_core/profile/index.vue
Normal file
@ -0,0 +1,36 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
import { ref } from 'vue';
|
||||||
|
|
||||||
|
import { Page } from '@vben/common-ui';
|
||||||
|
|
||||||
|
import { Card } from 'ant-design-vue';
|
||||||
|
|
||||||
|
const currentActiveKey = ref('tab1');
|
||||||
|
|
||||||
|
const tabList = [
|
||||||
|
{
|
||||||
|
key: 'tab1',
|
||||||
|
tab: 'tab1',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 'tab2',
|
||||||
|
tab: 'tab2',
|
||||||
|
},
|
||||||
|
];
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<Page>
|
||||||
|
<Card
|
||||||
|
:active-tab-key="currentActiveKey"
|
||||||
|
:tab-list="tabList"
|
||||||
|
@tab-change="
|
||||||
|
(key) => {
|
||||||
|
currentActiveKey = key;
|
||||||
|
}
|
||||||
|
"
|
||||||
|
>
|
||||||
|
dsadsa
|
||||||
|
</Card>
|
||||||
|
</Page>
|
||||||
|
</template>
|
@ -21,3 +21,5 @@ export const CommandLineIcon = createIconifyIcon(
|
|||||||
export const MemoryIcon = createIconifyIcon('la:memory');
|
export const MemoryIcon = createIconifyIcon('la:memory');
|
||||||
|
|
||||||
export const GiteeIcon = createIconifyIcon('simple-icons:gitee');
|
export const GiteeIcon = createIconifyIcon('simple-icons:gitee');
|
||||||
|
// 个人中心
|
||||||
|
export const ProfileIcon = createIconifyIcon('mingcute:profile-line');
|
||||||
|
@ -61,6 +61,7 @@
|
|||||||
},
|
},
|
||||||
"widgets": {
|
"widgets": {
|
||||||
"document": "Document",
|
"document": "Document",
|
||||||
|
"profile": "Profile",
|
||||||
"qa": "Q&A",
|
"qa": "Q&A",
|
||||||
"setting": "Settings",
|
"setting": "Settings",
|
||||||
"logoutTip": "Do you want to logout?",
|
"logoutTip": "Do you want to logout?",
|
||||||
|
@ -61,6 +61,7 @@
|
|||||||
},
|
},
|
||||||
"widgets": {
|
"widgets": {
|
||||||
"document": "文档",
|
"document": "文档",
|
||||||
|
"profile": "个人中心",
|
||||||
"qa": "问题 & 帮助",
|
"qa": "问题 & 帮助",
|
||||||
"setting": "设置",
|
"setting": "设置",
|
||||||
"logoutTip": "是否退出登录?",
|
"logoutTip": "是否退出登录?",
|
||||||
|
Loading…
Reference in New Issue
Block a user