<style>
	th, td { text-align: center; }
	@media (min-width: 768px){
		.modal-dialog {
			width: 350px;
			margin: 30px auto;
		}
	}
</style>
<div class="row">
	<div class="col-md-12">
		<div class="portlet box blue-hoki">
			<div class="portlet-title">
				<div class="caption">
					<i class="fa fa-cogs"></i><strong>Contact List</strong> 
				</div>
				<ul class="nav nav-tabs">
					<li class="active">
						<a href="/contacts"> Contacts <?php if(getContactUnread() <> ""){ ?><span class="badge badge-danger pull-right"><?php echo getContactUnread();?></span><?php } ?> </a>
					</li>
					<?php if($_SESSION['group_id'] == 1){ ?>
					<li>
						<?php 
							if(getStatusCompanyFriend($_SESSION['company_id']) > 0 && $_SESSION['group_id'] == 1){ 
								$unread_contact = getStatusCompanyFriend($_SESSION['company_id']);
							}else{
								$unread_contact = "";
							}
						?>
						<a href="/companies"> Importers <?php if($unread_contact <>  ""){?><span class="badge badge-danger pull-right"><?php echo $unread_contact; ?> </span><?php }?></a>
					</li>
					<?php }else{ ?>					
					<li>
						<a href="/companies"> Freight Forwarders <?php if($unread_contact <>  ""){?><span class="badge badge-danger pull-right"><?php echo $unread_contact; ?> </span><?php }?></a>
					</li>
					<?php } ?>
				</ul>
			</div>
			<div class="portlet-body">
				<div class="row" style="margin-bottom:10px;">
					<div class="col-md-6 col-sm-6">
					</div>
					<div class="col-md-6 col-sm-6">
						<div class="pull-right">
							<button class="btn blue btn-circle add-user"> Add New <i class="fa fa-plus"></i></a></button>					
						</div>
					</div>
				</div>
				<div class="row">
					<div class="col-md-6 col-sm-6">
					</div>
					<div class="col-md-6 col-sm-6">
						<div class="pull-right">
							<label>Search :&nbsp;&nbsp;<input type="text" data-column="0" class="search-input-text input-sm input-small input-inline form-control form-filter"></label>
						</div>
					</div>
				</div>
				<div id='suksesupdate' class="alert alert-success alert-block fade in" style='display:none;'>
					<strong><i class="icon-ok-sign"></i>Success! </strong>Yehaa.. Your profile has been updated
				</div>
				<div id='gagalupdate' class="alert alert-danger alert-block fade in" style='display:none;'>
					<strong><i class="icon-ok-sign"></i>Whoops! </strong>Your profile cant be updated, please try again later ( Make sure you make any changes to your profile when update )
				</div>
				<table class="table table-striped table-hover table-bordered" id="contact">
					<thead>
						<tr>
							<th>
								<center>Profile Picture</center>
							</th>
							<th>
								<center>Name</center>
							</th>
							<th>
								<center>Mobile</center>
							</th>
							<th>
								<center>Role</center>
							</th>
						</tr>
					</thead>
					<tbody>
						<tr>
							<td class="table-status"></td>
							<td class="table-title"></td>
							<td class="table-title"></td>
							<td class="table-title"></td>
						</tr>
					</tbody>
				</table>
			</div>
		</div>
	</div>
</div>
<div class="modal fade bs-modal-sm in" id="user-detail" tabindex="-1" role="basic" aria-hidden="true">
	<div class="modal-dialog modal-sm">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
			</div>
			<div class="modal-body" id="getCode"> 
			</div>
		</div>
	</div>
</div>
<div class="modal fade bs-modal-sm  in" id="add-user" tabindex="-1" role="basic" aria-hidden="true">
	<div class="modal-dialog  modal-sm">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
			</div>
			<div class="modal-body form">
				<div class="form-horizontal form-row-seperated">
					<div class="form-group">
						<div class="col-md-12">
							<div class="input-group">
								<input type="text" id="typeahead_example_modal_3" name="typeahead_example_modal_3" class="form-control" placeholder="Find contact by using Phone No/Name" />
								<span class="input-group-addon">
								<i class="fa fa-search" aria-hidden="true"></i>
								</span>
							</div>
						</div>
					</div>
					<div id="getCode2">
						<div class="row">
							<br>
							<center>No result found.</center>
							<br>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>