@extends('layouts.app')

@section('breadcrumb')
<nav aria-label="breadcrumb">
  <ol class="breadcrumb">
    <li class="breadcrumb-item"><a href="{{ route('home') }}">Inicio</a></li>
    <li class="breadcrumb-item active"><a href="{{ route('portalreclutamiento.index') }}">Portal de Reclutamiento</a></li>
    <li class="breadcrumb-item active"><a href="{{ route('portalreclutamiento.nuevo') }}">@{{titulo_pagina}}</a></li>
  </ol>
</nav>
@stop

@section('content')
<b-card>

<div class="align-items-center d-flex justify-content-between">
        <h2 class="">@{{titulo_pagina}}</h2>
        <b-button-toolbar aria-label="Submenú toolbar" class="">
            <!-- <b-button-group class="mx-1">
              <a href="{{route('pagohonorarios.index')}}" class="btn btn-primary">Nuevo Lote</a>             
            </b-button-group> -->
          </b-button-toolbar>
</div>
<div class="row">
<div class="form-group  col-2">
      <label for="rut" class="font-weight-bold">RUT</label>
      <b-form-input :disabled='lectura' v-on:blur="validaRut" v-on:keyup.enter="validaRut" :state="rutvalido" v-model="item.rut" type="text" name="rut" id="rut" required="required" autocomplete="off" class="form-control"></b-form-input>
    </div>
    <div class="form-group  col-5">
      <label for="nombres" class="font-weight-bold">Nombres</label>
      <b-form-input :disabled='lectura' v-model="item.nombres" type="text" name="nombres" id="nombres" required="required" autocomplete="off" class="form-control"></b-form-input>
    </div>
    <div class="form-group  col-5">
      <label for="apellidos" class="font-weight-bold">Apellidos</label>
      <b-form-input :disabled='lectura' v-model="item.apellidos" type="text" name="apellidos" id="apellidos" required="required" autocomplete="off" class="form-control"></b-form-input>
    </div>
    <div class="form-group  col-6">
      <label for="profesion" class="font-weight-bold">Profesión/Oficio</label>
      <b-form-input :disabled='lectura' v-model="item.profesion" type="text" name="profesion" id="profesion" required="required" autocomplete="off" class="form-control"></b-form-input>
    </div>
    <div class="form-group  col-3">
      <label for="email" class="font-weight-bold">Email</label>
      <b-form-input :disabled='lectura' v-model="item.email" type="email" name="email" id="email" required="required" autocomplete="off" class="form-control"></b-form-input>
    </div>
    <div class="form-group  col-3">
      <label for="telefono" class="font-weight-bold">Teléfono</label>
      <b-form-input :disabled='lectura' v-model="item.telefono" type="text" name="telefono" id="telefono" required="required" autocomplete="off" class="form-control"></b-form-input>
    </div>
    <div class="form-group col-sm-3">
      <label for="tipo" class="font-weight-bold">Tipo</label>
      <v-select :disabled='lectura' v-model="item.tipo" :options="tipos" name="tipo" id="tipo" required="required"></v-select>
    </div> 
    <div class="form-group col-sm-2">
      <label for="disponibilidad" class="font-weight-bold">Disponibilidad</label>
      <v-select :disabled='lectura' v-model="item.disponibilidad" :options="disponibilidades"  name="disponibilidad" id="disponibilidad" required="required"></v-select>
    </div>

    <div class="form-group col-sm-2">
      <label for="fecha_inicio" class="font-weight-bold">Desde</label>
      <b-form-input :disabled='lectura' v-model="item.fecha_inicio" type="date" name="fecha_inicio" id="fecha_inicio" required="required" autocomplete="off" class="form-control"></b-form-input>
    </div> 

    <div class="form-group col-sm-2">
      <label for="fecha_fin" class="font-weight-bold">Hasta</label>
      <b-form-input :disabled='lectura' v-model="item.fecha_fin" type="date" name="fecha_fin" id="fecha_fin" required="required" autocomplete="off" class="form-control"></b-form-input>
    </div> 
    <div class="form-group col-sm-3  col-12">
      <label for="estado" class="font-weight-bold">Estado</label>
      <b-form-select :disabled='lectura' v-model="item.estado" :options="estados" value-field="id" text-field="nombre"  required="required"></b-form-select>
    </div>

    <div class="form-group col-sm-12  col-12">
      <label for="extracto" class="font-weight-bold">Extracto</label>
      <b-form-textarea :disabled='lectura' v-model="item.extracto" type="text" name="extracto" id="extracto" autocomplete="off" class="form-control"></b-form-textarea>
    </div>    
    
    <div v-if="item.cv==null" class="form-group col-sm-12  col-12">
      <label for="Curriculum" class="font-weight-bold">Curriculum</label>
      <b-form-file :disabled='lectura' v-model="item.cv_input" type="text" name="cv" id="cv" autocomplete="off" class="form-control"></b-form-file>
    </div>

    <div v-else class="form-group col-sm-12  col-12">
      <label for="Curriculum" class="font-weight-bold">Curriculum</label>
      <p><a :href="'{{config('app.app_url')}}/storage/'+item.cv" target="_blank">Curriculum</a>&nbsp;<span v-if="!lectura" class="text-danger" @click="borrarCV"><i class="fa fa-trash"></i></span></p>
    </div>
      
    <div class="form-group col-sm-12  col-12">
      <label for="observaciones" class="font-weight-bold">Información Adicional</label>
      <b-form-textarea :disabled='lectura' v-model="item.observaciones" type="text" name="observaciones" id="observaciones" autocomplete="off" class="form-control"></b-form-textarea>
    </div> 
    

</div>


<div class="d-flex justify-content-end col mt-5" >
    <b-button class="ml-1" variant="secondary" href="{{ route('portalreclutamiento.index') }}">Cerrar</b-button>
    <b-button class="ml-1" v-if='!lectura' variant="primary" @click="guardarNomina">Guardar</b-button>
</div>

</b-card>


@endsection


@push('pre-scripts')

<script>

window.pageMix.push({
    data() {
        return {
            titulo_pagina:"Nuevo Ingreso de Persona",
            lectura:false,
            rutvalido:false,
            item:{},
            tipos:["Práctica","Trabajo","Otro"],
            disponibilidades:["Parcial","Completa"],
            estados:[{id:1,nombre:'En Borrador'},{id:2,nombre:'Disponible'},{id:3,nombre:'En Municipio'},{id:4,nombre:'No Disponible'}],

        }
    },
    created() {
      @isset($item)
      this.item = @json($item);
      this.lectura ={{$lectura ?? 'true'}};
      this.titulo_pagina = (this.lectura)?"Ver Postulante ID:" + this.item.id :"Editar Postulante ID:" + this.item.id;
      this.rutvalido=true;
      @else
      this.item.estado=1;
      @endisset
    },
    computed:{
      
    },
    methods: {
      guardarNomina(){
        let formData = new FormData();
        //formData.append("cv_input",this.)
        Object.entries(this.item).forEach(([key, value]) => {
            formData.append(key, value);
        });
        let url=route('portalreclutamiento.guardar')
            axios.post(url,formData,{headers: {'Content-Type': 'multipart/form-data'}})
            .then(response => {
              if(response.data.estado==="OK"){
                this.$swal.fire({
                icon: 'success',
                    title: 'CV Guardado',
                    text: '¿seguir editando?',
                    allowOutsideClick:false,
                    showCancelButton: true,
                    confirmButtonText: 'Seguir',
                    cancelButtonText: 'Salir',
                }).then((result) => {
                    console.log(result);
                    if (result.isConfirmed) {
                      window.location.href = response.data.urlredir;
                    } else if (result.dismiss=="cancel") {
                      window.location.href = route("portalreclutamiento.index");
                    }
                })
                
              }else{
                  this.$swal.fire("Error al intentar guardar, inténtelo nuevamente")
              }
            })
            .catch(error => {
            
              if(error.response.status==422){
                  let arr = error.response.data.errors;
                  let str = "";
                  Object.keys(arr).forEach(key => {
                  str = str + "- " +arr[key][0]+"<br/>";
                  });
                  this.$swal.fire("Datos incompletos ",str);

              }else{
                  this.$swal.fire("Error en la respuesta del servidor",error.response.status);
              }
            });
      },
      borrarCV(i) {
        this.$swal.fire({
          title: 'Desea Eliminar el CV subido',
          text: 'Este proceso es irreversible',
          allowOutsideClick:false,
          showCancelButton: true,
          confirmButtonText: 'Borrar',
          cancelButtonText: 'Salir',
        }).then((result) => {
          if (result.isConfirmed) {
             





          }
        })
      },
      validaRut: function(e) {
        //console.log(e.target.value);
        rutCompleto = e.target.value.replace("‐", "-");
        if (!/^[0-9]+[-|‐]{1}[0-9kK]{1}$/.test(rutCompleto)){
          this.rutvalido=false;
          return false;
        }
          
        let tmp = rutCompleto.split('-');
        let digv = tmp[1];
        let rut = tmp[0];
        if (digv == 'K') digv = 'k';
        this.rutvalido=(this.dv(rut) == digv);
        // if(this.rutvalido){
        //   this.buscarRut(true);
        // }
       // return (this.dv(rut) == digv);


      },
      dv: function(T) {
        var M = 0,
          S = 1;
        for (; T; T = Math.floor(T / 10))
          S = (S + T % 10 * (9 - M++ % 6)) % 11;
        return S ? S - 1 : 'k';
      },
    },
    filters:{
        currency(value) {
            return new Intl.NumberFormat("es-CL",{ style: "currency", currency: "CLP" }).format(value);
        },
        fecha(value){
            let fecha =moment(value).format("DD-MM-YYYY");
            return (fecha!='Invalid date')?fecha:'...';
        }
    },
   
});
</script>
@endpush