ironic-ui/ironic_ui/static/dashboard/admin/ironic/node-list/node-list.html

196 lines
7.9 KiB
HTML

<div ng-controller="IronicNodeListController as table">
<hz-magic-search-context filter-facets="table.nodeFacets">
<hz-magic-search-bar>
</hz-magic-search-bar>
<table st-magic-search
hz-table ng-cloak
st-table="table.nodes"
st-safe-src="table.nodesSrc"
default-sort="name"
default-sort-reverse="false"
class="table table-striped table-rsp table-detail">
<thead>
<tr>
<th colspan="8">
<div class="pull-right">
<button class="btn btn-default btn-sm"
style="margin-right:10px;"
ng-click="table.refresh()">
<span translate>Refresh</span>
</button>
<button class="btn btn-default btn-sm"
ng-click="table.enrollNode()">
<span class="fa fa-plus"></span>
<span translate>Enroll Node</span>
</button>
</div>
</th>
<th class="action-col">
<action-list dropdown class="pull-right">
<action button-type="split-button"
action-classes="'btn btn-default btn-sm'"
callback="table.actions.powerOnAll"
item="tCtrl.selected"
disabled="tCtrl.selected.length === 0">
{$ 'Power on' | translate $}
</action>
<menu>
<action button-type="menu-item"
callback="table.actions.powerOffAll"
item="tCtrl.selected"
disabled="tCtrl.selected.length === 0">
{$ 'Power off' | translate $}
</action>
<action button-type="menu-item"
callback="table.putNodesInMaintenanceMode"
item="tCtrl.selected"
disabled="tCtrl.selected.length === 0">
{$ 'Maintenance on' | translate $}
</action>
<action button-type="menu-item"
callback="table.removeNodesFromMaintenanceMode"
item="tCtrl.selected"
disabled="tCtrl.selected.length === 0">
{$ 'Maintenance off' | translate $}
</action>
<action button-type="menu-item"
callback="table.actions.deleteNodes"
item="tCtrl.selected"
disabled="tCtrl.selected.length === 0">
<span class="fa fa-trash"></span>
{$ 'Delete nodes' | translate $}
</action>
</menu>
</action-list>
</th>
</tr>
<tr>
<th class="multi_select_column">
<input type="checkbox"
hz-select-all="table.nodes"/>
</th>
<th translate class="rsp-p1" st-sort="name" st-sort-default="name">
Node Name
</th>
<th translate class="rsp-p1" st-sort="instance_uuid">
Instance ID
</th>
<th translate class="rsp-p2" st-sort="power_state">
Power State
</th>
<th translate class="rsp-p2" st-sort="provision_state">
Provisioning State
</th>
<th translate class="rsp-p2" st-sort="maintenance">
Maintenance
</th>
<th translate class="rsp-p2" st-sort="ports">
Ports
</th>
<th translate class="rsp-p2" st-sort="driver">
Driver
</th>
<th translate class="actions_column">
Actions
</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="node in table.nodes">
<td class="multi_select_column">
<input type="checkbox"
hz-select="node"
ng-model="tCtrl.selections[node.id].checked"/>
</td>
<td class="rsp-p1">
<a href="{$ node.uuid $}">
{$ node.name || node.uuid $}
</a>
</td>
<td class="rsp-p1">
<!-- multiple tags used purposefully to ensure that the link
is removed if node uuid == no instance. Using ng-attr-href
only removed the href and the <a> styling remained which could
cause confusion for users. -->
<a href="/admin/instances/{$ node.instance_uuid $}/detail"
ng-if="node.instance_uuid">
{$ node.instance_uuid $}
</a>
<span ng-if="!node.instance_uuid">{$ 'No Instance' | translate $}</span>
</td>
<td class="rsp-p2" >
<div ng-class="{'running': node.target_power_state}">
{$ node.power_state $}
</div>
</td>
<td class="rsp-p2">{$ node.provision_state $}</td>
<td class="rsp-p2">{$ node.maintenance | yesno $}</td>
<td class="rsp-p2">{$ node.ports.length $}</td>
<td class="rsp-p2">{$ node.driver $}</td>
<td class="actions_column">
<action-list dropdown>
<action button-type="split-button"
action-classes="'btn btn-default btn-sm'"
callback="table.actions.powerOn"
disabled="node.power_state !== 'power off'"
item="node">
{$ 'Power on' | translate $}
</action>
<menu>
<action button-type="menu-item"
callback="table.actions.powerOff"
disabled="node.power_state !== 'power on'"
item="node">
{$ 'Power off' | translate $}
</action>
<action button-type="menu-item"
callback="table.putNodeInMaintenanceMode"
disabled="node.maintenance"
item="node">
{$ 'Maintenance on' | translate $}
</action>
<action button-type="menu-item"
callback="table.removeNodeFromMaintenanceMode"
disabled="!node.maintenance"
item="node">
{$ 'Maintenance off' | translate $}
</action>
<action button-type="menu-item"
callback="table.actions.deleteNode"
disabled="!(node.provision_state === 'available' || node.provision_state === 'nostate' || node.provision_state === 'manageable' || node.provision_state === 'enroll')"
item="node">
<span class="fa fa-trash"></span>
{$ 'Delete node' | translate $}
</action>
<action button-type="menu-item"
callback="table.actions.createPort"
item="node">
{$ 'Create port' | translate $}
</action>
<action ng-repeat="targetState in
['manageable', 'available', 'active']"
button-type="menu-item"
callback="table.actions.setProvisionState"
item="{node: node,
verb: table.actions.getProvisionStateTransitionVerb(
node.provision_state,
targetState)}"
disabled="table.actions.getProvisionStateTransitionVerb(
node.provision_state,
targetState) === null">
{$ ('Move to ' | translate) + targetState $}
</action>
</action-list>
</td>
</tr>
</tbody>
<tfoot hz-table-footer items="table.nodes"></tfoot>
</table>
</hz-magic-search-context>
</div>