@extends('template.master')
@section('title', 'Subscription Management')
@section('content')
<div class=" mt-4">
	<div class="row justify-content-center">
		<div class="col-12">
			<div class="card card-primary">
				<div class="card-header" style="background: #000000;color: #f0ac63 !important;">
					<h3 class="card-title">Refferral Settings</h3>
				</div>
				<div class="card-body">
					@if(session()->has('message'))
					<div class="alert alert-success alert-dismissible">
						{{ session()->get('message') }}
					</div>
					@endif
					@if(session()->has('message_wr'))
					<div class="alert alert-danger alert-dismissible">
						{{ session()->get('message_wr') }}
					</div>
					@endif
					<form class="form" id="taxo-form" action="{{ route('referrals.store') }}" method="POST" enctype="multipart/form-data">
						@csrf
						<input type="hidden" class="form-control" id="subscription_id" name="subscription_id" value="{{ @$subscription->subscription_id }}">
						<div class="row">
							<div class="col-md-6">
								<div class="form-group">
									<label for="exampleInputName1" class="mt-2">Subscription Name <span class="text-danger">*</span></label>

									<select type="text" class="form-control" id="subscription_name" name="subscription_id" placeholder="Subscription Name">
										<option value="">Select Subscription</option>
										@foreach($subscriptions as $value)
										<option value="{{ $value->subscription_id }}" data-value="{{json_encode($value->referralSetting)}}"
											{{old('subscription_id')==$value->subscription_id?'selected':''}}
											>{{$value->subscription_name}}</option>
										@endforeach
										</select>

									@foreach($errors->get('subscription_id') as $error)
										<div class="error">{{ $error }}</div>
									@endforeach
								</div>
									</div>
									<div class="col-md-6"></div>
									<div class="col-md-6">
										<div class="form-group">
											<label for="monthly_reward_type" class="mt-2">Reward Type For Monthly Subscription <span class="text-danger">*</span></label>
											<select class="form-control" id="monthly_reward_type" name="monthly[type]">
												<option value="">Select Type</option>
												<option value="1" @if(old('monthly.type','')==1) selected @endif>Amount</option>
												<option value="2" @if(old('monthly.type','')==2) selected @endif>Percentage</option>
											</select>
												@if($errors->has('monthly.type'))
												<div class="error">{{ $errors->first('monthly.type') }}</div>
												@endif
										</div>
									</div>
									<div class="col-md-6">
										<div class="form-group">
											<label for="reward_amount_per_month" class="mt-2">Reward Amount Per Month <span class="text-danger">*</span></label>
											<input type="number" class="form-control" id="reward_amount_per_month" name="monthly[amount]" placeholder="Subscription Price Per Month" value="{{ old('monthly.amount',@$subscription->referral_settings->monthly->amount) }}">
												@if($errors->has('monthly.amount'))
												<div class="error">{{ $errors->first('monthly.amount') }}</div>
												@endif
										</div>
									</div>
									<div class="col-md-6">
										<div class="form-group">
											<label for="yearly_reward_type" class="mt-2">Reward Type For Yearly Subscription <span class="text-danger">*</span></label>
											<select class="form-control" id="yearly_reward_type" name="yearly[type]">
												<option value="">Select Type</option>
												<option value="1" @if(old('yearly.type','')==1) selected @endif>Amount</option>
												<option value="2" @if(old('yearly.type','')==2) selected @endif>Percentage</option>
											</select>
												@if($errors->has('yearly.type'))
												<div class="error">{{ $errors->first('yearly.type') }}</div>
												@endif
										</div>
									</div>
									<div class="col-md-6">
										<div class="form-group">
											<label for="reward_amount_per_year" class="mt-2">Reward Amount Per Year <span class="text-danger">*</span></label>
											<input type="number" class="form-control" id="reward_amount_per_year" name="yearly[amount]" placeholder="Subscription Price Per Year" value="{{ old('yearly.amount',@$subscription->referral_settings->yearly->amount) }}">
												@if($errors->has('yearly.amount'))
												<div class="error">{{ $errors->first('yearly.amount') }}</div>
												@endif
										</div>
									</div>
									<div class="col-md-6">
										<div class="form-group">
											<button type="submit" class="btn btn-primary">Submit</button>
										</div>
									</div>
									<div class="col-md-6"></div>
									<div class="col-12"><h4>Filters</h4></div>
									<div class="col-md-4">
										<div class="form-group">
											<label for="status" class="mt-2">Status <span class="text-danger">*</span></label>
											<select class="form-control" id="status" name="status">
												<option value="">All</option>
												<option value="1" >Active</option>
												<option value="0">Inactive</option>
											</select>
												@if($errors->has('yearly.type'))
												<div class="error">{{ $errors->first('yearly.type') }}</div>
												@endif
										</div>
									</div>
									<div class="col-md-4">
										<div class="form-group">
											<label for="status" class="mt-2">Start At <span class="text-danger">*</span></label>
											<input type="date" class="form-control" id="created_at" name="created_at">
										</div>
									</div>
									<div class="col-md-4">
										<div class="form-group">
											<label for="status" class="mt-2">End At <span class="text-danger">*</span></label>
											<input type="date" class="form-control" id="end_at" name="end_at">
										</div>
									</div>
									
						</div>
					</form>
					<div class="table-responsive">
						<table id="example" class="table table-bordered dt-responsive display" style="width:none !important">
							<thead>
								<tr>
									<th class="all">Subscription</th>
									<th class="desktop">Monthly Type</th>
									<th class="desktop">Monthly Amount</th>
									<th class="desktop">Yearly Type</th>
									<th class="desktop">Yearly Amount</th>
									<th class="desktop">Start Date</th>
									<th class="desktop">End Date</th>
								</tr>
							</thead>
						</table>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>
@endsection
@push('child-scripts')
<script>
	$(document).ready(function() {
		$('#subscription_name').on('change', function() {
			var selectedSubscription = $(this).find(':selected');
			var referralData = selectedSubscription.data('value');
			if (referralData) {
				$('#monthly_reward_type').val(referralData.monthly_type);
				$('#reward_amount_per_month').val(referralData.monthly_amount);
				$('#yearly_reward_type').val(referralData.yearly_type);
				$('#reward_amount_per_year').val(referralData.yearly_amount);
			} else {
				$('#monthly_reward_type, #reward_amount_per_month, #yearly_reward_type, #reward_amount_per_year').val('');
			}
			redrawTable(table);
		});

		let table = $('#example').DataTable({
			processing: true,
			serverSide: true,
			searching: true,
			info: true,
			paging : true,
			lengthChange : true,
			autoWidth : true,
			responsive: true,
			ajax: {
				url: "{{ route('referrals.settings.datatable') }}",
				method: "GET",
				data: function(d) {
					d.subscription_id = $('#subscription_name').val();
					d.status = $('#status').val();
					d.created_at = $('#created_at').val();
					d.end_at = $('#end_at').val();
				}
			},
			columns: [
				{ data: 'subscription', name: 'subscription' },
				{ data: 'monthly_type', name: 'monthly_type' },
				{ data: 'monthly_amount', name: 'monthly_amount' },
				{ data: 'yearly_type', name: 'yearly_type' },
				{ data: 'yearly_amount', name: 'yearly_amount' },
				{ data: 'created_at', name: 'start_at' },
				{ data: 'end_at', name: 'end_at' },
			],
			createdRow: function(row, data, dataIndex) {
				if (data.status == 1) {
					$(row).addClass('bg-success');
				}
			}
		});
		$('#status, #created_at, #end_at').change(function() {
			redrawTable(table);
		});
		$('#created_at').change(function() {
            var startDateValue = $(this).val();
            $('#end_at').attr('min', startDateValue);
        });
	});
	function redrawTable(table) {
		table.draw();
	}
</script>
@endpush