Commit 9e28c78c by Kálmán Viktor

Merge branch 'feature-host-filter'

Conflicts:
	circle/network/static/network/network.less
parents 6c69c5f0 f8f3dc7a
...@@ -19,6 +19,7 @@ ...@@ -19,6 +19,7 @@
"jquery-simple-slider": "https://github.com/BME-IK/jquery-simple-slider.git", "jquery-simple-slider": "https://github.com/BME-IK/jquery-simple-slider.git",
"bootbox": "~4.3.0", "bootbox": "~4.3.0",
"intro.js": "0.9.0", "intro.js": "0.9.0",
"favico.js": "~0.3.5" "favico.js": "~0.3.5",
"datatables": "~1.10.4"
} }
} }
...@@ -193,6 +193,7 @@ PIPELINE_JS = { ...@@ -193,6 +193,7 @@ PIPELINE_JS = {
"jquery-knob/dist/jquery.knob.min.js", "jquery-knob/dist/jquery.knob.min.js",
"jquery-simple-slider/js/simple-slider.js", "jquery-simple-slider/js/simple-slider.js",
"favico.js/favico.js", "favico.js/favico.js",
"datatables/media/js/jquery.dataTables.js",
"dashboard/dashboard.js", "dashboard/dashboard.js",
"dashboard/activity.js", "dashboard/activity.js",
"dashboard/group-details.js", "dashboard/group-details.js",
...@@ -210,6 +211,7 @@ PIPELINE_JS = { ...@@ -210,6 +211,7 @@ PIPELINE_JS = {
"js/host.js", "js/host.js",
"js/network.js", "js/network.js",
"js/switch-port.js", "js/switch-port.js",
"js/host-list.js",
"autocomplete_light/autocomplete.js", "autocomplete_light/autocomplete.js",
"autocomplete_light/widget.js", "autocomplete_light/widget.js",
"autocomplete_light/addanother.js", "autocomplete_light/addanother.js",
......
$(function() {
if($("#network-host-list-table").length) {
var order = ["hostname", "vlan", "mac", "ipv4", "ipv6", "external_ipv4", "created_at", "owner"];
var options = {
paging: false,
columnDefs: [
{ type: 'cloud-hostname', targets: 0},
{ type: 'ip-address', targets: [3,6]},
],
language: {
zeroRecords: gettext("No host found.")
}
};
table = createDataTable($("#network-host-list-table"), options, "sort", order);
$("#network-host-list-input").keyup(function() {
table.search($(this).val()).draw();
});
$("#network-host-list-input").trigger("keyup");
$("#network-host-list-table_filter, #network-host-list-table_info").remove();
}
});
function createDataTable(table_element, options, sort_parameter_name, sort_order) {
var table = $(table_element).DataTable(options);
var sort = getParameterByName(sort_parameter_name);
var dir = "asc";
var index = 0;
if(sort.length > 0 && sort[0] == "-") {
dir = "desc";
sort = sort.substr(1, sort.length - 1);
}
if(sort)
index = sort_order.indexOf(sort);
table.order([[index, dir]]);
return table;
}
...@@ -74,3 +74,50 @@ $("#ipv6-tpl-magic").click(function() { ...@@ -74,3 +74,50 @@ $("#ipv6-tpl-magic").click(function() {
}}); }});
}); });
}); });
/* sort methods for DataTables */
var hostname_max_0_len = 10;
var hostname_zeros = new Array(hostname_max_0_len).join("0");
jQuery.extend( jQuery.fn.dataTableExt.oSort, {
"cloud-hostname-pre": function ( a ) {
var x = String(a).replace( /<[\s\S]*?>/g, "" ).replace(/^cloud\-/i, "");
if(parseFloat(x) && x.length < hostname_max_0_len) {
x = hostname_zeros.substring(0, 10-x.length) + x;
}
return x;
},
"cloud-hostname-asc": function ( a, b ) {
return ((a < b) ? -1 : ((a > b) ? 1 : 0));
},
"cloud-hostname-desc": function ( a, b ) {
return ((a < b) ? 1 : ((a > b) ? -1 : 0));
}
} );
jQuery.extend( jQuery.fn.dataTableExt.oSort, {
"ip-address-pre": function ( a ) {
var m = a.split("."), x = "";
for(var i = 0; i < m.length; i++) {
var item = m[i];
if(item.length == 1) {
x += "00" + item;
} else if(item.length == 2) {
x += "0" + item;
} else {
x += item;
}
}
return x;
},
"ip-address-asc": function ( a, b ) {
return ((a < b) ? -1 : ((a > b) ? 1 : 0));
},
"ip-address-desc": function ( a, b ) {
return ((a < b) ? 1 : ((a > b) ? -1 : 0));
}
} );
...@@ -18,3 +18,11 @@ ...@@ -18,3 +18,11 @@
&:nth-child(2), &:nth-child(3) {text-align: left;} &:nth-child(2), &:nth-child(3) {text-align: left;}
} }
} }
.table-responsive {
margin-top: 15px;
}
#network-host-list-form {
margin-top: 6px;
}
...@@ -79,10 +79,11 @@ class HostTable(Table): ...@@ -79,10 +79,11 @@ class HostTable(Table):
class Meta: class Meta:
model = Host model = Host
attrs = {'class': 'table table-striped table-condensed'} attrs = {'class': "table table-striped table-condensed",
'id': "network-host-list-table"}
fields = ('hostname', 'vlan', 'mac', 'ipv4', 'ipv6', fields = ('hostname', 'vlan', 'mac', 'ipv4', 'ipv6',
'external_ipv4', 'created_at', 'owner', ) 'external_ipv4', 'created_at', 'owner', )
order_by = ('vlan', 'hostname', ) order_by = ("hostname", )
class SmallRuleTable(Table): class SmallRuleTable(Table):
......
...@@ -8,22 +8,42 @@ ...@@ -8,22 +8,42 @@
{% block content %} {% block content %}
<div class="page-header"> <div class="page-header">
<a href="{% url "network.host_create" %}" class="btn btn-success pull-right"><i class="fa fa-plus-circle"></i> {% trans "Create a new host" %}</a> <a href="{% url "network.host_create" %}" class="btn btn-success pull-right">
<i class="fa fa-plus-circle"></i>
{% trans "Create a new host" %}
</a>
<h1> <h1>
{% trans "Hosts" %} {% trans "Hosts" %}
<small> <small>{% trans "list of all hosts" %}</small>
{% trans "list of all hosts" %}
</small>
</h1> </h1>
</div> </div>
<ul class="nav nav-pills" style="margin: 5px 0 20px 0;"> <div class="row">
<div class="col-md-9">
<ul class="nav nav-pills" style="margin: 5px 0 20px 0;">
<li class="disabled"><a href="#">{% trans "Filter by vlans" %}</a></li> <li class="disabled"><a href="#">{% trans "Filter by vlans" %}</a></li>
<li {% if not request.GET.vlan %} class="active"{% endif %}><a href="{{ request.path }}">{% trans "ALL" %}</a></li> <li {% if not request.GET.vlan %} class="active"{% endif %}>
<a href="{{ request.path }}">{% trans "ALL" %}</a>
</li>
{% for vlan in vlans %} {% for vlan in vlans %}
<li{% if request.GET.vlan|add:"0" == vlan.id %} class="active"{% endif %}><a href="?vlan={{ vlan.id }}">{{ vlan.name }}</a></li> <li{% if request.GET.vlan|add:"0" == vlan.id %} class="active"{% endif %}>
<a href="?vlan={{ vlan.id }}">{{ vlan.name }}</a>
</li>
{% endfor %} {% endfor %}
</ul> </ul>
</div>
<div class="col-md-3">
<form action="" method="GET" id="network-host-list-form">
<div class="input-group">
<input type="text" id="network-host-list-input" name="s" class="form-control"
value="{{ request.GET.s }}" placeholder="{% trans "Search..." %}"/>
<span class="input-group-btn">
<button class="btn btn-primary"><i class="fa fa-search"></i></button>
</span>
</div>
</form>
</div>
</div>
<div class="table-responsive"> <div class="table-responsive">
{% render_table table %} {% render_table table %}
......
...@@ -24,6 +24,7 @@ from django.core.exceptions import ValidationError ...@@ -24,6 +24,7 @@ from django.core.exceptions import ValidationError
from django.core.urlresolvers import reverse_lazy from django.core.urlresolvers import reverse_lazy
from django.shortcuts import render, redirect, get_object_or_404 from django.shortcuts import render, redirect, get_object_or_404
from django.http import HttpResponse, Http404 from django.http import HttpResponse, Http404
from django.db.models import Q
from django_tables2 import SingleTableView from django_tables2 import SingleTableView
...@@ -377,6 +378,11 @@ class HostList(LoginRequiredMixin, SuperuserRequiredMixin, SingleTableView): ...@@ -377,6 +378,11 @@ class HostList(LoginRequiredMixin, SuperuserRequiredMixin, SingleTableView):
data = Host.objects.filter(vlan=vlan_id).select_related() data = Host.objects.filter(vlan=vlan_id).select_related()
else: else:
data = Host.objects.select_related() data = Host.objects.select_related()
search = self.request.GET.get("s")
if search:
data = data.filter(Q(hostname__icontains=search) |
Q(ipv4=search)) # ipv4 does not work TODO
return data return data
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment