管理后台

admin-next 用户管理详情弹窗——UserDetailModal 双栏布局 + Tab 分区 + 设备管控与账号冻结

admin-next UI 组件库——12 个基础组件：Button、Card、Modal、Input、Select、Switch、Badge、Toast、Dropdown、ImageUpload、Breadcrumbs

A comprehensive walkthrough of the admin-next UI component library — 12 reusable components built with React, Tailwind CSS, and Framer Motion. Covers Button, Card, Modal, Input, Select, Switch, Badge, Toast, Dropdown, ImageUpload, Breadcrumbs, and utility exports.

admin-next Server Prefetch + ISR——Server Component 数据获取与增量静态再生

A deep dive into admin-next's server-side data fetching strategy — the serverGet utility for Server Components, ISR revalidation with tags, and Server Actions for cache invalidation.

安全工具链：Zod 验证 + PII 脱敏 + XSS 防护

security-utils.ts 模块是管理后台的前端安全工具包，在 276 行中涵盖五个安全关注点：Zod 输入验证、PII 数据脱敏、XSS 防护、SQL 注入启发式检测和密码强度评估。

admin-next 路由配置体系——8 个路由组、27 条路由与 lucide-react 图标映射

A deep dive into the admin-next route configuration system — the RouteConfig type system, 8 route groups with 27 route definitions, lucide-react icon mapping strategy, hidden routes for metadata matching, and navigation/authorization integration.

注册申请审批工作流 — 管理员账号自助申请到权限开通的全链路

admin-next 商品 CRUD——CreateProductFormModal + EditProductFormModal：react-hook-form 多区段表单与图片上传

Prisma 数据库架构设计：30+ 模型的分层体系与最佳实践

支付 Webhook & 回调处理深度解析 — 乐观锁、幂等性、原子化钱包操作

深入解析 PaymentWebhookController（单端点路由 + callback-token 鉴权）→ handleUniversalWebhook（充值/提现分流）→ handleInvoiceWebhook（updateMany 乐观锁 + creditCash）→ handlePayoutWebhook（原子 unfreeze + CRITICAL 降级）→ WalletService（ensureWallet / creditCash / freezeCash / unfreezeCash + beforeBalance/afterBalance 审计流水）

支付流程全链路 — API Xendit → Flutter App → admin-next 财务审核

NestJS PaymentService（Xendit Invoice/Payout网关）→ ClientWalletService（充值/提现/Webhook回调业务）→ admin-next Finance 页面（WithdrawalList、DepositList、TransactionList）