kemko/nomad
1
0
Fork 0
mirror of https://github.com/kemko/nomad.git synced 2026-01-05 18:05:42 +03:00
Code Issues Packages Projects Releases Wiki Activity

Add driver status accordion section to the client detail page

Browse Source
This commit is contained in:
Michael Lange
2018-05-08 18:09:20 -07:00
parent 53244e2462
commit 8fa044a52a
3 changed files with 67 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
ui/app/controllers/clients/client.js
View File

@@ -30,6 +30,10 @@ export default Controller.extend(Sortable, Searchable, {
.reverse();
}),
sortedDrivers: computed('model.drivers.@each.name', function() {
return this.get('model.drivers').sortBy('name');
}),
actions: {
gotoAllocation(allocation) {
this.transitionToRoute('allocations.allocation', allocation);

5
ui/app/models/node-driver.js
View File

@@ -1,4 +1,5 @@
import Fragment from 'ember-data-model-fragments/fragment';
import { computed } from '@ember/object';
import attr from 'ember-data/attr';
import { fragmentOwner } from 'ember-data-model-fragments/attributes';
import { fragment } from 'ember-data-model-fragments/attributes';
@@ -12,4 +13,8 @@ export default Fragment.extend({
healthy: attr('boolean', { defaultValue: false }),
healthDescription: attr('string'),
updateTime: attr('date'),
healthClass: computed('healthy', function() {
return this.get('healthy') ? 'running' : 'failed';
}),
});

58
ui/app/templates/clients/client.hbs
View File

@@ -121,6 +121,64 @@
</div>
</div>
<div class="boxed-section">
<div class="boxed-section-head">
Driver Status
</div>
<div class="boxed-section-body">
{{#list-accordion source=sortedDrivers key="name" as |a|}}
{{#a.head buttonLabel="details" isExpandable=a.item.detected}}
<div class="columns inline-definitions {{unless a.item.detected "is-faded"}}">
<div class="column is-1">
<span>{{a.item.name}}</span>
</div>
<div class="column is-2">
{{#if a.item.detected}}
<span>
<span class="color-swatch {{a.item.healthClass}}"></span>
{{if a.item.healthy "Healthy" "Unhealthy"}}
</span>
{{/if}}
</div>
<div class="column">
<span class="pair">
<span class="term">Detected</span>
{{if a.item.detected "Yes" "No"}}
</span>
<span class="is-pulled-right">
<span class="pair">
<span class="term">Last Updated</span>
{{moment-from-now a.item.updateTime interval=1000}}
</span>
</span>
</div>
</div>
{{/a.head}}
{{#a.body}}
<p class="message">{{a.item.healthDescription}}</p>
<div class="boxed-section">
<div class="boxed-section-head">
{{capitalize a.item.name}} Attributes
</div>
{{#if a.item.attributes.attributesStructured}}
<div class="boxed-section-body is-full-bleed">
{{attributes-table
attributes=a.item.attributes.attributesStructured
class="attributes-table"}}
</div>
{{else}}
<div class="boxed-section-body">
<div class="empty-message">
<h3 class="empty-message-headline">No Driver Attributes</h3>
</div>
</div>
{{/if}}
</div>
{{/a.body}}
{{/list-accordion}}
</div>
</div>
<div class="boxed-section">
<div class="boxed-section-head">
Attributes