a5a659a98a
Show the count in the allocations table next to the existing total alloc count badge. Clicking either will filter by all or by preemptions.
280 lines
10 KiB
Handlebars
280 lines
10 KiB
Handlebars
<section class="section">
|
|
<h1 data-test-title class="title">
|
|
<span data-test-node-status="{{model.compositeStatus}}" class="node-status-light {{model.compositeStatus}}"></span>
|
|
{{or model.name model.shortId}}
|
|
<span class="tag is-hollow is-small no-text-transform">{{model.id}}</span>
|
|
</h1>
|
|
|
|
<div class="boxed-section is-small">
|
|
<div class="boxed-section-body inline-definitions">
|
|
<span class="label">Client Details</span>
|
|
<span class="pair" data-test-status-definition>
|
|
<span class="term">Status</span>
|
|
<span class="status-text node-{{model.status}}">{{model.status}}</span>
|
|
</span>
|
|
<span class="pair" data-test-address-definition>
|
|
<span class="term">Address</span>
|
|
{{model.httpAddr}}
|
|
</span>
|
|
<span class="pair" data-test-draining>
|
|
<span class="term">Draining</span>
|
|
{{#if model.isDraining}}
|
|
<span class="status-text is-info">true</span>
|
|
{{else}}
|
|
false
|
|
{{/if}}
|
|
</span>
|
|
<span class="pair" data-test-eligibility>
|
|
<span class="term">Eligibility</span>
|
|
{{#if model.isEligible}}
|
|
{{model.schedulingEligibility}}
|
|
{{else}}
|
|
<span class="status-text is-warning">{{model.schedulingEligibility}}</span>
|
|
{{/if}}
|
|
</span>
|
|
<span class="pair" data-test-datacenter-definition>
|
|
<span class="term">Datacenter</span>
|
|
{{model.datacenter}}
|
|
</span>
|
|
<span class="pair" data-test-driver-health>
|
|
<span class="term">Drivers</span>
|
|
{{#if model.unhealthyDrivers.length}}
|
|
{{x-icon "warning" class="is-text is-warning"}}
|
|
{{model.unhealthyDrivers.length}} of {{model.detectedDrivers.length}} {{pluralize "driver" model.detectedDrivers.length}} unhealthy
|
|
{{else}}
|
|
All healthy
|
|
{{/if}}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
|
|
{{#if model.drainStrategy}}
|
|
<div class="boxed-section is-small is-info">
|
|
<div class="boxed-section-body inline-definitions">
|
|
<span class="label">Drain Strategy</span>
|
|
<span class="pair" data-test-drain-deadline>
|
|
<span class="term">Deadline</span>
|
|
{{#if model.drainStrategy.isForced}}
|
|
<span class="badge is-danger">Forced Drain</span>
|
|
{{else if model.drainStrategy.hasNoDeadline}}
|
|
No deadline
|
|
{{else}}
|
|
{{format-duration model.drainStrategy.deadline}}
|
|
{{/if}}
|
|
</span>
|
|
{{#if model.drainStrategy.forceDeadline}}
|
|
<span class="pair" data-test-drain-forced-deadline>
|
|
<span class="term">Forced Deadline</span>
|
|
{{format-ts model.drainStrategy.forceDeadline}}
|
|
({{moment-from-now model.drainStrategy.forceDeadline interval=1000}})
|
|
</span>
|
|
{{/if}}
|
|
<span class="pair" data-test-drain-ignore-system-jobs>
|
|
<span class="term">Ignore System Jobs?</span>
|
|
{{if model.drainStrategy.ignoreSystemJobs "Yes" "No"}}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
{{/if}}
|
|
|
|
<div class="boxed-section">
|
|
<div class="boxed-section-head is-hollow">
|
|
Resource Utilization
|
|
</div>
|
|
<div class="boxed-section-body">
|
|
<div class="columns">
|
|
<div class="column">
|
|
{{primary-metric resource=model metric="cpu"}}
|
|
</div>
|
|
<div class="column">
|
|
{{primary-metric resource=model metric="memory"}}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="boxed-section">
|
|
<div class="boxed-section-head">
|
|
<div>
|
|
Allocations
|
|
<button role="button" class="badge is-white" onclick={{action "setPreemptionFilter" false}}>
|
|
{{model.allocations.length}}
|
|
</button>
|
|
{{#if preemptions.length}}
|
|
<button role="button" class="badge is-warning" onclick={{action "setPreemptionFilter" true}}>
|
|
{{preemptions.length}} {{pluralize "preemption" preemptions.length}}
|
|
</button>
|
|
{{/if}}
|
|
</div>
|
|
{{search-box
|
|
searchTerm=(mut searchTerm)
|
|
onChange=(action resetPagination)
|
|
placeholder="Search allocations..."
|
|
class="is-inline pull-right"
|
|
inputClass="is-compact"}}
|
|
</div>
|
|
<div class="boxed-section-body is-full-bleed">
|
|
{{#list-pagination
|
|
source=sortedAllocations
|
|
size=pageSize
|
|
page=currentPage as |p|}}
|
|
{{#list-table
|
|
source=p.list
|
|
sortProperty=sortProperty
|
|
sortDescending=sortDescending
|
|
class="with-foot" as |t|}}
|
|
{{#t.head}}
|
|
<th class="is-narrow"></th>
|
|
{{#t.sort-by prop="shortId"}}ID{{/t.sort-by}}
|
|
{{#t.sort-by prop="modifyIndex" title="Modify Index"}}Modified{{/t.sort-by}}
|
|
{{#t.sort-by prop="createIndex" title="Create Index"}}Created{{/t.sort-by}}
|
|
{{#t.sort-by prop="statusIndex"}}Status{{/t.sort-by}}
|
|
{{#t.sort-by prop="job.name"}}Job{{/t.sort-by}}
|
|
{{#t.sort-by prop="jobVersion"}}Version{{/t.sort-by}}
|
|
<th>CPU</th>
|
|
<th>Memory</th>
|
|
{{/t.head}}
|
|
{{#t.body as |row|}}
|
|
{{allocation-row
|
|
allocation=row.model
|
|
context="node"
|
|
onClick=(action "gotoAllocation" row.model)
|
|
data-test-allocation=row.model.id}}
|
|
{{/t.body}}
|
|
{{/list-table}}
|
|
<div class="table-foot">
|
|
<nav class="pagination">
|
|
<div class="pagination-numbers">
|
|
{{p.startsAt}}–{{p.endsAt}} of {{sortedAllocations.length}}
|
|
</div>
|
|
{{#p.prev class="pagination-previous"}} < {{/p.prev}}
|
|
{{#p.next class="pagination-next"}} > {{/p.next}}
|
|
<ul class="pagination-list"></ul>
|
|
</nav>
|
|
</div>
|
|
{{/list-pagination}}
|
|
</div>
|
|
</div>
|
|
|
|
<div data-test-client-events class="boxed-section">
|
|
<div class="boxed-section-head">
|
|
Client Events
|
|
</div>
|
|
<div class="boxed-section-body is-full-bleed">
|
|
{{#list-table source=sortedEvents class="is-striped" as |t|}}
|
|
{{#t.head}}
|
|
<th class="is-2">Time</th>
|
|
<th class="is-2">Subsystem</th>
|
|
<th>Message</th>
|
|
{{/t.head}}
|
|
{{#t.body as |row|}}
|
|
<tr data-test-client-event>
|
|
<td data-test-client-event-time>{{format-ts row.model.time}}</td>
|
|
<td data-test-client-event-subsystem>{{row.model.subsystem}}</td>
|
|
<td data-test-client-event-message>
|
|
{{#if row.model.message}}
|
|
{{#if row.model.driver}}
|
|
<span class="badge is-secondary is-small">{{row.model.driver}}</span>
|
|
{{/if}}
|
|
{{row.model.message}}
|
|
{{else}}
|
|
<em>No message</em>
|
|
{{/if}}
|
|
</td>
|
|
</tr>
|
|
{{/t.body}}
|
|
{{/list-table}}
|
|
</div>
|
|
</div>
|
|
|
|
<div data-test-driver-status 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 data-test-name>{{a.item.name}}</span>
|
|
</div>
|
|
<div class="column is-2">
|
|
{{#if a.item.detected}}
|
|
<span data-test-health>
|
|
<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>
|
|
<span data-test-detected>{{if a.item.detected "Yes" "No"}}</span>
|
|
</span>
|
|
<span class="is-pulled-right">
|
|
<span class="pair">
|
|
<span class="term">Last Updated</span>
|
|
<span data-test-last-updated class="tooltip" aria-label="{{format-ts a.item.updateTime}}">
|
|
{{moment-from-now a.item.updateTime interval=1000}}
|
|
</span>
|
|
</span>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
{{/a.head}}
|
|
{{#a.body}}
|
|
<p data-test-health-description class="message">{{a.item.healthDescription}}</p>
|
|
<div data-test-driver-attributes 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.attributesShort
|
|
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
|
|
</div>
|
|
<div class="boxed-section-body is-full-bleed">
|
|
{{attributes-table
|
|
data-test-attributes
|
|
attributes=model.attributes.attributesStructured
|
|
class="attributes-table"}}
|
|
</div>
|
|
<div class="boxed-section-head">
|
|
Meta
|
|
</div>
|
|
{{#if model.meta.attributesStructured}}
|
|
<div class="boxed-section-body is-full-bleed">
|
|
{{attributes-table
|
|
data-test-meta
|
|
attributes=model.meta.attributesStructured
|
|
class="attributes-table"}}
|
|
</div>
|
|
{{else}}
|
|
<div class="boxed-section-body">
|
|
<div data-test-empty-meta-message class="empty-message">
|
|
<h3 class="empty-message-headline">No Meta Attributes</h3>
|
|
<p class="empty-message-body">This client is configured with no meta attributes.</p>
|
|
</div>
|
|
</div>
|
|
{{/if}}
|
|
</div>
|
|
</section>
|