401 lines
9.9 KiB
Markdown
401 lines
9.9 KiB
Markdown
# UrNetwork Stats Dashboard - Enhanced Multi-Account Edition v2.1
|
|
|
|
Hits - [demo](http://38.242.156.120:90) | [](https://hits.sh/38.242.156.120:90/)
|
|
|
|
Hits - [repo](https://forgejo.plainrock127.xyz/mxnticek/UrNetwork-Stats-Dashboard-remade) | [](https://hits.sh/forgejo.plainrock127.xyz/mxnticek/UrNetwork-Stats-Dashboard-remade/)
|
|
|
|
---
|
|
|
|
## 🌟 Quick Links
|
|
|
|
- 🚀 [Quick Start Guide](QUICKSTART.md) - Get running in 5 minutes
|
|
- 📊 [Webhook Setup Tutorial](WEBHOOK_GUIDE.md) - Discord, Slack, Telegram examples
|
|
- 🎨 [Design Comparison](DESIGN_COMPARISON.md) - Why this design?
|
|
- 🔄 [Upgrade Guide](UPGRADE_GUIDE.md) - Migrating from v1.0
|
|
- 📝 [Changelog](CHANGELOG.md) - Version history
|
|
- 🇨🇿 [Český README](README_CZ.md) - Czech documentation
|
|
|
|
---
|
|
|
|
## 🇬🇧 English
|
|
|
|
### About The Project
|
|
|
|
This is a **significantly enhanced multi-account version** of the original [UrNetwork Stats Dashboard](https://github.com/techroy23/UrNetwork-Stats-Dashboard). Track unlimited UrNetwork accounts with beautiful charts, real-time updates, and webhook notifications.
|
|
|
|
**What's New in v2.1:**
|
|
- 🎯 **Multi-Account Support** - Track unlimited UrNetwork accounts
|
|
- 🎨 **Clean Design** - Cloudflare-inspired dark theme
|
|
- 📊 **Better Charts** - White text, tooltips anywhere on chart
|
|
- 🔐 **Separate Auth** - Admin password independent from UrNetwork
|
|
- ⚡ **Daily Cleanup** - Auto-delete data older than 7 days
|
|
- 📱 **Mobile Optimized** - Touch-friendly interface
|
|
|
|
> **Enhanced by AI:** v2.0+ developed with Claude (Anthropic) for better UX, multi-account support, and modern design.
|
|
|
|
---
|
|
|
|
### ✨ Key Features
|
|
|
|
#### 🎯 Multi-Account Management
|
|
- ✅ Track unlimited UrNetwork accounts simultaneously
|
|
- ✅ Combined statistics from all accounts
|
|
- ✅ Individual charts for each account
|
|
- ✅ Custom nicknames for easy identification
|
|
- ✅ Toggle accounts on/off without deletion
|
|
- ✅ Color-coded for easy distinction
|
|
|
|
#### 📊 Advanced Visualization
|
|
- ✅ Interactive Chart.js charts with tooltips **anywhere on chart**
|
|
- ✅ Total data, Paid vs Unpaid, Delta charts
|
|
- ✅ White readable text on all charts (no more squinting!)
|
|
- ✅ World map showing provider locations
|
|
- ✅ Real-time updates every minute
|
|
|
|
#### ⚙️ Automation
|
|
- ✅ Data collection every 15 minutes
|
|
- ✅ Daily cleanup (keeps last 7 days)
|
|
- ✅ Webhook notifications (Discord, Slack, Telegram)
|
|
- ✅ Device management across all accounts
|
|
|
|
#### 🎨 Modern UI
|
|
- ✅ Clean Cloudflare-inspired dark theme
|
|
- ✅ No gradients (better chart visibility)
|
|
- ✅ Blue accent color (#3b82f6)
|
|
- ✅ Fully responsive (mobile, tablet, desktop)
|
|
- ✅ Czech & English support
|
|
|
|
---
|
|
|
|
### 🚀 Quick Start
|
|
|
|
```bash
|
|
# 1. Clone repository
|
|
git clone https://forgejo.plainrock127.xyz/mxnticek/UrNetwork-Stats-Dashboard-remade
|
|
cd UrNetwork-Stats-Dashboard-remade
|
|
|
|
# 2. Install dependencies
|
|
pip install Flask Flask-SQLAlchemy Flask-APScheduler requests python-dateutil
|
|
|
|
# 3. Run
|
|
python main.py
|
|
|
|
# 4. Open browser
|
|
# http://localhost:90
|
|
```
|
|
|
|
**First Run Setup:**
|
|
1. Set your **admin password** (NOT your UrNetwork password!)
|
|
2. Add your UrNetwork accounts (email + password + nickname)
|
|
3. Done! Dashboard will start collecting data every 15 minutes
|
|
|
|
📖 **Need more details?** See [QUICKSTART.md](QUICKSTART.md)
|
|
|
|
---
|
|
|
|
### 📊 Webhook Setup - Quick Examples
|
|
|
|
#### Discord - Simple
|
|
```json
|
|
{
|
|
"content": "📊 **${account}**: ${total_gb} GB"
|
|
}
|
|
```
|
|
|
|
#### Discord - Rich Embed (Recommended)
|
|
```json
|
|
{
|
|
"username": "UrNetwork Bot",
|
|
"embeds": [{
|
|
"title": "⚡ ${account} - New Data!",
|
|
"color": 3901635,
|
|
"fields": [
|
|
{"name": "💰 Paid", "value": "`${paid_gb} GB`", "inline": true},
|
|
{"name": "📡 Unpaid", "value": "`${unpaid_gb} GB`", "inline": true},
|
|
{"name": "💾 Total", "value": "**${total_gb} GB**", "inline": false}
|
|
],
|
|
"footer": {"text": "UrNetwork Stats"},
|
|
"timestamp": "${update_time}"
|
|
}]
|
|
}
|
|
```
|
|
|
|
#### Telegram
|
|
```json
|
|
{
|
|
"chat_id": "YOUR_CHAT_ID",
|
|
"text": "📊 *${account}*\n💾 Total: ${total_gb} GB\n💰 Paid: ${paid_gb} GB\n📡 Unpaid: ${unpaid_gb} GB",
|
|
"parse_mode": "Markdown"
|
|
}
|
|
```
|
|
|
|
**Available Variables:**
|
|
- `${account}` - Account nickname
|
|
- `${paid_gb}` - Paid data in GB
|
|
- `${unpaid_gb}` - Unpaid data in GB
|
|
- `${total_gb}` - Total data in GB
|
|
- `${update_time}` - Timestamp
|
|
|
|
📖 **Full webhook guide:** [WEBHOOK_GUIDE.md](WEBHOOK_GUIDE.md)
|
|
|
|
---
|
|
|
|
### 🎨 Why This Design?
|
|
|
|
After extensive testing, we chose a **clean Cloudflare-inspired design** because:
|
|
|
|
1. **Better Chart Visibility** - Solid dark background = better contrast
|
|
2. **Professional Look** - Mimics enterprise dashboards
|
|
3. **No Eye Strain** - Pure colors without gradients
|
|
4. **Performance** - No blur effects = faster rendering
|
|
5. **Accessibility** - High contrast ratios
|
|
|
|
**Color Scheme:**
|
|
```css
|
|
Background: #0c0d0e (Deep dark)
|
|
Primary: #3b82f6 (Blue)
|
|
Text: #e5e7eb (Light)
|
|
Success: #10b981 (Green)
|
|
Danger: #ef4444 (Red)
|
|
```
|
|
|
|
📖 **Design details:** [DESIGN_COMPARISON.md](DESIGN_COMPARISON.md)
|
|
|
|
---
|
|
|
|
### 📁 Project Structure
|
|
|
|
```
|
|
urnetwork-stats/
|
|
├── main.py # Main application (use this!)
|
|
├── instance/
|
|
│ └── transfer_stats.db # SQLite database (auto-created)
|
|
├── .env # Config (auto-created)
|
|
├── README.md # This file
|
|
├── requirements.txt # Dependencies
|
|
└── docs/
|
|
├── QUICKSTART.md # Quick start guide
|
|
├── WEBHOOK_GUIDE.md # Webhook examples
|
|
├── UPGRADE_GUIDE.md # Migration from v1.0
|
|
├── DESIGN_COMPARISON.md # Design documentation
|
|
└── CHANGELOG.md # Version history
|
|
```
|
|
|
|
---
|
|
|
|
### 🛠️ Tech Stack
|
|
|
|
- **Backend:** Flask 3.0+
|
|
- **Database:** SQLAlchemy + SQLite
|
|
- **Scheduler:** APScheduler
|
|
- **Frontend:** React 18 (private dashboard)
|
|
- **Charts:** Chart.js 4.0+
|
|
- **Maps:** Leaflet.js 1.9+
|
|
- **Styling:** Custom CSS (Cloudflare-inspired)
|
|
|
|
---
|
|
|
|
### 🔄 Upgrading from v1.0
|
|
|
|
```bash
|
|
# 1. Backup
|
|
cp .env .env.backup
|
|
cp instance/transfer_stats.db instance/transfer_stats.db.backup
|
|
|
|
# 2. Download new version
|
|
git pull
|
|
|
|
# 3. Run migration
|
|
python migrate.py
|
|
|
|
# 4. Restart
|
|
python main.py
|
|
```
|
|
|
|
Your existing account will be migrated automatically!
|
|
|
|
📖 **Full upgrade guide:** [UPGRADE_GUIDE.md](UPGRADE_GUIDE.md)
|
|
|
|
---
|
|
|
|
### 🐛 Troubleshooting
|
|
|
|
**Can't login?**
|
|
```bash
|
|
# Check admin password exists
|
|
cat .env | grep ADMIN_PASSWORD
|
|
|
|
# If missing, add it
|
|
echo "ADMIN_PASSWORD=your_password" >> .env
|
|
```
|
|
|
|
**Charts not showing text?**
|
|
- Make sure you're using `main.py` v2.1+ with white text
|
|
|
|
**Webhook not working?**
|
|
1. Check URL is correct
|
|
2. Validate JSON at [jsonlint.com](https://jsonlint.com/)
|
|
3. Check logs: `tail -f nohup.out | grep webhook`
|
|
|
|
**Port already in use?**
|
|
```python
|
|
# Edit last line of main.py
|
|
app.run(host="0.0.0.0", port=8080, debug=False) # Change port
|
|
```
|
|
|
|
---
|
|
|
|
### 🚀 Production Deployment
|
|
|
|
**With Gunicorn (recommended):**
|
|
```bash
|
|
pip install gunicorn
|
|
gunicorn --bind 0.0.0.0:90 --workers 4 main:app
|
|
```
|
|
|
|
**Systemd Service:**
|
|
```ini
|
|
[Unit]
|
|
Description=UrNetwork Stats Dashboard
|
|
After=network.target
|
|
|
|
[Service]
|
|
Type=simple
|
|
User=your_user
|
|
WorkingDirectory=/path/to/urnetwork-stats
|
|
ExecStart=/usr/bin/python3 main.py
|
|
Restart=always
|
|
|
|
[Install]
|
|
WantedBy=multi-user.target
|
|
```
|
|
|
|
```bash
|
|
sudo systemctl enable urnetwork-stats
|
|
sudo systemctl start urnetwork-stats
|
|
```
|
|
|
|
---
|
|
|
|
### 📊 Screenshots
|
|
|
|
**Public Dashboard:**
|
|
- Combined statistics from all accounts
|
|
- Individual charts per account
|
|
- World map of providers
|
|
|
|
**Private Dashboard:**
|
|
- Overview with paid vs unpaid charts
|
|
- Account details & leaderboard
|
|
- Device management
|
|
|
|
**Account Management:**
|
|
- Add unlimited accounts
|
|
- Toggle on/off
|
|
- Custom nicknames
|
|
|
|
---
|
|
|
|
### 🙏 Credits
|
|
|
|
- **Original:** [techroy23/UrNetwork-Stats-Dashboard](https://github.com/techroy23/UrNetwork-Stats-Dashboard)
|
|
- **v2.0+ Enhanced by:** Claude (Anthropic AI)
|
|
- **Design Inspiration:** Cloudflare, Vercel
|
|
- **Special Thanks:** Vlastík (mxnticek) for testing
|
|
|
|
---
|
|
|
|
### 📜 License
|
|
|
|
Extends the original UrNetwork Stats Dashboard. Please respect the original author's work.
|
|
|
|
---
|
|
|
|
### 🔮 Roadmap (v3.0?)
|
|
|
|
- [ ] Dark/Light theme toggle
|
|
- [ ] Email notifications
|
|
- [ ] Export to CSV/JSON
|
|
- [ ] Mobile app (React Native)
|
|
- [ ] Advanced analytics
|
|
- [ ] Docker container
|
|
- [ ] Cost calculator
|
|
|
|
---
|
|
|
|
### 📞 Support
|
|
|
|
- **Issues:** Use GitHub/Forgejo Issues
|
|
- **Pull Requests:** Contributions welcome!
|
|
- **Documentation:** Help improve docs
|
|
|
|
---
|
|
|
|
## 🇨🇿 Česká Dokumentace
|
|
|
|
**Kompletní český README:** [README_CZ.md](README_CZ.md)
|
|
|
|
### Rychlý Start
|
|
|
|
```bash
|
|
# 1. Klonovat
|
|
git clone https://forgejo.plainrock127.xyz/mxnticek/UrNetwork-Stats-Dashboard-remade
|
|
cd UrNetwork-Stats-Dashboard-remade
|
|
|
|
# 2. Instalace
|
|
pip install Flask Flask-SQLAlchemy Flask-APScheduler requests python-dateutil
|
|
|
|
# 3. Spustit
|
|
python main.py
|
|
|
|
# 4. Otevřít prohlížeč
|
|
# http://localhost:90
|
|
```
|
|
|
|
### Klíčové Funkce
|
|
|
|
- 🎯 **Multi-Account** - Sledujte neomezený počet účtů
|
|
- 📊 **Vylepšené Grafy** - Bílý text, tooltip kdekoliv
|
|
- 🔐 **Oddělená Auth** - Admin heslo nezávislé na UrNetwork
|
|
- ⚡ **Denní Čištění** - Auto-mazání dat starších 7 dní
|
|
- 📱 **Mobilní** - Touch-friendly rozhraní
|
|
|
|
### Webhook Příklady
|
|
|
|
**Discord - Jednoduchý:**
|
|
```json
|
|
{
|
|
"content": "📊 **${account}**: ${total_gb} GB"
|
|
}
|
|
```
|
|
|
|
**Discord - Bohatý:**
|
|
```json
|
|
{
|
|
"embeds": [{
|
|
"title": "⚡ ${account} - Nová Data!",
|
|
"color": 3901635,
|
|
"fields": [
|
|
{"name": "💰 Placená", "value": "`${paid_gb} GB`", "inline": true},
|
|
{"name": "📡 Neplacená", "value": "`${unpaid_gb} GB`", "inline": true}
|
|
]
|
|
}]
|
|
}
|
|
```
|
|
|
|
**Telegram:**
|
|
```json
|
|
{
|
|
"chat_id": "VAŠE_CHAT_ID",
|
|
"text": "📊 *${account}*\n💾 Celkem: ${total_gb} GB",
|
|
"parse_mode": "Markdown"
|
|
}
|
|
```
|
|
|
|
📖 **Kompletní návod:** [WEBHOOK_GUIDE.md](WEBHOOK_GUIDE.md)
|
|
|
|
---
|
|
|
|
**Version:** v2.1.1 | **Last Updated:** November 21, 2024
|
|
|
|
**Made with ❤️ and 🤖 AI**
|