From 89ee8ccfc6cfb7b8b3e6b51c588b64c2aa04023a Mon Sep 17 00:00:00 2001
From: duorameng <2997944583@qq.com>
Date: Wed, 8 Jul 2026 09:24:55 +0800
Subject: [PATCH] style: add scrollbar and max height to log detail dialogs

---
 web/src/views/logs/tabs/SchedulerLogTab.vue | 4 ++--
 web/src/views/logs/tabs/SystemEventTab.vue  | 4 ++--
 web/src/views/notify/components/PushLog.vue | 4 ++--
 3 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/web/src/views/logs/tabs/SchedulerLogTab.vue b/web/src/views/logs/tabs/SchedulerLogTab.vue
index 3deee4e..6eb604c 100644
--- a/web/src/views/logs/tabs/SchedulerLogTab.vue
+++ b/web/src/views/logs/tabs/SchedulerLogTab.vue
@@ -277,7 +277,7 @@ function onDialogClose(open: boolean) {
                 <div class="space-y-4">
                     <div class="p-4 rounded-xl bg-muted/20 border border-border/10 space-y-2">
                         <p class="text-[10px] uppercase tracking-widest text-muted-foreground font-bold">事件内容</p>
-                        <div v-if="detailDialogProps.content" class="text-sm leading-relaxed text-foreground/80 break-all whitespace-pre-wrap">
+                        <div v-if="detailDialogProps.content" class="text-sm leading-relaxed text-foreground/80 break-all whitespace-pre-wrap max-h-[30vh] overflow-y-auto custom-scrollbar">
                             {{ detailDialogProps.content }}
                         </div>
                         <div v-else class="text-sm text-muted-foreground italic">无内容</div>
@@ -285,7 +285,7 @@ function onDialogClose(open: boolean) {
 
                     <div v-if="detailDialogProps.error" class="p-4 rounded-xl bg-destructive/5 border border-destructive/10 space-y-2">
                         <p class="text-[10px] uppercase tracking-widest text-destructive font-bold">错误堆栈/信息</p>
-                        <div class="text-sm leading-relaxed text-destructive/90 break-all whitespace-pre-wrap font-mono bg-destructive/5 p-3 rounded-lg border border-destructive/10">
+                        <div class="text-sm leading-relaxed text-destructive/90 break-all whitespace-pre-wrap font-mono bg-destructive/5 p-3 rounded-lg border border-destructive/10 max-h-[30vh] overflow-y-auto custom-scrollbar">
                             {{ detailDialogProps.error }}
                         </div>
                     </div>
diff --git a/web/src/views/logs/tabs/SystemEventTab.vue b/web/src/views/logs/tabs/SystemEventTab.vue
index efb106c..ba9762d 100644
--- a/web/src/views/logs/tabs/SystemEventTab.vue
+++ b/web/src/views/logs/tabs/SystemEventTab.vue
@@ -277,7 +277,7 @@ function onDialogClose(open: boolean) {
                 <div class="space-y-4">
                     <div class="p-4 rounded-xl bg-muted/20 border border-border/10 space-y-2">
                         <p class="text-[10px] uppercase tracking-widest text-muted-foreground font-bold">事件内容</p>
-                        <div v-if="detailDialogProps.content" class="text-sm leading-relaxed text-foreground/80 break-all whitespace-pre-wrap">
+                        <div v-if="detailDialogProps.content" class="text-sm leading-relaxed text-foreground/80 break-all whitespace-pre-wrap max-h-[30vh] overflow-y-auto custom-scrollbar">
                             {{ detailDialogProps.content }}
                         </div>
                         <div v-else class="text-sm text-muted-foreground italic">无内容</div>
@@ -285,7 +285,7 @@ function onDialogClose(open: boolean) {
 
                     <div v-if="detailDialogProps.error" class="p-4 rounded-xl bg-destructive/5 border border-destructive/10 space-y-2">
                         <p class="text-[10px] uppercase tracking-widest text-destructive font-bold">错误堆栈/信息</p>
-                        <div class="text-sm leading-relaxed text-destructive/90 break-all whitespace-pre-wrap font-mono bg-destructive/5 p-3 rounded-lg border border-destructive/10">
+                        <div class="text-sm leading-relaxed text-destructive/90 break-all whitespace-pre-wrap font-mono bg-destructive/5 p-3 rounded-lg border border-destructive/10 max-h-[30vh] overflow-y-auto custom-scrollbar">
                             {{ detailDialogProps.error }}
                         </div>
                     </div>
diff --git a/web/src/views/notify/components/PushLog.vue b/web/src/views/notify/components/PushLog.vue
index 2da2ed1..54f0df5 100644
--- a/web/src/views/notify/components/PushLog.vue
+++ b/web/src/views/notify/components/PushLog.vue
@@ -311,7 +311,7 @@ function onDialogClose(open: boolean) {
             <!-- 装饰性背景，模拟高级卡片 -->
             <div class="absolute -inset-0.5 bg-gradient-to-br from-primary/5 via-transparent to-primary/5 rounded-2xl blur opacity-20 group-hover:opacity-40 transition duration-500" />
             <div v-if="detailDialogProps.content"
-              class="relative bg-background/50 dark:bg-muted/10 p-5 rounded-2xl border border-border/40 whitespace-pre-wrap break-all leading-relaxed shadow-[0_2px_15px_-3px_rgba(0,0,0,0.03)] text-[13px] text-foreground/90 font-medium"
+              class="relative bg-background/50 dark:bg-muted/10 p-5 rounded-2xl border border-border/40 whitespace-pre-wrap break-all leading-relaxed shadow-[0_2px_15px_-3px_rgba(0,0,0,0.03)] text-[13px] text-foreground/90 font-medium max-h-[50vh] overflow-y-auto custom-scrollbar"
               v-html="renderedContent">
             </div>
             <div v-else class="relative bg-muted/20 p-6 rounded-2xl border border-dashed border-border/60 text-center text-sm text-muted-foreground">
@@ -326,7 +326,7 @@ function onDialogClose(open: boolean) {
             <div class="w-1 h-3.5 bg-destructive/40 rounded-full" />
             <span class="text-xs font-bold text-destructive/80 uppercase tracking-widest">错误报告</span>
           </div>
-          <div class="bg-destructive/[0.03] p-5 rounded-2xl border border-destructive/10 text-[13px] text-destructive/90 font-mono leading-relaxed break-all">
+          <div class="bg-destructive/[0.03] p-5 rounded-2xl border border-destructive/10 text-[13px] text-destructive/90 font-mono leading-relaxed break-all max-h-[200px] overflow-y-auto custom-scrollbar">
             {{ detailDialogProps.error }}
           </div>
         </div>