feat: 优化历史记录页面小屏幕显示 (#552)

Co-authored-by: traeagent <traeagent@users.noreply.github.com>
This commit is contained in:
jxxghp
2026-07-18 10:42:08 +08:00
committed by GitHub
co-authored by traeagent
parent bbed5bf0ae
commit 3416c879de
+15 -21
View File
@@ -1676,7 +1676,7 @@ onUnmounted(() => {
:items="mobileDataList" :items="mobileDataList"
:columns="1" :columns="1"
:gap="14" :gap="14"
:estimated-item-height="324" :estimated-item-height="296"
:overscan-rows="5" :overscan-rows="5"
:get-item-key="getMobileHistoryItemKey" :get-item-key="getMobileHistoryItemKey"
> >
@@ -1721,6 +1721,14 @@ onUnmounted(() => {
<div class="transfer-history-mobile-record__subtitle"> <div class="transfer-history-mobile-record__subtitle">
{{ getHistorySubtitle(item) || item.type || t('common.unknown') }} {{ getHistorySubtitle(item) || item.type || t('common.unknown') }}
</div> </div>
<div class="transfer-history-mobile-record__meta">
<VChip class="transfer-history-mobile-record__mode" variant="outlined" color="primary" size="small">
{{ TransferDict[item?.mode ?? ''] || t('common.unknown') }}
</VChip>
<span>{{ formatFileSize(item?.src_fileitem?.size || 0) }}</span>
<span class="transfer-history-mobile-record__dot">·</span>
<span v-if="item?.date">{{ getHistoryDateText(item.date) }}</span>
</div>
</div> </div>
<VChip <VChip
@@ -1763,15 +1771,6 @@ onUnmounted(() => {
</IconBtn> </IconBtn>
</header> </header>
<div class="transfer-history-mobile-record__meta">
<VChip class="transfer-history-mobile-record__mode" variant="outlined" color="primary" size="small">
{{ TransferDict[item?.mode ?? ''] || t('common.unknown') }}
</VChip>
<span>{{ formatFileSize(item?.src_fileitem?.size || 0) }}</span>
<span class="transfer-history-mobile-record__dot">·</span>
<span v-if="item?.date">{{ getHistoryDateText(item.date) }}</span>
</div>
<button <button
type="button" type="button"
class="transfer-history-mobile-record__paths" class="transfer-history-mobile-record__paths"
@@ -2063,21 +2062,16 @@ onUnmounted(() => {
.transfer-history-mobile-record__meta { .transfer-history-mobile-record__meta {
display: flex; display: flex;
align-items: center; align-items: center;
gap: 0.65rem; flex-wrap: wrap;
overflow-x: auto; gap: 0.4rem;
padding-block: 0 0.85rem; margin-block-start: 0.3rem;
padding-inline: 1rem; overflow: hidden;
scrollbar-width: none;
white-space: nowrap;
}
.transfer-history-mobile-record__meta::-webkit-scrollbar {
display: none;
} }
.transfer-history-mobile-record__meta > span { .transfer-history-mobile-record__meta > span {
color: rgba(var(--v-theme-on-surface), var(--v-medium-emphasis-opacity)); color: rgba(var(--v-theme-on-surface), var(--v-medium-emphasis-opacity));
font-size: 0.875rem; font-size: 0.8rem;
line-height: 1.4;
} }
.transfer-history-mobile-record__mode { .transfer-history-mobile-record__mode {