sdnctrlhandler/template/sdn_list.html

   1 {% extends "base.html" %}
   2 {% load get %}
   3 {% load staticfiles %}
   4
   5
   6 {% block head_block %}
   7     {{ block.super }}
   8     <link rel="stylesheet" href="/static/bower_components/datatables.net-bs/css/dataTables.bootstrap.min.css">
   9
  10 {% endblock %}
  11 {% block title_header_big %}
  12     {{ block.super }}
  13 {% endblock %}
  14 {% block left_sidebar %}
  15     {% include 'osm/osm_project_left_sidebar.html' %}
  16 {% endblock %}
  17
  18
  19 {% block breadcrumb_body %}
  20     {{ block.super }}
  21     <li><a href="{% url 'sdns:list'  %}">SDN Controllers</a></li>
  22 {% endblock %}
  23
  24 {% block content_body %}
  25     {{ block.super }}
  26     {% include 'modal/sdn_details.html' %}
  27     {% csrf_token %}
  28     <div class="row">
  29         <div class="col-md-12">
  30
  31             <div class="box">
  32                 <div class="box-header with-border">
  33                     <h3 class="box-title">Registered SDN Controllers</h3>
  34                     <div class="box-tools">
  35                         <a href='{% url "sdns:create"  %}' class="btn btn-block btn-primary btn-sm"><i
  36                                 class="fa fa-plus"></i><span> New SDN Controller</span></a>
  37                     </div>
  38                 </div>
  39                 <div class="box-body">
  40                     <table id="sdns_table" class="table table-bordered table-striped">
  41                         <thead>
  42                         <tr>
  43                             <th>Name</th>
  44                             <th>Identifier</th>
  45                             <th>Type</th>
  46                             <th>Operational State</th>
  47                             <th>IP</th>
  48                             <th>Port</th>
  49                             <th>Actions</th>
  50
  51                         </tr>
  52                         </thead>
  53                         <tbody>
  54
  55                         </tbody>
  56                     </table>
  57                 </div>
  58             </div>
  59         </div>
  60
  61     </div>
  62 {% endblock %}
  63
  64 {% block resource_block %}
  65     {{ block.super }}
  66     <!-- moment JS -->
  67     <script src="/static/bower_components/moment/moment.js"></script>
  68     <script src="/static/bower_components/datatables.net/js/jquery.dataTables.min.js"></script>
  69     <script src="/static/bower_components/datatables.net-bs/js/dataTables.bootstrap.min.js"></script>
  70     <script src="/static/src/sdnctrlhandler/sdn_list.js"></script>
  71
  72      <script>
  73     $(document).ready( function () {
  74         var table = $('#sdns_table').DataTable({
  75             responsive: true,
  76             "ajax": {
  77                 "url": "/sdn/list",
  78                 "dataSrc": function (json) {
  79                     console.log(json)
  80                     return json['sdns'];
  81                 },
  82                 statusCode: {
  83                     401: function () {
  84                         console.log("no auth");
  85                         moveToLogin(window.location.pathname);
  86                     }
  87                 },
  88                 "error": function (hxr, error, thrown) {
  89                     console.log(hxr)
  90                     console.log(thrown)
  91                     console.log(error);
  92                 }
  93
  94             },
  95             "columns": [
  96                 {
  97                     "render": function (data, type, row) {
  98                         return row["name"];
  99                     },
 100                     "targets": 0
 101                 },
 102                 {
 103                     "render": function (data, type, row) {
 104                         return row['_id'];
 105                     },
 106                     "targets": 1
 107                 },
 108                 {
 109                     "render": function (data, type, row) {
 110                         return row["type"];
 111                     },
 112                     "targets": 2
 113                 },
 114                 {
 115                     "render": function (data, type, row) {
 116                         return row["_admin"]["operationalState"];
 117                     },
 118                     "targets": 3
 119                 },
 120                 {
 121                     "render": function (data, type, row) {
 122                         return row["ip"];
 123                     },
 124                     "targets": 4
 125                 },
 126                 {
 127                     "render": function (data, type, row) {
 128                         return row["port"];
 129                     },
 130                     "targets": 5
 131                 },
 132                 {
 133                     "render": function (data, type, row) {
 134                         return '<div class="btn-group">' +
 135                             '<button type="button" class="btn btn-default" ' +
 136                             'onclick="javascript:showSDN( \''+row['_id'] + '\', \''+row['name'] +'\')" data-toggle="tooltip" data-placement="top" data-container="body" title="Show Info"><i class="fa fa-info"></i>' +
 137                         '</button>' +
 138                         '<button type="button" class="btn btn-default"' +
 139                         'onclick="javascript:deleteSDN(\''+row['_id']+'\', \''+ row["name"] +'\')" data-toggle="tooltip" data-placement="top" data-container="body" title="Delete">' +
 140                         '<i class="far fa-trash-alt" ></i></button></div>';
 141                     },
 142                     "targets": 6
 143                 }
 144             ]
 145         });
 146
 147         setInterval(function () {
 148                 table.ajax.reload();
 149             }, 10000);
 150     });
 151     </script>
 152 {% endblock %}
 153
 154 {% block footer %}
 155     {% include "footer.html"  %}
 156 {% endblock %}