@ -3,9 +3,9 @@
|
||||
<nav>
|
||||
<div class="path" @contextmenu.prevent.stop="() => {}">
|
||||
<x-nav-folder :class="{ current: folder == null }"/>
|
||||
<template v-for="folder in hierarchyFolders">
|
||||
<span class="separator"><fa :icon="faAngleRight"/></span>
|
||||
<x-nav-folder :folder="folder" :key="folder.id"/>
|
||||
<template v-for="f in hierarchyFolders">
|
||||
<span class="separator" :key="f.id + ':separator'"><fa :icon="faAngleRight"/></span>
|
||||
<x-nav-folder :folder="f" :key="f.id"/>
|
||||
</template>
|
||||
<span class="separator" v-if="folder != null"><fa :icon="faAngleRight"/></span>
|
||||
<span class="folder current" v-if="folder != null">{{ folder.name }}</span>
|
||||
@ -20,15 +20,15 @@
|
||||
>
|
||||
<div class="contents" ref="contents">
|
||||
<div class="folders" ref="foldersContainer" v-if="folders.length > 0">
|
||||
<x-folder v-for="folder in folders" :key="folder.id" class="folder" :folder="folder"/>
|
||||
<x-folder v-for="f in folders" :key="f.id" class="folder" :folder="f" :select-mode="select === 'folder'" :is-selected="selectedFolders.some(x => x.id === f.id)" @chosen="chooseFolder"/>
|
||||
<!-- SEE: https://stackoverflow.com/questions/18744164/flex-box-align-last-row-to-grid -->
|
||||
<div class="padding" v-for="n in 16"></div>
|
||||
<div class="padding" v-for="(n, i) in 16" :key="i"></div>
|
||||
<mk-button v-if="moreFolders">{{ $t('loadMore') }}</mk-button>
|
||||
</div>
|
||||
<div class="files" ref="filesContainer" v-if="files.length > 0">
|
||||
<x-file v-for="file in files" :key="file.id" class="file" :file="file" :select-mode="selectMode"/>
|
||||
<x-file v-for="file in files" :key="file.id" class="file" :file="file" :select-mode="select === 'file'" :is-selected="selectedFiles.some(x => x.id === file.id)" @chosen="chooseFile"/>
|
||||
<!-- SEE: https://stackoverflow.com/questions/18744164/flex-box-align-last-row-to-grid -->
|
||||
<div class="padding" v-for="n in 16"></div>
|
||||
<div class="padding" v-for="(n, i) in 16" :key="i"></div>
|
||||
<mk-button v-if="moreFiles" @click="fetchMoreFiles">{{ $t('loadMore') }}</mk-button>
|
||||
</div>
|
||||
<div class="empty" v-if="files.length == 0 && folders.length == 0 && !fetching">
|
||||
@ -81,10 +81,10 @@ export default Vue.extend({
|
||||
required: false,
|
||||
default: false
|
||||
},
|
||||
selectMode: {
|
||||
type: Boolean,
|
||||
select: {
|
||||
type: String,
|
||||
required: false,
|
||||
default: false
|
||||
default: null
|
||||
}
|
||||
},
|
||||
|
||||
@ -102,6 +102,7 @@ export default Vue.extend({
|
||||
moreFolders: false,
|
||||
hierarchyFolders: [],
|
||||
selectedFiles: [],
|
||||
selectedFolders: [],
|
||||
uploadings: [],
|
||||
connection: null,
|
||||
|
||||
@ -392,6 +393,25 @@ export default Vue.extend({
|
||||
}
|
||||
},
|
||||
|
||||
chooseFolder(folder) {
|
||||
const isAlreadySelected = this.selectedFolders.some(f => f.id == folder.id);
|
||||
if (this.multiple) {
|
||||
if (isAlreadySelected) {
|
||||
this.selectedFolders = this.selectedFolders.filter(f => f.id != folder.id);
|
||||
} else {
|
||||
this.selectedFolders.push(folder);
|
||||
}
|
||||
this.$emit('change-selection', this.selectedFolders);
|
||||
} else {
|
||||
if (isAlreadySelected) {
|
||||
this.$emit('selected', folder);
|
||||
} else {
|
||||
this.selectedFolders = [folder];
|
||||
this.$emit('change-selection', [folder]);
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
move(target) {
|
||||
if (target == null) {
|
||||
this.goRoot();
|
||||
|
Reference in New Issue
Block a user