github.com/Ilhicas/nomad@v1.0.4-0.20210304152020-e86851182bc3/ui/app/templates/csi/volumes/index.hbs (about)

     1  {{page-title "CSI Volumes"}}
     2  <div class="tabs is-subnav">
     3    <ul>
     4      <li data-test-tab="volumes"><LinkTo @route="csi.volumes.index" @activeClass="is-active">Volumes</LinkTo></li>
     5      <li data-test-tab="plugins"><LinkTo @route="csi.plugins.index" @activeClass="is-active">Plugins</LinkTo></li>
     6    </ul>
     7  </div>
     8  <section class="section">
     9    {{#if this.isForbidden}}
    10      <ForbiddenMessage />
    11    {{else}}
    12      <div class="toolbar">
    13        <div class="toolbar-item">
    14          {{#if this.model.length}}
    15            <SearchBox
    16              data-test-volumes-search
    17              @searchTerm={{mut this.searchTerm}}
    18              @onChange={{action this.resetPagination}}
    19              @placeholder="Search volumes..." />
    20          {{/if}}
    21        </div>
    22      </div>
    23      {{#if this.sortedVolumes}}
    24        <ListPagination
    25          @source={{this.sortedVolumes}}
    26          @size={{this.pageSize}}
    27          @page={{this.currentPage}} as |p|>
    28          <ListTable
    29            @source={{p.list}}
    30            @sortProperty={{this.sortProperty}}
    31            @sortDescending={{this.sortDescending}}
    32            @class="with-foot" as |t|>
    33            <t.head>
    34              <t.sort-by @prop="name">Name</t.sort-by>
    35              <t.sort-by @prop="schedulable">Volume Health</t.sort-by>
    36              <t.sort-by @prop="controllersHealthyProportion">Controller Health</t.sort-by>
    37              <t.sort-by @prop="nodesHealthyProportion">Node Health</t.sort-by>
    38              <t.sort-by @prop="provider">Provider</t.sort-by>
    39              <th># Allocs</th>
    40            </t.head>
    41            <t.body @key="model.name" as |row|>
    42              <tr class="is-interactive" data-test-volume-row {{on "click" (action "gotoVolume" row.model)}}>
    43                <td data-test-volume-name>
    44                  <LinkTo @route="csi.volumes.volume" @model={{row.model.plainId}} class="is-primary">{{row.model.name}}</LinkTo>
    45                </td>
    46                <td data-test-volume-schedulable>{{if row.model.schedulable "Schedulable" "Unschedulable"}}</td>
    47                <td data-test-volume-controller-health>
    48                  {{#if row.model.controllerRequired}}
    49                    {{if (gt row.model.controllersHealthy 0) "Healthy" "Unhealthy"}}
    50                    ({{row.model.controllersHealthy}}/{{row.model.controllersExpected}})
    51                  {{else}}
    52                    {{#if (gt row.model.controllersExpected 0)}}
    53                      {{if (gt row.model.controllersHealthy 0) "Healthy" "Unhealthy"}}
    54                      ({{row.model.controllersHealthy}}/{{row.model.controllersExpected}})
    55                    {{else}}
    56                      <em class="is-faded">Node Only</em>
    57                    {{/if}}
    58                  {{/if}}
    59                </td>
    60                <td data-test-volume-node-health>
    61                  {{if (gt row.model.nodesHealthy 0) "Healthy" "Unhealthy"}}
    62                  ({{row.model.nodesHealthy}}/{{row.model.nodesExpected}})
    63                </td>
    64                <td data-test-volume-provider>{{row.model.provider}}</td>
    65                <td data-test-volume-allocations>{{row.model.allocationCount}}</td>
    66              </tr>
    67            </t.body>
    68          </ListTable>
    69          <div class="table-foot">
    70            <PageSizeSelect @onChange={{action this.resetPagination}} />
    71            <nav class="pagination">
    72              <div class="pagination-numbers">
    73                {{p.startsAt}}&ndash;{{p.endsAt}} of {{this.sortedVolumes.length}}
    74              </div>
    75              <p.prev @class="pagination-previous">{{x-icon "chevron-left"}}</p.prev>
    76              <p.next @class="pagination-next">{{x-icon "chevron-right"}}</p.next>
    77              <ul class="pagination-list"></ul>
    78            </nav>
    79          </div>
    80        </ListPagination>
    81      {{else}}
    82        <div data-test-empty-volumes-list class="empty-message">
    83          {{#if (eq this.model.length 0)}}
    84            <h3 data-test-empty-volumes-list-headline class="empty-message-headline">No Volumes</h3>
    85            <p class="empty-message-body">
    86              The cluster currently has no CSI Volumes.
    87            </p>
    88          {{else if this.searchTerm}}
    89            <h3 data-test-empty-volumes-list-headline class="empty-message-headline">No Matches</h3>
    90            <p class="empty-message-body">
    91              No volumes match the term <strong>{{this.searchTerm}}</strong>
    92            </p>
    93          {{/if}}
    94        </div>
    95      {{/if}}
    96    {{/if}}
    97  </section>