@extends('dashboard_layouts.app')
@section('content')
<div id="content-wrapper" class="d-flex flex-column">

    <!-- Main Content -->
    <div id="content">

        <!-- Topbar -->
        @include('dashboard_layouts.navbar')
        <!-- End of Topbar -->

        <!-- Begin Page Content -->
        <div class="container-fluid">

            <!-- DataTales  -->
                      <div class="card shadow mb-4">
    <div class="card-header py-3 d-flex justify-content-between align-items-center">
        <h6 class="m-0 font-weight-bold text-primary">Amazon Jury Duty App Active Order</h6>
        <form method="GET" action="{{ route('getJuryDutyActiveOrders') }}" class="form-inline">
            <div class="input-group">
                <input type="text" name="search" class="form-control" 
                       placeholder="Search by name or ID" 
                       value="{{ request('search') }}">
                <div class="input-group-append">
                    <button class="btn btn-primary" type="submit">
                        <i class="fas fa-search"></i>
                    </button>
                    @if(request('search'))
                    <a href="{{ route('getJuryDutyActiveOrders') }}" class="btn btn-outline-secondary ml-2">
                        Clear
                    </a>
                    @endif
                </div>
            </div>
        </form>
    </div>
                <div class="card-body">
                    <table class="table">
                        <thead>
                          <tr>
                            <th scope="col">ID</th>
                            <th scope="col">Name</th>
                            <th scope="col">Sauce</th>
                            <th scope="col">Text</th>
                            <th scope="col">Status</th>
                            <th scope="col">Update</th>
                            <th scope="col">PDF</th>
                            <th scope="col">PNG</th>
                          </tr>
                        </thead>
                        <tbody>
                            @foreach ($juryduty as $data)     
                            <tr>
                                <td scope="row">{{ $data->id }}</td>
                                <td scope="row">{{ $data->name }}</td>
                                <td scope="row">{{ $data->sauce }}</td>
                                <td scope="row">{{ $data->text }}</td>
                                <td>
                                    @if($data->status == 1)
                                    <span class="badge badge-success">Complete</span>
                                    @else
                                    <span class="badge badge-danger">Pending</span>
                                    @endif
                                </td>
                                <td>
                                    @if($data->status == 1)
                                        <a href="{{ route('updateJuryDutyOrderStatus',['juryduty'=>$data->id]) }}" style="pointer-events: none" class="text-muted">Mark as Complete</a>
                                    @else
                                        <a href="{{ route('updateJuryDutyOrderStatus',['juryduty'=>$data->id]) }}">Mark as Complete</a>
                                    @endif
                                </td>
                                 <td>
                                    <a href="{{ route('viewJuryDutyPDF',['juryduty'=>$data->id]) }}" target=”_blank”><i class="fa fa-eye"></i></a>
                                    <a href="{{ route('downloadJuryDutyPDF',['juryduty'=>$data->id]) }}"><i class="fa fa-download ml-2"></i></a>
                                </td>

                                <td>
                                    <a href="{{ route('viewJURYDUTYDesignImage',['juryduty'=>$data->id]) }}" target=”_blank”><i class="fa fa-eye"></i></a>
                                    <a href="{{ route('downloadJURYDUTYDesignImage',['juryduty'=>$data->id]) }}"><i class="fa fa-download ml-2"></i></a>
                                </td>
                            </tr>
                            @endforeach
                        </tbody>
                      </table>
                      <div class="float-right">
                          {{ $juryduty->links() }}
                      </div>
                </div>
            </div>
        </div> 
        <!-- /.container-fluid -->

    </div>
    <!-- End of Main Content -->

    <!-- Footer -->
    <footer class="sticky-footer bg-white">
        <div class="container my-auto">
            <div class="copyright text-center my-auto">
                <span>Copyright &copy; Your Amazon Jury Duty App 2026</span>
            </div>
        </div>
    </footer>
    <!-- End of Footer -->

    <script src="https://code.jquery.com/jquery-3.3.1.min.js">
    </script>
     
    <script type="text/javascript">
      $(document).ready(function () {
        setTimeout(function () {
            $.ajax({
               type:'GET',
               url:'/getJuryDutyActiveOrders',
               success:function(data) {
                location.reload(true);
               }
            });
          
        }, 100000);
      });
    </script>
</div>
@endsection