feat: 完成全站UI优化 - 科技感/未来风设计
- 前台页面全面升级为Tailwind CSS框架 - 引入Google Fonts (Space Grotesk, Noto Sans) - 主色调更新为#25c0f4 (cyan blue) - 实现玻璃态效果和渐变背景 - 优化首页网格卡片布局和悬停动画 - 优化详情页双栏布局和渐变Logo光晕 - 优化管理员登录页，添加科技网格背景 - Flask-Admin后台完整深色主题 - 统一Material Symbols图标系统 - 网站自动抓取功能界面优化 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit is contained in:
Jowe
219
README.md
Normal file
219
README.md
Normal file
@@ -0,0 +1,219 @@
|
||||
# AI工具导航网站
|
||||
|
||||
一个简洁美观的AI产品导航网站，用于展示和管理各类AI工具和应用。
|
||||
|
||||
## 功能特点
|
||||
|
||||
- ✅ 按标签分类展示AI工具
|
||||
- ✅ 卡片式设计，美观易用
|
||||
- ✅ 详细的工具介绍页面
|
||||
- ✅ 完善的后台管理系统
|
||||
- ✅ SEO友好的URL结构
|
||||
- ✅ 响应式设计，支持移动端
|
||||
- ✅ 浏览量统计
|
||||
|
||||
## 技术栈
|
||||
|
||||
- **后端**: Flask 3.0 + Python 3.8+
|
||||
- **数据库**: MySQL 5.7+
|
||||
- **前端**: Bootstrap 5 + Jinja2模板
|
||||
- **管理后台**: Flask-Admin
|
||||
- **用户认证**: Flask-Login
|
||||
|
||||
## 项目结构
|
||||
|
||||
```
|
||||
zjpb/
|
||||
├── app.py # Flask应用主文件
|
||||
├── config.py # 配置文件
|
||||
├── models.py # 数据库模型
|
||||
├── init_db.py # 数据库初始化脚本
|
||||
├── requirements.txt # Python依赖
|
||||
├── .env.example # 环境变量示例
|
||||
├── templates/ # HTML模板
|
||||
│ ├── base.html
|
||||
│ ├── index.html # 首页
|
||||
│ ├── detail.html # 详情页
|
||||
│ └── admin_login.html # 登录页
|
||||
├── static/ # 静态资源
|
||||
│ ├── css/
|
||||
│ │ └── style.css
|
||||
│ ├── js/
|
||||
│ │ └── main.js
|
||||
│ └── images/
|
||||
└── migrations/ # 数据库迁移文件
|
||||
```
|
||||
|
||||
## 快速开始
|
||||
|
||||
### 1. 环境准备
|
||||
|
||||
确保已安装以下软件:
|
||||
- Python 3.8+
|
||||
- MySQL 5.7+
|
||||
- pip
|
||||
|
||||
### 2. 安装依赖
|
||||
|
||||
```bash
|
||||
# 创建虚拟环境（推荐）
|
||||
python -m venv venv
|
||||
|
||||
# 激活虚拟环境
|
||||
# Windows:
|
||||
venv\Scripts\activate
|
||||
# Linux/Mac:
|
||||
source venv/bin/activate
|
||||
|
||||
# 安装依赖
|
||||
pip install -r requirements.txt
|
||||
```
|
||||
|
||||
### 3. 配置数据库
|
||||
|
||||
1. 在MySQL中创建数据库:
|
||||
```sql
|
||||
CREATE DATABASE ai_nav CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci;
|
||||
```
|
||||
|
||||
2. 复制环境变量配置文件:
|
||||
```bash
|
||||
cp .env.example .env
|
||||
```
|
||||
|
||||
3. 编辑 `.env` 文件，修改数据库配置:
|
||||
```
|
||||
DB_HOST=localhost
|
||||
DB_PORT=3306
|
||||
DB_USER=root
|
||||
DB_PASSWORD=your_password
|
||||
DB_NAME=ai_nav
|
||||
SECRET_KEY=your-secret-key-here
|
||||
```
|
||||
|
||||
### 4. 初始化数据库
|
||||
|
||||
```bash
|
||||
python init_db.py
|
||||
```
|
||||
|
||||
这将创建所有数据表，并添加示例数据和默认管理员账号。
|
||||
|
||||
### 5. 运行应用
|
||||
|
||||
```bash
|
||||
python app.py
|
||||
```
|
||||
|
||||
访问 `http://localhost:5000` 查看网站。
|
||||
|
||||
## 管理后台
|
||||
|
||||
### 访问后台
|
||||
|
||||
- 后台地址: `http://localhost:5000/admin`
|
||||
- 登录页面: `http://localhost:5000/admin/login`
|
||||
|
||||
### 默认管理员账号
|
||||
|
||||
```
|
||||
用户名: admin
|
||||
密码: admin123
|
||||
```
|
||||
|
||||
**⚠️ 重要**: 首次登录后请立即修改默认密码！
|
||||
|
||||
### 后台功能
|
||||
|
||||
- **网站管理**: 添加、编辑、删除AI工具
|
||||
- **标签管理**: 管理分类标签
|
||||
- **管理员管理**: 添加和管理管理员账号
|
||||
|
||||
## 宝塔面板部署
|
||||
|
||||
### 1. 安装Python环境
|
||||
|
||||
在宝塔面板中安装Python项目管理器，选择Python 3.8+版本。
|
||||
|
||||
### 2. 上传项目
|
||||
|
||||
将项目文件上传到服务器，例如 `/www/wwwroot/ai_nav`
|
||||
|
||||
### 3. 配置项目
|
||||
|
||||
1. 在宝塔面板中创建Python项目
|
||||
2. 项目路径: `/www/wwwroot/ai_nav`
|
||||
3. 启动文件: `app.py`
|
||||
4. 端口: 5000（或其他可用端口）
|
||||
|
||||
### 4. 安装依赖
|
||||
|
||||
在项目目录下执行:
|
||||
```bash
|
||||
pip install -r requirements.txt
|
||||
```
|
||||
|
||||
### 5. 配置反向代理
|
||||
|
||||
在宝塔面板的网站设置中配置反向代理:
|
||||
- 目标URL: `http://127.0.0.1:5000`
|
||||
- 启用缓存和gzip压缩
|
||||
|
||||
### 6. 配置SSL证书（可选）
|
||||
|
||||
为网站配置SSL证书以启用HTTPS。
|
||||
|
||||
## 使用说明
|
||||
|
||||
### 添加新网站
|
||||
|
||||
1. 登录后台管理系统
|
||||
2. 点击"网站管理" -> "Create"
|
||||
3. 填写网站信息:
|
||||
- 网站名称
|
||||
- URL地址
|
||||
- URL别名（用于SEO友好的URL）
|
||||
- Logo图片URL
|
||||
- 简短描述
|
||||
- 详细介绍
|
||||
- 主要功能
|
||||
- 选择标签
|
||||
- 排序权重（数字越大越靠前）
|
||||
|
||||
### 管理标签
|
||||
|
||||
1. 登录后台
|
||||
2. 点击"标签管理"
|
||||
3. 可以添加、编辑或删除标签
|
||||
4. 为标签设置图标（Font Awesome类名）
|
||||
|
||||
## 开发计划
|
||||
|
||||
- [ ] 搜索功能
|
||||
- [ ] 用户评论和评分
|
||||
- [ ] 关联新闻搜索（2.0版本）
|
||||
- [ ] 数据统计和分析
|
||||
- [ ] API接口
|
||||
- [ ] 网站收藏功能
|
||||
|
||||
## 常见问题
|
||||
|
||||
### 1. 数据库连接失败
|
||||
|
||||
检查 `.env` 文件中的数据库配置是否正确，确保MySQL服务正在运行。
|
||||
|
||||
### 2. 启动时出现端口占用
|
||||
|
||||
修改 `app.py` 中的端口号，或关闭占用5000端口的其他程序。
|
||||
|
||||
### 3. 静态资源加载失败
|
||||
|
||||
检查 `static` 目录权限，确保Web服务器有读取权限。
|
||||
|
||||
## 许可证
|
||||
|
||||
MIT License
|
||||
|
||||
## 联系方式
|
||||
|
||||
如有问题或建议，请提交Issue。
|
||||
Reference in New Issue
Block a user