时间显示到秒 & 表格之间的跳转页面

src/app/(root)/resources/page.tsx

@@ -2,6 +2,8 @@
 import { zodResolver } from "@hookform/resolvers/zod"
 import { format, isBefore, isSameDay } from "date-fns"
 import { Box, Loader2, Timer } from "lucide-react"
+import Link from "next/link"
+import { useRouter, useSearchParams } from "next/navigation"
 import { Suspense, useCallback, useMemo, useState } from "react"
 import { Controller, useForm } from "react-hook-form"
 import { toast } from "sonner"
@@ -156,8 +158,8 @@ function ExpireBadge({ expireAt }: { expireAt: Date | null | undefined }) {
 
 // 格式化日期
 function formatDateTime(date: Date | null | undefined) {
-  if (!date) return "-"
-  return format(date, "yyyy-MM-dd HH:mm")
+  if (!date) return ""
+  return format(date, "yyyy-MM-dd HH:mm:ss")
 }
 
 // 计算今日使用量
@@ -200,15 +202,17 @@ interface ResourceListProps {
 }
 
 function ResourceList({ resourceType }: ResourceListProps) {
+  const searchParams = useSearchParams()
+  const resourceNo = searchParams.get("resource_no")
   const isLong = resourceType === "long"
   const listFn = isLong ? listResourceLong : listResourceShort
-  const [filters, setFilters] = useState<FilterParams>({})
   const [updatingId, setUpdatingId] = useState<number | null>(null)
-  const { control, handleSubmit, reset } = useForm<FormValues>({
+  const router = useRouter()
+  const { control, handleSubmit, reset, getValues } = useForm<FormValues>({
     resolver: zodResolver(filterSchema),
     defaultValues: {
       user_phone: "",
-      resource_no: "",
+      resource_no: resourceNo || "",
       status: "all",
       type: "all",
       created_at_start: "",
@@ -219,16 +223,35 @@ function ResourceList({ resourceType }: ResourceListProps) {
 
   const fetchResources = useCallback(
     (page: number, size: number) => {
-      return listFn({ page, size, ...filters })
+      const result: FilterParams = {}
+      const filters = getValues()
+      if (filters.user_phone?.trim())
+        result.user_phone = filters.user_phone.trim()
+      if (filters.resource_no?.trim())
+        result.resource_no = filters.resource_no.trim()
+      if (filters.status && filters.status !== "all") {
+        result.active = filters.status === "0"
+      }
+      if (filters.type && filters.type !== "all") {
+        result.mode = Number(filters.type)
+      }
+      if (filters.expired && filters.expired !== "all") {
+        result.expired = filters.expired === "1"
+      }
+      if (filters.created_at_start)
+        result.created_at_start = new Date(filters.created_at_start)
+      if (filters.created_at_end)
+        result.created_at_end = new Date(filters.created_at_end)
+      return listFn({ page, size, ...result })
     },
-    [listFn, filters],
+    [listFn, getValues],
   )
 
   const table = useDataTable<Resources>(fetchResources)
 
-  const refreshTable = useCallback(() => {
-    setFilters(prev => ({ ...prev }))
-  }, [])
+  // const refreshTable = useCallback(() => {
+  //   setFilters(prev => ({ ...prev }))
+  // }, [])
 
   const handleStatusChange = useCallback(
     async (resource: Resources, newStatusValue: string) => {
@@ -243,7 +266,7 @@ function ResourceList({ resourceType }: ResourceListProps) {
         toast.success("更新成功", {
           description: `资源状态已更新为${newActive ? "启用" : "禁用"}`,
         })
-        refreshTable()
+        table.refresh()
       } catch (error) {
         console.error("更新状态失败:", error)
         toast.error("更新失败", {
@@ -253,7 +276,7 @@ function ResourceList({ resourceType }: ResourceListProps) {
         setUpdatingId(null)
       }
     },
-    [refreshTable],
+    [table],
   )
   const handleCheckipChange = useCallback(
     async (resource: Resources) => {
@@ -267,7 +290,7 @@ function ResourceList({ resourceType }: ResourceListProps) {
         toast.success("更新成功", {
           description: `IP检查已${newCheckip ? "启用IP检查" : "停用IP检查"}`,
         })
-        refreshTable()
+        table.refresh()
       } catch (error) {
         console.error("更新IP检查状态失败:", error)
         toast.error("更新失败", {
@@ -277,27 +300,9 @@ function ResourceList({ resourceType }: ResourceListProps) {
         setUpdatingId(null)
       }
     },
-    [refreshTable],
+    [table],
   )
-  const onFilter = handleSubmit(data => {
-    const result: FilterParams = {}
-    if (data.user_phone?.trim()) result.user_phone = data.user_phone.trim()
-    if (data.resource_no?.trim()) result.resource_no = data.resource_no.trim()
-    if (data.status && data.status !== "all") {
-      result.active = data.status === "0"
-    }
-    if (data.type && data.type !== "all") {
-      result.mode = Number(data.type)
-    }
-    if (data.expired && data.expired !== "all") {
-      result.expired = data.expired === "1"
-    }
-    if (data.created_at_start)
-      result.created_at_start = new Date(data.created_at_start)
-    if (data.created_at_end)
-      result.created_at_end = new Date(data.created_at_end)
-
-    setFilters(result)
+  const onFilter = handleSubmit(() => {
     table.pagination.onPageChange(1)
   })
 
@@ -317,7 +322,14 @@ function ResourceList({ resourceType }: ResourceListProps) {
             <div className="flex flex-col gap-1">
               <div>{name}</div>
               <div className="flex items-center gap-2">
-                <span className="text-xs text-gray-500">{resourceNo}</span>
+                <Link
+                  href={`/batch?resource_no=${resourceNo}`}
+                  target="_blank"
+                  rel="noopener noreferrer"
+                  className="text-xs text-gray-500"
+                >
+                  {resourceNo}
+                </Link>
                 <ExpireBadge expireAt={expireAt} />
               </div>
             </div>
@@ -576,8 +588,16 @@ function ResourceList({ resourceType }: ResourceListProps) {
             type="button"
             variant="outline"
             onClick={() => {
-              reset()
-              setFilters({})
+              router.replace("./resources")
+              reset({
+                user_phone: "",
+                resource_no: "",
+                status: "all",
+                type: "all",
+                created_at_start: "",
+                created_at_end: "",
+                expired: "all",
+              })
               table.pagination.onPageChange(1)
             }}
           >