<div>
    @component('common.breadcrumb', ['addBtn' => false, 'permission_create' => 'Company_employees_import','breadcrumb_show' => $breadcrumb_show])
        @slot('breadcrumb_title')
            <h3>{{ $componentName }} | {{ $pageTitle }}</h3>
        @endslot
        <li class="breadcrumb-item">Empleados</li>
        <li class="breadcrumb-item active">Importar</li>
    @endcomponent

    @include('common.searchbox')
    <div class="container-fluid">
        <div class="row layout-top-spacing">
            <div class="col-sm-12">
                <div class="card">
                    <div class="card-body">
                        <div class="card-header">
                            <h4>{{ $company_name }} | Plan: <b>{{ $company_plan_name }}</b></h4>
                            <h6> Numero de empleados registrados: <b>{{ $company_employees_count }}</b> / <b>{{ $company_employees_max }}</b></h6>
                        </div>
                        <div class="card-content">
                            <div class="row">
                                <div class="col-sm-12 col-md-5">
                                    <div class="form-group">
                                        <label>Selecciona un archivo</label> <small class="text-muted">(.xlsx, .xls, .csv)</small>
                                        <input type="file" wire:model="file" class="form-control" accept=".xlsx, .xls, .csv,">
                                        @error('file')
                                            <span class="text-danger er">{{ $message }}</span>
                                        @enderror
                                    </div>
                                </div>

                                <div class="col-sm-12 col-md-4">
                                    <div class="form-group">
                                        <label>Plantilla de Excel</label><br>
                                        <a href="{{ asset('assets/plantillas/plantilla_importar_empleados.xlsx') }}" class="btn btn-outline-primary" target="_blank">
                                            Descargar Plantilla de Importación <i class="fas fa-download"></i>
                                        </a>
                                        <br><br>
                                        <a href="{{ asset('assets/plantillas/codigos_importacion.xlsx') }} " class="btn btn-outline-primary" target="_blank">
                                            Descargar Códigos campos <i class="fas fa-download"></i>
                                        </a>
                                    </div>
                                </div>
                                <div class="col-sm-12 col-md-3">
                                    <div class="form-group">
                                        <label>&nbsp;</label><br>
                                        <button type="submit" class="btn btn-primary" wire:click.prevent="importData()">IMPORTAR <i class="fas fa-file-import"></i></button>
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-12">
                                    @if (isset($errors) && $errors->any())
                                        <div class="alert alert-danger">
                                            <ul>
                                                @foreach ($errors->all() as $error)
                                                    <li>{{ $error }}</li>
                                                @endforeach
                                            </ul>
                                        </div>
                                    @endif
                                </div>
                            </div><!-- end row -->
                        </div>
                    </div>
                </div>
            </div>
            @if (session()->has('failures'))
            <div class="col-sm-12">
                <div class="card">
                    <div class="table-responsive">
                        <table class="table">
                            <thead class="bg-primary">
                                <tr>
                                    <th># Fila</th>
                                    <th>Campo</th>
                                    <th>Error</th>
                                    <th>Valor</th>
                                </tr>
                            </thead>
                            <tbody class="tbody-danger">
                                @foreach (session()->get('failures') as $validation)
                                    <tr>
                                        <td>{{ $validation->row() }}</td>
                                        <td>{{ $validation->attribute() }}</td>
                                        <td>
                                            <ul>
                                                @foreach ($validation->errors() as $e)
                                                    <li>{{ $e }}</li>
                                                @endforeach
                                            </ul>
                                        </td>
                                        <td>{{ $validation->values()[$validation->attribute()] }}</td>
                                    </tr>
                                @endforeach
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
            @endif
            <div class="col-sm-12">
                <div class="card">
                    <div class="table-responsive">
                        <table class="table">
                            <thead class="bg-primary">
                                <tr>
                                    <th scope="col">NOMBRE @include('common.orderby', ['column' => 'name'])</th>
                                    <th scope="col" class="text-center">APELLIDO @include('common.orderby', ['column' => 'last_name'])</th>
                                    <th scope="col" class="text-center">DOCUMENTO @include('common.orderby', ['column' => 'document'])</th>
                                    <th scope="col" class="text-center">TELÉFONO</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach ($users as $item)
                                    <tr>
                                        <td>{{ $item->first_name }}</td>
                                        <td class="text-left">{{ $item->last_name }}</td>
                                        <td class="text-left">{{ $item->document }}</td>
                                        <td class="text-left">{{ $item->phone }}</td>
                                    </tr>
                                @endforeach
                            </tbody>
                        </table>
                        {{ $users->links() }}
                    </div>

                </div>
            </div>
        </div>

    </div>
</div>
@include('common.scriptsCompStandar')
