perpare to fix RequestFinishedEvent

This commit is contained in:
XOF
2025-11-21 13:20:47 +08:00
parent 375cfe814a
commit 1f7aa70810
16 changed files with 611 additions and 263 deletions

Binary file not shown.

View File

@@ -1,4 +1,4 @@
/*! tailwindcss v4.1.12 | MIT License | https://tailwindcss.com */
/*! tailwindcss v4.1.17 | MIT License | https://tailwindcss.com */
@layer properties;
@layer theme, base, components, utilities;
@layer theme {
@@ -71,6 +71,7 @@
--color-blue-900: oklch(37.9% 0.146 265.522);
--color-indigo-100: oklch(93% 0.034 272.788);
--color-indigo-300: oklch(78.5% 0.115 274.713);
--color-indigo-500: oklch(58.5% 0.233 277.117);
--color-indigo-800: oklch(39.8% 0.195 277.366);
--color-indigo-900: oklch(35.9% 0.144 278.697);
--color-violet-300: oklch(81.1% 0.111 293.571);
@@ -80,6 +81,8 @@
--color-purple-100: oklch(94.6% 0.033 307.174);
--color-purple-300: oklch(82.7% 0.119 306.383);
--color-purple-400: oklch(71.4% 0.203 305.504);
--color-purple-500: oklch(62.7% 0.265 303.9);
--color-purple-600: oklch(55.8% 0.288 302.321);
--color-purple-800: oklch(43.8% 0.218 303.724);
--color-purple-900: oklch(38.1% 0.176 304.987);
--color-pink-100: oklch(94.8% 0.028 342.258);
@@ -329,6 +332,9 @@
.pointer-events-none {
pointer-events: none;
}
.collapse {
visibility: collapse;
}
.invisible {
visibility: hidden;
}
@@ -342,7 +348,7 @@
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
clip-path: inset(50%);
white-space: nowrap;
border-width: 0;
}
@@ -484,6 +490,9 @@
.m-0 {
margin: calc(var(--spacing) * 0);
}
.m-7 {
margin: calc(var(--spacing) * 7);
}
.mx-1 {
margin-inline: calc(var(--spacing) * 1);
}
@@ -496,6 +505,9 @@
.my-1\.5 {
margin-block: calc(var(--spacing) * 1.5);
}
.mt-0 {
margin-top: calc(var(--spacing) * 0);
}
.mt-0\.5 {
margin-top: calc(var(--spacing) * 0.5);
}
@@ -607,10 +619,19 @@
.table {
display: table;
}
.table-cell {
display: table-cell;
}
.table-row {
display: table-row;
}
.size-6 {
width: calc(var(--spacing) * 6);
height: calc(var(--spacing) * 6);
}
.h-0 {
height: calc(var(--spacing) * 0);
}
.h-0\.5 {
height: calc(var(--spacing) * 0.5);
}
@@ -692,6 +713,9 @@
.w-0 {
width: calc(var(--spacing) * 0);
}
.w-1 {
width: calc(var(--spacing) * 1);
}
.w-1\/4 {
width: calc(1/4 * 100%);
}
@@ -797,6 +821,9 @@
.flex-1 {
flex: 1;
}
.flex-shrink {
flex-shrink: 1;
}
.shrink-0 {
flex-shrink: 0;
}
@@ -809,11 +836,14 @@
.caption-bottom {
caption-side: bottom;
}
.border-collapse {
border-collapse: collapse;
}
.origin-center {
transform-origin: center;
}
.origin-top-right {
transform-origin: top right;
transform-origin: 100% 0;
}
.-translate-x-1 {
--tw-translate-x: calc(var(--spacing) * -1);
@@ -835,6 +865,10 @@
--tw-translate-x: 100%;
translate: var(--tw-translate-x) var(--tw-translate-y);
}
.-translate-y-1 {
--tw-translate-y: calc(var(--spacing) * -1);
translate: var(--tw-translate-x) var(--tw-translate-y);
}
.-translate-y-1\/2 {
--tw-translate-y: calc(calc(1/2 * 100%) * -1);
translate: var(--tw-translate-x) var(--tw-translate-y);
@@ -991,6 +1025,9 @@
margin-block-end: calc(calc(var(--spacing) * 8) * calc(1 - var(--tw-space-y-reverse)));
}
}
.gap-x-1 {
column-gap: calc(var(--spacing) * 1);
}
.gap-x-1\.5 {
column-gap: calc(var(--spacing) * 1.5);
}
@@ -1136,6 +1173,9 @@
--tw-border-style: none;
border-style: none;
}
.border-black {
border-color: var(--color-black);
}
.border-black\/10 {
border-color: color-mix(in srgb, #000 10%, transparent);
@supports (color: color-mix(in lab, red, red)) {
@@ -1163,6 +1203,9 @@
.border-green-200 {
border-color: var(--color-green-200);
}
.border-primary {
border-color: var(--color-primary);
}
.border-primary\/20 {
border-color: var(--color-primary);
@supports (color: color-mix(in lab, red, red)) {
@@ -1199,6 +1242,9 @@
.border-zinc-300 {
border-color: var(--color-zinc-300);
}
.border-zinc-700 {
border-color: var(--color-zinc-700);
}
.border-zinc-700\/50 {
border-color: color-mix(in srgb, oklch(37% 0.013 285.805) 50%, transparent);
@supports (color: color-mix(in lab, red, red)) {
@@ -1274,6 +1320,9 @@
.bg-gray-500 {
background-color: var(--color-gray-500);
}
.bg-gray-950 {
background-color: var(--color-gray-950);
}
.bg-gray-950\/5 {
background-color: color-mix(in srgb, oklch(13% 0.028 261.692) 5%, transparent);
@supports (color: color-mix(in lab, red, red)) {
@@ -1334,6 +1383,12 @@
.bg-orange-500 {
background-color: var(--color-orange-500);
}
.bg-orange-500\/10 {
background-color: color-mix(in srgb, oklch(70.5% 0.213 47.604) 10%, transparent);
@supports (color: color-mix(in lab, red, red)) {
background-color: color-mix(in oklab, var(--color-orange-500) 10%, transparent);
}
}
.bg-orange-500\/20 {
background-color: color-mix(in srgb, oklch(70.5% 0.213 47.604) 20%, transparent);
@supports (color: color-mix(in lab, red, red)) {
@@ -1358,6 +1413,15 @@
.bg-purple-100 {
background-color: var(--color-purple-100);
}
.bg-purple-500 {
background-color: var(--color-purple-500);
}
.bg-purple-500\/10 {
background-color: color-mix(in srgb, oklch(62.7% 0.265 303.9) 10%, transparent);
@supports (color: color-mix(in lab, red, red)) {
background-color: color-mix(in oklab, var(--color-purple-500) 10%, transparent);
}
}
.bg-red-50 {
background-color: var(--color-red-50);
}
@@ -1370,6 +1434,12 @@
.bg-red-500 {
background-color: var(--color-red-500);
}
.bg-red-500\/10 {
background-color: color-mix(in srgb, oklch(63.7% 0.237 25.331) 10%, transparent);
@supports (color: color-mix(in lab, red, red)) {
background-color: color-mix(in oklab, var(--color-red-500) 10%, transparent);
}
}
.bg-red-500\/20 {
background-color: color-mix(in srgb, oklch(63.7% 0.237 25.331) 20%, transparent);
@supports (color: color-mix(in lab, red, red)) {
@@ -1427,6 +1497,12 @@
.bg-yellow-500 {
background-color: var(--color-yellow-500);
}
.bg-yellow-500\/10 {
background-color: color-mix(in srgb, oklch(79.5% 0.184 86.047) 10%, transparent);
@supports (color: color-mix(in lab, red, red)) {
background-color: color-mix(in oklab, var(--color-yellow-500) 10%, transparent);
}
}
.bg-yellow-500\/20 {
background-color: color-mix(in srgb, oklch(79.5% 0.184 86.047) 20%, transparent);
@supports (color: color-mix(in lab, red, red)) {
@@ -1445,6 +1521,12 @@
.bg-zinc-500 {
background-color: var(--color-zinc-500);
}
.bg-zinc-500\/10 {
background-color: color-mix(in srgb, oklch(55.2% 0.016 285.938) 10%, transparent);
@supports (color: color-mix(in lab, red, red)) {
background-color: color-mix(in oklab, var(--color-zinc-500) 10%, transparent);
}
}
.bg-zinc-800 {
background-color: var(--color-zinc-800);
}
@@ -1461,6 +1543,10 @@
--tw-gradient-position: to right in oklab;
background-image: linear-gradient(var(--tw-gradient-stops));
}
.from-blue-500 {
--tw-gradient-from: var(--color-blue-500);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
}
.from-blue-500\/30 {
--tw-gradient-from: color-mix(in srgb, oklch(62.3% 0.214 259.815) 30%, transparent);
@supports (color: color-mix(in lab, red, red)) {
@@ -1531,6 +1617,9 @@
.px-8 {
padding-inline: calc(var(--spacing) * 8);
}
.py-0 {
padding-block: calc(var(--spacing) * 0);
}
.py-0\.5 {
padding-block: calc(var(--spacing) * 0.5);
}
@@ -1579,6 +1668,9 @@
.pr-20 {
padding-right: calc(var(--spacing) * 20);
}
.pb-1 {
padding-bottom: calc(var(--spacing) * 1);
}
.pb-1\.5 {
padding-bottom: calc(var(--spacing) * 1.5);
}
@@ -1618,6 +1710,9 @@
.align-middle {
vertical-align: middle;
}
.font-\[\'Pixelify_Sans\'\] {
font-family: 'Pixelify Sans';
}
.font-mono {
font-family: var(--font-mono);
}
@@ -1763,6 +1858,9 @@
.text-green-800 {
color: var(--color-green-800);
}
.text-indigo-500 {
color: var(--color-indigo-500);
}
.text-indigo-800 {
color: var(--color-indigo-800);
}
@@ -1775,6 +1873,9 @@
.text-orange-500 {
color: var(--color-orange-500);
}
.text-orange-600 {
color: var(--color-orange-600);
}
.text-orange-800 {
color: var(--color-orange-800);
}
@@ -1784,6 +1885,9 @@
.text-primary-foreground {
color: var(--color-primary-foreground);
}
.text-purple-600 {
color: var(--color-purple-600);
}
.text-purple-800 {
color: var(--color-purple-800);
}
@@ -1853,6 +1957,9 @@
.italic {
font-style: italic;
}
.underline {
text-decoration-line: underline;
}
.opacity-0 {
opacity: 0%;
}
@@ -1910,6 +2017,10 @@
--tw-inset-shadow: inset 0 2px 4px var(--tw-inset-shadow-color, oklab(from rgb(0 0 0 / 0.05) l a b / 25%));
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
}
.inset-shadow-sm {
--tw-inset-shadow: inset 0 2px 4px var(--tw-inset-shadow-color, rgb(0 0 0 / 0.05));
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
}
.ring-black {
--tw-ring-color: var(--color-black);
}
@@ -1931,6 +2042,10 @@
--tw-ring-color: color-mix(in oklab, var(--color-black) 15%, transparent);
}
}
.outline {
outline-style: var(--tw-outline-style);
outline-width: 1px;
}
.blur {
--tw-blur: blur(8px);
filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
@@ -1957,7 +2072,7 @@
backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
}
.transition {
transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, visibility, content-visibility, overlay, pointer-events;
transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
transition-duration: var(--tw-duration, var(--default-transition-duration));
}
@@ -2029,6 +2144,9 @@
-webkit-user-select: none;
user-select: none;
}
.\[rows\:\%v\] {
rows: %v;
}
.group-hover\:opacity-100 {
&:is(:where(.group):hover *) {
@media (hover: hover) {
@@ -3451,19 +3569,12 @@
width: 100%;
align-items: flex-start;
border-radius: var(--radius-lg);
background-color: color-mix(in srgb, #fff 80%, transparent);
@supports (color: color-mix(in lab, red, red)) {
background-color: color-mix(in oklab, var(--color-white) 80%, transparent);
}
background-color: color-mix(in oklab, var(--color-white) 80%, transparent);
padding: calc(var(--spacing) * 3);
--tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
--tw-ring-color: color-mix(in srgb, #000 5%, transparent);
@supports (color: color-mix(in lab, red, red)) {
--tw-ring-color: color-mix(in oklab, var(--color-black) 5%, transparent);
}
--tw-ring-color: color-mix(in oklab, var(--color-black) 5%, transparent);
--tw-backdrop-blur: blur(var(--blur-md));
-webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
@@ -3654,7 +3765,6 @@
top: calc(1/2 * 100%);
left: calc(1/2 * 100%);
--tw-translate-x: calc(calc(1/2 * 100%) * -1);
translate: var(--tw-translate-x) var(--tw-translate-y);
--tw-translate-y: calc(calc(1/2 * 100%) * -1);
translate: var(--tw-translate-x) var(--tw-translate-y);
opacity: 0%;
@@ -4366,7 +4476,7 @@
padding-block: calc(var(--spacing) * 2);
font-size: var(--text-xs);
line-height: var(--tw-leading, var(--text-xs--line-height));
transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, visibility, content-visibility, overlay, pointer-events;
transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
transition-duration: var(--tw-duration, var(--default-transition-duration));
--tw-duration: 150ms;
@@ -4552,7 +4662,7 @@
line-height: var(--tw-leading, var(--text-xs--line-height));
--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, visibility, content-visibility, overlay, pointer-events;
transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
transition-duration: var(--tw-duration, var(--default-transition-duration));
--tw-duration: 150ms;
@@ -4602,7 +4712,7 @@
line-height: var(--tw-leading, var(--text-xs--line-height));
--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, visibility, content-visibility, overlay, pointer-events;
transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
transition-duration: var(--tw-duration, var(--default-transition-duration));
--tw-duration: 150ms;
@@ -4814,6 +4924,68 @@
font-size: var(--text-4xl);
line-height: var(--tw-leading, var(--text-4xl--line-height));
}
@layer components {
.table {
width: 100%;
caption-side: bottom;
font-size: var(--text-sm);
line-height: var(--tw-leading, var(--text-sm--line-height));
}
.table-header {
position: sticky;
top: calc(var(--spacing) * 0);
z-index: 10;
border-bottom-style: var(--tw-border-style);
border-bottom-width: 1px;
border-color: var(--color-border);
background-color: var(--color-muted);
@supports (color: color-mix(in lab, red, red)) {
background-color: color-mix(in oklab, var(--color-muted) 50%, transparent);
}
}
.table-header .table-row {
&:hover {
@media (hover: hover) {
background-color: transparent;
}
}
}
.table-body {
& tr:last-child {
border-style: var(--tw-border-style);
border-width: 0px;
}
}
.table-row {
border-bottom-style: var(--tw-border-style);
border-bottom-width: 1px;
border-color: var(--color-border);
transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
transition-duration: var(--tw-duration, var(--default-transition-duration));
&:hover {
@media (hover: hover) {
background-color: var(--color-muted);
@supports (color: color-mix(in lab, red, red)) {
background-color: color-mix(in oklab, var(--color-muted) 80%, transparent);
}
}
}
}
.table-head-cell {
height: calc(var(--spacing) * 12);
padding-inline: calc(var(--spacing) * 4);
text-align: left;
vertical-align: middle;
--tw-font-weight: var(--font-weight-medium);
font-weight: var(--font-weight-medium);
color: var(--color-muted-foreground);
}
.table-cell {
padding: calc(var(--spacing) * 4);
vertical-align: middle;
}
}
@property --tw-translate-x {
syntax: "*";
inherits: false;
@@ -4988,6 +5160,11 @@
inherits: false;
initial-value: 0 0 #0000;
}
@property --tw-outline-style {
syntax: "*";
inherits: false;
initial-value: solid;
}
@property --tw-blur {
syntax: "*";
inherits: false;
@@ -5100,11 +5277,6 @@
inherits: false;
initial-value: 1;
}
@property --tw-outline-style {
syntax: "*";
inherits: false;
initial-value: solid;
}
@keyframes spin {
to {
transform: rotate(360deg);
@@ -5162,6 +5334,7 @@
--tw-ring-offset-width: 0px;
--tw-ring-offset-color: #fff;
--tw-ring-offset-shadow: 0 0 #0000;
--tw-outline-style: solid;
--tw-blur: initial;
--tw-brightness: initial;
--tw-contrast: initial;
@@ -5189,7 +5362,6 @@
--tw-scale-x: 1;
--tw-scale-y: 1;
--tw-scale-z: 1;
--tw-outline-style: solid;
}
}
}

View File

@@ -0,0 +1,208 @@
import {
apiFetchJson
} from "./chunk-PLQL6WIO.js";
// frontend/js/pages/logs/logList.js
var STATIC_ERROR_MAP = {
"API_KEY_INVALID": { type: "\u5BC6\u94A5\u65E0\u6548", style: "red" },
"INVALID_ARGUMENT": { type: "\u53C2\u6570\u65E0\u6548", style: "red" },
"PERMISSION_DENIED": { type: "\u6743\u9650\u4E0D\u8DB3", style: "red" },
"NOT_FOUND": { type: "\u8D44\u6E90\u672A\u627E\u5230", style: "gray" },
"RESOURCE_EXHAUSTED": { type: "\u8D44\u6E90\u8017\u5C3D", style: "orange" },
"QUOTA_EXCEEDED": { type: "\u914D\u989D\u8017\u5C3D", style: "orange" },
"DEADLINE_EXCEEDED": { type: "\u8BF7\u6C42\u8D85\u65F6", style: "yellow" },
"CANCELLED": { type: "\u8BF7\u6C42\u5DF2\u53D6\u6D88", style: "gray" },
"INTERNAL": { type: "Google\u5185\u90E8\u9519\u8BEF", style: "yellow" },
"UNAVAILABLE": { type: "\u670D\u52A1\u4E0D\u53EF\u7528", style: "yellow" }
};
var STATUS_CODE_MAP = {
400: { type: "\u9519\u8BEF\u8BF7\u6C42", style: "red" },
401: { type: "\u8BA4\u8BC1\u5931\u8D25", style: "red" },
403: { type: "\u7981\u6B62\u8BBF\u95EE", style: "red" },
404: { type: "\u8D44\u6E90\u672A\u627E\u5230", style: "gray" },
413: { type: "\u8BF7\u6C42\u4F53\u8FC7\u5927", style: "orange" },
429: { type: "\u8BF7\u6C42\u9891\u7387\u8FC7\u9AD8", style: "orange" },
500: { type: "\u5185\u90E8\u670D\u52A1\u9519\u8BEF", style: "yellow" },
503: { type: "\u670D\u52A1\u4E0D\u53EF\u7528", style: "yellow" }
};
var SPECIAL_CASE_MAP = [
{ code: 400, keyword: "api key not found", type: "\u65E0\u6548\u5BC6\u94A5", style: "red" },
// 之前实现的模型配置错误规则也可以移到这里,更加规范
{ code: 404, keyword: "call listmodels", type: "\u6A21\u578B\u914D\u7F6E\u9519\u8BEF", style: "orange" }
];
var styleToClass = (style) => {
switch (style) {
case "red":
return "bg-red-500/10 text-red-600";
case "orange":
return "bg-orange-500/10 text-orange-600";
case "yellow":
return "bg-yellow-500/10 text-yellow-600";
case "gray":
return "bg-zinc-500/10 text-zinc-600";
default:
return "bg-destructive/10 text-destructive";
}
};
var errorCodeRegex = /(\d+)$/;
var LogList = class {
constructor(container) {
this.container = container;
if (!this.container) console.error("LogList: container element (tbody) not found.");
}
renderLoading() {
if (!this.container) return;
this.container.innerHTML = `<tr><td colspan="9" class="p-8 text-center text-muted-foreground"><i class="fas fa-spinner fa-spin mr-2"></i> \u52A0\u8F7D\u65E5\u5FD7\u4E2D...</td></tr>`;
}
render(logs, pagination) {
if (!this.container) return;
if (!logs || logs.length === 0) {
this.container.innerHTML = `<tr><td colspan="9" class="p-8 text-center text-muted-foreground">\u6CA1\u6709\u627E\u5230\u76F8\u5173\u7684\u65E5\u5FD7\u8BB0\u5F55\u3002</td></tr>`;
return;
}
const { page, page_size } = pagination;
const startIndex = (page - 1) * page_size;
const logsHtml = logs.map((log, index) => this.createLogRowHtml(log, startIndex + index + 1)).join("");
this.container.innerHTML = logsHtml;
}
_interpretError(log) {
if (log.IsSuccess) {
return {
type: "N/A",
statusCodeHtml: `<span class="inline-flex items-center rounded-md bg-green-500/10 px-2 py-1 text-xs font-medium text-green-600">\u6210\u529F</span>`
};
}
const codeMatch = log.ErrorCode ? log.ErrorCode.match(errorCodeRegex) : null;
if (codeMatch && codeMatch[1] && log.ErrorMessage) {
const code = parseInt(codeMatch[1], 10);
const lowerCaseMsg = log.ErrorMessage.toLowerCase();
for (const rule of SPECIAL_CASE_MAP) {
if (code === rule.code && lowerCaseMsg.includes(rule.keyword)) {
return {
type: rule.type,
statusCodeHtml: `<span class="inline-flex items-center rounded-md px-2 py-1 text-xs font-medium ${styleToClass(rule.style)}">${code}</span>`
};
}
}
}
if (log.ErrorCode && STATIC_ERROR_MAP[log.ErrorCode]) {
const mapping = STATIC_ERROR_MAP[log.ErrorCode];
return {
type: mapping.type,
statusCodeHtml: `<span class="inline-flex items-center rounded-md px-2 py-1 text-xs font-medium ${styleToClass(mapping.style)}">${log.ErrorCode}</span>`
};
}
if (codeMatch && codeMatch[1]) {
const code = parseInt(codeMatch[1], 10);
let mapping = STATUS_CODE_MAP[code];
if (!mapping && code >= 500 && code < 600) {
mapping = STATUS_CODE_MAP[500];
}
if (mapping) {
return {
type: mapping.type,
statusCodeHtml: `<span class="inline-flex items-center rounded-md px-2 py-1 text-xs font-medium ${styleToClass(mapping.style)}">${code}</span>`
};
}
}
if (!log.ErrorCode && !log.ErrorMessage) {
return { type: "\u672A\u77E5", statusCodeHtml: `<span class="inline-flex items-center rounded-md px-2 py-1 text-xs font-medium ${styleToClass("gray")}">N/A</span>` };
}
return { type: "\u672A\u77E5\u9519\u8BEF", statusCodeHtml: `<span class="inline-flex items-center rounded-md px-2 py-1 text-xs font-medium ${styleToClass("default")}">\u5931\u8D25</span>` };
}
_formatModelName(modelName) {
const styleClass = "";
return `<div class="inline-block rounded bg-zinc-100 dark:bg-zinc-800 px-2 py-0.5"><span class="font-quinquefive text-xs tracking-wider ${styleClass}">${modelName}</span></div>`;
}
createLogRowHtml(log, index) {
const groupName = log.GroupDisplayName || (log.GroupID ? `Group #${log.GroupID}` : "N/A");
const apiKeyName = log.APIKeyName || (log.KeyID ? `Key #${log.KeyID}` : "N/A");
const errorInfo = this._interpretError(log);
const modelNameFormatted = this._formatModelName(log.ModelName);
const errorMessageAttr = log.ErrorMessage ? `data-error-message="${escape(log.ErrorMessage)}"` : "";
const requestTime = new Date(log.RequestTime).toLocaleString();
return `
<tr class="table-row" data-log-id="${log.ID}" ${errorMessageAttr}>
<td class="table-cell"><input type="checkbox" class="h-4 w-4 rounded border-zinc-300 text-blue-600 focus:ring-blue-500"></td>
<td class="table-cell font-mono text-muted-foreground">${index}</td>
<td class="table-cell font-medium font-mono">${apiKeyName}</td>
<td class="table-cell">${groupName}</td>
<td class="table-cell">${errorInfo.type}</td>
<td class="table-cell">${errorInfo.statusCodeHtml}</td>
<td class="table-cell">${modelNameFormatted}</td>
<td class="table-cell text-muted-foreground text-xs">${requestTime}</td>
<td class="table-cell">
<button class="btn btn-ghost btn-icon btn-sm" aria-label="\u67E5\u770B\u8BE6\u60C5">
<i class="fas fa-ellipsis-h h-4 w-4"></i>
</button>
</td>
</tr>
`;
}
};
var logList_default = LogList;
// frontend/js/pages/logs/index.js
var LogsPage = class {
constructor() {
this.state = {
logs: [],
pagination: { page: 1, pages: 1, total: 0, page_size: 20 },
// 包含 page_size
isLoading: true,
filters: { page: 1, page_size: 20 }
};
this.elements = {
tableBody: document.getElementById("logs-table-body")
};
this.initialized = !!this.elements.tableBody;
if (this.initialized) {
this.logList = new logList_default(this.elements.tableBody);
}
}
async init() {
if (!this.initialized) {
console.error("LogsPage: Could not initialize. Essential container element 'logs-table-body' is missing.");
return;
}
this.initEventListeners();
await this.loadAndRenderLogs();
}
initEventListeners() {
}
async loadAndRenderLogs() {
this.state.isLoading = true;
this.logList.renderLoading();
try {
const url = `/admin/logs?page=${this.state.filters.page}&page_size=${this.state.filters.page_size}`;
const responseData = await apiFetchJson(url);
if (responseData && responseData.success && Array.isArray(responseData.data)) {
this.state.logs = responseData.data;
this.state.pagination = {
page: this.state.filters.page,
page_size: this.state.filters.page_size,
total: responseData.data.length,
// 这是一个不准确的临时值
pages: Math.ceil(responseData.data.length / this.state.filters.page_size)
// 同样不准确
};
this.logList.render(this.state.logs, this.state.pagination);
} else {
console.error("API response for logs is incorrect:", responseData);
this.logList.render([], this.state.pagination);
}
} catch (error) {
console.error("Failed to load logs:", error);
this.logList.render([], this.state.pagination);
} finally {
this.state.isLoading = false;
}
}
};
function logs_default() {
const page = new LogsPage();
page.init();
}
export {
logs_default as default
};

View File

@@ -1,106 +0,0 @@
import {
apiFetchJson
} from "./chunk-PLQL6WIO.js";
// frontend/js/pages/logs/logList.js
var LogList = class {
constructor(container) {
this.container = container;
if (!this.container) {
console.error("LogList: container element (tbody) not found.");
}
}
renderLoading() {
if (!this.container) return;
this.container.innerHTML = `<tr><td colspan="9" class="p-8 text-center text-muted-foreground"><i class="fas fa-spinner fa-spin mr-2"></i> \u52A0\u8F7D\u65E5\u5FD7\u4E2D...</td></tr>`;
}
render(logs) {
if (!this.container) return;
if (!logs || logs.length === 0) {
this.container.innerHTML = `<tr><td colspan="9" class="p-8 text-center text-muted-foreground">\u6CA1\u6709\u627E\u5230\u76F8\u5173\u7684\u65E5\u5FD7\u8BB0\u5F55\u3002</td></tr>`;
return;
}
const logsHtml = logs.map((log) => this.createLogRowHtml(log)).join("");
this.container.innerHTML = logsHtml;
}
createLogRowHtml(log) {
const groupName = log.GroupDisplayName || (log.GroupID ? `Group #${log.GroupID}` : "N/A");
const apiKeyName = log.APIKeyName || (log.KeyID ? `Key #${log.KeyID}` : "N/A");
const errorTag = log.IsSuccess ? `<span class="inline-flex items-center rounded-md bg-green-500/10 px-2 py-1 text-xs font-medium text-green-600">\u6210\u529F</span>` : `<span class="inline-flex items-center rounded-md bg-destructive/10 px-2 py-1 text-xs font-medium text-destructive">${log.ErrorCode || "\u5931\u8D25"}</span>`;
const requestTime = new Date(log.RequestTime).toLocaleString();
return `
<tr class="border-b border-b-border transition-colors hover:bg-muted/80" data-log-id="${log.ID}">
<td class="p-4 align-middle"><input type="checkbox" class="h-4 w-4 rounded border-zinc-300 text-blue-600 focus:ring-blue-500"></td>
<td class="p-4 align-middle font-mono text-muted-foreground">#${log.ID}</td>
<td class="p-4 align-middle font-medium font-mono">${apiKeyName}</td>
<td class="p-4 align-middle">${groupName}</td>
<td class="p-4 align-middle text-foreground">${log.ErrorMessage || (log.IsSuccess ? "" : "\u672A\u77E5\u9519\u8BEF")}</td>
<td class="p-4 align-middle">${errorTag}</td>
<td class="p-4 align-middle font-mono">${log.ModelName}</td>
<td class="p-4 align-middle text-muted-foreground text-xs">${requestTime}</td>
<td class="p-4 align-middle">
<button class="btn btn-ghost btn-icon btn-sm" aria-label="\u67E5\u770B\u8BE6\u60C5">
<i class="fas fa-ellipsis-h h-4 w-4"></i>
</button>
</td>
</tr>
`;
}
};
var logList_default = LogList;
// frontend/js/pages/logs/index.js
var LogsPage = class {
constructor() {
this.state = {
logs: [],
// [修正] 暂时将分页状态设为默认值,直到后端添加分页支持
pagination: { page: 1, pages: 1, total: 0 },
isLoading: true,
filters: { page: 1, page_size: 20 }
};
this.elements = {
tableBody: document.getElementById("logs-table-body")
};
this.initialized = !!this.elements.tableBody;
if (this.initialized) {
this.logList = new logList_default(this.elements.tableBody);
}
}
async init() {
if (!this.initialized) {
console.error("LogsPage: Could not initialize. Essential container element 'logs-table-body' is missing.");
return;
}
this.initEventListeners();
await this.loadAndRenderLogs();
}
initEventListeners() {
}
async loadAndRenderLogs() {
this.state.isLoading = true;
this.logList.renderLoading();
try {
const url = `/admin/logs?page=${this.state.filters.page}&page_size=${this.state.filters.page_size}`;
const responseData = await apiFetchJson(url);
if (responseData && responseData.success && Array.isArray(responseData.data)) {
this.state.logs = responseData.data;
this.logList.render(this.state.logs);
} else {
console.error("API response for logs is incorrect:", responseData);
this.logList.render([]);
}
} catch (error) {
console.error("Failed to load logs:", error);
} finally {
this.state.isLoading = false;
}
}
};
function logs_default() {
const page = new LogsPage();
page.init();
}
export {
logs_default as default
};

View File

@@ -181,7 +181,7 @@ var pageModules = {
// esbuild 看到这个 import() 语法,就会自动将 dashboard.js 及其依赖打包成一个独立的 chunk 文件
"dashboard": () => import("./dashboard-CJJWKYPR.js"),
"keys": () => import("./keys-A2UAJYOX.js"),
"logs": () => import("./logs-FGZ2SMPN.js")
"logs": () => import("./logs-4C4JG7BT.js")
// 'settings': () => import('./pages/settings.js'), // 未来启用 settings 页面
// 未来新增的页面只需在这里添加一行映射esbuild会自动处理
};

View File

@@ -7,7 +7,7 @@
<!--<script src="https://cdn.tailwindcss.com"></script>-->
<link href="/static/css/output.css" rel="stylesheet">
<link rel="stylesheet" href="https://fonts.googleapis.cn/css2?family=Pixelify+Sans:wght@400..700&display=swap">
<link rel="stylesheet" href="https://fonts.googleapis.cn/css2?family=Pixelify+Sans:wght@400..700&family=QuinqueFive&display=swap">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
<title>{% block title %}GEMINI BALANCER{% endblock %}</title>

View File

@@ -76,61 +76,26 @@
<div class="rounded-lg border border-zinc-200 dark:border-zinc-700 flex-grow overflow-hidden flex flex-col">
<!-- 容器需要 overflow-auto 以便表格内容超出时滚动 -->
<div class="relative w-full overflow-auto flex-grow main-content-scroll">
<table class="w-full caption-bottom text-sm">
<thead class="[&_tr]:border-b border-b-zinc-200 dark:border-b-zinc-800 sticky top-0 bg-zinc-50 dark:bg-zinc-900 z-10">
<tr class="transition-colors hover:bg-zinc-100/50 dark:hover:bg-zinc-800/50">
<th class="h-12 px-4 text-left align-middle font-medium text-zinc-500 dark:text-zinc-400 w-4">
<input type="checkbox" class="checkbox">
<table class="table">
<thead class="table-header">
<tr class="table-row">
<!-- [修正] 恢复全选复选框 -->
<th class="table-head-cell w-4">
<input type="checkbox" class="h-4 w-4 rounded border-zinc-300 text-blue-600 focus:ring-blue-500">
</th>
<th class="h-12 px-4 text-left align-middle font-medium text-zinc-500 dark:text-zinc-400">ID</th>
<th class="h-12 px-4 text-left align-middle font-medium text-zinc-500 dark:text-zinc-400">Gemini 密钥</th>
<th class="h-12 px-4 text-left align-middle font-medium text-zinc-500 dark:text-zinc-400">错误类型</th>
<th class="h-12 px-4 text-left align-middle font-medium text-zinc-500 dark:text-zinc-400">错误码</th>
<th class="h-12 px-4 text-left align-middle font-medium text-zinc-500 dark:text-zinc-400">模型名称</th>
<th class="h-12 px-4 text-left align-middle font-medium text-zinc-500 dark:text-zinc-400">请求时间</th>
<th class="h-12 px-4 text-left align-middle font-medium text-zinc-500 dark:text-zinc-400">操作</th>
<th class="table-head-cell w-16">序号</th>
<th class="table-head-cell">Gemini 密钥</th>
<!-- [新增] 群组名称列 -->
<th class="table-head-cell">群组名称</th>
<th class="table-head-cell">错误类型</th>
<th class="table-head-cell">状态码</th>
<th class="table-head-cell">模型名称</th>
<th class="table-head-cell">请求时间</th>
<th class="table-head-cell">操作</th>
</tr>
</thead>
<tbody class="[&_tr:last-child]:border-0" id="logs-table-body">
<tr class="border-b border-b-zinc-200 dark:border-b-zinc-700 transition-colors hover:bg-zinc-100/50 dark:hover:bg-zinc-800/50">
<td class="p-4 align-middle"><input type="checkbox" class="h-4 w-4 rounded border-zinc-300 text-blue-600 focus:ring-blue-500"></td>
<td class="p-4 align-middle font-mono text-zinc-600 dark:text-zinc-300">#12346</td>
<td class="p-4 align-middle font-medium font-mono">AIza...s7f1</td>
<td class="p-4 align-middle text-zinc-600 dark:text-zinc-300">API Key Invalid</td>
<td class="p-4 align-middle"><span class="inline-flex items-center rounded-md bg-destructive/10 px-2 py-1 text-xs font-medium text-destructive">429</span></td>
<td class="p-4 align-middle font-mono">gemini-1.5-pro-latest</td>
<td class="p-4 align-middle text-zinc-500 dark:text-zinc-400">2024-05-21 10:31:15</td>
<td class="p-4 align-middle">
<button class="btn btn-ghost btn-icon btn-sm" aria-label="更多操作"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="h-4 w-4"><circle cx="12" cy="12" r="1"></circle><circle cx="19" cy="12" r="1"></circle><circle cx="5" cy="12" r="1"></circle></svg></button>
</td>
</tr>
<!-- [示例] 您可以复制粘贴下面这行来增加更多数据行进行测试 -->
<tr class="border-b border-b-zinc-200 dark:border-b-zinc-700 transition-colors hover:bg-zinc-100/50 dark:hover:bg-zinc-800/50">
<td class="p-4 align-middle"><input type="checkbox" class="h-4 w-4 rounded border-zinc-300 text-blue-600 focus:ring-blue-500"></td>
<td class="p-4 align-middle font-mono text-zinc-600 dark:text-zinc-300">#12347</td>
<td class="p-4 align-middle font-medium font-mono">AIza...s7f2</td>
<td class="p-4 align-middle text-zinc-600 dark:text-zinc-300">Quota Exceeded</td>
<td class="p-4 align-middle"><span class="inline-flex items-center rounded-md bg-destructive/10 px-2 py-1 text-xs font-medium text-destructive">429</span></td>
<td class="p-4 align-middle font-mono">gemini-1.0-pro</td>
<td class="p-4 align-middle text-zinc-500 dark:text-zinc-400">2024-05-21 10:32:15</td>
<td class="p-4 align-middle">
<button class="btn btn-ghost btn-icon btn-sm" aria-label="更多操作"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="h-4 w-4"><circle cx="12" cy="12" r="1"></circle><circle cx="19" cy="12" r="1"></circle><circle cx="5" cy="12" r="1"></circle></svg></button>
</td>
</tr>
<tr class="border-b border-b-zinc-200 dark:border-b-zinc-700 transition-colors hover:bg-zinc-100/50 dark:hover:bg-zinc-800/50">
<td class="p-4 align-middle"><input type="checkbox" class="h-4 w-4 rounded border-zinc-300 text-blue-600 focus:ring-blue-500"></td>
<td class="p-4 align-middle font-mono text-zinc-600 dark:text-zinc-300">#12348</td>
<td class="p-4 align-middle font-medium font-mono">AIza...s7f3</td>
<td class="p-4 align-middle text-zinc-600 dark:text-zinc-300">Server Error</td>
<td class="p-4 align-middle"><span class="inline-flex items-center rounded-md bg-yellow-500/20 px-2 py-1 text-xs font-medium text-yellow-700 dark:text-yellow-400">500</span></td>
<td class="p-4 align-middle font-mono">gemini-1.5-pro-latest</td>
<td class="p-4 align-middle text-zinc-500 dark:text-zinc-400">2024-05-21 10:33:15</td>
<td class="p-4 align-middle">
<button class="btn btn-ghost btn-icon btn-sm" aria-label="更多操作"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="h-4 w-4"><circle cx="12" cy="12" r="1"></circle><circle cx="19" cy="12" r="1"></circle><circle cx="5" cy="12" r="1"></circle></svg></button>
</td>
</tr>
<tbody class="table-body" id="logs-table-body">
<!-- JS will render content here -->
</tbody>
</table>
</div>