optimized browsing

This commit is contained in:
Čarodej
2021-10-26 10:14:33 +02:00
parent 15e154176d
commit e3ddf27023
6 changed files with 109 additions and 23 deletions

View File

@@ -1,7 +1,7 @@
<template>
<div
v-if="isFullPreview"
class="file-preview"
class="file-preview z-20"
ref="filePreview"
tabindex="-1"
@keydown.esc="closeFilePreview"
@@ -60,7 +60,6 @@
width: 100%;
height: 100%;
position: absolute;
z-index: 7;
background-color: white;
}

View File

@@ -1,5 +1,5 @@
<template>
<div class="file-wrapper" @mouseup.stop="clickedItem" @dblclick="goToItem" spellcheck="false">
<div class="file-wrapper" @mouseup.stop="clickFilter" spellcheck="false">
<div
:draggable="canDrag"
@dragstart="$emit('dragstart')"
@@ -17,7 +17,7 @@
<div class="icon-item">
<MemberAvatar
v-if="canShowAuthor"
v-if="user && canShowAuthor"
:size="28"
:is-border="true"
:member="item.data.relationships.user"
@@ -156,11 +156,33 @@ export default {
return {
area: false,
itemName: undefined,
mobileMultiSelect: false
mobileMultiSelect: false,
delay: 220,
clicks: 0,
timer: null
}
},
methods: {
drop() {
clickFilter(e) {
this.clicks++
if (this.clicks === 1) {
let self = this
this.timer = setTimeout(() => {
this.clickedItem(e)
self.clicks = 0
}, this.delay);
} else {
clearTimeout(this.timer);
this.goToItem(e)
this.clicks = 0;
}
},
drop() {
this.area = false
events.$emit('drop')
},
@@ -261,9 +283,6 @@ export default {
} else if (this.isFolder) {
// Clear selected items after open another folder
this.$store.commit('CLIPBOARD_CLEAR')
this.$goToFileView(this.item.data.id)
}
},

View File

@@ -16,7 +16,7 @@
name: 'FilePreview',
computed: {
...mapGetters([
'clipboard'
'clipboard',
]),
singleFile() {
return this.clipboard[0]
@@ -26,8 +26,8 @@
'folder', 'file'
], this.singleFile.data.type)
}
},
}
}
}
</script>
<style scoped lang="scss">

View File

@@ -123,7 +123,6 @@ const actions = {
const mutations = {
LOADING_STATE(state, payload) {
state.clipboard = []
state.entries = payload.data
state.isLoading = payload.loading
},

View File

@@ -8,7 +8,7 @@
<!--Locations-->
<ContentGroup :title="$t('sidebar.locations_title')">
<div class="menu-list-wrapper vertical">
<router-link :to="{name: 'Files'}" class="menu-list-item link">
<router-link @click.native="resetData" :to="{name: 'Files'}" class="menu-list-item link">
<div class="icon text-theme">
<home-icon size="17" />
</div>
@@ -16,7 +16,7 @@
{{ $t('sidebar.home') }}
</div>
</router-link>
<router-link :to="{name: 'RecentUploads'}" class="menu-list-item link">
<router-link @click.native="resetData" :to="{name: 'RecentUploads'}" class="menu-list-item link">
<div class="icon text-theme">
<upload-cloud-icon size="17" />
</div>
@@ -24,7 +24,7 @@
{{ $t('sidebar.latest') }}
</div>
</router-link>
<router-link :to="{name: 'MySharedItems'}" class="menu-list-item link">
<router-link @click.native="resetData" :to="{name: 'MySharedItems'}" class="menu-list-item link">
<div class="icon text-theme">
<link-icon size="17" />
</div>
@@ -32,7 +32,7 @@
{{ $t('sidebar.my_shared') }}
</div>
</router-link>
<router-link :to="{name: 'Trash'}" class="menu-list-item link">
<router-link @click.native="resetData" :to="{name: 'Trash'}" class="menu-list-item link">
<div class="icon text-theme">
<trash2-icon size="17" />
</div>
@@ -46,7 +46,7 @@
<!--Locations-->
<ContentGroup :title="$t('Collaboration')" slug="collaboration" :can-collapse="true">
<div class="menu-list-wrapper vertical">
<router-link :to="{name: 'TeamFolders'}" class="menu-list-item link">
<router-link @click.native="resetData" :to="{name: 'TeamFolders'}" class="menu-list-item link">
<div class="icon text-theme">
<users-icon size="17" />
</div>
@@ -54,7 +54,7 @@
{{ $t('Team Folders') }}
</div>
</router-link>
<router-link :to="{name: 'SharedWithMe'}" class="menu-list-item link">
<router-link @click.native="resetData" :to="{name: 'SharedWithMe'}" class="menu-list-item link">
<div class="icon text-theme">
<user-check-icon size="17" />
</div>
@@ -143,6 +143,10 @@ export default {
}
},
methods: {
resetData() {
this.$store.commit('SET_CURRENT_TEAM_FOLDER', null)
this.$store.commit('CLIPBOARD_CLEAR')
},
goToFolder(folder) {
this.$router.push({name: 'Files', params: {id: folder.data.id}})
},