panel navigator refactoring

This commit is contained in:
Peter Papp
2021-08-20 18:07:26 +02:00
parent b23259309c
commit a99cbc2841
5 changed files with 42 additions and 48 deletions

View File

@@ -8,7 +8,7 @@
"/chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/~3e4fdd8b.js": "/chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/~3e4fdd8b.js?id=d36b3eb20b4899f2d899",
"/chunks/admin~chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser.js": "/chunks/admin~chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser.js?id=c4764a39a8045b039a47",
"/chunks/admin~chunks/files~chunks/settings~chunks/shared/file-browser.js": "/chunks/admin~chunks/files~chunks/settings~chunks/shared/file-browser.js?id=6632ba96ef28b8ec0c98",
"/chunks/admin~chunks/platform.js": "/chunks/admin~chunks/platform.js?id=383e66eea761fbf3ae9c",
"/chunks/admin~chunks/platform.js": "/chunks/admin~chunks/platform.js?id=2399d0628b27e1d915c2",
"/chunks/admin~chunks/platform~chunks/settings~chunks/shared.js": "/chunks/admin~chunks/platform~chunks/settings~chunks/shared.js?id=a80b8af62fd725c60bdb",
"/chunks/admin~chunks/platform~chunks/shared.js": "/chunks/admin~chunks/platform~chunks/shared.js?id=673ff118200894d37cd5",
"/chunks/app-appearance.js": "/chunks/app-appearance.js?id=5f8d3e698c1fd5b9b5a5",
@@ -56,7 +56,7 @@
"/chunks/plan-settings.js": "/chunks/plan-settings.js?id=17469545c5b6a16c3bbf",
"/chunks/plan-subscribers.js": "/chunks/plan-subscribers.js?id=0dd0a5efe0e3cb511c48",
"/chunks/plans.js": "/chunks/plans.js?id=5a3c28288952fcad96e5",
"/chunks/platform.js": "/chunks/platform.js?id=aac851b167c665d19d7e",
"/chunks/platform.js": "/chunks/platform.js?id=516203dc89a47f1d1d17",
"/chunks/platform~chunks/shared.js": "/chunks/platform~chunks/shared.js?id=3434322e91f37e1887a6",
"/chunks/profile.js": "/chunks/profile.js?id=658aa03af778cc2cc100",
"/chunks/profile~chunks/settings-password.js": "/chunks/profile~chunks/settings-password.js?id=ddb7be518c092ed392ca",
@@ -113,7 +113,7 @@
"/chunks/app-language~chunks/dashboard~chunks/invoices~chunks/pages~chunks/plans~chunks/platform~chunk~4546fed3.js": "/chunks/app-language~chunks/dashboard~chunks/invoices~chunks/pages~chunks/plans~chunks/platform~chunk~4546fed3.js?id=dcb0f3eb29f9bb036a83",
"/chunks/app-language~chunks/dashboard~chunks/invoices~chunks/pages~chunks/plans~chunks/settings~chunk~4e1df859.js": "/chunks/app-language~chunks/dashboard~chunks/invoices~chunks/pages~chunks/plans~chunks/settings~chunk~4e1df859.js?id=ce01da2eb15ee1ebede4",
"/chunks/files.61f541e551bb6ae551ff.hot-update.js": "/chunks/files.61f541e551bb6ae551ff.hot-update.js",
"/chunks/platform~chunks/shared/file-browser.js": "/chunks/platform~chunks/shared/file-browser.js?id=a86bdb2b38d254a62eab",
"/chunks/platform~chunks/shared/file-browser.js": "/chunks/platform~chunks/shared/file-browser.js?id=40ad3638485c345cced0",
"/chunks/platform~chunks/shared~chunks/shared/file-browser.js": "/chunks/platform~chunks/shared~chunks/shared/file-browser.js?id=6ba92eab6a45cbab3af5",
"/chunks/platform~chunks/shared~chunks/shared/file-browser~chunks/shared/single-file.js": "/chunks/platform~chunks/shared~chunks/shared/file-browser~chunks/shared/single-file.js?id=c9e60ce6e02af680eeaa",
"/chunks/settings-subscription~chunks/shared/file-browser~chunks/user-subscription.js": "/chunks/settings-subscription~chunks/shared/file-browser~chunks/user-subscription.js?id=439e216b216fc2572483",
@@ -542,5 +542,21 @@
"/chunks/admin~chunks/platform.a66331813c64be592be5.hot-update.js": "/chunks/admin~chunks/platform.a66331813c64be592be5.hot-update.js",
"/chunks/files~chunks/my-shared-items~chunks/recent-uploads~chunks/shared/file-browser~chunks/trash.a66331813c64be592be5.hot-update.js": "/chunks/files~chunks/my-shared-items~chunks/recent-uploads~chunks/shared/file-browser~chunks/trash.a66331813c64be592be5.hot-update.js",
"/chunks/platform.a66331813c64be592be5.hot-update.js": "/chunks/platform.a66331813c64be592be5.hot-update.js",
"/chunks/platform~chunks/shared/file-browser.a66331813c64be592be5.hot-update.js": "/chunks/platform~chunks/shared/file-browser.a66331813c64be592be5.hot-update.js"
"/chunks/platform~chunks/shared/file-browser.a66331813c64be592be5.hot-update.js": "/chunks/platform~chunks/shared/file-browser.a66331813c64be592be5.hot-update.js",
"/chunks/admin~chunks/platform.d3ef9a4ba93368ae47ec.hot-update.js": "/chunks/admin~chunks/platform.d3ef9a4ba93368ae47ec.hot-update.js",
"/chunks/platform.747540e0ebed25c92035.hot-update.js": "/chunks/platform.747540e0ebed25c92035.hot-update.js",
"/chunks/platform.2a44d048336870abab76.hot-update.js": "/chunks/platform.2a44d048336870abab76.hot-update.js",
"/chunks/platform.f6ebaf3075a18c94cdf0.hot-update.js": "/chunks/platform.f6ebaf3075a18c94cdf0.hot-update.js",
"/chunks/platform.f1677dd6d745e3222083.hot-update.js": "/chunks/platform.f1677dd6d745e3222083.hot-update.js",
"/chunks/platform~chunks/shared/file-browser.2b867f008d088939c0a0.hot-update.js": "/chunks/platform~chunks/shared/file-browser.2b867f008d088939c0a0.hot-update.js",
"/chunks/platform~chunks/shared/file-browser.141c02232946f004cd74.hot-update.js": "/chunks/platform~chunks/shared/file-browser.141c02232946f004cd74.hot-update.js",
"/chunks/platform~chunks/shared/file-browser.95c15c560bc58ec33ad0.hot-update.js": "/chunks/platform~chunks/shared/file-browser.95c15c560bc58ec33ad0.hot-update.js",
"/chunks/platform~chunks/shared/file-browser.f2390439cb4bd900ebf9.hot-update.js": "/chunks/platform~chunks/shared/file-browser.f2390439cb4bd900ebf9.hot-update.js",
"/chunks/platform~chunks/shared/file-browser.3815a7c9cf5288450475.hot-update.js": "/chunks/platform~chunks/shared/file-browser.3815a7c9cf5288450475.hot-update.js",
"/chunks/platform~chunks/shared/file-browser.af651aa96fe288b66cfe.hot-update.js": "/chunks/platform~chunks/shared/file-browser.af651aa96fe288b66cfe.hot-update.js",
"/chunks/platform~chunks/shared/file-browser.f821c2bdb9891a05e574.hot-update.js": "/chunks/platform~chunks/shared/file-browser.f821c2bdb9891a05e574.hot-update.js",
"/chunks/platform~chunks/shared/file-browser.d61eaf1096b58a661b80.hot-update.js": "/chunks/platform~chunks/shared/file-browser.d61eaf1096b58a661b80.hot-update.js",
"/chunks/platform~chunks/shared/file-browser.2250f2e6c77d124dfbba.hot-update.js": "/chunks/platform~chunks/shared/file-browser.2250f2e6c77d124dfbba.hot-update.js",
"/chunks/platform~chunks/shared/file-browser.a512553f25e9cd9088f4.hot-update.js": "/chunks/platform~chunks/shared/file-browser.a512553f25e9cd9088f4.hot-update.js",
"/chunks/platform~chunks/shared/file-browser.8a3660e247a02eaa1d71.hot-update.js": "/chunks/platform~chunks/shared/file-browser.8a3660e247a02eaa1d71.hot-update.js"
}

View File

@@ -1,17 +1,17 @@
<template>
<transition name="folder">
<div class="folder-item-wrapper">
<div
@click="goToFolder"
class="folder-item text-theme dark-text-theme"
:class="{'is-selected': isSelected , 'is-dragenter': area, 'is-inactive': disabledFolder || disabled && draggedItem.length > 0 }"
:style="indent" @click="getFolder"
:class="{'is-selected': isSelected, 'is-dragenter': area, 'is-inactive': disabledFolder || disabled && draggedItem.length > 0 }"
:style="indent"
@dragover.prevent="dragEnter"
@dragleave="dragLeave"
@drop="dragFinish()"
>
<chevron-right-icon
@click.stop="showTree"
@click.stop.prevent="showTree"
size="17"
class="icon-arrow"
:class="{'is-opened': isVisible, 'is-visible': nodes.folders.length !== 0}"
@@ -19,7 +19,6 @@
<folder-icon size="17" class="icon text-theme dark-text-theme" />
<span class="label">{{ nodes.name }}</span>
</div>
<TreeMenuNavigator :disabled="disableChildren" :depth="depth + 1" v-if="isVisible" :nodes="item" v-for="item in nodes.folders" :key="item.id" />
</div>
</transition>
@@ -34,7 +33,9 @@
export default {
name: 'TreeMenuNavigator',
props: [
'nodes', 'depth', 'disabled',
'disabled',
'nodes',
'depth',
],
components: {
TreeMenuNavigator,
@@ -42,8 +43,9 @@
FolderIcon,
},
computed: {
...mapGetters(['clipboard']),
...mapGetters([
'clipboard'
]),
disabledFolder() {
let disableFolder = false
if (this.draggedItem.length > 0) {
@@ -72,21 +74,24 @@
let offset = window.innerWidth <= 1024 ? 17 : 22;
let value = this.depth == 0 ? offset : offset + (this.depth * 20);
let value = this.depth === 0 ? offset : offset + (this.depth * 20);
return {paddingLeft: value + 'px'}
},
},
data() {
return {
isVisible: false,
isSelected: false,
area: false,
draggedItem: [],
disableChildren: false,
isSelected: false,
isVisible: false,
draggedItem: [],
area: false,
}
},
methods: {
goToFolder() {
this.$router.push({name: 'Files', params: {id: this.nodes.id}})
},
dragFinish() {
// Move no selected item
if (!this.clipboard.includes(this.draggedItem[0])) {
@@ -109,16 +114,6 @@
dragLeave() {
this.area = false
},
getFolder() {
events.$emit('show-folder', this.nodes)
// Go to folder
if (this.$isThisLocation('public')) {
this.$store.dispatch('browseShared', [{folder: this.nodes, back: false, init: false}])
} else {
this.$store.dispatch('getFolder', [{folder: this.nodes, back: false, init: false}])
}
},
showTree() {
this.isVisible = !this.isVisible
}
@@ -140,14 +135,6 @@
this.draggedItem = this.clipboard
}
})
// Select clicked folder
events.$on('show-folder', node => {
this.isSelected = false
if (this.nodes.id == node.id)
this.isSelected = true
})
}
}
</script>

View File

@@ -74,8 +74,8 @@
},
computed: {
...mapGetters([
'isDarkMode',
'user',
'isDarkMode'
]),
isUserProfileRoute() {
return this.$isThisRoute(this.$route, ['Profile', 'Password', 'Storage', 'Invoice', 'Subscription', 'PaymentMethods'])

View File

@@ -1,5 +1,5 @@
<template>
<div>
<div v-if="user">
<!--Empty storage warning-->
<ContentGroup v-if="config.storageLimit && storage.used > 95">
<UpgradeSidebarBanner/>

View File

@@ -1,9 +1,8 @@
<template>
<div id="application-wrapper">
<!--File preview window-->
<!--On Top of App Components-->
<FilePreview />
<Spotlight />
<!--Popups-->
@@ -38,7 +37,7 @@
<!--Sidebar-->
<ContentSidebar>
<NavigationPanel v-if="user" />
<NavigationPanel />
</ContentSidebar>
<div @contextmenu.prevent.capture="contextMenu($event, undefined)" id="files-view">
@@ -98,14 +97,6 @@
Spotlight,
DragUI,
},
computed: {
...mapGetters([
'currentFolder',
'clipboard',
'config',
'user',
]),
},
data() {
return {
isScaledDown: false