@extends('layouts.app')

@section('content')
{!! Form::model($pricelist, ['route' => ['pricelists.update', $pricelist->id ], 'method' => 'put']) !!}
    @csrf
    <fieldset class="border p-2">
        <legend class="w-auto">Editar Lista de Precios</legend>
        <div class="row py-md-2">
            <div class="col-sm-12">
                <label for="name">Nombre</label>
                <input type="text" class="form-control" id="name" name="name" value="{{ $pricelist->name }}">
            </div> 
    
        </div>
        <div class="row py-md-2">
            <div class="col-sm-8">
                <label for="productdescription">Descripcion</label>
                <input type="text" class="form-control" id="description" name="description" value="{{ $pricelist->description }}">
            </div>   
        </div>
        <div class="row py-md-2" >
            <div class="form-check">
            {{ Form::checkbox('status', '1', $pricelist->status ,['class' => 'form-check-input','id' =>'status']) }} 
            <label for="status" class="form-check-label">Estatus</label> 
             </div> 
        </div>


    </fieldset>
    <input type="hidden" value="{{ $pricelist->id }}" name="pricelistid" id="pricelistid">
    {{ Form::submit('Grabar Lista Precios',['class' => 'btn btn-success top-buffer']) }}
    {!! Form::close() !!}
    <fieldset class="border p-2">
        <legend class="w-auto">Agregar Productos</legend>
    <div class="row py-md-2">
        <div class="col-sm-5">
            <label for="name">Producto</label>
            <input type="text" class="form-control" id="productsearch" name="productsearch">
            <input type="hidden" class="form-control" id="productid">
        </div>
        <div class="col-sm-3">
            <label for="name">Precio</label>
            <input type="number" class="form-control" id="productprice" name="productprice">
        </div>
    </div>
    <div class="row py-md-2">
        <div class="col-sm-3">
            <label for="name">IVA</label>
            <input type="number" class="form-control" id="producttaxes1" name="producttaxes1">
        </div>
        <div class="col-sm-3">
            <label for="name">IEPS</label>
            <input type="number" class="form-control" id="producttaxes2" name="producttaxes2">
        </div>
        <div class="col-sm-3 py-md-4">
            <input type="hidden" name="_token" id="_token" value="{{ csrf_token() }}">
            <a href="#" class="btn btn-primary" id="btnAddProduct" name="btnAddProduct">Agregar</a>
        </div>
    </div>
    <div class="row py-md-2">
        <div class="col-sm-10">
            <table class="table table-bordered" id="tbl_products">
                <thead>
                    <tr>
                        <td>Id</td>
                        <td>Producto</td>
                        <td>Precio</td>
                        <td>IVA</td>
                        <td>IEPS</td>
                        <td>productid</td>
                        <td>pricelistid</td>
                    </tr>
                </thead>
            </table>
        </div>
    </div>
    </fieldset>
@stop
@push('scripts')
<script src="//cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"> defer</script>
<script src="https://cdn.datatables.net/buttons/1.0.3/js/dataTables.buttons.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.5.6/js/dataTables.buttons.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.5.6/js/buttons.flash.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/pdfmake.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/vfs_fonts.js"></script>
<script src="https://cdn.datatables.net/buttons/1.5.6/js/buttons.html5.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.5.6/js/buttons.print.min.js"></script>
<script>
var tblProducts;
$( document ).ready(function() {

    tblProducts =  $('#tbl_products').DataTable({
        processing: true,
        serverSide: false,
        ajax: {
          url: '{!! route('pricelistdetaildata') !!}' ,
          data: { id: $("#pricelistid").val() }
        },
        language: {
              "url": "//cdn.datatables.net/plug-ins/9dcbecd42ad/i18n/Spanish.json"
              },
        dom: 'Bfrtip',
        buttons: [
            { extend:'excel',
              exportOptions: {
                modifier: {
                  page: 'all',
                  search: 'none'   
                }
              },
            },
            { extend:'pdf',
              exportOptions: {
                modifier: {
                  page: 'all',
                  search: 'none'   
                }
              },
              customize: function (doc) {
            var tblBody = doc.content[1].table.body;
                for(var i=0;i<tblBody[0].length;i++){
                  tblBody[0][i].fillColor = '#FFFFFF';
                  tblBody[0][i].color = 'black';
                }
           
 
                        var objLayout = {};
                        objLayout['hLineWidth'] = function(i) { return .5; };
                        objLayout['vLineWidth'] = function(i) { return .5; };
                        objLayout['hLineColor'] = function(i) { return '#aaa'; };
                        objLayout['vLineColor'] = function(i) { return '#aaa'; };
                        objLayout['paddingLeft'] = function(i) { return 4; };
                        objLayout['paddingRight'] = function(i) { return 4; };
                        doc.content[1].layout = objLayout;
                        var obj = {};
                        obj['hLineWidth'] =  function(i) { return .5; };
                        obj['hLineColor'] = function(i) { return '#aaa'; };
                     //   doc.content[1].margin = [ 150, 0, 150, 0 ];
            }
            }
        ],
        columns: [
            { data: 'id', name: 'id' },
            { data: 'name', name: 'name' },
            { data: 'price', name: 'price' },
            { data: 'taxes1', name: 'taxes1' },
            { data: 'taxes2', name: 'taxes2' },
            { data: 'product_id', name: 'product_id' },
            { data: 'pricelist_id', name: 'pricelist_id' }
        ],
        aoColumnDefs: [
            {
                "targets":[5],
                "visible": false,
                "searchable": false
                 
            },
            {
                "targets":[6],
                "visible": false,
                "searchable": false
            }
        ]
    });

    $('#tbl_products tbody').on('click', 'tr', function () {
            $('.selected').removeClass('selected')
			 $(this).toggleClass('selected');
            var data = tblProducts.row( this ).data()

            $("#productid").val(data.product_id);
            $("#productsearch").val(data.name);
            $("#productprice").val(data.price);
            $("#producttaxes1").val(data.taxes1);
            $("#producttaxes2").val(data.taxes2);
            
    });

    $("#productsearch").autocomplete({
		    delay: 1000,
        source: function( request, response ) {
            $.ajax({
                url : "{{ route('searchproductpl') }}",
                dataType: "json",
                type: "GET",
                data: {
                    searchdata: request.term
                },
                success: function( data ) {
                    response( $.map( data, function( item ) {
                    console.log(item.resultado);
                            return {
                                label: item.code+"-"+item.name,
                                value: item.code+"-"+item.name,
                                data : item
                            }
                    }));
                }
            });
        },
        messages: {
            noResults: '',
            results: function() {}
        },
        autoFocus: true,	      	
        minLength: 2,
        select: function( event, ui ) {
            var productData = ui.item.data;
            $("#productid").val(productData.id);            
        }		      	
    });

    $("#btnAddProduct").on('click', function() {


        $.ajax({
            type: 'POST',
            url: "{{ route('addproducts') }}", // call your php file
            data: { _token: $("#_token").val(),productid: $("#productid").val() ,price: $("#productprice").val(), taxes1: $("#producttaxes1").val(), taxes2: $("#producttaxes2").val(),pricelistid: $("#pricelistid").val()  },
            cache: false,
            success: function(data){
               // var info = JSON.parse(data);
              if(data) {
                
                alert('Se Agrego el Producto');
                $("#productid").val('0');
                $("#productsearch").val('');
                $("#productprice").val('');
                $("#producttaxes1").val('');
                $("#producttaxes2").val('');
                tblProducts.ajax.reload();
 
              } 
            },
            error: function(xhr, ajaxOptions, thrownError) {
                alert(xhr);
            } 
        });
    })
});

</script>
@endpush