Tighten study card export layout

PACS_DICOM处理/数据处理网页端/static/app.js

@@ -409,7 +409,11 @@ function renderStudies() {
     const exportControls = isAdmin()
       ? `
         ${app.exportMode ? `<label class="study-batch-check"><input type="checkbox" ${app.exportSelection.has(study.ct_number) ? "checked" : ""} />选择</label>` : ""}
-        <span class="study-export-btn" role="button" tabindex="0" title="导出该检查影像">下载</span>
+        <span class="study-export-btn" role="button" tabindex="0" title="导出该检查影像" aria-label="导出该检查影像">
+          <svg viewBox="0 0 24 24" aria-hidden="true">
+            <path d="M12 3v11m0 0 4-4m-4 4-4-4M5 20h14" />
+          </svg>
+        </span>
       `
       : "";
     card.innerHTML = `
@@ -418,9 +422,11 @@ function renderStudies() {
         <div class="study-part-tags">${partTags}</div>
       </div>
       <strong>${escapeHtml(study.ct_number)}</strong>
-      <span>${escapeHtml(name)} · ${escapeHtml(study.patient_id || "无ID")}</span>
-      <span>${escapeHtml(fmtDate(study.study_date))} ${escapeHtml(fmtTime(study.study_time))} · ${Number(study.dicom_file_count || 0)} 张</span>
-      <span>${Number(study.annotated_series || 0)} 个序列已标注，${Number(study.unannotated_series || 0)} 个序列未标注</span>
+      <span class="study-patient">${escapeHtml(name)} · ${escapeHtml(study.patient_id || "无ID")}</span>
+      <div class="study-meta">
+        <span>${escapeHtml(fmtDate(study.study_date))} ${escapeHtml(fmtTime(study.study_time))}</span>
+        <span>${Number(study.dicom_file_count || 0)} 张 · ${Number(study.annotated_series || 0)} 个序列已标注，${Number(study.unannotated_series || 0)} 个序列未标注</span>
+      </div>
       ${exportControls}
     `;
     card.onclick = () => selectStudy(study.ct_number);

PACS_DICOM处理/数据处理网页端/static/styles.css

@@ -410,7 +410,7 @@ button:disabled {
 .study-card {
   position: relative;
   width: 100%;
-  padding: 12px 112px 42px 12px;
+  padding: 12px 44px 42px 12px;
   margin-bottom: 10px;
   border: 1px solid transparent;
   border-radius: 8px;
@@ -495,7 +495,16 @@ button:disabled {
   font-size: 14px;
 }
 
-.study-card span {
+.study-card strong,
+.study-patient {
+  max-width: calc(100% - 104px);
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.study-patient,
+.study-meta span {
   display: block;
   margin-top: 6px;
   color: var(--muted);
@@ -503,6 +512,19 @@ button:disabled {
   line-height: 1.35;
 }
 
+.study-meta {
+  margin-top: 8px;
+  display: grid;
+  gap: 4px;
+}
+
+.study-meta span {
+  margin-top: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
 .study-export-btn,
 .study-batch-check {
   position: absolute;
@@ -521,7 +543,9 @@ button:disabled {
 
 .study-export-btn {
   right: 10px;
-  min-width: 50px;
+  width: 28px;
+  min-width: 28px;
+  border-radius: 50%;
 }
 
 .study-export-btn:hover {
@@ -530,6 +554,16 @@ button:disabled {
   background: rgba(25, 212, 194, 0.1);
 }
 
+.study-export-btn svg {
+  width: 15px;
+  height: 15px;
+  fill: none;
+  stroke: currentColor;
+  stroke-width: 2.2;
+  stroke-linecap: round;
+  stroke-linejoin: round;
+}
+
 .study-batch-check {
   left: 12px;
   grid-auto-flow: column;