@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"><a href="{{ route('evaluacionproveedores.listaproyectos')}}">Evaluación de Proveedores</a></li>
    <li class="breadcrumb-item"><a href="{{ route('evaluacionproveedores.listaproyectos')}}">Proyectos</a></li>
    <li class="breadcrumb-item"><a href="{{ route('evaluacionproveedores.verproyecto',['id'=>$proyecto['id'] ])}}">Proyecto {{ $proyecto['id'] }}</a></li>
    <li class="breadcrumb-item active" aria-current="page"><template>@{{ headerTitle }}</template></li>
  </ol>
</nav>
@stop

@push('head')

@endpush

@section('content')
   
    <div class="bgc-white p-20 bd">
      <!-- <div class="flex clearfix pB-15">
          <b-button-toolbar aria-label="Submenú modulo evaluación proveedores " class="pull-left">
            <b-button-group class="mx-1">
              <b-button href="{{ route('evaluacionproveedores.listaproyectos')}}" variant="primary">Proyectos</b-button>
              <b-button href="{{ route('evaluacionproveedores.listaproveedores')}}" variant="light">Proveedores</b-button>
            </b-button-group>
          </b-button-toolbar>

           <b-button-toolbar aria-label="Submenú toolbar " class="pull-right">
            <b-button-group class="mx-1">
              <a href="{{route('evaluacionproveedores.crearproyecto')}}" target="_blank" class="btn btn-primary">Agregar Proyecto</a>
            </b-button-group>
          </b-button-toolbar> 
      </div> -->

      @if ($errors->any())
    <div class="alert alert-danger">
        <ul>
            @foreach ($errors->all() as $error)
                <li>{{ $error }}</li>
            @endforeach
        </ul>
    </div>
    @endif
  <b-card :title="headerTitle">
  <h5 class="card-title">Datos de Proyecto</h5>
  <dl class="row">
    <dt class="col-sm-3">Nombre de Proyecto</dt><dd class="col-sm-9">@{{proyecto.nombre_proyecto}}</dd>
    <dt class="col-sm-3">Proveedor</dt><dd class="col-sm-9">@{{proyecto.proveedor.nombre}}</dd>
    <dt class="col-sm-3">Unidad Técnica</dt><dd class="col-sm-9">@{{proyecto.supervisor.direccion.nombre}}</dd>
    <dt class="col-sm-3">Supervisor</dt><dd class="col-sm-9">@{{proyecto.supervisor.full_name}}</dd>
  </dl>



  
  <b-form id="formulario"  ref="formulario" action="{{route('evaluacionproveedores.guardarcontrato')}}" method="POST" novalidate class="was-validated" >
  @csrf
  
  @isset($valores["id"])
    <input type="hidden" name="id" v-model="datos.id"></input>
  @endisset

  <input type="hidden" name="id_proyecto" v-model="proyecto.id"></input>

  <div class="row d-flex">
  <b-form-group
        label="Tipo de Contrato"
        class="col-md-2"
      >
        <b-form-select required  name="tipo_oc" size="sm"  v-model="datos.tipo_oc" :options="tipoContratos" value-field="id"
      text-field="nombre">
          <template v-slot:first>
            <b-form-select-option :value="null" disabled>-- Seleccione --</b-form-select-option>
          </template>
        </b-form-select>
        </b-form-group>

        <b-form-group
          label="Nº OC"
          
          class="col-md-2"
        >
          <b-form-input   size="sm"   name="n_oc" v-model="datos.n_oc"></b-form-input>
        </b-form-group>

        <b-form-group
          label="DA"
          
          class="col-md-2"
        >
          <b-form-input   size="sm"   name="da_contrato" v-model="datos.da_contrato"></b-form-input>
        </b-form-group>

        
        <b-form-group
          label="Inicio"
          
          class="col-md-2"
        >
          <b-form-input   size="sm"  required  name="fecha_inicio" type="date" v-model="datos.fecha_inicio"></b-form-input>
        </b-form-group>

        <b-form-group
          label="Fin"
          
          class="col-md-2"
        >
          <b-form-input   size="sm"   required name="fecha_termino" type="date" v-model="datos.fecha_termino"></b-form-input>
        </b-form-group>

        <b-form-group
          label="Monto"
          
          class="col-md-2"
        >
          <b-form-input   size="sm" required name="monto_oc" v-model="datos.monto_oc"></b-form-input>
        </b-form-group>

        <b-form-group
          label="Observaciones"
          
          class="col-md-12"
        >
          <b-form-input name="observaciones" v-model="datos.observaciones"></b-form-input>
        </b-form-group>
    

  </div>

  <div class="d-flex  justify-content-end bT-15">

      <b-button type="submit" size="lg" @click="enviarDatos" variant="primary">Aceptar</b-button>

  </div>

  
</b-form>



  </b-card>
</div>




@endsection

@push('pre-scripts')
<script>
window.pageMix.push({

  data() {
    return {
      datos:@json($valores ?? [] ),
      proyecto:@json($proyecto ?? [] ),
      rut:'',
      tipoContratos:[
        {id:1,nombre:"Contrato"},
        {id:2,nombre:"Prórroga"},
        {id:3,nombre:"Anexo"},  
      ],
    }
  },
  computed: {
    headerTitle() {
        if(this.datos.id==null)
          return 'Nuevo Contrato';
        else
        {
          if(this.modo=="view")
          return 'Ver Contrato';
          else
          return 'Editar Contrato';
        }
          
    }
  },

  mounted(){
   
  },
  methods:{
    enviarDatos:function(e){
        if(this.validateForm()){
          return true;
        } 
        else{
          e.preventDefault();
          return false;
        }
    },
    formatRut(valor){
        valor = valor.replace(/^0+|[^0-9kK]+/g,'');
        if(valor.length==0)
          return '';
        dv = valor.slice(-1).toUpperCase();
        cuerpo = valor.slice(0,-1);
        
        valor = cuerpo + '-'+ dv
        return valor;
    },
    checkRut:function(e) {
        let rut = e.target;

        valor = this.formatRut(rut.value);
        valor = valor.replace("-","");
        dv = valor.slice(-1).toUpperCase();
        cuerpo = valor.slice(0,-1);

        if(cuerpo.length < 7) {
           rut.setCustomValidity("RUT Incompleto"); 
           return false;
        }
        suma = 0;
        multiplo = 2;
        for(i=1;i<=cuerpo.length;i++) {
            index = multiplo * valor.charAt(cuerpo.length - i);
            suma = suma + index;
            if(multiplo < 7) { multiplo = multiplo + 1; } else { multiplo = 2; }
        }
        dvEsperado = 11 - (suma % 11);
        dv = (dv == 'K')?10:dv;
        dv = (dv == 0)?11:dv;
        if(dvEsperado != dv) { 
          rut.setCustomValidity("RUT Inválido");
           return false; 
        }
        rut.setCustomValidity('');
        //return valor;
    },
    validateForm () {
        var formId = 'formulario';
        var nodes = document.querySelectorAll(`#${formId} :invalid`);
        var errorObjectName = 'validationErrors';
        var vm = this; //current vue instance;
        if (nodes.length > 0) {
            return false;
        }
        else {
            return true;
        }
    }
  }

});

</script>





@endpush

@push('post-scripts')
   
@endpush