@extends('layouts.dashboard')
<style>
  .deprt-seach{
    width: 300px !important;
  }
</style>
@section('content')

<section class="content-header">
    <div class="container-fluid">
      <div class="row mb-2">
        <div class="col-sm-6">
          <h1>Subscription List</h1>
        </div>
        <div class="col-sm-6">
          <ol class="breadcrumb float-sm-right">
            <li class="breadcrumb-item"><a href="/">Home</a></li>
            <li class="breadcrumb-item active">Subscription</li>
          </ol>
        </div>
      </div>
    </div><!-- /.container-fluid -->
  </section>
  <section class="content">
    <div class="container-fluid">
        @if (Session::has('message'))
        <div class="col-sm-12">
            <div id="alert" class="alert {{ Session::get('alert-class', 'alert-info') }} alert-dismissible fade show" role="alert">
                {{ Session::get('message') }}
            </div>
        </div>
    @endif

      <!-- /.row -->
      <div class="row">
        <div class="col-12">
          <div class="card">
            <div class="card-header">
              {{-- <h3 class="card-title">Fixed Header Table</h3> --}}

              <div class="card-tools">
                <div class="input-group input-group-sm">
                  <!-- <input type="text" name="table_search" class="form-control float-right deprt-seach" placeholder="Search">
                  <div class="input-group-append">
                    <button type="submit" class="btn btn-default">
                      <i class="fas fa-search"></i>
                    </button>
                  </div> -->
                  <button type="button" class="btn btn-outline-warning btn-sm ml-2 float-right">
                    <a href="{{ route('admin.subscription.add') }}"  class="text-dark"> <i class="fa fa-plus"></i>&nbsp; Add </a></button>
                </div>
              </div>
            </div>
            <!-- /.card-header -->
            <div class="card-body  p-0">
               <div class="table-responsive">
               <table class="table table-head-fixed table-striped table-bordered text-nowrap text-center">
                <thead>
                  <tr>
                    <th>Sr No.</th>
                    <th>Name</th>
                    <th>Price user/month(in Rs)</th>
                    <th>Discount Amount(in Rs)</th>
                   <th>Status</th>
                    <th>Action</th>
                  </tr>
                </thead>
                <tbody>
                    @forelse ($subscriptions as $subscription )
                  <tr>
                    <td>{{ $loop->iteration }}</td>
                    <td>{{ $subscription->name }}</td>
                    <td>{{ $subscription->per_user_month_price }}</td>
                    <td>{{ $subscription->discount_amt }}</td>
                    <td>
                        <input class="chkToggle" type="checkbox" data-id="{{ $subscription->id}}" {{ ($subscription->status == 1)?'checked':''}} data-toggle="toggle" data-onstyle="success" data-offstyle="secondary" data-on="Active" data-off="Inactive" data-width="100">
                   </td> 
                    <td>
                        <button type="button" class="btn btn-outline-warning btn-sm">
                        <a href="{{ route('admin.subscription.edit',['id'=>$subscription->id]) }}"  class="text-dark"> <i class="fas fa-edit text-warning"></i></a>
                      </button>
                    </td>
                </tr>

                  @empty
                  <tr><td colspan="4" class="text-center">No data available</td></tr>
                  @endforelse

                </tbody>
              </table>
               </div>
              <div class="link">
                {{ $subscriptions->onEachSide(2)->links() }}
                </div>

            </div>
            <!-- /.card-body -->
          </div>
          <!-- /.card -->
        </div>
      </div>
      <!-- /.row -->

    </div><!-- /.container-fluid -->
  </section>

@endsection



@push('scripts')
<script>

  $('.chkToggle').change(function() {
    var id = $(this).data('id');
    var checked = $(this).prop('checked');

    console.log(id);

    Swal.fire({
                title: "Are you sure to change the status?",
                showDenyButton: true,
                denyButtonText: "No",
                confirmButtonText: "Yes",
                }).then((result) => {
                if (result.isConfirmed) {

                    $.ajax({
                        type: "POST",
                        url: "{{ route('admin.subscription.change-status') }}",
                        data: {
                        "_token": "{{ csrf_token() }}",
                        'id':id
                        },
                        success: function (data) {
                            if(data.status == "success") {
                                Swal.fire("Status changed successfully!", "", "success")
                            }
                            else {
                                Swal.fire("Not able to change status!", "", "info");
                             } // End if-else
                        },
                        error: function (data) {
                            console.log('error data = ', data)
                            Swal.fire("Not able to change status!", "", "info");
                        },

                        });

                } else if (result.isDenied) {
                    Swal.fire("Denied", "", "info");
                    location.reload();
                }
                });
    });




</script>

@endpush