diff options
Diffstat (limited to 'dashboard/src/templates')
17 files changed, 1086 insertions, 0 deletions
diff --git a/dashboard/src/templates/account/user_list.html b/dashboard/src/templates/account/user_list.html new file mode 100644 index 0000000..68178eb --- /dev/null +++ b/dashboard/src/templates/account/user_list.html @@ -0,0 +1,55 @@ +{% extends "dashboard/table.html" %} +{% load staticfiles %} + +{% block table %} + <thead> + <tr> + <th>Username</th> + <th>Full Name</th> + <th>Email</th> + <th>Company</th> + <th>SSH Key</th> + <th>GPG Key</th> + </tr> + </thead> + <tbody> + {% for user in users %} + <tr> + <td> + {{ user.username }} + </td> + <td> + {{ user.userprofile.full_name }} + </td> + <td> + {{ user.email }} + </td> + <td> + {{ user.userprofile.company }} + </td> + <td> + {% if user.userprofile.ssh_public_key %} + <a href={{ user.userprofile.ssh_public_key.url }}>SSH</a> + {% endif %} + </td> + <td> + {% if user.userprofile.pgp_public_key %} + <a href={{ user.userprofile.pgp_public_key.url }}>GPG</a> + {% endif %} + </td> + </tr> + {% endfor %} + </tbody> +{% endblock table %} + + +{% block tablejs %} + <script type="text/javascript"> + $(document).ready(function () { + $('#table').DataTable({ + scrollX: true, + "order": [[0, "asc"]] + }); + }); + </script> +{% endblock tablejs %} diff --git a/dashboard/src/templates/account/userprofile_update_form.html b/dashboard/src/templates/account/userprofile_update_form.html new file mode 100644 index 0000000..f4bb7b5 --- /dev/null +++ b/dashboard/src/templates/account/userprofile_update_form.html @@ -0,0 +1,38 @@ +{% extends "layout.html" %} +{% load bootstrap3 %} + +{% block basecontent %} + <div class="container"> + <div class="row"> + <div class="col-md-4 col-md-offset-4"> + {% bootstrap_messages %} + <div class="login-panel panel panel-default"> + <div class="panel-heading"> + <h3 class="panel-title"> + {{ title }} + </h3> + </div> + <div class="panel-body"> + <form enctype="multipart/form-data" method="post"> + {% csrf_token %} + {% bootstrap_form form %} + <p><b>API Token</b> + <a href="{% url 'generate_token' %}" class="btn btn-default"> + Generate + </a> + </p> + <p style="word-wrap: break-word;">{{ token.key }}</p> + + <p></p> + {% buttons %} + <button type="submit" class="btn btn btn-success"> + Save Profile + </button> + {% endbuttons %} + </form> + </div> + </div> + </div> + </div> + </div> +{% endblock basecontent %} diff --git a/dashboard/src/templates/base.html b/dashboard/src/templates/base.html new file mode 100644 index 0000000..4d8530a --- /dev/null +++ b/dashboard/src/templates/base.html @@ -0,0 +1,111 @@ +{% extends "layout.html" %} +{% load bootstrap3 %} + +{% block basecontent %} + <div id="wrapper"> + <!-- Navigation --> + <nav class="navbar navbar-default navbar-static-top" role="navigation" + style="margin-bottom: 0"> + <div class="navbar-header"> + <button type="button" class="navbar-toggle" data-toggle="collapse" + data-target=".navbar-collapse"> + <span class="sr-only">Toggle navigation</span> + <span class="icon-bar"></span> + <span class="icon-bar"></span> + <span class="icon-bar"></span> + </button> + <a href="https://www.opnfv.org/" class="navbar-left"><img + src="http://artifacts.opnfv.org/apex/review/14099/installation-instructions/_static/opnfv-logo.png"></a> + <a class="navbar-brand" href={% url 'dashboard:index' %}>Pharos Dashboard</a> + </div> + <!-- /.navbar-header --> + + <ul class="nav navbar-top-links navbar-right"> + <li class="dropdown"> + <a class="dropdown-toggle" data-toggle="dropdown" href="#"> + <i class="fa fa-user fa-fw"></i> <i class="fa fa-caret-down"></i> + </a> + <ul class="dropdown-menu dropdown-user"> + {% if user.is_authenticated %} + <li><a href="{% url 'account:settings' %}"><i + class="fa fa-gear fa-fw"></i> + Settings</a> + </li> + <li class="divider"></li> + <li><a href="{% url 'account:logout' %}?next={{ request.path }}"><i + class="fa fa-sign-out fa-fw"></i> + Logout</a> + </li> + {% else %} + <li><a href="{% url 'account:login' %}"><i + class="fa fa-sign-in fa-fw"></i> + Login with Jira</a> + <li> + {% endif %} + </ul> + <!-- /.dropdown-user --> + </li> + <!-- /.dropdown --> + </ul> + <!-- /.navbar-top-links --> + + <div class="navbar-default sidebar" role="navigation"> + <div class="sidebar-nav navbar-collapse"> + <ul class="nav" id="side-menu"> + <li> + <a href="{% url 'dashboard:ci_pods' %}"><i + class="fa fa-fw"></i>CI-Pods</a> + </li> + <li> + <a href="{% url 'dashboard:dev_pods' %}"><i + class="fa fa-fw"></i>Development + Pods</a> + </li> + <li> + <a href="{% url 'dashboard:jenkins_slaves' %}"><i + class="fa fa-fw"></i>Jenkins + Slaves</a> + </li> + <li> + {% if user.is_authenticated %} + <a href="{% url 'account:users' %}"><i + class="fa fa-fw"></i>User List + </a> + {% endif %} + </li> + <li> + <a href="{% url 'booking:list' %}"><i + class="fa fa-fw"></i>Booking List + </a> + </li> + <li> + <a href="{% url 'api-root' %}"><i + class="fa fa-fw"></i>API + </a> + </li> + </ul> + </div> + <!-- /.sidebar-collapse --> + </div> + <!-- /.navbar-static-side --> + </nav> + + <!-- Page Content --> + <div id="page-wrapper"> + <div class="row"> + <div class="col-lg-12"> + <h1 class="page-header">{{ title }}</h1> + </div> + <!-- /.col-lg-12 --> + </div> + + {% bootstrap_messages %} + + {% block content %} + + {% endblock content %} + </div> + <!-- /#page-wrapper --> + </div> + <!-- /#wrapper --> +{% endblock basecontent %} diff --git a/dashboard/src/templates/booking/booking_calendar.html b/dashboard/src/templates/booking/booking_calendar.html new file mode 100644 index 0000000..4644e85 --- /dev/null +++ b/dashboard/src/templates/booking/booking_calendar.html @@ -0,0 +1,103 @@ +{% extends "base.html" %} +{% load staticfiles %} + +{% load bootstrap3 %} + +{% block extrahead %} + <link href="{% static "bower_components/fullcalendar/dist/fullcalendar.css" %}" + rel='stylesheet'/> + <link href="{% static "bower_components/eonasdan-bootstrap-datetimepicker/build/css/bootstrap-datetimepicker.min.css" %}" + rel='stylesheet'/> +{% endblock extrahead %} + +{% block content %} + <div class="col-lg-8"> + <div class="container-fluid"> + <div class="panel panel-default"> + <div class="panel-heading"> + <i class="fa fa-calendar fa-fw"></i>Calendar + </div> + <div class="panel-body"> + <div id='calendar'> + </div> + </div> + <!-- /.panel-body --> + </div> + <!-- /.panel --> + </div> + </div> + + <div class="col-lg-4"> + <div class="panel panel-default"> + <div class="panel-heading"> + <i class="fa fa-edit fa-fw"></i>Booking + </div> + <div class="panel-body"> + {% if user.is_authenticated %} + <div id="booking_form_div"> + {% bootstrap_form_errors form type='non_fields' %} + <form method="post" action="" class="form" id="bookingform"> + {% csrf_token %} + + <div class='input-group' id='starttimepicker'> + {% bootstrap_field form.start addon_after='<span class="glyphicon glyphicon-calendar"></span>' %} + </div> + <div class='input-group' id='endtimepicker'> + {% bootstrap_field form.end addon_after='<span class="glyphicon glyphicon-calendar"></span>' %} + </div> + {% bootstrap_field form.purpose %} + {% bootstrap_field form.installer %} + {% bootstrap_field form.scenario %} + {% buttons %} + <button type="submit" class="btn btn btn-success"> + Book + </button> + {% endbuttons %} + </form> + </div> + {% else %} + <p>Please + <a href="{% url 'account:login' %}"> + login with Jira</a> + to book this Pod</p> + {% endif %} + </div> + </div> + </div> + + <div id="booking_detail_modal" class="modal fade" role="dialog"> + <div class="modal-dialog"> + + <!-- Modal content--> + <div class="modal-content"> + <div class="modal-header"> + <button type="button" class="close" data-dismiss="modal">×</button> + <h4 class="modal-title">Booking Detail</h4> + </div> + <div class="modal-body" id="booking_detail_content"> + </div> + <div class="modal-footer"> + <button type="button" class="btn btn-default" data-dismiss="modal">Close + </button> + </div> + </div> + + </div> + </div> +{% endblock content %} + +{% block extrajs %} + <script type="text/javascript"> + var bookings_url = "{% url 'booking:bookings_json' resource_id=resource.id %}"; + var booking_detail_prefix = "{% url 'booking:detail_prefix' %}"; + var user_timezone = "{{ request.user.userprofile.timezone }}" + </script> + + <script src={% static "bower_components/moment/moment.js" %}></script> + <script src={% static "bower_components/fullcalendar/dist/fullcalendar.js" %}></script> + <script type="text/javascript" + src={% static "bower_components/eonasdan-bootstrap-datetimepicker/build/js/bootstrap-datetimepicker.min.js" %}></script> + <script src={% static "js/fullcalendar-options.js" %}></script> + <script src={% static "js/datetimepicker-options.js" %}></script> + <script src={% static "js/booking-calendar.js" %}></script> +{% endblock extrajs %}
\ No newline at end of file diff --git a/dashboard/src/templates/booking/booking_detail.html b/dashboard/src/templates/booking/booking_detail.html new file mode 100644 index 0000000..4b016b2 --- /dev/null +++ b/dashboard/src/templates/booking/booking_detail.html @@ -0,0 +1,26 @@ +{% load jira_filters %} + +<p> + <b>Resource: </b> + <a href="{{ booking.resource.url }}"> + {{ booking.resource.name }} + </a> +</p> +<p> + <b>User: </b> {{ booking.user.username }} +</p> +<p> + <b>Start: </b> {{ booking.start }} +</p> +<p> + <b>End: </b> {{ booking.end }} +</p> +<p> + <b>Purpose: </b> {{ booking.purpose }} +</p> +<p> + <b>Installer: </b> {{ booking.installer }} +</p> +<p> + <b>Scenario: </b> {{ booking.scenario }} +</p>
\ No newline at end of file diff --git a/dashboard/src/templates/booking/booking_list.html b/dashboard/src/templates/booking/booking_list.html new file mode 100644 index 0000000..ccdc46d --- /dev/null +++ b/dashboard/src/templates/booking/booking_list.html @@ -0,0 +1,48 @@ +{% extends "base.html" %} +{% load staticfiles %} + +{% block extrahead %} + <!-- DataTables CSS --> + <link href="{% static "bower_components/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.css" %}" + rel="stylesheet"> + + <!-- DataTables Responsive CSS --> + <link href="{% static "bower_components/datatables-responsive/css/dataTables.responsive.css" %}" + rel="stylesheet"> +{% endblock extrahead %} + +{% block content %} + <div class="row"> + <div class="panel-body"> + <div class="dataTables_wrapper"> + <table class="table table-striped table-bordered table-hover" id="table" + cellspacing="0" + width="100%"> + {% include "booking/booking_table.html" %} + </table> + </div> + <!-- /.table-responsive --> + <!-- /.panel-body --> + <!-- /.panel --> + </div> + <!-- /.col-lg-12 --> + </div> +{% endblock content %} + +{% block extrajs %} + <!-- DataTables JavaScript --> + <link href="{% static "bower_components/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.css" %}" + rel="stylesheet"> + + + <script src={% static "bower_components/datatables/media/js/jquery.dataTables.min.js" %}></script> + <script src={% static "bower_components/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.min.js" %}></script> + + <script type="text/javascript"> + $(document).ready(function () { + $('#table').DataTable({ + scrollX: true, + }); + }); + </script> +{% endblock extrajs %} diff --git a/dashboard/src/templates/booking/booking_table.html b/dashboard/src/templates/booking/booking_table.html new file mode 100644 index 0000000..655b013 --- /dev/null +++ b/dashboard/src/templates/booking/booking_table.html @@ -0,0 +1,37 @@ +{% load jira_filters %} + + +<thead> +<tr> + <th>User</th> + <th>Purpose</th> + <th>Start</th> + <th>End</th> + <th>Installer</th> + <th>Scenario</th> +</tr> +</thead> +<tbody> +{% for booking in bookings %} + <tr> + <td> + {{ booking.user.username }} + </td> + <td> + {{ booking.purpose }} + </td> + <td> + {{ booking.start }} + </td> + <td> + {{ booking.end }} + </td> + <td> + {{ booking.installer }} + </td> + <td> + {{ booking.scenario }} + </td> + </tr> +{% endfor %} +</tbody>
\ No newline at end of file diff --git a/dashboard/src/templates/dashboard/ci_pods.html b/dashboard/src/templates/dashboard/ci_pods.html new file mode 100644 index 0000000..a20be95 --- /dev/null +++ b/dashboard/src/templates/dashboard/ci_pods.html @@ -0,0 +1,61 @@ +{% extends "dashboard/table.html" %} +{% load staticfiles %} +{% load jenkins_filters %} + +{% block table %} + <thead> + <tr> + <th>Name</th> + <th>Slave Name</th> + <th>Status</th> + <th>Installer</th> + <th>Scenario</th> + <th>Branch</th> + <th>Job</th> + </tr> + </thead> + <tbody> + {% for pod in ci_pods %} + <tr> + <td> + <a target='_blank' href={{ pod.url }}>{{ pod.name }}</a> + </td> + <td> + <a target='_blank' href={{ pod.slave.url }}>{{ pod.slave.name }}</a> + </td> + <td style="background-color:{{ pod.slave.status | jenkins_status_color }}"> + {{ pod.slave.status }} + </td> + <td {{ pod.slave.last_job_result | jenkins_job_blink }}> + {{ pod.slave.last_job_installer }} + </td> + <td {{ pod.slave.last_job_result | jenkins_job_blink }}> + {{ pod.slave.last_job_scenario }} + </td> + <td {{ pod.slave.last_job_result | jenkins_job_blink }}> + {{ pod.slave.last_job_branch }} + </td> + <td><a {{ pod.slave.last_job_result | jenkins_job_blink }} + style="color:{{ pod.slave.last_job_result | jenkins_job_color }}" + target='_blank' + href={{ pod.slave.last_job_url }}>{{ pod.slave.last_job_name }}</a> + </td> + </tr> + {% endfor %} + </tbody> +{% endblock table %} + + +{% block tablejs %} + <script type="text/javascript"> + $(document).ready(function () { + $('#table').DataTable({ + scrollX: true, + columnDefs: [ + {type: 'status', targets: 2} + ], + "order": [[2, "asc"]] + }); + }); + </script> +{% endblock tablejs %} diff --git a/dashboard/src/templates/dashboard/dev_pods.html b/dashboard/src/templates/dashboard/dev_pods.html new file mode 100644 index 0000000..a6f3b2e --- /dev/null +++ b/dashboard/src/templates/dashboard/dev_pods.html @@ -0,0 +1,70 @@ +{% extends "dashboard/table.html" %} +{% load staticfiles %} +{% load jenkins_filters %} + +{% block table %} + <thead> + <tr> + <th>Name</th> + <th>Slave Name</th> + <th>Booked by</th> + <th>Booked until</th> + <th>Purpose</th> + <th>Utilization</th> + <th>Status</th> + <th></th> + <th></th> + </tr> + </thead> + <tbody> + {% for pod, booking, utilization in dev_pods %} + <tr> + <td> + <a href={% url 'dashboard:resource' resource_id=pod.id %}>{{ pod.name }}</a> + </td> + <td> + <a target='_blank' href={{ pod.slave.url }}>{{ pod.slave.name }}</a> + </td> + <td> + {{ booking.user.username }} + </td> + <td> + {{ booking.end }} + </td> + <td> + {{ booking.purpose }} + </td> + <td> + {{ utilization }} + </td> + <td style="background-color:{{ pod.slave.status | jenkins_status_color }}"> + {{ pod.slave.status }} + </td> + <td> + <a href="{% url 'booking:create' resource_id=pod.id %}" class="btn btn-primary"> + Book + </a> + </td> + <td> + <a href="{% url 'dashboard:resource' resource_id=pod.id %}" class="btn btn-primary"> + Info + </a> + </td> + </tr> + {% endfor %} + </tbody> +{% endblock table %} + +{% block tablejs %} + <script type="text/javascript"> + $(document).ready(function () { + $('#table').DataTable({ + scrollX: true, + columnDefs: [ + {type: 'status', targets: 6} + ], + "order": [[6, "asc"]] + }); + }); + </script> +{% endblock tablejs %} diff --git a/dashboard/src/templates/dashboard/jenkins_slaves.html b/dashboard/src/templates/dashboard/jenkins_slaves.html new file mode 100644 index 0000000..fa361b1 --- /dev/null +++ b/dashboard/src/templates/dashboard/jenkins_slaves.html @@ -0,0 +1,46 @@ +{% extends "dashboard/table.html" %} +{% load staticfiles %} + +{% load jenkins_filters %} + +{% block table %} + <thead> + <tr> + <th>Slave name</th> + <th>Status</th> + <th>Job</th> + </tr> + </thead> + <tbody> + {% for slave in slaves %} + <tr> + <td><a target='_blank' + href={{ slave.url }}>{{ slave.name }}</a> + </td> + <td style="background-color:{{ slave.status | jenkins_status_color }}"> + {{ slave.status }} + </td> + <td><a {{ slave.last_job_result | jenkins_job_blink }} + style="color:{{ slave.last_job_result | jenkins_job_color }}" + target="_blank" href={{ slave.last_job_url }}> + {{ slave.last_job_name }}</a> + </td> + </tr> + {% endfor %} + </tbody> +{% endblock table %} + + +{% block tablejs %} + <script type="text/javascript"> + $(document).ready(function () { + $('#table').DataTable({ + scrollX: true, + columnDefs: [ + {type: 'status', targets: 1} + ], + "order": [[1, "asc"]] + }); + }); + </script> +{% endblock tablejs %} diff --git a/dashboard/src/templates/dashboard/resource.html b/dashboard/src/templates/dashboard/resource.html new file mode 100644 index 0000000..c9e5735 --- /dev/null +++ b/dashboard/src/templates/dashboard/resource.html @@ -0,0 +1,58 @@ +{% extends "base.html" %} +{% load staticfiles %} + +{% block extrahead %} + <!-- Morris Charts CSS --> + <link href="{% static "bower_components/morrisjs/morris.css" %}" rel="stylesheet"> + + <!-- DataTables CSS --> + <link href="{% static "bower_components/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.css" %}" + rel="stylesheet"> + + <!-- DataTables Responsive CSS --> + <link href="{% static "bower_components/datatables-responsive/css/dataTables.responsive.css" %}" + rel="stylesheet"> +{% endblock extrahead %} + + +{% block content %} + {% include "dashboard/resource_detail.html" %} +{% endblock content %} + + +{% block extrajs %} + <!-- DataTables JavaScript --> + <link href="{% static "bower_components/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.css" %}" + rel="stylesheet"> + + <script src={% static "bower_components/datatables/media/js/jquery.dataTables.min.js" %}></script> + <script src={% static "bower_components/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.min.js" %}></script> + + + + <!-- Flot Charts JavaScript --> + <script src="{% static "bower_components/flot/excanvas.min.js" %}"></script> + <script src="{% static "bower_components/flot/jquery.flot.js" %}"></script> + <script src="{% static "bower_components/flot/jquery.flot.pie.js" %}"></script> + <script src="{% static "bower_components/flot/jquery.flot.resize.js" %}"></script> + <script src="{% static "bower_components/flot/jquery.flot.time.js" %}"></script> + <script src="{% static "bower_components/flot.tooltip/js/jquery.flot.tooltip.min.js" %}"></script> + + <script src="{% static "js/flot-pie-chart.js" %}"></script> + + <script type="text/javascript"> + $(document).ready(function () { + $('#{{ resource.id }}_server_table').DataTable({}); + $('#{{ resource.id }}_bookings_table').DataTable({}); + $('#{{ resource.id }}_vpn_user_table').DataTable({}); + + var chart_id = "{{ resource.id }}_booking_utilization"; + var utilization_url = "{% url 'dashboard:booking_utilization' resource_id=resource.id weeks=4 %}"; + loadChartData(chart_id, utilization_url); + + var chart_id = "{{ resource.id }}_jenkins_utilization"; + var utilization_url = "{% url 'dashboard:jenkins_utilization' resource_id=resource.id weeks=1 %}"; + loadChartData(chart_id, utilization_url); + }); + </script> +{% endblock extrajs %}
\ No newline at end of file diff --git a/dashboard/src/templates/dashboard/resource_all.html b/dashboard/src/templates/dashboard/resource_all.html new file mode 100644 index 0000000..a770d4e --- /dev/null +++ b/dashboard/src/templates/dashboard/resource_all.html @@ -0,0 +1,73 @@ +{% extends "base.html" %} +{% load staticfiles %} + +{% block extrahead %} + <!-- Morris Charts CSS --> + <link href="{% static "bower_components/morrisjs/morris.css" %}" rel="stylesheet"> + + <!-- DataTables CSS --> + <link href="{% static "bower_components/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.css" %}" + rel="stylesheet"> + + <!-- DataTables Responsive CSS --> + <link href="{% static "bower_components/datatables-responsive/css/dataTables.responsive.css" %}" + rel="stylesheet"> +{% endblock extrahead %} + + +{% block content %} + {% for resource, utilization, bookings in pods %} + <div class="row"> + <div class="col-lg-12"> + <div class="panel panel-default"> + <div class="panel-heading"> + {{ resource.name }} + </div> + <div class="panel-body"> + {% include "dashboard/resource_detail.html" %} + </div> + </div> + </div> + </div> + {% endfor %} +{% endblock content %} + + +{% block extrajs %} + <!-- DataTables JavaScript --> + <link href="{% static "bower_components/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.css" %}" + rel="stylesheet"> + + <script src={% static "bower_components/datatables/media/js/jquery.dataTables.min.js" %}></script> + <script src={% static "bower_components/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.min.js" %}></script> + + + + <!-- Flot Charts JavaScript --> + <script src="{% static "bower_components/flot/excanvas.min.js" %}"></script> + <script src="{% static "bower_components/flot/jquery.flot.js" %}"></script> + <script src="{% static "bower_components/flot/jquery.flot.pie.js" %}"></script> + <script src="{% static "bower_components/flot/jquery.flot.resize.js" %}"></script> + <script src="{% static "bower_components/flot/jquery.flot.time.js" %}"></script> + <script src="{% static "bower_components/flot.tooltip/js/jquery.flot.tooltip.min.js" %}"></script> + <script src="{% static "js/flot-pie-chart.js" %}"></script>< + + <script type="text/javascript"> + $(document).ready(function () { + {% for resource, utilization, bookings in pods %} + + $('#{{ resource.id }}_server_table').DataTable({}); + $('#{{ resource.id }}_bookings_table').DataTable({}); + $('#{{ resource.id }}_vpn_user_table').DataTable({}); + + var chart_id = "{{ resource.id }}_booking_utilization"; + var utilization_url = "{% url 'dashboard:booking_utilization' resource_id=resource.id weeks=4 %}"; + loadChartData(chart_id, utilization_url); + + var chart_id = "{{ resource.id }}_jenkins_utilization"; + var utilization_url = "{% url 'dashboard:jenkins_utilization' resource_id=resource.id weeks=1 %}"; + loadChartData(chart_id, utilization_url); + {% endfor %} + }); + </script> +{% endblock extrajs %}
\ No newline at end of file diff --git a/dashboard/src/templates/dashboard/resource_detail.html b/dashboard/src/templates/dashboard/resource_detail.html new file mode 100644 index 0000000..740dd25 --- /dev/null +++ b/dashboard/src/templates/dashboard/resource_detail.html @@ -0,0 +1,205 @@ +{% load jenkins_filters %} + +<div class="row"> + <div class="col-lg-3"> + <div class="panel panel-default"> + <div class="panel-heading"> + Jenkins Utilization + <div class="pull-right"> + <div class="form-group"> + <select onchange="loadChartData('{{ resource.id }}_jenkins_utilization', this.value);"> + <option value="{% url 'dashboard:jenkins_utilization' resource_id=resource.id weeks=1 %}"> + Last Week + </option> + <option value="{% url 'dashboard:jenkins_utilization' resource_id=resource.id weeks=4 %}"> + Last Month + </option> + </select> + </div> + </div> + </div> + <div class="panel-body"> + <div class="flot-chart"> + <div class="flot-chart-content" + id="{{ resource.id }}_jenkins_utilization"></div> + </div> + </div> + </div> + </div> + + <div class="col-lg-9"> + <div class="panel panel-default"> + <div class="panel-heading"> + Status + </div> + <div class="panel-body"> + <div class="list-group pre-scrollable"> + {% for status in resource.resourcestatus_set.all %} + <a href="#" class="list-group-item"> + <i class="fa fa-info fa-fw"></i> {{ status.title }} + <span class="pull-right text-muted small"> + <em>{{ status.timestamp }}</em> + </span> + </a> + {% endfor %} + </div> + </div> + </div> + </div> + <div class="col-lg-9"> + <div class="panel panel-default"> + <div class="panel-heading"> + Servers + </div> + <div class="panel-body"> + <div class="dataTables_wrapper"> + <table class="table table-striped table-bordered table-hover" + id="{{ resource.id }}_server_table" cellspacing="0" + width="100%"> + {% include "dashboard/server_table.html" %} + </table> + </div> + </div> + </div> + </div> +</div> +<div class="row"> + <div class="col-lg-3"> + <div class="panel panel-default"> + <div class="panel-heading"> + Booking Utilization + <div class="pull-right"> + <div class="form-group"> + <select onchange="loadChartData('{{ resource.id }}_booking_utilization', this.value);"> + <option value="{% url 'dashboard:booking_utilization' resource_id=resource.id weeks=-4 %}"> + Last Month + </option> + <option value="{% url 'dashboard:booking_utilization' resource_id=resource.id weeks=-1 %}"> + Last Week + </option> + <option value="{% url 'dashboard:booking_utilization' resource_id=resource.id weeks=1 %}"> + Next Week + </option> + <option selected="selected" + value="{% url 'dashboard:booking_utilization' resource_id=resource.id weeks=4 %}"> + Next Month + </option> + </select> + </div> + </div> + </div> + <div class="panel-body"> + <div class="flot-chart"> + <div class="flot-chart-content" + id="{{ resource.id }}_booking_utilization"></div> + </div> + </div> + </div> + </div> + <div class="col-lg-9"> + <div class="panel panel-default"> + <div class="panel-heading"> + Bookings + </div> + <div class="panel-body"> + <div class="dataTables_wrapper"> + <table class="table table-striped table-bordered table-hover" + id="{{ resource.id }}_bookings_table" cellspacing="0" + width="100%"> + {% include "booking/booking_table.html" %} + </table> + </div> + </div> + </div> + </div> +</div> +<div class="row"> + <div class="col-lg-3"> + <div class="panel panel-default"> + <div class="panel-heading"> + Contact + </div> + <div class="panel-body"> + <p> + <b>Lab Owner: </b> + {{ resource.owner.username }} + </p> + <p> + <b>Email: </b> + {{ resource.owner.email }} + </p> + <p> + <a href="{% url 'booking:create' resource_id=resource.id %}" class="btn + btn-primary"> + Booking + </a> + <a href="{{ resource.url }}" class="btn + btn-primary"> + OPNFV Wiki + </a> + </p> + </div> + </div> + </div> + <div class="col-lg-3"> + <div class="panel panel-default"> + <div class="panel-heading"> + Jenkins Status + </div> + <div class="panel-body"> + <p> + <b>Slave Name: </b> + <a target='_blank' + href={{ resource.slave.url }}>{{ resource.slave.name }}</a> + </p> + <p> + <b>Status: </b> + {{ resource.slave.status }} + </p> + <p> + <b>Last Job: </b> + <a href="{{ resource.slave.last_job_url }}"> + {{ resource.slave.last_job_name }} + </a> + </p> + </div> + </div> + </div> + <div class="col-lg-6"> + <div class="panel panel-default"> + <div class="panel-heading"> + VPN Users + </div> + <div class="panel-body"> + <div class="dataTables_wrapper"> + <table class="table table-striped table-bordered table-hover" + id="{{ resource.id }}_vpn_user_table" cellspacing="0" + width="100%"> + <thead> + <tr> + <th>User</th> + <th>Email</th> + <th>Company</th> + </tr> + </thead> + <tbody> + {% for user in resource.vpn_users.all %} + <tr> + <td> + {{ user.username }} + </td> + <td> + {{ user.email }} + </td> + <td> + {{ user.userprofile.company }} + </td> + </tr> + {% endfor %} + </table> + </tbody> + </div> + </div> + </div> + </div> +</div> diff --git a/dashboard/src/templates/dashboard/server_table.html b/dashboard/src/templates/dashboard/server_table.html new file mode 100644 index 0000000..f01bd60 --- /dev/null +++ b/dashboard/src/templates/dashboard/server_table.html @@ -0,0 +1,30 @@ +<thead> +<tr> + <th>Server</th> + <th>Model</th> + <th>CPU</th> + <th>RAM</th> + <th>Storage</th> +</tr> +</thead> +<tbody> +{% for server in resource.server_set.all %} + <tr> + <td> + {{ server.name }} + </td> + <td> + {{ server.model }} + </td> + <td> + {{ server.cpu }} + </td> + <td> + {{ server.ram }} + </td> + <td> + {{ server.storage }} + </td> + </tr> +{% endfor %} +</tbody>
\ No newline at end of file diff --git a/dashboard/src/templates/dashboard/table.html b/dashboard/src/templates/dashboard/table.html new file mode 100644 index 0000000..d59f0e3 --- /dev/null +++ b/dashboard/src/templates/dashboard/table.html @@ -0,0 +1,43 @@ +{% extends "base.html" %} +{% load staticfiles %} + +{% block extrahead %} + <!-- DataTables CSS --> + <link href="{% static "bower_components/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.css" %}" + rel="stylesheet"> + + <!-- DataTables Responsive CSS --> + <link href="{% static "bower_components/datatables-responsive/css/dataTables.responsive.css" %}" rel="stylesheet"> +{% endblock extrahead %} + +{% block content %} + <div class="row"> + <div class="col-lg-12"> + <div class="dataTables_wrapper"> + <table class="table table-striped table-bordered table-hover" id="table" cellspacing="0" + width="100%"> + + {% block table %} + {% endblock table %} + + </table> + </div> + <!-- /.table-responsive --> + <!-- /.panel-body --> + <!-- /.panel --> + </div> + <!-- /.col-lg-12 --> + </div> +{% endblock content %} + +{% block extrajs %} + <!-- DataTables JavaScript --> + + <script src={% static "bower_components/datatables/media/js/jquery.dataTables.min.js" %}></script> + <script src={% static "bower_components/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.min.js" %}></script> + + <script src={% static "js/dataTables-sort.js" %}></script> + + {% block tablejs %} + {% endblock tablejs %} +{% endblock extrajs %} diff --git a/dashboard/src/templates/layout.html b/dashboard/src/templates/layout.html new file mode 100644 index 0000000..9578e15 --- /dev/null +++ b/dashboard/src/templates/layout.html @@ -0,0 +1,73 @@ +{% load staticfiles %} +<!DOCTYPE html> +<html lang="en"> + +<head> + + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <meta name="viewport" content="width=device-width, initial-scale=1"> + <meta name="description" content=""> + <meta name="author" content=""> + + <title>OPNFV Pharos {{ title }}</title> + + <!-- Bootstrap Core CSS --> + <link href="{% static "bower_components/bootstrap/dist/css/bootstrap.min.css" %}" + rel="stylesheet"> + + <!-- MetisMenu CSS --> + <link href="{% static "bower_components/metisMenu/dist/metisMenu.min.css" %}" rel="stylesheet"> + + <!-- Custom CSS --> + <link href="{% static "bower_components/startbootstrap-sb-admin-2-blackrockdigital/dist/css/sb-admin-2.min.css" %}" + rel="stylesheet"> + <link href="{% static "css/theme.css" %}" rel="stylesheet"> + + <!-- Custom Fonts --> + <link href="{% static "bower_components/font-awesome/css/font-awesome.min.css" %}" + rel="stylesheet" type="text/css"> + + <!-- Favicon --> + <link rel="shortcut icon" href="{% static 'favicon.ico' %}"> + + {% block extrahead %} + {% endblock extrahead %} + + <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries --> + <!-- WARNING: Respond.js doesn't work if you view the page via file:// --> + <!--[if lt IE 9]> + <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script> + <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script> + <![endif]--> + +</head> + +{% block extrastyle %} +{% endblock extrastyle %} + +<body> +{% block basecontent %} +{% endblock basecontent %} + + +<script src="https://code.jquery.com/jquery-2.2.4.min.js" + integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script> +{#<!-- jQuery -->#} +{#<script src="{% static "bower_components/jquery/dist/jquery.min.js" %}"></script>#} +{#<script src="{% static "bower_components/jquery-migrate/jquery-migrate.min.js" %}"></script>#} + +{#<script src="https://code.jquery.com/jquery-2.2.0.min.js"></script>#} +<!-- Bootstrap Core JavaScript --> +<script src="{% static "bower_components/bootstrap/dist/js/bootstrap.min.js" %}"></script> + +<!-- Metis Menu Plugin JavaScript --> +<script src="{% static "bower_components/metisMenu/dist/metisMenu.min.js" %}"></script> + +<!-- Custom Theme JavaScript --> +<script src="{% static "bower_components/startbootstrap-sb-admin-2-blackrockdigital/dist/js/sb-admin-2.min.js" %}"></script> + +{% block extrajs %} +{% endblock extrajs %} +</body> +</html> diff --git a/dashboard/src/templates/rest_framework/api.html b/dashboard/src/templates/rest_framework/api.html new file mode 100644 index 0000000..9c6c4f7 --- /dev/null +++ b/dashboard/src/templates/rest_framework/api.html @@ -0,0 +1,9 @@ +{% extends "rest_framework/base.html" %} + +{% block title %}Pharos Dashboard API{% endblock %} + +{% block branding %} + <a class='navbar-brand' rel="nofollow" href=#> + Pharos Dashboard API + </a> +{% endblock %}
\ No newline at end of file |