@extends('themes.admin.'.setting('active_admin_theme').'.layouts.default')
@section('content')

	@push('custom-css')

	@endpush
	<div class="gadmin-pagesidebar-width-1">
		<div class="panel panel-default gadmin-pagesidebar-width-1-panel ">
			<!-- begin panel-heading -->
			<div class="panel-heading gadmin-pagesidebar-width-1-heading">
				<h4 class="panel-title">{{__('core.amenity')}}</h4>
			</div>
			<!-- end panel-heading -->
			<div class="gadmin-pagesidebar-body">
				<div class="gadmin-pagesidebar-main">
					<ul class="nav gadmin-pagesidebar-ul">
						<li>
							<a href="{{url('admin/utility/add_amenity')}}" class=" gadmin-pagesidebar-options-success"><i class="fa fa-plus"></i> {{__('core.add').' '.__('core.amenity')}}</a>
						</li>
						<li>
							<form id="deleteForm" class="gadmin-pagesidebar-options-danger-button" action="{{url('admin/ajax/bulk_delete/Amenity')}}" method="POST">
								<button type="submit" id="deleteChecked" name="bulkDelete" class="gadmin-pagesidebar-options-danger"  style="display:none"><i class="fa fa-trash"></i> {{__('core.bulk_delete')}}</button>
							</form>
						</li>
					</ul>
					<ul class="nav gadmin-pagesidebar-ul gadmin-mhide">
						<li><hr></li>
						<li><a class=" active">{{__('core.amenities')}}</a></li>
						<li><a href="{{url('admin/utility/amenity_categories')}}" class="">{{__('admin.amenity_categories')}}</a></li>
					</ul>
				</div>
			</div>
		</div>
	</div>
	<div class="gadmin-pagesidebar-width-2">
		<!-- begin panel -->
		<div class="panel panel-default " data-sortable-id="ui-widget-6">
			<div class="panel-heading">
				<div class="panel-heading-btn">
					<a href="javascript:;" class="btn btn-xs btn-icon btn-circle btn-default" data-click="panel-expand"><i class="fa fa-expand"></i></a>
				</div>
				<h4 class="panel-title">
					{{$title}}
				</h4>
			</div>
			<div id="info-alert" class="alert" style="display:none">
				<span class="close" onclick="$('#info-alert').fadeOut()">×</span>
				<div class="alert-container"></div>
			</div>
			<div class="panel-body">
				<div class="table-responsive">
				<form id="deleteForm" action="{{url('admin/ajax/bulk_delete/'.$object_type)}}" method="POST">
					<table class="table table-striped table-bordered table-hover" width="100%" id="beDataTable" data-href="{{url('admin/ajax/getDataTableData/'.$object_type )}}" data-object="{{$object_type}}" data-cols="id,name,icon,get_category_name,module,object_name,created_at,id">
						<thead>
						<tr>
							<th width="1%" data-orderable="false" data-bulk="true" data-name="id"><input id="select_all" name="select_all" value="1" type="checkbox"></th>
							<th class="text-nowrap" data-name="name">{{__('core.name')}}</th>
							<th class="text-nowrap" data-name="icon">{{__('core.icon')}}</th>
							<th class="text-nowrap" data-name="get_category_name" data-func="get_category_name" data-search="false">{{__('core.category')}}</th>
							<th class="text-nowrap" data-name="module">{{__('core.modules')}}</th>
							<th class="text-nowrap" data-name="object_name">{{__('core.object_name')}}</th>
							<th class="text-nowrap" data-name="created_at" data-time="true">{{__('core.created_at')}}</th>
							<th class="text-nowrap" data-action="true" data-edit="admin/utility/add_amenity" data-delete="true" data-name="id">{{__('core.actions')}}</th>
						</tr>
						</thead>
					</table>
				</form>
				</div>
			</div>
		</div>
	</div>
	<!-- end panel -->
	@push('custom-js')
		<script>
			$(document).ready(function() {
				//beDataTable('#beDataTable');
				var rows_selected = [];
				// Clients Table Init
				var clients = $('#dt-amenities').DataTable( {
					"lengthMenu": [[10, 25, 50, 100, 500, 1000, 5000, -1], [10, 25, 50, 100, 500, 1000, 5000, "All"]],
					"processing": true,
					"ajax": site_root + "admin/ajax/dt_feed/Amenity",
					"columns": [
						{
							"width": "4%",
							"data": "id",
							"render": function(data, type, row ){
								return  '<input type="checkbox" data-id="' + data + '">';
							}
						},
						{ "data": "name"},
						{ "data": "icon"},
						{ "data": "category"},
						{ "data": "modules" },
						{ "data": "object_name" },
						{ "data": "created_at" },
						{
							"data": "id",
							"render": function ( data, type, row ){
								return '<a href="' + site_root + 'admin/utility/edit_amenity/' + data +'" class="btn btn-xs btn-success dt-item-edit" data-toggle="tooltip" data-placement="top" data-title="{{__('edit')}}" class="btn btn-xs btn-success editAmenity action-btn"><i class="fa fa-edit"></i></a> ' +
										'<a href="#" data-id="' + data + '" class="btn btn-xs btn-danger dt-delete" data-toggle="tooltip" data-placement="top" data-title="{{__('delete')}}"><i class="fa fa-trash-alt"></i></a> '; <!--' + site_root + 'admin/ajax/delete_object/Amenity/' + data +'-->
							},
						}
					],
					"order": [[1, 'asc']],
					"buttons": [
						{ extend: "copy", className: "btn-sm", exportOptions: {columns: [1,2,3,4,5,6]} },
						{ extend: "csv", className: "btn-sm", exportOptions: {columns: [1,2,3,4,5,6]} },
						{ extend: "excel", className: "btn-sm", exportOptions: {columns: [1,2,3,4,5,6]} },
						{ extend: "pdf", className: "btn-sm", exportOptions: {columns: [1,2,3,4,5,6]} },
						{ extend: "print", className: "btn-sm", exportOptions: {columns: [1,2,3,4,5,6]} }
					],
					//"responsive": true,
					"dom": "Bflrtip",
				});

				// Handle click on checkbox
				$('#dt-amenities tbody').on('click', 'input[type="checkbox"]', function(e){
					var $row = $(this).closest('tr');
					// Get row data
					var data = clients.row($row).data();
					// Get row ID
					var rowId = $row.children().children().attr('data-id');
					// Determine whether row ID is in the list of selected row IDs
					var index = $.inArray(rowId, rows_selected);
					// If checkbox is checked and row ID is not in list of selected row IDs
					if(this.checked && index === -1){
						rows_selected.push(rowId);
						// Otherwise, if checkbox is not checked and row ID is in list of selected row IDs
					} else if (!this.checked && index !== -1){
						rows_selected.splice(index, 1);
					}

					if(this.checked){
						$row.addClass('selected');
					} else {
						$row.removeClass('selected');
					}
					// Update state of "Select all" control
					updateDataTableSelectAllCtrl(clients);
					// Prevent click event from propagating to parent
					e.stopPropagation();
				});
				// Handle click on table cells with checkboxes
				$('#dt-amenities').on('click', ' a.deleteButton', function(e){
					$(this).parent().parent().parent().find('input[type="checkbox"]').trigger('click');
				});
				// Handle click on "Select all" control
				$('thead input[name="select_all"]', clients.table().container()).on('click', function(e){
					if(this.checked){
						$('#dt-amenities tbody input[type="checkbox"]:not(:checked)').trigger('click');
					} else {
						$('#dt-amenities tbody input[type="checkbox"]:checked').trigger('click');
					}
					// Prevent click event from propagating to parent
					e.stopPropagation();
				});
				// Init Actions
				clients.on('draw', function(){
					// Init tooltips
					$('.action-btn').tooltip();
					// Bind events here
					$('.dt-delete').on('click', function(e){
						let id = $(this).attr('data-id');
						$(this).closest('tr').addClass('selected');
						Swal.fire({
							title: 'Are you sure?',
							text: "You won't be able to revert this!",
							type: 'warning',
							showCancelButton: true,
							confirmButtonColor: '#3085d6',
							cancelButtonColor: '#d33',
							confirmButtonText: 'Yes!',
							preConfirm: (isConfirm) => {
								if (isConfirm) {
									// Write a deleting function in jobs/ajax controller which will take object as param and process deletions with bool return then uncomment /if/ below
									$.post(site_root + 'admin/ajax/delete_object/Amenity/' + id ,{}).done(function(data){
										// Remove deleted row and re-draw the table
										if(data)
											clients.row('.selected').remove().draw();
									});
								}else{
									return false;
								}
							}
						});
					});
					// Update state of "Select all" control
					updateDataTableSelectAllCtrl(clients);
					//init_swal('dt-delete');
				});
				function updateDataTableSelectAllCtrl(table){
					var $table             = table.table().node();
					var $chkbox_all        = $('tbody input[type="checkbox"]', $table);
					var $chkbox_checked    = $('tbody input[type="checkbox"]:checked', $table);
					var chkbox_select_all  = $('thead input[name="select_all"]', $table).get(0);

					if (chkbox_select_all != undefined) {
						// If none of the checkboxes are checked
						if($chkbox_checked.length === 0){
							$('#deleteChecked, .deleteChecked').hide();
							chkbox_select_all.checked = false;
							if('indeterminate' in chkbox_select_all){
								chkbox_select_all.indeterminate = false;
							}
							// If all of the checkboxes are checked
						} else if ($chkbox_checked.length === $chkbox_all.length){
							$('#deleteChecked, .deleteChecked').show();
							chkbox_select_all.checked = true;
							if('indeterminate' in chkbox_select_all){
								chkbox_select_all.indeterminate = false;
							}
							// If some of the checkboxes are checked
						} else {
							$('#deleteChecked, .deleteChecked').show();
							chkbox_select_all.checked = true;
							if('indeterminate' in chkbox_select_all){
								chkbox_select_all.indeterminate = true;
							}
						}
					}
				}
				// Handle form submission event
				$('#deleteForm, .deleteForm').on('submit', function(e){
					var form = this;
					// Iterate over all selected checkboxes
					$.each(rows_selected, function(index, rowId){
						// Create a hidden element
						$(form).prepend($('<input>').attr('type', 'hidden').attr('name', 'id[]').val(rowId));
					});
					e.preventDefault();
					var title = 'Are you sure?';
					var text = 'You will not be able to recover this data anymore!';
					var confirmBtn = 'Yes, delete it!';
					var cancelBtn = 'No, cancel please!';
					var get_lang = $.post(site_root + 'admin/ajax/get_swal_lang/warning');
					get_lang.done(function( lang ) {
						if(lang) {
							title = lang.title;
							text = lang.text;
							confirmBtn = lang.confirm;
							cancelBtn = lang.cancel;
						}
					});

					// Swal dialog
					setTimeout(function() {
						Swal.fire({
							title: title,
							text: text,
							type: 'warning',
							showCancelButton: true,
							confirmButtonColor: "#DD6B55",
							confirmButtonText: confirmBtn,
							cancelButtonText: cancelBtn,
							preConfirm: (isConfirm) => {
								if (isConfirm) {
									form.submit();
								} else {
									return false;
								}
							},
						});
					},200);
				});
			})
		</script>
	@endpush
@endsection