Skip to content

M
myAppraisal
Commit 314cb648 by Nakarin Luankla
Options

UPDATE เปลี่ยน pagination

parent 64229704
Showing with 4 additions and 183 deletions
src/app/components/job-detail-components/job-competency/sub-job-competency/sub-job-competency.component.html
......@@ -93,52 +93,7 @@
</tbody>
</table>
</div>
<nav class="pagination-style-3 overflow-auto my-5" *ngIf="page.length">
<ul class="ti-pagination">
<li>
<a aria-label="anchor" class="page-link" href="javascript:void(0);"
(click)="currentPage = (currentPage-1 || 1)">
<i class="ri-arrow-left-s-line align-middle rtl:rotate-180"></i>
</a>
</li>
<li *ngFor="let item of page;let f = first;let l = last">
<ng-container *ngIf="item==3&&currentPage!=1&&currentPage!=2&&currentPage!=3">
<a aria-label="anchor" class="page-link" href="javascript:void(0);"><i class="ri-more-line"></i>
</a>
</ng-container>
<ng-container *ngIf="(f||l)||(item==currentPage-1||item==currentPage||item==currentPage+1)">
<a class="page-link" href="javascript:void(0);" [class.active]="item==currentPage"
(click)="currentPage=item">{{item}}
</a>
</ng-container>
<ng-container
*ngIf="item==page.length-2&&currentPage!=page.length&&currentPage!=page.length-1&&currentPage!=page.length-2">
<a aria-label="anchor" class="page-link" href="javascript:void(0);"><i class="ri-more-line"></i>
</a>
</ng-container>
</li>
<li>
<a aria-label="anchor" class="page-link" href="javascript:void(0);"
(click)="currentPage = (currentPage > page.length-1 ? currentPage: currentPage+1 )">
<i class="ri-arrow-right-s-line align-middle rtl:rotate-180"></i>
</a>
</li>
<li>
<select class="ti-form-select" [(ngModel)]="pageSize" (ngModelChange)="searchChange()">
<option [value]="10">10</option>
<option [value]="20">20</option>
<option [value]="50">50</option>
<option [value]="100">100</option>
</select>
</li>
</ul>
<ul class="nav-tabs mt-3">
<span>Show {{((currentPage-1) * pageSize)+1}} to {{(jobcodeFilter().length < pageSize) ?jobcodeFilter().length:
(currentPage==page.length ? ((currentPage * pageSize) - ((currentPage * pageSize) - jobcodeFilter().length) )
:(currentPage * pageSize) ) }} of {{jobcodeFilter().length}} items</span>
</ul>
</nav>
<app-pagination [totalItems]="jobcodeFilter().length" [pageSize]="pageSize" (pageChange)="currentPage = $event" (pageSizeChange)="pageSize = $event;currentPage = 1"></app-pagination>
</div>
......
src/app/components/job-detail-components/job-detail/work-detail/work-detail.component.html
......@@ -95,51 +95,7 @@
</tbody>
</table>
</div>
<nav class="pagination-style-3 overflow-auto my-5" *ngIf="page.length">
<ul class="ti-pagination">
<li>
<a aria-label="anchor" class="page-link" href="javascript:void(0);"
(click)="currentPage = (currentPage-1 || 1)">
<i class="ri-arrow-left-s-line align-middle rtl:rotate-180"></i>
</a>
</li>
<li *ngFor="let item of page;let f = first;let l = last">
<ng-container *ngIf="item==3&&currentPage!=1&&currentPage!=2&&currentPage!=3">
<a aria-label="anchor" class="page-link" href="javascript:void(0);"><i class="ri-more-line"></i>
</a>
</ng-container>
<ng-container *ngIf="(f||l)||(item==currentPage-1||item==currentPage||item==currentPage+1)">
<a class="page-link" href="javascript:void(0);" [class.active]="item==currentPage"
(click)="currentPage=item">{{item}}
</a>
</ng-container>
<ng-container
*ngIf="item==page.length-2&&currentPage!=page.length&&currentPage!=page.length-1&&currentPage!=page.length-2">
<a aria-label="anchor" class="page-link" href="javascript:void(0);"><i class="ri-more-line"></i>
</a>
</ng-container>
</li>
<li>
<a aria-label="anchor" class="page-link" href="javascript:void(0);"
(click)="currentPage = (currentPage > page.length-1 ? currentPage: currentPage+1 )">
<i class="ri-arrow-right-s-line align-middle rtl:rotate-180"></i>
</a>
</li>
<li>
<select class="ti-form-select" [(ngModel)]="pageSize" (ngModelChange)="searchChange()">
<option [value]="10">10</option>
<option [value]="20">20</option>
<option [value]="50">50</option>
<option [value]="100">100</option>
</select>
</li>
</ul>
<ul class="nav-tabs mt-3">
<span>Show {{((currentPage-1) * pageSize)+1}} to {{(jobcodeFilter().length < pageSize) ?jobcodeFilter().length:
(currentPage==page.length ? ((currentPage * pageSize) - ((currentPage * pageSize) - jobcodeFilter().length) )
:(currentPage * pageSize) ) }} of {{jobcodeFilter().length}} items</span>
</ul>
</nav>
<app-pagination [totalItems]="jobcodeFilter().length" [pageSize]="pageSize" (pageChange)="currentPage = $event" (pageSizeChange)="pageSize = $event;currentPage = 1"></app-pagination>
</div>
......
src/app/components/job-detail-components/job-position-indicators/sub-job-position-indicators/sub-job-position-indicators.component.html
......@@ -95,52 +95,7 @@
</tbody>
</table>
</div>
<nav class="pagination-style-3 overflow-auto my-5" *ngIf="page.length">
<ul class="ti-pagination">
<li>
<a aria-label="anchor" class="page-link" href="javascript:void(0);"
(click)="currentPage = (currentPage-1 || 1)">
<i class="ri-arrow-left-s-line align-middle rtl:rotate-180"></i>
</a>
</li>
<li *ngFor="let item of page;let f = first;let l = last">
<ng-container *ngIf="item==3&&currentPage!=1&&currentPage!=2&&currentPage!=3">
<a aria-label="anchor" class="page-link" href="javascript:void(0);"><i class="ri-more-line"></i>
</a>
</ng-container>
<ng-container *ngIf="(f||l)||(item==currentPage-1||item==currentPage||item==currentPage+1)">
<a class="page-link" href="javascript:void(0);" [class.active]="item==currentPage"
(click)="currentPage=item">{{item}}
</a>
</ng-container>
<ng-container
*ngIf="item==page.length-2&&currentPage!=page.length&&currentPage!=page.length-1&&currentPage!=page.length-2">
<a aria-label="anchor" class="page-link" href="javascript:void(0);"><i class="ri-more-line"></i>
</a>
</ng-container>
</li>
<li>
<a aria-label="anchor" class="page-link" href="javascript:void(0);"
(click)="currentPage = (currentPage > page.length-1 ? currentPage: currentPage+1 )">
<i class="ri-arrow-right-s-line align-middle rtl:rotate-180"></i>
</a>
</li>
<li>
<select class="ti-form-select" [(ngModel)]="pageSize" (ngModelChange)="searchChange()">
<option [value]="10">10</option>
<option [value]="20">20</option>
<option [value]="50">50</option>
<option [value]="100">100</option>
</select>
</li>
</ul>
<ul class="nav-tabs mt-3">
<span>Show {{((currentPage-1) * pageSize)+1}} to {{(jobcodeFilter().length < pageSize) ?jobcodeFilter().length:
(currentPage==page.length ? ((currentPage * pageSize) - ((currentPage * pageSize) - jobcodeFilter().length) )
:(currentPage * pageSize) ) }} of {{jobcodeFilter().length}} items</span>
</ul>
</nav>
<app-pagination [totalItems]="jobcodeFilter().length" [pageSize]="pageSize" (pageChange)="currentPage = $event" (pageSizeChange)="pageSize = $event;currentPage = 1"></app-pagination>
</div>
......
src/app/components/job-detail-components/job-qualifications/sub-job-qualifications/sub-job-qualifications.component.html
......@@ -95,52 +95,7 @@
</tbody>
</table>
</div>
<nav class="pagination-style-3 overflow-auto my-5" *ngIf="page.length">
<ul class="ti-pagination">
<li>
<a aria-label="anchor" class="page-link" href="javascript:void(0);"
(click)="currentPage = (currentPage-1 || 1)">
<i class="ri-arrow-left-s-line align-middle rtl:rotate-180"></i>
</a>
</li>
<li *ngFor="let item of page;let f = first;let l = last">
<ng-container *ngIf="item==3&&currentPage!=1&&currentPage!=2&&currentPage!=3">
<a aria-label="anchor" class="page-link" href="javascript:void(0);"><i class="ri-more-line"></i>
</a>
</ng-container>
<ng-container *ngIf="(f||l)||(item==currentPage-1||item==currentPage||item==currentPage+1)">
<a class="page-link" href="javascript:void(0);" [class.active]="item==currentPage"
(click)="currentPage=item">{{item}}
</a>
</ng-container>
<ng-container
*ngIf="item==page.length-2&&currentPage!=page.length&&currentPage!=page.length-1&&currentPage!=page.length-2">
<a aria-label="anchor" class="page-link" href="javascript:void(0);"><i class="ri-more-line"></i>
</a>
</ng-container>
</li>
<li>
<a aria-label="anchor" class="page-link" href="javascript:void(0);"
(click)="currentPage = (currentPage > page.length-1 ? currentPage: currentPage+1 )">
<i class="ri-arrow-right-s-line align-middle rtl:rotate-180"></i>
</a>
</li>
<li>
<select class="ti-form-select" [(ngModel)]="pageSize" (ngModelChange)="searchChange()">
<option [value]="10">10</option>
<option [value]="20">20</option>
<option [value]="50">50</option>
<option [value]="100">100</option>
</select>
</li>
</ul>
<ul class="nav-tabs mt-3">
<span>Show {{((currentPage-1) * pageSize)+1}} to {{(jobcodeFilter().length < pageSize) ?jobcodeFilter().length:
(currentPage==page.length ? ((currentPage * pageSize) - ((currentPage * pageSize) - jobcodeFilter().length) )
:(currentPage * pageSize) ) }} of {{jobcodeFilter().length}} items</span>
</ul>
</nav>
<app-pagination [totalItems]="jobcodeFilter().length" [pageSize]="pageSize" (pageChange)="currentPage = $event" (pageSizeChange)="pageSize = $event;currentPage = 1"></app-pagination>
</div>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment