@extends('layouts.index', ['subHeader' => 'Nuevo Visitante'])

@section('header')
    <a href="{{ route('home') }}" class="text-decoration-none text-dark">Dashboard</a>
    <a href="{{ route('visitantes.index') }}" class="text-decoration-none text-dark"> / Visitantes</a>
    <span> / Nuevo registro</span>
@endsection

@section('js')
    <script src="{{ asset('js/visitantes/visitantes.js') }}"></script>
@endsection

@section('content')
    <div class="">
        <div class=" d-flex justify-content-end">
            <div class="btn-group" role="group" aria-label="">
                <a href="{{ route('visitantes.index') }}" type="button" class="btn btn-back btn-lg ">
                    <i class="bi bi-arrow-left-circle-fill"></i> Atrás
                </a>
            </div>
        </div>
        <br>
    </div>
    <br>
    <div class="container-fluid shadow-s p-4">
        <form class="row g-3" action="{{ route('visitantes.store') }}" method="POST">
            @csrf
            <h1 class="fs-3 fw-bolder">Nuevo registro de Visitante</h1>

            <!-- aprobacion de registro -->
            @hasanyrole('admin|Super Admin')
                <span class="fs-5">Aprobación de registro</span>

                <div class="mt-2 d-flex flex-wrap">
                    <div class="d-flex flex-wrap">
                        <div class="form-check m-2">
                            <input class="form-check-input" type="radio" name="aprobacion" id="aprobacion1" value="1"
                                checked>
                            <div>
                                <img src="{{ asset('img/exitoso.png') }}" width="15px" alt="">
                                <label class="fs-6" for="aprobacion1">
                                    Aprobado
                                </label>
                            </div>
                        </div>
                        <div class="form-check m-2">
                            <input class="form-check-input" type="radio" name="aprobacion" id="aprobacion2" value="0">
                            <div>
                                <img src="{{ asset('img/error.png') }}" width="15px" alt="">
                                <label class="fs-6" for="aprobacion2">
                                    Rechazado
                                </label>
                            </div>
                        </div>
                    </div>
                </div>
                @error('aprobacion')
                    <div class="text-danger">@lang($message)</div>
                @enderror
                <hr>
            @endhasanyrole


            <!-- fin aprobacion de registro -->

            <!-- Fecha y hora entrada -->
            <div class="col-md-4">
                <label for="fecha_entrada" class="form-label fw-bolder">Fecha y hora entrada</label>
                <input type="datetime-local" class="form-control fromcss form-control-lg" name="fecha_entrada"
                    id="fecha_entrada" value="{{ old('fecha_entrada') }}" required>
                @error('fecha_entrada')
                    <div class="text-danger" style="color: red;">@lang($message)</div>
                @enderror
            </div>

            <!-- Fecha y hora salida -->
            <div class="col-md-4">
                <label for="fecha_salida" class="form-label fw-bolder">Fecha y hora salida</label>
                <input type="datetime-local" class="form-control fromcss form-control-lg" name="fecha_salida"
                    id="fecha_salida" value="{{ old('fecha_salida') }}" required>
                @error('fecha_salida')
                    <div class="text-danger" style="color: red;">@lang($message)</div>
                @enderror
            </div>

            <div class="col-md-4">
                <label for="tiempo" class="form-label fw-bolder ">Tiempo</label>
                <input type="text" class="form-control fromcss form-control-lg" name="tiempo" id="tiempo"
                    placeholder="00:00" value="{{ old('tiempo') }}" readonly required>
                @error('tiempo')
                    <div class="text-danger" style="color: red;">@lang($message)</div>
                @enderror
            </div>
            <div class="col-md-4">
                <label for="nombre_empleado" class="form-label fw-bolder ">Nombre empleado</label>
                <input type="number " class="form-control fromcss form-control-lg" name="nombre_empleado"
                    id="nombre_empleado" placeholder="Nombre" value="{{ old('nombre_empleado') }}" required>
                @error('nombre_empleado')
                    <div class="text-danger" style="color: red;">@lang($message)</div>
                @enderror
            </div>
            <div class="col-md-4">
                <label for="apellido_empleado" class="form-label fw-bolder">Apellido empleado</label>
                <input type="text" class="form-control form-control-lg fromcss" name="apellido_empleado"
                    id="apellido_empleado" placeholder="Apellido " value="{{ old('apellido_empleado') }}" required>
                @error('apellido_empleado')
                    <div class="text-danger" style="color: red;">@lang($message)</div>
                @enderror
            </div>
            <div class="col-md-4">
                <label for="documento_visitante" class="form-label fw-bolder">Documento visitante</label>
                <input type="text" class="form-control form-control-lg fromcss" name="documento_visitante"
                    id="documento_visitante" placeholder="No. Documento" value="{{ old('documento_visitante') }}"
                    required>
                @error('documento_visitante')
                    <div class="text-danger" style="color: red;">@lang($message)</div>
                @enderror
            </div>
            <div class="col-md-4">
                <label for="nombre_visitante" class="form-label fw-bolder">Nombre visitantes</label>
                <input type="text" class="form-control form-control-lg fromcss" name="nombre_visitante"
                    id="nombre_visitante" placeholder="Nombre" value="{{ old('nombre_visitante') }}" required>
                @error('nombre_visitante')
                    <div class="text-danger" style="color: red;">@lang($message)</div>
                @enderror
            </div>
            <div class="col-md-4">
                <label for="apellido_visitante" class="form-label fw-bolder">Apellido visitante</label>
                <input type="text" class="form-control form-control-lg fromcss" name="apellido_visitante"
                    id="apellido_visitante" placeholder="Apellido" value="{{ old('apellido_visitante') }}" required>
                @error('apellido_visitante')
                    <div class="text-danger" style="color: red;">@lang($message)</div>
                @enderror
            </div>
            <div class="col-md-4">
                <label for="dependencia" class="form-label fw-bolder">Dependencia</label>
                <input type="text" class="form-control form-control-lg fromcss" name="dependencia" id="dependencia"
                    placeholder="Dependencia" value="{{ old('dependencia') }}" required>
                @error('dependencia')
                    <div class="text-danger" style="color: red;">@lang($message)</div>
                @enderror
            </div>
            <div class="col-md-4">
                <label for="nombre_operador" class="form-label fw-bolder">Nombre operador</label>
                <input type="text" class="form-control form-control-lg fromcss" name="nombre_operador"
                    id="nombre_operador" placeholder="Nombre" value="{{ old('nombre_operador') }}" required>
                @error('nombre_operador')
                    <div class="text-danger" style="color: red;">@lang($message)</div>
                @enderror
            </div>
            <div class="col-md-4">
                <label for="apellido_operador" class="form-label fw-bolder">Apellido operador</label>
                <input type="text" class="form-control form-control-lg fromcss" name="apellido_operador"
                    id="apellido_operador" placeholder="Apellido" value="{{ old('apellido_operador') }}" required>
                @error('apellido_operador')
                    <div class="text-danger" style="color: red;">@lang($message)</div>
                @enderror
            </div>
            <div class="col-md-4">
                <label for="empresa_id" class="form-label fw-bolder">Empresa</label>
                <select name="empresa_id" id="empresa_id" class="form-select form-select-lg fromcss"
                    data-control="select2" data-placeholder="Seleccione la Empresa..." required>
                    <option></option>
                    @foreach ($entidades as $entidad)
                        <option value={{ $entidad->id }}>{{ $entidad->nombre }}</option>
                    @endforeach
                </select>
                @error('empresa_id')
                    <div class="text-danger" style="color: red;">@lang($message)</div>
                @enderror
            </div>

            <span class="fs-6 mt-5">Autorizo verbalmente las políticas y el tratamiento de los datos.
                .</span>
            <div class="d-flex flex-row">
                <div class="form-check form-check-inline">
                    <input class="form-check-input" type="radio" name="tratamiento_datos" id="tratamiento_datos"
                        value="1">
                    <label class="form-check-label" for="tratamiento_datos">Si</label>
                </div>
                <div class="form-check form-check-inline">
                    <input class="form-check-input" type="radio" name="tratamiento_datos" id="tratamiento_datos"
                        value="0">
                    <label class="form-check-label" for="tratamiento_datos">No</label>
                </div>
                @error('tratamiento_datos')
                    <div class="text-danger" style="color: red;">@lang($message)</div>
                @enderror
            </div>

            <br>
            <div class="col-12 d-flex justify-content-end mt-5">
                <div class="flex-row g-4 w-100 justify-content-end">
                    <a href="{{ route('visitantes.index') }}" class=" btn btn-lg mb-3 btn-cancelar">Cancelar</a>
                    <button class=" btn btn-lg mb-3 btn-enviar" type="submit">Guardar</button>
                </div>
            </div>
        </form>
    </div>
@endsection