mirror of
https://github.com/kiddin9/op-packages.git
synced 2026-10-31 14:25:13 +08:00
160 lines
4.8 KiB
Markdown
160 lines
4.8 KiB
Markdown
# luci-app-netstat
|
|
|
|
<div align="center">
|
|
|
|
**A professional network statistics application for OpenWrt LuCI**
|
|
|
|
[](LICENSE)
|
|
|
|
|
|
[Features](#features) • [Installation](#installation) • [Usage](#usage) • [Development](#development) • [License](#license)
|
|
|
|
</div>
|
|
|
|
---
|
|
|
|
## Overview
|
|
|
|
|
|
|
|
|
|
**luci-app-netstat** is a modern, feature-rich LuCI application that provides comprehensive network traffic statistics and monitoring for OpenWrt routers. It leverages `vnstat` for accurate traffic monitoring and presents the data through an intuitive web interface.
|
|
|
|
The application offers real-time network statistics, historical data visualization, and detailed traffic analysis to help you understand your network usage patterns.
|
|
|
|
## Features
|
|
|
|
✨ **Core Features:**
|
|
- 📊 **Real-time Network Monitoring** - Track network traffic with live statistics
|
|
- 📈 **Traffic Visualization** - Interactive charts powered by Chart.js
|
|
- 📅 **Historical Data** - Monitor trends over days, weeks, months, and years
|
|
- 🎨 **Dark Mode Support** - Professional dark theme for comfortable usage
|
|
- 📱 **Responsive Design** - Works seamlessly on desktop and mobile devices
|
|
- ⚙️ **Easy Configuration** - Simple UCI-based configuration system
|
|
- 🔄 **Automatic Updates** - Uses vnstat for continuous data collection
|
|
|
|
## Requirements
|
|
|
|
- OpenWrt with LuCI installed
|
|
- `vnstat` package (required dependency)
|
|
- Modern web browser (Chrome, Firefox, Safari, Edge)
|
|
|
|
## Installation
|
|
|
|
### Automatic Installation
|
|
|
|
Clone the repository and install using the OpenWrt build system:
|
|
|
|
```bash
|
|
git clone https://github.com/dotycat/luci-app-netstat.git
|
|
cd luci-app-netstat
|
|
make
|
|
```
|
|
|
|
### Manual Installation
|
|
|
|
1. Download the latest `.ipk` package from [Releases](../../releases)
|
|
2. Upload to your router via SCP:
|
|
```bash
|
|
scp luci-app-netstat_*.ipk root@<router-ip>:/tmp/
|
|
```
|
|
3. Install via SSH:
|
|
```bash
|
|
ssh root@<router-ip>
|
|
opkg install /tmp/luci-app-netstat_*.ipk
|
|
```
|
|
4. Navigate to **LuCI Web Interface** → **Status** → **Network Statistics**
|
|
|
|
## Configuration
|
|
|
|
### UCI Configuration
|
|
|
|
The application configuration is managed via UCI. Edit `/etc/config/netstats` to customize:
|
|
|
|
```
|
|
config netstat
|
|
option enabled '1'
|
|
option interface 'wan'
|
|
option update_interval '60'
|
|
```
|
|
|
|
### vnstat Integration
|
|
|
|
Ensure vnstat is properly configured and running:
|
|
|
|
```bash
|
|
opkg install vnstat
|
|
service vnstat start
|
|
service vnstat enable
|
|
```
|
|
|
|
## Usage
|
|
|
|
### Dashboard
|
|
|
|
1. Log into your OpenWrt LuCI web interface
|
|
2. Navigate to **Status** → **Network Statistics**
|
|
3. View traffic statistics for your network interfaces
|
|
|
|
### Available Data
|
|
|
|
- **Current Usage** - Real-time traffic rates
|
|
- **Daily Statistics** - Traffic breakdown by day
|
|
- **Monthly Analysis** - Monthly usage overview
|
|
|
|
## Dark / Light Theme Switching
|
|
|
|
The NoobWRT theme stores the user's theme preference in **`localStorage`** under the key `luci-theme` (`'dark'` or `'light'`). When dark mode is active the theme also adds the class `dark-theme` to `document.body`.
|
|
|
|
`tabs.htm` (rendered on every Netstat tab) reads this value at page load:
|
|
|
|
```js
|
|
var isDark = localStorage.getItem('luci-theme') === 'dark'
|
|
|| document.body.classList.contains('dark-theme');
|
|
```
|
|
|
|
If dark mode is detected, a `<style>` block is injected into the page with `!important` overrides for every `.netstat-*` class. This covers:
|
|
|
|
| Selector | Dark value |
|
|
|---|---|
|
|
| `.netstat-dashboard` | `#1a1d20` background |
|
|
| `.netstat-summary` | `#111315` background |
|
|
| `.netstat-chart-wrap` | `#1a1d20` background |
|
|
| `.netstat-about-card` | `#1a1d20` background |
|
|
| `.netstat-chart-title`, `.netstat-summary-item` | `#f3f4f6` text |
|
|
| `.netstat-summary-label`, `.netstat-about-label` | `#9ca3af` text |
|
|
| `.netstat-about-row a` | `#60a5fa` link color |
|
|
|
|
The same flag (`window._netstatDark`) is passed to Chart.js so axis labels and grid lines also use dark-friendly colors.
|
|
|
|
No server-side detection or separate CSS files are needed — everything is driven by the single `localStorage` value the theme toggle button already sets.
|
|
|
|
## Credits
|
|
|
|
- **Original Development**: [SMALLPROGRAM](https://github.com/smallprogram)
|
|
- **Maintenance**: [nooblk-98](https://github.com/nooblk-98/)
|
|
|
|
|
|
## Contributing
|
|
|
|
Contributions are welcome! Please feel free to:
|
|
- Report bugs and issues
|
|
- Submit feature requests
|
|
- Create pull requests with improvements
|
|
- Improve documentation
|
|
|
|
## Support
|
|
|
|
For support, issues, or questions:
|
|
- Open an [Issue](../../issues) on GitHub
|
|
- Check existing [Discussions](../../discussions)
|
|
- Contact: liyanagelsofficial@gmail.com
|
|
|
|
---
|
|
|
|
<div align="center">
|
|
|
|
**Made with ❤️ for the OpenWrt Community**
|
|
|
|
</div>
|