@extends('layouts.backend')

@section('extraCss') 

<style type="text/css">
    .card-header{
        border-bottom-style:hidden !important;
    }
    .container-fluid{
      font-size: 15px !important;
    }
    
</style>
@endsection

@section('mainContentArea')
<div class="card card-default">
        <div class="card-header">
            <h4>Manage Article Content</h4> 
        </div>
        {{-- <div class="alert alert-default" >
            <form action="{{ route('pos-outward-orders-report') }}" id="articlereport" method="post">
              @csrf
                <h4>Filter  </h4>                

                <table class="table filterPosSo"> 
                    <tr> 
                        <td>Invoice Status</td>
                        <td colspan="2">ACTION</td>
                    </tr>
                    <tr>
                        <td>                            
                            <select name="tellstatus" id="tellstatus" class="input-md" >
                                <option value="1" {{ ( !empty(request("tellstatus")) ? "selected" : "") }}>Not Inserted</option>
                                <option value="2" {{ ( !empty(request("tellstatus")) ? "selected" : "") }}>Only Inserted</option>
                            </select>
                        </td> 
                        <td><button class="btn btn-block btn-success"><i class="fa fas fa-search" id="submit"></i></button></td>
                        <td><button class="btn btn-block btn-warning" type="button" onclick="window.location.href='{{ route('pos-outward-orders-report') }}';"><i class="fa fas fa-refresh"></i></button></td>
                    </tr>
                </table>
            </form>
        </div> --}}
        <div class="card-body">
                <table class="table table-bordered table-hover">
                  <tr>
                    <th>S.No.</th>
                    <th>Store</th>
                    <th>Customer</th>
                    <th>Telephone</th>
                    <th>Date </th>
                    <th>Bill Amount </th> 
                    <th width="100px">Action</th>  
                </tr>
                @if($data->count() > 0)
                <tbody>
                @foreach($data as $key => $mbill)               
                <tr>
                  <td>{{$key + 1 }} </td>                    
                  <td>{{ $mbill->store_name }}</td>
                  <td>{{ empty($mbill->name) ? 'N/A' : $mbill->name }}</td>
                  <td>{{ !empty($mbill->telephone) ? $mbill->telephone : 'N/A' }}</td>
                  <td>{{ !empty($mbill->bill_date) ? $mbill->bill_date : 'N/A' }}</td>
                  <td>{{ !empty($mbill->final_amt) ? $mbill->final_amt : 'N/A' }}</td>
                  <td>
                    <a data-toggle="modal" data-target="#salesModal"  data-pid="{{$mbill->id}}" >view
                    </a>
                  </td>                    
              </tr>
                @endforeach
                @else
                <tr>
                    <td colspan="5"><div class="alert alert-danger">No Images found!</div></td>
                </tr>
                @endif
                </tbody> 
            </table>              
        </div>
       @php if($data->count() > 0) { @endphp {!! $data->appends(request()->input())->links() !!} @php } @endphp
</div>

<div class="modal fade bd-example-modal-xl" id="salesModal" role="dialog"  data-keyboard="false" data-backdrop="static">
  <div class="modal-dialog modal-xl">
  
    
    <div class="modal-content" >
      <div class="modal-header" >
        <h5> Sales Order</h5>
        <table class="table table-striped table-bordered" id='orderDetails'>
          <thead>
              <tr>
                  <th>Store</th>
                  <th>Customer </th>
                  <th>Telephone </th>
                  <th>Date</th>
                  <th>Bill Amount</th>                  
              </tr>
          </thead>  
          <tbody>
          </tbody>
        </table> 
        <button type="button" class="close" data-dismiss="modal">&times;</button>  
        <input type="hidden" id ='perid'>       
      </div>
      <div class="modal-body" > 
          <div class="table-responsive" style="margin-top:20px; display:none;" id='warediv'>
                  <table class="table table-striped table-bordered" id='sales' >
                      <thead>   
                        <tr  >
                          <th > Style </th>
                          <th > Barcode </th>
                          <th > Model </th> 
                          <th > HSN </th>
                          <th > MRP </th>
                          <th > Discount Per </th>
                          <th > Discount </th> 
                          <th > Scheme Name</th>
                          <th > Scheme Amount</th>
                          <th > Tax </th>
                          <th > CGST </th> 
                          <th > SGST </th> 
                          <th > Qty </th> 
                          <th > Net Price  </th> 
                          <th > SPS Price </th> 
                       </tr>                        
                      </thead>
                      <tbody>
                      </tbody>
                  </table>
          </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" id='close' data-dismiss="modal">Close</button>
        <button  type="button" title="Account Approve"  id ="approveid" class="btn btn-success" style="margin:1px;">Approval</button>     
      </div>
    </div>    
  </div>
</div>
@endsection



@section('extraJs')

<script type="text/javascript">  

  $('#salesModal').on('show.bs.modal', function (event) {
    $('#sales tbody').html(''); 
   
    $('#warediv').css('display','none');  
   
   var button = $(event.relatedTarget); // Button that triggered the modal  
   
   var pid = button.data('pid');
   
   var modal = $(this);  
   
   $('#perid').val(pid);
      
   var _token   = $('meta[name="csrf-token"]').attr('content'); 

   $.ajax({
     type: "get",
     url: "{{ route('manual-bill-details') }}",
     data:{id: pid, _token:_token},
     dataType: "json",
     success: function(response) {   
      console.log(response);  
        $('#warediv').css('display','block'); 
        $('#sales tbody').html('');  
        var otbody='';        
        $('#orderDetails tbody').html(''); 

        otbody += "<tr><td>"+ response.bdetail.store  + "</td><td>" + response.bdetail.name + "</td><td>"+ response.bdetail.telephone + "</td><td>" + response.bdetail.bill_date + "</td><td>"+response.bdetail.final_amt+"</td></tr>";
        
        $('#orderDetails tbody').append(otbody); 
          
           $.each(response.pdetail, function(propNames, bVal) {   
            console.log(propNames, bVal);
            
             $('#sales tbody').append("<tr><td>" + bVal.style  + "</td><td>" + bVal.barcode + "</td><td>" + bVal.model + 
              "</td><td>"+ bVal.hsn +"</td><td>"+ bVal.MRP +"</td><td>"+ bVal.disper +"</td><td>"+ bVal.discount +"</td><td>"+
                bVal.scheme +"<td>"+bVal.sdis+"</td><td>"+bVal.tax+"</td><td>"+bVal.cgst+"</td><td>"+bVal.sgst+"<td>"+bVal.qty+"</td><td>"+bVal.selling+"</td>"+bVal.spspr+"</td></tr>");
             
         });
           
     },
     error: function(response) {
       console.log(response.responseJSON);
     }
   });

 });

 $('#approveid').on('click',function(){
// alert('ji');
    var _token   = $('meta[name="csrf-token"]').attr('content');   
    var id = $('#perid').val();
    //console.log(id); return false;
    $.ajax({
    type: "get",
    url: "{{ route('manual-bill-approve') }}",
    data: {
    id:id,
    _token: _token
    },
    dataType: "json",
    success: function(res) { 
        console.log(res);
     if(res.status === true)
         {
            toastr.success(res.info);
            window.location.reload();
         }else
         {
           toastr.error(res.info);
         }

    }
    });

});

</script>

@endsection