Closes #11598: Add buttons to easily switch between rack list and elevations views

docs/release-notes/version-3.4.md

@@ -7,6 +7,7 @@
 * [#10762](https://github.com/netbox-community/netbox/issues/10762) - Permit selection custom fields to have only one choice
 * [#11554](https://github.com/netbox-community/netbox/issues/11554) - Add module types count to manufacturers list
 * [#11585](https://github.com/netbox-community/netbox/issues/11585) - Add IP address filters for services
+* [#11598](https://github.com/netbox-community/netbox/issues/11598) - Add buttons to easily switch between rack list and elevations views
 
 ### Bug Fixes
 

netbox/dcim/views.py

@@ -642,6 +642,7 @@ class RackListView(generic.ObjectListView):
     filterset = filtersets.RackFilterSet
     filterset_form = forms.RackFilterForm
     table = tables.RackTable
+    template_name = 'dcim/rack_list.html'
 
 
 class RackElevationListView(generic.ObjectListView):

netbox/templates/dcim/rack_elevation_list.html

@@ -5,31 +5,34 @@
 {% block title %}Rack Elevations{% endblock %}
 
 {% block controls %}
-    <div class="controls">
+  <div class="controls">
-        <div class="control-group">
+    <div class="control-group">
-            <div class="btn-group btn-group-sm" role="group">
+      <a href="{% url 'dcim:rack_list' %}{% querystring request %}" class="btn btn-sm btn-primary">
-                <select class="btn btn-sm btn-outline-secondary rack-view">
+        <i class="mdi mdi-format-list-checkbox"></i> View List
-                  <option value="images-and-labels" selected="selected">Images and Labels</option>
+      </a>
-                  <option value="images-only">Images only</option>
+      <div class="btn-group btn-group-sm" role="group">
-                  <option value="labels-only">Labels only</option>
+        <select class="btn btn-sm btn-outline-secondary rack-view">
-                </select>
+          <option value="images-and-labels" selected="selected">Images and Labels</option>
-            </div>
+          <option value="images-only">Images only</option>
-            <div class="btn-group btn-group-sm" role="group">
+          <option value="labels-only">Labels only</option>
-                <a href="{% url 'dcim:rack_elevation_list' %}{% querystring request face='front' %}" class="btn btn-outline-secondary{% if rack_face == 'front' %} active{% endif %}">Front</a>
+        </select>
-                <a href="{% url 'dcim:rack_elevation_list' %}{% querystring request face='rear' %}" class="btn btn-outline-secondary{% if rack_face == 'rear' %} active{% endif %}">Rear</a>
+      </div>
-            </div>
+      <div class="btn-group btn-group-sm" role="group">
-            <div class="dropdown">
+        <a href="{% url 'dcim:rack_elevation_list' %}{% querystring request face='front' %}" class="btn btn-outline-secondary{% if rack_face == 'front' %} active{% endif %}">Front</a>
-              <button type="button" class="btn btn-sm btn-outline-secondary dropdown-toggle" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+        <a href="{% url 'dcim:rack_elevation_list' %}{% querystring request face='rear' %}" class="btn btn-outline-secondary{% if rack_face == 'rear' %} active{% endif %}">Rear</a>
-                <i class="mdi mdi-sort"></i>&nbsp;Sort By {{ sort_display_name }}
+      </div>
-              </button>
+      <div class="dropdown">
-              <ul class="dropdown-menu dropdown-menu-end">
+        <button type="button" class="btn btn-sm btn-outline-secondary dropdown-toggle" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
-                {% for sort_key, sort_display_name in sort_choices.items %}
+          <i class="mdi mdi-sort"></i>&nbsp;Sort By {{ sort_display_name }}
-                  <li><a class="dropdown-item{% if sort == sort_key %} active{% endif %}" href="{% url 'dcim:rack_elevation_list' %}{% querystring request sort=sort_key %}">{{ sort_display_name }}</a></li>
+        </button>
-                {% endfor %}
+        <ul class="dropdown-menu dropdown-menu-end">
-              </ul>
+          {% for sort_key, sort_display_name in sort_choices.items %}
-            </div>
+            <li><a class="dropdown-item{% if sort == sort_key %} active{% endif %}" href="{% url 'dcim:rack_elevation_list' %}{% querystring request sort=sort_key %}">{{ sort_display_name }}</a></li>
-        </div>
+          {% endfor %}
+        </ul>
+      </div>
     </div>
+  </div>
 {% endblock %}
 
 {% block content-wrapper %}

netbox/templates/dcim/rack_list.html

@@ -0,0 +1,9 @@
+{% extends 'generic/object_list.html' %}
+{% load helpers %}
+{% load static %}
+
+{% block extra_controls %}
+  <a href="{% url 'dcim:rack_elevation_list' %}{% querystring request %}" class="btn btn-sm btn-primary">
+    <i class="mdi mdi-view-day-outline"></i> View Elevations
+  </a>
+{% endblock %}

netbox/templates/generic/object_list.html

@@ -26,16 +26,15 @@ Context:
   <div class="controls">
     <div class="control-group">
       {% plugin_list_buttons model %}
-
       {% block extra_controls %}{% endblock %}
       {% if 'add' in actions %}
-          {% add_button model %}
+        {% add_button model %}
       {% endif %}
       {% if 'import' in actions %}
-          {% import_button model %}
+        {% import_button model %}
       {% endif %}
       {% if 'export' in actions %}
-          {% export_button model %}
+        {% export_button model %}
       {% endif %}
     </div>
   </div>