@extends('layouts.admin')
@section('content')
<style>
.pagination {
    display: inline-block;
}
.pagination a {
    color: black;
    float: left;
    padding: 8px 16px;
    text-decoration: none;
}


</style>
  <div class="content-wrapper">
    <section class="content-header">
      <h1>
        <i class="fa fa-cubes"></i> Product List
        <small>| Main stock product list</small>
      </h1>
      <ol class="breadcrumb">
        <li><a href="/Dashboard"><i class="fa fa-dashboard"></i> Dashboard</a></li>
        <li><a href="/Product"><i class="fa fa-product-hunt"></i> Product</a></li>
        <li class="active">List</li>
      </ol>
    </section>

    <section class="content">
      <div class="box box-info">
        <div class="box-header"> 
          <div class="row">
            <div class="col-md-3">
              <div class="form-group">  
                <div class="input-group">
                  <span class="input-group-addon"><i class="fa fa-barcode fa-lg"></i></span>
                  <input type="number" name="titlesearchByID" id="titlesearchByID" class="form-control" placeholder="Enter Product ID" value="{{ old('titlesearch') }}" autofocus>

                </div>                
              </div>
            </div>

            <div class="col-md-4">
              <div class="form-group">
                <div class="input-group">
                  <span class="input-group-addon"><strong>Name</strong></span>
                  <input type="text" name="titlesearch" id="titlesearch" class="form-control" placeholder="Enter Product Name" value="{{ old('titlesearch') }}"  autocomplete="off">
                  <span class="input-group-btn"><button class="btn btn-success" id="MultipleProductSearch" type="button">Search</button></span>    
                </div>

              </div>
            </div> 

            <div class="col-md-4">
              <div class="form-group">
                <div class="input-group">
                  <span class="input-group-addon"><strong>Category</strong></span>
                  <select name="CategoryID" id="CategoryID" class="form-control">
                    <option value="0">Select A Category</option>
                    <option value="-110">Product List</option>

                    @foreach($CategoryList as $Category)

                      @if($Category->CategoryID==$CategoryID)
                        <option value="{{ $Category->CategoryID }}" selected>{{ $Category->CategoryName }}</option>
                      @else
                      <option value="{{ $Category->CategoryID }}">{{ $Category->CategoryName }}</option>
                      @endif
                    @endforeach
                  </select>
                </div>                
              </div>
            </div> 

            <div class="col-md-1">
              <div class="form-group">
                <div class="button-group">
                  <button class="btn btn-primary"><i class="fa fa-refresh"></i></button>
                </div>
              </div>
            </div>
          </div>
        </div>

        <div class="box-body">
          <div id="ajaxContent">
          
          </div> 
          <table id="ProductList" class="display table table-hover table-responsive table-condensed">
            <thead> 
              <tr>                
                <th> ID </th>                               
                <th> Category </th>
                <th> Vendor </th> 
                <th> Name </th> 
                <th> Description </th>
                <th> CP</th>
                <th> SP</th>
                <th> Profit</th>
                <th> Qty </th>
                <th> Date </th>
                <th> Status </th>
                <th> Action </th>
              </tr>           
            </thead>            

            <tbody id="ProductBody">

            @if(count($ProductList)>0)
              @foreach($ProductList as $data)
              <tr>
                <td>{{$data->ProductID}}</td>              
                <td>{{$data->CategoryName}}</td>
                <td>{{$data->VendorName}}</td>
                <td>{{$data->ProductName}}</td>
                <td>{{$data->ProductDescription}}</td>
                <td>{{ round($data->CostPrice,2) }}</td>
                <td>{{ round($data->SalePrice,2) }}</td>
                <td>{{ round($data->SalePrice - $data->CostPrice,2) }}</td>
                <td>{{ round($data->Qty,2) }}</td>
                <td>{{ date('d/m/y', strtotime($data->created_at)) }}</td>
                @if($data->InactiveProduct==0)
                <td><i class="fa fa-check label-success"></i></td>
                @endif
                @if($data->InactiveProduct==1)
                <td><i class="fa fa-times label-danger"></i></td>
                @endif
                <td>
                  <input type="hidden" name="ProductIDforList[]" class="ProductIDforList" value="{{$data->ProductID}}">

                  <div class="dropdown">
                    <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">                    
                      <span class="caret"></span>
                    </button>
                    <ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
                      <li><a href="#" class="bg-green ProductDetails" title="Details" name="ProductDetails[]">Details</a></li>
                      <li><a href="#" name="ProductEdit[]" class="bg-orange ProductEdit" title="Edit">Edit </a></li>
                      <li><a class="bg-maroon ProductDistribution" href="#" name="ProductDistribution[]" title="Distribute to Shop"> Distribute </a></li>
                      <li role="separator" class="divider"></li>
                      <li><a href="#" class="ProductDelete bg-red" name="ProductDelete[]" id="DeleteBtn" title="Delete">Delete </a></li>
                    </ul>
                  </div>                
                </td>
              </tr>
              @endforeach
            @endif               
              
            </tbody>     
          </table>

          <div class="Pager">

          {!!$ProductList->links()!!}

          

          </div>

           <div class="pagi"></div>
        </div>
      </div>

      <form id="DistributeForm" method="post" action="{{URL::to('/Product/Admin/Distribute/Edit/')}}">
        <input type="hidden" name="_token" value="{{csrf_token()}}">
        <div id="DistributeFormBody">
        </div>
      </form>



      <form id="EditForm" method="post" action="{{URL::to('/Product/Edit')}}" enctype="multipart/form-data">
        <input type="hidden" name="_token" value="{{csrf_token()}}">
        <input type="hidden" name="ProductName" id="ProductNameOriginal">
        <input type="hidden" name="ProductID" id="ProductIDOriginal">
        <input type="hidden" name="ProductDescription" id="ProductDescriptionOriginal">
        <input type="hidden" name="CategoryID" id="CategoryIDOriginal">
        <input type="hidden" name="VendorID" id="VendorIDOriginal">
        <input type="hidden" name="Qty" id="QtyOriginal">
        <input type="hidden" name="MinQtyLevel" id="MinQtyLevelOriginal">
        <input type="hidden" name="Unit" id="UnitOriginal">
        <input type="hidden" name="CostPrice" id="CostPriceOriginal">
        <input type="hidden" name="SalePrice" id="SalePriceOriginal">
        <input type="hidden" name="PreferredPrice" id="PreferredPriceOriginal">
        <input type="hidden" name="TaxCode" id="TaxCodeOriginal">
        <input type="hidden" name="BorrowSale" id="BorrowSaleOriginal">

        <!-- <input name="ProductImgReal" type="file" class="form-control" id="ProductImgReal" placeholder="Enter"> -->
        
        <div id="EditFormBody">
        </div>
      </form>


   </section>
  </div>

  <script>
    $(document).ready(function() {

      $('#BorrowSaleList').on('click',function(e)
      {
        // $.get('/Product/Details/ShopID/' +ProductID, function(data) {
        //   var Product = JSON.parse(data.Product);
        //   alert(Product.length);
        //   // for(i=0;i<Product.length;i++)
        //   // {
        //   //   $('#modalproductdetailborrow').append('<input type="checkbox" name="BorrowSaleEdit[]">'+Product[i].ProductName);

        //   // }


        // });

        $('#BorrowSaleModal').modal('show');
        
      });


      $('.ProductDelete').on('click',function(e)
      {
        var Index=$('[name="ProductDelete[]"]').index(this);
        ID=$('[name="ProductIDforList[]"]').eq(Index).val();
        

        alertify.confirm('Product Delete', 'Are you sure you want to Delete This Product From your Store?', function()
        {

            //var OrderID=$('#OrderIDforOrderUpdate').val();
            //alert(OrderID);
             $.get('/Product/Delete/'+ID,function(data)
            {
              alertify.success("One Product Deleted");
              $('[name="ProductIDforList[]"]').eq(Index).closest('tr').hide();
            });              
                
        },function(){ alertify.error('Cancel')});
      });
      $('#MultipleProductSearch').on('click',function(e)
      {
        //e.preventDefault();
        var search=$('#titlesearch').val();
        if(search!="")
        {
          AddProductToList();
        }
      });

      $('#CategoryID').on('change',function(e)
      {
        var CatVal=$('#CategoryID').val();
        if(CatVal==-110)
        {
          window.location.replace("/Product/List/");
        }

        AddProductToList();
      });

      $('.ProductEdit').on('click',function(e)
      {
        e.preventDefault();
        var index=$('[name="ProductEdit[]"]').index(this);
        var ProductID=$('input[name="ProductIDforList[]"]').eq(index).val();
        ProductEdit(ProductID);
      });


      $('.ProductDetails').on('click',function(e)
      {
        e.preventDefault();
        $('#Product_Title').empty();
        $('#modalproductdetail').empty();
        var index=$('[name="ProductDetails[]"]').index(this);
        var ProductID=$('input[name="ProductIDforList[]"]').eq(index).val();

        $.get('/Product/Details/ShopID/' +ProductID, function(data) {

            var Product = JSON.parse(data.Product);
            var CategoryName=JSON.parse(data.CategoryName);
            var VendorName=JSON.parse(data.VendorName);
            $('#Product_Title').append(Product.ProductName);
           document.getElementById('modalproductdetail').innerHTML = '<tr><td>ProductID</td><td>' + Product.ProductID + '</td></tr><tr><td>Category</td><td>' + CategoryName + '</td></tr><tr><td>Vendor</td><td>' + VendorName + '</td></tr><tr><td>Quantity</td><td>' + Product.Qty + '</td></tr><tr><td>SalePrice</td><td>' + Product.SalePrice + '</td></tr><tr><td>CostPrice</td><td>' + Product.CostPrice + '</td></tr><tr id="PreferredPriceRow"><td>Preferred Price</td><td>' + Product.PreferredPrice + '</td></tr><tr id="ImageRow"><td>Image</td><td><img src="/uploads/image/product/' + Product.ProductImg + '" width=50 height=50></td></tr>';

            if(Product.ProductImg==null || Product.ProductImg=="" || Product.ProductImg=="Nothing"|| Product.ProductImg=="No Image")
                $('#ImageRow').hide();

            if(Product.PreferredPrice==null||Product.PreferredPrice=="")
                $('#PreferredPriceRow').hide();
            
            $('#ProductDetailsModal').modal('show');
        });
      });


      $('.ProductDistribution').on('click',function(e)
      {
        $('#DistributeFormBody').empty();
        e.preventDefault();
        var Index=$('[name="ProductDistribution[]"]').index(this);
        var ProductID=$('input[name="ProductIDforList[]"]').eq(Index).val();
        $.get('/Product/Distribute/Edit/'+ProductID,function(data)
        {
          var Product=JSON.parse(data.pr);
          var quantity=JSON.parse(data.quantity);
          var quantityintheinventory=JSON.parse(data.quantityintheinventory);
          var identity=JSON.parse(data.identity);
          var ShopName=JSON.parse(data.shopname);
          var QuantityBeforeDistribution=JSON.parse(data.tp);
          $('#ProductDistributionBody').empty();
          $('#ProductDistributionHeader').empty();
          $('#ProductDistributionHeader').append('<h1>'+Product.ProductName+'</h1><h4>Inventory Quantity: <div id="InventoryQuantity">'+quantityintheinventory+'</div> </h4>');          
          
          for(i=0;i<ShopName.length;i++)
          {
            $('#ProductDistributionBody').append('<tr><td><input type="hidden" name="Identity[]" class="Identity" value="'+identity[i]+'">'+ShopName[i]+'</td><td><input type="hidden" value="'+quantity[i]+'" name="QuantityOriginal[]" class="QuantityOriginal"><input type="number" value="'+quantity[i]+'" name="Quantity[]" class="Quantity form-control"> <input type="hidden" value="'+quantityintheinventory+'" id="InvenQuantity"></td></tr>');
          }         


          $('.Quantity').on('click keyup',function(e)
          {
              e.preventDefault();
              var TotalOriginal=0;
              var TotalCurrent=0;
              for(i=0;i<ShopName.length;i++)
              {
                var valueoriginal= parseInt($('[name="QuantityOriginal[]"]').eq(i).val(),10);
                var value= parseInt($('[name="Quantity[]"]').eq(i).val(),10);
                TotalOriginal=TotalOriginal+valueoriginal;
                TotalCurrent=TotalCurrent+value;
              }
              TotalCurrent=parseInt(TotalCurrent,10);
              var Diff=parseInt(TotalCurrent-TotalOriginal,10);
              var InventoryValue=parseInt($('#InvenQuantity').val(),10);
              if(Diff>=0)
              {
                var CurInventoryQuantity=parseInt(InventoryValue-Diff,10);
              }

              if(Diff<0)
              {
                var CurInventoryQuantity=InventoryValue-Diff;
              }

              $('#InventoryQuantity').empty();
              $('#InventoryQuantity').append(CurInventoryQuantity);
          });

          $('#FormforDistribution').on('submit',function(e)
          {
            e.preventDefault();
            $("#ProductDistributionBody").find(":input").clone().appendTo("#DistributeFormBody");
            $('#DistributeFormBody').append('<input type="hidden" name="ProductPreviousQuantity" value="'+QuantityBeforeDistribution+'">'); 
            $('#DistributeFormBody').append('<input type="hidden" name="ProductIDDistribute" value="'+Product.ProductID+'">');
            $('#DistributeForm').submit();
          });



        });

        $('#ProductDistributionModal').modal('show');
      });


      $('#FormforEdit').on('submit',function(e)
      {
        e.preventDefault();

        $('#ProductNameOriginal').val($('#ProductNameEdit').val());
        $('#ProductIDOriginal').val($('#ProductIDEdit').val());
        $('#ProductDescriptionOriginal').val($('#ProductDescriptionEdit').val());
        $('#CategoryIDOriginal').val($('#CategoryIDEdit').val());
        $('#VendorIDOriginal').val($('#VendorIDEdit').val());
        $('#QtyOriginal').val($('#QtyEdit').val());
        $('#MinQtyLevelOriginal').val($('#MinQtyLevelEdit').val());
        $('#UnitOriginal').val($('#UnitEdit').val());
        $('#CostPriceOriginal').val($('#CostPriceEdit').val());
        $('#SalePriceOriginal').val($('#SalePriceEdit').val());
        $('#PreferredPriceOriginal').val($('#PreferredPriceEdit').val());
        $('#TaxCodeOriginal').val($('#TaxCodeEdit').val());
        $('#BorrowSaleOriginal').val($('#BorrowSaleEdit').val());

        $("#PrImg").find(":input").clone().appendTo("#EditForm");
        
        $('#EditForm').submit();

      });



      function AddProductToList()      
      {
        var search=$('#titlesearch').val();
        if(search=="")
          search="NoName";
        var CategoryID=$('#CategoryID').val();

        //if(search=="NoName" && CategoryID>0)

        if(CategoryID!=-110)
        //{
          window.location.replace("/Product/List/"+CategoryID+'/'+search);
      }      


      $('#titlesearchByID').on('keyup',function(e)
      {

        var search=$('#titlesearchByID').val();
        if(search=="")
        {
          location.reload();
        }
        else
        {

          var BarcodeText =search;
          var ProductID   =search;
          var S = BarcodeText.includes("S");
          var s = BarcodeText.includes("s");

          if(S==true || s==true)
          {
              if (BarcodeText.indexOf('s') > -1)
              {
                  BarcodeText = BarcodeText.split("s");                  
              }

              if (BarcodeText.indexOf('S') > -1)
              {
                  var BarcodeText = BarcodeText.split("S");
              }

              var ProductID = BarcodeText[0];
          }

          $.get('/Product/Search/ByID/'+ProductID,function(data)
          {
            $('#ProductBody').empty();
            var Total=JSON.parse(data);

            $('.pagi').hide();
            for(i=0;i<Total.length;i++)
            {

              if(Total[i].InactiveProduct==0)
              {
                var check='<strong class="label label-primary">Active</strong>';       
              }

              if(Total[i].InactiveProduct==1)
              {
                var check='<strong class="label label-danger">InActive</strong>';       
              }


              var Profit=Total[i].SalePrice-Total[i].CostPrice;
              $('#ProductList').append('<tr><td>'+Total[i].ProductID+'</td><td>'+Total[i].CategoryName+'</td><td>'+Total[i].VendorName+'</td><td>'+Total[i].ProductName+'</td><td>'+Total[i].ProductDescription+'</td><td>'+Total[i].CostPrice+'</td><td>'+Total[i].SalePrice+'</td><td>'+Profit+'</td><td>'+Total[i].Qty+'</td><td>'+Total[i].created_at+'</td><td><i class="fa fa-check label-success"></i></td><td> <input type="hidden" name="ProductIDforList[]" class="ProductIDforList" value="'+Total[i].ProductID+'">'+

                '<div class="dropdown">'+
                  '<button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">'+                    
                    '<span class="caret"></span>'+
                  '</button>'+
                  '<ul class="dropdown-menu" aria-labelledby="dropdownMenu1">'+
                    '<li><a href="#" class="bg-green ProductDetails" title="Details" name="ProductDetails[]">Details</a></li>'+
                    '<li><a href="#" name="ProductEdit[]" class="bg-orange ProductEdit" title="Edit">Edit </a></li>'+
                    '<li><a class="bg-maroon ProductDistribution" href="#" name="ProductDistribution[]" title="Distribute to Shop"> Distribute </a></li>'+
                    '<li role="separator" class="divider"></li>'+
                    '<li><a href="#"'+Total[i].productID+' class="bg-red ProductDelete" name="PrdouctDelete[]" title="Delete">Delete </a></li>'+
                  '</ul>'+
                '</div>                 </td></tr>');
              
            }


      $('.ProductDetails').on('click',function(e)
      {
        e.preventDefault();
        $('#Product_Title').empty();
        $('#modalproductdetail').empty();
        var index=$('[name="ProductDetails[]"]').index(this);
        var ProductID=$('input[name="ProductIDforList[]"]').eq(index).val();
        

        $.get('/Product/Details/ShopID/' +ProductID, function(data) {

            var Product = JSON.parse(data.Product);
            var CategoryName=JSON.parse(data.CategoryName);
            var VendorName=JSON.parse(data.VendorName);

            $('#Product_Title').append(Product.ProductName );

           document.getElementById('modalproductdetail').innerHTML = '<tr><td>ProductID</td><td>' + Product.ProductID + '</td></tr><tr id="DescriptionRow"><td>Description</td><td>'+Product.ProductDescription+'</td></tr><tr><td>Category</td><td>' + CategoryName + '</td></tr><tr><td>Vendor</td><td>' + VendorName + '</td></tr><tr><td>Quantity</td><td>' + Product.Qty + '</td></tr><tr><td>SalePrice</td><td>' + Product.SalePrice + '</td></tr><tr><td>CostPrice</td><td>' + Product.CostPrice + '</td></tr><tr id="PreferredPriceRow"><td>Preferred Price</td><td>' + Product.PreferredPrice + '</td></tr><tr id="ImageRow"><td>Image</td><td><img src="/uploads/image/product/' + Product.ProductImg + '" width=50 height=50></td></tr>';

            if(Product.ProductImg==null || Product.ProductImg=="" || Product.ProductImg=="Nothing")
                $('#ImageRow').hide();

            if(Product.PreferredPrice==null||Product.PreferredPrice=="")
                $('#PreferredPriceRow').hide();
            if(Product.ProductDescription==null||Product.ProductDescription=="")
                $('#DescriptionRow').hide();
            
            $('#ProductDetailsModal').modal('show');
        });
     


      });
      $('.ProductDelete').on('click',function()
      {
        var index=$('[name="ProductDetails[]"]').index(this);
        var ProductID=$('input[name="ProductIDforList[]"]').eq(index).val();
        alertify.confirm('Product Delete', 'Are you sure you want to Delete This Product From your Store?', function()
        {

            //var OrderID=$('#OrderIDforOrderUpdate').val();
            //alert(OrderID);
             $.get('/Product/Delete/'+ProductID,function(data)
            {
              alertify.success("One Product Deleted");
              $('[name="ProductIDforList[]"]').eq(index).closest('tr').hide();
              

            });
               
                
        },function(){ alertify.error('Cancel')});



      });


      $('.ProductDistribution').on('click',function()

      {

        var index=$('[name="ProductDistribution[]"]').index(this);
        var ProductID=$('input[name="ProductIDforList[]"]').eq(index).val();

        ProductDistribution(ProductID);



      });


      $('.ProductEdit').on('click',function(e)
      {
        e.preventDefault();
        var index=$('[name="ProductEdit[]"]').index(this);
        var ProductID=$('input[name="ProductIDforList[]"]').eq(index).val();
        ProductEdit(ProductID);

      });


    });

  }
});


function ProductEdit(ProductID)
{

  $.get('/Product/Edit/'+ProductID,function(data)
  {

    //$('#EditBody').empty();

    var Category=JSON.parse(data.CategoryList);
    var Vendor  =JSON.parse(data.VendorList);
    var Product =JSON.parse(data.Product);
    if(Product.ProductDescription==null)
      Product.ProductDescription="";
    var Tax     =JSON.parse(data.TaxList);
    //alert(Category[0].CategoryName);
    //alert(Product.ProductName);    
    $('.EditHeader').empty();
    $('.EditHeader').append('<h3 class="box-title text-center">'+Product.ProductName+'</h3>');
    $('#ProductNameEdit').val(Product.ProductName);
    $('#ProductDescriptionEdit').val(Product.ProductDescription);
    $('#CategoryIDEdit').val(Product.CategoryID);
    $('#VendorIDEdit').val(Product.VendorID);
    $('#QtyEdit').val(parseFloat(Product.Qty,2).toFixed(2));
    $('#MinQtyLevelEdit').val(parseFloat(Product.MinQtyLevel,2).toFixed(2));
    $('#UnitEdit').val(Product.Unit);
    $('#CostPriceEdit').val(Math.round(Product.CostPrice));
    $('#SalePriceEdit').val(Math.round(Product.SalePrice));
    $('#PreferredPriceEdit').val(Math.round(Product.PreferredPrice));
    $('#ProductIDEdit').val(ProductID);
    $('#BorrowSaleEdit').val(Product.AllowNegative);
    $('#ProductImageRowforImage').empty();
    $('#ProductImageRowforImage').append('<img src="/uploads/image/product/'+Product.ProductImg+'" width="100" height="100" id="UserImgPlace">');
    
    //$('.EditHeader').append('<h3>'+Product.ProductName+'</h3>');



  });

  $('#ProductEditModal').modal('show');
}


function ProductDetails(ProductID)
{


    $.get('/Product/Details/ShopID/' +ProductID, function(data) {

      var Product = JSON.parse(data.Product);
      var CategoryName=JSON.parse(data.CategoryName);
      var VendorName=JSON.parse(data.VendorName);

      $('#Product_Title').append(Product.ProductName );

      document.getElementById('modalproductdetail').innerHTML = '<tr><td>ProductID</td><td>' + Product.ProductID + '</td></tr><tr id="DescriptionRow"><td>Description</td><td>'+Product.ProductDescription+'</td></tr><tr><td>Category</td><td>' + CategoryName + '</td></tr><tr><td>Vendor</td><td>' + VendorName + '</td></tr><tr><td>Quantity</td><td>' + Product.Qty + '</td></tr><tr><td>SalePrice</td><td>' + Product.SalePrice + '</td></tr><tr><td>CostPrice</td><td>' + Product.CostPrice + '</td></tr><tr id="PreferredPriceRow"><td>Preferred Price</td><td>' + Product.PreferredPrice + '</td></tr><tr id="ImageRow"><td>Image</td><td><img src="/uploads/image/product/' + Product.ProductImg + '" width=50 height=50></td></tr>';

      if(Product.ProductImg==null || Product.ProductImg=="" || Product.ProductImg=="Nothing")
      $('#ImageRow').hide();

      if(Product.PreferredPrice==null||Product.PreferredPrice=="")
      $('#PreferredPriceRow').hide();
      if(Product.ProductDescription==null||Product.ProductDescription=="")
      $('#DescriptionRow').hide();


      $('#ProductDetailsModal').modal('show');
    });





}


function ProductDistribution(ProductID)
{

   $.get('/Product/Distribute/Edit/'+ProductID,function(data)
        {
          var Product=JSON.parse(data.pr);
          var quantity=JSON.parse(data.quantity);
          var quantityintheinventory=JSON.parse(data.quantityintheinventory);
          var identity=JSON.parse(data.identity);
          var ShopName=JSON.parse(data.shopname);
          var QuantityBeforeDistribution=JSON.parse(data.tp);

          
          //var Sho=JSON.parse(data.shopname);

          $('#ProductDistributionBody').empty();
          $('#ProductDistributionHeader').empty();
           

          $('#ProductDistributionHeader').append('<h1>'+Product.ProductName+'</h1><h4>Inventory Quantity: <div id="InventoryQuantity">'+quantityintheinventory+'</div> </h4>');          
          
          for(i=0;i<ShopName.length;i++)
          {


            $('#ProductDistributionBody').append('<tr><td><input type="hidden" name="Identity[]" class="Identity" value="'+identity[i]+'">'+ShopName[i]+'</td><td><input type="hidden" value="'+quantity[i]+'" name="QuantityOriginal[]" class="QuantityOriginal"><input type="number" value="'+quantity[i]+'" name="Quantity[]" class="Quantity form-control"> <input type="hidden" value="'+quantityintheinventory+'" id="InvenQuantity"></td></tr>');

          }

          


          $('.Quantity').on('click keyup',function(e)

          {

              e.preventDefault();

              var TotalOriginal=0;
              var TotalCurrent=0;
              for(i=0;i<ShopName.length;i++)
              {

              var valueoriginal= parseInt($('[name="QuantityOriginal[]"]').eq(i).val(),10);
              var value= parseInt($('[name="Quantity[]"]').eq(i).val(),10);
              TotalOriginal=TotalOriginal+valueoriginal;
              TotalCurrent=TotalCurrent+value;
              }
              TotalCurrent=parseInt(TotalCurrent,10);
              var Diff=parseInt(TotalCurrent-TotalOriginal,10);
              var InventoryValue=parseInt($('#InvenQuantity').val(),10);
              if(Diff>=0)
              {
              var CurInventoryQuantity=parseInt(InventoryValue-Diff,10);
              }

              if(Diff<0)
              {
              var CurInventoryQuantity=InventoryValue-Diff;
              }

              $('#InventoryQuantity').empty();
              $('#InventoryQuantity').append(CurInventoryQuantity);


          });

          $('#FormforDistribution').on('submit',function(e)
          {
             e.preventDefault();
             //$('#FormforDistribution').

             $("#ProductDistributionBody").find(":input").clone().appendTo("#DistributeFormBody");

            $('#DistributeFormBody').append('<input type="hidden" name="ProductPreviousQuantity" value="'+QuantityBeforeDistribution+'">'); 
            $('#DistributeFormBody').append('<input type="hidden" name="ProductIDDistribute" value="'+Product.ProductID+'">'); 

             $('#DistributeForm').submit();   


          });


          
          
          //$('#ProductDistributionHeader').empty();
          //$('#ProductDistributionHeader').appned('<label class="label label-success label-lg" > '+Product.ProductName+' </label> Inventory Quantity :<div id="InventoryQuantity">'+quantityintheinventory+'   ');

          //alert(Product.ProductName);


        });

        //alert(ProductID);

        $('#ProductDistributionModal').modal('show');

}

    $('.ButtonBack').on('click',function(e)
    {

      e.preventDefault();
      $('#ProductEditModal').modal('hide');

    });

    $('#ProductDetailsBar').on('click',function(e)
    {

      e.preventDefault();
      var ID=$('#ProductIDEdit').val();
      $('#Product_Title').empty();
      $('#modalproductdetail').empty();
      
      ProductDetails(ID);

      



    });

    function readURL(input) {
      if (input.files && input.files[0]) {
        var reader = new FileReader();

        reader.onload = function (e) {
          $('#UserImgPlace').attr('src', e.target.result);
        }

        reader.readAsDataURL(input.files[0]);
      }
    }

    $("#ProductImg").change(function(){
      readURL(this);
    });

    $('.pagi').delegate('.pagination a','click',function(event){

      $('li').removeClass('active');
      $(this).parent('li').addClass('active');
      event.preventDefault();
      var pagiurl = $(this).attr('href');
      //alert(pagiurl);

       //location.hash = 2;

             //window.history.pushState("", "",pagiurl);
      //alert(pagiurl);
      $.ajax({
        url: pagiurl,
        data:"",
        headers: {
        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        },
        type:"GET",
        dataType: "json",
        success: function(data) {
        
        $('.Pager').empty();
        $('#ProductBody').empty();
        //alert("I am Jakir");
        var Total=JSON.parse(data.product);

        var Length=Total.per_page;
        alert(Length);
              for(i=0;i<Length;i++)
              {

                  if(Total.data[i].InactiveProduct==0)
                  {
                    
                    var check='<strong class="label label-primary">Active</strong>';       
                  }

                  if(Total.data[i].InactiveProduct==1)
                  {
                    var check='<strong class="label label-danger">InActive</strong>';       
                  }
                var Profit=Total.data[i].SalePrice-Total.data[i].CostPrice;
                $('#ProductList').append('<tr><td>'+Total.data[i].ProductID+'</td><td>'+Total.data[i].CategoryName+'</td><td>'+Total.data[i].VendorName+'</td><td>'+Total.data[i].ProductName+'</td><td>'+Total.data[i].ProductDescription+'</td><td>'+Math.floor(Total.data[i].CostPrice)+'</td><td>'+Math.floor(Total.data[i].SalePrice)+'</td><td>'+Profit+'</td><td>'+parseFloat(Total.data[i].Qty,10).toFixed(2)+'</td><td>'+Total.data[i].created_at+'</td><td>'+check+'</td><td><input type="hidden" name="ProductIDforList[]" class="ProductIDforList" value="'+Total.data[i].ProductID+'">'+

                '<div class="dropdown">'+
                  '<button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">'+                    
                    '<span class="caret"></span>'+
                  '</button>'+
                  '<ul class="dropdown-menu" aria-labelledby="dropdownMenu1">'+
                    '<li><a href="#" class="bg-green ProductDetails" title="Details" name="ProductDetails[]">Details</a></li>'+
                    '<li><a href="#" name="ProductEdit[]" class="bg-orange ProductEdit" title="Edit">Edit </a></li>'+
                    '<li><a class="bg-maroon ProductDistribution" href="#" name="ProductDistribution[]" title="Distribute to Shop"> Distribute </a></li>'+
                    '<li role="separator" class="divider"></li>'+
                    '<li><a href="/Product/Delete/"'+Total.data[i].ProductID+' id="DeleteBtn" class="bg-red" title="Delete">Delete </a></li>'+
                  '</ul>'+
                '</div>                 </td>  </tr>');
              }
        
        }
      });
    });

    });


  

    $(".btn-danger").on('click', function(e){
      e.preventDefault();
      var href = this.href;

      alertify.confirm("Are You Sure?",function (e) {
        if (e) {
          window.location.href = href;
        }
      });
    });
  </script>


  



         <!-- =================== Product Edit Modal ===================-->
      <div class="modal" id="ProductEditModal" role="dialog">
        <div class="modal-dialog modal-fullscreen-dialog">
          <!-- Modal content-->
          <div class="modal-content modal-fullscreen-content">
            <div class="modal-header">
              <h1 class="modal-title text-center">
                <p class="label label-success">Product Edit</p>
              </h1>
              <div class="row EditHeader">               
              </div>
              
            </div>

            <div class="modal-body">
              <form id="FormforEdit" class="form-horizontal">
                <input type="hidden" name="ProductIDEdit" id="ProductIDEdit" value="0">
                <div class="form-group">
                  <label for="ProductName" class="col-sm-2 control-label">Product Name :</label>
                  <div class="col-sm-4">
                    <input name="ProductName" type="text" class="form-control" id="ProductNameEdit" placeholder="ProductName" value="">
                  </div>

                  <label for="ProductDescription" class="col-sm-2 control-label">Description :</label>
                  <div class="col-sm-4">
                    <input name="ProductDescription" type="text" class="form-control" id="ProductDescriptionEdit" placeholder="ProductDescription" value="">
                  </div>
                </div>

                <div class="form-group">
                  <label for="CategoryID" class="col-sm-2 control-label">Category :</label>
                  <div class="col-sm-4">
                    <select name="CategoryID" class="form-control" id="CategoryIDEdit">
                    @foreach($CategoryList as $data)             
                    <option value="{{$data->CategoryID}}">{{$data->CategoryName}}</option>
                    @endforeach 
                    </select>
                  </div>
                  <label for="VendorID" class="col-sm-2 control-label">Vendor :</label>
                  <div class="col-sm-4">
                    <select name="VendorID" class="form-control" id="VendorIDEdit">
                    @foreach($VendorList as $data)              
                    <option value="{{$data->VendorID}}">{{$data->VendorName}}</option>
                    @endforeach
                    </select>
                  </div>              
                </div>

                <div class="form-group">
                  <label for="Qty" class="col-sm-2 control-label">Qty :</label>
                  <div class="col-sm-4">
                    <input name="Qty" type="number" class="form-control" step=".0001" id="QtyEdit" placeholder="Qty" value="">
                  </div>

                  <label for="MinQtyLevel" class="col-sm-2 control-label">Min Qty Level :</label>
                  <div class="col-sm-4">
                    <input name="MinQtyLevel" type="number" step=".0001" class="form-control" id="MinQtyLevelEdit" placeholder="MinQtyLevel" value="">
                  </div>
                </div>

                <div class="form-group">
                  <label for="Unit" class="col-sm-2 control-label">Unit :</label>
                  <div class="col-sm-4">
                    <input name="Unit" type="text" class="form-control" id="UnitEdit" placeholder="Unit" value="">
                  </div>

                  <label for="PreferredPrice" class="col-sm-2 control-label">Pref.Price :</label>
                  <div class="col-sm-4">
                    <input name="PreferredPrice" type="number" readonly step=".0001" class="form-control" id="PreferredPriceEdit" placeholder="PreferredPrice" value="">
                  </div>
                </div>

                <div class="form-group">
                  <label for="CostPrice" class="col-sm-2 control-label">Cost Price :</label>
                  <div class="col-sm-4">
                    <input name="CostPrice" type="number" step=".0001" class="form-control" id="CostPriceEdit" placeholder="CostPrice" value="">
                  </div>

                  <label for="SalePrice" class="col-sm-2 control-label">Sale Price :</label>
                  <div class="col-sm-4">
                    {{--<div class="input-group">--}}
                      {{--<input name="SalePrice" type="number" step=".0001" class="form-control" id="SalePriceEdit" placeholder="SalePrice" value="">--}}
                      {{--<span class="input-group-addon bg-navy" id="ProfitParcent" ><strong>0 %</strong></span>--}}
                    {{--</div>--}}
                    <input name="SalePrice" type="number" step=".0001" class="form-control" id="SalePriceEdit" placeholder="SalePrice" value="">
                  </div>


                </div>

                <div class="form-group">
                  <label for="TaxCode" class="col-sm-2 control-label">TaxCode :</label>
                  <div class="col-sm-4">
                    <select name="TaxCode" class="form-control" id="TaxCodeEdit"> 
                      @foreach ($TaxList as $Tax)         
                        <option value="{{ $Tax->TaxCodeID }}">{{ $Tax->TaxCode }}</option> 
                      @endforeach              
                    </select>
                  </div>
                  <label for="BorrowSale" class="col-sm-2 control-label">BorrowSale :</label>
                  <div class="col-sm-4">
                    <select name="BorrowSale" class="form-control" id="BorrowSaleEdit">          
                        <option value="1">Allow</option> 
                        <option value="0">Disallow</option>                                  
                    </select>
                  </div>
                  
                </div>

                <div class="form-group" id="ProductImageRow">
                  <label for="ProductImg" class="col-sm-2 control-label">Image :</label>
                  <div class="col-sm-4">
                    <div id="PrImg">
                      <input name="ProductImg" type="file" class="form-control" id="ProductImg" placeholder="ProductImg">
                    </div>                    
                  </div>
                  <div class="col-md-4 col-md-offset-2" id="ProductImageRowforImage">


                  </div>
                    
                  </div>

                </div>
                <div class="form-group">
                  <div class="col-sm-offset-2 col-sm-10">
                    <button  class="btn btn-danger btn-flat ButtonBack" title="Back to List"><i class="fa fa-arrow-left"></i> Back</button>
                    <input name="submit" type="submit" class="btn btn-success btn-flat" value="Update">
                  </div>
                </div>
              {{ Form::close() }}
            </div>

            <div class="modal-footer">
              {{--<button  class="btn btn-danger btn-flat " type="button " data-dismiss="modal">Cancel</button>--}}
            </div>
          </div>
        </div>
      </div>

       <!-- =================== Product Details Modal ===================-->
      <div class="modal" id="ProductDetailsModal" role="dialog">
        <div class="modal-dialog">
          <!-- Modal content-->
          <div class="modal-content">
            <div class="modal-header">
              <h1 class="modal-title text-center">
                <p class="label label-success">Product Details</p>
              </h1>
            </div>

            <div class="modal-body">     
              <div class="content">
                <div class="row">

                <h3 class="box-title text-center" id="Product_Title"></h3>
                  
                </div>

                <div class="row">

                  <table  class="table table-striped table-bordered" width="100%" id="modalproductdetail">
              

                  </table>
                  
                </div>
              </div>
            </div>

            <div class="modal-footer" "> 
              <button  class="btn btn-danger btn-flat " type="button " data-dismiss="modal">Cancel</button>
            </div>
          </div>
        </div>
      </div>

     
      <!-- =================== Product Distribution Modal ===================-->
      <div class="modal" id="ProductDistributionModal" role="dialog">
        <div class="modal-dialog">
          <!-- Modal content-->
          <div class="modal-content">
            <div class="modal-header">
              <h1 class="modal-title text-center">
                <p class="label label-success">Product Distribution</p>
              </h1>
            </div>

            <div class="modal-body">            
              <section class="content">
                <div class="box">
                  <div class="box-header">
                    <h3 class="box-title" id="ProductDistributionHeader">
                    </h3>         
                  </div>
                  <!-- /.box-header -->
                  <div class="box-body">
                    <form id="FormforDistribution">
                      <table id="ShopList" class="table table-bordered table-striped">
                        <thead>
                          <tr>
                            <th>ShopName</th>
                            <th>Quantity</th>
                          </tr>
                        </thead>

                        <tbody id="ProductDistributionBody">
                        </tbody>
                      </table>
                      <button type="submit" name="submit" class="btn btn-flat bg-maroon"><i class="fa fa-share"></i> Update Distribution</button>
                    </form>
                  </div>
                </div>
              </section>             
            </div>
            <div class="modal-footer" "> 
              <button  class="btn btn-danger btn-flat " type="button " data-dismiss="modal">Cancel</button>
            </div>
          </div>
        </div>
      </div>
      <script>

      
        
      </script>     

  @endsection