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

- 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

View File

@ -202,13 +202,13 @@ func FormatUptime(d time.Duration) string {
seconds := int(d.Seconds()) % 60
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 {
return fmt.Sprintf("%d时%d分%d秒", hours, minutes, seconds)
return fmt.Sprintf("%d时%d分%d秒", hours, minutes, seconds)
}
if minutes > 0 {
return fmt.Sprintf("%d分%d秒", minutes, seconds)
return fmt.Sprintf("%d分%d秒", minutes, seconds)
}
return fmt.Sprintf("%d秒", seconds)
}

View File

@ -239,7 +239,16 @@ export default function DashboardPage() {
<tbody>
{(metrics.top_paths || []).map((path, index) => (
<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.error_count}</td>
<td className="p-2">{path.avg_latency}</td>
@ -275,7 +284,16 @@ export default function DashboardPage() {
.map((req, index) => (
<tr key={index} className="border-b hover:bg-gray-50">
<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">
<span
className={`px-2 py-1 rounded-full text-xs ${getStatusColor(