@extends('layouts.app')

@section('title', 'Gestión de Almacenes')

@section('content')
<div class="container-fluid">
    <!-- Header -->
    <div class="row mb-4">
        <div class="col-12">
            <div class="d-flex justify-content-between align-items-center">
                <div>
                    <h1 class="h3 mb-0 text-gray-800 text-gradient-primary"><i class="fas fa-warehouse me-2"></i>Gestión de Almacenes
                    </h1>
                    <p class="text-muted mb-0">Administra los almacenes y sus ubicaciones</p>
                </div>
                <div>
                    <x-professional-button variant="primary" href="{{ route('admin.inventory.warehouses.create') }}" icon="fas fa-plus" class="">Nuevo Almacén
                    </x-professional-button>
                </div>
            </div>
        </div>
    </div>

    <!-- Estadísticas -->
    <div class="row mb-4">
        <div class="col-xl-3 col-md-6 mb-4">
            <div class="card border-left-primary shadow h-100 py-2">
                <div class="card-body">
                    <div class="row no-gutters align-items-center">
                        <div class="col mr-2">
                            <div class="text-xs font-weight-bold text-primary text-uppercase mb-1">
                                Total Almacenes
                            </div>
                            <div class="h5 mb-0 font-weight-bold text-gray-800">{{ $stats['total_warehouses'] }}</div>
                        </div>
                        <div class="col-auto">
                            <i class="fas fa-warehouse fa-2x text-gray-300"></i>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-xl-3 col-md-6 mb-4">
            <div class="card border-left-success shadow h-100 py-2">
                <div class="card-body">
                    <div class="row no-gutters align-items-center">
                        <div class="col mr-2">
                            <div class="text-xs font-weight-bold text-success text-uppercase mb-1">
                                Almacenes Activos
                            </div>
                            <div class="h5 mb-0 font-weight-bold text-gray-800">{{ $stats['active_warehouses'] }}</div>
                        </div>
                        <div class="col-auto">
                            <i class="fas fa-check-circle fa-2x text-gray-300"></i>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-xl-3 col-md-6 mb-4">
            <div class="card border-left-info shadow h-100 py-2">
                <div class="card-body">
                    <div class="row no-gutters align-items-center">
                        <div class="col mr-2">
                            <div class="text-xs font-weight-bold text-info text-uppercase mb-1">
                                Total Ubicaciones
                            </div>
                            <div class="h5 mb-0 font-weight-bold text-gray-800">{{ $stats['total_locations'] }}</div>
                        </div>
                        <div class="col-auto">
                            <i class="fas fa-map-marker-alt fa-2x text-gray-300"></i>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-xl-3 col-md-6 mb-4">
            <div class="card border-left-warning shadow h-100 py-2">
                <div class="card-body">
                    <div class="row no-gutters align-items-center">
                        <div class="col mr-2">
                            <div class="text-xs font-weight-bold text-warning text-uppercase mb-1">
                                Valor Total Inventario
                            </div>
                            <div class="h5 mb-0 font-weight-bold text-gray-800">${{ number_format($stats['total_value'], 2) }}</div>
                        </div>
                        <div class="col-auto">
                            <i class="fas fa-dollar-sign fa-2x text-gray-300"></i>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Filtros -->
    <div class="card shadow mb-4">
        <div class="card-header py-3">
            <h6 class="m-0 font-weight-bold text-primary">
                <i class="fas fa-filter me-2"></i>Filtros de Búsqueda
            </h6>
        </div>
        <div class="card-body">
            <form method="GET" action="{{ route('admin.inventory.warehouses.index') }}">
                <div class="row">
                    <div class="col-md-3">
                        <div class="form-group">
                            <label for="search">Buscar</label>
                            <input type="text" class="form-control" id="search" name="search" 
                                   value="{{ request('search') }}" placeholder="Nombre, código, ciudad...">
                        </div>
                    </div>
                    <div class="col-md-2">
                        <div class="form-group">
                            <label for="status">Estado</label>
                            <select class="form-control" id="status" name="status">
                                <option value="">Todos</option>
                                <option value="active" {{ request('status') === 'active' ? 'selected' : '' }}>Activos</option>
                                <option value="inactive" {{ request('status') === 'inactive' ? 'selected' : '' }}>Inactivos</option>
                            </select>
                        </div>
                    </div>
                    <div class="col-md-2">
                        <div class="form-group">
                            <label for="city">Ciudad</label>
                            <input type="text" class="form-control" id="city" name="city" 
                                   value="{{ request('city') }}" placeholder="Ciudad">
                        </div>
                    </div>
                    <div class="col-md-2">
                        <div class="form-group">
                            <label for="state">Estado</label>
                            <input type="text" class="form-control" id="state" name="state" 
                                   value="{{ request('state') }}" placeholder="Estado">
                        </div>
                    </div>
                    <div class="col-md-3">
                        <div class="form-group">
                            <label>&nbsp;</label>
                            <div class="d-flex gap-2">
                                <button type="submit" class="btn btn-primary text-white">
                                    <i class="fas fa-search me-1"></i>Buscar
                                </button>
                                <a href="{{ route('admin.inventory.warehouses.index') }}" class="btn btn-secondary text-white">
                                    <i class="fas fa-times me-1"></i>Limpiar
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </div>

    <!-- Tabla de Almacenes -->
    <div class="card shadow mb-4">
        <div class="card-header py-3">
            <h6 class="m-0 font-weight-bold text-primary">
                <i class="fas fa-list me-2"></i>Lista de Almacenes
            </h6>
        </div>
        <div class="card-body">
            <div class="table-responsive">
                <table class="table table-bordered table-hover">
                    <thead class="thead-light">
                        <tr>
                            <th>Código</th>
                            <th>Nombre</th>
                            <th>Ubicación</th>
                            <th>Estado</th>
                            <th>Capacidad</th>
                            <th>Ubicaciones</th>
                            <th>Productos</th>
                            <th>Valor</th>
                            <th>Acciones</th>
                        </tr>
                    </thead>
                    <tbody>
                        @forelse($warehouses as $warehouse)
                            <tr>
                                <td>
                                    <span class="badge bg-primary" class="text-white"{{ $warehouse->code }}</span>
                                </td>
                                <td>
                                    <strong>{{ $warehouse->name }}</strong>
                                    @if($warehouse->is_main)
                                        <span class="badge bg-success ms-1" class="text-white"Principal</span>
                                    @endif
                                </td>
                                <td>
                                    <small class="text-muted">{{ $warehouse->full_address }}</small>
                                </td>
                                <td>
                                    {!! $warehouse->status_formatted !!}
                                </td>
                                <td>
                                    <div class="small">
                                        <div>{{ $warehouse->used_capacity_formatted }} / {{ $warehouse->capacity_formatted }}</div>
                                        <div class="progress" style="height: 4px;">
                                            <div class="progress-bar" role="progressbar" 
                                                 style="width: {{ $warehouse->capacity_used_percentage }}%"
                                                 aria-valuenow="{{ $warehouse->capacity_used_percentage }}" 
                                                 aria-valuemin="0" aria-valuemax="100">
                                            </div>
                                        </div>
                                    </div>
                                </td>
                                <td>
                                    <span class="badge bg-info text-white">{{ $warehouse->locations->count() }}</span>
                                </td>
                                <td>
                                    <span class="badge bg-secondary text-white">{{ $warehouse->total_products }}</span>
                                </td>
                                <td>
                                    <strong>${{ number_format($warehouse->total_value, 2) }}</strong>
                                </td>
                                <td>
                                    <div class="btn-group" role="group">
                                        <a href="{{ route('admin.inventory.warehouses.show', $warehouse) }}" 
                                           class="btn btn-sm btn-info text-white" title="Ver detalles">
                                            <i class="fas fa-eye"></i>
                                        </a>
                                        <a href="{{ route('admin.inventory.warehouses.edit', $warehouse) }}" 
                                           class="btn btn-sm btn-warning text-white" title="Editar">
                                            <i class="fas fa-edit"></i>
                                        </a>
                                        @if(!$warehouse->is_main)
                                            <form method="POST" action="{{ route('admin.inventory.warehouses.set-main', $warehouse) }}" 
                                                  class="d-inline" onsubmit="return confirm('¿Establecer como almacén principal?')">
                                                @csrf
                                                <button type="submit" class="btn btn-sm btn-success text-white" title="Establecer como principal">
                                                    <i class="fas fa-star"></i>
                                                </button>
                                            </form>
                                        @endif
                                        <form method="POST" action="{{ route('admin.inventory.warehouses.toggle-status', $warehouse) }}" 
                                              class="d-inline">
                                            @csrf
                                            <button type="submit" class="btn btn-sm {{ $warehouse->is_active ? 'btn-warning' : 'btn-success' }} text-white" 
                                                    title="{{ $warehouse->is_active ? 'Desactivar' : 'Activar' }}">
                                                <i class="fas fa-{{ $warehouse->is_active ? 'pause' : 'play' }}"></i>
                                            </button>
                                        </form>
                                        <form method="POST" action="{{ route('admin.inventory.warehouses.destroy', $warehouse) }}" 
                                              class="d-inline" onsubmit="return confirm('¿Eliminar este almacén?')">
                                            @csrf
                                            @method('DELETE')
                                            <button type="submit" class="btn btn-sm btn-danger text-white" title="Eliminar">
                                                <i class="fas fa-trash"></i>
                                            </button>
                                        </form>
                                    </div>
                                </td>
                            </tr>
                        @empty
                            <tr>
                                <td colspan="9" class="text-center py-4">
                                    <div class="text-muted">
                                        <i class="fas fa-warehouse fa-3x mb-3"></i>
                                        <p>No hay almacenes registrados</p>
                                        <x-professional-button variant="primary" href="{{ route('admin.inventory.warehouses.create') }}" icon="fas fa-plus" class="">Crear Primer Almacén
                                        </x-professional-button>
                                    </div>
                                </td>
                            </tr>
                        @endforelse
                    </tbody>
                </table>
            </div>

            <!-- Paginación -->
            @if($warehouses->hasPages())
                <div class="d-flex justify-content-center">
                    {{ $warehouses->links() }}
                </div>
            @endif
        </div>
    </div>
</div>
@endsection

@push('scripts')
<script>
    // Auto-submit form on filter change
    document.getElementById('status').addEventListener('change', function() {
        this.form.submit();
    });
</script>
@endpush