mirror of
https://github.com/VueFileManager/vuefilemanager.git
synced 2026-04-05 18:23:48 +00:00
remote upload popup frontend
This commit is contained in:
@@ -942,5 +942,10 @@ return [
|
||||
'paste_code_from_2fa_app' => 'Paste the latest code from 2fa app...',
|
||||
'zero_for_unlimited_members' => 'Type -1 to set unlimited team members.',
|
||||
'max_team_members' => 'Max Team Members',
|
||||
'remote_upload' => 'Remote Upload',
|
||||
'upload_files_remotely' => 'Upload Files Remotely',
|
||||
'remote_links' => 'Remote Links',
|
||||
'remote_links_help' => 'For every line paste one link',
|
||||
'paste_remote_links_here' => 'Paste your remote links here...',
|
||||
],
|
||||
];
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"/js/main.js": "/js/main.js",
|
||||
"/chunks/request.js": "/chunks/request.js?id=6770484e564115b3",
|
||||
"/chunks/request-upload.js": "/chunks/request-upload.js?id=501663f9e43072f8",
|
||||
"/chunks/request.js": "/chunks/request.js?id=0dad383d43899f08",
|
||||
"/chunks/request-upload.js": "/chunks/request-upload.js?id=c456f33bfbfd4038",
|
||||
"/chunks/setup-wizard.js": "/chunks/setup-wizard.js?id=19a0784e59d768ec",
|
||||
"/chunks/status-check.js": "/chunks/status-check.js?id=f40938d1fb43820f",
|
||||
"/chunks/purchase-code.js": "/chunks/purchase-code.js?id=ba76b9a8adbfdc0b",
|
||||
@@ -9,13 +9,13 @@
|
||||
"/chunks/environment.js": "/chunks/environment.js?id=784c2442268b36dc",
|
||||
"/chunks/app-setup.js": "/chunks/app-setup.js?id=cbe7bfed06400736",
|
||||
"/chunks/admin-account.js": "/chunks/admin-account.js?id=78d257775f5fc485",
|
||||
"/chunks/shared.js": "/chunks/shared.js?id=c0fa346721760ad2",
|
||||
"/chunks/shared/browser.js": "/chunks/shared/browser.js?id=b8c1f7904c027f05",
|
||||
"/chunks/shared.js": "/chunks/shared.js?id=af0396de02d1e02f",
|
||||
"/chunks/shared/browser.js": "/chunks/shared/browser.js?id=d2fff07a2bc7af3f",
|
||||
"/chunks/shared/single-file.js": "/chunks/shared/single-file.js?id=a6063bed9be75a09",
|
||||
"/chunks/shared/authenticate.js": "/chunks/shared/authenticate.js?id=b5519d193bce2339",
|
||||
"/chunks/not-found.js": "/chunks/not-found.js?id=d31bd699138cf828",
|
||||
"/chunks/temporary-unavailable.js": "/chunks/temporary-unavailable.js?id=26798085f527d955",
|
||||
"/chunks/admin.js": "/chunks/admin.js?id=ddcee582d6b9b738",
|
||||
"/chunks/admin.js": "/chunks/admin.js?id=5710bcabdcf37f2c",
|
||||
"/chunks/dashboard.js": "/chunks/dashboard.js?id=5ab55a12214433c8",
|
||||
"/chunks/invoices.js": "/chunks/invoices.js?id=799928609f57ca10",
|
||||
"/chunks/subscriptions.js": "/chunks/subscriptions.js?id=a0c4f59d0ec4aee0",
|
||||
@@ -57,18 +57,18 @@
|
||||
"/chunks/sign-up.js": "/chunks/sign-up.js?id=80da89f329c514fc",
|
||||
"/chunks/forgotten-password.js": "/chunks/forgotten-password.js?id=27cda9364b6593d8",
|
||||
"/chunks/create-new-password.js": "/chunks/create-new-password.js?id=2f0401ee2fc148c4",
|
||||
"/chunks/settings.js": "/chunks/settings.js?id=13f38ad770e862c6",
|
||||
"/chunks/settings.js": "/chunks/settings.js?id=25d4749b73a5077f",
|
||||
"/chunks/profile.js": "/chunks/profile.js?id=3e24bb5e1f52d4bb",
|
||||
"/chunks/settings-password.js": "/chunks/settings-password.js?id=d00bf503d8126dc4",
|
||||
"/chunks/settings-storage.js": "/chunks/settings-storage.js?id=092e324aad54656b",
|
||||
"/chunks/billing.js": "/chunks/billing.js?id=115c25478cee576d",
|
||||
"/chunks/platform.js": "/chunks/platform.js?id=622fe102512635e6",
|
||||
"/chunks/files.js": "/chunks/files.js?id=59bd6469922431e4",
|
||||
"/chunks/recent-uploads.js": "/chunks/recent-uploads.js?id=f7f85cc9ce14c054",
|
||||
"/chunks/my-shared-items.js": "/chunks/my-shared-items.js?id=5afd3b2bcc62f265",
|
||||
"/chunks/trash.js": "/chunks/trash.js?id=4ad4825cf154937b",
|
||||
"/chunks/team-folders.js": "/chunks/team-folders.js?id=8d851b9dce2f819d",
|
||||
"/chunks/shared-with-me.js": "/chunks/shared-with-me.js?id=49838b3807bb7797",
|
||||
"/chunks/platform.js": "/chunks/platform.js?id=1fb4ee8ee38bcaeb",
|
||||
"/chunks/files.js": "/chunks/files.js?id=aaea9173f7697d6e",
|
||||
"/chunks/recent-uploads.js": "/chunks/recent-uploads.js?id=4bab41df721a6fc6",
|
||||
"/chunks/my-shared-items.js": "/chunks/my-shared-items.js?id=c62bc3eb07de20df",
|
||||
"/chunks/trash.js": "/chunks/trash.js?id=31e826373e0d01f8",
|
||||
"/chunks/team-folders.js": "/chunks/team-folders.js?id=4babe7db8a9a3a16",
|
||||
"/chunks/shared-with-me.js": "/chunks/shared-with-me.js?id=cfb073052d66d07c",
|
||||
"/chunks/invitation.js": "/chunks/invitation.js?id=424b2783d9785a09",
|
||||
"/css/tailwind.css": "/css/tailwind.css",
|
||||
"/css/app.css": "/css/app.css"
|
||||
|
||||
@@ -12,17 +12,22 @@
|
||||
:action="$t('create_something')"
|
||||
/>
|
||||
<PopoverItem name="desktop-create" side="left">
|
||||
<OptionGroup :title="$t('upload')">
|
||||
<OptionGroup :title="$t('frequently_used')">
|
||||
<OptionUpload :title="$t('upload_files')" type="file" />
|
||||
<OptionUpload :title="$t('upload_folder')" type="folder" />
|
||||
</OptionGroup>
|
||||
<OptionGroup :title="$t('create')">
|
||||
<Option
|
||||
@click.native="$createFolder"
|
||||
:title="$t('create_folder')"
|
||||
icon="folder-plus"
|
||||
/>
|
||||
</OptionGroup>
|
||||
<OptionGroup :title="$t('others')">
|
||||
<OptionUpload :title="$t('upload_folder')" type="folder" />
|
||||
<Option
|
||||
@click.stop.native="$openRemoteUploadPopup"
|
||||
:title="$t('remote_upload')"
|
||||
icon="remote-upload"
|
||||
/>
|
||||
</OptionGroup>
|
||||
</PopoverItem>
|
||||
</PopoverWrapper>
|
||||
|
||||
|
||||
@@ -39,6 +39,11 @@
|
||||
:title="$t('upload_folder')"
|
||||
type="folder"
|
||||
/>
|
||||
<Option
|
||||
@click.stop.native="$openRemoteUploadPopup"
|
||||
:title="$t('remote_upload')"
|
||||
icon="remote-upload"
|
||||
/>
|
||||
<Option
|
||||
@click.stop.native="$createTeamFolder"
|
||||
:class="{ 'is-inactive': canCreateTeamFolder }"
|
||||
|
||||
@@ -119,6 +119,12 @@
|
||||
class="vue-feather group-hover-text-theme"
|
||||
:class="{ 'text-theme': isActive }"
|
||||
/>
|
||||
<link2-icon
|
||||
v-if="icon === 'remote-upload'"
|
||||
size="17"
|
||||
class="vue-feather group-hover-text-theme"
|
||||
:class="{ 'text-theme': isActive }"
|
||||
/>
|
||||
<users-icon
|
||||
v-if="icon === 'users'"
|
||||
size="17"
|
||||
@@ -246,6 +252,7 @@
|
||||
<script>
|
||||
import AlphabetIcon from '../../Icons/AlphabetIcon'
|
||||
import {
|
||||
Link2Icon,
|
||||
UserMinusIcon,
|
||||
UserCheckIcon,
|
||||
UserPlusIcon,
|
||||
@@ -287,6 +294,7 @@ export default {
|
||||
name: 'Option',
|
||||
props: ['isHoverDisabled', 'isActive', 'title', 'arrow', 'icon'],
|
||||
components: {
|
||||
Link2Icon,
|
||||
UserMinusIcon,
|
||||
UserCheckIcon,
|
||||
UserPlusIcon,
|
||||
|
||||
@@ -2,6 +2,7 @@
|
||||
<div class="flex items-center justify-between px-6 pt-6 pb-6">
|
||||
<div class="flex items-center">
|
||||
<div class="mr-3">
|
||||
<link2-icon v-if="icon === 'remote-upload'" size="18" class="vue-feather text-theme" />
|
||||
<upload-cloud-icon v-if="icon === 'upload'" size="18" class="vue-feather text-theme" />
|
||||
<corner-down-right-icon v-if="icon === 'move'" size="18" class="vue-feather text-theme" />
|
||||
<share-icon v-if="icon === 'share'" size="18" class="vue-feather text-theme" />
|
||||
@@ -25,6 +26,7 @@
|
||||
|
||||
<script>
|
||||
import {
|
||||
Link2Icon,
|
||||
BellIcon,
|
||||
UploadCloudIcon,
|
||||
CreditCardIcon,
|
||||
@@ -43,6 +45,7 @@ export default {
|
||||
name: 'PopupHeader',
|
||||
props: ['title', 'icon'],
|
||||
components: {
|
||||
Link2Icon,
|
||||
BellIcon,
|
||||
UploadCloudIcon,
|
||||
CornerDownRightIcon,
|
||||
|
||||
122
resources/js/components/RemoteUpload/RemoteUploadPopup.vue
Normal file
122
resources/js/components/RemoteUpload/RemoteUploadPopup.vue
Normal file
@@ -0,0 +1,122 @@
|
||||
<template>
|
||||
<PopupWrapper name="remote-upload">
|
||||
<PopupHeader :title="$t('upload_files_remotely')" icon="remote-upload" />
|
||||
|
||||
<PopupContent>
|
||||
<ValidationObserver @submit.prevent ref="createForm" v-slot="{ invalid }" tag="form">
|
||||
<ValidationProvider tag="div" mode="passive" name="Remote Links" rules="required" v-slot="{ errors }">
|
||||
<AppInputText
|
||||
:title="$t('remote_links')"
|
||||
:description="$t('remote_links_help')"
|
||||
:error="errors[0]"
|
||||
:is-last="true"
|
||||
>
|
||||
<textarea
|
||||
v-model="links"
|
||||
class="focus-border-theme input-dark whitespace-nowrap"
|
||||
rows="6"
|
||||
:placeholder="$t('paste_remote_links_here')"
|
||||
:class="{ '!border-rose-600': errors[0] }"
|
||||
ref="textarea"
|
||||
>
|
||||
</textarea>
|
||||
</AppInputText>
|
||||
</ValidationProvider>
|
||||
</ValidationObserver>
|
||||
</PopupContent>
|
||||
|
||||
<PopupActions>
|
||||
<ButtonBase class="w-full" @click.native="$closePopup()" button-style="secondary">
|
||||
{{ $t('cancel') }}
|
||||
</ButtonBase>
|
||||
<ButtonBase class="w-full" @click.native="upload" button-style="theme" :loading="loading">
|
||||
{{ $t('upload') }}
|
||||
</ButtonBase>
|
||||
</PopupActions>
|
||||
</PopupWrapper>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { ValidationProvider, ValidationObserver } from 'vee-validate/dist/vee-validate.full'
|
||||
import PopupWrapper from '../Popups/Components/PopupWrapper'
|
||||
import PopupContent from '../Popups/Components/PopupContent'
|
||||
import PopupActions from '../Popups/Components/PopupActions'
|
||||
import PopupHeader from '../Popups/Components/PopupHeader'
|
||||
import AppInputText from '../Forms/Layouts/AppInputText'
|
||||
import { required } from 'vee-validate/dist/rules'
|
||||
import ButtonBase from '../UI/Buttons/ButtonBase'
|
||||
import { events } from '../../bus'
|
||||
|
||||
export default {
|
||||
name: 'RemoteUploadPopup',
|
||||
components: {
|
||||
ValidationProvider,
|
||||
ValidationObserver,
|
||||
required,
|
||||
PopupWrapper,
|
||||
PopupContent,
|
||||
PopupHeader,
|
||||
PopupActions,
|
||||
AppInputText,
|
||||
ButtonBase,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
links: undefined,
|
||||
loading: false,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
async upload() {
|
||||
// Validate fields
|
||||
const isValid = await this.$refs.createForm.validate()
|
||||
|
||||
if (!isValid) return
|
||||
|
||||
this.loading = true
|
||||
|
||||
let route = this.$store.getters.sharedDetail
|
||||
? `/api/editor/remote-upload/${this.$router.currentRoute.params.token}`
|
||||
: '/api/remote-upload'
|
||||
|
||||
let parentId = this.$store.getters.currentFolder
|
||||
? this.$store.getters.currentFolder.data.id
|
||||
: undefined
|
||||
|
||||
axios
|
||||
.post(route, {
|
||||
url: this.links.split(/\r?\n/),
|
||||
parent_id: parentId,
|
||||
})
|
||||
.then(() => {
|
||||
events.$emit('toaster', {
|
||||
type: 'success',
|
||||
message: this.$t('remote_download_submitted'),
|
||||
})
|
||||
|
||||
events.$emit('popup:close')
|
||||
})
|
||||
.catch(() => {
|
||||
events.$emit('toaster', {
|
||||
type: 'danger',
|
||||
message: this.$t('popup_error.title'),
|
||||
})
|
||||
})
|
||||
.finally(() => {
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
events.$on('popup:open', (args) => {
|
||||
if (args.name !== 'remote-upload') return
|
||||
|
||||
this.links = undefined
|
||||
|
||||
this.$nextTick(() => {
|
||||
setTimeout(() => this.$refs.textarea.focus(), 100)
|
||||
})
|
||||
})
|
||||
},
|
||||
}
|
||||
</script>
|
||||
@@ -139,6 +139,11 @@
|
||||
size="18"
|
||||
class="vue-feather text-theme"
|
||||
/>
|
||||
<link2-icon
|
||||
v-if="result.action.value === 'remote-upload'"
|
||||
size="18"
|
||||
class="vue-feather text-theme"
|
||||
/>
|
||||
<upload-cloud-icon
|
||||
v-if="result.action.value === 'RecentUploads'"
|
||||
size="18"
|
||||
@@ -309,6 +314,7 @@ import KeyboardHints from './Components/KeyboardHints'
|
||||
import axios from 'axios'
|
||||
import { debounce } from 'lodash'
|
||||
import {
|
||||
Link2Icon,
|
||||
FolderPlusIcon,
|
||||
SmileIcon,
|
||||
BoxIcon,
|
||||
@@ -340,6 +346,7 @@ import { mapGetters } from 'vuex'
|
||||
export default {
|
||||
name: 'Spotlight',
|
||||
components: {
|
||||
Link2Icon,
|
||||
FolderPlusIcon,
|
||||
SmileIcon,
|
||||
KeyboardHints,
|
||||
@@ -598,6 +605,13 @@ export default {
|
||||
value: 'create-file-request',
|
||||
},
|
||||
},
|
||||
{
|
||||
title: this.$t('remote_upload'),
|
||||
action: {
|
||||
type: 'function',
|
||||
value: 'remote-upload',
|
||||
},
|
||||
},
|
||||
]
|
||||
|
||||
let functionList = [
|
||||
@@ -813,6 +827,10 @@ export default {
|
||||
if (arg.action.value === 'create-file-request') {
|
||||
this.$createFileRequest()
|
||||
}
|
||||
|
||||
if (arg.action.value === 'remote-upload') {
|
||||
this.$openRemoteUploadPopup()
|
||||
}
|
||||
}
|
||||
|
||||
this.exitSpotlight()
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div
|
||||
v-if="toasters.length || notifications.length"
|
||||
class="fixed bottom-4 right-4 left-4 z-50 sm:w-[360px] sm:left-auto lg:bottom-8 lg:right-8"
|
||||
class="fixed bottom-4 right-4 left-4 z-[55] sm:w-[360px] sm:left-auto lg:bottom-8 lg:right-8"
|
||||
>
|
||||
<ToasterWrapper
|
||||
v-for="notification in notifications"
|
||||
|
||||
4
resources/js/helpers/functionHelpers.js
vendored
4
resources/js/helpers/functionHelpers.js
vendored
@@ -569,6 +569,10 @@ const FunctionHelpers = {
|
||||
Vue.prototype.$changeSubscriptionOptions = function () {
|
||||
events.$emit('popup:open', { name: 'change-plan-subscription' })
|
||||
}
|
||||
|
||||
Vue.prototype.$openRemoteUploadPopup = function () {
|
||||
events.$emit('popup:open', {name: 'remote-upload'})
|
||||
}
|
||||
},
|
||||
}
|
||||
|
||||
|
||||
@@ -46,6 +46,11 @@
|
||||
/>
|
||||
</OptionGroup>
|
||||
<OptionGroup :title="$t('others')">
|
||||
<Option
|
||||
@click.stop.native="$openRemoteUploadPopup"
|
||||
:title="$t('remote_upload')"
|
||||
icon="remote-upload"
|
||||
/>
|
||||
<Option
|
||||
@click.stop.native="$createTeamFolder"
|
||||
:title="$t('create_team_folder')"
|
||||
|
||||
@@ -37,11 +37,8 @@
|
||||
</MobileContextMenu>
|
||||
|
||||
<MobileCreateMenu>
|
||||
<OptionGroup :title="$t('upload')">
|
||||
<OptionGroup :title="$t('frequently_used')">
|
||||
<OptionUpload :title="$t('upload_files')" type="file" :is-hover-disabled="true" />
|
||||
<OptionUpload :title="$t('upload_folder')" type="folder" :is-hover-disabled="true" />
|
||||
</OptionGroup>
|
||||
<OptionGroup :title="$t('create')">
|
||||
<Option
|
||||
@click.stop.native="createFolder"
|
||||
:title="$t('create_folder')"
|
||||
@@ -49,6 +46,15 @@
|
||||
:is-hover-disabled="true"
|
||||
/>
|
||||
</OptionGroup>
|
||||
<OptionGroup :title="$t('others')">
|
||||
<OptionUpload :title="$t('upload_folder')" type="folder" :is-hover-disabled="true" />
|
||||
<Option
|
||||
@click.stop.native="$openRemoteUploadPopup"
|
||||
:title="$t('remote_upload')"
|
||||
icon="remote-upload"
|
||||
:is-hover-disabled="true"
|
||||
/>
|
||||
</OptionGroup>
|
||||
</MobileCreateMenu>
|
||||
|
||||
<MobileMultiSelectToolbar>
|
||||
|
||||
@@ -21,6 +21,14 @@
|
||||
:is-hover-disabled="true"
|
||||
/>
|
||||
</OptionGroup>
|
||||
<OptionGroup :title="$t('others')">
|
||||
<Option
|
||||
@click.stop.native="$openRemoteUploadPopup"
|
||||
:title="$t('remote_upload')"
|
||||
icon="remote-upload"
|
||||
:class="{'is-inactive': isTeamFolderHomepage}"
|
||||
/>
|
||||
</OptionGroup>
|
||||
</MobileCreateMenu>
|
||||
|
||||
<MobileTeamContextMenu>
|
||||
|
||||
@@ -43,6 +43,12 @@
|
||||
/>
|
||||
</OptionGroup>
|
||||
<OptionGroup :title="$t('others')">
|
||||
<Option
|
||||
@click.stop.native="$openRemoteUploadPopup"
|
||||
:title="$t('remote_upload')"
|
||||
icon="remote-upload"
|
||||
:class="{'is-inactive': isTeamFolderHomepage}"
|
||||
/>
|
||||
<Option
|
||||
@click.stop.native="$createTeamFolder"
|
||||
:title="$t('create_team_folder')"
|
||||
|
||||
@@ -16,6 +16,7 @@
|
||||
|
||||
<CreateUploadRequestPopup />
|
||||
<NotificationsPopup />
|
||||
<RemoteUploadPopup />
|
||||
<CreateFolderPopup />
|
||||
<RenameItemPopup />
|
||||
<MoveItemPopup />
|
||||
@@ -79,10 +80,12 @@ import { events } from '../bus'
|
||||
import { mapGetters } from 'vuex'
|
||||
import CreateUploadRequestPopup from "../components/UploadRequest/CreateUploadRequestPopup";
|
||||
import NotificationsPopup from "../components/Notifications/NotificationsPopup";
|
||||
import RemoteUploadPopup from "../components/RemoteUpload/RemoteUploadPopup";
|
||||
|
||||
export default {
|
||||
name: 'Platform',
|
||||
components: {
|
||||
RemoteUploadPopup,
|
||||
NotificationsPopup,
|
||||
CreateUploadRequestPopup,
|
||||
CreateTeamFolderPopup,
|
||||
|
||||
@@ -7,6 +7,7 @@
|
||||
<!--Popups-->
|
||||
<ProcessingPopup />
|
||||
|
||||
<RemoteUploadPopup />
|
||||
<CreateFolderPopup />
|
||||
<RenameItemPopup />
|
||||
<MoveItemPopup />
|
||||
@@ -61,12 +62,13 @@ import DragUI from '../components/UI/Others/DragUI'
|
||||
import Alert from '../components/Popups/Alert'
|
||||
import { mapGetters } from 'vuex'
|
||||
import { events } from '../bus'
|
||||
import router from '../router'
|
||||
import DesktopSharepageToolbar from '../components/Layout/Toolbars/DesktopSharepageToolbar'
|
||||
import RemoteUploadPopup from "../components/RemoteUpload/RemoteUploadPopup";
|
||||
|
||||
export default {
|
||||
name: 'Shared',
|
||||
components: {
|
||||
RemoteUploadPopup,
|
||||
DesktopSharepageToolbar,
|
||||
MobileToolbar,
|
||||
InfoSidebar,
|
||||
|
||||
Reference in New Issue
Block a user