wazuh-kibana-app/public/templates/ruleset-rules.html

<div>
    <ul class="wazuh-submenu">
        <li class="active"><a>Rules</a></li>
        <li><a href="/app/wazuh#/ruleset/decoders">Decoders</a></li>
        <li><a href="/app/wazuh#/ruleset/update">Update</a></li>
    </ul>
</div>
<div ng-controller="rulesController" class="container">
    <div ng-if="load" style="text-align: center;">
        <img style="display: inline-block; width: auto;" src="/plugins/wazuh/img/loading.gif"></img>
    </div>
    <div class="row containerRuleset" ng-if="!load">
        <div id="messages" ng-show="message" class="settings-message-error" ng-bind-html="message">{{ message }}</div>
        <div class="leftCol">
            <h2 class="container_page_title">Rules</h2>
            <div style="width: 19%; height: 35px; border-radius: 4px; background-color: rgb(249, 249, 249); border: 1px solid rgb(204, 204, 204); float: left;">
                <div style="float: left;">
                    <form class="form-inline ng-pristine ng-valid">
                        <div class="form-group" style="position: relative;">
                            <i class="fa fa-search input_search_icon"></i>
                            <input type="text" ng-model="$parent.search" ng-change="objGet('/rules', 'rules')" class="form-control ng-pristine ng-untouched ng-valid rulesetSearch"
                                placeholder="Search...">
                        </div>
                    </form>
                </div>
            </div>
            <div style="margin-left: 10px; width: 202px; height: 35px; border-radius: 4px; background-color: rgb(249, 249, 249); border: 1px solid rgb(204, 204, 204); float: left; text-align: left;">
                <div ng-class="{ ruleset_button_active: rfStatus == 'enabled' }" ng-click="setRulesFilter('status', 'enabled')" style="font-weight: bold; border-radius: 0px; width: 100px;"
                    class="rulesetFilter">Enabled </div>
                <div ng-class="{ ruleset_button_active: rfStatus == 'disabled' }" ng-click="setRulesFilter('status', 'disabled')" style="font-weight: bold; border-radius: 0px; width: 100px;"
                    class="rulesetFilter">Disabled </div>
            </div>
            <div class="form-group ruleLevel_div">
                <label class="ruleLevel_label">Alert level:</label>
                <input type="number" min="0" max="{{$parent.maxLevel}}" step="1" ng-model="$parent.minLevel" class="form-control ng-pristine ng-untouched ng-valid rulesetSearch ruleLevel_input">
                <label class="ruleLevel_label">-</label>
                <input type="number" min="{{$parent.minLevel}}" max="15" step="1" ng-model="$parent.maxLevel" class="form-control ng-pristine ng-untouched ng-valid rulesetSearch ruleLevel_input">
                <button type="submit" class="btn btn-primary btn-manager-restart ruleLevel_input ruleLevel_button" ng-click="setRulesFilter_level();"><span>Change</span></button>
            </div>
            </br>
            </br>
            <div class="filterActive_div" ng-if="hasRulesFilter('file');">
                <span ng-click="setRulesFilter('file', rfFiles)" ng-class="{ textFilterActive_header: isSetTabRulesFilter('file', rfFiles) }"
                    class="bold">Selected file: {{rfFiles}}   <span class="glyphicon glyphicon-remove"></span>                </span>
                <a class="glyphicon glyphicon-download-alt textFilterActive_glyphicon" ng-init="downloadRuleFile(rfFiles)" ng-href="{{encodedFile}}"
                    download="file.xml"></a>
            </div>
            <div class="filterActive_div" ng-if="hasRulesFilter('group');">
                <span ng-click="setRulesFilter('group', rfGroups)" ng-class="{ textFilterActive_header: isSetTabRulesFilter('group', rfGroups) }"
                    class="bold">Selected group: {{rfGroups}}   <span class="glyphicon glyphicon-remove"></span></span>
            </div>
            <div class="filterActive_div" ng-if="hasRulesFilter('pci');">
                <span ng-click="setRulesFilter('pci', rfPci)" ng-class="{ textFilterActive_header: isSetTabRulesFilter('pci', rfPci) }" class="bold">Selected PCI group: {{rfPci}}   <span class="glyphicon glyphicon-remove"></span></span>
            </div>
            <div class="rulesetContentTabs">
                <div id="rulesTab">
                    <div class="rules_card_list" ng-repeat="rule in rules">
                        <div class="rule_card" ng-class="{ rule_card_active: showDetails }" ng-click=" showDetails = ! showDetails; ">
                            <div class="id"> {{rule.id}} </div>
                            <div class="float_left">
                                <div class="text" style="width: 535px; height: 45px; overflow: hidden;">{{rule.description}}</div>
                            </div>
                            <div class="float_right">
                                <div ng-class='getRuleStatusClass(rule);' class="status" ng-style="{ 'border-bottom-right-radius' : (showDetails) ? '0px' : '4px' }"
                                    tooltips tooltip-size="large" tooltip-side="left" tooltip-template="{{getStatusTooltip(rule)}}"></div>
                            </div>
                            <div class="float_right">
                                <div class="level" tooltips tooltip-template="Alert level">{{rule.level}}</div>
                            </div>
                        </div>
                        <div style="" class="rule_card_detail" ng-show="showDetails">
                            <div class="ruleTabs-container">
                                <div class="ruleTabs-info">
                                    <div class="ruleTabs-box">
                                        <table class="table-rule-information">
                                            <tbody>
                                                <tr>
                                                    <td class="table-rule-information-td-title">ID</td>
                                                    <td class="table-rule-information-td-value ng-binding">{{rule.id}}</td>
                                                </tr>
                                                <tr>
                                                    <td class="table-rule-information-td-title">Description</td>
                                                    <td class="table-rule-information-td-value ng-binding" colspan="2">{{rule.description}}</td>
                                                </tr>
                                                <tr>
                                                    <td class="table-rule-information-td-title">Level</td>
                                                    <td class="table-rule-information-td-value ng-binding ng-clickable" ng-click="setRulesFilter_level_selected(rule.level);">{{rule.level}}</td>
                                                </tr>
                                                <tr>
                                                    <td class="table-rule-information-td-title">File</td>
                                                    <td class="table-rule-information-td-value ng-binding ng-clickable" ng-click="setRulesFilter_outside('file', rule.file);">{{rule.file}}</td>
                                                </tr>
                                                <tr>
                                                    <td class="table-rule-information-td-title">Groups</td>
                                                </tr>
                                                <tr ng-repeat="group in rule.groups">
                                                    <td class="table-rule-information-td-title"> </td>
                                                    <td class="table-rule-information-td-value ng-binding ng-clickable" ng-click="setRulesFilter_outside('group', group);">{{group}}</td>
                                                </tr>
                                                <tr>
                                                    <td class="table-rule-information-td-title" ng-if="rule.pci.length > 0">PCI groups</td>
                                                </tr>
                                                <tr ng-repeat="pci in rule.pci">
                                                    <td class="table-rule-information-td-title"> </td>
                                                    <td class="table-rule-information-td-value ng-binding ng-clickable" ng-click="setRulesFilter_outside('pci', pci);">{{pci}}</td>
                                                </tr>
                                                <tr>
                                                    <td class="table-rule-information-td-title">Advanced details</td>
                                                </tr>
                                                <tr ng-repeat="(detailk, detailv) in rule.details">
                                                    <td class="table-rule-information-td-title"><span class="glyphicon glyphicon-question-sign" tooltips tooltip-size="large"
                                                            tooltip-side="auto" tooltip-template="{{rulesTooltips(detailk)}}"></span></td>
                                                    <td class="table-rule-information-td-title">{{detailk}}</td>
                                                    <td class="table-rule-information-td-value ng-binding">{{detailv}}</td>
                                                </tr>
                                            </tbody>
                                        </table>
                                    </div>
                                    <ul class="ruleTabs-controlButtons">
                                        <li>
                                            <a ng-click="loadRuleDiscover(rule.id)">
                                                <span class="form-group-addon glyphicon glyphicon-share iconControl"></span>                                                Discover alerts
                                            </a>
                                        </li>
                                        <li>
                                            <a ng-click="loadRuleDashboard(rule.id)">
                                                <span class="form-group-addon glyphicon glyphicon-share iconControl"></span>                                                Dashboard
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                    <span class="glyphicon glyphicon-chevron-left" ng-click="objPrev('/rules', 'rules')" ng-show="objHasPrev('/rules')"></span>
                    <span class="glyphicon glyphicon-chevron-right" ng-click="objNext('/rules', 'rules')" ng-show="objHasNext('/rules')"></span>
                </div>
            </div>
        </div>
        <div class="rightCol">
            <div class="tabBlock">
                <ul id="rulesetTabsFilters">
                    <li><a ng-class="{ active: isSetTab(1, 1) }" href ng-click="setTab(1, 1)">Files</a></li>
                    <li><a ng-class="{ active: isSetTab(2, 1) }" href ng-click="setTab(2, 1)">Groups</a></li>
                    <li><a ng-class="{ active: isSetTab(3, 1) }" href ng-click="setTab(3, 1)">PCI</a></li>
                </ul>
            </div>
            <div class="filesBlock">
                <table class="table-files" ng-show="isSetTab(1, 1)">
                    <tr class="table-files-list-tr">
                        <td class="table-files-list-td"><input type="text" ng-model="$parent.$parent.searchFilesRules" ng-change="objGet('/rules/files', 'filesRules')"
                                class="form-control ng-pristine ng-valid rulesetSearch ng-touched" placeholder="Search..."></td>
                    </tr>
                    <tr ng-class="" class="table-files-list-tr" ng-repeat="file in filesRules">
                        <td class="table-files-list-td"><span ng-click="setRulesFilter('file', file.name)" ng-class="{ textFilterActive: isSetTabRulesFilter('file', file.name) }"
                                class="bold">{{file.name}}</span></td>
                    </tr>
                    <tr class="table-files-list-tr">
                        <td class="table-files-list-td">
                            <span class="glyphicon glyphicon-chevron-left" ng-click="objPrev('/rules/files', 'filesRules')" ng-show="objHasPrev('/rules/files')"></span>
                            <span class="glyphicon glyphicon-chevron-right" ng-click="objNext('/rules/files', 'filesRules')" ng-show="objHasNext('/rules/files')"></span>
                        </td>
                    </tr>
                </table>
                <table class="table-files" ng-show="isSetTab(2, 1)">
                    <tr class="table-files-list-tr">
                        <td class="table-files-list-td"><input type="text" ng-model="$parent.$parent.searchGroupsRules" ng-change="objGet('/rules/groups', 'groupsRules')"
                                class="form-control ng-pristine ng-valid rulesetSearch ng-touched" placeholder="Search..."></td>
                    </tr>
                    <tr ng-class="" class="table-files-list-tr" ng-repeat="group in groupsRules">
                        <td class="table-files-list-td"><span ng-click="setRulesFilter('group', group)" ng-class="{ textFilterActive: isSetTabRulesFilter('group', group) }"
                                class="bold">{{group}}</span></td>
                    </tr>
                    <tr class="table-files-list-tr">
                        <td class="table-files-list-td">
                            <span class="glyphicon glyphicon-chevron-left" ng-click="objPrev('/rules/groups', 'groupsRules')" ng-show="objHasPrev('/rules/groups')"></span>
                            <span class="glyphicon glyphicon-chevron-right" ng-click="objNext('/rules/groups', 'groupsRules')" ng-show="objHasNext('/rules/groups')"></span>
                        </td>
                    </tr>
                </table>
                <table class="table-files" ng-show="isSetTab(3, 1)">
                    <tr class="table-files-list-tr">
                        <td class="table-files-list-td"><input type="text" ng-model="$parent.$parent.searchFilesPci" ng-change="objGet('/rules/pci', 'pciGroupsRules')"
                                class="form-control ng-pristine ng-valid rulesetSearch ng-touched" placeholder="Search..."></td>
                    </tr>
                    <tr ng-class="" class="table-files-list-tr" ng-repeat="pci in pciGroupsRules">
                        <td class="table-files-list-td"><span ng-click="setRulesFilter('pci', pci)" ng-class="{ textFilterActive: isSetTabRulesFilter('pci', pci) }"
                                class="bold">{{pci}}</span></td>
                    </tr>
                    <tr class="table-files-list-tr">
                        <td class="table-files-list-td">
                            <span class="glyphicon glyphicon-chevron-left" ng-click="objPrev('/rules/pci', 'pciGroupsRules')" ng-show="objHasPrev('/rules/pci')"></span>
                            <span class="glyphicon glyphicon-chevron-right" ng-click="objNext('/rules/pci', 'pciGroupsRules')" ng-show="objHasNext('/rules/pci')"></span>
                        </td>
                    </tr>
                </table>
            </div>
        </div>
    </div>
</div>