@extends('layouts.app')

@section('content')
    @push('links')
        <link rel="stylesheet" href="https://cdn.datatables.net/1.13.6/css/jquery.dataTables.min.css">
    @endpush
    <div class="x_panel rounded p-4">
        <div class="bg-malva-700 rounded row">
            <div class="col-md-6 p-5">
                <form action="{{ route('report-creations.index') }}">
                    <div class="d-flex justify-content-start">
                        <select name="portal" class="form-control rounded">
                            @foreach ($portales as $portal)
                                <option value="{{ $portal->name }}">
                                    {{ $portal->name }}
                                </option>
                            @endforeach
                        </select>
                        <input type="submit" value="Consultar" class="btn btn-malva" onclick="openLoading()">
                    </div>
                    <div>
                    </div>
                </form>
            </div>
        </div>
    </div>

    <div class="x_panel m-auto">
        <div class="x_title">
            <h3>Reporte de creaciones</h3>
        </div>
        <div class="x_content">
            <ul class="nav nav-tabs bar_tabs" id="myTab" role="tablist">
                <li class="nav-item">
                    <a class="nav-link active" id="profile-tab" data-toggle="tab" href="#created" role="tab"
                        aria-controls="profile" aria-selected="true">Creados</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" id="home-tab" data-toggle="tab" href="#not-created" role="tab"
                        aria-controls="home" aria-selected="false">No Creados</a>
                </li>
            </ul>

            @if ($portal_)
                <div>
                    <a href="https://malvavendor.com/report-creations-excel/{{ $portal_ }}"
                        class="btn btn-malva btn-sm" onclick="openLoading()">
                        <i class="fa fa-download"></i>
                        Descargar
                    </a>
                </div>
            @endif
            <div class="tab-content" id="myTabContent">
                <div class="tab-pane fade" id="not-created" role="tabpanel" aria-labelledby="home-tab">
                    <div class="container ">
                        <table class="table table-hover table-responsive" id="not_created">
                            <thead class="bg-malva text-white">
                                <tr>
                                    <th>Sku Malva</th>
                                    <th>Code Group</th>
                                    <th>Marca</th>
                                    <th>Precio</th>
                                    <th>Imagenes</th>
                                    <th>Ficha</th>
                                    <th>Última Intento</th>
                                    <th>Error Reportado</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach ($not_created as $item)
                                    <tr>
                                        <td>{{ $item->sku_malva }}</td>
                                        <td>{{ $item->code_group_ }}</td>
                                        <td>{{ $item->brand_ }}</td>
                                        <td>{{ $item->pvp }}</td>
                                        <td>{{ $item->imgs }}</td>
                                        <td>{{ $item->ficha }}</td>
                                        <td>{{ $item->updated_at }}</td>
                                        <td>{{ $item->log_creation }}</td>
                                    </tr>
                                @endforeach
                            </tbody>
                        </table>
                    </div>
                </div>
                <div class="tab-pane fade active show" id="created" role="tabpanel" aria-labelledby="profile-tab">

                    <table class="table table-hover table-responsive" id="not_created">
                        <thead class="bg-malva text-white">
                            <tr>
                                <th>Sku Malva</th>
                                <th>Code Group</th>
                                <th>Portal</th>
                                <th>Precio</th>
                                <th>Oferta</th>
                                <th>Cantidad</th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach ($created as $item)
                                <tr>
                                    <td>{{ $item->sku_malva }}</td>
                                    <td>{{ $item->code_group }}</td>
                                    <td>{{ $item->portal }}</td>
                                    <td>{{ $item->price }}</td>
                                    <td>{{ $item->sale_price }}</td>
                                    <td>{{ $item->quantity }}</td>
                                </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>

            </div>
        </div>

    </div>
@endsection

@push('scripts')
    <script>
        $(document).ready(function() {
            $('#created').DataTable();
            $('#not_created').DataTable();
        });
    </script>
@endpush