Oxbian/SIDPS
1
0
Fork 0
mirror of https://github.com/Oxbian/SIDPS.git synced 2025-07-07 20:33:51 +02:00
Code Issues Actions Packages Projects Releases Wiki Activity

tri dynamique

Browse Source
This commit is contained in:
fra-2107
2024-11-25 19:22:02 -05:00
parent d0152a84f6
commit f31862d63b
4 changed files with 100 additions and 46 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
web2/index.html
View File

@ -10,8 +10,10 @@
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous"> integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
<link href="/css/styles.css" rel="stylesheet"> <link href="/css/styles.css" rel="stylesheet">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.slim.min.js" <!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.slim.min.js"
integrity="sha256-pasqAKBDmFT4eHoN2ndd6lN370kFiGUFyTiUHWhU7k8=" crossorigin="anonymous"></script> integrity="sha256-pasqAKBDmFT4eHoN2ndd6lN370kFiGUFyTiUHWhU7k8=" crossorigin="anonymous"></script> -->
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js" <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"
integrity="sha256-x3YZWtRjM8bJqf48dFAv/qmgL68SI4jqNWeSLMZaMGA=" crossorigin="anonymous"></script> integrity="sha256-x3YZWtRjM8bJqf48dFAv/qmgL68SI4jqNWeSLMZaMGA=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.4.1/js/bootstrap.min.js" <script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.4.1/js/bootstrap.min.js"
@ -54,16 +56,18 @@
<p class="lead">veuillez selectionner les filtres de recherche ou parcourez la liste ci-dessous</p> <p class="lead">veuillez selectionner les filtres de recherche ou parcourez la liste ci-dessous</p>
<!-- ici les filtres --> <!-- ici les filtres -->
<!-- <form class="row g-3" method="POST"> --> <div class="row g-3" method="POST">
<div class="col-auto"> <div class="col-auto">
<select class="form-select" aria-label="Choisir un niveau d'alerte" name="event_gravite" id="risque-select"> <select class="form-select" aria-label="Choisir un niveau d'alerte" name="event_gravite"
id="risque-select">
<option selected value="">Niveau d'alerte</option> <option selected value="">Niveau d'alerte</option>
</select> </select>
</div> </div>
<div class="col-auto"> <div class="col-auto">
<select class="form-select" aria-label="Chosisir une device" name="device-select" id="device-select"> <select class="form-select" aria-label="Chosisir une device" name="device-select"
id="device-select">
<option selected value="">Appareil de détection</option> <option selected value="">Appareil de détection</option>
</select> </select>
</div> </div>
@ -72,19 +76,20 @@
<div class="col-auto ms-auto me-0"> <div class="col-auto ms-auto me-0">
<button class="btn btn-primary mb-3" id="filter-button">Filtrer</button> <button class="btn btn-primary mb-3" id="filter-button">Filtrer</button>
</div> </div>
</div>
<table class="table table-striped"> <table class="table table-striped">
<thead class="bg-primary text-white"> <thead class="bg-primary text-white">
<tr> <tr>
<th scope="col" class="id">N°</th> <th scope="col" class="id" id="id">N°</th>
<th scope="col" class="Date">Date</th> <th scope="col" class="Date" id="date_alerte">Date</th>
<th scope="col" class="label">Nom alerte</th> <th scope="col" class="label" id="name">Nom alerte</th>
<th scope="col" class="label">Appareil de détection</th> <th scope="col" class="label" id="device_product">Appareil de détection</th>
<th scope="col" class="label">Adresse source</th> <th scope="col" class="label" id="src">Adresse source</th>
<th scope="col" class="label">Adresse destination</th> <th scope="col" class="label" id="dst">Adresse destination</th>
<th scope="col" class="label">Niveau d'alerte</th> <th scope="col" class="label" id="agent_severity">Niveau d'alerte</th>
<th scope="col" class="label">Raison</th> <th scope="col" class="label" id="reason">Raison</th>
</tr> </tr>
</thead> </thead>
<tbody style="border: 1px solid black;" id="tab-alert"> <tbody style="border: 1px solid black;" id="tab-alert">

83
web2/js/alerts.js
View File

@ -2,15 +2,17 @@
// initialisation // initialisation
let previousAlerts = []; let previousAlerts = [];
let sortOrder = {};
ajaxRequest('GET', 'php/request.php/alertes/', CheckNewAlerts);
// ajaxRequest('GET', 'php/request.php/alertes/', displayAlerts); // ajaxRequest('GET', 'php/request.php/alertes/', displayAlerts);
setInterval(() => { setInterval(() => {
// Effectuer une requête AJAX pour récupérer les nouvelles alertes
ajaxRequest('GET', 'php/request.php/alertes/', CheckNewAlerts); ajaxRequest('GET', 'php/request.php/alertes/', CheckNewAlerts);
}, 1000); // Effectuer une requête AJAX pour récupérer les nouvelles alertes
}, 10000);
ajaxRequest('GET', 'php/request.php/devices/', fillSelectDevice); ajaxRequest('GET', 'php/request.php/devices/', fillSelectDevice);
fillSelectRisque(); fillSelectRisque();
// filtrage // filtrage
$('#filter-button').click(() => { $('#filter-button').click(() => {
const params = []; // Initialise le tableau des paramètres const params = []; // Initialise le tableau des paramètres
@ -36,22 +38,16 @@ $('#filter-button').click(() => {
} }
); );
$('#tweets').on('click', '.mod', () => {
ajaxRequest('PUT', 'php/request.php/tweets/' + // $('#tweets').on('click', '.del', () => {
$(event.target).closest('.mod').attr('value'), () => { // console.log('delete');
ajaxRequest('GET', 'php/request.php/tweets/', displayTweets); // ajaxRequest('DELETE', 'php/request.php/tweets/' +
}, 'login=' + login + '&text=' + prompt('Nouveau tweet :')); // $(event.target).closest('.del').attr('value') + '?login=' + login, () => {
} // ajaxRequest('GET', 'php/request.php/tweets/', displayTweets);
); // }
$('#tweets').on('click', '.del', () => { // );
console.log('delete'); // }
ajaxRequest('DELETE', 'php/request.php/tweets/' + // );
$(event.target).closest('.del').attr('value') + '?login=' + login, () => {
ajaxRequest('GET', 'php/request.php/tweets/', displayTweets);
}
);
}
);
//------------------------------------------------------------------------------ //------------------------------------------------------------------------------
//--- displayAlerts ------------------------------------------------------------ //--- displayAlerts ------------------------------------------------------------
@ -98,3 +94,52 @@ function CheckNewAlerts(newAlerts) {
previousAlerts = newAlerts; previousAlerts = newAlerts;
} }
} }
// Fonction pour trier les alertes
function sortTable(columnName) {
const currentOrder = sortOrder[columnName] || 'asc';
const newOrder = currentOrder === 'asc' ? 'desc' : 'asc';
sortOrder[columnName] = newOrder;
// Construire les paramètres de la requête pour l'orderby
const params = [];
params.push(`orderby=${columnName}`);
params.push(`order=${newOrder}`);
const url = `php/request.php/alertes/?${params.join('&')}`;
// Effectuer la requête AJAX pour récupérer les alertes triées
ajaxRequest('GET', url, displayAlerts);
}
// Ajouter des gestionnaires d'événements de clic sur les en-têtes de colonnes
$('th').click(function() {
let columnName = $(this).text().trim().toLowerCase().replace(/ /g, '_'); // Convertir le texte de l'en-tête en nom de colonne
switch (columnName) {
case 'n°':
columnName = 'id';
break;
case 'date':
columnName = 'date_alerte';
break;
case 'nom_alerte':
columnName = 'name';
break;
case 'appareil_de_detection':
columnName = 'device_product';
break;
case 'adresse_source':
columnName = 'src';
break;
case 'adresse_destination':
columnName = 'dst';
break;
case 'niveau_d\'alerte':
columnName = 'agent_severity';
break;
case 'raison':
columnName = 'reason';
break;
}
sortTable(columnName);
});

4
web2/php/database.php
View File

@ -31,7 +31,7 @@
// Function to get all alertes // Function to get all alertes
// \param db The connected database. // \param db The connected database.
// \return The list of alertes. // \return The list of alertes.
function dbRequestAlerts($db, $filtres = null) function dbRequestAlerts($db, $filtres = null, $orderby, $order)
{ {
try try
{ {
@ -49,6 +49,8 @@
$request .= ' WHERE ' . implode(' AND ', $conditions); $request .= ' WHERE ' . implode(' AND ', $conditions);
} }
$request .= " ORDER BY $orderby $order";
$statement = $db->prepare($request); $statement = $db->prepare($request);
$statement->execute($params); $statement->execute($params);
$result = $statement->fetchAll(PDO::FETCH_ASSOC); $result = $statement->fetchAll(PDO::FETCH_ASSOC);

8
web2/php/request.php
View File

@ -21,17 +21,19 @@ $request = explode('/', $request);
if ($request[1] == 'alertes') { if ($request[1] == 'alertes') {
if ($requestMethod == 'GET') { if ($requestMethod == 'GET') {
$orderby = isset($_GET['orderby']) ? $_GET['orderby'] : 'date_alerte'; // Par défaut, trier par date_alerte
$order = isset($_GET['order']) && ($_GET['order'] == 'desc') ? 'DESC' : 'ASC'; // Par défaut, ordre croissant
$filtresArray = []; $filtresArray = [];
if(isset($_GET['device_product'])) if(isset($_GET['device_product']))
$filtresArray['device_product'] = $_GET['device_product']; $filtresArray['device_product'] = $_GET['device_product'];
if(isset($_GET['agent_severity'])) if(isset($_GET['agent_severity']))
$filtresArray['agent_severity'] = $_GET['agent_severity']; $filtresArray['agent_severity'] = $_GET['agent_severity'];
error_log('filtres array : ' . json_encode($filtresArray));
if (!empty($filtresArray)) { if (!empty($filtresArray)) {
$data = dbRequestAlerts($db, $filtresArray); $data = dbRequestAlerts($db, $filtresArray, $orderby, $order);
} else { } else {
$data = dbRequestAlerts($db, null); $data = dbRequestAlerts($db, null, $orderby, $order);
} }
} }