Filtered log views

frontend/js/app/openappsec-log/list-important/item.ejs

@@ -0,0 +1,43 @@
+
+<td>
+    <%- formatDbDate(eventTime, 'D-M-YY, H:mm') %>
+</td>
+<td>
+    <div class="text-nowrap">
+        <% var sevirityClass = 'bg-success'; 
+        switch (eventSeverity) {
+            case 'Critical':
+                sevirityClass = 'bg-danger';
+                break;
+            case 'Warning':
+                sevirityClass = 'bg-warning';
+                break;
+            case 'Info':
+                sevirityClass = 'bg-success';
+                //sevirityClass = 'bg-info';
+                break;
+            case 'Debug':
+                sevirityClass = 'bg-success';
+                break;
+        }
+        %>  
+        <span class="status-icon <%- sevirityClass %>"></span> <%- eventSeverity %>
+    </div>
+</td>
+<td><%- assetName %></td>
+<td><%- securityAction %></td>
+<td><%- waapIncidentType %></td>
+<td><%- httpSourceId %></td>
+<td><%- sourceIp %></td>
+<td><%- proxyIp %></td>
+<td><%- httpHostName %></td>
+<td><%- httpMethod %></td>
+<td><%- httpResponseCode %></td>
+<td><%- httpUriPath %></td>
+<td><%- protectionName %></td>
+<td><%- matchedLocation %></td>
+<td><%- matchedParameter %></td>
+<td><%- matchedSample %></td>
+<td class="text-right">
+    <a href="#" class="meta btn btn-secondary btn-sm">open</a>
+</td>

frontend/js/app/openappsec-log/list-important/item.js

@@ -0,0 +1,32 @@
+const Mn         = require('backbone.marionette');
+const Controller = require('../../controller');
+const template   = require('./item.ejs');
+
+module.exports = Mn.View.extend({
+    template: template,
+    tagName:  'tr',
+
+    ui: {
+        meta: 'a.meta'
+    },
+
+    events: {
+        'click @ui.meta': function (e) {
+            e.preventDefault();
+            Controller.showOpenappsecMeta(this.model);
+        }
+    },
+
+    templateContext: {
+        more: function() {
+            switch (this.object_type) {
+                case 'redirection-host':
+                case 'stream':
+                case 'proxy-host':
+                    return this.meta.domain_names.join(', ');
+            }
+
+            return '#' + (this.object_id || '?');
+        }
+    }
+});

frontend/js/app/openappsec-log/list-important/main.ejs

@@ -0,0 +1,22 @@
+<thead>
+    <th>Time</th>
+    <th>Event Severity</th>
+    <th>Asset Name</th>
+    <th>Security Action</th>
+    <th>AppSec Incident Type</th>
+    <th>Source Identifier</th>
+    <th>Source IP</th>
+    <th>Proxy IP</th>
+    <th>HTTP Host</th>
+    <th>HTTP Method</th>
+    <th>HTTP Response Code</th>
+    <th>HTTP URI Path</th>
+    <th>Protection Name</th>
+    <th>Matched Location</th>
+    <th>Matched Parameter</th>
+    <th>Matched Sample</th>
+    <th>&nbsp;</th>
+</thead>
+<tbody>
+    <!-- items -->
+</tbody>

frontend/js/app/openappsec-log/list-important/main.js

@@ -0,0 +1,43 @@
+const Mn       = require('backbone.marionette');
+const ItemView = require('./item');
+const template = require('./main.ejs');
+
+let TableBody = Mn.CollectionView.extend({
+    tagName: 'tbody',
+    childView: ItemView,
+
+    initialize: function (options) {
+        this.options = new Backbone.Model(options);
+        this.page = options.page;
+        this.perPage = options.perPage;
+        this.updatePage();
+        this.listenTo(this.options, 'change:page', this.updatePage);
+    },
+
+    updatePage: function () {
+        console.log('updatePage');
+        let models = this.collection.models.slice((this.page - 1) * this.perPage, this.page * this.perPage);
+        this.collection.reset(models);
+    }
+});
+
+module.exports = Mn.View.extend({
+    tagName:   'table',
+    className: 'table table-hover table-outline table-vcenter card-table',
+    template:  template,
+
+    regions: {
+        body: {
+            el:             'tbody',
+            replaceElement: true
+        }
+    },
+
+    onRender: function () {
+        this.showChildView('body', new TableBody({
+            collection: this.collection,
+            page:       this.options.page,
+            perPage:    this.options.perPage
+        }));
+    }
+});