添加套餐管理不分长短效页面

src/actions/resources.ts

@@ -12,6 +12,7 @@ export interface ResourceListParams {
   created_at_start?: Date
   created_at_end?: Date
   expired?: boolean
+  resource_type?: number
 }
 
 export async function listResourceLong(params: ResourceListParams) {
@@ -71,3 +72,7 @@ export async function ResourceShort(params: {
     params,
   )
 }
+
+export async function listResource(params: ResourceListParams) {
+  return callByUser<PageRecord<Resources>>("/api/admin/resource/page", params)
+}

src/app/(root)/_navigation/index.tsx

@@ -251,6 +251,12 @@ const menuSections: { title: string; items: NavItemProps[] }[] = [
         label: "套餐管理",
         requiredScope: ScopeResourceRead,
       },
+      {
+        href: "/resources-new",
+        icon: Package,
+        label: "新套餐管理",
+        requiredScope: ScopeResourceRead,
+      },
       {
         href: "/batch",
         icon: ClipboardList,

src/app/(root)/appbar.tsx

@@ -84,6 +84,7 @@ export default function Appbar(props: { admin: Admin }) {
       gateway: "网关列表",
       couponList: "已发放优惠券",
       new: "新建文章",
+      "resources-new": "新套餐管理",
     }
 
     if (labels[path]) return labels[path]

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

@@ -80,9 +80,6 @@ type FilterSchema = z.infer<typeof filterSchema>
 
 export default function BillingPage() {
   const searchParams = useSearchParams()
-  const innerNo = searchParams.get("inner_no")
-  const billNo = searchParams.get("bill_no")
-  const resourceNo = searchParams.get("resource_no")
   const [skuOptions, setSkuOptions] = useState<SkuOption[]>([])
   const [loading, setLoading] = useState(true)
   const [skuProductCode, setSkuProductCode] = useState<ProductCode>(
@@ -90,20 +87,38 @@ export default function BillingPage() {
   )
   const router = useRouter()
 
-  const { control, handleSubmit, reset, getValues } = useForm<FilterSchema>({
+  const { control, handleSubmit, reset, getValues, setValue } =
+    useForm<FilterSchema>({
       resolver: zodResolver(filterSchema),
       defaultValues: {
-      bill_no: billNo || "",
-      inner_no: innerNo || "",
+        bill_no: searchParams.get("bill_no") || "",
+        inner_no: searchParams.get("inner_no") || "",
         created_at_start: "",
         created_at_end: "",
         phone: "",
-      resource_no: resourceNo || "",
+        resource_no: searchParams.get("resource_no") || "",
         sku_code: "all",
         product_code: "",
       },
     })
 
+  useEffect(() => {
+    const params = {
+      resource_no: searchParams.get("resource_no"),
+      bill_no: searchParams.get("bill_no"),
+      inner_no: searchParams.get("inner_no"),
+    }
+    if (params.resource_no !== getValues("resource_no")) {
+      setValue("resource_no", params.resource_no || "")
+    }
+    if (params.bill_no !== getValues("bill_no")) {
+      setValue("bill_no", params.bill_no || "")
+    }
+    if (params.inner_no !== getValues("inner_no")) {
+      setValue("inner_no", params.inner_no || "")
+    }
+  }, [searchParams, setValue, getValues])
+
   useEffect(() => {
     setLoading(true)
     getSkuList({

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

@@ -0,0 +1,630 @@
+"use client"
+import { zodResolver } from "@hookform/resolvers/zod"
+import { format, isBefore, isSameDay } from "date-fns"
+import { Box, Loader2, Timer } from "lucide-react"
+import { useRouter, useSearchParams } from "next/navigation"
+import { Suspense, useCallback, useMemo, useState } from "react"
+import { Controller, useForm } from "react-hook-form"
+import { toast } from "sonner"
+import { z } from "zod"
+import { listResource, updateResource } from "@/actions/resources"
+import { DataTable, useDataTable } from "@/components/data-table"
+import { Page } from "@/components/page"
+import { Badge } from "@/components/ui/badge"
+import { Button } from "@/components/ui/button"
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuTrigger,
+} from "@/components/ui/dropdown-menu"
+import {
+  Field,
+  FieldError,
+  FieldGroup,
+  FieldLabel,
+} from "@/components/ui/field"
+import { Input } from "@/components/ui/input"
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+} from "@/components/ui/select"
+import type { Resources } from "@/models/resources"
+
+const filterSchema = z
+  .object({
+    user_phone: z.string().optional(),
+    resource_no: z.string().optional(),
+    status: z.string().optional(),
+    type: z.string().optional(),
+    created_at_start: z.string().optional(),
+    created_at_end: z.string().optional(),
+    expired: z.string().optional(),
+    resource_type: z.string().optional(),
+  })
+  .superRefine((data, ctx) => {
+    if (data.created_at_start && data.created_at_end) {
+      const start = new Date(data.created_at_start)
+      const end = new Date(data.created_at_end)
+
+      if (end < start) {
+        ctx.addIssue({
+          code: z.ZodIssueCode.custom,
+          message: "结束时间不能早于开始时间",
+          path: ["created_at_end"],
+        })
+      }
+    }
+  })
+
+type FormValues = z.infer<typeof filterSchema>
+
+interface FilterParams {
+  user_phone?: string
+  resource_no?: string
+  active?: boolean
+  mode?: number
+  created_at_start?: Date
+  created_at_end?: Date
+  expired?: boolean
+  resource_type?: number
+}
+
+// 获取资源类型
+function getResourceType(resource: Resources): number {
+  if ("short" in resource && resource.short) {
+    return resource.short.type
+  }
+  if ("long" in resource && resource.long) {
+    return resource.long.type
+  }
+  return resource.type
+}
+
+// 获取资源详情对象
+function getResourceDetail(resource: Resources) {
+  if ("short" in resource && resource.short) {
+    return resource.short
+  }
+  if ("long" in resource && resource.long) {
+    return resource.long
+  }
+  return null
+}
+
+// 获取过期时间
+function getExpireAt(resource: Resources): Date | null | undefined {
+  if ("short" in resource && resource.short) {
+    return resource.short.expire_at
+  }
+  if ("long" in resource && resource.long) {
+    return resource.long.expire_at
+  }
+  return undefined
+}
+
+function getName(resource: Resources): string | null | undefined {
+  if ("short" in resource && resource.short) {
+    return resource.short.sku?.name
+  }
+  if ("long" in resource && resource.long) {
+    return resource.long.sku?.name
+  }
+  return undefined
+}
+
+// 获取最近使用时间
+function getLastAt(resource: Resources): Date | null | undefined {
+  if ("short" in resource && resource.short) {
+    return resource.short.last_at
+  }
+  if ("long" in resource && resource.long) {
+    return resource.long.last_at
+  }
+  return undefined
+}
+
+// 资源类型徽章
+function ResourceTypeBadge({ resource }: { resource: Resources }) {
+  const type = getResourceType(resource)
+  if (type === 1) {
+    return (
+      <div className="flex gap-2 items-center bg-green-50 w-fit px-2 py-1 rounded-md">
+        <Timer size={20} />
+        <span>包时</span>
+      </div>
+    )
+  }
+  if (type === 2) {
+    return (
+      <div className="flex gap-2 items-center bg-blue-50 w-fit px-2 py-1 rounded-md">
+        <Box size={20} />
+        <span>包量</span>
+      </div>
+    )
+  }
+  return null
+}
+
+// 过期徽章
+function ExpireBadge({ expireAt }: { expireAt: Date | null | undefined }) {
+  if (!expireAt) return null
+  if (isBefore(expireAt, new Date())) {
+    return <Badge variant="destructive">过期</Badge>
+  }
+  return null
+}
+
+// 格式化日期
+function formatDateTime(date: Date | null | undefined) {
+  if (!date) return ""
+  return format(date, "yyyy-MM-dd HH:mm:ss")
+}
+
+// 计算今日使用量
+function getTodayUsage(lastAt: Date | null | undefined, daily: number) {
+  if (lastAt && isSameDay(lastAt, new Date())) {
+    return daily
+  }
+  return 0
+}
+
+export default function ResourcesPage() {
+  return (
+    <Page>
+      <ResourceList />
+    </Page>
+  )
+}
+
+function ResourceList() {
+  const searchParams = useSearchParams()
+  const resourceNo = searchParams.get("resource_no")
+  const listFn = listResource
+  const [updatingId, setUpdatingId] = useState<number | null>(null)
+  const router = useRouter()
+  const { control, handleSubmit, reset, getValues } = useForm<FormValues>({
+    resolver: zodResolver(filterSchema),
+    defaultValues: {
+      user_phone: "",
+      resource_no: resourceNo || "",
+      status: "all",
+      type: "all",
+      created_at_start: "",
+      created_at_end: "",
+      expired: "all",
+      resource_type: "all",
+    },
+  })
+
+  const fetchResources = useCallback(
+    (page: number, size: number) => {
+      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.resource_type && filters.resource_type !== "all") {
+        result.resource_type = Number(filters.resource_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, getValues],
+  )
+
+  const table = useDataTable<Resources>(fetchResources)
+
+  const handleStatusChange = useCallback(
+    async (resource: Resources, newStatusValue: string) => {
+      const newActive = newStatusValue === "0"
+      if (newActive === resource.active) return
+      setUpdatingId(resource.id)
+      try {
+        await updateResource({
+          id: resource.id,
+          active: newActive,
+        })
+        toast.success("更新成功", {
+          description: `资源状态已更新为${newActive ? "启用" : "禁用"}`,
+        })
+        table.refresh()
+      } catch (error) {
+        console.error("更新状态失败:", error)
+        toast.error("更新失败", {
+          description: error instanceof Error ? error.message : "请稍后重试",
+        })
+      } finally {
+        setUpdatingId(null)
+      }
+    },
+    [table],
+  )
+  const handleCheckipChange = useCallback(
+    async (resource: Resources) => {
+      const newCheckip = !resource.checkip
+      setUpdatingId(resource.id)
+      try {
+        await updateResource({
+          id: resource.id,
+          checkip: newCheckip,
+        })
+        toast.success("更新成功", {
+          description: `IP检查已${newCheckip ? "启用IP检查" : "停用IP检查"}`,
+        })
+        table.refresh()
+      } catch (error) {
+        console.error("更新IP检查状态失败:", error)
+        toast.error("更新失败", {
+          description: error instanceof Error ? error.message : "请稍后重试",
+        })
+      } finally {
+        setUpdatingId(null)
+      }
+    },
+    [table],
+  )
+  const onFilter = handleSubmit(() => {
+    table.pagination.onPageChange(1)
+  })
+
+  const columns = useMemo(
+    () => [
+      {
+        header: "会员号",
+        accessorFn: (row: Resources) => row.user?.phone || "",
+      },
+      {
+        header: "套餐",
+        cell: ({ row }: { row: { original: Resources } }) => {
+          const resourceNo = row.original.resource_no
+          const name = getName(row.original)
+          const expireAt = getExpireAt(row.original)
+          return (
+            <div className="flex flex-col gap-1">
+              <div>{name}</div>
+              <div className="flex items-center gap-2">
+                <DropdownMenu>
+                  <DropdownMenuTrigger asChild>
+                    <span className="text-xs text-gray-500">{resourceNo}</span>
+                  </DropdownMenuTrigger>
+                  <DropdownMenuContent align="end" className="w-40">
+                    <DropdownMenuItem
+                      onClick={() => {
+                        router.push(`/billing?resource_no=${resourceNo}`)
+                      }}
+                    >
+                      账单详情
+                    </DropdownMenuItem>
+                    <DropdownMenuItem
+                      onClick={() => {
+                        router.push(`/batch?resource_no=${resourceNo}`)
+                      }}
+                    >
+                      提取记录
+                    </DropdownMenuItem>
+                    <DropdownMenuItem
+                      onClick={() => {
+                        router.push(`/channel?resource_no=${resourceNo}`)
+                      }}
+                    >
+                      IP管理
+                    </DropdownMenuItem>
+                  </DropdownMenuContent>
+                </DropdownMenu>
+                <ExpireBadge expireAt={expireAt} />
+              </div>
+            </div>
+          )
+        },
+      },
+      {
+        header: "产品",
+        cell: ({ row }: { row: { original: Resources } }) => {
+          const isLong = row.original.code === "long"
+          return <span>{isLong ? "长效" : "短效"}</span>
+        },
+      },
+      {
+        header: "类型",
+        cell: ({ row }: { row: { original: Resources } }) => {
+          return <ResourceTypeBadge resource={row.original} />
+        },
+      },
+      {
+        header: "IP时效",
+        cell: ({ row }: { row: { original: Resources } }) => {
+          const detail = getResourceDetail(row.original)
+          const live = detail?.live
+          if (live === undefined) return "-"
+          return <span>{`${live}分钟`}</span>
+        },
+      },
+      {
+        header: "使用情况",
+        cell: ({ row }: { row: { original: Resources } }) => {
+          const detail = getResourceDetail(row.original)
+          const type = getResourceType(row.original)
+
+          if (!detail) return <span>-</span>
+
+          if (type === 1) {
+            // 包时
+            const todayUsage = getTodayUsage(detail.last_at, detail.daily || 0)
+            return (
+              <div className="flex gap-1">
+                <span>
+                  {todayUsage}/{detail.quota}
+                </span>
+              </div>
+            )
+          } else {
+            return (
+              <div className="flex gap-1">
+                {detail.used < detail.quota ? (
+                  <span className="text-green-500">正常</span>
+                ) : (
+                  <span className="text-red-500">已用完</span>
+                )}
+                <span>|</span>
+                <span>
+                  {detail.used}/{detail.quota}
+                </span>
+              </div>
+            )
+          }
+        },
+      },
+      {
+        header: "最近使用时间",
+        cell: ({ row }: { row: { original: Resources } }) => {
+          const lastAt = getLastAt(row.original)
+          return lastAt ? formatDateTime(lastAt) : "暂未使用"
+        },
+      },
+      {
+        header: "开通时间",
+        cell: ({ row }: { row: { original: Resources } }) => {
+          return formatDateTime(row.original.created_at)
+        },
+      },
+      {
+        header: "到期时间",
+        cell: ({ row }: { row: { original: Resources } }) => {
+          return formatDateTime(getExpireAt(row.original))
+        },
+      },
+      {
+        id: "action",
+        meta: { pin: "right" },
+        header: "操作",
+        cell: ({ row }: { row: { original: Resources } }) => {
+          const resource = row.original
+          const isLoading = updatingId === resource.id
+          const currentActive = resource.active
+          return (
+            <div className="flex items-center gap-2">
+              <Select
+                value={currentActive ? "0" : "1"}
+                onValueChange={val => handleStatusChange(resource, val)}
+                disabled={isLoading}
+              >
+                <SelectTrigger className="min-w-20">
+                  <SelectValue placeholder="状态" />
+                </SelectTrigger>
+                <SelectContent className="min-w-(--radix-select-trigger-width)">
+                  <SelectItem value="0">启用</SelectItem>
+                  <SelectItem value="1">禁用</SelectItem>
+                </SelectContent>
+              </Select>
+              {isLoading && (
+                <Loader2 className="h-4 w-4 animate-spin text-muted-foreground" />
+              )}
+              <Button
+                onClick={() => handleCheckipChange(resource)}
+                variant={resource.checkip ? "destructive" : "default"}
+                disabled={isLoading}
+              >
+                {resource.checkip ? "停用IP检查" : "启用IP检查"}
+              </Button>
+            </div>
+          )
+        },
+      },
+    ],
+    [updatingId, handleStatusChange, handleCheckipChange, router],
+  )
+
+  return (
+    <div className="flex flex-col gap-3 overflow-hidden">
+      <form onSubmit={onFilter} className="bg-card p-4 rounded-lg flex-none">
+        <div className="flex flex-wrap items-end gap-4">
+          <Controller
+            name="user_phone"
+            control={control}
+            render={({ field, fieldState }) => (
+              <Field
+                data-invalid={fieldState.invalid}
+                className="w-40 flex-none"
+              >
+                <FieldLabel>会员号</FieldLabel>
+                <Input {...field} placeholder="请输入会员号" clearable />
+                <FieldError>{fieldState.error?.message}</FieldError>
+              </Field>
+            )}
+          />
+          <Controller
+            name="resource_no"
+            control={control}
+            render={({ field, fieldState }) => (
+              <Field
+                data-invalid={fieldState.invalid}
+                className="w-40 flex-none"
+              >
+                <FieldLabel>套餐号</FieldLabel>
+                <Input {...field} placeholder="请输入套餐号" clearable />
+                <FieldError>{fieldState.error?.message}</FieldError>
+              </Field>
+            )}
+          />
+          <Controller
+            name="resource_type"
+            control={control}
+            render={({ field, fieldState }) => (
+              <Field data-invalid={fieldState.invalid} className="w-32">
+                <FieldLabel>产品</FieldLabel>
+                <Select value={field.value} onValueChange={field.onChange}>
+                  <SelectTrigger>
+                    <SelectValue placeholder="全部" />
+                  </SelectTrigger>
+                  <SelectContent>
+                    <SelectItem value="all">全部</SelectItem>
+                    <SelectItem value="1">短效</SelectItem>
+                    <SelectItem value="2">长效</SelectItem>
+                  </SelectContent>
+                </Select>
+                <FieldError>{fieldState.error?.message}</FieldError>
+              </Field>
+            )}
+          />
+          <Controller
+            name="type"
+            control={control}
+            render={({ field, fieldState }) => (
+              <Field data-invalid={fieldState.invalid} className="w-32">
+                <FieldLabel>类型</FieldLabel>
+                <Select value={field.value} onValueChange={field.onChange}>
+                  <SelectTrigger>
+                    <SelectValue placeholder="全部" />
+                  </SelectTrigger>
+                  <SelectContent>
+                    <SelectItem value="all">全部</SelectItem>
+                    <SelectItem value="1">包时</SelectItem>
+                    <SelectItem value="2">包量</SelectItem>
+                  </SelectContent>
+                </Select>
+                <FieldError>{fieldState.error?.message}</FieldError>
+              </Field>
+            )}
+          />
+          <Controller
+            name="status"
+            control={control}
+            render={({ field, fieldState }) => (
+              <Field data-invalid={fieldState.invalid} className="w-32">
+                <FieldLabel>状态</FieldLabel>
+                <Select value={field.value} onValueChange={field.onChange}>
+                  <SelectTrigger>
+                    <SelectValue placeholder="全部" />
+                  </SelectTrigger>
+                  <SelectContent>
+                    <SelectItem value="all">全部</SelectItem>
+                    <SelectItem value="0">启用</SelectItem>
+                    <SelectItem value="1">禁用</SelectItem>
+                  </SelectContent>
+                </Select>
+                <FieldError>{fieldState.error?.message}</FieldError>
+              </Field>
+            )}
+          />
+          <Controller
+            name="expired"
+            control={control}
+            render={({ field, fieldState }) => (
+              <Field data-invalid={fieldState.invalid} className="w-32">
+                <FieldLabel>是否过期</FieldLabel>
+                <Select value={field.value} onValueChange={field.onChange}>
+                  <SelectTrigger>
+                    <SelectValue placeholder="全部" />
+                  </SelectTrigger>
+                  <SelectContent>
+                    <SelectItem value="all">全部</SelectItem>
+                    <SelectItem value="0">未过期</SelectItem>
+                    <SelectItem value="1">已过期</SelectItem>
+                  </SelectContent>
+                </Select>
+                <FieldError>{fieldState.error?.message}</FieldError>
+              </Field>
+            )}
+          />
+          <Controller
+            name="created_at_start"
+            control={control}
+            render={({ field, fieldState }) => (
+              <Field
+                data-invalid={fieldState.invalid}
+                className="w-40 flex-none"
+              >
+                <FieldLabel>开始时间</FieldLabel>
+                <Input type="date" {...field} clearable />
+                <FieldError>{fieldState.error?.message}</FieldError>
+              </Field>
+            )}
+          />
+          <Controller
+            name="created_at_end"
+            control={control}
+            render={({ field, fieldState }) => (
+              <Field
+                data-invalid={fieldState.invalid}
+                className="w-40 flex-none"
+              >
+                <FieldLabel>结束时间</FieldLabel>
+                <Input type="date" {...field} clearable />
+                <FieldError>{fieldState.error?.message}</FieldError>
+              </Field>
+            )}
+          />
+        </div>
+        <FieldGroup className="flex-row justify-start mt-4 gap-2">
+          <Button type="submit">搜索</Button>
+          <Button
+            type="button"
+            variant="outline"
+            onClick={() => {
+              router.replace("./resources")
+              reset({
+                user_phone: "",
+                resource_no: "",
+                status: "all",
+                type: "all",
+                created_at_start: "",
+                created_at_end: "",
+                expired: "all",
+              })
+              table.pagination.onPageChange(1)
+            }}
+          >
+            重置
+          </Button>
+        </FieldGroup>
+      </form>
+
+      <Suspense fallback={<div className="text-center p-4">加载中...</div>}>
+        <DataTable<Resources>
+          {...table}
+          columns={columns}
+          classNames={{
+            root: "flex-auto overflow-hidden",
+          }}
+        />
+      </Suspense>
+    </div>
+  )
+}

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

@@ -439,7 +439,6 @@ function CheckOrder(props: { trade: Trade; onSuccess: () => void }) {
         trade_no: props.trade.inner_no,
         method: Number(props.trade.method),
       })
-      console.log(res, "res")
 
       if (res.success) {
         setData(res.data)
@@ -486,7 +485,6 @@ function CheckOrder(props: { trade: Trade; onSuccess: () => void }) {
         method: Number(props.trade.method),
         user_id: Number(props.trade.user_id),
       })
-      console.log(result, "resultresultresult")
 
       if (result.success) {
         toast.success("补到余额完成")
@@ -510,7 +508,6 @@ function CheckOrder(props: { trade: Trade; onSuccess: () => void }) {
         method: Number(props.trade.method),
         user_id: Number(props.trade.user_id),
       })
-      console.log(result, "resultresultresult")
 
       if (result.success) {
         toast.success("取消订单完成")
@@ -549,13 +546,13 @@ function CheckOrder(props: { trade: Trade; onSuccess: () => void }) {
                   {data?.Status === 1
                     ? "已支付"
                     : data?.Status === 0
-                      ? "待支付"
+                      ? "未支付"
                       : "已取消"}
                 </p>
               </div>
             </div>
           )}
-          {props && props.trade.status === 0 && (
+          {data && data?.Status === 1 && (
             <div className="flex gap-4 items-center justify-center">
               <Button size="sm" className="w-32" onClick={headerClick}>
                 完成订单
@@ -563,10 +560,12 @@ function CheckOrder(props: { trade: Trade; onSuccess: () => void }) {
               <Button size="sm" className="w-32" onClick={convert}>
                 补到余额
               </Button>
+            </div>
+          )}
+          {data && data?.Status === 0 && (
             <Button size="sm" className="w-32" onClick={cancel}>
               取消订单
             </Button>
-            </div>
           )}
 
           <DialogFooter>

src/models/resources.ts

@@ -11,6 +11,7 @@ type ResourceBase = {
   deleted_at: Date | null
   user: User
   checkip: boolean
+  code: string
 }
 
 type ResourceShort = {