<?php    include_once('config/db.php');  include_once('config/check.php'); 



?>

<!DOCTYPE html>
<html>
<head>
<?php include_once('inc/link.php');   ?>  
</head>
<body <?php include_once('inc/nav.php');  ?>>
<div class="wrapper">

  <!-- Main Header -->
    <header class="main-header">

    <!-- Logo -->
       <?php include_once('inc/brand.php');   ?>

    <!-- Header Navbar -->
    <?php include_once('inc/navbar.php');   ?>

  </header>
 
  <!-- Left side column. contains the logo and sidebar -->
    <aside class="main-sidebar">

    <!-- sidebar: style can be found in sidebar.less -->
     <?php include_once('inc/menu.php');   ?>
    <!-- /.sidebar -->
  </aside>

  <!-- Content Wrapper. Contains page content -->
  <div class="content-wrapper">
   
  <section class="content-header">
        <div class="col-md-12 row">
          <div class="col-md-3">
          <p style="color:green; font-size:20px; text-allign:centre ;font-weight:bold; " > <i class="fa fa-book" ></i> Customer Balances   </p>
          
                  
          </div>
              
          <div class="col-md-3  " class="mybtn" id="mybtn"  >
          </div>  
          <div class="col-md-6 pull-right"   >
                
            <div class="col-sm-12 row"> 
                <div class="col-md-4" id="mysearchbox">
                  
                </div>               
                <div class="col-md-3">
                  <input type="date" name="start_date" id="start_date" class="form-control  " style="border-radius:2px;"> 
                </div>               
                <div class="col-md-3">
                  <input type="date" name="end_date"  id="end_date" class="form-control  " style="border-radius:2px;" > 
                </div>               
                              
                <div class="col-md-2"> 
                  <!-- <input type="button" name="search" id="search" value="Find" class="btn btn-info" /> -->
                    <button  class="btn btn-default btn-sm " name="search" id="search" type="button" > <i class="fa fa-search"></i> Find </button>
                </div>                                                          
            </div> 
        </div>
      </section>



  
  <!-- Main content -->
  <section class="content container-fluid">
    <div class="row">        
        <div class="col-md-12">
        <div class="box box-default box-xs">
          <div class="box-body">
                            
                <div class="">
                <table id="customer_data" class="table table-small table-responsive ">
                  <thead>
                    <tr style="height: 0px;" class="bg-primary">

                   
                    <th >  </th>
                    <th >  Partner_Type  </th>
                    <th >  Partner_Name  </th>
                    <th >  Currency  </th>
                    <th >  Amount  </th>
                    <th >  Paid  </th>
                    <th >  Balance   </th>
                     <th > Balance_(TZS)   </th>
                     <th > Action   </th>
                    
                   
                    
                    <!-- <th > Website  </th>
                    <th > Address  </th>
                    <th > Location </th>
                    <th > Country</th> -->
                    </tr>
                  </thead>
                  </table>
            </div>
          </div>
        </div>
         
        </div>
        <!-- /.col -->
      </div>
  </section>
  
</div>
  <!-- /.content-wrapper -->
  
  <!-- Main Footer -->
  <footer class="main-footer">
    <?php  include_once('inc/footer.php'); ?>
  </footer>
  
</div>
                         
<!-- ./wrapper -->

<!-- REQUIRED JS SCRIPTS -->
<?php include_once('inc/linkjs.php') ?>

</body>
</html>

<!-- dynamic rows start here -->
<!-- DYANAMIC ROWS LISTING HERE --->

 
<!-- DYNAMIC ROWS ENDS HERE --->

<script type="text/javascript" language="javascript" >
 $(document).ready(function(){

 fetch_data('no');

 function fetch_data(is_date_search, start_date='', end_date='')
 {
    var dataTable = $('#customer_data').DataTable(
      {
          "processing" : true,
          "serverSide" : true,          
          colReorder: true,
          
          language: { search: "" },
          "bInfo" : true,
          "paging": false,
          "scrollY":        "700px",
          "scrollCollapse": true,
          "order" : [],
          "ajax" : {
          url:"filter/acc_rec.php",
          type:"POST",
          data:{
                  is_date_search:is_date_search, start_date:start_date, end_date:end_date
                }
        }
      }); 
      
      codeListTable = $("#customer_data").DataTable();
        new $.fn.dataTable.Buttons( codeListTable, {
            buttons: [
          
                {
                extend:    'excel',
                text:      '<i class="fa fa-files-o"></i> Excel',
                titleAttr: 'Excel',
                className: 'btn btn-default btn-sm',
                exportOptions: {
                    columns: ':visible'
                }
                },
                {
                extend:    'pdf',
                text:      '<i class="fa fa-file-pdf-o"></i> PDF',
                titleAttr: 'PDF',
                className: 'btn btn-default btn-sm',
                exportOptions: {
                    columns: ':visible'
                }
                },               
                {
                extend:    'print',
                text:      '<i class="fa fa-print"></i> Print',
                titleAttr: 'Print',
                className: 'btn btn-default btn-sm',
                exportOptions: {
                    columns: ':visible'
                }
                },  
            ]
        } );
        codeListTable.buttons().container().appendTo('#mybtn');

       
       


      
 }

 $('#search').click(function(){
  var start_date = $('#start_date').val();
  var end_date = $('#end_date').val();
  if(start_date != '' && end_date !='')
    {
       $('#customer_data').DataTable().destroy();
       fetch_data('yes', start_date, end_date);
    }
  else
    {
      alert("Both Date is Required");
    }

   
 }); 
 

   
 $(".dataTables_filter").detach().appendTo("#mysearchbox");
      //  $("#mysearchbox").html($("")); 

 });
 
</script>