feat(TransferQueueDialog): 添加状态标签以显示任务状态,优化进度条显示逻辑

This commit is contained in:
jxxghp
2024-12-26 13:42:59 +08:00
parent 2602cb0998
commit a53553d658
+15 -5
View File
@@ -29,6 +29,14 @@ const refreshFlag = ref(false)
// 活动标签 // 活动标签
const activeTab = ref('') const activeTab = ref('')
// 状态标签
const stateDict: { [key: string]: string } = {
'waiting': '等待中',
'running': '正在整理',
'completed': '完成',
'failed': '失败',
}
// 从dataList中提取所有的媒体信息 // 从dataList中提取所有的媒体信息
const mediaList = computed(() => { const mediaList = computed(() => {
return dataList.value.map(item => item.media) return dataList.value.map(item => item.media)
@@ -103,11 +111,11 @@ onUnmounted(() => {
<VCardTitle>整理任务队列</VCardTitle> <VCardTitle>整理任务队列</VCardTitle>
</VCardItem> </VCardItem>
<DialogCloseBtn @click="emit('close')" /> <DialogCloseBtn @click="emit('close')" />
<VCardText v-if="dataList.length === 0" class="text-center"> 没有正在整理的任务 </VCardText> <VCardText v-if="dataList.length > 0 && progressValue > 0" class="text-center">
<VCardText v-else-if="progressValue > 0" class="text-center"> <VProgressLinear :value="progressValue" color="primary" rounded indeterminate />
{{ progressText }} <span class="mt-2">{{ progressText }}</span>
<VProgressLinear :value="progressValue" color="primary" rounded indeterminate class="mt-2" />
</VCardText> </VCardText>
<VCardText v-if="dataList.length === 0" class="text-center"> 没有正在整理的任务 </VCardText>
<VCardText> <VCardText>
<VTabs v-model="activeTab" show-arrows class="v-tabs-pill"> <VTabs v-model="activeTab" show-arrows class="v-tabs-pill">
<VTab <VTab
@@ -123,7 +131,9 @@ onUnmounted(() => {
<VList> <VList>
<VListItem v-for="task in activeTasks"> <VListItem v-for="task in activeTasks">
<VListItemTitle>{{ task.fileitem.name }}</VListItemTitle> <VListItemTitle>{{ task.fileitem.name }}</VListItemTitle>
<VListItemSubtitle>{{ formatFileSize(task.fileitem.size || 0) }}</VListItemSubtitle> <VListItemSubtitle>
{{ formatFileSize(task.fileitem.size || 0) }} {{ stateDict[task.state] }}
</VListItemSubtitle>
<template #append> <template #append>
<IconBtn color="error" size="small" icon="mdi-close" @click="remove_queue_task(task.fileitem)" /> <IconBtn color="error" size="small" icon="mdi-close" @click="remove_queue_task(task.fileitem)" />
</template> </template>