206 lines
3.7 KiB
Markdown
206 lines
3.7 KiB
Markdown
# PerToolBox Front - 前端界面
|
||
|
||
> 一个基于 PHP + HTML/CSS/JS 的个人工具箱前端项目，采用响应式侧边栏设计，适配多端设备。
|
||
|
||
---
|
||
|
||
## 项目信息
|
||
|
||
- 版权所有：Sea Network Technology Studio
|
||
- 权利人：Canglan
|
||
- 联系方式：admin@sea-studio.top
|
||
- 开源协议：AGPL v3
|
||
|
||
---
|
||
|
||
## 功能特性
|
||
|
||
- 响应式侧边栏（支持手机 / PC）
|
||
- 用户认证（登录 / 注册 / 验证码）
|
||
- 待办事项管理（CRUD）
|
||
- 便签本（CRUD）
|
||
- 密码生成器
|
||
- 二维码生成
|
||
- 加密工具箱：
|
||
- Hash
|
||
- Base64
|
||
- URL 编码
|
||
- AES 加密
|
||
- JSON 校验与格式化
|
||
- 热度统计展示
|
||
|
||
---
|
||
|
||
## 环境要求
|
||
|
||
- PHP >= 8.0
|
||
- Nginx 或 Apache
|
||
|
||
---
|
||
|
||
## 快速开始
|
||
|
||
### 1. 克隆项目
|
||
|
||
```bash
|
||
git clone https://hz-gitea.sea-studio.top/Sea-Studio/PerToolBoxFront.git
|
||
cd PerToolBoxFront
|
||
```
|
||
|
||
### 2. 配置后端接口
|
||
|
||
编辑 config.php：
|
||
|
||
```php
|
||
define('API_BASE_URL', 'https://your-domain/api/v1');
|
||
```
|
||
|
||
### 3. 配置 Nginx
|
||
|
||
```nginx
|
||
server {
|
||
listen 80;
|
||
server_name your-domain;
|
||
|
||
root /path/to/PerToolBoxFront;
|
||
index index.php;
|
||
|
||
location / {
|
||
try_files $uri $uri/ /index.php;
|
||
}
|
||
|
||
location ~ \.php$ {
|
||
fastcgi_pass unix:/var/run/php/php8.0-fpm.sock;
|
||
fastcgi_index index.php;
|
||
fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
|
||
include fastcgi_params;
|
||
}
|
||
}
|
||
```
|
||
|
||
### 4. 访问项目
|
||
|
||
```
|
||
http://your-domain
|
||
```
|
||
|
||
---
|
||
|
||
## 项目结构
|
||
|
||
```text
|
||
PerToolBoxFront/
|
||
├── index.php # 首页
|
||
├── login.php # 登录/注册
|
||
├── profile.php # 个人中心
|
||
├── config.php # 配置文件
|
||
├── header.php # 公共头部
|
||
├── footer.php # 公共底部
|
||
├── sidebar.php # 侧边栏
|
||
├── css/
|
||
│ └── style.css # 样式文件
|
||
├── js/
|
||
│ └── common.js # 公共脚本
|
||
└── pages/ # 功能页面
|
||
├── todos.php # 待办事项
|
||
├── notes.php # 便签
|
||
├── password.php # 密码生成
|
||
├── qrcode.php # 二维码
|
||
├── crypto.php # 加密工具
|
||
└── json.php # JSON 工具
|
||
```
|
||
|
||
---
|
||
|
||
## 后端 API 要求
|
||
|
||
后端服务基础路径：
|
||
|
||
```
|
||
https://your-domain/api/v1
|
||
```
|
||
|
||
实现以下接口：
|
||
|
||
### 认证模块
|
||
|
||
- 用户注册
|
||
- 用户登录
|
||
- 验证码发送
|
||
|
||
### 数据模块
|
||
|
||
- 待办事项 CRUD
|
||
- 便签 CRUD
|
||
|
||
### 工具模块
|
||
|
||
- 密码生成
|
||
- 二维码生成
|
||
- 加密 / 解密
|
||
- JSON 处理
|
||
|
||
### 统计模块
|
||
|
||
- 热度统计接口
|
||
|
||
---
|
||
|
||
## 部署指南
|
||
|
||
### 后端部署
|
||
|
||
```bash
|
||
# 1. 安装依赖
|
||
sudo dnf install -y python python-pip mysql redis nginx git # CentOS/Rocky
|
||
sudo apt install -y python python-pip mysql redis nginx git # Ubuntu/Debian
|
||
|
||
# 2. 克隆项目
|
||
git clone https://hz-gitea.sea-studio.top/Sea-Studio/PerToolBoxServer.git
|
||
cd PerToolBoxServer
|
||
|
||
# 3. 创建虚拟环境
|
||
python -m venv venv
|
||
source venv/bin/activate
|
||
|
||
# 4. 安装依赖
|
||
pip install -r requirements.txt
|
||
|
||
# 5. 配置环境变量
|
||
cp .env.example .env
|
||
# 编辑 .env 文件（数据库 / Redis / 短信服务）
|
||
|
||
# 6. 初始化数据库
|
||
mysql -u root -p < scripts/init_db.sql
|
||
|
||
# 7. 启动服务
|
||
uvicorn backend.main:app --host 0.0.0.0 --port 8000
|
||
```
|
||
|
||
### 前端部署（Linux + Nginx + PHP）
|
||
|
||
```bash
|
||
# 1. 安装依赖
|
||
sudo dnf install -y php php-fpm nginx # CentOS/Rocky
|
||
sudo apt install -y php php-fpm nginx # Ubuntu/Debian
|
||
|
||
# 2. 克隆项目
|
||
git clone https://hz-gitea.sea-studio.top/Sea-Studio/PerToolBoxFront.git
|
||
cd PerToolBoxFront
|
||
|
||
# 3. 配置 API 地址
|
||
# 编辑 config.php
|
||
|
||
# 4. 配置 Nginx
|
||
# 参考上方配置
|
||
|
||
# 5. 启动服务
|
||
sudo systemctl start php-fpm
|
||
sudo systemctl start nginx
|
||
```
|
||
|
||
---
|
||
|
||
## 许可证
|
||
|
||
本项目基于 AGPL v3 协议开源。 |