130 lines
4.9 KiB
Handlebars
130 lines
4.9 KiB
Handlebars
{{title "Jobs"}}
|
||
<section class="section">
|
||
{{#if isForbidden}}
|
||
{{partial "partials/forbidden-message"}}
|
||
{{else}}
|
||
<div class="toolbar">
|
||
<div class="toolbar-item">
|
||
{{#if visibleJobs.length}}
|
||
{{search-box
|
||
data-test-jobs-search
|
||
searchTerm=(mut searchTerm)
|
||
onChange=(action resetPagination)
|
||
placeholder="Search jobs..."}}
|
||
{{/if}}
|
||
</div>
|
||
{{#if (media "isMobile")}}
|
||
<div class="toolbar-item is-right-aligned">
|
||
{{#if (can "run job")}}
|
||
{{#link-to "jobs.run" data-test-run-job class="button is-primary"}}Run Job{{/link-to}}
|
||
{{else}}
|
||
<button
|
||
data-test-run-job
|
||
class="button is-primary is-disabled tooltip is-right-aligned"
|
||
aria-label="You don’t have permission to run jobs"
|
||
disabled
|
||
>Run Job</button>
|
||
{{/if}}
|
||
</div>
|
||
{{/if}}
|
||
<div class="toolbar-item is-right-aligned is-mobile-full-width">
|
||
<div class="button-bar">
|
||
{{multi-select-dropdown
|
||
data-test-type-facet
|
||
label="Type"
|
||
options=optionsType
|
||
selection=selectionType
|
||
onSelect=(action setFacetQueryParam "qpType")}}
|
||
{{multi-select-dropdown
|
||
data-test-status-facet
|
||
label="Status"
|
||
options=optionsStatus
|
||
selection=selectionStatus
|
||
onSelect=(action setFacetQueryParam "qpStatus")}}
|
||
{{multi-select-dropdown
|
||
data-test-datacenter-facet
|
||
label="Datacenter"
|
||
options=optionsDatacenter
|
||
selection=selectionDatacenter
|
||
onSelect=(action setFacetQueryParam "qpDatacenter")}}
|
||
{{multi-select-dropdown
|
||
data-test-prefix-facet
|
||
label="Prefix"
|
||
options=optionsPrefix
|
||
selection=selectionPrefix
|
||
onSelect=(action setFacetQueryParam "qpPrefix")}}
|
||
</div>
|
||
</div>
|
||
{{#if (not (media "isMobile"))}}
|
||
<div class="toolbar-item is-right-aligned">
|
||
{{#if (can "run job")}}
|
||
{{#link-to "jobs.run" data-test-run-job class="button is-primary"}}Run Job{{/link-to}}
|
||
{{else}}
|
||
<button
|
||
data-test-run-job
|
||
class="button is-primary is-disabled tooltip is-right-aligned"
|
||
aria-label="You don’t have permission to run jobs"
|
||
disabled
|
||
>Run Job</button>
|
||
{{/if}}
|
||
</div>
|
||
{{/if}}
|
||
</div>
|
||
{{#if sortedJobs}}
|
||
{{#list-pagination
|
||
source=sortedJobs
|
||
size=pageSize
|
||
page=currentPage as |p|}}
|
||
{{#list-table
|
||
source=p.list
|
||
sortProperty=sortProperty
|
||
sortDescending=sortDescending
|
||
class="with-foot" as |t|}}
|
||
{{#t.head}}
|
||
{{#t.sort-by prop="name"}}Name{{/t.sort-by}}
|
||
{{#t.sort-by prop="status"}}Status{{/t.sort-by}}
|
||
{{#t.sort-by prop="type"}}Type{{/t.sort-by}}
|
||
{{#t.sort-by prop="priority"}}Priority{{/t.sort-by}}
|
||
<th>Groups</th>
|
||
<th class="is-3">Summary</th>
|
||
{{/t.head}}
|
||
{{#t.body key="model.id" as |row|}}
|
||
{{job-row data-test-job-row=row.model.plainId job=row.model onClick=(action "gotoJob" row.model)}}
|
||
{{/t.body}}
|
||
{{/list-table}}
|
||
<div class="table-foot">
|
||
{{page-size-select onChange=(action resetPagination)}}
|
||
<nav class="pagination">
|
||
<div class="pagination-numbers">
|
||
{{p.startsAt}}–{{p.endsAt}} of {{sortedJobs.length}}
|
||
{{#if searchTerm}}
|
||
<em>({{dec sortedJobs.length filteredJobs.length}} hidden by search term)</em>
|
||
{{/if}}
|
||
</div>
|
||
{{#p.prev class="pagination-previous"}}{{x-icon "chevron-left"}}{{/p.prev}}
|
||
{{#p.next class="pagination-next"}}{{x-icon "chevron-right"}}{{/p.next}}
|
||
<ul class="pagination-list"></ul>
|
||
</nav>
|
||
</div>
|
||
{{/list-pagination}}
|
||
{{else}}
|
||
<div data-test-empty-jobs-list class="empty-message">
|
||
{{#if (eq visibleJobs.length 0)}}
|
||
<h3 data-test-empty-jobs-list-headline class="empty-message-headline">No Jobs</h3>
|
||
<p class="empty-message-body">
|
||
The cluster is currently empty.
|
||
</p>
|
||
{{else if (eq filteredJobs.length 0)}}
|
||
<h3 data-test-empty-jobs-list-headline class="empty-message-headline">No Matches</h3>
|
||
<p class="empty-message-body">
|
||
No jobs match your current filter selection.
|
||
</p>
|
||
{{else if searchTerm}}
|
||
<h3 data-test-empty-jobs-list-headline class="empty-message-headline">No Matches</h3>
|
||
<p class="empty-message-body">No jobs match the term <strong>{{searchTerm}}</strong></p>
|
||
{{/if}}
|
||
</div>
|
||
{{/if}}
|
||
{{/if}}
|
||
</section>
|