github.com/zoomfoo/nomad@v0.8.5-0.20180907175415-f28fd3a1a056/ui/app/templates/clients/client.hbs (about)

     1  <section class="section">
     2    <h1 data-test-title class="title">
     3      <span data-test-node-status="{{model.compositeStatus}}" class="node-status-light {{model.compositeStatus}}"></span>
     4      {{or model.name model.shortId}}
     5      <span class="tag is-hollow is-small no-text-transform">{{model.id}}</span>
     6    </h1>
     7  
     8    <div class="boxed-section is-small">
     9      <div class="boxed-section-body inline-definitions">
    10        <span class="label">Client Details</span>
    11        <span class="pair" data-test-status-definition>
    12          <span class="term">Status</span>
    13          <span class="status-text node-{{model.status}}">{{model.status}}</span>
    14        </span>
    15        <span class="pair" data-test-address-definition>
    16          <span class="term">Address</span>
    17          {{model.httpAddr}}
    18        </span>
    19        <span class="pair" data-test-draining>
    20          <span class="term">Draining</span>
    21          {{#if model.isDraining}}
    22            <span class="status-text is-info">true</span>
    23          {{else}}
    24            false
    25          {{/if}}
    26        </span>
    27        <span class="pair" data-test-eligibility>
    28          <span class="term">Eligibility</span>
    29          {{#if model.isEligible}}
    30            {{model.schedulingEligibility}}
    31          {{else}}
    32            <span class="status-text is-warning">{{model.schedulingEligibility}}</span>
    33          {{/if}}
    34        </span>
    35        <span class="pair" data-test-datacenter-definition>
    36          <span class="term">Datacenter</span>
    37          {{model.datacenter}}
    38        </span>
    39        <span class="pair" data-test-driver-health>
    40          <span class="term">Drivers</span>
    41          {{#if model.unhealthyDrivers.length}}
    42            {{x-icon "warning" class="is-text is-warning"}}
    43            {{model.unhealthyDrivers.length}} of {{model.detectedDrivers.length}} {{pluralize "driver" model.detectedDrivers.length}} unhealthy
    44          {{else}}
    45            All healthy
    46          {{/if}}
    47        </span>
    48      </div>
    49    </div>
    50  
    51    {{#if model.drainStrategy}}
    52      <div class="boxed-section is-small is-info">
    53        <div class="boxed-section-body inline-definitions">
    54          <span class="label">Drain Strategy</span>
    55          <span class="pair" data-test-drain-deadline>
    56            <span class="term">Deadline</span>
    57            {{#if model.drainStrategy.isForced}}
    58              <span class="badge is-danger">Forced Drain</span>
    59            {{else if model.drainStrategy.hasNoDeadline}}
    60              No deadline
    61            {{else}}
    62              {{format-duration model.drainStrategy.deadline}}
    63            {{/if}}
    64          </span>
    65          {{#if model.drainStrategy.forceDeadline}}
    66            <span class="pair" data-test-drain-forced-deadline>
    67              <span class="term">Forced Deadline</span>
    68              {{moment-format model.drainStrategy.forceDeadline "MM/DD/YY HH:mm:ss"}}
    69              ({{moment-from-now model.drainStrategy.forceDeadline interval=1000}})
    70            </span>
    71          {{/if}}
    72          <span class="pair" data-test-drain-ignore-system-jobs>
    73            <span class="term">Ignore System Jobs?</span>
    74            {{if model.drainStrategy.ignoreSystemJobs "Yes" "No"}}
    75          </span>
    76        </div>
    77      </div>
    78    {{/if}}
    79  
    80    <div class="boxed-section">
    81      <div class="boxed-section-head">
    82        <div>Allocations <span class="badge is-white">{{model.allocations.length}}</span></div>
    83        {{search-box
    84          searchTerm=(mut searchTerm)
    85          placeholder="Search allocations..."
    86          class="is-inline pull-right"
    87          inputClass="is-compact"}}
    88      </div>
    89      <div class="boxed-section-body is-full-bleed">
    90        {{#list-pagination
    91          source=sortedAllocations
    92          size=pageSize
    93          page=currentPage as |p|}}
    94          {{#list-table
    95            source=p.list
    96            sortProperty=sortProperty
    97            sortDescending=sortDescending
    98            class="with-foot" as |t|}}
    99            {{#t.head}}
   100              <th class="is-narrow"></th>
   101              {{#t.sort-by prop="shortId"}}ID{{/t.sort-by}}
   102              {{#t.sort-by prop="modifyIndex" title="Modify Index"}}Modified{{/t.sort-by}}
   103              {{#t.sort-by prop="createIndex" title="Create Index"}}Created{{/t.sort-by}}
   104              {{#t.sort-by prop="statusIndex"}}Status{{/t.sort-by}}
   105              {{#t.sort-by prop="job.name"}}Job{{/t.sort-by}}
   106              {{#t.sort-by prop="jobVersion"}}Version{{/t.sort-by}}
   107              <th>CPU</th>
   108              <th>Memory</th>
   109            {{/t.head}}
   110            {{#t.body as |row|}}
   111              {{allocation-row
   112                allocation=row.model
   113                context="node"
   114                onClick=(action "gotoAllocation" row.model)
   115                data-test-allocation=row.model.id}}
   116            {{/t.body}}
   117          {{/list-table}}
   118          <div class="table-foot">
   119            <nav class="pagination">
   120              <div class="pagination-numbers">
   121                {{p.startsAt}}&ndash;{{p.endsAt}} of {{sortedAllocations.length}}
   122              </div>
   123              {{#p.prev class="pagination-previous"}} &lt; {{/p.prev}}
   124              {{#p.next class="pagination-next"}} &gt; {{/p.next}}
   125              <ul class="pagination-list"></ul>
   126            </nav>
   127          </div>
   128        {{/list-pagination}}
   129      </div>
   130    </div>
   131  
   132    <div data-test-client-events class="boxed-section">
   133      <div class="boxed-section-head">
   134        Client Events
   135      </div>
   136      <div class="boxed-section-body is-full-bleed">
   137        {{#list-table source=sortedEvents class="is-striped" as |t|}}
   138          {{#t.head}}
   139            <th class="is-2">Time</th>
   140            <th class="is-2">Subsystem</th>
   141            <th>Message</th>
   142          {{/t.head}}
   143          {{#t.body as |row|}}
   144            <tr data-test-client-event>
   145              <td data-test-client-event-time>{{moment-format row.model.time "MM/DD/YY HH:mm:ss"}}</td>
   146              <td data-test-client-event-subsystem>{{row.model.subsystem}}</td>
   147              <td data-test-client-event-message>
   148                {{#if row.model.message}}
   149                  {{#if row.model.driver}}
   150                    <span class="badge is-secondary is-small">{{row.model.driver}}</span>
   151                  {{/if}}
   152                  {{row.model.message}}
   153                {{else}}
   154                  <em>No message</em>
   155                {{/if}}
   156              </td>
   157            </tr>
   158          {{/t.body}}
   159        {{/list-table}}
   160      </div>
   161    </div>
   162  
   163    <div data-test-driver-status class="boxed-section">
   164      <div class="boxed-section-head">
   165        Driver Status
   166      </div>
   167      <div class="boxed-section-body">
   168        {{#list-accordion source=sortedDrivers key="name" as |a|}}
   169          {{#a.head buttonLabel="details" isExpandable=a.item.detected}}
   170            <div class="columns inline-definitions {{unless a.item.detected "is-faded"}}">
   171              <div class="column is-1">
   172                <span data-test-name>{{a.item.name}}</span>
   173              </div>
   174              <div class="column is-2">
   175                {{#if a.item.detected}}
   176                  <span data-test-health>
   177                    <span class="color-swatch {{a.item.healthClass}}"></span>
   178                    {{if a.item.healthy "Healthy" "Unhealthy"}}
   179                  </span>
   180                {{/if}}
   181              </div>
   182              <div class="column">
   183                <span class="pair">
   184                  <span class="term">Detected</span>
   185                  <span data-test-detected>{{if a.item.detected "Yes" "No"}}</span>
   186                </span>
   187                <span class="is-pulled-right">
   188                  <span class="pair">
   189                    <span class="term">Last Updated</span>
   190                    <span data-test-last-updated>{{moment-from-now a.item.updateTime interval=1000}}</span>
   191                  </span>
   192                </span>
   193              </div>
   194            </div>
   195          {{/a.head}}
   196          {{#a.body}}
   197            <p data-test-health-description class="message">{{a.item.healthDescription}}</p>
   198            <div data-test-driver-attributes class="boxed-section">
   199              <div class="boxed-section-head">
   200                 {{capitalize a.item.name}} Attributes
   201              </div>
   202              {{#if a.item.attributes.attributesStructured}}
   203                <div class="boxed-section-body is-full-bleed">
   204                  {{attributes-table
   205                    attributes=a.item.attributesShort
   206                    class="attributes-table"}}
   207                </div>
   208              {{else}}
   209                <div class="boxed-section-body">
   210                  <div class="empty-message">
   211                    <h3 class="empty-message-headline">No Driver Attributes</h3>
   212                  </div>
   213                </div>
   214              {{/if}}
   215            </div>
   216          {{/a.body}}
   217        {{/list-accordion}}
   218      </div>
   219    </div>
   220  
   221    <div class="boxed-section">
   222      <div class="boxed-section-head">
   223        Attributes
   224      </div>
   225      <div class="boxed-section-body is-full-bleed">
   226        {{attributes-table
   227          data-test-attributes
   228          attributes=model.attributes.attributesStructured
   229          class="attributes-table"}}
   230      </div>
   231      <div class="boxed-section-head">
   232        Meta
   233      </div>
   234      {{#if model.meta.attributesStructured}}
   235        <div class="boxed-section-body is-full-bleed">
   236          {{attributes-table
   237            data-test-meta
   238            attributes=model.meta.attributesStructured
   239            class="attributes-table"}}
   240        </div>
   241      {{else}}
   242        <div class="boxed-section-body">
   243          <div data-test-empty-meta-message class="empty-message">
   244            <h3 class="empty-message-headline">No Meta Attributes</h3>
   245            <p class="empty-message-body">This client is configured with no meta attributes.</p>
   246          </div>
   247        </div>
   248      {{/if}}
   249    </div>
   250  </section>