@extends('main.template')

@section('content')

<div class="row">
    @if(!empty($products_missing))
    <div class="col-sm-12">
        <a href="{{ route('import.synchronize') }}" class="btn btn-success">Voltar</a>
        <hr class="sidebar-divider d-none d-md-block">
        <h1 class="h3 mb-2 text-gray-800">Produtos existentes no Catalogo que ainda não foram importados</h1>
        <div class="panel panel-primary">
            <div class="panel-body">
                <div class="table-responsive">
                    <table class="table table-bordered table-hover table-striped" id="products-list">
                        <thead>
                            <tr>
                                <th>ID</th>
                                <th>Nome + Descrição</th>
                                <th>Extra Info</th>
                                <th>Metric</th>
                                <th>Pack_size</th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach ($products_missing as $external_id => $product)
                            <tr>
                                <td>{{ $external_id }}</td>
                                <td>{{ $product['name'] }} <br>
                                    <small>{{ $product['description'] }}</small>
                                </td>
                                <td>
                                    {{ $product['extra_info'] }}
                                </td>
                                <td>
                                    {{ $product['metric'] }}
                                </td>
                                <td>
                                    {{ $product['pack_size'] }}
                                </td>
                            </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
        <a href="{{ route('import.synchronize') }}" class="btn btn-success">Voltar</a>
    </div>
    <div class="clearfix"></div>
    @endif
</div>


@endsection