@extends('layouts.backend.app')

@section('content')

<div class="main-content stock">
<div class="page-content">
   <div class="container-fluid">
	  <div class="page-title-box">
		 <div class="row align-items-center">
			<div class="col-md-8">
			   <h6 class="page-title">Head Office product View</h6>
			   <ol class="breadcrumb m-0">
				  <li class="breadcrumb-item"><a href="{{ dashboardurl() }}">Home </a></li>
				  <li class="breadcrumb-item active" aria-current="page">Head Office product View</li>
			   </ol>
			</div>

			<div class="col-md-4">
				<a class="btn btn-primary button-1 float-right" href="{{ route('headquarters') }}">
				<span class="pe-1 color-primary"><i class="ti-angle-left"></i></span> Back</a>
			</div>

		 </div>
	  </div>
   </div>
   
   <div class="row product-row ">
	  <div class="col-md-12">
		 <div class="col-md-12 mobile-table-column stock-table">
			<div class="card">
			   <div class="card-body">
		   
		<div class="row gutters-5 pb-2">
			<div class="col text-left text-md-left">
				<h5 class="mb-md-0 h6">All Products</h5>
				<p class="card-text mb-1"> <span class="h6">Number of Product : </span>
				@php 
				$procount = \App\Models\Invoice::where('invoice_no', $sales->invoice_no)->where('head', 'Yes')->count();
				$qnty = !empty($procount) ? $procount : '0';
				@endphp 
				
					{{ $qnty }}
				</p>
			</div>
			<div class="col-md-2 text-right">
				<a class="btn btn-sm btn-secondary btn-st btn-thrd" href="{{ route('headquarters-prices', $sales->invoice_no) }}">Export Price</a>
			</div>
			<div class="col-md-1 text-right">
				<button class="btn btn-sm btn-secondary btn-st btn-thrd fltr-btn fltrbtn">Filter <i class="las la-filter"></i></button>
			</div>
		</div>

		<div class="row">
			<div class="col-md-8 text-right">
				<b>Total Price: <span class="prdv"></span></b>
			</div>
			<div class="col-md-4 text-right">

			<button class="btn btn-primary updateall">
			<a onclick="uprow();" href="javascript:(0);" style="color:white;">Update Price</a></button>

			</div>
		</div>


		<form method="POST" action="memberdata" name="memberdata" id="memberdata" enctype="multipart/form-data">
		@csrf

			<!--Filter-->
			<div class="fltr-main pt-2 pb-2" style="display: none;">
				<div class="row">
					<div class="form-group col-md-4 col-sm-6">
						<label class="form-label">Sales Barcode</label>
						<input type="text" class="form-control" id="sale_barcode" name="sale_barcode" value="">
					</div>

					<div class="form-group col-md-4 col-sm-6">
						<label class="form-label">Product Name</label>
						<input type="text" class="form-control" id="product_name" name="product_name" value="">
					</div>

					<div class="form-group col-md-4 col-sm-6">
						<label class="form-label">Product Model Name</label>
						<input type="text" class="form-control" id="product_model" name="product_model" value="">
					</div>

					<div class="form-group col-md-4">
						<label class="form-label">Price Order By</label>
						<select class="form-control single-sel sel-style" id="price_order" name="price_order">
							<option value="">Select</option>
							<option value="low">Low to High Price</option>
							<option value="high">High to Low Price</option>
						</select>
					</div>

					<div class="form-group col-md-4">
						<label class="form-label" style="font-size: 2px;">&nbsp;</label>
							<div class="srch-same-line pt-2 pb-2">

						<button type="button" class="searchdata btn btn-sm btn-primary btn-st">Search <i class="la la-search"></i></button>

						<button type="button" class="btn btn-sm btn-secondary btn-st reset_searchdata">Reset <i class="la la-refresh"></i></button>

						</div>
					</div>
				</div>
			</div>
		</form>		
		<!--Filter-->


		  <table id="dataList" class="display" style="width:100%">
			 <thead>
				<tr>
				   <th>S.no</th>
				   <th>Sales Barcode</th>
				   <th>Product Name</th>
				   <th>Product Model Name</th>
				   <th>NLC Price</th>
				   <th>Action</th>
				</tr>
			 </thead>
			 <tbody>
			 </tbody>
		  </table>
		  
		  
			   </div>
			</div>
		 </div>
	  </div>
   </div>
</div>
</div>

<div class="modal fade stock-modal" id="testedMobile" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
         <div class="modal-dialog">
            <div class="modal-content">
               <div class="modal-header">
                  <h1 class="modal-title fs-5" id="exampleModalLabel">Vendor mobile</h1>
                  <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
               </div>
               <div class="modal-body">
                  <div class="container">
                     <!-- Mobile visible table  -->
                     <div class="row stock-row">
                        <div class="col-md-12">
                           <div class="row">
                              <div class="col-md-12">
                                 <div class=" mb-3" style="max-width: 540px;">
                                    <div class="">
                                       <div class="mb-3 selectdraf">
                                          <label for="exampleFormControlInput1" class="form-label w-100 d-flex justify-content-between">Add Mobile <button class="btn btn-primary"><i class="fas fa-qrcode"></i> </button> </label>

                                          <input type="text" class="form-control w-100 tags w-100" id="" placeholder="" style="display: none;">

                                       </div>
                                       <div class="d-flex justify-content-between align-items-center">
                                          <button class="btn btn-success"> Submit </button> 
                                       </div>
                                    </div>
                                 </div>
                              </div>
                           </div>
                        </div>
                     </div>
                  </div>

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

 <!-- Delete Modal HTML -->
<div id="deleteModal" class="modal fade">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<h4 class="modal-title">Delete Record</h4>
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
			</div>
			<div class="modal-body">
				<p>Are you sure you want to delete these Records?</p>
				<p class="text-warning"><small>This action cannot be undone.</small></p>
			</div>
			<input type="hidden" id="delete_id">
			<div class="modal-footer">
				<input type="button" class="btn btn-default closebtn" data-dismiss="modal" value="Cancel">
				<input type="button" class="btn btn-danger" onclick="deleterecord()" value="Delete">
			</div>
		</div>
	</div>
</div>


@endsection

@section('scripts')

<script type="text/javascript">

	//Remove Record
$(document).on("click", ".removrd", function () {
var rid = $(this).data("id");
$('#delete_id').val(rid);
});

	//Remove Record
function deleterecord() {

	var rid = $('#delete_id').val();
	var pathn = $('meta[name="base_url"]').attr("content")+'/headquarters-remove';
	var token = $('meta[name="csrf-token"]').attr("content");

	$.ajax({
		url: pathn,
		type: "POST",
		data: {
			_token: token,tblid: rid
		}, success: function (data) {

			if(data.status == true) {
				custom_noty("success", data.msg);
				$(".closebtn").click();
				$('#dataList').DataTable().ajax.reload();
				setTimeout(clprcs, 1000);
			} else {
				custom_noty("error", data.msg);
			}
		}
	});
}

</script>

<script>

function uprow() {
	
    var chkmopId = '';
	$('.ordermop').each(function () {
		chkmopId += $(this).val() + ",";  
    });
	chkmopId = chkmopId.slice(0, -1);
	
	var mgid = '';	
	$('.chkNumber').each(function () {
		mgid += $(this).val() + ",";  
	});
	mgid = mgid.slice(0, -1);

	$.ajax({
		type: "get",
		url: "{{ route('nlcprice-update') }}",
		data: "updatemop="+encodeURIComponent(chkmopId)+"&mgid="+encodeURIComponent(mgid),
		beforeSend: function() {
		}, success: function(respnse) {
			custom_noty("success", "Successfully update to your price");
			$('#dataList').DataTable().ajax.reload();
		}
	});
}

</script>

<script>

$(document).ready(function() {
	
	var pathn = $('meta[name="base_url"]').attr("content")+'/product-data/{{$sales->invoice_no}}';
	var reporttables =  $('#dataList').DataTable({
		"order": [[ 0, "desc" ]],
        "serverSide": true,
		"stateSave": true,
        'processing': true,
		"pageLength": 20,
		"lengthMenu": [
            [20, 50, 75, 100, 125, 150, 175, 200, 225, 250, 275, 300, 325, 350, 375, 400, 420, 450, 475, 500],
            [20, 50, 75, 100, 125, 150, 175, 200, 225, 250, 275, 300, 325, 350, 375, 400, 420, 450, 475, 500]
        ],
        oLanguage: {sProcessing: '<div class="lds-css"><div style="width:100%;height:100%" class="lds-eclipse"><div></div><p>Please wait while we are processing your request.</p></div></div>' },
		"ajax": {
			'type': 'GET',
			'url': pathn,
			"data": function(d){
               d.pagenme = '{{ basename(url()->current()) }}',
			   d.sale_barcode = $("#sale_barcode").val(),
			   d.product_name = $("#product_name").val(),
			   d.product_model = $("#product_model").val(),
			   d.price_order = $("#price_order").val()
			}
		},
		searching: false,
		"iDisplayLength": 20,
		"columnDefs": [
		{
			"targets": 0,
			className: "text-center",
			"render": function ( data, type, row, meta ) {
				return row.index;
			}
		},
		{
			"targets": 1,
			orderable: true,
			"render": function ( data, type, row, meta ) {
				return row.barcode;
			}
		},
		{
			"targets": 2,
			orderable: true,
			"render": function ( data, type, row, meta ) {
				return row.product_name;
			}
		},
		{
			"targets": 3,
			orderable: true,
			"render": function ( data, type, row, meta ) {
				return row.pro_model;
			}
		},
		{
			"targets": 4,
			orderable: true,
			"render": function ( data, type, row, meta ) {

				var odr ='';
				odr +='<input name="textmop[]" type="text" id="textmop" style="padding: 1px 2px;width:50%;" value="'+row.nlc_price+'" size="3" class="ordermop text-center" />';

				odr +='<input type="hidden" value="'+row.nlc_price+'" class="ttlpr" />';

				odr +='<input type="hidden" name="chk_mop[]" id="chk_mop" value="'+row.fid+'" class="chkNumber"/>';
				return odr;

			}
		},
		{
			"targets": 5,
			orderable: true,
			"render": function ( data, type, row, meta ) {

				var tbl = '';
				tbl +='<div class="action bank d-flex justify-content-start">';

					tbl+='<a href="'+row.invoiceurl+'" class="edit mx-2 text-info btn btn-sm btn-success text-white"> <i class="fas fa-file-invoice"></i> </a>';

					tbl +='<a href="#deleteModal" data-toggle="modal" data-id="'+row.id+'" class="edit text-info btn btn-sm  btn-danger text-white me-2 removrd">';
						tbl +='<i class="fas fa-trash"></i>';
					tbl +='</a>';

				tbl +='</div>';
				return tbl;
			}
		}
	  ]
	});
});

$(document).on('click', '.searchdata', function(){
	$('#dataList').DataTable().ajax.reload();
});
$(document).on('click', '.reset_searchdata', function(){
    $('#memberdata').trigger("reset");
    $('#sale_barcode').val('');
    $('#product_name').val('');
    $('#product_model').val('');
    $('#price_order').val('');
    $('#dataList').DataTable().ajax.reload();
	 $('.fltr-btn').trigger('click');
});

function vldfn(){
	$('#dataList').DataTable().ajax.reload();
}

</script>

<script type="text/javascript">

$(".fltrbtn").click(function(){

	if($('.fltr-main').is(':visible')){
		$(".fltr-main").hide(1000);
	} else {
		$(".fltr-main").show(1000);
	}
});
</script>

<script>

$(document).on("change", ".ordermop", function () {
    var sum = 0;
    $(".ordermop").each(function(){
		if($(this).val()!='') {
        sum+= parseInt($(this).val());
		}
    });
	$('.prdv').html(sum);
});

$( window ).on("load", function() {
	setTimeout(clprcs, 1000);
});

function clprcs() {
 	var sum = 0;
    $(".ttlpr").each(function(){
		if($(this).val()!='') {
        sum+= parseInt($(this).val());
		}
    });
	$('.prdv').html(sum);
}

</script>

@endsection