showing storage size refactoring

This commit is contained in:
Čarodej
2021-12-17 11:23:02 +01:00
parent afb8323541
commit 401b511b40
5 changed files with 53 additions and 22 deletions
+21 -2
View File
@@ -72,7 +72,7 @@
"/chunks/settings-invoices.js": "/chunks/settings-invoices.js?id=56f3c814aefb783ceb2a", "/chunks/settings-invoices.js": "/chunks/settings-invoices.js?id=56f3c814aefb783ceb2a",
"/chunks/settings-password.js": "/chunks/settings-password.js?id=fc95bc9d31d3e9ee0442", "/chunks/settings-password.js": "/chunks/settings-password.js?id=fc95bc9d31d3e9ee0442",
"/chunks/settings-payment-methods.js": "/chunks/settings-payment-methods.js?id=093cc2fd918ee6a340d3", "/chunks/settings-payment-methods.js": "/chunks/settings-payment-methods.js?id=093cc2fd918ee6a340d3",
"/chunks/settings-storage.js": "/chunks/settings-storage.js?id=75172fe522988795ec59", "/chunks/settings-storage.js": "/chunks/settings-storage.js?id=8ec1afafac5dcd26ae25",
"/chunks/settings-storage~chunks/settings-subscription~chunks/user-storage~chunks/user-subscription.js": "/chunks/settings-storage~chunks/settings-subscription~chunks/user-storage~chunks/user-subscription.js?id=147afaac8c8bacfe6433", "/chunks/settings-storage~chunks/settings-subscription~chunks/user-storage~chunks/user-subscription.js": "/chunks/settings-storage~chunks/settings-subscription~chunks/user-storage~chunks/user-subscription.js?id=147afaac8c8bacfe6433",
"/chunks/settings-subscription.js": "/chunks/settings-subscription.js?id=fd11a9ee3772ed65553a", "/chunks/settings-subscription.js": "/chunks/settings-subscription.js?id=fd11a9ee3772ed65553a",
"/chunks/settings~chunks/settings-password.js": "/chunks/settings~chunks/settings-password.js?id=c33cd2341b9b04a732e5", "/chunks/settings~chunks/settings-password.js": "/chunks/settings~chunks/settings-password.js?id=c33cd2341b9b04a732e5",
@@ -1356,5 +1356,24 @@
"/chunks/settings-subscription.e93de9577924975edf28.hot-update.js": "/chunks/settings-subscription.e93de9577924975edf28.hot-update.js", "/chunks/settings-subscription.e93de9577924975edf28.hot-update.js": "/chunks/settings-subscription.e93de9577924975edf28.hot-update.js",
"/chunks/settings-subscription.c70268db92d00d51c9f9.hot-update.js": "/chunks/settings-subscription.c70268db92d00d51c9f9.hot-update.js", "/chunks/settings-subscription.c70268db92d00d51c9f9.hot-update.js": "/chunks/settings-subscription.c70268db92d00d51c9f9.hot-update.js",
"/chunks/settings-subscription.0b734f00ac49be587eb8.hot-update.js": "/chunks/settings-subscription.0b734f00ac49be587eb8.hot-update.js", "/chunks/settings-subscription.0b734f00ac49be587eb8.hot-update.js": "/chunks/settings-subscription.0b734f00ac49be587eb8.hot-update.js",
"/chunks/admin~chunks/platform~chunks/settings.5ad45c25769df1bf44e6.hot-update.js": "/chunks/admin~chunks/platform~chunks/settings.5ad45c25769df1bf44e6.hot-update.js" "/chunks/admin~chunks/platform~chunks/settings.5ad45c25769df1bf44e6.hot-update.js": "/chunks/admin~chunks/platform~chunks/settings.5ad45c25769df1bf44e6.hot-update.js",
"/js/main.a84a21cd472a1ffc3894.hot-update.js": "/js/main.a84a21cd472a1ffc3894.hot-update.js",
"/js/main.9184da5a470afad8207a.hot-update.js": "/js/main.9184da5a470afad8207a.hot-update.js",
"/js/main.520f0b6f1ce3e55e7e13.hot-update.js": "/js/main.520f0b6f1ce3e55e7e13.hot-update.js",
"/js/main.e840f067985c47232dc0.hot-update.js": "/js/main.e840f067985c47232dc0.hot-update.js",
"/js/main.846d7de3a448c7346517.hot-update.js": "/js/main.846d7de3a448c7346517.hot-update.js",
"/chunks/settings-storage.251165d73c026149e29b.hot-update.js": "/chunks/settings-storage.251165d73c026149e29b.hot-update.js",
"/chunks/settings-storage.3bbec61a0b87d74094db.hot-update.js": "/chunks/settings-storage.3bbec61a0b87d74094db.hot-update.js",
"/chunks/settings-storage.88bbeadc3b97806177e8.hot-update.js": "/chunks/settings-storage.88bbeadc3b97806177e8.hot-update.js",
"/chunks/settings-storage.b1d3f41c54953cfa472d.hot-update.js": "/chunks/settings-storage.b1d3f41c54953cfa472d.hot-update.js",
"/chunks/settings-storage.dbbbdbebae11dfc940ff.hot-update.js": "/chunks/settings-storage.dbbbdbebae11dfc940ff.hot-update.js",
"/chunks/settings-storage.61465f8a9875269afd9e.hot-update.js": "/chunks/settings-storage.61465f8a9875269afd9e.hot-update.js",
"/chunks/settings-storage.c371e94dd44433dc24d1.hot-update.js": "/chunks/settings-storage.c371e94dd44433dc24d1.hot-update.js",
"/chunks/settings-storage.c1d253b9b7985e3550e3.hot-update.js": "/chunks/settings-storage.c1d253b9b7985e3550e3.hot-update.js",
"/chunks/settings-storage.f7dae0c95badc80daa0b.hot-update.js": "/chunks/settings-storage.f7dae0c95badc80daa0b.hot-update.js",
"/chunks/settings-storage.bc1b2fccfa4242482786.hot-update.js": "/chunks/settings-storage.bc1b2fccfa4242482786.hot-update.js",
"/chunks/settings-storage.f78ab29ec8bacaed3c0a.hot-update.js": "/chunks/settings-storage.f78ab29ec8bacaed3c0a.hot-update.js",
"/chunks/settings-storage.c5fabdda9cade020ac61.hot-update.js": "/chunks/settings-storage.c5fabdda9cade020ac61.hot-update.js",
"/chunks/settings.323fbff57023ed24f786.hot-update.js": "/chunks/settings.323fbff57023ed24f786.hot-update.js",
"/chunks/settings.c6e6d822bb90887a109e.hot-update.js": "/chunks/settings.c6e6d822bb90887a109e.hot-update.js"
} }
+8 -6
View File
@@ -124,12 +124,14 @@ const FunctionHelpers = {
distribution = orderBy(distribution, ['progress'], ['desc']) distribution = orderBy(distribution, ['progress'], ['desc'])
// Push at the end empty space data // Push at the end empty space data
distribution.push({ if (config.subscriptionType !== 'metered') {
progress: 100 - storage.data.attributes.percentage, distribution.push({
color: 'secondary', progress: 100 - storage.data.attributes.percentage,
value: storage.data.meta.others.used, color: 'secondary',
title: 'Empty' value: storage.data.meta.others.used,
}) title: 'Empty'
})
}
return distribution return distribution
} }
+9 -3
View File
@@ -5,15 +5,15 @@
{{ $t('Storage Usage') }} {{ $t('Storage Usage') }}
</FormLabel> </FormLabel>
<b class="text-3xl font-extrabold -mt-3 block mb-0.5"> <b class="text-3xl font-extrabold -mt-3 block">
{{ storage.data.attributes.used }} {{ storage.data.attributes.used }}
</b> </b>
<b class="mb-3 block text-sm text-gray-400 mb-5"> <b v-if="config.subscriptionType !== 'metered'" class="mt-0.5 block text-sm text-gray-400">
{{ $t('Total of') }} {{ storage.data.attributes.capacity }} {{ $t('Used') }} {{ $t('Total of') }} {{ storage.data.attributes.capacity }} {{ $t('Used') }}
</b> </b>
<ProgressLine :data="distribution" /> <ProgressLine :data="distribution" class="mt-5" />
</div> </div>
<div v-if="distribution" class="card shadow-card"> <div v-if="distribution" class="card shadow-card">
<FormLabel icon="hard-drive"> <FormLabel icon="hard-drive">
@@ -54,6 +54,7 @@
import PageTab from '/resources/js/components/Others/Layout/PageTab' import PageTab from '/resources/js/components/Others/Layout/PageTab'
import axios from 'axios' import axios from 'axios'
import BarChart from "../../components/UI/BarChart"; import BarChart from "../../components/UI/BarChart";
import {mapGetters} from "vuex";
export default { export default {
name: 'Storage', name: 'Storage',
@@ -64,6 +65,11 @@
PageTab, PageTab,
}, },
computed: {
...mapGetters([
'config'
])
},
data() { data() {
return { return {
isLoading: true, isLoading: true,
@@ -16,17 +16,21 @@ class UserStorageResource extends JsonResource
public function toArray($request) public function toArray($request)
{ {
list($images, $audios, $videos, $documents, $others) = $this->get_file_type_distribution(); list($images, $audios, $videos, $documents, $others) = $this->get_file_type_distribution();
list($downloadTotal, $uploadTotal, $upload, $download) = $this->get_traffic_distribution(); list($downloadTotal, $uploadTotal, $upload, $download) = $this->get_traffic_distribution();
$totalCapacity = match (get_settings('subscription_type')) {
'metered' => $this->usedCapacity / 1000000000,
'fixed' => $this->limitations->max_storage_amount,
};
return [ return [
'data' => [ 'data' => [
'id' => (string) $this->id, 'id' => (string) $this->id,
'type' => 'storage', 'type' => 'storage',
'attributes' => [ 'attributes' => [
'used' => Metric::bytes($this->usedCapacity)->format(), 'used' => Metric::bytes($this->usedCapacity)->format(),
'capacity' => format_gigabytes($this->limitations->max_storage_amount), 'capacity' => format_gigabytes($totalCapacity),
'percentage' => (float) get_storage_fill_percentage($this->usedCapacity, $this->limitations->max_storage_amount), 'percentage' => (float) get_storage_fill_percentage($this->usedCapacity, $totalCapacity),
], ],
'meta' => [ 'meta' => [
'traffic' => [ 'traffic' => [
@@ -39,23 +43,23 @@ class UserStorageResource extends JsonResource
], ],
'images' => [ 'images' => [
'used' => Metric::bytes($images)->format(), 'used' => Metric::bytes($images)->format(),
'percentage' => (float) get_storage_fill_percentage($images, $this->limitations->max_storage_amount), 'percentage' => (float) get_storage_fill_percentage($images, $totalCapacity),
], ],
'audios' => [ 'audios' => [
'used' => Metric::bytes($audios)->format(), 'used' => Metric::bytes($audios)->format(),
'percentage' => (float) get_storage_fill_percentage($audios, $this->limitations->max_storage_amount), 'percentage' => (float) get_storage_fill_percentage($audios, $totalCapacity),
], ],
'videos' => [ 'videos' => [
'used' => Metric::bytes($videos)->format(), 'used' => Metric::bytes($videos)->format(),
'percentage' => (float) get_storage_fill_percentage($videos, $this->limitations->max_storage_amount), 'percentage' => (float) get_storage_fill_percentage($videos, $totalCapacity),
], ],
'documents' => [ 'documents' => [
'used' => Metric::bytes($documents)->format(), 'used' => Metric::bytes($documents)->format(),
'percentage' => (float) get_storage_fill_percentage($documents, $this->limitations->max_storage_amount), 'percentage' => (float) get_storage_fill_percentage($documents, $totalCapacity),
], ],
'others' => [ 'others' => [
'used' => Metric::bytes($others)->format(), 'used' => Metric::bytes($others)->format(),
'percentage' => (float) get_storage_fill_percentage($others, $this->limitations->max_storage_amount), 'percentage' => (float) get_storage_fill_percentage($others, $totalCapacity),
], ],
], ],
], ],
+3 -3
View File
@@ -461,13 +461,13 @@ if (! function_exists('get_storage_fill_percentage')) {
* Get storage usage in percent * Get storage usage in percent
* *
* @param $used * @param $used
* @param $capacity * @param $from
* @return string * @return string
*/ */
function get_storage_fill_percentage($used, $capacity) function get_storage_fill_percentage($used, $from)
{ {
// Format gigabytes to bytes // Format gigabytes to bytes
$total = intval(Metric::gigabytes($capacity)->numberOfBytes()); $total = intval(Metric::gigabytes($from)->numberOfBytes());
// Count progress // Count progress
if ($total == 0) { if ($total == 0) {