@php
use Carbon\Carbon;
@endphp

<div class="row">
    <div class="col-lg-12">
        <div class="table-responsive">
            <table id="inactiveEligibleTable" class="table table-striped table-bordered" border="1pt solid ash" style="color:black; border-collapse: collapse;">
                <thead>
                    <tr>
                        <th width="7%">SL#</th>   
                        <th width="170px;">Member Name</th>
                        <th width="85px">Member Code</th> 
                        <th width="85px">Last Transaction Date</th>
                        <th width="85px">RS Balance</th>                           
                        <th width="85px">Action</th>                        
                    </tr>
                </thead>
                <tbody>
                    @php
                    $sl = 0;
                    @endphp
                    @foreach($eligibles as $eligible)
                    @php
                    $sl++;
                    @endphp
                    <tr>
                        <td>{{$sl}}</td>
                        <td style="text-align: left; padding-left: 20px">{{ $eligible->name }}</td>
                        <td style="text-align: center;">{{ $eligible->code }}</td>                        
                        <td style="text-align: center;">{{ $eligible->lastTransactionDate }}</td>
                        <td style="text-align: right; padding-right: 20px">{{ number_format($eligible->rsBalance,2) }}</td>

                        @if($eligible->isPaid == 0)
                            <td>                            
                                <a href="javascript:;" class="delete" data-id="{{ $eligible->memberId }}">
                                    @if($eligible->status == 1)
                                        <span class="badge badge-danger" style="cursor: pointer">Terminate</span>
                                    @else
                                        <span class="badge badge-secondary">Terminated</span>
                                    @endif                                
                                </a>
                                @if($eligible->status == 0)
                                    <a href="javascript:;" class="revert" data-id="{{ $eligible->memberId }}">
                                        <span class="badge badge-warning">Revert</span>                              
                                    </a>
                                @endif
                            </td>
                        @else
                            <td>
                                <span class="badge badge-secondary" style="cursor: not-allowed; pointer-events: none;">Savings Paid</span>
                            </td>
                        @endif

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

<style type="text/css">
    .fa-chevron-circle-right{
        font-size: 16px;
    }

</style>

<script type="text/javascript">
    $(document).ready(function(){
        
        $(".delete").click(function(event) {
            event.preventDefault()
            if ($(this).hasClass('disabled')) return
            $(this).addClass('disabled')

            var memberId = $(this).data('id')
            var date = $('#toDate').val()

            $.ajax({
                url: './memberInactiveTerminate',
                type: 'POST',
                dataType: 'json',
                data: {
                    memberId: memberId,
                    date: date
                },
            })
            .done(function(data) {
                if (data.responseTitle == 'Success!') {
                    toastr.success(data.responseText, data.responseTitle, opts)

                    $('.delete[data-id="' + data.doneMember + '"]').find('span').removeClass('badge-danger')
                    $('.delete[data-id="' + data.doneMember + '"]').find('span').addClass('badge-secondary')

                    setTimeout(() => $('#search').click(), 500)
                } else if (data.responseTitle == 'Warning!') {
                    toastr.warning(data.responseText, data.responseTitle, opts)
                }
            })
            .fail(function() {
                alert("error")
            }); // ajax end
                
        }); // terminate event end

        $(".revert").click(function(event) {
            event.preventDefault()
            if ($(this).hasClass('disabled')) return
            $(this).addClass('disabled')

            var memberId = $(this).data('id')
            var date = $('#toDate').val()

            $.ajax({
                url: './memberInactiveRevert',
                type: 'POST',
                dataType: 'json',
                data: {
                    memberId: memberId,
                    date: date
                },
            })
            .done(function(data) {
                if (data.responseTitle == 'Success!') {
                    toastr.success(data.responseText, data.responseTitle, opts)
                    
                    setTimeout(() => $('#search').click(), 500)
                } else if (data.responseTitle == 'Warning!') {
                    toastr.warning(data.responseText, data.responseTitle, opts)
                }
            })
            .fail(function() {
                alert("error")
            }); // ajax end
                
        }); // revert eventend
        
    }) // ready function end
    $("#loadingModal").hide();
</script>