Browse Source

Merge branch 'feature/dashboard' into develop

feature/documentation
Sam Black 7 years ago
parent
commit
3d1e36fc9f
  1. 2
      cupola/static/js/chart_group.js
  2. 77
      cupola/templates/dashboard/index.html
  3. 33
      cupola/templates/layout/base.html
  4. 8
      cupola/templates/layout/header.html
  5. 4
      cupola/templates/security/login_user.html
  6. 57
      cupola/views/events.py

2
cupola/static/js/chart_group.js

@ -36,7 +36,7 @@ $(document).ready(function() {
show: false
}
},
bindto: '#allEventsTimeline',
bindto: chartID,
color: {
pattern: ['#0088ce', '#00659c', '#3f9c35', '#ec7a08', '#cc0000']
},

77
cupola/templates/dashboard/index.html

@ -1,14 +1,89 @@
{% extends "layout/base.html" %}
{% block head_title %}
| Dashboard
{% endblock %}
{% block normal_layout %}
{% include "layout/header.html" %}
<div class="container-fluid">
<div class="row">
<div class="col-md-12">
<div class="page-header page-header-bleed-right">
<h2>Hello, World {{ current_user }}!</h2>
<h2>Dashboard</h2>
</div>
<h4>Overview</h4>
<div class="row">
<div class="frequency" id="allCharts">
<h2 class='bg-info'>No data available</h2>
</div>
</div>
</div>
</div>
</div>
{% endblock %}
{% block body_js %}
<script src="/static/js/charts.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
var chartID = "#allCharts";
var chartdiv = $(chartID);
var mainchart = c3.generate({
axis: {
x: {
show: true,
type: 'timeseries',
tick: {
format: '%Y-%m-%d',
culling: false
}
},
y: {
show: false
}
},
bindto: chartID,
color: {
pattern: ['#0088ce', '#00659c', '#3f9c35', '#ec7a08', '#cc0000']
},
data: {
columns: [],
x: 'date',
type: 'bar'
},
bar: {
width: {
ratio: 0.9
}
},
legend: {
show: false
},
size: {
height: 120
}
});
$.ajax({
url: '/event/dashboard/',
dataType: 'json'
})
.success(function(data) {
if (data.groups.length === 1 && data.columns.length === 1) {
mainchart.destroy();
return;
}
mainchart.load({
columns: data.columns,
groups: data.groups
});
})
.fail(function() {
mainchart.destroy();
chartdiv.html("<h2 class='bg-warning'>Cannot load chart data</h2>");
});
});
</script>
{% endblock %}

33
cupola/templates/layout/base.html

@ -1,27 +1,30 @@
<!DOCTYPE html>
{% block html_tag %}<html>{% endblock %}
{% block html_tag %}
<html>{% endblock %}
<head lang="en">
<meta charset="UTF-8">
<title>
Cupola
{% block head_title %} | Welcome{% endblock %}
</title>
<meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
<meta charset="UTF-8">
<title>
Cupola
{% block head_title %} | Welcome{% endblock %}
</title>
<meta
content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no'
name='viewport'>
<link href="/static/css/patternfly.css" rel="stylesheet" type="text/css" />
<link href="/static/css/patternfly.css" rel="stylesheet" type="text/css"/>
{% block head_css -%}{% endblock %}
{% block head_css -%}{% endblock %}
<!--[if lt IE 9]>
<!--[if lt IE 9]>
<script src="/static/js/html5.js') }}" type="text/javascript"></script>
<![endif]-->
</head>
<body>
{% block normal_layout %}
{% endblock %}
{% block normal_layout %}
{% endblock %}
<script src="/static/js/bootstrap.js" type="text/javascript"></script>
<script src="/static/js/patternfly.js" type="text/javascript"></script>
{% block body_js -%}{% endblock %}
<script src="/static/js/bootstrap.js" type="text/javascript"></script>
<script src="/static/js/patternfly.js" type="text/javascript"></script>
{% block body_js -%}{% endblock %}
</body>
</html>

8
cupola/templates/layout/header.html

@ -4,15 +4,15 @@
<span class="sr-only">Toggle navigation</span>
<i class="fa fa-bars"></i>
</button>
<a class="navbar-brand" href="{{ url_for('dashboard.index') }}">
<span style="font-size: smaller">Cupola</span>
<a class="navbar-brand" href="{{ url_for('dashboard.index') }}" style="line-height: 10px;">
<span style="font-weight: bold;">Cupola</span> Application Monitoring
</a>
</div>
<div class="collapse navbar-collapse navbar-collapse-user">
<ul class="nav navbar-nav navbar-utility">
<li>
{# <li>
<a href="#">Status</a>
</li>
</li>#}
<li class="dropdown">
{% if current_user.is_authenticated() %}
<a href="#" class="dropdown-toggle" data-toggle="dropdown">

4
cupola/templates/security/login_user.html

@ -22,9 +22,7 @@
<div class="alert alert-warning">
<span class="pficon pficon-warning-triangle-o"></span>
Your email address requires confirmation.
Please <a href="{{ url_for_security('send_confirmation') }}">confirm
your
email</a>.
Please <a href="{{ url_for_security('send_confirmation') }}">confirm your email</a>.
</div>
{% elif "email" in login_user_form.errors or "password" in login_user_form.errors %}
<div class="alert alert-danger">

57
cupola/views/events.py

@ -24,14 +24,10 @@ from datetime import timedelta
from dateutil import rrule
from flask import Blueprint
from flask import flash
from flask import make_response
from flask import redirect
from flask import jsonify
from flask import render_template
from flask import url_for
from flask_security import login_required
from flask_security import roles_accepted
from cupola.models.events import Event
from cupola.models.events import EventGroup
@ -48,8 +44,8 @@ def index():
:return: HTML view of event
:rtype: jinja2.Template
"""
event_groups = EventGroup.objects.order_by("-last_seen").all()
return render_template("events/index.html", event_groups=event_groups)
event_group = EventGroup.objects.order_by("-last_seen").all()
return render_template("events/index.html", event_groups=event_group)
@events.route("/<event_id>")
@ -83,7 +79,6 @@ def view_group(event_group_id):
:rtype: jinja2.Template
"""
event_group = EventGroup.objects.get_or_404(id=event_group_id)
group_events = Event.objects(group=event_group).order_by("timestamp")
return render_template("events/view_group.html", event_group=event_group)
@ -122,7 +117,7 @@ def view_group_chart(event_group_id):
chart_data[group.message] = data
return make_response(json.dumps(chart_data))
return jsonify(chart_data)
@events.route("/project/<project_id>/")
@ -168,4 +163,46 @@ def event_groups(project_id):
chart_data["groups"] = [col_groups]
return make_response(json.dumps(chart_data))
return jsonify(**chart_data)
@events.route("/dashboard/")
@login_required
def dashboard():
"""
Get all events per project.
:return: c3 chart data
:rtype: JSON
"""
groups = EventGroup.objects.order_by("-event_count").limit(5)
chart_data = {
"columns": [["date"]],
"groups": None
}
col_groups = []
now = datetime.date(datetime.now())
days = list(rrule.rrule(rrule.DAILY, count=15,
until=now + timedelta(days=1),
dtstart=now - timedelta(days=13)))
for group in groups:
col_groups.append(group.message)
data = [group.message]
for idx, day in enumerate(days):
if idx > 13:
break
chart_data["columns"][0].append(day.strftime("%Y-%m-%d"))
daily_events = Event.objects(group=group,
timestamp__gt=day,
timestamp__lt=days[idx + 1]).count()
data.append(daily_events)
chart_data["columns"].append(data)
chart_data["groups"] = [col_groups]
return jsonify(**chart_data)

Loading…
Cancel
Save