@extends('admin.layouts.master')


@section('admin_content')
<meta name="csrf-token" content="{{ csrf_token() }}">


   <link href="https://cdn.datatables.net/1.10.19/css/dataTables.bootstrap4.min.css" rel="stylesheet">
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js"></script>
   <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.0/jquery.validate.js"></script>
   <script src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
   <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"></script>
   <script src="https://cdn.datatables.net/1.10.19/js/dataTables.bootstrap4.min.js"></script>



   <div class="bd-example">
            <div class="row  row-cols-1 row-cols-md-1 g-4">

                <div class="col">
                    <div class="card">
                        @if(Session::has('token_rate_updated'))
                      <div class="alert alert-success d-flex align-items-center" role="alert">
           <svg class="bi flex-shrink-0 me-2" width="24" height="24">
               <use xlink:href="#check-circle-fill" />
           </svg>
           <div>
               {{Session::get('token_rate_updated')}}
           </div>
       </div>
       @elseif(Session::has('ambassador_updated'))
       <div class="alert alert-success d-flex align-items-center" role="alert">
        <svg class="bi flex-shrink-0 me-2" width="24" height="24">
        <use xlink:href="#check-circle-fill" />
        </svg>
        <div>
        {{Session::get('ambassador_updated')}}
        </div>
        </div>
        @elseif(Session::has('transfer_updated'))
        <div class="alert alert-success d-flex align-items-center" role="alert">
         <svg class="bi flex-shrink-0 me-2" width="24" height="24">
         <use xlink:href="#check-circle-fill" />
         </svg>
         <div>
         {{Session::get('transfer_updated')}}
         </div>
         </div>
         @elseif(Session::has('withdraw_updated'))
         <div class="alert alert-success d-flex align-items-center" role="alert">
          <svg class="bi flex-shrink-0 me-2" width="24" height="24">
          <use xlink:href="#check-circle-fill" />
          </svg>
          <div>
          {{Session::get('withdraw_updated')}}
          </div>
          </div>


       @endif

                    <div class="card-body">
                        <h2 class="card-title">Junior Submitted Task Lists </h2>




                          <hr>
                        <div class="bd-example">
          <ul class="nav nav-pills" data-toggle="slider-tab" id="myTab" role="tablist">
              <li class="nav-item" role="presentation">
                  <button class="nav-link active" id="logo-tab" data-bs-toggle="tab" data-bs-target="#pills-logo1" type="button" role="tab" aria-controls="logo" aria-selected="true">Approved Task</button>
              </li>
              <li class="nav-item" role="presentation">
                  <button class="nav-link" id="icon-tab" data-bs-toggle="tab" data-bs-target="#pills-icon1" type="button" role="tab" aria-controls="icon" aria-selected="false">Rejected Task</button>
              </li>
   

          </ul>
          <div class="tab-content" id="pills-tabContent">
              <div class="tab-pane fade show active" id="pills-logo1" role="tabpanel"
                  aria-labelledby="pills-logo-tab1">
                  <p>
                  <hr>
                  <div class="bd-example table-responsive">
                         <table  class="table table-bordered table-border yajra-datatables1">
                             <thead>
                                 <tr>
                                     <th scope="col">#</th>
                                     <th scope="col">DATE</th>
                                     <th scope="col">USERNAME</th>
                                     
                                        <th scope="col"width="80px" > SUBMITTED URL</th>
                                           <th scope="col" width="80px">TASK TITLE</th>
                                        <!--    <th scope="col">DESCRIPTION</th>-->

                                     <th scope="col">Status</th>

                                 </tr>
                             </thead>


                            




                             </tbody>
                         </table>
                     </div>

                  </p>

              </div>
              <div class="tab-pane fade" id="pills-icon1" role="tabpanel"
                  aria-labelledby="pills-icon-tab1">
                  <p>


                              <hr>
                              <div class="bd-example table-responsive">
                                     <table  class="table table-bordered table-border yajra-datatables2">
                                         <thead>
                                 <tr>
                                     <th scope="col">#</th>
                                     <th scope="col">DATE</th>
                                     <th scope="col">USERNAME</th>
                                     
                                        <th scope="col"width="80px" > SUBMITTED URL</th>
                                           <th scope="col" width="80px">TASK TITLE</th>
                                        <!--    <th scope="col">DESCRIPTION</th>-->

                                     <th scope="col">Status</th>

                                 </tr>
                             </thead>

                                        



                                         </tbody>
                                     </table>
                                 </div>
                  </p>

              </div>

          </div>
      </div>


                    </div>

                    </div>
                </div>


            </div>
        </div>

<script src="https://cdnjs.cloudflare.com/ajax/libs/datatables/1.10.21/js/jquery.dataTables.min.js" integrity="sha512-BkpSL20WETFylMrcirBahHfSnY++H2O1W+UnEEO4yNIl+jI2+zowyoGJpbtk6bx97fBXf++WJHSSK2MV4ghPcg==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.5/jquery.validate.min.js" charset="utf-8"></script>
<script type="text/javascript">
  $(function(){
    var table = $('.yajra-datatables1').DataTable({
      processing:true,
      serverSide:false,
      ajax:"{{route('juniorApprovedTask')}}",
      columns:[
        {data:'DT_RowIndex',name:'DT_RowIndex'},
        {data:'created_at',name:'created_at'},
        {data:'user_name',name:'user_name'},
        {data:'sharing_link',name:'sharing_link'},
        {data:'title',name:'title'},
        //  {data:'description',name:'description'},
        {data:'status',name:'status'},


      ]
    })
  });
  
  $(function(){
    var table = $('.yajra-datatables2').DataTable({
      processing:true,
      serverSide:false,
      ajax:"{{route('juniorRejectedTask')}}",
      columns:[
        {data:'DT_RowIndex',name:'DT_RowIndex'},
        {data:'created_at',name:'created_at'},
        {data:'user_name',name:'user_name'},
        {data:'sharing_link',name:'sharing_link'},
        {data:'title',name:'title'},
        //  {data:'description',name:'description'},
        {data:'status',name:'status'},


      ]
    })
  });
  
  $(function(){
    var table3 = $('.yajra-datatables3').DataTable({
      processing:true,
      serverSide:false,
      ajax:"{{route('bonus-wallet-transaction')}}",
      columns:[
        {data:'DT_RowIndex',name:'DT_RowIndex'},
        {data:'created_at',name:'created_at'},
        {data:'user_name',name:'user_name'},
        {data:'method',name:'method'},
         {data:'received_from',name:'recieved_from'},
        // {data:'name',name:'name'},
        //{data:'sponsor',name:'sponsors.user_name'},
         {data:'description',name:'description'},
          {data:'amount',name:'amount'},
        {data:'type',name:'type'},
        

      ]
    })
  });


// Add click event listener for the approve and reject buttons
   $('.yajra-datatables1').on('click', '.approve', function () {
        var taskId = $(this).attr('id');
        console.log(taskId);
        // Perform AJAX request to handle approval in the controller
        $.ajax({
             url: "/approve-task/" + taskId,
            type: "POST",
            data: { taskId: taskId, _token: "{{ csrf_token() }}" },
            success: function (data) {
                // Handle success response, if needed
                console.log(data);
            },
            error: function (error) {
                // Handle error, if needed
                console.error(error);
            }
        });
    });

</script>


@endsection