chore(repo): clean template leftovers and refresh README for current deployment
This commit is contained in:
129
README.md
129
README.md
@@ -4,6 +4,15 @@
|
|||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
|
## 近期更新(2026-02)
|
||||||
|
|
||||||
|
- Socket.IO 运行模式已切换为 `eventlet`(生产优先)。
|
||||||
|
- 管理端前端增加请求缓存/去重,降低报表页重复请求压力。
|
||||||
|
- 默认 Docker 端口映射更新为 `51232 -> 51233`。
|
||||||
|
- 已清理仓库中的历史清理报告与明显冗余文件。
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
## 项目简介
|
## 项目简介
|
||||||
|
|
||||||
本项目是一个 **Docker 容器化应用**,使用 Flask + Vue 3 + Requests + wkhtmltoimage + SQLite 构建,提供:
|
本项目是一个 **Docker 容器化应用**,使用 Flask + Vue 3 + Requests + wkhtmltoimage + SQLite 构建,提供:
|
||||||
@@ -36,7 +45,7 @@
|
|||||||
|
|
||||||
## 技术栈
|
## 技术栈
|
||||||
|
|
||||||
- **后端**: Python 3.11+, Flask, Flask-SocketIO
|
- **后端**: Python 3.10+, Flask, Flask-SocketIO
|
||||||
- **前端**: Vue 3 + Vite + Element Plus (SPA)
|
- **前端**: Vue 3 + Vite + Element Plus (SPA)
|
||||||
- **数据库**: SQLite + 连接池
|
- **数据库**: SQLite + 连接池
|
||||||
- **自动化**: Requests + BeautifulSoup (浏览)
|
- **自动化**: Requests + BeautifulSoup (浏览)
|
||||||
@@ -92,7 +101,7 @@ zsglpt/
|
|||||||
├── static/ # 前端构建产物
|
├── static/ # 前端构建产物
|
||||||
│ ├── app/ # 用户端 SPA 资源
|
│ ├── app/ # 用户端 SPA 资源
|
||||||
│ └── admin/ # 管理端 SPA 资源
|
│ └── admin/ # 管理端 SPA 资源
|
||||||
└── tests/ # 测试用例
|
└── scripts/ # 维护脚本(例如健康监控)
|
||||||
```
|
```
|
||||||
|
|
||||||
---
|
---
|
||||||
@@ -134,7 +143,7 @@ ssh -i /path/to/key root@your-server-ip
|
|||||||
在项目根目录创建 `.env` 文件:
|
在项目根目录创建 `.env` 文件:
|
||||||
|
|
||||||
```bash
|
```bash
|
||||||
cd /www/wwwroot/zsgpt2
|
cd /www/wwwroot/zsglpt
|
||||||
|
|
||||||
# 生成随机密钥
|
# 生成随机密钥
|
||||||
python3 -c "from cryptography.fernet import Fernet; print(f'ENCRYPTION_KEY_RAW={Fernet.generate_key().decode()}')" > .env
|
python3 -c "from cryptography.fernet import Fernet; print(f'ENCRYPTION_KEY_RAW={Fernet.generate_key().decode()}')" > .env
|
||||||
@@ -149,7 +158,7 @@ chmod 600 .env
|
|||||||
|
|
||||||
```bash
|
```bash
|
||||||
# 从旧服务器复制 .env 文件
|
# 从旧服务器复制 .env 文件
|
||||||
scp root@old-server:/www/wwwroot/zsgpt2/.env /www/wwwroot/zsgpt2/
|
scp root@old-server:/www/wwwroot/zsglpt/.env /www/wwwroot/zsglpt/
|
||||||
```
|
```
|
||||||
|
|
||||||
#### ⚠️ 重要警告
|
#### ⚠️ 重要警告
|
||||||
@@ -165,16 +174,16 @@ scp root@old-server:/www/wwwroot/zsgpt2/.env /www/wwwroot/zsgpt2/
|
|||||||
|
|
||||||
### 步骤1: 上传项目文件
|
### 步骤1: 上传项目文件
|
||||||
|
|
||||||
将整个 `zsgpt2` 文件夹上传到服务器的 `/www/wwwroot/` 目录:
|
将整个 `zsglpt` 文件夹上传到服务器的 `/www/wwwroot/` 目录:
|
||||||
|
|
||||||
```bash
|
```bash
|
||||||
# 在本地执行(Windows PowerShell 或 Git Bash)
|
# 在本地执行(Windows PowerShell 或 Git Bash)
|
||||||
scp -r C:\Users\Administrator\Desktop\zsgpt2 root@your-server-ip:/www/wwwroot/
|
scp -r C:\Users\Administrator\Desktop\zsglpt root@your-server-ip:/www/wwwroot/
|
||||||
|
|
||||||
# 或者使用 FileZilla、WinSCP 等工具上传
|
# 或者使用 FileZilla、WinSCP 等工具上传
|
||||||
```
|
```
|
||||||
|
|
||||||
上传后,服务器上的路径应该是:`/www/wwwroot/zsgpt2/`
|
上传后,服务器上的路径应该是:`/www/wwwroot/zsglpt/`
|
||||||
|
|
||||||
### 步骤2: SSH登录服务器
|
### 步骤2: SSH登录服务器
|
||||||
|
|
||||||
@@ -185,7 +194,7 @@ ssh root@your-server-ip
|
|||||||
### 步骤3: 进入项目目录
|
### 步骤3: 进入项目目录
|
||||||
|
|
||||||
```bash
|
```bash
|
||||||
cd /www/wwwroot/zsgpt2
|
cd /www/wwwroot/zsglpt
|
||||||
```
|
```
|
||||||
|
|
||||||
### 步骤4: 创建必要的目录
|
### 步骤4: 创建必要的目录
|
||||||
@@ -202,7 +211,7 @@ chmod 777 data logs 截图
|
|||||||
docker build -t knowledge-automation .
|
docker build -t knowledge-automation .
|
||||||
|
|
||||||
# 启动容器
|
# 启动容器
|
||||||
docker-compose up -d
|
docker compose up -d
|
||||||
|
|
||||||
# 查看容器状态
|
# 查看容器状态
|
||||||
docker ps | grep knowledge-automation
|
docker ps | grep knowledge-automation
|
||||||
@@ -217,8 +226,8 @@ docker logs -f knowledge-automation-multiuser
|
|||||||
如果看到以下信息,说明启动成功:
|
如果看到以下信息,说明启动成功:
|
||||||
```
|
```
|
||||||
服务器启动中...
|
服务器启动中...
|
||||||
用户访问地址: http://0.0.0.0:5000
|
用户访问地址: http://0.0.0.0:51233
|
||||||
后台管理地址: http://0.0.0.0:5000/yuyx
|
后台管理地址: http://0.0.0.0:51233/yuyx
|
||||||
```
|
```
|
||||||
|
|
||||||
---
|
---
|
||||||
@@ -252,7 +261,7 @@ server {
|
|||||||
|
|
||||||
# 反向代理
|
# 反向代理
|
||||||
location / {
|
location / {
|
||||||
proxy_pass http://127.0.0.1:5001;
|
proxy_pass http://127.0.0.1:51232;
|
||||||
proxy_set_header Host $host;
|
proxy_set_header Host $host;
|
||||||
proxy_set_header X-Real-IP $remote_addr;
|
proxy_set_header X-Real-IP $remote_addr;
|
||||||
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
|
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
|
||||||
@@ -294,15 +303,15 @@ certbot renew --dry-run
|
|||||||
|
|
||||||
### 用户端
|
### 用户端
|
||||||
|
|
||||||
- **HTTP**: `http://your-server-ip:5001`
|
- **HTTP**: `http://your-server-ip:51232`
|
||||||
- **域名**: `http://your-domain.com` (配置Nginx后)
|
- **域名**: `http://your-domain.com` (配置Nginx后)
|
||||||
- **HTTPS**: `https://your-domain.com` (配置SSL后)
|
- **HTTPS**: `https://your-domain.com` (配置SSL后)
|
||||||
|
|
||||||
### 后台管理
|
### 后台管理
|
||||||
|
|
||||||
- **路径**: `/yuyx`
|
- **后台地址**: `/yuyx`
|
||||||
- **默认账号**: `admin`
|
- **管理员账号**: 以数据库现有账号为准(首次运行默认创建 `admin`)
|
||||||
- **默认密码**: `admin`
|
- **管理员密码**: 首次运行随机生成,请查看容器启动日志
|
||||||
|
|
||||||
**首次登录后请立即修改密码!**
|
**首次登录后请立即修改密码!**
|
||||||
|
|
||||||
@@ -360,7 +369,7 @@ docker logs -f knowledge-automation-multiuser
|
|||||||
docker logs --tail 100 knowledge-automation-multiuser
|
docker logs --tail 100 knowledge-automation-multiuser
|
||||||
|
|
||||||
# 查看应用日志文件
|
# 查看应用日志文件
|
||||||
tail -f /www/wwwroot/zsgpt2/logs/app.log
|
tail -f /www/wwwroot/zsglpt/logs/app.log
|
||||||
```
|
```
|
||||||
|
|
||||||
### 进入容器
|
### 进入容器
|
||||||
@@ -378,14 +387,14 @@ docker exec knowledge-automation-multiuser python -c "print('Hello')"
|
|||||||
如果修改了代码,需要重新构建:
|
如果修改了代码,需要重新构建:
|
||||||
|
|
||||||
```bash
|
```bash
|
||||||
cd /www/wwwroot/zsgpt2
|
cd /www/wwwroot/zsglpt
|
||||||
|
|
||||||
# 停止并删除旧容器
|
# 停止并删除旧容器
|
||||||
docker-compose down
|
docker compose down
|
||||||
|
|
||||||
# 重新构建并启动
|
# 重新构建并启动
|
||||||
docker-compose build
|
docker compose build
|
||||||
docker-compose up -d
|
docker compose up -d
|
||||||
```
|
```
|
||||||
|
|
||||||
---
|
---
|
||||||
@@ -398,13 +407,13 @@ docker-compose up -d
|
|||||||
cd /www/wwwroot
|
cd /www/wwwroot
|
||||||
|
|
||||||
# 备份整个项目
|
# 备份整个项目
|
||||||
tar -czf zsgpt2_backup_$(date +%Y%m%d).tar.gz zsgpt2/
|
tar -czf zsglpt_backup_$(date +%Y%m%d).tar.gz zsglpt/
|
||||||
|
|
||||||
# 仅备份数据库
|
# 仅备份数据库
|
||||||
cp /www/wwwroot/zsgpt2/data/app_data.db /backup/app_data_$(date +%Y%m%d).db
|
cp /www/wwwroot/zsglpt/data/app_data.db /backup/app_data_$(date +%Y%m%d).db
|
||||||
|
|
||||||
# 备份截图
|
# 备份截图
|
||||||
tar -czf screenshots_$(date +%Y%m%d).tar.gz /www/wwwroot/zsgpt2/截图/
|
tar -czf screenshots_$(date +%Y%m%d).tar.gz /www/wwwroot/zsglpt/截图/
|
||||||
```
|
```
|
||||||
|
|
||||||
### 2. 恢复数据
|
### 2. 恢复数据
|
||||||
@@ -415,10 +424,10 @@ docker stop knowledge-automation-multiuser
|
|||||||
|
|
||||||
# 恢复整个项目
|
# 恢复整个项目
|
||||||
cd /www/wwwroot
|
cd /www/wwwroot
|
||||||
tar -xzf zsgpt2_backup_20251027.tar.gz
|
tar -xzf zsglpt_backup_20251027.tar.gz
|
||||||
|
|
||||||
# 恢复数据库
|
# 恢复数据库
|
||||||
cp /backup/app_data_20251027.db /www/wwwroot/zsgpt2/data/app_data.db
|
cp /backup/app_data_20251027.db /www/wwwroot/zsglpt/data/app_data.db
|
||||||
|
|
||||||
# 重启容器
|
# 重启容器
|
||||||
docker start knowledge-automation-multiuser
|
docker start knowledge-automation-multiuser
|
||||||
@@ -436,7 +445,7 @@ crontab -e
|
|||||||
|
|
||||||
```bash
|
```bash
|
||||||
# 每天凌晨3点备份
|
# 每天凌晨3点备份
|
||||||
0 3 * * * tar -czf /backup/zsgpt2_$(date +\%Y\%m\%d).tar.gz /www/wwwroot/zsgpt2/data
|
0 3 * * * tar -czf /backup/zsglpt_$(date +\%Y\%m\%d).tar.gz /www/wwwroot/zsglpt/data
|
||||||
```
|
```
|
||||||
|
|
||||||
---
|
---
|
||||||
@@ -445,19 +454,19 @@ crontab -e
|
|||||||
|
|
||||||
### 1. 容器启动失败
|
### 1. 容器启动失败
|
||||||
|
|
||||||
**问题**: `docker-compose up -d` 失败
|
**问题**: `docker compose up -d` 失败
|
||||||
|
|
||||||
**解决方案**:
|
**解决方案**:
|
||||||
```bash
|
```bash
|
||||||
# 查看详细错误
|
# 查看详细错误
|
||||||
docker-compose logs
|
docker compose logs
|
||||||
|
|
||||||
# 检查端口占用
|
# 检查端口占用
|
||||||
netstat -tlnp | grep 5001
|
netstat -tlnp | grep 51232
|
||||||
|
|
||||||
# 重新构建
|
# 重新构建
|
||||||
docker-compose build --no-cache
|
docker compose build --no-cache
|
||||||
docker-compose up -d
|
docker compose up -d
|
||||||
```
|
```
|
||||||
|
|
||||||
### 2. 502 Bad Gateway
|
### 2. 502 Bad Gateway
|
||||||
@@ -470,10 +479,10 @@ docker-compose up -d
|
|||||||
docker ps | grep knowledge-automation
|
docker ps | grep knowledge-automation
|
||||||
|
|
||||||
# 检查端口是否监听
|
# 检查端口是否监听
|
||||||
netstat -tlnp | grep 5001
|
netstat -tlnp | grep 51232
|
||||||
|
|
||||||
# 测试直接访问
|
# 测试直接访问
|
||||||
curl http://127.0.0.1:5001
|
curl http://127.0.0.1:51232
|
||||||
|
|
||||||
# 检查Nginx配置
|
# 检查Nginx配置
|
||||||
nginx -t
|
nginx -t
|
||||||
@@ -489,7 +498,7 @@ nginx -t
|
|||||||
docker restart knowledge-automation-multiuser
|
docker restart knowledge-automation-multiuser
|
||||||
|
|
||||||
# 如果问题持续,优化数据库
|
# 如果问题持续,优化数据库
|
||||||
cd /www/wwwroot/zsgpt2
|
cd /www/wwwroot/zsglpt
|
||||||
cp data/app_data.db data/app_data.db.backup
|
cp data/app_data.db data/app_data.db.backup
|
||||||
sqlite3 data/app_data.db "VACUUM;"
|
sqlite3 data/app_data.db "VACUUM;"
|
||||||
```
|
```
|
||||||
@@ -512,8 +521,8 @@ services:
|
|||||||
然后重启:
|
然后重启:
|
||||||
|
|
||||||
```bash
|
```bash
|
||||||
docker-compose down
|
docker compose down
|
||||||
docker-compose up -d
|
docker compose up -d
|
||||||
```
|
```
|
||||||
|
|
||||||
### 5. 截图工具未安装
|
### 5. 截图工具未安装
|
||||||
@@ -555,13 +564,13 @@ wkhtmltoimage --version
|
|||||||
|
|
||||||
```bash
|
```bash
|
||||||
# 清理7天前的截图
|
# 清理7天前的截图
|
||||||
find /www/wwwroot/zsgpt2/截图 -name "*.jpg" -mtime +7 -delete
|
find /www/wwwroot/zsglpt/截图 -name "*.jpg" -mtime +7 -delete
|
||||||
|
|
||||||
# 清理旧日志
|
# 清理旧日志
|
||||||
find /www/wwwroot/zsgpt2/logs -name "*.log" -mtime +30 -delete
|
find /www/wwwroot/zsglpt/logs -name "*.log" -mtime +30 -delete
|
||||||
|
|
||||||
# 优化数据库
|
# 优化数据库
|
||||||
sqlite3 /www/wwwroot/zsgpt2/data/app_data.db "VACUUM;"
|
sqlite3 /www/wwwroot/zsglpt/data/app_data.db "VACUUM;"
|
||||||
```
|
```
|
||||||
|
|
||||||
---
|
---
|
||||||
@@ -582,9 +591,9 @@ firewall-cmd --permanent --add-port=80/tcp
|
|||||||
firewall-cmd --permanent --add-port=443/tcp
|
firewall-cmd --permanent --add-port=443/tcp
|
||||||
firewall-cmd --reload
|
firewall-cmd --reload
|
||||||
|
|
||||||
# 禁止直接访问5001端口(仅Nginx可访问)
|
# 禁止直接访问51232端口(仅Nginx可访问)
|
||||||
iptables -A INPUT -p tcp --dport 5001 -s 127.0.0.1 -j ACCEPT
|
iptables -A INPUT -p tcp --dport 51232 -s 127.0.0.1 -j ACCEPT
|
||||||
iptables -A INPUT -p tcp --dport 5001 -j DROP
|
iptables -A INPUT -p tcp --dport 51232 -j DROP
|
||||||
```
|
```
|
||||||
|
|
||||||
### 3. 启用HTTPS
|
### 3. 启用HTTPS
|
||||||
@@ -625,13 +634,13 @@ systemctl restart sshd
|
|||||||
|
|
||||||
```bash
|
```bash
|
||||||
# 统计今日任务数
|
# 统计今日任务数
|
||||||
grep "浏览完成" /www/wwwroot/zsgpt2/logs/app.log | grep $(date +%Y-%m-%d) | wc -l
|
grep "浏览完成" /www/wwwroot/zsglpt/logs/app.log | grep $(date +%Y-%m-%d) | wc -l
|
||||||
|
|
||||||
# 查看错误日志
|
# 查看错误日志
|
||||||
grep "ERROR" /www/wwwroot/zsgpt2/logs/app.log | tail -20
|
grep "ERROR" /www/wwwroot/zsglpt/logs/app.log | tail -20
|
||||||
|
|
||||||
# 查看最近的登录
|
# 查看最近的登录
|
||||||
grep "登录成功" /www/wwwroot/zsgpt2/logs/app.log | tail -10
|
grep "登录成功" /www/wwwroot/zsglpt/logs/app.log | tail -10
|
||||||
```
|
```
|
||||||
|
|
||||||
### 3. 数据库维护
|
### 3. 数据库维护
|
||||||
@@ -655,7 +664,7 @@ EOF
|
|||||||
|
|
||||||
```bash
|
```bash
|
||||||
# 停止容器
|
# 停止容器
|
||||||
docker-compose down
|
docker compose down
|
||||||
|
|
||||||
# 备份数据
|
# 备份数据
|
||||||
cp -r data data.backup
|
cp -r data data.backup
|
||||||
@@ -665,8 +674,8 @@ cp -r 截图 截图.backup
|
|||||||
# 使用 scp 或 FTP 工具上传
|
# 使用 scp 或 FTP 工具上传
|
||||||
|
|
||||||
# 重新构建并启动
|
# 重新构建并启动
|
||||||
docker-compose build
|
docker compose build
|
||||||
docker-compose up -d
|
docker compose up -d
|
||||||
```
|
```
|
||||||
|
|
||||||
### 2. 数据库迁移
|
### 2. 数据库迁移
|
||||||
@@ -685,8 +694,8 @@ docker logs knowledge-automation-multiuser | grep "数据库"
|
|||||||
|
|
||||||
| 端口 | 说明 | 映射 |
|
| 端口 | 说明 | 映射 |
|
||||||
|------|------|------|
|
|------|------|------|
|
||||||
| 5000 | 容器内应用端口 | - |
|
| 51233 | 容器内应用端口 | - |
|
||||||
| 5001 | 主机映射端口 | 容器5000 → 主机5001 |
|
| 51232 | 主机映射端口 | 容器51233 → 主机51232 |
|
||||||
| 80 | HTTP端口 | Nginx |
|
| 80 | HTTP端口 | Nginx |
|
||||||
| 443 | HTTPS端口 | Nginx |
|
| 443 | HTTPS端口 | Nginx |
|
||||||
|
|
||||||
@@ -737,7 +746,7 @@ docker logs knowledge-automation-multiuser | grep "数据库"
|
|||||||
遇到问题时,请按以下顺序检查:
|
遇到问题时,请按以下顺序检查:
|
||||||
|
|
||||||
1. **容器日志**: `docker logs knowledge-automation-multiuser`
|
1. **容器日志**: `docker logs knowledge-automation-multiuser`
|
||||||
2. **应用日志**: `cat /www/wwwroot/zsgpt2/logs/app.log`
|
2. **应用日志**: `cat /www/wwwroot/zsglpt/logs/app.log`
|
||||||
3. **Nginx日志**: `cat /var/log/nginx/zsgpt_error.log`
|
3. **Nginx日志**: `cat /var/log/nginx/zsgpt_error.log`
|
||||||
4. **系统资源**: `docker stats`, `htop`, `df -h`
|
4. **系统资源**: `docker stats`, `htop`, `df -h`
|
||||||
|
|
||||||
@@ -749,8 +758,8 @@ docker logs knowledge-automation-multiuser | grep "数据库"
|
|||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
**文档版本**: v2.0
|
**文档版本**: v2.1
|
||||||
**更新日期**: 2026-01-08
|
**更新日期**: 2026-02-07
|
||||||
**适用版本**: Docker多用户版 + Vue SPA
|
**适用版本**: Docker多用户版 + Vue SPA
|
||||||
|
|
||||||
---
|
---
|
||||||
@@ -759,26 +768,26 @@ docker logs knowledge-automation-multiuser | grep "数据库"
|
|||||||
|
|
||||||
```bash
|
```bash
|
||||||
# 1. 上传文件
|
# 1. 上传文件
|
||||||
scp -r zsgpt2 root@your-ip:/www/wwwroot/
|
scp -r zsglpt root@your-ip:/www/wwwroot/
|
||||||
|
|
||||||
# 2. SSH登录
|
# 2. SSH登录
|
||||||
ssh root@your-ip
|
ssh root@your-ip
|
||||||
|
|
||||||
# 3. 进入目录并创建必要目录
|
# 3. 进入目录并创建必要目录
|
||||||
cd /www/wwwroot/zsgpt2
|
cd /www/wwwroot/zsglpt
|
||||||
mkdir -p data logs 截图
|
mkdir -p data logs 截图
|
||||||
chmod 777 data logs 截图
|
chmod 777 data logs 截图
|
||||||
|
|
||||||
# 4. 启动容器
|
# 4. 启动容器
|
||||||
docker-compose up -d
|
docker compose up -d
|
||||||
|
|
||||||
# 5. 查看日志
|
# 5. 查看日志
|
||||||
docker logs -f knowledge-automation-multiuser
|
docker logs -f knowledge-automation-multiuser
|
||||||
|
|
||||||
# 6. 访问系统
|
# 6. 访问系统
|
||||||
# 浏览器打开: http://your-ip:5001
|
# 浏览器打开: http://your-ip:51232
|
||||||
# 后台管理: http://your-ip:5001/yuyx
|
# 后台管理: http://your-ip:51232/yuyx
|
||||||
# 默认账号: admin / admin
|
# 默认管理员账号见容器启动日志(首次运行会生成随机密码)
|
||||||
```
|
```
|
||||||
|
|
||||||
完成!🎉
|
完成!🎉
|
||||||
|
|||||||
@@ -1,5 +0,0 @@
|
|||||||
# Vue 3 + Vite
|
|
||||||
|
|
||||||
This template should help get you started developing with Vue 3 in Vite. The template uses Vue 3 `<script setup>` SFCs, check out the [script setup docs](https://v3.vuejs.org/api/sfc-script-setup.html#sfc-script-setup) to learn more.
|
|
||||||
|
|
||||||
Learn more about IDE Support for Vue in the [Vue Docs Scaling up Guide](https://vuejs.org/guide/scaling-up/tooling.html#ide-support).
|
|
||||||
@@ -1 +0,0 @@
|
|||||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="37.07" height="36" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 198"><path fill="#41B883" d="M204.8 0H256L128 220.8L0 0h97.92L128 51.2L157.44 0h47.36Z"></path><path fill="#41B883" d="m0 0l128 220.8L256 0h-51.2L128 132.48L50.56 0H0Z"></path><path fill="#35495E" d="M50.56 0L128 133.12L204.8 0h-47.36L128 51.2L97.92 0H50.56Z"></path></svg>
|
|
||||||
|
Before Width: | Height: | Size: 496 B |
@@ -1,51 +0,0 @@
|
|||||||
<script setup>
|
|
||||||
import { computed } from 'vue'
|
|
||||||
|
|
||||||
const props = defineProps({
|
|
||||||
stats: { type: Object, required: true },
|
|
||||||
loading: { type: Boolean, default: false },
|
|
||||||
})
|
|
||||||
|
|
||||||
const items = computed(() => [
|
|
||||||
{ key: 'total_users', label: '总用户数' },
|
|
||||||
{ key: 'new_users_today', label: '今日注册' },
|
|
||||||
{ key: 'new_users_7d', label: '近7天注册' },
|
|
||||||
{ key: 'total_accounts', label: '总账号数' },
|
|
||||||
{ key: 'vip_users', label: 'VIP用户' },
|
|
||||||
])
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<el-row :gutter="12" class="stats-row">
|
|
||||||
<el-col v-for="it in items" :key="it.key" :xs="12" :sm="8" :md="6" :lg="4" :xl="4">
|
|
||||||
<el-card shadow="never" class="stat-card" :body-style="{ padding: '14px' }">
|
|
||||||
<div class="stat-value">
|
|
||||||
<el-skeleton v-if="loading" :rows="1" animated />
|
|
||||||
<template v-else>{{ stats?.[it.key] ?? 0 }}</template>
|
|
||||||
</div>
|
|
||||||
<div class="stat-label">{{ it.label }}</div>
|
|
||||||
</el-card>
|
|
||||||
</el-col>
|
|
||||||
</el-row>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
.stats-row {
|
|
||||||
margin-bottom: 14px;
|
|
||||||
}
|
|
||||||
.stat-card {
|
|
||||||
border-radius: var(--app-radius);
|
|
||||||
border: 1px solid var(--app-border);
|
|
||||||
box-shadow: var(--app-shadow);
|
|
||||||
}
|
|
||||||
.stat-value {
|
|
||||||
font-size: 22px;
|
|
||||||
font-weight: 800;
|
|
||||||
line-height: 1.1;
|
|
||||||
}
|
|
||||||
.stat-label {
|
|
||||||
margin-top: 6px;
|
|
||||||
font-size: 12px;
|
|
||||||
color: var(--app-muted);
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
Reference in New Issue
Block a user