<?php 
include "includes/header.php"; 
include "includes/Mdme-functions.php";
$mdme = getMdme_Rpt_Product_List($db,'');
include_once "includes/pagepermission.php";
include_once "common/dpselect-functions.php";

//check permission - START
if(!($res_modm_prm)){
	header("Location:".admin_public_url."error.php");
}
else if(trim($res_modm_prm['ViewPrm'])=="0") {
	header("Location:".admin_public_url."error.php");
}
//check permission - END
$Srch_FilterOptions = array( array('ID' => 'pdt_sku', 'Name' => 'Product SKU'), 
								array('ID' => 'pur_bill_no', 'Name' => 'Purchase Bill No'), 
								array('ID' => 'bill_no', 'Name' => 'Sales Bill No'));
?> 

<style>
	.wrapper{
		font-family: Arial, sans-serif; /* Change the font family */
	}
    /* Custom font style and size for DataTable */
    #tblresult {
        font-family: Arial, sans-serif; /* Change the font family */
        font-size: 14px; /* Change the font size */
    }

    /* Custom font style and size for DataTable header */
    #tblresult thead th {
        font-weight: bold; /* Optionally change the font weight */
    }

    /* Custom font style and size for DataTable body */
    #tblresult tbody td {
        /* Additional custom styling for table body cells if needed */
    }
</style>

<div class="wrapper">
    <div class="container">
        <!-- Page-Title - START -->
        <div class="row">
            <div class="col-sm-12">  
</br>
				<h4 class="page-title">Manage Product List</h4>
					
				<input type="hidden" name="disptblname" id="disptblname" value="<?php echo "rpt_product_list"; ?>" />
				<input type="hidden" name="rmv_sort_clm" id="rmv_sort_clm" value="<?php echo "4"; ?>" />
            </div>
        </div>
		<!-- Page-Title - END -->	
		<form class="form-horizontal" id="jvalidate" action="#" method="post" >
			<input type="hidden" name="action" id="action" value="<?php echo "product_listing"; ?>" />	
			<div class="row">
				<div class="col-md-12"> 	
				
					<div class="card border-primary">
						<div class="card-header border-primary">
							Search Criteria 
						</div>
						<div class="card-body">
							<div class="row col-md-12" style="padding:10px;">
							
								<div class="col-md-2">
									<?php 
									echo getSelectBoxFinancialYearlist($db, 'srch_fin_year', 'jsrequired');
									?>							
								</div>
								
								<div class="col-md-2">
									<?php 
									echo getSelectBox_companylist($db, 'srch_company', 'jsrequired');
									?>							
								</div>
								
								<div class="col-md-2">
									<?php 
									echo getSelectBox_customerlist($db, 'srch_customer', 'jsrequired');
									?>							
								</div>

								<div class="col-md-2">
									<?php 
									echo getSelectBox_supplierlist($db, 'srch_supplier', 'jsrequired');
									?>							
								</div>
							
								<div class="col-md-2">
								<?php 
								echo getSelectStockAvailbilitylist($db, 'srch_stock', 'jsrequired');
								?>							
							</div>

														
									
								
							</div>
							
							<div class="row" style="padding:10px;">
							
							<div class="col-md-2" >
									<input type="text" name="txtsrch_fmdate" id="txtsrch_fmdate" placeholder="Start Date" class="form-control" />						
								</div>
								
								<div class="col-md-2">
									<input type="text" name="txtsrch_todate" id="txtsrch_todate" placeholder="End Date" class="form-control" />						
								</div>	

								<div class="col-md-2">
									<select class="form-control select2" id="SearchOption" name="SearchOption">
										<option value="">Search Option</option>
										<?php
										foreach($Srch_FilterOptions as $r) {
										?>
										<option value="<?php echo $r['ID']; ?>"><?php echo $r['Name']; ?></option>
										<?php
										}
										?>	
									</select>						
								</div>					
								<div class="col-md-2">	
                                    <input id="Srchvalautocomplete" name="Srchvalautocomplete" class="form-control autocmplte_srchkeyword" type="text" placeholder="Search Keywords" />
								</div>	
								<div class="col-md-1">								
									</div>						
									<div class="col-md-1">					
										<a href="javascript:;" class="btn btn-warning"  onclick="search_result();">Search</a> 							
									</div>						
									<div class="col-md-1">					
										<a href="javascript:;" class="btn btn-info"  onclick="reset_result();">Reset</a> 							
									</div>						
							</div>
							
						</div>
					</div>										
									
				</div>
			</div>
		</form>
		
		
		<div class="row">
            <div class="col-sm-12">
                <div class="card-box table-responsive">                         
                    <table id="tblresult" class="table table-striped table-bordered">
                        <thead>
                            <tr>
								<th style="width:50px; ">S No.</th>
								<!-- <th>Financial Year</th> -->
								<th>Company Name</th>
								<!-- <th>Purchase Date</th> -->
								<th>Purchase <br> Bill</th>
								<th>Product <br>Details</th>
								<!-- <th>Image</th> -->
								<th> Description</th>
								<!-- <th>Purchase Rate</th> -->
								<th>Stock <br> Details</th>
								<th>Sales Bill</th>
								<th>Customer Name</th>
								<th>Sale Rate</th>
								<th>Discount</th>
								<th>Sale Rate <br><span style="font-size:12px">(After Dis)</span></th>
								<th>Tax </th>
								<th>Final Sold Rate</th>
								<th>Purchase Bill No</th>
								<th>Purchase Date</th>
								<th>Purchase Amount</th>
								<th>Supplier Name</th>
								<th>Sales Bill</th>
								<th>Sales Bill Date</th>
                            </tr>
                        </thead>                       
                    </table>
                </div>
            </div>
        </div> <!-- end row -->		

	
		<style>
    .custom-padding {
        padding-bottom: 10px; 
    }
	.green-color {
        color:green;
		font-size: 18px;
    }
</style>

		<?php include "includes/footer.php";  ?> 
	</div> <!-- container -->
</div> <!-- End wrapper -->

<?php include "includes/footer_script.php";  ?> 
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">

<script>
$(document).ready(function(){
    $("#tblresult").css("width", "100%"); // Set the width of the table
    $("#tblresult").DataTable(); // Initialize DataTable
});

// $(function () {   		
// 	 datatblCalAdvanceSearch();		
// });

// function hoverImage(element) {
//   document.getElementById("img01").src = element.src;
//   document.getElementById("modal01").style.display = "block";
// }


$(function () {
    $('#srch_fin_year').change(function () {
        var selectedOption = $(this).find(':selected');
        var startDate = selectedOption.attr('data-start-date');
        var endDate = selectedOption.attr('data-end-date');
        
        // Set the start and end date attributes for validation
        $('#txtsrch_fmdate').attr('data-start-date', startDate);
        $('#txtsrch_todate').attr('data-end-date', endDate);

        // Set the datepicker options for the from and to date fields
        $('#txtsrch_fmdate').datepicker('setStartDate', startDate);
        $('#txtsrch_fmdate').datepicker('setEndDate', endDate);
        $('#txtsrch_todate').datepicker('setStartDate', startDate);
        $('#txtsrch_todate').datepicker('setEndDate', endDate);

        // Set the selected start and end dates in the input fields
        $('#txtsrch_fmdate').val(startDate);
        $('#txtsrch_todate').val(endDate);

        console.log('Start Date:', startDate);
        console.log('End Date:', endDate);
    });

    $('#txtsrch_fmdate').datepicker({
        format: 'yyyy-mm-dd',
        // Use the data attribute for minimum date
        startDate: $('#txtsrch_fmdate').attr('data-start-date'),
        // Use the data attribute for maximum date
        endDate: $('#txtsrch_todate').attr('data-end-date'),
    }).on('changeDate', function (ev) {
        var selectedStartDate = new Date($('#txtsrch_fmdate').val());
        $('#txtsrch_todate').datepicker('setStartDate', selectedStartDate);
    });

    $('#txtsrch_todate').datepicker({
        format: 'yyyy-mm-dd',
        // Use the data attribute for minimum date
        startDate: $('#txtsrch_fmdate').attr('data-start-date'),
        // Use the data attribute for maximum date
        endDate: $('#txtsrch_todate').attr('data-end-date'),
    }).on('changeDate', function (ev) {
        var selectedEndDate = new Date($('#txtsrch_todate').val());
        $('#txtsrch_fmdate').datepicker('setEndDate', selectedEndDate);
    });

    $('#txtsrch_fmdate, #txtsrch_todate').bind('keyup keydown keypress', function (evt) {
        return false;
    });

   disp_result();
    // datatblCal();
});


function disp_result(){
	if ($.fn.DataTable.isDataTable('#tblresult')) {
    $('#tblresult').DataTable().destroy();
}
	$('#tblresult').dataTable({
		initComplete: function () {
			unloading(); 
		},
		bFilter: false, 
		bSort: false,
        processing: true,
		//"aoColumnDefs": [ { "bSortable": false, "aTargets": [ '_all' ] }],
		// "columnDefs": [ { "orderable": false, "aTargets": [ '_all' ]  } ],			
		// "destroy" : true,
        serverSide: true,
		serverMethod: 'post',
		"stateSave": true,
		"bStateSave" : false,
		"language": { "processing": loading() },
        "ajax":{
            url :"listingactivity_actions.php?pageaction="+$('#action').val()+"&srch_type="+$('#SearchOption').val()+"&srch_keyword="+$('#Srchvalautocomplete').val()+"&srch_finyear="+$('#srch_fin_year').val()+"&srch_company="+$('#srch_company').val()+"&srch_customer="+$('#srch_customer').val()+"&srch_supplier="+$('#srch_supplier').val()+"&srch_stock="+$('#srch_stock').val()+"&srch_fmdate="+$('#txtsrch_fmdate').val()+"&srch_todate="+$('#txtsrch_todate').val(), // json datasource
            type: "post",  // method  , by default get				
            error: function(){  // error handling                  
                $("#tblresult").append('<tbody class="employee-grid-error"><tr><th colspan="4">No data found in the server</th></tr></tbody>');
				unloading(); 
            }
        },
		
		"dom": '<"pull-right custom-padding"B>frtip',
		
        buttons: [
            {
				
                filename: 'product_listing' + new Date().toISOString().slice(0, 10),
				extend: 'excelHtml5',
				text:      'Download <i class="fa fa-file-excel-o green-color"></i>',
                titleAttr: 'Excel',
				
                exportOptions: {
					columns: [0,1,13,14,15,16,4,5,17,18,7,8,9,10,11,12] ,
                }
            },
        ],
		columnDefs : [
                        
						 {
                            targets: 2,
                            width: 80,
                        },
						 {
                            targets: 3,
                            width: 100,
                            render: function (data, type, row) {
                                var pdt_csv = row[3];
                                var pdt_amt = row[15];
                                    return '<span class="product-tooltip hoverToolTip" data-toggle="tooltip" data-placement="auto" onclick="get_amt()" title="' + pdt_amt + '" data-pdt-amount="' + pdt_amt + '">' + pdt_csv + '</span>';
                                },
                        },
						{
							targets: 5,
							render: function (data, type, row) {
								var status = row[5];
								if (status == '2') {
									return '<span class="label label-danger">Sold</span>';
								}
								else if (status == '0') {
									return '<span class="label label-primary">Available</span>';
								}
							}

						},
						{
							targets : 13,
							visible : false,
						},
						{
							targets : 14,
							visible : false,
						},
						{
							targets : 15,
							visible : false,
						},
						{
							targets : 16,
							visible : false,
						},
						{
							targets : 17,
							visible : false,
						},
						{
							targets : 18,
							visible : false,
						},
                        
					],
			
     });
	 
}

function clear_result() {
    // Clear the DataTable and destroy it
    var table = $('#tblresult').DataTable();
    table.clear().destroy();
    
    // Optionally, reset any filters or search inputs
    $('#SearchOption').val('');
    $('#Srchvalautocomplete').val('');
    $('#srch_fin_year').val('');
    $('#srch_company').val('');
    $('#srch_customer').val('');
    $('#txtsrch_fmdate').val('');
    $('#txtsrch_todate').val('');


    window.location.reload();
    // Call the display result function to reload the DataTable
    disp_result();
}

function search_result(){
	disp_result();
}
function reset_result(){
	clear_result();
}

</script>	

<style type="text/css">
.popover{
    max-width:500px;
    height:250px;    
    overflow-y:auto;
}
.hoverToolTip:hover{
	cursor:pointer;
}
/* .col-md-2 { padding:2px;} */
</style>

</body>
</html>
