shihaam/akaunting
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added Alert blade component..

Browse Source
This commit is contained in:
Cüneyt Şentürk 2023-04-20 17:50:49 +03:00
parent 9b58482613
commit 35024b8cc2
3 changed files with 201 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

96
app/View/Components/Alert.php Normal file
View File

@ -0,0 +1,96 @@
<?php
namespace App\View\Components;
use App\Abstracts\View\Component;
class Alert extends Component
{
/** @var bool */
public $rounded;
/** @var bool */
public $border;
/** @var string */
public $color;
/** @var string */
public $icon;
/** @var string */
public $title;
/** @var string */
public $description;
/** @var array */
public $list;
/** @var array */
public $actions;
/** @var bool */
public $dismiss;
/**
* Create a new component instance.
*
* @return void
*/
public function __construct(
bool $rounded = true, bool $border = false,
string $color = '', string $icon = '',
string $title = '', string $description = '',
array $list = [], array $actions = [],
bool $dismiss = false
) {
$this->rounded = $rounded;
$this->border = $border;
$this->color = $this->getColor($color);
$this->icon = $this->getIcon($icon);
$this->title = $title;
$this->description = $description;
$this->list = $list;
$this->actions = $actions;
$this->dismiss = $dismiss;
}
/**
* Get the view / contents that represent the component.
*
* @return \Illuminate\Contracts\View\View|string
*/
public function render()
{
return view('components.alert.index');
}
protected function getColor($color)
{
if (! empty($color)) {
return $color;
}
$color = 'green';
return $color;
}
protected function getIcon($icon)
{
if (! empty($icon)) {
return $icon;
}
$icon = 'check_circle';
return $icon;
}
}

1
resources/lang/en-GB/general.php
View File

@ -228,6 +228,7 @@ return [
'preview_mode' => 'Preview Mode',
'go_back' => 'Go back to :type',
'validation_error' => 'Validation error',
'dismiss' => 'Dismiss',
'card' => [
'cards' => 'Card|Cards',

104
resources/views/components/alert/index.blade.php Normal file
View File

@ -0,0 +1,104 @@
<div
@class([
'rounded-md' => $rounded,
'border-l-4 border-' . $color . '-400' => $border,
'bg-' . $color . '-50',
'p-4',
])
x-data
>
<div class="flex">
<div class="flex-shrink-0">
<x-icon icon="{{ $icon }}" sharp class="h-5 w-5 text-{{ $color }}-400" />
</div>
<div class="ml-3">
<h3 class="text-sm font-medium text-{{ $color }}-800">
{{ $title }}
</h3>
<div class="mt-2 text-sm text-{{ $color }}-700">
<p>{{ $description }}</p>
@if ($list)
<ul role="list" class="list-disc space-y-1 pl-5">
@foreach ($list as $message)
<li>{{ $message }}</li>
@endforeach
</ul>
@endif
</div>
@if ($actions)
<div class="mt-4">
<div class="-mx-2 -my-1.5 flex">
@foreach ($actions as $action)
@if ($action['type'] == 'button')
<button type="button"
{{ $action['attributes'] }}
@class([
'ml-3' => ! $loop->first,
'rounded-md',
'bg-' . $color . '-50',
'px-2 py-1.5',
'text-sm font-medium',
'text-' . $color . '-800 hover:bg-' . $color . '-100',
'focus:outline-none focus:ring-2',
'focus:ring-' . $color . '-600',
'focus:ring-offset-2',
'focus:ring-offset-' . $color . '-50',
])
>
{{ $action['text'] }}
</button>
@else
<a href="{{ $action['url'] }}"
@class([
'ml-3' => ! $loop->first,
'rounded-md',
'bg-' . $color . '-50',
'px-2 py-1.5',
'text-sm font-medium',
'text-' . $color . '-800 hover:bg-' . $color . '-100',
'focus:outline-none focus:ring-2',
'focus:ring-' . $color . '-600',
'focus:ring-offset-2',
'focus:ring-offset-' . $color . '-50',
])
>
{{ $action['text'] }}
</a>
@endif
@endforeach
</div>
</div>
@endif
</div>
@if ($dismiss)
<div class="ml-auto pl-3">
<div class="-mx-1.5 -my-1.5">
<button type="button"
x-on:click="$el.remove()"
@class([
'inline-flex',
'rounded-md',
'bg-' . $color . '-50',
'p-1.5',
'text-sm font-medium',
'text-' . $color . '-500 hover:bg-' . $color . '-100',
'focus:outline-none focus:ring-2',
'focus:ring-' . $color . '-600',
'focus:ring-offset-2',
'focus:ring-offset-' . $color . '-50',
])
>
<span class="sr-only">{{ trans('general.dismiss') }}</span>
<x-icon icon="close" sharp class="h-5 w-5 text-{{ $color }}-400" />
</button>
</div>
</div>
@endif
</div>
</div>