mirror of
https://github.com/VueFileManager/vuefilemanager.git
synced 2026-04-18 16:22:14 +00:00
frontend/backend update
This commit is contained in:
carodej
@@ -7,7 +7,7 @@
|
||||
ref="contextmenu"
|
||||
>
|
||||
<!--ContextMenu for trash location-->
|
||||
<ul v-if="$isTrashLocation() && $checkPermission('master')" class="menu-options" ref="list">
|
||||
<ul v-if="$isThisLocation(['trash', 'trash-root']) && $checkPermission('master')" class="menu-options" ref="list">
|
||||
<li class="menu-option" @click="removeItem" v-if="item">
|
||||
{{ $t('context_menu.delete') }}
|
||||
</li>
|
||||
@@ -26,7 +26,26 @@
|
||||
</ul>
|
||||
|
||||
<!--ContextMenu for Base location with MASTER permission-->
|
||||
<ul v-if="$isBaseLocation() && $checkPermission('master')" class="menu-options" ref="list">
|
||||
<ul v-if="$isThisLocation(['shared']) && $checkPermission('master')" class="menu-options" ref="list">
|
||||
<li class="menu-option" @click="addToFavourites" v-if="item && isFolder">
|
||||
{{ isInFavourites ? $t('context_menu.remove_from_favourites') : $t('context_menu.add_to_favourites') }}
|
||||
</li>
|
||||
<li class="menu-option" @click="removeItem" v-if="item">
|
||||
{{ $t('context_menu.delete') }}
|
||||
</li>
|
||||
<li class="menu-option" @click="shareItem" v-if="item">
|
||||
{{ item.shared ? 'Edit Sharing' : $t('context_menu.share') }}
|
||||
</li>
|
||||
<li class="menu-option" @click="ItemDetail" v-if="item">
|
||||
{{ $t('context_menu.detail') }}
|
||||
</li>
|
||||
<li class="menu-option" @click="downloadItem" v-if="! isFolder && item">
|
||||
{{ $t('context_menu.download') }}
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<!--ContextMenu for Base location with MASTER permission-->
|
||||
<ul v-if="$isThisLocation(['base']) && $checkPermission('master')" class="menu-options" ref="list">
|
||||
<li class="menu-option" @click="addToFavourites" v-if="item && isFolder">
|
||||
{{ isInFavourites ? $t('context_menu.remove_from_favourites') : $t('context_menu.add_to_favourites') }}
|
||||
</li>
|
||||
@@ -40,7 +59,7 @@
|
||||
{{ $t('context_menu.move') }}
|
||||
</li>
|
||||
<li class="menu-option" @click="shareItem" v-if="item">
|
||||
{{ $t('context_menu.share') }}
|
||||
{{ item.shared ? 'Edit Sharing' : $t('context_menu.share') }}
|
||||
</li>
|
||||
<li class="menu-option" @click="ItemDetail" v-if="item">
|
||||
{{ $t('context_menu.detail') }}
|
||||
@@ -51,7 +70,7 @@
|
||||
</ul>
|
||||
|
||||
<!--ContextMenu for Base location with EDITOR permission-->
|
||||
<ul v-if="$isBaseLocation() && $checkPermission('editor')" class="menu-options" ref="list">
|
||||
<ul v-if="$isThisLocation(['base']) && $checkPermission('editor')" class="menu-options" ref="list">
|
||||
<li class="menu-option" @click="createFolder">
|
||||
{{ $t('context_menu.create_folder') }}
|
||||
</li>
|
||||
@@ -70,7 +89,7 @@
|
||||
</ul>
|
||||
|
||||
<!--ContextMenu for Base location with VISITOR permission-->
|
||||
<ul v-if="$isBaseLocation() && $checkPermission('visitor')" class="menu-options" ref="list">
|
||||
<ul v-if="$isThisLocation(['base']) && $checkPermission('visitor')" class="menu-options" ref="list">
|
||||
<li class="menu-option" @click="ItemDetail" v-if="item">
|
||||
{{ $t('context_menu.detail') }}
|
||||
</li>
|
||||
@@ -116,8 +135,13 @@
|
||||
events.$emit('popup:open', {name: 'move', item: this.item})
|
||||
},
|
||||
shareItem() {
|
||||
// Open share item popup
|
||||
events.$emit('popup:open', {name: 'share-create', item: this.item})
|
||||
if (this.item.shared) {
|
||||
// Open share item popup
|
||||
events.$emit('popup:open', {name: 'share-edit', item: this.item})
|
||||
} else {
|
||||
// Open share item popup
|
||||
events.$emit('popup:open', {name: 'share-create', item: this.item})
|
||||
}
|
||||
},
|
||||
addToFavourites() {
|
||||
// Check if folder is in favourites and then add/remove from favourites
|
||||
|
||||
@@ -118,7 +118,12 @@
|
||||
this.$store.commit('FLUSH_BROWSER_HISTORY')
|
||||
|
||||
} else {
|
||||
this.$store.dispatch('goToFolder', [this.previousFolder, true])
|
||||
|
||||
if ( this.$isThisLocation('public') ) {
|
||||
this.$store.dispatch('browseShared', [this.previousFolder, true])
|
||||
} else {
|
||||
this.$store.dispatch('goToFolder', [this.previousFolder, true])
|
||||
}
|
||||
}
|
||||
},
|
||||
deleteItems() {
|
||||
@@ -149,7 +154,6 @@
|
||||
z-index: 2;
|
||||
|
||||
> div {
|
||||
width: 100%;
|
||||
flex-grow: 1;
|
||||
align-self: center;
|
||||
white-space: nowrap;
|
||||
|
||||
@@ -1,20 +1,32 @@
|
||||
<template>
|
||||
<div class="empty-page" v-if="isLoading || isEmpty">
|
||||
<div class="empty-state">
|
||||
<div class="text-content" v-if="isEmpty && !isLoading">
|
||||
|
||||
<!--Shared empty message-->
|
||||
<div class="text-content" v-if="$isThisLocation(['shared']) && ! isLoading">
|
||||
<h1 class="title">You Haven't Shared Anything Yet</h1>
|
||||
</div>
|
||||
|
||||
<!--Trash empty message-->
|
||||
<div class="text-content" v-if="$isThisLocation(['trash', 'trash-root']) && ! isLoading">
|
||||
<h1 class="title">{{ $t('empty_page.title') }}</h1>
|
||||
<p v-if="! isTrash" class="description">
|
||||
{{ $t('empty_page.description') }}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!--Base file browser empty message-->
|
||||
<div class="text-content" v-if="$isThisLocation(['base', 'public']) && !isLoading">
|
||||
<h1 class="title">{{ $t('empty_page.title') }}</h1>
|
||||
<p v-if="$checkPermission(['master', 'editor'])" class="description">{{ $t('empty_page.description') }}</p>
|
||||
<ButtonUpload
|
||||
v-if="! isTrash"
|
||||
v-if="$checkPermission(['master', 'editor'])"
|
||||
@input.native="$uploadFiles(files)"
|
||||
v-model="files"
|
||||
button-style="theme"
|
||||
>{{ $t('empty_page.call_to_action') }}
|
||||
</ButtonUpload
|
||||
>
|
||||
{{ $t('empty_page.call_to_action') }}
|
||||
</ButtonUpload>
|
||||
</div>
|
||||
|
||||
<!--Spinner-->
|
||||
<div class="text-content" v-if="isLoading">
|
||||
<Spinner/>
|
||||
</div>
|
||||
@@ -38,9 +50,6 @@
|
||||
...mapGetters(['data', 'isLoading', 'currentFolder']),
|
||||
isEmpty() {
|
||||
return this.data.length == 0
|
||||
},
|
||||
isTrash() {
|
||||
return this.currentFolder.location === 'trash' || this.currentFolder.location === 'trash-root'
|
||||
}
|
||||
},
|
||||
data() {
|
||||
|
||||
@@ -61,7 +61,7 @@
|
||||
</div>
|
||||
|
||||
<!--Show empty page if folder is empty-->
|
||||
<EmptyPage v-if="!isSearching"/>
|
||||
<EmptyPage v-if="! isSearching"/>
|
||||
|
||||
<!--Show empty page if no search results-->
|
||||
<EmptyMessage
|
||||
|
||||
@@ -43,13 +43,13 @@
|
||||
</li>
|
||||
|
||||
<!--Parent-->
|
||||
<li v-if="$checkPermission('master')" class="list-info-item">
|
||||
<li v-if="$checkPermission('master') && fileInfoDetail.shared" class="list-info-item">
|
||||
<b>Shared</b>
|
||||
<div class="action-button" @click="shareItemOptions">
|
||||
<FontAwesomeIcon class="icon" icon="user-edit" />
|
||||
<span>Can edit and upload files</span>
|
||||
<FontAwesomeIcon class="icon" :icon="sharedIcon" />
|
||||
<span>{{ sharedInfo }}</span>
|
||||
</div>
|
||||
<CopyInput class="copy-sharelink" size="small" :value="shareLink" />
|
||||
<CopyInput class="copy-sharelink" size="small" :value="fileInfoDetail.shared.link" />
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -87,12 +87,31 @@
|
||||
return 'file-audio'
|
||||
break;
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
shareLink: 'http://192.168.1.131:8000/shared?token=3ZlQLIoCR8izoc0PemekHNq3UIMj6OrC0aQ2zowclfjFYa8P6go8fMKPnXTJomvz'
|
||||
}
|
||||
},
|
||||
sharedInfo() {
|
||||
switch (this.fileInfoDetail.shared.permission) {
|
||||
case 'editor':
|
||||
return 'Can edit and upload files'
|
||||
break
|
||||
case 'visitor':
|
||||
return 'Can only view and download'
|
||||
break
|
||||
default:
|
||||
return 'Can download file'
|
||||
}
|
||||
},
|
||||
sharedIcon() {
|
||||
switch (this.fileInfoDetail.shared.permission) {
|
||||
case 'editor':
|
||||
return 'user-edit'
|
||||
break
|
||||
case 'visitor':
|
||||
return 'user'
|
||||
break
|
||||
default:
|
||||
return 'download'
|
||||
}
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
shareItemOptions() {
|
||||
|
||||
@@ -50,7 +50,7 @@
|
||||
|
||||
<div class="item-info">
|
||||
<!--Shared Icon-->
|
||||
<div v-if="$checkPermission('master')" class="item-shared">
|
||||
<div v-if="$checkPermission('master') && data.shared" class="item-shared">
|
||||
<FontAwesomeIcon class="shared-icon" icon="user-friends"/>
|
||||
</div>
|
||||
|
||||
@@ -91,7 +91,7 @@
|
||||
return this.data.type === 'image'
|
||||
},
|
||||
canEditName() {
|
||||
return ! this.$isMobile() && ! this.$isTrashLocation() && ! this.$checkPermission('visitor')
|
||||
return ! this.$isMobile() && ! this.$isThisLocation(['trash', 'trash-root']) && ! this.$checkPermission('visitor')
|
||||
},
|
||||
timeStamp() {
|
||||
return this.data.deleted_at ? this.$t('item_thumbnail.deleted_at', this.data.deleted_at) : this.data.created_at
|
||||
@@ -136,7 +136,11 @@
|
||||
if (this.$isMobile() && this.isFolder) {
|
||||
|
||||
// Go to folder
|
||||
this.$store.dispatch('goToFolder', [this.data, false])
|
||||
if ( this.$isThisLocation('public') ) {
|
||||
this.$store.dispatch('browseShared', [this.data, false])
|
||||
} else {
|
||||
this.$store.dispatch('goToFolder', [this.data, false])
|
||||
}
|
||||
}
|
||||
|
||||
// Load file info detail
|
||||
@@ -166,7 +170,11 @@
|
||||
|
||||
if (this.isFolder) {
|
||||
// Go to folder
|
||||
this.$store.dispatch('goToFolder', [this.data, false])
|
||||
if ( this.$isThisLocation('public') ) {
|
||||
this.$store.dispatch('browseShared', [this.data, false])
|
||||
} else {
|
||||
this.$store.dispatch('goToFolder', [this.data, false])
|
||||
}
|
||||
}
|
||||
},
|
||||
changeItemName: debounce(function (e) {
|
||||
|
||||
@@ -49,7 +49,7 @@
|
||||
<div class="item-info">
|
||||
|
||||
<!--Shared Icon-->
|
||||
<div v-if="$checkPermission('master')" class="item-shared">
|
||||
<div v-if="$checkPermission('master') && data.shared" class="item-shared">
|
||||
<FontAwesomeIcon class="shared-icon" icon="user-friends"/>
|
||||
</div>
|
||||
|
||||
@@ -93,7 +93,7 @@
|
||||
return this.data.type === 'image'
|
||||
},
|
||||
canEditName() {
|
||||
return ! this.$isMobile() && ! this.$isTrashLocation() && ! this.$checkPermission('visitor')
|
||||
return ! this.$isMobile() && ! this.$isThisLocation(['trash', 'trash-root']) && ! this.$checkPermission('visitor')
|
||||
},
|
||||
timeStamp() {
|
||||
return this.data.deleted_at ? this.$t('item_thumbnail.deleted_at', {time: this.data.deleted_at}) : this.data.created_at
|
||||
@@ -151,7 +151,11 @@
|
||||
if (this.$isMobile() && this.isFolder) {
|
||||
|
||||
// Go to folder
|
||||
this.$store.dispatch('goToFolder', [this.data, false])
|
||||
if ( this.$isThisLocation('public') ) {
|
||||
this.$store.dispatch('browseShared', [this.data, false])
|
||||
} else {
|
||||
this.$store.dispatch('goToFolder', [this.data, false])
|
||||
}
|
||||
}
|
||||
|
||||
// Load file info detail
|
||||
@@ -180,8 +184,12 @@
|
||||
}
|
||||
|
||||
if (this.isFolder) {
|
||||
// Go to folder
|
||||
this.$store.dispatch('goToFolder', [this.data, false])
|
||||
|
||||
if ( this.$isThisLocation('public') ) {
|
||||
this.$store.dispatch('browseShared', [this.data, false])
|
||||
} else {
|
||||
this.$store.dispatch('goToFolder', [this.data, false])
|
||||
}
|
||||
}
|
||||
},
|
||||
changeItemName: debounce(function (e) {
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
<div id="mobile-actions-wrapper" v-if="$isMinimalScale()">
|
||||
|
||||
<!--Actions for trash location with MASTER permission--->
|
||||
<div v-if="$isTrashLocation() && $checkPermission('master')" class="mobile-actions">
|
||||
<div v-if="$isThisLocation(['trash', 'trash-root']) && $checkPermission('master')" class="mobile-actions">
|
||||
<MobileActionButton @click.native="switchPreview" :icon="previewIcon">
|
||||
{{ previewText }}
|
||||
</MobileActionButton>
|
||||
@@ -12,7 +12,7 @@
|
||||
</div>
|
||||
|
||||
<!--ContextMenu for Base location with MASTER permission-->
|
||||
<div v-if="$isBaseLocation() && $checkPermission(['master', 'editor'])" class="mobile-actions">
|
||||
<div v-if="$isThisLocation(['base', 'shared']) && $checkPermission(['master', 'editor'])" class="mobile-actions">
|
||||
<MobileActionButton @click.native="createFolder" icon="folder-plus">
|
||||
{{ $t('context_menu.add_folder') }}
|
||||
</MobileActionButton>
|
||||
@@ -25,7 +25,7 @@
|
||||
</div>
|
||||
|
||||
<!--ContextMenu for Base location with VISITOR permission-->
|
||||
<div v-if="$isBaseLocation() && $checkPermission('visitor')" class="mobile-actions">
|
||||
<div v-if="$isThisLocation(['base', 'shared']) && $checkPermission('visitor')" class="mobile-actions">
|
||||
<MobileActionButton @click.native="switchPreview" :icon="previewIcon">
|
||||
{{ previewText }}
|
||||
</MobileActionButton>
|
||||
|
||||
@@ -10,7 +10,7 @@
|
||||
<div class="menu-wrapper">
|
||||
|
||||
<!--Mobile for trash location-->
|
||||
<ul v-if="$isTrashLocation() && $checkPermission('master')" class="menu-options">
|
||||
<ul v-if="$isThisLocation(['trash', 'trash-root']) && $checkPermission('master')" class="menu-options">
|
||||
<li class="menu-option" @click="$store.dispatch('restoreItem', fileInfoDetail)" v-if="fileInfoDetail">
|
||||
{{ $t('context_menu.restore') }}
|
||||
</li>
|
||||
@@ -23,7 +23,26 @@
|
||||
</ul>
|
||||
|
||||
<!--Mobile for Base location-->
|
||||
<ul v-if="$isBaseLocation() && $checkPermission('master')" class="menu-options">
|
||||
<ul v-if="$isThisLocation(['shared']) && $checkPermission('master')" class="menu-options">
|
||||
<li class="menu-option" @click="addToFavourites" v-if="fileInfoDetail && isFolder">
|
||||
{{ isInFavourites ? $t('context_menu.remove_from_favourites') : $t('context_menu.add_to_favourites') }}
|
||||
</li>
|
||||
<li class="menu-option" @click="renameItem" v-if="fileInfoDetail">
|
||||
{{ $t('context_menu.rename') }}
|
||||
</li>
|
||||
<li class="menu-option" @click="shareItem" v-if="fileInfoDetail">
|
||||
{{ fileInfoDetail.shared ? 'Edit Sharing' : $t('context_menu.share') }}
|
||||
</li>
|
||||
<li class="menu-option" @click="downloadItem" v-if="! isFolder">
|
||||
{{ $t('context_menu.download') }}
|
||||
</li>
|
||||
<li class="menu-option delete" @click="removeItem" v-if="fileInfoDetail">
|
||||
{{ $t('context_menu.delete') }}
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<!--Mobile for Base location-->
|
||||
<ul v-if="$isThisLocation(['base']) && $checkPermission('master')" class="menu-options">
|
||||
<li class="menu-option" @click="addToFavourites" v-if="fileInfoDetail && isFolder">
|
||||
{{ isInFavourites ? $t('context_menu.remove_from_favourites') : $t('context_menu.add_to_favourites') }}
|
||||
</li>
|
||||
@@ -34,7 +53,7 @@
|
||||
{{ $t('context_menu.move') }}
|
||||
</li>
|
||||
<li class="menu-option" @click="shareItem" v-if="fileInfoDetail">
|
||||
{{ $t('context_menu.share') }}
|
||||
{{ fileInfoDetail.shared ? 'Edit Sharing' : $t('context_menu.share') }}
|
||||
</li>
|
||||
<li class="menu-option" @click="downloadItem" v-if="! isFolder">
|
||||
{{ $t('context_menu.download') }}
|
||||
@@ -45,7 +64,7 @@
|
||||
</ul>
|
||||
|
||||
<!--Mobile for Base location with EDITOR permission-->
|
||||
<ul v-if="$isBaseLocation() && $checkPermission('editor')" class="menu-options">
|
||||
<ul v-if="$isThisLocation(['base']) && $checkPermission('editor')" class="menu-options">
|
||||
<li class="menu-option" @click="renameItem" v-if="fileInfoDetail">
|
||||
{{ $t('context_menu.rename') }}
|
||||
</li>
|
||||
@@ -58,7 +77,7 @@
|
||||
</ul>
|
||||
|
||||
<!--Mobile for Base location with VISITOR permission-->
|
||||
<ul v-if="$isBaseLocation() && $checkPermission('visitor')" class="menu-options">
|
||||
<ul v-if="$isThisLocation(['base']) && $checkPermission('visitor')" class="menu-options">
|
||||
<li class="menu-option" @click="downloadItem" v-if="! isFolder">
|
||||
{{ $t('context_menu.download') }}
|
||||
</li>
|
||||
@@ -104,9 +123,13 @@
|
||||
events.$emit('popup:open', {name: 'move', item: this.fileInfoDetail})
|
||||
},
|
||||
shareItem() {
|
||||
// Open share item popup
|
||||
events.$emit('popup:open', {name: 'share-create', item: this.fileInfoDetail})
|
||||
|
||||
if (this.fileInfoDetail.shared) {
|
||||
// Open share item popup
|
||||
events.$emit('popup:open', {name: 'share-edit', item: this.fileInfoDetail})
|
||||
} else {
|
||||
// Open share item popup
|
||||
events.$emit('popup:open', {name: 'share-create', item: this.fileInfoDetail})
|
||||
}
|
||||
},
|
||||
addToFavourites() {
|
||||
if (this.app.favourites && !this.app.favourites.find(el => el.unique_id == this.fileInfoDetail.unique_id)) {
|
||||
|
||||
@@ -75,7 +75,11 @@
|
||||
this.$store.commit('FLUSH_BROWSER_HISTORY')
|
||||
|
||||
} else {
|
||||
this.$store.dispatch('goToFolder', [this.previousFolder, true])
|
||||
if ( this.$isThisLocation('public') ) {
|
||||
this.$store.dispatch('browseShared', [this.previousFolder, false])
|
||||
} else {
|
||||
this.$store.dispatch('goToFolder', [this.previousFolder, false])
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
|
||||
@@ -49,11 +49,13 @@
|
||||
this.$store.dispatch('getSearchResult', value)
|
||||
} else if (typeof value !== 'undefined') {
|
||||
if (this.currentFolder) {
|
||||
|
||||
// Get back after delete query to previosly folder
|
||||
this.$store.dispatch('goToFolder', [
|
||||
this.currentFolder,
|
||||
true
|
||||
])
|
||||
if ( this.$isThisLocation('public') ) {
|
||||
this.$store.dispatch('browseShared', [this.currentFolder, true])
|
||||
} else {
|
||||
this.$store.dispatch('goToFolder', [this.currentFolder, true])
|
||||
}
|
||||
}
|
||||
|
||||
this.$store.commit('CHANGE_SEARCHING_STATE', false)
|
||||
|
||||
@@ -8,7 +8,7 @@
|
||||
type="file"
|
||||
name="files[]"
|
||||
multiple
|
||||
:disabled="$isTrashLocation() ? true : false"
|
||||
:disabled="$isThisLocation(['trash', 'trash-root'])"
|
||||
/>
|
||||
</label>
|
||||
</template>
|
||||
|
||||
@@ -97,7 +97,7 @@
|
||||
required,
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['app']),
|
||||
...mapGetters(['app', 'permissionOptions']),
|
||||
itemTypeTitle() {
|
||||
return this.pickedItem && this.pickedItem.type === 'folder' ? 'Folder' : 'File'
|
||||
},
|
||||
@@ -114,19 +114,9 @@
|
||||
isPassword: false,
|
||||
password: undefined,
|
||||
permission: undefined,
|
||||
type: undefined,
|
||||
unique_id: undefined,
|
||||
},
|
||||
permissionOptions: [
|
||||
{
|
||||
label: 'Can edit and upload files',
|
||||
value: 'editor',
|
||||
icon: 'user-edit',
|
||||
},
|
||||
{
|
||||
label: 'Can only view and download',
|
||||
value: 'visitor',
|
||||
icon: 'user',
|
||||
},
|
||||
],
|
||||
pickedItem: undefined,
|
||||
shareLink: undefined,
|
||||
isGeneratedShared: false,
|
||||
@@ -158,8 +148,10 @@
|
||||
// End loading
|
||||
this.isLoading = false
|
||||
|
||||
this.shareLink = response.data
|
||||
this.shareLink = response.data.link
|
||||
this.isGeneratedShared = true
|
||||
|
||||
this.$store.commit('UPDATE_SHARED_ITEM', response.data)
|
||||
})
|
||||
.catch(error => {
|
||||
|
||||
@@ -179,6 +171,9 @@
|
||||
|
||||
// Store picked item
|
||||
this.pickedItem = args.item
|
||||
|
||||
this.shareOptions.type = args.item.type
|
||||
this.shareOptions.unique_id = args.item.unique_id
|
||||
})
|
||||
|
||||
// Close popup
|
||||
@@ -192,6 +187,8 @@
|
||||
permission: undefined,
|
||||
password: undefined,
|
||||
isPassword: false,
|
||||
type: undefined,
|
||||
unique_id: undefined,
|
||||
}
|
||||
}, 150)
|
||||
})
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
<PopupHeader title="Update sharing options" />
|
||||
|
||||
<!--Content-->
|
||||
<PopupContent>
|
||||
<PopupContent v-if="pickedItem && pickedItem.shared">
|
||||
|
||||
<!--Item Thumbnail-->
|
||||
<ThumbnailItem class="item-thumbnail" :item="pickedItem" info="metadata"/>
|
||||
@@ -15,13 +15,13 @@
|
||||
<!--Share link-->
|
||||
<div class="input-wrapper">
|
||||
<label class="input-label">Share url:</label>
|
||||
<CopyInput size="small" :value="shareLink" />
|
||||
<CopyInput size="small" :value="pickedItem.shared.link" />
|
||||
</div>
|
||||
|
||||
<!--Permision Select-->
|
||||
<ValidationProvider v-if="isFolder" tag="div" mode="passive" class="input-wrapper" name="Permission" rules="required" v-slot="{ errors }">
|
||||
<label class="input-label">Permission:</label>
|
||||
<SelectInput v-model="shareOptions.permission" :options="permissionOptions" default="visitor" :isError="errors[0]"/>
|
||||
<SelectInput v-model="shareOptions.permission" :options="permissionOptions" :default="shareOptions.permission" :isError="errors[0]"/>
|
||||
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
|
||||
</ValidationProvider>
|
||||
|
||||
@@ -29,13 +29,13 @@
|
||||
<div class="input-wrapper">
|
||||
<div class="inline-wrapper">
|
||||
<label class="input-label">Password Protected:</label>
|
||||
<SwitchInput v-model="shareOptions.isPassword" class="switch" :state="0"/>
|
||||
<SwitchInput v-model="shareOptions.isProtected" :state="shareOptions.isProtected" class="switch"/>
|
||||
</div>
|
||||
<ActionButton @click.native="changePassword" v-if="isPasswordChangeButton" icon="pencil-alt">Change Password</ActionButton>
|
||||
<ActionButton v-if="(pickedItem.shared.protected && canChangePassword) && shareOptions.isProtected" @click.native="changePassword" icon="pencil-alt">Change Password</ActionButton>
|
||||
</div>
|
||||
|
||||
<!--Set password-->
|
||||
<ValidationProvider v-if="isPasswordInput || shareOptions.isPassword" tag="div" mode="passive" class="input-wrapper password" name="Password" rules="required" v-slot="{ errors }">
|
||||
<ValidationProvider v-if="shareOptions.isProtected && ! canChangePassword" tag="div" mode="passive" class="input-wrapper password" name="Password" rules="required" v-slot="{ errors }">
|
||||
<input v-model="shareOptions.password" :class="{'is-error': errors[0]}" type="text" placeholder="Type your password">
|
||||
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
|
||||
</ValidationProvider>
|
||||
@@ -50,15 +50,17 @@
|
||||
class="popup-button"
|
||||
@click.native="destroySharing"
|
||||
:button-style="destroyButtonStyle"
|
||||
:loading="isDeleting"
|
||||
:disabled="isDeleting"
|
||||
>{{ destroyButtonText }}
|
||||
</ButtonBase>
|
||||
<ButtonBase
|
||||
class="popup-button"
|
||||
@click.native="submitShareOptions"
|
||||
@click.native="updateShareOptions"
|
||||
button-style="theme"
|
||||
:loading="isLoading"
|
||||
:disabled="isLoading"
|
||||
>Save Changes
|
||||
>Ok
|
||||
</ButtonBase>
|
||||
</PopupActions>
|
||||
</PopupWrapper>
|
||||
@@ -99,7 +101,7 @@
|
||||
required,
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['app']),
|
||||
...mapGetters(['app', 'permissionOptions', 'currentFolder']),
|
||||
isFolder() {
|
||||
return this.pickedItem && this.pickedItem.type === 'folder'
|
||||
},
|
||||
@@ -108,58 +110,72 @@
|
||||
},
|
||||
destroyButtonStyle() {
|
||||
return this.isConfirmedDestroy ? 'danger-solid' : 'secondary'
|
||||
}
|
||||
},
|
||||
isSharedLocation() {
|
||||
return this.currentFolder && this.currentFolder.location === 'shared'
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
shareOptions: {
|
||||
isPassword: false,
|
||||
password: undefined,
|
||||
permission: undefined,
|
||||
},
|
||||
permissionOptions: [
|
||||
{
|
||||
label: 'Can edit and upload files',
|
||||
value: 'editor',
|
||||
icon: 'user-edit',
|
||||
},
|
||||
{
|
||||
label: 'Can only view and download',
|
||||
value: 'visitor',
|
||||
icon: 'user',
|
||||
},
|
||||
],
|
||||
shareOptions: undefined,
|
||||
pickedItem: undefined,
|
||||
isLoading: false,
|
||||
isPasswordInput: false,
|
||||
isPasswordChangeButton: true,
|
||||
isDeleting: false,
|
||||
canChangePassword: false,
|
||||
isConfirmedDestroy: false,
|
||||
shareLink: 'http://192.168.1.131:8000/shared?token=3ZlQLIoCR8izoc0PemekHNq3UIMj6OrC0aQ2zowclfjFYa8P6go8fMKPnXTJomvz'
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
changePassword() {
|
||||
this.isPasswordInput = true
|
||||
this.isPasswordChangeButton = false
|
||||
this.canChangePassword = false
|
||||
},
|
||||
destroySharing() {
|
||||
|
||||
// Set confirm button
|
||||
if (! this.isConfirmedDestroy) {
|
||||
this.isConfirmedDestroy = true
|
||||
|
||||
return
|
||||
this.isConfirmedDestroy = true
|
||||
} else {
|
||||
|
||||
this.$closePopup()
|
||||
// Start deleting spinner button
|
||||
this.isDeleting = true
|
||||
|
||||
// Send delete request
|
||||
axios
|
||||
.delete('/api/share/remove', {
|
||||
params: {
|
||||
token: this.pickedItem.shared.token
|
||||
}
|
||||
})
|
||||
.then(() => {
|
||||
|
||||
// Remove item from file browser
|
||||
if ( this.isSharedLocation ) {
|
||||
this.$store.commit('REMOVE_ITEM', this.pickedItem.unique_id)
|
||||
}
|
||||
|
||||
// Flush shared data
|
||||
this.$store.commit('FLUSH_SHARED', this.pickedItem.unique_id)
|
||||
|
||||
// End deleting spinner button
|
||||
this.isDeleting = false
|
||||
|
||||
this.$closePopup()
|
||||
})
|
||||
.catch(() => {
|
||||
|
||||
// End deleting spinner button
|
||||
this.isDeleting = false
|
||||
})
|
||||
}
|
||||
},
|
||||
async submitShareOptions() {
|
||||
async updateShareOptions() {
|
||||
|
||||
// If shared was generated, then close popup
|
||||
if (this.isGeneratedShared) {
|
||||
events.$emit('popup:close')
|
||||
|
||||
return;
|
||||
events.$emit('popup:close')
|
||||
return
|
||||
}
|
||||
|
||||
// Validate fields
|
||||
@@ -171,14 +187,16 @@
|
||||
|
||||
// Send request to get share link
|
||||
axios
|
||||
.post('/api/share/generate', this.shareOptions)
|
||||
.post('/api/share/update', this.shareOptions)
|
||||
.then(response => {
|
||||
|
||||
// End loading
|
||||
this.isLoading = false
|
||||
|
||||
this.shareLink = response.data
|
||||
this.isGeneratedShared = true
|
||||
// Update shared data
|
||||
this.$store.commit('UPDATE_SHARED_ITEM', response.data)
|
||||
|
||||
events.$emit('popup:close')
|
||||
})
|
||||
.catch(error => {
|
||||
|
||||
@@ -198,6 +216,16 @@
|
||||
|
||||
// Store picked item
|
||||
this.pickedItem = args.item
|
||||
|
||||
// Store shared options
|
||||
this.shareOptions = {
|
||||
token: args.item.shared.token,
|
||||
isProtected: args.item.shared.protected,
|
||||
permission: args.item.shared.permission,
|
||||
password: undefined,
|
||||
}
|
||||
|
||||
this.canChangePassword = args.item.shared.protected
|
||||
})
|
||||
|
||||
// Close popup
|
||||
@@ -206,14 +234,9 @@
|
||||
// Restore data
|
||||
setTimeout(() => {
|
||||
this.isConfirmedDestroy = false
|
||||
this.isPasswordInput = false
|
||||
this.isPasswordChangeButton = true
|
||||
//this.shareLink = undefined
|
||||
this.shareOptions = {
|
||||
permission: undefined,
|
||||
password: undefined,
|
||||
isPassword: false,
|
||||
}
|
||||
this.canChangePassword = false
|
||||
this.pickedItem = undefined
|
||||
this.shareOptions = undefined
|
||||
}, 150)
|
||||
})
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user