@extends('layouts.admin')

@section('content')
<!--App-Content-->
<div class="app-content my-3 my-md-5">
    <div class="side-app">
        <x-page.header>Registrations</x-page.header>

        <div class="row">
            <div class="col-md-12">
                <div class="card">
                    <div class="card-body">
                        <form action="{{ route('staff.examination.register.report.registrations') }}" method="get" aria-labelledby="createSession">
                            <fieldset>
                                <legend id="createSession" class="sr-only">Search courses</legend>
                                <div class="row">

                                    <div class="form-group col-6">
                                        <label for="period">Period</label>
                                        <select name="period" class="form-control select2-show-search" id="period" required>
                                            <option value="0" disabled selected>Select</option>
                                            @foreach ($periods as $item)
                                                <option value="{{ $item->id }}">
                                                    {{ $item->start_date . ' / ' . $item->end_date }}
                                                </option>
                                            @endforeach
                                        </select>
                                    </div>
                                    <div class="form-group col-6">
                                        <label for="educationSystem">Education System</label>
                                        <select name="educationSystem" class="form-control select2-show-search" id="educationSystem" required>
                                        </select>
                                    </div>
                                    <div class="form-group col-6">
                                        <label for="status">Status</label>
                                        <select name="status" class="form-control select2-show-search" id="status">
                                            <option value="0" disabled selected>Select Status*</option>
                                            <option value="paid">Paid</option>
                                            <option value="refunded">Refunded</option>
                                            <option value="unpaid">Un-paid</option>
                                        </select>
                                    </div>
                                    <div class="form-group col-6">
                                        <label for="board">Board</label>
                                        <select name="board" class="form-control select2-show-search" id="board">
                                        </select>
                                    </div>
                                </div>
                                <button type="submit" class="btn btn-primary mx-auto d-block">Search</button>
                            </fieldset>
                        </form>
                    </div>
                </div>
                @if (request()->period)
                <div class="card">
                    <div class="card-body">
                        @if (count($invoices) > 0)
                            <div class="d-flex">
                                <a href="{{ route('staff.examination.register.report.registrations.exportInvoices') }}?{{ http_build_query(request()->all()) }}"
                                    class="btn btn-outline-success mx-auto d-block w-25 my-5">Export Excel</a>
                            </div>
                        @endif

                        <div class="table-responsive">
                            <table class="table table-striped table-bordered table-vcenter text-nowrap" id="invoice_table">
                                <thead class="text-center">
                                    <tr>
                                        <th>#</th>
                                        <th>Student Name</th>
                                        <th>Course</th>
                                        <th>Exam Fee</th>
                                        <th>School Fee</th>
                                        <th>Total Fee</th>
                                        <th>Status</th>
                                    </tr>
                                </thead>
                                <tbody class="text-center">
                                    {{-- @php
                                        $totalFees = 0;
                                        $examFees = 0;
                                        $schoolFees = 0;
                                    @endphp --}}

                                    @foreach($invoices as $key => $invoice)
                                        {{-- @php
                                            $totalFees += $invoice->total_fee;
                                            $examFees += $invoice->exam_fee;
                                            $schoolFees += $invoice->school_fee;
                                        @endphp --}}
                                        <tr>
                                            <td>{{ ++$key }}</td>
                                            <td>{{ $invoice->first_name . ' ' .  $invoice->middle_name . ' ' . $invoice->last_name}}</td>
                                            <td>{{ $invoice->name }}_{{ $invoice->cname.' ('.$invoice->lshort_name .')'  }}</td>
                                            <td>{{ $invoice->exam_fee }} EGP</td>
                                            <td>{{ $invoice->school_fee }} EGP</td>
                                            <td>{{ $invoice->total_fee }} EGP</td>
                                            @if ($invoice->is_paid == 0)
                                                <td><span class="badge badge-primary">Un Paid</span></td>
                                            @elseif($invoice->is_paid == 1 && $invoice->invoices_is_deleted == 0)
                                                <td><span class="badge badge-success">Paid</span></td>
                                            @elseif($invoice->is_paid == 1 && $invoice->invoices_is_deleted == 1)
                                                <td><span class="badge badge-danger">Refund</span></td>
                                            @endif
                                            
                                        </tr>
                                    @endforeach
                                </tbody>
                                {{-- <tfoot class="">
                                    <tr class="text-center text-light bg-secondary">
                                        <td class="border-0"><b>Total</b></td>
                                        <td class="border-0"></td>
                                        <td class="border-0"><b class="ms-5">Exam fees: {{ $examFees }} EGP</b></td>
                                        <td class="border-0"><b class="ms-5">School fees: {{ $schoolFees }} EGP</b></td>
                                        <td class="border-0"><b class="ms-5">Total fees: {{ $totalFees }} EGP</b></td>
                                    </tr>
                                </tfoot> --}}
                            </table>
                            <!-- Pagination Links -->
                            <div dir="rtl">
                                <div class="mt-4">
                                    {{ $invoices->appends(Request::except('page'))->render('inc.paginate') }}
                                </div>
                                <p class="mt-3">
                                    Displaying {{$invoices->count()}} of {{ $invoices->total() }} transaction(s).
                                </p>
                            </div>
                        </div>
                    </div>
                </div>
                @endif
            </div>
        </div>
    </div>
</div>
@endsection

@section('admin-js')

<script>
    $(document).ready(function () {
        $('#period').on('change', function () {
            // get courses
            $('#educationSystem').empty();
            $('#educationSystem').append(`<option value="0" disabled selected>Processing...</option>`);
            $.ajax({
                url: "{{ route('getExaminationEducationSystemsFromPeriod') }}",
                type: 'GET',
                data: {
                    period: $(this).val()
                },
                success: function (data) {
                    $('#educationSystem').empty();
                    $('#educationSystem').append(`<option value="0" disabled selected>Select Education system*</option>`);
                    $.each(data, function (id, value) {
                        $('#educationSystem').append('<option value="' + value.esid + '">' + value.esname + '</option>');
                    });
                }
            });
        });

        $('#educationSystem').on('change', function() {
            console.log('d');
            var $board = $('#board');
            $('#board').empty();
            $('#board').append(`<option value="0" disabled selected>Processing...</option>`);
            $.ajax({
                url: "{{ route('educationSystemFilter') }}",
                type: 'GET',
                data: {
                    esid: $(this).val()
                },
                success: function(data) {
                    $('#board').empty();
                    $('#board').append(`<option value="0" disabled selected>Select Board*</option>`);
                    //  Board
                    $.each(data.board, function(id, value) {
                        $board.append('<option value="' + id + '">' + value +
                            '</option>');
                    });
                }
            });
        });

        $('#invoice_table').dataTable( {
            "drawCallback": function( settings ) {
            },
            "bPaginate": false,
            "searching": true,
            "ordering": true,
            "info": false,
        })
    })
</script>

@endsection