@extends('admin.layouts.app')
<link href="{{ asset('assets/css/style.css') }}" rel="stylesheet">
{{-- <link href="{{ asset('assets/css/responsive.css') }}" rel="stylesheet"> --}}

@section('content')
    <section class="section dashboard spr-pnl">
        <div class="row ">
            <div class="line-hdr ">
                <nav aria-label="breadcrumb approval">
                    <ol class="breadcrumb create-inr mb-0">
                        <li class="breadcrumb-item active" aria-current="page">Approval</li>
                        <li class="breadcrumb-item"><a href="#"> Verification</a></li>

                    </ol>
                </nav>
            </div>
            <div class="col-lg-12 mt-3">


                {{-- shankha --}}
                <div class="notification-sec">
                    <ul class="nav nav-tabs apprvl" id="myTab" role="tablist">
                        <li class="nav-item" role="presentation">
                            <button class="nav-link active mb-0 mt-0" id="nw-ntfctn-tab" data-bs-toggle="tab"
                                data-bs-target="#nw-not" type="button" role="tab" aria-controls="nw-not"
                                aria-selected="true">Pending
                                Request</button>
                        </li>

                        <li class="nav-item" role="presentation">
                            <button class="nav-link mb-0 mt-0" id="rej-ntfctn-tab" data-bs-toggle="tab"
                                data-bs-target="#rj-not" type="button" role="tab" aria-controls="profile"
                                aria-selected="false" tabindex="-1">Approved Request</button>
                        </li>

                    </ul>


                    <div class="tab-content" id="myTabContent">
                        <div class="tab-pane fade show active" id="nw-not" role="tabpanel"
                            aria-labelledby="nw-ntfctn-tab">
                            <div class="performance-statistics row district">
                                <div class="table-responsive">
                                    <table class="table table-borderless custom-data-table"
                                        id="pendingSchoolDatatable">
                                        <thead>
                                            <tr>
                                                <th scope="col">School Name</th>
                                                <th scope="col">District</th>
                                                <th scope="col">Reg Id</th>
                                                <th scope="col">Emp Name</th>
                                                <th scope="col">Emp Phone Number</th>
                                                <th scope="col">Transaction Cost</th>
                                                <th scope="col">Status</th>

                                            </tr>
                                        </thead>
                                        <tbody>
                                            <tr>
                                                @forelse ($pendingschools as $pendingSchool)
                                                    <td>{{ $pendingSchool->schoolEmployee?->school_name ?? 'N/A' }}
                                                    </td>
                                                    <td>{{ $pendingSchool->schoolEmployee?->districts->district_name ?? 'N/A' }}
                                                    </td>
                                                    <td>{{ $pendingSchool->schoolEmployee?->reg_no ?? 'N/A' }}</td>
                                                    <td>{{ $pendingSchool->first_name ?? 'N/A' }}
                                                        {{ $pendingSchool->last_name }}
                                                    </td>
                                                    <td>{{ $pendingSchool->mobile_number ?? 'N/A' }}</td>
                                                    <td><i class="fa-solid fa-dollar-sign"></i>&nbsp;
                                                        {{ number_format($pendingSchool->conferenceLodging?->lodging + $pendingSchool->conferenceMeal?->meal + $pendingSchool->conferenceMilage?->milage + $pendingSchool->conferenceMiscellaneous?->miscellaneous + $pendingSchool->conferenceParking?->parking + $pendingSchool->conferenceToll?->tolls, 2) }}
                                                    </td>
                                                    <td>Pending</td>
                                                @empty
                                                    <td colspan="7" class="text-center"> No Data Found
                                                    <td>
                                                @endforelse
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>


                        <div class="tab-pane fade" id="rj-not" role="tabpanel" aria-labelledby="rej-ntfctn-tab">
                            <div class="performance-statistics row district">
                                <div class="table-responsive">
                                    <table class="table table-borderless custom-data-table"
                                        id="approvedSchoolDatatable">
                                        <thead>
                                            <tr>
                                                <th scope="col">School Name</th>
                                                <th scope="col">District</th>
                                                <th scope="col">Reg Id</th>
                                                <th scope="col">Emp Name</th>
                                                <th scope="col">Emp Phone Number</th>
                                                <th scope="col">Transaction Cost</th>
                                                <th scope="col">Status</th>

                                            </tr>
                                        </thead>
                                        <tbody>
                                            <tr>
                                                @forelse ($approvedSchools as $approvedSchool)
                                                    <td>{{ $approvedSchool->schoolEmployee?->school_name ?? 'N/A' }}
                                                    </td>
                                                    <td>{{ $approvedSchool->schoolEmployee?->districts->district_name ?? 'N/A' }}
                                                    </td>
                                                    <td>{{ $approvedSchool->schoolEmployee?->reg_no ?? 'N/A' }}</td>
                                                    <td>{{ $approvedSchool->full_name ?? 'N/A' }}</td>
                                                    <td>{{ $approvedSchool->mobile_number ?? 'N/A' }}</td>
                                                    <td><i class="fa-solid fa-dollar-sign"></i>&nbsp;
                                                        {{ number_format($approvedSchool->conferenceLodging?->lodging + $approvedSchool->conferenceMeal?->meal + $approvedSchool->conferenceMilage?->milage + $approvedSchool->conferenceMiscellaneous?->miscellaneous + $approvedSchool->conferenceParking?->parking + $approvedSchool->conferenceToll?->tolls, 2) }}
                                                    </td>
                                                    <td>Approved</td>
                                                @empty
                                                    <td colspan="7" class="text-center"> No Data Found
                                                    <td>
                                                @endforelse
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

        </div>


        <div class="row">
            <div class="col-lg-12 mt-3 mb-5">
                <nav aria-label="Page navigation example">
                    <ul class="pagination">
                        <li class="page-item">
                            <a class="page-link" href="#" aria-label="Previous">
                                <span aria-hidden="true">&lsaquo;</span>
                            </a>
                        </li>
                        <li class="page-item"><a class="page-link" href="#">1</a></li>
                        <li class="page-item"><a class="page-link" href="#">2</a></li>
                        <li class="page-item"><a class="page-link" href="#">3</a></li>
                        <li class="page-item">
                            <a class="page-link" href="#" aria-label="Next">
                                <span aria-hidden="true">&rsaquo;</span>
                            </a>
                        </li>
                    </ul>
                </nav>
            </div>
        </div>
    </section>
@endsection
@push('scripts')
    <script>
        $(document).ready(function() {
            loadData();
        })
        const loadData = () => {
            //   $('#bannerTable').DataTable().destroy();
            var dataTable = $('#pendingSchoolDatatable').DataTable({
                dom: 'Bfrtip',
                processing: true,
                serverSide: false,
                autoWidth: false,
                responsive: true,
                searching: true,
                buttons: [{
                        extend: 'pdf',
                        footer: true,
                        exportOptions: {
                            columns: "thead th:not(.noExport)"
                        }
                    },
                    {
                        extend: 'csv',
                        footer: true,
                        exportOptions: {
                            columns: "thead th:not(.noExport)"
                        }

                    },
                    {
                        extend: 'excel',
                        footer: true,
                        exportOptions: {
                            columns: "thead th:not(.noExport)"
                        }
                    }
                ]


            });
        }
        $(document).ready(function() {
            loadData2();
        })
        const loadData2 = () => {
            //   $('#bannerTable').DataTable().destroy();
            var dataTable = $('#approvedSchoolDatatable').DataTable({
                dom: 'Bfrtip',
                processing: true,
                serverSide: false,
                autoWidth: false,
                responsive: true,
                searching: true,
                buttons: [{
                        extend: 'pdf',
                        footer: true,
                        exportOptions: {
                            columns: "thead th:not(.noExport)"
                        }
                    },
                    {
                        extend: 'csv',
                        footer: true,
                        exportOptions: {
                            columns: "thead th:not(.noExport)"
                        }

                    },
                    {
                        extend: 'excel',
                        footer: true,
                        exportOptions: {
                            columns: "thead th:not(.noExport)"
                        }
                    }
                ]


            });
        }
        // $(document).ready(function() {
        //     $("#addbranch-btn").click(function() {
        //         $("#slide-from-right").addClass("show-side-form");
        //     });

        //     $("#close-btn").click(function() {
        //         $("#slide-from-right").removeClass("show-side-form");
        //     });
        // });

        // $(document).on("click", ".modalClose2", function() {
        //     $('#myModal3').modal('hide');
        // });

        // $(document).on("click", ".modalClose3", function() {
        //     $('#myModal4').modal('hide');
        // });
    </script>
@endpush