virtualmachine.html 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313
  1. {% extends '_base.html' %}
  2. {% load helpers %}
  3. {% block content %}
  4. <div class="row">
  5. <div class="col-sm-8 col-md-9">
  6. <ol class="breadcrumb">
  7. {% if vm.cluster %}
  8. <li><a href="{{ vm.cluster.get_absolute_url }}">{{ vm.cluster }}</a></li>
  9. {% endif %}
  10. <li>{{ vm }}</li>
  11. </ol>
  12. </div>
  13. <div class="col-sm-4 col-md-3">
  14. <form action="{% url 'virtualization:virtualmachine_list' %}" method="get">
  15. <div class="input-group">
  16. <input type="text" name="q" class="form-control" placeholder="Search virtual machines" />
  17. <span class="input-group-btn">
  18. <button type="submit" class="btn btn-primary">
  19. <span class="fa fa-search"></span>
  20. </button>
  21. </span>
  22. </div>
  23. </form>
  24. </div>
  25. </div>
  26. <div class="pull-right">
  27. {% if perms.virtualization.change_virtualmachine %}
  28. <a href="{% url 'virtualization:virtualmachine_edit' pk=vm.pk %}" class="btn btn-warning">
  29. <span class="fa fa-pencil"></span>
  30. Edit this VM
  31. </a>
  32. {% endif %}
  33. {% if perms.virtualization.delete_virtualmachine %}
  34. <a href="{% url 'virtualization:virtualmachine_delete' pk=vm.pk %}" class="btn btn-danger">
  35. <span class="fa fa-trash"></span>
  36. Delete this VM
  37. </a>
  38. {% endif %}
  39. </div>
  40. <h1>{% block title %}{{ vm }}{% endblock %}</h1>
  41. {% include 'inc/created_updated.html' with obj=vm %}
  42. <div class="row">
  43. <div class="col-md-6">
  44. <div class="panel panel-default">
  45. <div class="panel-heading">
  46. <strong>Virtual Machine</strong>
  47. </div>
  48. <table class="table table-hover panel-body attr-table">
  49. <tr>
  50. <td>Name</td>
  51. <td>{{ vm }}</td>
  52. </tr>
  53. <tr>
  54. <td>Status</td>
  55. <td>
  56. <span class="label label-{{ vm.get_status_class }}">{{ vm.get_status_display }}</span>
  57. </td>
  58. </tr>
  59. <tr>
  60. <td>Role</td>
  61. <td>
  62. {% if vm.role %}
  63. <a href="{% url 'virtualization:virtualmachine_list' %}?role={{ vm.role.slug }}">{{ vm.role }}</a>
  64. {% else %}
  65. <span class="text-muted">None</span>
  66. {% endif %}
  67. </td>
  68. </tr>
  69. <tr>
  70. <td>Platform</td>
  71. <td>
  72. {% if vm.platform %}
  73. <a href="{% url 'virtualization:virtualmachine_list' %}?platform={{ vm.platform.slug }}">{{ vm.platform }}</a>
  74. {% else %}
  75. <span class="text-muted">None</span>
  76. {% endif %}
  77. </td>
  78. </tr>
  79. <tr>
  80. <td>Tenant</td>
  81. <td>
  82. {% if vm.tenant %}
  83. {% if vm.tenant.group %}
  84. <a href="{{ vm.tenant.group.get_absolute_url }}">{{ vm.tenant.group }}</a>
  85. <i class="fa fa-angle-right"></i>
  86. {% endif %}
  87. <a href="{{ vm.tenant.get_absolute_url }}">{{ vm.tenant }}</a>
  88. {% else %}
  89. <span class="text-muted">None</span>
  90. {% endif %}
  91. </td>
  92. </tr>
  93. <tr>
  94. <td>Primary IPv4</td>
  95. <td>
  96. {% if vm.primary_ip4 %}
  97. <a href="{% url 'ipam:ipaddress' pk=vm.primary_ip4.pk %}">{{ vm.primary_ip4.address.ip }}</a>
  98. {% if vm.primary_ip4.nat_inside %}
  99. <span>(NAT for {{ vm.primary_ip4.nat_inside.address.ip }})</span>
  100. {% elif vm.primary_ip4.nat_outside %}
  101. <span>(NAT: {{ vm.primary_ip4.nat_outside.address.ip }})</span>
  102. {% endif %}
  103. {% else %}
  104. <span class="text-muted">N/A</span>
  105. {% endif %}
  106. </td>
  107. </tr>
  108. <tr>
  109. <td>Primary IPv6</td>
  110. <td>
  111. {% if vm.primary_ip6 %}
  112. <a href="{% url 'ipam:ipaddress' pk=vm.primary_ip6.pk %}">{{ vm.primary_ip6.address.ip }}</a>
  113. {% if vm.primary_ip6.nat_inside %}
  114. <span>(NAT for {{ vm.primary_ip6.nat_inside.address.ip }})</span>
  115. {% elif vm.primary_ip6.nat_outside %}
  116. <span>(NAT: {{ vm.primary_ip6.nat_outside.address.ip }})</span>
  117. {% endif %}
  118. {% else %}
  119. <span class="text-muted">N/A</span>
  120. {% endif %}
  121. </td>
  122. </tr>
  123. </table>
  124. </div>
  125. {% include 'inc/custom_fields_panel.html' with custom_fields=vm.get_custom_fields %}
  126. <div class="panel panel-default">
  127. <div class="panel-heading">
  128. <strong>Comments</strong>
  129. </div>
  130. <div class="panel-body">
  131. {% if vm.comments %}
  132. {{ vm.comments|gfm }}
  133. {% else %}
  134. <span class="text-muted">None</span>
  135. {% endif %}
  136. </div>
  137. </div>
  138. </div>
  139. <div class="col-md-6">
  140. <div class="panel panel-default">
  141. <div class="panel-heading">
  142. <strong>Cluster</strong>
  143. </div>
  144. <table class="table table-hover panel-body attr-table">
  145. <tr>
  146. <td>Cluster</td>
  147. <td>
  148. {% if vm.cluster.group %}
  149. <a href="{{ vm.cluster.group.get_absolute_url }}">{{ vm.cluster.group }}</a>
  150. <i class="fa fa-angle-right"></i>
  151. {% endif %}
  152. <a href="{{ vm.cluster.get_absolute_url }}">{{ vm.cluster }}</a>
  153. </td>
  154. </tr>
  155. <tr>
  156. <td>Cluster Type</td>
  157. <td>{{ vm.cluster.type }}</td>
  158. </tr>
  159. </table>
  160. </div>
  161. <div class="panel panel-default">
  162. <div class="panel-heading">
  163. <strong>Resources</strong>
  164. </div>
  165. <table class="table table-hover panel-body attr-table">
  166. <tr>
  167. <td><i class="fa fa-tachometer"></i> Virtual CPUs</td>
  168. <td>
  169. {% if vm.vcpus %}
  170. {{ vm.vcpus }}
  171. {% else %}
  172. <span class="text-muted">N/A</span>
  173. {% endif %}
  174. </td>
  175. </tr>
  176. <tr>
  177. <td><i class="fa fa-microchip"></i> Memory</td>
  178. <td>
  179. {% if vm.memory %}
  180. {{ vm.memory }} MB
  181. {% else %}
  182. <span class="text-muted">N/A</span>
  183. {% endif %}
  184. </td>
  185. </tr>
  186. <tr>
  187. <td><i class="fa fa-hdd-o"></i> Disk Space</td>
  188. <td>
  189. {% if vm.disk %}
  190. {{ vm.disk }} GB
  191. {% else %}
  192. <span class="text-muted">N/A</span>
  193. {% endif %}
  194. </td>
  195. </tr>
  196. </table>
  197. </div>
  198. <div class="panel panel-default">
  199. <div class="panel-heading">
  200. <strong>Services</strong>
  201. </div>
  202. {% if services %}
  203. <table class="table table-hover panel-body">
  204. {% for service in services %}
  205. {% include 'ipam/inc/service.html' %}
  206. {% endfor %}
  207. </table>
  208. {% else %}
  209. <div class="panel-body text-muted">
  210. None
  211. </div>
  212. {% endif %}
  213. {% if perms.ipam.add_service %}
  214. <div class="panel-footer text-right">
  215. <a href="{% url 'virtualization:virtualmachine_service_assign' virtualmachine=vm.pk %}" class="btn btn-xs btn-primary">
  216. <span class="glyphicon glyphicon-plus" aria-hidden="true"></span> Assign service
  217. </a>
  218. </div>
  219. {% endif %}
  220. </div>
  221. </div>
  222. </div>
  223. <div class="row">
  224. <div class="col-md-12">
  225. {% if perms.dcim.change_interface or perms.dcim.delete_interface %}
  226. <form method="post">
  227. {% csrf_token %}
  228. <input type="hidden" name="virtual_machine" value="{{ vm.pk }}" />
  229. {% endif %}
  230. <div class="panel panel-default">
  231. <div class="panel-heading">
  232. <strong>Interfaces</strong>
  233. <div class="pull-right">
  234. <button class="btn btn-default btn-xs toggle-ips" selected="selected">
  235. <span class="glyphicon glyphicon-check" aria-hidden="true"></span> Show IPs
  236. </button>
  237. </div>
  238. </div>
  239. <table id="interfaces_table" class="table table-hover table-headings panel-body component-list">
  240. <thead>
  241. <tr>
  242. {% if perms.dcim.change_interface or perms.dcim.delete_interface %}
  243. <th class="pk"><input type="checkbox" class="toggle" title="Toggle all" /></th>
  244. {% endif %}
  245. <th>Name</th>
  246. <th>LAG</th>
  247. <th>Description</th>
  248. <th>MTU</th>
  249. <th>MAC Address</th>
  250. <th colspan="2">Connection</th>
  251. <th></th>
  252. </tr>
  253. </thead>
  254. <tbody>
  255. {% for iface in interfaces %}
  256. {% include 'dcim/inc/interface.html' with device=vm %}
  257. {% empty %}
  258. <tr>
  259. <td colspan="9" class="text-center text-muted">&mdash; No interfaces defined &mdash;</td>
  260. </tr>
  261. {% endfor %}
  262. </tbody>
  263. </table>
  264. {% if perms.dcim.add_interface or perms.dcim.delete_interface %}
  265. <div class="panel-footer">
  266. {% if interfaces and perms.dcim.change_interface %}
  267. <button type="submit" name="_rename" formaction="{% url 'dcim:interface_bulk_rename' %}?return_url={{ vm.get_absolute_url }}" class="btn btn-warning btn-xs">
  268. <span class="glyphicon glyphicon-pencil" aria-hidden="true"></span> Rename
  269. </button>
  270. <button type="submit" name="_edit" formaction="{% url 'virtualization:interface_bulk_edit' pk=vm.pk %}" class="btn btn-warning btn-xs">
  271. <span class="glyphicon glyphicon-pencil" aria-hidden="true"></span> Edit
  272. </button>
  273. {% endif %}
  274. {% if interfaces and perms.dcim.delete_interface %}
  275. <button type="submit" name="_delete" formaction="{% url 'virtualization:interface_bulk_delete' pk=vm.pk %}" class="btn btn-danger btn-xs">
  276. <span class="glyphicon glyphicon-trash" aria-hidden="true"></span> Delete
  277. </button>
  278. {% endif %}
  279. {% if perms.dcim.add_interface %}
  280. <div class="pull-right">
  281. <a href="{% url 'virtualization:interface_add' pk=vm.pk %}" class="btn btn-primary btn-xs">
  282. <span class="glyphicon glyphicon-plus" aria-hidden="true"></span> Add interfaces
  283. </a>
  284. </div>
  285. <div class="clearfix"></div>
  286. {% endif %}
  287. </div>
  288. {% endif %}
  289. </div>
  290. {% if perms.dcim.delete_interface %}
  291. </form>
  292. {% endif %}
  293. </div>
  294. </div>
  295. {% endblock %}
  296. {% block javascript %}
  297. <script type="text/javascript">
  298. // Toggle the display of IP addresses under interfaces
  299. $('button.toggle-ips').click(function() {
  300. var selected = $(this).attr('selected');
  301. if (selected) {
  302. $('#interfaces_table tr.ipaddress').hide();
  303. } else {
  304. $('#interfaces_table tr.ipaddress').show();
  305. }
  306. $(this).attr('selected', !selected);
  307. $(this).children('span').toggleClass('glyphicon-check glyphicon-unchecked');
  308. return false;
  309. });
  310. </script>
  311. {% endblock %}