nexus/vuefilemanager
2
0
Fork 0
mirror of https://github.com/VueFileManager/vuefilemanager.git synced 2026-04-29 11:15:58 +00:00
Code Issues Packages Projects Releases Wiki Activity

team folders page

Browse Source
This commit is contained in:
Peter Papp
2021-08-26 12:20:36 +02:00
parent 7020720392
commit bee7352b28
21 changed files with 620 additions and 73 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/js/components/FilesView/DesktopToolbar.vue
+8 -4
View File
@@ -16,9 +16,9 @@
<ToolbarWrapper>
<!--Search bar-->
<ToolbarGroup v-if="false" style="margin-left: 0">
<!-- <ToolbarGroup style="margin-left: 0">
<SearchBar />
</ToolbarGroup>
</ToolbarGroup>-->
<!--Creating controls-->
<ToolbarGroup v-if="$checkPermission(['master', 'editor'])">
@@ -40,7 +40,7 @@
<ToolbarGroup v-if="$checkPermission(['master', 'editor']) && ! $isMobile() && !$isThisRoute($route, ['Public'])">
<!--Team Folder Icon-->
<PopoverWrapper>
<PopoverWrapper v-if="$isThisRoute($route, ['TeamFolders'])">
<TeamMembersPreview @click.stop.native="showTeamFolderMenu" count="3+" :members="members" class="team-preview" />
<PopoverItem name="team-folder" side="left">
<TeamFolderPreview />
@@ -51,7 +51,7 @@
</PopoverItem>
</PopoverWrapper>
<ToolbarButton v-if="false" @click.native="$createTeamFolder" source="user-plus" :action="$t('actions.convert_into_team_folder')" />
<ToolbarButton v-if="canShowConvertToTeamFolder" @click.native="$updateTeamFolder(clipboard[0])" :class="{'is-inactive': ! canCreateTeamFolderInView }" source="user-plus" :action="$t('actions.convert_into_team_folder')" />
<ToolbarButton @click.native="$shareFileOrFolder(clipboard[0])" :class="{'is-inactive': canShareInView }" source="share" :action="$t('actions.share')" />
</ToolbarGroup>
@@ -151,6 +151,7 @@
'Trash': this.$t('Trash'),
'Public': this.$t('Files'),
'Files': this.$t('Files'),
'TeamFolders': this.$t('Team Folders'),
}[this.$route.name]
}
},
@@ -172,6 +173,9 @@
]
return !this.$isThisRoute(this.$route, routes) || this.clipboard.length === 0
},
canShowConvertToTeamFolder() {
return this.$isThisRoute(this.$route, ['Files', 'MySharedItems'])
},
canUploadInView() {
return ! this.$isThisRoute(this.$route, ['Files', 'Public'])
},
resources/js/components/FilesView/FileItemList.vue
+4
View File
@@ -228,6 +228,8 @@ export default {
this.$router.push({name: 'Trash', params: {id: this.item.id}})
} else if (route === 'Files') {
this.$router.push({name: 'Files', params: {id: this.item.id}})
} else if (route === 'TeamFolders') {
this.$router.push({name: 'TeamFolders', params: {id: this.item.id}})
}
} else {
@@ -269,6 +271,8 @@ export default {
this.$router.push({name: 'Trash', params: {id: this.item.id}})
} else if (route === 'Files') {
this.$router.push({name: 'Files', params: {id: this.item.id}})
} else if (route === 'TeamFolders') {
this.$router.push({name: 'TeamFolders', params: {id: this.item.id}})
}
}
},
resources/js/components/FilesView/FolderIcon.vue
+9 -1
View File
@@ -7,7 +7,7 @@
/>
<FontAwesomeIcon
v-if="!emoji"
:class="[{ 'is-deleted': isDeleted },{'default-color' : ! color && ! isDeleted}, 'folder-icon' ]"
:class="[{'is-deleted':isDeleted},{'is-team':item.team_folder},{'default-color': ! color && ! isDeleted}, 'folder-icon' ]"
:style="{fill: color}"
icon="folder"
/>
@@ -95,6 +95,14 @@
fill: $dark_background;
}
}
&.is-team {
path {
fill: transparent;
stroke-width: 20px;
stroke: inherit;
}
}
}
.dark-mode {
resources/js/components/Others/Popup/PopupHeader.vue
+3 -1
View File
@@ -6,6 +6,7 @@
<edit2-icon v-if="icon === 'edit'" size="17" class="title-icon text-theme dark-text-theme" />
<key-icon v-if="icon === 'key'" size="17" class="title-icon text-theme dark-text-theme" />
<users-icon v-if="icon === 'users'" size="17" class="title-icon text-theme dark-text-theme" />
<user-plus-icon v-if="icon === 'user-plus'" size="17" class="title-icon text-theme dark-text-theme" />
</div>
<div class="label">
<h1 class="title">{{ title }}</h1>
@@ -15,7 +16,7 @@
</template>
<script>
import {KeyIcon, CornerDownRightIcon, LinkIcon, XIcon, Edit2Icon, ShareIcon, UsersIcon} from 'vue-feather-icons'
import {KeyIcon, UserPlusIcon, CornerDownRightIcon, LinkIcon, XIcon, Edit2Icon, ShareIcon, UsersIcon} from 'vue-feather-icons'
import {events} from '/resources/js/bus'
export default {
@@ -25,6 +26,7 @@
],
components: {
CornerDownRightIcon,
UserPlusIcon,
UsersIcon,
ShareIcon,
Edit2Icon,
resources/js/components/Teams/Components/PermissionToggleButton.vue
+5 -1
View File
@@ -44,7 +44,11 @@
}
},
created() {
this.permission = this.item.permission
if (this.item.pivot) {
this.permission = this.item.pivot.permission
} else {
this.permission = this.item.permission
}
}
}
</script>
resources/js/components/Teams/Components/TeamMemberList.vue → resources/js/components/Teams/Components/TeamList.vue
+4 -5
View File
@@ -6,11 +6,11 @@
</div>
<div class="member-preview">
<div class="avatar">
<img :src="member.avatar">
<img :src="member.settings ? member.settings.avatar : '/assets/images/default-avatar.png'">
</div>
<div class="info">
<b class="name">{{ member.name ? member.name : member.email }}</b>
<span v-if="member.name" class="email">{{ member.email }}</span>
<b class="name">{{ member.settings ? member.settings.name : member.email }}</b>
<span v-if="member.settings" class="email">{{ member.email }}</span>
</div>
</div>
<div class="action">
@@ -28,7 +28,7 @@
import {XIcon} from 'vue-feather-icons'
export default {
name: "TeamMemberList",
name: "TeamList",
props: [
'value',
],
@@ -67,7 +67,6 @@
@import '/resources/sass/vuefilemanager/_forms';
.member-list {
margin-bottom: 20px;
max-height: 270px;
overflow-y: scroll;
}
resources/js/components/Teams/CreateTeamFolderPopup.vue
+30 -36
View File
@@ -2,7 +2,7 @@
<PopupWrapper name="create-team-folder">
<!--Title-->
<PopupHeader :title="popupTitle" icon="users" />
<PopupHeader :title="popupTitle" icon="user-plus" />
<!--Content-->
<PopupContent>
@@ -31,7 +31,7 @@
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="Members" rules="required" v-slot="{ errors }">
<label class="input-label">{{ $t('Your Members') }}:</label>
<span v-if="errors[0]" class="error-message" style="margin-top: -5px">{{ $t('Please add at least one member.') }}</span>
<TeamMemberList v-model="members" />
<TeamList v-model="invitations" />
</ValidationProvider>
<InfoBox v-if="! isNewFolderTeamCreation" style="margin-bottom: 0">
@@ -69,7 +69,7 @@
import PopupHeader from '/resources/js/components/Others/Popup/PopupHeader'
import ThumbnailItem from '/resources/js/components/Others/ThumbnailItem'
import ButtonBase from '/resources/js/components/FilesView/ButtonBase'
import TeamMemberList from "./Components/TeamMemberList";
import TeamList from "./Components/TeamList";
import {required} from 'vee-validate/dist/rules'
import InfoBox from "../Others/Forms/InfoBox";
import {events} from '/resources/js/bus'
@@ -80,7 +80,7 @@
components: {
ValidationProvider,
ValidationObserver,
TeamMemberList,
TeamList,
ThumbnailItem,
PopupWrapper,
PopupActions,
@@ -92,7 +92,7 @@
},
computed: {
popupTitle() {
return this.item ? this.$t('Move into a Team Folder') : this.$t('Create Team Folder')
return this.item ? this.$t('Convert as Team Folder') : this.$t('Create Team Folder')
},
popupSubmit() {
return this.item ? this.$t('Move & Invite Members') : this.$t('Create Team Folder')
@@ -103,29 +103,7 @@
},
data() {
return {
members: [
{
id: 1,
name: 'Jane Doe',
email: 'jane@doe.com',
avatar: '/temp/avatar-01.png',
permission: 'can-edit',
},
{
id: 2,
name: 'Emma Willis',
email: 'dawn_mcglynn@adams.tv',
avatar: '/temp/avatar-02.png',
permission: 'can-view',
},
{
id: 3,
name: 'Barry Erickson',
email: 'ulatid@jabo.edu',
avatar: '/temp/avatar-03.png',
permission: 'can-view-and-download',
},
],
invitations: [],
item: undefined,
name: undefined,
email: undefined,
@@ -140,21 +118,37 @@
this.isLoading = true
let route = this.name ? `/api/teams` : `/api/teams/${this.item.id}`
let route = this.name
? `/api/teams/folders`
: `/api/teams/convert/${this.item.id}`
let payload = this.name
? {
name: this.name,
invitations: this.invitations,
}
: {
invitations: this.invitations,
}
axios
.post(route, {
name: this.name,
members: this.members,
})
.post(route, payload)
.then(response => {
// todo: push to team folder
//this.$router.push({name: 'TeamFolders', params: {id: response.data.id}})
if (! this.$isThisRoute(this.$route, ['TeamFolders']))
this.$router.push({name: 'TeamFolders'})
this.$store.dispatch('getAppData')
})
.catch(() => this.$isSomethingWrong())
.finally(() => {
this.isLoading = false
this.name = undefined
this.members = undefined
this.invitations = undefined
this.$closePopup()
})
},
addMember() {
@@ -168,7 +162,7 @@
this.$refs.teamFolderForm.reset()
this.members.push({
this.invitations.push({
email: this.email,
avatar: '/assets/images/default-avatar.png',
permission: 'can-edit',
@@ -191,7 +185,7 @@
this.email = undefined
this.name = undefined
this.item = undefined
this.members = []
this.invitations = []
}, 150)
})
}
resources/js/components/Teams/EditTeamFolderPopup.vue
+176
View File
@@ -0,0 +1,176 @@
<template>
<PopupWrapper name="update-team-folder">
<!--Title-->
<PopupHeader :title="$t('Edit Team Folder')" icon="user-plus" />
<!--Content-->
<PopupContent>
<!--Item Thumbnail-->
<ThumbnailItem class="item-thumbnail" :item="item" info="metadata" />
<!--Form to set team folder-->
<ValidationObserver @submit.prevent="updateTeamFolder" ref="teamFolderForm" v-slot="{ invalid }" tag="form" class="form-wrapper">
<!--Add Member-->
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="Email" v-slot="{ errors }">
<label class="input-label">{{ $t('Add Member') }}:</label>
<input @keypress.enter.stop.prevent="addMember" v-model="email" :class="{'is-error': errors[0]}" type="email" class="focus-border-theme" :placeholder="$t('Type member email...')">
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
<!--Member list-->
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="Members" rules="required" v-slot="{ errors }">
<label class="input-label">{{ $t('Your Members') }}:</label>
<span v-if="errors[0]" class="error-message" style="margin-top: -5px">{{ $t('Please add at least one member.') }}</span>
<TeamList v-model="members" />
<TeamList v-model="invitations" />
</ValidationProvider>
</ValidationObserver>
</PopupContent>
<!--Actions-->
<PopupActions>
<ButtonBase
class="popup-button"
@click.native="$closePopup()"
button-style="secondary"
>{{ $t('popup_move_item.cancel') }}
</ButtonBase>
<ButtonBase
class="popup-button"
@click.native="updateTeamFolder"
button-style="theme"
:loading="isLoading"
:disabled="isLoading"
>{{ $t('Update Team Folder') }}
</ButtonBase>
</PopupActions>
</PopupWrapper>
</template>
<script>
import {ValidationProvider, ValidationObserver} from 'vee-validate/dist/vee-validate.full'
import PopupWrapper from '/resources/js/components/Others/Popup/PopupWrapper'
import PopupActions from '/resources/js/components/Others/Popup/PopupActions'
import PopupContent from '/resources/js/components/Others/Popup/PopupContent'
import PopupHeader from '/resources/js/components/Others/Popup/PopupHeader'
import ThumbnailItem from '/resources/js/components/Others/ThumbnailItem'
import ButtonBase from '/resources/js/components/FilesView/ButtonBase'
import TeamList from "./Components/TeamList";
import {required} from 'vee-validate/dist/rules'
import InfoBox from "../Others/Forms/InfoBox";
import {events} from '/resources/js/bus'
import axios from "axios";
export default {
name: 'UpdateTeamFolderPopup',
components: {
ValidationProvider,
ValidationObserver,
TeamList,
ThumbnailItem,
PopupWrapper,
PopupActions,
PopupContent,
PopupHeader,
ButtonBase,
required,
InfoBox,
},
computed: {
//
},
data() {
return {
invitations: [],
members: [],
item: undefined,
name: undefined,
email: undefined,
isLoading: false,
}
},
methods: {
async updateTeamFolder() {
const isValid = await this.$refs.teamFolderForm.validate()
if (!isValid) return
this.isLoading = true
axios
.patch(`/api/teams/folders/${this.item.id}`, {
members: this.members,
invitations: this.invitations,
})
.then(response => {
// todo: update view
this.$store.dispatch('getAppData')
})
.catch(() => this.$isSomethingWrong())
.finally(() => {
this.isLoading = false
this.name = undefined
this.invitations = undefined
this.$closePopup()
})
},
addMember() {
let email = this.email.match(/^[^\s@]+@[^\s@]+\.[^\s@]+$/)[0]
if (! email) {
this.$refs.teamFolderForm.setErrors({
'Email': this.$t("You have to type valid email")
});
}
this.$refs.teamFolderForm.reset()
this.invitations.push({
email: this.email,
avatar: '/assets/images/default-avatar.png',
permission: 'can-edit',
})
this.email = undefined
}
},
mounted() {
events.$on('popup:open', args => {
if (args.name !== 'update-team-folder') return
console.log(args.item);
if (args.item) {
this.item = args.item
this.members = args.item.team_members
this.invitations = args.item.team_invitations
}
})
events.$on('popup:close', () => {
setTimeout(() => {
this.email = undefined
this.name = undefined
this.item = undefined
this.invitations = []
this.members = []
}, 150)
})
}
}
</script>
<style scoped lang="scss">
@import "resources/sass/vuefilemanager/_inapp-forms.scss";
@import '/resources/sass/vuefilemanager/_forms';
.item-thumbnail {
margin-bottom: 20px;
}
</style>
resources/js/helpers/itemHelpers.js
Vendored
+1 -5
View File
@@ -1,8 +1,4 @@
import {events} from "../bus";
import {debounce, isArray} from "lodash";
import axios from "axios";
import i18n from "../i18n";
import store from "../store";
const itemHelpers = {
install(Vue) {
@@ -54,7 +50,7 @@ const itemHelpers = {
}
Vue.prototype.$updateTeamFolder = function (entry) {
events.$emit('popup:open', {name: 'create-team-folder', item: [entry]})
events.$emit('popup:open', {name: 'update-team-folder', item: entry})
}
Vue.prototype.$removeFavourite = function (folder) {
resources/js/routes/routesFile.js
Vendored
+2 -2
View File
@@ -43,9 +43,9 @@ const routesFile = [
},
{
name: 'TeamFolders',
path: '/platform/team-folder/:id?',
path: '/platform/team-folders/:id?',
component: () =>
import(/* webpackChunkName: "chunks/team-folders" */ '../views/FileView/Trash'),
import(/* webpackChunkName: "chunks/team-folders" */ '../views/FileView/TeamFolders'),
meta: {
requiresAuth: true
},
resources/js/store/modules/fileBrowser.js
Vendored
+29
View File
@@ -43,6 +43,35 @@ const actions = {
}
})
},
getTeamFolder: ({commit, getters}, id) => {
commit('LOADING_STATE', {loading: true, data: []})
axios
.get(`${getters.api}/teams/folders/${id}/${getters.sorting.URI}`)
.then(response => {
commit('LOADING_STATE', {loading: false, data: response.data.content})
commit('SET_CURRENT_FOLDER', response.data.folder)
events.$emit('scrollTop')
})
.catch(error => {
// Redirect if unauthenticated
if ([401, 403].includes(error.response.status)) {
commit('SET_AUTHORIZED', false)
router.push({name: 'SignIn'})
} else {
// Show error message
events.$emit('alert:open', {
title: i18n.t('popup_error.title'),
message: i18n.t('popup_error.message'),
})
}
})
},
getRecentUploads: ({commit, getters}) => {
commit('LOADING_STATE', {loading: true, data: []})
resources/js/views/FileView/Files.vue
+1 -1
View File
@@ -54,7 +54,7 @@
</OptionGroup>
<OptionGroup>
<Option @click.native="$shareFileOrFolder(item)" :title="item.shared ? $t('context_menu.share_edit') : $t('context_menu.share')" icon="share" />
<Option @click.native="$updateTeamFolder(item)" v-if="isFolder" :title="$t('Convert as Team Folder')" icon="users" />
<Option @click.native="$updateTeamFolder(item)" v-if="isFolder" :title="$t('Convert as Team Folder')" icon="user-plus" />
</OptionGroup>
<OptionGroup>
<Option @click.native="$openInDetailPanel(item)" :title="$t('context_menu.detail')" icon="detail" />
resources/js/views/FileView/TeamFolders.vue
+216
View File
@@ -0,0 +1,216 @@
<template>
<div>
<MobileContextMenu>
<OptionGroup v-if="item && isFolder">
<Option @click.native="addToFavourites" :title="isInFavourites ? $t('context_menu.remove_from_favourites') : $t('context_menu.add_to_favourites')" icon="favourites" />
</OptionGroup>
<OptionGroup v-if="item">
<Option @click.native="$renameFileOrFolder(item)" :title="$t('context_menu.rename')" icon="rename" />
<Option @click.native="$moveFileOrFolder(item)" :title="$t('context_menu.move')" icon="move-item" />
<Option @click.native="$deleteFileOrFolder(item)" :title="$t('context_menu.delete')" icon="trash" />
</OptionGroup>
<OptionGroup v-if="item">
<Option @click.native="$shareFileOrFolder(item)" :title="item.shared ? $t('context_menu.share_edit') : $t('context_menu.share')" icon="share" />
<Option @click.native="$updateTeamFolder(item)" v-if="isFolder" :title="$t('Convert as Team Folder')" icon="users" />
</OptionGroup>
<OptionGroup v-if="item">
<Option @click.native="$downloadSelection(item)" :title="$t('context_menu.download')" icon="download" />
</OptionGroup>
</MobileContextMenu>
<MobileCreateMenu>
<OptionGroup>
<OptionUpload :class="{'is-inactive': !hasCapacity }" :title="$t('actions.upload')" is-hover-disabled="true" />
</OptionGroup>
<OptionGroup>
<Option @click.stop.native="$createTeamFolder" :title="$t('Create Team Folder')" icon="users" is-hover-disabled="true" />
<Option @click.stop.native="createFolder" :title="$t('actions.create_folder')" icon="folder-plus" is-hover-disabled="true" />
</OptionGroup>
</MobileCreateMenu>
<MobileMultiSelectToolbar>
<ToolbarButton @click.native="$moveFileOrFolder(clipboard)" class="action-btn" source="move" :action="$t('actions.move')" :class="{'is-inactive' : clipboard.length < 1}" />
<ToolbarButton @click.native="$deleteFileOrFolder(clipboard)" class="action-btn" source="trash" :class="{'is-inactive' : clipboard.length < 1}" :action="$t('actions.delete')" />
<ToolbarButton @click.native="$downloadSelection(item)" class="action-btn" source="download" :action="$t('actions.download')" />
</MobileMultiSelectToolbar>
<ContextMenu>
<template v-slot:empty-select>
<OptionGroup>
<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="addToFavourites" :title="isInFavourites ? $t('context_menu.remove_from_favourites') : $t('context_menu.add_to_favourites')" icon="favourites" />
</OptionGroup>
<OptionGroup>
<Option @click.native="$renameFileOrFolder(item)" :title="$t('context_menu.rename')" icon="rename" />
<Option @click.native="$moveFileOrFolder(item)" :title="$t('context_menu.move')" icon="move-item" />
<Option @click.native="$deleteFileOrFolder(item)" :title="$t('context_menu.delete')" icon="trash" />
</OptionGroup>
<OptionGroup>
<Option @click.native="$shareFileOrFolder(item)" :title="item.shared ? $t('context_menu.share_edit') : $t('context_menu.share')" icon="share" />
<Option @click.native="$updateTeamFolder(item)" v-if="isFolder" :title="$t('Edit Team Members')" icon="users" />
</OptionGroup>
<OptionGroup>
<Option @click.native="$openInDetailPanel(item)" :title="$t('context_menu.detail')" icon="detail" />
<Option @click.native="$downloadSelection(item)" :title="$t('context_menu.download')" icon="download" />
</OptionGroup>
</template>
<template v-slot:multiple-select v-if="item">
<OptionGroup v-if="!hasFile">
<Option @click.native="addToFavourites" :title="isInFavourites ? $t('context_menu.remove_from_favourites') : $t('context_menu.add_to_favourites')" icon="favourites" />
</OptionGroup>
<OptionGroup>
<Option @click.native="$moveFileOrFolder(item)" :title="$t('context_menu.move')" icon="move-item" />
<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" />
</OptionGroup>
</template>
</ContextMenu>
<FileBrowser>
<template v-slot:file-actions-mobile>
<MobileActionButton @click.native="$openSpotlight" icon="search">
{{ $t('actions.search') }}
</MobileActionButton>
<MobileActionButton @click.native="$showLocations" icon="filter">
{{ filterLocationTitle }}
</MobileActionButton>
<MobileActionButton @click.native="$createItems" v-if="$checkPermission(['master', 'editor'])" icon="cloud-plus">
{{ $t('mobile.create') }}
</MobileActionButton>
<MobileActionButton @click.native="$enableMultiSelectMode" icon="check-square">
{{ $t('context_menu.select') }}
</MobileActionButton>
<MobileActionButton @click.native="$showViewOptions" icon="preview-sorting">
{{ $t('preview_sorting.preview_sorting_button') }}
</MobileActionButton>
</template>
<template v-slot:empty-file-page>
<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>
</FileBrowser>
</div>
</template>
<script>
import MobileActionButtonUpload from '/resources/js/components/FilesView/MobileActionButtonUpload'
import MobileMultiSelectToolbar from "/resources/js/components/FilesView/MobileMultiSelectToolbar"
import MobileActionButton from '/resources/js/components/FilesView/MobileActionButton'
import MobileContextMenu from "/resources/js/components/FilesView/MobileContextMenu"
import MobileCreateMenu from '/resources/js/components/FilesView/MobileCreateMenu'
import ButtonUpload from '/resources/js/components/FilesView/ButtonUpload'
import ToolbarButton from '/resources/js/components/FilesView/ToolbarButton'
import OptionUpload from '/resources/js/components/FilesView/OptionUpload'
import FileBrowser from '/resources/js/components/FilesView/FileBrowser'
import ContextMenu from '/resources/js/components/FilesView/ContextMenu'
import OptionGroup from '/resources/js/components/FilesView/OptionGroup'
import Option from '/resources/js/components/FilesView/Option'
import { mapGetters } from 'vuex'
import {events} from "../../bus";
export default {
name: 'TeamFolders',
components: {
MobileActionButtonUpload,
MobileMultiSelectToolbar,
MobileActionButton,
MobileContextMenu,
MobileCreateMenu,
ToolbarButton,
ButtonUpload,
OptionUpload,
OptionGroup,
FileBrowser,
ContextMenu,
Option,
},
computed: {
...mapGetters([
'clipboard',
'config',
'user',
]),
hasCapacity() {
// Check if storage limitation is set
if (!this.config.storageLimit) return true
// Check if user has storage
return this.user && this.user.data.attributes.storage.used <= 100
},
isFolder() {
return this.item && this.item.type === 'folder'
},
isInFavourites() {
return this.favourites.find((el) => el.id === this.item.id)
},
hasFile() {
return this.clipboard.find(item => item.type !== 'folder')
},
favourites() {
return this.user.data.relationships.favourites.data.attributes.folders
},
filterLocationTitle() {
return {
'RecentUploads': this.$t('Recent'),
'MySharedItems': this.$t('Shared'),
'Trash': this.$t('Trash'),
'Public': this.$t('Files'),
'Files': this.$t('Files'),
}[this.$route.name]
}
},
data() {
return {
item: undefined,
}
},
methods: {
addToFavourites() {
// Check if folder is in favourites and then add/remove from favourites
if (
this.favourites &&
!this.favourites.find(el => el.id === this.item.id)
) {
// Add to favourite folder that is not selected
if (!this.clipboard.includes(this.item)) {
this.$store.dispatch('addToFavourites', this.item)
}
// Add to favourites all selected folders
if (this.clipboard.includes(this.item)) {
this.$store.dispatch('addToFavourites', null)
}
} else {
this.$store.dispatch('removeFromFavourites', this.item)
}
},
createFolder() {
events.$emit('popup:open', {name: 'create-folder'})
},
},
created() {
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)
}
}
</script>
resources/js/views/Platform.vue
+3
View File
@@ -10,6 +10,7 @@
<ConfirmPopup />
<CreateTeamFolderPopup />
<EditTeamFolderPopup />
<ShareCreatePopup />
<ShareEditPopup />
@@ -49,6 +50,7 @@
import ShareCreatePopup from '/resources/js/components/Others/ShareCreatePopup'
import DesktopToolbar from '/resources/js/components/FilesView/DesktopToolbar'
import CreateTeamFolderPopup from "../components/Teams/CreateTeamFolderPopup"
import EditTeamFolderPopup from "../components/Teams/EditTeamFolderPopup"
import ConfirmPopup from '/resources/js/components/Others/Popup/ConfirmPopup'
import RenameItemPopup from '/resources/js/components/Others/RenameItemPopup'
import ShareEditPopup from '/resources/js/components/Others/ShareEditPopup'
@@ -64,6 +66,7 @@
components: {
CreateTeamFolderPopup,
PanelNavigationFiles,
EditTeamFolderPopup,
CreateFolderPopup,
FileSortingMobile,
SidebarNavigation,