feat: 支持微信用户列表展示

.env

@@ -0,0 +1,24 @@
+# Database (MySQL) - Production
+DATABASE_URL="mysql://root:MemeMind@2026@127.0.0.1:13306/mememind"
+
+# Better Auth
+BETTER_AUTH_SECRET="WU+pYbaBiDkBEzQBrdhsWAuZGmEX6mSFi9Lyw0C3BaI="
+BETTER_AUTH_URL="https://ilookai.cn"
+
+# Public URLs (for client-side)
+NEXT_PUBLIC_APP_URL="https://ilookai.cn"
+NEXT_PUBLIC_BASE_PATH="/studio"
+
+# Admin Account
+ADMIN_EMAIL="richardwei1995@gmail.com"
+ADMIN_PASSWORD="richard_123456"
+
+# Tencent COS
+COS_SECRET_ID=AKIDTs7B2f5NVSFqIYaP1QbZQE0bAuc9h4EB
+COS_SECRET_KEY=pRs6yiHcNyVs21pRq11nOlupY4OVPOH1
+COS_BUCKET=lookai-1308511832
+COS_REGION=ap-guangzhou
+COS_APPID=1308511832
+
+# Server Port
+PORT=3001

app/(dashboard)/wx-users/page.tsx

@@ -0,0 +1,195 @@
+'use client'
+
+import { useState } from 'react'
+import { useQuery } from '@tanstack/react-query'
+import { Button } from '@/components/ui/button'
+import { Input } from '@/components/ui/input'
+import { Header } from '@/components/layout/header'
+import { WxUserDetailDialog } from '@/components/wx-users/wx-user-detail-dialog'
+import { Spinner } from '@/components/ui/spinner'
+import { WxUser, WxUserWithProgress } from '@/types'
+import { apiFetch } from '@/lib/api'
+import { Search } from 'lucide-react'
+
+interface UsersResponse {
+  users: WxUser[]
+  meta: { total: number; page: number; limit: number; totalPages: number }
+}
+
+export default function WxUsersPage() {
+  const [search, setSearch] = useState('')
+  const [selectedUser, setSelectedUser] = useState<WxUser | null>(null)
+  const [isDialogOpen, setIsDialogOpen] = useState(false)
+
+  const { data, isLoading, error } = useQuery<UsersResponse>({
+    queryKey: ['wx-users', search],
+    queryFn: async () => {
+      const res = await apiFetch(`/api/wx-users?search=${encodeURIComponent(search)}`)
+      if (!res.ok) throw new Error('Failed to fetch wx users')
+      return res.json()
+    },
+  })
+
+  const { data: userDetails } = useQuery<WxUserWithProgress>({
+    queryKey: ['wx-users', selectedUser?.id],
+    queryFn: async () => {
+      const res = await apiFetch(`/api/wx-users/${selectedUser?.id}`)
+      if (!res.ok) throw new Error('Failed to fetch wx user details')
+      return res.json()
+    },
+    enabled: !!selectedUser && isDialogOpen,
+  })
+
+  const handleUserClick = (user: WxUser) => {
+    setSelectedUser(user)
+    setIsDialogOpen(true)
+  }
+
+  const handleDialogOpenChange = (open: boolean) => {
+    setIsDialogOpen(open)
+    if (!open) {
+      setSelectedUser(null)
+    }
+  }
+
+  const formatDate = (date: Date | string) => {
+    return new Date(date).toLocaleDateString('zh-CN', {
+      year: 'numeric',
+      month: '2-digit',
+      day: '2-digit',
+      hour: '2-digit',
+      minute: '2-digit',
+    })
+  }
+
+  if (isLoading) {
+    return (
+      <div className="h-screen flex flex-col">
+        <Header />
+        <div className="flex-1 flex items-center justify-center">
+          <Spinner size="lg" />
+        </div>
+      </div>
+    )
+  }
+
+  if (error) {
+    return (
+      <div className="h-screen flex flex-col">
+        <Header />
+        <div className="flex-1 flex items-center justify-center">
+          <div className="text-center">
+            <p className="text-red-600">加载失败</p>
+            <Button className="mt-4" onClick={() => window.location.reload()}>
+              重试
+            </Button>
+          </div>
+        </div>
+      </div>
+    )
+  }
+
+  return (
+    <div className="h-screen flex flex-col">
+      <Header />
+      <div className="flex-1 overflow-auto p-6">
+        <div className="max-w-6xl mx-auto">
+          <div className="flex items-center justify-between mb-6">
+            <div>
+              <h1 className="text-2xl font-bold">小程序账户</h1>
+              <p className="text-gray-500 mt-1">
+                共 {data?.meta?.total || 0} 个账户
+              </p>
+            </div>
+          </div>
+
+          <div className="relative mb-6 max-w-sm">
+            <Search className="absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-gray-400" />
+            <Input
+              type="text"
+              placeholder="搜索昵称或 OpenID..."
+              value={search}
+              onChange={(e) => setSearch(e.target.value)}
+              className="pl-10"
+            />
+          </div>
+
+          <div className="bg-white rounded-lg shadow overflow-hidden">
+            <table className="min-w-full divide-y divide-gray-200">
+              <thead className="bg-gray-50">
+                <tr>
+                  <th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
+                    用户
+                  </th>
+                  <th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
+                    OpenID
+                  </th>
+                  <th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
+                    积分
+                  </th>
+                  <th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
+                    注册时间
+                  </th>
+                </tr>
+              </thead>
+              <tbody className="bg-white divide-y divide-gray-200">
+                {data?.users?.map((user) => (
+                  <tr
+                    key={user.id}
+                    className="hover:bg-gray-50 cursor-pointer"
+                    onClick={() => handleUserClick(user)}
+                  >
+                    <td className="px-6 py-4 whitespace-nowrap">
+                      <div className="flex items-center">
+                        {user.avatarUrl ? (
+                          <img
+                            src={user.avatarUrl}
+                            alt={user.nickname || 'User'}
+                            className="h-10 w-10 rounded-full object-cover mr-3"
+                          />
+                        ) : (
+                          <div className="h-10 w-10 rounded-full bg-gray-200 flex items-center justify-center mr-3 text-gray-600 font-medium">
+                            {user.nickname?.[0]?.toUpperCase() || 'U'}
+                          </div>
+                        )}
+                        <span className="text-sm font-medium text-gray-900">
+                          {user.nickname || '匿名用户'}
+                        </span>
+                      </div>
+                    </td>
+                    <td className="px-6 py-4 whitespace-nowrap">
+                      <span className="text-sm text-gray-500 font-mono text-xs">
+                        {user.openid}
+                      </span>
+                    </td>
+                    <td className="px-6 py-4 whitespace-nowrap">
+                      <span className="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-orange-100 text-orange-800">
+                        {user.points}
+                      </span>
+                    </td>
+                    <td className="px-6 py-4 whitespace-nowrap text-sm text-gray-500">
+                      {formatDate(user.createdAt)}
+                    </td>
+                  </tr>
+                ))}
+                {data?.users?.length === 0 && (
+                  <tr>
+                    <td colSpan={4} className="px-6 py-12 text-center text-gray-500">
+                      暂无账户数据
+                    </td>
+                  </tr>
+                )}
+              </tbody>
+            </table>
+          </div>
+        </div>
+      </div>
+
+      <WxUserDetailDialog
+        open={isDialogOpen}
+        onOpenChange={handleDialogOpenChange}
+        user={userDetails}
+      />
+    </div>
+  )
+}

app/api/wx-users/[id]/route.ts

@@ -0,0 +1,55 @@
+import { NextRequest, NextResponse } from 'next/server'
+import { prisma } from '@/lib/prisma'
+import { auth } from '@/lib/auth'
+
+export const dynamic = 'force-dynamic'
+
+// GET /api/wx-users/[id] - Get single wx user with level progress
+export async function GET(
+  request: NextRequest,
+  { params }: { params: Promise<{ id: string }> }
+) {
+  try {
+    const session = await auth.api.getSession({
+      headers: request.headers,
+    })
+
+    if (!session) {
+      return NextResponse.json({ error: 'Unauthorized' }, { status: 401 })
+    }
+
+    const { id } = await params
+
+    const user = await prisma.wxUser.findUnique({
+      where: { id },
+      include: {
+        levelProgress: {
+          orderBy: { completedAt: 'desc' },
+          include: {
+            level: {
+              select: {
+                id: true,
+                answer: true,
+              },
+            },
+          },
+        },
+      },
+    })
+
+    if (!user) {
+      return NextResponse.json(
+        { error: 'User not found' },
+        { status: 404 }
+      )
+    }
+
+    return NextResponse.json(user)
+  } catch (error) {
+    console.error('Error fetching wx user:', error)
+    return NextResponse.json(
+      { error: 'Failed to fetch wx user' },
+      { status: 500 }
+    )
+  }
+}

app/api/wx-users/route.ts

@@ -0,0 +1,68 @@
+import { NextRequest, NextResponse } from 'next/server'
+import { prisma } from '@/lib/prisma'
+import { auth } from '@/lib/auth'
+
+export const dynamic = 'force-dynamic'
+
+// GET /api/wx-users - Get all wx users with optional search and pagination
+export async function GET(request: NextRequest) {
+  try {
+    const session = await auth.api.getSession({
+      headers: request.headers,
+    })
+
+    if (!session) {
+      return NextResponse.json({ error: 'Unauthorized' }, { status: 401 })
+    }
+
+    const { searchParams } = new URL(request.url)
+    const search = searchParams.get('search') || ''
+    const page = parseInt(searchParams.get('page') || '1', 10)
+    const limit = parseInt(searchParams.get('limit') || '20', 10)
+    const skip = (page - 1) * limit
+
+    const where = search
+      ? {
+          OR: [
+            { nickname: { contains: search } },
+            { openid: { contains: search } },
+          ],
+        }
+      : {}
+
+    const [users, total] = await Promise.all([
+      prisma.wxUser.findMany({
+        where,
+        skip,
+        take: limit,
+        orderBy: { createdAt: 'desc' },
+        select: {
+          id: true,
+          openid: true,
+          nickname: true,
+          avatarUrl: true,
+          points: true,
+          createdAt: true,
+          updatedAt: true,
+        },
+      }),
+      prisma.wxUser.count({ where }),
+    ])
+
+    return NextResponse.json({
+      users,
+      meta: {
+        total,
+        page,
+        limit,
+        totalPages: Math.ceil(total / limit),
+      },
+    })
+  } catch (error) {
+    console.error('Error fetching wx users:', error)
+    return NextResponse.json(
+      { error: 'Failed to fetch wx users' },
+      { status: 500 }
+    )
+  }
+}

components/layout/sidebar.tsx

@@ -3,7 +3,7 @@
 import Link from 'next/link'
 import { usePathname } from 'next/navigation'
 import { cn } from '@/lib/utils'
-import { Layers, Home, Settings, LogOut, Users } from 'lucide-react'
+import { Layers, Home, Settings, LogOut, Users, UserCircle } from 'lucide-react'
 import { signOut, useSession } from '@/lib/auth-client'
 import { useRouter } from 'next/navigation'
 import { Button } from '@/components/ui/button'
@@ -12,6 +12,7 @@ const navigation = [
   { name: '首页', href: '/levels', icon: Home },
   { name: '关卡配置', href: '/levels', icon: Layers },
   { name: '用户管理', href: '/users', icon: Users },
+  { name: '小程序账户', href: '/wx-users', icon: UserCircle },
 ]
 
 export function Sidebar() {

components/wx-users/wx-user-detail-dialog.tsx

@@ -0,0 +1,109 @@
+'use client'
+
+import { WxUserWithProgress } from '@/types'
+import {
+  Dialog,
+  DialogContent,
+  DialogHeader,
+  DialogTitle,
+  DialogDescription,
+} from '@/components/ui/dialog'
+
+interface WxUserDetailDialogProps {
+  open: boolean
+  onOpenChange: (open: boolean) => void
+  user: WxUserWithProgress | null | undefined
+}
+
+export function WxUserDetailDialog({
+  open,
+  onOpenChange,
+  user,
+}: WxUserDetailDialogProps) {
+  if (!user) return null
+
+  return (
+    <Dialog open={open} onOpenChange={onOpenChange}>
+      <DialogContent>
+        <DialogHeader>
+          <DialogTitle>用户详情</DialogTitle>
+          <DialogDescription>
+            完整信息及关卡进度
+          </DialogDescription>
+        </DialogHeader>
+
+        <div className="space-y-4">
+          <div className="flex items-center gap-4">
+            <div className="w-16 h-16 flex-shrink-0">
+              {user.avatarUrl ? (
+                <img
+                  src={user.avatarUrl}
+                  alt={user.nickname || 'User'}
+                  className="w-16 h-16 rounded-full object-cover"
+                />
+              ) : (
+                <div className="w-16 h-16 rounded-full bg-gray-200 flex items-center justify-center text-xl font-medium text-gray-600">
+                  {user.nickname?.[0]?.toUpperCase() || 'U'}
+                </div>
+              )}
+            </div>
+            <div>
+              <h2 className="text-xl font-semibold text-gray-900">
+                {user.nickname || '匿名用户'}
+              </h2>
+              <p className="text-sm text-gray-500 mt-1">
+                注册时间：{new Date(user.createdAt).toLocaleDateString('zh-CN')}
+              </p>
+            </div>
+          </div>
+
+          <div className="grid grid-cols-2 gap-4">
+            <div className="bg-gray-50 rounded-lg p-4">
+              <p className="text-xs text-gray-500 uppercase tracking-wider mb-1">积分</p>
+              <p className="text-2xl font-bold text-orange-600">{user.points}</p>
+            </div>
+            <div className="bg-gray-50 rounded-lg p-4">
+              <p className="text-xs text-gray-500 uppercase tracking-wider mb-1">已通关关卡</p>
+              <p className="text-2xl font-bold text-green-600">{user.levelProgress.length}</p>
+            </div>
+          </div>
+
+          <div>
+            <p className="text-xs text-gray-500 uppercase tracking-wider mb-2">OpenID</p>
+            <code className="block bg-gray-100 text-gray-800 text-xs p-3 rounded-lg break-all">
+              {user.openid}
+            </code>
+          </div>
+
+          {user.levelProgress.length > 0 && (
+            <div>
+              <p className="text-xs text-gray-500 uppercase tracking-wider mb-2">关卡进度</p>
+              <div className="space-y-2">
+                {user.levelProgress.map((progress) => (
+                  <div
+                    key={progress.id}
+                    className="flex items-center justify-between bg-gray-50 rounded-lg px-3 py-2"
+                  >
+                    <div className="flex flex-col">
+                      <span className="text-xs text-gray-400 font-mono">
+                        {progress.levelId}
+                      </span>
+                      {progress.level && (
+                        <span className="text-sm font-medium text-gray-900">
+                          {progress.level.answer}
+                        </span>
+                      )}
+                    </div>
+                    <span className="text-xs text-gray-400">
+                      {new Date(progress.completedAt).toLocaleDateString('zh-CN')}
+                    </span>
+                  </div>
+                ))}
+              </div>
+            </div>
+          )}
+        </div>
+      </DialogContent>
+    </Dialog>
+  )
+}

prisma/schema.prisma

@@ -22,6 +22,8 @@ model Level {
   createdAt  DateTime @default(now()) @map("created_at")
   updatedAt  DateTime @updatedAt @map("updated_at")
 
+  userProgress WxUserLevelProgress[]
+
   @@map("levels")
 }
 
@@ -85,3 +87,30 @@ model Verification {
 
   @@map("verifications")
 }
+
+model WxUser {
+  id         String   @id @default(uuid())
+  openid     String   @unique
+  sessionKey String?  @map("session_key")
+  nickname   String?
+  avatarUrl  String?  @map("avatar_url")
+  points     Int      @default(10)
+  createdAt  DateTime @default(now()) @map("created_at")
+  updatedAt  DateTime @updatedAt @map("updated_at")
+
+  levelProgress WxUserLevelProgress[]
+
+  @@map("wx_users")
+}
+
+model WxUserLevelProgress {
+  id          String   @id @default(uuid())
+  userId      String   @map("user_id")
+  levelId     String   @map("level_id")
+  completedAt DateTime @default(now()) @map("completed_at")
+
+  user  WxUser @relation(fields: [userId], references: [id], onDelete: Cascade)
+  level Level  @relation(fields: [levelId], references: [id])
+
+  @@map("wx_user_level_progress")
+}

types/index.ts

@@ -37,3 +37,29 @@ export interface UserFormData {
   password: string
   name?: string
 }
+
+export interface WxUser {
+  id: string
+  openid: string
+  sessionKey: string | null
+  nickname: string | null
+  avatarUrl: string | null
+  points: number
+  createdAt: Date
+  updatedAt: Date
+}
+
+export interface WxUserLevelProgress {
+  id: string
+  userId: string
+  levelId: string
+  completedAt: Date
+  level?: {
+    id: string
+    answer: string
+  }
+}
+
+export interface WxUserWithProgress extends WxUser {
+  levelProgress: WxUserLevelProgress[]
+}