rengine/web/startScan/static/startScan/js/vulnerability-datatables-suggestions.js

var vulnerabilitySearchWrapper = document.querySelector("#vulnerability-search-input");
var vulnerabilityInputBox = vulnerabilitySearchWrapper.querySelector("input");
var vulnerabilitySuggBox = vulnerabilitySearchWrapper.querySelector(".autocom-box");
var vulnerability_filter_icon = `<i class="fe-filter"></i>`;

var vulnerability_col_suggestions = [
  'name',
  'type',
  "tag",
  "severity",
  "cve_id",
  "cwe_id",
  "cvss_score",
  "http_url",
  "status",
  "cvss_metrics",
  "template",
  "template_id",
];

var vulnerability_condition_suggestions = [
  "=",
  "!",
  ">",
  "<",
];

var vulnerability_joiner = [
  "&",
  "|"
];

var vulnerability_suggestion_selector = vulnerability_col_suggestions;

vulnerabilityInputBox.onclick = (event) => {
  emptyArray = vulnerability_suggestion_selector.filter((data)=>{
    return data.toLocaleLowerCase();
  });
  badge_color = "warning";
  emptyArray = emptyArray.map((data)=>{
    switch (data) {
      case "=":
      title = `Filters vulnerability <span class="badge badge-soft-success">Equals</span> Some Value`;
      break;
      case "!":
      title = `Filters vulnerability <span class="badge badge-soft-danger">Not Equals</span> Some Value`;
      break;
      case ">":
      title = `Filters vulnerability <span class="badge badge-soft-blue">Greater than</span> Some Value`;
      break;
      case "<":
      title = `Filters vulnerability <span class="badge badge-soft-blue">Less than</span> Some Value`;
      break;
      case "&":
      title = `<span class="badge badge-soft-danger">& and</span> Match vulnerability if <span class="badge badge-soft-danger">all args</span> are true`;
      break;
      case "|":
      title = `<span class="badge badge-soft-warning">| or</span> Match vulnerability if <span class="badge badge-soft-warning">either of one</span> is true`;
      break;
      default:
      badge_color = "info";
      title = `Filter vulnerability that contains <span class="badge badge-soft-blue">${data}</span>`;
    }
    return data = `<li id="dropdown-li" class="text-dark"><div class="row"><div class="col-6" id="filter_name"><span class="text-${badge_color}">${vulnerability_filter_icon} </span>${data}</div><div class="col-6 text-dark" id="filter_name"> ${title}</span></div></div></li>`;
  });

  vulnerabilitySearchWrapper.classList.add("active");
  vulnerability_showSuggestions(emptyArray);
  let allList = vulnerabilitySuggBox.querySelectorAll("li");
  for (let i = 0; i < allList.length; i++) {
    allList[i].setAttribute("onclick", "vulnerability_select(this)");
  }
}

function vulnerability_showSuggestions(list){
  let listData;
  listData = list.join('');
  vulnerabilitySuggBox.innerHTML = listData;
}

function vulnerability_select(element){
  let selectData = element.textContent.split(" ")[0];
  vulnerabilityInputBox.value = $('#vulnerability-search').val() + selectData;
  $("#vulnerability-search").focus();
}

vulnerability_col_suggestions_used = true;

$('#vulnerability-search').on("change paste keyup", function(event) {
  user_input = $(this).val();
  if (event.which == 13 || event.which == 27) {
    vulnerabilitySearchWrapper.classList.remove("active");
    $('#vulnerability-search-button').click();
    return;
  }
  if (user_input.length == 0) {
    vulnerability_suggestion_selector = vulnerability_col_suggestions;
    $('#vulnerability-search-button').click();
    vulnerability_col_suggestions_used = true;
  }

  cond_split_val = $(this).val().split(new RegExp('[=><!&|]', 'g'));

  last_obj = cond_split_val.slice(-1)[0];

  if (vulnerability_col_suggestions.indexOf(last_obj) > -1) {
    vulnerability_suggestion_selector = vulnerability_condition_suggestions;
    vulnerability_col_suggestions_used = false;
  }

  else if (["=", "!", ">", "<"].indexOf($(this).val().slice(-1)) > -1) {
    vulnerability_suggestion_selector = vulnerability_joiner;
    vulnerability_col_suggestions_used = false;
  }


  else if (["&", "|"].indexOf($(this).val().slice(-1)) > -1) {
    vulnerability_suggestion_selector = vulnerability_col_suggestions;
    vulnerability_col_suggestions_used = true;
  }

  if (vulnerability_col_suggestions_used) {
    vulnerability_suggestion_selector = vulnerability_col_suggestions.filter((data)=>{
      return data.toLocaleLowerCase().includes(last_obj.toLocaleLowerCase());
    });
  }

  document.getElementById("vulnerability-search").click();
});

$(document).on('click', function (e) {
  // console.log($(e.target).attr('id'));
  if ($(e.target).attr('id') != 'vulnerability-search' && $(e.target).attr('id') != 'filter_name') {
     vulnerabilitySearchWrapper.classList.remove("active");
   }
});