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

Merge remote-tracking branch 'origin/master' into folders_upload

Browse Source
This commit is contained in:
Milos Holba
2021-08-11 17:46:57 +02:00
parent ec2a10e32f 34a1f31f96
commit 387c824647
330 changed files with 3749 additions and 3423 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/js/App.vue
+9 -9
View File
@@ -3,7 +3,7 @@
<!--UI components-->
<Alert />
<ToastrWrapper />
<ToasterWrapper />
<CookieDisclaimer />
<!--Show spinner before translations is loaded-->
@@ -17,11 +17,11 @@
</template>
<script>
import ToastrWrapper from '@/components/Others/Notifications/ToastrWrapper'
import CookieDisclaimer from '@/components/Others/CookieDisclaimer'
import Spinner from '@/components/FilesView/Spinner'
import Vignette from '@/components/Others/Vignette'
import Alert from '@/components/FilesView/Alert'
import ToasterWrapper from '/resources/js/components/Others/Notifications/ToasterWrapper'
import CookieDisclaimer from '/resources/js/components/Others/CookieDisclaimer'
import Spinner from '/resources/js/components/FilesView/Spinner'
import Vignette from '/resources/js/components/Others/Vignette'
import Alert from '/resources/js/components/FilesView/Alert'
import {mapGetters} from 'vuex'
import {events} from './bus'
@@ -29,7 +29,7 @@ export default {
name: 'app',
components: {
CookieDisclaimer,
ToastrWrapper,
ToasterWrapper,
Vignette,
Spinner,
Alert
@@ -115,8 +115,8 @@ export default {
<style lang="scss">
@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@200;300;400;600;700;800;900&display=swap');
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
[v-cloak],
[v-cloak] > * {
resources/js/components/Admin/WidgetLatestRegistrations.vue
+6 -6
View File
@@ -44,11 +44,11 @@
</template>
<script>
import DatatableCellImage from '@/components/Others/Tables/DatatableCellImage'
import DatatableWrapper from '@/components/Others/Tables/DatatableWrapper'
import WidgetWrapper from '@/components/Admin/WidgetWrapper'
import DatatableCellImage from '/resources/js/components/Others/Tables/DatatableCellImage'
import DatatableWrapper from '/resources/js/components/Others/Tables/DatatableWrapper'
import WidgetWrapper from '/resources/js/components/Admin/WidgetWrapper'
import {Trash2Icon, Edit2Icon} from "vue-feather-icons"
import ColorLabel from '@/components/Others/ColorLabel'
import ColorLabel from '/resources/js/components/Others/ColorLabel'
import axios from 'axios'
export default {
@@ -110,8 +110,8 @@
</script>
<style lang="scss" scoped>
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.dark-mode {
resources/js/components/Admin/WidgetTotals.vue
+3 -3
View File
@@ -11,7 +11,7 @@
</template>
<script>
import WidgetWrapper from '@/components/Admin/WidgetWrapper'
import WidgetWrapper from '/resources/js/components/Admin/WidgetWrapper'
import { UsersIcon, StarIcon, HardDriveIcon, ChevronRightIcon } from 'vue-feather-icons'
export default {
@@ -28,8 +28,8 @@
</script>
<style lang="scss" scoped>
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.widget-value {
margin-top: 10px;
resources/js/components/Admin/WidgetWrapper.vue
+2 -2
View File
@@ -30,8 +30,8 @@
</script>
<style lang="scss" scoped>
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.widget-content {
@include widget-card;
resources/js/components/Auth/AuthButton.vue
+2 -2
View File
@@ -28,8 +28,8 @@
</script>
<style scoped lang="scss">
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.button {
cursor: pointer;
resources/js/components/Desktop/PopoverItem.vue
+8 -4
View File
@@ -5,7 +5,7 @@
</template>
<script>
import {events} from '@/bus'
import {events} from '/resources/js/bus'
export default {
name: 'PopoverItem',
@@ -23,14 +23,18 @@
if (this.name === name) this.isVisible = !this.isVisible
})
events.$on('unClick', () => this.isVisible = false)
events.$on('popover:close', name => {
if (this.name === name) this.isVisible = false
})
// todo: events.$on('unClick', () => this.isVisible = false)
}
}
</script>
<style scoped lang="scss">
@import "@assets/vuefilemanager/_variables";
@import "@assets/vuefilemanager/_mixins";
@import "resources/sass/vuefilemanager/_variables";
@import "resources/sass/vuefilemanager/_mixins";
.popover-item {
min-width: 250px;
resources/js/components/Desktop/ToolbarWrapper.vue
+2 -2
View File
@@ -11,8 +11,8 @@
</script>
<style scoped lang="scss">
@import "@assets/vuefilemanager/_variables";
@import "@assets/vuefilemanager/_mixins";
@import "resources/sass/vuefilemanager/_variables";
@import "resources/sass/vuefilemanager/_mixins";
.toolbar-tools {
text-align: right;
resources/js/components/FilesView/FilePreview.vue → resources/js/components/FilePreview/FilePreview.vue
+7 -10
View File
@@ -14,9 +14,9 @@
</template>
<script>
import FilePreviewToolbar from '@/components/FilesView/FilePreviewToolbar'
import FilePreviewMedia from '@/components/FilesView/FilePreviewMedia'
import {events} from '@/bus'
import FilePreviewToolbar from '/resources/js/components/FilePreview/FilePreviewToolbar'
import FilePreviewMedia from '/resources/js/components/FilePreview/FilePreviewMedia'
import {events} from '/resources/js/bus'
export default {
name: 'FilePreview',
@@ -32,6 +32,7 @@
methods: {
closeFilePreview() {
this.isFullPreview = false
this.$store.commit('FAST_PREVIEW_CLEAR')
},
next() {
events.$emit('file-preview:next')
@@ -46,18 +47,14 @@
}
},
mounted() {
events.$on('file-preview:show', () => {
this.isFullPreview = true
})
events.$on('file-preview:hide', () => {
this.isFullPreview = false
})
events.$on('file-preview:show', () => this.isFullPreview = true)
events.$on('file-preview:hide', () => this.closeFilePreview())
}
}
</script>
<style lang="scss" scoped>
@import '@assets/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_variables';
.file-preview {
width: 100%;
resources/js/components/FilePreview/FilePreviewMedia.vue
+263
View File
@@ -0,0 +1,263 @@
<template>
<div v-if="currentFile" class="file-preview-wrapper">
<!--Arrow navigation-->
<div v-if="files.length > 1" class="navigation-arrows">
<div @click.prevent="prev" class="prev">
<chevron-left-icon size="17" />
</div>
<div @click.prevent="next" class="next">
<chevron-right-icon size="17" />
</div>
</div>
<!--File preview-->
<div class="file-wrapper-preview">
<!--Show PDF-->
<PdfFile v-if="isPDF" :file="currentFile"/>
<!--Show Audio, Video and Image-->
<div v-if="isAudio || isImage || isVideo" class="file-wrapper">
<Audio v-if="isAudio" :file="currentFile"/>
<Video v-if="isVideo" :file="currentFile"/>
<ImageFile v-if="isImage" :file="currentFile"/>
</div>
</div>
</div>
</template>
<script>
import {ChevronLeftIcon, ChevronRightIcon} from 'vue-feather-icons'
import ToolbarButton from '/resources/js/components/FilesView/ToolbarButton'
import ImageFile from '/resources/js/components/FilePreview/Media/ImageFile'
import PdfFile from '/resources/js/components/FilePreview/Media/PdfFile'
import Audio from '/resources/js/components/FilePreview/Media/Audio'
import Video from '/resources/js/components/FilePreview/Media/Video'
import Spinner from '/resources/js/components/FilesView/Spinner'
import {mapGetters} from 'vuex'
import {events} from '/resources/js/bus'
export default {
name: 'FilePreviewMedia',
components: {
ChevronRightIcon,
ChevronLeftIcon,
ToolbarButton,
ImageFile,
PdfFile,
Spinner,
Audio,
Video,
},
computed: {
...mapGetters([
'fastPreview',
'clipboard',
'entries',
]),
currentFile() {
return this.fastPreview
? this.fastPreview
: this.files[Math.abs(this.currentIndex) % this.files.length]
},
isPDF() {
return this.currentFile.mimetype === 'pdf'
},
isVideo() {
return this.currentFile.type === 'video'
},
isAudio() {
return this.currentFile.type === 'audio'
},
isImage() {
return this.currentFile.type === 'image'
}
},
data() {
return {
currentIndex: 0,
files: [],
}
},
watch: {
files() {
if (this.files.length === 0)
events.$emit('file-preview-wrapper:hide')
},
currentFile() {
if (this.clipboard[0]) {
this.$store.commit('CLIPBOARD_CLEAR')
this.$store.commit('ADD_ITEM_TO_CLIPBOARD', this.currentFile)
}
},
clipboard() {
if (!this.clipboard[0]) {
this.currentIndex -= 1
this.$store.commit('ADD_ITEM_TO_CLIPBOARD', this.currentFile)
this.files = []
}
},
data(newValue, oldValue) {
if (newValue !== oldValue) {
this.files = []
}
},
},
methods: {
getFilesForView() {
let requestedFile = this.clipboard[0]
this.entries.map(element => {
if (requestedFile.mimetype === 'pdf') {
if (element.mimetype === 'pdf')
this.files.push(element)
} else {
if (element.type === requestedFile.type)
this.files.push(element)
}
})
this.files.forEach((element, index) => {
if (element.id === this.clipboard[0].id) {
this.currentIndex = index
}
})
},
next() {
if (!this.files.length > 1) return
this.currentIndex += 1
if (this.currentIndex > this.files.length - 1) {
this.currentIndex = 0
}
},
prev() {
if (!this.files.length > 1) return
this.currentIndex -= 1
if (this.currentIndex < 0) {
this.currentIndex = this.files.length - 1
}
}
},
created() {
events.$on('file-preview:next', () => this.next())
events.$on('file-preview:prev', () => this.prev())
this.getFilesForView()
}
}
</script>
<style lang="scss">
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.navigation-arrows {
.prev, .next {
cursor: pointer;
position: absolute;
top: 45%;
display: flex;
justify-content: center;
color: $text;
border-radius: 50%;
text-decoration: none;
user-select: none;
filter: drop-shadow(0px 1px 0 rgba(255, 255, 255, 1));
padding: 10px;
z-index: 2;
}
.next {
right: 0;
}
.prev {
left: 0;
}
}
.file-preview-wrapper {
height: calc(100% - 72px);
top: 72px;
position: relative;
background-color: white;
}
.file-wrapper-preview {
width: 100%;
height: 100%;
padding: 30px 0px;
display: flex;
overflow: hidden;
justify-content: center;
align-items: center;
background-color: white;
.file-wrapper {
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
.file-shadow {
box-shadow: 0 8px 40px rgba(17, 26, 52, 0.05);
}
.file {
max-width: 100%;
max-height: 100%;
align-self: center;
}
.audio {
border-radius: 28px;
}
img {
border-radius: 4px;
}
}
}
@media only screen and (max-width: 960px) {
.file-preview-wrapper {
top: 53px;
}
}
.dark-mode {
.navigation-arrows {
.prev, .next {
color: $light-text;
filter: drop-shadow(0px 1px 0 rgba(17, 19, 20, 1));
}
}
.file-wrapper-preview {
background-color: $dark_mode_background;
.file-wrapper {
.file-shadow {
box-shadow: 0 8px 40px rgba(0, 0, 0, 0.1);
}
}
}
}
</style>
resources/js/components/FilesView/FilePreviewToolbar.vue → resources/js/components/FilePreview/FilePreviewToolbar.vue
+32 -28
View File
@@ -1,10 +1,10 @@
<template>
<div class="navigation-panel" v-if="clipboard[0]">
<div class="navigation-panel" v-if="currentFile">
<div class="name-wrapper">
<x-icon @click="closeFullPreview" size="22" class="icon-close hover-text-theme" />
<div class="name-count-wrapper">
<p class="title">{{ clipboard[0].name }}</p>
<span class="file-count"> ({{ showingImageIndex + ' ' + $t('pronouns.of') + ' ' + files.length }}) </span>
<p class="title">{{ currentFile.name }}</p>
<span v-if="! fastPreview" class="file-count"> ({{ showingImageIndex + ' ' + $t('pronouns.of') + ' ' + files.length }}) </span>
</div>
<PopoverWrapper>
<span @click.stop="showItemContextMenu" id="fast-preview-menu" class="fast-menu-icon group">
@@ -12,10 +12,10 @@
</span>
<PopoverItem name="file-preview-contextmenu" side="right">
<OptionGroup class="menu-option-group">
<Option @click.native="$renameFileOrFolder(clipboard[0])" :title="$t('context_menu.rename')" icon="rename" />
<Option @click.native="$moveFileOrFolder(clipboard[0])" :title="$t('context_menu.move')" icon="move-item" />
<Option @click.native="$shareFileOrFolder(clipboard[0])" :title="sharingTitle" icon="share" v-if="$checkPermission('master')" />
<Option @click.native="$deleteFileOrFolder(clipboard[0])" :title="$t('context_menu.delete')" icon="trash" class="menu-option" />
<Option @click.native="$renameFileOrFolder(currentFile)" :title="$t('context_menu.rename')" icon="rename" />
<Option @click.native="$moveFileOrFolder(currentFile)" :title="$t('context_menu.move')" icon="move-item" />
<Option @click.native="$shareFileOrFolder(currentFile)" :title="sharingTitle" icon="share" v-if="$checkPermission('master')" />
<Option @click.native="$deleteFileOrFolder(currentFile)" :title="$t('context_menu.delete')" icon="trash" class="menu-option" />
</OptionGroup>
<OptionGroup>
<Option @click.native="downloadItem" :title="$t('context_menu.download')" icon="download" />
@@ -25,7 +25,7 @@
</div>
<div class="created-at-wrapper">
<p>{{ clipboard[0].filesize }}, {{ clipboard[0].created_at }}</p>
<p>{{ currentFile.filesize }}, {{ currentFile.created_at }}</p>
</div>
<div class="navigation-icons">
@@ -35,7 +35,7 @@
</div>
<div class="navigation-tool-wrapper">
<ToolbarButton @click.native="downloadItem" class="mobile-hide" source="download" :action="$t('actions.download')" />
<ToolbarButton v-if="canShareItem" @click.native="$shareFileOrFolder(clipboard[0])" class="mobile-hide" :class="{ 'is-inactive': !canShareItem }" source="share" :action="$t('actions.share')" />
<ToolbarButton v-if="canShareItem" @click.native="$shareFileOrFolder(currentFile)" class="mobile-hide" :class="{ 'is-inactive': !canShareItem }" source="share" :action="$t('actions.share')" />
<ToolbarButton v-if="isImage" @click.native="printMethod()" source="print" :action="$t('actions.print')" />
</div>
</div>
@@ -43,56 +43,60 @@
</template>
<script>
import PopoverWrapper from '@/components/Desktop/PopoverWrapper'
import PopoverItem from '@/components/Desktop/PopoverItem'
import OptionGroup from '@/components/FilesView/OptionGroup'
import Option from '@/components/FilesView/Option'
import PopoverWrapper from '/resources/js/components/Desktop/PopoverWrapper'
import PopoverItem from '/resources/js/components/Desktop/PopoverItem'
import OptionGroup from '/resources/js/components/FilesView/OptionGroup'
import Option from '/resources/js/components/FilesView/Option'
import ToolbarButton from '@/components/FilesView/ToolbarButton'
import ToolbarButton from '/resources/js/components/FilesView/ToolbarButton'
import {XIcon, MoreHorizontalIcon} from 'vue-feather-icons'
import {mapGetters} from 'vuex'
import {events} from '@/bus'
import {events} from '/resources/js/bus'
export default {
name: 'FilePreviewToolbar',
components: {
MoreHorizontalIcon,
PopoverWrapper,
ToolbarButton,
PopoverItem,
OptionGroup,
Option,
MoreHorizontalIcon,
ToolbarButton,
XIcon,
},
computed: {
...mapGetters([
'fastPreview',
'clipboard',
'entries'
]),
currentFile() {
return this.fastPreview ? this.fastPreview : this.clipboard[0]
},
sharingTitle() {
return this.clipboard[0].shared
return this.currentFile.shared
? this.$t('context_menu.share_edit')
: this.$t('context_menu.share')
},
isImage() {
return this.clipboard[0].type === 'image'
return this.currentFile.type === 'image'
},
isPdf() {
return this.clipboard[0].mimetype === 'pdf'
return this.currentFile.mimetype === 'pdf'
},
files() {
let files = []
this.entries.map(element => {
if (this.clipboard[0].mimetype === 'pdf') {
if (this.currentFile.mimetype === 'pdf') {
if (element.mimetype === 'pdf')
files.push(element)
} else {
if (element.type === this.clipboard[0].type)
if (element.type === this.currentFile.type)
files.push(element)
}
})
@@ -103,7 +107,7 @@
let activeIndex = undefined
this.files.forEach((element, index) => {
if (element.id === this.clipboard[0].id) {
if (element.id === this.currentFile.id) {
activeIndex = index + 1
}
})
@@ -112,7 +116,7 @@
},
canShareItem() {
return this.$isThisLocation([
'base', 'participant_uploads', 'latest', 'shared'
'base', 'latest', 'shared'
])
},
},
@@ -140,8 +144,8 @@
},
downloadItem() {
this.$downloadFile(
this.clipboard[0].file_url,
this.clipboard[0].name + '.' + this.clipboard[0].mimetype
this.currentFile.file_url,
this.currentFile.name + '.' + this.currentFile.mimetype
)
},
closeFullPreview() {
@@ -152,8 +156,8 @@
</script>
<style lang="scss" scoped>
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.name-wrapper {
width: 33%;
resources/js/components/FilePreview/Media/Audio.vue
+17
View File
@@ -0,0 +1,17 @@
<template>
<audio
:class="{'file-shadow': ! $isMobile() }"
class="file audio"
:src="file.file_url"
controls>
</audio>
</template>
<script>
export default {
name: 'Audio',
props: [
'file'
],
}
</script>
resources/js/components/FilePreview/Media/ImageFile.vue
+17
View File
@@ -0,0 +1,17 @@
<template>
<img
id="printable-file"
class="file"
:class="{'file-shadow': ! $isMobile() }"
:src="file.file_url"
/>
</template>
<script>
export default {
name: 'ImageFile',
props: [
'file'
],
}
</script>
resources/js/components/FilePreview/Media/PdfFile.vue
+114
View File
@@ -0,0 +1,114 @@
<template>
<div id="pdf-wrapper" :style="{width: documentSize + '%'}">
<pdf :src="pdfData" v-for="i in numPages" :key="i" :resize="true" :page="i" scale="page-width" style="width:100%; margin:0 auto 35px;" id="printable-file" class="pdf-file">
<template slot="loading">
<h1>loading content...</h1>
</template>
</pdf>
</div>
</template>
<script>
import {events} from '/resources/js/bus'
import pdf from 'pdfvuer'
export default {
name: 'PdfFile',
components: {
pdf,
},
props: [
'file'
],
watch: {
file() {
this.getPdf()
}
},
data() {
return {
pdfData: undefined,
numPages: 0,
documentSize: 50,
}
},
methods: {
getPdf() {
this.pdfData = undefined
this.numPages = 0
let self = this;
self.pdfData = pdf.createLoadingTask(this.file.file_url);
self.pdfData.then(pdf => self.numPages = pdf.numPages);
},
getDocumentSize() {
if (window.innerWidth < 960) {
this.documentSize = 100
}
if (window.innerWidth > 960){
this.documentSize = localStorage.getItem('documentSize')
? parseInt(localStorage.getItem('documentSize'))
: 50;
}
},
zoomIn() {
if (this.documentSize < 100) {
this.documentSize += 10
localStorage.setItem('documentSize', this.documentSize)
}
},
zoomOut() {
if (this.documentSize > 40) {
this.documentSize -= 10
localStorage.setItem('documentSize', this.documentSize)
}
}
},
created() {
this.getDocumentSize()
this.getPdf()
events.$on('document-zoom:in', () => this.zoomIn())
events.$on('document-zoom:out', () => this.zoomOut())
}
}
</script>
<style src="pdfvuer/dist/pdfvuer.css" lang="css"></style>
<style lang="scss" scoped>
@import '/resources/sass/vuefilemanager/_variables';
#pdf-wrapper {
border-radius: 8px;
overflow-y: scroll;
margin: 0 auto;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
padding: 40px;
.pdf-file {
box-shadow: $light_mode_popup_shadow;
border-radius: 8px;
overflow: hidden;
}
}
@media only screen and (max-width: 960px) {
#pdf-wrapper {
border-radius: 0;
padding: 0;
.pdf-file {
box-shadow: none;
border-radius: 0;
}
}
}
</style>
resources/js/components/FilePreview/Media/Video.vue
+60
View File
@@ -0,0 +1,60 @@
<template>
<div class="video-wrapper">
<video
:src="file.file_url"
class="video"
:class="{'file-shadow': !$isMobile() }"
controlsList="nodownload"
disablePictureInPicture
playsinline
controls
autoplay
/>
</div>
</template>
<script>
export default {
name: 'Video',
props: [
'file'
],
}
</script>
<style lang="scss" scoped>
@import '/resources/sass/vuefilemanager/_variables';
.video-wrapper {
max-width: 1080px;
max-height: 100%;
@media (min-width: 1200px) {
& {
max-width: 800px;
}
}
@media (min-width: 1920px) and (max-width: 2560px) {
& {
max-width: 1080px;
}
}
@media (min-width: 2560px) and (max-width: 3840px) {
& {
max-width: 1440px;
}
}
@media (min-width: 3840px) {
& {
max-width: 2160px;
}
}
.video {
max-width: 100%;
max-height: 100%;
align-self: center;
}
}
</style>
resources/js/components/FilesView/Alert.vue
+4 -4
View File
@@ -23,8 +23,8 @@
</template>
<script>
import ButtonBase from '@/components/FilesView/ButtonBase'
import {events} from '@/bus'
import ButtonBase from '/resources/js/components/FilesView/ButtonBase'
import {events} from '/resources/js/bus'
export default {
name: 'AlertPopup',
@@ -96,8 +96,8 @@
</script>
<style scoped lang="scss">
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.popup {
position: absolute;
resources/js/components/FilesView/ButtonBase.vue
+2 -2
View File
@@ -22,8 +22,8 @@
</script>
<style scoped lang="scss">
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.button-base {
@include font-size(15);
resources/js/components/FilesView/ButtonUpload.vue
+2 -2
View File
@@ -31,8 +31,8 @@
</script>
<style scoped lang="scss">
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.button-base {
@include font-size(15);
resources/js/components/FilesView/CheckBox.vue
+1 -1
View File
@@ -15,7 +15,7 @@ export default {
</script>
<style lang="scss" scoped>
@import '@assets/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_variables';
.select-box {
min-width: 20px;
resources/js/components/FilesView/ContextMenu.vue
+18 -25
View File
@@ -13,7 +13,7 @@
<OptionGroup v-if="item && isMultiSelectContextMenu">
<Option @click.native="ItemDetail" :title="$t('context_menu.detail')" icon="detail" />
<Option @click.native="downloadItem" v-if="!isFolder" :title="$t('context_menu.download')" icon="download" />
<Option @click.native="downloadItem" :title="$t('context_menu.download')" icon="download" />
</OptionGroup>
<!-- Multi options -->
@@ -46,8 +46,7 @@
<OptionGroup v-if="item && isMultiSelectContextMenu">
<Option @click.native="ItemDetail" :title="$t('context_menu.detail')" icon="detail" />
<Option @click.native="downloadItem" v-if="!isFolder" :title="$t('context_menu.download')" icon="download" />
<Option @click.native="downloadFolder" v-if="isFolder" :title="$t('context_menu.zip_folder')" icon="zip-folder" />
<Option @click.native="downloadItem" :title="$t('context_menu.download')" icon="download" />
</OptionGroup>
<!-- Multi options -->
@@ -68,15 +67,15 @@
</div>
<!-- Base location with MASTER permission-->
<div v-if="$isThisLocation(['base', 'participant_uploads', 'latest']) && $checkPermission('master')" id="menu-list" class="menu-options">
<div v-if="$isThisLocation(['base', 'latest']) && $checkPermission('master')" id="menu-list" class="menu-options">
<!-- No Files options -->
<OptionGroup v-if="!$isThisLocation(['participant_uploads', 'latest']) && isMultiSelectContextMenu && !item">
<OptionGroup v-if="!$isThisLocation(['latest']) && isMultiSelectContextMenu && !item">
<Option @click.native="createFolder" :title="$t('context_menu.create_folder')" icon="create-folder" />
</OptionGroup>
<!-- Single options -->
<OptionGroup v-if="!$isThisLocation(['participant_uploads', 'latest']) && item && isMultiSelectContextMenu && isFolder">
<OptionGroup v-if="!$isThisLocation(['latest']) && item && isMultiSelectContextMenu && isFolder">
<Option @click.native="addToFavourites" :title="isInFavourites ? $t('context_menu.remove_from_favourites') : $t('context_menu.add_to_favourites')" icon="favourites" />
</OptionGroup>
@@ -89,12 +88,11 @@
<OptionGroup v-if="item && isMultiSelectContextMenu ">
<Option @click.native="ItemDetail" :title="$t('context_menu.detail')" icon="detail" />
<Option @click.native="downloadItem" v-if="!isFolder" :title="$t('context_menu.download')" icon="download" />
<Option @click.native="downloadFolder" v-if="isFolder" :title="$t('context_menu.zip_folder')" icon="zip-folder" />
<Option @click.native="downloadItem" :title="$t('context_menu.download')" icon="download" />
</OptionGroup>
<!-- Multi options -->
<OptionGroup v-if="!$isThisLocation(['participant_uploads', 'latest']) && !isMultiSelectContextMenu && item && !hasFile">
<OptionGroup v-if="!$isThisLocation(['latest']) && !isMultiSelectContextMenu && item && !hasFile">
<Option @click.native="addToFavourites" :title="isInFavourites ? $t('context_menu.remove_from_favourites') : $t('context_menu.add_to_favourites')" icon="favourites" />
</OptionGroup>
@@ -103,7 +101,7 @@
<Option @click.native="$deleteFileOrFolder(item)" :title="$t('context_menu.delete')" icon="trash" />
</OptionGroup>
<OptionGroup v-if="item && !isMultiSelectContextMenu && !hasFolder">
<OptionGroup v-if="item && !isMultiSelectContextMenu">
<Option @click.native="downloadItem" :title="$t('context_menu.download')" icon="download" />
</OptionGroup>
</div>
@@ -125,8 +123,7 @@
<OptionGroup v-if="item && isMultiSelectContextMenu">
<Option @click.native="ItemDetail" :title="$t('context_menu.detail')" icon="detail" />
<Option @click.native="downloadItem" v-if="!isFolder" :title="$t('context_menu.download')" icon="download" />
<Option @click.native="downloadFolder" v-if="isFolder" :title="$t('context_menu.zip_folder')" icon="zip-folder" />
<Option @click.native="downloadItem" :title="$t('context_menu.download')" icon="download" />
</OptionGroup>
<!-- Multi options -->
@@ -135,7 +132,7 @@
<Option @click.native="$deleteFileOrFolder(item)" :title="$t('context_menu.delete')" icon="trash" />
</OptionGroup>
<OptionGroup v-if="item && !isMultiSelectContextMenu && !hasFolder">
<OptionGroup v-if="item && !isMultiSelectContextMenu">
<Option @click.native="downloadItem" :title="$t('context_menu.download')" icon="download" />
</OptionGroup>
</div>
@@ -146,8 +143,7 @@
<!-- Single options -->
<OptionGroup v-if="item && isMultiSelectContextMenu">
<Option @click.native="ItemDetail" :title="$t('context_menu.detail')" icon="detail" />
<Option @click.native="downloadItem" v-if="!isFolder" :title="$t('context_menu.download')" icon="download" />
<Option @click.native="downloadFolder" v-if="isFolder" :title="$t('context_menu.zip_folder')" icon="zip-folder" />
<Option @click.native="downloadItem" :title="$t('context_menu.download')" icon="download" />
</OptionGroup>
<!-- Multi options -->
@@ -161,10 +157,10 @@
</template>
<script>
import OptionGroup from '@/components/FilesView/OptionGroup'
import Option from '@/components/FilesView/Option'
import OptionGroup from '/resources/js/components/FilesView/OptionGroup'
import Option from '/resources/js/components/FilesView/Option'
import {mapGetters} from 'vuex'
import {events} from '@/bus'
import {events} from '/resources/js/bus'
export default {
name: 'ContextMenu',
@@ -220,9 +216,6 @@ export default {
}
},
methods: {
downloadFolder() {
this.$store.dispatch('downloadFolder', this.item)
},
emptyTrash() {
this.$store.dispatch('emptyTrash')
},
@@ -249,8 +242,8 @@ export default {
}
},
downloadItem() {
if (this.clipboard.length > 1)
this.$store.dispatch('downloadFiles')
if (this.clipboard.length > 1 || (this.clipboard.length === 1 && this.clipboard[0].type === 'folder'))
this.$store.dispatch('downloadZip')
else {
this.$downloadFile(this.item.file_url, this.item.name + '.' + this.item.mimetype)
}
@@ -338,8 +331,8 @@ export default {
</script>
<style scoped lang="scss">
@import "@assets/vuefilemanager/_variables";
@import "@assets/vuefilemanager/_mixins";
@import "resources/sass/vuefilemanager/_variables";
@import "resources/sass/vuefilemanager/_mixins";
.no-options {
/deep/ .text-label {
resources/js/components/FilesView/CreateListMobile.vue
+54
View File
@@ -0,0 +1,54 @@
<template>
<MenuMobile name="create-list">
<MenuMobileGroup>
<OptionGroup>
<OptionUpload :class="{'is-inactive': canUploadInView || !hasCapacity }" :title="$t('actions.upload')" is-hover-disabled="true"/>
<Option @click.native="createFolder" :class="{'is-inactive': canCreateFolderInView }" :title="$t('actions.create_folder')" icon="folder-plus" is-hover-disabled="true"/>
</OptionGroup>
</MenuMobileGroup>
</MenuMobile>
</template>
<script>
import MenuMobileGroup from '/resources/js/components/Mobile/MenuMobileGroup'
import OptionUpload from '/resources/js/components/FilesView/OptionUpload'
import OptionGroup from '/resources/js/components/FilesView/OptionGroup'
import MenuMobile from '/resources/js/components/Mobile/MenuMobile'
import Option from '/resources/js/components/FilesView/Option'
import {mapGetters} from 'vuex'
import {events} from '/resources/js/bus'
export default {
name: 'FileMenuMobile',
components: {
MenuMobileGroup,
OptionUpload,
OptionGroup,
MenuMobile,
Option,
},
computed: {
canUploadInView() {
return !this.$isThisLocation(['base', 'public'])
},
hasCapacity() {
// Check if storage limitation is set
if (!this.$store.getters.config.storageLimit) return true
// Check if user is loaded
if (!this.$store.getters.user) return true
// Check if user has storage
return this.$store.getters.user.data.attributes.storage.used <= 100
},
canCreateFolderInView() {
return !this.$isThisLocation(['base', 'public'])
},
},
methods: {
createFolder() {
events.$emit('popup:open', {name: 'create-folder'})
},
}
}
</script>
resources/js/components/FilesView/DesktopToolbar.vue
+45 -31
View File
@@ -18,19 +18,31 @@
<!--Search bar-->
<ToolbarGroup style="margin-left: 0">
<SearchBar v-model="query" @reset-query="query = ''" :placeholder="$t('inputs.placeholder_search_files')" />
<SearchBar />
</ToolbarGroup>
<!--Creating controls-->
<ToolbarGroup v-if="$checkPermission(['master', 'editor'])">
<ToolbarButtonUpload :class="{'is-inactive': canUploadInView || !hasCapacity }" :action="$t('actions.upload')" />
<ToolbarButton @click.native="createFolder" :class="{'is-inactive': canCreateFolderInView }" source="folder-plus" :action="$t('actions.create_folder')" />
<PopoverWrapper>
<ToolbarButton @click.stop.native="showCreateMenu" source="cloud-plus" :action="$t('actions.create')" />
<PopoverItem name="desktop-create" side="left">
<OptionGroup>
<OptionUpload :class="{'is-inactive': canUploadInView || !hasCapacity }" :title="$t('actions.upload')" />
<Option @click.stop.native="createFolder" :class="{'is-inactive': canCreateFolderInView }" :title="$t('actions.create_folder')" icon="folder-plus" />
</OptionGroup>
</PopoverItem>
</PopoverWrapper>
</ToolbarGroup>
<!--Share Controls-->
<ToolbarGroup v-if="$checkPermission(['master', 'editor']) && ! $isMobile() && !$isThisLocation(['public'])">
<ToolbarButton @click.native="shareItem" :class="{'is-inactive': ! canCreateTeamFolderInView }" source="user-plus" :action="$t('actions.convert_into_team_folder')" />
<ToolbarButton @click.native="shareItem" :class="{'is-inactive': canShareInView }" source="share" :action="$t('actions.share')" />
</ToolbarGroup>
<!--File Controls-->
<ToolbarGroup v-if="$checkPermission(['master', 'editor']) && ! $isMobile()">
<ToolbarButton @click.native="moveItem" :class="{'is-inactive': canMoveInView }" source="move" :action="$t('actions.move')" />
<ToolbarButton @click.native="shareItem" v-if="!$isThisLocation(['public'])" :class="{'is-inactive': canShareInView }" source="share" :action="$t('actions.share')" />
<ToolbarButton @click.native="deleteItem" :class="{'is-inactive': canDeleteInView }" source="trash" :action="$t('actions.delete')" />
</ToolbarGroup>
@@ -52,24 +64,25 @@
</template>
<script>
import ToolbarButtonUpload from '@/components/FilesView/ToolbarButtonUpload'
import FileSortingOptions from '@/components/FilesView/FileSortingOptions'
import FileSortingOptions from '/resources/js/components/FilesView/FileSortingOptions'
import {ChevronLeftIcon, MoreHorizontalIcon} from 'vue-feather-icons'
import UploadProgress from '@/components/FilesView/UploadProgress'
import PopoverWrapper from '@/components/Desktop/PopoverWrapper'
import ToolbarWrapper from '@/components/Desktop/ToolbarWrapper'
import ToolbarButton from '@/components/FilesView/ToolbarButton'
import ToolbarGroup from '@/components/Desktop/ToolbarGroup'
import PopoverItem from '@/components/Desktop/PopoverItem'
import SearchBar from '@/components/FilesView/SearchBar'
import {debounce, last} from 'lodash'
import UploadProgress from '/resources/js/components/FilesView/UploadProgress'
import PopoverWrapper from '/resources/js/components/Desktop/PopoverWrapper'
import ToolbarWrapper from '/resources/js/components/Desktop/ToolbarWrapper'
import ToolbarButton from '/resources/js/components/FilesView/ToolbarButton'
import OptionUpload from '/resources/js/components/FilesView/OptionUpload'
import ToolbarGroup from '/resources/js/components/Desktop/ToolbarGroup'
import OptionGroup from '/resources/js/components/FilesView/OptionGroup'
import PopoverItem from '/resources/js/components/Desktop/PopoverItem'
import SearchBar from '/resources/js/components/FilesView/SearchBar'
import Option from '/resources/js/components/FilesView/Option'
import {mapGetters} from 'vuex'
import {events} from '@/bus'
import {events} from '/resources/js/bus'
import {last} from 'lodash'
export default {
name: 'ToolBar',
components: {
ToolbarButtonUpload,
FileSortingOptions,
MoreHorizontalIcon,
ChevronLeftIcon,
@@ -77,9 +90,12 @@
UploadProgress,
PopoverWrapper,
ToolbarButton,
OptionUpload,
ToolbarGroup,
OptionGroup,
PopoverItem,
SearchBar,
Option,
},
computed: {
...mapGetters([
@@ -115,7 +131,6 @@
},
canDeleteInView() {
let locations = [
'participant_uploads',
'trash-root',
'latest',
'shared',
@@ -130,7 +145,6 @@
},
canMoveInView() {
let locations = [
'participant_uploads',
'latest',
'shared',
'public',
@@ -140,26 +154,25 @@
},
canShareInView() {
let locations = [
'participant_uploads',
'latest',
'shared',
'public',
'base',
]
return !this.$isThisLocation(locations) || this.clipboard.length > 1 || this.clipboard.length === 0
}
},
data() {
return {
query: '',
}
},
watch: {
query(val) {
this.$searchFiles(val)
},
canCreateTeamFolderInView() {
let locations = [
'shared',
'base',
]
return this.$isThisLocation(locations) && this.clipboard.length === 1 && this.clipboard[0].type === 'folder'
}
},
methods: {
showCreateMenu() {
events.$emit('popover:open', 'desktop-create')
},
showSortingMenu() {
events.$emit('popover:open', 'desktop-sorting')
},
@@ -195,6 +208,7 @@
},
createFolder() {
this.$store.dispatch('createFolder', {name: this.$t('popup_create_folder.folder_default_name')})
events.$emit('popover:close', 'desktop-create')
},
moveItem() {
if (this.clipboard.length > 0)
@@ -215,8 +229,8 @@
</script>
<style scoped lang="scss">
@import "@assets/vuefilemanager/_variables";
@import "@assets/vuefilemanager/_mixins";
@import "resources/sass/vuefilemanager/_variables";
@import "resources/sass/vuefilemanager/_mixins";
.is-inactive {
opacity: 0.25;
resources/js/components/FilesView/DragUI.vue
+4 -4
View File
@@ -9,9 +9,9 @@
</template>
<script>
import TitlePreview from '@/components/FilesView/TitlePreview'
import TitlePreview from '/resources/js/components/FilesView/TitlePreview'
import { mapGetters } from 'vuex'
import { events } from '@/bus'
import { events } from '/resources/js/bus'
export default {
name: 'DragUI',
@@ -80,8 +80,8 @@ export default {
</script>
<style lang="scss" scoped>
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
#drag-ui {
max-width: 300px;
resources/js/components/FilesView/EmptyFilePage.vue
+5 -10
View File
@@ -12,11 +12,6 @@
<h1 class="title">{{ $t('empty_page.title') }}</h1>
</div>
<!--Trash empty message-->
<div class="text-content" v-if="$isThisLocation(['participant_uploads']) && ! isLoading">
<h1 class="title">{{ $t('messages.nothing_from_participants') }}</h1>
</div>
<!--Base file browser empty message-->
<div class="text-content" v-if="$isThisLocation(['base', 'public', 'latest']) && !isLoading">
<h1 class="title">{{ $t('empty_page.title') }}</h1>
@@ -38,8 +33,8 @@
</template>
<script>
import ButtonUpload from '@/components/FilesView/ButtonUpload'
import Spinner from '@/components/FilesView/Spinner'
import ButtonUpload from '/resources/js/components/FilesView/ButtonUpload'
import Spinner from '/resources/js/components/FilesView/Spinner'
import {mapGetters} from 'vuex'
export default {
@@ -59,15 +54,15 @@
'entries',
]),
isEmpty() {
return this.entries && this.entries.length == 0
return this.entries && this.entries.length === 0
}
}
}
</script>
<style scoped lang="scss">
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.empty-page {
position: absolute;
resources/js/components/FilesView/EmptyMessage.vue
+2 -2
View File
@@ -20,8 +20,8 @@
</script>
<style scoped lang="scss">
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.empty-message {
text-align: center;
resources/js/components/FilesView/FileActionsMobile.vue
+34 -17
View File
@@ -3,15 +3,15 @@
<!--Base location-->
<div v-if="$isThisLocation(['base']) && $checkPermission(['master', 'editor']) && ! isSelectMode" class="mobile-actions">
<MobileActionButton @click.native="showLocations" icon="filter">
<MobileActionButton @click.native="showSpotlight" icon="search">
{{ $t('actions.search')}}
</MobileActionButton>
<MobileActionButton @click.native="showLocations" icon="filter">
{{ filterLocationTitle }}
</MobileActionButton>
<MobileActionButton @click.native="createFolder" icon="folder-plus">
{{ $t('context_menu.add_folder') }}
<MobileActionButton @click.native="createItems" icon="cloud-plus">
{{ $t('mobile.create') }}
</MobileActionButton>
<MobileActionButtonUpload>
{{ $t('context_menu.upload') }}
</MobileActionButtonUpload>
<MobileActionButton @click.native="enableMultiSelectMode" icon="check-square">
{{ $t('context_menu.select') }}
</MobileActionButton>
@@ -22,6 +22,9 @@
<!--Base location editor-->
<div v-if="$isThisLocation('public') && $checkPermission('editor') && ! isSelectMode" class="mobile-actions">
<MobileActionButton @click.native="showSpotlight" icon="search">
{{ $t('actions.search')}}
</MobileActionButton>
<MobileActionButton @click.native="createFolder" icon="folder-plus">
{{ $t('context_menu.add_folder') }}
</MobileActionButton>
@@ -38,6 +41,9 @@
<!--Base location visitor-->
<div v-if="$isThisLocation('public') && $checkPermission('visitor') && ! isSelectMode" class="mobile-actions">
<MobileActionButton @click.native="showSpotlight" icon="search">
{{ $t('actions.search')}}
</MobileActionButton>
<MobileActionButton @click.native="enableMultiSelectMode" icon="check-square">
{{ $t('context_menu.select') }}
</MobileActionButton>
@@ -48,6 +54,9 @@
<!--Recent uploads location-->
<div v-if="$isThisLocation('latest') && ! isSelectMode" class="mobile-actions">
<MobileActionButton @click.native="showSpotlight" icon="search">
{{ $t('actions.search')}}
</MobileActionButton>
<MobileActionButton @click.native="showLocations" icon="filter">
{{ filterLocationTitle }}
</MobileActionButton>
@@ -64,6 +73,9 @@
<!--Trash location--->
<div v-if="$isThisLocation(['trash', 'trash-root']) && ! isSelectMode" class="mobile-actions">
<MobileActionButton @click.native="showSpotlight" icon="search">
{{ $t('actions.search')}}
</MobileActionButton>
<MobileActionButton @click.native="showLocations" icon="filter">
{{ filterLocationTitle }}
</MobileActionButton>
@@ -79,7 +91,10 @@
</div>
<!--Shared location--->
<div v-if="$isThisLocation(['shared', 'participant_uploads']) && ! isSelectMode" class="mobile-actions">
<div v-if="$isThisLocation(['shared']) && ! isSelectMode" class="mobile-actions">
<MobileActionButton @click.native="showSpotlight" icon="search">
{{ $t('actions.search')}}
</MobileActionButton>
<MobileActionButton @click.native="showLocations" icon="filter">
{{ filterLocationTitle }}
</MobileActionButton>
@@ -110,11 +125,11 @@
</template>
<script>
import MobileActionButtonUpload from '@/components/FilesView/MobileActionButtonUpload'
import MobileActionButton from '@/components/FilesView/MobileActionButton'
import UploadProgress from '@/components/FilesView/UploadProgress'
import MobileActionButtonUpload from '/resources/js/components/FilesView/MobileActionButtonUpload'
import MobileActionButton from '/resources/js/components/FilesView/MobileActionButton'
import UploadProgress from '/resources/js/components/FilesView/UploadProgress'
import {mapGetters} from 'vuex'
import {events} from '@/bus'
import {events} from '/resources/js/bus'
import store from "../../store";
export default {
@@ -141,7 +156,6 @@
'latest': 'Latest',
'trash': 'Trash',
'trash-root': 'Trash',
'participant_uploads': 'Participants',
}[this.$store.getters.currentFolder.location]
}
},
@@ -151,8 +165,14 @@
}
},
methods: {
showSpotlight() {
events.$emit('spotlight:show')
},
showLocations() {
events.$emit('mobile-menu:show', 'file-filter')
},
createItems() {
events.$emit('mobile-menu:show', 'create-list')
},
selectAll() {
this.$store.commit('ADD_ALL_ITEMS_TO_CLIPBOARD')
@@ -173,9 +193,6 @@
showViewOptions() {
events.$emit('mobile-menu:show', 'file-sorting')
},
createFolder() {
events.$emit('popup:open', {name: 'create-folder'})
},
},
mounted() {
events.$on('mobileSelecting:stop', () => this.isSelectMode = false)
@@ -184,8 +201,8 @@
</script>
<style scoped lang="scss">
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.button-enter-active,
.button-leave-active {
resources/js/components/FilesView/FileBrowser.vue
+12 -24
View File
@@ -18,8 +18,6 @@
>
<MobileToolbar />
<SearchBar v-model="query" @reset-query="query = ''" class="mobile-search" :placeholder="$t('inputs.placeholder_search_files')" />
<!--Mobile Actions-->
<FileActionsMobile />
@@ -66,14 +64,7 @@
</div>
<!--Show empty page if folder is empty-->
<EmptyFilePage v-if="! isSearching" />
<!--Show empty page if no search results-->
<EmptyMessage
v-if="isSearching && isEmpty"
:message="$t('messages.nothing_was_found')"
icon="eye-slash"
/>
<EmptyFilePage />
</div>
<!--File Info Panel-->
@@ -84,16 +75,15 @@
</template>
<script>
import FileActionsMobile from '@/components/FilesView/FileActionsMobile'
import MobileToolbar from '@/components/FilesView/MobileToolbar'
import EmptyFilePage from '@/components/FilesView/EmptyFilePage'
import EmptyMessage from '@/components/FilesView/EmptyMessage'
import FileItemList from '@/components/FilesView/FileItemList'
import FileItemGrid from '@/components/FilesView/FileItemGrid'
import InfoSidebar from '@/components/FilesView/InfoSidebar'
import SearchBar from '@/components/FilesView/SearchBar'
import FileActionsMobile from '/resources/js/components/FilesView/FileActionsMobile'
import MobileToolbar from '/resources/js/components/FilesView/MobileToolbar'
import EmptyFilePage from '/resources/js/components/FilesView/EmptyFilePage'
import EmptyMessage from '/resources/js/components/FilesView/EmptyMessage'
import FileItemList from '/resources/js/components/FilesView/FileItemList'
import FileItemGrid from '/resources/js/components/FilesView/FileItemGrid'
import InfoSidebar from '/resources/js/components/FilesView/InfoSidebar'
import {mapGetters} from 'vuex'
import {events} from '@/bus'
import {events} from '/resources/js/bus'
import {debounce} from "lodash";
export default {
@@ -106,7 +96,6 @@
FileItemGrid,
EmptyMessage,
InfoSidebar,
SearchBar,
},
computed: {
...mapGetters([
@@ -114,7 +103,6 @@
'isVisibleSidebar',
'FilePreviewType',
'currentFolder',
'isSearching',
'clipboard',
'isLoading',
'entries'
@@ -126,7 +114,7 @@
return this.FilePreviewType === 'list'
},
isEmpty() {
return this.entries.length == 0
return this.entries.length === 0
},
draggedItems() {
//Set opacity for dragged items
@@ -258,8 +246,8 @@
</script>
<style scoped lang="scss">
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.file-list {
.dragged {
resources/js/components/FilesView/FileFilterMobile.vue
+6 -10
View File
@@ -4,21 +4,21 @@
<OptionGroup>
<Option @click.native="goToFiles" :title="$t('menu.files')" icon="hard-drive" :is-active="$isThisLocation('base')" is-hover-disabled="true" />
<Option @click.native="goToLatest" :title="$t('menu.latest')" icon="upload-cloud" :is-active="$isThisLocation('latest')" is-hover-disabled="true" />
<Option @click.native="goToShared" :title="$t('sidebar.my_shared')" icon="share" :is-active="$isThisLocation('shared')" is-hover-disabled="true" />
<Option @click.native="goToTrash" :title="$t('menu.trash')" icon="trash" :is-active="$isThisLocation(['trash', 'trash-root'])" is-hover-disabled="true" />
</OptionGroup>
<OptionGroup>
<Option @click.native="goToShared" :title="$t('sidebar.my_shared')" icon="share" :is-active="$isThisLocation('shared')" is-hover-disabled="true" />
<Option @click.native="goToParticipantUploads" :title="$t('sidebar.participant_uploads')" icon="users" :is-active="$isThisLocation('participant_uploads')" is-hover-disabled="true" />
<!--todo: add teams-->
</OptionGroup>
</MenuMobileGroup>
</MenuMobile>
</template>
<script>
import MenuMobileGroup from '@/components/Mobile/MenuMobileGroup'
import OptionGroup from '@/components/FilesView/OptionGroup'
import MenuMobile from '@/components/Mobile/MenuMobile'
import Option from '@/components/FilesView/Option'
import MenuMobileGroup from '/resources/js/components/Mobile/MenuMobileGroup'
import OptionGroup from '/resources/js/components/FilesView/OptionGroup'
import MenuMobile from '/resources/js/components/Mobile/MenuMobile'
import Option from '/resources/js/components/FilesView/Option'
import {mapGetters} from 'vuex'
export default {
@@ -53,10 +53,6 @@ export default {
goToShared() {
this.$store.dispatch('getShared', [{back: false, init: false}])
this.flushBrowseHistory()
},
goToParticipantUploads() {
this.$store.dispatch('getParticipantUploads')
this.flushBrowseHistory()
}
}
}
resources/js/components/FilesView/FileItemGrid.vue
+6 -6
View File
@@ -2,7 +2,7 @@
<div class="file-wrapper" @mouseup.stop="clickedItem" @dblclick="goToItem" spellcheck="false">
<div :draggable="canDrag" @dragstart="$emit('dragstart')" @drop="
drop()
area = false" @dragleave="dragLeave" @dragover.prevent="dragEnter" class="file-item" :class="{'is-clicked' : isClicked , 'no-clicked' : !isClicked && this.$isMobile(), 'is-dragenter': area }">
area = false" @dragleave="dragLeave" @dragover.prevent="dragEnter" class="file-item" :class="{'is-clicked' : isClicked , 'no-clicked' : !isClicked && $isMobile(), 'is-dragenter': area }">
<!--Thumbnail for item-->
<div class="icon-item">
@@ -62,11 +62,11 @@
<script>
import {LinkIcon, UserPlusIcon, MoreHorizontalIcon} from 'vue-feather-icons'
import FolderIcon from '@/components/FilesView/FolderIcon'
import CheckBox from '@/components/FilesView/CheckBox'
import FolderIcon from '/resources/js/components/FilesView/FolderIcon'
import CheckBox from '/resources/js/components/FilesView/CheckBox'
import {debounce} from 'lodash'
import {mapGetters} from 'vuex'
import {events} from '@/bus'
import {events} from '/resources/js/bus'
export default {
name: 'FileItemGrid',
@@ -302,8 +302,8 @@ export default {
</script>
<style scoped lang="scss">
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.check-box {
margin-right: 10px;
resources/js/components/FilesView/FileItemList.vue
+9 -8
View File
@@ -6,7 +6,7 @@
@drop="drop()"
@dragleave="dragLeave"
@dragover.prevent="dragEnter"
class="file-item" :class="{'is-clicked' : isClicked , 'no-clicked' : !isClicked && this.$isMobile(), 'is-dragenter': area }"
class="file-item" :class="{'is-clicked' : isClicked , 'no-clicked' : !isClicked && $isMobile(), 'is-dragenter': area }"
>
<!-- MultiSelecting for the mobile version -->
<transition name="slide-from-left">
@@ -69,16 +69,17 @@
<script>
import {LinkIcon, UserPlusIcon, MoreVerticalIcon} from 'vue-feather-icons'
import FolderIcon from '@/components/FilesView/FolderIcon'
import CheckBox from '@/components/FilesView/CheckBox'
import FolderIcon from '/resources/js/components/FilesView/FolderIcon'
import CheckBox from '/resources/js/components/FilesView/CheckBox'
import {debounce} from 'lodash'
import {mapGetters} from 'vuex'
import {events} from '@/bus'
import {events} from '/resources/js/bus'
export default {
name: 'FileItemList',
props: [
'item'
'item',
'disableHighlight'
],
components: {
MoreVerticalIcon,
@@ -94,7 +95,7 @@ export default {
'entries'
]),
isClicked() {
return this.clipboard.some(element => element.id === this.item.id)
return !this.disableHighlight && this.clipboard.some(element => element.id === this.item.id)
},
isFolder() {
return this.item.type === 'folder'
@@ -305,8 +306,8 @@ export default {
</script>
<style scoped lang="scss">
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.slide-from-left-move {
resources/js/components/FilesView/FileMenuMobile.vue
+21 -28
View File
@@ -10,8 +10,7 @@
</OptionGroup>
<OptionGroup>
<Option v-if="!isFolder" @click.native="downloadItem" :title="$t('context_menu.download')" icon="download" />
<Option v-if="isFolder" @click.native="downloadFolder" :title="$t('context_menu.zip_folder')" icon="zip-folder" />
<Option @click.native="downloadItem" :title="$t('context_menu.download')" icon="download" />
</OptionGroup>
</MenuMobileGroup>
@@ -28,13 +27,12 @@
</OptionGroup>
<OptionGroup>
<Option v-if="!isFolder" @click.native="downloadItem" :title="$t('context_menu.download')" icon="download" />
<Option v-if="isFolder" @click.native="downloadFolder" :title="$t('context_menu.zip_folder')" icon="zip-folder" />
<Option @click.native="downloadItem" :title="$t('context_menu.download')" icon="download" />
</OptionGroup>
</MenuMobileGroup>
<!--Base location for user-->
<MenuMobileGroup v-if="$isThisLocation(['base', 'participant_uploads', 'latest']) && $checkPermission('master')">
<MenuMobileGroup v-if="$isThisLocation(['base', 'latest']) && $checkPermission('master')">
<OptionGroup v-if="clipboard[0] && isFolder">
<Option @click.native="addToFavourites" :title="favouritesTitle" icon="star" />
</OptionGroup>
@@ -47,8 +45,7 @@
</OptionGroup>
<OptionGroup>
<Option v-if="!isFolder" @click.native="downloadItem" :title="$t('context_menu.download')" icon="download" />
<Option v-if="isFolder" @click.native="downloadFolder" :title="$t('context_menu.zip_folder')" icon="zip-folder" />
<Option @click.native="downloadItem" :title="$t('context_menu.download')" icon="download" />
</OptionGroup>
</MenuMobileGroup>
@@ -61,29 +58,27 @@
</OptionGroup>
<OptionGroup>
<Option v-if="!isFolder" @click.native="downloadItem" :title="$t('context_menu.download')" icon="download" />
<Option v-if="isFolder" @click.native="downloadFolder" :title="$t('context_menu.zip_folder')" icon="zip-folder" />
<Option @click.native="downloadItem" :title="$t('context_menu.download')" icon="download" />
</OptionGroup>
</MenuMobileGroup>
<!--Base location for guest with visit permission-->
<MenuMobileGroup v-if="$isThisLocation(['base', 'public']) && $checkPermission('visitor')">
<OptionGroup>
<Option v-if="!isFolder" @click.native="downloadItem" :title="$t('context_menu.download')" icon="download" />
<Option v-if="isFolder" @click.native="downloadFolder" :title="$t('context_menu.zip_folder')" icon="zip-folder" />
<Option @click.native="downloadItem" :title="$t('context_menu.download')" icon="download" />
</OptionGroup>
</MenuMobileGroup>
</MenuMobile>
</template>
<script>
import MenuMobileGroup from '@/components/Mobile/MenuMobileGroup'
import MenuMobile from '@/components/Mobile/MenuMobile'
import ThumbnailItem from '@/components/Others/ThumbnailItem'
import OptionGroup from '@/components/FilesView/OptionGroup'
import Option from '@/components/FilesView/Option'
import MenuMobileGroup from '/resources/js/components/Mobile/MenuMobileGroup'
import MenuMobile from '/resources/js/components/Mobile/MenuMobile'
import ThumbnailItem from '/resources/js/components/Others/ThumbnailItem'
import OptionGroup from '/resources/js/components/FilesView/OptionGroup'
import Option from '/resources/js/components/FilesView/Option'
import {mapGetters} from 'vuex'
import {events} from '@/bus'
import {events} from '/resources/js/bus'
export default {
name: 'FileMenuMobile',
@@ -126,9 +121,6 @@ export default {
}
},
methods: {
downloadFolder() {
this.$store.dispatch('downloadFolder', this.clipboard[0])
},
addToFavourites() {
if (this.favourites && !this.favourites.find(el => el.id === this.clipboard[0].id)) {
this.$store.dispatch('addToFavourites', this.clipboard[0])
@@ -136,19 +128,20 @@ export default {
this.$store.dispatch('removeFromFavourites', this.clipboard[0])
}
},
downloadItem() {
this.$downloadFile(
this.clipboard[0].file_url,
this.clipboard[0].name + '.' + this.clipboard[0].mimetype
)
}
downloadItem() {
if (this.clipboard.length > 1 || (this.clipboard.length === 1 && this.clipboard[0].type === 'folder'))
this.$store.dispatch('downloadZip')
else {
this.$downloadFile(this.clipboard[0].file_url, this.clipboard[0].name + '.' + this.clipboard[0].mimetype)
}
},
}
}
</script>
<style scoped lang="scss">
@import "@assets/vuefilemanager/_variables";
@import "@assets/vuefilemanager/_mixins";
@import "resources/sass/vuefilemanager/_variables";
@import "resources/sass/vuefilemanager/_mixins";
.item-thumbnail {
padding: 20px 20px 10px;
resources/js/components/FilesView/FilePreviewMedia.vue
-399
View File
@@ -1,399 +0,0 @@
<template>
<div class="media-full-preview" id="mediaPreview" v-if="clipboard[0]">
<!--Arrow navigation-->
<div v-if="files.length > 1" class="navigation-arrows">
<div @click.prevent="prev" class="prev">
<chevron-left-icon size="17" />
</div>
<div @click.prevent="next" class="next">
<chevron-right-icon size="17" />
</div>
</div>
<!--File preview-->
<div class="file-wrapper-preview">
<!--Show PDF-->
<div v-if="isPDF" id="pdf-wrapper" :style="{width: documentSize + '%'}">
<pdf :src="pdfdata" v-for="i in numPages" :key="i" :resize="true" :page="i" scale="page-width" style="width:100%; margin:0 auto 35px;" id="printable-file" class="pdf-file">
<template slot="loading">
<h1>loading content...</h1>
</template>
</pdf>
</div>
<!--Show Audio, Video and Image-->
<div v-if="!isPDF" class="file-wrapper">
<audio
v-if="isAudio"
:class="{ 'file-shadow': !$isMobile() }"
class="file audio"
:src="currentFile.file_url"
controls>
</audio>
<img
id="printable-file"
v-if="isImage"
class="file"
:class="{'file-shadow': !$isMobile() }"
:src="currentFile.file_url"
/>
<div class="video-wrapper" v-if="isVideo">
<video
:src="currentFile.file_url"
class="video"
:class="{'file-shadow': !$isMobile() }"
controlsList="nodownload"
disablePictureInPicture
playsinline
controls
autoplay
/>
</div>
</div>
</div>
</div>
</template>
<script>
import {ChevronLeftIcon, ChevronRightIcon} from 'vue-feather-icons'
import ToolbarButton from '@/components/FilesView/ToolbarButton'
import Spinner from '@/components/FilesView/Spinner'
import {mapGetters} from 'vuex'
import {events} from '@/bus'
import pdf from 'pdfvuer'
export default {
name: 'FilePreviewMedia',
components: {
ChevronRightIcon,
ChevronLeftIcon,
ToolbarButton,
Spinner,
pdf,
},
computed: {
...mapGetters([
'clipboard',
'entries',
]),
currentFile() {
return this.files[Math.abs(this.currentIndex) % this.files.length]
},
isPDF() {
return this.clipboard[0].mimetype === 'pdf'
},
isVideo() {
return this.clipboard[0].type === 'video'
},
isAudio() {
return this.clipboard[0].type === 'audio'
},
isImage() {
return this.clipboard[0].type === 'image'
}
},
data() {
return {
pdfdata: undefined,
numPages: 0,
currentIndex: 0,
files: [],
documentSize: 50,
}
},
watch: {
files() {
if (this.files.length === 0)
events.$emit('file-preview:hide')
},
currentFile() {
if (this.clipboard[0]) {
this.$store.commit('CLIPBOARD_CLEAR')
this.$store.commit('ADD_ITEM_TO_CLIPBOARD', this.currentFile)
// Init pdf instance
if (this.clipboard[0].mimetype === 'pdf') {
this.getPdf()
}
}
},
clipboard() {
if (!this.clipboard[0]) {
this.currentIndex -= 1
this.$store.commit('ADD_ITEM_TO_CLIPBOARD', this.currentFile)
this.files = []
}
},
data(newValue, oldValue) {
if (newValue !== oldValue) {
this.files = []
}
},
},
methods: {
next() {
if (!this.files.length > 1) return
this.pdfdata = undefined
this.currentIndex += 1
if (this.currentIndex > this.files.length - 1) {
this.currentIndex = 0
}
},
prev() {
if (!this.files.length > 1) return
this.pdfdata = undefined
this.currentIndex -= 1
if (this.currentIndex < 0) {
this.currentIndex = this.files.length - 1
}
},
getPdf() {
this.pdfdata = undefined
this.numPages = 0
let self = this;
self.pdfdata = pdf.createLoadingTask(this.currentFile.file_url);
self.pdfdata.then(pdf => self.numPages = pdf.numPages);
},
getFilesForView() {
let requestedFile = this.clipboard[0]
this.entries.map(element => {
if (requestedFile.mimetype === 'pdf') {
if (element.mimetype === 'pdf')
this.files.push(element)
} else {
if (element.type === requestedFile.type)
this.files.push(element)
}
})
this.files.forEach((element, index) => {
if (element.id === this.clipboard[0].id) {
this.currentIndex = index
}
})
},
getDocumentSize() {
if (window.innerWidth < 960) {
this.documentSize = 100
}
if (window.innerWidth > 960){
this.documentSize = localStorage.getItem('documentSize')
? parseInt(localStorage.getItem('documentSize'))
: 50;
}
}
},
created() {
events.$on('file-preview:next', () => this.next())
events.$on('file-preview:prev', () => this.prev())
events.$on('document-zoom:in', () => {
if (this.documentSize < 100) {
this.documentSize += 10
localStorage.setItem('documentSize', this.documentSize)
}
})
events.$on('document-zoom:out', () => {
if (this.documentSize > 40) {
this.documentSize -= 10
localStorage.setItem('documentSize', this.documentSize)
}
})
this.getDocumentSize()
this.getFilesForView()
}
}
</script>
<style src="pdfvuer/dist/pdfvuer.css" lang="css"></style>
<style lang="scss">
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
.navigation-arrows {
.prev, .next {
cursor: pointer;
position: absolute;
top: 45%;
display: flex;
justify-content: center;
color: $text;
border-radius: 50%;
text-decoration: none;
user-select: none;
filter: drop-shadow(0px 1px 0 rgba(255, 255, 255, 1));
padding: 10px;
z-index: 2;
}
.next {
right: 0;
}
.prev {
left: 0;
}
}
#pdf-wrapper {
border-radius: 8px;
overflow-y: scroll;
margin: 0 auto;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
padding: 40px;
.pdf-file {
box-shadow: $light_mode_popup_shadow;
border-radius: 8px;
overflow: hidden;
}
}
.media-full-preview {
height: calc(100% - 72px);
top: 72px;
position: relative;
background-color: white;
}
.file-wrapper-preview {
width: 100%;
height: 100%;
padding: 30px 0px;
display: flex;
overflow: hidden;
justify-content: center;
align-items: center;
background-color: white;
.file-wrapper {
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
.file-shadow {
box-shadow: 0 8px 40px rgba(17, 26, 52, 0.05);
}
.file {
max-width: 100%;
max-height: 100%;
align-self: center;
}
.audio {
border-radius: 28px;
}
img {
border-radius: 4px;
}
.video-wrapper {
max-width: 1080px;
max-height: 100%;
@media (min-width: 1200px) {
& {
max-width: 800px;
}
}
@media (min-width: 1920px) and (max-width: 2560px) {
& {
max-width: 1080px;
}
}
@media (min-width: 2560px) and (max-width: 3840px) {
& {
max-width: 1440px;
}
}
@media (min-width: 3840px) {
& {
max-width: 2160px;
}
}
.video {
max-width: 100%;
max-height: 100%;
align-self: center;
}
}
}
}
@media only screen and (max-width: 960px) {
.media-full-preview {
top: 53px;
}
#pdf-wrapper {
border-radius: 0;
padding: 0;
.pdf-file {
box-shadow: none;
border-radius: 0;
}
}
}
.dark-mode {
.navigation-arrows {
.prev, .next {
color: $light-text;
filter: drop-shadow(0px 1px 0 rgba(17, 19, 20, 1));
}
}
.file-wrapper-preview {
background-color: $dark_mode_background;
.file-wrapper {
.file-shadow {
box-shadow: 0 8px 40px rgba(0, 0, 0, 0.1);
}
}
}
}
</style>
resources/js/components/FilesView/FileSortingMobile.vue
+3 -3
View File
@@ -7,9 +7,9 @@
</template>
<script>
import FileSortingOptions from '@/components/FilesView/FileSortingOptions'
import MenuMobileGroup from '@/components/Mobile/MenuMobileGroup'
import MenuMobile from '@/components/Mobile/MenuMobile'
import FileSortingOptions from '/resources/js/components/FilesView/FileSortingOptions'
import MenuMobileGroup from '/resources/js/components/Mobile/MenuMobileGroup'
import MenuMobile from '/resources/js/components/Mobile/MenuMobile'
export default {
name: 'FilterSortingMobile',
resources/js/components/FilesView/FileSortingOptions.vue
+2 -2
View File
@@ -13,8 +13,8 @@
<script>
import OptionGroup from '@/components/FilesView/OptionGroup'
import Option from '@/components/FilesView/Option'
import OptionGroup from '/resources/js/components/FilesView/OptionGroup'
import Option from '/resources/js/components/FilesView/Option'
import { ArrowUpIcon } from 'vue-feather-icons'
import { mapGetters } from 'vuex'
resources/js/components/FilesView/FolderIcon.vue
+3 -3
View File
@@ -15,7 +15,7 @@
</template>
<script>
import Emoji from '@/components/Others/Emoji'
import Emoji from '/resources/js/components/Others/Emoji'
export default {
name: 'FolderIcon',
@@ -52,8 +52,8 @@
</script>
<style lang="scss" scoped>
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
// Locations
.file-item-list {
resources/js/components/FilesView/Icons/CloudPlusIcon.vue
+17
View File
@@ -0,0 +1,17 @@
<template>
<svg class="preview-list-icon" fill="none" stroke="currentColor" stroke-width="1.5" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round" width="15px" height="15px" viewBox="0 0 17 12" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<path d="M14.2729998,10.7729998 C15.6774712,10.0073227 16.384111,8.38688297 15.9895447,6.83668332 C15.5949785,5.28648367 14.1996249,4.20105605 12.5999998,4.19999993 L11.7179998,4.19999993 C11.1377566,1.9556703 9.23470173,0.300843012 6.93154234,0.0378706728 C4.62838295,-0.225101666 2.40127934,0.958148431 1.33005562,3.01391529 C0.258831904,5.06968215 0.564955244,7.57295196 2.09999996,9.30999984" id="Path"></path>
<line x1="8.5" y1="7" x2="8.5" y2="12" id="Path"></line>
<line x1="6" y1="9.5" x2="11" y2="9.5" id="Path"></line>
</svg>
</template>
<style lang="scss">
.preview-list-icon {
path, line {
color: inherit;
}
}
</style>
resources/js/components/FilesView/ImageMetaData.vue
+2 -2
View File
@@ -108,8 +108,8 @@ export default {
</script>
<style lang="scss" scoped>
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.meta-data-list {
list-style: none;
resources/js/components/FilesView/InfoSidebar.vue
+8 -8
View File
@@ -90,16 +90,16 @@
</template>
<script>
import FilePreviewDetail from '@/components/Others/FilePreviewDetail'
import FilePreviewDetail from '/resources/js/components/Others/FilePreviewDetail'
import {Edit2Icon, LockIcon, UnlockIcon} from 'vue-feather-icons'
import ImageMetaData from '@/components/FilesView/ImageMetaData'
import EmptyMessage from '@/components/FilesView/EmptyMessage'
import TitlePreview from '@/components/FilesView/TitlePreview'
import CopyShareLink from '@/components/Others/Forms/CopyShareLink'
import ListInfoItem from '@/components/Others/ListInfoItem'
import ListInfo from '@/components/Others/ListInfo'
import ImageMetaData from '/resources/js/components/FilesView/ImageMetaData'
import EmptyMessage from '/resources/js/components/FilesView/EmptyMessage'
import TitlePreview from '/resources/js/components/FilesView/TitlePreview'
import CopyShareLink from '/resources/js/components/Others/Forms/CopyShareLink'
import ListInfoItem from '/resources/js/components/Others/ListInfoItem'
import ListInfo from '/resources/js/components/Others/ListInfo'
import {mapGetters} from 'vuex'
import {events} from "@/bus"
import {events} from '/resources/js/bus'
export default {
name: 'InfoSidebar',
resources/js/components/FilesView/MobileActionButton.vue
+12 -7
View File
@@ -1,6 +1,7 @@
<template>
<button class="mobile-action-button">
<div class="flex">
<search-icon v-if="icon === 'search'" size="15" class="icon dark-text-theme" />
<refresh-cw-icon v-if="icon === 'refresh'" size="15" class="icon dark-text-theme" />
<download-icon v-if="icon === 'download'" size="15" class="icon dark-text-theme" />
<copy-icon v-if="icon === 'copy'" size="15" class="icon dark-text-theme" />
@@ -17,7 +18,8 @@
<check-icon v-if="icon === 'check'" size="15" class="icon dark-text-theme" />
<dollar-sign-icon v-if="icon === 'dollar-sign'" size="15" class="icon dark-text-theme" />
<sorting-icon v-if="icon === 'preview-sorting'" class="icon dark-text-theme preview-sorting" />
<span class="label">
<cloud-plus-icon v-if="icon === 'cloud-plus'" class="icon dark-text-theme preview-sorting" />
<span v-if="$slots.default" class="label">
<slot></slot>
</span>
</div>
@@ -25,8 +27,9 @@
</template>
<script>
import { RefreshCwIcon, DownloadIcon, CopyIcon, FilterIcon, DollarSignIcon, CheckIcon, XSquareIcon, CheckSquareIcon, FolderPlusIcon, ListIcon, GridIcon, TrashIcon, UserPlusIcon, PlusIcon, CreditCardIcon } from 'vue-feather-icons'
import SortingIcon from '@/components/FilesView/Icons/SortingIcon'
import { SearchIcon, RefreshCwIcon, DownloadIcon, CopyIcon, FilterIcon, DollarSignIcon, CheckIcon, XSquareIcon, CheckSquareIcon, FolderPlusIcon, ListIcon, GridIcon, TrashIcon, UserPlusIcon, PlusIcon, CreditCardIcon } from 'vue-feather-icons'
import CloudPlusIcon from '/resources/js/components/FilesView/Icons/CloudPlusIcon'
import SortingIcon from '/resources/js/components/FilesView/Icons/SortingIcon'
export default {
name: 'MobileActionButton',
@@ -39,11 +42,13 @@
CreditCardIcon,
FolderPlusIcon,
RefreshCwIcon,
CloudPlusIcon,
UserPlusIcon,
DownloadIcon,
SortingIcon,
XSquareIcon,
FilterIcon,
SearchIcon,
CheckIcon,
TrashIcon,
PlusIcon,
@@ -55,8 +60,8 @@
</script>
<style scoped lang="scss">
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.mobile-action-button {
background: $light_background;
@@ -73,7 +78,6 @@
}
.icon {
margin-right: 10px;
@include font-size(14);
path, line, polyline, rect, circle, polygon {
@@ -86,7 +90,8 @@
@include font-size(14);
font-weight: 700;
color: $text;
}
padding-left: 10px;
}
&:active {
@include transform(scale(0.95));
resources/js/components/FilesView/MobileActionButtonUpload.vue
+2 -2
View File
@@ -34,8 +34,8 @@
</script>
<style scoped lang="scss">
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.mobile-action-button {
background: $light_background;
resources/js/components/FilesView/MobileToolbar.vue
+20 -23
View File
@@ -2,14 +2,14 @@
<div class="mobile-toolbar">
<!-- Go back-->
<div @click="goBack" class="go-back-button" :class="{'is-visible': browseHistory.length > 1}">
<chevron-left-icon size="17" class="icon-back" />
</div>
<div @click="goBack" class="go-back-button">
<chevron-left-icon size="17" class="icon-back" :class="{'is-visible': browseHistory.length > 1}" />
<!--Folder Title-->
<div class="directory-name">
{{ directoryName }}
</div>
<!--Folder Title-->
<div class="directory-name">
{{ directoryName }}
</div>
</div>
<!--More Actions-->
<div class="more-actions-button">
@@ -21,18 +21,16 @@
</template>
<script>
import ToolbarButtonUpload from '@/components/FilesView/ToolbarButtonUpload'
import ToolbarButton from '@/components/FilesView/ToolbarButton'
import SearchBar from '@/components/FilesView/SearchBar'
import ToolbarButton from '/resources/js/components/FilesView/ToolbarButton'
import SearchBar from '/resources/js/components/FilesView/SearchBar'
import { MenuIcon, ChevronLeftIcon } from 'vue-feather-icons'
import {mapGetters} from 'vuex'
import {events} from '@/bus'
import {events} from '/resources/js/bus'
import {last} from 'lodash'
export default {
name: 'MobileToolBar',
components: {
ToolbarButtonUpload,
ChevronLeftIcon,
ToolbarButton,
SearchBar,
@@ -84,8 +82,8 @@
</script>
<style scoped lang="scss">
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.mobile-toolbar {
background: white;
@@ -106,26 +104,25 @@
.go-back-button {
text-align: left;
flex: 1;
opacity: 0;
visibility: hidden;
pointer-events: none;
.icon-back {
pointer-events: none;
opacity: 0.15;
vertical-align: middle;
cursor: pointer;
margin-top: -2px;
}
margin-right: 4px;
&.is-visible {
pointer-events: initial;
visibility: visible;
opacity: 1;
&.is-visible {
pointer-events: initial;
visibility: visible;
opacity: 1;
}
}
}
.directory-name {
line-height: 1;
text-align: center;
width: 100%;
vertical-align: middle;
@include font-size(16);
resources/js/components/FilesView/MultiSelectToolbarMobile.vue
+15 -23
View File
@@ -5,7 +5,7 @@
<ToolbarButton class="action-btn" v-if="!$isThisLocation(['shared']) && $checkPermission('master') || $checkPermission('editor')" source="trash" :class="{'is-inactive' : clipboard.length < 1}" :action="$t('actions.delete')" @click.native="deleteItem" />
<ToolbarButton class="action-btn" v-if="!$isThisLocation(['shared'])" source="download" :class="{'is-inactive': canDownloadItems}" :action="$t('actions.delete')" @click.native="downloadItem" />
<ToolbarButton class="action-btn" v-if="!$isThisLocation(['shared'])" source="download" :action="$t('actions.delete')" @click.native="downloadItem" />
<ToolbarButton class="action-btn" source="shared-off" @click.native="shareCancel" v-if="$isThisLocation(['shared'])" />
@@ -15,18 +15,19 @@
</template>
<script>
import ToolbarButton from '@/components/FilesView/ToolbarButton'
import {events} from '@/bus'
import ToolbarButton from '/resources/js/components/FilesView/ToolbarButton'
import {mapGetters} from 'vuex'
import {events} from '/resources/js/bus'
export default {
name: 'MultiSelectToolbarMobile',
components: {ToolbarButton},
components: {
ToolbarButton
},
computed: {
...mapGetters(['clipboard']),
canDownloadItems() {
return this.clipboard.filter(item => item.type === 'folder').length !== 0
}
...mapGetters([
'clipboard'
]),
},
data() {
return {
@@ -42,8 +43,8 @@ export default {
events.$emit('mobileSelecting:stop')
},
downloadItem() {
if (this.clipboard.length > 1)
this.$store.dispatch('downloadFiles')
if (this.clipboard.length > 1 || (this.clipboard.length === 1 && this.clipboard[0].type === 'folder'))
this.$store.dispatch('downloadZip')
else {
this.$downloadFile(this.clipboard[0].file_url, this.clipboard[0].name + '.' + this.clipboard[0].mimetype)
}
@@ -54,29 +55,20 @@ export default {
events.$emit('popup:open', {name: 'move', item: [this.clipboard[0]]})
},
deleteItem() {
//Delete items
this.$store.dispatch('deleteItem')
this.closeSelecting()
}
},
created() {
events.$on('mobileSelecting:start', () => {
this.mobileMultiSelect = true
})
events.$on('mobileSelecting:stop', () => {
this.mobileMultiSelect = false
})
events.$on('mobileSelecting:start', () => this.mobileMultiSelect = true)
events.$on('mobileSelecting:stop', () => this.mobileMultiSelect = false)
}
}
</script>
<style scoped lang="scss">
@import "@assets/vuefilemanager/_variables";
@import "@assets/vuefilemanager/_mixins";
@import "resources/sass/vuefilemanager/_variables";
@import "resources/sass/vuefilemanager/_mixins";
.multiselect-actions {
display: flex;
resources/js/components/FilesView/Option.vue
+4 -3
View File
@@ -32,6 +32,7 @@
<globe-icon v-if="icon === 'globe'" size="17" class="group-hover-text-theme" :class="{'text-theme': isActive}"/>
<monitor-icon v-if="icon === 'monitor'" size="17" class="group-hover-text-theme" :class="{'text-theme': isActive}"/>
<box-icon v-if="icon === 'box'" size="17" class="group-hover-text-theme" :class="{'text-theme': isActive}"/>
<folder-plus-icon v-if="icon === 'folder-plus'" size="17" class="group-hover-text-theme" :class="{'text-theme': isActive}"/>
</div>
<div class="text-label group-hover-text-theme" :class="{'text-theme': isActive}">
{{ title }}
@@ -45,7 +46,7 @@
</template>
<script>
import AlphabetIcon from '@/components/FilesView/Icons/AlphabetIcon'
import AlphabetIcon from '/resources/js/components/FilesView/Icons/AlphabetIcon'
import {
ArrowUpIcon,
ArrowDownIcon,
@@ -129,8 +130,8 @@ import {
</script>
<style scoped lang="scss">
@import "@assets/vuefilemanager/_variables";
@import "@assets/vuefilemanager/_mixins";
@import "resources/sass/vuefilemanager/_variables";
@import "resources/sass/vuefilemanager/_mixins";
.menu-option {
white-space: nowrap;
resources/js/components/FilesView/OptionGroup.vue
+2 -2
View File
@@ -11,8 +11,8 @@
</script>
<style scoped lang="scss" scoped>
@import "@assets/vuefilemanager/_variables";
@import "@assets/vuefilemanager/_mixins";
@import "resources/sass/vuefilemanager/_variables";
@import "resources/sass/vuefilemanager/_mixins";
.menu-option-group {
padding: 5px 0;
resources/js/components/FilesView/OptionUpload.vue
+84
View File
@@ -0,0 +1,84 @@
<template>
<label for="file" class="menu-option group">
<div class="icon-left group-hover-text-theme">
<upload-cloud-icon size="17" class="group-hover-text-theme"/>
</div>
<div class="text-label group-hover-text-theme">
{{ title }}
<input
@change="emmitFiles"
v-show="false"
id="file"
type="file"
name="files[]"
multiple
/>
</div>
</label>
</template>
<script>
import {events} from '/resources/js/bus'
import {
UploadCloudIcon,
} from 'vue-feather-icons'
export default {
name: 'Option',
props:[
'title',
],
components: {
UploadCloudIcon,
},
methods: {
emmitFiles(e) {
this.$uploadFiles(e.target.files)
events.$emit('popover:close', 'desktop-create')
}
}
}
</script>
<style scoped lang="scss">
@import "resources/sass/vuefilemanager/_variables";
@import "resources/sass/vuefilemanager/_mixins";
.menu-option {
white-space: nowrap;
font-weight: 700;
@include font-size(14);
padding: 15px 20px;
cursor: pointer;
width: 100%;
color: $text;
display: flex;
align-items: center;
.icon-left {
margin-right: 20px;
line-height: 0;
path,
line,
polyline,
rect,
circle,
polygon {
color: inherit;
}
}
.text-label {
@include font-size(16);
}
}
.dark-mode {
.menu-option {
color: $dark_mode_text_primary;
}
}
</style>
resources/js/components/FilesView/ProcessingPopup.vue
+3 -3
View File
@@ -15,7 +15,7 @@
</template>
<script>
import Spinner from '@/components/FilesView/Spinner'
import Spinner from '/resources/js/components/FilesView/Spinner'
import { mapGetters } from 'vuex'
export default {
@@ -32,8 +32,8 @@ export default {
</script>
<style scoped lang="scss">
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.spinner-wrapper {
padding-bottom: 90px;
resources/js/components/FilesView/ProgressBar.vue
+2 -2
View File
@@ -12,8 +12,8 @@ export default {
</script>
<style scoped lang="scss">
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.progress-bar {
width: 100%;
resources/js/components/FilesView/SearchBar.vue
+47 -109
View File
@@ -1,148 +1,86 @@
<template>
<div class="search-bar">
<div class="icon" v-if="!isQuery">
<search-icon size="19" />
</div>
<div class="icon" v-if="isQuery" @click="resetQuery">
<x-icon class="pointer" size="19" />
</div>
<input
v-model="query"
@input="$emit('input', query)"
class="query focus-border-theme"
type="text"
:placeholder="placeholder"
/>
<div @click="showSpotlight" class="search-bar">
<div class="message">
<span>
{{ $t('inputs.placeholder_search_files') }}
</span>
<span>
{{ metaKeyIcon }}+K
</span>
</div>
</div>
</template>
<script>
import {SearchIcon, XIcon} from 'vue-feather-icons'
import {events} from '@/bus'
import {SearchIcon} from 'vue-feather-icons'
import {events} from '/resources/js/bus'
export default {
name: 'DesktopSearchBar',
props: [
'placeholder'
],
name: 'SearchBar',
components: {
SearchIcon,
XIcon,
},
computed: {
isQuery() {
return this.query !== '' && typeof this.query !== 'undefined'
}
},
data() {
return {
query: ''
}
},
methods: {
resetQuery() {
this.query = ''
this.$emit('reset-query')
}
},
created() {
events.$on('clear-query', () => this.query = undefined)
}
computed: {
metaKeyIcon() {
return this.$isApple() ? '⌘' : '⊞'
},
},
methods: {
showSpotlight() {
events.$emit('spotlight:show')
}
}
}
</script>
<style scoped lang="scss">
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.search-bar {
position: relative;
background: $light_background;
border-radius: 8px;
cursor: pointer;
input {
background: transparent;
.message {
border-radius: 8px;
outline: 0;
padding: 9px 20px 9px 43px;
font-weight: 400;
@include font-size(16);
min-width: 175px;
transition: 0.15s all ease;
border: 1px solid white;
-webkit-appearance: none;
padding: 11px 20px;
min-width: 300px;
text-align: left;
display: flex;
justify-content: space-between;
&::placeholder {
color: $text;
@include font-size(14);
font-weight: 500;
}
&:focus {
//box-shadow: 0 0 7px rgba($theme, 0.3);
}
&:focus + .icon {
path {
fill: $theme;
}
}
}
.icon {
position: absolute;
top: 0;
left: 0;
padding: 11px 15px;
.pointer {
cursor: pointer;
}
span {
font-weight: 400;
@include font-size(14);
color: #B9B9B9;
}
}
}
@media only screen and (max-width: 1024px) {
.search-bar input {
.search-bar .message {
max-width: 190px;
padding-right: 0;
}
}
@media only screen and (max-width: 690px) {
.search-bar {
input {
min-width: initial;
width: 100%;
max-width: initial;
padding: 9px 20px 9px 30px;
&:focus {
border: 1px solid transparent;
box-shadow: none;
}
}
.icon {
padding: 11px 15px 11px 0;
}
}
.search-bar .message {
min-width: initial;
width: 100%;
max-width: initial;
}
}
.dark-mode {
.search-bar {
input {
border-color: transparent;
color: $dark_mode_text_primary;
background: $dark_mode_foreground;
&::placeholder {
color: $dark_mode_text_secondary;
}
}
.icon svg path {
fill: $dark_mode_text_secondary;
.message span {
color: $dark_mode_text_secondary;
}
}
}
resources/js/components/FilesView/Spinner.vue
+2 -2
View File
@@ -11,8 +11,8 @@
</script>
<style scoped lang="scss">
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
#loading-bar-spinner.spinner {
left: 50%;
resources/js/components/FilesView/TitlePreview.vue
+2 -2
View File
@@ -41,8 +41,8 @@ export default {
</script>
<style lang="scss" scoped>
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.wrapper {
display: flex;
resources/js/components/FilesView/ToolbarButton.vue
+9 -3
View File
@@ -3,6 +3,7 @@
<corner-down-right-icon v-if="source === 'move'" size="19" class="hover-text-theme" />
<download-cloud-icon v-if="source === 'download'" size="19" class="hover-text-theme" />
<folder-plus-icon v-if="source === 'folder-plus'" size="19" class="hover-text-theme" />
<user-plus-icon v-if="source === 'user-plus'" size="19" class="hover-text-theme" />
<zoom-in-icon v-if="source === 'zoom-in'" size="19" />
<zoom-out-icon v-if="source === 'zoom-out'" size="19" />
<edit-2-icon v-if="source === 'rename'" size="19" />
@@ -15,12 +16,15 @@
<x-icon v-if="source === 'close'" size="19" />
<cloud-off-icon v-if="source === 'shared-off'" size="19" />
<sorting-icon v-if="source === 'preview-sorting'" class="preview-sorting"/>
<CloudPlusIcon v-if="source === 'cloud-plus'" class="preview-sorting"/>
</button>
</template>
<script>
import SortingIcon from '@/components/FilesView/Icons/SortingIcon'
import SortingIcon from '/resources/js/components/FilesView/Icons/SortingIcon'
import CloudPlusIcon from '/resources/js/components/FilesView/Icons/CloudPlusIcon'
import {
UserPlusIcon,
CornerDownRightIcon,
DownloadCloudIcon,
FolderPlusIcon,
@@ -44,6 +48,8 @@
'action'
],
components: {
CloudPlusIcon,
UserPlusIcon,
SortingIcon,
CornerDownRightIcon,
DownloadCloudIcon,
@@ -64,8 +70,8 @@
</script>
<style scoped lang="scss">
@import "@assets/vuefilemanager/_variables";
@import "@assets/vuefilemanager/_mixins";
@import "resources/sass/vuefilemanager/_variables";
@import "resources/sass/vuefilemanager/_mixins";
.preview-sorting {
transform: scale(1.3);
resources/js/components/FilesView/ToolbarButtonUpload.vue
-86
View File
@@ -1,86 +0,0 @@
<template>
<label label="file" class="button hover-text-theme file-input">
<upload-cloud-icon size="17" />
<input
@change="emmitFiles"
v-show="false"
id="file"
type="file"
name="files[]"
multiple
/>
</label>
</template>
<script>
import { UploadCloudIcon } from 'vue-feather-icons'
export default {
name: 'ToolbarButtonUpload',
props: ['action'],
components: {
UploadCloudIcon,
},
methods: {
emmitFiles(e) {
this.$uploadFiles(e.target.files)
}
}
}
</script>
<style scoped lang="scss">
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
.button {
height: 42px;
width: 42px;
border-radius: 8px;
display: inline-flex;
align-items: center;
justify-content: center;
padding: 0;
text-align: center;
cursor: pointer;
white-space: nowrap;
outline: none;
border: none;
svg {
color: inherit;
path, line, polyline, rect, circle {
color: inherit;
}
}
&:hover {
background: $light_background;
path,
line,
polyline,
rect,
circle {
@include transition(150ms);
color: inherit;
}
}
}
.dark-mode {
.button {
background: transparent;
&:hover {
background: $dark_mode_foreground;
}
path, line, polyline, rect, circle {
stroke: $dark_mode_text_primary;
}
}
}
</style>
resources/js/components/FilesView/UploadProgress.vue
+4 -4
View File
@@ -25,10 +25,10 @@
</template>
<script>
import ProgressBar from '@/components/FilesView/ProgressBar'
import ProgressBar from '/resources/js/components/FilesView/ProgressBar'
import { RefreshCwIcon, XIcon } from 'vue-feather-icons'
import {mapGetters} from 'vuex'
import {events} from '@/bus'
import {events} from '/resources/js/bus'
export default {
name: 'UploadProgress',
@@ -55,8 +55,8 @@
</script>
<style scoped lang="scss">
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.sync-alt {
animation: spin 1s linear infinite;
resources/js/components/Index/Components/PageTitle.vue
+3 -3
View File
@@ -15,9 +15,9 @@
</script>
<style lang="scss" scoped>
@import '@assets/vuefilemanager/_landing-page';
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_landing-page';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.page-title {
position: relative;
resources/js/components/Index/Components/PricingTables.vue
+2 -2
View File
@@ -49,8 +49,8 @@
</script>
<style lang="scss" scoped>
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.plans-wrapper {
box-shadow: 0 7px 20px 5px hsla(220, 36%, 16%, 0.05);
resources/js/components/Index/IndexGetStarted.vue
+4 -4
View File
@@ -41,7 +41,7 @@
</template>
<script>
import PageTitle from '@/components/Index/Components/PageTitle'
import PageTitle from '/resources/js/components/Index/Components/PageTitle'
import {
ChevronRightIcon,
UploadCloudIcon,
@@ -88,9 +88,9 @@
</script>
<style lang="scss" scoped>
@import '@assets/vuefilemanager/_landing-page';
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_landing-page';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.icons {
resources/js/components/Index/IndexHeroScreenshot.vue
+3 -3
View File
@@ -57,9 +57,9 @@
</script>
<style lang="scss" scoped>
@import '@assets/vuefilemanager/_landing-page';
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_landing-page';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.icons {
resources/js/components/Index/IndexMainFeatures.vue
+4 -4
View File
@@ -51,7 +51,7 @@
<script>
import { UserIcon, CloudIcon, HardDriveIcon } from 'vue-feather-icons'
import PageTitle from '@/components/Index/Components/PageTitle'
import PageTitle from '/resources/js/components/Index/Components/PageTitle'
import { mapGetters } from 'vuex'
export default {
@@ -69,9 +69,9 @@
</script>
<style lang="scss" scoped>
@import '@assets/vuefilemanager/_landing-page';
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_landing-page';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.features {
padding-left: 75px;
resources/js/components/Index/IndexNavigation.vue
+3 -3
View File
@@ -55,9 +55,9 @@
</script>
<style lang="scss" scoped>
@import '@assets/vuefilemanager/_landing-page';
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_landing-page';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.main-navigation {
justify-content: space-between;
resources/js/components/Index/IndexPageFooter.vue
+3 -3
View File
@@ -39,9 +39,9 @@
</script>
<style lang="scss" scoped>
@import '@assets/vuefilemanager/_landing-page';
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_landing-page';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
footer {
text-align: center;
resources/js/components/Index/IndexPageHeader.vue
+5 -5
View File
@@ -33,8 +33,8 @@
<script>
import HardDriveIcon from "vue-feather-icons/icons/HardDriveIcon";
import PageTitle from '@/components/Index/Components/PageTitle'
import AuthButton from '@/components/Auth/AuthButton'
import PageTitle from '/resources/js/components/Index/Components/PageTitle'
import AuthButton from '/resources/js/components/Auth/AuthButton'
import { CreditCardIcon } from 'vue-feather-icons'
import { mapGetters } from 'vuex'
@@ -53,9 +53,9 @@
</script>
<style lang="scss" scoped>
@import '@assets/vuefilemanager/_landing-page';
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_landing-page';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.features {
display: flex;
resources/js/components/Index/IndexPricingTables.vue
+5 -5
View File
@@ -21,8 +21,8 @@
</template>
<script>
import PricingTables from '@/components/Index/Components/PricingTables'
import AuthButton from '@/components/Auth/AuthButton'
import PricingTables from '/resources/js/components/Index/Components/PricingTables'
import AuthButton from '/resources/js/components/Auth/AuthButton'
import { CloudIcon } from 'vue-feather-icons'
import { mapGetters } from 'vuex'
@@ -51,9 +51,9 @@
</script>
<style lang="scss" scoped>
@import '@assets/vuefilemanager/_landing-page';
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_landing-page';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.pricing {
.cloud-bg {
resources/js/components/Mobile/MenuMobile.vue
+3 -3
View File
@@ -7,7 +7,7 @@
</template>
<script>
import {events} from '@/bus'
import {events} from '/resources/js/bus'
export default {
name: 'MenuMobile',
@@ -38,8 +38,8 @@
</script>
<style scoped lang="scss">
@import "@assets/vuefilemanager/_variables";
@import "@assets/vuefilemanager/_mixins";
@import "resources/sass/vuefilemanager/_variables";
@import "resources/sass/vuefilemanager/_mixins";
.options {
position: absolute;
resources/js/components/Mobile/MenuMobileGroup.vue
+2 -15
View File
@@ -5,27 +5,14 @@
</template>
<script>
import {mapGetters} from 'vuex'
export default {
name: 'MenuMobileGroup',
components: {
},
computed: {
...mapGetters(['config']),
},
data() {
return {
}
}
}
</script>
<style scoped lang="scss">
@import "@assets/vuefilemanager/_variables";
@import "@assets/vuefilemanager/_mixins";
@import "resources/sass/vuefilemanager/_variables";
@import "resources/sass/vuefilemanager/_mixins";
.menu-options {
margin-top: 10px;
resources/js/components/Mobile/MobileHeader.vue
+3 -3
View File
@@ -17,7 +17,7 @@
</template>
<script>
import {events} from '@/bus'
import {events} from '/resources/js/bus'
import {
ChevronLeftIcon,
@@ -45,8 +45,8 @@
</script>
<style scoped lang="scss">
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.mobile-header {
padding: 10px 0;
resources/js/components/Others/ActionButton.vue
+2 -2
View File
@@ -22,8 +22,8 @@
</script>
<style lang="scss" scoped>
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.action-button {
cursor: pointer;
resources/js/components/Others/ColorLabel.vue
+2 -2
View File
@@ -12,8 +12,8 @@
</script>
<style lang="scss" scoped>
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.color-label {
text-transform: capitalize;
resources/js/components/Others/ColorPicker.vue
+2 -2
View File
@@ -66,8 +66,8 @@ export default {
</script>
<style lang="scss" scoped>
@import "@assets/vuefilemanager/_inapp-forms.scss";
@import '@assets/vuefilemanager/_forms';
@import "resources/sass/vuefilemanager/_inapp-forms.scss";
@import '/resources/sass/vuefilemanager/_forms';
.color-pick-wrapper {
.color-wrapper {
resources/js/components/Others/ContentFileView.vue
+4 -4
View File
@@ -7,10 +7,10 @@
</template>
<script>
import DesktopToolbar from '@/components/FilesView/DesktopToolbar'
import FileBrowser from '@/components/FilesView/FileBrowser'
import ContextMenu from '@/components/FilesView/ContextMenu'
import {events} from '@/bus'
import DesktopToolbar from '/resources/js/components/FilesView/DesktopToolbar'
import FileBrowser from '/resources/js/components/FilesView/FileBrowser'
import ContextMenu from '/resources/js/components/FilesView/ContextMenu'
import {events} from '/resources/js/bus'
export default {
name: 'FilesView',
resources/js/components/Others/CookieDisclaimer.vue
+2 -2
View File
@@ -40,8 +40,8 @@
</script>
<style lang="scss" scoped>
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.cookie-wrapper {
@include widget-card;
resources/js/components/Others/CreateFolderPopup.vue
+11 -11
View File
@@ -43,16 +43,16 @@
<script>
import {ValidationProvider, ValidationObserver} from 'vee-validate/dist/vee-validate.full'
import PopupWrapper from '@/components/Others/Popup/PopupWrapper'
import PopupActions from '@/components/Others/Popup/PopupActions'
import PopupContent from '@/components/Others/Popup/PopupContent'
import PopupHeader from '@/components/Others/Popup/PopupHeader'
import ThumbnailItem from '@/components/Others/ThumbnailItem'
import SetFolderIcon from '@/components/Others/SetFolderIcon'
import ActionButton from '@/components/Others/ActionButton'
import ButtonBase from '@/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 SetFolderIcon from '/resources/js/components/Others/SetFolderIcon'
import ActionButton from '/resources/js/components/Others/ActionButton'
import ButtonBase from '/resources/js/components/FilesView/ButtonBase'
import {required} from 'vee-validate/dist/rules'
import {events} from '@/bus'
import {events} from '/resources/js/bus'
export default {
name: 'CreateFolderPopup',
@@ -118,8 +118,8 @@
</script>
<style scoped lang="scss">
@import "@assets/vuefilemanager/_inapp-forms.scss";
@import '@assets/vuefilemanager/_forms';
@import "resources/sass/vuefilemanager/_inapp-forms.scss";
@import '/resources/sass/vuefilemanager/_forms';
.item-thumbnail {
margin-bottom: 20px;
resources/js/components/Others/CreateLanguage.vue
+9 -9
View File
@@ -48,14 +48,14 @@
<script>
import {ValidationProvider, ValidationObserver} from 'vee-validate/dist/vee-validate.full'
import PopupWrapper from '@/components/Others/Popup/PopupWrapper'
import PopupActions from '@/components/Others/Popup/PopupActions'
import PopupContent from '@/components/Others/Popup/PopupContent'
import PopupHeader from '@/components/Others/Popup/PopupHeader'
import SelectInput from '@/components/Others/Forms/SelectInput'
import ButtonBase from '@/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 SelectInput from '/resources/js/components/Others/Forms/SelectInput'
import ButtonBase from '/resources/js/components/FilesView/ButtonBase'
import {required} from 'vee-validate/dist/rules'
import {events} from '@/bus'
import {events} from '/resources/js/bus'
import axios from 'axios'
export default {
@@ -855,8 +855,8 @@ export default {
</script>
<style scoped lang="scss">
@import "@assets/vuefilemanager/_inapp-forms.scss";
@import '@assets/vuefilemanager/_forms';
@import "resources/sass/vuefilemanager/_inapp-forms.scss";
@import '/resources/sass/vuefilemanager/_forms';
.item-thumbnail {
margin-bottom: 20px;
resources/js/components/Others/CreatePersonaTokenPopup.vue
+10 -10
View File
@@ -58,15 +58,15 @@
<script>
import {ValidationProvider, ValidationObserver} from 'vee-validate/dist/vee-validate.full'
import PopupWrapper from '@/components/Others/Popup/PopupWrapper'
import PopupActions from '@/components/Others/Popup/PopupActions'
import PopupContent from '@/components/Others/Popup/PopupContent'
import PopupHeader from '@/components/Others/Popup/PopupHeader'
import CopyInput from '@/components/Others/Forms/CopyInput'
import ButtonBase from '@/components/FilesView/ButtonBase'
import InfoBox from '@/components/Others/Forms/InfoBox'
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 CopyInput from '/resources/js/components/Others/Forms/CopyInput'
import ButtonBase from '/resources/js/components/FilesView/ButtonBase'
import InfoBox from '/resources/js/components/Others/Forms/InfoBox'
import {required} from 'vee-validate/dist/rules'
import {events} from '@/bus'
import {events} from '/resources/js/bus'
import axios from 'axios'
export default {
@@ -123,8 +123,8 @@ export default {
</script>
<style lang="scss" scoped>
@import "@assets/vuefilemanager/_inapp-forms.scss";
@import '@assets/vuefilemanager/_forms';
@import "resources/sass/vuefilemanager/_inapp-forms.scss";
@import '/resources/sass/vuefilemanager/_forms';
.dark-mode {
resources/js/components/Others/Emoji.vue
+2 -2
View File
@@ -29,8 +29,8 @@ export default {
</script>
<style lang="scss" scoped>
@import "@assets/vuefilemanager/_inapp-forms.scss";
@import '@assets/vuefilemanager/_forms';
@import "resources/sass/vuefilemanager/_inapp-forms.scss";
@import '/resources/sass/vuefilemanager/_forms';
.emoji-container {
font-size: inherit;
resources/js/components/Others/EmojiPicker.vue
+5 -5
View File
@@ -76,11 +76,11 @@
<script>
import {ChevronDownIcon, XIcon} from 'vue-feather-icons'
import Spinner from '@/components/FilesView/Spinner'
import Emoji from '@/components/Others/Emoji'
import Spinner from '/resources/js/components/FilesView/Spinner'
import Emoji from '/resources/js/components/Others/Emoji'
import {mapGetters} from 'vuex'
import {groupBy} from 'lodash'
import {events} from '@/bus'
import {events} from '/resources/js/bus'
export default {
@@ -207,8 +207,8 @@ export default {
</script>
<style lang="scss" scoped>
@import "@assets/vuefilemanager/_inapp-forms.scss";
@import '@assets/vuefilemanager/_forms';
@import "resources/sass/vuefilemanager/_inapp-forms.scss";
@import '/resources/sass/vuefilemanager/_forms';
.select-emoji-wrapper {
margin-bottom: 20px;
resources/js/components/Others/EmptyPageContent.vue
+2 -2
View File
@@ -30,8 +30,8 @@
</script>
<style lang="scss" scoped>
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.empty-page-content {
width: 100%;
resources/js/components/Others/FilePreviewDetail.vue
+2 -2
View File
@@ -26,8 +26,8 @@
</script>
<style scoped lang="scss">
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.preview {
width: 100%;
resources/js/components/Others/Forms/CopyInput.vue
+4 -4
View File
@@ -55,10 +55,10 @@ export default {
</script>
<style lang="scss" scoped>
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import "@assets/vuefilemanager/_inapp-forms.scss";
@import "@assets/vuefilemanager/_forms.scss";
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
@import "resources/sass/vuefilemanager/_inapp-forms.scss";
@import "resources/sass/vuefilemanager/_forms.scss";
.multi-icon {
display: flex;
resources/js/components/Others/Forms/CopyShareLink.vue
+5 -5
View File
@@ -15,7 +15,7 @@
<script>
import { LinkIcon, CheckIcon, SendIcon } from 'vue-feather-icons'
import { events } from '@/bus'
import { events } from '/resources/js/bus'
export default {
name: 'CopyShareLink',
@@ -63,10 +63,10 @@ export default {
</script>
<style lang="scss" scoped>
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import "@assets/vuefilemanager/_inapp-forms.scss";
@import "@assets/vuefilemanager/_forms.scss";
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
@import "resources/sass/vuefilemanager/_inapp-forms.scss";
@import "resources/sass/vuefilemanager/_forms.scss";
.multi-icon {
display: flex;
resources/js/components/Others/Forms/FormLabel.vue
+2 -2
View File
@@ -31,8 +31,8 @@
</script>
<style lang="scss" scoped>
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.form-label {
display: flex;
resources/js/components/Others/Forms/ImageInput.vue
+2 -2
View File
@@ -85,8 +85,8 @@
</script>
<style lang="scss" scoped>
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.dropzone {
border: 1px dashed #a1abc2;
resources/js/components/Others/Forms/InfoBox.vue
+2 -2
View File
@@ -12,8 +12,8 @@
</script>
<style lang="scss" scoped>
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.info-box {
padding: 20px;
resources/js/components/Others/Forms/MultiEmailInput.vue
+3 -3
View File
@@ -16,7 +16,7 @@
<script>
import { XIcon } from 'vue-feather-icons'
import { events } from '@/bus'
import { events } from '/resources/js/bus'
export default {
name: 'MultiEmailInput',
@@ -91,8 +91,8 @@ export default {
</script>
<style scoped lang="scss">
@import "@assets/vuefilemanager/_inapp-forms.scss";
@import '@assets/vuefilemanager/_forms';
@import "resources/sass/vuefilemanager/_inapp-forms.scss";
@import '/resources/sass/vuefilemanager/_forms';
.wrapper {
margin-bottom: 20px;
resources/js/components/Others/Forms/SearchInput.vue
+3 -3
View File
@@ -41,9 +41,9 @@ export default {
</script>
<style lang="scss" scoped>
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '@assets/vuefilemanager/_forms';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_forms';
.search-bar {
padding: 7px 0px;
resources/js/components/Others/Forms/SelectBoxInput.vue
+4 -4
View File
@@ -40,10 +40,10 @@
</script>
<style lang="scss" scoped>
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import "@assets/vuefilemanager/_inapp-forms.scss";
@import "@assets/vuefilemanager/_forms.scss";
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
@import "resources/sass/vuefilemanager/_inapp-forms.scss";
@import "resources/sass/vuefilemanager/_forms.scss";
.select-box {
display: flex;
resources/js/components/Others/Forms/SelectInput.vue
+2 -2
View File
@@ -111,8 +111,8 @@
</script>
<style lang="scss" scoped>
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.select {
position: relative;
resources/js/components/Others/Forms/SetupBox.vue
+2 -2
View File
@@ -14,8 +14,8 @@
</script>
<style lang="scss" scoped>
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.setup-box {
padding: 20px;
resources/js/components/Others/Forms/SwitchInput.vue
+2 -2
View File
@@ -39,8 +39,8 @@
</script>
<style lang="scss" scoped>
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.input-wrapper {
display: flex;
resources/js/components/Others/Layout/PageTab.vue
+3 -3
View File
@@ -8,7 +8,7 @@
</template>
<script>
import Spinner from '@/components/FilesView/Spinner'
import Spinner from '/resources/js/components/FilesView/Spinner'
export default {
name: 'PageTab',
@@ -20,6 +20,6 @@
</script>
<style lang="scss" scoped>
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
</style>
resources/js/components/Others/Layout/PageTabGroup.vue
+2 -2
View File
@@ -11,8 +11,8 @@
</script>
<style lang="scss" scoped>
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.page-tab-group {
margin-bottom: 65px;
resources/js/components/Others/ListInfo.vue
+2 -2
View File
@@ -11,6 +11,6 @@
</script>
<style lang="scss" scoped>
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
</style>
resources/js/components/Others/ListInfoItem.vue
+2 -2
View File
@@ -14,8 +14,8 @@
</script>
<style lang="scss" scoped>
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.list-info-item {
display: block;
resources/js/components/Others/MobileNavigation.vue
+7 -7
View File
@@ -52,11 +52,11 @@
</template>
<script>
import MenuMobileGroup from '@/components/Mobile/MenuMobileGroup'
import OptionGroup from '@/components/FilesView/OptionGroup'
import UserHeadline from '@/components/Sidebar/UserHeadline'
import MenuMobile from '@/components/Mobile/MenuMobile'
import Option from '@/components/FilesView/Option'
import MenuMobileGroup from '/resources/js/components/Mobile/MenuMobileGroup'
import OptionGroup from '/resources/js/components/FilesView/OptionGroup'
import UserHeadline from '/resources/js/components/Sidebar/UserHeadline'
import MenuMobile from '/resources/js/components/Mobile/MenuMobile'
import Option from '/resources/js/components/FilesView/Option'
import {ChevronLeftIcon} from 'vue-feather-icons'
import {mapGetters} from 'vuex'
@@ -115,8 +115,8 @@
</script>
<style scoped lang="scss">
@import "@assets/vuefilemanager/_variables";
@import "@assets/vuefilemanager/_mixins";
@import "resources/sass/vuefilemanager/_variables";
@import "resources/sass/vuefilemanager/_mixins";
.user-info {
padding: 20px 20px 10px;
resources/js/components/Others/MoveItemPopup.vue
+12 -12
View File
@@ -41,18 +41,18 @@
</template>
<script>
import PopupWrapper from '@/components/Others/Popup/PopupWrapper'
import PopupActions from '@/components/Others/Popup/PopupActions'
import TitlePreview from '@/components/FilesView/TitlePreview'
import PopupContent from '@/components/Others/Popup/PopupContent'
import PopupHeader from '@/components/Others/Popup/PopupHeader'
import ThumbnailItem from '@/components/Others/ThumbnailItem'
import ButtonBase from '@/components/FilesView/ButtonBase'
import Spinner from '@/components/FilesView/Spinner'
import TreeMenu from '@/components/Others/TreeMenu'
import PopupWrapper from '/resources/js/components/Others/Popup/PopupWrapper'
import PopupActions from '/resources/js/components/Others/Popup/PopupActions'
import TitlePreview from '/resources/js/components/FilesView/TitlePreview'
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 Spinner from '/resources/js/components/FilesView/Spinner'
import TreeMenu from '/resources/js/components/Others/TreeMenu'
import {isArray, isNull} from 'lodash'
import {mapGetters} from 'vuex'
import {events} from '@/bus'
import {events} from '/resources/js/bus'
export default {
name: 'MoveItemPopup',
@@ -158,8 +158,8 @@
</script>
<style scoped lang="scss">
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.item-thumbnail {
margin-bottom: 20px;
resources/js/components/Others/Notifications/ToastrItem.vue → resources/js/components/Others/Notifications/ToasterItem.vue
+2 -2
View File
@@ -40,8 +40,8 @@
</script>
<style lang="scss" scoped>
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.fade-enter-active,
.fade-leave-active {
resources/js/components/Others/Notifications/ToastrWrapper.vue → resources/js/components/Others/Notifications/ToasterWrapper.vue
+6 -6
View File
@@ -1,16 +1,16 @@
<template>
<div id="toastr-wrapper">
<ToastrItem :item="item" v-for="(item, i) in notifications" :key="i"/>
<ToasterItem :item="item" v-for="(item, i) in notifications" :key="i"/>
</div>
</template>
<script>
import ToastrItem from '@/components/Others/Notifications/ToastrItem'
import {events} from "@/bus";
import ToasterItem from '/resources/js/components/Others/Notifications/ToasterItem'
import {events} from '/resources/js/bus'
export default {
components: {
ToastrItem,
ToasterItem,
},
data() {
return {
@@ -24,8 +24,8 @@
</script>
<style lang="scss" scoped>
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.toastr-list {
transition: all 5s ease;
resources/js/components/Others/PageHeader.vue
+2 -2
View File
@@ -24,8 +24,8 @@
</script>
<style lang="scss" scoped>
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.page-header {
display: flex;
resources/js/components/Others/PlanPricingTables.vue
+3 -3
View File
@@ -28,7 +28,7 @@
</template>
<script>
import ButtonBase from '@/components/FilesView/ButtonBase'
import ButtonBase from '/resources/js/components/FilesView/ButtonBase'
import {HardDriveIcon} from "vue-feather-icons"
import { mapGetters } from 'vuex'
import axios from 'axios'
@@ -72,8 +72,8 @@
</script>
<style lang="scss" scoped>
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.plan {
text-align: center;
resources/js/components/Others/Popup/ConfirmPopup.vue
+7 -7
View File
@@ -27,11 +27,11 @@
</template>
<script>
import PopupWrapper from '@/components/Others/Popup/PopupWrapper'
import PopupActions from '@/components/Others/Popup/PopupActions'
import PopupContent from '@/components/Others/Popup/PopupContent'
import ButtonBase from '@/components/FilesView/ButtonBase'
import {events} from '@/bus'
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 ButtonBase from '/resources/js/components/FilesView/ButtonBase'
import {events} from '/resources/js/bus'
export default {
name: 'ConfirmPopup',
@@ -83,8 +83,8 @@
</script>
<style scoped lang="scss">
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.popup-image {
padding-top: 20px;
resources/js/components/Others/Popup/PopupActions.vue
+2 -2
View File
@@ -11,8 +11,8 @@
</script>
<style lang="scss" scoped>
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.actions {
padding: 20px;
resources/js/components/Others/Popup/PopupContent.vue
+2 -2
View File
@@ -14,8 +14,8 @@
</script>
<style lang="scss" scoped>
@import '@assets/vuefilemanager/_variables';
@import '@assets/vuefilemanager/_mixins';
@import '/resources/sass/vuefilemanager/_variables';
@import '/resources/sass/vuefilemanager/_mixins';
.popup-content {
&.height-limited {

Some files were not shown because too many files have changed in this diff Show More