mirror of
https://github.com/VueFileManager/vuefilemanager.git
synced 2026-04-22 17:32:14 +00:00
deleted frontend code
This commit is contained in:
Čarodej
@@ -12,27 +12,14 @@
|
||||
:title="item.data.relationships.shared ? $t('edit_sharing') : $t('share')"
|
||||
icon="share"
|
||||
/>
|
||||
<Option
|
||||
@click.native="$convertAsTeamFolder(item)"
|
||||
v-if="isFolder"
|
||||
:title="$t('convert_as_team_folder')"
|
||||
icon="users"
|
||||
/>
|
||||
<Option
|
||||
@click.native="$createFileRequest(item)"
|
||||
v-if="isFolder"
|
||||
:title="$t('file_request')"
|
||||
icon="upload-cloud"
|
||||
/>
|
||||
</OptionGroup>
|
||||
|
||||
<OptionGroup v-if="item">
|
||||
<Option @click.native="$downloadSelection(item)" :title="$t('download')" icon="download" />
|
||||
</OptionGroup>
|
||||
</MobileContextMenu>
|
||||
|
||||
<MobileCreateMenu>
|
||||
<OptionGroup :title="$t('frequently_used')">
|
||||
<OptionGroup :title="$t('create')">
|
||||
<OptionUpload
|
||||
:title="$t('upload_files')"
|
||||
type="file"
|
||||
@@ -45,25 +32,6 @@
|
||||
:is-hover-disabled="true"
|
||||
/>
|
||||
</OptionGroup>
|
||||
<OptionGroup :title="$t('others')">
|
||||
<Option
|
||||
@click.stop.native="$openRemoteUploadPopup"
|
||||
:title="$t('remote_upload')"
|
||||
icon="remote-upload"
|
||||
/>
|
||||
<Option
|
||||
@click.stop.native="$createTeamFolder"
|
||||
:title="$t('create_team_folder')"
|
||||
icon="users"
|
||||
:is-hover-disabled="true"
|
||||
/>
|
||||
<Option
|
||||
@click.native="$createFileRequest"
|
||||
:title="$t('create_file_request')"
|
||||
icon="upload-cloud"
|
||||
:is-hover-disabled="true"
|
||||
/>
|
||||
</OptionGroup>
|
||||
</MobileCreateMenu>
|
||||
|
||||
<MobileMultiSelectToolbar>
|
||||
@@ -132,18 +100,6 @@
|
||||
"
|
||||
icon="share"
|
||||
/>
|
||||
<Option
|
||||
@click.native="$convertAsTeamFolder(item)"
|
||||
v-if="isFolder"
|
||||
:title="$t('convert_as_team_folder')"
|
||||
icon="user-plus"
|
||||
/>
|
||||
<Option
|
||||
@click.native="$createFileRequest(item)"
|
||||
v-if="isFolder"
|
||||
:title="$t('file_request')"
|
||||
icon="upload-cloud"
|
||||
/>
|
||||
</OptionGroup>
|
||||
<OptionGroup>
|
||||
<Option @click.native="$openInDetailPanel(item)" :title="$t('detail')" icon="detail" />
|
||||
|
||||
@@ -1,275 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<MobileContextMenu>
|
||||
<OptionGroup v-if="canEdit && item">
|
||||
<Option @click.native="$renameFileOrFolder(item)" :title="$t('rename')" icon="rename" />
|
||||
<Option @click.native="$moveFileOrFolder(item)" :title="$t('move')" icon="move-item" />
|
||||
<Option @click.native="$deleteFileOrFolder(item)" :title="$t('delete')" icon="trash" />
|
||||
</OptionGroup>
|
||||
<OptionGroup v-if="item">
|
||||
<Option @click.native="$downloadSelection(item)" :title="$t('download')" icon="download" />
|
||||
</OptionGroup>
|
||||
</MobileContextMenu>
|
||||
|
||||
<MobileCreateMenu>
|
||||
<OptionGroup :title="$t('frequently_used')">
|
||||
<OptionUpload :title="$t('upload_files')" type="file" :is-hover-disabled="true" />
|
||||
<Option
|
||||
@click.stop.native="createFolder"
|
||||
:title="$t('create_folder')"
|
||||
icon="folder-plus"
|
||||
:is-hover-disabled="true"
|
||||
/>
|
||||
</OptionGroup>
|
||||
<OptionGroup :title="$t('others')">
|
||||
<Option
|
||||
@click.stop.native="$openRemoteUploadPopup"
|
||||
:title="$t('remote_upload')"
|
||||
icon="remote-upload"
|
||||
:class="{'is-inactive': isTeamFolderHomepage}"
|
||||
/>
|
||||
</OptionGroup>
|
||||
</MobileCreateMenu>
|
||||
|
||||
<MobileTeamContextMenu>
|
||||
<OptionGroup>
|
||||
<Option
|
||||
@click.native="$detachMeFromTeamFolder(teamFolder)"
|
||||
:title="$t('leave_team_folder')"
|
||||
icon="user-minus"
|
||||
/>
|
||||
</OptionGroup>
|
||||
</MobileTeamContextMenu>
|
||||
|
||||
<MobileMultiSelectToolbar>
|
||||
<ToolbarButton
|
||||
v-if="canEdit"
|
||||
@click.native="$moveFileOrFolder(clipboard)"
|
||||
class="mr-4"
|
||||
source="move"
|
||||
:action="$t('move')"
|
||||
:class="{ 'is-inactive': clipboard.length < 1 }"
|
||||
/>
|
||||
<ToolbarButton
|
||||
v-if="canEdit"
|
||||
@click.native="$deleteFileOrFolder()"
|
||||
class="mr-4"
|
||||
source="trash"
|
||||
:class="{ 'is-inactive': clipboard.length < 1 }"
|
||||
:action="$t('delete')"
|
||||
/>
|
||||
<ToolbarButton
|
||||
@click.native="$downloadSelection(item)"
|
||||
source="download"
|
||||
:action="$t('download_item')"
|
||||
/>
|
||||
</MobileMultiSelectToolbar>
|
||||
|
||||
<ContextMenu>
|
||||
<template v-slot:empty-select v-if="canEdit">
|
||||
<OptionGroup v-if="!isTeamFolderHomepage">
|
||||
<OptionUpload :title="$t('upload_files')" type="file" />
|
||||
<OptionUpload :title="$t('upload_folder')" type="folder" />
|
||||
</OptionGroup>
|
||||
<OptionGroup v-if="!isTeamFolderHomepage">
|
||||
<Option
|
||||
@click.native="$createFolder"
|
||||
:title="$t('create_folder')"
|
||||
icon="folder-plus"
|
||||
/>
|
||||
</OptionGroup>
|
||||
</template>
|
||||
|
||||
<template v-slot:single-select v-if="item">
|
||||
<OptionGroup v-if="canEdit">
|
||||
<Option
|
||||
@click.native="$renameFileOrFolder(item)"
|
||||
:title="$t('rename')"
|
||||
icon="rename"
|
||||
/>
|
||||
<Option @click.native="$moveFileOrFolder(item)" :title="$t('move')" icon="move-item" />
|
||||
<Option @click.native="$deleteFileOrFolder(item)" :title="$t('delete')" icon="trash" />
|
||||
</OptionGroup>
|
||||
<OptionGroup>
|
||||
<Option @click.native="$openInDetailPanel(item)" :title="$t('detail')" icon="detail" />
|
||||
<Option
|
||||
@click.native="$downloadSelection(item)"
|
||||
:title="$t('download')"
|
||||
icon="download"
|
||||
/>
|
||||
</OptionGroup>
|
||||
</template>
|
||||
|
||||
<template v-slot:multiple-select v-if="item">
|
||||
<OptionGroup v-if="canEdit">
|
||||
<Option @click.native="$moveFileOrFolder(item)" :title="$t('move')" icon="move-item" />
|
||||
<Option @click.native="$deleteFileOrFolder(item)" :title="$t('delete')" icon="trash" />
|
||||
</OptionGroup>
|
||||
<OptionGroup>
|
||||
<Option @click.native="$downloadSelection()" :title="$t('download')" icon="download" />
|
||||
</OptionGroup>
|
||||
</template>
|
||||
</ContextMenu>
|
||||
|
||||
<FileActionsMobile>
|
||||
<MobileActionButton @click.native="$openSpotlight()" icon="search">
|
||||
{{ $t('spotlight') }}
|
||||
</MobileActionButton>
|
||||
<MobileActionButton @click.native="$showMobileMenu('file-filter')" icon="filter">
|
||||
{{ $getCurrentSectionName() }}
|
||||
</MobileActionButton>
|
||||
<MobileActionButton v-if="canEdit" @click.native="$showMobileMenu('create-list')" icon="cloud-plus">
|
||||
{{ $t('upload_or_create') }}
|
||||
</MobileActionButton>
|
||||
<MobileActionButton @click.native="$enableMultiSelectMode" icon="check-square">
|
||||
{{ $t('select') }}
|
||||
</MobileActionButton>
|
||||
<MobileActionButton @click.native="$showMobileMenu('file-sorting')" icon="preview-sorting">
|
||||
{{ $t('preview_sorting.preview_sorting_button') }}
|
||||
</MobileActionButton>
|
||||
</FileActionsMobile>
|
||||
|
||||
<EmptyFilePage>
|
||||
<!--Homepage-->
|
||||
<template v-if="isTeamFolderHomepage">
|
||||
<h1 class="title">
|
||||
{{ $t('nothing_shared_with_you') }}
|
||||
</h1>
|
||||
<p class="description">
|
||||
{{ $t('nothing_shared_with_you_description') }}
|
||||
</p>
|
||||
</template>
|
||||
|
||||
<!--Empty folder wit can-edit privileges -->
|
||||
<template v-if="canEdit && !isTeamFolderHomepage">
|
||||
<h1 class="title">
|
||||
{{ $t('empty_page.title') }}
|
||||
</h1>
|
||||
<p class="description">
|
||||
{{ $t('empty_page.description') }}
|
||||
</p>
|
||||
<ButtonUpload button-style="theme">
|
||||
{{ $t('empty_page.call_to_action') }}
|
||||
</ButtonUpload>
|
||||
</template>
|
||||
|
||||
<!--Empty folder wit can-view privileges -->
|
||||
<template v-if="!canEdit && !isTeamFolderHomepage">
|
||||
<h1 class="title">
|
||||
{{ $t('there_is_nothing') }}
|
||||
</h1>
|
||||
</template>
|
||||
</EmptyFilePage>
|
||||
|
||||
<FileBrowser />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import MobileTeamContextMenu from '../../components/Menus/MobileTeamContextMenu'
|
||||
import EmptyFilePage from '../../components/EntriesView/EmptyFilePage'
|
||||
import FileActionsMobile from '../../components/Mobile/FileActionsMobile'
|
||||
import MobileActionButtonUpload from '../../components/UI/Buttons/MobileActionButtonUpload'
|
||||
import MobileMultiSelectToolbar from '../../components/Layout/Toolbars/MobileMultiSelectToolbar'
|
||||
import MobileActionButton from '../../components/UI/Buttons/MobileActionButton'
|
||||
import MobileContextMenu from '../../components/Menus/MobileContextMenu'
|
||||
import MobileCreateMenu from '../../components/Menus/MobileCreateMenu'
|
||||
import ButtonUpload from '../../components/UI/Buttons/ButtonUpload'
|
||||
import ToolbarButton from '../../components/UI/Buttons/ToolbarButton'
|
||||
import OptionUpload from '../../components/Menus/Components/OptionUpload'
|
||||
import FileBrowser from '../../components/EntriesView/FileBrowser'
|
||||
import ContextMenu from '../../components/Menus/ContextMenu'
|
||||
import OptionGroup from '../../components/Menus/Components/OptionGroup'
|
||||
import ButtonBase from '../../components/UI/Buttons/ButtonBase'
|
||||
import Option from '../../components/Menus/Components/Option'
|
||||
import { mapGetters } from 'vuex'
|
||||
import { events } from '../../bus'
|
||||
|
||||
export default {
|
||||
name: 'SharedWithMe',
|
||||
components: {
|
||||
MobileActionButtonUpload,
|
||||
MobileMultiSelectToolbar,
|
||||
MobileTeamContextMenu,
|
||||
MobileActionButton,
|
||||
MobileContextMenu,
|
||||
MobileCreateMenu,
|
||||
ToolbarButton,
|
||||
ButtonUpload,
|
||||
OptionUpload,
|
||||
OptionGroup,
|
||||
FileBrowser,
|
||||
ContextMenu,
|
||||
ButtonBase,
|
||||
Option,
|
||||
FileActionsMobile,
|
||||
EmptyFilePage,
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['currentTeamFolder', 'clipboard', 'config', 'user']),
|
||||
teamFolder() {
|
||||
return this.currentTeamFolder ? this.currentTeamFolder : this.clipboard[0]
|
||||
},
|
||||
canEdit() {
|
||||
if (this.currentTeamFolder && this.user) {
|
||||
let member = this.currentTeamFolder.data.relationships.members.data.find(
|
||||
(member) => member.data.id === this.user.data.id
|
||||
)
|
||||
|
||||
return member.data.attributes.permission === 'can-edit'
|
||||
}
|
||||
|
||||
return false
|
||||
},
|
||||
isTeamFolderHomepage() {
|
||||
return this.$isThisRoute(this.$route, ['SharedWithMe']) && !this.$route.params.id
|
||||
},
|
||||
isFolder() {
|
||||
return this.item && this.item.data.type === 'folder'
|
||||
},
|
||||
hasFile() {
|
||||
return this.clipboard.find((item) => item.type !== 'folder')
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
item: undefined,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
createFolder() {
|
||||
events.$emit('popup:open', { name: 'create-folder' })
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.$store.dispatch('getSharedWithMeFolder', this.$route.params.id)
|
||||
|
||||
events.$on('context-menu:show', (event, item) => (this.item = item))
|
||||
events.$on('mobile-context-menu:show', (item) => (this.item = item))
|
||||
events.$on('context-menu:current-folder', (folder) => (this.item = folder))
|
||||
|
||||
events.$on('action:confirmed', (data) => {
|
||||
// Leave team folder after popup confirmation
|
||||
if (data.operation === 'leave-team-folder')
|
||||
axios
|
||||
.delete(`/api/teams/folders/${data.id}/leave`)
|
||||
.then(() => {
|
||||
if (this.$route.params.id) {
|
||||
this.$router.push({ name: 'SharedWithMe' })
|
||||
} else {
|
||||
this.$store.dispatch('getSharedWithMeFolder', undefined)
|
||||
}
|
||||
|
||||
events.$emit('toaster', {
|
||||
type: 'success',
|
||||
message: this.$t('you_left_team_folder'),
|
||||
})
|
||||
})
|
||||
.catch(() => this.$isSomethingWrong())
|
||||
})
|
||||
},
|
||||
destroyed() {
|
||||
events.$off('action:confirmed')
|
||||
},
|
||||
}
|
||||
</script>
|
||||
@@ -1,325 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<MobileContextMenu>
|
||||
<OptionGroup v-if="item">
|
||||
<Option @click.native="$renameFileOrFolder(item)" :title="$t('rename')" icon="rename" />
|
||||
<Option @click.native="$moveFileOrFolder(item)" :title="$t('move')" icon="move-item" :class="{'is-inactive': isTeamFolderHomepage}" />
|
||||
<Option @click.native="$deleteFileOrFolder(item)" :title="$t('delete')" icon="trash" :class="{'is-inactive': isTeamFolderHomepage}" />
|
||||
</OptionGroup>
|
||||
<OptionGroup v-if="item">
|
||||
<Option
|
||||
@click.native="$shareFileOrFolder(item)"
|
||||
:title="item.data.relationships.shared ? $t('edit_sharing') : $t('share')"
|
||||
icon="share"
|
||||
/>
|
||||
<Option
|
||||
@click.native="$updateTeamFolder(item)"
|
||||
v-if="isFolder && (isTeamFolderHomepage || currentTeamFolder.data.id === item.data.id)"
|
||||
:title="$t('edit_team_members')"
|
||||
icon="users"
|
||||
/>
|
||||
<Option
|
||||
@click.native="$createFileRequest(item)"
|
||||
v-if="isFolder"
|
||||
:title="$t('file_request')"
|
||||
icon="upload-cloud"
|
||||
/>
|
||||
</OptionGroup>
|
||||
|
||||
<OptionGroup v-if="item">
|
||||
<Option @click.native="$downloadSelection(item)" :title="$t('download')" icon="download" />
|
||||
</OptionGroup>
|
||||
</MobileContextMenu>
|
||||
|
||||
<MobileCreateMenu>
|
||||
<OptionGroup :title="$t('frequently_used')">
|
||||
<OptionUpload :title="$t('upload_files')" type="file" :is-hover-disabled="true" :class="{'is-inactive': isTeamFolderHomepage}" />
|
||||
<Option
|
||||
@click.stop.native="$createFolderByPopup"
|
||||
:title="$t('create_folder')"
|
||||
icon="folder-plus"
|
||||
:is-hover-disabled="true"
|
||||
:class="{'is-inactive': isTeamFolderHomepage}"
|
||||
/>
|
||||
</OptionGroup>
|
||||
<OptionGroup :title="$t('others')">
|
||||
<Option
|
||||
@click.stop.native="$openRemoteUploadPopup"
|
||||
:title="$t('remote_upload')"
|
||||
icon="remote-upload"
|
||||
:class="{'is-inactive': isTeamFolderHomepage}"
|
||||
/>
|
||||
<Option
|
||||
@click.stop.native="$createTeamFolder"
|
||||
:title="$t('create_team_folder')"
|
||||
icon="users"
|
||||
:is-hover-disabled="true"
|
||||
/>
|
||||
</OptionGroup>
|
||||
</MobileCreateMenu>
|
||||
|
||||
<MobileTeamContextMenu>
|
||||
<OptionGroup>
|
||||
<Option @click.native="$updateTeamFolder(teamFolder)" :title="$t('edit_members')" icon="rename" />
|
||||
<Option @click.native="$dissolveTeamFolder(teamFolder)" :title="$t('dissolve_team')" icon="trash" />
|
||||
</OptionGroup>
|
||||
</MobileTeamContextMenu>
|
||||
|
||||
<MobileMultiSelectToolbar>
|
||||
<ToolbarButton
|
||||
@click.native="$moveFileOrFolder(clipboard)"
|
||||
class="mr-4"
|
||||
source="move"
|
||||
:action="$t('move')"
|
||||
:class="{ 'is-inactive': clipboard.length < 1 }"
|
||||
/>
|
||||
<ToolbarButton
|
||||
@click.native="$deleteFileOrFolder()"
|
||||
class="mr-4"
|
||||
source="trash"
|
||||
:class="{ 'is-inactive': clipboard.length < 1 }"
|
||||
:action="$t('delete')"
|
||||
/>
|
||||
<ToolbarButton
|
||||
@click.native="$downloadSelection(item)"
|
||||
source="download"
|
||||
:action="$t('download_item')"
|
||||
/>
|
||||
</MobileMultiSelectToolbar>
|
||||
|
||||
<ContextMenu>
|
||||
<template v-slot:empty-select>
|
||||
<OptionGroup v-if="!isTeamFolderHomepage">
|
||||
<OptionUpload :title="$t('upload_files')" type="file" />
|
||||
<OptionUpload :title="$t('upload_folder')" type="folder" />
|
||||
<Option
|
||||
@click.native="$createFolder"
|
||||
:title="$t('create_folder')"
|
||||
icon="folder-plus"
|
||||
/>
|
||||
</OptionGroup>
|
||||
<OptionGroup v-if="isTeamFolderHomepage">
|
||||
<Option @click.native="$createTeamFolder" :title="$t('create_team_folder')" icon="users" />
|
||||
</OptionGroup>
|
||||
</template>
|
||||
|
||||
<template v-slot:single-select v-if="item">
|
||||
<OptionGroup v-if="isFolder">
|
||||
<Option
|
||||
@click.native="$toggleFavourites(item)"
|
||||
:title="
|
||||
isInFavourites
|
||||
? $t('remove_favourite')
|
||||
: $t('add_to_favourites')
|
||||
"
|
||||
icon="favourites"
|
||||
/>
|
||||
</OptionGroup>
|
||||
<OptionGroup>
|
||||
<Option
|
||||
@click.native="$renameFileOrFolder(item)"
|
||||
:title="$t('rename')"
|
||||
icon="rename"
|
||||
/>
|
||||
<Option @click.native="$moveFileOrFolder(item)" :title="$t('move')" icon="move-item" :class="{'is-inactive': isTeamFolderHomepage}" />
|
||||
<Option @click.native="$deleteFileOrFolder(item)" :title="$t('delete')" icon="trash" :class="{'is-inactive': isTeamFolderHomepage}" />
|
||||
</OptionGroup>
|
||||
<OptionGroup>
|
||||
<Option
|
||||
@click.native="$shareFileOrFolder(item)"
|
||||
:title="
|
||||
item.data.relationships.shared ? $t('edit_sharing') : $t('share')
|
||||
"
|
||||
icon="share"
|
||||
/>
|
||||
<Option
|
||||
@click.native="$updateTeamFolder(item)"
|
||||
v-if="isFolder"
|
||||
:title="$t('edit_team_members')"
|
||||
icon="users"
|
||||
/>
|
||||
<Option
|
||||
@click.native="$createFileRequest(item)"
|
||||
v-if="isFolder"
|
||||
:title="$t('file_request')"
|
||||
icon="upload-cloud"
|
||||
/>
|
||||
</OptionGroup>
|
||||
<OptionGroup>
|
||||
<Option @click.native="$openInDetailPanel(item)" :title="$t('detail')" icon="detail" />
|
||||
<Option
|
||||
@click.native="$downloadSelection(item)"
|
||||
:title="$t('download')"
|
||||
icon="download"
|
||||
/>
|
||||
</OptionGroup>
|
||||
</template>
|
||||
|
||||
<template v-slot:multiple-select v-if="item">
|
||||
<OptionGroup v-if="!hasFile">
|
||||
<Option
|
||||
@click.native="$toggleFavourites(item)"
|
||||
:title="
|
||||
isInFavourites
|
||||
? $t('remove_favourite')
|
||||
: $t('add_to_favourites')
|
||||
"
|
||||
icon="favourites"
|
||||
/>
|
||||
</OptionGroup>
|
||||
<OptionGroup>
|
||||
<Option @click.native="$moveFileOrFolder(item)" :title="$t('move')" icon="move-item" />
|
||||
<Option @click.native="$deleteFileOrFolder(item)" :title="$t('delete')" icon="trash" />
|
||||
</OptionGroup>
|
||||
<OptionGroup>
|
||||
<Option @click.native="$downloadSelection()" :title="$t('download')" icon="download" />
|
||||
</OptionGroup>
|
||||
</template>
|
||||
</ContextMenu>
|
||||
|
||||
<FileActionsMobile>
|
||||
<MobileActionButton @click.native="$openSpotlight()" icon="search">
|
||||
{{ $t('spotlight') }}
|
||||
</MobileActionButton>
|
||||
<MobileActionButton @click.native="$showMobileMenu('file-filter')" icon="filter">
|
||||
{{ $getCurrentSectionName() }}
|
||||
</MobileActionButton>
|
||||
<MobileActionButton
|
||||
@click.native="$showMobileMenu('create-list')"
|
||||
v-if="$checkPermission(['master', 'editor'])"
|
||||
icon="cloud-plus"
|
||||
>
|
||||
{{ $t('upload_or_create') }}
|
||||
</MobileActionButton>
|
||||
<MobileActionButton @click.native="$enableMultiSelectMode" icon="check-square">
|
||||
{{ $t('select') }}
|
||||
</MobileActionButton>
|
||||
<MobileActionButton @click.native="$showMobileMenu('file-sorting')" icon="preview-sorting">
|
||||
{{ $t('preview_sorting.preview_sorting_button') }}
|
||||
</MobileActionButton>
|
||||
</FileActionsMobile>
|
||||
|
||||
<EmptyFilePage>
|
||||
<template v-if="isTeamFolderHomepage">
|
||||
<h1 class="title">
|
||||
{{ $t('create_team_folder') }}
|
||||
</h1>
|
||||
<p class="description">
|
||||
{{ $t('create_team_folder_description') }}
|
||||
</p>
|
||||
<ButtonBase @click.native="$createTeamFolder" button-style="theme" class="m-center">
|
||||
{{ $t('create_team_folder') }}
|
||||
</ButtonBase>
|
||||
</template>
|
||||
|
||||
<template v-if="!isTeamFolderHomepage">
|
||||
<h1 class="title">
|
||||
{{ $t('empty_page.title') }}
|
||||
</h1>
|
||||
<p class="description">
|
||||
{{ $t('empty_page.description') }}
|
||||
</p>
|
||||
<ButtonUpload button-style="theme">
|
||||
{{ $t('empty_page.call_to_action') }}
|
||||
</ButtonUpload>
|
||||
</template>
|
||||
</EmptyFilePage>
|
||||
|
||||
<FileBrowser />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import MobileTeamContextMenu from '../../components/Menus/MobileTeamContextMenu'
|
||||
import EmptyFilePage from '../../components/EntriesView/EmptyFilePage'
|
||||
import FileActionsMobile from '../../components/Mobile/FileActionsMobile'
|
||||
import MobileActionButtonUpload from '../../components/UI/Buttons/MobileActionButtonUpload'
|
||||
import MobileMultiSelectToolbar from '../../components/Layout/Toolbars/MobileMultiSelectToolbar'
|
||||
import MobileActionButton from '../../components/UI/Buttons/MobileActionButton'
|
||||
import MobileContextMenu from '../../components/Menus/MobileContextMenu'
|
||||
import MobileCreateMenu from '../../components/Menus/MobileCreateMenu'
|
||||
import ButtonUpload from '../../components/UI/Buttons/ButtonUpload'
|
||||
import ToolbarButton from '../../components/UI/Buttons/ToolbarButton'
|
||||
import OptionUpload from '../../components/Menus/Components/OptionUpload'
|
||||
import FileBrowser from '../../components/EntriesView/FileBrowser'
|
||||
import ContextMenu from '../../components/Menus/ContextMenu'
|
||||
import OptionGroup from '../../components/Menus/Components/OptionGroup'
|
||||
import ButtonBase from '../../components/UI/Buttons/ButtonBase'
|
||||
import Option from '../../components/Menus/Components/Option'
|
||||
import { mapGetters } from 'vuex'
|
||||
import { events } from '../../bus'
|
||||
|
||||
export default {
|
||||
name: 'TeamFolders',
|
||||
components: {
|
||||
MobileActionButtonUpload,
|
||||
MobileMultiSelectToolbar,
|
||||
MobileTeamContextMenu,
|
||||
MobileActionButton,
|
||||
MobileContextMenu,
|
||||
MobileCreateMenu,
|
||||
ToolbarButton,
|
||||
ButtonUpload,
|
||||
OptionUpload,
|
||||
OptionGroup,
|
||||
FileBrowser,
|
||||
ContextMenu,
|
||||
ButtonBase,
|
||||
Option,
|
||||
FileActionsMobile,
|
||||
EmptyFilePage,
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['currentTeamFolder', 'clipboard', 'config', 'user']),
|
||||
teamFolder() {
|
||||
return this.currentTeamFolder ? this.currentTeamFolder : this.clipboard[0]
|
||||
},
|
||||
isTeamFolderHomepage() {
|
||||
return this.$isThisRoute(this.$route, ['TeamFolders']) && !this.$route.params.id
|
||||
},
|
||||
isFolder() {
|
||||
return this.item && this.item.data.type === 'folder'
|
||||
},
|
||||
isInFavourites() {
|
||||
return this.user.data.relationships.favourites.data.find((el) => el.id === this.item.id)
|
||||
},
|
||||
hasFile() {
|
||||
return this.clipboard.find((item) => item.type !== 'folder')
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
item: undefined,
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$store.dispatch('getTeamFolder', this.$route.params.id)
|
||||
|
||||
events.$on('context-menu:show', (event, item) => (this.item = item))
|
||||
events.$on('mobile-context-menu:show', (item) => (this.item = item))
|
||||
events.$on('context-menu:current-folder', (folder) => (this.item = folder))
|
||||
|
||||
events.$on('action:confirmed', (data) => {
|
||||
if (data.operation === 'dissolve-team-folder')
|
||||
axios
|
||||
.delete(`/api/teams/folders/${data.id}`)
|
||||
.then(() => {
|
||||
if (this.$route.params.id) {
|
||||
this.$router.push({ name: 'TeamFolders' })
|
||||
} else {
|
||||
this.$store.commit('REMOVE_ITEM', data.id)
|
||||
}
|
||||
|
||||
events.$emit('toaster', {
|
||||
type: 'success',
|
||||
message: this.$t('Your Team Folder was moved into your files.'),
|
||||
})
|
||||
})
|
||||
.catch(() => this.$isSomethingWrong())
|
||||
})
|
||||
},
|
||||
destroyed() {
|
||||
events.$off('action:confirmed')
|
||||
},
|
||||
}
|
||||
</script>
|
||||
@@ -1,266 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<MobileContextMenu>
|
||||
<OptionGroup v-if="item">
|
||||
<Option @click.native="$renameFileOrFolder(item)" :title="$t('rename')" icon="rename" />
|
||||
<Option @click.native="$moveFileOrFolder(item)" :title="$t('move')" icon="move-item" />
|
||||
<Option @click.native="$deleteFileOrFolder(item)" :title="$t('delete')" icon="trash" />
|
||||
</OptionGroup>
|
||||
</MobileContextMenu>
|
||||
|
||||
<MobileCreateMenu>
|
||||
<OptionGroup :title="$t('frequently_used')">
|
||||
<OptionUpload :title="$t('upload_files')" type="file" :is-hover-disabled="true" />
|
||||
<Option
|
||||
@click.stop.native="createFolder"
|
||||
:title="$t('create_folder')"
|
||||
icon="folder-plus"
|
||||
:is-hover-disabled="true"
|
||||
/>
|
||||
</OptionGroup>
|
||||
<OptionGroup :title="$t('others')">
|
||||
<OptionUpload :title="$t('upload_folder')" type="folder" />
|
||||
<Option
|
||||
@click.stop.native="$openRemoteUploadPopup"
|
||||
:title="$t('remote_upload')"
|
||||
icon="remote-upload"
|
||||
/>
|
||||
</OptionGroup>
|
||||
</MobileCreateMenu>
|
||||
|
||||
<MobileMultiSelectToolbar>
|
||||
<ToolbarButton
|
||||
@click.native="$moveFileOrFolder(clipboard)"
|
||||
class="mr-4"
|
||||
source="move"
|
||||
:action="$t('move')"
|
||||
:class="{ 'is-inactive': clipboard.length < 1 }"
|
||||
/>
|
||||
<ToolbarButton
|
||||
@click.native="$deleteFileOrFolder()"
|
||||
source="trash"
|
||||
:class="{ 'is-inactive': clipboard.length < 1 }"
|
||||
:action="$t('delete')"
|
||||
/>
|
||||
</MobileMultiSelectToolbar>
|
||||
|
||||
<ContextMenu v-if="canShowUI">
|
||||
<template v-slot:empty-select>
|
||||
<OptionGroup>
|
||||
<OptionUpload :title="$t('upload_files')" type="file" />
|
||||
<OptionUpload :title="$t('upload_folder')" type="folder" />
|
||||
</OptionGroup>
|
||||
<OptionGroup>
|
||||
<Option
|
||||
@click.native="$createFolder"
|
||||
:title="$t('create_folder')"
|
||||
icon="create-folder"
|
||||
/>
|
||||
</OptionGroup>
|
||||
</template>
|
||||
|
||||
<template v-slot:single-select v-if="item">
|
||||
<OptionGroup>
|
||||
<Option
|
||||
@click.native="$renameFileOrFolder(item)"
|
||||
:title="$t('rename')"
|
||||
icon="rename"
|
||||
/>
|
||||
<Option @click.native="$moveFileOrFolder(item)" :title="$t('move')" icon="move-item" />
|
||||
<Option @click.native="$deleteFileOrFolder(item)" :title="$t('delete')" icon="trash" />
|
||||
</OptionGroup>
|
||||
<OptionGroup>
|
||||
<Option @click.native="$openInDetailPanel(item)" :title="$t('detail')" icon="detail" />
|
||||
</OptionGroup>
|
||||
</template>
|
||||
|
||||
<template v-slot:multiple-select v-if="item">
|
||||
<OptionGroup>
|
||||
<Option @click.native="$moveFileOrFolder(item)" :title="$t('move')" icon="move-item" />
|
||||
<Option @click.native="$deleteFileOrFolder(item)" :title="$t('delete')" icon="trash" />
|
||||
</OptionGroup>
|
||||
<OptionGroup>
|
||||
<Option @click.native="$downloadSelection()" :title="$t('download')" icon="download" />
|
||||
</OptionGroup>
|
||||
</template>
|
||||
</ContextMenu>
|
||||
|
||||
<FileActionsMobile v-if="canShowUI">
|
||||
<!--I am Done-->
|
||||
<button @click="uploadingDone" class="flex shrink-0 items-center mr-2 rounded-xl bg-theme-200 py-1 px-1 pr-3">
|
||||
<MemberAvatar
|
||||
:member="uploadRequest.data.relationships.user"
|
||||
:size="26"
|
||||
/>
|
||||
<b class="text-theme ml-2 text-sm">
|
||||
{{ $t('tell_you_are_done', {name: userName}) }}
|
||||
</b>
|
||||
</button>
|
||||
|
||||
<MobileActionButton
|
||||
@click.native="$showMobileMenu('create-list')"
|
||||
v-if="$checkPermission(['master', 'editor'])"
|
||||
icon="cloud-plus"
|
||||
>
|
||||
{{ $t('upload_or_create') }}
|
||||
</MobileActionButton>
|
||||
<MobileActionButton @click.native="$enableMultiSelectMode" icon="check-square">
|
||||
{{ $t('select') }}
|
||||
</MobileActionButton>
|
||||
<MobileActionButton @click.native="$showMobileMenu('file-sorting')" icon="preview-sorting">
|
||||
{{ $t('preview_sorting.preview_sorting_button') }}
|
||||
</MobileActionButton>
|
||||
</FileActionsMobile>
|
||||
|
||||
<EmptyFilePage v-if="uploadRequest">
|
||||
|
||||
<div v-if="uploadRequest.data.attributes.status === 'filling'">
|
||||
<h1 class="title">
|
||||
{{ $t('empty_page.title') }}
|
||||
</h1>
|
||||
<p class="description">
|
||||
{{ $t('empty_page.description') }}
|
||||
</p>
|
||||
<ButtonUpload button-style="theme">
|
||||
{{ $t('empty_page.call_to_action') }}
|
||||
</ButtonUpload>
|
||||
</div>
|
||||
|
||||
<div v-if="['active', 'filled', 'expired'].includes(uploadRequest.data.attributes.status) && fileQueue.length === 0">
|
||||
<div class="relative mx-auto mb-8 w-24 text-center">
|
||||
<VueFolderIcon class="inline-block w-28" />
|
||||
<MemberAvatar
|
||||
v-if="uploadRequest.data.attributes.status !== 'expired'"
|
||||
:member="uploadRequest.data.relationships.user"
|
||||
class="absolute -bottom-2.5 -right-2"
|
||||
:is-border="true"
|
||||
:size="32"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<h1 class="title">
|
||||
{{ emptyPageTitle }}
|
||||
</h1>
|
||||
|
||||
<p class="description max-w-[420px] mx-auto">
|
||||
{{ emptyPageDescription }}
|
||||
</p>
|
||||
|
||||
<InfoBox v-if="uploadRequest.data.attributes.notes && uploadRequest.data.attributes.status === 'active'" class="max-w-[420px] mx-auto">
|
||||
<b>{{ $t('user_leave_message', {name: userName}) }}: </b>
|
||||
<p>{{ uploadRequest.data.attributes.notes }}</p>
|
||||
</InfoBox>
|
||||
|
||||
<ButtonUpload v-if="uploadRequest.data.attributes.status === 'active'" button-style="theme">
|
||||
{{ $t('empty_page.call_to_action') }}
|
||||
</ButtonUpload>
|
||||
</div>
|
||||
</EmptyFilePage>
|
||||
|
||||
<FileBrowser />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import MobileMultiSelectToolbar from '../../components/Layout/Toolbars/MobileMultiSelectToolbar'
|
||||
import MobileActionButton from '../../components/UI/Buttons/MobileActionButton'
|
||||
import FileActionsMobile from '../../components/Mobile/FileActionsMobile'
|
||||
import MobileContextMenu from '../../components/Menus/MobileContextMenu'
|
||||
import VueFolderIcon from '../../components/Icons/VueFolderIcon'
|
||||
import MobileCreateMenu from '../../components/Menus/MobileCreateMenu'
|
||||
import EmptyFilePage from '../../components/EntriesView/EmptyFilePage'
|
||||
import ToolbarButton from '../../components/UI/Buttons/ToolbarButton'
|
||||
import MemberAvatar from '../../components/UI/Others/MemberAvatar'
|
||||
import ButtonUpload from '../../components/UI/Buttons/ButtonUpload'
|
||||
import OptionUpload from '../../components/Menus/Components/OptionUpload'
|
||||
import FileBrowser from '../../components/EntriesView/FileBrowser'
|
||||
import ContextMenu from '../../components/Menus/ContextMenu'
|
||||
import OptionGroup from '../../components/Menus/Components/OptionGroup'
|
||||
import Option from '../../components/Menus/Components/Option'
|
||||
import {events} from '../../bus'
|
||||
import {mapGetters} from 'vuex'
|
||||
import InfoBox from "../../components/UI/Others/InfoBox";
|
||||
|
||||
export default {
|
||||
name: 'Files',
|
||||
components: {
|
||||
InfoBox,
|
||||
MobileMultiSelectToolbar,
|
||||
MobileActionButton,
|
||||
FileActionsMobile,
|
||||
MobileContextMenu,
|
||||
MobileCreateMenu,
|
||||
EmptyFilePage,
|
||||
VueFolderIcon,
|
||||
ToolbarButton,
|
||||
MemberAvatar,
|
||||
ButtonUpload,
|
||||
OptionUpload,
|
||||
OptionGroup,
|
||||
FileBrowser,
|
||||
ContextMenu,
|
||||
Option,
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['fastPreview', 'clipboard', 'config', 'user', 'uploadRequest', 'fileQueue']),
|
||||
isFolder() {
|
||||
return this.item && this.item.data.type === 'folder'
|
||||
},
|
||||
userName() {
|
||||
return this.uploadRequest.data.relationships.user.data.attributes.name
|
||||
},
|
||||
emptyPageTitle() {
|
||||
return {
|
||||
active: this.$t('request_for_upload', {name: this.userName}),
|
||||
filled: this.$t('request_for_upload_success', {name: this.userName}),
|
||||
expired: this.$t('request_for_upload_expired'),
|
||||
}[this.uploadRequest.data.attributes.status]
|
||||
},
|
||||
emptyPageDescription() {
|
||||
return {
|
||||
active: this.$t('automatically_uploads_for_file_request'),
|
||||
filled: this.$t('request_for_upload_unavailable'),
|
||||
expired: this.$t('request_for_upload_unavailable'),
|
||||
}[this.uploadRequest.data.attributes.status]
|
||||
},
|
||||
canShowUI() {
|
||||
return this.uploadRequest && this.uploadRequest.data.attributes.status === 'filling' || this.fileQueue.length > 0
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
item: undefined,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
uploadingDone() {
|
||||
events.$emit('confirm:open', {
|
||||
title: this.$t('closing_request_for_upload', {name: this.userName}),
|
||||
message: this.$t('closing_request_for_upload_warn'),
|
||||
action: {
|
||||
id: this.$router.currentRoute.params.token,
|
||||
operation: 'close-upload-request',
|
||||
},
|
||||
})
|
||||
},
|
||||
createFolder() {
|
||||
events.$emit('popup:open', {name: 'create-folder'})
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
events.$on('context-menu:show', (event, item) => (this.item = item))
|
||||
events.$on('context-menu:current-folder', (folder) => (this.item = folder))
|
||||
events.$on('mobile-context-menu:show', (item) => (this.item = item))
|
||||
|
||||
// Load folder from id in router
|
||||
if (this.$route.params.id) {
|
||||
this.$store.dispatch('getUploadRequestFolder', this.$route.params.id)
|
||||
}
|
||||
|
||||
// Load root folder for upload request
|
||||
if (! this.$route.params.id && this.uploadRequest && this.uploadRequest.data.attributes.status === 'filling') {
|
||||
this.$store.dispatch('getUploadRequestFolder')
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
Reference in New Issue
Block a user