@extends('layouts.dashboard')

@section('myJS')
  <!-- <script src="{{url('/')}}/js/admin/admin.js"></script> -->
@endsection

@section('content')
@php // echo "<pre>"; //print_r($currentSubscription); exit; @endphp
<div class="padding-top40"></div>

<div class="bs-example">

	<!-- main part-->
	<div class="container-fluid">
		<div class="row manage_catalogue">
			<div id="exTab1">
				<ul class="nav nav-pills nav-catalog nav-justified nav-catalog-ui nav-pills-ui" id="setup_tab">
					<li class="active">
					<a  href="#1a" data-toggle="tab">Your subscription </a>
					</li>
					<li><a href="#subHistory" data-toggle="tab">Subscription history </a>
					</li>
					<li><a href="#3a" data-toggle="tab">Cancelling a subscription</a>
					</li>
				</ul>

				<div class="tab-content clearfix">
					<div class="tab-pane active" id="1a">
						<div class="row" style="margin: 0px; padding-top: 15px;">
							<!-- <div class="col-md-2 manage-text">
								<input type="text" id="inputorganisationName" class="form-control" placeholder="Organisation">
							</div>-->
							@if($currentSubscription->PackageName != 'Professional')
							<div class="col-md-2">
								<!-- <button type="button" id="btnAddOrganisation" class="btn btn-default btn-xs btnAddOrganisation" data-toggle="modal" data-target="#organisationModel" title="Upgrade plan" style="font-size: 14px !important;">Upgrade plan</button> -->
									<a href="{{ url('upgradeSubscription') }}" class="btn btn-default" id="btnUpgradePlan" title="Upgrade plan" style="font-size: 14px !important;">Upgrade plan</a>
							</div>
							<div class="col-md-7 col-md-offset-1">
								@if(Session::has('plan_upgradation_success'))
									<div class="alert alert-success alert-dismissible text-center">
										<a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
										<strong> {{ session('plan_upgradation_success') }} </strong>
									</div>
								@endif
								<h4 class="successMsgOrg"></h4>
								<h4 class="failMsgOrg"></h4>
							</div>
							@endif
						</div>
						<div id="div_organisation_table" class="row table-catalog" style="margin: 0px;">
							<table data-page-length='50'  id="ManageOrganisations" class="table table-striped table-bordered" cellspacing="0" width="100%">
								<thead>
									<tr>
										<th scope="col" class="set1">Subscription name </th>
										<th scope="col" class="set2">Subscription details</th>
									</tr>
								</thead>
								<tbody>
                  @if(count($currentSubscription) > 0)

                        <tr>
                          <td class="">{{$currentSubscription->PackageName}} </th>
                          <td class="">{{$currentSubscription->PackageDescription}}</th>
                        </tr>

                  @else
                      <tr>
                        <td class="set-col1" colspan="2"> You haven't subscribed to any plan </th>
                      </tr>
                  @endif
								</tbody>
							</table>
						</div>
					</div>

					<div class="tab-pane" id="subHistory">
						<div class="row" style="margin: 0px; padding-top: 15px;">
							<div class="col-md-2 manage-text">

							</div>
							<div class="col-md-6"></div>
						</div>
						<div id="catalogTable" class="row table-catalog" style="margin: 0px;padding-top:1% !important;">
							<table data-page-length='50' id="managecatalogue" class="table table-striped table-bordered" cellspacing="0" width="100%">
								<thead>
									<tr>
										<th scope="col" class="set1">Subscription name</th>
										<th scope="col" class="set2">Subscription details</th>
										<th scope="col" class="set3">Subscription start date</th>
                    <th scope="col" class="set4">Download invoice</th>
									</tr>
								</thead>
								<tbody>
                    @if(count($subscriptions) > 0)
											@foreach($subscriptions as $subscription)
                  			@if(isset($subscription->invoice) && count($subscription->invoice->data))
                   				@foreach($subscription->invoice->data as $invoice)
				                    <tr>
				                      	<td scope="col" class="set1">{{$subscription->PackageName}} </td>
				                      	<td scope="col" class="set2">{{$subscription->PackageDescription}}</td>
				                      	<td scope="col" class="set2">{{$subscription->SubscriptionStartDateTime}}</td>

				                      	<td scope="col" class="set2">
																	@if($subscription->PackageName != 'Free')
				                      			<a href="{{$invoice->invoice_pdf}}">Invoice</a>
				                      		@else
				                      			<span>-</span>
				                      		@endif
				                      	</td>

				                    </tr>
                    			@endforeach
												@else
													<tr>
														<td scope="col" class="set1">{{$subscription->PackageName}} </td>
														<td scope="col" class="set2">{{$subscription->PackageDescription}}</td>
														<td scope="col" class="set2">{{$subscription->SubscriptionStartDateTime}}</td>
														<td scope="col" class="set2">
															@if($subscription->PackageName != 'Free')
																<a href="{{$invoice->invoice_pdf}}">Invoice</a>
															@else
																<span>-</span>
															@endif
														</td>
													</tr>
                    		@endif
                    	@endforeach
                    @else
                    <tr>
                      <td scope="col" class="set-col1" colspan="5">No plan history found.</td>
                    </tr>
                   @endif
								</tbody>
							</table>
						</div>
					</div>

					<div class="tab-pane" id="3a">
						<div id="div_table " class="row table-catalog" style="margin: 0px;  padding-top: 15px;">

							<div class="container-fluid text-center">

							@if(count($currentSubscription) > 0)
							@if($currentSubscription->PackageID != 1)

              <div id="activesubscription">
								<form action="{{url('cancelsubscription')}}" method="POST" id="cancelSubscriptionForm">
									@csrf
									<input type="hidden" name="subscriptionID" value="{{$currentSubscription->StripeReference}}">

									<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#cancelSubscriptionModal">
										Cancel Subscription
									</button>
								</form>
							</div>
							@else
								<div>
									<p>No Active Subscriptions.</p>
								</div>
							@endif
						@endif

							<div id="noactivesubscription" style="display: none;">
								<p>No Active Subscriptions.</p>
							</div>
						</div>

							<!-- <table data-page-length='50'  id="manageusers" class="table table-striped table-bordered" cellspacing="0" width="100%">
								<thead>
									<tr>
										<th scope="col" class="set1">User Name</th>
										<th scope="col" class="set2">Organisation</th>
										<th scope="col" class="set3">Operations</th>
									</tr>
								</thead>
								<tbody>

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

<div class="modal fade" id="cancelSubscriptionModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog" style="margin-top: 10%;width: 477px !important;">
	    <div class="modal-content">
			<div class="modal-header">
				<!-- <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> -->
				<h4 class="modal-title" id="myModalLabel">Cancel Subscription</h4>
			</div>

	        <div class="modal-body ">
	        	<p>Are you sure you want to cancel your subscription?</p>
	        	<p id="cancelsuberror" class="text-danger"></p>
			</div>

	        <div class="modal-footer">
				<button type="button" class="btn btn-success" id="cancelSubscriptionBtn">Yes</button>
	    		<button type="button" class="btn btn-secondary" data-dismiss="modal" data-dismiss="modal">No</button>
	        </div>

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

<div class="modal fade" id="successModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog" style="margin-top: 10%;width: 477px !important;">
	    <div class="modal-content">
			<div class="modal-header">
				<!-- <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> -->
				<h4 class="modal-title" id="myModalLabel">Success</h4>
			</div>

	        <div class="modal-body ">
	        	Your Subscription is cancelled.
			</div>

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

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

<script type="text/javascript">

	$(document).ready(function() {
	    $("#exTab1").show();
	});

	$("#cancelSubscriptionBtn").click(function(){

		$.ajax({
	        type:$('#cancelSubscriptionForm').attr('method'),
	        url:$('#cancelSubscriptionForm').attr('action'),
	        data:$('#cancelSubscriptionForm').serialize(),
	        success:function(data){
	      		console.log(data);

	      		if(data.status=="success")
	      		{
	      			$('#cancelSubscriptionModal').modal('hide');
	      			$('#successModal').modal('show');
	      			$('#successModal').on('hidden.bs.modal', function (e) {
					  window.location.reload();
					});
	      			/*$('#cancelSubscriptionModal').modal('hide');
	      			$('#activesubscription').hide();
	      			$('#noactivesubscription').show();*/
	      		}
	      		else
	      		{
             		$('#cancelsuberror').text(data.message);
	      		}
	        }
	   	});
	});

</script>

<script type="text/javascript">
	$(document).ready(function(){
		$(document).ajaxStart(function () {
	        $('#ajaxloader').show();
	    })
	    .ajaxStop(function () {
	        $('#ajaxloader').hide();
	    });
	});
</script>

@endsection