понедельник, 27 мая 2019 г.

Splunk. Time-picker options.

Приветствую, уважаемый читатель!

Иногда встроенных возможностей селекторов Splunk больше, чем хотелось бы видеть. Так вышло и с селектором «Time», с помощью которого задаётся время для отбора событий. О том, как из него выкинуть почти все встроенные опции как его можно слегка упростить сегодня поговорим J




Немного теории
Для управления любым содержимым на дашборде можно использовать скрипты на ЯП JavaScript и файлы таблицы стилей CSS. Соответственно, к дашборду необходимо подключить собственный скрипт JS или файл CSS. Делается это в секции <form> или  <dashboard>:

<form script="simple.js"  stylesheet="simple.css">
<dashboard script="simple.js"  stylesheet="simple.css">

Сами файлы должны располагаться в директории /appserver/static того приложения Splunk, в рамках которого создан дашборд. По умолчанию:
/opt/splunk/etc/apps/search/appserver/static

Задача стоит следующая: из стандартного набора опций в селекторе «Time» оставить только выбор диапазона дат.

Стандартное меню селектора «Time» выглядит следующим образом:



Если открыть код данного элемента в html, то видно, что каждой вкладке соответствует своё имя (data-test-panel-id) в тэге Div.



Для сокрытия ненужных элементов можно отключить их видимость на странице. В CSS файле simple.css нужно добавить следующее:

div[data-test^='real-time-column'],
div[data-test^='other'],
div[data-test-panel-id^='presets'],
div[data-test-panel-id^='dateTime'],
div[data-test-panel-id^='advanced'],
div[data-test-panel-id^='realTime'],
div[data-test-panel-id^='relative']
{
display: none !important;
}

После этого необходимо перезагрузить web-интерфейс Splunk:

/opt/splunk/bin/splunk restart splunkweb
или
/opt/splunk/bin/splunk restart


Теперь селектор «Time» выглядит вот так:


  
Если нет желания подключать CSS файл к дашборду, то можно вписать необходимые настройки прямо в код дашборда в специально созданную панель (panel), тогда при сохранении CSS стили сразу применяться.

Сделать это можно так:

  <row depends="$tokShow$">
    <panel>
      <html>
      <style>
        div[data-test^='real-time-column'],
        div[data-test^='other'],
        div[data-test-panel-id^='presets'],
        div[data-test-panel-id^='dateTime'],
        div[data-test-panel-id^='advanced'],
        div[data-test-panel-id^='realTime'],
        div[data-test-panel-id^='relative']
        {
        display: none !important;
        }              
      </style>   
    </html>
    </panel>
  </row>

Дополнительно к тэгу <row> я добавил опцию depends, которая позволяет скрывать на дашборд визуальные элементы. В данном случае до тех пор, пока токену $tokShow$ не будет присвоено значение.

На дашборде скрытые элементы выглядят вот так:


Всем удачного использования!

Комментариев нет:

Отправить комментарий