bulk-operations fixed moveItem popup Three, fixed multiSelect with Shift from bottom to top

This commit is contained in:
Milos Holba
2020-11-30 18:49:54 +01:00
parent 58f7479380
commit 8561556f5c
10 changed files with 138 additions and 179 deletions

View File

@@ -466,7 +466,7 @@ export default {
},
deleteItem() {
// Dispatch remove item
// If is contet menu open on non selected item delete this single item
// If is context menu open on non selected item delete this single item
if(!this.fileInfoDetail.includes(this.item)){
this.$store.dispatch('deleteItem', this.item)
}

View File

@@ -135,6 +135,8 @@
return this.data.length == 0
},
dragedItems() {
//Set opacity for dragged items
if(!this.fileInfoDetail.includes(this.draggingId)){
return [this.draggingId]
}
@@ -188,6 +190,7 @@
//Prevent move selected folder to folder if in beteewn selected folders
if(this.fileInfoDetail.find(item => item === data)) return
// Move folder to new parent
//Move selected items to folder
@@ -215,9 +218,8 @@
events.$emit('contextMenu:show', event, item)
},
filesContainerClick() {
// Deselect clicked item
events.$emit('fileItem:deselect')
// Deselect itms clicked by outside
this.$store.commit('CLEAR_FILEINFO_DETAIL')
// Hide context menu if is opened
events.$emit('contextMenu:hide')
@@ -251,11 +253,6 @@
if (container) container.scrollTop = 0
})
// On items delete
events.$on('items:delete', () => {
this.$store.dispatch('deleteItem')
})
}
}
</script>

View File

@@ -11,8 +11,7 @@
@dragstart="$emit('dragstart')"
@drop="
drop()
area = false
"
area = false"
@dragleave="dragLeave"
@dragover.prevent="dragEnter"
class="file-item"
@@ -197,19 +196,19 @@
this.$store.commit('CLEAR_FILEINFO_DETAIL')
}
//Shift selecting from top to bottom
if(lastItem < clickedItem) {
for(let i=lastItem ; i<=clickedItem; i++ ) {
this.$store.commit('GET_FILEINFO_DETAIL', this.allData[i])
}
//Shift selecting from bottom to top
}else {
for(let i=clickedItem ; i<=lastItem; i++ ) {
for(let i=lastItem ; i>=clickedItem; i-- ) {
this.$store.commit('GET_FILEINFO_DETAIL', this.allData[i])
}
}
}else {
// Click
events.$emit('fileItem:deselect')
this.$store.commit('CLEAR_FILEINFO_DETAIL')
this.$store.commit('GET_FILEINFO_DETAIL', this.data)
}
@@ -290,16 +289,10 @@
this.mobileMultiSelect = false
this.$store.commit('CLEAR_FILEINFO_DETAIL')
})
events.$on('fileItem:deselect', () => {
// Deselect file
this.$store.commit('CLEAR_FILEINFO_DETAIL')
})
// Change item name
events.$on('change:name', (item) => {
if (this.data.unique_id == item.unique_id) this.itemName = item.name
})
// Change item name
events.$on('change:name', (item) => {
if (this.data.unique_id == item.unique_id) this.itemName = item.name
})
}
}
</script>
@@ -309,20 +302,20 @@
@import '@assets/vue-file-manager/_mixins';
.check-select {
margin-right: 10px;
margin-left: 3px;
position: absolute;
top: -10px;
z-index: 5;
left: 0px;
}
margin-right: 10px;
margin-left: 3px;
position: absolute;
top: -10px;
z-index: 5;
left: 0px;
}
.check-select-folder {
margin-right: 10px;
margin-left: 3px;
position: absolute;
top: 8px;
z-index: 5;
left: 10px;
margin-right: 10px;
margin-left: 3px;
position: absolute;
top: 8px;
z-index: 5;
left: 10px;
}
.select-box {
width: 20px;

View File

@@ -9,14 +9,13 @@
@dragstart="$emit('dragstart')"
@drop="
drop()
area = false
"
area = false"
@dragleave="dragLeave"
@dragover.prevent="dragEnter"
class="file-item"
:class="{'is-clicked' : isClicked , 'no-clicked' : !isClicked && this.$isMobile(), 'is-dragenter': area }"
>
<!-- MultiSelecting for the mobile version -->
<div class="check-select" v-if="mobileMultiSelect">
<div class="select-box" :class="{'select-box-active' : isClicked } ">
<CheckIcon v-if="isClicked" class="icon" size="17"/>
@@ -170,6 +169,7 @@ export default {
},
clickedItem(e) {
events.$emit('contextMenu:hide')
if(!this.$isMobile()) {
if( (e.ctrlKey || e.metaKey ) && !e.shiftKey) {
@@ -190,18 +190,19 @@ export default {
this.$store.commit('CLEAR_FILEINFO_DETAIL')
}
//Shift selecting from top to bottom
if(lastItem < clickedItem) {
for(let i=lastItem ; i<=clickedItem; i++ ) {
this.$store.commit('GET_FILEINFO_DETAIL', this.allData[i])
}
//Shift selecting from bottom to top
}else {
for(let i=clickedItem ; i<=lastItem; i++ ) {
for(let i=lastItem ; i>=clickedItem; i-- ) {
this.$store.commit('GET_FILEINFO_DETAIL', this.allData[i])
}
}
}else {
// Click
events.$emit('fileItem:deselect')
this.$store.commit('CLEAR_FILEINFO_DETAIL')
this.$store.commit('GET_FILEINFO_DETAIL', this.data)
}
@@ -269,18 +270,12 @@ export default {
this.itemName = this.data.name
events.$on('mobileSelecting-start', () => {
this.mobileMultiSelect = true
this.$store.commit('CLEAR_FILEINFO_DETAIL')
this.mobileMultiSelect = true
this.$store.commit('CLEAR_FILEINFO_DETAIL')
})
events.$on('mobileSelecting-stop', () => {
this.mobileMultiSelect = false
this.$store.commit('CLEAR_FILEINFO_DETAIL')
})
events.$on('fileItem:deselect', () => {
// Deselect file
if(this.fileInfoDetail.length > 0)
this.mobileMultiSelect = false
this.$store.commit('CLEAR_FILEINFO_DETAIL')
})

View File

@@ -78,6 +78,7 @@ export default {
events.$emit('popup:open', { name: 'move', item: [this.fileInfoDetail[0]] })
},
deleteItem() {
//Delete items
this.$store.dispatch("deleteItem");
},
},

View File

@@ -15,7 +15,7 @@
<MultiSelected class="multiple-selected" :move-item="true" v-if="fileInfoDetail.length > 1 && !noSelectedItem"/>
<TreeMenu :disabled-by-id="pickedItem.unique_id" :depth="1" :nodes="items" v-for="items in navigation" :key="items.unique_id"/>
<TreeMenu :disabled-by-id="pickedItem" :depth="1" :nodes="items" v-for="items in navigation" :key="items.unique_id"/>
</div>
</PopupContent>

View File

@@ -1,6 +1,6 @@
<template>
<!--Folder Icon-->
<div class="folder-item-wrapper" :class="{'is-inactive': disabledById && disabledById === nodes.unique_id || !disableId} ">
<div class="folder-item-wrapper" :class="{'is-inactive': disabledById && disabledById.unique_id === nodes.unique_id || !disableId} ">
<div class="folder-item" :class="{'is-selected': isSelected}" @click="getFolder" :style="indent">
<chevron-right-icon @click.stop="showTree" size="17" class="icon-arrow" :class="{'is-opened': isVisible, 'is-visible': nodes.folders.length !== 0}"></chevron-right-icon>
@@ -34,11 +34,10 @@
...mapGetters(['fileInfoDetail']),
indent() {
return { paddingLeft: this.depth * 20 + 'px' }
console.log(this.nodes )
},
disableId() {
let canBeShow = true
if(this.fileInfoDetail.includes(this.nodes)){
if(this.fileInfoDetail.includes(this.disabledById)){
this.fileInfoDetail.map(item => {
if(item.unique_id === this.nodes.unique_id) {
canBeShow = false

View File

@@ -69,7 +69,8 @@ const actions = {
}
let pushToFavorites = []
//Dont push to favorites a folder what is already in favourites
//Check is favorites already don't include some of pushed folders
items.map(data => {
if(!context.getters.user.relationships.favourites.data.attributes.folders.find(folder => folder.unique_id === data.unique_id)){
pushToFavorites.push(data)