Refactor #3965 - For FileUpload

This commit is contained in:
Tuğçe Küçükoğlu 2023-05-31 11:53:28 +03:00
parent ec55a35a32
commit 9a49c162c1
4 changed files with 224 additions and 195 deletions

View file

@ -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']" />