add filter by locations (#63)

* frontend for locations * locations filter backend

Author: mattieserver

netbox_topology_views/api/views.py

@@ -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 @@ def _filter(self, site, role, name, tags, region):
  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 @@ def search(self, request):
  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 = []

netbox_topology_views/static/netbox_topology_views/js/app.js

@@ -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",

netbox_topology_views/static_dev/js/home.js

@@ -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>