diff --git a/src/assets/index.scss b/src/assets/index.scss index 4fad8d0..cafd4f3 100644 --- a/src/assets/index.scss +++ b/src/assets/index.scss @@ -79,6 +79,39 @@ body { } } } +.userinfo-drop-menu{ + @apply drop-shadow bg-gray-50 pb-2 rounded px-4; + .user-profile{ + @apply py-3; + .info{ + min-width: 100px; + } + .user-avatar{ + width: 36px; + height: 36px; + } + } + .menu-list-container{ + .ant-dropdown-menu{ + @apply shadow-none bg-transparent p-0 rounded-none; + .ant-dropdown-menu-item{ + @apply hover:bg-gray-200 text-gray-600 hover:text-gray-800 rounded-none text-base py-2; + } + .nav-item{ + @apply flex items-center; + .svg-icon{ + transform: translateY(1px); + } + .nav-text{ + @apply ml-2; + } + } + } + } + .logout{ + @apply text-center py-2 hover:bg-gray-200 text-gray-600 hover:text-gray-800 cursor-pointer; + } +} .news-detail-content-container{ margin-right: -30px; padding-right: 30px; diff --git a/src/components/icons/index.tsx b/src/components/icons/index.tsx index 79de615..ba6b990 100644 --- a/src/components/icons/index.tsx +++ b/src/components/icons/index.tsx @@ -92,7 +92,7 @@ export const IconAddText = ({style, className}: IconProps) => ( export const IconVideo = ({style, className}: IconProps) => ( ) diff --git a/src/routes/layout/dashboard-layout.tsx b/src/routes/layout/dashboard-layout.tsx index 41648b0..69979fb 100644 --- a/src/routes/layout/dashboard-layout.tsx +++ b/src/routes/layout/dashboard-layout.tsx @@ -1,5 +1,5 @@ import {Outlet, useLocation, useNavigate} from "react-router-dom"; -import {Dropdown, MenuProps} from "antd"; +import {Divider, Dropdown, MenuProps} from "antd"; import React, {useEffect} from "react"; import AuthGuard from "@/routes/layout/auth-guard.tsx"; @@ -11,6 +11,7 @@ import {DashboardNavigation} from "@/routes/layout/dashboard-navigation.tsx"; import useAuth from "@/hooks/useAuth.ts"; import {hidePhone} from "@/util/strings.ts"; import {defaultCache} from "@/hooks/useCache.ts"; +import {IconVideo} from "@/components/icons"; type LayoutProps = { @@ -20,19 +21,21 @@ type LayoutProps = { const NavigationUserContainer = () => { const {logout, user} = useAuth() const navigate = useNavigate() + const handleLogout = ()=>{ + logout().then(() => navigate('/user')) + } const items: MenuProps['items'] = [ - // { - // key: 'profile', - // label: