@extends('layouts.app')
@section('title', __('advancedpromotions::lang.index.title'))
@section('content')

<section class="content-header no-print">
    <h1 class="tw-text-xl md:tw-text-3xl tw-font-bold tw-text-black">
    	{{__('advancedpromotions::lang.index.title')}}
    </h1>
</section>
<section class="content no-print">

	@component('components.widget', ['title' => __('advancedpromotions::lang.perm.manage'), 'icon' => '<i class="ion ion-clipboard"></i>', 'class' => 'box-solid'])
		@slot('tool')
		<div class="box-tools">
		<a type="button" class="tw-dw-btn tw-bg-gradient-to-r tw-from-indigo-600 tw-to-blue-500 tw-font-bold tw-text-white tw-border-none tw-rounded-full pull-right btn-modal"
			data-href="{{ route('ap.create') }}" 
			data-container="#action_modal">
			<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor"
			stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
			class="icon icon-tabler icons-tabler-outline icon-tabler-plus">
			<path stroke="none" d="M0 0h24v24H0z" fill="none" />
			<path d="M12 5l0 14" />
			<path d="M5 12l14 0" />
			</svg> 
			{{ __('lang.add') }}
		</a>
		</div>
		@endslot

		<div class="table-responsive">
			<table class="table table-bordered table-striped ajax_view hide-footer" id="promotions_table">
				<thead>
					<tr>
						<th>{{ __('advancedpromotions::lang.table.name') }}</th>
						<th>{{ __('lang.location') }}</th>
						<th>{{ __('advancedpromotions::lang.start_date') }}</th>
						<th>{{ __('advancedpromotions::lang.end_date') }}</th>
						<th>@lang('lang.action')</th>
					</tr>
				</thead>
			</table>
		</div>
	@endcomponent
	
	<div class="modal fade promotion_modal" id="action_modal" tabindex="-1" role="dialog" aria-labelledby="gridSystemModalLabel">
</section>


@stop
@section('javascript')
<script type="text/javascript">

	$(document).ready(function(){
		promotions_table = $('#promotions_table').DataTable({
			processing: true,
			serverSide: true,
			ajax: {
				url: "{{ route('ap.index') }}",
				data: function(d) {}
			},
			columnDefs: [
				{ 
					targets: [1, 2], 
					orderable: false, 
					searchable: false 
				},
			],
			columns: [
				{ data: 'name', name: 'name' },
				{ data: 'location', name: 'location' },
				{ data: 'start_date', name: 'start_date' },
				{ data: 'end_date', name: 'end_date' },
				{ data: 'action', name: 'action' },
			],
		});

		$(document).on('change', '#user_id, #customer_id, #tracker_tripschedule_id, #stage_id, #status', function(){
			promotions_table.ajax.reload();
		});

		$(document).on('click', '.action_delete', function(e){
			e.preventDefault();
			var url = $(this).data('href');
			swal({
		      title: LANG.sure,
		      icon: "warning",
		      buttons: true,
		      dangerMode: true,
		    }).then((confirmed) => {
		        if (confirmed) {
					$.ajax({
						method: "DELETE",
						url: url,
						dataType: "json",
						success: function(result){
							if(result.success == true){
								toastr.success(result.msg);
								promotions_table.ajax.reload();
							} else {
								toastr.error(result.msg);
							}
						}
					});
				   }	
			  });
		});
	
		$(document).on('click', '.action_is_closed', function(e){
			e.preventDefault();
			var url = $(this).data('href');

			swal({
			title: LANG.sure,
			icon: "warning",
			buttons: true,
			dangerMode: true,
			}).then((confirmed) => {
				if (confirmed) {
					$.ajax({
						method: "POST",
						url: url,
						dataType: "json",
						success: function(result){
							if(result.success == true){
								toastr.success(result.msg);
								promotions_table.ajax.reload();
							} else {
								toastr.error(result.msg);
							}
						}
					});
				}	
			});
		});
		
	});

	$(document).on('shown.bs.modal', '.promotion_modal', function(e) {
		initAutocomplete();
	});

</script>
@endsection