mirror of
https://github.com/VueFileManager/vuefilemanager.git
synced 2026-04-06 02:33:48 +00:00
bulk-operations v0.1 mobileSeleting finished, change FileFullPreview code
This commit is contained in:
@@ -29,7 +29,7 @@
|
||||
"/chunks/environment-setup.js": "/chunks/environment-setup.js?id=405847df44edd86e301a",
|
||||
"/chunks/files.js": "/chunks/files.js?id=e0e01c40a7c37f170270",
|
||||
"/chunks/files~chunks/settings-subscription~chunks/shared-files~chunks/shared-page~chunks/trash~chunks~3ea7670b.js": "/chunks/files~chunks/settings-subscription~chunks/shared-files~chunks/shared-page~chunks/trash~chunks~3ea7670b.js?id=6cafd70cb9e5ae25f02a",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.js?id=195540d080e3889ca57f",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.js?id=3703e138e9d316a9d850",
|
||||
"/chunks/forgotten-password.js": "/chunks/forgotten-password.js?id=aba8c662fbc234892216",
|
||||
"/chunks/installation-disclaimer.js": "/chunks/installation-disclaimer.js?id=ecceaa6cdf5768826b36",
|
||||
"/chunks/invoices.js": "/chunks/invoices.js?id=248503ac5967fe8370f9",
|
||||
@@ -74,5 +74,80 @@
|
||||
"/chunks/user-password.js": "/chunks/user-password.js?id=b036eeaa5ef8e798f6dd",
|
||||
"/chunks/user-storage.js": "/chunks/user-storage.js?id=a99910f95c3e39caa78b",
|
||||
"/chunks/user-subscription.js": "/chunks/user-subscription.js?id=e8ea1e67f9ac0a835ed0",
|
||||
"/chunks/users.js": "/chunks/users.js?id=cdba7af8fb0cd8e64c40"
|
||||
"/chunks/users.js": "/chunks/users.js?id=cdba7af8fb0cd8e64c40",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.c6be29fc8fb5f6066889.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.c6be29fc8fb5f6066889.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.ddb66a6efe5bcb01ed50.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.ddb66a6efe5bcb01ed50.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.7aeb3b63de0a18f158dd.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.7aeb3b63de0a18f158dd.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.80b31c9384d68ca81426.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.80b31c9384d68ca81426.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.6bdf4bd28e383386a08f.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.6bdf4bd28e383386a08f.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.c687d4d9a48b5bf55b6d.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.c687d4d9a48b5bf55b6d.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.d658f6bebc345fd0748b.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.d658f6bebc345fd0748b.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.62332b6c26a3a17243c9.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.62332b6c26a3a17243c9.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.32224af37576509ffc32.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.32224af37576509ffc32.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.3f516bc5454ea15bb769.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.3f516bc5454ea15bb769.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.c37d7459aa7f09878c0a.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.c37d7459aa7f09878c0a.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.8c4daf554552aa20f374.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.8c4daf554552aa20f374.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.a8773e02004276bf57de.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.a8773e02004276bf57de.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.3dd73d1160e4595d5106.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.3dd73d1160e4595d5106.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.68dcd7b1fc9b05db68f6.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.68dcd7b1fc9b05db68f6.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.f19c3e219f01eccd8fb3.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.f19c3e219f01eccd8fb3.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.2eccbc694b11b2efbc63.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.2eccbc694b11b2efbc63.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.38f836026c4fc800e3c4.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.38f836026c4fc800e3c4.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.9dfaf9f542df321ba991.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.9dfaf9f542df321ba991.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.73b7b39eefa288138dfc.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.73b7b39eefa288138dfc.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.5751401aba1adb64a925.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.5751401aba1adb64a925.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.06c57069549acfea652d.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.06c57069549acfea652d.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.52deb1b66739be132d70.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.52deb1b66739be132d70.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.985a286b1418248fc878.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.985a286b1418248fc878.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.cc7a2c5d70236867a163.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.cc7a2c5d70236867a163.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.0cb903ff08c25eb5d015.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.0cb903ff08c25eb5d015.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.90fb6e64be7464215f6f.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.90fb6e64be7464215f6f.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.6378f26bda11216c9d7a.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.6378f26bda11216c9d7a.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.fc9d458b9024171d896f.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.fc9d458b9024171d896f.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.ebafe3c3d8c3ca24226f.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.ebafe3c3d8c3ca24226f.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.204578bdb6eba7d9459d.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.204578bdb6eba7d9459d.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.b374bcefda7eea419a77.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.b374bcefda7eea419a77.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.1297c60f82fcee404a0b.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.1297c60f82fcee404a0b.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.8bb631240ea107faeee1.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.8bb631240ea107faeee1.hot-update.js",
|
||||
"/js/main.aa14968f01b581f22523.hot-update.js": "/js/main.aa14968f01b581f22523.hot-update.js",
|
||||
"/chunks/dashboard.aa14968f01b581f22523.hot-update.js": "/chunks/dashboard.aa14968f01b581f22523.hot-update.js",
|
||||
"/chunks/dashboard~chunks/invoices~chunks/pages~chunks/plans~chunks/settings-payment-methods~chunks/users.js": "/chunks/dashboard~chunks/invoices~chunks/pages~chunks/plans~chunks/settings-payment-methods~chunks/users.js?id=2bb9ebac09457d3b898e",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.aa14968f01b581f22523.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.aa14968f01b581f22523.hot-update.js",
|
||||
"/chunks/invoices.aa14968f01b581f22523.hot-update.js": "/chunks/invoices.aa14968f01b581f22523.hot-update.js",
|
||||
"/chunks/pages.aa14968f01b581f22523.hot-update.js": "/chunks/pages.aa14968f01b581f22523.hot-update.js",
|
||||
"/chunks/plans.aa14968f01b581f22523.hot-update.js": "/chunks/plans.aa14968f01b581f22523.hot-update.js",
|
||||
"/chunks/settings-payment-methods.aa14968f01b581f22523.hot-update.js": "/chunks/settings-payment-methods.aa14968f01b581f22523.hot-update.js",
|
||||
"/chunks/users.aa14968f01b581f22523.hot-update.js": "/chunks/users.aa14968f01b581f22523.hot-update.js",
|
||||
"/js/main.957105d51b4b371c02f7.hot-update.js": "/js/main.957105d51b4b371c02f7.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.957105d51b4b371c02f7.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.957105d51b4b371c02f7.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.29c8874dfb2c94995650.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.29c8874dfb2c94995650.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.fe60ff9d657992a1b3fc.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.fe60ff9d657992a1b3fc.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.39547a50bad3eaef19d5.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.39547a50bad3eaef19d5.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.49f90f3476114215e153.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.49f90f3476114215e153.hot-update.js",
|
||||
"/js/main.b1e1c83f945ac034e4b6.hot-update.js": "/js/main.b1e1c83f945ac034e4b6.hot-update.js",
|
||||
"/js/main.09d58bdcd52e76eea49a.hot-update.js": "/js/main.09d58bdcd52e76eea49a.hot-update.js",
|
||||
"/js/main.0f77ad05525e6d1f485b.hot-update.js": "/js/main.0f77ad05525e6d1f485b.hot-update.js",
|
||||
"/js/main.c7508405578e74d6d5d0.hot-update.js": "/js/main.c7508405578e74d6d5d0.hot-update.js",
|
||||
"/js/main.03f879f9830de6d3b02d.hot-update.js": "/js/main.03f879f9830de6d3b02d.hot-update.js",
|
||||
"/js/main.13df6330a44eda756456.hot-update.js": "/js/main.13df6330a44eda756456.hot-update.js",
|
||||
"/js/main.a74beb7aef66d2190d52.hot-update.js": "/js/main.a74beb7aef66d2190d52.hot-update.js",
|
||||
"/js/main.5cd5987df958d7bb7eec.hot-update.js": "/js/main.5cd5987df958d7bb7eec.hot-update.js",
|
||||
"/js/main.3e7f55b2c44e25eb1164.hot-update.js": "/js/main.3e7f55b2c44e25eb1164.hot-update.js",
|
||||
"/js/main.457b5d135de215ee357d.hot-update.js": "/js/main.457b5d135de215ee357d.hot-update.js",
|
||||
"/js/main.9cbc62e607b82155c099.hot-update.js": "/js/main.9cbc62e607b82155c099.hot-update.js",
|
||||
"/js/main.7a48fee0a61738f74542.hot-update.js": "/js/main.7a48fee0a61738f74542.hot-update.js",
|
||||
"/js/main.c6167479106cf4d6528d.hot-update.js": "/js/main.c6167479106cf4d6528d.hot-update.js",
|
||||
"/js/main.78b0f051b1396111d2f1.hot-update.js": "/js/main.78b0f051b1396111d2f1.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.9a0fe6f8a67a58879bca.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.9a0fe6f8a67a58879bca.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.9b35209ca84faca947c0.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.9b35209ca84faca947c0.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.a674fdf77aea80c0529b.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.a674fdf77aea80c0529b.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.97d913769431b05cc7c2.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.97d913769431b05cc7c2.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.8cf94a788280336dda73.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.8cf94a788280336dda73.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.3af71b38ca39f36d99e4.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.3af71b38ca39f36d99e4.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.401b03e61a5ab310bb94.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page~chunks/trash.401b03e61a5ab310bb94.hot-update.js",
|
||||
"/js/main.6f45362ec6c423157bfe.hot-update.js": "/js/main.6f45362ec6c423157bfe.hot-update.js",
|
||||
"/js/main.3644cc8d59343b060b54.hot-update.js": "/js/main.3644cc8d59343b060b54.hot-update.js",
|
||||
"/js/main.946a09d801c105987d08.hot-update.js": "/js/main.946a09d801c105987d08.hot-update.js",
|
||||
"/js/main.2558534849562d05fae1.hot-update.js": "/js/main.2558534849562d05fae1.hot-update.js",
|
||||
"/js/main.9d6ddebbc75464578783.hot-update.js": "/js/main.9d6ddebbc75464578783.hot-update.js"
|
||||
}
|
||||
|
||||
@@ -149,7 +149,11 @@ export default {
|
||||
return this.FilePreviewType === "list" ? "th" : "th-list";
|
||||
},
|
||||
canCreateFolderInView() {
|
||||
return !this.$isThisLocation(["base", "public"]);
|
||||
let location = !this.$isThisLocation(["base", "public"]);
|
||||
|
||||
if(location || this.fileInfoDetail.length >1) {
|
||||
return true
|
||||
}
|
||||
},
|
||||
canDeleteInView() {
|
||||
return !this.$isThisLocation([
|
||||
@@ -163,7 +167,10 @@ export default {
|
||||
]);
|
||||
},
|
||||
canUploadInView() {
|
||||
return !this.$isThisLocation(["base", "public"]);
|
||||
let location = !this.$isThisLocation(["base", "public"]);
|
||||
if(location || this.fileInfoDetail.length >1) {
|
||||
return true
|
||||
}
|
||||
},
|
||||
canMoveInView() {
|
||||
return !this.$isThisLocation([
|
||||
|
||||
@@ -8,7 +8,7 @@
|
||||
<div
|
||||
class="files-container"
|
||||
ref="fileContainer"
|
||||
:class="{'is-fileinfo-visible': fileInfoVisible && !$isMinimalScale() }"
|
||||
:class="{'is-fileinfo-visible': fileInfoVisible && !$isMinimalScale() , 'mobile-multi-select' : mobileMultiSelect}"
|
||||
@click.self="filesContainerClick"
|
||||
>
|
||||
<!--MobileToolbar-->
|
||||
@@ -135,6 +135,7 @@
|
||||
return {
|
||||
draggingId: undefined,
|
||||
isDragging: false,
|
||||
mobileMultiSelect: false
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
@@ -191,6 +192,14 @@
|
||||
}
|
||||
},
|
||||
created() {
|
||||
events.$on('mobileSelecting-start' , () => {
|
||||
this.mobileMultiSelect =true
|
||||
})
|
||||
|
||||
events.$on('mobileSelecting-stop' , () => {
|
||||
this.mobileMultiSelect = false
|
||||
})
|
||||
|
||||
events.$on('fileItem:deselect', () =>
|
||||
this.$store.commit('CLEAR_FILEINFO_DETAIL')
|
||||
)
|
||||
@@ -216,6 +225,10 @@
|
||||
@import '@assets/vue-file-manager/_variables';
|
||||
@import '@assets/vue-file-manager/_mixins';
|
||||
|
||||
.mobile-multi-select {
|
||||
bottom: 50px !important;
|
||||
}
|
||||
|
||||
.button-upload {
|
||||
display: block;
|
||||
text-align: center;
|
||||
|
||||
@@ -16,11 +16,18 @@
|
||||
@dragleave="dragLeave"
|
||||
@dragover.prevent="dragEnter"
|
||||
class="file-item"
|
||||
:class="{ 'is-clicked': this.isClicked, 'is-dragenter': area }"
|
||||
>
|
||||
:class="{'is-clicked' : isClicked , 'no-clicked' : !isClicked, 'is-dragenter': area }"
|
||||
>
|
||||
<!--Thumbnail for item-->
|
||||
<div class="icon-item">
|
||||
|
||||
<div :class="{'check-select-folder' : this.data.type === 'folder', 'check-select' : this.data.type !== 'folder'}" v-if="mobileMultiSelect">
|
||||
<div class="select-box" :class="{'select-box-active' : isClicked } ">
|
||||
<!-- <p>|</p> -->
|
||||
<CheckIcon v-if="isClicked" class="icon" size="17"/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--If is file or image, then link item-->
|
||||
<span v-if="isFile" class="file-icon-text">
|
||||
{{ data.mimetype }}
|
||||
@@ -71,7 +78,7 @@
|
||||
</div>
|
||||
|
||||
<span @click.stop="showItemActions" class="show-actions"
|
||||
v-if="$isMobile() && ! ( $checkPermission('visitor') && isFolder ) && canShowMobileOptions">
|
||||
v-if="$isMobile() && ! ( $checkPermission('visitor') && isFolder || mobileMultiSelect ) && canShowMobileOptions">
|
||||
<FontAwesomeIcon icon="ellipsis-h" class="icon-action"></FontAwesomeIcon>
|
||||
</span>
|
||||
</div>
|
||||
@@ -79,7 +86,7 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { LinkIcon, UserPlusIcon } from 'vue-feather-icons'
|
||||
import { LinkIcon, UserPlusIcon, CheckIcon } from 'vue-feather-icons'
|
||||
import {debounce} from 'lodash'
|
||||
import {mapGetters} from 'vuex'
|
||||
import {events} from '@/bus'
|
||||
@@ -89,6 +96,7 @@
|
||||
props: ['data'],
|
||||
components: {
|
||||
UserPlusIcon,
|
||||
CheckIcon,
|
||||
LinkIcon,
|
||||
},
|
||||
computed: {
|
||||
@@ -97,12 +105,12 @@
|
||||
]),
|
||||
...mapGetters({allData: 'data'}),
|
||||
isClicked() {
|
||||
if(this.fileInfoDetail.some(element => element.unique_id == this.data.unique_id)){
|
||||
return true
|
||||
}else {
|
||||
return false
|
||||
}
|
||||
},
|
||||
if(this.fileInfoDetail.some(element => element.unique_id == this.data.unique_id)){
|
||||
return true
|
||||
}else {
|
||||
return false
|
||||
}
|
||||
},
|
||||
isFolder() {
|
||||
return this.data.type === 'folder'
|
||||
},
|
||||
@@ -147,12 +155,14 @@
|
||||
data() {
|
||||
return {
|
||||
area: false,
|
||||
itemName: undefined
|
||||
itemName: undefined,
|
||||
mobileMultiSelect:false
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
showItemActions() {
|
||||
// Load file info detail
|
||||
this.$store.commit('CLEAR_FILEINFO_DETAIL')
|
||||
this.$store.commit('GET_FILEINFO_DETAIL', this.data)
|
||||
|
||||
events.$emit('mobileMenu:show')
|
||||
@@ -168,61 +178,68 @@
|
||||
clickedItem(e) {
|
||||
events.$emit('contextMenu:hide')
|
||||
|
||||
if(e.ctrlKey && !e.shiftKey) {
|
||||
// Click + Ctrl
|
||||
if(this.fileInfoDetail.some(item => item.unique_id === this.data.unique_id)){
|
||||
this.$store.commit('REMOVE_ITEM_FILEINFO_DETAIL',this.data )
|
||||
}else {
|
||||
console.log(this.data.name)
|
||||
this.$store.commit('GET_FILEINFO_DETAIL', this.data)
|
||||
}
|
||||
}else if (e.shiftKey){
|
||||
// Click + Shift
|
||||
let lastItem = this.allData.indexOf(this.fileInfoDetail[this.fileInfoDetail.length -1])
|
||||
let clickedItem = this.allData.indexOf(this.data)
|
||||
|
||||
// If Click + Shift + Ctrl dont remove already selected items
|
||||
if(!e.ctrlKey) {
|
||||
this.$store.commit('CLEAR_FILEINFO_DETAIL')
|
||||
}
|
||||
|
||||
if(lastItem < clickedItem) {
|
||||
for(let i=lastItem ; i<=clickedItem; i++ ) {
|
||||
this.$store.commit('GET_FILEINFO_DETAIL', this.allData[i])
|
||||
console.log(this.allData[i].name)
|
||||
}
|
||||
}else {
|
||||
for(let i=clickedItem ; i<=lastItem; i++ ) {
|
||||
this.$store.commit('GET_FILEINFO_DETAIL', this.allData[i])
|
||||
console.log(this.allData[i].name)
|
||||
}
|
||||
}
|
||||
this.fileInfoDetail.forEach(element => console.log(element.id ,element.name))
|
||||
}else {
|
||||
// Click
|
||||
|
||||
events.$emit('fileItem:deselect')
|
||||
this.$store.commit('CLEAR_FILEINFO_DETAIL')
|
||||
this.$store.commit('GET_FILEINFO_DETAIL', this.data)
|
||||
}
|
||||
|
||||
// Open in mobile version on first click
|
||||
if (this.$isMobile() && this.isFolder) {
|
||||
|
||||
// Go to folder
|
||||
if (this.$isThisLocation('public')) {
|
||||
this.$store.dispatch('browseShared', [{folder: this.data, back: false, init: false}])
|
||||
} else {
|
||||
this.$store.dispatch('getFolder', [{folder: this.data, back: false, init: false}])
|
||||
if(!this.$isMobile()) {
|
||||
if(e.ctrlKey && !e.shiftKey) {
|
||||
// Click + Ctrl
|
||||
if(this.fileInfoDetail.some(item => item.unique_id === this.data.unique_id)){
|
||||
this.$store.commit('REMOVE_ITEM_FILEINFO_DETAIL',this.data )
|
||||
}else {
|
||||
this.$store.commit('GET_FILEINFO_DETAIL', this.data)
|
||||
}
|
||||
}else if (e.shiftKey){
|
||||
// Click + Shift
|
||||
let lastItem = this.allData.indexOf(this.fileInfoDetail[this.fileInfoDetail.length -1])
|
||||
let clickedItem = this.allData.indexOf(this.data)
|
||||
|
||||
// If Click + Shift + Ctrl dont remove already selected items
|
||||
if(!e.ctrlKey) {
|
||||
this.$store.commit('CLEAR_FILEINFO_DETAIL')
|
||||
}
|
||||
|
||||
if(lastItem < clickedItem) {
|
||||
for(let i=lastItem ; i<=clickedItem; i++ ) {
|
||||
this.$store.commit('GET_FILEINFO_DETAIL', this.allData[i])
|
||||
}
|
||||
}else {
|
||||
for(let i=clickedItem ; i<=lastItem; 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)
|
||||
}
|
||||
}
|
||||
|
||||
if (this.$isMobile()) {
|
||||
if (this.isImage || this.isVideo || this.isAudio) {
|
||||
events.$emit('fileFullPreview:show')
|
||||
if(!this.mobileMultiSelect && this.$isMobile()){
|
||||
// Open in mobile version on first click
|
||||
if (this.$isMobile() && this.isFolder) {
|
||||
// Go to folder
|
||||
if (this.$isThisLocation('public')) {
|
||||
this.$store.dispatch('browseShared', [{ folder: this.data, back: false, init: false }])
|
||||
} else {
|
||||
this.$store.dispatch('getFolder', [{ folder: this.data, back: false, init: false }])
|
||||
}
|
||||
}
|
||||
|
||||
if (this.$isMobile()) {
|
||||
if (this.isImage || this.isVideo || this.isAudio) {
|
||||
this.$store.commit('GET_FILEINFO_DETAIL', this.data)
|
||||
events.$emit('fileFullPreview:show')
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if(this.mobileMultiSelect && this.$isMobile()) {
|
||||
if(this.fileInfoDetail.some(item => item.unique_id === this.data.unique_id)) {
|
||||
this.$store.commit('REMOVE_ITEM_FILEINFO_DETAIL', this.data )
|
||||
}else {
|
||||
this.$store.commit('GET_FILEINFO_DETAIL', this.data)
|
||||
}
|
||||
}
|
||||
|
||||
// Get target classname
|
||||
let itemClass = e.target.className
|
||||
|
||||
@@ -263,6 +280,16 @@
|
||||
created() {
|
||||
this.itemName = this.data.name
|
||||
|
||||
events.$on('mobileSelecting-start', () => {
|
||||
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
|
||||
this.$store.commit('CLEAR_FILEINFO_DETAIL')
|
||||
@@ -280,6 +307,40 @@
|
||||
@import '@assets/vue-file-manager/_variables';
|
||||
@import '@assets/vue-file-manager/_mixins';
|
||||
|
||||
.check-select {
|
||||
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;
|
||||
}
|
||||
.select-box {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
background-color:$light_background;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
border-radius: 5px;
|
||||
box-shadow: 0 3px 15px 2px hsla(220, 36%, 16%, 0.05);
|
||||
}
|
||||
.select-box-active {
|
||||
background-color: $text !important;
|
||||
.icon {
|
||||
stroke: white;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.show-actions {
|
||||
cursor: pointer;
|
||||
padding: 4px 26px;
|
||||
@@ -381,14 +442,22 @@
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
&.no-clicked {
|
||||
background: white !important;
|
||||
.item-name {
|
||||
.name {
|
||||
color: $text !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&:hover,
|
||||
&.is-clicked {
|
||||
border-radius: 8px;
|
||||
background: $light_background;
|
||||
|
||||
.item-name .name {
|
||||
color: $theme;
|
||||
}
|
||||
color: $theme;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -510,6 +579,17 @@
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
|
||||
.select-box {
|
||||
background-color: $dark_mode_foreground;
|
||||
}
|
||||
.select-box-active {
|
||||
background-color: $dark_mode_text_primary !important;
|
||||
.icon {
|
||||
stroke: $text;
|
||||
}
|
||||
}
|
||||
|
||||
.file-wrapper {
|
||||
|
||||
.icon-item {
|
||||
@@ -533,6 +613,22 @@
|
||||
}
|
||||
|
||||
.file-item {
|
||||
&.no-clicked {
|
||||
background: $dark_mode_background !important;
|
||||
.file-icon {
|
||||
|
||||
path {
|
||||
fill: $dark_mode_foreground !important;
|
||||
stroke: #2F3C54 !important;
|
||||
}
|
||||
}
|
||||
.item-name {
|
||||
|
||||
.name {
|
||||
color: $dark_mode_text_primary !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&:hover,
|
||||
&.is-clicked {
|
||||
|
||||
@@ -95,7 +95,6 @@ export default {
|
||||
...mapGetters({allData: 'data'}),
|
||||
isClicked() {
|
||||
if(this.fileInfoDetail.some(element => element.unique_id == this.data.unique_id)){
|
||||
console.log('som tu')
|
||||
return true
|
||||
}else {
|
||||
return false
|
||||
@@ -221,6 +220,7 @@ export default {
|
||||
|
||||
if (this.$isMobile()) {
|
||||
if (this.isImage || this.isVideo || this.isAudio) {
|
||||
this.$store.commit('GET_FILEINFO_DETAIL', this.data)
|
||||
events.$emit('fileFullPreview:show')
|
||||
}
|
||||
}
|
||||
@@ -229,7 +229,6 @@ export default {
|
||||
if(this.mobileMultiSelect && this.$isMobile()) {
|
||||
if(this.fileInfoDetail.some(item => item.unique_id === this.data.unique_id)) {
|
||||
this.$store.commit('REMOVE_ITEM_FILEINFO_DETAIL', this.data )
|
||||
console.log(this.data)
|
||||
}else {
|
||||
this.$store.commit('GET_FILEINFO_DETAIL', this.data)
|
||||
}
|
||||
@@ -270,7 +269,12 @@ export default {
|
||||
this.itemName = this.data.name
|
||||
|
||||
events.$on('mobileSelecting-start', () => {
|
||||
this.mobileMultiSelect = !this.mobileMultiSelect
|
||||
this.mobileMultiSelect = true
|
||||
this.$store.commit('CLEAR_FILEINFO_DETAIL')
|
||||
})
|
||||
|
||||
events.$on('mobileSelecting-stop', () => {
|
||||
this.mobileMultiSelect = false
|
||||
this.$store.commit('CLEAR_FILEINFO_DETAIL')
|
||||
})
|
||||
|
||||
@@ -486,13 +490,17 @@ export default {
|
||||
|
||||
&.no-clicked {
|
||||
background: white !important;
|
||||
.item-name {
|
||||
.name {
|
||||
color: $text !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&:hover,
|
||||
&.is-clicked {
|
||||
border-radius: 8px;
|
||||
background: $light_background ;
|
||||
|
||||
.item-name .name {
|
||||
color: $theme;
|
||||
}
|
||||
@@ -534,6 +542,19 @@ export default {
|
||||
.file-item {
|
||||
&.no-clicked {
|
||||
background: $dark_mode_background !important;
|
||||
.file-icon {
|
||||
|
||||
path {
|
||||
fill: $dark_mode_foreground !important;
|
||||
stroke: #2F3C54 !important;
|
||||
}
|
||||
}
|
||||
.item-name {
|
||||
|
||||
.name {
|
||||
color: $dark_mode_text_primary !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
&:hover,
|
||||
&.is-clicked {
|
||||
|
||||
@@ -26,7 +26,7 @@ export default {
|
||||
filteredFiles() {
|
||||
let filteredData = []
|
||||
this.data.filter((element) => {
|
||||
if (element.type == this.fileInfoDetail.type) {
|
||||
if (element.type == this.fileInfoDetail[0].type) {
|
||||
filteredData.push(element)
|
||||
}
|
||||
})
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div class="navigation-panel" v-if="fileInfoDetail">
|
||||
<div class="navigation-panel" v-if="fileInfoDetail[0]">
|
||||
<div class="name-wrapper">
|
||||
<x-icon @click="closeFullPreview" size="22" class="icon-close"></x-icon>
|
||||
<div class="name-count-wrapper">
|
||||
@@ -12,13 +12,13 @@
|
||||
</div>
|
||||
|
||||
<div class="created-at-wrapper">
|
||||
<p>{{ fileInfoDetail.filesize }}, {{ fileInfoDetail.created_at }}</p>
|
||||
<p>{{ fileInfoDetail[0].filesize }}, {{ fileInfoDetail[0].created_at }}</p>
|
||||
</div>
|
||||
<div class="navigation-icons">
|
||||
<div class="navigation-tool-wrapper">
|
||||
<ToolbarButton source="download" class="mobile-hide" @click.native="downloadItem" :action="$t('actions.download')" />
|
||||
<ToolbarButton source="share" class="mobile-hide" :class="{ 'is-inactive': canShareInView }" :action="$t('actions.share')" @click.native="shareItem" />
|
||||
<ToolbarButton v-if="this.fileInfoDetail.type === 'image'" source="print" :action="$t('actions.print')" @click.native="printMethod()" />
|
||||
<ToolbarButton v-if="this.fileInfoDetail[0].type === 'image'" source="print" :action="$t('actions.print')" @click.native="printMethod()" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -39,7 +39,7 @@ export default {
|
||||
filteredFiles() {
|
||||
let files = []
|
||||
this.data.filter((element) => {
|
||||
if (element.type == this.fileInfoDetail.type) {
|
||||
if (element.type == this.fileInfoDetail[0].type) {
|
||||
files.push(element)
|
||||
}
|
||||
})
|
||||
@@ -48,7 +48,7 @@ export default {
|
||||
showingImageIndex() {
|
||||
let activeIndex = ''
|
||||
this.filteredFiles.filter((element, index) => {
|
||||
if (element.unique_id == this.fileInfoDetail.unique_id) {
|
||||
if (element.unique_id == this.fileInfoDetail[0].unique_id) {
|
||||
activeIndex = index + 1
|
||||
}
|
||||
})
|
||||
@@ -57,7 +57,7 @@ export default {
|
||||
|
||||
formatedName() {
|
||||
//Name length handling
|
||||
let name = this.fileInfoDetail.name
|
||||
let name = this.fileInfoDetail[0].name
|
||||
let windowWidth = window.innerWidth
|
||||
let nameLength
|
||||
if (windowWidth < 410) {
|
||||
@@ -94,18 +94,18 @@ export default {
|
||||
},
|
||||
downloadItem() {
|
||||
// Download file
|
||||
this.$downloadFile(this.fileInfoDetail.file_url, this.fileInfoDetail.name + '.' + this.fileInfoDetail.mimetype)
|
||||
this.$downloadFile(this.fileInfoDetail[0].file_url, this.fileInfoDetail[0].name + '.' + this.fileInfoDetail[0].mimetype)
|
||||
},
|
||||
shareItem() {
|
||||
if (this.fileInfoDetail.shared) {
|
||||
if (this.fileInfoDetail[0].shared) {
|
||||
events.$emit('popup:open', {
|
||||
name: 'share-edit',
|
||||
item: this.fileInfoDetail
|
||||
item: this.fileInfoDetail[0]
|
||||
})
|
||||
} else {
|
||||
events.$emit('popup:open', {
|
||||
name: 'share-create',
|
||||
item: this.fileInfoDetail
|
||||
item: this.fileInfoDetail[0]
|
||||
})
|
||||
}
|
||||
},
|
||||
@@ -113,7 +113,7 @@ export default {
|
||||
if (this.$isMobile()) {
|
||||
events.$emit('mobileMenu:show', 'showFromMediaPreview')
|
||||
} else {
|
||||
events.$emit('showContextMenuPreview:show', this.fileInfoDetail)
|
||||
events.$emit('showContextMenuPreview:show', this.fileInfoDetail[0])
|
||||
}
|
||||
},
|
||||
closeFullPreview() {
|
||||
|
||||
@@ -1,14 +1,13 @@
|
||||
<template>
|
||||
<div class="media-full-preview" id="mediaPreview" v-if="this.isMedia && fileInfoDetail">
|
||||
<div class="media-full-preview" id="mediaPreview" v-if="this.isMedia && fileInfoDetail[0]">
|
||||
<div class="file-wrapper-preview" v-for="i in [currentIndex]" :key="i">
|
||||
<div class="file-wrapper">
|
||||
<audio class="file audio" :class="{ 'file-shadow': !isMobileDevice }" v-if="fileInfoDetail.type == 'audio'" :src="currentFile.file_url" controlsList="nodownload" controls></audio>
|
||||
<img v-if="fileInfoDetail.type === 'image' && currentFile.thumbnail" class="file" :class="{ 'file-shadow': !isMobileDevice }" id="image" :src="currentFile.file_url" />
|
||||
<div class="video-wrapper" v-if="fileInfoDetail.type === 'video' && currentFile.file_url">
|
||||
<audio class="file audio" :class="{ 'file-shadow': !isMobileDevice }" v-if="fileInfoDetail[0].type == 'audio'" :src="currentFile.file_url" controlsList="nodownload" controls></audio>
|
||||
<img v-if="fileInfoDetail[0].type === 'image' && currentFile.thumbnail" class="file" :class="{ 'file-shadow': !isMobileDevice }" id="image" :src="currentFile.file_url" />
|
||||
<div class="video-wrapper" v-if="fileInfoDetail[0].type === 'video' && currentFile.file_url">
|
||||
<video :src="currentFile.file_url" class="video" :class="{ 'file-shadow': !isMobileDevice }" controlsList="nodownload" disablePictureInPicture playsinline controls />
|
||||
</div>
|
||||
</div>
|
||||
<!-- <spinner class="loading-spinner" v-if="!loaded && fileInfoDetail.type === 'image'" /> -->
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@@ -33,7 +32,7 @@ export default {
|
||||
return this.sliderFile[Math.abs(this.currentIndex) % this.sliderFile.length]
|
||||
},
|
||||
isMedia() {
|
||||
return this.fileInfoDetail === 'image' || 'video' || 'audio'
|
||||
return this.fileInfoDetail[0] === 'image' || 'video' || 'audio'
|
||||
},
|
||||
|
||||
canShareInView() {
|
||||
@@ -57,7 +56,8 @@ export default {
|
||||
},
|
||||
currentFile() {
|
||||
//Handle actual view image in fileInfoDetail
|
||||
if (this.fileInfoDetail) {
|
||||
if (this.fileInfoDetail[0]) {
|
||||
this.$store.commit('CLEAR_FILEINFO_DETAIL')
|
||||
this.$store.commit('GET_FILEINFO_DETAIL', this.currentFile)
|
||||
events.$emit('actualShowingImage:ContextMenu', this.currentFile)
|
||||
// this.loaded = false
|
||||
@@ -65,7 +65,7 @@ export default {
|
||||
},
|
||||
fileInfoDetail() {
|
||||
//File delete handling - show next image after delete one
|
||||
if (!this.fileInfoDetail) {
|
||||
if (!this.fileInfoDetail[0]) {
|
||||
this.currentIndex = this.currentIndex - 1
|
||||
this.$store.commit('GET_FILEINFO_DETAIL', this.currentFile)
|
||||
this.sliderFile = []
|
||||
@@ -83,18 +83,15 @@ export default {
|
||||
methods: {
|
||||
filteredFiles() {
|
||||
this.data.filter((element) => {
|
||||
if (element.type == this.fileInfoDetail.type) {
|
||||
if (element.type == this.fileInfoDetail[0].type) {
|
||||
this.sliderFile.push(element)
|
||||
}
|
||||
})
|
||||
this.choseActiveFile()
|
||||
},
|
||||
// onLoaded(event) {
|
||||
// this.loaded = true
|
||||
// },
|
||||
choseActiveFile() {
|
||||
this.sliderFile.forEach((element, index) => {
|
||||
if (element.unique_id == this.fileInfoDetail.unique_id) {
|
||||
if (element.unique_id == this.fileInfoDetail[0].unique_id) {
|
||||
this.currentIndex = index
|
||||
}
|
||||
})
|
||||
|
||||
@@ -6,6 +6,9 @@
|
||||
<MobileActionButton @click.native="switchPreview" :icon="previewIcon">
|
||||
{{ previewText }}
|
||||
</MobileActionButton>
|
||||
<MobileMultiSelectButton @click.native="mobileMultiSelect = !mobileMultiSelect">
|
||||
Select
|
||||
</MobileMultiSelectButton>
|
||||
<MobileActionButton @click.native="$store.dispatch('emptyTrash')" icon="trash">
|
||||
{{ $t('context_menu.empty_trash') }}
|
||||
</MobileActionButton>
|
||||
@@ -13,13 +16,13 @@
|
||||
|
||||
<!--ContextMenu for Base location with MASTER permission-->
|
||||
<div v-if="$isThisLocation(['base', 'public']) && $checkPermission(['master', 'editor'])" class="mobile-actions">
|
||||
<MobileActionButton @click.native="createFolder" icon="folder-plus">
|
||||
<MobileActionButton @click.native="createFolder" icon="folder-plus" :class="{'is-inactive' : mobileMultiSelect}">
|
||||
{{ $t('context_menu.add_folder') }}
|
||||
</MobileActionButton>
|
||||
<MobileActionButtonUpload>
|
||||
<MobileActionButtonUpload :class="{'is-inactive' : mobileMultiSelect}">
|
||||
{{ $t('context_menu.upload') }}
|
||||
</MobileActionButtonUpload>
|
||||
<MobileMultiSelectButton @click.native="mobileSelecting">
|
||||
<MobileMultiSelectButton @click.native="mobileMultiSelect = !mobileMultiSelect">
|
||||
Select
|
||||
</MobileMultiSelectButton>
|
||||
<MobileActionButton @click.native="switchPreview" :icon="previewIcon">
|
||||
@@ -65,12 +68,29 @@
|
||||
return this.FilePreviewType === 'list' ? this.$t('preview_type.grid') : this.$t('preview_type.list')
|
||||
}
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
mobileMultiSelect: false,
|
||||
turnOff:false
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
mobileMultiSelect () {
|
||||
|
||||
if(this.mobileMultiSelect ) {
|
||||
events.$emit('mobileSelecting-start')
|
||||
// this.mobileMultiSelect = true
|
||||
}
|
||||
if(!this.mobileMultiSelect) {
|
||||
events.$emit('mobileSelecting-stop')
|
||||
// this.mobileSelecting = false
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
mobileSelecting() {
|
||||
events.$emit('mobileSelecting-start')
|
||||
},
|
||||
switchPreview() {
|
||||
this.$store.dispatch('changePreviewType')
|
||||
events.$emit('mobileSelecting-stop')
|
||||
},
|
||||
createFolder() {
|
||||
if (this.$isMobile()) {
|
||||
@@ -84,6 +104,12 @@
|
||||
this.$createFolder(this.$t('popup_create_folder.folder_default_name'))
|
||||
}
|
||||
},
|
||||
},
|
||||
mounted () {
|
||||
events.$on('mobileSelecting-stop', () => {
|
||||
this.mobileMultiSelect = false
|
||||
})
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -100,6 +126,13 @@
|
||||
z-index: 3;
|
||||
}
|
||||
|
||||
.mobile-action-button {
|
||||
&.is-inactive {
|
||||
opacity: 0.25;
|
||||
pointer-events: none;
|
||||
}
|
||||
}
|
||||
|
||||
.mobile-actions {
|
||||
padding-top: 10px;
|
||||
padding-bottom: 10px;
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div class="options-wrapper">
|
||||
<div class="options-wrapper" :class="{'mobile-selected-menu-wrapper' : mobileMultiSelect}">
|
||||
<transition name="context-menu">
|
||||
<div
|
||||
v-if="isVisible"
|
||||
@@ -11,19 +11,26 @@
|
||||
<div class="menu-wrapper">
|
||||
|
||||
<div class="mobile-selected-menu" v-if="mobileMultiSelect">
|
||||
<ToolbarButton
|
||||
source="move"
|
||||
|
||||
:action="$t('actions.move')"
|
||||
@click.native="moveItem"
|
||||
/>
|
||||
<ToolbarButton
|
||||
v-if="
|
||||
!$isThisLocation(['trash', 'trash-root']) &&
|
||||
$checkPermission('master')
|
||||
"
|
||||
source="move"
|
||||
:action="$t('actions.move')"
|
||||
class="move-icon"
|
||||
@click.native="moveItem"/>
|
||||
|
||||
<ToolbarButton
|
||||
source="trash"
|
||||
|
||||
:action="$t('actions.move')"
|
||||
@click.native="moveItem"
|
||||
/>
|
||||
<ToolbarButton
|
||||
source="trash"
|
||||
:action="$t('actions.delete')"
|
||||
@click.native="deleteItem"/>
|
||||
|
||||
<ToolbarButton
|
||||
source="close"
|
||||
:action="$t('actions.close')"
|
||||
class="close-icon"
|
||||
@click.native="closeSelecting"/>
|
||||
</div>
|
||||
|
||||
<!--Item Thumbnail-->
|
||||
@@ -374,13 +381,18 @@ export default {
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
closeSelecting() {
|
||||
events.$emit('mobileSelecting-stop')
|
||||
},
|
||||
moveItem() {
|
||||
// Open move item popup
|
||||
// Open move item popup
|
||||
if(!this.mobileMultiSelect) {
|
||||
events.$emit("popup:open", { name: "move", item: [this.fileInfoDetail[0]] });
|
||||
let item = this.fileInfoDetail[0]
|
||||
this.$store.commit('CLEAR_FILEINFO_DETAIL')
|
||||
events.$emit('popup:open', { name: 'move', item: [item] })
|
||||
}
|
||||
if(this.mobileMultiSelect) {
|
||||
events.$emit("popup:open", { name: "move", item: null });
|
||||
events.$emit('popup:open', { name: 'move', item: [this.fileInfoDetail[0]] })
|
||||
}
|
||||
},
|
||||
shareItem() {
|
||||
@@ -417,7 +429,14 @@ export default {
|
||||
);
|
||||
},
|
||||
deleteItem() {
|
||||
this.$store.dispatch("deleteItem", this.fileInfoDetail[0]);
|
||||
if(!this.mobileMultiSelect) {
|
||||
let item = this.fileInfoDetail[0]
|
||||
this.$store.commit('CLEAR_FILEINFO_DETAIL')
|
||||
this.$store.dispatch("deleteItem", item);
|
||||
}
|
||||
if(this.mobileMultiSelect) {
|
||||
this.$store.dispatch("deleteItem");
|
||||
}
|
||||
},
|
||||
renameItem() {
|
||||
let itemName = prompt(
|
||||
@@ -446,18 +465,22 @@ export default {
|
||||
this.isVisible = false;
|
||||
this.showFromMediaPreview = false;
|
||||
} else {
|
||||
this.isVisible = false;
|
||||
events.$emit("fileItem:deselect");
|
||||
if(!this.mobileMultiSelect) {
|
||||
this.isVisible = false;
|
||||
events.$emit("fileItem:deselect");
|
||||
}
|
||||
}
|
||||
|
||||
// Close context menu
|
||||
// this.isVisible = false;
|
||||
},
|
||||
},
|
||||
created() {
|
||||
events.$on('mobileSelecting-start' , () => {
|
||||
this.mobileMultiSelect = !this.mobileMultiSelect
|
||||
this.isVisible = !this.isVisible
|
||||
this.mobileMultiSelect = true
|
||||
this.isVisible = true
|
||||
})
|
||||
|
||||
events.$on('mobileSelecting-stop' , () => {
|
||||
this.mobileMultiSelect = false
|
||||
this.isVisible = false
|
||||
})
|
||||
// Show context menu
|
||||
events.$on("mobileMenu:show", (showFromMedia) => {
|
||||
@@ -482,6 +505,19 @@ export default {
|
||||
@import "@assets/vue-file-manager/_variables";
|
||||
@import "@assets/vue-file-manager/_mixins";
|
||||
|
||||
.mobile-selected-menu-wrapper {
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.mobile-selected-menu {
|
||||
display: flex;
|
||||
margin-left: 15px;
|
||||
margin-right: 15px;
|
||||
.close-icon {
|
||||
margin-left: auto !important;
|
||||
}
|
||||
}
|
||||
|
||||
.menu-option {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
@@ -28,7 +28,11 @@
|
||||
},
|
||||
mounted() {
|
||||
events.$on('mobileSelecting-start' , () => {
|
||||
this.mobileSelectingActive = !this.mobileSelectingActive
|
||||
this.mobileSelectingActive = true
|
||||
})
|
||||
|
||||
events.$on('mobileSelecting-stop' , () => {
|
||||
this.mobileSelectingActive = false
|
||||
})
|
||||
}
|
||||
}
|
||||
@@ -70,7 +74,7 @@
|
||||
|
||||
.active {
|
||||
// @include transform(scale(0.95));
|
||||
background: rgba($theme, 0.1);
|
||||
// background: rgba($theme, 0.1);
|
||||
|
||||
.icon {
|
||||
path, line, polyline, rect, circle {
|
||||
|
||||
@@ -52,6 +52,7 @@
|
||||
methods: {
|
||||
showMobileNavigation() {
|
||||
events.$emit('show:mobile-navigation')
|
||||
events.$emit('mobileSelecting-stop')
|
||||
},
|
||||
goBack() {
|
||||
|
||||
|
||||
@@ -19,6 +19,7 @@
|
||||
<info-icon v-if="source === 'info'" size="19"></info-icon>
|
||||
<grid-icon v-if="source === 'th'" size="19"></grid-icon>
|
||||
<link-icon v-if="source === 'share'" size="19"></link-icon>
|
||||
<x-icon v-if="source === 'close'" size="19"></x-icon>
|
||||
</button>
|
||||
</template>
|
||||
|
||||
@@ -33,6 +34,7 @@ import {
|
||||
CornerDownRightIcon,
|
||||
LinkIcon,
|
||||
DownloadCloudIcon,
|
||||
XIcon,
|
||||
PrinterIcon,
|
||||
} from "vue-feather-icons";
|
||||
|
||||
@@ -47,6 +49,7 @@ export default {
|
||||
Trash2Icon,
|
||||
Edit2Icon,
|
||||
ListIcon,
|
||||
XIcon,
|
||||
GridIcon,
|
||||
InfoIcon,
|
||||
LinkIcon,
|
||||
|
||||
@@ -15,7 +15,7 @@
|
||||
|
||||
<MultiSelected class="multiple-selected" moveItem="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 :depth="1" :nodes="items" v-for="items in navigation" :key="items.unique_id"/>
|
||||
</div>
|
||||
</PopupContent>
|
||||
|
||||
@@ -108,7 +108,6 @@
|
||||
events.$on('popup:open', args => {
|
||||
|
||||
if (args.name !== 'move') return
|
||||
// console.log(args.item[0])
|
||||
// Show tree spinner
|
||||
this.isLoadingTree = true
|
||||
|
||||
@@ -126,9 +125,6 @@
|
||||
this.pickedItem = this.fileInfoDetail[0]
|
||||
this.noSelectedItem = false
|
||||
}
|
||||
|
||||
// this.pickedItem = args.item[0]
|
||||
// this.totalItems = args.item
|
||||
})
|
||||
|
||||
// Close popup
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<!--Folder Icon-->
|
||||
<div class="folder-item-wrapper" :class="{'is-inactive': disabledById && disabledById === nodes.unique_id}">
|
||||
<div class="folder-item-wrapper" :class="{'is-inactive': !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>
|
||||
@@ -9,7 +9,7 @@
|
||||
<span class="label">{{ nodes.name }}</span>
|
||||
</div>
|
||||
|
||||
<TreeMenu :disabled-by-id="disabledById" :depth="depth + 1" v-if="isVisible" :nodes="item" v-for="item in nodes.folders" :key="item.unique_id" />
|
||||
<TreeMenu :depth="depth + 1" v-if="isVisible" :nodes="item" v-for="item in nodes.folders" :key="item.unique_id" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -17,11 +17,12 @@
|
||||
import TreeMenu from '@/components/Others/TreeMenu'
|
||||
import {FolderIcon, ChevronRightIcon, HardDriveIcon} from 'vue-feather-icons'
|
||||
import {events} from "@/bus"
|
||||
import {mapGetters} from 'vuex'
|
||||
|
||||
export default {
|
||||
name: 'TreeMenu',
|
||||
props: [
|
||||
'nodes', 'depth', 'disabledById'
|
||||
'nodes', 'depth',
|
||||
],
|
||||
components: {
|
||||
ChevronRightIcon,
|
||||
@@ -30,9 +31,20 @@
|
||||
TreeMenu,
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['fileInfoDetail']),
|
||||
indent() {
|
||||
return { paddingLeft: this.depth * 20 + 'px' }
|
||||
console.log(this.nodes )
|
||||
},
|
||||
disableId() {
|
||||
let canBeShow = true
|
||||
this.fileInfoDetail.map(item => {
|
||||
if(item.unique_id === this.nodes.unique_id) {
|
||||
canBeShow = false
|
||||
}
|
||||
})
|
||||
return canBeShow
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
||||
@@ -5,7 +5,8 @@
|
||||
"move": "Move item",
|
||||
"preview": "更改预览",
|
||||
"share": "Share item",
|
||||
"upload": "上传文件"
|
||||
"upload": "上传文件",
|
||||
"close": "Close"
|
||||
},
|
||||
"activation": {
|
||||
"stripe": {
|
||||
|
||||
@@ -7,7 +7,8 @@
|
||||
"share": "Share item",
|
||||
"upload": "Upload file",
|
||||
"download": "Download item",
|
||||
"print": "Print item"
|
||||
"print": "Print item",
|
||||
"close": "Close"
|
||||
},
|
||||
"activation": {
|
||||
"stripe": {
|
||||
|
||||
@@ -7,7 +7,8 @@
|
||||
"share": "Zdieľať položku",
|
||||
"upload": "Nahrať súbory",
|
||||
"download": "Stiahnuť položku",
|
||||
"print": "Vytlačiť položku"
|
||||
"print": "Vytlačiť položku",
|
||||
"close": "Zatvoriť"
|
||||
},
|
||||
"activation": {
|
||||
"stripe": {
|
||||
|
||||
2
resources/js/store/modules/fileFunctions.js
vendored
2
resources/js/store/modules/fileFunctions.js
vendored
@@ -25,8 +25,6 @@ const actions = {
|
||||
})
|
||||
})
|
||||
|
||||
console.log(items)
|
||||
|
||||
// Get route
|
||||
let route = getters.sharedDetail && ! getters.sharedDetail.protected
|
||||
? '/api/move/public' + router.currentRoute.params.token
|
||||
|
||||
Reference in New Issue
Block a user