add SetFolderIcon for CreateFolder on mobile device, change SetFolderIcon payload

This commit is contained in:
Milos Holba
2021-02-26 17:14:21 +01:00
parent 7a963cf5b3
commit 7dd4e65d77
11 changed files with 87 additions and 65 deletions

View File

@@ -116,9 +116,9 @@ class EditItemsController extends Controller
}
// If request have a change folder icon values set the folder icon
if ($request->type === 'folder' && $request->filled('folder_icon')) {
if ($request->type === 'folder' && $request->filled('icon')) {
Editor::set_folder_icon($request->folder_icon, $unique_id);
Editor::set_folder_icon($request->icon, $unique_id);
}
// Rename Item
@@ -158,9 +158,9 @@ class EditItemsController extends Controller
}
// If request have a change folder icon values set the folder icon
if ($request->type === 'folder' && $request->filled('folder_icon')) {
if ($request->type === 'folder' && $request->filled('icon')) {
Editor::set_folder_icon($request->folder_icon, $unique_id, $shared);
Editor::set_folder_icon($request->icon, $unique_id, $shared);
}
// Rename item

View File

@@ -42,6 +42,8 @@ class Demo
'unique_id' => random_int(1000, 9999),
'user_scope' => $user_scope,
'items' => '0',
'icon_color' => isset($request->icon['color']) ? $request->icon['color'] : null,
'icon_emoji' => isset($request->icon['emoji']) ? $request->icon['emoji'] : null,
'updated_at' => Carbon::now()->format('j M Y \a\t H:i'),
'created_at' => Carbon::now()->format('j M Y \a\t H:i'),
];
@@ -72,8 +74,8 @@ class Demo
if ($item) {
$item->name = $request->name;
$item->icon_emoji = $request->folder_icon['emoji'] ?? null;
$item->icon_color = $request->folder_icon['color'] ?? null;
$item->icon_emoji = $request->icon['emoji'] ?? null;
$item->icon_color = $request->icon['color'] ?? null;
return $item;

View File

@@ -29,11 +29,11 @@ class Editor
/**
* Store folder icon
*
* @param $folder_icon
* @param $icon
* @param $unique_id
* @param $shared
*/
public static function set_folder_icon($folder_icon, $unique_id, $shared = null)
public static function set_folder_icon($icon, $unique_id, $shared = null)
{
$user_id = is_null($shared) ? Auth::id() : $shared->user_id;
@@ -43,21 +43,21 @@ class Editor
->first();
// Set default folder icon
if ($folder_icon === 'default') {
if ($icon === 'default') {
$folder->icon_emoji = null;
$folder->icon_color = null;
}
// If request have emoji set folder icon emoji
if (isset($folder_icon['emoji'])) {
$folder->icon_emoji = $folder_icon['emoji'];
if (isset($icon['emoji'])) {
$folder->icon_emoji = $icon['emoji'];
$folder->icon_color = null;
}
// If request have color set folder icon color
if (isset($folder_icon['color'])) {
if (isset($icon['color'])) {
$folder->icon_emoji = null;
$folder->icon_color = $folder_icon['color'];
$folder->icon_color = $icon['color'];
}
// Save changes
@@ -235,6 +235,8 @@ class Editor
'user_id' => $user_id,
'type' => 'folder',
'name' => $name,
'icon_color' => isset($request->icon['color']) ? $request->icon['color'] : null,
'icon_emoji' => isset($request->icon['emoji']) ? $request->icon['emoji'] : null,
]);
// Return new folder

View File

@@ -2,7 +2,6 @@
namespace App\Notifications;
use App\Setting;
use Illuminate\Bus\Queueable;
use Illuminate\Contracts\Queue\ShouldQueue;
use Illuminate\Notifications\Messages\MailMessage;
@@ -42,17 +41,15 @@ class ResetPassword extends Notification
public function toMail($notifiable)
{
$reset_url = url('/create-new-password?token=' . $this->token);
$get_name = strval(Setting::where('name', 'app_title')->pluck('value')[0]);
$app_name = $get_name ? $get_name : 'VueFileManager';
$app_name = get_setting('app_title') ?? 'VueFileManager';
return (new MailMessage)
->subject(__('vuefilemanager.reset_password_subject') . $app_name)
->subject(__('vuefilemanager.reset_password_subject') . $app_name)
->greeting(__('vuefilemanager.reset_password_greeting'))
->line(__('vuefilemanager.reset_password_line_1'))
->action(__('vuefilemanager.reset_password_action'), $reset_url)
->line(__('vuefilemanager.reset_password_line_2'))
->salutation(__('vuefilemanager.salutation') . ', ' . $app_name );
->salutation(__('vuefilemanager.salutation') . ', ' . $app_name);
}
/**

View File

@@ -2,7 +2,6 @@
namespace App\Notifications;
use App\Setting;
use Illuminate\Bus\Queueable;
use Illuminate\Contracts\Queue\ShouldQueue;
use Illuminate\Support\Facades\Auth;
@@ -43,14 +42,12 @@ class SharedSendViaEmail extends Notification
*/
public function toMail($notifiable)
{
$app_name = strval(Setting::where('name', 'app_title')->pluck('value')[0]);
return (new MailMessage)
->subject(__('vuefilemanager.shared_link_email_subject' , ['user' => $this->user->name]))
->greeting(__('vuefilemanager.shared_link_email_greeting'))
->line(__('vuefilemanager.shared_link_email_user', ['user' => $this->user->name, 'email' => $this->user->email]))
->action(__('vuefilemanager.shared_link_email_link'), url('/shared', ['token' => $this->token]))
->salutation(__('vuefilemanager.shared_link_email_salutation', ['app_name' => $app_name ? $app_name : 'VueFileManager']));
->salutation(__('vuefilemanager.shared_link_email_salutation', ['app_name' => get_setting('app_title') ?? 'VueFileManager']));
}
/**

View File

@@ -75,17 +75,20 @@
"/chunks/user-storage.js": "/chunks/user-storage.js?id=5cfec8a8f8a8aef24ef2",
"/chunks/user-subscription.js": "/chunks/user-subscription.js?id=c001bef2d6d5171cb359",
"/chunks/users.js": "/chunks/users.js?id=6e68cb068f69fba3199c",
"/chunks/files~chunks/shared-files~chunks/shared-page.5b29c242c49c58340f1b.hot-update.js": "/chunks/files~chunks/shared-files~chunks/shared-page.5b29c242c49c58340f1b.hot-update.js",
"/js/main.c83f793f7444b47d13a1.hot-update.js": "/js/main.c83f793f7444b47d13a1.hot-update.js",
"/js/main.570d62e24b3d35d39178.hot-update.js": "/js/main.570d62e24b3d35d39178.hot-update.js",
"/js/main.3703274ea498354cc13b.hot-update.js": "/js/main.3703274ea498354cc13b.hot-update.js",
"/js/main.791c5b51283a97951504.hot-update.js": "/js/main.791c5b51283a97951504.hot-update.js",
"/js/main.b6381cda8d15b5db30c9.hot-update.js": "/js/main.b6381cda8d15b5db30c9.hot-update.js",
"/js/main.f0c2877baa9090653d42.hot-update.js": "/js/main.f0c2877baa9090653d42.hot-update.js",
"/js/main.1558a02e34c559d48485.hot-update.js": "/js/main.1558a02e34c559d48485.hot-update.js",
"/js/main.8dcc4df9977a0a7f40f9.hot-update.js": "/js/main.8dcc4df9977a0a7f40f9.hot-update.js",
"/js/main.46a090fef2e2ba1414f6.hot-update.js": "/js/main.46a090fef2e2ba1414f6.hot-update.js",
"/js/main.43e0e910643150929a3d.hot-update.js": "/js/main.43e0e910643150929a3d.hot-update.js",
"/js/main.f95fa4d8a3bdd65a21dd.hot-update.js": "/js/main.f95fa4d8a3bdd65a21dd.hot-update.js",
"/js/main.717716b6c2ed8fbadd46.hot-update.js": "/js/main.717716b6c2ed8fbadd46.hot-update.js"
"/js/main.8c774260a56e57a3b3e3.hot-update.js": "/js/main.8c774260a56e57a3b3e3.hot-update.js",
"/js/main.47d60d876801c7437f39.hot-update.js": "/js/main.47d60d876801c7437f39.hot-update.js",
"/js/main.3c96f48e66405f57e071.hot-update.js": "/js/main.3c96f48e66405f57e071.hot-update.js",
"/js/main.bdc09d04e7737afe68a4.hot-update.js": "/js/main.bdc09d04e7737afe68a4.hot-update.js",
"/js/main.d0602bf732496882966e.hot-update.js": "/js/main.d0602bf732496882966e.hot-update.js",
"/js/main.93a11de54d1cc713badc.hot-update.js": "/js/main.93a11de54d1cc713badc.hot-update.js",
"/js/main.e18e39bbe3290f9cb2e4.hot-update.js": "/js/main.e18e39bbe3290f9cb2e4.hot-update.js",
"/js/main.97927df7f2cb7121c650.hot-update.js": "/js/main.97927df7f2cb7121c650.hot-update.js",
"/js/main.0bd5f386525ab3325441.hot-update.js": "/js/main.0bd5f386525ab3325441.hot-update.js",
"/js/main.dd8c70ab19b4d8fb8769.hot-update.js": "/js/main.dd8c70ab19b4d8fb8769.hot-update.js",
"/js/main.2d1a8ef45ea9dd2950e9.hot-update.js": "/js/main.2d1a8ef45ea9dd2950e9.hot-update.js",
"/js/main.b8bd056e4e448bcc904f.hot-update.js": "/js/main.b8bd056e4e448bcc904f.hot-update.js",
"/js/main.a8b9b00008c4305878f7.hot-update.js": "/js/main.a8b9b00008c4305878f7.hot-update.js",
"/js/main.9bf9d8af95376cc35566.hot-update.js": "/js/main.9bf9d8af95376cc35566.hot-update.js",
"/js/main.205e30e6aaa9361c0237.hot-update.js": "/js/main.205e30e6aaa9361c0237.hot-update.js",
"/js/main.59ee74fe23ff591a4922.hot-update.js": "/js/main.59ee74fe23ff591a4922.hot-update.js"
}

View File

@@ -16,6 +16,10 @@
<input v-model="name" :class="{'is-error': errors[0]}" type="text" ref="input" :placeholder="$t('popup_create_folder.placeholder')">
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
<SetFolderIcon v-if="isMoreOptions"/>
<ActionButton @click.native.stop="moreOptions" :icon="isMoreOptions ? 'x' : 'pencil-alt'">{{ moreOptionsTitle }}</ActionButton>
</ValidationObserver>
</PopupContent>
@@ -44,11 +48,11 @@
import PopupContent from '@/components/Others/Popup/PopupContent'
import PopupHeader from '@/components/Others/Popup/PopupHeader'
import ThumbnailItem from '@/components/Others/ThumbnailItem'
import SetFolderIcon from '@/components/Others/SetFolderIcon'
import ActionButton from '@/components/Others/ActionButton'
import ButtonBase from '@/components/FilesView/ButtonBase'
import {required} from 'vee-validate/dist/rules'
import {events} from '@/bus'
import axios from 'axios'
export default {
name: 'CreateFolder',
@@ -56,6 +60,7 @@
ValidationProvider,
ValidationObserver,
ThumbnailItem,
SetFolderIcon,
ActionButton,
PopupWrapper,
PopupActions,
@@ -64,19 +69,29 @@
ButtonBase,
required,
},
computed: {
moreOptionsTitle() {
return this.isMoreOptions ? this.$t('shared_form.button_close_options') : this.$t('shared_form.button_folder_icon_open')
}
},
data() {
return {
name: undefined,
isMoreOptions: false,
folderIcon: undefined
}
},
methods: {
moreOptions() {
this.isMoreOptions = !this.isMoreOptions
},
async createFolder() {
// Validate fields
const isValid = await this.$refs.createForm.validate();
if (isValid) {
this.$store.dispatch('createFolder', this.name)
this.$store.dispatch('createFolder', {'name':this.name, 'icon': this.folderIcon})
this.$closePopup()
@@ -85,11 +100,19 @@
},
},
mounted() {
events.$on('setFolderIcon', (icon) => {
this.folderIcon = icon
})
events.$on('popup:open', ({name}) => {
if (name === 'create-folder' && ! this.$isMobile())
this.$nextTick(() => this.$refs.input.focus())
})
events.$on('setFolderIcon', (icon) => {
this.setFolderIcon = icon
})
}
}
</script>

View File

@@ -56,7 +56,6 @@ import ButtonBase from '@/components/FilesView/ButtonBase'
import { XIcon } from 'vue-feather-icons'
import { required } from 'vee-validate/dist/rules'
import { events } from '@/bus'
import axios from 'axios'
export default {
name: 'RenameItem',
@@ -100,7 +99,7 @@ export default {
unique_id: this.pickedItem.unique_id,
type: this.pickedItem.type,
name: this.pickedItem.name,
folder_icon: this.setFolderIcon ? this.setFolderIcon : null
icon: this.setFolderIcon ? this.setFolderIcon : null
}
// Rename item request
@@ -133,7 +132,7 @@ export default {
})
events.$on('setFolderIcon', (icon) => {
this.setFolderIcon = icon.value
this.setFolderIcon = icon
})
}
}

View File

@@ -53,7 +53,7 @@ export default {
if( this.selectedColor ) {
this.selectedEmoji = undefined
events.$emit('setFolderIcon', { 'value': color })
events.$emit('setFolderIcon', color )
}
},
@@ -64,25 +64,29 @@ export default {
if( this.selectedEmoji ) {
this.selectedColor = undefined
events.$emit('setFolderIcon', { 'value': this.selectedEmoji ==='default' ? 'default' : emoji })
events.$emit('setFolderIcon', this.selectedEmoji ==='default' ? 'default' : emoji )
}
},
},
created() {
if(this.folderData) {
// If folder have already set some color set this color to selected color
this.folderData.icon_color ? this.selectedColor = this.folderData.icon_color : ''
// If folder have already set some color set this color to selected color
this.folderData.icon_color ? this.selectedColor = this.folderData.icon_color : ''
// If folder have already set some emojit set this emoji to selected emoji
this.folderData.icon_emoji ? this.selectedEmoji = this.folderData.icon_emoji : ''
// If folder have already set some emojit set this emoji to selected emoji
this.folderData.icon_emoji ? this.selectedEmoji = this.folderData.icon_emoji : ''
}
},
destroyed () {
// After close SetFolderIcon set the saved folder icon for thumbnail
let color = {'color': this.folderData.icon_color }
let emoji = {'emoji': this.folderData.icon_emoji }
events.$emit('setFolderIcon', { 'value': this.folderData.icon_emoji ? emoji : color })
if(this.folderData) {
// After close SetFolderIcon set the saved folder icon for thumbnail
let color = {'color': this.folderData.icon_color }
let emoji = {'emoji': this.folderData.icon_emoji }
events.$emit('setFolderIcon', this.folderData.icon_emoji ? emoji : color )
}
}
}
</script>

View File

@@ -106,7 +106,7 @@ const actions = {
})
.catch(() => Vue.prototype.$isSomethingWrong())
},
createFolder: ({ commit, getters, dispatch }, folderName) => {
createFolder: ({ commit, getters, dispatch }, folder) => {
// Get route
let route = getters.sharedDetail && !getters.sharedDetail.protected
@@ -116,7 +116,8 @@ const actions = {
axios
.post(route, {
parent_id: getters.currentFolder.unique_id,
name: folderName
name: folder.name,
icon: folder.icon
})
.then(response => {
commit('ADD_NEW_FOLDER', response.data)
@@ -151,7 +152,7 @@ const actions = {
.post(route, {
name: data.name,
type: data.type,
folder_icon: data.folder_icon,
icon: data.icon,
_method: 'patch'
})
.then(response => {

View File

@@ -1,15 +1,9 @@
<?php
use App\Setting;
$app_name = strval(Setting::where('name', 'app_title')->pluck('value')[0]);
?>
@component('mail::layout')
{{-- Header --}}
@slot('header')
@component('mail::header', ['url' => config('app.url')])
{{ $app_name ? $app_name : 'VueFileManager' }}
{{ get_setting('app_title') ?? 'VueFileManager' }}
@endcomponent
@endslot
@@ -28,7 +22,7 @@ $app_name = strval(Setting::where('name', 'app_title')->pluck('value')[0]);
{{-- Footer --}}
@slot('footer')
@component('mail::footer')
© {{ date('Y') }} {{ $app_name ? $app_name : 'VueFileManager' }}. @lang('All rights reserved.')
© {{ date('Y') }} {{ get_setting('app_title') ?? 'VueFileManager' }}. @lang('All rights reserved.')
@endcomponent
@endslot
@endcomponent