{namespace core=TYPO3\CMS\Core\ViewHelpers}
{namespace sg=SGalinski\SgJobs\ViewHelpers}
<html data-namespace-typo3-fluid="true" lang="">
<nav class="mb-2 mt-2">
<ul class="pagination">
<f:comment><!-- Records Display --></f:comment>
<li class="page-item ps-2 pe-2 pagination-label">
<span>
<f:translate key="backend.job.records" extensionName="sg_jobs"/> {pagination.startItem} - {pagination.endItem}
</span>
</li>
<f:comment><!-- First Button --></f:comment>
<li class="page-item ps-2 {f:if(condition: pagination.previousPage, then: '', else: 'disabled')}">
<f:if condition="{pagination.previousPage}">
<f:then>
<a href="{f:uri.action(action: action, arguments: {currentPage: 1, itemsPerPage: itemsPerPage})}"
>
<core:icon identifier="actions-view-paging-first"/>
</a>
</f:then>
<f:else>
<span>
<core:icon identifier="actions-view-paging-first"/>
</span>
</f:else>
</f:if>
</li>
<f:comment><!-- Previous Button --></f:comment>
<li class="page-item ps-2 {f:if(condition: pagination.previousPage, then: '', else: 'disabled')}">
<f:if condition="{pagination.previousPage}">
<f:then>
<a href="{f:uri.action(action: action, arguments: {currentPage: pagination.previousPage, itemsPerPage: itemsPerPage})}"
>
<core:icon identifier="actions-view-paging-previous"/>
</a>
</f:then>
<f:else>
<span>
<core:icon identifier="actions-view-paging-previous"/>
</span>
</f:else>
</f:if>
</li>
<f:comment><!-- Go to Page --></f:comment>
<li class="page-item ps-2">
<form action="" method="POST">
<f:translate key="backend.job.page" extensionName="sg_jobs"/>
<f:form.textfield id="paginator"
name="paginator-target-page"
additionalAttributes="{
min: '1',
data-uri: '{f:uri.action(action: action, arguments: {currentPage: 987654321, itemsPerPage: itemsPerPage}) -> f:format.raw()}'
}"
class=" input-sm paginator-input"
style="padding: 4px 8px; width: 80px; height: 28px;"
value="{pagination.currentPage}"
type="number"/>
<f:translate key="backend.job.of" extensionName="sg_jobs"/>
{pagination.lastPage}
<input type="hidden" name="itemsPerPage" value="{itemsPerPage}"/>
</form>
</li>
<f:comment><!-- Next Button --></f:comment>
<li class="page-item ps-2 {f:if(condition: pagination.nextPage, then: '', else: 'disabled')}">
<f:if condition="{pagination.nextPage}">
<f:then>
<a href="{f:uri.action(action: action, arguments: {currentPage: pagination.nextPage, itemsPerPage: itemsPerPage})}"
>
<core:icon identifier="actions-view-paging-next"/>
</a>
</f:then>
<f:else>
<span>
<core:icon identifier="actions-view-paging-next"/>
</span>
</f:else>
</f:if>
</li>
<f:comment><!-- Last Button --></f:comment>
<li class="page-item ps-2 {f:if(condition: pagination.nextPage, then: '', else: 'disabled')}">
<f:if condition="{pagination.nextPage}">
<f:then>
<a href="{f:uri.action(action: action, arguments: {currentPage: pagination.lastPage, itemsPerPage: itemsPerPage})}"
>
<core:icon identifier="actions-view-paging-last"/>
</a>
</f:then>
<f:else>
<span>
<core:icon identifier="actions-view-paging-last"/>
</span>
</f:else>
</f:if>
</li>
<f:comment><!-- Refresh Button --></f:comment>
<li class="page-item ps-2">
<a href="{f:uri.action(action: action, arguments: {currentPage: pagination.currentPage, itemsPerPage: itemsPerPage})}"
>
<core:icon identifier="actions-refresh"/>
</a>
</li>
<f:comment><!-- Custom Items Per Page Input Field with Label --></f:comment>
<li class="page-item ps-2 ms-4 ">
<form action="" method="POST" class="d-flex align-items-center">
<label for="itemsPerPageInput" class="me-2 mb-0">
<f:translate key="backend.job.itemsPerPage" extensionName="sg_jobs"/>
</label>
<input type="number"
name="itemsPerPage"
id="itemsPerPageInput"
class=" input-sm "
style="padding: 4px 8px; width: 80px; height: 28px; margin: -7px 0px"
value="{pagination.itemsPerPage}"
min="1"
required/>
<input type="hidden" name="page" value="{pagination.currentPage}"/>
</form>
</li>
</ul>
</nav>
</html>