@extends('layouts.app')

@section('content')
<div style="background:white;width:99%;padding:10px;border-radius:5px;">
	<div>
		@foreach($getcompanyname as $getcompanyname)
                        {!! str_replace('companyname_newadminacnt##-arraydivider-##', ' ', $primarydetails[0]) !!}'s Users list
		@endforeach
	</div>
	<span class='linkeffect create_new_staff_user' accountid='{{$accountid}}' style='font-size:13px;'>Create User</span>
    <table width="100%" class="table table-bordered table-striped table-hover">
        <tr width='100%' class="trheader">
            <th width='25%'>Name</th>
            <th width='20%'>Email</th>
            <th width='10%'>Projects</th>
            <th width='10%'>Tasks</th>
            <th width='10%'>Tickets</th>
            <th width='10%'>Stats</th>
            <th width='10%'>Unfinished</th>
            <th width='5%'></th>
        </tr>

        @foreach($userslist as $userslist)
	        <tr width='100%' class="trheader">
	            <td width='25%'>{{$userslist->userfullname}}</td>
	            <td width='20%'>{{$userslist->email}}</td>
	            <td width='10%'>0</td>
	            <td width='10%'>0</td>
	            <td width='10%'>0</td>
	            <td width='10%'>0</td>
	            <td width='10%'>0</td>
	            <td width='5%' class='icons_activities' userid='{{$userslist->userid}}'></td>
	        </tr>
        @endforeach
	</table>
</div>

<script>
	$( document ).ready(function() {
		$('.icons_activities').each(function (index) {
			var deleteicon = "<svg class='bi bi-trash' width='1em' height='1em' viewBox='0 0 16 16' fill='currentColor' xmlns='http://www.w3.org/2000/svg'><path d='M5.5 5.5A.5.5 0 0 1 6 6v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zm2.5 0a.5.5 0 0 1 .5.5v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zm3 .5a.5.5 0 0 0-1 0v6a.5.5 0 0 0 1 0V6z'/><path fill-rule='evenodd' d='M14.5 3a1 1 0 0 1-1 1H13v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V4h-.5a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1H6a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1h3.5a1 1 0 0 1 1 1v1zM4.118 4L4 4.059V13a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1V4.059L11.882 4H4.118zM2.5 3V2h11v1h-11z'/></svg>";

			var edit_rowicon = "<svg class='bi bi-pen' width='1em' height='1em' viewBox='0 0 16 16' fill='currentColor' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' d='M5.707 13.707a1 1 0 0 1-.39.242l-3 1a1 1 0 0 1-1.266-1.265l1-3a1 1 0 0 1 .242-.391L10.086 2.5a2 2 0 0 1 2.828 0l.586.586a2 2 0 0 1 0 2.828l-7.793 7.793zM3 11l7.793-7.793a1 1 0 0 1 1.414 0l.586.586a1 1 0 0 1 0 1.414L5 13l-3 1 1-3z'/><path fill-rule='evenodd' d='M9.854 2.56a.5.5 0 0 0-.708 0L5.854 5.855a.5.5 0 0 1-.708-.708L8.44 1.854a1.5 1.5 0 0 1 2.122 0l.293.292a.5.5 0 0 1-.707.708l-.293-.293z'/><path d='M13.293 1.207a1 1 0 0 1 1.414 0l.03.03a1 1 0 0 1 .03 1.383L13.5 4 12 2.5l1.293-1.293z'/></svg>";

			$(this).html("<span class='linkeffect edit_usersaccount' style='color:coral;'>"+edit_rowicon+"</span> <span class='linkeffect' style='color:red;'>"+deleteicon+"</span>");
		});
		$(".icons_activities").attr("style", "text-align:right;");
	});
	// this is to create a new user account for the company create_new_staff_user
	$(document).on("click", '.create_new_staff_user', function(event) {
		widthbody = $("body").width();
		halfwidth = widthbody/2
		halfwidth = halfwidth - 200;

		var fullform = "<ul class='list-inline'>";
			fullform += "<li style='margin-bottom:5px;'>Name<br><input type='text' class='registerform-input-ajaxform form_fullname' style='width:100%;'></li>";
			fullform += "<li style='margin-bottom:5px;'>Email<br><input type='text' class='registerform-input-ajaxform form_email' style='width:100%;'></li>";
			fullform += "<li style='margin-bottom:5px;'>Username<br><input type='text' class='registerform-input-ajaxform form_username' style='width:100%;'></li>";
			fullform += "<li style='margin-bottom:5px;'>Password<br><input type='text' class='registerform-input-ajaxform form_password' style='width:100%;'></li>";
			fullform += "<li style='margin-bottom:5px;'><span class='linkeffect create_new_staff_user__post'>Create</span></li>";
			fullform += "<ul>";
		$(".topnavigation-style").after("<div class='createnew_user_wraps'><table class='headerwraps' width='100%'><tr width='100%'><td width='95%'>Create New User</td> <td width='5%' style='text-align:right;'><span class='linkeffect remove_pseudo'>x</span></td></tr></table>"+fullform+"</div>");

		$(".createnew_user_wraps").attr("style", "position:absolute; width:400px;margin-left:"+halfwidth+"px;margin-top:100px; background:white;border:1px solid rgba(128,128,128,0.4); border-radius:5px; box-shadow: 1px 0px 5px 0px rgba(173,173,173,1);z-index:9999999;padding:5px;");
	});

	// this is to remove the pseudopage remove_pseudo
	$(document).on("click", '.remove_pseudo', function(event) {
		$(".createnew_user_wraps").remove();
	});

	// this is to create new user create_new_staff_user
	$(document).on("click", '.create_new_staff_user__post', function(event) {
		$(".error_wraps").remove();
		var fullname = $(".form_fullname").val();
		var email = $(".form_email").val();
		var username = $(".form_username").val();
		var password = $(".form_password").val();
		var adminid = $(".create_new_staff_user").attr("accountid");

		if(fullname == '' || email == '' || username == '' || password == '' || adminid == ''){
			alert("All fields must be entered");
			return;
		}

	    var baseURL = $(".baseURL").attr("baseURL");
	    var baseURL = baseURL+"/create_new_staffuser_profile";
	    $.ajaxSetup({
	        headers: {
	            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
	        }
	    });
	    $.ajax({
	        type:'POST',
	        url:baseURL,
	        data:{adminid:adminid, fullname:fullname, email:email, username:username, password:password},
	        success:function(data){
	        var data = data.trim();
			
			var deleteicon = "<svg class='bi bi-trash' width='1em' height='1em' viewBox='0 0 16 16' fill='currentColor' xmlns='http://www.w3.org/2000/svg'><path d='M5.5 5.5A.5.5 0 0 1 6 6v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zm2.5 0a.5.5 0 0 1 .5.5v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zm3 .5a.5.5 0 0 0-1 0v6a.5.5 0 0 0 1 0V6z'/><path fill-rule='evenodd' d='M14.5 3a1 1 0 0 1-1 1H13v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V4h-.5a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1H6a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1h3.5a1 1 0 0 1 1 1v1zM4.118 4L4 4.059V13a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1V4.059L11.882 4H4.118zM2.5 3V2h11v1h-11z'/></svg>";

			var edit_rowicon = "<svg class='bi bi-pen' width='1em' height='1em' viewBox='0 0 16 16' fill='currentColor' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' d='M5.707 13.707a1 1 0 0 1-.39.242l-3 1a1 1 0 0 1-1.266-1.265l1-3a1 1 0 0 1 .242-.391L10.086 2.5a2 2 0 0 1 2.828 0l.586.586a2 2 0 0 1 0 2.828l-7.793 7.793zM3 11l7.793-7.793a1 1 0 0 1 1.414 0l.586.586a1 1 0 0 1 0 1.414L5 13l-3 1 1-3z'/><path fill-rule='evenodd' d='M9.854 2.56a.5.5 0 0 0-.708 0L5.854 5.855a.5.5 0 0 1-.708-.708L8.44 1.854a1.5 1.5 0 0 1 2.122 0l.293.292a.5.5 0 0 1-.707.708l-.293-.293z'/><path d='M13.293 1.207a1 1 0 0 1 1.414 0l.03.03a1 1 0 0 1 .03 1.383L13.5 4 12 2.5l1.293-1.293z'/></svg>";

	        if(data == 'userexist'){
	        	$(".headerwraps").append("<div class='error_wraps' style='font-size:13px;color:orangered;'>The Email or Username already exists. Please change.</div>");
	        }else{
	        	var row = "<tr>";
	        		row +="<td>"+fullname+"</td>";
	        		row +="<td>"+email+"</td>";
	        		row +="<td>0</td>";
	        		row +="<td>0</td>";
	        		row +="<td>0</td>";
	        		row +="<td>0</td>";
	        		row +="<td>0</td>";
	        		row +="<td style='text-align:right;'><span class='linkeffect' style='color:coral;'>"+edit_rowicon+"</span> <span class='linkeffect' style='color:red;'>"+deleteicon+"</span></td>";
	        		row +="</tr>";

	        	$(".trheader").after(row);
	        	$(".createnew_user_wraps").remove();
	        }

	      }
	    });
	});

	// this is to redirect to the users profile edit_usersaccount
	$(document).on("click", '.edit_usersaccount', function(event) {
		getuserid = $(this).parent().attr("userid");
		var base_url = window.location.origin;
	    // alert(APP_URL);
	    window.location.replace(base_url+"/profile/"+getuserid);
	});
</script>
@endsection