add filter by locations (#63)

* frontend for locations

* locations filter backend
This commit is contained in:
mattieserver
2021-05-01 19:22:28 +02:00
committed by GitHub
parent 5f498f9ce2
commit 91a690f1c8
4 changed files with 81 additions and 12 deletions
+8 -5
View File
@@ -78,7 +78,7 @@ class SearchViewSet(ReadOnlyModelViewSet):
queryset = Device.objects.all()
serializer_class = TopologyDummySerializer
def _filter(self, site, role, name, tags, region):
def _filter(self, site, role, name, tags, region, location):
filter_devices = Device.objects.all()
if name is not None:
filter_devices = filter_devices.filter(name__contains=name)
@@ -90,6 +90,8 @@ class SearchViewSet(ReadOnlyModelViewSet):
filter_devices = filter_devices.filter(tags__id__in=tags)
if region is not None:
filter_devices = filter_devices.filter(site__region__id__in=region)
if location is not None:
filter_devices = filter_devices.filter(location__id__in=location)
return filter_devices
@@ -115,14 +117,15 @@ class SearchViewSet(ReadOnlyModelViewSet):
if regions == []:
regions = None
locations = request.query_params.getlist('locations[]', None)
if locations == []:
locations = None
hide_unconnected = request.query_params.get('hide_unconnected', None)
if hide_unconnected == "":
hide_unconnected = None
print(hide_unconnected)
if hide_unconnected == 'false':
print("ok")
devices = self._filter(sites, devicerole, name, tags, regions)
devices = self._filter(sites, devicerole, name, tags, regions, locations)
nodes = []
edges = []
File diff suppressed because one or more lines are too long
+64 -2
View File
@@ -33,6 +33,7 @@ var options = {
}
};
var selected_regions = [];
var selected_sites = [];
function iniPlotboxIndex() {
document.addEventListener('DOMContentLoaded', function () {
@@ -113,6 +114,25 @@ function startLoadSearchBar() {
}
}
});
$('#sites').on('select2:select', function (e) {
var data = e.params.data;
var index = selected_sites.indexOf(data.id.toString());
if (index == -1) {
selected_sites.push(data.id.toString());
}
});
$('#sites').on('select2:unselect', function (e) {
var data = e.params.data;
var index = selected_sites.indexOf(data.id.toString());
if (index > -1) {
selected_sites.splice(index, 1);
}
});
$('#sites').on('select2:clear', function (e) {
selected_sites = [];
});
$('#tags').select2({
allowClear: true,
placeholder: "---------",
@@ -178,7 +198,6 @@ function startLoadSearchBar() {
$('#regions').on('select2:unselect', function (e) {
var data = e.params.data;
var index = selected_regions.indexOf(data.id.toString());
console.log(index);
if (index > -1) {
selected_regions.splice(index, 1);
}
@@ -187,6 +206,47 @@ function startLoadSearchBar() {
selected_regions = [];
});
$('#locations').select2({
allowClear: true,
placeholder: "---------",
theme: "bootstrap",
multiple: true,
ajax: {
url: function (params) {
var base_url = "../../api/dcim/locations/?brief=true";
if (selected_sites.length == 0) {
return base_url;
}
else {
for (var i = 0; i < selected_sites.length; i++) {
var tmp = "&site_id=" + selected_sites[i];
base_url = base_url + tmp;
}
return base_url;
}
},
dataType: "json",
type: "GET",
data: function (params) {
var queryParameters = {
q: params.term
}
return queryParameters;
},
processResults: function (data) {
return {
results: $.map(data.results, function (item) {
return {
text: item.name,
id: item.id
}
})
};
}
}
});
var deviceRolesSelect = $('#device-roles');
$.ajax({
@@ -233,6 +293,7 @@ function handleButtonPress() {
var value4 = $("#tags").val();
var value5 = $("#regions").val();
var value6 = $('#checkHideUnconnected').is(":checked");
var value7 = $("#locations").val();
$.ajax({
type: "GET",
url: "../../api/plugins/topology-views/search/search/",
@@ -242,7 +303,8 @@ function handleButtonPress() {
'sites[]': value3,
'tags[]': value4,
'regions[]': value5,
'hide_unconnected': value6
'hide_unconnected': value6,
'locations[]': value7
},
headers: { "X-CSRFToken": csrftoken },
contentType: "application/json; charset=utf-8",
@@ -41,20 +41,24 @@
<div class="form-group">
<label for="device-roles">Device roles</label>
<select class="form-control" multiple="multiple" id="device-roles"></select>
</div>
<div class="form-group">
<label for="regions">Regions</label>
<select class="form-control" multiple="multiple" id="regions"></select>
</div>
<div class="form-group">
<label for="sites">Sites</label>
<select class="form-control" multiple="multiple" id="sites"></select>
</div>
<div class="form-group">
<label for="locations">Locations</label>
<select class="form-control" multiple="multiple" id="locations"></select>
</div>
<div class="form-group">
<label for="tags">Tags</label>
<select class="form-control" multiple="multiple" id="tags"></select>
</div>
<div class="form-group">
<label for="regions">Regions</label>
<select class="form-control" multiple="multiple" id="regions"></select>
</div>
<div class="form-group">
<div class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input" id="checkHideUnconnected">
<label class="custom-control-label" for="checkHideUnconnected">Hide Unconnected</label>