From 5154a53ff561ffdc7211a0c967543539bde4cbcf Mon Sep 17 00:00:00 2001 From: j2rong4cn <253551464@qq.com> Date: Sun, 2 Jun 2024 11:27:36 +0800 Subject: [PATCH 1/3] =?UTF-8?q?=E7=BD=AE=E9=A1=B6=E6=AD=A3=E5=9C=A8?= =?UTF-8?q?=E8=BF=90=E8=A1=8C=E7=9A=84=E4=BB=BB=E5=8A=A1?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/manage/tasks/Task.tsx | 2 +- src/pages/manage/tasks/Tasks.tsx | 10 +++++----- 2 files changed, 6 insertions(+), 6 deletions(-) diff --git a/src/pages/manage/tasks/Task.tsx b/src/pages/manage/tasks/Task.tsx index 1ee29d01b..c40a8fad2 100644 --- a/src/pages/manage/tasks/Task.tsx +++ b/src/pages/manage/tasks/Task.tsx @@ -15,7 +15,7 @@ import { PEmptyResp, TaskInfo } from "~/types" import { handleResp, notify, r } from "~/utils" import { TasksProps } from "./Tasks" -enum TaskStateEnum { +export enum TaskStateEnum { Pending, Running, Succeeded, diff --git a/src/pages/manage/tasks/Tasks.tsx b/src/pages/manage/tasks/Tasks.tsx index 695f949d2..04a2dcd1b 100644 --- a/src/pages/manage/tasks/Tasks.tsx +++ b/src/pages/manage/tasks/Tasks.tsx @@ -4,7 +4,7 @@ import { Paginator } from "~/components" import { useFetch, useT } from "~/hooks" import { PEmptyResp, PResp, TaskInfo } from "~/types" import { handleResp, r } from "~/utils" -import { Task } from "./Task" +import { Task, TaskStateEnum } from "./Task" export interface TasksProps { type: string @@ -22,10 +22,10 @@ export const Tasks = (props: TasksProps) => { handleResp(resp, (data) => setTasks( data?.sort((a, b) => { - if (a.id > b.id) { - return 1 - } - return -1 + if (a.state === b.state) return a.id > b.id ? 1 : -1 + if (a.state == TaskStateEnum.Pending) return 1 + if (b.state == TaskStateEnum.Pending) return -1 + return a.state > b.state ? 1 : -1 }) ?? [], ), ) From 0e6b392dc6af568d6d4b21bf0fafce5252c5a84c Mon Sep 17 00:00:00 2001 From: j2rong4cn <253551464@qq.com> Date: Sun, 2 Jun 2024 11:31:57 +0800 Subject: [PATCH 2/3] =?UTF-8?q?=E9=80=89=E9=A1=B5=E5=99=A8=E6=94=AF?= =?UTF-8?q?=E6=8C=81=E8=B7=B3=E8=BD=AC=E6=8C=87=E5=AE=9A=E9=A1=B5=E6=95=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/Paginator.tsx | 71 ++++++++++++++++++++--- src/pages/manage/common/DeletePopover.tsx | 2 +- 2 files changed, 63 insertions(+), 10 deletions(-) diff --git a/src/components/Paginator.tsx b/src/components/Paginator.tsx index 289803bf8..443469a0e 100644 --- a/src/components/Paginator.tsx +++ b/src/components/Paginator.tsx @@ -1,7 +1,17 @@ -import { Button, HStack, IconButton } from "@hope-ui/solid" +import { + Button, + HStack, + IconButton, + Popover, + PopoverArrow, + PopoverBody, + PopoverContent, + PopoverTrigger, +} from "@hope-ui/solid" import { createMemo, For, mergeProps, Show } from "solid-js" import { createStore } from "solid-js/store" import { FaSolidAngleLeft, FaSolidAngleRight } from "solid-icons/fa" +import { TbSelector } from "solid-icons/tb" export interface PaginatorProps { colorScheme?: @@ -54,6 +64,9 @@ export const Paginator = (props: PaginatorProps) => { ) return Array.from({ length: max - current }, (_, i) => current + 1 + i) }) + const allPages = createMemo(() => { + return Array.from({ length: pages() }, (_, i) => 1 + i) + }) const size = { "@initial": "sm", "@md": "md", @@ -101,14 +114,54 @@ export const Paginator = (props: PaginatorProps) => { )} - + + + {({ onClose }) => ( + <> + 10 ? "$2_5" : "$3"} + rightIcon={ + pages() > merged.maxShowPage ? : undefined + } + iconSpacing="0" + > + {store.current} + + merged.maxShowPage}> + + + + + {(page) => { + return ( + + ) + }} + + + + + + )} + + {(page) => ( - ) + merged.maxShowPage ? onOpen : undefined} + > + 10 ? "$2_5" : "$3"} + {...(pages() > merged.maxShowPage + ? popoverTriggerProps + : undefined)} + > + {store.current} + + + + + + {(page) => { + return ( + + ) + }} + + + diff --git a/src/pages/manage/tasks/Tasks.tsx b/src/pages/manage/tasks/Tasks.tsx index 04a2dcd1b..f29261f50 100644 --- a/src/pages/manage/tasks/Tasks.tsx +++ b/src/pages/manage/tasks/Tasks.tsx @@ -17,24 +17,23 @@ export const Tasks = (props: TasksProps) => { (): PResp => r.get(`/admin/task/${props.type}/${props.done}`), ) const [tasks, setTasks] = createSignal([]) + let compareFn: (a: TaskInfo, b: TaskInfo) => number const refresh = async () => { const resp = await get() - handleResp(resp, (data) => - setTasks( - data?.sort((a, b) => { - if (a.state === b.state) return a.id > b.id ? 1 : -1 - if (a.state == TaskStateEnum.Pending) return 1 - if (b.state == TaskStateEnum.Pending) return -1 - return a.state > b.state ? 1 : -1 - }) ?? [], - ), - ) + handleResp(resp, (data) => setTasks(data?.sort(compareFn) ?? [])) } - refresh() if (props.done === "undone") { + compareFn = (a, b) => { + if (a.state === b.state) return a.id > b.id ? 1 : -1 + if (a.state == TaskStateEnum.Pending) return 1 + if (b.state == TaskStateEnum.Pending) return -1 + return a.state > b.state ? 1 : -1 + } + const interval = setInterval(refresh, 2000) onCleanup(() => clearInterval(interval)) - } + } else compareFn = (a, b) => (a.id > b.id ? 1 : -1) + refresh() const [clearDoneLoading, clearDone] = useFetch( (): PEmptyResp => r.post(`/admin/task/${props.type}/clear_done`), )