From f1597e2b6b956fb4755c616ddedb4f3ffa9b5fa0 Mon Sep 17 00:00:00 2001
From: root <root@v2202607378382480008.hotsrv.de>
Date: Sat, 18 Jul 2026 08:22:23 +0200
Subject: [PATCH] =?UTF-8?q?fix:=20=E6=94=B6=E7=B4=A7=20CaseRun=20=E9=A1=B5?=
 =?UTF-8?q?=E5=A4=B4=E5=B8=83=E5=B1=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/views/caserun/CaseRunView.vue         | 31 ++++++++++++-------
 1 file changed, 20 insertions(+), 11 deletions(-)

diff --git a/web/hwlab-cloud-web/src/views/caserun/CaseRunView.vue b/web/hwlab-cloud-web/src/views/caserun/CaseRunView.vue
index 168a54e3..5d31270c 100644
--- a/web/hwlab-cloud-web/src/views/caserun/CaseRunView.vue
+++ b/web/hwlab-cloud-web/src/views/caserun/CaseRunView.vue
@@ -186,15 +186,16 @@ function artifactSize(bytes?: number): string {
 
 <template>
   <section class="caserun-page" id="caserun-page">
-    <PageCommandBar eyebrow="强化学习 / 用例运行" title="CaseRun 执行台" description="从 HWPOD 用例提交到硬件证据归档的统一运行视图。">
-      <template #actions>
-        <span id="caserun-mode" class="caserun-origin"><Activity :size="14" aria-hidden="true" />{{ fixtureModeLabel }}</span>
-        <button id="caserun-refresh" class="btn btn-secondary" type="button" title="刷新 CaseRun" aria-label="刷新 CaseRun" @click="refresh"><RefreshCw :size="15" aria-hidden="true" />刷新</button>
-        <button v-if="runId" class="btn btn-secondary" type="button" title="复制 runId" aria-label="复制 runId" @click="copy(runId)"><Clipboard :size="15" aria-hidden="true" />复制 runId</button>
-      </template>
-    </PageCommandBar>
-
-    <StatusStrip :items="statusItems" label="CaseRun 状态摘要" live="polite" />
+    <div class="caserun-page-head">
+      <PageCommandBar eyebrow="强化学习 / 用例运行" title="CaseRun 执行台" description="从 HWPOD 用例提交到硬件证据归档的统一运行视图。">
+        <template #actions>
+          <span id="caserun-mode" class="caserun-origin"><Activity :size="14" aria-hidden="true" />{{ fixtureModeLabel }}</span>
+          <button id="caserun-refresh" class="btn btn-secondary" type="button" title="刷新 CaseRun" aria-label="刷新 CaseRun" @click="refresh"><RefreshCw :size="15" aria-hidden="true" />刷新</button>
+          <button v-if="runId" class="btn btn-secondary" type="button" title="复制 runId" aria-label="复制 runId" @click="copy(runId)"><Clipboard :size="15" aria-hidden="true" />复制 runId</button>
+        </template>
+      </PageCommandBar>
+      <StatusStrip :items="statusItems" label="CaseRun 状态摘要" live="polite" />
+    </div>
 
     <div class="caserun-workspace">
       <aside class="caserun-sidebar" aria-label="CaseRun 用例选择">
@@ -310,7 +311,15 @@ function artifactSize(bytes?: number): string {
 </template>
 
 <style scoped>
-.caserun-page { display: grid; height: 100%; min-height: 0; grid-template-rows: auto auto minmax(0, 1fr); gap: 12px; overflow: hidden; color: var(--console-graphite-950); }
+.caserun-page { display: grid; height: 100%; min-height: 0; grid-template-rows: auto minmax(0, 1fr); gap: 8px; overflow: hidden; color: var(--console-graphite-950); }
+.caserun-page-head { display: grid; min-width: 0; }
+.caserun-page-head :deep(.page-command-bar) { min-height: 0; grid-template-columns: minmax(0, 1fr) auto; align-items: center; border-radius: var(--console-radius-sm) var(--console-radius-sm) 0 0; border-bottom: 0; padding: 7px 10px 7px 14px; box-shadow: none; }
+.caserun-page-head :deep(.page-command-copy) { grid-template-columns: auto minmax(0, 1fr); align-items: baseline; gap: 2px 12px; }
+.caserun-page-head :deep(.page-command-eyebrow) { grid-column: 1 / -1; }
+.caserun-page-head :deep(.page-command-title) { grid-column: 1; font-size: 21px; white-space: nowrap; }
+.caserun-page-head :deep(.page-command-description) { grid-column: 2; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.caserun-page-head :deep(.console-status-strip) { border-radius: 0 0 var(--console-radius-sm) var(--console-radius-sm); box-shadow: none; }
+.caserun-page-head :deep(.console-status-item) { min-height: 40px; padding-block: 5px; }
 .caserun-origin { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--console-border); border-radius: var(--console-radius-sm); background: var(--console-surface-muted); padding: 7px 9px; color: var(--console-cyan-700); font-family: var(--console-font-mono); font-size: 11px; }
 .caserun-workspace { display: grid; height: 100%; min-height: 0; grid-template-columns: minmax(220px, 0.78fr) minmax(420px, 1.7fr) minmax(250px, 0.92fr); overflow: hidden; overscroll-behavior: contain; border: 1px solid var(--console-border); border-radius: var(--console-radius-md); background: var(--console-surface-raised); box-shadow: var(--console-shadow-sm); }
 .caserun-sidebar, .caserun-inspector { min-width: 0; background: var(--console-surface-muted); }
@@ -407,5 +416,5 @@ function artifactSize(bytes?: number): string {
 .inspector-footer { display: flex; align-items: center; gap: 7px; border-top: 1px solid var(--console-border); padding: 12px 16px; color: var(--console-graphite-500); font-size: 10px; line-height: 1.45; }
 .inspector-footer svg:last-child { flex: 0 0 auto; color: var(--console-cyan-700); }
 @media (max-width: 1180px) { .caserun-workspace { grid-template-columns: minmax(205px, .7fr) minmax(420px, 1.4fr); grid-template-rows: minmax(0, 1fr) auto; overflow-y: auto; } .caserun-inspector { grid-column: 1 / -1; border-top: 1px solid var(--console-border); border-left: 0; } .evidence-body { max-height: 180px; } }
-@media (max-width: 760px) { .caserun-workspace { display: flex; min-height: 0; flex-direction: column; overflow-y: auto; } .caserun-sidebar, .caserun-inspector { flex: 0 0 auto; border: 0; } .caserun-sidebar { border-bottom: 1px solid var(--console-border); } .caserun-case-list { max-height: 210px; } .caserun-main { min-height: 520px; flex: 0 0 auto; } .caserun-run-header { flex-direction: column; } .run-facts { width: 100%; } .stage-track { min-width: 620px; } .caserun-inspector { border-top: 1px solid var(--console-border); } .page-command-actions { justify-content: flex-start; } }
+@media (max-width: 760px) { .caserun-page-head :deep(.page-command-bar) { grid-template-columns: minmax(0, 1fr); padding: 9px 10px; } .caserun-page-head :deep(.page-command-copy) { display: grid; grid-template-columns: minmax(0, 1fr); gap: 2px; } .caserun-page-head :deep(.page-command-eyebrow), .caserun-page-head :deep(.page-command-title), .caserun-page-head :deep(.page-command-description) { grid-column: 1; } .caserun-page-head :deep(.page-command-description) { display: none; } .caserun-page-head :deep(.page-command-actions) { justify-content: flex-start; } .caserun-workspace { display: flex; min-height: 0; flex-direction: column; overflow-y: auto; } .caserun-sidebar, .caserun-inspector { flex: 0 0 auto; border: 0; } .caserun-sidebar { border-bottom: 1px solid var(--console-border); } .caserun-case-list { max-height: 210px; } .caserun-main { min-height: 520px; flex: 0 0 auto; } .caserun-run-header { flex-direction: column; } .run-facts { width: 100%; } .stage-track { min-width: 620px; } .caserun-inspector { border-top: 1px solid var(--console-border); } }
 </style>