客户查询添加操作功能

This commit is contained in:
Eamon
2026-04-09 17:08:59 +08:00
parent cc7e26561d
commit 790180a847
24 changed files with 2261 additions and 108 deletions

View File

@@ -16,3 +16,19 @@ export async function getPageBatch(params: {
}) {
return callByUser<PageRecord<Batch>>("/api/admin/batch/page", params)
}
export async function getBatch(params: {
page: number
size: number
user_id: number
user_phone?: string
resource_no?: string
batch_no?: string
prov?: string
city?: string
isp?: string
created_at_start?: Date
created_at_end?: Date
}) {
return callByUser<PageRecord<Batch>>("/api/admin/batch/page/of-user", params)
}

View File

@@ -26,3 +26,19 @@ export async function getSkuList(params: { product_code?: ProductCode }) {
}
return callByUser<ProductSku[]>("/api/admin/product/sku/all", requestParams)
}
export async function getBill(params: {
page: number
size: number
user_id: number
bill_no?: string
user_phone?: string
trade_inner_no?: string
resource_no?: string
sku_code?: string
product_code?: string
created_at_start?: Date
created_at_end?: Date
}) {
return callByUser<PageRecord<Billing>>("/api/admin/bill/page/of-user", params)
}

View File

@@ -16,3 +16,21 @@ export async function getPageChannel(params: {
}) {
return callByUser<PageRecord<Channel>>("/api/admin/channel/page", params)
}
export async function getChannel(params: {
page: number
size: number
user_id: number
batch_no?: string
user_phone?: string
resource_no?: string
proxy_port?: number
proxy_host?: string
node_ip?: string
expired_at_start?: Date
expired_at_end?: Date
}) {
return callByUser<PageRecord<Channel>>(
"/api/admin/channel/page/of-user",
params,
)
}

View File

@@ -31,3 +31,17 @@ export async function listResourceShort(params: ResourceListParams) {
export async function updateResource(data: { id: number; active?: boolean }) {
return callByUser<Resources>("/api/admin/resource/update", data)
}
export async function ResourceLong(params: ResourceListParams) {
return callByUser<PageRecord<Resources>>(
"/api/admin/resource/long/page/of-user",
params,
)
}
export async function ResourceShort(params: ResourceListParams) {
return callByUser<PageRecord<Resources>>(
"/api/admin/resource/short/page/of-user",
params,
)
}

View File

@@ -15,3 +15,18 @@ export async function getPageTrade(params: {
}) {
return callByUser<PageRecord<Trade>>("/api/admin/trade/page", params)
}
export async function getTrade(params: {
page: number
size: number
user_id: number
user_phone?: string
inner_no?: string
method?: number
platform?: number
status?: number
created_at_start?: Date
created_at_end?: Date
}) {
return callByUser<PageRecord<Trade>>("/api/admin/trade/page/of-user", params)
}

View File

@@ -23,6 +23,6 @@ export async function bindAdmin(params: {
})
}
export async function getPageUser(params: object) {
export async function getPageUser(params: { phone?: string; name?: string }) {
return callByUser<User>("/api/admin/user/get", params)
}

View File

@@ -45,14 +45,15 @@ export default function Appbar(props: { admin: Admin }) {
return () => document.removeEventListener("mousedown", handleClickOutside)
}, [])
// 根据路径生成面包屑
const generateBreadcrumbs = () => {
const paths = pathname.split("/").filter(Boolean)
const hiddenSegments = ["client"]
const filteredPaths = paths.filter(path => !hiddenSegments.includes(path))
const breadcrumbs = [
{ path: "/", label: "首页" },
...paths.map((path, index) => {
const url = `/${paths.slice(0, index + 1).join("/")}`
...filteredPaths.map((path, index) => {
const originalIndex = paths.findIndex(p => p === path)
const url = `/${paths.slice(0, originalIndex + 1).join("/")}`
const label = getBreadcrumbLabel(path)
return { path: url, label }
}),
@@ -67,7 +68,7 @@ export default function Appbar(props: { admin: Admin }) {
content: "内容管理",
articles: "文章管理",
media: "媒体库",
user: "用户管理",
user: "客户认领",
roles: "角色权限",
settings: "系统设置",
logs: "系统日志",

View File

@@ -24,7 +24,7 @@ import {
import type { Batch } from "@/models/batch"
type APIFilterParams = {
phone?: string
user_phone?: string
batch_no?: string
resource_no?: string
prov?: string
@@ -84,7 +84,7 @@ export default function BatchPage() {
const onFilter = handleSubmit(data => {
const result: APIFilterParams = {}
if (data.user_phone?.trim()) result.phone = data.user_phone.trim()
if (data.user_phone?.trim()) result.user_phone = data.user_phone.trim()
if (data.batch_no?.trim()) result.batch_no = data.batch_no.trim()
if (data.resource_no?.trim()) result.resource_no = data.resource_no.trim()
if (data.prov?.trim()) result.prov = data.prov.trim()

View File

@@ -0,0 +1,263 @@
"use client"
import { zodResolver } from "@hookform/resolvers/zod"
import { format } from "date-fns"
import { useSearchParams } from "next/navigation"
import { Suspense, useState } from "react"
import { Controller, useForm } from "react-hook-form"
import { z } from "zod"
import { getBatch } from "@/actions/batch"
import { DataTable, useDataTable } from "@/components/data-table"
import { Button } from "@/components/ui/button"
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 { Batch } from "@/models/batch"
type APIFilterParams = {
user_id: number
phone?: string
batch_no?: string
resource_no?: string
prov?: string
city?: string
isp?: string
created_at_start?: Date
created_at_end?: Date
}
const filterSchema = z
.object({
user_phone: z.string().optional(),
resource_no: z.string().optional(),
batch_no: z.string().optional(),
prov: z.string().optional(),
city: z.string().optional(),
isp: z.string().optional(),
created_at_start: z.string().optional(),
created_at_end: 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 FilterSchema = z.infer<typeof filterSchema>
export default function BatchPage() {
const searchParams = useSearchParams()
const userId = searchParams.get("userId")
const [filters, setFilters] = useState<APIFilterParams>({
user_id: Number(userId),
})
const { control, handleSubmit, reset } = useForm<FilterSchema>({
resolver: zodResolver(filterSchema),
defaultValues: {
resource_no: "",
batch_no: "",
prov: "",
city: "",
isp: "all",
created_at_start: "",
created_at_end: "",
},
})
const table = useDataTable<Batch>((page, size) =>
getBatch({ page, size, ...filters }),
)
const onFilter = handleSubmit(data => {
const result: APIFilterParams = {
user_id: Number(userId),
}
if (data.user_phone?.trim()) result.phone = data.user_phone.trim()
if (data.batch_no?.trim()) result.batch_no = data.batch_no.trim()
if (data.resource_no?.trim()) result.resource_no = data.resource_no.trim()
if (data.prov?.trim()) result.prov = data.prov.trim()
if (data.city?.trim()) result.city = data.city.trim()
if (data.isp && data.isp !== "all") result.isp = data.isp
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)
table.pagination.onPageChange(1)
})
return (
<div className="space-y-3">
{/* 筛选表单 */}
<form onSubmit={onFilter} className="bg-white p-4 rounded-lg">
<div className="flex flex-wrap items-end gap-4">
<Controller
name="batch_no"
control={control}
render={({ field, fieldState }) => (
<Field
data-invalid={fieldState.invalid}
className="w-40 flex-none"
>
<FieldLabel></FieldLabel>
<Input {...field} placeholder="请输入批次号" />
<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="请输入套餐号" />
<FieldError>{fieldState.error?.message}</FieldError>
</Field>
)}
/>
<Controller
name="prov"
control={control}
render={({ field, fieldState }) => (
<Field
data-invalid={fieldState.invalid}
className="w-32 flex-none"
>
<FieldLabel></FieldLabel>
<Input {...field} placeholder="请输入省份" />
<FieldError>{fieldState.error?.message}</FieldError>
</Field>
)}
/>
<Controller
name="city"
control={control}
render={({ field, fieldState }) => (
<Field
data-invalid={fieldState.invalid}
className="w-32 flex-none"
>
<FieldLabel></FieldLabel>
<Input {...field} placeholder="请输入城市" />
<FieldError>{fieldState.error?.message}</FieldError>
</Field>
)}
/>
<Controller
name="isp"
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>
<SelectItem value="3"></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} />
<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} />
<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={() => {
reset()
setFilters({ user_id: Number(userId) })
table.pagination.onPageChange(1)
}}
>
</Button>
</FieldGroup>
</form>
<Suspense fallback={<div>Loading...</div>}>
<DataTable<Batch>
{...table}
columns={[
{
header: "会员号",
accessorFn: row => row.user?.phone || "-",
},
{ header: "套餐号", accessorKey: "resource.resource_no" },
{ header: "批次号", accessorKey: "batch_no" },
{ header: "省份", accessorKey: "prov" },
{ header: "城市", accessorKey: "city" },
{ header: "提取IP", accessorKey: "ip" },
{ header: "运营商", accessorKey: "isp" },
{ header: "提取数量", accessorKey: "count" },
{
header: "提取时间",
accessorKey: "time",
cell: ({ row }) =>
format(new Date(row.original.time), "yyyy-MM-dd HH:mm"),
},
]}
/>
</Suspense>
</div>
)
}

View File

@@ -0,0 +1,452 @@
"use client"
import { zodResolver } from "@hookform/resolvers/zod"
import { format } from "date-fns"
import { CreditCard, Wallet } from "lucide-react"
import { useSearchParams } from "next/navigation"
import { Suspense, useEffect, useState } from "react"
import { Controller, useForm } from "react-hook-form"
import { toast } from "sonner"
import { z } from "zod"
import { getBill, getSkuList } from "@/actions/bill"
import { DataTable, useDataTable } from "@/components/data-table"
import { Button } from "@/components/ui/button"
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 { ProductCode } from "@/lib/base"
import type { Billing } from "@/models/billing"
type FilterValues = {
user_id: number
bill_no?: string
user_phone?: string
trade_inner_no?: string
resource_no?: string
sku_code?: string
product_code?: string
created_at_start?: Date
created_at_end?: Date
}
type SkuOption = {
resource_code: string
resource_name: string
}
const filterSchema = z
.object({
phone: z
.string()
.optional()
.transform(val => val?.trim()),
bill_no: z
.string()
.optional()
.transform(val => val?.trim()),
resource_no: z.string().optional(),
inner_no: z.string().optional(),
created_at_start: z.string().optional(),
created_at_end: z.string().optional(),
product_code: z.string().optional(),
sku_code: 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 FilterSchema = z.infer<typeof filterSchema>
export default function BillingPage() {
const searchParams = useSearchParams()
const userId = searchParams.get("userId")
const [filters, setFilters] = useState<FilterValues>({
user_id: Number(userId),
})
const [skuOptions, setSkuOptions] = useState<SkuOption[]>([])
const [loading, setLoading] = useState(true)
const [skuProductCode, setSkuProductCode] = useState<ProductCode>(
ProductCode.All,
)
const { control, handleSubmit, reset } = useForm<FilterSchema>({
resolver: zodResolver(filterSchema),
defaultValues: {
bill_no: "",
inner_no: "",
created_at_start: "",
created_at_end: "",
phone: "",
resource_no: "",
sku_code: "all",
product_code: "",
},
})
useEffect(() => {
setLoading(true)
getSkuList({
product_code: skuProductCode,
})
.then(resp => {
if (!resp.success) {
throw new Error(resp.message)
}
setSkuOptions(
resp.data.map(sku => ({
resource_code: sku.code,
resource_name: sku.name,
})),
)
})
.catch(e => {
console.error("获取套餐类型失败:", e)
toast.error(
`获取套餐类型失败:${e instanceof Error ? e.message : String(e)}`,
)
setSkuOptions([])
})
.finally(() => {
setLoading(false)
})
}, [skuProductCode])
const table = useDataTable<Billing>((page, size) =>
getBill({ page, size, ...filters }),
)
const onFilter = handleSubmit(data => {
const result: FilterValues = {
user_id: Number(userId),
}
if (data.phone?.trim()) result.user_phone = data.phone.trim()
if (data.inner_no?.trim()) result.trade_inner_no = data.inner_no.trim()
if (data.bill_no?.trim()) result.bill_no = data.bill_no.trim()
if (data.resource_no?.trim()) result.resource_no = data.resource_no.trim()
if (data.product_code && data.product_code !== ProductCode.All) {
result.product_code = data.product_code
}
if (data.sku_code && data.sku_code !== "all") {
result.sku_code = data.sku_code
}
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)
table.pagination.onPageChange(1)
})
return (
<div className="space-y-3">
<form onSubmit={onFilter} className="bg-white p-4">
<div className="flex flex-wrap items-end gap-4">
<Controller
name="resource_no"
control={control}
render={({ field, fieldState }) => (
<Field
data-invalid={fieldState.invalid}
className="w-40 flex-none"
>
<FieldLabel></FieldLabel>
<Input {...field} placeholder="请输入套餐号" />
<FieldError>{fieldState.error?.message}</FieldError>
</Field>
)}
/>
<Controller
name="bill_no"
control={control}
render={({ field, fieldState }) => (
<Field
data-invalid={fieldState.invalid}
className="w-40 flex-none"
>
<FieldLabel></FieldLabel>
<Input {...field} placeholder="请输入账单号" />
<FieldError>{fieldState.error?.message}</FieldError>
</Field>
)}
/>
<Controller
name="inner_no"
control={control}
render={({ field, fieldState }) => (
<Field
data-invalid={fieldState.invalid}
className="w-40 flex-none"
>
<FieldLabel></FieldLabel>
<Input {...field} placeholder="请输入订单号" />
<FieldError>{fieldState.error?.message}</FieldError>
</Field>
)}
/>
<Controller
name="product_code"
control={control}
render={({ field, fieldState }) => (
<Field
data-invalid={fieldState.invalid}
className="w-32 flex-none"
>
<FieldLabel></FieldLabel>
<Select
value={skuProductCode}
onValueChange={value => {
setSkuProductCode(value as ProductCode)
field.onChange(value)
}}
>
<SelectTrigger>
<SelectValue
placeholder={"请选择"}
defaultValue={
skuProductCode === ProductCode.All ? "全部" : ""
}
/>
</SelectTrigger>
<SelectContent>
<SelectItem value={ProductCode.All}></SelectItem>
<SelectItem value={ProductCode.Short}></SelectItem>
<SelectItem value={ProductCode.Long}></SelectItem>
</SelectContent>
</Select>
</Field>
)}
/>
<Controller
name="sku_code"
control={control}
render={({ field, fieldState }) => (
<Field
data-invalid={fieldState.invalid}
className="w-32 flex-none"
>
<FieldLabel></FieldLabel>
<Select
value={loading ? undefined : field.value || "all"}
onValueChange={field.onChange}
>
<SelectTrigger>
<SelectValue placeholder={loading ? "加载中..." : "全部"} />
</SelectTrigger>
<SelectContent>
<SelectItem value="all"></SelectItem>
{skuOptions.map(option => (
<SelectItem
key={option.resource_code}
value={option.resource_code}
>
{option.resource_name || option.resource_code}
</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} />
<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} />
<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={() => {
reset()
setSkuProductCode(ProductCode.All)
setFilters({ user_id: Number(userId) })
table.pagination.onPageChange(1)
}}
>
</Button>
</FieldGroup>
</form>
<Suspense>
<DataTable<Billing>
{...table}
columns={[
{ header: "套餐号", accessorKey: "resource.resource_no" },
{
header: "账单详情",
accessorKey: "info",
cell: ({ row }) => {
const bill = row.original
return (
<div className="flex items-center gap-2">
<div className="shrink-0">
{bill.type === 1 && (
<div className="flex gap-2 items-center bg-orange-50 w-fit px-2 py-1 rounded-md">
<CreditCard size={16} />
<span></span>
</div>
)}
{bill.type === 2 && (
<div className="flex gap-2 items-center bg-green-50 w-fit px-2 py-1 rounded-md">
<CreditCard size={16} />
<span>退</span>
</div>
)}
{bill.type === 3 && (
<div className="flex gap-2 items-center bg-blue-50 w-fit px-2 py-1 rounded-md">
<CreditCard size={16} />
<span></span>
</div>
)}
</div>
<div className="text-sm">{bill.info}</div>
</div>
)
},
},
{
header: "应付金额",
accessorKey: "amount",
cell: ({ row }) => {
const amount =
typeof row.original.amount === "string"
? parseFloat(row.original.amount)
: row.original.amount || 0
return (
<div className="flex gap-1">
<span
className={
amount > 0 ? "text-green-500" : "text-orange-500"
}
>
{amount.toFixed(2)}
</span>
</div>
)
},
},
{
header: "实付金额",
accessorKey: "actual",
cell: ({ row }) => {
const actual =
typeof row.original.actual === "string"
? parseFloat(row.original.actual)
: row.original.actual || 0
return (
<div className="flex gap-1">
<span
className={
actual > 0 ? "text-green-500" : "text-orange-500"
}
>
{actual.toFixed(2)}
</span>
</div>
)
},
},
{ header: "账单号", accessorKey: "bill_no" },
{
header: "订单号",
accessorKey: "trade.inner_no",
cell: ({ row }) => {
const bill = row.original
return (
<div className="flex items-center gap-2">
<div className="shrink-0 w-20">
{bill.trade?.acquirer === 1 && (
<div className="flex gap-2 items-center bg-blue-50 w-fit px-2 py-1 rounded-md">
<CreditCard size={16} />
<span></span>
</div>
)}
{bill.trade?.acquirer === 2 && (
<div className="flex gap-2 items-center bg-green-50 w-fit px-2 py-1 rounded-md">
<CreditCard size={16} />
<span></span>
</div>
)}
{bill.trade?.acquirer === 3 && (
<div className="flex gap-2 items-center bg-orange-50 w-fit px-2 py-1 rounded-md">
<CreditCard size={16} />
<span></span>
</div>
)}
{!bill.trade?.acquirer && (
<div className="flex gap-2 items-center bg-red-50 w-full px-2 py-1 rounded-md">
<Wallet size={16} />
<span></span>
</div>
)}
</div>
<div className="text-sm">{bill.trade?.inner_no}</div>
</div>
)
},
},
{
header: "创建时间",
accessorKey: "created_at",
cell: ({ row }) =>
format(new Date(row.original.created_at), "yyyy-MM-dd HH:mm"),
},
]}
/>
</Suspense>
</div>
)
}

View File

@@ -0,0 +1,320 @@
"use client"
import { zodResolver } from "@hookform/resolvers/zod"
import { format } from "date-fns"
import { useSearchParams } from "next/navigation"
import { Suspense, useState } from "react"
import { Controller, useForm } from "react-hook-form"
import { z } from "zod"
import { getChannel } from "@/actions/channel"
import { DataTable, useDataTable } from "@/components/data-table"
import { Badge } from "@/components/ui/badge"
import { Button } from "@/components/ui/button"
import {
Field,
FieldError,
FieldGroup,
FieldLabel,
} from "@/components/ui/field"
import { Input } from "@/components/ui/input"
import type { Channel } from "@/models/channel"
type FilterValues = {
user_id: number
batch_no?: string
user_phone?: string
resource_no?: string
proxy_host?: string
proxy_port?: number
node_ip?: string
expired_at_start?: Date
expired_at_end?: Date
}
const filterSchema = z
.object({
batch_no: z.string().optional(),
user_phone: z.string().optional(),
resource_no: z.string().optional(),
proxy_host: z.string().optional(),
proxy_port: z.string().optional(),
node_ip: z.string().optional(),
expired_at_start: z.string().optional(),
expired_at_end: z.string().optional(),
})
.superRefine((data, ctx) => {
if (data.expired_at_start && data.expired_at_end) {
const start = new Date(data.expired_at_start)
const end = new Date(data.expired_at_end)
if (end < start) {
ctx.addIssue({
code: z.ZodIssueCode.custom,
message: "结束时间不能早于开始时间",
path: ["expired_at_end"],
})
}
}
})
type FilterSchema = z.infer<typeof filterSchema>
const ispMap: Record<number, string> = {
1: "电信",
2: "联通",
3: "移动",
}
export default function ChannelPage() {
const searchParams = useSearchParams()
const userId = searchParams.get("userId")
const [filters, setFilters] = useState<FilterValues>({
user_id: Number(userId),
})
const { control, handleSubmit, reset } = useForm<FilterSchema>({
resolver: zodResolver(filterSchema),
defaultValues: {
batch_no: "",
user_phone: "",
resource_no: "",
proxy_port: "",
proxy_host: "",
node_ip: "",
expired_at_start: "",
expired_at_end: "",
},
})
const table = useDataTable<Channel>((page, size) =>
getChannel({ page, size, ...filters }),
)
const onFilter = handleSubmit(data => {
const result: FilterValues = {
user_id: Number(userId),
}
if (data.batch_no?.trim()) result.batch_no = data.batch_no.trim()
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.proxy_host?.trim()) result.proxy_host = data.proxy_host.trim()
if (data.proxy_port?.trim())
result.proxy_port = Number(data.proxy_port.trim())
if (data.node_ip?.trim()) result.node_ip = data.node_ip.trim()
if (data.expired_at_start)
result.expired_at_start = new Date(data.expired_at_start)
if (data.expired_at_end)
result.expired_at_end = new Date(data.expired_at_end)
setFilters(result)
table.pagination.onPageChange(1)
})
return (
<div className="space-y-3">
<form onSubmit={onFilter} className="bg-white p-4 rounded-lg">
<div className="flex flex-wrap items-end gap-4">
<Controller
name="batch_no"
control={control}
render={({ field, fieldState }) => (
<Field
data-invalid={fieldState.invalid}
className="w-40 flex-none"
>
<FieldLabel></FieldLabel>
<Input {...field} placeholder="请输入批次号" />
<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="请输入套餐号" />
<FieldError>{fieldState.error?.message}</FieldError>
</Field>
)}
/>
<Controller
name="proxy_host"
control={control}
render={({ field, fieldState }) => (
<Field
data-invalid={fieldState.invalid}
className="w-40 flex-none"
>
<FieldLabel>IP</FieldLabel>
<Input {...field} placeholder="请输入代理IP" />
<FieldError>{fieldState.error?.message}</FieldError>
</Field>
)}
/>
<Controller
name="proxy_port"
control={control}
render={({ field, fieldState }) => (
<Field
data-invalid={fieldState.invalid}
className="w-32 flex-none"
>
<FieldLabel></FieldLabel>
<Input {...field} placeholder="请输入代理端口" />
<FieldError>{fieldState.error?.message}</FieldError>
</Field>
)}
/>
<Controller
name="node_ip"
control={control}
render={({ field, fieldState }) => (
<Field
data-invalid={fieldState.invalid}
className="w-40 flex-none"
>
<FieldLabel></FieldLabel>
<Input {...field} placeholder="请输入节点" />
<FieldError>{fieldState.error?.message}</FieldError>
</Field>
)}
/>
<Controller
name="expired_at_start"
control={control}
render={({ field, fieldState }) => (
<Field
data-invalid={fieldState.invalid}
className="w-40 flex-none"
>
<FieldLabel></FieldLabel>
<Input type="date" {...field} />
<FieldError>{fieldState.error?.message}</FieldError>
</Field>
)}
/>
<Controller
name="expired_at_end"
control={control}
render={({ field, fieldState }) => (
<Field
data-invalid={fieldState.invalid}
className="w-40 flex-none"
>
<FieldLabel></FieldLabel>
<Input type="date" {...field} />
<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={() => {
reset()
setFilters({ user_id: Number(userId) })
table.pagination.onPageChange(1)
}}
>
</Button>
</FieldGroup>
</form>
<Suspense>
<DataTable<Channel>
{...table}
columns={[
{
header: "会员号",
accessorFn: row => row.user?.phone || "-",
},
{ header: "套餐号", accessorKey: "resource.resource_no" },
{ header: "批次号", accessorKey: "batch_no" },
{
header: "节点",
accessorFn: row => row.ip || row.edge_ref || row.edge_id,
},
{
header: "自动配置",
cell: ({ row }) => {
const prov = row.original.filter_prov
const city = row.original.filter_city
const isp = row.original.filter_isp
const parts = []
if (prov && prov !== "all") parts.push(prov)
if (city && city !== "all") parts.push(city)
if (isp && isp !== "all") {
parts.push(ispMap[Number(isp)] || isp)
}
return (
<div className="text-sm">
{parts.length > 0 ? parts.join(" / ") : "不限"}
</div>
)
},
},
{
header: "网关地址",
accessorKey: "host",
cell: ({ row }) => {
return (
<span>
{row.original.host}:{row.original.port}
</span>
)
},
},
{
header: "认证方式",
cell: ({ row }) => {
const channel = row.original
const hasWhitelist =
channel.whitelists && channel.whitelists.trim() !== ""
const hasAuth = channel.username && channel.password
return (
<div className="flex flex-col gap-1 min-w-0">
{hasWhitelist ? (
<div className="flex flex-col">
<span></span>
<div className="flex flex-wrap gap-1 max-w-50">
{channel.whitelists.split(",").map(ip => (
<Badge key={ip.trim()} variant="secondary">
{ip.trim()}
</Badge>
))}
</div>
</div>
) : hasAuth ? (
<div className="flex flex-col">
<span></span>
<Badge variant="secondary">
{channel.username}:{channel.password}
</Badge>
</div>
) : (
<span className="text-sm text-gray-400"></span>
)}
</div>
)
},
},
{
header: "过期时间",
accessorKey: "expired_at",
cell: ({ row }) =>
format(new Date(row.original.expired_at), "yyyy-MM-dd HH:mm"),
},
]}
/>
</Suspense>
</div>
)
}

View File

@@ -1,7 +1,8 @@
"use client"
import { zodResolver } from "@hookform/resolvers/zod"
import { format } from "date-fns"
import { Suspense, useCallback, useEffect, useState } from "react"
import { useRouter } from "next/navigation"
import { Suspense, useCallback, useState } from "react"
import { Controller, useForm } from "react-hook-form"
import { toast } from "sonner"
import { z } from "zod"
@@ -21,12 +22,20 @@ import {
} from "@/components/ui/field"
import { Input } from "@/components/ui/input"
import {
ScopeBatchReadOfUser,
ScopeBillReadOfUser,
ScopeChannelReadOfUser,
ScopeResourceRead,
ScopeTradeReadOfUser,
ScopeUserWrite,
ScopeUserWriteBalance,
ScopeUserWriteBalanceDec,
ScopeUserWriteBalanceInc,
} from "@/lib/scopes"
import type { Cust } from "@/models/cust"
import type { User } from "@/models/user"
import { AddUserDialog } from "../../cust/create"
// import { ResourcesDialog } from "./resourcesDialog"
interface UserQueryParams {
account?: string
@@ -34,7 +43,7 @@ interface UserQueryParams {
}
const filterSchema = z.object({
account: z.string().optional(),
phone: z.string().optional(),
name: z.string().optional(),
})
@@ -44,18 +53,19 @@ export default function UserQueryPage() {
const [userList, setUserList] = useState<User[]>([])
const [loading, setLoading] = useState(false)
const [depositDialog, setDepositDialog] = useState(false)
const [deposit, setDeposit] = useState<Cust | null>(null)
const [deposit, setDeposit] = useState<User | null>(null)
const [deductionDialog, setDeductionDialog] = useState(false)
const [deduction, setDeduction] = useState<Cust | null>(null)
const [deduction, setDeduction] = useState<User | null>(null)
const [isEditDialogOpen, setIsEditDialogOpen] = useState(false)
const [currentEditUser, setCurrentEditUser] = useState<Cust | null>(null)
const [currentEditUser, setCurrentEditUser] = useState<User | null>(null)
const [currentFilters, setCurrentFilters] = useState<UserQueryParams>({})
const [isAddDialogOpen, setIsAddDialogOpen] = useState(false)
const router = useRouter()
const { control, handleSubmit, reset } = useForm<FormValues>({
resolver: zodResolver(filterSchema),
defaultValues: {
account: "",
phone: "",
name: "",
},
})
@@ -64,8 +74,6 @@ export default function UserQueryPage() {
setLoading(true)
try {
const res = await getPageUser(filters)
console.log(res, "res")
if (res.success) {
const data = Array.isArray(res.data) ? res.data : [res.data]
setUserList(data)
@@ -81,26 +89,28 @@ export default function UserQueryPage() {
}
}, [])
useEffect(() => {
fetchUsers()
}, [fetchUsers])
const onFilter = handleSubmit((data: FormValues) => {
const params: UserQueryParams = {}
if (data.account?.trim()) params.account = data.account.trim()
if (data.phone?.trim()) params.account = data.phone.trim()
if (data.name?.trim()) params.name = data.name.trim()
if (Object.keys(params).length === 0) {
toast.info("请至少输入一个筛选条件")
return
}
setCurrentFilters(params)
fetchUsers(params)
})
const refreshTable = useCallback(() => {
if (Object.keys(currentFilters).length > 0) {
fetchUsers(currentFilters)
}
}, [fetchUsers, currentFilters])
const handleReset = () => {
reset()
setCurrentFilters({})
fetchUsers()
setUserList([])
}
return (
@@ -108,15 +118,15 @@ export default function UserQueryPage() {
<form onSubmit={onFilter} className="bg-white p-4">
<div className="flex flex-wrap items-end gap-4">
<Controller
name="account"
name="phone"
control={control}
render={({ field, fieldState }) => (
<Field
data-invalid={fieldState.invalid}
className="w-80 flex-none"
className="w-40 flex-none"
>
<FieldLabel>//</FieldLabel>
<Input {...field} placeholder="请输入账号/手机号/邮箱" />
<FieldLabel></FieldLabel>
<Input {...field} placeholder="请输入手机号" />
<FieldError>{fieldState.error?.message}</FieldError>
</Field>
)}
@@ -143,6 +153,11 @@ export default function UserQueryPage() {
<Button type="button" variant="outline" onClick={handleReset}>
</Button>
<Auth scope={ScopeUserWrite}>
<Button type="button" onClick={() => setIsAddDialogOpen(true)}>
</Button>
</Auth>
</FieldGroup>
</form>
@@ -246,7 +261,7 @@ export default function UserQueryPage() {
header: "操作",
cell: ({ row }) => {
return (
<div className="flex gap-2">
<div className="flex flex-wrap gap-2 w-75">
<Auth scope={ScopeUserWriteBalanceInc}>
<Button
size="sm"
@@ -261,6 +276,7 @@ export default function UserQueryPage() {
<Auth scope={ScopeUserWriteBalanceDec}>
<Button
size="sm"
variant="destructive"
onClick={() => {
setDeduction(row.original)
setDeductionDialog(true)
@@ -280,6 +296,62 @@ export default function UserQueryPage() {
</Button>
</Auth>
<Auth scope={ScopeTradeReadOfUser}>
<Button
size="sm"
onClick={() => {
router.push(`/client/trade?userId=${row.original.id}`)
}}
>
</Button>
</Auth>
<Auth scope={ScopeBillReadOfUser}>
<Button
size="sm"
onClick={() => {
router.push(
`/client/billing?userId=${row.original.id}`,
)
}}
>
</Button>
</Auth>
<Auth scope={ScopeResourceRead}>
<Button
size="sm"
onClick={() => {
router.push(
`/client/resources?userId=${row.original.id}`,
)
}}
>
</Button>
</Auth>
<Auth scope={ScopeBatchReadOfUser}>
<Button
size="sm"
onClick={() => {
router.push(`/client/batch?userId=${row.original.id}`)
}}
>
</Button>
</Auth>
<Auth scope={ScopeChannelReadOfUser}>
<Button
size="sm"
onClick={() => {
router.push(
`/client/channel?userId=${row.original.id}`,
)
}}
>
IP管理
</Button>
</Auth>
</div>
)
},
@@ -287,7 +359,11 @@ export default function UserQueryPage() {
]}
/>
</Suspense>
<AddUserDialog
open={isAddDialogOpen}
onOpenChange={setIsAddDialogOpen}
onSuccess={refreshTable}
/>
<UpdateDialog
open={isEditDialogOpen}
onOpenChange={setIsEditDialogOpen}

View File

@@ -0,0 +1,572 @@
"use client"
import { zodResolver } from "@hookform/resolvers/zod"
import { format, isBefore, isSameDay } from "date-fns"
import { Box, Loader2, Timer } from "lucide-react"
import { 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 {
ResourceLong,
ResourceShort,
updateResource,
} from "@/actions/resources"
import { DataTable, useDataTable } from "@/components/data-table"
import { Badge } from "@/components/ui/badge"
import { Button } from "@/components/ui/button"
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 { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs"
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(),
})
.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_id: number
user_phone?: string
resource_no?: string
active?: boolean
mode?: number
created_at_start?: Date
created_at_end?: Date
expired?: boolean
}
// 获取资源类型
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")
}
// 计算今日使用量
function getTodayUsage(lastAt: Date | null | undefined, daily: number) {
if (lastAt && isSameDay(lastAt, new Date())) {
return daily
}
return 0
}
export default function ResourcesPage() {
return (
<div>
<Tabs defaultValue="short">
<TabsList className="bg-card p-1.5 rounded-lg">
<TabsTrigger
value="short"
className="w-30 h-9 data-[state=active]:bg-primary-muted text-base rounded-md"
>
</TabsTrigger>
<TabsTrigger
value="long"
className="w-30 h-9 data-[state=active]:bg-primary-muted text-base rounded-md"
>
</TabsTrigger>
</TabsList>
<TabsContent value="short" className="flex flex-col gap-4">
<ResourceList resourceType="short" />
</TabsContent>
<TabsContent value="long" className="flex flex-col gap-4">
<ResourceList resourceType="long" />
</TabsContent>
</Tabs>
</div>
)
}
interface ResourceListProps {
resourceType: "long" | "short"
}
function ResourceList({ resourceType }: ResourceListProps) {
const searchParams = useSearchParams()
const userId = searchParams.get("userId")
const [filters, setFilters] = useState<FilterParams>({
user_id: Number(userId),
})
const isLong = resourceType === "long"
const listFn = isLong ? ResourceLong : ResourceShort
const [updatingId, setUpdatingId] = useState<number | null>(null)
const { control, handleSubmit, reset } = useForm<FormValues>({
resolver: zodResolver(filterSchema),
defaultValues: {
user_phone: "",
resource_no: "",
status: "all",
type: "all",
created_at_start: "",
created_at_end: "",
expired: "all",
},
})
const fetchResources = useCallback(
(page: number, size: number) => {
return listFn({ page, size, ...filters })
},
[listFn, filters],
)
const table = useDataTable<Resources>(fetchResources)
const refreshTable = useCallback(() => {
setFilters(prev => ({ ...prev }))
}, [])
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 ? "启用" : "禁用"}`,
})
refreshTable()
} catch (error) {
console.error("更新状态失败:", error)
toast.error("更新失败", {
description: error instanceof Error ? error.message : "请稍后重试",
})
} finally {
setUpdatingId(null)
}
},
[refreshTable],
)
const onFilter = handleSubmit(data => {
const result: FilterParams = {
user_id: Number(userId),
}
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)
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">
<span className="text-xs text-gray-500">{resourceNo}</span>
<ExpireBadge expireAt={expireAt} />
</div>
</div>
)
},
},
{
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>{isLong ? `${live}小时` : `${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 {
// 包量
if (isLong) {
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>
)
} else {
return (
<div className="flex gap-1">
<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)
},
},
...(!isLong
? [
{
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" />
)}
</div>
)
},
},
],
[isLong, updatingId, handleStatusChange],
)
return (
<div className="space-y-3">
<form onSubmit={onFilter} className="bg-white p-4 rounded-lg">
<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="请输入会员号" />
<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="请输入套餐号" />
<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="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="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} />
<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} />
<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={() => {
reset()
setFilters({ user_id: Number(userId) })
table.pagination.onPageChange(1)
}}
>
</Button>
</FieldGroup>
</form>
<Suspense fallback={<div className="text-center p-4">...</div>}>
<DataTable<Resources> {...table} columns={columns} />
</Suspense>
</div>
)
}

View File

@@ -0,0 +1,355 @@
"use client"
import { zodResolver } from "@hookform/resolvers/zod"
import { format } from "date-fns"
import { CheckCircle, Clock, XCircle } from "lucide-react"
import { useSearchParams } from "next/navigation"
import { Suspense, useCallback, useState } from "react"
import { Controller, useForm } from "react-hook-form"
import { z } from "zod"
import { getTrade } from "@/actions/trade"
import { DataTable, useDataTable } from "@/components/data-table"
import { Button } from "@/components/ui/button"
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 { Trade } from "@/models/trade"
type FilterValues = {
user_id: number
inner_no?: string
method?: number
platform?: number
status?: number
created_at_start?: Date
created_at_end?: Date
}
const filterSchema = z
.object({
inner_no: z
.string()
.optional()
.transform(val => val?.trim()),
method: z.string().optional(),
platform: z.string().optional(),
status: z.string().optional(),
created_at_start: z.string().optional(),
created_at_end: 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 FilterSchema = z.infer<typeof filterSchema>
export default function TradePage() {
const searchParams = useSearchParams()
const userId = searchParams.get("userId")
const [filters, setFilters] = useState<FilterValues>({
user_id: Number(userId),
})
const { control, handleSubmit, reset } = useForm<FilterSchema>({
resolver: zodResolver(filterSchema),
defaultValues: {
inner_no: "",
method: "all",
platform: "all",
status: "all",
created_at_start: "",
created_at_end: "",
},
})
const fetchTrades = useCallback(
async (page: number, size: number) => {
return getTrade({ page, size, ...filters })
},
[filters],
)
const table = useDataTable<Trade>(fetchTrades)
const onFilter = handleSubmit(data => {
const result: FilterValues = {
user_id: Number(userId),
}
if (data.inner_no?.trim()) result.inner_no = data.inner_no.trim()
if (data.method && data.method !== "all")
result.method = Number(data.method)
if (data.platform && data.platform !== "all")
result.platform = Number(data.platform)
if (data.status && data.status !== "all")
result.status = Number(data.status)
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)
table.pagination.onPageChange(1)
})
return (
<div className="space-y-3">
{/* 筛选表单 */}
<form onSubmit={onFilter} className="bg-white p-4">
<div className="flex flex-wrap items-end gap-4">
<Controller
name="inner_no"
control={control}
render={({ field, fieldState }) => (
<Field
data-invalid={fieldState.invalid}
className="w-40 flex-none"
>
<FieldLabel></FieldLabel>
<Input {...field} placeholder="请输入订单号" />
<FieldError>{fieldState.error?.message}</FieldError>
</Field>
)}
/>
<Controller
name="method"
control={control}
render={({ field, fieldState }) => (
<Field data-invalid={fieldState.invalid} className="w-24">
<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>
<SelectItem value="3"></SelectItem>
<SelectItem value="4"></SelectItem>
<SelectItem value="5"></SelectItem>
</SelectContent>
</Select>
<FieldError>{fieldState.error?.message}</FieldError>
</Field>
)}
/>
<Controller
name="platform"
control={control}
render={({ field, fieldState }) => (
<Field data-invalid={fieldState.invalid} className="w-24">
<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-24">
<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>
<SelectItem value="2"></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} />
<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} />
<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={() => {
reset()
setFilters({ user_id: Number(userId) })
table.pagination.onPageChange(1)
}}
>
</Button>
</FieldGroup>
</form>
<Suspense>
<DataTable<Trade>
{...table}
columns={[
{
header: "订单号",
accessorKey: "inner_no",
},
{
header: "渠道订单号",
accessorKey: "outer_no",
},
{
header: "支付渠道",
accessorKey: "method",
cell: ({ row }) => {
const methodMap: Record<number, string> = {
1: "支付宝",
2: "微信",
3: "商福通",
4: "商福通渠道支付宝",
5: "商福通渠道微信",
}
return (
<div>
{methodMap[row.original.method as number] || "未知"}
</div>
)
},
},
{
header: "支付金额",
accessorKey: "payment",
cell: ({ row }) => {
const payment =
typeof row.original.payment === "string"
? parseFloat(row.original.payment)
: row.original.payment || 0
return (
<div className="flex gap-1">
<span
className={
payment > 0 ? "text-green-500" : "text-orange-500"
}
>
{payment.toFixed(2)}
</span>
</div>
)
},
},
{
header: "支付平台",
accessorKey: "platform",
cell: ({ row }) => {
const platform = row.original.platform
if (!platform) return <span>-</span>
return platform === 1
? "电脑网站"
: platform === 2
? "手机网站"
: "-"
},
},
{
header: "支付状态",
accessorKey: "status",
cell: ({ row }) => {
const status = row.original.status
switch (status) {
case 0:
return (
<div className="flex items-center gap-2 text-yellow-600">
<Clock className="h-4 w-4" />
<span></span>
</div>
)
case 1:
return (
<div className="flex items-center gap-2 text-green-600">
<CheckCircle className="h-4 w-4" />
<span></span>
</div>
)
case 2:
return (
<div className="flex items-center gap-2 text-gray-500">
<XCircle className="h-4 w-4" />
<span></span>
</div>
)
default:
return <span className="text-gray-400">-</span>
}
},
},
{ header: "购买套餐", accessorKey: "subject" },
{
header: "创建时间",
accessorKey: "created_at",
cell: ({ row }) =>
format(new Date(row.original.created_at), "yyyy-MM-dd HH:mm"),
},
]}
/>
</Suspense>
</div>
)
}

View File

@@ -17,7 +17,7 @@ import {
} from "@/components/ui/dialog"
import { Field, FieldError, FieldLabel } from "@/components/ui/field"
import { Input } from "@/components/ui/input"
import type { Cust } from "@/models/cust"
import type { User } from "@/models/user"
const Schema = z.object({
deduction: z
@@ -32,7 +32,7 @@ type FormValues = z.infer<typeof Schema>
interface UpdateDeductionDialogProps {
open: boolean
onOpenChange: (open: boolean) => void
currentUser: Cust | null
currentUser: User | null
onSuccess: () => void
}

View File

@@ -17,7 +17,7 @@ import {
} from "@/components/ui/dialog"
import { Field, FieldError, FieldLabel } from "@/components/ui/field"
import { Input } from "@/components/ui/input"
import type { Cust } from "@/models/cust"
import type { User } from "@/models/user"
const Schema = z.object({
deposit: z
@@ -32,7 +32,7 @@ type FormValues = z.infer<typeof Schema>
interface UpdateDepositDialogProps {
open: boolean
onOpenChange: (open: boolean) => void
currentUser: Cust | null
currentUser: User | null
onSuccess: () => void
}

View File

@@ -2,6 +2,7 @@
import { zodResolver } from "@hookform/resolvers/zod"
import { format } from "date-fns"
import { useRouter } from "next/navigation"
import { Suspense, useCallback, useState } from "react"
import { Controller, useForm } from "react-hook-form"
import { z } from "zod"
@@ -25,12 +26,17 @@ import {
SelectValue,
} from "@/components/ui/select"
import {
ScopeBatchReadOfUser,
ScopeBillReadOfUser,
ScopeChannelReadOfUser,
ScopeResourceRead,
ScopeTradeReadOfUser,
ScopeUserWrite,
ScopeUserWriteBalance,
ScopeUserWriteBalanceDec,
ScopeUserWriteBalanceInc,
} from "@/lib/scopes"
import type { Cust } from "@/models/cust"
import type { User } from "@/models/user"
import { AddUserDialog } from "./create"
import { DeductionDialog } from "./deduction"
import { DepositDialog } from "./deposit"
@@ -75,12 +81,12 @@ export default function UserPage() {
const [filters, setFilters] = useState<FilterValues>({})
const [isAddDialogOpen, setIsAddDialogOpen] = useState(false)
const [isEditDialogOpen, setIsEditDialogOpen] = useState(false)
const [currentEditUser, setCurrentEditUser] = useState<Cust | null>(null)
const [currentEditUser, setCurrentEditUser] = useState<User | null>(null)
const [depositDialog, setDepositDialog] = useState(false)
const [deposit, setDeposit] = useState<Cust | null>(null)
const [deposit, setDeposit] = useState<User | null>(null)
const router = useRouter()
const [deductionDialog, setDeductionDialog] = useState(false)
const [deduction, setDeduction] = useState<Cust | null>(null)
const [deduction, setDeduction] = useState<User | null>(null)
const { control, handleSubmit, reset } = useForm<FormValues>({
resolver: zodResolver(filterSchema),
defaultValues: {
@@ -98,7 +104,7 @@ export default function UserPage() {
[filters],
)
const table = useDataTable<Cust>(fetchUsers)
const table = useDataTable<User>(fetchUsers)
const onFilter = handleSubmit(data => {
const result: FilterValues = {}
@@ -244,7 +250,7 @@ export default function UserPage() {
</form>
<Suspense>
<DataTable<Cust>
<DataTable<User>
{...table}
columns={[
{ header: "账号", accessorKey: "username" },
@@ -355,7 +361,7 @@ export default function UserPage() {
header: "操作",
cell: ({ row }) => {
return (
<div className="flex gap-2">
<div className="flex flex-wrap gap-2 w-75">
<Auth scope={ScopeUserWriteBalanceInc}>
<Button
size="sm"
@@ -389,6 +395,62 @@ export default function UserPage() {
</Button>
</Auth>
<Auth scope={ScopeTradeReadOfUser}>
<Button
size="sm"
onClick={() => {
router.push(`/client/trade?userId=${row.original.id}`)
}}
>
</Button>
</Auth>
<Auth scope={ScopeBillReadOfUser}>
<Button
size="sm"
onClick={() => {
router.push(
`/client/billing?userId=${row.original.id}`,
)
}}
>
</Button>
</Auth>
<Auth scope={ScopeResourceRead}>
<Button
size="sm"
onClick={() => {
router.push(
`/client/resources?userId=${row.original.id}`,
)
}}
>
</Button>
</Auth>
<Auth scope={ScopeBatchReadOfUser}>
<Button
size="sm"
onClick={() => {
router.push(`/client/batch?userId=${row.original.id}`)
}}
>
</Button>
</Auth>
<Auth scope={ScopeChannelReadOfUser}>
<Button
size="sm"
onClick={() => {
router.push(
`/client/channel?userId=${row.original.id}`,
)
}}
>
IP管理
</Button>
</Auth>
</div>
)
},

View File

@@ -30,7 +30,7 @@ import {
SelectValue,
} from "@/components/ui/select"
import type { Admin } from "@/models/admin"
import type { Cust } from "@/models/cust"
import type { User } from "@/models/user"
import type { ProductDiscount } from "@/models/product_discount"
// 表单验证规则
@@ -69,7 +69,7 @@ export type EditUserFormValues = z.infer<typeof editUserSchema>
interface EditUserDialogProps {
open: boolean
onOpenChange: (open: boolean) => void
currentUser: Cust | null
currentUser: User | null
onSuccess: () => void
}

View File

@@ -20,7 +20,7 @@ async function Layout(props: { children: ReactNode }) {
const profile = await getProfile()
if (!profile.success) throw new Error("页面渲染失败:无法获取账号信息")
return (
<div className="flex h-screen bg-gray-100">
<div className="flex h-screen overflow-hidden bg-gray-100">
<SetScopes admin={profile.data} />
{/* 侧边栏 */}

View File

@@ -4,18 +4,23 @@ import {
BarChart3,
ChevronsLeft,
ChevronsRight,
CircleDollarSign,
ClipboardList,
ClipboardMinus,
Code,
ComputerIcon,
ContactRound,
DollarSign,
FolderCode,
Home,
KeyRound,
type LucideIcon,
Package,
PackageSearch,
ScanSearch,
Shield,
ShoppingBag,
SquareActivity,
SquarePercent,
TicketPercent,
Users,
@@ -100,8 +105,6 @@ interface NavItemProps {
}
function NavItem({ href, icon: Icon, label, requiredScope }: NavItemProps) {
// console.log(requiredScope, "requiredScope")
const { collapsed, isActive } = useNavigation()
const active = isActive(href)
@@ -174,7 +177,7 @@ const menuSections: { title: string; items: NavItemProps[] }[] = [
requiredScope: ScopeUserReadNotBind,
},
{
href: "/userQuery",
href: "/client/cust",
icon: ScanSearch,
label: "客户查询",
requiredScope: ScopeUserReadOne,
@@ -234,7 +237,7 @@ const menuSections: { title: string; items: NavItemProps[] }[] = [
},
{
href: "/channel",
icon: Code,
icon: FolderCode,
label: "IP管理",
requiredScope: ScopeChannelRead,
},
@@ -269,9 +272,11 @@ const menuSections: { title: string; items: NavItemProps[] }[] = [
export default function Navigation() {
const [collapsed, setCollapsed] = useState(false)
const pathname = usePathname()
const isActive = (path: string) => {
return path === "/" ? pathname === path : pathname.startsWith(path)
if (path === "/") {
return pathname === path
}
return pathname === path || pathname.startsWith(path + "/")
}
const contextValue: NavigationContextType = {
@@ -285,12 +290,12 @@ export default function Navigation() {
<NavigationContext.Provider value={contextValue}>
<aside
className={twJoin(
"bg-background border-r border-border transition-all duration-300 ease-in-out flex flex-col",
"bg-background border-r border-border transition-all duration-300 ease-in-out flex flex-col h-full",
collapsed ? "w-16" : "w-64",
)}
>
{/* Logo */}
<div className="h-16 flex items-center justify-center border-b border-border">
{/*Logo 区域 */}
<div className="h-16 flex items-center justify-center border-b border-border p-4 shrink-0">
{!collapsed ? (
<span className="text-xl font-bold tracking-wide text-foreground">
@@ -302,7 +307,7 @@ export default function Navigation() {
)}
</div>
{/* Navigation Menu */}
<ScrollArea className="flex-1 py-3">
<ScrollArea className="flex-1 py-3 overflow-hidden">
<nav className="space-y-3">
{menuSections.map((section, idx) => (
<div key={section.title}>
@@ -317,8 +322,7 @@ export default function Navigation() {
</nav>
</ScrollArea>
{/* Toggle Button */}
<div className="p-4 border-t border-border mt-auto">
<div className="p-4 border-t border-border mt-auto shrink-0">
<Button
variant="ghost"
onClick={() => setCollapsed(!collapsed)}

View File

@@ -100,19 +100,6 @@ export function CreateProductSku(props: {
: undefined,
price_min: data.price_min,
})
console.log({
product_id: props.productId,
code: data.code,
name: data.name,
price: data.price,
discount_id:
data.discount_id && data.discount_id !== ""
? Number(data.discount_id)
: undefined,
price_min: data.price_min,
})
console.log(resp, "resp")
if (resp.success) {
form.reset()

View File

@@ -22,6 +22,7 @@ export const ScopeProductWrite = "product:write" // 写入产品
export const ScopeProductSku = "product_sku"
export const ScopeProductSkuRead = "product_sku:read" // 读取产品套餐列表
export const ScopeProductSkuWrite = "product_sku:write" // 写入产品套餐
export const ScopeProductSkuWriteStatus = "product_sku:write:status" // 更改产品套餐状态
// 折扣
export const ScopeDiscount = "discount"
@@ -32,17 +33,23 @@ export const ScopeDiscountWrite = "discount:write" // 写入折扣
export const ScopeResource = "resource"
export const ScopeResourceRead = "resource:read" // 读取用户套餐列表
export const ScopeResourceWrite = "resource:write" // 写入用户套餐
export const ScopeResourceShort = "resource:short" // 短效动态套餐
export const ScopeResourceShortRead = "resource:short:read" // 读取用户短效动态套餐列表
export const ScopeResourceShortReadOfUser = "resource:short:read:of_user" // 读取指定用户的短效动态套餐列表
export const ScopeResourceLong = "resource:long" // 长效动态套餐
export const ScopeResourceLongRead = "resource:long:read" // 读取用户长效动态套餐列表
export const ScopeResourceLongReadOfUser = "resource:long:read:of_user" // 读取指定用户的长效动态套餐列表
// 用户
export const ScopeUser = "user"
export const ScopeUserRead = "user:read" // 读取用户列表
export const ScopeUserWrite = "user:write" // 添加用户
export const ScopeUserWriteBalance = "user:write:balance" // 修改
export const ScopeUserReadNotBind = "user:read:not-bind" //客户认领
export const ScopeUserReadOne = "user:read:one" // 读取单个用户
export const ScopeUserWriteBind = "user:write:bind" // 认领用户
export const ScopeUserWriteBalanceInc = "user:write:balance:inc" //充值
export const ScopeUserWriteBalanceDec = "user:write:balance:dec" //扣款
export const ScopeUserReadNotBind = "user:read:not_bind" // 读取未绑定管理员的用户列表
export const ScopeUserWrite = "user:write" // 写入用户
export const ScopeUserWriteBalance = "user:write:balance" // 写入用户余额
export const ScopeUserWriteBalanceInc = "user:write:balance:inc" // 增加用户余额
export const ScopeUserWriteBalanceDec = "user:write:balance:dec" // 减少用户余额
export const ScopeUserWriteBind = "user:write:bind" // 用户认领
// 优惠券
export const ScopeCoupon = "coupon"
@@ -52,19 +59,23 @@ export const ScopeCouponWrite = "coupon:write" // 写入优惠券
// 批次
export const ScopeBatch = "batch"
export const ScopeBatchRead = "batch:read" // 读取批次列表
export const ScopeBatchReadOfUser = "batch:read:of_user" // 读取指定用户的批次列表
export const ScopeBatchWrite = "batch:write" // 写入批次
// IP
export const ScopeChannel = "channel"
export const ScopeChannelRead = "channel:read" // 读取 IP 列表
export const ScopeChannelReadOfUser = "channel:read:of_user" // 读取指定用户的 IP 列表
export const ScopeChannelWrite = "channel:write" // 写入 IP
// 交易
export const ScopeTrade = "trade"
export const ScopeTradeRead = "trade:read" // 读取交易列表
export const ScopeTradeReadOfUser = "trade:read:of_user" // 读取指定用户的交易列表
export const ScopeTradeWrite = "trade:write" // 写入交易
// 账单
export const ScopeBill = "bill"
export const ScopeBillRead = "bill:read" // 读取账单列表
export const ScopeBillReadOfUser = "bill:read:of_user" // 读取指定用户的账单列表
export const ScopeBillWrite = "bill:write" // 写入账单

View File

@@ -1,30 +0,0 @@
import type { Admin } from "./admin"
import type { ProductDiscount } from "./product_discount"
export type Cust = {
id: number
admin_id?: number
phone: string
admin?: Admin
password: string
source: number
discount_id: string
has_password: boolean
username: string
email: string
name: string
avatar: string
status: number
balance: number
id_type: number
id_no: string
id_token: string
contact_qq: string
contact_wechat: string
last_login: Date
last_login_host: string
last_login_agent: string
last_login_ip: string
created_at: Date
updated_at: Date
discount: ProductDiscount
}

View File

@@ -10,6 +10,7 @@ export type Trade = {
type: number
subject: string
status: number
user_id: string
created_at: Date
canceled_at: Date
updated_at: Date