Web dashboard for TP-Link Easy Smart Switch management
- TypeScript 92.5%
- CSS 4.2%
- Shell 2.1%
- HTML 1.2%
|
All checks were successful
ci/woodpecker/push/woodpecker Pipeline was successful
|
||
|---|---|---|
| docs | ||
| src | ||
| .env.example | ||
| .gitignore | ||
| .woodpecker.yaml | ||
| index.html | ||
| package-lock.json | ||
| package.json | ||
| README.md | ||
| release.sh | ||
| tsconfig.json | ||
| vite.config.ts | ||
tplink-switch-ui
Web dashboard for TP-Link Easy Smart switch management. Consumes the tplink-switch-api REST API.
Features
- Port grid — live link status for all 24 ports (amber = Gigabit, green = 100M, dim = down)
- Port detail — per-port TX/RX packet stats, speed/flow-control config, enable/disable, cable test
- VLAN management — list, create, delete 802.1Q VLANs with click-to-cycle port membership
- PVID assignment — per-port PVID dropdowns
- Traffic stats — bar charts (RX/TX/errors) + raw table
- System controls — inline rename, LED toggle, reboot with confirmation
- Auto-refresh — 10s polling toggle
Quick start
cp .env.example .env
# set VITE_API_BASE_URL if API is not on localhost:3003
npm install
npm run dev
Environment
| Variable | Default | Description |
|---|---|---|
VITE_API_BASE_URL |
`` (empty) | API base URL — empty uses Vite proxy to localhost:3003 |
The Vite dev server proxies /api/* to http://localhost:3003 automatically. For production, set VITE_API_BASE_URL to the full API URL before building.
Build
npm run build # outputs to dist/
CI
Woodpecker CI typechecks, builds, and publishes tplink-switch-ui-dist.tar.gz to Releases on every push to main.
