@extends('motomel.plantilla')
@section('breadcrumb')
<div class="row">
    <div class="col-6">
        <ol class="breadcrumb">
            <li class="breadcrumb-item"><a href="/inicio">Inicio</a></li>
            <li class="breadcrumb-item active">Cat&aacute;logo</li>
        </ol>
    </div>
    <div class="col-6 text-right">
        <a href="/nuevo-pedido" class="mx-1"><i class="fa fa-th" aria-hidden="true"></i></a>
        <a href="/catalogoTabla" class="mx-1 catalogo-lista"><i class="fa fa-bars" aria-hidden="true"></i></a>
    </div>
</div>
@endsection
@section('contenido')
@if(!Session::get('cliente_id') && Session::get('id_condicion_pago') == "")
<div class="px-4">
    <div class="row my-1">
        <div class="col-12">
            <div class="alert alert-danger" role="alert">
                El cliente debe estar seleccionado para poder operar.
            </div>
        </div>
    </div>
</div>
@elseif(Session::get('cliente_id') && Session::get('id_condicion_pago') == "")
    <div class="row">
        <div class="col-12 pl-4 mt-2">
            <div class="alert alert-danger" role="alert">
                Seleccione una condicion de pago para poder operar.
            </div>
        </div> 
    </div>
@else
<div class="px-4">
    <div class="row my-1">
        <div class="col-12">
            <h2>Cat&aacute;logo</h2>
        </div>
    </div>
    @if(isset($msg) && $msg)
    <div class="row">
        <div class="col-12">
            <div class="alert alert-success" role="alert"> 
            {{$msg["MSG"]}}
            </div>
        </div>
    </div>
    @endif 
    <form method="get">
        <div class="row my-3">
            <div class="col-5">
                <input type="search" class="form-control" id="txtBuscar" name="buscar" placeholder="Código de producto y descripción"></input>
            </div>
            <div class="col-7 text-left">
                <button class="btn botonBuscar" id="btnBuscar" name="btnBuscar" type="submit">BUSCAR</button>
            </div> 
        </div>
    </form>
    <div class="row my-2 listadoEncabezado">
        <div class="col-sm-2">
            <h2>Producto</h2>
        </div>
        <div class="col-sm-1">
        </div>
        <div class="col-sm-2">
            <h2>Modelo</h2>
        </div>
        <div class="col-sm-2">
            <h2>Precio</h2>
        </div>
        <div class="col-sm-2">
            <h2>Disponibilidad</h2>
        </div>
        <div class="col-sm-2">
            <h2>Cantidad</h2>
        </div>
    </div>
    <div class="row my-1 listado">
        <div class="col-12">
        <form method="post">
        <input type="hidden" name="_token" value="{{ csrf_token() }}"></input>
        @if($array_producto)
            @foreach($array_producto as $producto)
                
                <div class="row">
                <div class="col-sm-2"> 
                    <div class="pt-2 borderTop" style="display: inline-flex;">
                        <a href="/catalogo/{{$producto->idproducto}}?tipo={{$producto->fk_idtipo}}"><h3>{{$producto->cod_alfa}}</h3></a>
                    </div>
                </div>
                <div class="col-sm-1">
                    <div class="pt-2 borderTop">
                        <span style="background-color:{{$producto->cod_colorhexa}};" class="span-color mx-2"></span>
                    </div>
                </div>
                <div class="col-sm-2">
                    <div class="pt-2 borderTop">
                        <input type="hidden" id="txtTipo_{{$producto->idproducto}}" name="txtTipo" value="{{$producto->fk_idtipo}}">
                        <p>{{$producto->nombre}}</p>
                    </div>
                </div>
                <div class="col-sm-2 ">
                    <div class="pt-2 borderTop">
                        <p>$0,00</p>
                    </div>
                </div>
                @if($producto->stockcritico > 10)
                    <div class="col-sm-2">
                        <div class="pt-2 borderTop haystock">
                            <h3>Hay stock</h3>
                        </div>
                    </div>
                @elseif($producto->stockcritico > 0 && $producto->stockcritico <= 10)
                    <div class="col-sm-2 ">
                        <div class="pt-2 borderTop pocostock">
                            <h3>Poco stock</h3>
                        </div>
                    </div>
                @else
                    <div class="col-sm-2 ">
                        <div class="pt-2 borderTop sinstock">
                            <h3>Sin stock</h3>
                        </div>
                    </div>
                @endif
                <div class="col-sm-2">
                    <div class="pt-2 borderTop ">
                        <input type="hidden" id="cantidadPorducto_{{$producto->idproducto}}" value="{{$producto->cantidad}}">
                        <input class="form-control" type="number" onchange="fVerificarCantidad({{$producto->idproducto}});" id="txtCantidadQuerida_{{$producto->idproducto}}" name="txtCantidadQuerida" value="1">
                        <span id="spanStock_{{$producto->idproducto}}" style="color:red;"></span>
                    </div>
                </div>
                <div class="col-sm-1 carritoCatalogoTabla">
                    <div class="pt-2">
                        <button class="btn buttonAddCarrito" type="submit" value="{{$producto->idproducto}}" name="buttonCarritoAdd" id="buttonCarritoAdd_{{$producto->idproducto}}"><i class="fa fa-shopping-cart" aria-hidden="true"></i></button>
                    </div>
                </div>
            </div>
            
            @endforeach
        @endif
        </form>
        </div>
    </div>
</div>
<script>
    function fAgregarAlCarrito(idproducto){
        cantidad = parseInt($("#txtCantidadQuerida_" + idproducto).val());  
        tipo = $("#txtTipo_" + idproducto).val();
        $.ajax({
            type: "GET",
            url: "{{ asset('/agregarCarritoTabla') }}",
            data: { id:idproducto,
                    cantidad:cantidad,
                    tipo:tipo },
            async: true,
            dataType: "json",
            success: function (respuesta) {
                if (respuesta.err = "0") {
                    $("#cantidadDeProductos").html(respuesta.cantidad);
                } else {
                    alert("Error");
                }
            }
        });   
    }
    function fVerificarCantidad(idProducto){
        cantidad = $("#cantidadPorducto_" + idProducto).val();
        cantidadQuerida = $("#txtCantidadQuerida_" + idProducto).val();
        if(cantidadQuerida > cantidad){
            $("#spanStock_" + idProducto).html("Stock insuficiente");
            $("#buttonCarritoAdd_" + idProducto).prop("disabled",true);
        }
        if(cantidad >= cantidadQuerida){
            $("#buttonCarritoAdd_" + idProducto).prop("disabled",false);
            $("#spanStock_" + idProducto).html("");
        }


    }
</script>
@endif
@endsection