@extends('admin')
@section('content')
<div class="page-content">
               <div class="container-fluid">
                  <div class="row">
                     <!-- Zero Configuration  Starts-->	
                     <div class="col-sm-12">
                        <div class="card">
                           <div class="card-body">
                              <h4 class="card-title d-flex align-items-center justify-content-between">Sub Admin List			  <a class="btn btn-primary btn-sm btn-float m-b-10" href="#addSubAdminModal" role="button" data-toggle="modal">Add Sub Admin</a></h4>
                              <table class="table table-striped table-bordered" id="subAdminList">
                                 <thead>
                                    <tr>
                                       <th>#</th>
                                       <th>Full Name</th>
                                       <th>User Name</th>
                                       <th>Admin Email</th>
                                       <th>Creation Date</th>
                                       <th>Status</th>
                                       <th>Action</th>
                                    </tr>
                                 </thead>
                              </table>
                           </div>
                        </div>
                     </div>
                  </div>
               </div>
            </div>
            <div class="modal fade" id="addSubAdminModal" tabindex="-1" role="dialog" aria-hidden="true">
               <div class="modal-dialog modal_right_side" role="document">
                  <div class="modal-content col-12 col-md-5">
                     <div class="modal-header">
                        <h5 class="modal-title">Add SubAdmin</h5>
                        <button class="close" type="button" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                     </div>
                     <div class="modal-body">
                        <form class="theme-form" id="subAdminFrm" name="subAdminFrm" method="post" >
                           <div class="row">
                              <input type="hidden" name="admin_id" value="">
                              <div class="form-group col-12">
                                 <label for="exampleInputEmail1">Name</label>
                                 <input type="text" name="sub_admin_name" id="sub_admin_name" class="form-control" placeholder="Enter Sub Admin Name"/>
                              </div>
                              <div class="form-group col-12">
                                 <label for="exampleInputEmail1">Email</label>
                                 <input type="email" name="email" id="email" class="form-control" placeholder="Enter Admin Email"/>
                              </div>
                              <div class="form-group col-12">
                                 <label for="exampleInputEmail1">User Name</label>
                                 <input type="text" name="user_name" id="user_name" class="form-control" placeholder="Enter Sub Admin Name"/>
                              </div>
                              <div class="form-group col-12">
                                 <label for="exampleInputEmail1">Password</label>
                                 <input type="password" name="password" id="password" class="form-control" placeholder="Enter Password"/>
                              </div>
                              <div class="form-group col-12">
                                 <button type="submit" class="btn btn-primary waves-light m-t-10" id="submitBtn" name="submitBtn">Submit</button>
                                 <button type="reset" class="btn btn-danger waves-light m-t-10">Reset</button>
                              </div>
                           </div>
                           <div class="form-group">
                              <div id="msg"></div>
                           </div>
                        </form>
                     </div>
                  </div>
               </div>
            </div>
            <div class="modal fade" id="editCategoryModal" tabindex="-1" role="dialog" aria-hidden="true">
               <div class="modal-dialog modal_right_side" role="document">
                  <div class="modal-content col-12 col-md-5">
                     <div class="modal-header">
                        <h5 class="modal-title">Edit Category</h5>
                        <button class="close" type="button" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                     </div>
                     <div class="modal-body batch_body">
                     </div>
                  </div>
               </div>
            </div>
@endsection
@section('pageLevelJS')
<script>
				var dataTable='';
				dataTable = $('#subAdminList').DataTable( {
							"processing": true,
							"serverSide": true,
							"order": [0,"desc"],
							"ajax":{"url":base_url+"subAdminList","type": "POST","dataType": "json"},
							"columns": [
										{ "data": "DT_RowIndex" },
										{ "data": "name" },
										{ "data": "username" },
										{ "data": "email" },
										{ "data": "created_at" },
										{ "data": "display_status" },
										{ "data": null },						
								],
								columnDefs: [{
									targets: [-1], render: function (a, b, data, d) {
										 var action='';
											
										 if (data.status == 'active') {
											action+='<a title="Inactivate" class="success blockUnblock" href="" id="success-'+data.id+'-users-id-status"><button class="btn btn-success btn-xs mr-1" type="button" title="Inactivate">Inactivate</button></a>';
										}
										else{
											action+='<a class="danger blockUnblock" href="" id="danger-'+data.id+'-users-id-status"><button class="btn btn-danger btn-xs mr-1" type="button" title="Activate">Activate</button></a>'; 
										} 
										return action;
									}
								}],								
							});												
							dataTable.on('page.dt', function() {
								$('html, body').animate({
									scrollTop: $(".dataTables_wrapper").offset().top-50						   
									}, 'slow');						
									});	
							
												
			
		</script>

@endsection