wazuh-cve.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 severity</h4>
        </td>
        <td>
          <h4>Search by title</h4>
        </td>
        <td>
          <h4>Search by CVE</h4>
        </td>
        <td style="text-align:center;">
          <h4>Critical</h4>
        </td>
        <td style="text-align:center;" >
          <h4>High</h4>
        </td>
        <td style="text-align:center;" >
          <h4>Medium</h4>
        </td>
        <td style="text-align:center;" >
          <h4>Low</h4>
        </td>
        <td style="text-align:center;" >
          <h4>Untriaged</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.severityFilter.html}
        </td>
        <td>
          <input style="padding-top: 4px;" type="text" id="searchInput" placeholder="Write a title...">
        </td>
        <td>
          <input style="padding-top: 4px;" type="text" id="searchInputCVE" placeholder="Write a CVE...">
        </td>
        <td style="text-align:center;" >
          <span class="badge service_critical">{$nbCritical}</span>
        </td>
        <td style="text-align:center;" >
          <span class="badge service_warning">{$nbHigh}</span>
        </td>
        <td style="text-align:center;" >
          <span class="badge ack">{$nbMedium}</span>
        </td>
        <td style="text-align:center;" >
          <span class="badge service_ok">{$nbLow}</span>
        </td>
        <td style="text-align:center;" >
          <span class="badge service_unknown">{$nbUntriaged}</span>
        </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></td>
        <td></td>
        <td></td>
        <td></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 Full Scan: {$lastFullScan}</p>
      <p style="padding-bottom:4px; font-weight:700;">Last Partial Scan: {$lastPartialScan}</p>
    </div>
  </form>
  <table class="ListTable" id="myTable" style="margin-top: 30px;">
		<tr class="ListHeader">
			<th class="ListColHeaderCenter">{$headerMenu_cve}</th>
			<th class="ListColHeaderCenter">{$headerMenu_condition}</th>
			<th class="ListColHeaderCenter" id="severityHeader">{$headerMenu_severity} ↕</th>
			<th class="ListColHeaderCenter" id="titleHeader">{$headerMenu_title} ↕</th>
      <th class="ListColHeaderCenter">{$headerMenu_type}</th>
			<th class="ListColHeaderCenter" id="scoreHeader">{$headerMenu_cvss3_score} ↕</th>
			<th class="ListColHeaderCenter" id="dateHeader">{$headerMenu_detection} ↕</th>
		</tr>
		{section name=elem loop=$elemArr}
		<tr class={$elemArr[elem].MenuClass}>
			<td class="ListColCenter">
        <a href={$elemArr[elem].RowMenu_link}>
          <div style="height:100%;width:100%" class="cve">
            {$elemArr[elem].RowMenu_cve}
          <div>
        </a>
      </td>
      <td class="ListColCenter">{$elemArr[elem].RowMenu_condition}</td>
			<td class="ListColCenter"><span class="badge {$elemArr[elem].RowMenu_badge} severity">{$elemArr[elem].RowMenu_severity}</span></td>
			<td class="ListColCenter title">{$elemArr[elem].RowMenu_title}</td>
			<td class="ListColCenter">{$elemArr[elem].RowMenu_type}</td>
			<td class="ListColCenter score">{$elemArr[elem].RowMenu_cvss3_score}</td>
			<td class="ListColCenter date">{$elemArr[elem].RowMenu_detection}</td>
		</tr>
		{/section}	
	</table>
  {$form.hidden}
</form>

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

<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>


{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 scoreHeader = document.getElementById("scoreHeader");

// Ajouter un écouteur d'événement au clic sur l'en-tête de la colonne "severity"
scoreHeader.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 scoreCellA = parseFloat(a.querySelector(".score").innerHTML);
    var scoreCellB = parseFloat(b.querySelector(".score").innerHTML);
    return scoreCellB - scoreCellA;
  });

  // 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 severityHeader = document.getElementById("severityHeader");

// Ajouter un écouteur d'événement au clic sur l'en-tête de la colonne "severity"
severityHeader.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 severityOrder = ["critical", "high", "medium", "low", "untriaged"];
    var severityCellA = a.querySelector(".severity").innerHTML.toLowerCase();
    var severityCellB = b.querySelector(".severity").innerHTML.toLowerCase();
    return severityOrder.indexOf(severityCellA) - severityOrder.indexOf(severityCellB);
  });

  // 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, ".title");
});

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

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

// 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();
});

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

// Ajouter un écouteur d'événement au clic sur l'en-tête de la colonne "title"
titleHeader.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 "title"
  rows.sort(function(a, b) {
    var titleCellA = a.querySelector(".title").innerHTML.toLowerCase();
    var titleCellB = b.querySelector(".title").innerHTML.toLowerCase();
    return titleCellA.localeCompare(titleCellB);
  });

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

</script>
{/literal}