@extends('layouts.master')

@section('content')
<!-- DataTables -->
<link rel="stylesheet" href="{{ asset('/assets/') }}/css/dataTables.bootstrap.min.css">
<script src="{{ asset('/assets/') }}/js/jquery.dataTables.min.js"></script>
<script src="{{ asset('/assets/') }}/js/dataTables.bootstrap.min.js"></script>
<div class="panel panel-default">
    <!-- Default panel contents -->
    <div class="panel-heading">{{ $title }}</div>
    <div class="panel-body">
        @if(\Auth::user()->utype==1)
            <a href="{{ url('invoice/new') }}" class="btn btn-sm btn-info pull-right"><i class="fa fa-plus"></i> New Invoice</a> <br><br>
        @endif

        <div class="clearfix"></div>
        <table class="table table-bordered table-striped" id="example">
            <thead>
                <tr>
                    <th>Invoice Code</th>
                                        @if(\Auth::user()->utype!=3)
                    <th>Vendor</th>
                                        @endif
                    <th>Service</th>
                    <th>Date</th>
                    <th>Due Date</th>
                    <th>Amount</th>
                    <th>Status</th>
                    <th>Attachment</th>
                    <th>Action</th>
                </tr>
            </thead>
            <tbody>
            @if($invoices)
            @foreach($invoices as $row)
                <tr>
                    <td>{{ $row->invoice_code }}</td>
                                        @if(\Auth::user()->utype!=3)
                    <td>{{ $row->company?$row->company->name:'' }}</td>
                                        @endif
                    <td>
                        @if($row->items)
                        @foreach($row->items as $itm)
                        {{ $itm->service?$itm->service->name:'' }} <br>
                        @endforeach
                        @endif
                    </td>
                    <td>{{ date('d M, Y',strtotime($row->invoice_date)) }}</td>
                    <td>{{ date('d M, Y',strtotime($row->due_date)) }}</td>
                    <?php 

                    $total=$row->items?$row->items->sum('payable_amount'):0;;
                    $total1=$row->items?$row->items->sum('payable_amount'):0;
                    $total2=$row->items?$row->items->sum('payable_amount'):0;

                    $total_vat=($total1*$row->vat)/100;
                    $total_tax=($total2*$row->tax)/100;

                    $payable=$total+$total_vat+$total_tax;;
                    $paid=$row->items?$row->items->sum('paid_amount'):0;
                    $due=$payable-$paid;

                    ?>
                    <td>{{ $payable }}</td>
                    <td>
                        @if($row->status==0)
                        <span class='label label-danger'>Due</span>
                        @elseif($row->status==1)
                        <span class='label label-success'>Paid</span>
                        @endif
                    </td>
                    <td>
                        @if(!empty($row->attachment))
                        <a href="assets/invoice/{{ $row->attachment }}" title='Download attachment' target="_blank" class='btn btn-block btn-default btn-xs'><i class="fa fa-cloud-download"></i> Download</a>
                        @else
                        No Attachment
                        @endif
                    </td>
                    <td>
                        <a href="{{ url('invoice/show/') }}/{{ $row->id }}" data-toggle='modal' data-target='#modalPreview' class='btn btn-default btn-sm'><i class="fa fa-eye"></i></a>
                        {{-- $itm->service?$itm->service->account_id:0 ; --}}
                        <?php 
                            $service_account_id= 0 ;
                            $client_id=$row->client?$row->client->id:0;
                        ?>
                        @if(\Auth::user()->utype==1)
                        <a href="" class='btn btn-default btn-sm'><i class="fa fa-edit"></i></a>
                        <a href="" class='btn btn-default btn-sm'><i class="fa fa-trash-o"></i></a>
                        <a title='Update Payment' href="" data-client="{{ $client_id }}" data-acc_id="{{ $service_account_id }}" data-id='{{ $row->id }}' data-amount='{{ $payable }}' class='btn btn-default btn-sm btn_payment'><i class="fa fa-money"></i></a>
                        @endif
                    
                    </td>
                </tr>
            @endforeach
            @endif
            </tbody>
        </table>
    </div>

</div>


<div class="modal fade" id="modalPreview">
    <div class="modal-dialog" style='width: 70%;'>
    
    </div>
</div>

<div class="modal fade" id="modalPayment">
    <div class="modal-dialog modal-xs">
        <div class="modal-content">
        <form action="{{ url('invoice/pay') }}" method="POST" role="form">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title">Payment</h4>
            </div>
            <div class="modal-body">
                {{ csrf_field() }}
                <input type="hidden" name="id">
                <input type="hidden" name="amount">
                <input type="hidden" name="acc_id">
                <input type="hidden" name="client">
                
                
                    <div class="form-group">
                        <label for="mode_of_payment">Mode Of Payment</label>
                        <select name="mode_of_payment" id="mode_of_payment" class="form-control">
                            <option value="">Select Mode Of Payment</option>
                            @if($account_types)
                                @foreach($account_types as $type)
                                <option value="{{ $type->id }}">{{ $type->name }}</option>
                                @endforeach
                            @endif
                        </select>
                    </div>

                    <div class="form-group">
                        <label for="description">Description</label>
                        <textarea class="form-control" name="description" id="description" placeholder="Description"></textarea>
                    </div>
                
            </div>
            <div class="modal-footer">
                <button type="submit" class="btn btn-primary">Confirm Payment</button>
                <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
            </div>
        </form>
        </div>
    </div>
</div>

@stop

@section('style')
<style>
    .modal-dialog {
      width: 70% !important;
      height: 70% !important;
    }

    .modal-content {
      height: auto;
      min-height: 70% !important;
      border-radius: 0;
    }
</style>
@stop

@section('script')
<script type="text/javascript">
$(document).ready(function() {
    $('body').on('hidden.bs.modal', '.modal', function () {
      $(this).removeData('bs.modal');
    });
    var table=$("#example").DataTable({
         "searching": true,
         "lengthChange": true,
         "ordering": false,
         stateSave: true       
    }); 
    $('.btn_payment').click(function(e){

        e.preventDefault();
        var conf=confirm('Are you sure to pay ??');

        if(conf)
        {
            /*var id=$(this).data('id');
            var amount=$(this).data('amount');
            var token='{{ csrf_token() }}';

            $.ajax({
                url: '{{ url('invoice/pay') }}',
                type: 'POST',
                data: {id: id,amount:amount,_token:token}
            })
            .done(function(res) {
                
                location.href="{{ url('invoice') }}";

            });*/
            var id=$(this).data('id');
            var amount=$(this).data('amount');
            var acc_id=$(this).data('acc_id');
            var client=$(this).data('client');

            $('#modalPayment').find('input[name="id"]').val(id);
            $('#modalPayment').find('input[name="amount"]').val(amount);
            $('#modalPayment').find('input[name="acc_id"]').val(acc_id);
            $('#modalPayment').find('input[name="client"]').val(client);
            $('#modalPayment').modal('show');
            
        }

    });

});
</script>
@stop