@extends('layouts.template')


@section('content')
    <div class="container">
        <div class="welcome-msg">
            <p>Acting Requests</p>
        </div>

        <div class="container pt-3 d-block d-sm-none">

            <div class="mobile-menu-icon">
                <button class="menu-icon" type="" data-bs-toggle="offcanvas" data-bs-target="#offcanvasWithBothOptions"
                    aria-controls="offcanvasWithBothOptions">
                    <i class="fa-solid fa-bars fa-2x" data-toggle="tooltip" title="Menu"></i>
                </button>
            </div>

            <div class="offcanvas offcanvas-start" data-bs-scroll="true" tabindex="-1" id="offcanvasWithBothOptions"
                aria-labelledby="offcanvasWithBothOptionsLabel">
                <div class="offcanvas-header">
                    <h5 class="offcanvas-title" id="offcanvasWithBothOptionsLabel">Mobile Menu</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="offcanvas" aria-label="Close"></button>
                </div>
                <div class="offcanvas-body">
                    <ul class="navtabs pt-3">
                        <li class="mb-5"><a href="home"><span><i style="padding: 2px 10px 0 0"
                                        class="fa-regular fa-user"></i></span>User Profile</a>
                        </li>
                        <li class="mb-5"><a href="leave_details"><span><i
                                        style="padding: 2px 10px 0 0"class="fa-solid fa-calendar-days"></i></span>My leave
                                details</a> </li>

                        <li class="mb-5"><a href="apply_leave"><i style="padding: 2px 10px 0 0"
                                    class="fa-solid fa-gear"></i>Leave Application</a></li>

                        <li class="mb-5"><a href="acting_req"><span><i style="padding: 2px 10px 0 0"
                                        class="fa-solid fa-person-military-to-person"></i></span>Acting Requests <sup><span
                                        class="badge bg-danger">

                                        1</span></sup> </a></li>

                        <li class="mb-5"><a href="my_attendence"><i style="padding: 2px 10px 0 0"
                                    class="fa-solid fa-plane"></i>My Attendance</a></li>

                        <li class="mb-5"><a href="apply_warrant"><i style="padding: 2px 10px 0 0"
                                    class="fa-solid fa-train"></i>Warrant Application</a></li>
                    </ul>
                </div>
            </div>

        </div>





        <div class="row pt-4 border-1">

            <div class="profile">

            </div>



            <div class="col-md-3">

                <div class="navigation-tabs d-none d-sm-block d-md-none d-lg-block">

                    <ul class="navtabs pt-3">
                        <li class="mb-5"><a href="home"><span><i style="padding: 2px 10px 0 0"
                                        class="fa-regular fa-user"></i></span>User Profile</a>
                        </li>
                        <li class="mb-5"><a href="leave_details"><span><i
                                        style="padding: 2px 10px 0 0"class="fa-solid fa-calendar-days"></i></span>My leave
                                details</a> </li>
                        <li class="mb-5"><a href="apply_leave"><i style="padding: 2px 10px 0 0"
                                    class="fa-solid fa-gear"></i>Leave Application</a></li>

                        <li class="mb-5"><a href="acting_req"><span><i style="padding: 2px 10px 0 0"
                                        class="fa-solid fa-person-military-to-person"></i></span>Acting Requests <sup><span
                                        class="badge bg-danger">



                                       
                                        {{ $count }}
                                       
                                      
                                        
                                    </span></sup> </a></li>


                        <li class="mb-5"><a href="my_attendence"><i style="padding: 2px 10px 0 0"
                                    class="fa-solid fa-plane"></i>My Attendance</a></li>


                        <li class="mb-5"><a href="apply_warrant"><i style="padding: 2px 10px 0 0"
                                    class="fa-solid fa-train"></i>Warrant Application</a></li>
                    </ul>


                </div>


            </div>

            <div class="col-md-9">
                <div class="container pt-3">
                    <div class="refresh mb-2 d-flex">
                        <a href="acting_req"><i class="fa-solid fa-rotate" data-toggle="tooltip" title="Refresh"></i></a>
                    </div>
                    <table class="table table-bordered text-center" id="table2">
                        <thead class="table-light">
                            <th>Requested By</th>
                            <th>Type</th>
                            <th>From</th>
                            <th>To</th>
                            <th>Status</th>
                            <th>Remark</th>
                        </thead>

                        @foreach ($data as $item)
                            <tbody>
                                @if ($item->acting_status === 'pending')
                                    @if ($item->acting_officer === Auth::user()->id)
                                        <td>{{ $item->user_name }}</td>
                                        <td>{{ $item->type }}</td>
                                        <td>{{ $item->leave_from }}</td>
                                        <td>{{ $item->leave_to }}</td>

                                        @if ($item->acting_status === 'pending')
                                            <td><span class="badge bg-warning" style="font-weight: 300">Pending </span></td>
                                        @elseif ($item->acting_status === 'approved')
                                            <td><span class="badge bg-success" style="font-weight: 300">Approved </span>
                                            </td>
                                        @else
                                            <td><span class="badge bg-danger" style="font-weight: 300">Rejected </span></td>
                                        @endif

                                        @if ($item->acting_status === 'pending')
                                            <td class="text-center">
                                                <div class="row">

                                                    <div class="col-6">
                                                        <a href="{{ url('acting_accept/' . $item->id) }}"><i
                                                                class="fa-solid fa-circle-check fa-2x"
                                                                style="color:green;"></i></a>
                                                    </div>

                                                    <div class="col-6">
                                                        <a href="{{ url('acting_reject/' . $item->id) }}"><i
                                                                class="fa-solid fa-xmark fa-2x"
                                                                style="color:red;"></i></a>
                                                    </div>

                                                </div>
                                            </td>
                                        @else
                                            <td></td>
                                        @endif
                                    @endif
                                @endif
                        @endforeach


                        </tbody>


                    </table>











                </div>


            </div>



        </div>
    @endsection