nexus/vuefilemanager
2
0
Fork 0
mirror of https://github.com/VueFileManager/vuefilemanager.git synced 2026-04-28 19:10:40 +00:00
Code Issues Packages Projects Releases Wiki Activity

clear SharedWithMe.vue view

Browse Source
This commit is contained in:
Čarodej
2021-10-22 08:43:19 +02:00
parent 2aac3fc966
commit 3fee035e9e
11 changed files with 148 additions and 209 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/js/components/Others/Notifications/ToasterItem.vue
+31 -22
View File
@@ -1,16 +1,16 @@
<template>
<transition appear name="fade">
<li class="toastr-item" :class="item.type" v-show="isActive">
<div class="toastr-content-wrapper">
<span class="toastr-icon">
<check-icon v-if="item.type == 'success'" size="22"></check-icon>
<x-icon v-if="item.type == 'danger'" size="22"></x-icon>
<li v-show="isActive" class="toaster-item" :class="item.type">
<div class="toaster-content-wrapper">
<span class="toaster-icon">
<check-icon v-if="item.type === 'success'" size="22" />
<x-icon v-if="item.type === 'danger'" size="22" />
</span>
<div class="toastr-content">
<p class="toastr-description">{{ item.message }}</p>
<div class="toaster-content">
<p class="toaster-description">{{ item.message }}</p>
</div>
</div>
<div class="progressbar">
<div :class="{'success': item.type === 'success', 'danger': item.type === 'danger'}" class="progressbar">
<span></span>
</div>
</li>
@@ -22,10 +22,12 @@
export default {
components: {
CheckIcon,
XIcon,
CheckIcon
},
props: ['item'],
props: [
'item'
],
data() {
return {
isActive: 0
@@ -34,7 +36,7 @@
created() {
this.isActive = 1
setTimeout(() => (this.isActive = 0), 5000)
setTimeout(() => (this.isActive = 0), 55000)
}
}
</script>
@@ -54,7 +56,7 @@
@include transform(translateX(100%));
}
.toastr-content-wrapper {
.toaster-content-wrapper {
display: flex;
align-items: center;
padding: 15px;
@@ -72,9 +74,16 @@
width: 0;
height: 3px;
display: block;
background: $theme;
animation: progressbar 5s linear;
}
&.success span {
background: $theme;
}
&.danger span {
background: $danger;
}
}
@keyframes progressbar {
@@ -86,7 +95,7 @@
}
}
.toastr-item {
.toaster-item {
max-width: 320px;
margin-bottom: 20px;
position: relative;
@@ -94,12 +103,12 @@
display: block;
border-radius: 8px;
.toastr-description {
.toaster-description {
@include font-size(15);
font-weight: bold;
}
.toastr-icon {
.toaster-icon {
height: 42px;
width: 42px;
display: inline-flex;
@@ -113,11 +122,11 @@
&.success {
background: $theme_light;
polyline {
line {
stroke: $theme;
}
.toastr-description {
.toaster-description {
color: $theme;
}
}
@@ -125,11 +134,11 @@
&.danger {
background: rgba($danger, 0.1);
polyline {
line {
stroke: $danger;
}
.toastr-description {
.toaster-description {
color: $danger;
}
}
@@ -137,7 +146,7 @@
@media only screen and (max-width: 690px) {
.toastr-item {
.toaster-item {
margin-bottom: 0;
margin-top: 20px;
max-width: 100%;
@@ -151,7 +160,7 @@
}
.dark-mode {
.toastr-item {
.toaster-item {
&.success, &.danger {
background: $dark_mode_foreground;
resources/js/components/Others/Notifications/ToasterWrapper.vue
+7 -7
View File
@@ -1,5 +1,5 @@
<template>
<div id="toastr-wrapper">
<div id="toaster-wrapper">
<ToasterItem :item="item" v-for="(item, i) in notifications" :key="i"/>
</div>
</template>
@@ -27,22 +27,22 @@
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.toastr-list {
.toaster-list {
transition: all 5s ease;
display: inline-block;
}
.toastr-list-enter,
.toastr-list-leave-to {
.toaster-list-enter,
.toaster-list-leave-to {
opacity: 0;
transform: translateY(-100%);
}
.toastr-list-leave-active {
.toaster-list-leave-active {
position: absolute;
}
#toastr-wrapper {
#toaster-wrapper {
position: absolute;
right: 30px;
bottom: 30px;
@@ -51,7 +51,7 @@
@media only screen and (max-width: 690px) {
#toastr-wrapper {
#toaster-wrapper {
right: 15px;
left: 15px;
bottom: 15px;
resources/js/components/Teams/EditTeamFolderPopup.vue
+67 -62
View File
@@ -4,13 +4,13 @@
<!--Title-->
<PopupHeader :title="$t('Edit Team Folder')" icon="user-plus" />
<!--Content-->
<!--Content-->
<PopupContent>
<!--Item Thumbnail-->
<ThumbnailItem class="item-thumbnail" :item="item" info="metadata" />
<!--Form to set team folder-->
<!--Form to set team folder-->
<ValidationObserver @submit.prevent="updateTeamFolder" ref="teamFolderForm" v-slot="{ invalid }" tag="form" class="form-wrapper">
<!--Add Member-->
@@ -32,21 +32,21 @@
</PopupContent>
<!--Actions-->
<!--Actions-->
<PopupActions>
<ButtonBase
class="popup-button"
@click.native="$closePopup()"
button-style="secondary"
>{{ $t('popup_move_item.cancel') }}
class="popup-button"
@click.native="$closePopup()"
button-style="secondary"
>{{ $t('popup_move_item.cancel') }}
</ButtonBase>
<ButtonBase
class="popup-button"
@click.native="updateTeamFolder"
:button-style="isDisabledSubmit ? 'secondary' : 'theme'"
:loading="isLoading"
:disabled="isLoading || isDisabledSubmit"
>{{ $t('Update Team Folder') }}
class="popup-button"
@click.native="updateTeamFolder"
:button-style="isDisabledSubmit ? 'secondary' : 'theme'"
:loading="isLoading"
:disabled="isLoading || isDisabledSubmit"
>{{ $t('Update Team Folder') }}
</ButtonBase>
</PopupActions>
</PopupWrapper>
@@ -54,50 +54,50 @@
<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 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 {required} from 'vee-validate/dist/rules'
import InfoBox from "../Others/Forms/InfoBox";
import {events} from '/resources/js/bus'
import {events} from '/resources/js/bus'
import axios from "axios";
export default {
name: 'UpdateTeamFolderPopup',
components: {
ValidationProvider,
ValidationObserver,
export default {
name: 'UpdateTeamFolderPopup',
components: {
ValidationProvider,
ValidationObserver,
TeamList,
ThumbnailItem,
PopupWrapper,
PopupActions,
PopupContent,
PopupHeader,
ButtonBase,
required,
ThumbnailItem,
PopupWrapper,
PopupActions,
PopupContent,
PopupHeader,
ButtonBase,
required,
InfoBox,
},
computed: {
},
computed: {
isDisabledSubmit() {
return Object.values(this.members).length === 0 && Object.values(this.invitations).length === 0
}
},
data() {
return {
invitations: [],
members: [],
item: undefined,
name: undefined,
},
data() {
return {
invitations: [],
members: [],
item: undefined,
name: undefined,
email: undefined,
isLoading: false,
}
},
methods: {
async updateTeamFolder() {
}
},
methods: {
async updateTeamFolder() {
const isValid = await this.$refs.teamFolderForm.validate()
if (!isValid) return
@@ -117,7 +117,12 @@
message: this.$t('Your team folder was updated'),
})
})
.catch(() => this.$isSomethingWrong())
.catch(() => {
events.$emit('toaster', {
type: 'danger',
message: this.$t('popup_error.title'),
})
})
.finally(() => {
this.isLoading = false
this.name = undefined
@@ -126,11 +131,11 @@
this.$closePopup()
})
},
},
addMember() {
let email = this.email.match(/^[^\s@]+@[^\s@]+\.[^\s@]+$/)[0]
let email = this.email.match(/^[^\s@]+@[^\s@]+\.[^\s@]+$/)[0]
if (! email) {
if (!email) {
this.$refs.teamFolderForm.setErrors({
'Email': this.$t("You have to type valid email")
});
@@ -138,7 +143,7 @@
this.$refs.teamFolderForm.reset()
this.invitations.push({
this.invitations.push({
type: 'invitation',
email: this.email,
permission: 'can-edit',
@@ -146,10 +151,10 @@
this.email = undefined
}
},
mounted() {
events.$on('popup:open', args => {
if (args.name !== 'update-team-folder') return
},
mounted() {
events.$on('popup:open', args => {
if (args.name !== 'update-team-folder') return
this.item = args.item
@@ -178,7 +183,7 @@
this.$nextTick(() => {
this.$refs.email.focus()
})
})
})
events.$on('popup:close', () => {
setTimeout(() => {
@@ -189,15 +194,15 @@
this.members = []
}, 150)
})
}
}
}
}
</script>
<style scoped lang="scss">
@import "resources/sass/vuefilemanager/_inapp-forms.scss";
@import '/resources/sass/vuefilemanager/_forms';
@import '/resources/sass/vuefilemanager/_forms';
.item-thumbnail {
margin-bottom: 20px;
}
.item-thumbnail {
margin-bottom: 20px;
}
</style>
resources/js/views/FileView/Files.vue
+1 -10
View File
@@ -85,7 +85,7 @@
{{ $t('actions.search') }}
</MobileActionButton>
<MobileActionButton @click.native="$showLocations" icon="filter">
{{ filterLocationTitle }}
{{ $getCurrentLocationName() }}
</MobileActionButton>
<MobileActionButton @click.native="$createItems" v-if="$checkPermission(['master', 'editor'])" icon="cloud-plus">
{{ $t('mobile.create') }}
@@ -170,15 +170,6 @@
favourites() {
return this.user.data.relationships.favourites.data
},
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 {
resources/js/views/FileView/MySharedItems.vue
+1 -10
View File
@@ -54,7 +54,7 @@
{{ $t('actions.search')}}
</MobileActionButton>
<MobileActionButton @click.native="$showLocations" icon="filter">
{{ filterLocationTitle }}
{{ $getCurrentLocationName() }}
</MobileActionButton>
<MobileActionButton @click.native="$enableMultiSelectMode" icon="check-square">
{{ $t('context_menu.select') }}
@@ -119,15 +119,6 @@
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 {
resources/js/views/FileView/RecentUploads.vue
+1 -10
View File
@@ -45,7 +45,7 @@
{{ $t('actions.search')}}
</MobileActionButton>
<MobileActionButton @click.native="$showLocations" icon="filter">
{{ filterLocationTitle }}
{{ $getCurrentLocationName() }}
</MobileActionButton>
<MobileActionButtonUpload>
{{ $t('context_menu.upload') }}
@@ -111,15 +111,6 @@
'clipboard',
'user',
]),
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 {
resources/js/views/FileView/SharedWithMe.vue
+2 -59
View File
@@ -1,20 +1,11 @@
<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.data.relationships.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>
@@ -25,7 +16,6 @@
<OptionUpload :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>
@@ -42,24 +32,14 @@
<OptionUpload :title="$t('actions.upload')" />
<Option @click.stop.native="$createFolder" :title="$t('actions.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="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.data.relationships.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" />
@@ -67,9 +47,6 @@
</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" />
@@ -86,9 +63,9 @@
{{ $t('actions.search') }}
</MobileActionButton>
<MobileActionButton @click.native="$showLocations" icon="filter">
{{ filterLocationTitle }}
{{ $getCurrentLocationName() }}
</MobileActionButton>
<MobileActionButton @click.native="$createItems" v-if="$checkPermission(['master', 'editor'])" icon="cloud-plus">
<MobileActionButton @click.native="$createItems" icon="cloud-plus">
{{ $t('mobile.create') }}
</MobileActionButton>
<MobileActionButton @click.native="$enableMultiSelectMode" icon="check-square">
@@ -108,9 +85,6 @@
<p class="description">
{{ $t('All items that are shared with you will be visible here.') }}
</p>
<ButtonBase @click.native="$createTeamFolder" button-style="theme" class="m-center">
{{ $t('Create your Team Folder') }}
</ButtonBase>
</template>
<template v-if="! isTeamFolderHomepage">
@@ -178,24 +152,9 @@
isFolder() {
return this.item && this.item.data.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
},
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 {
@@ -203,22 +162,6 @@
}
},
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.data.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'})
},
resources/js/views/FileView/TeamFolders.vue
+1 -10
View File
@@ -86,7 +86,7 @@
{{ $t('actions.search') }}
</MobileActionButton>
<MobileActionButton @click.native="$showLocations" icon="filter">
{{ filterLocationTitle }}
{{ $getCurrentLocationName() }}
</MobileActionButton>
<MobileActionButton @click.native="$createItems" v-if="$checkPermission(['master', 'editor'])" icon="cloud-plus">
{{ $t('mobile.create') }}
@@ -187,15 +187,6 @@
favourites() {
return this.user.data.relationships.favourites.data
},
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 {
resources/js/views/FileView/Trash.vue
+1 -10
View File
@@ -48,7 +48,7 @@
{{ $t('actions.search')}}
</MobileActionButton>
<MobileActionButton @click.native="$showLocations" icon="filter">
{{ filterLocationTitle }}
{{ $getCurrentLocationName() }}
</MobileActionButton>
<MobileActionButton @click.native="$emptyTrash" icon="trash">
{{ $t('context_menu.empty_trash') }}
@@ -103,15 +103,6 @@
...mapGetters([
'clipboard',
]),
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 {