mirror of
https://github.com/mofeng-git/One-KVM.git
synced 2026-09-12 18:44:25 +08:00
feat: 虚拟媒体显示镜像上传进度百分比
This commit is contained in:
@@ -71,6 +71,9 @@ const loadingImages = ref(false)
|
||||
const imagesError = ref<string | null>(null)
|
||||
const uploadProgress = ref(0)
|
||||
const uploading = ref(false)
|
||||
const uploadProgressPercent = computed(() =>
|
||||
Math.round(Math.min(100, Math.max(0, uploadProgress.value))),
|
||||
)
|
||||
|
||||
const mountMode = ref<'cdrom' | 'flash'>('flash')
|
||||
// Default to readwrite for flash mode; cdrom forces readonly anyway
|
||||
@@ -821,7 +824,17 @@ onUnmounted(() => {
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
<Progress v-if="uploading" :model-value="uploadProgress" class="h-1 shrink-0" />
|
||||
<div class="min-h-0 flex-1 overflow-y-auto pr-2 custom-scrollbar">
|
||||
<div class="space-y-2">
|
||||
<div
|
||||
v-if="uploading"
|
||||
class="grid shrink-0 grid-cols-[minmax(0,1fr)_auto] items-center gap-2"
|
||||
>
|
||||
<Progress :model-value="uploadProgress" class="h-1 min-w-0" />
|
||||
<span class="justify-self-end text-right text-xs tabular-nums text-muted-foreground">
|
||||
{{ uploadProgressPercent }}%
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<Skeleton v-if="loadingImages" class="h-24 w-full" />
|
||||
<div
|
||||
@@ -841,11 +854,8 @@ onUnmounted(() => {
|
||||
</EmptyHeader>
|
||||
</Empty>
|
||||
|
||||
<div v-else class="flex-1 min-h-0 overflow-y-auto pr-2 custom-scrollbar">
|
||||
<div class="space-y-2">
|
||||
<template v-else v-for="image in images" :key="image.id">
|
||||
<div
|
||||
v-for="image in images"
|
||||
:key="image.id"
|
||||
class="rounded-md border p-2.5 transition-colors"
|
||||
:class="[
|
||||
mountedImage(image.id)
|
||||
@@ -923,6 +933,7 @@ onUnmounted(() => {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user