@extends('layouts.app')

@section('content')
    <div class="container-fluid p-0">
        <div class="container-fluid p-0">
            <div class="container-fluid p-0">
                <nav aria-label="breadcrumb">
                    <ol class="breadcrumb">
                        <li class="breadcrumb-item"><a href="{{ route('books.index') }}">Book</a></li>
                        {{-- <li class="breadcrumb-item active" aria-current="page">{{ $visita->supermercado_nome }}</li> --}}
                    </ol>
                </nav>
            </div>
        </div>

        <div class="card shadow-sm">
            <div class="card-header d-flex justify-content-between">
                <h5 class="card-title mb-0">Fornecedor</h5>
            </div>
            <div class="card-body">
                <div class="row g-3">
                    <div class="col-sm-auto col-lg-3">
                        <label class="fw-bold">Razão social:</label>
                        <span class="d-block">{{ $fornecedor->razao_social }}</span>
                    </div>
                    <div class="col-sm-auto col-lg-3">
                        <label class="fw-bold">Nome fantasia:</label>
                        <span class="d-block">{{ $fornecedor->nome_fantasia }}</span>
                    </div>
                    <div class="col-sm-auto col-lg-3">
                        <label class="fw-bold">E-mail:</label>
                        <span class="d-block">{{ $fornecedor->email }}</span>
                    </div>
                    <div class="col-sm-auto col-lg-3">
                        <label class="fw-bold">Telefone:</label>
                        <span class="d-block">{{ $fornecedor->telefone }}</span>
                    </div>
                    <div class="col-sm-auto col-lg-3">
                        <label class="fw-bold">CNPJ:</label>
                        <span class="d-block">{{ $fornecedor->cnpj }}</span>
                    </div>
                    <div class="col-sm-auto col-lg-3">
                        <label class="fw-bold">CEP:</label>
                        <span class="d-block">{{ $fornecedor->cep }}</span>
                    </div>
                    <div class="col-sm-auto col-lg-3">
                        <label class="fw-bold">Endereço:</label>
                        <span class="d-block">{{ $fornecedor->endereco }}</span>
                    </div>
                    <div class="col-sm-auto col-lg-3">
                        <label class="fw-bold">Bairro:</label>
                        <span class="d-block">{{ $fornecedor->bairro }}</span>
                    </div>
                    <div class="col-sm-auto col-lg-3">
                        <label class="fw-bold">Número:</label>
                        <span class="d-block">{{ $fornecedor->numero }}</span>
                    </div>
                </div>
            </div>
        </div>

        <div class="row g-3">
            @foreach ($supermercados as $supermercado)
                <div class="col-12">
                    <h5 class="m-0">{{ $supermercado->nome_fantasia }}</h5>
                </div>
                @foreach ($supermercado['visitas'] as $visita)  
                    <div class="col-2">
                        <div class="card shadow-sm m-0">
                            <div class="card-image">
                                <img src="https://dummyimage.com/300x300/dee2e6/6c757d.jpg" class="img-fluid" />
                            </div>
                            <div class="card-body">
                                <div class="overflow-auto">
                                    <div class="grid g-2">
                                        <div>
                                            <label class="fw-bold">Check-in:</label>
                                            <span class="d-block">{{ $visita->checkin->format('d/m/Y H:i') }}</span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                @endforeach
                <div class="col-12">
                    <hr class="m-0" />
                </div>
            @endforeach
        </div>

        <!--<div class="card shadow-sm">
            <div class="card-header d-flex justify-content-between">
                <h5 class="card-title mb-0">Galera de Fotos Visitas</h5>
            </div>

            @foreach ($visitas as $visita)

                <div class="card-body">
                    <div class="row g-2">
                        <h5 class="card-title mb-0">Informações da visita</h5>
                        <div class="col-6 col-md-3">
                            <label class="form-label">Nome: {{ $visita->supermercado_nome ?? '-' }}</label>
                        </div>
                        <div class="col-12 col-md-3">
                            <label class="form-label">Endereço: {{ $visita->supermercado_endereco }} - {{$visita->supermercado_numero}}</label>
                        </div>
                        <div class="col-12 col-md-2">
                            <label class="form-label">Bairro: {{ $visita->supermercado_bairro }} </label>
                        </div>
                        <div class="col-12 col-md-2">
                            <label class="form-label">CEP: {{ $visita->supermercado_cep }} </label>
                        </div>
                        <div class="col-12 col-md-2">
                            <label class="form-label">Estado: {{ $visita->supermercado_uf }} </label>
                        </div>
                        <div class="col-6 col-lg-4">
                            <label class="form-label">Data Visita: {{ $visita->checkin ?? '-' }}</label>
                        </div>
                        <div class="col-6 col-lg-4">
                            <label class="form-label">Hora do check-in: {{ $visita->checkin ?? '-' }}</label>
                        </div>
                        <div class="col-6 col-lg-4">
                            <label class="form-label">Hora do check-out: {{ $visita->checkout ?? '-' }}</label>
                        </div>
                    </div>
                    <div class="row g-2">
                        <div class="col-6 col-lg-4 w-25 p-3">
                            @if ($visita->lk_foto_checkin_thumb != null)
                                <img src="{{ env('AWS_BUCKET_ADDRESS') }}/{{$visita->lk_foto_checkin_thumb}}"alt="Imagem de checkin" class="img-fluid rounded">
                            @else
                                @if ($visita->lk_foto_checkin != null)
                                    <img src="{{ env('AWS_BUCKET_ADDRESS') }}/{{$visita->lk_foto_checkin}}"alt="Imagem de checkin" class="img-fluid rounded">    
                                @else
                                    <img src="https://dummyimage.com/300x400/dee2e6/6c757d.jpg"alt="Imagem de checkin" class="img-fluid rounded">
                                @endif
                            @endif
                        </div>
                        <div class="col-6 col-lg-4 w-25 p-3">
                            @if ($visita->lk_foto_checkout_thumb != null)
                                <img src="{{ env('AWS_BUCKET_ADDRESS') }}/{{$visita->lk_foto_checkout_thumb}}"alt="Imagem de checkin" class="img-fluid rounded">
                            @else
                                @if ($visita->lk_foto_checkout != null)
                                    <img src="{{ env('AWS_BUCKET_ADDRESS') }}/{{$visita->lk_foto_checkout}}"alt="Imagem de checkin" class="img-fluid rounded">    
                                @else
                                    <img src="https://dummyimage.com/300x400/dee2e6/6c757d.jpg"alt="Imagem de checkin" class="img-fluid rounded">
                                @endif
                            @endif
                        </div>
                    </div>
                </div>

            @endforeach

        </div>-->
    </div>
@endsection