fix: logsviewer ansi render error #52

web/src/utils/ansi.ts

@@ -3,7 +3,26 @@ import AnsiUp from 'ansi-to-html'
 const ansiUp = new AnsiUp({
   newline: false,
   escapeXML: true,
-  stream: false
+  stream: false,
+  colors: {
+    // 基础 16 色优化，使其在深色背景下更鲜艳
+    0:  '#000000', // Black
+    1:  '#ef4444', // Red (Tailwind red-500)
+    2:  '#22c55e', // Green (Tailwind green-500)
+    3:  '#eab308', // Yellow (Tailwind yellow-500)
+    4:  '#3b82f6', // Blue (Tailwind blue-500)
+    5:  '#a855f7', // Magenta (Tailwind purple-500)
+    6:  '#06b6d4', // Cyan (Tailwind cyan-500)
+    7:  '#d4d4d8', // White (Tailwind zinc-300)
+    8:  '#71717a', // Bright Black
+    9:  '#f87171', // Bright Red
+    10: '#4ade80', // Bright Green
+    11: '#facc15', // Bright Yellow
+    12: '#60a5fa', // Bright Blue
+    13: '#c084fc', // Bright Magenta
+    14: '#22d3ee', // Bright Cyan
+    15: '#ffffff'  // Bright White
+  }
 })
 
 export function ansiToHtml(ansi: string): string {

web/src/views/history/History.vue

@@ -570,10 +570,10 @@ watch(() => route.query, (newQuery) => {
               <Maximize2 class="h-3.5 w-3.5" />
             </Button>
           </div>
-          <div class="flex-1 overflow-auto bg-muted/5 min-h-[160px]">
+          <div class="flex-1 overflow-auto bg-zinc-950 min-h-[160px]">
             <pre
-              class="p-4 text-xs font-mono whitespace-pre-wrap break-all log-pre leading-relaxed" v-html="renderedOutput"></pre>
-            <div v-if="isWsLoading" class="p-4 text-sm text-muted-foreground italic">连接中...</div>
+              class="p-4 text-xs font-mono whitespace-pre-wrap break-all log-pre leading-relaxed text-zinc-300" v-html="renderedOutput"></pre>
+            <div v-if="isWsLoading" class="p-4 text-sm text-zinc-500 italic">连接中...</div>
           </div>
         </div>
       </div>

web/src/views/history/LogViewer.vue

@@ -87,8 +87,8 @@ onUnmounted(() => {
             </Button>
           </div>
         </div>
-        <div class="flex-1 overflow-auto bg-black/5 dark:bg-white/5">
-          <pre class="p-3 sm:p-4 text-xs font-mono whitespace-pre-wrap break-all" v-html="highlightedContent"></pre>
+        <div class="flex-1 overflow-auto bg-zinc-950">
+          <pre class="p-3 sm:p-4 text-xs font-mono whitespace-pre-wrap break-all text-zinc-300" v-html="highlightedContent"></pre>
         </div>
       </div>
     </div>