@extends('layouts.side_bar')

@section('content')


    <style>
        th { position: sticky; top: 0; background:#FFFFE0;}

    </style>

    <a href="{{route('downloadPayment')}}" class="btn btn-lg btn-success text-white fa fa-download m-1">
        Download Excel
    </a>


    <h5 class="card shadow text-center text-white bg-warning">
        Payment Details
    </h5>




    <div class="justify-content-lg-center" >

        <div class="card shadow-lg overflow-auto " style="max-height: 800px;">

            <input class="form-control" id="myInput1" type="text" placeholder="Search..">

            <table class="table table-striped text-nowrap  ">
                <thead style="">
                <tr >
                    <th>SL</th>
                    <th>Account Number</th>
                    <th>Paid By</th>
                    <th> Paid Date </th>
                    <th>Paid Amount</th>
                    <th>Payment Type</th>
                    <th>created_at</th>


{{--                    <th>ACTION</th>--}}

                </tr>
                </thead><tbody id="myTable1">
                @foreach($ac as $row)

                        <tr class="w3-hover-green">
                            <td>{{ $row->id}}</td>
                            <td>{{ $row->accountNumber}}</td>
                            <td>{{ $row->paidBy }}</td>
                            <td>{{ $row->paidDate}}</td>
                            <td>RM {{ $row->paidAmount}}</td>
                            <td>{{ $row->paymentType}}</td>
                            <td>{{ $row->created_at}}</td>

{{--                            <td>--}}
{{--                                <a href="{{ URL::to('client/deactivate/'.$row->id) }}" class="btn btn-sm btn-danger">Deactivate</a>--}}

{{--                                <a href="{{ URL::to('client/edit/'.$row->id) }}" class="btn btn-sm btn-warning text-white">Edit</a>--}}

{{--                            </td>--}}
                        </tr>

                @endforeach
                </tbody>
            </table>
        </div>
    </div>





    <script>
        $(document).ready(function(){
            $("#myInput1").on("keyup", function() {
                var value = $(this).val().toLowerCase();
                $("#myTable1 tr").filter(function() {
                    $(this).toggle($(this).text().toLowerCase().indexOf(value) > -1)
                });
            });
        });
    </script>

@endsection