@extends('adminlayout.dashadmin')
<!-- 'adminlayout.admin'
--> <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

@section('content')

<style >
  section .due_sec{
   margin: 10px 0px 10px 15px;
   
 }
 div .due_content{
   display: inline-block;
   border-radius: 10px;
   padding: 10px 15px 10px 15px;
 }
 div .due_warning{
  background-color: #bcfbaf;
}
div .due_success{
  background-color:#f9e1c0 ;
}
div  .due_primary{
  background-color: #b9e5f0;
}
</style>

<!-- Content Wrapper Start -->
<div class="content-wrapper" ng-controller="PurchaseController">

  <!-- Content Header Start -->
  <section class="content-header" style="float:right;">
   <a class="btn btn-lg btn-warning" href="{{URL('add-purchase-party')}}">
    <i class="fa fa-fw fa-plus"></i>
    Add Sale
  </a>
  <a class="btn btn-lg btn-success" href="{{URL('add-purchase-party')}}">
    <i class="fa fa-fw fa-plus"></i>
    Add Purchase
  </a> 
  <a class="btn btn-lg btn-primary" href="{{URL('add-purchase-party')}}">
    <i class="fa fa-fw fa-plus"></i>
    Add Expences
  </a>    
</section>
<BR><BR>

<section class="content">


  <div class="box box-info collapsed-box">
    <div class="box-header with-border">
      <h3 class="box-title">
         From :         </h3>
        <input type="date" name="from"> 
        <h3 class="box-title"> to</h3>
         <input type="date" name="from">

          <label>
              <select name="supplier-supplier-list_length" aria-controls="supplier-supplier-list" class="form-control input-sm">
                <option value="all">All</option>
                <option value="25">Smgeo auto pvt</option>
                <option value="50">spvaig </option>
                <option value="100">df</option>
                <option value="200">sddd</option>
                <option value="-1">All</option>
              </select> </label>
         <button><i class="fa fa-fw fa-search"></i></button>
      </div>

      <div class="row">

        <section class="content-header due_sec" >
         <div class="due_content due_warning" href="#">

          Paid
          <h4>7900.00</h4>
        </div>
        <div class="due_content due_icon" href="#">
          <i class="fa fa-fw fa-plus"></i>

        </div>
        <div class="due_content due_success" href="#">
          Unpaid
          <h4>7900.00</h4>
        </div> 
        <div class="due_content due_icon" href="#">
          =

        </div>
        <div class="due_content due_primary" href="#">

         Total amt.
         <h4>7900.00</h4>
       </div>    
     </section>
   </div>


 </div>

 <div class="row">
  <div class="col-xs-12">
    <div class="box box-success">
      <div class="box-header">
        <h3 class="box-title">
        Party List            </h3>
      </div>
      <div class="box-body">
        <div class="table-responsive"> 

          <div id="supplier-supplier-list_wrapper" class="dataTables_wrapper form-inline dt-bootstrap"><div class="dataTables_length" id="supplier-supplier-list_length">
            <label>Show 
              <select name="supplier-supplier-list_length" aria-controls="supplier-supplier-list" class="form-control input-sm">
                <option value="10">10</option>
                <option value="25">25</option>
                <option value="50">50</option>
                <option value="100">100</option>
                <option value="200">200</option>
                <option value="-1">All</option>
              </select> entries</label>
            </div>
          <div id="supplier-supplier-list_filter" class="dataTables_filter">
            <label>Search:<input type="search" class="form-control input-sm" placeholder="" aria-controls="supplier-supplier-list"></label>
          </div>
          <div class="dt-buttons btn-group">     
            <button class="btn btn-default buttons-print" tabindex="0" aria-controls="supplier-supplier-list" type="button" title="Print"><span><i class="fa fa-print"></i></span></button>

           <button class="btn btn-default buttons-copy buttons-html5" tabindex="0" aria-controls="supplier-supplier-list" type="button" title="Copy"><span><i class="fa fa-files-o"></i></span></button>

           <button class="btn btn-default buttons-excel buttons-html5" tabindex="0" aria-controls="supplier-supplier-list" type="button" title="Excel"><span><i class="fa fa-file-excel-o"></i></span></button>

           <button class="btn btn-default buttons-csv buttons-html5" tabindex="0" aria-controls="supplier-supplier-list" type="button" title="CSV"><span><i class="fa fa-file-text-o"></i></span></button>

           <button class="btn btn-default buttons-pdf buttons-html5" tabindex="0" aria-controls="supplier-supplier-list" type="button" title="PDF"><span><i class="fa fa-file-pdf-o"></i></span></button>

           <button id="email-btn" class="btn btn-default buttons-email" tabindex="0" aria-controls="invoice-invoice-list" type="button" title="Email"><span><i class="fa fa-envelope"></i></span></button>
          </div>
          <div id="supplier-supplier-list_processing" class="dataTables_processing panel panel-default" style="display: none;">
            <img src="../assets/itsolution24/img/loading2.gif">
          </div>


  <table id="supplier-supplier-list" class="table table-bordered table-striped table-hover dataTable" data-hide-colums="" role="grid" aria-describedby="supplier-supplier-list_info" style="width: 1197px;">
            
    <thead>
      <tr class="bg-gray">
        <th class="text-center">Date</th>
        <th class="text-center">Invoice</th>
        <th class="text-center">Party Name</th>
        <th class="text-center">Payment Type</th>
        <th class="text-right">Amount</th>
        <th class="text-right">Balance</th>
        <th class="text-right">Action</th>
      </tr>
    </thead>    
    <tbody>
      <tr>
        <td class="text-center"><a href="#">10 dec 2023</a></td>
        <td class="text-center">B123122</td>
        <td class="text-center">SMGEO AUTOMOBILES PVT LTD</td>
        <td class="text-right">case</td>
        <td class="text-center">4,000.00</td>
        <td>4,000.00</td>
        <td>...</td>
      </tr>
    </tbody>
</table>

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


</section>
<!-- Content End -->
</div>
<!-- Content Wrapper End -->

@endsection



<script> 


  function getPostOffice(m_pincode) {
        //var pin_select = ('#pinaddress').val();
        $.ajax({
          type: "GET",
          url: "https://api.postalpincode.in/pincode/" + m_pincode,
          dataType: 'json',
          success: function(response) {
            console.log(response);
            var option = '';
            if (response[0].Status == "Success") {
              var PostOffice = response[0].PostOffice;
              var len = PostOffice.length;
              option += '<option value="" selected disabled> -- Select Option -- </option>';
              for (let index = 0; index < PostOffice.length; index++) {
                option += "<option value='" + PostOffice[index].Name + "'>" + PostOffice[index].Name + ", " + PostOffice[index].District + ", " + PostOffice[index].State + "</option>";
              }
              $('#pin_error').html("");
              $('#post_office').html(option);

              $("#post_office").on("click", function() {

              });
              document.getElementById('post_office').click();

            } else {
              $('#pin_error').html(response[0].Message);
              $('#post_office').html("");
            }
          }
        });
      }

      function changeAddress() {
        var pin             = $('#pin').val();
        var post_office     = $('#post_office').val();
        $.ajax({
          type: "GET",
          url: "https://api.postalpincode.in/pincode/" + pin,
          dataType: 'json',
          success: function(response) {
            console.log(response);
            var pin_select_status = 0;
            var option = '';
            if (response[0].Status == "Success") {
              var PostOffice = response[0].PostOffice;
              option += '<option value="" selected disabled> -- Select Option -- </option>';
              for (let index = 0; index < PostOffice.length; index++) {
                if (post_office == PostOffice[index].Name) {
                  pin_select_status   = 1;
                  $('#city').val(PostOffice[index].District);
                  $('#state').val(PostOffice[index].State);
                  $('#country').val(PostOffice[index].Country);
                }
                option += "<option value='" + PostOffice[index].Name + "'>" + PostOffice[index].Name + ", " + PostOffice[index].District + ", " + PostOffice[index].State + "</option>";
              }
              if (pin_select_status == 0) {
                $('#pin_error').html("Error Please re-select address.");
                $('#post_office').html(option);
              } else {
                $('#pin_error').html('');
              }
            } else {
              $('#pin_error').html(response[0].Message);
              $('#post_office').html('');
            }
          }
        });
      }


    </script>
    <script>
    // alert(document.cookie);
    getLocation();
    function getLocation() {
      if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(showPosition);
      } else { 
        alert("Geolocation is not supported by this browser.");
      }
    }
    
    function showPosition(position) {

      document.getElementById("latitude").value=position.coords.latitude;
      document.getElementById("longitude").value=position.coords.longitude;
      sessionStorage.setItem("latitude", position.coords.latitude);
      sessionStorage.setItem("longitude", position.coords.longitude);
    }
  </script>