mirror of
https://github.com/VueFileManager/vuefilemanager.git
synced 2026-04-28 02:50:39 +00:00
v1.5-beta.1
This commit is contained in:
carodej
@@ -43,14 +43,14 @@
|
||||
<ToolbarButton
|
||||
source="move"
|
||||
:class="{'is-inactive': canMoveInView}"
|
||||
action="Move"
|
||||
:action="$t('actions.move')"
|
||||
@click.native="moveItem"
|
||||
/>
|
||||
<ToolbarButton
|
||||
v-if="! $isThisLocation(['public'])"
|
||||
source="share"
|
||||
:class="{'is-inactive': canShareInView}"
|
||||
action="Share"
|
||||
:action="$t('actions.share')"
|
||||
@click.native="shareItem"
|
||||
/>
|
||||
<ToolbarButton
|
||||
|
||||
@@ -14,7 +14,7 @@
|
||||
|
||||
<!--Trash empty message-->
|
||||
<div class="text-content" v-if="$isThisLocation(['participant_uploads']) && ! isLoading">
|
||||
<h1 class="title">You don't have any uploads from other users.</h1>
|
||||
<h1 class="title">{{ $t('messages.nothing_from_participants') }}</h1>
|
||||
</div>
|
||||
|
||||
<!--Base file browser empty message-->
|
||||
|
||||
@@ -42,32 +42,32 @@
|
||||
navigation: [
|
||||
{
|
||||
icon: 'hard-drive',
|
||||
title: 'Files',
|
||||
title: this.$t('menu.files'),
|
||||
routeName: 'Files',
|
||||
},
|
||||
{
|
||||
icon: 'latest',
|
||||
title: 'Recent Uploads',
|
||||
title: this.$t('menu.latest'),
|
||||
routeName: 'Files',
|
||||
},
|
||||
{
|
||||
icon: 'share',
|
||||
title: 'Shared Files',
|
||||
title: this.$t('menu.shared'),
|
||||
routeName: 'SharedFiles',
|
||||
},
|
||||
{
|
||||
icon: 'trash',
|
||||
title: 'Trash',
|
||||
title: this.$t('menu.trash'),
|
||||
routeName: 'Trash',
|
||||
},
|
||||
{
|
||||
icon: 'settings',
|
||||
title: 'Settings',
|
||||
title: this.$t('menu.settings'),
|
||||
routeName: 'MobileSettings',
|
||||
},
|
||||
{
|
||||
icon: 'power',
|
||||
title: 'Log Out',
|
||||
title: this.$t('menu.logout'),
|
||||
routeName: 'LogOut',
|
||||
},
|
||||
]
|
||||
|
||||
@@ -4,6 +4,7 @@
|
||||
<div class="icon">
|
||||
<image-icon v-if="type == 'images'" size="23"></image-icon>
|
||||
<video-icon v-if="type == 'videos'" size="23"></video-icon>
|
||||
<music-icon v-if="type == 'audios'" size="23"></music-icon>
|
||||
<file-text-icon v-if="type == 'documents'" size="23"></file-text-icon>
|
||||
<file-icon v-if="type == 'others'" size="23"></file-icon>
|
||||
<hard-drive-icon v-if="type == 'disk'" size="23"></hard-drive-icon>
|
||||
@@ -19,7 +20,7 @@
|
||||
|
||||
<script>
|
||||
import ProgressBar from '@/components/FilesView/ProgressBar'
|
||||
import { ImageIcon, VideoIcon, FileTextIcon, FileIcon, HardDriveIcon } from 'vue-feather-icons'
|
||||
import { ImageIcon, VideoIcon, FileTextIcon, FileIcon, HardDriveIcon, MusicIcon } from 'vue-feather-icons'
|
||||
|
||||
export default {
|
||||
name: 'StorageItemDetail',
|
||||
@@ -28,6 +29,7 @@
|
||||
HardDriveIcon,
|
||||
FileTextIcon,
|
||||
ProgressBar,
|
||||
MusicIcon,
|
||||
VideoIcon,
|
||||
ImageIcon,
|
||||
FileIcon,
|
||||
@@ -93,6 +95,23 @@
|
||||
}
|
||||
}
|
||||
|
||||
&.audios {
|
||||
|
||||
.icon {
|
||||
|
||||
path, line, polyline, rect, circle, polygon {
|
||||
stroke: $pink;
|
||||
}
|
||||
}
|
||||
|
||||
.storage-progress {
|
||||
|
||||
/deep/ span {
|
||||
background: $pink;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.documents {
|
||||
|
||||
.icon {
|
||||
|
||||
@@ -1,89 +0,0 @@
|
||||
<template>
|
||||
<div class="storage-size" v-if="app">
|
||||
<div class="storage-info">
|
||||
<span class="title">{{ $t('storage.title') }}</span>
|
||||
<span class="size">{{ $t('storage.used', {used: app.storage.used, capacity: app.storage.capacity}) }}</span>
|
||||
</div>
|
||||
<ProgressBar :progress="app.storage.percentage" :class="{'is-exceeded': app.storage.percentage > 100}"/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import ProgressBar from '@/components/FilesView/ProgressBar'
|
||||
import { mapGetters } from 'vuex'
|
||||
|
||||
export default {
|
||||
name: 'StorageSize',
|
||||
components: {
|
||||
ProgressBar,
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['app']),
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
@import '@assets/vue-file-manager/_variables';
|
||||
@import '@assets/vue-file-manager/_mixins';
|
||||
|
||||
.storage-size {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
margin: 15px;
|
||||
border-radius: 8px;
|
||||
|
||||
.storage-info {
|
||||
display: flex;
|
||||
flex-wrap: nowrap;
|
||||
align-items: center;
|
||||
|
||||
span {
|
||||
width: 100%;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.title {
|
||||
@include font-size(14);
|
||||
font-weight: 700;
|
||||
color: $text;
|
||||
}
|
||||
|
||||
.size {
|
||||
@include font-size(12);
|
||||
text-align: right;
|
||||
color: $text-muted;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.progress-bar {
|
||||
|
||||
&.is-exceeded /deep/ span {
|
||||
background: $danger;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 690px) {
|
||||
|
||||
.storage-size {
|
||||
position: relative;
|
||||
margin-bottom: 0;
|
||||
|
||||
.size {
|
||||
@include font-size(10);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
.storage-size {
|
||||
|
||||
.storage-info .title {
|
||||
color: $dark_mode_text_primary;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user