device.html 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297
  1. {% extends 'dcim/device/base.html' %}
  2. {% load render_table from django_tables2 %}
  3. {% load buttons %}
  4. {% load static %}
  5. {% load helpers %}
  6. {% load plugins %}
  7. {% block content %}
  8. <div class="row">
  9. <div class="col col-md-6">
  10. <div class="card">
  11. <h5 class="card-header">
  12. Device
  13. </h5>
  14. <div class="card-body">
  15. <table class="table table-hover attr-table">
  16. <tr>
  17. <th scope="row">Region</th>
  18. <td>
  19. {% if object.site.region %}
  20. {% for region in object.site.region.get_ancestors %}
  21. {{ region|linkify }} /
  22. {% endfor %}
  23. {{ object.site.region|linkify }}
  24. {% else %}
  25. {{ ''|placeholder }}
  26. {% endif %}
  27. </td>
  28. </tr>
  29. <tr>
  30. <th scope="row">Site</th>
  31. <td>{{ object.site|linkify }}</td>
  32. </tr>
  33. <tr>
  34. <th scope="row">Location</th>
  35. <td>
  36. {% if object.location %}
  37. {% for location in object.location.get_ancestors %}
  38. {{ location|linkify }} /
  39. {% endfor %}
  40. {{ object.location|linkify }}
  41. {% else %}
  42. {{ ''|placeholder }}
  43. {% endif %}
  44. </td>
  45. </tr>
  46. <tr>
  47. <th scope="row">Rack</th>
  48. <td class="position-relative">
  49. {% if object.rack %}
  50. {{ object.rack|linkify }}
  51. <div class="position-absolute top-50 end-0 translate-middle-y noprint">
  52. <a href="{{ object.rack.get_absolute_url }}?device={{ object.pk }}" class="btn btn-primary btn-sm" title="Highlight device">
  53. <i class="mdi mdi-view-day-outline"></i>
  54. </a>
  55. </div>
  56. {% else %}
  57. {{ ''|placeholder }}
  58. {% endif %}
  59. </td>
  60. </tr>
  61. <tr>
  62. <th scope="row">Position</th>
  63. <td>
  64. {% if object.parent_bay %}
  65. {% with object.parent_bay.device as parent %}
  66. {{ parent|linkify }} / {{ object.parent_bay }}
  67. {% if parent.position %}
  68. (U{{ parent.position }} / {{ parent.get_face_display }})
  69. {% endif %}
  70. {% endwith %}
  71. {% elif object.rack and object.position %}
  72. <span>U{{ object.position }} / {{ object.get_face_display }}</span>
  73. {% elif object.rack and object.device_type.u_height %}
  74. <span class="badge bg-warning">Not racked</span>
  75. {% else %}
  76. {{ ''|placeholder }}
  77. {% endif %}
  78. </td>
  79. </tr>
  80. <tr>
  81. <th scope="row">Tenant</th>
  82. <td>
  83. {% if object.tenant.group %}
  84. {{ object.tenant.group|linkify }} /
  85. {% endif %}
  86. {{ object.tenant|linkify|placeholder }}
  87. </td>
  88. </tr>
  89. <tr>
  90. <th scope="row">Device Type</th>
  91. <td>
  92. {{ object.device_type|linkify:"get_full_name" }} ({{ object.device_type.u_height }}U)
  93. </td>
  94. </tr>
  95. <tr>
  96. <td>Airflow</td>
  97. <td>
  98. {{ object.get_airflow_display|placeholder }}
  99. </td>
  100. </tr>
  101. <tr>
  102. <th scope="row">Serial Number</th>
  103. <td class="font-monospace">{{ object.serial|placeholder }}</td>
  104. </tr>
  105. <tr>
  106. <th scope="row">Asset Tag</th>
  107. <td class="font-monospace">{{ object.asset_tag|placeholder }}</td>
  108. </tr>
  109. </table>
  110. </div>
  111. </div>
  112. {% if vc_members %}
  113. <div class="card">
  114. <h5 class="card-header">
  115. Virtual Chassis
  116. </h5>
  117. <div class="card-body">
  118. <table class="table table-hover attr-table">
  119. <tr>
  120. <th>Device</th>
  121. <th>Position</th>
  122. <th>Master</th>
  123. <th>Priority</th>
  124. </tr>
  125. {% for vc_member in vc_members %}
  126. <tr{% if vc_member == object %} class="info"{% endif %}>
  127. <td>
  128. {{ vc_member|linkify }}
  129. </td>
  130. <td>
  131. {% badge vc_member.vc_position show_empty=True %}
  132. </td>
  133. <td>
  134. {% if object.virtual_chassis.master == vc_member %}<i class="mdi mdi-check-bold"></i>{% endif %}
  135. </td>
  136. <td>
  137. {{ vc_member.vc_priority|default:"" }}
  138. </td>
  139. </tr>
  140. {% endfor %}
  141. </table>
  142. </div>
  143. <div class="card-footer text-end noprint">
  144. <a href="{{ object.virtual_chassis.get_absolute_url }}" class="btn btn-primary btn-sm">
  145. <span class="mdi mdi-arrow-right-bold" aria-hidden="true"></span> View Virtual Chassis
  146. </a>
  147. </div>
  148. </div>
  149. {% endif %}
  150. {% include 'inc/panels/custom_fields.html' %}
  151. {% include 'inc/panels/tags.html' %}
  152. {% include 'inc/panels/comments.html' %}
  153. {% plugin_left_page object %}
  154. </div>
  155. <div class="col col-md-6">
  156. <div class="card">
  157. <h5 class="card-header">Management</h5>
  158. <div class="card-body">
  159. <table class="table table-hover attr-table">
  160. <tr>
  161. <th scope="row">Status</th>
  162. <td>{% badge object.get_status_display bg_color=object.get_status_color %}</td>
  163. </tr>
  164. <tr>
  165. <th scope="row">Role</th>
  166. <td>{{ object.device_role|linkify }}</td>
  167. </tr>
  168. <tr>
  169. <th scope="row">Platform</th>
  170. <td>{{ object.platform|linkify|placeholder }}</td>
  171. </tr>
  172. <tr>
  173. <th scope="row">Primary IPv4</th>
  174. <td>
  175. {% if object.primary_ip4 %}
  176. <a href="{{ object.primary_ip4.get_absolute_url }}">{{ object.primary_ip4.address.ip }}</a>
  177. {% if object.primary_ip4.nat_inside %}
  178. (NAT for <a href="{{ object.primary_ip4.nat_inside.get_absolute_url }}">{{ object.primary_ip4.nat_inside.address.ip }}</a>)
  179. {% elif object.primary_ip4.nat_outside.exists %}
  180. (NAT for {% for nat in object.primary_ip4.nat_outside.all %}<a href="{{ nat.get_absolute_url }}">{{ nat.address.ip }}</a>{% if not forloop.last %}, {% endif %}{% endfor %})
  181. {% endif %}
  182. {% else %}
  183. {{ ''|placeholder }}
  184. {% endif %}
  185. </td>
  186. </tr>
  187. <tr>
  188. <th scope="row">Primary IPv6</th>
  189. <td>
  190. {% if object.primary_ip6 %}
  191. <a href="{{ object.primary_ip6.get_absolute_url }}">{{ object.primary_ip6.address.ip }}</a>
  192. {% if object.primary_ip6.nat_inside %}
  193. (NAT for <a href="{{ object.primary_ip6.nat_inside.get_absolute_url }}">{{ object.primary_ip6.nat_inside.address.ip }}</a>)
  194. {% elif object.primary_ip6.nat_outside.exists %}
  195. (NAT for {% for nat in object.primary_ip6.nat_outside.all %}<a href="{{ nat.get_absolute_url }}">{{ nat.address.ip }}</a>{% if not forloop.last %}, {% endif %}{% endfor %})
  196. {% endif %}
  197. {% else %}
  198. {{ ''|placeholder }}
  199. {% endif %}
  200. </td>
  201. </tr>
  202. {% if object.cluster %}
  203. <tr>
  204. <th>Cluster</th>
  205. <td>
  206. {% if object.cluster.group %}
  207. {{ object.cluster.group|linkify }} /
  208. {% endif %}
  209. {{ object.cluster|linkify }}
  210. </td>
  211. </tr>
  212. {% endif %}
  213. </table>
  214. </div>
  215. </div>
  216. {% if object.powerports.exists and object.poweroutlets.exists %}
  217. <div class="card">
  218. <h5 class="card-header">
  219. Power Utilization
  220. </h5>
  221. <div class="card-body">
  222. <table class="table table-hover">
  223. <tr>
  224. <th>Input</th>
  225. <th>Outlets</th>
  226. <th>Allocated</th>
  227. <th>Available</th>
  228. <th>Utilization</th>
  229. </tr>
  230. {% for powerport in object.powerports.all %}
  231. {% with utilization=powerport.get_power_draw powerfeed=powerport.connected_endpoint %}
  232. <tr>
  233. <td>{{ powerport }}</td>
  234. <td>{{ utilization.outlet_count }}</td>
  235. <td>{{ utilization.allocated }}VA</td>
  236. {% if powerfeed.available_power %}
  237. <td>{{ powerfeed.available_power }}VA</td>
  238. <td>{% utilization_graph utilization.allocated|percentage:powerfeed.available_power %}</td>
  239. {% else %}
  240. <td class="text-muted">&mdash;</td>
  241. <td class="text-muted">&mdash;</td>
  242. {% endif %}
  243. </tr>
  244. {% for leg in utilization.legs %}
  245. <tr>
  246. <td style="padding-left: 20px">Leg {{ leg.name }}</td>
  247. <td>{{ leg.outlet_count }}</td>
  248. <td>{{ leg.allocated }}</td>
  249. <td>{{ powerfeed.available_power|divide:3 }}VA</td>
  250. {% with phase_available=powerfeed.available_power|divide:3 %}
  251. <td>{% utilization_graph leg.allocated|percentage:phase_available %}</td>
  252. {% endwith %}
  253. </tr>
  254. {% endfor %}
  255. {% endwith %}
  256. {% endfor %}
  257. </table>
  258. </div>
  259. </div>
  260. {% endif %}
  261. <div class="card">
  262. <h5 class="card-header">
  263. Services
  264. </h5>
  265. <div class="card-body">
  266. {% if services %}
  267. <table class="table table-hover">
  268. {% for service in services %}
  269. {% include 'ipam/inc/service.html' %}
  270. {% endfor %}
  271. </table>
  272. {% else %}
  273. <div class="text-muted">
  274. None
  275. </div>
  276. {% endif %}
  277. </div>
  278. {% if perms.ipam.add_service %}
  279. <div class="card-footer text-end noprint">
  280. <a href="{% url 'ipam:service_add' %}?device={{ object.pk }}" class="btn btn-sm btn-primary">
  281. <span class="mdi mdi-plus-thick" aria-hidden="true"></span> Assign Service
  282. </a>
  283. </div>
  284. {% endif %}
  285. </div>
  286. {% include 'inc/panels/contacts.html' %}
  287. {% include 'inc/panels/image_attachments.html' %}
  288. {% plugin_right_page object %}
  289. </div>
  290. </div>
  291. <div class="row">
  292. <div class="col col-md-12">
  293. {% plugin_full_width_page object %}
  294. </div>
  295. </div>
  296. {% endblock %}