This version is consistent with the official version in other functions, with the main difference being the new monitoring center, which enhances log analysis and viewing

Interface Preview

Management interface display

Quick Start

Using This Management Interface

Modify following configuration in your config.yaml:

remote-management:
  panel-github-repository: "https://github.com/kongkongyo/CLIProxyAPI-Web-Dashboard"

After configuration, restart the CLI Proxy API service and visit http://<host>:<api_port>/management.html to view the management interface

For detailed configuration instructions, please refer to the official documentation: https://help.router-for.me/cn/management/webui.html

Main Features

Monitoring Center - Core New Feature

This is the only new feature of this management interface compared to the official version, providing comprehensive data visualization and monitoring capabilities

Note: The CLI Proxy API main program currently does not have data persistence functionality. Statistical data will be lost after restarting the program. You need to use related services through the API first to generate data before you can see statistical information in the monitoring center.

KPI Dashboard

Real-time display of core operational metrics, supports filtering by time range:

Request Count: Total requests, success/failure statistics, success rate percentage
Token Count: Total tokens, input tokens, output tokens
Average TPM: Tokens per minute
Average RPM: Requests per minute
Average RPD: Daily average requests

All metrics are dynamically calculated and updated in real-time based on the selected time range (today/7 days/14 days/30 days)

Model Usage Distribution

Intuitive pie chart showing the usage distribution of different models:

Distribution by request count
Distribution by token count
Switchable between request percentage and token percentage

Daily Trend Analysis

Detailed time series charts showing daily usage trends:

Request count trend curve
Input token trend
Output token trend
Thinking token trend (if supported)
Cache token trend

Hourly Analysis

Two detailed hourly charts to help identify peak periods:

Hourly Model Request Distribution

Bar chart showing requests for different models in each hour
Supports switching between recent 6 hours/12 hours/24 hours/all views

Hourly Token Usage

Stacked bar chart showing token usage composition
Distinguishes between input tokens, output tokens, thinking tokens, cache tokens

Channel Statistics

Detailed table showing usage of each channel (API Key/model):

Filter by all channels/specific channel
Filter by all models/specific model
Filter by all status/success only/failure only
Display channel name, request count, success rate
Click to expand and view detailed statistics of each model under that channel
Display recent request status (mini status bar of recent 10 requests)
Most recent request time

Failure Source Analysis

Help locate problematic channels and models:

Statistics of failure counts by channel
Display most recent failure time
List of main failed models
Click to expand and view all failed request details under that channel

Request Logs - Advanced Feature

Powerful request log table, supports smooth browsing of massive data

Multi-dimensional Filtering

Filter by API Key
Filter by provider type (OpenAI/Gemini/Claude, etc.)
Filter by model name
Filter by source channel
Filter by request status (all/success/failure)

Independent Time Range

Supports today/7 days/14 days/30 days/custom date range
Independent control from main page time range

Virtual Scrolling

Supports smooth browsing of 100,000+ logs
Display current visible range statistics
Performance optimized, only renders visible rows

Smart Information Display

Automatically match API Key to provider name (based on configuration)
Complete channel information (provider name + masked key)
Request type/model name/request status
Status visualization of recent 10 requests (green dot=success, red dot=failure)
Success rate percentage
Total requests/input tokens/output tokens/total tokens
Request time (complete timestamp)

Auto Refresh

Supports manual refresh / 5s / 10s / 15s / 30s / 60s auto refresh
Countdown display for next refresh time
Independent data loading, does not block main page

One-click Disable Model

Supports directly disabling a specific model of a channel in logs
Only effective for channel types that support this operation
Shows prompt and manual operation guide when not supported

Official Version Features

The following features are consistent with the official version, providing a better user experience through an improved interface

Dashboard

Real-time connection status monitoring
Server version and build information at a glance
Quick overview of usage data
Available model statistics

API Key Management

Add, edit, delete API keys
Manage proxy service authentication

AI Provider Configuration

Gemini: API key management, model exclusion, model prefix
Claude: API key and configuration, custom model list
Codex: Complete configuration management (API key, Base URL, proxy)
Vertex: Model mapping configuration
OpenAI Compatible: Multi-key management, model alias import, connectivity testing
Ampcode: Upstream integration and model mapping

Authentication File Management

Upload, download, delete JSON authentication files
Supports multiple providers (Qwen, Gemini, Claude, etc.)
Search, filter, paginated browsing
View models supported by each credential

One-click start OAuth authorization flow
Supports Codex, Anthropic, Gemini CLI, Qwen, iFlow, etc.
Automatically save authentication files
Supports remote browser callback submission

Quota Management

Antigravity quota query
Codex quota query (5 hours, weekly limit, code review)
Gemini CLI quota query
One-click refresh all quotas

Usage Statistics

Request/Token trend charts
Detailed statistics by model and API
RPM/TPM real-time rates
Cache and reasoning token breakdown
Cost estimation (supports custom prices)

Configuration Management

Online editing of config.yaml
YAML syntax highlighting
Search and navigation
Save and reload configuration

Log Viewing

Real-time log stream
Search and filtering
Auto refresh
Download error logs
Mask management traffic

Center Information

Connection status check
Version update check
Available model list display
Quick link entry

Connection Instructions

API Address Format

The following formats are all supported, and the system will automatically recognize them

localhost:8317
http://192.168.1.10:8317
https://example.com:8317

Management Key

The management key is the key for verifying management operations and is different from the API key used by clients

Remote Management

When accessing from a non-local browser, you need to enable remote management on the server (allow-remote-management: true)

Interface Features

Theme Switching

Light mode
Dark mode
Follow system

Language Support

Simplified Chinese
English

Responsive Design

Full functionality on desktop
Mobile-adapted experience
Collapsible sidebar

FAQ

Q: How to use this custom UI?

A: Add the following configuration to your CLI Proxy API configuration file

remote-management:
  panel-github-repository: "https://github.com/kongkongyo/CLIProxyAPI-Web-Dashboard"

Q: Cannot connect to the server?

A: Please check the following

Is the API address correct?
Is the management key correct?
Is the server started?
Is remote access enabled?

Q: Log page not displaying?

A: You need to enable the "Log to file" function in "Basic Settings"

Q: Some functions show "not supported"?

A: The server version may be too old. Upgrade to the latest version of CLI Proxy API

Q: OpenAI provider test failed?

A: Tests are executed in the browser and may be subject to CORS restrictions. Failure does not necessarily mean it won't work on the server side

Q: What is the difference between this version and the official version?

A: There are two main differences:

Interface Style: Completely new visual design with more refined UI details
Monitoring Center: This is the only newly added feature module, providing powerful data visualization and monitoring capabilities, including KPI dashboard, model usage distribution, trend analysis, hourly charts, channel statistics, failure analysis, and advanced request logs

All other features remain consistent with the official version

Official Main Program: https://github.com/router-for-me/CLIProxyAPI
Official WebUI: https://github.com/router-for-me/Cli-Proxy-API-Management-Center
This Repository: https://github.com/kongkongyo/CLIProxyAPI-Web-Dashboard

License

MIT License

README_EN.md

CLI Proxy API Management Center (CPAMC)

About This Project

Differences from Official Version