@extends('adminlte::page')
@section('content')
<?php Fun::lang() ?>
<div class="title-add">
	<div class="page-bar">
		<ul class="page-breadcrumb">
			<li> <a class="ng-binding" href="#"><i class="fa fa-dashboard"></i> Dashboard</a> </li>
			<li> <a href="#">Manage User</a> </li>
			<li> <a class="ng-binding" href="#">User</a> </li>
		</ul>
	</div>
</div>
<div id="page" class="page">
	<div class="top-content">
		<div class="row">
			<div class="col-sm-12 col-xs-12">
				<div class="title-add">
					<div class="pull-left">
						<h3>User</h3>
					</div>
				</div>
				<div class="pull-right">
					@can('User-Create')
						<a href="{{route('users.create')}}" class="button_primary button_sm"><span class="fa fa-plus"></span> Create New</a>
					@endcan
				</div>
			</div>
		</div>
	</div>
	<div class="box-body table-responsive">
		<table id="datatable_users" class="table table-striped table-bordered table-hover nowrap">
			<thead>
				<tr>
					<th>NO</th>
					<th>Name</th>
					<th>Email</th>
					<th>Gender</th>
					<th>Phone Number</th>
					<th>DOB</th>
					<th>Position Title</th>
					<th>Role</th>
					<th>Address</th>
					<th>Status</th>
					<th>Action</th>
				</tr>
			</thead>
			<tbody>

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


<div class="modal fade bs-modal-lg" id="form_delete" tabindex="-1" role="dialog" aria-hidden="true">
	<div class="modal-dialog modal-dm">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
				<h3 class="modal-title">Are you sure?</h3>
			</div>
			<br />
			<form role="form" method="delete" id="delete">
				{{csrf_field()}}
				<div class="row">
					<div class="col-md-12">
						<div class="col-md-10">
							<h4>Are you want to delete?</h4>
						</div>
					</div>
				</div>
				<div class="modal-footer">
					<button type="button" data-dismiss="modal" class="button_danger"><i class="fa fa-close"></i> No</button>
					<button type="button" class="button_primary deleteRecord" data-toggle="modal"><i class="fa fa-save"></i> OK</button>
				</div>
			</form>
		</div>
	</div>
</div>
<div class="modal fade bs-modal-lg" id="block-permission" tabindex="-1" role="dialog" aria-hidden="true">
	<div class="modal-dialog modal-dm">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
				<h3 class="modal-title">Update Status on allowing User To Block Item</h3>
			</div>
			<br />
			<div class="modal-footer">
				<button type="button" data-dismiss="modal" class="button_danger"><i class="fa fa-close"></i> No</button>
				<a href="" class="button_primary btn-submit-allowance" data-toggle="modal"><i class="fa fa-save"></i> OK</a>
			</div>
		</div>
	</div>
</div>
@endsection



@section('js')

<script type="text/javascript">
	$(document).on('click', '.viewPopLink', function() {
		$('#form_delete').modal('show');
		var id = $(this).data("id");
		var status = $(this).data("status");
		$(".deleteRecord").click(function() {
			$.ajax({
				url: "/realty/users/" + id,
				type: 'DELETE',
				data: {
					"id": id,
					"status": status,
					_token: '{{ csrf_token() }}',
				},
				success: function() {
					$('#form_delete').modal('hide');
					location.reload();
				}
			});
		});
	});
	$(document).on('click', '.btn-allow-block-item', function() {
		var id = $(this).data('id');
		var route = "{{route('users-allowance.block-item',':id')}}";
		route = route.replace(':id',id);
		$('.btn-submit-allowance').attr('href',route);
		$('#block-permission').modal('show');
	});



	$(document).ready(function() {

		$('.main-spinner').show();
		$('#datatable_users').DataTable({

			ordering: false,
			"serverSide": true,
			"lengthMenu": [
				[20, 30, 50, 100, -1],
				[20, 30, 50, 100, "All"]
			],
			ajax: "{{ route('datatable.get_users') }}",

			columns: [{
					data: 'DT_RowIndex'
				},
				{
					data: 'user_name'
				},
				{
					data: 'email'
				},
				{
					data: 'user_gender'
				},
				{
					data: 'user_phone'
				},
				{
					data: 'user_dob'
				},
				{
					data: 'name'
				},
				{
					data: 'role'
				},
				{
					data: 'address'
				},
				{
					data: 'status'
				},
				{
					data: 'action'
				},

			],
		});
		$.fn.dataTable.ext.errMode = 'throw';
	});
</script>
@stop