@extends('Admin.layout.app')

@section('title', 'feedback list')

@section('page-title', 'feedback list')

@section('content')


<div class="card">
   <div class="card-header d-flex justify-content-between align-items-center">
       <h5 class="mb-0">Feedback List</h5>
       
   </div>

   <div class="card-body">
       <!-- Filter Form -->
       <form method="GET" class="row g-2 mb-3">
           <div class="col-md-5">
               <input type="text" name="search" class="form-control"
                  value="{{ request('search') }}" placeholder="Search">
           </div>
           <div class="col-md-4">
               <select name="status" class="form-control">
                 <option value="">Status</option>
              
                 <option value="1" {{ request('status')=='1' ? 'selected' : '' }}>
                     Active
                 </option>
              
                 <option value="0" {{ request('status')=='0' ? 'selected' : '' }}>
                     Un-Active
                 </option>
              
                 
               </select>
           </div>
           
           
           <div class="col-md-3">
               <button class="btn btn-secondary w-100">Filter</button>
           </div>
       </form>

       <!-- Products Table -->
       <div class="table-responsive">
           <table class="table table-bordered align-middle">
               <thead class="table-light">
                   <tr>
                       <th width="30"><input type="checkbox" class="check-all"></th>
                       <th>Name</th>
                       <th>Phone</th>
                       <th>Email</th>
                       <th>Date/Event</th>
                       <th>Message</th>
                       <th>Status</th>
                       <th class="text-end">Action</th>
                   </tr>
               </thead>
               <tbody>
                 @foreach($testimonials as $testimonial)
                    <tr>
                       <td><input type="checkbox" class="check-one" value="{{ $testimonial->id }}"></td>
                       
                       <td>
                           <strong>{{ $testimonial->name }} </strong><br>
                       </td>

                       <td>
                           <strong>{{ $testimonial->phone ?? ''}}</strong>
                       </td>

                       <td> <strong> {{ $testimonial->email ?? '' }} </strong></td>
                       <td>
                           {{$testimonial->event_date}} <br>
                           {{$testimonial->designation}}
                           
                       </td>

                       <td>
                           <span>{{$testimonial->message}}</span>
                       </td>
                       
                       <td>
                            @if($testimonial->status == '1')
                                 <span class="badge bg-success">Active</span>

                           @else($testimonial->status == '2')
                                 <span class="badge bg-danger">Un-Active</span>

                           @endif
                       </td>


                       <td class="text-end">

                       @if(($testimonial->status == '1'))
                          <button
                              class="btn btn-sm btn-outline-info rounded-pill px-3 btn-UnActive"
                              data-bs-toggle="modal"
                              data-bs-target="#unactiveModal"
                              data-id="{{ $testimonial->id }}">
                              <i class="las la-times-circle"></i> Mark Un-Active
                          </button>
                        @else
                        <button
                              class="btn btn-sm btn-outline-success rounded-pill px-3 btn-Active"
                              data-bs-toggle="modal"
                              data-bs-target="#activeModal"
                              data-id="{{ $testimonial->id }}">
                              <i class="las la-check-circle"></i> Mark Active
                          </button>
                        
                        @endif
                        
                          
                        </td>
                   </tr>

                  @endforeach
                 
               </tbody>
           </table>
       </div>

       <!-- Pagination -->
       <div class="mt-3">
         <div class="pagination-sm">
           {{ $testimonials->links() }}
         </div>
       </div>
   </div>
</div>

<div class="modal fade" id="unactiveModal" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content">

            <form id="unactiveForm" method="POST">
                @csrf
                @method('PUT')

                <div class="modal-header">
                    <h5 class="modal-title">Mark Feedback Not Publish </h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                </div>

                <div class="modal-body">
                    Are you sure you want to FeedBack <strong>Not Publish</strong>?
                </div>

                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary"
                        data-bs-dismiss="modal">Cancel</button>

                    <button type="submit" class="btn btn-info">
                        Yes, Not Publish
                    </button>
                </div>

            </form>

        </div>
    </div>
</div>

<div class="modal fade" id="activeModal" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content">

            <form id="activeForm" method="POST">
                @csrf
                @method('PUT')

                <div class="modal-header">
                    <h5 class="modal-title">Mark Feedback Publish </h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                </div>

                <div class="modal-body">
                    Are you sure you want to FeedBack <strong>Publish</strong>?
                </div>

                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary"
                        data-bs-dismiss="modal">Cancel</button>

                    <button type="submit" class="btn btn-info">
                        Yes, Publish
                    </button>
                </div>

            </form>

        </div>
    </div>
</div>


@endsection


@push('js')
<script>

$(function () {

    $('.btn-UnActive').click(function () {

        let id = $(this).data('id');

        $('#unactiveForm').attr(
            'action',
            '/admin/feedback/' + id + '/un-publish'
        );

    });

    $('.btn-Active').click(function () {

        let id = $(this).data('id');

        $('#activeForm').attr(
            'action',
            '/admin/feedback/' + id + '/publish'
        );

    });

    
    
});
</script>
@endpush