@extends('layouts.default')

@section('scripts')

    <script>
        var storage_id = "fabricacion.{{{ $id }}}";
        var jsonData = {};
        if(localStorage.getItem(storage_id) != null) {
            jsonData = JSON.parse(localStorage.getItem(storage_id));
        } else {
            jsonData.nreguist = {{{ $formula->NREGUIST }}};
            jsonData.nombre_producto = '{{{ $formula->NOMBRE }}}';
            jsonData.observacion = "{{{ preg_replace( "/(\r|\n|\r\n)+/", "\\r\\n",$formula->OBSERVACION) }}}";
            jsonData.volumen = {{{ $formula->VOLUMEN }}};
            jsonData.vida_util = {{{ $formula->VIDA_UTIL }}};
            jsonData.precio_venta = {{{ $formula->PRECVTA }}};
            jsonData.NROVALE = {{{ $planificacion->NROVALE }}};
            /* Si existe o no número de documento */
			var numero       = jsonData.NROVALE;
            $('#nrovale').val(numero);
			if (numero == 0)
            {
                $('#nrovale').attr('type', 'password');
			}
            else 
            {
                $('#nrovale').attr('type', 'text'); 
			}

            @foreach($detalles_formula as $index => $df)
            if(!jsonData.hasOwnProperty('materias_primas')) {
                jsonData.materias_primas = [];
            }
            jsonData.materias_primas.push({
                id:            {{{ $df->ITEM }}},
                orden:         {{{ $df->ITEM }}},
                CODIGO:       '{{{ $df->CODIGO }}}',
                nombre:       '{{{ $df->NOMBRE }}}',
                codBarra:     '',
                LOT_IDE:      '{{{ $df->LOT_IDE }}}',
                nreguist:      {{{ $df->NREGUIST_MP }}},
                CantNecesaria: parseFloat( {{{ $df->CantNecesaria * ($porcentaje_fab / 100)}}} ).toFixed(3),
                cantidad:      {{{ $df->CANTIDAD }}},
            });
            
            @endforeach
        }

        poblar_formula(jsonData);
   
        $(document).ready(function(){
                $(document).on('change', 'input[name*="codBarra"]', function() {

                    /* Ve cual es el indice de la línea */
                    var itemString      = $(this).attr("name");
                    var id_mp           = itemString.replace("codBarra", "");
                    var id_mp           = id_mp;

                    /* Lo busca en la tabla de equivalencia */
                    var codBarra        = $('input[name=codBarra'+id_mp+']').val();

                    /* Chequea Lotes en la BBDD */
                    $.ajax({
                        url: "{{ url('fabricacion/recuperaCodigo') }}/" + codBarra, 
                        type: 'get',
                        success: function (datos) {
                             /* Asigna Código línea */
                             var codBarra        = datos; //$('input[name=codBarra'+id_mp+']').val();
                             var caracter        = codBarra.substr(0);

                             /* Construye código de barras */
                             var necuentraGuion  = codBarra.indexOf("-");
                             var nreguistBarra   = codBarra.substring(0, necuentraGuion);
  
                             if (id_mp != nreguistBarra)
                             {
                                 mensaje = {'content' : 'Este código de barra no corresponde a este producto', "type" : "error", "timeout" : 5000};
                                 notification(mensaje, "big");
                                 $('input[name=codBarra'+id_mp+']').val('');
                             }
                             else
                             {
                                 $('#codBarra'+id_mp).attr('disabled', false);
                                 $('input[name=codBarra'+id_mp+']').val('');
                                 $('input[name=codBarra'+id_mp+']').focus();

                                 /* Suma los valores de las materias primas */
                                 var yaIngresado     = 0;
                                 $.each(jsonData.materias_primas, function(i, v) {
                                    if (v.codBarra == codBarra)
                                    {
                                        yaIngresado = 1;
                                    }
                                 })

                                 /* Chequea Lotes en la BBDD */
                                 if (yaIngresado == 1)
                                 {
                                     mensaje = {'content' : 'Este código ya fue ingresado', "type" : "error", "timeout" : 5000};
                                     notification(mensaje, "big");
                                 }
                                 else
                                 {
                                     /* Chequea Lotes en la BBDD */
                                     $.ajax({
                                         url: "{{ url('fabricacion/checkeaLote') }}/" + codBarra, 
                                         type: 'get',
                                         data: {id: {{{ $id }}}},
                                         success: function (datos) { 
                                             if (datos['status'] == 200)
                                             {
                                                 console.log(datos);
                                                 var codigo        = datos['codigo']; 
                                                 var nombre        = datos['nombre']; 
                                                 var lote          = datos['LOT_IDE']; 
                                                 var nreguist      = datos['nreguist'];

                                                 /* Suma los valores de las materias primas */
                                                 var totCantidad   = 0;
                                                 $.each(jsonData.materias_primas, function(i, v) {
                                                     if (v.nreguist == nreguist)
                                                     {
                                                         totCantidad = totCantidad + v.cantidad;
                                                         lineas      = lineas + 1;
                                                     }
                                                 })
                                                 var lineas        = 0;
                                                 $.each(jsonData.materias_primas, function(i, v) {
                                                     lineas        = lineas + 1;
                                                 })

                                                 var CantNecesaria = datos['CantNecesaria'] - totCantidad;
                                                     CantNecesaria = parseFloat(CantNecesaria).toFixed(3);
                                                 /* Agrega resultados a la matriz */
                                                 jsonData.materias_primas.push({
                                                       id: lineas,
                                                       orden: lineas,
                                                       CODIGO: codigo,
                                                       nombre: nombre,
                                                       codBarra: codBarra,
                                                       LOT_IDE: lote,
                                                       nreguist: nreguist,
                                                       CantNecesaria: CantNecesaria,
                                                       cantidad: CantNecesaria,
                                                 });
                                                 localStorage.setItem(storage_id, JSON.stringify(jsonData));

                                                 /* Agrega resultados a la matriz */
                                                 agregaLinea(codigo, nreguist);

                                                 /* Icono de apobación */
                                                 var icono = '<center><span id="iconoSaldo'+ nreguist +'" class="glyphicon glyphicon-ok" style="color: green;"></span></center>';
                                                 $('#CO'+nreguist).val(0);
                                                 $('#valError1'+nreguist).html('');
            
                                                 $("#icono"+nreguist).html(icono);

                                                 /* Suma los valores de las materias primas */
                                                 var encontrado      = 0;
                                                 var yaIngresado     = 0;
                                                 var numregistro     = 0;

                                                 $("#tablaProductos td").each(function(){
                                                    var Div          = $(this).html();
                                                    if (yaIngresado == 0)
                                                    {
                                                        var n        = Div.indexOf('<input class="form-control" name="codBarra');
                                                        if (n != -1)
                                                        { 
                                                            if (Div.indexOf(nreguist) == -1)
                                                            { 
                                                                if (encontrado == 0)
                                                                {
                                                                    var DivNuevo = Div.replace('<input class="form-control" name="', '');
                                                                    var valor    = DivNuevo.indexOf('"');
                                                                    var codigo   = DivNuevo.substring(0, valor);
                                                                    yaIngresado  = 1;
                                                                    $('#'+codigo).focus();
                                                                }
                                                            }
                                                            else
                                                            {
                                                                encontrado   = 1;
                                                            }
                                                        }                                                        
                                                    }
                                                 });
                                             }
                                             else 
                                             {
                                                 if (datos['status'] == 300)
                                                 {
                                                     mensaje = {'content' : 'No puede agregar este producto', "type" : "error", "timeout" : 5000};
                                                     notification(mensaje, "big");
                                                 }
                                             }
                                         }
                                      }, 'json');
                                 }   
                             }
                        }
                    })
                });

                // Presiona acá
                $(document).on('click', 'button[name*="verTabla"]', function() {
                    /* Ve cual es el indice de la línea */			
                    var itemString   = $(this).attr("name");
                    var codigo       = itemString.replace("verTabla", "");

                    if ($("#Mitabla"+codigo).is(":visible")) {
                       document.getElementById("Mitabla"+codigo).style.display = 'none';
                       document.getElementById("verTabla"+codigo).className    = "btn btn-success";
                       document.getElementById("simbolo"+codigo).className     = "fa fa-plus";
                    }
                    else {
                       document.getElementById("Mitabla"+codigo).style.display = '';
                       document.getElementById("verTabla"+codigo).className    = "btn btn-danger";
                       document.getElementById("simbolo"+codigo).className     = "fa fa-minus";
                    }                    
                });


                // Cuando cambia la cantidad
                $(document).on('change', 'input[name*="CANTIDAD"]', function() {
			        /* Ve cual es el indice de la línea */			
                    var itemString   = $(this).attr("name");
                    var id_mp        = itemString.replace("CANTIDAD", "");
                    var CANTIDAD     = $('input[name=CANTIDAD'+id_mp+']').val();
                    var codBarra     = $('input[name=codBarra'+id_mp+']').val();

                    /* Chequea Lotes en la BBDD */
                    $.ajax({
                         url: "{{ url('fabricacion/checkeaLote') }}/" + codBarra,
                         type: 'get',
                         data: {id: {{{ $id }}}},
                         success: function (datos) { 
                             if (datos['status']   == 200)
                             {
                                 var codigo         = datos['codigo']; 
                                 var nombre         = datos['nombre']; 
                                 var lote           = datos['LOT_IDE']; 
                                 var nreguist       = datos['nreguist'];
                                 var CantNecesaria  = datos['CantNecesaria'];

                                 /* Suma los valores de las materias primas */
                                 var saldoCantidad  = 0;
                                 var totCantidad    = 0;
                                 $.each(jsonData.materias_primas, function(i, v) {
                                    if (v.nreguist  == nreguist && v.LOT_IDE != '' && v.LOT_IDE != lote)
                                    {
                                        totCantidad = totCantidad + parseFloat(v.cantidad).toFixed(3);
                                    }
                                 })

                                 /* Valida Valor negativo */
//                                 saldoCantidad = parseFloat(CantNecesaria).toFixed(3) - (parseFloat(totCantidad).toFixed(3) + parseFloat(CANTIDAD).toFixed(3));
                                 saldoCantidad = parseFloat(CantNecesaria) - (parseFloat(totCantidad) + parseFloat(CANTIDAD));
                                 saldoCantidad = parseFloat(saldoCantidad).toFixed(3);

                                 if (saldoCantidad < 0)
                                 {  
                                      mensaje     = {'content' : 'No puede solicitar tanta cantidad de materia prima.', "type" : "error", "timeout" : 5000};
                                      notification(mensaje, "big");
                                      CANTIDAD    = 0;
                                      $('input[name=CANTIDAD'+id_mp+']').val(0);

                                      /* Suma los valores de las materias primas */
                                      $.each(jsonData.materias_primas, function(i, v) {
                                         if (v.nreguist == nreguist && v.LOT_IDE == '')
                                         {
                                             saldoCantidad = parseFloat(CantNecesaria).toFixed(3) - (parseFloat(totCantidad).toFixed(3));
                                             saldoCantidad = parseFloat(saldoCantidad).toFixed(3);

                                             jsonData.materias_primas[i]['CantNecesaria'] = saldoCantidad;
                                             localStorage.setItem(storage_id, JSON.stringify(jsonData));
 
                                             if (saldoCantidad != 0)
                                             {
                                                var icono = '<center><span id="iconoSaldo'+ nreguist +'" class="glyphicon glyphicon-remove" style="color: red;"></span>('+saldoCantidad+')</center>';
                                                $('#CO'+nreguist).val(saldoCantidad);
                                                $('#valError1'+nreguist).html('<div style="color: red;">Debe ingresar las cantidades de las materias primas</div>');
                                             }
                                             else
                                             {
                                                var icono = '<center><span id="iconoSaldo'+ nreguist +'" class="glyphicon glyphicon-ok" style="color: green;"></span></center>';
                                                $('#CO'+nreguist).val(0);
                                                $('#valError1'+nreguist).html('');
                                             }
            
                                             $("#icono"+nreguist).html(icono);

                                             localStorage.setItem(storage_id, JSON.stringify(jsonData));
                                         }

                                         if (v.nreguist  == nreguist && v.LOT_IDE == lote)
                                         {
                                             totCantidad = totCantidad + parseFloat(v.cantidad).toFixed(3);
                                             jsonData.materias_primas[i]['CantNecesaria'] = parseFloat(saldoCantidad).toFixed(3);
                                             jsonData.materias_primas[i]['cantidad']      = 0;
                                             localStorage.setItem(storage_id, JSON.stringify(jsonData));
                                         }
                                      })
                                 }
                                 else
                                 {  
                                      if (saldoCantidad => 0)
                                      {  
                                          /* Actualiza los valores de ka cantidad a fabricar */
                                          $.each(jsonData.materias_primas, function(i, v) {
                                             if (v.nreguist == nreguist && v.LOT_IDE == '')
                                             {
                                                 jsonData.materias_primas[i]['CantNecesaria'] = parseFloat(saldoCantidad).toFixed(3);
                                                 localStorage.setItem(storage_id, JSON.stringify(jsonData));

                                                 if (saldoCantidad != 0)
                                                 {
                                                     var icono = '<center><span class="glyphicon glyphicon-remove" style="color: red;"></span>('+saldoCantidad+')</center>';
                                                     $('#CO'+nreguist).val(saldoCantidad);
                                                     $('#valError1'+nreguist).html('<div style="color: red;">Debe ingresar las cantidades de las materias primas</div>');
                                                 }
                                                 else
                                                 {
                                                     var icono = '<center><span class="glyphicon glyphicon-ok" style="color: green;"></span></center>';
                                                     $('#CO'+nreguist).val(0);
                                                     $('#valError1'+nreguist).html('');
                                                 }
            
                                                 $("#icono"+nreguist).html(icono);
                                                 localStorage.setItem(storage_id, JSON.stringify(jsonData));
                                             }
                                             if (v.nreguist  == nreguist && v.LOT_IDE == lote)
                                             {
                                                 jsonData.materias_primas[i]['CantNecesaria'] = parseFloat(saldoCantidad).toFixed(3);
                                                 jsonData.materias_primas[i]['cantidad']      = parseFloat(CANTIDAD).toFixed(3);
                                                 localStorage.setItem(storage_id, JSON.stringify(jsonData));
                                             }
                                          })
                                      }
                                 }
                                 console.log(jsonData.materias_primas);
                             }
                         }
                    }, 'json');
                });



            $(document).on('click', '.elimina_lote',function(e) {

                var el = $(this).parents('tr').eq(0);

                /* Recopera indice de arreglo */
                var id_mp         = $(this).attr("name");
                var id_mp         = id_mp.replace("el", "");
                var codBarra      = $('#codBarra'+id_mp).val();

                var codigo        = '';
                var nreguist      = 0;
                var LOTE          = '';
                var cantidadItem  = 0;
                var CantNecesaria = 0;
                var indiceBorrar  = 0;

                $.each(jsonData.materias_primas, function(i, v) {
                    if (v.codBarra == codBarra)
                    {
                        codigo        = jsonData.materias_primas[i]['CODIGO'];
                        nreguist      = jsonData.materias_primas[i]['nreguist'];
                        LOTE          = jsonData.materias_primas[i]['LOT_IDE'];
                        cantidadItem  = jsonData.materias_primas[i]['cantidad'];
                        CantNecesaria = jsonData.materias_primas[i]['CantNecesaria'];
                        indiceBorrar  = i;
                    }
                })

                /* Suma los valores de las materias primas */
                var cantItems    = 0;
                var totCantidad  = 0; 
                $.each(jsonData.materias_primas, function(i, v) {
                    if (v.nreguist == nreguist)
                    {
                        cantItems ++;
                    }
                })
                
                eliminar_item(indiceBorrar, el);

                /* Agrega resultados a la matriz */
                agregaLinea(codigo, nreguist);

                /* Chequea Lotes en la BBDD */
                $.ajax({
                    url: "{{ url('fabricacion/checkeaLote') }}/" + codBarra,
                    type: 'get',
                    data: {id: {{{ $id }}}},
                    success: function (datos) { 
                       if (datos['status']   == 200)
                       {
                            var codigo         = datos['codigo']; 
                            var nombre         = datos['nombre']; 
                            var lote           = datos['LOT_IDE']; 
                            var nreguist       = datos['nreguist'];
                            var CantNecesaria  = datos['CantNecesaria'];

                            /* Suma los valores de las materias primas */
                            var saldoCantidad  = 0;
                            var totCantidad    = 0;
                            $.each(jsonData.materias_primas, function(i, v) {
                               if (v.nreguist  == nreguist && v.LOT_IDE != '' && v.LOT_IDE != lote)
                               {
                                  totCantidad = totCantidad + parseFloat(v.cantidad).toFixed(3);
                               }
                            })

                            /* Valida Valor negativo */
                            saldoCantidad = parseFloat(CantNecesaria).toFixed(3) - parseFloat(totCantidad).toFixed(3);
                            saldoCantidad = parseFloat(saldoCantidad).toFixed(3);

                            /* Actualiza los valores de ka cantidad a fabricar */
                            $.each(jsonData.materias_primas, function(i, v) {
                                if (v.nreguist == nreguist && v.LOT_IDE == '')
                                {
                                    jsonData.materias_primas[i]['CantNecesaria'] = saldoCantidad;
                                    localStorage.setItem(storage_id, JSON.stringify(jsonData));

                                    if (saldoCantidad != 0)
                                    {
                                       var icono = '<center><span class="glyphicon glyphicon-remove" style="color: red;"></span>('+saldoCantidad+')</center>';
                                    }
                                    else
                                    {
                                       var icono = '<center><span class="glyphicon glyphicon-ok" style="color: green;"></span></center>';
                                    }
            
                                    $("#icono"+nreguist).html(icono);
                                    localStorage.setItem(storage_id, JSON.stringify(jsonData));
                                }
                                if (v.nreguist  == nreguist && v.LOT_IDE == lote)
                                {
                                    jsonData.materias_primas[i]['CantNecesaria'] = saldoCantidad;
                                    jsonData.materias_primas[i]['cantidad'] = parseFloat(cantidadItem).toFixed(3);
                                    localStorage.setItem(storage_id, JSON.stringify(jsonData));
                                }
                            })
                       }
                    }   
                }, 'json');                
            });

            setup_select2('#producto_id', "{{ url('fabricacion/select_productos') }}", 'Seleccionar producto');

            $('#producto_id').on('select2:select', function() {
                var nreguist = $(this).select2('data')[0].id;
                var nombre_prod = $(this).select2('data')[0].text;
                var precio_venta = $(this).select2('data')[0].precio_venta || 0;
                $('#precio_venta').val(precio_venta);
                jsonData.nreguist = nreguist;
                jsonData.nombre_producto = nombre_prod;
                jsonData.precio_venta = precio_venta;
                //Almacena nombre producto en localStorage
                localStorage.setItem(storage_id, JSON.stringify(jsonData));
            });

            $('#observacion').on('keyup', function() {
                //Actualizamos variable jsonData
                jsonData.observacion = $(this).val();
                //Almacena nombre producto en localStorage
                localStorage.setItem(storage_id, JSON.stringify(jsonData));
            });

            $('#form_guardar').on('submit', function() {
                clean_form_errors($('#formulario'));
                var nrovale  = $('#nrovale').val();
                var id       = {{ $id }}

                /* Deshabilita botón guardar */
                $('#grabar').attr('disabled', true);

                /* Recorre input Cantidad para buscar errores*/
                var hayError = 0;
                $("#formulario").find(':input').each(function() {
                    var elemento = this;

                    /* Busca Cantidad Pendiente*/
                    if (elemento.id.indexOf("CO") != -1)
                    {
                        var indice       = elemento.id;
                        var id_mp        = indice.replace("CO", "");

                        if (elemento.value != 0 && elemento.value != null && elemento.value != '')
                        {
                            $('#valError1'+id_mp).html('<div style="color: red;">Debe ingresar las cantidades de las materias primas</div>');
                            hayError     = 1;
                        }
                        else
                        {
                            $('#valError1'+id_mp).html('');
                        }
                    }

                    /* Busca Cantidad*/
                    if (elemento.id.indexOf("CANTIDAD") != -1)
                    {
                        var indice       = elemento.id;
                        var id_mp        = indice.replace("CANTIDAD", "");

                        if (elemento.value == 0 || elemento.value == null || elemento.value == '')
                        {
                            $('#valError'+id_mp).html('<div style="color: red;">Debe ingresar un valor mayor que 0</div>');
                            hayError     = 1;
                        }
                        else
                        {
                            $('#valError'+id_mp).html('');
                        }
                    }
                });

                if (hayError    == 0)
                {
                   /* Crea otro arreglo */
                   $.post("{{ url('fabricacion/editar_fabricacion') }}", { id: id, nrovale: nrovale, data: JSON.stringify(jsonData)}, function(response) {

                       if (response['status'] == 200)
		   			   {
                          jsonData = {};
                          localStorage.removeItem(storage_id);
	   				   }
                       success_notification(response);
                       if (response['status'] == 200)
	   				   {
                           window.location = "{{ url('fabricacion') }}";
					   }

                    }, 'json').fail(function(response) {
                       console.log(response);
                       if(response.status != 409) {
                           show_form_errors(response, $('#formulario'));
                           if($('#datos_formula').find('.has-error').length > 0) $('a[href="#datos_formula"]').tab('show');
                           else if($('#control_calidad').find('.has-error').length > 0) $('a[href="#control_calidad"]').tab('show');
                       } else {
                           error_notification(response);
                       }
                       /* Habilita botón guardar */
                       $('#grabar').attr('disabled', false);
                   });

                   return false;
                }

            });
        });

        /* Botón Cancelar */
        $('#Cancelar').on('click', function() 
        {
            /* Confirma Cancelar */
            $.confirm({
                title:"Confirmación de salida de la fabricación",
                text: "<h1><b>¿Desea salir sin grabar la fabricación?</b></h1>",
                modalOptionsBackdrop: 'static',
                confirm: function() {
                    clean_form_errors($('#formulario'));

                    jsonData = {};
                    localStorage.removeItem(storage_id);
                    window.location = "{{ url('fabricacion/index') }}";

                    return false;
                },
                cancel: function() {
                    return false;
                },
                confirmButton: "Deseo Salir",
                cancelButton: "No",
                confirmButtonClass: 'btn-success',
                cancelButtonClass: 'btn-danger'
            });
        });

        /* Agrega resultados a la pantalla */
        function agregaLinea(codigo, nreguist)
        {

            console.log(jsonData.materias_primas);
            /* Cantidad */
            var cantidadLotes     = 0;
            $.each(jsonData.materias_primas, function(i, v) {
                if (v.nreguist == nreguist && v.LOT_IDE != '')
                {
                    cantidadLotes = cantidadLotes + 1;
                }
            })

            var tabla1        = '';
            var html          = ''; 
            var tabla2        = ''; 

            /* Suma los valores de las materias primas */
            var lineas        = 0;

            if (cantidadLotes > 0)
            {
                tabla1    = '<td colspan="6"><div class="table-responsive" style="float: left; padding-left: 15%;"><div id="Mitabla'+nreguist+'" style="float: left;"><table class="table table-bordered">';
                html      = '<tr>'+
                               '<tr style="background-color: blue; color: white;">' +
                               '<th class="col-sm-4">Cód. Barra</th>'+
                               '<th class="col-sm-4">Lote</th>'+
                               '<th class="col-sm-2">Cantidad</th>'+
                               '<th class="col-sm-2">Opciones</th></tr>' +
                            '</tr>';
            }

            $.each(jsonData.materias_primas, function(i, v) {
                if (v.nreguist == nreguist && v.LOT_IDE != '')
                {
                    lineas    = i;
                    html      = html + '<tr id="' + lineas  + '" class="item-formula-detalle" data-index="' + lineas + '">'+
                                    '<td class="col-sm-4"><input class="form-control" name="codBarra' + lineas + '" id="codBarra' + lineas + '" type="text" value="'+v.codBarra+'" disabled></td>'+
                                    '<td class="col-sm-4"><input class="form-control" name="LOTE.' + lineas + ' type="text" value="' + v.LOT_IDE + '" disabled></td>'+
                                    '<td class="col-sm-2"><input class="form-control" name="CANTIDAD' + lineas + '" id="CANTIDAD' + lineas + '" type="text" value="' + v.cantidad + '"><div id="valError' + lineas + '"></div></td>'+
                                    '<td class="col-sm-2">' +
                                    '<button id="el'+ lineas +'" name="el'+ lineas +'" class="btn btn-danger elimina_lote" type="button"><i class="fa fa-trash"></i></button>&nbsp;' +
                                    '</td></tr>';
                }
            })

            if (cantidadLotes > 0)
            {
                tabla2 = '</table></div></div></td>';
            }

            /* Despliega */
            $('#bloque'+nreguist).html(tabla1 + html + tabla2);
        }

        // Añade linea de productos sin lote
        function desplegar()
        {
            $('#contenido_formula').html('');
  
            jsonData.materias_primas.sort(function (aa, bb) {
                 return aa.CODIGO - bb.CODIGO ;
            });

            $.each(jsonData.materias_primas, function(ii, vv) {
                vv.id    = ii;
                vv.orden = ii+1;
                agregar_item_jsonData(vv);
                console.log(jsonData.materias_primas);
            })
        }

        // Añade linea de productos sin lote
        function llenaProductosBase(codBarra, codigo, cantidadItem) 
        {

            /* Suma los valores de las materias primas */
            var totCantidad  = 0;
            $.each(jsonData.materias_primas, function(i, v) 
            {
                if (v.nreguist == nreguist)
                {
                    totCantidad = totCantidad + v.cantidad;
                }
            })

            $.ajax({
                url: "{{ url('fabricacion/checkeaLote') }}/" + codBarra,
                type: 'get',
                data: {id: {{{ $id }}}},
                success: function (datos) 
                {
                    if (datos['status'] == 200)
                    {
                        var codigo        = datos['codigo']; 
                        var nombre        = datos['nombre']; 
                        var lote          = ''; 
                        var nreguist      = datos['nreguist'];
                        var CantNecesaria = (datos['CantNecesaria'] + cantidadItem) - totCantidad;
                        var cantidad      = 0;

                        agregar_item(codigo, nombre, lote='', nreguist=parseFloat(nreguist), CantNecesaria, cantidad, codBarra);
                    }
                }
            }, 'json');
            //Almacena nombre producto en localStorage
            localStorage.setItem(storage_id, JSON.stringify(jsonData));
        }

        // Ordena arreglo con detalle de los productos a reservar
        function ordenaProductos(codigo, CantNecesaria, totCantidad) 
        {
            /* Indices a borrar */
            var aborrar = new Array();
            var indice  = 0;

            /* Verifica los valores */
            $.each(jsonData.materias_primas, function(ind, linea) {
                if (linea.CODIGO == codigo && linea.LOT_IDE == '')
                {
                    var saldoCantidad = CantNecesaria - totCantidad;
                    jsonData.materias_primas[ind]['CantNecesaria'] = saldoCantidad;
                    if ((saldoCantidad) <= 0) 
                    {
                        aborrar[indice] = ind;
                        indice         ++;
                    }
                }
            })

            /* Recorre el arreglo para borrar los marcados */
            for (ind = 0; ind < aborrar.length; ind++) {
                 jsonData.materias_primas.splice(ind, 1);
            } 
            localStorage.setItem(storage_id, JSON.stringify(jsonData));

            /* Agrega lineas de detalle */
            jsonData.materias_primas.sort(function (a, b) {
                return a.CODIGO - b.CODIGO ;
            });
            $('#contenido_formula').html('');
            $.each(jsonData.materias_primas, function(i, v) {
                v.id    = i;
                v.orden = i+1;
                agregar_item_jsonData(v);
            })

            /* Suma totales */
            calcular_total_x('cantidad');
        }

        //Retorna la cantidad de filas en tabla
        function cantidad_items(nom_item) {
            return $(nom_item).length
        }
        //Retorna el siguiente indice para la creacion de una nueva fila en la tabla
        function next_index(nom_item) {
            var cant = cantidad_items(nom_item);
            if(cant == 0) return 1;
            return $(nom_item).map(function(){return $(this).data('index');}).get().sort(function(a, b){return b-a})[0] + 1;
        }
        //Agrega una nueva fila en la tabla materias primas
        function agregar_item(codigo, nombre, lote, nreguist, CantNecesaria, cantidad, codBarra) {
            var order = cantidad_items('.item-formula') + 1;
            var index = next_index('.item-formula');
            var id_item = 'item-' + index;
            var dss  = 'disabled';
            if (codBarra == '')
            {
                var dss  = '';
            }

/*
            document.getElementById("Mitabla"+codigo).style.display = 'none';
                       document.getElementById("verTabla"+codigo).className    = "btn btn-success";
                       document.getElementById("simbolo"+codigo).className     = "fa fa-plus";
*/
            if (CantNecesaria != 0)
            {
                var icono = '<center><span id="iconoSaldo'+ nreguist +'" class="glyphicon glyphicon-remove" style="color: red;"></span>('+CantNecesaria+')</center>';
            }
            else
            {
                var icono = '<center><span id="iconoSaldo'+ nreguist +'" class="glyphicon glyphicon-ok" style="color: green;"></span></center>';
            }

            var template = '<tr id="' + nreguist  + '" class="item-formula" data-index="' + nreguist + '">'+
                    '<td><div><button id = "verTabla'+ nreguist +'" name = "verTabla'+ nreguist +'" class="btn btn-danger eliminar" type="button"><i id = "simbolo'+nreguist+'" class="fa fa-minus"></i></button></div>'+
                    '<td><input class="form-control" name="orden" type="text" value="' + order + '" readonly></td>'+
                    '<td><input class="form-control" name="MATERIA_PRIMA.' + nreguist + '.CODIGO" type="text" value="' + codigo + '" disabled></td>'+
                    '<td><select id="materia_prima_' + nreguist + '" name="MATERIA_PRIMA.' + nreguist + '.NREGUIST_MATERIA_PRIMA" disabled></select></td>'+
                    '<td><input class="form-control" name="codBarra' + nreguist + '" id="codBarra' + nreguist + '" type="text" value="'+codBarra+'" style="font-size: 15px; font-weight: bold; background: #75E958; color: #000000;" ><div id="valError1' + nreguist + '"></div></td>'+
                    '<td><div id="icono'+nreguist+'">'+icono+'</div></td>'+
                    '<td style="display: none;"><input class="form-control" name="CO' + nreguist + '" id="CO' + nreguist + '" type="text" value="' + CantNecesaria + '"></td>'+
                    '</tr>' +
                    '<tr id="bloque' + nreguist + '"></tr>';

            $('#sin-items').addClass('hide');
            $(template).appendTo('#contenido_formula');
            setup_select2('#materia_prima_' + index, "{{  url('formulas/select_materias_primas') }}", 'Buscar materia prima');
            if(nombre != '') {
                $('#materia_prima_' + index).html('<option value="' + nreguist + '">' + nombre + '</option>').trigger('change');
            }

            //Actualizamos variable jsonData
            if(jsonData.hasOwnProperty('materias_primas') == false) {
                jsonData.materias_primas = [];
            }

            /* Agrega resultados a la matriz */
            jsonData.materias_primas.push({
                id: index,
                orden: index,
                CODIGO: codigo,
                nombre: nombre,
                codBarra: codBarra,
                LOT_IDE: lote,
                nreguist: nreguist,
                CantNecesaria: CantNecesaria,
                cantidad: cantidad,
            });
            /* Actualiza los valores */
            localStorage.setItem(storage_id, JSON.stringify(jsonData));
        }

        //Agrega una nueva fila en la tabla desde jsonData
        function agregar_item_jsonData(mp) {
            var id            = mp.id;
            var id_item       = 'item-' + id;
            var orden         = mp.orden;
            var CODIGO        = mp.hasOwnProperty('CODIGO')?mp.CODIGO:'';
            var nombre        = mp.hasOwnProperty('nombre')?mp.nombre:'';
            var nreguist      = mp.hasOwnProperty('nreguist')?mp.nreguist:'';
            var LOTE          = mp.hasOwnProperty('LOT_IDE')?mp.LOT_IDE:'';
            var codBarra      = mp.hasOwnProperty('codBarra')?mp.codBarra:'';
            var CantNecesaria = mp.hasOwnProperty('CantNecesaria')?mp.CantNecesaria:0; 
            var CANTIDAD      = mp.hasOwnProperty('cantidad')?mp.cantidad:0;

            var dis  = 'disabled';
            if (LOTE != '')
            {
                var dis  = '';
            }
            var dss  = 'disabled';
            if (codBarra == '')
            {
                var dss  = '';
            }
            if (CantNecesaria != 0)
            {
                var icono = '<center><span id="iconoSaldo'+ nreguist +'" class="glyphicon glyphicon-remove" style="color: red;"></span>('+CantNecesaria+')</center>';
            }
            else
            {
                var icono = '<center><span id="iconoSaldo'+ nreguist +'" class="glyphicon glyphicon-ok" style="color: green;"></span></center>';
            }

            var template = '<tr id="' + nreguist  + '" class="item-formula" data-index="' + nreguist + '">'+
                    '<td><div><button id = "verTabla'+ nreguist +'" name = "verTabla'+ nreguist +'" class="btn btn-danger eliminar" type="button"><i id = "simbolo'+nreguist+'" class="fa fa-minus"></i></button></div>'+
                    '<td><input class="form-control" name="orden" type="text" value="' + orden + '" readonly></td>'+
                    '<td><input class="form-control" name="MATERIA_PRIMA.' + nreguist + '.CODIGO" type="text" value="' + nreguist + '" disabled></td>'+
                    '<td><select id="materia_prima_' + nreguist + '" name="MATERIA_PRIMA.' + nreguist + '.NREGUIST_MATERIA_PRIMA" disabled></select></td>'+
                    '<td><input class="form-control" name="codBarra' + nreguist + '" id="codBarra' + nreguist + '" type="text" value="'+codBarra+'" style="font-size: 15px; font-weight: bold; background: #75E958; color: #000000;" ><div id="valError1' + nreguist + '"></div></td>'+
                    '<td><div id="icono'+nreguist+'">'+icono+'</div></td>'+
                    '<td style="display: none;"><input class="form-control" name="CO' + nreguist + '" id="CO' + nreguist + '" type="text" value="' + CantNecesaria + '"></td>'+
                    '</tr>' +
                    '<tr id="bloque' + nreguist + '"></tr>';

            $('#sin-items').addClass('hide');
            $(template).appendTo('#contenido_formula');
            setup_select2('#materia_prima_' + nreguist, "{{  url('formulas/select_materias_primas') }}", 'Buscar materia prima');
            if(nombre != '') {
                $('#materia_prima_' + nreguist).html('<option value="' + nreguist + '">' + nombre + '</option>').trigger('change');
            }

        }

        //Elimina fila de la tabla
        function eliminar_item(indiceBorrar, el) {

            jsonData.materias_primas.splice(indiceBorrar, 1);
//            el.parents('tr').eq(0).remove();
            localStorage.setItem(storage_id, JSON.stringify(jsonData));
        }

        //recalcula el orden de cada fila
        function calcular_orden(nom_item) {
            var orden = 1;
            $(nom_item).each(function(index, el) {
                $(el).find('input[name=orden]').eq(0).val(orden);
                if(nom_item == '.item-formula') {
                    var index_arr_mp = jsonData.materias_primas.map(function(d) {return d['id']}).indexOf($(el).data('index'));
                    jsonData.materias_primas[index_arr_mp].orden = orden;
                } else if(nom_item == '.item-pregunta') {
                    var index_arr_mp = jsonData.preguntas_calidad.map(function(d) {return d['id']}).indexOf($(el).data('index'));
                    jsonData.preguntas_calidad[index_arr_mp].orden = orden;
                }
                //Almacena nombre producto en localStorage
                localStorage.setItem(storage_id, JSON.stringify(jsonData));
                orden = orden + 1;
            });
        }

        //calcula campo costo de un item de la formula especifico
        function calcular_costo(elem) {
            var volumen = elem.find('input[name=volumen]').eq(0).val() || 0;
            var costo_unidad = elem.find('input[name=costo_unidad]').eq(0).val() || 0;
            var costo = costo_unidad * volumen;
            elem.find('input[name=costo]').eq(0).val(parseFloat(costo).toFixed(3));
            calcular_total_x('cantidad');
        }
        //recalcula el orden de cada fila
        function calcular_total_x(nombre) {
            var cont = 0;
            $('.item-formula').each(function(index, el) {
                if(nombre == 'cantidad') {
                 //   value   = $(el).find('input[name=CANTIDAD]').eq(0).val();
                    var ind   = index + 1;
                    var value = $('#CANTIDAD'+ind).val();

                    cont   = cont + parseFloat(value).toFixed(3);
                }
            });
            if (nombre != 'cantidad')
            {
                $('#total_' + nombre).html(cont);
            }
            else
            {
                $('#gran_total').html('<td colspan="3"></td><td id="total_cantidad"></td><td></td>');
            }

            return cont;
        }

        //permite mantener el tamaño de una fila al momento de moverla (sortable)
        function fixWidthHelper(e, ui) {
            ui.children().each(function() {
                $(this).width($(this).width());
            });
            return ui;
        }

        //desplaza hacia arriba una fila
        function moverArriba(el) {
            var usa_agua = {{ !empty($agua) ? 'true' : 'false' }};
            if(el.prev()) {
                if(el.prev().data('index') != 1)
                    el.insertBefore(el.prev());
                else if(!usa_agua)
                    el.insertBefore(el.prev());
            }
        }

        //desplaza hacia abajo una fila
        function moverAbajo(el) {
            if(el.next()) {
                el.insertAfter(el.next());
            }
        }

        //pobla los campos desde jsonData en caso de que hayan datos guardados en localStorage
        function poblar_formula(data) {
            if(!$.isEmptyObject(data)) {
                if(data.hasOwnProperty('nombre_producto')) {
                    var option = '<option value="' + data.nreguist + '">' + data.nombre_producto + '</option>';
                    $('#producto_id').html(option).trigger('change');

                }
                if(data.hasOwnProperty('precio_venta')) {
                    $('#precio_venta').val(data.precio_venta);
                }
                if(data.hasOwnProperty('volumen')) {
                    $('#volumen_formula').val(data.volumen);
                }
                if(data.hasOwnProperty('vida_util')) {
                    $('#vida_util').val(data.vida_util);
                }

                if(data.hasOwnProperty('materias_primas') && data.materias_primas.length > 0) {
                    data.materias_primas.sort(function (a, b) {
                        return a.orden - b.orden
                    });
                    $.each(data.materias_primas, function(i, v) {
                        v.id              = i;
                        v.orden           = i+1;
                        var CODIGO        = v.CODIGO;
                        var nreguist      = v.nreguist;
                        var CantNecesaria = parseFloat(v.CantNecesaria).toFixed(3);

                        /* Despliega materias primas */
                        if (v.LOT_IDE == '')
                        {
                            agregar_item_jsonData(v);
                            agregaLinea(CODIGO, nreguist)
                        }
                    })
                }
                calcular_total_x('cantidad');
            }
        }

    </script>
@endsection

@section('content')

    <div class="col-sm-12 col-md-12 col-lg-12">
        <!-- product -->
        <div id="formulario" class="product-content product-wrap clearfix product-deatil">
            <div class="col-sm-12">
                <h1 class="page-title">
                    Reservar Materias primas para la fabricación
                </h1>
            </div>
            <ul class="nav nav-tabs" role="tablist">
                <li role="presentation" class="active">
                    <a href="#datos_formula" aria-controls="datos_formula" role="tab" data-toggle="tab">Datos Fórmula</a>
                </li>
            </ul>
            <br><br>
            <div class="tab-content">
                <div role="tabpanel" class="tab-pane active" id="datos_formula">
                    <div class="row">
                        <div class="col-md-4">
                            <div id="select_producto" class="row">
                                <div class="form-group col-sm-12">
                                    <label for="producto_id" class="control-label">Nombre del Producto</label>
                                    {{ Form::select('NREGUIST_PROD_TERMINADO', [], NULL, ['id' => 'producto_id', 'class' => 'form-control', 'disabled' => true]) }}
                                </div>
                            </div>
                        </div>
                        <div class="col-md-2">
                            <div class="form-group">
                                <label for="" class="control-label">Nro.Vale</label>
                                {{ Form::text('nrovale', NULL, ['id' => 'nrovale', 'class' => 'form-control', 'disabled' => true]) }}
                            </div>
                        </div>
                        <div class="col-md-2">
                            <div class="form-group">
                                <label for="" class="control-label">Litros</label>
                                {{ Form::text('VOLUMEN', NULL, ['id' => 'volumen_formula', 'class' => 'form-control', 'readonly' => true]) }}
                            </div>
                        </div>
                        <div class="col-md-2">
                            <div class="form-group">
                                <label for="" class="control-label">Vida útil</label>
                                {{ Form::text('VIDA_UTIL', NULL, ['id' => 'vida_util', 'class' => 'form-control', 'readonly' => true]) }}
                            </div>
                        </div>
                        <div class="col-md-2">
                            <div class="form-group">
                                <label for="" class="control-label">Precio Venta Unidad</label>
                                {{ Form::text('PRECVTA', NULL, ['id' => 'precio_venta', 'class' => 'form-control', 'disabled' => true]) }}
                            </div>
                        </div>
                    </div>
                    <br>
                    <div class="table-responsive">
                        <table class="table table-bordered" id="tablaProductos">
                            <thead>
                               <tr>
                                    <th class="col-sm-1"> </th>
                                    <th class="col-sm-1">Orden</th>
                                    <th class="col-sm-2">Código</th>
                                    <th class="col-sm-4">Materia Prima</th>
                                    <th class="col-sm-3">Cod.Barra</th>
                                    <th class="col-sm-1">Cant/Ori</th>
                                    <th class="col-sm-1" style='display: none;'>CO</th>
                                </tr>
                            </thead>
                            <tbody id="contenido_formula">
                                <tr id="sin-items">
                                    <td colspan="7" class="text-align-center">No hay registros</td>
                                </tr>
                            </tbody>
                            <tfoot>
                            <tr id='gran_total' display='display: none;'>
                                <td colspan="3">Totales</td>
                                <td id="total_cantidad">0</td>
                                <td></td>
                            </tr>
                            </tfoot>
                        </table>
                    </div>
                </div>
            </div>
            <br>
            <div class="row pull-right">
                <div class="col-sm-12">
                    <form id="form_guardar">
                        <button type="submit" id='grabar' class="btn btn-success">Guardar</button>
                        <button type="button" class="btn btn-danger" id="Cancelar">Cancelar</button>
                    </form>
                </div>
            </div>
        </div>
        <!-- end product -->
    </div>

@endsection