授权管理系统 - 前端应用

浙江贝凡企业授权管理系统的前端应用，基于 React + TypeScript + Ant Design。

技术栈

• React 19: UI 框
• TypeScript: 类型系统
• Ant Design 6: UI 组件库
• Vite 7: 构建工具
• React Router v7: 路由管理
• Axios: HTTP 客户端
• QRCode: 二维码生成

项目结构

frontend/
├── src/
│   ├── components/    # 通用组件
│   │   └── AdminLayout.tsx
│   ├── pages/         # 页面组件
│   │   ├── Login.tsx
│   │   ├── PublicQuery.tsx
│   │   ├── Dashboard.tsx
│   │   ├── Generate.tsx
│   │   ├── Manage.tsx
│   │   ├── AdminQuery.tsx
│   │   └── Profile.tsx
│   ├── services/      # API 服务层
│   │   └── api.ts
│   ├── types/         # TypeScript 类型定义
│   │   └── index.ts
│   ├── assets/        # 静态资源
│   ├── styles/        # 样式文件
│   ├── App.tsx        # 主应用组件
│   └── main.tsx       # 应用入口
├── package.json       # 项目配置
├── tsconfig.json     # TypeScript 配置
├── vite.config.ts    # Vite 配置
└── index.html        # HTML 入口

安装

pnpm install

开发

启动开发服务器：

pnpm dev

开发服务器将在 http://localhost:5173 运行

构建

构建生产版本：

pnpm build

预览

预览生产构建：

pnpm preview

环境变量

可以在 .env 文件中配置：

VITE_API_BASE_URL=/api

功能特性

公开页面

• 用户登录
• 公开查询序列号（支持二维码扫描）

管理后台

• 控制台（数据统计）
• 生成二维码和序列号
  • 支持自动生成和自定义前缀
  • 支持自定义二维码颜色
• 企业管理
  • 查看企业详情
  • 查看序列号列表
  • 吊销企业/序列号
  • 查看序列号二维码
• 序列号查询
• 用户资料管理

License

MIT