<div align="left" style="padding: 10px 0px;">
	<table width="100%">
    	<tr>
        	<td><h5 style="margin-top: 8px;"><i class="fas fa-users"></i> Notificaciones</h5></td>
            <td align="right" width="200">
            	<input class="form-control" type="text" placeholder="Búsqueda rápida..." id="buscador" />
            </td>
        </tr>
    </table>
</div>

<div align="right">
	<a href="?pg=notificaciones/detalle">
    <button type="button" class="btn btn-warning btn-sm" style="margin-bottom:15px">
		<i class="fa fa-plus btn-left"></i> Crear Notificación
	</button>
    </a>
</div>


<table class="table table-bordered table-sm">
	<thead class="thead-dark">
	<tr>
		<th scope="col">#</th>
        <th scope="col">Fecha</th>
		<th scope="col">Mensaje</th>
        <th scope="col">Tipo</th>
		<th scope="col" style="width: 75px; text-align:center">
        </th>
	</tr>
	</thead>
    
	<tbody id="tabla_lista">
	<?php
		$count = 1;
		$query = mysqli_query($connect,"SELECT * FROM Notificaciones ORDER BY id DESC ");
		while($data = mysqli_fetch_array($query)){
			
			$text_tipo = '';
			if($data["tipo"] == 1){ $text_tipo = 'Activo'; }
			if($data["tipo"] == 2){ $text_tipo = 'Inactivo'; }

			echo '
			<tr>
				<th scope="row">'.$count.'</th>
				<td>'.$data["created_at"].'</td>
                <td>'.$data["mensaje"].'</td>
				<td>'.$text_tipo.'</td>
				<td align="center">
					<a href="?pg=notificaciones/detalle&id='.$data["id"].'">
                    <button type="button" class="btn btn-success btn-sm" data-toggle="modal">
						<i class="fa fa-edit"></i>
					</button>
                    </a>
				</td>
			</tr>
			';
			$count++;
					
		}
	?>
	</tbody>
</table>

<script>
$(document).ready(function(){
	$("#buscador").on("keyup", function() {
		var value = $(this).val().toLowerCase();
		$("#tabla_lista tr").filter(function() {
		  $(this).toggle($(this).text().toLowerCase().indexOf(value) > -1)
		});
	});	  
});
</script>











<script src="js/functions.js"></script>