@extends('layouts/contentLayoutMaster')

@section('title', 'Input')

@section('content')
<style>
.input-container {
  position: relative;
}

.input-container::before {
  content: "$";
  position: absolute;
  left: 20px;
  top: 56%;
  transform: translateY(-50%);
}

.input-container > input {
  padding-left: 20px; /* Espacio para el símbolo del dólar */
}
</style>
<!-- Basic Inputs start -->
<section id="basic-input">
  <div class="row">
    <div class="col-md-12">
      <div class="card">
        <div class="card-header">
          <h4 class="card-title">Crear Colaborador</h4>
        </div>
        <div class="card-body">
          <div class="row">
          <div class="col-xl-4 col-md-6 col-12">
          <form method="POST" action="/dashboard/crear_empleado/guardar" enctype="multipart/form-data" id="colaborador" onsubmit="return validarFormulario()">
          {!! csrf_field() !!}
              <div class="mb-1">
                <label class="form-label" for="basicInput">Cedula</label>
                <input type="text" name="cedula" class="form-control" value="{{$cedula}}" readonly id="cedula" placeholder="Cedula" />
              </div>
            </div>
            <div class="col-xl-4 col-md-6 col-12">
              <div class="mb-1">
                <label class="form-label" for="basicInput">Nombre</label>
                @if ($nombre!=null)
                    <input type="text" readonly name="nombre"  id="nombre" value="{{$nombre}}" class="form-control" id="basicInput" placeholder="Nombre" />
                @else
                     <input type="text" name="nombre"  class="form-control" id="nombre" placeholder="Nombre" />
                @endif
              </div>
            </div>
            <div class="col-xl-4 col-md-6 col-12">
            <div class="mb-1">
                <label class="form-label" for="basicInput">Sexo</label>
                <br>
                <div class="form-check form-check-inline">
              <input
                class="form-check-input"
                type="radio"
                name="sexo"
                id="inlineRadio1"
                value="Masculino"
                checked
              />
              <label class="form-check-label" for="inlineRadio1">Masculino</label>
            </div>
            <div class="form-check form-check-inline">
              <input
                class="form-check-input"
                type="radio"
                name="sexo"
                id="sexo"
                value="Femenino"
              />
              <label class="form-check-label" for="inlineRadio2">Femenino</label>
            </div>

            </div>
            </div>
            <div class="col-xl-4 col-md-6 col-12">
              <div class="mb-1">
                <label class="form-label" for="disabledInput">Cargo</label>
                <input type="text"  name="cargo" class="form-control" id="cargo"  />
              </div>
            </div>
            <div class="col-xl-4 col-md-6 col-12">
              <div class="mb-1">
                <label class="form-label" for="helperText">Fecha de Inicio</label>
                <input type="date" name="inicio" id="inicio" class="form-control" placeholder="Name" />
               <!-- <p><small class="text-muted">Find helper text here for given textbox.</small></p>-->
              </div>
            </div>
            <div class="col-xl-4 col-md-6 col-12">
              <div class="mb-1">
                <label class="form-label" for="helperText">Fecha de Terminacion</label>
                <input type="date" name="fin" id="fin" class="form-control" placeholder="Name" disabled />
               <!-- <p><small class="text-muted">Find helper text here for given textbox.</small></p>-->
              </div>
            </div>

            <div class="col-xl-4 col-md-6 col-12 input-container">
              <div class="mb-1">
                <label class="form-label" for="disabledInput">Salario</label>
                <span class="input-euro left">
                    <input type="number" name="salario" class="form-control" id="salario" min="0" step="0.01"  />
                </span>
              </div>
            </div>

            <div class="col-xl-4 col-md-4 col-12">
                <div class="mb-1">
                    <label class="form-label" for="helperText">Copia de Cédula </label>
                    <input type="file" required accept="application/pdf"  name="cedula_copia" id="cedula_copia" class="form-control" placeholder="Name" />
                <!-- <p><small class="text-muted">Find helper text here for given textbox.</small></p>-->
                </div>
            </div>

            <div class="col-xl-4 col-md-4 col-12">
                <div class="mb-1">
                    <label class="form-label" for="helperText">Primera hoja del Contrato </label>
                    <input type="file" required accept="application/pdf"  name="contrato" id="contrato" class="form-control" placeholder="Name" />
                <!-- <p><small class="text-muted">Find helper text here for given textbox.</small></p>-->
                </div>
            </div>

            <div class="col-12">
            <a onclick="enviar_carta();" style="margin-bottom:5px; color:#ff9f43" class="btn btn-outline-warning  form-control">Descargar carta de Autorización</a>
                <div class="mb-1">
                    <label class="form-label" for="disabledInput">Carta de Autorización <strong style="color:red">(El colaborador debe firmar la carta igual que en la cédula.)</strong></label>
                    <input type="file" required accept="application/pdf" name="carta" class="form-control" id="carta"  />
                </div>
            </div>


           </form>
          

            
           
            <a onclick="validarFormulario();" style="margin-bottom:5px; color:#28c76f" class="btn btn-outline-success  form-control">Guardar</a>

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

  <div
                class="modal fade"
                id="buscar_empleado"
                tabindex="-1"
                aria-labelledby="exampleModalCenterTitle"
                aria-hidden="true"
              >
                <div class="modal-dialog modal-dialog-centered">
                  <div class="modal-content">
                    <div class="modal-header">
                      <h5 class="modal-title" id="exampleModalCenterTitle">Buscar ex-Colaborador</h5>
                     <!-- <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>-->
                    </div>
                    <div class="modal-body">
                    <div class="col-xl-12 col-md-6 col-12">
                    <form method="POST" action="/dashboard/buscar_empleado" id="busqueda_empleado">
                    {!! csrf_field() !!}
                        <div class="mb-1">
                          <label class="form-label" for="basicInput">Cédula</label>
                          <input type="text" class="form-control" id="basicInput" name="cedula" placeholder="Cédula" />
                        </div>
                      </div>

                        </div>
                        <div class="modal-footer">
                          <button type="button" class="btn btn-outline-primary"  onclick="document.getElementById('busqueda_empleado').submit();" >Aceptar</button>
                        </div>
                    </form>
                  </div>
                </div>
              </div>
            </div>
</section>
<!-- Basic Inputs end -->


<!-- Tooltip validations end -->
@endsection

@section('page-script')
  <!-- Page js files -->
  <script src="{{ asset(mix('js/scripts/forms/form-tooltip-valid.js'))}}"></script>
  
@endsection