@extends('app')
{{-- Web site Title --}}
@section('title') Week Offs :: @parent @stop

@section('content')
	<div class="content-wrapper">
		<div class="content-header">
			<div class="container-fluid mt-3">
				@include('partials.nav') 
				<div class="row mb-2">
					<div class="col-sm-4">
						<h2>Week Offs</h2>
						<h5>{{$organization->name}}</h5>
					</div>
					<div class="col-sm-8 textM-right"> 
						<a href="/organization/{{$alias}}/dashboard" class="btn btn-secondary btn-radius mt-4">
                            Back
						</a>
						<a href="/{{$alias}}/week-off/create" class="btn btn-secondary btn-radius mt-4">
							<i class="fa fa-plus-circle"></i> Add New
						</a>
					</div>
				</div>
			</div>
		</div>
		<section class="content mb-5">
			<div class="container-fluid">
				<div class="row">
					<section class="col-lg-12 connectedSortable">
						<div class="card">
							<div class="card-body pl-0 pr-0">
								<div class="table-responsive">
									<table class="table table-striped table-bordered admintable table newtabstriped border-0" cellspacing="0" width="100%" id="dataGrid">
										<thead>
											<tr>
												<th>DAY</th>
												<th>WEEK</th>
												<th>OFF TYPE</th>
												<th></th>
											</tr>
										</thead>
										<tbody>
											@foreach($data as $weekOff)
											<tr>
												<td>
													{{$weekOff->day}}
												</td>
												<td>
													{{$weekOff->week}}
												</td>
												<td>
													{{$weekOff->off_type}}
												</td>
												<td>
													<div class="dropdown">
														<a class="admintabledrop" data-toggle="dropdown" href="#" aria-expanded="true"> 
															<i class="fa fa-ellipsis-h"></i>
														</a>
														<div class="dropdown-menu dropdown-menu-md tableaction dropdown-menu-right" style="left: inherit; right: 0px;">
															<ul>
																<li>
																	<a href="/{{$alias}}/week-off/{{$weekOff->id}}/edit">
																		Edit
																	</a>
																</li>
																<li>
																	<a href="#" onclick="deleteRow({{$weekOff->id}})">
																		Delete
																	</a>
																</li>
															</ul>
														</div>
													</div>
												</td>
											</tr>
											@endforeach
										</tbody>
									</table>
								</div>
							</div>
						</div>
					</section>
				</div>
			</div>
		</section>
	</div>
	<aside class="control-sidebar control-sidebar-dark"></aside>

@endsection

{{-- Scripts --}}
@section('scripts')
    @parent
    <script>
		var oTable;
		
		$(document).ready(function() {
			$('#dataGrid').DataTable({
			    language: { search: "" },
			    'aoColumnDefs': [{
			        'bSortable': false,
			        'aTargets': [-1],
			    }],
			    buttons : [],
			    "language": {
			      	search: '', searchPlaceholder: "Search...",
				    "paginate": {
				      	"previous": "<i class='fa fa-chevron-left'></i>",
				      	"next": "<i class='fa fa-chevron-right'></i>"
				    }
				},
				'olanguage': { 'sSearch': '', 'sSearchPlaceholder': "Search" },
				"ordering": false,
				"info":     true, 
			});
			$("div.toolbar").html('<h3 class="card-title">Total Results: {{count($data)}}</h3>');
		});	

		function deleteRow(id) {
	        swal({
			  title: "",
			  text: "Are you sure?",
			  type: "warning",
			  buttons: ['CANCEL', 'OK']
			}).then(function(isConfirm) {
	       		if(isConfirm){
		        	var data = '';
		        	// swal('Deleted');
		        	$.ajax({
				        url: '/{{$alias}}/week-off/'+id+'/delete' ,
				        type: 'GET',
				        data: data,
				        success:function(data) {
		        			// swal('Deleted');
		        			window.location.reload();
				        }
				    });
		        }
	    	});
		}
    </script>
@endsection