feat: 优化 TransferHistoryView 组件的布局和样式

This commit is contained in:
jxxghp
2025-04-09 15:05:31 +08:00
parent c4f6db9f9f
commit 22a2bb65c8

View File

@@ -426,7 +426,7 @@ onMounted(fetchData)
</script> </script>
<template> <template>
<VCard class="bg-transparent"> <VCard>
<VCardItem> <VCardItem>
<VCardTitle> <VCardTitle>
<VRow> <VRow>
@@ -442,22 +442,19 @@ onMounted(fetchData)
label="搜索整理记录" label="搜索整理记录"
prepend-inner-icon="mdi-magnify" prepend-inner-icon="mdi-magnify"
variant="solo-filled" variant="solo-filled"
max-width="25rem"
single-line single-line
hide-details hide-details
flat flat
rounded rounded="pill"
clearable clearable
/> />
</VCol> </VCol>
<VCol cols="4" md="6" class="text-end"> <VCol cols="4" md="6" class="text-end">
<VBtn <VBtnGroup variant="outlined" divided rounded>
color="primary" <VBtn icon="mdi-timer-sand-paused" @click="transferQueueDialog = true" />
prepend-icon="mdi-tray-full" <VBtn :icon="group ? 'mdi-format-list-bulleted' : 'mdi-format-list-group'" @click="group = !group" />
append-icon="mdi-dots-horizontal" </VBtnGroup>
@click="transferQueueDialog = true"
>
<span v-if="display.mdAndUp.value" class="ms-2">整理队列</span>
</VBtn>
</VCol> </VCol>
</VRow> </VRow>
</VCardTitle> </VCardTitle>
@@ -650,9 +647,10 @@ onMounted(fetchData)
</template> </template>
<template #no-data> 没有数据 </template> <template #no-data> 没有数据 </template>
</VDataTableVirtual> </VDataTableVirtual>
<VDivider />
<div class="flex items-center justify-between"> <div class="flex items-center justify-between">
<div class="w-auto"> <div class="w-auto">
<VSelect v-model="itemsPerPage" :items="pageRange" density="compact" variant="plain" flat /> <VSelect v-model="itemsPerPage" :items="pageRange" density="compact" variant="tonal" flat />
</div> </div>
<div class="w-auto text-sm">{{ pageTip.begin }} - {{ pageTip.end }} / {{ totalItems }}</div> <div class="w-auto text-sm">{{ pageTip.begin }} - {{ pageTip.end }} / {{ totalItems }}</div>
<VPagination <VPagination
@@ -678,10 +676,10 @@ onMounted(fetchData)
app app
appear appear
@click="removeHistoryBatch" @click="removeHistoryBatch"
:class="{ 'mb-12': appMode }" :class="appMode ? 'mb-28' : 'mb-16'"
/> />
<VFab <VFab
:class="appMode ? 'mb-28' : 'mb-16'" :class="appMode ? 'mb-44' : 'mb-32'"
icon="mdi-redo-variant" icon="mdi-redo-variant"
location="bottom" location="bottom"
size="x-large" size="x-large"
@@ -691,19 +689,6 @@ onMounted(fetchData)
@click="retransferBatch" @click="retransferBatch"
/> />
</div> </div>
<div v-else-if="isRefreshed">
<VFab
:icon="group ? 'mdi-format-list-bulleted' : 'mdi-format-list-group'"
color="primary"
location="bottom"
size="x-large"
fixed
app
appear
@click="group = !group"
:class="{ 'mb-12': appMode }"
/>
</div>
<!-- 底部弹窗 --> <!-- 底部弹窗 -->
<VBottomSheet v-model="deleteConfirmDialog" inset> <VBottomSheet v-model="deleteConfirmDialog" inset>
<VCard class="text-center rounded-t"> <VCard class="text-center rounded-t">
@@ -742,4 +727,8 @@ onMounted(fetchData)
.v-table th { .v-table th {
white-space: nowrap; white-space: nowrap;
} }
.v-table__wrapper {
border-radius: 0;
}
</style> </style>