Annotate volume row and make the tr clickable

This commit is contained in:
Michael Lange 2020-04-03 19:19:49 -07:00
parent 62aa943a95
commit 280fa5d53b
2 changed files with 16 additions and 10 deletions

View file

@ -56,5 +56,11 @@ export default Controller.extend(
this.set('currentPage', 1); this.set('currentPage', 1);
} }
}, },
actions: {
gotoVolume(volume) {
this.transitionToRoute('csi.volumes.volume', volume.get('plainId'));
},
},
} }
); );

View file

@ -22,21 +22,21 @@
<th># Allocs</th> <th># Allocs</th>
{{/t.head}} {{/t.head}}
{{#t.body key="model.name" as |row|}} {{#t.body key="model.name" as |row|}}
<tr class="is-interactive"> <tr class="is-interactive" data-test-volume-row {{on "click" (action "gotoVolume" row.model)}}>
<td> <td data-test-volume-name>
{{#link-to "csi.volumes.volume" row.model.plainId class="is-primary"}}{{row.model.name}}{{/link-to}} {{#link-to "csi.volumes.volume" row.model.plainId class="is-primary"}}{{row.model.name}}{{/link-to}}
</td> </td>
<td>{{if row.model.schedulable "Schedulable" "Unschedulable"}}</td> <td data-test-volume-schedulable>{{if row.model.schedulable "Schedulable" "Unschedulable"}}</td>
<td> <td data-test-volume-controller-health>
{{if (gt row.model.controllersHealthy 0) "Healthy" "Unhealthy"}} {{if (gt row.model.controllersHealthy 0) "Healthy" "Unhealthy"}}
({{row.model.controllersHealthy}}/{{row.model.controllersExpected}}) ({{row.model.controllersHealthy}}/{{row.model.controllersExpected}})
</td> </td>
<td> <td data-test-volume-node-health>
{{if (gt row.model.nodesHealthy 0) "Healthy" "Unhealthy"}} {{if (gt row.model.nodesHealthy 0) "Healthy" "Unhealthy"}}
({{row.model.nodesHealthy}}/{{row.model.nodesExpected}}) ({{row.model.nodesHealthy}}/{{row.model.nodesExpected}})
</td> </td>
<td>{{row.model.provider}}</td> <td data-test-volume-provider>{{row.model.provider}}</td>
<td>{{row.model.allocations.length}}</td> <td data-test-volume-allocations>{{row.model.allocations.length}}</td>
</tr> </tr>
{{/t.body}} {{/t.body}}
{{/list-table}} {{/list-table}}
@ -53,11 +53,11 @@
</div> </div>
{{/list-pagination}} {{/list-pagination}}
{{else}} {{else}}
<div data-test-empty-jobs-list class="empty-message"> <div data-test-empty-volumes-list class="empty-message">
{{#if (eq sortedVolumes.length 0)}} {{#if (eq sortedVolumes.length 0)}}
<h3 data-test-empty-jobs-list-headline class="empty-message-headline">No Volumes</h3> <h3 data-test-empty-volumes-list-headline class="empty-message-headline">No Volumes</h3>
<p class="empty-message-body"> <p class="empty-message-body">
The cluster currently has no CSI volumes. The cluster currently has no CSI Volumes.
</p> </p>
{{/if}} {{/if}}
</div> </div>