From b65feb3ae79a7a8eab4d3fda7c60d31b42da63b8 Mon Sep 17 00:00:00 2001 From: besscroft Date: Wed, 17 Apr 2024 16:24:31 +0800 Subject: [PATCH] =?UTF-8?q?fix:=20=E5=9B=BE=E6=A0=87=E5=92=8C=E6=A0=B7?= =?UTF-8?q?=E5=BC=8F=E4=BF=AE=E6=94=B9=EF=BC=8C=E8=AE=BE=E7=BD=AE=E9=A1=B5?= =?UTF-8?q?=E9=9D=A2=E6=96=B0=E5=B8=83=E5=B1=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- app/(default)/layout.tsx | 9 +-- app/admin/layout.tsx | 23 +++---- app/admin/settings/about/page.tsx | 6 ++ app/admin/settings/layout.tsx | 67 +++++++++++++++++++++ app/admin/settings/page.tsx | 25 +++----- app/admin/settings/preferences/page.tsx | 6 ++ app/admin/settings/storages/page.tsx | 21 +++++++ components/admin/list/ListProps.tsx | 4 +- components/admin/tag/DefaultTag.tsx | 4 +- components/admin/tag/TagList.tsx | 4 +- components/layout/BaseSide.tsx | 50 ++++++++++------ components/layout/DropMenu.tsx | 18 +++--- components/layout/Transitions.tsx | 80 ------------------------- components/layout/VaulDrawer.tsx | 54 ++++++++--------- 14 files changed, 193 insertions(+), 178 deletions(-) create mode 100644 app/admin/settings/about/page.tsx create mode 100644 app/admin/settings/layout.tsx create mode 100644 app/admin/settings/preferences/page.tsx create mode 100644 app/admin/settings/storages/page.tsx delete mode 100644 components/layout/Transitions.tsx diff --git a/app/(default)/layout.tsx b/app/(default)/layout.tsx index a199242..2814b7b 100644 --- a/app/(default)/layout.tsx +++ b/app/(default)/layout.tsx @@ -1,5 +1,4 @@ import Header from '~/components/layout/Header' -import Transitions, { Animate } from '~/components/layout/Transitions' export default async function DefaultLayout({ children, @@ -8,12 +7,8 @@ export default async function DefaultLayout({ }>) { return ( <> - -
- - {children} - - +
+ {children} ); } diff --git a/app/admin/layout.tsx b/app/admin/layout.tsx index 3133db8..e871e23 100644 --- a/app/admin/layout.tsx +++ b/app/admin/layout.tsx @@ -1,6 +1,5 @@ import DashHeader from '~/components/layout/DashHeader' import { BaseSide } from '~/components/layout/BaseSide' -import Transitions, { Animate } from '~/components/layout/Transitions' import { AntdRegistry } from '@ant-design/nextjs-registry' @@ -12,19 +11,15 @@ export default function AdminLayout({ return ( <>
- - -
- -
- - {children} - -
-
- + +
+ +
+ {children} +
+
); diff --git a/app/admin/settings/about/page.tsx b/app/admin/settings/about/page.tsx new file mode 100644 index 0000000..663f161 --- /dev/null +++ b/app/admin/settings/about/page.tsx @@ -0,0 +1,6 @@ + +export default async function About() { + return ( +

关于

+ ) +} \ No newline at end of file diff --git a/app/admin/settings/layout.tsx b/app/admin/settings/layout.tsx new file mode 100644 index 0000000..b12918f --- /dev/null +++ b/app/admin/settings/layout.tsx @@ -0,0 +1,67 @@ +'use client' + +import { usePathname } from 'next/navigation' +import { cn } from '~/utils' +import { Listbox, ListboxItem } from '@nextui-org/react' +import { SlidersHorizontal, Server, Info } from 'lucide-react' +import { useRouter } from 'next-nprogress-bar' + +export default function AdminLayout({ + children, +}: Readonly<{ + children: React.ReactNode; +}>) { + const pathname = usePathname() + const router = useRouter() + + const iconClasses = 'text-xl text-default-500 pointer-events-none flex-shrink-0' + const buttonClasses = 'active:scale-95 duration-200 ease-in-out' + return ( +
+
+ + } + onClick={() => router.push('/admin/settings/preferences')} + > + 首选项 + + } + onClick={() => router.push('/admin/settings/storages')} + > + 存储设置 + + } + onClick={() => router.push('/admin/settings/about')} + > + 关于 + + +
+
+ {children} +
+
+ ) +} diff --git a/app/admin/settings/page.tsx b/app/admin/settings/page.tsx index 6f66b38..0124569 100644 --- a/app/admin/settings/page.tsx +++ b/app/admin/settings/page.tsx @@ -1,25 +1,14 @@ 'use client' -import React from 'react' -import { Tabs, Tab } from '@nextui-org/react' -import SettingsTab from '~/components/admin/settings/SettingsTab' -import AListTabs from '~/components/admin/settings/AListTabs' -import S3Tabs from '~/components/admin/settings/S3Tabs' +import { Settings as SettingsIcon } from 'lucide-react' -export default async function Settings() { +export default function Settings() { return ( -
- - - - - - - - - - - +
+
+ + 在左侧选择一个设置 +
) } \ No newline at end of file diff --git a/app/admin/settings/preferences/page.tsx b/app/admin/settings/preferences/page.tsx new file mode 100644 index 0000000..b15a9af --- /dev/null +++ b/app/admin/settings/preferences/page.tsx @@ -0,0 +1,6 @@ + +export default async function Preferences() { + return ( +

首选项

+ ) +} \ No newline at end of file diff --git a/app/admin/settings/storages/page.tsx b/app/admin/settings/storages/page.tsx new file mode 100644 index 0000000..31eb9a7 --- /dev/null +++ b/app/admin/settings/storages/page.tsx @@ -0,0 +1,21 @@ +'use client' +import React from 'react' + +import { Tabs, Tab } from '@nextui-org/react' +import AListTabs from '~/components/admin/settings/AListTabs' +import S3Tabs from '~/components/admin/settings/S3Tabs' + +export default async function Storages() { + return ( +
+ + + + + + + + +
+ ) +} \ No newline at end of file diff --git a/components/admin/list/ListProps.tsx b/components/admin/list/ListProps.tsx index bf2988b..3caa3e5 100644 --- a/components/admin/list/ListProps.tsx +++ b/components/admin/list/ListProps.tsx @@ -21,7 +21,7 @@ import { Button, Pagination, } from '@nextui-org/react' -import { CaretSortIcon } from '@radix-ui/react-icons' +import { ArrowDown10 } from 'lucide-react' import { ContextMenu, ContextMenuContent, @@ -116,7 +116,7 @@ export default function ListProps(props : Readonly) { } + startContent={} >{image.sort} diff --git a/components/admin/tag/DefaultTag.tsx b/components/admin/tag/DefaultTag.tsx index 1bd69d3..2433801 100644 --- a/components/admin/tag/DefaultTag.tsx +++ b/components/admin/tag/DefaultTag.tsx @@ -1,8 +1,8 @@ 'use client' import { Card, CardBody, CardFooter, CardHeader, Chip, Popover, PopoverContent, PopoverTrigger } from '@nextui-org/react' -import { CaretSortIcon } from '@radix-ui/react-icons' import React from 'react' +import { ArrowDown10 } from 'lucide-react' export default function DefaultTag() { return ( @@ -31,7 +31,7 @@ export default function DefaultTag() { } + startContent={} >-1 diff --git a/components/admin/tag/TagList.tsx b/components/admin/tag/TagList.tsx index 02de4ce..f703536 100644 --- a/components/admin/tag/TagList.tsx +++ b/components/admin/tag/TagList.tsx @@ -19,7 +19,7 @@ import { ModalFooter, Button } from '@nextui-org/react' -import { CaretSortIcon } from '@radix-ui/react-icons' +import { ArrowDown10 } from 'lucide-react' import { ContextMenu, ContextMenuContent, @@ -102,7 +102,7 @@ export default function TagList(props : Readonly) { } + startContent={} >{tag.sort} diff --git a/components/layout/BaseSide.tsx b/components/layout/BaseSide.tsx index ea55d37..098c7a4 100644 --- a/components/layout/BaseSide.tsx +++ b/components/layout/BaseSide.tsx @@ -4,7 +4,8 @@ import { Listbox, ListboxItem} from '@nextui-org/react' import { useSession } from 'next-auth/react' import { usePathname } from 'next/navigation' import { useRouter } from 'next-nprogress-bar' -import { BookmarkIcon, DesktopIcon, GearIcon, Pencil2Icon, RocketIcon } from '@radix-ui/react-icons' +import { Settings, Milestone, Image, ImageUp, MonitorDot } from 'lucide-react' +import { cn } from '~/utils' export const BaseSide = () => { const { data: session, status } = useSession() @@ -16,49 +17,64 @@ export const BaseSide = () => { return (
-
+
} + startContent={} onClick={() => router.push('/admin')} > - 控制台 + 控制台 } + startContent={} onClick={() => router.push('/admin/upload')} > - 上传 + 上传 } + startContent={} onClick={() => router.push('/admin/list')} > - 图片维护 + 图片维护 } + startContent={} onClick={() => router.push('/admin/tag')} > - 标签管理 + 标签管理 } + startContent={} onClick={() => router.push('/admin/settings')} > - 设置 + 设置
diff --git a/components/layout/DropMenu.tsx b/components/layout/DropMenu.tsx index d7959ab..8ab6020 100644 --- a/components/layout/DropMenu.tsx +++ b/components/layout/DropMenu.tsx @@ -7,7 +7,7 @@ import { loginOut } from '~/server/lib/actions' import { useSession } from 'next-auth/react' import { useEffect, useState } from 'react' import { useTheme } from 'next-themes' -import { DesktopIcon, ExitIcon, GitHubLogoIcon, HomeIcon, MoonIcon, PersonIcon, SunIcon } from '@radix-ui/react-icons' +import { Home, MonitorDot, SunMedium, MoonStar, Github, LogOut, LogIn } from 'lucide-react' export const DropMenu = () => { const router = useRouter() @@ -41,7 +41,7 @@ export const DropMenu = () => { pathname.startsWith('/admin') ? } + startContent={} onClick={() => router.push('/')} > 首页 @@ -49,7 +49,7 @@ export const DropMenu = () => { : } + startContent={} onClick={() => router.push('/admin')} > 控制台 @@ -57,7 +57,7 @@ export const DropMenu = () => { } } + startContent={} showDivider >
{ @@ -68,14 +68,14 @@ export const DropMenu = () => { : } + startContent={theme === 'light' ? : } onClick={() => setTheme(theme === 'light' ? 'dark' : 'light')} > { theme === 'light' ? '切换至⌈常夜⌋' : '切换至⌈白夜⌋' } } + startContent={} onClick={() => router.push('https://github.com/besscroft')} > GitHub @@ -87,20 +87,20 @@ export const DropMenu = () => { key="login" showDivider onClick={() => router.push('/login')} - startContent={} + startContent={} > 登录 : } + startContent={theme === 'light' ? : } onClick={() => setTheme(theme === 'light' ? 'dark' : 'light')} > { theme === 'light' ? '切换至⌈常夜⌋' : '切换至⌈白夜⌋' } } + startContent={} onClick={() => router.push('https://github.com/besscroft')} > GitHub diff --git a/components/layout/Transitions.tsx b/components/layout/Transitions.tsx deleted file mode 100644 index fcdb3b0..0000000 --- a/components/layout/Transitions.tsx +++ /dev/null @@ -1,80 +0,0 @@ -'use client' - -import { AnimatePresence, motion } from 'framer-motion' -import { useRouter } from 'next-nprogress-bar' -import { - createContext, - MouseEventHandler, - PropsWithChildren, - use, - useTransition, -} from 'react' - -export const DELAY = 200; - -const sleep = (ms: number) => - new Promise((resolve) => setTimeout(() => resolve(), ms)); -const noop = () => {}; - -type TransitionContext = { - pending: boolean; - navigate: (url: string) => void; -}; -const Context = createContext({ - pending: false, - navigate: noop, -}); -export const usePageTransition = () => use(Context); - -type Props = PropsWithChildren<{ - className?: string; -}>; - -export default function Transitions({ children, className }: Props) { - const [pending, start] = useTransition(); - const router = useRouter(); - - const navigate = (href: string) => { - start(async () => { - router.push(href); - await sleep(DELAY); - }); - }; - - const onClick: MouseEventHandler = (e) => { - const a = (e.target as Element).closest("a"); - if (a) { - e.preventDefault(); - const href = a.getAttribute("href"); - if (href) { - navigate(href); - } - } - }; - - return ( - -
- {children} -
- - ); -} - -export function Animate({ children, className }: Props) { - const { pending } = usePageTransition(); - return ( - - {!pending && ( - - {children} - - )} - - ); -} \ No newline at end of file diff --git a/components/layout/VaulDrawer.tsx b/components/layout/VaulDrawer.tsx index 61d33b8..fc675a2 100644 --- a/components/layout/VaulDrawer.tsx +++ b/components/layout/VaulDrawer.tsx @@ -9,19 +9,19 @@ import { useEffect, useState } from 'react' import { useTheme } from 'next-themes' import { loginOut } from '~/server/lib/actions' import { - BookmarkIcon, - DashboardIcon, - DesktopIcon, - ExitIcon, - GearIcon, - HomeIcon, - InfoCircledIcon, - MoonIcon, - Pencil2Icon, - PersonIcon, - RocketIcon, - SunIcon -} from '@radix-ui/react-icons' + LayoutGrid, + MonitorDot, + ImageUp, + Image, + Milestone, + Settings, + Info, + LogOut, + SunMedium, + MoonStar, + LogIn, + Home +} from 'lucide-react' export default function VaulDrawer() { const { data: session, status } = useSession() @@ -41,7 +41,7 @@ export default function VaulDrawer() { return ( - + @@ -57,7 +57,7 @@ export default function VaulDrawer() { > } + startContent={} onClick={() => router.push('/')} > @@ -66,7 +66,7 @@ export default function VaulDrawer() { } + startContent={} onClick={() => router.push('/about')} showDivider > @@ -76,7 +76,7 @@ export default function VaulDrawer() { } + startContent={} onClick={() => router.push('/admin')} > @@ -85,7 +85,7 @@ export default function VaulDrawer() { } + startContent={} onClick={() => router.push('/admin/upload')} > @@ -94,7 +94,7 @@ export default function VaulDrawer() { } + startContent={} onClick={() => router.push('/admin/list')} > @@ -103,7 +103,7 @@ export default function VaulDrawer() { } + startContent={} onClick={() => router.push('/admin/tag')} > @@ -112,7 +112,7 @@ export default function VaulDrawer() { } + startContent={} onClick={() => router.push('/admin/settings')} showDivider > @@ -122,7 +122,7 @@ export default function VaulDrawer() { } + startContent={} >
{ await loginOut() @@ -132,7 +132,7 @@ export default function VaulDrawer() { : } + startContent={theme === 'light' ? : } onClick={() => setTheme(theme === 'light' ? 'dark' : 'light')} > { theme === 'light' ? '切换至⌈常夜⌋' : '切换至⌈白夜⌋' } @@ -145,7 +145,7 @@ export default function VaulDrawer() { router.push('/')} - startContent={} + startContent={} > 首页 @@ -155,7 +155,7 @@ export default function VaulDrawer() { key="about" showDivider onClick={() => router.push('/about')} - startContent={} + startContent={} > 关于 @@ -164,13 +164,13 @@ export default function VaulDrawer() { router.push('/login')} - startContent={} + startContent={} > 登录 : } + startContent={theme === 'light' ? : } onClick={() => setTheme(theme === 'light' ? 'dark' : 'light')} > { theme === 'light' ? '切换至⌈常夜⌋' : '切换至⌈白夜⌋' }