[JavaScript] 페이징

 

const pageInfo = class{

    constructor( pageLength = 5, navLength = 10) {
        this.pageLength = pageLength;
        this.navLength = navLength;
    }

    getPageInfo(){
        this.totalPages = Math.ceil(this.total / this.pageLength);
        this.prevPage = this.currentPage - 1 > 0 ? this.currentPage > this.totalPages ? null : this.currentPage - 1 : null;
        this.nextPage = this.currentPage + 1 <= this.totalPages? this.currentPage + 1 : null;

        const pageList = [];
        const nav = Math.floor(this.currentPage / this.navLength); 
        const pageListLength = this.totalPages - (nav * this.navLength)  < this.navLength ?  this.totalPages - (nav * this.navLength) :this.navLength  ;
        this.startPage = nav == 0 ? 1 : (nav * this.navLength) + 1;
        this.endPage = this.startPage + pageListLength - 1;

        
        for(let i = this.startPage; i <= this.endPage; i++) {
            pageList.push(i);
        }

        this.pageList = pageList;

        return {
            totalPages: this.totalPages,
            currentPage: this.currentPage,
            startPage: this.startPage,
            endPage: this.endPage,
            pageList: this.pageList,
            prevPage: this.prevPage,
            nextPage: this.nextPage,
            isNot : this.pageList.length == 0 ,
        }
    }

    setPageInfo(total , currentPage = 1){
        this.total = total;
        this.currentPage = currentPage;
    }
}

 

pageLength = 한 개의 페이지 리스트 수 

navLength = 네비게이션 페이지 수

currentPage = 현재 페이지

startPage = 네비게이션 시작 페이지

endPage = 네이게이션 끝 페이지 

prevPage = 현재 페이지 기준 이전 페이지 

nextPage = 현재 페이지 기준 다음 페이지

pageList = 네비게이션 배열

isNot  = 네비게이션 비활성화

const paging1 = new pageInfo();
paging.setPageInfo(20);


const paging2 = new pageInfo();
paging.setPageInfo(200 , 14);