@extends('staff.layouts.app')
@push('style')
@endpush
@section('content')
    <section class="section dashboard">
        <div class="inner-sec-dashboard">
            <div class="row ">
                <div class="line-hdr">
                    <h4>Request</h4>
                </div>
            </div>
            <div class="pagetitle-row">
                <div class="row">
                    <div class="col-lg-10 ">
                        <form form action="" method="GET">
                            <div class="row">
                                <div class="col-lg-3 col-sm-4 col-12">
                                    <input type="date" class="form-control" id="startDate" name="startDate"
                                        value="{{ !empty($_REQUEST['startDate']) ? $_REQUEST['startDate'] : '' }}">
                                </div>

                                <div class="col-lg-3 col-sm-4 col-12">
                                    <input type="date" class="form-control" id="endDate" name="endDate"
                                        value="{{ !empty($_REQUEST['endDate']) ? $_REQUEST['endDate'] : '' }}">
                                </div>

                                <div class="col-lg-3 col-sm-4 col-12">
                                    <select class="form-select" aria-label="Default select example" id="status"
                                        name="status">
                                        <option selected="">Status</option>
                                        <option value="1">Approved</option>
                                        <option value="2">Rejected</option>
                                        <option value="3">Pending</option>
                                    </select>
                                </div>
                                <div class="col-lg-2 col-sm-4 col-12">
                                    <button type="submit"><i class="fa-solid fa-magnifying-glass"></i> Search</button>
                                </div>

                                <div class="col-lg-1 col-sm-2 col-12">
                                    <a href="{{ route('staff.conference.list') }}" class="btn btn-warning"> Reset</a>
                                </div>
                            </div>
                        </form>
                    </div>
                    <div class="col-lg-2"></div>
                </div>
            </div>
            <div class="row">
                <div class="col-lg-12 col-sm-12 col-12">
                    <div class="performance-statistics row">
                        <table class="table table-borderless" id="conferenceDatatable">
                            <thead>
                                <tr>
                                    <th scope="col">Request ID</th>
                                    <th scope="col">Conference Name</th>
                                    <th scope="col">Conference Date</th>
                                    <th scope="col">Total Cost</th>
                                    <th scope="col">Status</th>
                                    <th scope="col">Action</th>
                                </tr>
                            </thead>
                            <tbody>

                                @forelse ($conferenceLists as $conferenceList)
                                    <tr>
                                        <td>{{ '#' . substr(md5(microtime()), 0, 8) }}</td>
                                        <td>{{ $conferenceList->conference_title }}</td>

                                        <td>{{ date('d-m-Y', strtotime($conferenceList->conference_date)) }}</td>
                                        <td><i class="fa-solid fa-dollar-sign"></i>&nbsp;
                                            {{ number_format($conferenceList->registratiion_no + $conferenceList->lodging?->sum('lodging') + $conferenceList->meals?->sum('meal') + $conferenceList->milages?->sum('milage') + $conferenceList->miscellaneous?->sum('miscellaneous') + $conferenceList->parking?->sum('parking') + $conferenceList->toll?->sum('tolls'), 2) }}
                                        </td>
                                        <td>
                                            @if ($conferenceList->is_approved == 1)
                                                {{ 'Approved' }}
                                            @elseif($conferenceList->is_approved == 2)
                                                {{ 'Rejected' }}
                                            @else
                                                {{ 'Pending' }}
                                            @endif
                                        </td>

                                        <td><a class="icon show"
                                                href="{{ route('staff.conference.detail', ['id' => $conferenceList->id]) }}"
                                                aria-expanded="true"><i class="fa-solid fa-eye"></i></a>
                                            @if ($conferenceList->is_all_approved == 0)
                                                <a class=""
                                                    href="{{ route('staff.conference.edit', ['id' => $conferenceList->id]) }}"><i
                                                        class="fa fa-pencil"></i></a>
                                            @endif
                                        </td>

                                    @empty
                                    <tr>
                                        <td colspan="6">No conferences found.</td>
                                    </tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </section>
@endsection
@push('scripts')
    <script src="{{ asset('assets/admin/tinymce/tinymce.min.js') }}"></script>
    <script src="{{ asset('assets/admin/js/editor.js') }}"></script>
    <script src="{{ asset('assets/plugins/bootstrap-tagsinput.js') }}"></script>
    <script></script>
    <script>
        $(document).ready(function() {
            loadData();
        })
        const loadData = () => {
            //   $('#bannerTable').DataTable().destroy();
            var dataTable = $('#conferenceDatatable').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)"
                        }
                    }
                ]


            });
        }
    </script>
    {{-- <script>
        let lodgingCloneCounter = 0;
        $(document).on('click', '#lodgingAddBtn', function() {
            console.log("lodgingCloneCounter");
            if (lodgingCloneCounter < 2) {
                var clone = $('#lodging').clone();
                clone.find('.lodgingAddBtn').remove();
                clone.find('input[type="text"], input[type="date"], input[type="file"]').val('');
                clone.append(
                    '<div class="custom-file-button"><button class="remove-btn" id="lodgingRemoveBtn" type="button">-</button></div>'
                );
                $('#lodging').after(clone);
                lodgingCloneCounter++;
            }
        });
        $(document).on('click', '#lodgingRemoveBtn', function() {
            $(this).closest('.row').remove();
            lodgingCloneCounter--;
        });

        let mealCloneCounter = 0;
        $(document).on('click', '#mealAddBtn2', function() {
            if (mealCloneCounter < 2) {
                var clone = $('#meal').clone();
                clone.find('.mealAddBtn').remove();
                clone.find('input[type="text"], input[type="date"], input[type="file"]').val('');
                clone.append(
                    ' <div class="custom-file-button"><button class="remove-btn" id="mealRemoveBtn" type="button">-</button> </div>'
                );
                $('#meal').after(clone);
                mealCloneCounter++;
            }
        });
        $(document).on('click', '#mealRemoveBtn', function() {
            $(this).closest('.row').remove();
            mealCloneCounter--;
        });
        let parkingCloneCounter = 0;
        $(document).on('click', '#parkingAddBtn', function() {
            console.log(parkingCloneCounter);
            if (parkingCloneCounter < 2) {
                var clone = $('#parking').clone();
                clone.find('.parkingAddBtn').remove();
                clone.find('input[type="text"], input[type="date"], input[type="file"]').val('');
                clone.append(
                    '<div class="custom-file-button"><button class="remove-btn" id="parkingRemoveBtn" type="button">-</button></div>'
                );
                $('#parking').after(clone);
                parkingCloneCounter++;
            }
            // else {
            //     alert('Maximum 5 elements allowed.');
            // }
        });
        $(document).on('click', '#parkingRemoveBtn', function() {
            $(this).closest('.row').remove();
            parkingCloneCounter--;
        });

        let tollCloneCounter = 0;
        $(document).on('click', '#tollAddBtn', function() {
            console.log("tollCloneCounter");
            if (tollCloneCounter < 2) {
                var clone = $('#toll').clone();
                clone.find('.tollAddBtn').remove();
                clone.find('input[type="text"], input[type="date"], input[type="file"]').val('');
                clone.append(
                    '<div class="custom-file-button"><button class="remove-btn" id="tollRemoveBtn" type="button">-</button></div>'
                );
                $('#toll').after(clone);
                tollCloneCounter++;
            }
        });
        $(document).on('click', '#tollRemoveBtn', function() {
            $(this).closest('.row').remove();
            tollCloneCounter--;
        });
        let milleageCloneCounter = 0;
        $(document).on('click', '#milleageAddBtn', function() {
            console.log("milleageCloneCounter");
            if (milleageCloneCounter < 2) {
                var clone = $('#milleage').clone();
                clone.find('.milleageAddBtn').remove();
                clone.find('input[type="text"], input[type="date"], input[type="file"]').val('');
                clone.append(
                    '<div class="custom-file-button"><button class="remove-btn" id="milleageRemoveBtn" type="button">-</button></div>'
                );
                $('#milleage').after(clone);
                milleageCloneCounter++;
            }
        });
        $(document).on('click', '#milleageRemoveBtn', function() {
            $(this).closest('.row').remove();
            milleageCloneCounter--;
        });


        let miscellaneousCloneCounter = 0;
        $(document).on('click', '#miscellaneousAddBtn', function() {
            console.log("miscellaneousCloneCounter");
            if (miscellaneousCloneCounter < 2) {
                var clone = $('#miscellaneous').clone();
                clone.find('.tollAddBtn').remove();
                clone.find('input[type="text"], input[type="date"], input[type="file"]').val('');
                clone.append(
                    '<div class="custom-file-button"><button class="remove-btn" id="miscellaneousRemoveBtn" type="button">-</button></div>'
                );
                $('#miscellaneous').after(clone);
                miscellaneousCloneCounter++;
            }
        });
        $(document).on('click', '#miscellaneousRemoveBtn', function() {
            $(this).closest('.row').remove();
            miscellaneousCloneCounter--;
        });
    </script> --}}
    <script></script>
    {{-- <script>
        var meta_keyword_values = "";
        $('#meta_keyword').tagsinput({
            confirmKeys: [13, 32, 44]
        });
        $('#meta_keyword').tagsinput('add', meta_keyword_values);
    </script> --}}
@endpush