wazuh-syscheck.ihtml

{$form.javascript}
<form {$form.attributes}>  
  <div id='tab1' class='tab'>
    <table class="ToolbarTable table">
      <tr>
        <td>
          <h4>Host</h4>
        </td>
        <td>
          <h4>Search by type</h4>
        </td>
        <td>
          <h4>Search by file name</h4>
        </td>
        <td>
          <p style="padding-bottom:4px; font-weight:700;" class="total-title">Total elements: {$elemArrLength}</p>
        </td>
        <td>
          <h4>Elements per page</h4>
        </td>
      </tr>
      <tr>
        <td>
          {$form.host.html}
        </td>
        <td>
          {$form.typeFilter.html}
        </td>
        <td>
          <input style="padding-top: 4px;" type="text" id="searchInput" placeholder="Write a file name...">
        </td>
        <td>
          <div>
            <button class="btc bt_success" id="prevButton">previous</button> 
            <button class="btc bt_success" id="nextButton">next</button> 
          </div>
        </td>
        <td>
          {$form.page.html}
        </td>
      </tr>
      <tr>
        <td style="padding-top: 4px;">{$form.SearchB.html}</td>     
        <td></td> 
        <td></td>
        <td>
          <p style="padding-bottom:4px; font-weight:700;">Page count: {$nbPage}</p>
          <p style="padding-bottom:4px; font-weight:700;" id="page_act"></p>
        </td>  
      </tr>
    </table>
  </div>
  <form method="post">          
    <input type="submit" name="force_scan" class="btc bt_success" value="Force scan" />
    <div>
      <p style="padding-bottom:4px; font-weight:700;">Last scan started: {$lastScanStart}</p>
      <p style="padding-bottom:4px; font-weight:700;">Last scan ended: {$lastScanEnd}</p>
    </div>
  </form>
  <table class="ListTable" id="myTable" style="margin-top: 30px;">
		<tr class="ListHeader">
			<th class="ListColHeaderCenter" id="fileHeader">{$headerMenu_file} ↕</th>
			<th class="ListColHeaderCenter">{$headerMenu_type}</th>
			<th class="ListColHeaderCenter" id="sizeHeader">{$headerMenu_size} ↕</th>
			<th class="ListColHeaderCenter">{$headerMenu_uname}</th>
      <th class="ListColHeaderCenter">{$headerMenu_gname}</th>
			<th class="ListColHeaderCenter">{$headerMenu_perm}</th>
      <th class="ListColHeaderCenter" id="dateHeader">{$headerMenu_date} ↕</th>
		</tr>
		{section name=elem loop=$elemArr}
      <td class="ListColCenter file">{$elemArr[elem].RowMenu_file}</td>
      <td class="ListColCenter">{$elemArr[elem].RowMenu_type}</td>
			<td class="ListColCenter size">{$elemArr[elem].RowMenu_size}</td>
			<td class="ListColCenter">{$elemArr[elem].RowMenu_uname}</td>
      <td class="ListColCenter">{$elemArr[elem].RowMenu_gname}</td>
			<td class="ListColCenter">{$elemArr[elem].RowMenu_perm}</td>
      <td class="ListColCenter date">{$elemArr[elem].RowMenu_date}</td>
		</tr>
		{/section}	
	</table>
  {$form.hidden}
</form>

<script type='text/javascript'>
var nbRows = {$elemArrLength};
var pageSize = {$pageSize};
var curPage = {$curPage};
document.getElementById("page_act").innerHTML = "Current page: " + curPage;
var statusCodeScan = {$statusCodeScan};
</script>


<script type='text/javascript' src="./modules/centsoc/utils.js"></script>

{literal}
<script type='text/javascript'>
if(statusCodeScan==200){
  alert("Scan successfully executed.");
}

renderTable();
function renderTable() {
  var table = document.getElementById("myTable");
  let start = (curPage-1)*pageSize;
  let end = curPage*pageSize;

  var rows = Array.from(table.getElementsByTagName("tr")).slice(1);
  rows.forEach(function(row, index) {
  // Récupérer la valeur de la colonne (exemple : colonne d'indice 2)
  if (index >= start && index < end) {
    row.style.display = ""; // Afficher la ligne
  } else {
    row.style.display = "none"; // Cacher la ligne
  }
  });
}

document.querySelector('#nextButton').addEventListener('click', function(event){
  event.preventDefault();
  if((curPage * pageSize) < nbRows) curPage++;
  document.getElementById("page_act").innerHTML = "Current page: " + curPage;  
  renderTable();
});

document.querySelector('#prevButton').addEventListener('click',function(event){
  event.preventDefault();
  if(curPage > 1) curPage--;
  document.getElementById("page_act").innerHTML = "Current page: " + curPage;  
  renderTable();
});

// Récupérer la référence à l'en-tête de la colonne "severity"
var sizeHeader = document.getElementById("sizeHeader");

// Ajouter un écouteur d'événement au clic sur l'en-tête de la colonne "severity"
sizeHeader.addEventListener("click", function() {
  
  // Récupérer la référence à la table
  var table = document.getElementById("myTable");

  // Récupérer toutes les lignes du tableau, sauf l'en-tête
  var rows = Array.from(table.getElementsByTagName("tr")).slice(1);
  
  // Trier les lignes en fonction de la colonne "severity"
  rows.sort(function(a, b) {
    var sizeCellA = parseFloat(a.querySelector(".size").innerHTML);
    var sizeCellB = parseFloat(b.querySelector(".size").innerHTML);
    return sizeCellB - sizeCellA;
  });

  // Réorganiser les lignes dans le tableau
  rows.forEach(function(row) {
    table.appendChild(row);
  });
  
  renderTable();
});

// Récupérer la référence à l'en-tête de la colonne "severity"
var dateHeader = document.getElementById("dateHeader");

// Ajouter un écouteur d'événement au clic sur l'en-tête de la colonne "severity"
dateHeader.addEventListener("click", function() {
  
  // Récupérer la référence à la table
  var table = document.getElementById("myTable");

  // Récupérer toutes les lignes du tableau, sauf l'en-tête
  var rows = Array.from(table.getElementsByTagName("tr")).slice(1);
  
  // Trier les lignes en fonction de la colonne "severity"
  rows.sort(function(a, b) {
    var dateCellA = new Date(a.querySelector(".date").innerHTML);
    var dateCellB = new Date(b.querySelector(".date").innerHTML);
    return dateCellB - dateCellA;
  });

  // Réorganiser les lignes dans le tableau
  rows.forEach(function(row) {
    table.appendChild(row);
  });
  
  renderTable();
});

var searchInput = document.getElementById("searchInput");

// Ajouter un écouteur d'événement pour le changement de valeur de la barre de recherche
searchInput.addEventListener("input", function() {
  var searchText = searchInput.value.toLowerCase();
  checkText(searchText, ".file");
});

// Récupérer la référence à l'en-tête de la colonne "file"
var fileHeader = document.getElementById("fileHeader");

// Ajouter un écouteur d'événement au clic sur l'en-tête de la colonne "file"
fileHeader.addEventListener("click", function() {
  
  // Récupérer la référence à la table
  var table = document.getElementById("myTable");

  // Récupérer toutes les lignes du tableau, sauf l'en-tête
  var rows = Array.from(table.getElementsByTagName("tr")).slice(1);
  
  // Trier les lignes en fonction de la colonne "file"
  rows.sort(function(a, b) {
    var fileCellA = a.querySelector(".file").innerHTML.toLowerCase();
    var fileCellB = b.querySelector(".file").innerHTML.toLowerCase();
    return fileCellA.localeCompare(fileCellB);
  });

  // Réorganiser les lignes dans le tableau
  rows.forEach(function(row) {
    table.appendChild(row);
  });
  renderTable();
});

</script>
{/literal}