Miglioramento gestione input Blade

This commit is contained in:
Dasc3er 2021-03-12 14:54:10 +01:00
parent 0768655391
commit c3f4abb578
16 changed files with 332 additions and 37 deletions

View File

@ -2,59 +2,94 @@
namespace App\View\Components;
use Illuminate\Support\Collection;
use Illuminate\View\Component;
class Input extends Component
{
public $unique_id;
public $id;
public $name;
public $required;
public $label;
public $placeholder;
public $class;
public $props;
/**
* Create a new component instance.
*
* @param string $name
* @param null $id
* @param bool $required
* @param null $label
* @param null $placeholder
* @param string|null $id
* @param string|null $value
* @param bool|string $required
* @param string|null $label
* @param string|null $placeholder
*/
public function __construct(
$name,
$id = null,
$value = null,
$required = false,
$label = null,
$placeholder = null
) {
$this->id = isset($id) ? $id : $name;
$this->name = $name;
$this->required = is_string($required) ? $required == 'true' : (bool) $required;
$this->label = $label;
$this->placeholder = $placeholder;
// Definizione ID dell'elemento
$id = isset($id) ? $id : $name;
$rand = rand(0, 9999);
$this->unique_id = $id.$rand;
$unique_id = $id.$rand;
$this->class = 'form-control openstamanager-input';
// Elemento obbligatorio o meno
$required = is_string($required) ? $required == 'true' : (bool) $required;
// Label e placeholder corretti in base al contenuti obbligatorio o meno
if ($this->required) {
if (!empty($this->label)) {
$this->label .= '*';
if ($required) {
if (!empty($label)) {
$label .= '*';
}
// Aggiunta
elseif (!empty($this->placeholder)) {
$this->placeholder .= '*';
elseif (!empty($placeholder)) {
$placeholder .= '*';
}
}
$this->props = $this->newAttributeBag([
'name' => $name,
'id' => $id,
'value' => $value,
'unique_id' => $unique_id,
'required' => $required,
'label' => $label,
'placeholder' => $placeholder,
'class' => collect(['form-control', 'openstamanager-input']),
]);
// Operazioni finali
$this->init();
}
public function get($key, $default = null)
{
return $this->props->get($key, $default);
}
public function set($values)
{
$this->props->setAttributes(array_merge($this->props->getAttributes(), $values));
}
public function init()
{
}
/**
* Extract the public properties for the component.
*
* @return array
*/
public function extractPublicProperties()
{
$values = parent::extractPublicProperties();
foreach ($this->props as $key => $value) {
$values[$key] = $value instanceof Collection ? $value->join(' ') : $value;
}
return $values;
}
/**

View File

@ -0,0 +1,35 @@
<?php
namespace App\View\Components\Inputs;
use App\View\Components\Input;
use Illuminate\View\Component;
class Checkbox extends Input
{
public function init()
{
$class = $this->get('class');
// Rimozione classe CSS predefinita
$key = $class->search('form-control');
$class->forget($key);
// Correzione valore impostato a boolean
$value = $this->get('value');
$this->set([
'value' => empty($value) || $value == 'off' ? false : true,
'placeholder' => $this->get('placeholder', $this->get('label')),
]);
}
/**
* Get the view / contents that represent the component.
*
* @return \Illuminate\Contracts\View\View|string
*/
public function render()
{
return view('components.inputs.checkbox');
}
}

View File

@ -0,0 +1,26 @@
<?php
namespace App\View\Components\Inputs;
use App\View\Components\Input;
use Illuminate\View\Component;
class Editor extends Input
{
public function init()
{
// Aggiunta classe CSS dedicata
$this->get('class')
->add('editor-input');
}
/**
* Get the view / contents that represent the component.
*
* @return \Illuminate\Contracts\View\View|string
*/
public function render()
{
return view('components.inputs.editor');
}
}

View File

@ -16,6 +16,6 @@ class File extends Input
*/
public function render()
{
return view('components.inputs.file');
return view('components.inputs.text');
}
}

View File

@ -0,0 +1,19 @@
<?php
namespace App\View\Components\Inputs;
use App\View\Components\Input;
use Illuminate\View\Component;
class Image extends Input
{
/**
* Get the view / contents that represent the component.
*
* @return \Illuminate\Contracts\View\View|string
*/
public function render()
{
return view('components.inputs.image');
}
}

View File

@ -0,0 +1,65 @@
<?php
namespace App\View\Components\Inputs;
use App\View\Components\Input;
use Illuminate\View\Component;
class Number extends Input
{
/**
* Create a new component instance.
*
* @param string $name
* @param string|null $id
* @param string|null $value
* @param bool|string $required
* @param string|null $label
* @param string|null $placeholder
* @param null $minValue
*/
public function __construct(
$name,
$id = null,
$value = null,
$required = false,
$label = null,
$placeholder = null,
$minValue = null
) {
parent::__construct($name, $id, $value, $required, $label, $placeholder);
// Aggiunta classe CSS dedicata
$this->get('class')
->add('number-input');
$value = $this->get('value');
if (empty($value)) {
$this->set(['value' => 0]);
}
// Gestione della precisione (numero specifico, oppure "qta" per il valore previsto nell'impostazione "Cifre decimali per quantità").
$decimals = $this->get('decimals');
if (string_starts_with($decimals, 'qta')) {
$decimals = setting('Cifre decimali per quantità');
// Se non è previsto un valore minimo, lo imposta a 1
$minValue = isset($minValue) ? $minValue : '0.'.str_repeat('0', $decimals - 1).'1';
$this->set([
'decimals' => $decimals,
'min-value' => $minValue,
]);
}
}
/**
* Get the view / contents that represent the component.
*
* @return \Illuminate\Contracts\View\View|string
*/
public function render()
{
return view('components.inputs.text');
}
}

View File

@ -0,0 +1,28 @@
<?php
namespace App\View\Components\Inputs;
use Illuminate\View\Component;
class Select extends Component
{
/**
* Create a new component instance.
*
* @return void
*/
public function __construct()
{
//
}
/**
* Get the view / contents that represent the component.
*
* @return \Illuminate\Contracts\View\View|string
*/
public function render()
{
return view('components.inputs.select');
}
}

View File

@ -0,0 +1,19 @@
<?php
namespace App\View\Components\Inputs;
use App\View\Components\Input;
use Illuminate\View\Component;
class Textarea extends Input
{
/**
* Get the view / contents that represent the component.
*
* @return \Illuminate\Contracts\View\View|string
*/
public function render()
{
return view('components.inputs.textarea');
}
}

View File

@ -1,5 +1,5 @@
@php
$is_input_group = !empty($before) || !empty($after);
$is_input_group = (isset($before) && !empty($before->__toString())) || (isset($after) && !empty($after->__toString()));
@endphp
<div class="form-group">
@ -20,7 +20,7 @@ $is_input_group = !empty($before) || !empty($after);
@endif
{{-- Icona prima dell'input --}}
@if(isset($before))
@if(isset($before) && !empty($before->__toString()))
{{ $before }}
@endif
@ -28,7 +28,7 @@ $is_input_group = !empty($before) || !empty($after);
{{ $slot }}
{{-- Icona dopo l'input --}}
@if(isset($after))
@if(isset($after) && !empty($after->__toString()))
{{ $after }}
@endif

View File

@ -0,0 +1,26 @@
<x-input :name="$name" :id="$id" :unique_id="$unique_id" :label="$label">
{{-- "+ this.checked" rende il valore booleano un numero --}}
<div class="form-group checkbox-group">
<input type="hidden" name="{{ $name }}" value="{{ $value }}" class="openstamanager-input">
<input type="checkbox" autocomplete="off" class="hidden" {{ $attributes->merge([
'name' => $name,
'id' => $id,
'value' => $value,
'required' => $required,
'data-parsley-errors-container' => '#'.$unique_id.'-errors'
]) }} onchange="$(this).parent().find(\'[type = hidden]\').val(+this.checked).trigger(\'change\')"/>
<div class="btn-group checkbox-buttons">
<label for="{{ $id }}" class="btn btn-default{{ $class }}">
<span class="fa fa-check text-success"></span>
<span class="fa fa-close text-danger"></span>
</label>
<label for="{{ $id }}" class="btn btn-default active{{ $class }}">
<span class="text-success">{{ tr('Attivato') }}</span>
<span class="text-danger">{{ tr('Disattivato') }}</span>
</label>
</div>
</div>
<x-slot name="before">{{ isset($before) ? $before : null }}</x-slot>
<x-slot name="after">{{ isset($after) ? $after : null }}</x-slot>
</x-input>

View File

@ -0,0 +1,15 @@
<x-input :name="$name" :id="$id" :unique_id="$unique_id" :label="$label">
<textarea {{ $attributes->merge([
'type' => isset($type) ? $type : 'text',
'name' => $name,
'id' => $id,
'required' => $required,
'placeholder' => $placeholder,
'class' => $class,
'data-parsley-errors-container' => '#'.$unique_id.'-errors'
]) }}>{{ $value }}</textarea>
<script src="{{ base_url() }}/assets/js/ckeditor/ckeditor.js"></script>
<x-slot name="before">{{ isset($before) ? $before : null }}</x-slot>
<x-slot name="after">{{ isset($after) ? $after : null }}</x-slot>
</x-input>

View File

@ -1,6 +0,0 @@
<x-input :name="$name" :id="$id" :unique_id="$unique_id" :label="$label">
@include('components.inputs.standard-input')
<x-slot name="before">{{ isset($before) ? $before : null }}</x-slot>
<x-slot name="after">{{ isset($after) ? $after : null }}</x-slot>
</x-input>

View File

@ -0,0 +1,15 @@
<x-input :name="$name" :id="$id" :unique_id="$unique_id" :label="$label">
@if(empty($value))
@php($type = 'file')
@include('components.inputs.standard-input')
@else
<img src="{{ $value }}" class="img-thumbnail img-responsive"><br>
<label>
<input type="checkbox" name="delete_{{ $name }}" id="delete_{{ $id }}"> '.tr('Elimina').'
</label>
<input type="hidden" name="{{ $name }}" value="{{ $value }}" id="{{ $id }}">
@endif
<x-slot name="before">{{ isset($before) ? $before : null }}</x-slot>
<x-slot name="after">{{ isset($after) ? $after : null }}</x-slot>
</x-input>

View File

@ -0,0 +1,3 @@
<div>
<!-- The whole future lies in uncertainty: live immediately. - Seneca -->
</div>

View File

@ -2,6 +2,7 @@
'type' => isset($type) ? $type : 'text',
'name' => $name,
'id' => $id,
'value' => $value,
'required' => $required,
'placeholder' => $placeholder,
'class' => $class,

View File

@ -0,0 +1,14 @@
<x-input :name="$name" :id="$id" :unique_id="$unique_id" :label="$label">
<textarea {{ $attributes->merge([
'type' => isset($type) ? $type : 'text',
'name' => $name,
'id' => $id,
'required' => $required,
'placeholder' => $placeholder,
'class' => $class,
'data-parsley-errors-container' => '#'.$unique_id.'-errors'
]) }}>{{ $value }}</textarea>
<x-slot name="before">{{ isset($before) ? $before : null }}</x-slot>
<x-slot name="after">{{ isset($after) ? $after : null }}</x-slot>
</x-input>