@extends('layouts.master')
@section('title') @lang('Facedra') @endsection

@section('css')
    <link href="{{ URL::asset('assets/libs/jquery-ui/jquery-ui.min.css')}}" type="text/css" />
    <link href="{{ URL::asset('assets/css/bootstrap.min.css')}}" id="bootstrap-style" rel="stylesheet" type="text/css" />
	<link href="{{ URL::asset('assets/css/app.min.css')}}" id="app-style" rel="stylesheet" type="text/css" />
    <link href="{{ URL::asset('assets/libs/twitter-bootstrap-wizard/twitter-bootstrap-wizard.min.css')}}" rel="stylesheet" type="text/css" />


@endsection

@section('content')
@component('common-components.breadcrumb')
    @slot('pagetitle') Principios Activos @endslot
    @slot('title') Adicionar @endslot
@endcomponent
<div class="row">
    <div class="col-lg-12">
        <div class="card">
            <div class="card-body">
                <h4 class="card-title">Administracion de Principios Activos</h4>
                <p class="card-title-desc">
                    Usted se encuentra en el modulo de Administracion de Principios Activos Adicionar.
                </p>
                <hr>
                <div class="tab-pane" id="progress-seller-details">
                    <h5></h5>
                    <form class="custom-validation" id="formPaciente"  method="post" action="{{route('principios.store')}}" data-parsley-validate>
                        @csrf
                        <div class="row">
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label for="progresspill-firstname-input">Código<span class="text-danger">(*)<span></label>
                                    <input type="text" class="form-control parsley-error" id="codigo" name="codigo"  required>
                                </div>
                            </div>
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label for="progresspill-lastname-input">Letra<span class="text-danger">(*)</span></label>
                                    <input type="text" class="form-control parsley-error" id="letra" name="letra" data-parsley-pattern="^[a-zA-Z ]+$"  data-parsley-trigger="keyup" required >
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label for="progresspill-phoneno-input">Nombre<span class="text-danger">(*)</span></label>
                                    <input type="text" class="form-control" id="nombre" name="nombre"  required>
                                </div>
                            </div>
                            <div class="col-lg-6">
                                <div class="form-group">
                                        <label for="progresspill-firstname-input">Principio activo Whodrug</label>
                                        <select class="form-control select2" name="id_principio_activo_wd" id="id_principio_activo_wd" >
                                            <option value="" >Seleccione</option>
                                            @foreach ($principios_wd as $item)
                                            <option value="{{$item->ID_OTRO_PRODUCTO_PRINCIPIOS_ACTIVOS_WD}}">
                                                {{$item->PRINCIPIO_ACTIVO}}
                                            </option>
                                            @endforeach
                                        </select>
                                </div>                         
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-12">
                                <a href="{{Route('principios')}}"><button type="button" class="btn btn-secondary w-md"><i class="uil-arrow-left"></i>Regresar</button></a>
                                <button type="submit" class="btn btn-primary w-md" id="guardar">Guardar Datos</button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- end row -->

@endsection
@section('script')
    <script src="{{ URL::asset('assets/libs/twitter-bootstrap-wizard/twitter-bootstrap-wizard.min.js')}}"></script>
    <script src="{{ URL::asset('assets/js/pages/form-wizard.init.js')}}"></script>
    <script src="{{ URL::asset('assets/libs/jquery-ui/jquery-ui.min.js')}}"></script>
    <script>


        get_region();
        uncheck();
        //llenando el select de departamento/provincia dependiento el pais seleccionado
        function get_region(id_pais=0){
            var id_pais = $('#pais').val(); 
            var ruta = "{{ url('pais/municipioselect/get/') }}/"+id_pais;
    
            //extraer por ajax en ruta api
            
            $.get(ruta,function(response){
                var new_html = '<option value=0>-- Seleccionar --</option>';
                var id_pais = $('#pais').val(); 
                //window.alert(id_pais);
                for (var i = 0; i < response.length; i++) {
                    if(response[i].REGI_ID_PAIS == id_pais ){
                    new_html += '<option value="'+response[i].REGI_COD_REGION+'">'+response[i].REGI_DS_REGION	+'</option>'
                    }else{
                    new_html += '<option value="'+response[i].REGI_COD_REGION+'">'+response[i].REGI_DS_REGION	+'</option>'
                    }
                }
                
        
                $('#departamento').empty();
                $('#departamento').html(new_html);
                var new_html2 = '<option value="">-- Seleccionar --</option>';
                
            });
        }


        //funcion para cambiar el tipo de datos solicitados en grupo de edad
        function toggle(elemento) {
            
            if(elemento.value=="grupoEdad") {
                document.getElementById("div1").style.display = "block";
                document.getElementById("div2").style.display = "none";
                document.getElementById("div3").style.display = "none";

            }else{
                document.getElementById("div1").style.display = "none";
                document.getElementById("div2").style.display = "block";
                document.getElementById("div3").style.display = "block";
            }
        }
            //


        //validando que la fecha fin no sea menor que la fecha inico
        $("#fechaFin").change(function(event){
            var fechainicial = document.getElementById("fechaInicio").value;
            var fechafinal = document.getElementById("fechaFin").value;

            if(Date.parse(fechafinal) < Date.parse(fechainicial)) {
                $("#error_fecha").text("La Fecha fin debe ser menor a la Fecha inicio");
            }
            else{
                $("#error_fecha").text("");
            }
        });

        $("#fechaInicio").change(function(event){
            var fechainicial = document.getElementById("fechaInicio").value;
            var fechafinal = document.getElementById("fechaFin").value;

            if(Date.parse(fechafinal) < Date.parse(fechainicial)) {
                $("#error_fecha2").text("La Fecha fin debe ser menor a la Fecha inicio");
            }
            else{
                $("#error_fecha2").text("");
            }
        });


        //codigo para autocomplementar texto ingresado en campo de motivo de prescripcion y reacción adversa
        $('#prescripcion').autocomplete({
            source: function(request, response){
                $.ajax({
                    url:"{{route('getEnfermedades')}}",
                    type: 'GET',
                    dataType:'json',
                    data:{
                        term:request.term
                    },
                    success:function(data){

                        response(data)
                    }

                });

      
            }

        });
        $('#prescripcion2').autocomplete({
            source: function(request, response){
                $.ajax({
                    url:"{{route('getEnfermedades')}}",
                    type: 'GET',
                    dataType:'json',
                    data:{
                        term:request.term
                    },
                    success:function(data){

                        response(data)
                    }

                });

      
            }

        });
        $('#reaccion').autocomplete({
            source: function(request, response){
                $.ajax({
                    url:"{{route('getEnfermedades')}}",
                    type: 'GET',
                    dataType:'json',
                    data:{
                        term:request.term
                    },
                    success:function(data){

                        response(data)
                    }

                });

      
            }

        });
        // fin de busquedas autocompletables 
        function uncheck(){
            var checkbox1 = document.getElementById("consentimiento");
           
            checkbox1.onclick = function(){ 
                if(checkbox1.checked != false){ 
                    document.getElementById("datosMedico").style.display = "block";
                }else{
                    document.getElementById("datosMedico").style.display = "none";
                }
            } 
           
        }


    // recargar codigo de captcha
    $('#reload').click(function () {
        
        $.ajax({
        type: 'GET',
        url: 'reload-captcha',
            success: function (data) {
                $(".captcha span").html(data.captcha);
            }
        });
    });
    </script>
@endsection