github.com/emate/nomad@v0.8.2-wo-binpacking/ui/app/templates/clients/client.hbs (about)

     1  {{#global-header class="page-header"}}
     2    <li>
     3      {{#link-to "clients.index" data-test-breadcrumb="clients"}}Clients{{/link-to}}
     4    </li>
     5    <li class="is-active">
     6      {{#link-to "clients.client" model.id data-test-breadcrumb="client"}}{{model.shortId}}{{/link-to}}
     7    </li>
     8  {{/global-header}}
     9  {{#gutter-menu class="page-body"}}
    10    <section class="section">
    11      <h1 data-test-title class="title">
    12        <span data-test-node-status="{{model.status}}" class="node-status-light {{model.status}}"></span>
    13        {{or model.name model.shortId}}
    14        <span class="tag is-hollow is-small no-text-transform">{{model.id}}</span>
    15      </h1>
    16  
    17      <div class="boxed-section is-small">
    18        <div class="boxed-section-body inline-definitions">
    19          <span class="label">Client Details</span>
    20          <span class="pair" data-test-status-definition><span class="term">Status</span> <span class="status-text node-{{model.status}}">{{model.status}}</span></span>
    21          <span class="pair" data-test-address-definition><span class="term">Address</span> {{model.httpAddr}}</span>
    22          <span class="pair" data-test-datacenter-definition><span class="term">Datacenter</span> {{model.datacenter}}</span>
    23        </div>
    24      </div>
    25  
    26      <div class="boxed-section">
    27        <div class="boxed-section-head">
    28          <div>Allocations <span class="badge is-white">{{model.allocations.length}}</span></div>
    29          {{search-box
    30            searchTerm=(mut searchTerm)
    31            placeholder="Search allocations..."
    32            class="is-inline pull-right"
    33            inputClass="is-compact"}}
    34        </div>
    35        <div class="boxed-section-body is-full-bleed">
    36          {{#list-pagination
    37            source=sortedAllocations
    38            size=pageSize
    39            page=currentPage as |p|}}
    40            {{#list-table
    41              source=p.list
    42              sortProperty=sortProperty
    43              sortDescending=sortDescending
    44              class="with-foot" as |t|}}
    45              {{#t.head}}
    46                {{#t.sort-by prop="shortId"}}ID{{/t.sort-by}}
    47                {{#t.sort-by prop="modifyIndex" title="Modify Index"}}Modified{{/t.sort-by}}
    48                {{#t.sort-by prop="name"}}Name{{/t.sort-by}}
    49                {{#t.sort-by prop="statusIndex"}}Status{{/t.sort-by}}
    50                {{#t.sort-by prop="job.name"}}Job{{/t.sort-by}}
    51                {{#t.sort-by prop="jobVersion"}}Version{{/t.sort-by}}
    52                <th>CPU</th>
    53                <th>Memory</th>
    54              {{/t.head}}
    55              {{#t.body as |row|}}
    56                {{allocation-row
    57                  allocation=row.model
    58                  context="node"
    59                  onClick=(action "gotoAllocation" row.model)
    60                  data-test-allocation=row.model.id}}
    61              {{/t.body}}
    62            {{/list-table}}
    63            <div class="table-foot">
    64              <nav class="pagination">
    65                <div class="pagination-numbers">
    66                  {{p.startsAt}}&ndash;{{p.endsAt}} of {{sortedAllocations.length}}
    67                </div>
    68                {{#p.prev class="pagination-previous"}} &lt; {{/p.prev}}
    69                {{#p.next class="pagination-next"}} &gt; {{/p.next}}
    70                <ul class="pagination-list"></ul>
    71              </nav>
    72            </div>
    73          {{/list-pagination}}
    74        </div>
    75      </div>
    76  
    77      <div class="boxed-section">
    78        <div class="boxed-section-head">
    79          Attributes
    80        </div>
    81        <div class="boxed-section-body is-full-bleed">
    82          {{attributes-table
    83            data-test-attributes
    84            attributes=model.attributes.attributesStructured
    85            class="attributes-table"}}
    86        </div>
    87        <div class="boxed-section-head">
    88          Meta
    89        </div>
    90        {{#if model.meta.attributesStructured}}
    91          <div class="boxed-section-body is-full-bleed">
    92            {{attributes-table
    93              data-test-meta
    94              attributes=model.meta.attributesStructured
    95              class="attributes-table"}}
    96          </div>
    97        {{else}}
    98          <div class="boxed-section-body">
    99            <div data-test-empty-meta-message class="empty-message">
   100              <h3 class="empty-message-headline">No Meta Attributes</h3>
   101              <p class="empty-message-body">This client is configured with no meta attributes.</p>
   102            </div>
   103          </div>
   104        {{/if}}
   105      </div>
   106    </section>
   107  {{/gutter-menu}}