添加客户查询页面包括导航权限控制 & 删除多余代码

src/app/(root)/appbar.tsx

@@ -1,12 +1,9 @@
 "use client"
 import {
   BadgeQuestionMarkIcon,
-  BellIcon,
   ChevronDownIcon,
   ChevronRightIcon,
-  InboxIcon,
   LogOutIcon,
-  SearchIcon,
   SettingsIcon,
   UserIcon,
 } from "lucide-react"
@@ -16,36 +13,12 @@ import { usePathname, useRouter } from "next/navigation"
 import { useEffect, useRef, useState } from "react"
 import { logout } from "@/actions/auth"
 import { Button } from "@/components/ui/button"
-import { Input } from "@/components/ui/input"
 import type { Admin } from "@/models/admin"
 
 export default function Appbar(props: { admin: Admin }) {
   const router = useRouter()
   const [showDropdown, setShowDropdown] = useState(false)
   const [showNotifications, setShowNotifications] = useState(false)
-  const [notifications] = useState([
-    {
-      id: 1,
-      title: "系统通知",
-      content: "您有新的待审核内容",
-      time: "10分钟前",
-      read: false,
-    },
-    {
-      id: 2,
-      title: "安全提醒",
-      content: "您的账号于昨天登录了新设备",
-      time: "1小时前",
-      read: true,
-    },
-    {
-      id: 3,
-      title: "系统更新",
-      content: "系统将在今晚进行例行维护",
-      time: "2小时前",
-      read: true,
-    },
-  ])
 
   const pathname = usePathname()
   const dropdownRef = useRef<HTMLDivElement>(null)
@@ -119,7 +92,6 @@ export default function Appbar(props: { admin: Admin }) {
   }
 
   const breadcrumbs = generateBreadcrumbs()
-  const unreadCount = notifications.filter(n => !n.read).length
   const doLogout = async () => {
     const resp = await logout()
     if (resp.success) {
@@ -153,88 +125,6 @@ export default function Appbar(props: { admin: Admin }) {
 
       {/* 右侧用户信息和工具栏 */}
       <div className="flex items-center space-x-4">
-        {/* 搜索框 */}
-        <div className="hidden md:block relative">
-          <div className="relative">
-            <SearchIcon className="absolute left-3 top-1/2 transform -translate-y-1/2 h-4 w-4 text-gray-400" />
-            <Input
-              type="text"
-              placeholder="搜索..."
-              className="pl-10 pr-4 py-2 bg-gray-100 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent w-56"
-            />
-          </div>
-        </div>
-
-        {/* 通知图标 */}
-        <div className="relative" ref={notificationRef}>
-          <Button
-            onClick={() => setShowNotifications(!showNotifications)}
-            className="relative p-2 rounded-full text-gray-600 bg-gray-100 hover:bg-gray-100 hover:text-gray-800 transition-colors"
-            aria-label="通知"
-          >
-            <BellIcon />
-            {unreadCount > 0 && (
-              <span className="absolute top-1 right-1 h-4 w-4 text-xs flex items-center justify-center rounded-full bg-red-500 text-white">
-                {unreadCount}
-              </span>
-            )}
-          </Button>
-
-          {/* 通知下拉面板 */}
-          {showNotifications && (
-            <div className="absolute right-0 mt-2 w-80 bg-white rounded-md shadow-lg py-1 z-20 border border-gray-200">
-              <div className="px-4 py-2 border-b border-gray-100 flex justify-between items-center">
-                <h3 className="font-medium text-gray-800">通知</h3>
-                <Button className="text-xs text-blue-600 hover:text-blue-800">
-                  全部标为已读
-                </Button>
-              </div>
-
-              <div className="max-h-72 overflow-y-auto">
-                {notifications.length > 0 ? (
-                  notifications.map(notification => (
-                    <div
-                      key={notification.id}
-                      className={`px-4 py-3 border-b border-gray-100 hover:bg-gray-50 ${
-                        notification.read ? "bg-white" : "bg-blue-50"
-                      }`}
-                    >
-                      <div className="flex justify-between items-start">
-                        <h4 className="text-sm font-medium text-gray-800">
-                          {notification.title}
-                        </h4>
-                        <span className="text-xs text-gray-500">
-                          {notification.time}
-                        </span>
-                      </div>
-                      <p className="text-xs text-gray-600 mt-1">
-                        {notification.content}
-                      </p>
-                    </div>
-                  ))
-                ) : (
-                  <div className="py-8 px-4 text-center">
-                    <InboxIcon size={18} />
-                    <p className="mt-2 text-sm text-gray-500">暂无通知</p>
-                  </div>
-                )}
-              </div>
-
-              <div className="border-t border-gray-100 p-2 text-center">
-                <Link
-                  href="/notifications"
-                  className="text-xs text-blue-600 hover:text-blue-800"
-                >
-                  查看全部通知
-                </Link>
-              </div>
-            </div>
-          )}
-        </div>
-
-        {/* 分隔线 */}
-        <div className="hidden md:block h-8 w-px bg-gray-200"></div>
-
         {/* 用户下拉菜单 */}
         <div className="relative" ref={dropdownRef}>
           <Button

src/app/(root)/navigation.tsx

@@ -13,6 +13,7 @@ import {
   KeyRound,
   type LucideIcon,
   Package,
+  ScanSearch,
   Shield,
   ShoppingBag,
   SquarePercent,
@@ -46,6 +47,7 @@ import {
   ScopeResourceRead,
   ScopeTradeRead,
   ScopeUserRead,
+  ScopeUserReadNotBind,
   ScopeUserReadOne,
 } from "@/lib/scopes"
 
@@ -169,6 +171,12 @@ const menuSections: { title: string; items: NavItemProps[] }[] = [
         href: "/user",
         icon: Users,
         label: "客户认领",
+        requiredScope: ScopeUserReadNotBind,
+      },
+      {
+        href: "/userQuery",
+        icon: ScanSearch,
+        label: "客户查询",
         requiredScope: ScopeUserReadOne,
       },
       {

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

@@ -0,0 +1,313 @@
+"use client"
+import { zodResolver } from "@hookform/resolvers/zod"
+import { format } from "date-fns"
+import { Suspense, useCallback, useEffect, useState } from "react"
+import { Controller, useForm } from "react-hook-form"
+import { toast } from "sonner"
+import { z } from "zod"
+import { getPageUser } from "@/actions/user"
+import { DeductionDialog } from "@/app/(root)/cust/deduction"
+import { DepositDialog } from "@/app/(root)/cust/deposit"
+import { UpdateDialog } from "@/app/(root)/cust/update"
+import { Auth } from "@/components/auth"
+import { DataTable } 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 {
+  ScopeUserWriteBalance,
+  ScopeUserWriteBalanceDec,
+  ScopeUserWriteBalanceInc,
+} from "@/lib/scopes"
+import type { Cust } from "@/models/cust"
+import type { User } from "@/models/user"
+
+interface UserQueryParams {
+  account?: string
+  name?: string
+}
+
+const filterSchema = z.object({
+  account: z.string().optional(),
+  name: z.string().optional(),
+})
+
+type FormValues = z.infer<typeof filterSchema>
+
+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 [deductionDialog, setDeductionDialog] = useState(false)
+  const [deduction, setDeduction] = useState<Cust | null>(null)
+  const [isEditDialogOpen, setIsEditDialogOpen] = useState(false)
+  const [currentEditUser, setCurrentEditUser] = useState<Cust | null>(null)
+  const [currentFilters, setCurrentFilters] = useState<UserQueryParams>({})
+
+  const { control, handleSubmit, reset } = useForm<FormValues>({
+    resolver: zodResolver(filterSchema),
+    defaultValues: {
+      account: "",
+      name: "",
+    },
+  })
+
+  const fetchUsers = useCallback(async (filters: UserQueryParams = {}) => {
+    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)
+      } else {
+        toast.error(res.message || "获取用户失败")
+        setUserList([])
+      }
+    } catch (error) {
+      const message = error instanceof Error ? error.message : error
+      toast.error(`获取用户失败: ${message}`)
+    } finally {
+      setLoading(false)
+    }
+  }, [])
+
+  useEffect(() => {
+    fetchUsers()
+  }, [fetchUsers])
+
+  const onFilter = handleSubmit((data: FormValues) => {
+    const params: UserQueryParams = {}
+    if (data.account?.trim()) params.account = data.account.trim()
+    if (data.name?.trim()) params.name = data.name.trim()
+    setCurrentFilters(params)
+    fetchUsers(params)
+  })
+
+  const refreshTable = useCallback(() => {
+    fetchUsers(currentFilters)
+  }, [fetchUsers, currentFilters])
+
+  const handleReset = () => {
+    reset()
+    setCurrentFilters({})
+    fetchUsers()
+  }
+
+  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="account"
+            control={control}
+            render={({ field, fieldState }) => (
+              <Field
+                data-invalid={fieldState.invalid}
+                className="w-80 flex-none"
+              >
+                <FieldLabel>账号/手机号/邮箱</FieldLabel>
+                <Input {...field} placeholder="请输入账号/手机号/邮箱" />
+                <FieldError>{fieldState.error?.message}</FieldError>
+              </Field>
+            )}
+          />
+
+          <Controller
+            name="name"
+            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>
+            )}
+          />
+        </div>
+
+        <FieldGroup className="flex-row justify-start mt-4 gap-2">
+          <Button type="submit">筛选</Button>
+          <Button type="button" variant="outline" onClick={handleReset}>
+            重置
+          </Button>
+        </FieldGroup>
+      </form>
+
+      <Suspense>
+        <DataTable<User>
+          data={userList || []}
+          status={loading ? "load" : "done"}
+          columns={[
+            { header: "账号", accessorKey: "username" },
+            { header: "手机", accessorKey: "phone" },
+            { header: "邮箱", accessorKey: "email" },
+            { header: "姓名", accessorKey: "name" },
+            {
+              header: "余额",
+              accessorKey: "balance",
+              cell: ({ row }) => {
+                const balance = Number(row.original.balance) || 0
+                return (
+                  <span
+                    className={
+                      balance > 0 ? "text-green-500" : "text-orange-500"
+                    }
+                  >
+                    ￥{balance.toFixed(2)}
+                  </span>
+                )
+              },
+            },
+            {
+              header: "实名状态",
+              accessorKey: "id_type",
+              cell: ({ row }) => (
+                <Badge
+                  variant={row.original.id_type === 1 ? "default" : "secondary"}
+                  className={
+                    row.original.id_type === 1
+                      ? "bg-green-100 text-green-800"
+                      : "bg-gray-100 text-gray-800"
+                  }
+                >
+                  {row.original.id_type === 1 ? "已认证" : "未认证"}
+                </Badge>
+              ),
+            },
+            {
+              header: "身份证号",
+              accessorKey: "id_no",
+              cell: ({ row }) => {
+                const idNo = row.original.id_no
+                return idNo ? `${idNo.slice(0, 6)}****${idNo.slice(-4)}` : ""
+              },
+            },
+            {
+              header: "客户来源",
+              accessorKey: "source",
+              cell: ({ row }) => {
+                const sourceMap: Record<number, string> = {
+                  0: "官网注册",
+                  1: "管理员添加",
+                  2: "代理商注册",
+                  3: "代理商添加",
+                }
+                return sourceMap[row.original.source] ?? "未知"
+              },
+            },
+            {
+              header: "账号状态",
+              accessorKey: "status",
+              cell: ({ row }) => (row.original.status === 1 ? "正常" : "禁用"),
+            },
+            { header: "联系方式", accessorKey: "contact_wechat" },
+            {
+              header: "客户经理",
+              cell: ({ row }) => row.original.admin?.name || "",
+            },
+            {
+              header: "最后登录时间",
+              accessorKey: "last_login",
+              cell: ({ row }) =>
+                row.original.last_login
+                  ? format(
+                      new Date(row.original.last_login),
+                      "yyyy-MM-dd HH:mm",
+                    )
+                  : "",
+            },
+            {
+              header: "最后登录IP",
+              accessorKey: "last_login_ip",
+              cell: ({ row }) => row.original.last_login_ip || "",
+            },
+            {
+              header: "创建时间",
+              accessorKey: "created_at",
+              cell: ({ row }) =>
+                format(new Date(row.original.created_at), "yyyy-MM-dd HH:mm"),
+            },
+            {
+              id: "action",
+              meta: { pin: "right" },
+              header: "操作",
+              cell: ({ row }) => {
+                return (
+                  <div className="flex gap-2">
+                    <Auth scope={ScopeUserWriteBalanceInc}>
+                      <Button
+                        size="sm"
+                        onClick={() => {
+                          setDeposit(row.original)
+                          setDepositDialog(true)
+                        }}
+                      >
+                        充值
+                      </Button>
+                    </Auth>
+                    <Auth scope={ScopeUserWriteBalanceDec}>
+                      <Button
+                        size="sm"
+                        onClick={() => {
+                          setDeduction(row.original)
+                          setDeductionDialog(true)
+                        }}
+                      >
+                        扣款
+                      </Button>
+                    </Auth>
+                    <Auth scope={ScopeUserWriteBalance}>
+                      <Button
+                        size="sm"
+                        onClick={() => {
+                          setCurrentEditUser(row.original)
+                          setIsEditDialogOpen(true)
+                        }}
+                      >
+                        修改
+                      </Button>
+                    </Auth>
+                  </div>
+                )
+              },
+            },
+          ]}
+        />
+      </Suspense>
+
+      <UpdateDialog
+        open={isEditDialogOpen}
+        onOpenChange={setIsEditDialogOpen}
+        currentUser={currentEditUser}
+        onSuccess={refreshTable}
+      />
+
+      <DepositDialog
+        open={depositDialog}
+        onOpenChange={setDepositDialog}
+        currentUser={deposit}
+        onSuccess={refreshTable}
+      />
+
+      <DeductionDialog
+        open={deductionDialog}
+        onOpenChange={setDeductionDialog}
+        currentUser={deduction}
+        onSuccess={refreshTable}
+      />
+    </div>
+  )
+}

src/lib/scopes.ts

@@ -38,6 +38,7 @@ 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" //充值

src/models/cust.ts

@@ -1,5 +1,5 @@
+import type { Admin } from "./admin"
 import type { ProductDiscount } from "./product_discount"
-
 export type Cust = {
   id: number
   admin_id?: number
@@ -28,7 +28,3 @@ export type Cust = {
   updated_at: Date
   discount: ProductDiscount
 }
-export type Admin = {
-  name: string
-  password: string
-}

src/models/user.ts

@@ -1,9 +1,9 @@
 import type { Admin } from "./admin"
+import type { ProductDiscount } from "./product_discount"
 
 export type User = {
   id: number
   admin_id?: number
-  admin?: Admin
   phone: string
   source: number
   has_password: boolean
@@ -24,4 +24,8 @@ export type User = {
   last_login_ip: string
   created_at: Date
   updated_at: Date
+  password: string
+  discount_id: string
+  discount: ProductDiscount
+  admin?: Admin
 }