wood/proxy-go
1
0
Fork 0
mirror of https://github.com/woodchen-ink/proxy-go.git synced 2025-07-18 16:41:54 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(dashboard): Add clickable links to paths in metrics tables

Browse Source 
- Make top paths and recent requests table entries clickable
- Open links in new tabs with appropriate security attributes
- Add hover and color styles to improve link visibility and interaction
This commit is contained in:
wood chen 2025-02-16 20:46:41 +08:00
parent 41f5b82661
commit 5c3fb00d57
2 changed files with 23 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
internal/metrics/collector.go
View File

@ -202,13 +202,13 @@ func FormatUptime(d time.Duration) string {
seconds := int(d.Seconds()) % 60 seconds := int(d.Seconds()) % 60
if days > 0 { if days > 0 {
return fmt.Sprintf("%d天%d小时%d分钟%d秒", days, hours, minutes, seconds) return fmt.Sprintf("%d天%d时%d分%d秒", days, hours, minutes, seconds)
} }
if hours > 0 { if hours > 0 {
return fmt.Sprintf("%d小时%d分钟%d秒", hours, minutes, seconds) return fmt.Sprintf("%d时%d分%d秒", hours, minutes, seconds)
} }
if minutes > 0 { if minutes > 0 {
return fmt.Sprintf("%d分钟%d秒", minutes, seconds) return fmt.Sprintf("%d分%d秒", minutes, seconds)
} }
return fmt.Sprintf("%d秒", seconds) return fmt.Sprintf("%d秒", seconds)
} }

22
web/app/dashboard/page.tsx
View File

@ -239,7 +239,16 @@ export default function DashboardPage() {
<tbody> <tbody>
{(metrics.top_paths || []).map((path, index) => ( {(metrics.top_paths || []).map((path, index) => (
<tr key={index} className="border-b"> <tr key={index} className="border-b">
<td className="p-2">{path.path}</td> <td className="p-2">
<a
href={path.path}
target="_blank"
rel="noopener noreferrer"
className="text-blue-600 hover:text-blue-800 hover:underline"
>
{path.path}
</a>
</td>
<td className="p-2">{path.request_count}</td> <td className="p-2">{path.request_count}</td>
<td className="p-2">{path.error_count}</td> <td className="p-2">{path.error_count}</td>
<td className="p-2">{path.avg_latency}</td> <td className="p-2">{path.avg_latency}</td>
@ -275,7 +284,16 @@ export default function DashboardPage() {
.map((req, index) => ( .map((req, index) => (
<tr key={index} className="border-b hover:bg-gray-50"> <tr key={index} className="border-b hover:bg-gray-50">
<td className="p-2">{formatDate(req.Time)}</td> <td className="p-2">{formatDate(req.Time)}</td>
<td className="p-2 max-w-xs truncate">{req.Path}</td> <td className="p-2 max-w-xs truncate">
<a
href={req.Path}
target="_blank"
rel="noopener noreferrer"
className="text-blue-600 hover:text-blue-800 hover:underline"
>
{req.Path}
</a>
</td>
<td className="p-2"> <td className="p-2">
<span <span
className={`px-2 py-1 rounded-full text-xs ${getStatusColor( className={`px-2 py-1 rounded-full text-xs ${getStatusColor(