mirror of
https://github.com/VueFileManager/vuefilemanager.git
synced 2026-04-05 18:23:48 +00:00
- Mobile menu components refactoring
- Components name renaming
This commit is contained in:
Peter Papp
@@ -1,77 +1,211 @@
|
||||
{
|
||||
"/vendors~chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~2fac28cc.js": "/vendors~chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~2fac28cc.js?id=d8dac775684711abc6e2",
|
||||
"/chunks/admin-account~chunks/app-setup~chunks/billings-detail~chunks/create-new-password~chunks/datab~5f8db287.js": "/chunks/admin-account~chunks/app-setup~chunks/billings-detail~chunks/create-new-password~chunks/datab~5f8db287.js?id=d85e8bc2bb4fc4b9cd7e",
|
||||
"/chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chunks/app-others~chunks~8cc7d96f.js": "/chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chunks/app-others~chunks~8cc7d96f.js?id=7e636c58637634393ebd",
|
||||
"/chunks/files~chunks/platform~chunks/shared~chunks/shared-files~chunks/shared/file-browser.js": "/chunks/files~chunks/platform~chunks/shared~chunks/shared-files~chunks/shared/file-browser.js?id=27dc0a5d34766399afb9",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared/file-browser~chunks/shared/single-file.js": "/chunks/files~chunks/shared-files~chunks/shared/file-browser~chunks/shared/single-file.js?id=d55509cf07031fb3460f",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared/file-browser.js": "/chunks/files~chunks/shared-files~chunks/shared/file-browser.js?id=d3728bf80112000ff2ea",
|
||||
"/chunks/not-found.js": "/chunks/not-found.js?id=05b1ba4bacdc129f2b9d",
|
||||
"/chunks/platform~chunks/shared.js": "/chunks/platform~chunks/shared.js?id=a72c50e0fd5289000d7c",
|
||||
"/chunks/profile~chunks/settings-password.js": "/chunks/profile~chunks/settings-password.js?id=665543709ee6cfd0ac32",
|
||||
"/vendors~chunks/platform~chunks/shared.js": "/vendors~chunks/platform~chunks/shared.js?id=0e6d6979c32214f01a99",
|
||||
"/js/main.js": "/js/main.js?id=9ff46b8434eebed4b593",
|
||||
"/css/app.css": "/css/app.css?id=5ef36155a311dd4539c1",
|
||||
"/chunks/admin.js": "/chunks/admin.js?id=ad2fdd7add13510a6869",
|
||||
"/chunks/admin-account.js": "/chunks/admin-account.js?id=74832d1136b70db80e68",
|
||||
"/chunks/app-appearance.js": "/chunks/app-appearance.js?id=58baefeb9cb14a9638de",
|
||||
"/chunks/app-billings.js": "/chunks/app-billings.js?id=56fa0e764a7e34d33e26",
|
||||
"/chunks/app-email.js": "/chunks/app-email.js?id=cd9d6ed9e9d015da9d91",
|
||||
"/chunks/app-index.js": "/chunks/app-index.js?id=cb3498e406901deb0930",
|
||||
"/chunks/app-language.js": "/chunks/app-language.js?id=82471b889e0bac03d269",
|
||||
"/chunks/app-others.js": "/chunks/app-others.js?id=034793903665db47a0bc",
|
||||
"/chunks/app-payments.js": "/chunks/app-payments.js?id=f034a7f9f588fd0665f5",
|
||||
"/chunks/app-settings.js": "/chunks/app-settings.js?id=adf82ebe3b4afab7f145",
|
||||
"/chunks/app-setup.js": "/chunks/app-setup.js?id=61eaa35b1807d26ed3a0",
|
||||
"/chunks/billings-detail.js": "/chunks/billings-detail.js?id=c7bcc29436bb9821e65d",
|
||||
"/chunks/contact-us.js": "/chunks/contact-us.js?id=e3c45469a83f82938eef",
|
||||
"/chunks/create-new-password.js": "/chunks/create-new-password.js?id=f67f77d78c62e27feb8d",
|
||||
"/chunks/dashboard.js": "/chunks/dashboard.js?id=ec22cf79f03a7e5b2704",
|
||||
"/chunks/database.js": "/chunks/database.js?id=4c4925b5e68f9da983db",
|
||||
"/chunks/dynamic-page.js": "/chunks/dynamic-page.js?id=6a4f59eb5a9b27c9bcea",
|
||||
"/chunks/environment-setup.js": "/chunks/environment-setup.js?id=5081b5846c5446ed6801",
|
||||
"/chunks/files.js": "/chunks/files.js?id=f1a6299d0a8e7a23868c",
|
||||
"/chunks/forgotten-password.js": "/chunks/forgotten-password.js?id=5760d4df726d6fb823f0",
|
||||
"/chunks/homepage.js": "/chunks/homepage.js?id=2f62cb7c5a4f4cc81cd5",
|
||||
"/chunks/installation-disclaimer.js": "/chunks/installation-disclaimer.js?id=7375c45f9ccd94429286",
|
||||
"/chunks/invoices.js": "/chunks/invoices.js?id=49b9d6c93e2eaf172598",
|
||||
"/chunks/page-edit.js": "/chunks/page-edit.js?id=1c3a7c3a0b35ebd4c9ef",
|
||||
"/chunks/pages.js": "/chunks/pages.js?id=4f1a076b098b090bc0a5",
|
||||
"/chunks/plan.js": "/chunks/plan.js?id=c6eb3b2ce2ced3b5fddb",
|
||||
"/chunks/plan-create.js": "/chunks/plan-create.js?id=def653848a1b8d9271c7",
|
||||
"/chunks/plan-delete.js": "/chunks/plan-delete.js?id=9f42b1eb10d062c5b57c",
|
||||
"/chunks/plan-settings.js": "/chunks/plan-settings.js?id=f35db87931ff3ea8d417",
|
||||
"/chunks/plan-subscribers.js": "/chunks/plan-subscribers.js?id=1147d630ed7ab79581eb",
|
||||
"/chunks/plans.js": "/chunks/plans.js?id=f954b7046f69ab147ab0",
|
||||
"/chunks/platform.js": "/chunks/platform.js?id=fa5822cff1f4e16bf243",
|
||||
"/chunks/profile.js": "/chunks/profile.js?id=eb42c69ad64ffb1f1d9c",
|
||||
"/chunks/purchase-code.js": "/chunks/purchase-code.js?id=f49c482d232b2036dd1d",
|
||||
"/chunks/settings.js": "/chunks/settings.js?id=ba49333bd61079e1c647",
|
||||
"/chunks/settings-create-payment-methods.js": "/chunks/settings-create-payment-methods.js?id=42594b68cecda23f3092",
|
||||
"/chunks/settings-invoices.js": "/chunks/settings-invoices.js?id=ce22879a0d39da904ea0",
|
||||
"/chunks/settings-password.js": "/chunks/settings-password.js?id=af99ddcdc5baac89f34b",
|
||||
"/chunks/settings-payment-methods.js": "/chunks/settings-payment-methods.js?id=055208393eac740b539b",
|
||||
"/chunks/settings-storage.js": "/chunks/settings-storage.js?id=ffadbefe2d239fe2bd64",
|
||||
"/chunks/settings-subscription.js": "/chunks/settings-subscription.js?id=9b58101f1a0cb73b5d4c",
|
||||
"/chunks/setup-wizard.js": "/chunks/setup-wizard.js?id=d60972a2216523642850",
|
||||
"/chunks/shared.js": "/chunks/shared.js?id=070dcf971c21f4f1d30b",
|
||||
"/chunks/shared-files.js": "/chunks/shared-files.js?id=c473caf528377b2bacf6",
|
||||
"/chunks/shared/authenticate.js": "/chunks/shared/authenticate.js?id=c679dd7737bbad19700a",
|
||||
"/chunks/shared/file-browser.js": "/chunks/shared/file-browser.js?id=4733ba7889f5b31760e2",
|
||||
"/chunks/shared/single-file.js": "/chunks/shared/single-file.js?id=d57e261a133924a8857f",
|
||||
"/chunks/sign-in.js": "/chunks/sign-in.js?id=6a92a83db12f0d425dff",
|
||||
"/chunks/sign-up.js": "/chunks/sign-up.js?id=d9a106720f1b216845ee",
|
||||
"/chunks/stripe-credentials.js": "/chunks/stripe-credentials.js?id=4515bb31ce9a54898b27",
|
||||
"/chunks/subscription-plans.js": "/chunks/subscription-plans.js?id=ec88acaf8d126f646628",
|
||||
"/chunks/subscription-service.js": "/chunks/subscription-service.js?id=59c036318ba1785a7f5a",
|
||||
"/chunks/upgrade-billing.js": "/chunks/upgrade-billing.js?id=cf092c2a6c1816855f83",
|
||||
"/chunks/upgrade-plan.js": "/chunks/upgrade-plan.js?id=81bf57d7eb737eca6071",
|
||||
"/chunks/user.js": "/chunks/user.js?id=68e688174b27864a8f1f",
|
||||
"/chunks/user-create.js": "/chunks/user-create.js?id=d99c25d654617ca95af7",
|
||||
"/chunks/user-delete.js": "/chunks/user-delete.js?id=4fd6e3a2a671370b695a",
|
||||
"/chunks/user-detail.js": "/chunks/user-detail.js?id=bfe7fdb83731e9278ec8",
|
||||
"/chunks/user-invoices.js": "/chunks/user-invoices.js?id=d48ebd039b9651b667d0",
|
||||
"/chunks/user-password.js": "/chunks/user-password.js?id=9d1c9cdac5b2d51fb905",
|
||||
"/chunks/user-storage.js": "/chunks/user-storage.js?id=a665c14aca1c9d9b2dbd",
|
||||
"/chunks/user-subscription.js": "/chunks/user-subscription.js?id=5d8e905cd39d44f54b1e",
|
||||
"/chunks/users.js": "/chunks/users.js?id=bfe65b425d1c218a62ea"
|
||||
"/js/main.js": "/js/main.js",
|
||||
"/css/app.css": "/css/app.css",
|
||||
"/chunks/admin.js": "/chunks/admin.js?id=7bb0da90be946f1f239f",
|
||||
"/chunks/admin-account.js": "/chunks/admin-account.js?id=5ad2162bf1689c20bccb",
|
||||
"/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~c7a13fb0.js": "/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~c7a13fb0.js?id=d21b5946c88a87e9099d",
|
||||
"/chunks/admin-account~chunks/app-setup~chunks/billings-detail~chunks/create-new-password~chunks/datab~5f8db287.js": "/chunks/admin-account~chunks/app-setup~chunks/billings-detail~chunks/create-new-password~chunks/datab~5f8db287.js?id=07a5f340da451bf2ae5d",
|
||||
"/chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/~eeab5771.js": "/chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/~eeab5771.js?id=319ba6f55c8fb5dca6ac",
|
||||
"/chunks/admin~chunks/files~chunks/settings~chunks/shared-files~chunks/shared/file-browser.js": "/chunks/admin~chunks/files~chunks/settings~chunks/shared-files~chunks/shared/file-browser.js?id=6f6e038b64009a752638",
|
||||
"/chunks/admin~chunks/platform.js": "/chunks/admin~chunks/platform.js?id=e8c676f0b1add89a391f",
|
||||
"/chunks/admin~chunks/platform~chunks/shared.js": "/chunks/admin~chunks/platform~chunks/shared.js?id=f34c3f924e632de0bc6e",
|
||||
"/chunks/app-appearance.js": "/chunks/app-appearance.js?id=f779d10bf0f57bf3b08c",
|
||||
"/chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chunks/app-others~chunks~605f4c49.js": "/chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chunks/app-others~chunks~605f4c49.js?id=075ff381293e1a20d167",
|
||||
"/chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chunks/app-others~chunks~8cc7d96f.js": "/chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chunks/app-others~chunks~8cc7d96f.js?id=5f27527c258dada4aeb9",
|
||||
"/chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chunks/app-others~chunks~b9e5655a.js": "/chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chunks/app-others~chunks~b9e5655a.js?id=b6c9565875974d8c350c",
|
||||
"/chunks/app-billings.js": "/chunks/app-billings.js?id=22ad87a460950d32721a",
|
||||
"/chunks/app-email.js": "/chunks/app-email.js?id=db0423ca77d7b92a1d52",
|
||||
"/chunks/app-index.js": "/chunks/app-index.js?id=e3e2403810a4f1fd94e9",
|
||||
"/chunks/app-language.js": "/chunks/app-language.js?id=3e5407ae9576a0edc760",
|
||||
"/chunks/app-language~chunks/dashboard~chunks/files~chunks/invoices~chunks/pages~chunks/plans~chunks/s~38c276fc.js": "/chunks/app-language~chunks/dashboard~chunks/files~chunks/invoices~chunks/pages~chunks/plans~chunks/s~38c276fc.js?id=5e8dfc5ac3b67b3009f8",
|
||||
"/chunks/app-others.js": "/chunks/app-others.js?id=73a4e8a13652e2b7ed83",
|
||||
"/chunks/app-payments.js": "/chunks/app-payments.js?id=4b8627cfd6546bd56caa",
|
||||
"/chunks/app-settings.js": "/chunks/app-settings.js?id=92003b708b3a043078d3",
|
||||
"/chunks/app-settings~chunks/dashboard~chunks/invoices~chunks/page-edit~chunks/pages~chunks/plan~chunk~8a0e1d25.js": "/chunks/app-settings~chunks/dashboard~chunks/invoices~chunks/page-edit~chunks/pages~chunks/plan~chunk~8a0e1d25.js?id=c6c12c5a2f5ee26888a3",
|
||||
"/chunks/app-setup.js": "/chunks/app-setup.js?id=a0ef7ae0d22e995093d2",
|
||||
"/chunks/billings-detail.js": "/chunks/billings-detail.js?id=d0da577903083a891b00",
|
||||
"/chunks/contact-us.js": "/chunks/contact-us.js?id=1702da1aa1818e97dda1",
|
||||
"/chunks/contact-us~chunks/dynamic-page~chunks/homepage.js": "/chunks/contact-us~chunks/dynamic-page~chunks/homepage.js?id=7abdbac43596d1deb664",
|
||||
"/chunks/create-new-password.js": "/chunks/create-new-password.js?id=ed92e7337efbd2afaa52",
|
||||
"/chunks/dashboard.js": "/chunks/dashboard.js?id=a9a199caa6709ebb48f2",
|
||||
"/chunks/dashboard~chunks/invoices~chunks/pages~chunks/plan-subscribers~chunks/plans~chunks/settings-i~0e2a0654.js": "/chunks/dashboard~chunks/invoices~chunks/pages~chunks/plan-subscribers~chunks/plans~chunks/settings-i~0e2a0654.js?id=ef163f8da51054f89d5c",
|
||||
"/chunks/database.js": "/chunks/database.js?id=7cf91421350f68985889",
|
||||
"/chunks/dynamic-page.js": "/chunks/dynamic-page.js?id=ffff5333522a1116d856",
|
||||
"/chunks/environment-setup.js": "/chunks/environment-setup.js?id=de64a0ce7c737b106d96",
|
||||
"/chunks/files.js": "/chunks/files.js?id=1731c1b3a8bfbbeaa301",
|
||||
"/chunks/files~chunks/platform~chunks/shared-files~chunks/shared/file-browser.js": "/chunks/files~chunks/platform~chunks/shared-files~chunks/shared/file-browser.js?id=a930cc4a4f5af02460bb",
|
||||
"/chunks/files~chunks/platform~chunks/shared~chunks/shared-files~chunks/shared/file-browser.js": "/chunks/files~chunks/platform~chunks/shared~chunks/shared-files~chunks/shared/file-browser.js?id=dcd82a6b80a31f229b5a",
|
||||
"/chunks/files~chunks/platform~chunks/shared~chunks/shared-files~chunks/shared/file-browser~chunks/sha~8510f6c9.js": "/chunks/files~chunks/platform~chunks/shared~chunks/shared-files~chunks/shared/file-browser~chunks/sha~8510f6c9.js?id=ac54ac828e9a8667410f",
|
||||
"/chunks/files~chunks/settings-subscription~chunks/shared-files~chunks/shared/file-browser~chunks/user~9058a49f.js": "/chunks/files~chunks/settings-subscription~chunks/shared-files~chunks/shared/file-browser~chunks/user~9058a49f.js?id=a0dd218c154e83af8dee",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared/file-browser.js": "/chunks/files~chunks/shared-files~chunks/shared/file-browser.js?id=c5009a3c2463bfb02c36",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared/file-browser~chunks/shared/single-file.js": "/chunks/files~chunks/shared-files~chunks/shared/file-browser~chunks/shared/single-file.js?id=7f84c4b09fcf5b890775",
|
||||
"/chunks/files~chunks/shared/file-browser.js": "/chunks/files~chunks/shared/file-browser.js?id=ff8043fe2c43e13a74e2",
|
||||
"/chunks/forgotten-password.js": "/chunks/forgotten-password.js?id=daaffc43387587cf4b57",
|
||||
"/chunks/homepage.js": "/chunks/homepage.js?id=4395ca4eb2abdbe487c0",
|
||||
"/chunks/installation-disclaimer.js": "/chunks/installation-disclaimer.js?id=6b17b649280761c01c5a",
|
||||
"/chunks/invoices.js": "/chunks/invoices.js?id=49e5e88b85d0bcfa04c2",
|
||||
"/chunks/not-found.js": "/chunks/not-found.js?id=e0eb924527b6f9b20e3f",
|
||||
"/chunks/page-edit.js": "/chunks/page-edit.js?id=23bb8bddee499a6b1061",
|
||||
"/chunks/pages.js": "/chunks/pages.js?id=513b48ab860bfe24bed9",
|
||||
"/chunks/plan.js": "/chunks/plan.js?id=980ecbb2c550ecc08b6d",
|
||||
"/chunks/plan-create.js": "/chunks/plan-create.js?id=3392652808dff5264c28",
|
||||
"/chunks/plan-delete.js": "/chunks/plan-delete.js?id=bb0d06be8e675c88bd0f",
|
||||
"/chunks/plan-settings.js": "/chunks/plan-settings.js?id=7a6acca368d11e2a4815",
|
||||
"/chunks/plan-subscribers.js": "/chunks/plan-subscribers.js?id=260d274a422706d71809",
|
||||
"/chunks/plans.js": "/chunks/plans.js?id=6d14bd88ebd6cf82fdc6",
|
||||
"/chunks/platform.js": "/chunks/platform.js?id=97c929acc6aa40ee32cc",
|
||||
"/chunks/platform~chunks/shared.js": "/chunks/platform~chunks/shared.js?id=ffbda8c58183915cb55a",
|
||||
"/chunks/profile.js": "/chunks/profile.js?id=bdc92d734851c0d09b8c",
|
||||
"/chunks/profile~chunks/settings-password.js": "/chunks/profile~chunks/settings-password.js?id=a5e7ed872d1430177922",
|
||||
"/chunks/purchase-code.js": "/chunks/purchase-code.js?id=b35e751cdc1946a4fb60",
|
||||
"/chunks/settings.js": "/chunks/settings.js?id=1a5e37e67eb534cbda1b",
|
||||
"/chunks/settings-create-payment-methods.js": "/chunks/settings-create-payment-methods.js?id=17428f129a14c15323e5",
|
||||
"/chunks/settings-invoices.js": "/chunks/settings-invoices.js?id=9bf3504a262af35fa997",
|
||||
"/chunks/settings-password.js": "/chunks/settings-password.js?id=dd27209e827e96b49917",
|
||||
"/chunks/settings-payment-methods.js": "/chunks/settings-payment-methods.js?id=e5437f00d24224997f86",
|
||||
"/chunks/settings-storage.js": "/chunks/settings-storage.js?id=aa34712346ed9a2fc12d",
|
||||
"/chunks/settings-subscription.js": "/chunks/settings-subscription.js?id=1bffa4ae7d545af08355",
|
||||
"/chunks/setup-wizard.js": "/chunks/setup-wizard.js?id=c6b88005b133268ed88f",
|
||||
"/chunks/shared.js": "/chunks/shared.js?id=68165b2df75fd836ec22",
|
||||
"/chunks/shared-files.js": "/chunks/shared-files.js?id=e8961791d642db47b77e",
|
||||
"/chunks/shared/authenticate.js": "/chunks/shared/authenticate.js?id=aab96d6900885ccb90ed",
|
||||
"/chunks/shared/file-browser.js": "/chunks/shared/file-browser.js?id=b2fbe95c0ed7074377ce",
|
||||
"/chunks/shared/single-file.js": "/chunks/shared/single-file.js?id=e11f79244629896c95db",
|
||||
"/chunks/sign-in.js": "/chunks/sign-in.js?id=f8ed9524d42eac1b22cc",
|
||||
"/chunks/sign-up.js": "/chunks/sign-up.js?id=f82eac926eccda791f9e",
|
||||
"/chunks/stripe-credentials.js": "/chunks/stripe-credentials.js?id=6cd6006913355a32f2dc",
|
||||
"/chunks/subscription-plans.js": "/chunks/subscription-plans.js?id=0da9ece2d7d853f2bb27",
|
||||
"/chunks/subscription-service.js": "/chunks/subscription-service.js?id=a09dc140a3914fb64a1a",
|
||||
"/chunks/upgrade-billing.js": "/chunks/upgrade-billing.js?id=b49a1f662c7dadee59ac",
|
||||
"/chunks/upgrade-billing~chunks/upgrade-plan.js": "/chunks/upgrade-billing~chunks/upgrade-plan.js?id=66b9183a2e51801b81a5",
|
||||
"/chunks/upgrade-plan.js": "/chunks/upgrade-plan.js?id=05a7779a4d6bb2dda84e",
|
||||
"/chunks/user.js": "/chunks/user.js?id=c72518ac51fba4af725d",
|
||||
"/chunks/user-create.js": "/chunks/user-create.js?id=ccbd9c25bb268bb084c8",
|
||||
"/chunks/user-delete.js": "/chunks/user-delete.js?id=4a7ec6133d2e735229aa",
|
||||
"/chunks/user-detail.js": "/chunks/user-detail.js?id=afa8a3f0f5972909e62a",
|
||||
"/chunks/user-invoices.js": "/chunks/user-invoices.js?id=5700c76f6041d7b0ed2d",
|
||||
"/chunks/user-password.js": "/chunks/user-password.js?id=de180838609bb88ffe90",
|
||||
"/chunks/user-storage.js": "/chunks/user-storage.js?id=dc33def6d2b4390869b5",
|
||||
"/chunks/user-subscription.js": "/chunks/user-subscription.js?id=c6ec1b7215530cfdbceb",
|
||||
"/chunks/users.js": "/chunks/users.js?id=a6a20d23eaef40e24740",
|
||||
"/vendors~chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~2fac28cc.js": "/vendors~chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~2fac28cc.js?id=5007f400f6b506ab23f4",
|
||||
"/vendors~chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~d5e36d91.js": "/vendors~chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~d5e36d91.js?id=2b11dd8f37c3c2421f2f",
|
||||
"/vendors~chunks/files~chunks/platform~chunks/shared~chunks/shared-files~chunks/shared/file-browser~ch~52c14f2e.js": "/vendors~chunks/files~chunks/platform~chunks/shared~chunks/shared-files~chunks/shared/file-browser~ch~52c14f2e.js?id=8f589cb0d5e028068d09",
|
||||
"/chunks/platform~chunks/shared.dd0933f81c0c06787f9f.hot-update.js": "/chunks/platform~chunks/shared.dd0933f81c0c06787f9f.hot-update.js",
|
||||
"/chunks/platform.58d67c82033c1297eeba.hot-update.js": "/chunks/platform.58d67c82033c1297eeba.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.58d67c82033c1297eeba.hot-update.js": "/chunks/platform~chunks/shared.58d67c82033c1297eeba.hot-update.js",
|
||||
"/chunks/shared.58d67c82033c1297eeba.hot-update.js": "/chunks/shared.58d67c82033c1297eeba.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.9cd207a6d4f0cfb7a143.hot-update.js": "/chunks/platform~chunks/shared.9cd207a6d4f0cfb7a143.hot-update.js",
|
||||
"/chunks/platform.e438fc1e539608f3d09b.hot-update.js": "/chunks/platform.e438fc1e539608f3d09b.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.e438fc1e539608f3d09b.hot-update.js": "/chunks/platform~chunks/shared.e438fc1e539608f3d09b.hot-update.js",
|
||||
"/chunks/shared.e438fc1e539608f3d09b.hot-update.js": "/chunks/shared.e438fc1e539608f3d09b.hot-update.js",
|
||||
"/chunks/platform.8be87d602a93a72b44b4.hot-update.js": "/chunks/platform.8be87d602a93a72b44b4.hot-update.js",
|
||||
"/js/main.686d37ebb385dca2f5d6.hot-update.js": "/js/main.686d37ebb385dca2f5d6.hot-update.js",
|
||||
"/chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/~96958efc.js": "/chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/~96958efc.js?id=dd4d11bf1f9b19df4768",
|
||||
"/chunks/platform.686d37ebb385dca2f5d6.hot-update.js": "/chunks/platform.686d37ebb385dca2f5d6.hot-update.js",
|
||||
"/js/main.f1cbcf7fe85514ae5abf.hot-update.js": "/js/main.f1cbcf7fe85514ae5abf.hot-update.js",
|
||||
"/chunks/admin~chunks/platform.f1cbcf7fe85514ae5abf.hot-update.js": "/chunks/admin~chunks/platform.f1cbcf7fe85514ae5abf.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared/file-browser.f1cbcf7fe85514ae5abf.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared/file-browser.f1cbcf7fe85514ae5abf.hot-update.js",
|
||||
"/chunks/platform.f1cbcf7fe85514ae5abf.hot-update.js": "/chunks/platform.f1cbcf7fe85514ae5abf.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.f1cbcf7fe85514ae5abf.hot-update.js": "/chunks/platform~chunks/shared.f1cbcf7fe85514ae5abf.hot-update.js",
|
||||
"/chunks/shared.4ad84f567976f8d3bc21.hot-update.js": "/chunks/shared.4ad84f567976f8d3bc21.hot-update.js",
|
||||
"/chunks/admin.14eb57fa554b61ff8683.hot-update.js": "/chunks/admin.14eb57fa554b61ff8683.hot-update.js",
|
||||
"/chunks/platform.14eb57fa554b61ff8683.hot-update.js": "/chunks/platform.14eb57fa554b61ff8683.hot-update.js",
|
||||
"/chunks/admin.185fd275a1de7ebef3ae.hot-update.js": "/chunks/admin.185fd275a1de7ebef3ae.hot-update.js",
|
||||
"/chunks/admin~chunks/platform.185fd275a1de7ebef3ae.hot-update.js": "/chunks/admin~chunks/platform.185fd275a1de7ebef3ae.hot-update.js",
|
||||
"/chunks/platform.185fd275a1de7ebef3ae.hot-update.js": "/chunks/platform.185fd275a1de7ebef3ae.hot-update.js",
|
||||
"/chunks/platform.09b1061e0780b787489b.hot-update.js": "/chunks/platform.09b1061e0780b787489b.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.09b1061e0780b787489b.hot-update.js": "/chunks/platform~chunks/shared.09b1061e0780b787489b.hot-update.js",
|
||||
"/chunks/shared.09b1061e0780b787489b.hot-update.js": "/chunks/shared.09b1061e0780b787489b.hot-update.js",
|
||||
"/chunks/files~chunks/platform~chunks/shared~chunks/shared-files~chunks/shared/file-browser.1594551a22ec7ca0c57b.hot-update.js": "/chunks/files~chunks/platform~chunks/shared~chunks/shared-files~chunks/shared/file-browser.1594551a22ec7ca0c57b.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.1594551a22ec7ca0c57b.hot-update.js": "/chunks/platform~chunks/shared.1594551a22ec7ca0c57b.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.cd715703115a0afa6430.hot-update.js": "/chunks/platform~chunks/shared.cd715703115a0afa6430.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.06197771d9e750d5d765.hot-update.js": "/chunks/platform~chunks/shared.06197771d9e750d5d765.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.4f3142dd4ed4de8b8630.hot-update.js": "/chunks/platform~chunks/shared.4f3142dd4ed4de8b8630.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.4b13d28cdd9e06c00eb3.hot-update.js": "/chunks/platform~chunks/shared.4b13d28cdd9e06c00eb3.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.c11140130f2464ecebed.hot-update.js": "/chunks/platform~chunks/shared.c11140130f2464ecebed.hot-update.js",
|
||||
"/chunks/files~chunks/platform~chunks/shared~chunks/shared-files~chunks/shared/file-browser.5989062c7a1bd87a2fe1.hot-update.js": "/chunks/files~chunks/platform~chunks/shared~chunks/shared-files~chunks/shared/file-browser.5989062c7a1bd87a2fe1.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.4da7be6c51fb765e3f3a.hot-update.js": "/chunks/platform~chunks/shared.4da7be6c51fb765e3f3a.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.b57812a1c17c084a1dc7.hot-update.js": "/chunks/platform~chunks/shared.b57812a1c17c084a1dc7.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.d1b35477441ba484cd33.hot-update.js": "/chunks/platform~chunks/shared.d1b35477441ba484cd33.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.dd8117e8d03b846e17fd.hot-update.js": "/chunks/platform~chunks/shared.dd8117e8d03b846e17fd.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.a50ebf529b5a7d7becdc.hot-update.js": "/chunks/platform~chunks/shared.a50ebf529b5a7d7becdc.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.81f4b0f5a38c25479500.hot-update.js": "/chunks/platform~chunks/shared.81f4b0f5a38c25479500.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.5b0dff4ac0e0a41d56de.hot-update.js": "/chunks/platform~chunks/shared.5b0dff4ac0e0a41d56de.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.0273af08eacb06edd47f.hot-update.js": "/chunks/platform~chunks/shared.0273af08eacb06edd47f.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.02d8a42b0bae66d417d7.hot-update.js": "/chunks/platform~chunks/shared.02d8a42b0bae66d417d7.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.596c12f22edc607e504b.hot-update.js": "/chunks/platform~chunks/shared.596c12f22edc607e504b.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.a09f163cb817128df7a0.hot-update.js": "/chunks/platform~chunks/shared.a09f163cb817128df7a0.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.f03741c15f42e092ad65.hot-update.js": "/chunks/platform~chunks/shared.f03741c15f42e092ad65.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.ba88ef29b4bfbcb64a08.hot-update.js": "/chunks/platform~chunks/shared.ba88ef29b4bfbcb64a08.hot-update.js",
|
||||
"/js/main.8f64bf335cef67dcb962.hot-update.js": "/js/main.8f64bf335cef67dcb962.hot-update.js",
|
||||
"/js/main.66b9d73658ae67853407.hot-update.js": "/js/main.66b9d73658ae67853407.hot-update.js",
|
||||
"/chunks/admin~chunks/platform.66b9d73658ae67853407.hot-update.js": "/chunks/admin~chunks/platform.66b9d73658ae67853407.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared/file-browser.66b9d73658ae67853407.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared/file-browser.66b9d73658ae67853407.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared/file-browser~chunks/shared/single-file.66b9d73658ae67853407.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared/file-browser~chunks/shared/single-file.66b9d73658ae67853407.hot-update.js",
|
||||
"/chunks/platform.66b9d73658ae67853407.hot-update.js": "/chunks/platform.66b9d73658ae67853407.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.66b9d73658ae67853407.hot-update.js": "/chunks/platform~chunks/shared.66b9d73658ae67853407.hot-update.js",
|
||||
"/chunks/shared.66b9d73658ae67853407.hot-update.js": "/chunks/shared.66b9d73658ae67853407.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.6d4d89cd3ebd8a5948b6.hot-update.js": "/chunks/platform~chunks/shared.6d4d89cd3ebd8a5948b6.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.e349ad386ff7244cf4d4.hot-update.js": "/chunks/platform~chunks/shared.e349ad386ff7244cf4d4.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.5dc831112b25ed5bd5c9.hot-update.js": "/chunks/platform~chunks/shared.5dc831112b25ed5bd5c9.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.e408d01d3d583eafbc27.hot-update.js": "/chunks/platform~chunks/shared.e408d01d3d583eafbc27.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.01a1aea19d1c52ffd54d.hot-update.js": "/chunks/platform~chunks/shared.01a1aea19d1c52ffd54d.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.bc5906eb02278190f17d.hot-update.js": "/chunks/platform~chunks/shared.bc5906eb02278190f17d.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.bcf97d153907d502e651.hot-update.js": "/chunks/platform~chunks/shared.bcf97d153907d502e651.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.2498249eb28d6ea7c7de.hot-update.js": "/chunks/platform~chunks/shared.2498249eb28d6ea7c7de.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.9cb7197e53af0311d657.hot-update.js": "/chunks/platform~chunks/shared.9cb7197e53af0311d657.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.381f776802c068f9198a.hot-update.js": "/chunks/platform~chunks/shared.381f776802c068f9198a.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.815c0828ff5ca52ff68d.hot-update.js": "/chunks/platform~chunks/shared.815c0828ff5ca52ff68d.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.2df30c8cefb817c6e158.hot-update.js": "/chunks/platform~chunks/shared.2df30c8cefb817c6e158.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.177c1e18b11c54145db6.hot-update.js": "/chunks/platform~chunks/shared.177c1e18b11c54145db6.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.b720f6a39f34ea3fa824.hot-update.js": "/chunks/platform~chunks/shared.b720f6a39f34ea3fa824.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.7c343d74aaedac327895.hot-update.js": "/chunks/platform~chunks/shared.7c343d74aaedac327895.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.26d7af48dbe1212ee9fb.hot-update.js": "/chunks/platform~chunks/shared.26d7af48dbe1212ee9fb.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.18026b96f60a6f69230f.hot-update.js": "/chunks/platform~chunks/shared.18026b96f60a6f69230f.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.d7f64ef1231d4a780934.hot-update.js": "/chunks/platform~chunks/shared.d7f64ef1231d4a780934.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.b1f0ceebe8140c039b8a.hot-update.js": "/chunks/platform~chunks/shared.b1f0ceebe8140c039b8a.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared/file-browser~chunks/shared/single-file.6f2348f89a409b0e556a.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared/file-browser~chunks/shared/single-file.6f2348f89a409b0e556a.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared/file-browser.7ac0a28f2225808b4613.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared/file-browser.7ac0a28f2225808b4613.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.7ac0a28f2225808b4613.hot-update.js": "/chunks/platform~chunks/shared.7ac0a28f2225808b4613.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.44310db7254238804c0b.hot-update.js": "/chunks/platform~chunks/shared.44310db7254238804c0b.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.df38c4bf391a2575e3af.hot-update.js": "/chunks/platform~chunks/shared.df38c4bf391a2575e3af.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.29776da85f9521230847.hot-update.js": "/chunks/platform~chunks/shared.29776da85f9521230847.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.9572ec7385ecf23757e2.hot-update.js": "/chunks/platform~chunks/shared.9572ec7385ecf23757e2.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.315a38198dd3acb81dce.hot-update.js": "/chunks/platform~chunks/shared.315a38198dd3acb81dce.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.8d57e08f4db8c5ff6268.hot-update.js": "/chunks/platform~chunks/shared.8d57e08f4db8c5ff6268.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.46c010a33461cd7c2341.hot-update.js": "/chunks/platform~chunks/shared.46c010a33461cd7c2341.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.439d0278621fb178f758.hot-update.js": "/chunks/platform~chunks/shared.439d0278621fb178f758.hot-update.js",
|
||||
"/js/main.c0cc833f4bb5fb51021c.hot-update.js": "/js/main.c0cc833f4bb5fb51021c.hot-update.js",
|
||||
"/chunks/platform.a6dfd284423b109939ac.hot-update.js": "/chunks/platform.a6dfd284423b109939ac.hot-update.js",
|
||||
"/chunks/platform.4372379062e90811d40d.hot-update.js": "/chunks/platform.4372379062e90811d40d.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.5d63dcda4a85f6deddd4.hot-update.js": "/chunks/platform~chunks/shared.5d63dcda4a85f6deddd4.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.19fb3b4d8ec97dc21a93.hot-update.js": "/chunks/platform~chunks/shared.19fb3b4d8ec97dc21a93.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.8e3a4e2397bcb067188c.hot-update.js": "/chunks/platform~chunks/shared.8e3a4e2397bcb067188c.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.412a4d6ca87763c1b9d5.hot-update.js": "/chunks/platform~chunks/shared.412a4d6ca87763c1b9d5.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.44e77142781a9e16eb25.hot-update.js": "/chunks/platform~chunks/shared.44e77142781a9e16eb25.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.b3af2d4eb3f343abbab8.hot-update.js": "/chunks/platform~chunks/shared.b3af2d4eb3f343abbab8.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared/file-browser.39b32e7ebd36143c7630.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared/file-browser.39b32e7ebd36143c7630.hot-update.js",
|
||||
"/js/main.c6875c881bb90531a832.hot-update.js": "/js/main.c6875c881bb90531a832.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.c6875c881bb90531a832.hot-update.js": "/chunks/platform~chunks/shared.c6875c881bb90531a832.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared/file-browser.72b9f293239b9d604ac9.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared/file-browser.72b9f293239b9d604ac9.hot-update.js",
|
||||
"/chunks/files~chunks/platform~chunks/shared~chunks/shared-files~chunks/shared/file-browser.8ccafde208cd7a1dffb7.hot-update.js": "/chunks/files~chunks/platform~chunks/shared~chunks/shared-files~chunks/shared/file-browser.8ccafde208cd7a1dffb7.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared/file-browser.8ccafde208cd7a1dffb7.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared/file-browser.8ccafde208cd7a1dffb7.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.8469152e311439f8cb70.hot-update.js": "/chunks/platform~chunks/shared.8469152e311439f8cb70.hot-update.js",
|
||||
"/chunks/files~chunks/platform~chunks/shared~chunks/shared-files~chunks/shared/file-browser.1496d35248fc37a71f4c.hot-update.js": "/chunks/files~chunks/platform~chunks/shared~chunks/shared-files~chunks/shared/file-browser.1496d35248fc37a71f4c.hot-update.js",
|
||||
"/chunks/files~chunks/platform~chunks/shared~chunks/shared-files~chunks/shared/file-browser.d9f12ac2ffed93e49fbd.hot-update.js": "/chunks/files~chunks/platform~chunks/shared~chunks/shared-files~chunks/shared/file-browser.d9f12ac2ffed93e49fbd.hot-update.js",
|
||||
"/chunks/files~chunks/platform~chunks/shared~chunks/shared-files~chunks/shared/file-browser.c65fca4ccf225e410338.hot-update.js": "/chunks/files~chunks/platform~chunks/shared~chunks/shared-files~chunks/shared/file-browser.c65fca4ccf225e410338.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.17b65f80fabb223da0cf.hot-update.js": "/chunks/platform~chunks/shared.17b65f80fabb223da0cf.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.25cd01d9f05803b71aca.hot-update.js": "/chunks/platform~chunks/shared.25cd01d9f05803b71aca.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.76dc0afabcd373f6de1d.hot-update.js": "/chunks/platform~chunks/shared.76dc0afabcd373f6de1d.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.91dacb62931448cef9ad.hot-update.js": "/chunks/platform~chunks/shared.91dacb62931448cef9ad.hot-update.js",
|
||||
"/chunks/files~chunks/platform~chunks/shared~chunks/shared-files~chunks/shared/file-browser.76ff94b6d0a557a6a81c.hot-update.js": "/chunks/files~chunks/platform~chunks/shared~chunks/shared-files~chunks/shared/file-browser.76ff94b6d0a557a6a81c.hot-update.js",
|
||||
"/chunks/files~chunks/platform~chunks/shared~chunks/shared-files~chunks/shared/file-browser.9565183c03ffb13adfe1.hot-update.js": "/chunks/files~chunks/platform~chunks/shared~chunks/shared-files~chunks/shared/file-browser.9565183c03ffb13adfe1.hot-update.js",
|
||||
"/chunks/files~chunks/shared-files~chunks/shared/file-browser.9565183c03ffb13adfe1.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared/file-browser.9565183c03ffb13adfe1.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.9565183c03ffb13adfe1.hot-update.js": "/chunks/platform~chunks/shared.9565183c03ffb13adfe1.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.1f30f829c0b184357bf1.hot-update.js": "/chunks/platform~chunks/shared.1f30f829c0b184357bf1.hot-update.js",
|
||||
"/chunks/platform~chunks/shared.d82c4cbe4bcee26a499a.hot-update.js": "/chunks/platform~chunks/shared.d82c4cbe4bcee26a499a.hot-update.js",
|
||||
"/chunks/shared.5ef9810a79a9b9f21044.hot-update.js": "/chunks/shared.5ef9810a79a9b9f21044.hot-update.js",
|
||||
"/js/main.7b86ccc4038937e14422.hot-update.js": "/js/main.7b86ccc4038937e14422.hot-update.js",
|
||||
"/chunks/platform.610f56f1f5ffe3dd7fdb.hot-update.js": "/chunks/platform.610f56f1f5ffe3dd7fdb.hot-update.js"
|
||||
}
|
||||
|
||||
@@ -5,13 +5,14 @@
|
||||
<Alert />
|
||||
<ToastrWrapper />
|
||||
<CookieDisclaimer />
|
||||
<Vignette />
|
||||
|
||||
<!--Show spinner before translations is loaded-->
|
||||
<Spinner v-if="! isLoadedTranslations"/>
|
||||
|
||||
<!--App view-->
|
||||
<router-view v-if="isLoadedTranslations" />
|
||||
|
||||
<Vignette />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
@@ -1,16 +1,18 @@
|
||||
<template>
|
||||
<div v-if="isVisible" class="sorting-preview">
|
||||
<SortingAndPreviewMenu />
|
||||
<FileSortingOptions />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import SortingAndPreviewMenu from '@/components/FilesView/SortingAndPreviewMenu'
|
||||
import FileSortingOptions from '@/components/FilesView/FileSortingOptions'
|
||||
import { events } from '@/bus'
|
||||
|
||||
export default {
|
||||
name: 'DesktopSortingAndPreview',
|
||||
components: {SortingAndPreviewMenu},
|
||||
name: 'DesktopSortingOptions',
|
||||
components: {
|
||||
FileSortingOptions
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
isVisible: false
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div id="mobile-actions-wrapper">
|
||||
|
||||
<!--Actions for trash location with MASTER permission--->
|
||||
<!--Actions for trash location--->
|
||||
<div v-if="trashLocationMenu && ! multiSelectMode" class="mobile-actions">
|
||||
<MobileActionButton @click.native="$store.dispatch('emptyTrash')" icon="trash">
|
||||
{{ $t('context_menu.empty_trash') }}
|
||||
@@ -9,25 +9,28 @@
|
||||
<MobileActionButton @click.native="enableMultiSelectMode" icon="check-square">
|
||||
{{ $t('context_menu.select') }}
|
||||
</MobileActionButton>
|
||||
<MobileActionButton class="preview-sorting" @click.native="showViewOptions" icon="preview-sorting">
|
||||
{{$t('preview_sorting.preview_sorting_button')}}
|
||||
<MobileActionButton @click.native="showViewOptions" icon="preview-sorting">
|
||||
{{ $t('preview_sorting.preview_sorting_button') }}
|
||||
</MobileActionButton>
|
||||
</div>
|
||||
|
||||
<!--ContextMenu for Base location with MASTER permission-->
|
||||
<!--Actions for Base location-->
|
||||
<transition name="button">
|
||||
<div v-if="baseLocationMasterMenu && ! multiSelectMode" class="mobile-actions">
|
||||
<MobileActionButton @click.native="createFolder" icon="folder-plus" :class="{'is-inactive' : multiSelectMode}">
|
||||
<MobileActionButton @click.native="showLocations" icon="filter">
|
||||
{{ filterLocationTitle }}
|
||||
</MobileActionButton>
|
||||
<MobileActionButton @click.native="createFolder" icon="folder-plus">
|
||||
{{ $t('context_menu.add_folder') }}
|
||||
</MobileActionButton>
|
||||
<MobileActionButtonUpload :class="{'is-inactive' : multiSelectMode}">
|
||||
<MobileActionButtonUpload>
|
||||
{{ $t('context_menu.upload') }}
|
||||
</MobileActionButtonUpload>
|
||||
<MobileActionButton @click.native="enableMultiSelectMode" icon="check-square">
|
||||
{{ $t('context_menu.select') }}
|
||||
</MobileActionButton>
|
||||
<MobileActionButton class="preview-sorting" @click.native="showViewOptions" icon="preview-sorting">
|
||||
{{$t('preview_sorting.preview_sorting_button')}}
|
||||
<MobileActionButton @click.native="showViewOptions" icon="preview-sorting">
|
||||
{{ $t('preview_sorting.preview_sorting_button') }}
|
||||
</MobileActionButton>
|
||||
</div>
|
||||
</transition>
|
||||
@@ -36,24 +39,24 @@
|
||||
<transition name="button">
|
||||
<div v-if="multiSelectMode" class="mobile-actions">
|
||||
<MobileActionButton @click.native="selectAll" icon="check-square">
|
||||
{{$t('mobile_selecting.select_all')}}
|
||||
{{ $t('mobile_selecting.select_all') }}
|
||||
</MobileActionButton>
|
||||
<MobileActionButton @click.native="deselectAll" icon="x-square">
|
||||
{{$t('mobile_selecting.deselect_all')}}
|
||||
{{ $t('mobile_selecting.deselect_all') }}
|
||||
</MobileActionButton>
|
||||
<MobileActionButton @click.native="disableMultiSelectMode" icon="check">
|
||||
{{$t('mobile_selecting.done')}}
|
||||
{{ $t('mobile_selecting.done') }}
|
||||
</MobileActionButton>
|
||||
</div>
|
||||
</transition>
|
||||
|
||||
<!--ContextMenu for Base location with VISITOR permission-->
|
||||
<!--Actions for Base location in shared folder with visit permission-->
|
||||
<div v-if="baseLocationVisitorMenu && ! multiSelectMode" class="mobile-actions">
|
||||
<MobileActionButton @click.native="enableMultiSelectMode" icon="check-square">
|
||||
{{ $t('context_menu.select') }}
|
||||
</MobileActionButton>
|
||||
<MobileActionButton class="preview-sorting" @click.native="showViewOptions" icon="preview-sorting">
|
||||
{{$t('preview_sorting.preview_sorting_button')}}
|
||||
<MobileActionButton @click.native="showViewOptions" icon="preview-sorting">
|
||||
{{ $t('preview_sorting.preview_sorting_button') }}
|
||||
</MobileActionButton>
|
||||
</div>
|
||||
|
||||
@@ -68,18 +71,23 @@
|
||||
import UploadProgress from '@/components/FilesView/UploadProgress'
|
||||
import {mapGetters} from 'vuex'
|
||||
import {events} from '@/bus'
|
||||
import store from "../../store";
|
||||
|
||||
export default {
|
||||
name: 'MobileActions',
|
||||
name: 'FileActionsMobile',
|
||||
components: {
|
||||
MobileActionButtonUpload,
|
||||
MobileActionButton,
|
||||
UploadProgress,
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['FilePreviewType']),
|
||||
...mapGetters([
|
||||
'FilePreviewType'
|
||||
]),
|
||||
previewIcon() {
|
||||
return this.FilePreviewType === 'list' ? 'th' : 'th-list'
|
||||
return this.FilePreviewType === 'list'
|
||||
? 'th'
|
||||
: 'th-list'
|
||||
},
|
||||
trashLocationMenu() {
|
||||
return this.$isThisLocation(['trash', 'trash-root']) && this.$checkPermission('master')
|
||||
@@ -90,14 +98,27 @@
|
||||
baseLocationVisitorMenu() {
|
||||
return (this.$isThisLocation(['base', 'shared', 'public']) && this.$checkPermission('visitor')) || (this.$isThisLocation(['latest', 'shared']) && this.$checkPermission('master'))
|
||||
},
|
||||
filterLocationTitle() {
|
||||
return {
|
||||
'base': 'Files',
|
||||
'public': 'Files',
|
||||
'shared': 'Shared',
|
||||
'latest': 'Latest',
|
||||
'trash': 'Trash',
|
||||
'trash-root': 'Trash',
|
||||
'participant_uploads': 'Participants',
|
||||
}[this.$store.getters.currentFolder.location]
|
||||
}
|
||||
},
|
||||
data () {
|
||||
data() {
|
||||
return {
|
||||
multiSelectMode: false,
|
||||
mobileSortingAndPreview: false,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
showLocations() {
|
||||
|
||||
},
|
||||
selectAll() {
|
||||
this.$store.commit('SELECT_ALL_FILES')
|
||||
},
|
||||
@@ -115,19 +136,14 @@
|
||||
events.$emit('mobileSelecting:stop')
|
||||
},
|
||||
showViewOptions() {
|
||||
this.mobileSortingAndPreview = ! this.mobileSortingAndPreview
|
||||
|
||||
// Toggle mobile sorting
|
||||
events.$emit('mobileSortingAndPreview', this.mobileSortingAndPreview)
|
||||
events.$emit('mobileSortingAndPreviewVignette', this.mobileSortingAndPreview)
|
||||
events.$emit('mobile-menu:show', 'file-sorting')
|
||||
},
|
||||
createFolder() {
|
||||
events.$emit('popup:open', {name: 'create-folder'})
|
||||
},
|
||||
},
|
||||
mounted () {
|
||||
events.$on('mobileSelecting:stop', () => this.multiSelectMode = false)
|
||||
events.$on('mobileSortingAndPreview', state => this.mobileSortingAndPreview = state)
|
||||
mounted() {
|
||||
events.$on('mobileSelecting:stop', () => this.multiSelectMode = false)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -163,13 +179,6 @@
|
||||
z-index: 3;
|
||||
}
|
||||
|
||||
.mobile-action-button {
|
||||
&.is-inactive {
|
||||
opacity: 0.25;
|
||||
pointer-events: none;
|
||||
}
|
||||
}
|
||||
|
||||
.mobile-actions {
|
||||
white-space: nowrap;
|
||||
overflow-x: auto;
|
||||
@@ -20,7 +20,7 @@
|
||||
<SearchBar class="mobile-search" />
|
||||
|
||||
<!--Mobile Actions-->
|
||||
<MobileActions />
|
||||
<FileActionsMobile />
|
||||
|
||||
<!--Item previews list-->
|
||||
<div v-if="isList" class="file-list-wrapper">
|
||||
@@ -92,8 +92,8 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import FileActionsMobile from '@/components/FilesView/FileActionsMobile'
|
||||
import MobileToolbar from '@/components/FilesView/MobileToolbar'
|
||||
import MobileActions from '@/components/FilesView/MobileActions'
|
||||
import MultiSelected from '@/components/FilesView/MultiSelected'
|
||||
import FileInfoPanel from '@/components/FilesView/FileInfoPanel'
|
||||
import FileItemList from '@/components/FilesView/FileItemList'
|
||||
@@ -107,8 +107,8 @@
|
||||
export default {
|
||||
name: 'FilesContainer',
|
||||
components: {
|
||||
FileActionsMobile,
|
||||
MobileToolbar,
|
||||
MobileActions,
|
||||
MultiSelected,
|
||||
FileInfoPanel,
|
||||
FileItemList,
|
||||
|
||||
@@ -1,96 +0,0 @@
|
||||
<template>
|
||||
<div
|
||||
v-if="showFullPreview"
|
||||
class="file-full-preview-wrapper"
|
||||
id="fileFullPreview"
|
||||
ref="filePreview"
|
||||
tabindex="-1"
|
||||
@click="closeContextMenu"
|
||||
@keydown.esc=";(showFullPreview = false), hideContextMenu()"
|
||||
@keydown.right="next"
|
||||
@keydown.left="prev"
|
||||
>
|
||||
<FilePreviewNavigationPanel />
|
||||
<MediaFullPreview />
|
||||
<FilePreviewActions />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { events } from '@/bus'
|
||||
import { mapGetters } from 'vuex'
|
||||
|
||||
import MediaFullPreview from '@/components/FilesView/MediaFullPreview'
|
||||
import FilePreviewActions from '@/components/FilesView/FilePreviewActions'
|
||||
import FilePreviewNavigationPanel from '@/components/FilesView/FilePreviewNavigationPanel'
|
||||
|
||||
export default {
|
||||
name: 'FileFullPreview',
|
||||
components: {
|
||||
MediaFullPreview,
|
||||
FilePreviewNavigationPanel,
|
||||
FilePreviewActions
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['fileInfoDetail', 'data'])
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
showFullPreview: false
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
closeContextMenu(event) {
|
||||
if ((event.target.parentElement.id || event.target.id) === 'fast-preview-menu') {
|
||||
return
|
||||
} else {
|
||||
events.$emit('showContextMenuPreview:hide')
|
||||
}
|
||||
},
|
||||
next: function() {
|
||||
events.$emit('filePreviewAction:next')
|
||||
},
|
||||
prev: function() {
|
||||
events.$emit('filePreviewAction:prev')
|
||||
},
|
||||
hideContextMenu() {
|
||||
events.$emit('showContextMenuPreview:hide')
|
||||
}
|
||||
},
|
||||
|
||||
updated() {
|
||||
//Focus file preview for key binding
|
||||
if (this.showFullPreview) {
|
||||
this.$refs.filePreview.focus()
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
events.$on('fileFullPreview:show', () => {
|
||||
this.showFullPreview = true
|
||||
})
|
||||
events.$on('fileFullPreview:hide', () => {
|
||||
this.showFullPreview = false
|
||||
|
||||
events.$emit('hide:mobile-navigation')
|
||||
})
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import '@assets/vuefilemanager/_variables';
|
||||
|
||||
.file-full-preview-wrapper {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
z-index: 7;
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
.file-full-preview-wrapper {
|
||||
background-color: $dark_mode_background;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div class="file-info-content" v-if="fileInfoDetail.length === 1">
|
||||
<div class="file-headline" spellcheck="false">
|
||||
<FilePreview/>
|
||||
<FilePreviewDetail/>
|
||||
|
||||
<!--File info-->
|
||||
<div class="flex">
|
||||
@@ -66,8 +66,8 @@
|
||||
|
||||
<script>
|
||||
import {Edit2Icon, LockIcon, UnlockIcon, ImageIcon, VideoIcon, FolderIcon, FileIcon} from 'vue-feather-icons'
|
||||
import FilePreviewDetail from '@/components/Others/FilePreviewDetail'
|
||||
import ImageMetaData from '@/components/FilesView/ImageMetaData'
|
||||
import FilePreview from '@/components/FilesView/FilePreview'
|
||||
import CopyInput from '@/components/Others/Forms/CopyInput'
|
||||
import ListInfoItem from '@/components/Others/ListInfoItem'
|
||||
import ListInfo from '@/components/Others/ListInfo'
|
||||
@@ -77,10 +77,10 @@
|
||||
export default {
|
||||
name: 'FileInfoPanel',
|
||||
components: {
|
||||
FilePreviewDetail,
|
||||
ImageMetaData,
|
||||
ListInfoItem,
|
||||
ListInfo,
|
||||
FilePreview,
|
||||
FolderIcon,
|
||||
UnlockIcon,
|
||||
VideoIcon,
|
||||
|
||||
@@ -161,7 +161,7 @@ export default {
|
||||
this.$store.commit('CLEAR_FILEINFO_DETAIL')
|
||||
this.$store.commit('GET_FILEINFO_DETAIL', this.item)
|
||||
|
||||
events.$emit('mobileMenu:show')
|
||||
events.$emit('mobile-menu:show', 'file-menu')
|
||||
},
|
||||
dragEnter() {
|
||||
if (this.item.type !== 'folder') return
|
||||
|
||||
@@ -155,7 +155,7 @@ export default {
|
||||
this.$store.commit('CLEAR_FILEINFO_DETAIL')
|
||||
this.$store.commit('GET_FILEINFO_DETAIL', this.item)
|
||||
|
||||
events.$emit('mobileMenu:show')
|
||||
events.$emit('mobile-menu:show', 'file-menu')
|
||||
},
|
||||
dragEnter() {
|
||||
if (this.item.type !== 'folder') return
|
||||
|
||||
182
resources/js/components/FilesView/FileMenuMobile.vue
Normal file
182
resources/js/components/FilesView/FileMenuMobile.vue
Normal file
@@ -0,0 +1,182 @@
|
||||
<template>
|
||||
<MenuMobile name="file-menu">
|
||||
<ThumbnailItem class="item-thumbnail" :item="fileInfoDetail[0]" info="metadata" />
|
||||
|
||||
<!--Trash location-->
|
||||
<MenuMobileGroup v-if="$isThisLocation(['trash', 'trash-root']) && $checkPermission('master')">
|
||||
<OptionGroup v-if="fileInfoDetail[0]">
|
||||
<Option @click.native="restoreItem" :title="$t('context_menu.restore')" icon="restore" />
|
||||
<Option @click.native="deleteItem" :title="$t('context_menu.delete')" icon="delete" />
|
||||
</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" />
|
||||
</OptionGroup>
|
||||
</MenuMobileGroup>
|
||||
|
||||
<!--Shared location-->
|
||||
<MenuMobileGroup v-if="$isThisLocation(['shared']) && $checkPermission('master')">
|
||||
<OptionGroup v-if="fileInfoDetail[0] && isFolder">
|
||||
<Option @click.native="addToFavourites" :title="favouritesTitle" icon="star" />
|
||||
</OptionGroup>
|
||||
|
||||
<OptionGroup v-if="fileInfoDetail[0]">
|
||||
<Option @click.native="renameItem" :title="$t('context_menu.rename')" icon="rename" />
|
||||
<Option @click.native="shareItem" :title="fileInfoDetail[0].shared ? $t('context_menu.share_edit') : $t('context_menu.share')" icon="share" />
|
||||
<Option @click.native="deleteItem" :title="$t('context_menu.delete')" icon="trash" />
|
||||
</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" />
|
||||
</OptionGroup>
|
||||
</MenuMobileGroup>
|
||||
|
||||
<!--Base location for user-->
|
||||
<MenuMobileGroup v-if="$isThisLocation(['base', 'participant_uploads', 'latest']) && $checkPermission('master')">
|
||||
<OptionGroup v-if="fileInfoDetail[0] && isFolder">
|
||||
<Option @click.native="addToFavourites" :title="favouritesTitle" icon="star" />
|
||||
</OptionGroup>
|
||||
|
||||
<OptionGroup v-if="fileInfoDetail[0]">
|
||||
<Option @click.native="renameItem" :title="$t('context_menu.rename')" icon="rename" />
|
||||
<Option @click.native="moveItem" :title="$t('context_menu.move')" icon="move-item" />
|
||||
<Option @click.native="shareItem" :title="fileInfoDetail[0].shared ? $t('context_menu.share_edit') : $t('context_menu.share')" icon="share" />
|
||||
<Option @click.native="deleteItem" :title="$t('context_menu.delete')" icon="trash" />
|
||||
</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" />
|
||||
</OptionGroup>
|
||||
</MenuMobileGroup>
|
||||
|
||||
<!--Base location for guest-->
|
||||
<MenuMobileGroup v-if="$isThisLocation(['base', 'public']) && $checkPermission('editor')">
|
||||
<OptionGroup>
|
||||
<Option v-if="fileInfoDetail[0]" @click.native="renameItem" :title="$t('context_menu.rename')" icon="rename" />
|
||||
<Option v-if="fileInfoDetail[0]" @click.native="moveItem" :title="$t('context_menu.move')" icon="move-item" />
|
||||
<Option @click.native="deleteItem" :title="$t('context_menu.delete')" icon="trash" />
|
||||
</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" />
|
||||
</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" />
|
||||
</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 {mapGetters} from 'vuex'
|
||||
import {events} from '@/bus'
|
||||
|
||||
export default {
|
||||
name: 'FileMenuMobile',
|
||||
components: {
|
||||
MenuMobileGroup,
|
||||
MenuMobile,
|
||||
ThumbnailItem,
|
||||
OptionGroup,
|
||||
Option,
|
||||
},
|
||||
computed: {
|
||||
...mapGetters([
|
||||
'fileInfoDetail',
|
||||
'user',
|
||||
]),
|
||||
favourites() {
|
||||
return this.user.data.relationships.favourites.data.attributes.folders
|
||||
},
|
||||
favouritesTitle() {
|
||||
return this.isInFavourites
|
||||
? this.$t('context_menu.remove_from_favourites')
|
||||
: this.$t('context_menu.add_to_favourites')
|
||||
},
|
||||
isInFavourites() {
|
||||
return this.favourites.find(el => el.id === this.fileInfoDetail[0].id)
|
||||
},
|
||||
isFile() {
|
||||
return !this.isImage && !this.isFolder
|
||||
},
|
||||
isImage() {
|
||||
return this.fileInfoDetail[0] && this.fileInfoDetail[0].type === 'image'
|
||||
},
|
||||
isFolder() {
|
||||
return this.fileInfoDetail[0] && this.fileInfoDetail[0].type === 'folder'
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
isVisible: false,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
downloadFolder() {
|
||||
this.$store.dispatch('downloadFolder', this.fileInfoDetail[0])
|
||||
},
|
||||
moveItem() {
|
||||
events.$emit('popup:open', {name: 'move', item: [this.fileInfoDetail[0]]})
|
||||
},
|
||||
shareItem() {
|
||||
if (this.fileInfoDetail[0].shared) {
|
||||
events.$emit('popup:open', {
|
||||
name: 'share-edit',
|
||||
item: this.fileInfoDetail[0]
|
||||
})
|
||||
} else {
|
||||
events.$emit('popup:open', {
|
||||
name: 'share-create',
|
||||
item: this.fileInfoDetail[0]
|
||||
})
|
||||
}
|
||||
},
|
||||
addToFavourites() {
|
||||
if (this.favourites && !this.favourites.find(el => el.id === this.fileInfoDetail[0].id)) {
|
||||
this.$store.dispatch('addToFavourites', this.fileInfoDetail[0])
|
||||
} else {
|
||||
this.$store.dispatch('removeFromFavourites', this.fileInfoDetail[0])
|
||||
}
|
||||
},
|
||||
downloadItem() {
|
||||
this.$downloadFile(
|
||||
this.fileInfoDetail[0].file_url,
|
||||
this.fileInfoDetail[0].name + '.' + this.fileInfoDetail[0].mimetype
|
||||
)
|
||||
},
|
||||
deleteItem() {
|
||||
this.$store.dispatch('deleteItem')
|
||||
},
|
||||
restoreItem() {
|
||||
this.$store.dispatch('restoreItem', this.fileInfoDetail[0])
|
||||
},
|
||||
renameItem() {
|
||||
events.$emit('popup:open', {name: 'rename-item', item: this.fileInfoDetail[0]})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
@import "@assets/vuefilemanager/_variables";
|
||||
@import "@assets/vuefilemanager/_mixins";
|
||||
|
||||
.item-thumbnail {
|
||||
padding: 20px 20px 10px;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
</style>
|
||||
@@ -1,61 +1,96 @@
|
||||
<template>
|
||||
<div v-if="canBePreview" class="preview">
|
||||
<img v-if="fileInfoDetail[0].type == 'image' && fileInfoDetail[0].thumbnail" :src="fileInfoDetail[0].thumbnail" :alt="fileInfoDetail[0].name" />
|
||||
<audio v-else-if="fileInfoDetail[0].type == 'audio'" :src="fileInfoDetail[0].file_url" controlsList="nodownload" controls></audio>
|
||||
<video v-else-if="fileInfoDetail[0].type == 'video'" controlsList="nodownload" disablePictureInPicture playsinline controls>
|
||||
<source :src="fileInfoDetail[0].file_url" type="video/mp4">
|
||||
</video>
|
||||
</div>
|
||||
<div
|
||||
v-if="showFullPreview"
|
||||
class="file-full-preview-wrapper"
|
||||
id="fileFullPreview"
|
||||
ref="filePreview"
|
||||
tabindex="-1"
|
||||
@click="closeContextMenu"
|
||||
@keydown.esc=";(showFullPreview = false), hideContextMenu()"
|
||||
@keydown.right="next"
|
||||
@keydown.left="prev"
|
||||
>
|
||||
<FilePreviewNavigationPanel />
|
||||
<MediaFullPreview />
|
||||
<FilePreviewActions />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapGetters } from 'vuex'
|
||||
import { includes } from 'lodash'
|
||||
import { events } from '@/bus'
|
||||
import { mapGetters } from 'vuex'
|
||||
|
||||
export default {
|
||||
name: 'FilePreview',
|
||||
computed: {
|
||||
...mapGetters(['fileInfoDetail']),
|
||||
canBePreview() {
|
||||
return this.fileInfoDetail[0] && ! includes([
|
||||
'folder', 'file'
|
||||
], this.fileInfoDetail[0].type)
|
||||
}
|
||||
},
|
||||
}
|
||||
import MediaFullPreview from '@/components/FilesView/MediaFullPreview'
|
||||
import FilePreviewActions from '@/components/FilesView/FilePreviewActions'
|
||||
import FilePreviewNavigationPanel from '@/components/FilesView/FilePreviewNavigationPanel'
|
||||
|
||||
export default {
|
||||
name: 'FilePreview',
|
||||
components: {
|
||||
MediaFullPreview,
|
||||
FilePreviewNavigationPanel,
|
||||
FilePreviewActions
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['fileInfoDetail', 'data'])
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
showFullPreview: false
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
closeContextMenu(event) {
|
||||
if ((event.target.parentElement.id || event.target.id) === 'fast-preview-menu') {
|
||||
return
|
||||
} else {
|
||||
events.$emit('showContextMenuPreview:hide')
|
||||
}
|
||||
},
|
||||
next: function() {
|
||||
events.$emit('filePreviewAction:next')
|
||||
},
|
||||
prev: function() {
|
||||
events.$emit('filePreviewAction:prev')
|
||||
},
|
||||
hideContextMenu() {
|
||||
events.$emit('showContextMenuPreview:hide')
|
||||
}
|
||||
},
|
||||
|
||||
updated() {
|
||||
//Focus file preview for key binding
|
||||
if (this.showFullPreview) {
|
||||
this.$refs.filePreview.focus()
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
events.$on('fileFullPreview:show', () => {
|
||||
this.showFullPreview = true
|
||||
})
|
||||
events.$on('fileFullPreview:hide', () => {
|
||||
this.showFullPreview = false
|
||||
|
||||
events.$emit('mobile-navigation:hide')
|
||||
})
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
@import '@assets/vuefilemanager/_variables';
|
||||
@import '@assets/vuefilemanager/_mixins';
|
||||
<style lang="scss" scoped>
|
||||
@import '@assets/vuefilemanager/_variables';
|
||||
|
||||
.preview {
|
||||
width: 100%;
|
||||
display: block;
|
||||
margin-bottom: 7px;
|
||||
.file-full-preview-wrapper {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
z-index: 7;
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
img {
|
||||
border-radius: 4px;
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
audio {
|
||||
width: 100%;
|
||||
&::-webkit-media-controls-panel {
|
||||
background-color: $light_background;
|
||||
}
|
||||
|
||||
&::-webkit-media-controls-play-button {
|
||||
color: $theme;
|
||||
}
|
||||
}
|
||||
|
||||
video {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
border-radius: 3px;
|
||||
}
|
||||
}
|
||||
@media (prefers-color-scheme: dark) {
|
||||
.file-full-preview-wrapper {
|
||||
background-color: $dark_mode_background;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -93,7 +93,7 @@ export default {
|
||||
},
|
||||
menuOpen() {
|
||||
if (this.$isMobile()) {
|
||||
events.$emit('mobileMenu:show', 'showFromMediaPreview')
|
||||
events.$emit('mobile-menu:show', 'file-menu')
|
||||
} else {
|
||||
events.$emit('showContextMenuPreview:show', this.fileInfoDetail[0])
|
||||
}
|
||||
|
||||
22
resources/js/components/FilesView/FileSortingMobile.vue
Normal file
22
resources/js/components/FilesView/FileSortingMobile.vue
Normal file
@@ -0,0 +1,22 @@
|
||||
<template>
|
||||
<MenuMobile name="file-sorting">
|
||||
<MenuMobileGroup>
|
||||
<FileSortingOptions />
|
||||
</MenuMobileGroup>
|
||||
</MenuMobile>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import FileSortingOptions from '@/components/FilesView/FileSortingOptions'
|
||||
import MenuMobileGroup from '@/components/Mobile/MenuMobileGroup'
|
||||
import MenuMobile from '@/components/Mobile/MenuMobile'
|
||||
|
||||
export default {
|
||||
name: 'FilterSortingMobile',
|
||||
components: {
|
||||
FileSortingOptions,
|
||||
MenuMobileGroup,
|
||||
MenuMobile,
|
||||
},
|
||||
}
|
||||
</script>
|
||||
@@ -1,10 +1,10 @@
|
||||
<template>
|
||||
<div class="menu-options" id="menu-list">
|
||||
<OptionGroup class="menu-option-group">
|
||||
<div>
|
||||
<OptionGroup>
|
||||
<Option v-if="isList" @click.native="changePreview('grid')" :title="$t('preview_sorting.grid_view')" icon="grid" />
|
||||
<Option v-if="isGrid" @click.native="changePreview('list')" :title="$t('preview_sorting.list_view')" icon="list" />
|
||||
</OptionGroup>
|
||||
<OptionGroup class="menu-option-group">
|
||||
<OptionGroup>
|
||||
<Option @click.native.stop="sort('created_at')" :title="$t('preview_sorting.sort_date')" icon="calendar" />
|
||||
<Option @click.native.stop="sort('name')" :title="$t('preview_sorting.sort_alphabet')" icon="alphabet" />
|
||||
</OptionGroup>
|
||||
@@ -19,25 +19,20 @@
|
||||
|
||||
import OptionGroup from '@/components/FilesView/OptionGroup'
|
||||
import Option from '@/components/FilesView/Option'
|
||||
import { CalendarIcon, ListIcon, GridIcon, ArrowUpIcon, CheckIcon } from 'vue-feather-icons'
|
||||
import AlphabetIcon from '@/components/FilesView/Icons/AlphabetIcon'
|
||||
import { ArrowUpIcon } from 'vue-feather-icons'
|
||||
import { mapGetters } from 'vuex'
|
||||
import { events } from '@/bus'
|
||||
|
||||
export default {
|
||||
name: 'SortingAndPreviewMenu',
|
||||
name: 'FileSortingOptions',
|
||||
components: {
|
||||
OptionGroup,
|
||||
Option,
|
||||
CalendarIcon,
|
||||
AlphabetIcon,
|
||||
ArrowUpIcon,
|
||||
CheckIcon,
|
||||
ListIcon,
|
||||
GridIcon
|
||||
Option,
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['FilePreviewType']),
|
||||
...mapGetters([
|
||||
'FilePreviewType'
|
||||
]),
|
||||
isGrid() {
|
||||
return this.FilePreviewType === 'grid'
|
||||
},
|
||||
@@ -55,7 +50,6 @@ export default {
|
||||
},
|
||||
methods: {
|
||||
sort(field) {
|
||||
|
||||
this.filter.field = field
|
||||
|
||||
// Set sorting direction
|
||||
@@ -74,16 +68,10 @@ export default {
|
||||
this.$getDataByLocation()
|
||||
},
|
||||
changePreview(previewType) {
|
||||
|
||||
this.$store.dispatch('changePreviewType', previewType)
|
||||
|
||||
if (this.$isMobile())
|
||||
events.$emit('mobileSortingAndPreview', false)
|
||||
events.$emit('mobileSortingAndPreviewVignette', this.mobileSortingAndPreview)
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
|
||||
let sorting = JSON.parse(localStorage.getItem('sorting'))
|
||||
|
||||
// Set default sorting if in not setup in LocalStorage
|
||||
@@ -92,89 +80,3 @@ export default {
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
@import "@assets/vuefilemanager/_variables";
|
||||
@import "@assets/vuefilemanager/_mixins";
|
||||
|
||||
.show-icon {
|
||||
margin-left: auto;
|
||||
max-height: 19px;
|
||||
|
||||
.arrow-down {
|
||||
@include transform(rotate(180deg));
|
||||
}
|
||||
}
|
||||
|
||||
.menu-option {
|
||||
display: flex;
|
||||
|
||||
.icon {
|
||||
margin-right: 20px;
|
||||
line-height: 0;
|
||||
}
|
||||
|
||||
.text-label {
|
||||
@include font-size(16);
|
||||
}
|
||||
}
|
||||
|
||||
.sorting-preview {
|
||||
min-width: 250px;
|
||||
position: absolute;
|
||||
z-index: 99;
|
||||
box-shadow: $shadow;
|
||||
background: white;
|
||||
border-radius: 8px;
|
||||
overflow: hidden;
|
||||
right: 66px;
|
||||
top: 63px;
|
||||
|
||||
&.showed {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
.menu-options {
|
||||
list-style: none;
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
.menu-option-group {
|
||||
padding: 5px 0;
|
||||
border-bottom: 1px solid $light_mode_border;
|
||||
|
||||
&:first-child {
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
padding-bottom: 0;
|
||||
border-bottom: none;
|
||||
}
|
||||
}
|
||||
|
||||
.menu-option {
|
||||
white-space: nowrap;
|
||||
font-weight: 700;
|
||||
@include font-size(14);
|
||||
padding: 15px 20px;
|
||||
cursor: pointer;
|
||||
width: 100%;
|
||||
color: $text;
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
.menu-options {
|
||||
.menu-option-group {
|
||||
border-color: $dark_mode_border_color;
|
||||
}
|
||||
|
||||
.menu-option {
|
||||
color: $dark_mode_text_primary;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,6 +1,7 @@
|
||||
<template>
|
||||
<button class="mobile-action-button">
|
||||
<div class="flex">
|
||||
<filter-icon v-if="icon === 'filter'" size="15" class="icon dark-text-theme" />
|
||||
<credit-card-icon v-if="icon === 'credit-card'" size="15" class="icon dark-text-theme" />
|
||||
<folder-plus-icon v-if="icon === 'folder-plus'" size="15" class="icon dark-text-theme" />
|
||||
<list-icon v-if="icon === 'th-list'" size="15" class="icon dark-text-theme" />
|
||||
@@ -21,7 +22,7 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { DollarSignIcon, CheckIcon, XSquareIcon, CheckSquareIcon, FolderPlusIcon, ListIcon, GridIcon, TrashIcon, UserPlusIcon, PlusIcon, CreditCardIcon } from 'vue-feather-icons'
|
||||
import { FilterIcon, DollarSignIcon, CheckIcon, XSquareIcon, CheckSquareIcon, FolderPlusIcon, ListIcon, GridIcon, TrashIcon, UserPlusIcon, PlusIcon, CreditCardIcon } from 'vue-feather-icons'
|
||||
import SortingAndPreviewIcon from '@/components/FilesView/Icons/SortingAndPreviewIcon'
|
||||
|
||||
export default {
|
||||
@@ -37,6 +38,7 @@
|
||||
FolderPlusIcon,
|
||||
UserPlusIcon,
|
||||
XSquareIcon,
|
||||
FilterIcon,
|
||||
CheckIcon,
|
||||
TrashIcon,
|
||||
PlusIcon,
|
||||
|
||||
@@ -1,560 +0,0 @@
|
||||
<template>
|
||||
<div class="options-wrapper">
|
||||
<transition name="context-menu">
|
||||
<div v-if="isVisible" ref="contextmenu" class="options" @click="closeAndResetContextMenu">
|
||||
|
||||
<div class="menu-wrapper">
|
||||
|
||||
<!--Item Thumbnail-->
|
||||
<ThumbnailItem class="item-thumbnail" :item="fileInfoDetail[0]" info="metadata"/>
|
||||
|
||||
<!--Mobile for trash location-->
|
||||
<div v-if="$isThisLocation(['trash', 'trash-root']) && $checkPermission('master')" class="menu-options">
|
||||
<ul class="menu-option-group">
|
||||
<li class="menu-option" @click="$store.dispatch('restoreItem', fileInfoDetail[0])" v-if="fileInfoDetail[0]">
|
||||
<div class="icon">
|
||||
<life-buoy-icon size="17"></life-buoy-icon>
|
||||
</div>
|
||||
<div class="text-label">
|
||||
{{ $t('context_menu.restore') }}
|
||||
</div>
|
||||
</li>
|
||||
<li class="menu-option delete" @click="deleteItem" v-if="fileInfoDetail[0]">
|
||||
<div class="icon">
|
||||
<trash-2-icon size="17"></trash-2-icon>
|
||||
</div>
|
||||
<div class="text-label">
|
||||
{{ $t('context_menu.delete') }}
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<ul class="menu-option-group" >
|
||||
<li class="menu-option" @click="downloadItem" v-if="!isFolder">
|
||||
<div class="icon">
|
||||
<download-cloud-icon size="17"></download-cloud-icon>
|
||||
</div>
|
||||
<div class="text-label">
|
||||
{{ $t('context_menu.download') }}
|
||||
</div>
|
||||
</li>
|
||||
|
||||
<li class="menu-option" @click="downloadFolder" v-if="isFolder">
|
||||
<div class="icon">
|
||||
<paperclip-icon size="17"></paperclip-icon>
|
||||
</div>
|
||||
<div class="text-label">
|
||||
{{ $t('context_menu.zip_folder') }}
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<!--Mobile for Base location-->
|
||||
<div v-if="$isThisLocation(['shared']) && $checkPermission('master')" class="menu-options">
|
||||
<ul class="menu-option-group">
|
||||
<li class="menu-option" @click="addToFavourites" v-if="fileInfoDetail[0] && isFolder">
|
||||
<div class="icon">
|
||||
<star-icon size="17"></star-icon>
|
||||
</div>
|
||||
<div class="text-label">
|
||||
{{
|
||||
isInFavourites
|
||||
? $t('context_menu.remove_from_favourites')
|
||||
: $t('context_menu.add_to_favourites')
|
||||
}}
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<ul class="menu-option-group">
|
||||
<li class="menu-option" @click="renameItem" v-if="fileInfoDetail[0]">
|
||||
<div class="icon">
|
||||
<edit-2-icon size="17"></edit-2-icon>
|
||||
</div>
|
||||
<div class="text-label">
|
||||
{{ $t('context_menu.rename') }}
|
||||
</div>
|
||||
</li>
|
||||
<li class="menu-option" @click="shareItem" v-if="fileInfoDetail[0]">
|
||||
<div class="icon">
|
||||
<link-icon size="17"></link-icon>
|
||||
</div>
|
||||
<div class="text-label">
|
||||
{{
|
||||
fileInfoDetail[0].shared
|
||||
? $t('context_menu.share_edit')
|
||||
: $t('context_menu.share')
|
||||
}}
|
||||
</div>
|
||||
</li>
|
||||
<li class="menu-option delete" @click="deleteItem" v-if="fileInfoDetail[0]">
|
||||
<div class="icon">
|
||||
<trash-2-icon size="17"></trash-2-icon>
|
||||
</div>
|
||||
<div class="text-label">
|
||||
{{ $t('context_menu.delete') }}
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<ul class="menu-option-group">
|
||||
<li class="menu-option" @click="downloadItem" v-if="!isFolder">
|
||||
<div class="icon">
|
||||
<download-cloud-icon size="17"></download-cloud-icon>
|
||||
</div>
|
||||
<div class="text-label">
|
||||
{{ $t('context_menu.download') }}
|
||||
</div>
|
||||
</li>
|
||||
|
||||
<li class="menu-option" @click="downloadFolder" v-if="isFolder">
|
||||
<div class="icon">
|
||||
<paperclip-icon size="17"></paperclip-icon>
|
||||
</div>
|
||||
<div class="text-label">
|
||||
{{ $t('context_menu.zip_folder') }}
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<!--Mobile for Base location-->
|
||||
<div v-if="$isThisLocation(['base', 'participant_uploads', 'latest']) && $checkPermission('master')" class="menu-options">
|
||||
<ul class="menu-option-group" v-if="fileInfoDetail[0] && isFolder">
|
||||
<li class="menu-option" @click="addToFavourites">
|
||||
<div class="icon">
|
||||
<star-icon size="17"></star-icon>
|
||||
</div>
|
||||
<div class="text-label">
|
||||
{{
|
||||
isInFavourites
|
||||
? $t('context_menu.remove_from_favourites')
|
||||
: $t('context_menu.add_to_favourites')
|
||||
}}
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<ul class="menu-option-group">
|
||||
<li class="menu-option" @click="renameItem" v-if="fileInfoDetail[0]">
|
||||
<div class="icon">
|
||||
<edit-2-icon size="17"></edit-2-icon>
|
||||
</div>
|
||||
<div class="text-label">
|
||||
{{ $t('context_menu.rename') }}
|
||||
</div>
|
||||
</li>
|
||||
<li class="menu-option" @click="moveItem" v-if="fileInfoDetail[0]">
|
||||
<div class="icon">
|
||||
<corner-down-right-icon size="17"></corner-down-right-icon>
|
||||
</div>
|
||||
<div class="text-label">
|
||||
{{ $t('context_menu.move') }}
|
||||
</div>
|
||||
</li>
|
||||
<li class="menu-option" @click="shareItem" v-if="fileInfoDetail[0]">
|
||||
<div class="icon">
|
||||
<link-icon size="17"></link-icon>
|
||||
</div>
|
||||
<div class="text-label">
|
||||
{{
|
||||
fileInfoDetail[0].shared
|
||||
? $t('context_menu.share_edit')
|
||||
: $t('context_menu.share')
|
||||
}}
|
||||
</div>
|
||||
</li>
|
||||
<li class="menu-option delete" @click="deleteItem" v-if="fileInfoDetail[0]">
|
||||
<div class="icon">
|
||||
<trash-2-icon size="17"></trash-2-icon>
|
||||
</div>
|
||||
<div class="text-label">
|
||||
{{ $t('context_menu.delete') }}
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<ul class="menu-option-group">
|
||||
<li class="menu-option" @click="downloadItem" v-if="!isFolder">
|
||||
<div class="icon">
|
||||
<download-cloud-icon size="17"></download-cloud-icon>
|
||||
</div>
|
||||
<div class="text-label">
|
||||
{{ $t('context_menu.download') }}
|
||||
</div>
|
||||
</li>
|
||||
|
||||
<li class="menu-option" @click="downloadFolder" v-if="isFolder">
|
||||
<div class="icon">
|
||||
<paperclip-icon size="17"></paperclip-icon>
|
||||
</div>
|
||||
<div class="text-label">
|
||||
{{ $t('context_menu.zip_folder') }}
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<!--Mobile for Base location with EDITOR permission-->
|
||||
<div v-if="$isThisLocation(['base', 'public']) && $checkPermission('editor')" class="menu-options">
|
||||
<ul class="menu-option-group">
|
||||
<li class="menu-option" @click="renameItem" v-if="fileInfoDetail[0]">
|
||||
<div class="icon">
|
||||
<edit-2-icon size="17"></edit-2-icon>
|
||||
</div>
|
||||
<div class="text-label">
|
||||
{{ $t('context_menu.rename') }}
|
||||
</div>
|
||||
</li>
|
||||
<li class="menu-option" @click="moveItem" v-if="fileInfoDetail[0]">
|
||||
<div class="icon">
|
||||
<corner-down-right-icon size="17"></corner-down-right-icon>
|
||||
</div>
|
||||
<div class="text-label">
|
||||
{{ $t('context_menu.move') }}
|
||||
</div>
|
||||
</li>
|
||||
<li class="menu-option" @click="deleteItem">
|
||||
<div class="icon">
|
||||
<trash-2-icon size="17"></trash-2-icon>
|
||||
</div>
|
||||
<div class="text-label">
|
||||
{{ $t('context_menu.delete') }}
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<ul class="menu-option-group">
|
||||
<li class="menu-option" @click="downloadItem" v-if="!isFolder">
|
||||
<div class="icon">
|
||||
<download-cloud-icon size="17"></download-cloud-icon>
|
||||
</div>
|
||||
<div class="text-label">
|
||||
{{ $t('context_menu.download') }}
|
||||
</div>
|
||||
</li>
|
||||
|
||||
<li class="menu-option" @click="downloadFolder" v-if="isFolder">
|
||||
<div class="icon">
|
||||
<paperclip-icon size="17"></paperclip-icon>
|
||||
</div>
|
||||
<div class="text-label">
|
||||
{{ $t('context_menu.zip_folder') }}
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<!--Mobile for Base location with VISITOR permission-->
|
||||
<div v-if="$isThisLocation(['base', 'public']) && $checkPermission('visitor')" class="menu-options">
|
||||
<ul class="menu-option-group">
|
||||
<li class="menu-option" @click="downloadItem" v-if="!isFolder">
|
||||
<div class="icon">
|
||||
<download-cloud-icon size="17"></download-cloud-icon>
|
||||
</div>
|
||||
<div class="text-label">
|
||||
{{ $t('context_menu.download') }}
|
||||
</div>
|
||||
</li>
|
||||
|
||||
<li class="menu-option" @click="downloadFolder" v-if="isFolder">
|
||||
<div class="icon">
|
||||
<paperclip-icon size="17"></paperclip-icon>
|
||||
</div>
|
||||
<div class="text-label">
|
||||
{{ $t('context_menu.zip_folder') }}
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</transition>
|
||||
<transition name="fade">
|
||||
<div v-show="isVisible" class="vignette" @click="closeAndResetContextMenu"></div>
|
||||
</transition>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import ThumbnailItem from '@/components/Others/ThumbnailItem'
|
||||
|
||||
import {
|
||||
CornerDownRightIcon,
|
||||
DownloadCloudIcon,
|
||||
FolderPlusIcon,
|
||||
PaperclipIcon,
|
||||
LifeBuoyIcon,
|
||||
Trash2Icon,
|
||||
Edit2Icon,
|
||||
TrashIcon,
|
||||
StarIcon,
|
||||
LinkIcon,
|
||||
EyeIcon
|
||||
} from 'vue-feather-icons'
|
||||
import { events } from '@/bus'
|
||||
import { mapGetters } from 'vuex'
|
||||
|
||||
export default {
|
||||
name: 'MobileMenu',
|
||||
components: {
|
||||
CornerDownRightIcon,
|
||||
DownloadCloudIcon,
|
||||
FolderPlusIcon,
|
||||
PaperclipIcon,
|
||||
ThumbnailItem,
|
||||
LifeBuoyIcon,
|
||||
Trash2Icon,
|
||||
Edit2Icon,
|
||||
TrashIcon,
|
||||
LinkIcon,
|
||||
StarIcon,
|
||||
EyeIcon
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['fileInfoDetail', 'user']),
|
||||
favourites() {
|
||||
return this.user.data.relationships.favourites.data.attributes.folders
|
||||
},
|
||||
isInFavourites() {
|
||||
return this.favourites.find(
|
||||
(el) => el.id == this.fileInfoDetail[0].id
|
||||
)
|
||||
},
|
||||
isFile() {
|
||||
return (
|
||||
this.fileInfoDetail[0] &&
|
||||
this.fileInfoDetail[0].type !== 'folder' &&
|
||||
this.fileInfoDetail[0] &&
|
||||
this.fileInfoDetail[0].type !== 'image'
|
||||
)
|
||||
},
|
||||
isImage() {
|
||||
return this.fileInfoDetail[0] && this.fileInfoDetail[0].type === 'image'
|
||||
},
|
||||
isFolder() {
|
||||
return this.fileInfoDetail[0] && this.fileInfoDetail[0].type === 'folder'
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
isVisible: false,
|
||||
showFromMediaPreview: false
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
downloadFolder(){
|
||||
this.$store.dispatch( 'downloadFolder' , this.fileInfoDetail[0] )
|
||||
},
|
||||
moveItem() {
|
||||
events.$emit('popup:open', { name: 'move', item: [this.fileInfoDetail[0]] })
|
||||
},
|
||||
shareItem() {
|
||||
if (this.fileInfoDetail[0].shared) {
|
||||
// Open share item popup
|
||||
events.$emit('popup:open', {
|
||||
name: 'share-edit',
|
||||
item: this.fileInfoDetail[0]
|
||||
})
|
||||
} else {
|
||||
// Open share item popup
|
||||
events.$emit('popup:open', {
|
||||
name: 'share-create',
|
||||
item: this.fileInfoDetail[0]
|
||||
})
|
||||
}
|
||||
},
|
||||
addToFavourites() {
|
||||
if (
|
||||
this.favourites &&
|
||||
!this.favourites.find(
|
||||
(el) => el.id == this.fileInfoDetail[0].id
|
||||
)
|
||||
) {
|
||||
this.$store.dispatch('addToFavourites', this.fileInfoDetail[0])
|
||||
} else {
|
||||
this.$store.dispatch('removeFromFavourites', this.fileInfoDetail[0])
|
||||
}
|
||||
},
|
||||
downloadItem() {
|
||||
this.$downloadFile(
|
||||
this.fileInfoDetail[0].file_url,
|
||||
this.fileInfoDetail[0].name + '.' + this.fileInfoDetail[0].mimetype
|
||||
)
|
||||
},
|
||||
deleteItem() {
|
||||
this.$store.dispatch('deleteItem')
|
||||
},
|
||||
renameItem() {
|
||||
events.$emit('popup:open', { name: 'rename-item', item: this.fileInfoDetail[0] })
|
||||
},
|
||||
closeAndResetContextMenu() {
|
||||
//If emit to show menu coming from MediaFullPreview dont reset data
|
||||
this.isVisible = false
|
||||
this.showFromMediaPreview = false
|
||||
events.$emit('hide:mobile-navigation')
|
||||
}
|
||||
},
|
||||
created() {
|
||||
events.$on('mobileMenu:show', showFromMedia => {
|
||||
// If emit come from MediaFullPreview
|
||||
if (showFromMedia) {
|
||||
this.isVisible = true
|
||||
this.showFromMediaPreview = true
|
||||
} else {
|
||||
this.isVisible = !this.isVisible
|
||||
}
|
||||
})
|
||||
|
||||
// Hide mobile menu
|
||||
events.$on('mobileMenu:hide', () => {
|
||||
this.isVisible = false
|
||||
})
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
@import "@assets/vuefilemanager/_variables";
|
||||
@import "@assets/vuefilemanager/_mixins";
|
||||
|
||||
.mobile-selected-menu {
|
||||
display: flex;
|
||||
margin-left: 15px;
|
||||
margin-right: 15px;
|
||||
|
||||
.close-icon {
|
||||
margin-left: auto !important;
|
||||
}
|
||||
}
|
||||
|
||||
.menu-option {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.icon {
|
||||
margin-right: 20px;
|
||||
line-height: 0;
|
||||
}
|
||||
|
||||
.text-label {
|
||||
@include font-size(16);
|
||||
}
|
||||
}
|
||||
|
||||
.vignette {
|
||||
background: rgba(0, 0, 0, 0.35);
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
z-index: 9;
|
||||
cursor: pointer;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.options {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 99;
|
||||
overflow: hidden;
|
||||
background: white;
|
||||
border-top-left-radius: 12px;
|
||||
border-top-right-radius: 12px;
|
||||
|
||||
&.showed {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.item-thumbnail {
|
||||
padding: 20px 20px 10px;
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
|
||||
.menu-options {
|
||||
margin-top: 10px;
|
||||
list-style: none;
|
||||
width: 100%;
|
||||
|
||||
.menu-option-group {
|
||||
padding: 5px 0;
|
||||
border-bottom: 1px solid $light_mode_border;
|
||||
|
||||
&:first-child {
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
padding-bottom: 0;
|
||||
border-bottom: none;
|
||||
}
|
||||
}
|
||||
|
||||
.menu-option {
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.15px;
|
||||
@include font-size(14);
|
||||
cursor: pointer;
|
||||
width: 100%;
|
||||
padding: 17px 20px;
|
||||
text-align: center;
|
||||
|
||||
&:last-child {
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
.vignette {
|
||||
background: $dark_mode_vignette;
|
||||
}
|
||||
|
||||
.options {
|
||||
background: $dark_mode_foreground;
|
||||
|
||||
.menu-options {
|
||||
background: $dark_mode_foreground;
|
||||
|
||||
.menu-option-group {
|
||||
border-color: $dark_mode_border_color;
|
||||
}
|
||||
|
||||
.menu-option {
|
||||
color: $dark_mode_text_primary;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Transition
|
||||
.context-menu-enter-active,
|
||||
.fade-enter-active {
|
||||
transition: all 200ms;
|
||||
}
|
||||
|
||||
.context-menu-leave-active,
|
||||
.fade-leave-active {
|
||||
transition: all 200ms;
|
||||
}
|
||||
|
||||
.fade-enter,
|
||||
.fade-leave-to {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.context-menu-enter,
|
||||
.context-menu-leave-to {
|
||||
opacity: 0;
|
||||
transform: translateY(100%);
|
||||
}
|
||||
|
||||
.context-menu-leave-active {
|
||||
position: absolute;
|
||||
}
|
||||
</style>
|
||||
@@ -1,76 +0,0 @@
|
||||
<template>
|
||||
<transition v-if="isVisible" name="preview-menu" >
|
||||
<SortingAndPreviewMenu class="options"/>
|
||||
</transition>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import SortingAndPreviewMenu from '@/components/FilesView/SortingAndPreviewMenu'
|
||||
import { events } from '@/bus'
|
||||
|
||||
export default {
|
||||
name: 'MobileSortingAndPreview',
|
||||
components: {SortingAndPreviewMenu},
|
||||
data () {
|
||||
return {
|
||||
isVisible: false
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
events.$on('mobileSortingAndPreview', (state) => {
|
||||
this.isVisible = state
|
||||
})
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
@import "@assets/vuefilemanager/_variables";
|
||||
@import "@assets/vuefilemanager/_mixins";
|
||||
|
||||
.options {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 99;
|
||||
overflow: hidden;
|
||||
background: white;
|
||||
border-top-left-radius: 12px;
|
||||
border-top-right-radius: 12px;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
.options {
|
||||
background: $dark_mode_foreground;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Transition
|
||||
.preview-menu-enter-active,
|
||||
.fade-enter-active {
|
||||
transition: all 200ms;
|
||||
}
|
||||
|
||||
.preview-menu-leave-active,
|
||||
.fade-leave-active {
|
||||
transition: all 200ms;
|
||||
}
|
||||
|
||||
.fade-enter,
|
||||
.fade-leave-to {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.preview-menu-enter,
|
||||
.preview-menu-leave-to {
|
||||
opacity: 0;
|
||||
transform: translateY(100%);
|
||||
}
|
||||
|
||||
.preview-menu-leave-active {
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
</style>
|
||||
@@ -51,7 +51,7 @@
|
||||
},
|
||||
methods: {
|
||||
showMobileNavigation() {
|
||||
events.$emit('show:mobile-navigation')
|
||||
events.$emit('mobile-navigation:show')
|
||||
events.$emit('mobileSelecting:stop')
|
||||
},
|
||||
goBack() {
|
||||
|
||||
@@ -1,27 +1,27 @@
|
||||
<template>
|
||||
<transition name="context-menu">
|
||||
<div class="multiselect-actions" v-if="mobileMultiSelect">
|
||||
<ToolbarButton class="action-btn" v-if="!$isThisLocation(['trash', 'trash-root' , 'shared', 'latest']) && $checkPermission('master') || $checkPermission('editor')" source="move" :action="$t('actions.move')" :class="{'is-inactive' : fileInfoDetail.length < 1}" @click.native="moveItem"/>
|
||||
<ToolbarButton class="action-btn" v-if="!$isThisLocation(['trash', 'trash-root' , 'shared', 'latest']) && $checkPermission('master') || $checkPermission('editor')" source="move" :action="$t('actions.move')" :class="{'is-inactive' : fileInfoDetail.length < 1}" @click.native="moveItem" />
|
||||
|
||||
<ToolbarButton class="action-btn" v-if="!$isThisLocation(['shared']) && $checkPermission('master') || $checkPermission('editor')" source="trash" :class="{'is-inactive' : fileInfoDetail.length < 1}" :action="$t('actions.delete')" @click.native="deleteItem"/>
|
||||
<ToolbarButton class="action-btn" v-if="!$isThisLocation(['shared']) && $checkPermission('master') || $checkPermission('editor')" source="trash" :class="{'is-inactive' : fileInfoDetail.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" :class="{'is-inactive': canDownloadItems}" :action="$t('actions.delete')" @click.native="downloadItem" />
|
||||
|
||||
<ToolbarButton class="action-btn" source="shared-off" @click.native="shareCancel" v-if="$isThisLocation(['shared'])"/>
|
||||
<ToolbarButton class="action-btn" source="shared-off" @click.native="shareCancel" v-if="$isThisLocation(['shared'])" />
|
||||
|
||||
<ToolbarButton class="action-btn close-icon" source="close" :action="$t('actions.close')" @click.native="closeSelecting"/>
|
||||
<ToolbarButton class="action-btn close-icon" source="close" :action="$t('actions.close')" @click.native="closeSelecting" />
|
||||
</div>
|
||||
</transition>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import ToolbarButton from '@/components/FilesView/ToolbarButton'
|
||||
import { events } from '@/bus'
|
||||
import { mapGetters } from 'vuex'
|
||||
import {events} from '@/bus'
|
||||
import {mapGetters} from 'vuex'
|
||||
|
||||
export default {
|
||||
name: 'MobileMultiSelectMenu',
|
||||
components: { ToolbarButton },
|
||||
name: 'MultiSelectToolbarMobile',
|
||||
components: {ToolbarButton},
|
||||
computed: {
|
||||
...mapGetters(['fileInfoDetail']),
|
||||
canDownloadItems() {
|
||||
@@ -34,7 +34,7 @@ export default {
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
shareCancel() {
|
||||
shareCancel() {
|
||||
this.$store.dispatch('shareCancel')
|
||||
this.closeSelecting()
|
||||
},
|
||||
@@ -51,7 +51,7 @@ export default {
|
||||
},
|
||||
moveItem() {
|
||||
// Open move item popup
|
||||
events.$emit('popup:open', { name: 'move', item: [this.fileInfoDetail[0]] })
|
||||
events.$emit('popup:open', {name: 'move', item: [this.fileInfoDetail[0]]})
|
||||
},
|
||||
deleteItem() {
|
||||
//Delete items
|
||||
@@ -120,37 +120,37 @@ export default {
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
@media (prefers-color-scheme: dark) {
|
||||
|
||||
.multiselect-actions {
|
||||
background: $dark_mode_foreground;
|
||||
}
|
||||
.multiselect-actions {
|
||||
background: $dark_mode_foreground;
|
||||
}
|
||||
}
|
||||
|
||||
// Transition
|
||||
.context-menu-enter-active,
|
||||
.fade-enter-active {
|
||||
transition: all 200ms;
|
||||
}
|
||||
// Transition
|
||||
.context-menu-enter-active,
|
||||
.fade-enter-active {
|
||||
transition: all 200ms;
|
||||
}
|
||||
|
||||
.context-menu-leave-active,
|
||||
.fade-leave-active {
|
||||
transition: all 200ms;
|
||||
}
|
||||
.context-menu-leave-active,
|
||||
.fade-leave-active {
|
||||
transition: all 200ms;
|
||||
}
|
||||
|
||||
.fade-enter,
|
||||
.fade-leave-to {
|
||||
opacity: 0;
|
||||
}
|
||||
.fade-enter,
|
||||
.fade-leave-to {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.context-menu-enter,
|
||||
.context-menu-leave-to {
|
||||
opacity: 0;
|
||||
transform: translateY(100%);
|
||||
}
|
||||
.context-menu-enter,
|
||||
.context-menu-leave-to {
|
||||
opacity: 0;
|
||||
transform: translateY(100%);
|
||||
}
|
||||
|
||||
.context-menu-leave-active {
|
||||
position: absolute;
|
||||
}
|
||||
.context-menu-leave-active {
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
</style>
|
||||
@@ -17,6 +17,7 @@
|
||||
<smile-icon v-if="icon === 'no-options'" size="17" class="group-hover-text-theme"/>
|
||||
<paperclip-icon v-if="icon === 'zip-folder'" size="17" class="group-hover-text-theme"/>
|
||||
<alphabet-icon v-if="icon === 'alphabet'" size="17" class="group-hover-text-theme"/>
|
||||
<star-icon v-if="icon === 'star'" size="17" class="group-hover-text-theme"/>
|
||||
</div>
|
||||
<div class="text-label group-hover-text-theme">
|
||||
{{ title }}
|
||||
|
||||
@@ -1,29 +1,29 @@
|
||||
<template>
|
||||
<ul class="link-group">
|
||||
<router-link :to="{name: link.routeName}" v-for="(link, i) in navigation" :key="i" v-if="link.isVisible" :class="link.icon" class="link-item" @click.native="$emit('menu', link.icon)">
|
||||
<li @click="goToItem(link)" v-for="(link, i) in navigation" :key="i" v-if="link.isVisible" :class="link.icon" class="link-item">
|
||||
<div class="menu-icon">
|
||||
<hard-drive-icon v-if="link.icon === 'hard-drive'" size="17"></hard-drive-icon>
|
||||
<share-icon v-if="link.icon === 'share'" size="17"></share-icon>
|
||||
<trash2-icon v-if="link.icon === 'trash'" size="17"></trash2-icon>
|
||||
<power-icon v-if="link.icon === 'power'" size="17"></power-icon>
|
||||
<settings-icon v-if="link.icon === 'settings'" size="17"></settings-icon>
|
||||
<upload-cloud-icon v-if="link.icon === 'latest'" size="17"></upload-cloud-icon>
|
||||
<user-icon v-if="link.icon === 'user'" size="17"></user-icon>
|
||||
<users-icon v-if="link.icon === 'users'" size="17"></users-icon>
|
||||
<lock-icon v-if="link.icon === 'lock'" size="17"></lock-icon>
|
||||
<file-text-icon v-if="link.icon === 'file-text'" size="17"></file-text-icon>
|
||||
<database-icon v-if="link.icon === 'database'" size="17"></database-icon>
|
||||
<credit-card-icon v-if="link.icon === 'credit-card'" size="17"></credit-card-icon>
|
||||
<cloud-icon v-if="link.icon === 'cloud'" size="17"></cloud-icon>
|
||||
<monitor-icon v-if="link.icon === 'monitor'" size="17"></monitor-icon>
|
||||
<box-icon v-if="link.icon === 'box'" size="17"></box-icon>
|
||||
<globe-icon v-if="link.icon === 'language'" size="17"></globe-icon>
|
||||
<hard-drive-icon v-if="link.icon === 'hard-drive'" size="17" />
|
||||
<share-icon v-if="link.icon === 'share'" size="17" />
|
||||
<trash2-icon v-if="link.icon === 'trash'" size="17" />
|
||||
<power-icon v-if="link.icon === 'power'" size="17" />
|
||||
<settings-icon v-if="link.icon === 'settings'" size="17" />
|
||||
<upload-cloud-icon v-if="link.icon === 'latest'" size="17" />
|
||||
<user-icon v-if="link.icon === 'user'" size="17" />
|
||||
<users-icon v-if="link.icon === 'users'" size="17" />
|
||||
<lock-icon v-if="link.icon === 'lock'" size="17" />
|
||||
<file-text-icon v-if="link.icon === 'file-text'" size="17" />
|
||||
<database-icon v-if="link.icon === 'database'" size="17" />
|
||||
<credit-card-icon v-if="link.icon === 'credit-card'" size="17" />
|
||||
<cloud-icon v-if="link.icon === 'cloud'" size="17" />
|
||||
<monitor-icon v-if="link.icon === 'monitor'" size="17" />
|
||||
<box-icon v-if="link.icon === 'box'" size="17" />
|
||||
<globe-icon v-if="link.icon === 'language'" size="17" />
|
||||
</div>
|
||||
<b class="menu-link">
|
||||
<span>{{ link.title }}</span>
|
||||
<chevron-right-icon size="15" class="arrow-right"></chevron-right-icon>
|
||||
<chevron-right-icon size="15" class="arrow-right"/>
|
||||
</b>
|
||||
</router-link>
|
||||
</li>
|
||||
</ul>
|
||||
</template>
|
||||
|
||||
@@ -49,7 +49,7 @@
|
||||
} from 'vue-feather-icons'
|
||||
|
||||
export default {
|
||||
name: 'MenuBar',
|
||||
name: 'MenuItemList',
|
||||
components: {
|
||||
BoxIcon,
|
||||
MonitorIcon,
|
||||
@@ -72,6 +72,15 @@
|
||||
props: [
|
||||
'navigation'
|
||||
],
|
||||
methods: {
|
||||
goToItem(link) {
|
||||
this.$emit('menu', link.icon)
|
||||
|
||||
// Go to next route
|
||||
if (link.routeName !== this.$route.name)
|
||||
this.$router.push({name: link.routeName})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -85,20 +94,6 @@
|
||||
padding: 17px 0;
|
||||
width: 100%;
|
||||
|
||||
&.power {
|
||||
|
||||
.menu-icon {
|
||||
|
||||
path, line, polyline, rect, circle, ellipse {
|
||||
stroke: $red;
|
||||
}
|
||||
}
|
||||
|
||||
.menu-link {
|
||||
color: $red;
|
||||
}
|
||||
}
|
||||
|
||||
.menu-icon {
|
||||
display: block;
|
||||
margin-right: 20px;
|
||||
|
||||
93
resources/js/components/Mobile/MenuMobile.vue
Normal file
93
resources/js/components/Mobile/MenuMobile.vue
Normal file
@@ -0,0 +1,93 @@
|
||||
<template>
|
||||
<transition name="context-menu">
|
||||
<div v-if="isVisible" @click="closeMenu" class="options">
|
||||
<slot></slot>
|
||||
</div>
|
||||
</transition>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {events} from '@/bus'
|
||||
|
||||
export default {
|
||||
name: 'MenuMobile',
|
||||
props: [
|
||||
'name'
|
||||
],
|
||||
data() {
|
||||
return {
|
||||
isVisible: false,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
closeMenu() {
|
||||
this.isVisible = false
|
||||
|
||||
events.$emit('mobile-menu:hide')
|
||||
}
|
||||
},
|
||||
created() {
|
||||
events.$on('mobile-menu:show', name => {
|
||||
if (name === this.name)
|
||||
this.isVisible = !this.isVisible
|
||||
})
|
||||
|
||||
events.$on('mobile-menu:hide', () => this.isVisible = false)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
@import "@assets/vuefilemanager/_variables";
|
||||
@import "@assets/vuefilemanager/_mixins";
|
||||
|
||||
.options {
|
||||
position: absolute;
|
||||
padding-bottom: 12px;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 99;
|
||||
overflow: hidden;
|
||||
background: white;
|
||||
border-top-left-radius: 12px;
|
||||
border-top-right-radius: 12px;
|
||||
|
||||
&.showed {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
// Transition
|
||||
.context-menu-enter-active,
|
||||
.fade-enter-active {
|
||||
transition: all 200ms;
|
||||
}
|
||||
|
||||
.context-menu-leave-active,
|
||||
.fade-leave-active {
|
||||
transition: all 200ms;
|
||||
}
|
||||
|
||||
.fade-enter,
|
||||
.fade-leave-to {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.context-menu-enter,
|
||||
.context-menu-leave-to {
|
||||
opacity: 0;
|
||||
transform: translateY(100%);
|
||||
}
|
||||
|
||||
.context-menu-leave-active {
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
|
||||
.options {
|
||||
background: $dark_mode_foreground;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
35
resources/js/components/Mobile/MenuMobileGroup.vue
Normal file
35
resources/js/components/Mobile/MenuMobileGroup.vue
Normal file
@@ -0,0 +1,35 @@
|
||||
<template>
|
||||
<div class="menu-options">
|
||||
<slot></slot>
|
||||
</div>
|
||||
</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";
|
||||
|
||||
.menu-options {
|
||||
margin-top: 10px;
|
||||
list-style: none;
|
||||
width: 100%;
|
||||
}
|
||||
</style>
|
||||
@@ -25,7 +25,7 @@
|
||||
} from 'vue-feather-icons'
|
||||
|
||||
export default {
|
||||
name: 'MenuBar',
|
||||
name: 'MobileHeader',
|
||||
props: [
|
||||
'title'
|
||||
],
|
||||
@@ -35,7 +35,7 @@
|
||||
},
|
||||
methods: {
|
||||
showMobileNavigation() {
|
||||
events.$emit('show:mobile-navigation')
|
||||
events.$emit('mobile-navigation:show')
|
||||
},
|
||||
goBack() {
|
||||
this.$router.back();
|
||||
|
||||
@@ -55,7 +55,7 @@
|
||||
import {events} from '@/bus'
|
||||
|
||||
export default {
|
||||
name: 'CreateFolder',
|
||||
name: 'CreateFolderPopup',
|
||||
components: {
|
||||
ValidationProvider,
|
||||
ValidationObserver,
|
||||
61
resources/js/components/Others/FilePreviewDetail.vue
Normal file
61
resources/js/components/Others/FilePreviewDetail.vue
Normal file
@@ -0,0 +1,61 @@
|
||||
<template>
|
||||
<div v-if="canBePreview" class="preview">
|
||||
<img v-if="fileInfoDetail[0].type == 'image' && fileInfoDetail[0].thumbnail" :src="fileInfoDetail[0].thumbnail" :alt="fileInfoDetail[0].name" />
|
||||
<audio v-else-if="fileInfoDetail[0].type == 'audio'" :src="fileInfoDetail[0].file_url" controlsList="nodownload" controls></audio>
|
||||
<video v-else-if="fileInfoDetail[0].type == 'video'" controlsList="nodownload" disablePictureInPicture playsinline controls>
|
||||
<source :src="fileInfoDetail[0].file_url" type="video/mp4">
|
||||
</video>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapGetters } from 'vuex'
|
||||
import { includes } from 'lodash'
|
||||
|
||||
export default {
|
||||
name: 'FilePreview',
|
||||
computed: {
|
||||
...mapGetters(['fileInfoDetail']),
|
||||
canBePreview() {
|
||||
return this.fileInfoDetail[0] && ! includes([
|
||||
'folder', 'file'
|
||||
], this.fileInfoDetail[0].type)
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
@import '@assets/vuefilemanager/_variables';
|
||||
@import '@assets/vuefilemanager/_mixins';
|
||||
|
||||
.preview {
|
||||
width: 100%;
|
||||
display: block;
|
||||
margin-bottom: 7px;
|
||||
|
||||
img {
|
||||
border-radius: 4px;
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
audio {
|
||||
width: 100%;
|
||||
&::-webkit-media-controls-panel {
|
||||
background-color: $light_background;
|
||||
}
|
||||
|
||||
&::-webkit-media-controls-play-button {
|
||||
color: $theme;
|
||||
}
|
||||
}
|
||||
|
||||
video {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
border-radius: 3px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -4,25 +4,18 @@
|
||||
<nav v-if="isVisible" class="mobile-navigation">
|
||||
|
||||
<!--User Info-->
|
||||
<div class="user-info">
|
||||
<UserAvatar size="large"/>
|
||||
<UserHeadline/>
|
||||
</div>
|
||||
<UserHeadline class="user-info"/>
|
||||
|
||||
<!--Navigation-->
|
||||
<MenuItemList :navigation="navigation" @menu="action"/>
|
||||
</nav>
|
||||
</transition>
|
||||
<transition name="fade">
|
||||
<div v-show="isVisible" class="vignette" @click="closeAndResetContextMenu"></div>
|
||||
</transition>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import UserHeadline from '@/components/Sidebar/UserHeadline'
|
||||
import MenuItemList from '@/components/Mobile/MenuItemList'
|
||||
import UserAvatar from '@/components/Others/UserAvatar'
|
||||
import {mapGetters} from 'vuex'
|
||||
import {events} from '@/bus'
|
||||
|
||||
@@ -31,7 +24,6 @@
|
||||
components: {
|
||||
MenuItemList,
|
||||
UserHeadline,
|
||||
UserAvatar,
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['user', 'homeDirectory']),
|
||||
@@ -43,7 +35,7 @@
|
||||
routeName: 'Files',
|
||||
isVisible: true,
|
||||
},
|
||||
{
|
||||
/*{
|
||||
icon: 'latest',
|
||||
title: this.$t('menu.latest'),
|
||||
routeName: 'Files',
|
||||
@@ -60,7 +52,7 @@
|
||||
title: this.$t('menu.trash'),
|
||||
routeName: 'Files',
|
||||
isVisible: true,
|
||||
},
|
||||
},*/
|
||||
{
|
||||
icon: 'user',
|
||||
title: this.$t('menu.settings'),
|
||||
@@ -90,13 +82,13 @@
|
||||
methods: {
|
||||
action(name) {
|
||||
|
||||
if (name === 'latest') {
|
||||
/*if (name === 'latest') {
|
||||
this.$store.dispatch('getLatest')
|
||||
}
|
||||
|
||||
if (name === 'trash') {
|
||||
this.$store.dispatch('getTrash')
|
||||
}
|
||||
}*/
|
||||
|
||||
if (name === 'hard-drive') {
|
||||
this.$store.dispatch('getFolder', [{folder: this.homeDirectory, back: false, init: true}])
|
||||
@@ -106,18 +98,12 @@
|
||||
this.$store.dispatch('logOut')
|
||||
}
|
||||
|
||||
this.closeAndResetContextMenu()
|
||||
events.$emit('mobile-navigation:hide')
|
||||
},
|
||||
closeAndResetContextMenu() {
|
||||
this.isVisible = false
|
||||
|
||||
events.$emit('hide:mobile-navigation')
|
||||
}
|
||||
},
|
||||
created() {
|
||||
events.$on('show:mobile-navigation', () => {
|
||||
this.isVisible = true
|
||||
})
|
||||
events.$on('mobile-navigation:show', () => this.isVisible = true)
|
||||
events.$on('mobile-navigation:hide', () => this.isVisible = false)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -137,33 +123,14 @@
|
||||
background: white;
|
||||
border-top-left-radius: 12px;
|
||||
border-top-right-radius: 12px;
|
||||
min-height: 440px;
|
||||
max-height: 80%;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.vignette {
|
||||
background: rgba(0, 0, 0, 0.35);
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
z-index: 9;
|
||||
cursor: pointer;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.user-info {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 690px) {
|
||||
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
.mobile-navigation {
|
||||
background: $dark_mode_background;
|
||||
|
||||
@@ -54,7 +54,7 @@
|
||||
import {events} from '@/bus'
|
||||
|
||||
export default {
|
||||
name: 'MoveItem',
|
||||
name: 'MoveItemPopup',
|
||||
components: {
|
||||
ThumbnailItem,
|
||||
PopupWrapper,
|
||||
@@ -1,6 +1,5 @@
|
||||
<template>
|
||||
<PopupWrapper>
|
||||
|
||||
<div class="popup-image">
|
||||
<span class="emoji">{{ emoji }}</span>
|
||||
</div>
|
||||
@@ -59,7 +59,7 @@ import {required} from 'vee-validate/dist/rules'
|
||||
import {events} from '@/bus'
|
||||
|
||||
export default {
|
||||
name: 'RenameItem',
|
||||
name: 'RenameItemPopup',
|
||||
components: {
|
||||
ValidationProvider,
|
||||
ValidationObserver,
|
||||
@@ -112,7 +112,7 @@ import {events} from '@/bus'
|
||||
import axios from 'axios'
|
||||
|
||||
export default {
|
||||
name: 'ShareCreate',
|
||||
name: 'ShareCreatePopup',
|
||||
components: {
|
||||
ValidationProvider,
|
||||
ValidationObserver,
|
||||
@@ -115,7 +115,7 @@
|
||||
import axios from 'axios'
|
||||
|
||||
export default {
|
||||
name: 'ShareEdit',
|
||||
name: 'ShareEditPopup',
|
||||
components: {
|
||||
ValidationProvider,
|
||||
ValidationObserver,
|
||||
@@ -26,22 +26,23 @@
|
||||
methods: {
|
||||
closePopup() {
|
||||
events.$emit('popup:close')
|
||||
events.$emit('mobileMenu:hide')
|
||||
events.$emit('mobileSortingAndPreview', false)
|
||||
events.$emit('mobile-menu:hide')
|
||||
events.$emit('mobile-navigation:hide')
|
||||
}
|
||||
},
|
||||
created() {
|
||||
|
||||
// Hide vignette
|
||||
events.$on('popup:close', () => this.isVisibleVignette = false)
|
||||
|
||||
// Show vignette
|
||||
events.$on('popup:open', () => this.isVisibleVignette = true)
|
||||
events.$on('mobile-menu:show', () => this.isVisibleVignette = true)
|
||||
events.$on('alert:open', () => this.isVisibleVignette = true)
|
||||
events.$on('success:open', () => this.isVisibleVignette = true)
|
||||
events.$on('confirm:open', () => this.isVisibleVignette = true)
|
||||
events.$on('mobileSortingAndPreviewVignette', (state) => this.isVisibleVignette = state)
|
||||
events.$on('mobile-navigation:show', () => this.isVisibleVignette = true)
|
||||
|
||||
// Hide vignette
|
||||
events.$on('mobile-navigation:hide', () => this.isVisibleVignette = false)
|
||||
events.$on('mobile-menu:hide', () => this.isVisibleVignette = false)
|
||||
events.$on('popup:close', () => this.isVisibleVignette = false)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -57,7 +57,7 @@
|
||||
} from 'vue-feather-icons'
|
||||
|
||||
export default {
|
||||
name: 'MenuBar',
|
||||
name: 'SidebarNavigation',
|
||||
components: {
|
||||
HardDriveIcon,
|
||||
SettingsIcon,
|
||||
@@ -1,18 +1,26 @@
|
||||
<template>
|
||||
<div class="user-meta" v-if="user">
|
||||
<b class="name">{{ user.data.relationships.settings.data.attributes.name }}</b>
|
||||
<span class="email text-theme">{{ user.data.attributes.email }}</span>
|
||||
<div class="user-headline">
|
||||
<UserAvatar size="large"/>
|
||||
<div class="user-meta">
|
||||
<b class="name">{{ user.data.relationships.settings.data.attributes.name }}</b>
|
||||
<span class="email text-theme">{{ user.data.attributes.email }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import UserAvatar from '@/components/Others/UserAvatar'
|
||||
import { mapGetters } from 'vuex'
|
||||
import {events} from '@/bus'
|
||||
|
||||
export default {
|
||||
name: 'UserHeadline',
|
||||
components: {
|
||||
UserAvatar,
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['user']),
|
||||
...mapGetters([
|
||||
'user'
|
||||
]),
|
||||
},
|
||||
}
|
||||
</script>
|
||||
@@ -21,6 +29,11 @@
|
||||
@import '@assets/vuefilemanager/_variables';
|
||||
@import '@assets/vuefilemanager/_mixins';
|
||||
|
||||
.user-headline {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.user-meta {
|
||||
padding-left: 20px;
|
||||
|
||||
@@ -35,12 +48,4 @@
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 690px) {
|
||||
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -4,14 +4,14 @@
|
||||
<!--Mobile Navigation-->
|
||||
<MobileNavigation />
|
||||
|
||||
<!--Confirm Popup-->
|
||||
<Confirm />
|
||||
<!--ConfirmPopup Popup-->
|
||||
<ConfirmPopup />
|
||||
|
||||
<!-- Create language popup -->
|
||||
<CreateLanguage/>
|
||||
|
||||
<!--Navigation Sidebar-->
|
||||
<MenuBar/>
|
||||
<SidebarNavigation/>
|
||||
|
||||
<ContentSidebar>
|
||||
|
||||
@@ -90,12 +90,12 @@
|
||||
|
||||
<script>
|
||||
import { UsersIcon, SettingsIcon, FileTextIcon, CreditCardIcon, DatabaseIcon, BoxIcon, MonitorIcon, GlobeIcon } from 'vue-feather-icons'
|
||||
import SidebarNavigation from '@/components/Sidebar/SidebarNavigation'
|
||||
import MobileNavigation from '@/components/Others/MobileNavigation'
|
||||
import ContentSidebar from '@/components/Sidebar/ContentSidebar'
|
||||
import CreateLanguage from '@/components/Others/CreateLanguage'
|
||||
import ContentGroup from '@/components/Sidebar/ContentGroup'
|
||||
import Confirm from '@/components/Others/Popup/Confirm'
|
||||
import MenuBar from '@/components/Sidebar/MenuBar'
|
||||
import ConfirmPopup from '@/components/Others/Popup/ConfirmPopup'
|
||||
import { mapGetters } from 'vuex'
|
||||
|
||||
export default {
|
||||
@@ -104,6 +104,7 @@
|
||||
...mapGetters(['config']),
|
||||
},
|
||||
components: {
|
||||
SidebarNavigation,
|
||||
MobileNavigation,
|
||||
CreateLanguage,
|
||||
ContentSidebar,
|
||||
@@ -115,8 +116,7 @@
|
||||
MonitorIcon,
|
||||
UsersIcon,
|
||||
GlobeIcon,
|
||||
Confirm,
|
||||
MenuBar,
|
||||
ConfirmPopup,
|
||||
BoxIcon,
|
||||
},
|
||||
}
|
||||
|
||||
@@ -1,118 +1,102 @@
|
||||
<template>
|
||||
<div id="application-wrapper">
|
||||
|
||||
<!--Full File Preview-->
|
||||
<FileFullPreview />
|
||||
<!--File preview window-->
|
||||
<FilePreview />
|
||||
|
||||
<!--Mobile Navigation-->
|
||||
<MobileNavigation />
|
||||
|
||||
<!--Processing popup-->
|
||||
<!--Popups-->
|
||||
<ProcessingPopup />
|
||||
<ConfirmPopup />
|
||||
|
||||
<!--Confirm Popup-->
|
||||
<Confirm />
|
||||
<ShareCreatePopup />
|
||||
<ShareEditPopup />
|
||||
|
||||
<!--Share Item popup-->
|
||||
<ShareCreate />
|
||||
<ShareEdit />
|
||||
<CreateFolderPopup />
|
||||
<RenameItemPopup />
|
||||
|
||||
<!--Rename folder/file item-->
|
||||
<RenameItem />
|
||||
<MoveItemPopup />
|
||||
|
||||
<!--Create folder mobile UI-->
|
||||
<CreateFolder />
|
||||
<!--Mobile components-->
|
||||
<FileSortingMobile />
|
||||
<FileMenuMobile />
|
||||
|
||||
<!--Move item popup-->
|
||||
<MoveItem />
|
||||
<MultiSelectToolbarMobile />
|
||||
|
||||
<!-- Mobile Menu for Multi selected items -->
|
||||
<MobileMultiSelectMenu />
|
||||
<!--Navigations-->
|
||||
<MobileNavigation />
|
||||
<SidebarNavigation />
|
||||
|
||||
<!--Drag UI-->
|
||||
<!--Others-->
|
||||
<DragUI />
|
||||
|
||||
<!--Mobile menu for selecting view and sorting-->
|
||||
<MobileSortingAndPreview />
|
||||
|
||||
<!--Mobile Menu-->
|
||||
<MobileMenu />
|
||||
|
||||
<!--Navigation Sidebar-->
|
||||
<MenuBar />
|
||||
|
||||
<!--File page-->
|
||||
<keep-alive :include="['Admin', 'Users']">
|
||||
<router-view :class="{'is-scaled-down': isScaledDown}" />
|
||||
</keep-alive>
|
||||
<router-view :class="{'is-scaled-down': isScaledDown}" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import MobileSortingAndPreview from '@/components/FilesView/MobileSortingAndPreview'
|
||||
import MobileMultiSelectMenu from '@/components/FilesView/MobileMultiSelectMenu'
|
||||
import ProcessingPopup from '@/components/FilesView/ProcessingPopup'
|
||||
import FileFullPreview from '@/components/FilesView/FileFullPreview'
|
||||
import MobileNavigation from '@/components/Others/MobileNavigation'
|
||||
import CreateFolder from '@/components/Others/CreateFolder'
|
||||
import MobileMenu from '@/components/FilesView/MobileMenu'
|
||||
import ShareCreate from '@/components/Others/ShareCreate'
|
||||
import Confirm from '@/components/Others/Popup/Confirm'
|
||||
import RenameItem from '@/components/Others/RenameItem'
|
||||
import ShareEdit from '@/components/Others/ShareEdit'
|
||||
import MoveItem from '@/components/Others/MoveItem'
|
||||
import DragUI from '@/components/FilesView/DragUI'
|
||||
import MenuBar from '@/components/Sidebar/MenuBar'
|
||||
import {includes} from 'lodash'
|
||||
import {mapGetters} from 'vuex'
|
||||
import {events} from '@/bus'
|
||||
import MultiSelectToolbarMobile from '@/components/FilesView/MultiSelectToolbarMobile'
|
||||
import FileSortingMobile from '@/components/FilesView/FileSortingMobile'
|
||||
import SidebarNavigation from '@/components/Sidebar/SidebarNavigation'
|
||||
import CreateFolderPopup from '@/components/Others/CreateFolderPopup'
|
||||
import ProcessingPopup from '@/components/FilesView/ProcessingPopup'
|
||||
import MobileNavigation from '@/components/Others/MobileNavigation'
|
||||
import ShareCreatePopup from '@/components/Others/ShareCreatePopup'
|
||||
import FileMenuMobile from '@/components/FilesView/FileMenuMobile'
|
||||
import ConfirmPopup from '@/components/Others/Popup/ConfirmPopup'
|
||||
import RenameItemPopup from '@/components/Others/RenameItemPopup'
|
||||
import ShareEditPopup from '@/components/Others/ShareEditPopup'
|
||||
import MoveItemPopup from '@/components/Others/MoveItemPopup'
|
||||
import FilePreview from '@/components/FilesView/FilePreview'
|
||||
import DragUI from '@/components/FilesView/DragUI'
|
||||
import {mapGetters} from 'vuex'
|
||||
import {events} from '@/bus'
|
||||
|
||||
export default {
|
||||
name: 'Platform',
|
||||
components: {
|
||||
MobileSortingAndPreview,
|
||||
MobileMultiSelectMenu,
|
||||
MobileNavigation,
|
||||
FileFullPreview,
|
||||
ProcessingPopup,
|
||||
CreateFolder,
|
||||
ShareCreate,
|
||||
MobileMenu,
|
||||
RenameItem,
|
||||
ShareEdit,
|
||||
MoveItem,
|
||||
Confirm,
|
||||
MenuBar,
|
||||
DragUI,
|
||||
},
|
||||
computed: {
|
||||
...mapGetters([
|
||||
'config'
|
||||
]),
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
isScaledDown: false
|
||||
export default {
|
||||
name: 'Platform',
|
||||
components: {
|
||||
MultiSelectToolbarMobile,
|
||||
CreateFolderPopup,
|
||||
FileSortingMobile,
|
||||
SidebarNavigation,
|
||||
MobileNavigation,
|
||||
ShareCreatePopup,
|
||||
ProcessingPopup,
|
||||
RenameItemPopup,
|
||||
ShareEditPopup,
|
||||
FileMenuMobile,
|
||||
MoveItemPopup,
|
||||
ConfirmPopup,
|
||||
FilePreview,
|
||||
DragUI,
|
||||
},
|
||||
computed: {
|
||||
...mapGetters([
|
||||
'config'
|
||||
]),
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
isScaledDown: false
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
events.$on('mobile-navigation:show', () => this.isScaledDown = true)
|
||||
events.$on('mobile-menu:show', () => this.isScaledDown = true)
|
||||
|
||||
events.$on('mobile-navigation:hide', () => this.isScaledDown = false)
|
||||
events.$on('fileItem:deselect', () => this.isScaledDown = false)
|
||||
events.$on('mobile-menu:hide', () => this.isScaledDown = false)
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
events.$on('show:mobile-navigation', () => this.isScaledDown = true)
|
||||
events.$on('hide:mobile-navigation', () => this.isScaledDown = false)
|
||||
events.$on('mobileMenu:show', () => this.isScaledDown = true)
|
||||
events.$on('fileItem:deselect', () => this.isScaledDown = false)
|
||||
events.$on('mobileSortingAndPreview', state => this.isScaledDown = state)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@import '@assets/vuefilemanager/_variables';
|
||||
@import '@assets/vuefilemanager/_mixins';
|
||||
@import '@assets/vuefilemanager/_mixins';
|
||||
|
||||
@media only screen and (max-width: 690px) {
|
||||
@media only screen and (max-width: 690px) {
|
||||
|
||||
.is-scaled-down {
|
||||
@include transform(scale(0.95));
|
||||
.is-scaled-down {
|
||||
@include transform(scale(0.95));
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,108 +1,114 @@
|
||||
<template>
|
||||
<div id="application-wrapper">
|
||||
|
||||
<!--Full File Preview-->
|
||||
<FileFullPreview />
|
||||
|
||||
<!--Loading Spinner-->
|
||||
<Spinner v-if="isLoading" />
|
||||
|
||||
<!--Move item popup-->
|
||||
<MoveItem />
|
||||
<!--File preview window-->
|
||||
<FilePreview />
|
||||
|
||||
<!-- Processing popup for zip -->
|
||||
<!--Popups-->
|
||||
<ProcessingPopup />
|
||||
|
||||
<!-- Mobile Menu for Multi selected items -->
|
||||
<MobileMultiSelectMenu />
|
||||
<CreateFolderPopup />
|
||||
<RenameItemPopup />
|
||||
|
||||
<!--Rename folder/file item-->
|
||||
<RenameItem />
|
||||
<MoveItemPopup />
|
||||
|
||||
<!--Create folder mobile UI-->
|
||||
<CreateFolder />
|
||||
<!-- Mobile components -->
|
||||
<FileSortingMobile />
|
||||
<FileMenuMobile />
|
||||
|
||||
<!--Drag UI-->
|
||||
<MultiSelectToolbarMobile />
|
||||
|
||||
<!--Others-->
|
||||
<Vignette />
|
||||
<DragUI />
|
||||
|
||||
<!--Mobile Menu-->
|
||||
<MobileMenu />
|
||||
|
||||
<!--Mobile menu for selecting view and sorting-->
|
||||
<MobileSortingAndPreview />
|
||||
|
||||
<!--System alerts-->
|
||||
<Alert />
|
||||
|
||||
<!--Background vignette-->
|
||||
<Vignette />
|
||||
|
||||
<!--Pages-->
|
||||
<router-view />
|
||||
<router-view :class="{'is-scaled-down': isScaledDown}" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import MobileSortingAndPreview from '@/components/FilesView/MobileSortingAndPreview'
|
||||
import MobileMultiSelectMenu from '@/components/FilesView/MobileMultiSelectMenu'
|
||||
import ProcessingPopup from '@/components/FilesView/ProcessingPopup'
|
||||
import FileFullPreview from '@/components/FilesView/FileFullPreview'
|
||||
import CreateFolder from '@/components/Others/CreateFolder'
|
||||
import MobileMenu from '@/components/FilesView/MobileMenu'
|
||||
import RenameItem from '@/components/Others/RenameItem'
|
||||
import Spinner from '@/components/FilesView/Spinner'
|
||||
import MoveItem from '@/components/Others/MoveItem'
|
||||
import Vignette from '@/components/Others/Vignette'
|
||||
import DragUI from '@/components/FilesView/DragUI'
|
||||
import Alert from '@/components/FilesView/Alert'
|
||||
import {mapGetters} from 'vuex'
|
||||
import MultiSelectToolbarMobile from '@/components/FilesView/MultiSelectToolbarMobile'
|
||||
import FileSortingMobile from '@/components/FilesView/FileSortingMobile'
|
||||
import CreateFolderPopup from '@/components/Others/CreateFolderPopup'
|
||||
import ProcessingPopup from '@/components/FilesView/ProcessingPopup'
|
||||
import FileMenuMobile from '@/components/FilesView/FileMenuMobile'
|
||||
import RenameItemPopup from '@/components/Others/RenameItemPopup'
|
||||
import MoveItemPopup from '@/components/Others/MoveItemPopup'
|
||||
import FilePreview from '@/components/FilesView/FilePreview'
|
||||
import Spinner from '@/components/FilesView/Spinner'
|
||||
import Vignette from '@/components/Others/Vignette'
|
||||
import DragUI from '@/components/FilesView/DragUI'
|
||||
import Alert from '@/components/FilesView/Alert'
|
||||
import {events} from '@/bus'
|
||||
import {mapGetters} from 'vuex'
|
||||
|
||||
export default {
|
||||
name: 'Platform',
|
||||
components: {
|
||||
MobileSortingAndPreview,
|
||||
MobileMultiSelectMenu,
|
||||
FileFullPreview,
|
||||
ProcessingPopup,
|
||||
CreateFolder,
|
||||
MobileMenu,
|
||||
RenameItem,
|
||||
MoveItem,
|
||||
Vignette,
|
||||
Spinner,
|
||||
DragUI,
|
||||
Alert,
|
||||
},
|
||||
computed: {
|
||||
...mapGetters([
|
||||
'config'
|
||||
]),
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
isLoading: true,
|
||||
export default {
|
||||
name: 'Platform',
|
||||
components: {
|
||||
MultiSelectToolbarMobile,
|
||||
CreateFolderPopup,
|
||||
FileSortingMobile,
|
||||
ProcessingPopup,
|
||||
RenameItemPopup,
|
||||
FileMenuMobile,
|
||||
MoveItemPopup,
|
||||
FilePreview,
|
||||
Vignette,
|
||||
Spinner,
|
||||
DragUI,
|
||||
Alert,
|
||||
},
|
||||
computed: {
|
||||
...mapGetters([
|
||||
'config'
|
||||
]),
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
isLoading: true,
|
||||
isScaledDown: false
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
events.$on('mobile-navigation:show', () => this.isScaledDown = true)
|
||||
events.$on('mobile-navigation:hide', () => this.isScaledDown = false)
|
||||
events.$on('mobile-menu:show', () => this.isScaledDown = true)
|
||||
events.$on('fileItem:deselect', () => this.isScaledDown = false)
|
||||
|
||||
this.$store.dispatch('getShareDetail', this.$route.params.token)
|
||||
.then(response => {
|
||||
this.isLoading = false
|
||||
|
||||
// Show public file browser
|
||||
if (response.data.data.attributes.type === 'folder' && !response.data.data.attributes.is_protected && this.$router.currentRoute.name !== 'SharedFileBrowser') {
|
||||
this.$router.push({name: 'SharedFileBrowser'})
|
||||
}
|
||||
|
||||
// Show public single file
|
||||
if (response.data.data.attributes.type !== 'folder' && !response.data.data.attributes.is_protected && this.$router.currentRoute.name !== 'SharedSingleFile') {
|
||||
this.$router.push({name: 'SharedSingleFile'})
|
||||
}
|
||||
|
||||
// Show authentication page
|
||||
if (response.data.data.attributes.is_protected && this.$router.currentRoute.name !== 'SharedAuthentication') {
|
||||
this.$router.push({name: 'SharedAuthentication'})
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$store.dispatch('getShareDetail', this.$route.params.token)
|
||||
.then(response => {
|
||||
this.isLoading = false
|
||||
|
||||
// Show public file browser
|
||||
if (response.data.data.attributes.type === 'folder' && !response.data.data.attributes.is_protected && this.$router.currentRoute.name !== 'SharedFileBrowser') {
|
||||
this.$router.push({name: 'SharedFileBrowser'})
|
||||
}
|
||||
|
||||
// Show public single file
|
||||
if (response.data.data.attributes.type !== 'folder' && !response.data.data.attributes.is_protected && this.$router.currentRoute.name !== 'SharedSingleFile') {
|
||||
this.$router.push({name: 'SharedSingleFile'})
|
||||
}
|
||||
|
||||
// Show authentication page
|
||||
if (response.data.data.attributes.is_protected && this.$router.currentRoute.name !== 'SharedAuthentication') {
|
||||
this.$router.push({name: 'SharedAuthentication'})
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@import '@assets/vuefilemanager/_mixins';
|
||||
|
||||
@media only screen and (max-width: 690px) {
|
||||
|
||||
.is-scaled-down {
|
||||
@include transform(scale(0.95));
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -50,7 +50,7 @@
|
||||
{{-- Emoji Picker --}}
|
||||
.active-menu.focus-border-theme {border-color: {{ $color }} !important;}
|
||||
|
||||
{{-- Menubar --}}
|
||||
{{-- Sidebar Navigation --}}
|
||||
.router-link-active.home .button-icon {background: {{ $color }}10}
|
||||
|
||||
{{-- Content Panel --}}
|
||||
|
||||
4
webpack.mix.js
vendored
4
webpack.mix.js
vendored
@@ -33,12 +33,12 @@ mix.js('resources/js/main.js', 'public/js')
|
||||
clientLogLevel: 'none'
|
||||
}
|
||||
})
|
||||
/*.options({
|
||||
.options({
|
||||
hmrOptions: {
|
||||
host: '192.168.1.198',
|
||||
port: '8080'
|
||||
},
|
||||
})*/
|
||||
})
|
||||
.disableNotifications();
|
||||
|
||||
if (mix.inProduction()) {
|
||||
|
||||
Reference in New Issue
Block a user