mirror of
https://github.com/primefaces/primevue.git
synced 2025-05-09 08:52:34 +00:00
Refactor #3965 - For FileUpload
This commit is contained in:
parent
ec55a35a32
commit
9a49c162c1
4 changed files with 224 additions and 195 deletions
|
@ -1,13 +1,13 @@
|
|||
<template>
|
||||
<div v-for="(file, index) of files" :key="file.name + file.type + file.size" class="p-fileupload-file" v-bind="ptm('file')">
|
||||
<img role="presentation" class="p-fileupload-file-thumbnail" :alt="file.name" :src="file.objectURL" :width="previewWidth" v-bind="ptm('thumbnail')" />
|
||||
<div class="p-fileupload-file-details" v-bind="ptm('details')">
|
||||
<div class="p-fileupload-file-name" v-bind="ptm('fileName')">{{ file.name }}</div>
|
||||
<span class="p-fileupload-file-size" v-bind="ptm('fileSize')">{{ formatSize(file.size) }}</span>
|
||||
<FileUploadBadge :value="badgeValue" class="p-fileupload-file-badge" :severity="badgeSeverity" :pt="ptm('badge')" />
|
||||
<div v-for="(file, index) of files" :key="file.name + file.type + file.size" :class="cx('file')" v-bind="ptm('file')">
|
||||
<img role="presentation" :class="cx('thumbnail')" :alt="file.name" :src="file.objectURL" :width="previewWidth" v-bind="ptm('thumbnail')" />
|
||||
<div :class="cx('details')" v-bind="ptm('details')">
|
||||
<div :class="cx('fileName')" v-bind="ptm('fileName')">{{ file.name }}</div>
|
||||
<span :class="cx('fileSize')" v-bind="ptm('fileSize')">{{ formatSize(file.size) }}</span>
|
||||
<FileUploadBadge :value="badgeValue" :class="cx('badge')" :severity="badgeSeverity" :pt="ptm('badge')" />
|
||||
</div>
|
||||
<div class="p-fileupload-file-actions" v-bind="ptm('actions')">
|
||||
<FileUploadButton @click="$emit('remove', index)" text rounded severity="danger" class="p-fileupload-file-remove" :pt="ptm('removeButton')">
|
||||
<div :class="cx('actions')" v-bind="ptm('actions')">
|
||||
<FileUploadButton @click="$emit('remove', index)" text rounded severity="danger" :class="cx('removeButton')" :pt="ptm('removeButton')">
|
||||
<template #icon="iconProps">
|
||||
<component v-if="templates.fileremoveicon" :is="templates.fileremoveicon" :class="iconProps.class" :file="file" :index="index" />
|
||||
<TimesIcon v-else :class="iconProps.class" aria-hidden="true" v-bind="ptm('removeButton')['icon']" />
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue