From a0836b6876f94ef596f02277323bf2c9017968a8 Mon Sep 17 00:00:00 2001
From: jeremystretch <jstretch@ns1.com>
Date: Tue, 28 Dec 2021 11:06:34 -0500
Subject: [PATCH] Add inventory items panel to device component views

---
 netbox/templates/dcim/consoleport.html        | 159 +++++++++---------
 netbox/templates/dcim/consoleserverport.html  |   1 +
 netbox/templates/dcim/frontport.html          |   1 +
 .../dcim/inc/panels/inventory_items.html      |  59 +++++++
 netbox/templates/dcim/interface.html          |   1 +
 netbox/templates/dcim/poweroutlet.html        |   1 +
 netbox/templates/dcim/powerport.html          |   1 +
 netbox/templates/dcim/rearport.html           |   1 +
 8 files changed, 145 insertions(+), 79 deletions(-)
 create mode 100644 netbox/templates/dcim/inc/panels/inventory_items.html

diff --git a/netbox/templates/dcim/consoleport.html b/netbox/templates/dcim/consoleport.html
index 38cfb90ae..ed3c649dd 100644
--- a/netbox/templates/dcim/consoleport.html
+++ b/netbox/templates/dcim/consoleport.html
@@ -58,91 +58,92 @@
                 </h5>
                 <div class="card-body">
                     {% if object.mark_connected %}
-                    <span class="text-success"><i class="mdi mdi-check-bold"></i></span> Marked as connected
+                        <span class="text-success"><i class="mdi mdi-check-bold"></i></span> Marked as connected
                     {% elif object.cable %}
-                    <table class="table table-hover attr-table">
-                        <tr>
-                            <th scope="row">Cable</th>
-                            <td>
-                                <a href="{{ object.cable.get_absolute_url }}">{{ object.cable }}</a>
-                                <a href="{% url 'dcim:consoleport_trace' pk=object.pk %}" class="btn btn-primary btn-sm lh-1" title="Trace">
-                                    <i class="mdi mdi-transit-connection-variant" aria-hidden="true"></i>
-                                </a>
-                            </td>
-                        </tr>
-                        {% if object.connected_endpoint %}
+                        <table class="table table-hover attr-table">
                             <tr>
-                                <th scope="row">Device</th>
+                                <th scope="row">Cable</th>
                                 <td>
-                                    <a href="{{ object.connected_endpoint.device.get_absolute_url }}">{{ object.connected_endpoint.device }}</a>
+                                    <a href="{{ object.cable.get_absolute_url }}">{{ object.cable }}</a>
+                                    <a href="{% url 'dcim:consoleport_trace' pk=object.pk %}" class="btn btn-primary btn-sm lh-1" title="Trace">
+                                        <i class="mdi mdi-transit-connection-variant" aria-hidden="true"></i>
+                                    </a>
                                 </td>
                             </tr>
-                            <tr>
-                                <th scope="row">Name</th>
-                                <td>
-                                    <a href="{{ object.connected_endpoint.get_absolute_url }}">{{ object.connected_endpoint.name }}</a>
-                                </td>
-                            </tr>
-                            <tr>
-                                <th scope="row">Type</th>
-                                <td>{{ object.connected_endpoint.get_type_display|placeholder }}</td>
-                            </tr>
-                            <tr>
-                                <th scope="row">Description</th>
-                                <td>{{ object.connected_endpoint.description|placeholder }}</td>
-                            </tr>
-                            <tr>
-                                <th scope="row">Path Status</th>
-                                <td>
-                                    {% if object.path.is_active %}
-                                        <span class="badge bg-success">Reachable</span>
-                                    {% else %}
-                                        <span class="badge bg-danger">Not Reachable</span>
-                                    {% endif %}
-                                </td>
-                            </tr>
-                        {% endif %}
-                    </table>
-                {% else %}
-                    <div class="text-muted">
-                        Not Connected
-                        {% if perms.dcim.add_cable %}
-                            <div class="dropdown float-end">
-                                <button type="button" class="btn btn-primary btn-sm dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false">
-                                    <span class="mdi mdi-ethernet-cable" aria-hidden="true"></span> Connect
-                                </button>
-                                <ul class="dropdown-menu dropdown-menu-end">
-                                    <li>
-                                        <a
-                                            class="dropdown-item"
-                                            href="{% url 'dcim:consoleport_connect' termination_a_id=object.pk termination_b_type='console-server-port' %}?return_url={{ object.get_absolute_url }}"
-                                        >
-                                            Console Server Port
-                                        </a>
-                                    </li>
-                                    <li>
-                                        <a
-                                            class="dropdown-item"
-                                            href="{% url 'dcim:consoleport_connect' termination_a_id=object.pk termination_b_type='front-port' %}?return_url={{ object.get_absolute_url }}"
-                                        >
-                                            Front Port
-                                        </a>
-                                    </li>
-                                    <li>
-                                        <a
-                                            class="dropdown-item"
-                                            href="{% url 'dcim:consoleport_connect' termination_a_id=object.pk termination_b_type='rear-port' %}?return_url={{ object.get_absolute_url }}"
-                                        >
-                                            Rear Port
-                                        </a>
-                                    </li>
-                                </ul>
-                            </div>
-                        {% endif %}
-                    </div>
-                {% endif %}
-            </div>
+                            {% if object.connected_endpoint %}
+                                <tr>
+                                    <th scope="row">Device</th>
+                                    <td>
+                                        <a href="{{ object.connected_endpoint.device.get_absolute_url }}">{{ object.connected_endpoint.device }}</a>
+                                    </td>
+                                </tr>
+                                <tr>
+                                    <th scope="row">Name</th>
+                                    <td>
+                                        <a href="{{ object.connected_endpoint.get_absolute_url }}">{{ object.connected_endpoint.name }}</a>
+                                    </td>
+                                </tr>
+                                <tr>
+                                    <th scope="row">Type</th>
+                                    <td>{{ object.connected_endpoint.get_type_display|placeholder }}</td>
+                                </tr>
+                                <tr>
+                                    <th scope="row">Description</th>
+                                    <td>{{ object.connected_endpoint.description|placeholder }}</td>
+                                </tr>
+                                <tr>
+                                    <th scope="row">Path Status</th>
+                                    <td>
+                                        {% if object.path.is_active %}
+                                            <span class="badge bg-success">Reachable</span>
+                                        {% else %}
+                                            <span class="badge bg-danger">Not Reachable</span>
+                                        {% endif %}
+                                    </td>
+                                </tr>
+                            {% endif %}
+                        </table>
+                    {% else %}
+                        <div class="text-muted">
+                            Not Connected
+                            {% if perms.dcim.add_cable %}
+                                <div class="dropdown float-end">
+                                    <button type="button" class="btn btn-primary btn-sm dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false">
+                                        <span class="mdi mdi-ethernet-cable" aria-hidden="true"></span> Connect
+                                    </button>
+                                    <ul class="dropdown-menu dropdown-menu-end">
+                                        <li>
+                                            <a
+                                                class="dropdown-item"
+                                                href="{% url 'dcim:consoleport_connect' termination_a_id=object.pk termination_b_type='console-server-port' %}?return_url={{ object.get_absolute_url }}"
+                                            >
+                                                Console Server Port
+                                            </a>
+                                        </li>
+                                        <li>
+                                            <a
+                                                class="dropdown-item"
+                                                href="{% url 'dcim:consoleport_connect' termination_a_id=object.pk termination_b_type='front-port' %}?return_url={{ object.get_absolute_url }}"
+                                            >
+                                                Front Port
+                                            </a>
+                                        </li>
+                                        <li>
+                                            <a
+                                                class="dropdown-item"
+                                                href="{% url 'dcim:consoleport_connect' termination_a_id=object.pk termination_b_type='rear-port' %}?return_url={{ object.get_absolute_url }}"
+                                            >
+                                                Rear Port
+                                            </a>
+                                        </li>
+                                    </ul>
+                                </div>
+                            {% endif %}
+                        </div>
+                    {% endif %}
+                </div>
             </div>
+            {% include 'dcim/inc/panels/inventory_items.html' %}
             {% plugin_right_page object %}
         </div>
     </div>
diff --git a/netbox/templates/dcim/consoleserverport.html b/netbox/templates/dcim/consoleserverport.html
index b44c4a9b8..b64e352e7 100644
--- a/netbox/templates/dcim/consoleserverport.html
+++ b/netbox/templates/dcim/consoleserverport.html
@@ -143,6 +143,7 @@
                 {% endif %}
                 </div>
             </div>
+            {% include 'dcim/inc/panels/inventory_items.html' %}
             {% plugin_right_page object %}
         </div>
     </div>
diff --git a/netbox/templates/dcim/frontport.html b/netbox/templates/dcim/frontport.html
index 05be82fc9..e11036f8a 100644
--- a/netbox/templates/dcim/frontport.html
+++ b/netbox/templates/dcim/frontport.html
@@ -129,6 +129,7 @@
                 {% endif %}
                 </div>
             </div>
+            {% include 'dcim/inc/panels/inventory_items.html' %}
             {% plugin_right_page object %}
         </div>
     </div>
diff --git a/netbox/templates/dcim/inc/panels/inventory_items.html b/netbox/templates/dcim/inc/panels/inventory_items.html
new file mode 100644
index 000000000..c65b342b2
--- /dev/null
+++ b/netbox/templates/dcim/inc/panels/inventory_items.html
@@ -0,0 +1,59 @@
+{% load helpers %}
+
+<div class="card">
+  <h5 class="card-header">Inventory Items</h5>
+  <div class="card-body">
+    <table class="table table-hover table-headings">
+      <thead>
+        <tr>
+          <th>Name</th>
+          <th>Label</th>
+          <th>Role</th>
+          <th></th>
+        </tr>
+      </thead>
+      <tbody>
+        {% for item in object.inventory_items.all %}
+          <tr>
+            <td>
+              <a href="{{ item.get_absolute_url }}">{{ item.name }}</a>
+            </td>
+            <td>
+              {{ item.label|placeholder }}
+            </td>
+            <td>
+              {% if item.role %}
+                <a href="{{ item.role.get_absolute_url }}">{{ item.role }}</a>
+              {% else %}
+                <span class="text-muted">&mdash;</span>
+              {% endif %}
+            </td>
+            <td class="text-end noprint">
+              {% if perms.dcim.change_inventoryitem %}
+                <a href="{% url 'dcim:inventoryitem_edit' pk=item.pk %}?return_url={{ object.get_absolute_url }}" class="btn btn-warning btn-sm lh-1" title="Edit">
+                  <i class="mdi mdi-pencil" aria-hidden="true"></i>
+                </a>
+              {% endif %}
+              {% if perms.ipam.delete_inventoryitem %}
+                <a href="{% url 'dcim:inventoryitem_delete' pk=item.pk %}?return_url={{ object.get_absolute_url }}" class="btn btn-danger btn-sm lh-1" title="Delete">
+                  <i class="mdi mdi-trash-can-outline" aria-hidden="true"></i>
+                </a>
+              {% endif %}
+            </td>
+          </tr>
+        {% empty %}
+          <tr>
+            <td colspan="5" class="text-muted">None</td>
+          </tr>
+        {% endfor %}
+      </tbody>
+    </table>
+  </div>
+  <div class="card-footer text-end noprint">
+    {% if perms.dcim.add_inventoryitem %}
+      <a href="{% url 'dcim:inventoryitem_add' %}?device={{ object.device.pk }}&component_type={{ object|content_type_id }}&component_id={{ object.pk }}&return_url={{ object.get_absolute_url }}" class="btn btn-sm btn-primary">
+        <span class="mdi mdi-plus-thick" aria-hidden="true"></span> Add Inventory Item
+      </a>
+    {% endif %}
+  </div>
+</div>
diff --git a/netbox/templates/dcim/interface.html b/netbox/templates/dcim/interface.html
index bd0569c39..a8b8da5cb 100644
--- a/netbox/templates/dcim/interface.html
+++ b/netbox/templates/dcim/interface.html
@@ -448,6 +448,7 @@
                 </div>
             {% endif %}
             {% include 'ipam/inc/panels/fhrp_groups.html' %}
+            {% include 'dcim/inc/panels/inventory_items.html' %}
             {% plugin_right_page object %}
         </div>
     </div>
diff --git a/netbox/templates/dcim/poweroutlet.html b/netbox/templates/dcim/poweroutlet.html
index 3f2c469af..90858c8d9 100644
--- a/netbox/templates/dcim/poweroutlet.html
+++ b/netbox/templates/dcim/poweroutlet.html
@@ -121,6 +121,7 @@
                 {% endif %}
                 </div>
             </div>
+            {% include 'dcim/inc/panels/inventory_items.html' %}
             {% plugin_right_page object %}
         </div>
     </div>
diff --git a/netbox/templates/dcim/powerport.html b/netbox/templates/dcim/powerport.html
index f38edec8e..1ee85b6ba 100644
--- a/netbox/templates/dcim/powerport.html
+++ b/netbox/templates/dcim/powerport.html
@@ -131,6 +131,7 @@
                 {% endif %}
                 </div>
             </div>
+            {% include 'dcim/inc/panels/inventory_items.html' %}
             {% plugin_right_page object %}
         </div>
     </div>
diff --git a/netbox/templates/dcim/rearport.html b/netbox/templates/dcim/rearport.html
index 311ccd7ff..c56bf0c4f 100644
--- a/netbox/templates/dcim/rearport.html
+++ b/netbox/templates/dcim/rearport.html
@@ -117,6 +117,7 @@
                 {% endif %}
                 </div>
             </div>
+            {% include 'dcim/inc/panels/inventory_items.html' %}
             {% plugin_right_page object %}
         </div>
     </div>