79 lines
2.7 KiB
PHP
79 lines
2.7 KiB
PHP
{{--
|
|
Componente Card Azione Rapida
|
|
Card per azioni rapide nella dashboard con icona, titolo e descrizione
|
|
|
|
Parametri:
|
|
- title: Titolo dell'azione
|
|
- description: Descrizione dell'azione
|
|
- icon: Icona dell'azione
|
|
- link: Link di destinazione
|
|
- color: Colore del tema (primary, success, warning, danger, info)
|
|
- badge: Testo del badge opzionale (es: "Nuovo", "3")
|
|
- badgeColor: Colore del badge
|
|
--}}
|
|
|
|
@props([
|
|
'title' => 'Azione',
|
|
'description' => 'Descrizione dell\'azione',
|
|
'icon' => 'fas fa-cog',
|
|
'link' => '#',
|
|
'color' => 'primary',
|
|
'badge' => null,
|
|
'badgeColor' => 'red'
|
|
])
|
|
|
|
@php
|
|
$colorClasses = [
|
|
'primary' => 'hover:bg-blue-50 dark:hover:bg-blue-900/20 border-blue-200',
|
|
'success' => 'hover:bg-green-50 dark:hover:bg-green-900/20 border-green-200',
|
|
'warning' => 'hover:bg-yellow-50 dark:hover:bg-yellow-900/20 border-yellow-200',
|
|
'danger' => 'hover:bg-red-50 dark:hover:bg-red-900/20 border-red-200',
|
|
'info' => 'hover:bg-indigo-50 dark:hover:bg-indigo-900/20 border-indigo-200',
|
|
];
|
|
|
|
$badgeColors = [
|
|
'red' => 'bg-red-100 text-red-800',
|
|
'green' => 'bg-green-100 text-green-800',
|
|
'blue' => 'bg-blue-100 text-blue-800',
|
|
'yellow' => 'bg-yellow-100 text-yellow-800',
|
|
];
|
|
|
|
$hoverClass = $colorClasses[$color] ?? $colorClasses['primary'];
|
|
$badgeClass = $badgeColors[$badgeColor] ?? $badgeColors['red'];
|
|
@endphp
|
|
|
|
<a href="{{ $link }}"
|
|
class="block bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-700 rounded-lg p-6 shadow-sm transition-all duration-200 {{ $hoverClass }}">
|
|
<div class="flex items-start">
|
|
<!-- Icona -->
|
|
<div class="flex-shrink-0">
|
|
<i class="{{ $icon }} text-2xl text-gray-600 dark:text-gray-400"></i>
|
|
</div>
|
|
|
|
<!-- Contenuto -->
|
|
<div class="ml-4 flex-1">
|
|
<div class="flex items-center justify-between">
|
|
<h3 class="text-lg font-semibold text-gray-900 dark:text-white">
|
|
{{ $title }}
|
|
</h3>
|
|
|
|
<!-- Badge opzionale -->
|
|
@if($badge)
|
|
<span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium {{ $badgeClass }}">
|
|
{{ $badge }}
|
|
</span>
|
|
@endif
|
|
</div>
|
|
|
|
<p class="mt-2 text-sm text-gray-600 dark:text-gray-400">
|
|
{{ $description }}
|
|
</p>
|
|
</div>
|
|
|
|
<!-- Freccia -->
|
|
<div class="flex-shrink-0 ml-4">
|
|
<i class="fas fa-chevron-right text-gray-400"></i>
|
|
</div>
|
|
</div>
|
|
</a>
|