一个基于 Next.js 构建的现代化电子运单查询应用，提供友好的用户界面和高效的数据展示功能。

• 🔍 运单查询: 支持多种条件筛选和搜索运单信息
• 📊 数据可视化: 以卡片形式展示运单详细信息
• 🌙 深色模式: 支持明暗主题切换，提供舒适的阅读体验
• 📱 响应式设计: 适配各种屏幕尺寸，从手机到桌面设备
• 🎨 现代化UI: 采用 Tailwind CSS 和 Radix UI 构建优雅的用户界面
• 📤 数据导出: 支持将运单信息导出为图片格式

• 框架: Next.js 16
• UI组件: React 19 + Radix UI
• 样式方案: Tailwind CSS 4
• 类型系统: TypeScript
• 状态管理: React Context API (通过next-themes)
• 图标库: Lucide React

my-app/
├── app/             # Next.js App Router 目录
│   ├── api/         # API 路由
│   └── page.tsx     # 主页面
├── components/      # React 组件
│   ├── data-table.tsx      # 数据表格组件
│   ├── search-filters.tsx  # 搜索过滤组件
│   └── ui/           # 原子UI组件
├── lib/             # 工具函数和帮助方法
└── public/          # 静态资源文件

首先，安装依赖：

npm install

然后，启动开发服务器：

npm run dev

在浏览器中打开 http://localhost:3000 查看应用。

构建生产版本：

npm run build

构建产物将生成在 .next 目录中。

• Vercel: 最简便的部署方式，可直接连接GitHub仓库
• Docker: 可使用官方Next.js Docker镜像部署
• 传统VPS: 可使用 npm start 在生产环境运行构建后的应用

• 项目仅供学习参考使用，数据来源于官方公开渠道