@extends('admin.layouts.app')
@section('page_tab_title' ,"Plans") 
@section('content')

<section class="content update-setting-wrapper">
  
  <div class="row">
    <!-- right column -->
    <div class="col-md-12">
      <!-- Horizontal Form -->
      <div class="shadow-box">
        @include('admin.layouts.master-table')
        <div class="box-header adminuser-box">
          <div class="row">
            <div class="col-lg-4 col-md-4">
              <div class="top-ttl">
                <h1>
                  Plans
                </h1>
              </div>
            </div>
          </div>
          <hr class="bdr-partition">
        </div>
        
        @if ($message = Session::get('success'))
          <div class="alert alert-success">
            <p>{{ $message }}</p>
          </div>
        @endif
        <section class="content">
          <div class="row form-hidden plan-form-row" style="display:none">
            <div class="col-xs-12">
              <div class="shadow-box" style="margin-bottom: 10px;">
                <div class="box-header">
                  <div class="row">
                    <div class="col-xs-6">
                      <div class="top-ttl">
                        <h1 id="title">Edit plan</h1>
                      </div>
                    </div>
                  </div>
                  <hr class="bdr-partition">
                </div>
                <form method="POST" id="planForm" class="form-horizontal forum-category" enctype="multipart/form-data" action="#" >
                  @csrf
                  <div class="box-body">
                    <div class="row">
                      <div class="col-md-6">
                        <div class="form-group">
                          <div class="col-sm-12">
                            <input type="hidden" name="planId" id="planId" />
                            <label class=" control-label">Name <span class="required_span">*</span></label>
                            <input type="text" data-parsley-parsehtml="" maxlength="250" name="name" id="planName" required class="form-control" value="">
                            <span class="error-unique text-danger" role="alert"></span>
                            @if ($errors->has('name'))
                            <span class="invalid-feedback text-danger" role="alert">
                              <p>{{ $errors->first('name') }}</p>
                            </span>
                            @endif
                          </div>
                        </div>
                        <div class="form-group">
                          <div class="col-sm-12">
                            <label class=" control-label">Price <span class="required_span">*</span></label>
                            <input type="number" data-parsley-parsehtml="" name="price" id="planPrice" required class="form-control" value="">
                            <span class="error-unique text-danger" role="alert"></span>
                            @if ($errors->has('price'))
                            <span class="invalid-feedback text-danger" role="alert">
                              <p>{{ $errors->first('price') }}</p>
                            </span>
                            @endif
                          </div>
                        </div>
                        <div class="form-group">
                          <div class="col-sm-12">
                            <label class=" control-label">Free trial days <span class="required_span">*</span></label>
                            <input type="number" data-parsley-parsehtml="" name="free_trial_days" id="planfreeTrialDays" required class="form-control" value="">
                            <span class="error-unique text-danger" role="alert"></span>
                            @if ($errors->has('free_trial_days'))
                            <span class="invalid-feedback text-danger" role="alert">
                              <p>{{ $errors->first('free_trial_days') }}</p>
                            </span>
                            @endif
                          </div>
                        </div>
                        <div class="form-group">
                          <div class="col-sm-12">
                            <label class=" control-label">Description</label>
                            <textarea class="form-control" name="description" id="planDesc"></textarea>
                            <span class="error-unique text-danger" role="alert"></span>
                            @if ($errors->has('free_trial_days'))
                            <span class="invalid-feedback text-danger" role="alert">
                              <p>{{ $errors->first('free_trial_days') }}</p>
                            </span>
                            @endif
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="button-area">
                      <button type="submit" class="btn btn-info ">Submit</button>
                      <a href="javascript:void(0)" class="btn btn-default cancel-btn">Cancel</a>
                    </div>
                  </div>
                </form>
              </div>
            </div>
          </div>
          <div class="row">
            <div class="col-xs-12">
              <div class="box-body table-responsive">
                <table id="plan_datatable" class="table table-bordered table-striped ">
                  <thead>
                    <tr>
                      <th>Name</th>
                      <th>Price( pm )</th>
                      <th>Free Trial days</th>
                      <th>Action</th>
                    </tr>
                  </thead>
                </table>
              </div>
              
            </div>
          </div>
        </section>
        <script>
          function editPlan( id, name, price, trial_days, desc )
          {
            $("#title").html("Edit plan");
            $(".plan-form-row").show();
            $("#planForm").attr("action","{{route('plans.update')}}");
            $("#planDesc").val(desc);
            $("#planfreeTrialDays").val(trial_days);
            $("#planPrice").val(price);
            $("#planName").val(name);
            $("#planId").val(id);
            $("input[name='name']").parsley().reset();
          }
          
          $(document).ready(function() {

            var url = "{{route('plans.list')}}";

            $('#plan_datatable').DataTable({
              order:[0,'asc'],
              processing: true,
              serverSide: true,
              ajax: url,
              columns: [
                {
                  data: 'name',
                  name: 'name'
                },
                {
                  data: 'price',
                  render: $.fn.dataTable.render.number(',', '.', 2, '$'),
                },
                {
                  data: 'free_trial_days',
                  name: 'free_trial_days'
                },
                {
                  data: 'action',
                  name: 'action',
                  orderable: false,
                  searchable: false
                }
              ]
            });
          });

          $('#planForm').parsley();
        </script>
      </div>
    </div>
  </div>
</section>


@endsection