@extends('layout.master')
@section('content')

                <section class="content pb-5">
                    <div class="container-fluid">
                     <meta name="csrf-token" content="{!! csrf_token() !!}">
                     <div class="row py-sm-5">
                     <div class="col-md-12">
                        <div class="title-section">
                           <p>Subscription Plans :: {{$page}}</p>
                        </div>
                        <form id="formSubs" enctype="multipart/form-data" method="post">
                            <input name="id" class="form-control" type="hidden" id="id" value="{{@$SubscriptionPlan->id}}">
                           <div class="card">
                              <div class="card-body">
                                 
                                 <div class="row">
                                    <div class="col-md-3">
                                       <div class="form-group custom-form-group">
                                            <label class="form-label" for="name">Customer Type<span class="text-danger">*</span></label>
                                            <select class="form-control" name="customer_type_id" id="customer_type_id">
                                                    <option value="">Select Customer Type</option>
                                                    @foreach($listData['customer_types'] as $customer_type)
                                                    <option value="{{$customer_type['id']}}" {{ old('customer_type_id') == $customer_type['id'] || @$SubscriptionPlan->customer_type_id == $customer_type['id']? 'selected': ''}}>{{$customer_type['name']}}</option>
                                                    @endforeach
                                                </select>
                                        </div>
                                    </div>
                                    <div class="col-md-3">
                                       <div class="form-group custom-form-group">
                                            <label class="form-label" for="name">Subscription Type<span class="text-danger">*</span></label>
                                            <select class="form-control" name="subscription_type_id" id="subscription_type_id">
                                                    <option value="">Select Subscription Type</option>
                                                    @foreach($listData['subscription_types'] as $subscription_type)
                                                    <option value="{{$subscription_type['id']}}" {{ old('subscription_type_id') == $subscription_type['id'] || @$SubscriptionPlan->subscription_type_id == $subscription_type['id'] ? 'selected': ''}}>{{$subscription_type['name']}}</option>
                                                    @endforeach
                                                </select>
                                        </div>
                                    </div>

                                    

                                    <div class="col-md-3">
                                       <div class="form-group custom-form-group">
                                            <label class="form-label" for="volume_start">Volume Start<span class="text-danger">*</span></label>
                                                <input name="volume_start" class="form-control" type="number" id="volume_start" min="0" value="{{@$SubscriptionPlan->volume_start}}">
                                        </div>
                                    </div>

                                    <div class="col-md-3">
                                       <div class="form-group custom-form-group">
                                            <label class="form-label" for="volume_end">Volume End<span class="text-danger">*</span></label>
                                                <input name="volume_end" class="form-control" type="number" id="volume_end" min="0" value="{{@$SubscriptionPlan->volume_end}}">
                                        </div>
                                    </div>


                                    
                                </div>
                                <div class="row mt-3">
                                    <div class="col-md-12">
                                        <div class="form-group custom-form-group">
                                            <input class="filled-in filled-check" name="is_greater" type="checkbox" id="is_greater" value="1" {{@$SubscriptionPlan->is_greater==1?'checked':''}}>
                                            <label for="is_greater" class="order-label">Is Greater</label>
                                        </div>
                                    </div>
                                </div>

                            </div>
                            <div class="card-footer">
                                <div class="row">
                                    <div class="col-md-12 text-center">
                                        <button type="submit" class="btn btn-outline-danger">Submit</button>
                                        <a href="{{route('subscription-plans')}}" class="btn btn-outline-dark">Cancel</a>
                                    </div>
                                </div>
                            </div>
                          </div>
                        </form>
                        </div>
                        </div>

                        <div class="row">
                            <div class="col-md-12">
                                <div class="title-section">
                                    <p>Subscription Plans</p>
                                </div>
                            </div>
                        </div>

                        <div class="row pt-sm-4 pt-0">
                            <div class="col-md-12">
                                <div class="row align-items-center">
                                    <div class="col-md-12">
                                        <div class="table-responsive">
                                            <table class="table table-striped" id="pincodemasterList">
                                                <thead>
                                                    <tr>
                                                        <th scope="col">Sr. No.</th>
                                                        <th scope="col">Customer Type</th>
                                                        <th scope="col">Subscription Type</th>
                                                        <th scope="col">Discount</th>
                                                        <th scope="col">Volume</th>
                                                        <th scope="col">Action</th>
                                                        
                                                    </tr>
                                                </thead>
                                                <tbody>
                                                </tbody>
                                            </table>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </section>

<script src="{{asset('assets/plugins/jquery-validation/jquery.validate.js')}}"></script>
<script src="{{asset('assets/plugins/jquery-validation/jquery.validate.min.js')}}"></script>
            
<script>
$(document).ready(function() {
    $('#is_greater').on('change',function(){
        if($(this).is(':checked')){
            $('#volume_end').val('');
            $('#volume_end').prop('disabled',true);
        }else{
            $('#volume_end').prop('disabled',false);
        }
    }).change();

    $("table").on('click','.delete',function(){
        var delete_url=$(this).attr('data-url');
        var data_id=$(this).attr('data-id');
        new swal({
                title: '',
                text: "Are you Sure want to delete ?",
                type: 'warning',
                showCancelButton: true,
                confirmButtonColor: '#dc3545',
                cancelButtonColor: '#343a40',
                confirmButtonText: "Yes, Delete",
                cancelButtonText: 'No, Cancel'
            },
            function(isConfirm){
              if (isConfirm) {
                $.ajax({
                        url: delete_url,
                        type: "POST",
                        headers: {
                              'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                        },
                        beforeSend: function () { 
                              $('#custum-loader').removeClass('hidden');
                              $('body').addClass('no-scroll');
                        },
                        success: function (data, textStatus, jqXHR) {
                           $('#custum-loader').addClass('hidden');
                           new swal({
                                title: '',
                                text: "Deleted successfully ?",
                                type: 'success'
                            });
                           $('#row_id_'+data_id).remove();
                        },
                        error: function (jqXHR, textStatus, errorThrown) {

                        }
                    });
              } 
          });

    });

    $("#formSubs").validate({

            rules: {
                customer_type_id: {required:true},
                subscription_type_id: {required:true},
                volume_start: {required:true},
            },submitHandler: function(form) {
               //form.preventDefault();
               $.ajax({
                  method: 'POST',
                  url:"{{route('post-subscription-plan')}}",
                  headers: {
                      'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                  },
                  data: $("#formSubs").serialize(),
                  dataType:'JSON',
                  beforeSend: function () { // Before we send the request, remove the .hidden class from the spinner and default to inline-block.
                      $('#custum-loader').removeClass('hidden');
                      $('body').addClass('no-scroll');
                  },
                  success: function (data) {
                  if(data.status == 'true'){
                      
                      swal({
                          title: "Success",
                          text: data.message,
                          type: "success",
   
                          closeOnConfirm: false,
                          showLoaderOnConfirm: true,
                      },
                      function(){
                          window.location.reload();
                      });
                      
                  }
                  else{
   
                      swal({
   
                        title: "oops!",
                        text: data.message,
                        type: "error",
                        closeOnConfirm: false,
                        showLoaderOnConfirm: true,
   
                    });
   
                  }
              },
              error: function () {
                    swal({
                        title: "oops!",
                        text: "Invalid Data",
                        type: "error",
                        closeOnConfirm: false,
                        showLoaderOnConfirm: true,
                    }); 
              },
              complete: function () { // Set our complete callback, adding the .hidden class and hiding the spinner.
                  $('#loader').addClass('hidden');
                  $('body').removeClass('no-scroll');
                  $('#custum-loader').addClass('hidden');
              },
   
        });
            }

        });

        $("#pincodemasterList").DataTable({
                    "language": {
                        "zeroRecords": "No record(s) found."
                    },
                    processing: true,
                    serverSide: true,
                    lengthChange: true,
                    order: [0, 'asc'],
                    searchable: true,
                    bStateSave: false,
                    //responsive: true,
                    ajax: {
                        url: "{{ url('subscription/plans/data') }}",
                        data: function(d) {}
                    },

                    columns: [

                        {
                            data: 'DT_RowIndex',
                            name: 'DT_RowIndex',
                            sortable: false
                        },
                        {
                            data: 'customer_type_name',
                            name: 'customer_type_name',
                            searchable: true,
                            orderable: true,
                            defaultContent: 'NA'
                        },
                        {
                            data: 'subscription_type_name',
                            name: 'subscription_type_name',
                            searchable: true,
                            orderable: true,
                            defaultContent: 'NA'
                        },
                        {
                            data: 'discount',
                            name: 'discount',
                            searchable: true,
                            orderable: true,
                            defaultContent: 'NA'
                        },{
                            data: 'volume',
                            name: 'volume',
                            searchable: true,
                            orderable: true,
                            defaultContent: 'NA'
                        },
                        {
                            data: 'action',
                            name: 'action',
                            searchable: false,
                            orderable: false,
                            defaultContent: 'NA'
                        }
                    ],createdRow: function( row, data, dataIndex){
                        $( row ).attr('id','row_id_'+data.id);
                    },

                });

                //Upload Bulk Booking
            });
        </script>
    @endsection