Tighten study card export layout
This commit is contained in:
@@ -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);
|
||||||
|
|||||||
@@ -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;
|
||||||
|
|||||||
Reference in New Issue
Block a user