77 lines
		
	
	
		
			2.8 KiB
		
	
	
	
		
			PHP
		
	
	
	
	
	
			
		
		
	
	
			77 lines
		
	
	
		
			2.8 KiB
		
	
	
	
		
			PHP
		
	
	
	
	
	
@props([
 | 
						|
    'title' => '',
 | 
						|
    'subtitle' => '',
 | 
						|
    'image' => null,
 | 
						|
    'bgColor' => '', // primary, secondary, success, danger, etc.
 | 
						|
    'borderColor' => '', // primary, secondary, etc.
 | 
						|
    'textColor' => 'text-dark',
 | 
						|
    'shadow' => true, // true / false
 | 
						|
    'dropdown' => [], // Opciones para el menú
 | 
						|
    'footer' => '',
 | 
						|
    'footerClass' => '', // Clase CSS personalizada para el footer
 | 
						|
    'footerAlign' => 'start', // Alineación: start, center, end
 | 
						|
    'footerButtons' => [], // Botones de acción
 | 
						|
    'class' => 'mb-6',
 | 
						|
])
 | 
						|
 | 
						|
@php
 | 
						|
    $cardClass = 'card ' . ($shadow ? '' : 'shadow-none') . ' ' . ($bgColor ? "bg-$bgColor text-white" : '') . ' ' . ($borderColor ? "border border-$borderColor" : '') . " $class";
 | 
						|
    $footerAlignment = match ($footerAlign) {
 | 
						|
        'center' => 'text-center',
 | 
						|
        'end' => 'text-end',
 | 
						|
        default => 'text-start'
 | 
						|
    };
 | 
						|
@endphp
 | 
						|
 | 
						|
<div class="{{ $cardClass }}">
 | 
						|
    @if ($image)
 | 
						|
        <img class="card-img-top" src="{{ $image }}" alt="Card image">
 | 
						|
    @endif
 | 
						|
 | 
						|
    @if ($title || $subtitle || $dropdown)
 | 
						|
        <div class="card-header d-flex justify-content-between">
 | 
						|
            <div class="card-title mb-0">
 | 
						|
                @if ($title)
 | 
						|
                    <h5 class="mb-1 {{ $textColor }}">{{ $title }}</h5>
 | 
						|
                @endif
 | 
						|
                @if ($subtitle)
 | 
						|
                    <p class="card-subtitle {{ $textColor }}">{{ $subtitle }}</p>
 | 
						|
                @endif
 | 
						|
            </div>
 | 
						|
            @if (!empty($dropdown))
 | 
						|
                <div class="dropdown">
 | 
						|
                    <button class="btn btn-text-secondary rounded-pill text-muted border-0 p-2" type="button" data-bs-toggle="dropdown">
 | 
						|
                        <i class="ti ti-dots-vertical"></i>
 | 
						|
                    </button>
 | 
						|
                    <div class="dropdown-menu dropdown-menu-end">
 | 
						|
                        @foreach ($dropdown as $item)
 | 
						|
                            <a class="dropdown-item" href="{{ $item['href'] ?? 'javascript:void(0);' }}">{{ $item['label'] }}</a>
 | 
						|
                        @endforeach
 | 
						|
                    </div>
 | 
						|
                </div>
 | 
						|
            @endif
 | 
						|
        </div>
 | 
						|
    @endif
 | 
						|
 | 
						|
    <div class="card-body">
 | 
						|
        {{ $slot }}
 | 
						|
    </div>
 | 
						|
 | 
						|
    {{-- Footer flexible --}}
 | 
						|
    @if ($footer || !empty($footerButtons))
 | 
						|
        <div class="card-footer {{ $footerClass }} {{ $footerAlignment }}">
 | 
						|
            {{-- Slot de contenido directo en el footer --}}
 | 
						|
            @if ($footer)
 | 
						|
                {!! $footer !!}
 | 
						|
            @endif
 | 
						|
 | 
						|
            {{-- Generación dinámica de botones --}}
 | 
						|
            @foreach ($footerButtons as $button)
 | 
						|
                <a href="{{ $button['href'] ?? '#' }}" class="btn btn-{{ $button['type'] ?? 'primary' }} {{ $button['class'] ?? '' }}">
 | 
						|
                    {{ $button['label'] }}
 | 
						|
                </a>
 | 
						|
            @endforeach
 | 
						|
        </div>
 | 
						|
    @endif
 | 
						|
</div>
 |