mirrors/pikasTech-HWLAB
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: 收紧 CaseRun 页头布局
Pipelines as Code CI / hwlab-nc01-v03-ci-poll- Success
Details

Browse Source
This commit is contained in:
root
2026-07-18 08:22:23 +02:00
parent 84c9ca58fb
commit f1597e2b6b
1 changed files with 20 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/hwlab-cloud-web/src/views/caserun/CaseRunView.vue
+20 -11
View File
@@ -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>