<!DOCTYPE html>
<html lang="en">
    

<?php include 'includes/head.php'; ?> 

<link href="assets/css/scrollspyNav.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" href="plugins/select2/select2.min.css">
<body class="form">

    <!-- BEGIN LOADER -->
    <div id="load_screen"> <div class="loader"> <div class="loader-content">
        <div class="spinner-grow align-self-center"></div>
    </div></div></div>
    <!--  END LOADER -->

    <!--  BEGIN NAVBAR   -->
    <?php include 'includes/nav-bar.php'?>
    <!--   END NAVBAR  -->

    <!--  BEGIN MAIN CONTAINER  -->
    <div class="main-container" id="container">

        <div class="overlay"></div>
        <div class="search-overlay"></div>

        <?php include 'includes/sidebar.php'; ?>
        
        <!--  BEGIN CONTENT AREA  -->
        <div id="content" class="main-content">
            <div class="layout-px-spacing">

                <div class="row layout-top-spacing">
                
                <div id="flLoginForm" class="col-lg-12 layout-spacing">
	    <div class="statbox widget box box-shadow">
		<div class="widget-header">
			<div class="row">
				<div class="col-xl-12 col-md-12 col-sm-12 col-12">
					<h4 id="registerString">Create User</h4></div>
			</div>
		</div>
		<div class="widget-content widget-content-area">
			<form id="user_registration" onsubmit="return false">
				<!-- <div class="form-group mb-4">
					<input type="text" class="form-control" id="parent_id" placeholder="Added By:" disabled="" value="">
				</div> -->
				<div class="form-group mb-4">
					<input type="text" class="form-control" id="client_name" placeholder="UserID" value="">
				</div>

                <div class="form-group mb-4">
					<input type="password" class="form-control" id="client_password" placeholder="Password" value="">
				</div>

                <div class="form-group mb-4">
					<label style="color: black; font-weight: bold;">User Role</label>
                <select class="form-control form-small" id="userRole">
                
                </select>
                </div>
               
				<!-- <div class="form-group mb-4">
                <input type="email" class="form-control" id="client_user" placeholder="User name / Email" value="">
				</div> -->
                <small id="emailHelp" class="form-text text-muted">*Required Fields</small>
				<button type="submit" id="btnRegis" class="btn btn-primary mt-4">Create User</button>
				 
			</form>
		</div>
	</div>
</div>

                </div>
            </div>

            <?php include 'includes/footer-area.php'; ?>
        </div>
        <!--  END CONTENT AREA  -->


    </div>
    <!-- END MAIN CONTAINER -->

   <?php include 'includes/footer.php';?>
   
   <script src="assets/js/scrollspyNav.js"></script>
    <script src="plugins/select2/select2.min.js"></script>
    <script src="plugins/select2/custom-select2.js"></script>
    <script>


                $.ajax({
                    type:'GET',
                    dataType: "json",
                    url:'DB/getUserRoles.php',
                    success:function success(data){
                     
                   
                     for(var i = 0; i <=data.data.length; i++){
                        if(data.data[i].id ==1){

                        }else{
                        
                        $('#userRole').append($('<option>', {
                        value:data.data[i].id,
                        text: data.data[i].role_name
                        }));
                        }
                       
                   
                     }
                    
                    
                    }
       
                }) 

                $("#btnRegis").on("click",function(){
                   if($("#client_name").val().length>0 &&
                   $("#client_password").val().length>0 ){
                    $.ajax({
                    type:'POST',
                    dataType: "json",
                    data : {
                    user: $("#client_name").val(),
                    password: $("#client_password").val(),
                    role:$('#userRole').val()
                    },
                    url:'DB/register.php',
                    success:function success(data){
                      
                      Snackbar.show({
                        text: data.response,
                        pos: 'top-center'
                     });
                     if(data.status){
                        $("#client_name").val("")
                        $("#client_password").val("")
                     }
                    
                    }
       
                }) 
                   }else{
                    Snackbar.show({
                        text: 'Fields are required',
                        pos: 'top-center'
                     });
                   }
                   
                })

    </script>
</body>
</html>