<?php
	include('views/_header.tpl.php');
?>

<style>
	body { background:#f9f9f9; }
	.spacer { padding-top:45px; }
	#mmen { display:none; }
    .form-profile { padding:20px; }
    table { background:#fff; }
    p, td { font-weight:200; }
    table td { padding: 5px; } 
    
	.admintable td,
	.admintable th {
		padding: 10px;
		border: solid #eee 1px;
	}
	
	.btn,
	.btn a,
	.btn a:active,
	.btn a:visited {
		background:#aaa; 
		color:#fff;
		border-radius: 50px;
		-moz-border-radius: 50px;
		-webkit-border-radius: 50px;
		font-size: 14px !important;
		font-weight: 300 !important;
		height: 30px !important;
		line-height: 30px !important;
		min-width: 60px;
		width:auto;
		padding: 5px 20px !important;
	}

	a.btn:hover {
		background:#006ab7;
	}	
	
	input.btn-small { 
		background:#aaa; 
		color:#fff;
		border-radius: 50px;
		-moz-border-radius: 50px;
		-webkit-border-radius: 50px;
		font-size: 12px !important;
		font-weight: 300 !important;
		height: 30px !important;
		min-width: 60px;
		width:auto;
		padding:0 15px;
	 }
	input.btn-small:hover { 
		background:#bbb;
	}
	
	input[type="submit"], .submit { border:0px; }
	input[type="submit"]:hover { background:#006ab7; }
	
	/* label, select, button, input[type="button"], input[type="reset"], input[type="submit"], input[type="radio"], input[type="checkbox"]	*/

	.btn-red {
		font-size: 14px; 
		border-radius: 50px;
		-moz-border-radius: 50px;
		-webkit-border-radius: 50px;
	}

	.btn-blue {
		background: #005493;
		border-radius: 50px;
		-moz-border-radius: 50px;
		-webkit-border-radius: 50px;
	}
	
	.delete-admin {
		background: #cd1000;
	}

	.adminred {
		background: #cd1000;
		color: #fff;
	}

	.nonadmin {
		background: #ddd;
		color: #aaa;
	}

	.pagination {
		list-style-type: none;
		padding: 10px 0;
		display: inline-flex;
		justify-content: space-between;
		box-sizing: border-box;
	}

	.pagination li {
		box-sizing: border-box;
		padding-right: 10px;
	}

	.pagination li a {
		box-sizing: border-box;
		background-color: #e2e6e6;
		padding: 8px;
		text-decoration: none;
		font-size: 12px;
		font-weight: bold;
		color: #616872;
		border-radius: 4px;
	}

	.pagination li a:hover {
		background-color: #d4dada;
	}

	.pagination .next a,
	.pagination .prev a {
		text-transform: uppercase;
		font-size: 12px;
	}

	.pagination .currentpage a {
		background-color: #518acb;
		color: #fff;
	}

	.pagination .currentpage a:hover {
		background-color: #518acb;
	}

	.searching {
		display: flex;
		flex-direction: row;
		margin: 10px 0px;
		justify-content: start;
		gap: 10px;
		align-items: center;
	}

	.search {
		padding: 10px;
	}

	.submit {
		background-color: #005493;
	}
	.ut-header{
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
	}	
	
	.blockit, .blockithalf, .blockitlabel { float:left; display:inline-block; width: 200px; padding-right:10px; }
	.viewall { margin-left:15px; }
	
/* ################################### */
/*                        MOBILE STYLES                      */
/* ################################### */

/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) {
        .form-profile {
            padding: 20px 0px;
            width: 85%;
        }        
}

/* Landscape phone to portrait tablet */
@media (max-width: 767px) {

}

/* Landscape phones and down */
@media (max-width: 586px) {
	.spacer { padding-top:55px; }
	.form-profile { padding-top:0px; }	
	.tablescroll { height: 500px; overflow-x:scroll; }
	.blockit { width:100%; display:block; background:none;  text-align:center; margin-bottom:10px; }
	.blockithalf { float:left; width:50%; display:inline-block; background:none; text-align:center; margin-bottom:10px; 
	-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }	
	.right { padding-right:0px; }
	.viewall { margin-left:0px; }
}

/* Landscape phones and down */
@media (max-width: 480px) {
	.spacer { padding-top:15px; }
	.form-profile { padding-top:0px; }
	.tablescroll { height: 500px; overflow-x:scroll; }
	.blockit { width:100%; display:block; background:none; text-align:center; margin-bottom:10px; }	
	.blockithalf { float:left; width:50%; display:inline-block; background:none; text-align:center; margin-bottom:10px; 
	-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
	.right { padding-right:0px; }
	.viewall { margin-left:0px; }
}    

@media (max-width: 320px) {
	.tablescroll { height: 500px; overflow-x:scroll; }
}    
</style>
    
    <div class="tab-pane accordion-content" style=" padding-top:0px;">
        <div class="form form-profile aif" style='width:auto;'>
            
		<h1 style="text-align:center;">
			<a href="/admin/dash"><i class="fa fa-sliders" aria-hidden="true" style=""></i></a>&nbsp; Manage Users 
			<a href="/admin/users"><img src="/static/client/scroll_hands.png" style="height:30px;" alt="<>" /></a>				
		</h1>            
        
        <!--<i class="fa fa-caret-down" style="float:right; margin:3px 5px 0 5px;"></i>-->
        
		<div class="ut-headerxxx" style="margin-bottom:15px;">
			<form method="post" action="/admin/users" style="margin-bottom:0px; width:100%;">

				<div class="searchingxxx">
					<div class="blockit" style="">
						<input class="txt" type="text" class="search" name="search" value="<?php echo $_POST['search']; ?>" 
						placeholder="Search by Name/Email"
						style="border:1px solid #ddd; padding:11px 10px 12px; display:block; max-width:700px; font-size:15px;">						
					</div>

					<div class="blockithalf" style="padding-right:10px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;">
						<select name="is_admin" class="txt" style="padding:10px; font-size:15px; max-width:700px; height:45px;">
							<option value="" <?php if($_POST['is_admin'] == '') echo "selected"; ?>>Select one</option>
							<option value="1" <?php if($_POST['is_admin'] == '1') echo "selected"; ?>>Admins</option>
						</select>
					</div>
					
					<div class="blockithalf right" style="-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;">
						<select name="permissions" class="txt" style="padding:10px; font-size:15px; max-width:700px; height:45px;">
							<option value="" <?php if($_POST['permissions'] == '') echo "selected"; ?>>Select Level</option>
							<option value="1" <?php if($_POST['permissions'] == '1') echo "selected"; ?>>Level 1</option>
							<option value="2" <?php if($_POST['permissions'] == '2') echo "selected"; ?>>Level 2</option>
							<option value="3" <?php if($_POST['permissions'] == '3') echo "selected"; ?>>Level 3</option>
							<option value="4" <?php if($_POST['permissions'] == '4') echo "selected"; ?>>Level 4</option>
						</select>		
					</div>			
	
					<div class="blockithalf" style="padding-right:10px;">
						<select name="usertype" class="txt" style="padding:10px; font-size:15px; max-width:700px; height:45px;">
							<option value="" <?php if($_POST['usertype'] == '') echo "selected"; ?>>Select UserType</option>
							<option value="Customer" <?php if($_POST['usertype'] == 'Customer') echo "selected"; ?>>Customers</option>
							<option value="Team" <?php if($_POST['usertype'] == 'Team') echo "selected"; ?>>Team</option>
							<option value="Admin" <?php if($_POST['usertype'] == 'Admin') echo "selected"; ?>>Admins</option>
						</select>	
					</div>
					
					<div class="blockithalf right" style="margin:3px 0; max-width:150px;">
						<input type="submit" class="submit" value="search" style="width:100%; display:block;">
					</div>
					<div class="blockithalf right" style="margin:3px 0; max-width:150px;">
						<a href="/admin/users" class="btn" style="display:block;">View All Users</a>
					</div>					
				</div>

			</form>

			<!--<div class="blockit viewall" style="min-width:130px; text-align: right;">	
				<a href="/admin/users" class="btn" style="display:block;">View All Users</a>
			</div>-->
			<div class="clear"></div>
		</div>        
		<div class="clear"></div>
        
        <div class="tablescroll" style="">
        
        <table class="admintable" id="projects_table" style="width:100%; overflow:hidden;">
            <tr>
                <th>Name, Email, Ph</th>
                <th>Type</th>
                <th>Level</th>
                <th>Cust + Device Info</th>
                <th>RegDate</th>
                <th>Edit</th>
            </tr>

            <?php
            foreach ($users as $squser) :
                if($squser['deviceType'] == 'Android'){
                    $deviceType = 'Android';
                } else {
                    $deviceType = 'iOS';
                }
                if($squser['given_name'] !=''){
                    $customer_name = $squser['given_name'] . " ". $squser['family_name'] ;
                }else{
                    $customer_name = "Not provided";
                }      
                         
                if(strlen($squser['phone']) == 11){
                    $formatted_phone =  "1 (".substr($squser['phone'],1,3).") ".substr($squser['phone'],4,3)."-".substr($squser['phone'],7);
                 }elseif(strlen($squser['phone']) == 10){
                    $formatted_phone_number = $squser['phone'];
                    $formatted_phone =  "(".substr($squser['phone'],0,3).") ".substr($squser['phone'],3,3)."-".substr($squser['phone'],6);
                }elseif(strlen($squser['phone']) > 0){
                    $formatted_phone_number = $squser['phone'];
                    $formatted_phone = $squser['phone'];
                }else{
                    $formatted_phone_number = '0';
                    $formatted_phone = '<span style="color:#ff0000; font-weight:600;">Not provided</span>';
                }
                
                if($squser['square_id'] != ''){
                    $square_cust_id = $squser['square_id'];
                } else {
                    $square_cust_id = '<span style="color:#ff0000; font-weight:600;">Missing Customer ID</span>';
                }
                
                 ?>
            
                <tr data-uid="<?= $squser['id'] ?>">
                    <td>
						<img src="/static/images/users/agency/<?= $squser['image'] ?>" style="border:3px solid #fff; border-radius:50%; height:75px; width:auto; min-width:75px; object-fit: cover; margin-right:10px;" 
                        onerror="this.src='/static/images/users/default-avatar.jpg'" align="left">
                        
                        <h2 style="font-weight:800; font-size:15px; margin-bottom:1px; padding-bottom:1px; margin-top:10px;">
                        <?= $customer_name?>
                        </h2>
                        <a href="mailto:<?= $squser['email'] ?>" title="Email"><?= $squser['email'] ?></a><br />
                        <a href="tel:<?= $formatted_phone_number ?>" title="Call"><?= $formatted_phone ?></a>                        
                    </td>
                    <td style="text-align: center;"><?= $squser['usertype'] ?></td>
                    <td style="text-align: center;"><?= $squser['permissions'] ?></td>
                    <td><?= $squser['device_id'] ?><br />
                        <span style="font-weight:600;">SQID:</span> <?= $square_cust_id ?><br />
                        <span style="font-weight:600;">Type:</span> <?= $deviceType ?>
                        <?php if($squser['square_id'] =="") : ?>
                            <br />
                        <form class="" action="/api/webservices/index.php?command=SquareCreateCustomer" method="post" 
                        style="margin-top: 0px;" target="_blank">
                            <input type="hidden" id="sq_id" name="sq_id" placeholder="0" value="<?= $squser['id'] ?>">
                    
                            <input type="submit" value="Create Square ID" class="btn-small" style="margin:7px 0 3px;" />
                        
                            <!--<input type="hidden" id="interestedin" name="interestedin" placeholder="vip" value="vip">-->
                        </form>
                        <?php endif; ?>
                        
                    </td>
                    <td style="text-align:center;"><?= date("m-d-Y h:i A", strtotime($squser['reg_date'])) ?></td>
                    <td style="text-align:center;"><a href="/admin/?squareuser&edit=<?= $squser['id'] ?>" 
                    title="<?= $squser['name'] ?>" target="_blank" style="text-align:center;">Edit</a>
                        <br /><br />
						<a href='/admin/users?squareuser&delete=<?= $squser['id'] ?>'>Delete</a><br />
                        <a href='/admin/users?squareuser&delete=<?= $squser['id'] ?>' class='delete-user confirm' ><img 
                        src="/static/images/icons/delete_icon.png" alt="Delete!" 
                        style="height:15px; width:15px" /></a>
                    </td>
                </tr>
            <?php
            endforeach; ?>

        </table>
        </div><!-- SCROLLING DIV -->

    </div><!--end: .tab-pane (Approvals) -->
</div>         

<?php
	include('views/_footer.tpl.php');
?>