mirror of
https://github.com/VueFileManager/vuefilemanager.git
synced 2026-05-25 14:14:42 +00:00
showing storage size refactoring
This commit is contained in:
@@ -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
@@ -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
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -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),
|
||||||
],
|
],
|
||||||
],
|
],
|
||||||
],
|
],
|
||||||
|
|||||||
@@ -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) {
|
||||||
|
|||||||
Reference in New Issue
Block a user