Tighten study card export layout

This commit is contained in:
Codex
2026-05-27 14:32:10 +08:00
parent 555a04f337
commit 223e853bad
2 changed files with 47 additions and 7 deletions

View File

@@ -409,7 +409,11 @@ function renderStudies() {
const exportControls = isAdmin() const exportControls = isAdmin()
? ` ? `
${app.exportMode ? `<label class="study-batch-check"><input type="checkbox" ${app.exportSelection.has(study.ct_number) ? "checked" : ""} />选择</label>` : ""} ${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 = ` card.innerHTML = `
@@ -418,9 +422,11 @@ function renderStudies() {
<div class="study-part-tags">${partTags}</div> <div class="study-part-tags">${partTags}</div>
</div> </div>
<strong>${escapeHtml(study.ct_number)}</strong> <strong>${escapeHtml(study.ct_number)}</strong>
<span>${escapeHtml(name)} · ${escapeHtml(study.patient_id || "无ID")}</span> <span class="study-patient">${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> <div class="study-meta">
<span>${Number(study.annotated_series || 0)} 个序列已标注,${Number(study.unannotated_series || 0)} 个序列未标注</span> <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} ${exportControls}
`; `;
card.onclick = () => selectStudy(study.ct_number); card.onclick = () => selectStudy(study.ct_number);

View File

@@ -410,7 +410,7 @@ button:disabled {
.study-card { .study-card {
position: relative; position: relative;
width: 100%; width: 100%;
padding: 12px 112px 42px 12px; padding: 12px 44px 42px 12px;
margin-bottom: 10px; margin-bottom: 10px;
border: 1px solid transparent; border: 1px solid transparent;
border-radius: 8px; border-radius: 8px;
@@ -495,7 +495,16 @@ button:disabled {
font-size: 14px; 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; display: block;
margin-top: 6px; margin-top: 6px;
color: var(--muted); color: var(--muted);
@@ -503,6 +512,19 @@ button:disabled {
line-height: 1.35; 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-export-btn,
.study-batch-check { .study-batch-check {
position: absolute; position: absolute;
@@ -521,7 +543,9 @@ button:disabled {
.study-export-btn { .study-export-btn {
right: 10px; right: 10px;
min-width: 50px; width: 28px;
min-width: 28px;
border-radius: 50%;
} }
.study-export-btn:hover { .study-export-btn:hover {
@@ -530,6 +554,16 @@ button:disabled {
background: rgba(25, 212, 194, 0.1); 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 { .study-batch-check {
left: 12px; left: 12px;
grid-auto-flow: column; grid-auto-flow: column;