From 93fb5fd2c44eaa9ea03bfcaca639baf828fd3738 Mon Sep 17 00:00:00 2001
From: yelan <wzqf99@foxmail.com>
Date: Tue, 22 Sep 2026 10:31:08 +0800
Subject: [PATCH] =?UTF-8?q?fix(signing):=20=E4=BF=AE=E5=A4=8D=E9=95=BF?=
 =?UTF-8?q?=E6=96=87=E4=B9=A6=E6=BB=9A=E5=8A=A8=E5=B8=83=E5=B1=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../signing/components/SigningTaskDetail.vue  | 92 +++++++++++++------
 .../signing/components/SigningTaskList.vue    | 11 ++-
 .../src/views/workbench/signing/index.vue     | 21 ++++-
 3 files changed, 92 insertions(+), 32 deletions(-)

diff --git a/clinical-web/src/views/workbench/signing/components/SigningTaskDetail.vue b/clinical-web/src/views/workbench/signing/components/SigningTaskDetail.vue
index bd53669..b9653d6 100644
--- a/clinical-web/src/views/workbench/signing/components/SigningTaskDetail.vue
+++ b/clinical-web/src/views/workbench/signing/components/SigningTaskDetail.vue
@@ -169,33 +169,37 @@ defineExpose({ getDocumentElement })
         </button>
       </div>
 
-      <!-- 任务接口只返回模板版本哈希，正文由 API 层按哈希补回；
-           补不到时如实提示并给出占位版式，不退化成"看起来像真文书"的假纸样 -->
-      <SigningDocumentInteractive
-        v-if="task.documentContentHtml"
-        ref="documentRef"
-        :task="task"
-        :interactive="allowLocalSigning && task.status !== 'signed' && task.status !== 'void'"
-        :signature-injections="signatureInjections"
-        @selection-change="emit('selectionChange', $event)"
-        @field-change="(answers, progress) => emit('fieldChange', answers, progress)"
-        @signature-request="emit('signatureRequest', $event)"
-      />
-      <SigningDocumentPreview v-else :task="task" />
-      <TaskAuditTimeline
-        v-if="canViewAudit"
-        :events="auditEvents"
-        :loading="auditLoading"
-        :error="auditError"
-      />
-      <SigningArtifactList
-        v-if="canViewArtifacts"
-        :artifacts="artifacts"
-        :loading="artifactsLoading"
-        :error="artifactsError"
-        :can-download="canDownloadArtifact"
-        @download="emit('downloadArtifact', $event)"
-      />
+      <!-- 操作按钮常驻顶部，文书在自己的滚动区里滚：
+           长文书不再把整页顶下去，左栏与按钮也不会滚出视野 -->
+      <div class="detail-body">
+        <!-- 任务接口只返回模板版本哈希，正文由 API 层按哈希补回；
+             补不到时如实提示并给出占位版式，不退化成"看起来像真文书"的假纸样 -->
+        <SigningDocumentInteractive
+          v-if="task.documentContentHtml"
+          ref="documentRef"
+          :task="task"
+          :interactive="allowLocalSigning && task.status !== 'signed' && task.status !== 'void'"
+          :signature-injections="signatureInjections"
+          @selection-change="emit('selectionChange', $event)"
+          @field-change="(answers, progress) => emit('fieldChange', answers, progress)"
+          @signature-request="emit('signatureRequest', $event)"
+        />
+        <SigningDocumentPreview v-else :task="task" />
+        <TaskAuditTimeline
+          v-if="canViewAudit"
+          :events="auditEvents"
+          :loading="auditLoading"
+          :error="auditError"
+        />
+        <SigningArtifactList
+          v-if="canViewArtifacts"
+          :artifacts="artifacts"
+          :loading="artifactsLoading"
+          :error="artifactsError"
+          :can-download="canDownloadArtifact"
+          @download="emit('downloadArtifact', $event)"
+        />
+      </div>
     </template>
 
     <div v-else class="detail-empty">
@@ -207,12 +211,25 @@ defineExpose({ getDocumentElement })
 
 <style scoped>
 .detail-panel {
+  display: flex;
   flex: 1;
   min-width: 0;
+  min-height: 0;
+  flex-direction: column;
+}
+
+/* 文书 + 留痕 + 产物的滚动区：flex 子项必须 min-height: 0 才肯被压到内容高度以下，
+   否则它会撑到内容高度，overflow 永远触发不了（与用户权限面板同一处理） */
+.detail-body {
+  flex: 1;
+  min-height: 0;
+  padding-right: 3px;
+  overflow-y: auto;
 }
 
 .task-actions {
   display: flex;
+  flex-shrink: 0;
   gap: 10px;
   align-items: center;
   flex-wrap: wrap;
@@ -272,7 +289,8 @@ defineExpose({ getDocumentElement })
 
 .detail-empty {
   display: grid;
-  min-height: 560px;
+  flex: 1;
+  min-height: 0;
   padding: 40px 24px;
   color: var(--mut);
   text-align: center;
@@ -296,7 +314,8 @@ defineExpose({ getDocumentElement })
 
 .detail-loading {
   display: flex;
-  min-height: 680px;
+  flex: 1;
+  min-height: 0;
   flex-direction: column;
   gap: 14px;
 }
@@ -316,7 +335,7 @@ defineExpose({ getDocumentElement })
 
 .detail-loading__paper {
   flex: 1;
-  min-height: 560px;
+  min-height: 0;
 }
 
 @keyframes skeleton-shimmer {
@@ -329,6 +348,19 @@ defineExpose({ getDocumentElement })
   }
 }
 
+@media (max-width: 1200px) {
+  /* 窄屏堆叠后不再锁高度，恢复自然流式布局，由外层滚动 */
+  .detail-body {
+    flex: none;
+    overflow: visible;
+  }
+
+  .detail-empty,
+  .detail-loading {
+    min-height: 560px;
+  }
+}
+
 @media (max-width: 700px) {
   .task-action-meta {
     width: 100%;
diff --git a/clinical-web/src/views/workbench/signing/components/SigningTaskList.vue b/clinical-web/src/views/workbench/signing/components/SigningTaskList.vue
index 7460bc8..12727af 100644
--- a/clinical-web/src/views/workbench/signing/components/SigningTaskList.vue
+++ b/clinical-web/src/views/workbench/signing/components/SigningTaskList.vue
@@ -126,12 +126,16 @@ function getVisitClass(type: SigningTaskRecord['visitType']) {
 
 <style scoped>
 .task-list-panel {
+  display: flex;
   width: 400px;
+  min-height: 0;
+  flex-direction: column;
   flex-shrink: 0;
 }
 
 .task-list-heading {
   display: flex;
+  flex-shrink: 0;
   align-items: center;
   padding: 10px 14px;
   margin-bottom: 12px;
@@ -150,8 +154,10 @@ function getVisitClass(type: SigningTaskRecord['visitType']) {
   font-size: 12px;
 }
 
+/* 列表自己滚：高度由工作区剩余空间决定，不再按 100vh 硬算 */
 .task-items {
-  max-height: calc(100vh - 270px);
+  flex: 1;
+  min-height: 0;
   padding-right: 3px;
   overflow-y: auto;
 }
@@ -314,6 +320,7 @@ function getVisitClass(type: SigningTaskRecord['visitType']) {
 
 .task-pagination {
   display: flex;
+  flex-shrink: 0;
   gap: 8px;
   align-items: center;
   padding: 9px 10px;
@@ -399,7 +406,9 @@ function getVisitClass(type: SigningTaskRecord['visitType']) {
     width: 100%;
   }
 
+  /* 窄屏堆叠后父级不再锁高度，列表要自己给个上限，否则整页被拉得很长 */
   .task-items {
+    flex: none;
     max-height: 420px;
   }
 }
diff --git a/clinical-web/src/views/workbench/signing/index.vue b/clinical-web/src/views/workbench/signing/index.vue
index f40d65e..4e51f0a 100644
--- a/clinical-web/src/views/workbench/signing/index.vue
+++ b/clinical-web/src/views/workbench/signing/index.vue
@@ -918,12 +918,22 @@ onMounted(() => {
 </template>
 
 <style scoped>
+/* 工作区吃满可视高度：文书在自己的滚动区里滚，页面本身不再滚。
+   外层 Container 仍是滚动容器，这里只是不去撑高它 */
 .signing-page {
+  display: flex;
   width: 100%;
   max-width: 1600px;
+  height: 100%;
+  min-height: 0;
+  flex-direction: column;
   margin: 0 auto;
 }
 
+.signing-page > * {
+  flex-shrink: 0;
+}
+
 .page-intro {
   display: flex;
   gap: 20px;
@@ -963,8 +973,11 @@ onMounted(() => {
 
 .task-workspace {
   display: flex;
+  flex: 1;
   gap: 16px;
-  align-items: flex-start;
+  align-items: stretch;
+  /* 视口过矮时保底：宁可让外层滚动，也不把工作区压到看不见文书 */
+  min-height: 400px;
 }
 
 .task-workspace > * {
@@ -972,8 +985,14 @@ onMounted(() => {
 }
 
 @media (max-width: 1200px) {
+  /* 窄屏两栏改上下堆叠，此时不再锁死高度，交回外层自然滚动 */
+  .signing-page {
+    height: auto;
+  }
+
   .task-workspace {
     flex-direction: column;
+    min-height: 0;
   }
 
   .task-workspace > * {