@extends('layouts.web')

@section('contenido')

<div class="container" style="padding-top: 80px; padding-bottom: 30px;">
    <div class="row">
        <div class="col">
            <a href="{{ route('web.novedades') }}">
                <div class="titulo">
                    <span class="numero">0.6</span>
                    <span class="texto">equipos</span>
                </div>
            </a>
        </div>
    </div>
    <div class="row">
        <div class="col-lg-9">
            <div class="card text-white">
                <div class="card-body">
                    <div class="row">
                        <div class="col">
                            <span class="badge badge-danger">{{ $equipo->tipos_equipo->nombre }}</span>

                            @if ($equipo->venta)
                            <span class="badge badge-secondary">Venta</span>
                            @endif
        
                            @if ($equipo->alquiler)
                            <span class="badge badge-secondary">Alquiler</span>
                            @endif
        
                            <h1 class="mt-2">{{ $equipo->nombre }}</h1>
                            <p>{!! $equipo->descripcion !!}</p>
        
                            @if ($equipo->imagen != null)
                            <img src="{{ asset($equipo->imagen) }}" alt="">
                            @endif
                        </div>
                    </div>
                    <div class="row mt-4">
                        <div class="col">
                            @if ($equipo->proveedor != null)
                            <h5>Proveedor</h5>
                            <a href="{{ route('web.proveedores.show', $equipo->proveedor->id) }}">
                                <h4>{{ $equipo->proveedor->nombre }}</h4>
                            </a>
                            @endif
        
                            @if ($equipo->detalle != null)
                            <h5>Detalles</h5>
                            <p>{!! $equipo->detalle !!}</p>
                            @endif
                        </div>
                    </div>

                </div>
            </div>
        </div>
        <div class="col-lg-3">
            <div class="row mb-3">
                <div class="col text-left">
                    <h3 class="text-white" style="letter-spacing: 4px;">más equipos</h3>
                </div>
            </div>
            <div class="row">
                @foreach ($equipos as $equipo)
                    <div class="col-12 mb-3">
                        <a href="{{ route('web.equipos.show', $equipo->id) }}" style="text-decoration: none;">
                            <div class="card h-100 text-white">
                                @if ($equipo->imagen != null)
                                    <img src="{{ asset($equipo->imagen) }}" class="card-img-top" alt="...">
                                @endif
                            
                                <div class="card-body">
                                    <h5 class="card-title">{{ $equipo->nombre }}</h5>
                                    @if ($equipo->imagen == null)
                                        <p class="card-text">{{ $equipo->copete }}</p>
                                    @endif
                                    <p class="card-text"><small class="text-muted">{{ $equipo->updated_at->diffForHumans() }}</small></p>
                                </div>
                            </div>
                        </a>
                    </div>
                @endforeach
            </div>
        </div>
    </div>
</div>

@endsection