mirror of
https://github.com/VueFileManager/vuefilemanager.git
synced 2026-04-18 08:12:15 +00:00
UI improvements part 2
This commit is contained in:
@@ -76,7 +76,8 @@
|
||||
<div v-if="actions.length !== 0" class="mb-2">
|
||||
<div v-for="(result, i) in actions" :key="result.action.value" class="relative">
|
||||
<div
|
||||
class="flex items-center px-3.5 py-2.5"
|
||||
@mousedown="openAction(result)"
|
||||
class="flex items-center px-3.5 py-2.5 cursor-pointer"
|
||||
:class="{'dark:bg-4x-dark-foreground bg-light-background rounded-xl': i === index}"
|
||||
>
|
||||
<settings-icon v-if="['AppOthers', 'Profile', 'Password'].includes(result.action.value)" size="18" class="vue-feather text-theme"/>
|
||||
|
||||
21
resources/js/helpers/itemHelpers.js
vendored
21
resources/js/helpers/itemHelpers.js
vendored
@@ -36,7 +36,7 @@ const itemHelpers = {
|
||||
})
|
||||
}
|
||||
|
||||
Vue.prototype.$downloadSelection = function (item) {
|
||||
Vue.prototype.$downloadSelection = function (item = undefined) {
|
||||
// Show alert message when download is disabled
|
||||
if (! store.getters.user.data.meta.restrictions.canDownload) {
|
||||
Vue.prototype.$temporarilyDisabledDownload()
|
||||
@@ -44,12 +44,25 @@ const itemHelpers = {
|
||||
return
|
||||
}
|
||||
|
||||
// Download folder zip
|
||||
if (item && item.data.type === 'folder') {
|
||||
store.dispatch('downloadZip', item)
|
||||
|
||||
return
|
||||
}
|
||||
|
||||
// Download single item
|
||||
if (item && item.data.type !== 'folder') {
|
||||
Vue.prototype.$downloadFile(item.data.attributes.file_url, item.data.attributes.name + '.' + item.data.attributes.mimetype)
|
||||
|
||||
return
|
||||
}
|
||||
|
||||
// Download selection
|
||||
let clipboard = store.getters.clipboard
|
||||
|
||||
if (clipboard.length > 1 || (clipboard.length === 1 && clipboard[0].data.type === 'folder'))
|
||||
if (clipboard.length > 1 || (clipboard.length === 1 && clipboard[0].data.type === 'folder')) {
|
||||
store.dispatch('downloadZip')
|
||||
else {
|
||||
Vue.prototype.$downloadFile(item.data.attributes.file_url, item.data.attributes.name + '.' + item.data.attributes.mimetype)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
28
resources/js/store/modules/fileFunctions.js
vendored
28
resources/js/store/modules/fileFunctions.js
vendored
@@ -14,25 +14,31 @@ const defaultState = {
|
||||
}
|
||||
|
||||
const actions = {
|
||||
downloadZip: ({getters}) => {
|
||||
downloadZip: ({getters}, item = undefined) => {
|
||||
let files = []
|
||||
|
||||
// get ids of selected files
|
||||
getters.clipboard.forEach(file => {
|
||||
let type = file.data.type === 'folder'
|
||||
? 'folder'
|
||||
: 'file'
|
||||
// Get if from retrieved item
|
||||
if (item) {
|
||||
files.push(item.data.id + '|folder')
|
||||
}
|
||||
|
||||
files.push(file.data.id + '|' + type)
|
||||
})
|
||||
// Get ids of selected files
|
||||
if (! item) {
|
||||
getters.clipboard.forEach(file => {
|
||||
let type = file.data.type === 'folder'
|
||||
? 'folder'
|
||||
: 'file'
|
||||
|
||||
let items = files.join(',')
|
||||
files.push(file.data.id + '|' + type)
|
||||
})
|
||||
}
|
||||
|
||||
// Get route
|
||||
let route = getters.sharedDetail
|
||||
? `/api/zip/${router.currentRoute.params.token}?items=${items}`
|
||||
: `/api/zip?items=${items}`
|
||||
? `/api/zip/${router.currentRoute.params.token}?items=${files.join(',')}`
|
||||
: `/api/zip?items=${files.join(',')}`
|
||||
|
||||
// Download zip
|
||||
Vue.prototype.$downloadFile(route, 'files.zip')
|
||||
},
|
||||
moveItem: ({commit, getters, dispatch}, {to_item, noSelectedItem}) => {
|
||||
|
||||
@@ -38,7 +38,7 @@
|
||||
</ContentGroup>
|
||||
</ContentSidebar>
|
||||
|
||||
<router-view class="md:px-6 px-2.5 w-full overflow-x-hidden relative lg:pt-6" />
|
||||
<router-view class="lg:pt-6 md:px-6 px-2.5 lg:pb-0 pb-12 w-full overflow-x-hidden relative" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
@@ -76,7 +76,7 @@
|
||||
<Option @click.native="$deleteFileOrFolder(item)" :title="$t('context_menu.delete')" icon="trash" />
|
||||
</OptionGroup>
|
||||
<OptionGroup>
|
||||
<Option @click.native="$downloadSelection(item)" :title="$t('context_menu.download')" icon="download" />
|
||||
<Option @click.native="$downloadSelection()" :title="$t('context_menu.download')" icon="download" />
|
||||
</OptionGroup>
|
||||
</template>
|
||||
</ContextMenu>
|
||||
|
||||
@@ -27,7 +27,7 @@
|
||||
<Option @click.native="$deleteFileOrFolder(item)" :title="$t('context_menu.delete')" icon="trash" />
|
||||
</OptionGroup>
|
||||
<OptionGroup>
|
||||
<Option @click.native="$downloadSelection(item)" :title="$t('context_menu.download')" icon="download" />
|
||||
<Option @click.native="$downloadSelection()" :title="$t('context_menu.download')" icon="download" />
|
||||
</OptionGroup>
|
||||
</template>
|
||||
</ContextMenu>
|
||||
|
||||
@@ -68,7 +68,7 @@
|
||||
<Option @click.native="$deleteFileOrFolder(item)" :title="$t('context_menu.delete')" icon="trash" />
|
||||
</OptionGroup>
|
||||
<OptionGroup>
|
||||
<Option @click.native="$downloadSelection(item)" :title="$t('context_menu.download')" icon="download" />
|
||||
<Option @click.native="$downloadSelection()" :title="$t('context_menu.download')" icon="download" />
|
||||
</OptionGroup>
|
||||
</template>
|
||||
</ContextMenu>
|
||||
|
||||
@@ -22,7 +22,7 @@
|
||||
<Option @click.native="$deleteFileOrFolder(item)" :title="$t('context_menu.delete')" icon="trash" />
|
||||
</OptionGroup>
|
||||
<OptionGroup>
|
||||
<Option @click.native="$downloadSelection(item)" :title="$t('context_menu.download')" icon="download" />
|
||||
<Option @click.native="$downloadSelection()" :title="$t('context_menu.download')" icon="download" />
|
||||
</OptionGroup>
|
||||
</template>
|
||||
</ContextMenu>
|
||||
|
||||
@@ -62,7 +62,7 @@
|
||||
<Option @click.native="$deleteFileOrFolder(item)" :title="$t('context_menu.delete')" icon="trash" />
|
||||
</OptionGroup>
|
||||
<OptionGroup>
|
||||
<Option @click.native="$downloadSelection(item)" :title="$t('context_menu.download')" icon="download" />
|
||||
<Option @click.native="$downloadSelection()" :title="$t('context_menu.download')" icon="download" />
|
||||
</OptionGroup>
|
||||
</template>
|
||||
</ContextMenu>
|
||||
|
||||
@@ -84,7 +84,7 @@
|
||||
<Option @click.native="$deleteFileOrFolder(item)" :title="$t('context_menu.delete')" icon="trash" />
|
||||
</OptionGroup>
|
||||
<OptionGroup>
|
||||
<Option @click.native="$downloadSelection(item)" :title="$t('context_menu.download')" icon="download" />
|
||||
<Option @click.native="$downloadSelection()" :title="$t('context_menu.download')" icon="download" />
|
||||
</OptionGroup>
|
||||
</template>
|
||||
</ContextMenu>
|
||||
|
||||
@@ -26,7 +26,7 @@
|
||||
<Option @click.native="$emptyTrash" :title="$t('context_menu.empty_trash')" icon="empty-trash" />
|
||||
</OptionGroup>
|
||||
<OptionGroup>
|
||||
<Option @click.native="$downloadSelection(item)" :title="$t('context_menu.download')" icon="download" />
|
||||
<Option @click.native="$downloadSelection()" :title="$t('context_menu.download')" icon="download" />
|
||||
</OptionGroup>
|
||||
</template>
|
||||
</ContextMenu>
|
||||
|
||||
@@ -26,7 +26,7 @@
|
||||
|
||||
<MobileNavigationToolbar />
|
||||
|
||||
<div v-if="user" class="md:px-6 px-2.5 w-full overflow-x-hidden relative lg:pt-6 xl:max-w-screen-lg md:max-w-4xl mx-auto">
|
||||
<div v-if="user" class="lg:pt-6 md:px-6 px-2.5 lg:pb-0 pb-12 w-full overflow-x-hidden relative xl:max-w-screen-lg md:max-w-4xl mx-auto">
|
||||
<div v-if="! isLoading" id="page-content">
|
||||
|
||||
<div class="card shadow-card sticky top-0 z-10" style="padding-bottom: 0">
|
||||
|
||||
Reference in New Issue
Block a user