tri dynamique

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

View File

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