From 430958237d17f451cf3d194aa9017f1afc28d884 Mon Sep 17 00:00:00 2001 From: Diego Franchina Date: Tue, 5 Sep 2023 04:01:27 +0200 Subject: [PATCH] FileUpload: Added fileSizeTypes (#4377) * added fileSizeTypes * Added filesizeTypes fileupload, refactor and docs * Added format --- components/lib/config/PrimeVue.d.ts | 1 + components/lib/config/PrimeVue.js | 1 + components/lib/fileupload/FileContent.vue | 14 ++++--- components/lib/fileupload/FileUpload.vue | 14 ++++--- doc/common/apidoc/index.json | 7 ++++ doc/configuration/locale/LocaleApiDoc.vue | 4 ++ doc/fileupload/TemplateDoc.vue | 45 ++++++++++++++--------- 7 files changed, 57 insertions(+), 29 deletions(-) diff --git a/components/lib/config/PrimeVue.d.ts b/components/lib/config/PrimeVue.d.ts index 00645b426..a74e6a984 100644 --- a/components/lib/config/PrimeVue.d.ts +++ b/components/lib/config/PrimeVue.d.ts @@ -300,6 +300,7 @@ export interface PrimeVueLocaleOptions { cancel?: string; completed?: string; pending?: string; + fileSizeTypes: string[]; dayNames: string[]; dayNamesShort: string[]; dayNamesMin: string[]; diff --git a/components/lib/config/PrimeVue.js b/components/lib/config/PrimeVue.js index 5f0b1c155..48cba0695 100644 --- a/components/lib/config/PrimeVue.js +++ b/components/lib/config/PrimeVue.js @@ -33,6 +33,7 @@ export const defaultOptions = { cancel: 'Cancel', completed: 'Completed', pending: 'Pending', + fileSizeTypes: ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'], dayNames: ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'], dayNamesShort: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'], dayNamesMin: ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa'], diff --git a/components/lib/fileupload/FileContent.vue b/components/lib/fileupload/FileContent.vue index 1b9f72de1..a6df717de 100644 --- a/components/lib/fileupload/FileContent.vue +++ b/components/lib/fileupload/FileContent.vue @@ -52,16 +52,18 @@ export default { }, methods: { formatSize(bytes) { + const k = 1024; + const dm = 3; + const sizes = this.$primevue.config.locale.fileSizeTypes; + if (bytes === 0) { - return '0 B'; + return `0 ${sizes[0]}`; } - let k = 1000, - dm = 3, - sizes = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'], - i = Math.floor(Math.log(bytes) / Math.log(k)); + const i = Math.floor(Math.log(bytes) / Math.log(k)); + const formattedSize = parseFloat((bytes / Math.pow(k, i)).toFixed(dm)); - return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + ' ' + sizes[i]; + return `${formattedSize} ${sizes[i]}`; } }, components: { diff --git a/components/lib/fileupload/FileUpload.vue b/components/lib/fileupload/FileUpload.vue index 4da6dadbb..25f232aa9 100755 --- a/components/lib/fileupload/FileUpload.vue +++ b/components/lib/fileupload/FileUpload.vue @@ -326,16 +326,18 @@ export default { } }, formatSize(bytes) { + const k = 1024; + const dm = 3; + const sizes = this.$primevue.config.locale.fileSizeTypes; + if (bytes === 0) { - return '0 B'; + return `0 ${sizes[0]}`; } - let k = 1000, - dm = 3, - sizes = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'], - i = Math.floor(Math.log(bytes) / Math.log(k)); + const i = Math.floor(Math.log(bytes) / Math.log(k)); + const formattedSize = parseFloat((bytes / Math.pow(k, i)).toFixed(dm)); - return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + ' ' + sizes[i]; + return `${formattedSize} ${sizes[i]}`; }, isFileLimitExceeded() { if (this.fileLimit && this.fileLimit <= this.files.length + this.uploadedFileCount && this.focused) { diff --git a/doc/common/apidoc/index.json b/doc/common/apidoc/index.json index b5509e80e..2bc2a8042 100644 --- a/doc/common/apidoc/index.json +++ b/doc/common/apidoc/index.json @@ -13342,6 +13342,13 @@ "type": "string", "default": "" }, + { + "name": "fileSizeTypes", + "optional": true, + "readonly": false, + "type": "string[]", + "default": "" + }, { "name": "dayNames", "optional": false, diff --git a/doc/configuration/locale/LocaleApiDoc.vue b/doc/configuration/locale/LocaleApiDoc.vue index b870684a9..d18ecec75 100644 --- a/doc/configuration/locale/LocaleApiDoc.vue +++ b/doc/configuration/locale/LocaleApiDoc.vue @@ -124,6 +124,10 @@ pending Pending + + fileSizeTypes + ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'] + dayNames ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday' diff --git a/doc/fileupload/TemplateDoc.vue b/doc/fileupload/TemplateDoc.vue index d93837699..3637a38e6 100644 --- a/doc/fileupload/TemplateDoc.vue +++ b/doc/fileupload/TemplateDoc.vue @@ -208,16 +208,18 @@ export default { this.$toast.add({ severity: 'info', summary: 'Success', detail: 'File Uploaded', life: 3000 }); }, formatSize(bytes) { + const k = 1024; + const dm = 3; + const sizes = this.$primevue.config.locale.fileSizeTypes; + if (bytes === 0) { - return '0 B'; + return \`0 \${sizes[0]}\`; } - let k = 1000, - dm = 3, - sizes = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'], - i = Math.floor(Math.log(bytes) / Math.log(k)); + const i = Math.floor(Math.log(bytes) / Math.log(k)); + const formattedSize = parseFloat((bytes / Math.pow(k, i)).toFixed(dm)); - return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + ' ' + sizes[i]; + return \`\${formattedSize} \${sizes[i]}\`; } } }; @@ -315,13 +317,20 @@ const onTemplatedUpload = () => { toast.add({ severity: "info", summary: "Success", detail: "File Uploaded", life: 3000 }); }; -const formatSize = (bytes) => { - if (bytes === 0) return "0 B"; +formatSize(bytes) { const k = 1024; - const sizes = ["B", "KB", "MB", "GB", "TB", "PB", "EB", "ZB", "YB"]; + const dm = 3; + const sizes = this.$primevue.config.locale.fileSizeTypes; + + if (bytes === 0) { + return \`0 \${sizes[0]}\`; + } + const i = Math.floor(Math.log(bytes) / Math.log(k)); - return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + " " + sizes[i]; -}; + const formattedSize = parseFloat((bytes / Math.pow(k, i)).toFixed(dm)); + + return \`\${formattedSize} \${sizes[i]}\`; +}, <\/script>` } }; @@ -351,16 +360,18 @@ const formatSize = (bytes) => { this.$toast.add({ severity: 'info', summary: 'Success', detail: 'File Uploaded', life: 3000 }); }, formatSize(bytes) { + const k = 1024; + const dm = 3; + const sizes = this.$primevue.config.locale.fileSizeTypes; + if (bytes === 0) { - return '0 B'; + return `0 ${sizes[0]}`; } - let k = 1000, - dm = 3, - sizes = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'], - i = Math.floor(Math.log(bytes) / Math.log(k)); + const i = Math.floor(Math.log(bytes) / Math.log(k)); + const formattedSize = parseFloat((bytes / Math.pow(k, i)).toFixed(dm)); - return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + ' ' + sizes[i]; + return `${formattedSize} ${sizes[i]}`; } } };