728x90
// 페이징 : HTML파일노출요소ID, 해당함수명, 토탈카운트, 현재페이지, 블럭당 페이징 수, 옵션파라미터(필수아님)
// police.setPagination($('#pagination'), reviewList, revwCount, page, 5);
setPagination : function($pagination, callback, total, currentPage, pageByBlock, optionParam) {
if(total !== 0) {
var pageHtml = '<div class="p-pagination">';
var recordByPage = 10;
// 기본값세팅
if(currentPage === undefined || currentPage === -1) {
currentPage = 1;
}
if ($pagination.find('.page-size').length > 0 ) {
recordByPage = $pagination.find('.page-size').val();
}
if(pageByBlock == null) {
pageByBlock = 10;
}
// 전체페이지수
var numOfPage = Math.ceil(total / recordByPage);
pageHtml += '<ul class="p-page">';
pageHtml += `
<li class="p-page-control prev-first"><a href="javascript:;" title="첫 페이지로 이동하기" data-page="1"><span class="blind">첫 페이지로 이동하기</span></a></li>
<li class="p-page-control prev-one"><a href="javascript:;" title="이전 페이지로 이동하기" data-page="${currentPage-1 < 1 ? 1 : currentPage-1}"><span class="blind">이전 페이지로 이동하기</span></a></li>
`;
var firstPage = Math.floor((currentPage - 1) / pageByBlock) * pageByBlock + 1; // 현재블럭의 첫페이지
var lastPage = numOfPage > firstPage + pageByBlock - 1 ? firstPage + pageByBlock - 1 : numOfPage; // 현재블럭의 마지막페이지
for(var page = firstPage; page <= lastPage; page++) {
if(page === currentPage) {
pageHtml += `<li class="p-page-link active"><a href="javascript:;" title="현재 ${page} 페이지" data-page="${page}">${page}</a></li>`;
} else {
pageHtml += `<li class="p-page-link"><a href="javascript:;" title="${page} 페이지 이동" data-page="${page}">${page}</a></li>`;
}
}
pageHtml += `
<li class="p-page-control next-one"><a href="javascript:;" title="다음 페이지로 이동하기" data-page="${currentPage+1 > numOfPage ? numOfPage : currentPage+1}"><span class="blind">다음 페이지로 이동하기</span></a></li>
<li class="p-page-control next-last"><a href="javascript:;" title="마지막 페이지로 이동하기" data-page="${numOfPage}"><span class="blind">마지막 페이지로 이동하기</span></a></li>
`;
pageHtml += '</ul>';
pageHtml += '</div>';
$pagination.html(pageHtml);
var pageSizeHtml = `
<div class="ui-select">
<select class="page-size" title="선택">
<option value="10"${recordByPage == "10"?" selected":""}>10</option>
<option value="25"${recordByPage == "25"?" selected":""}>25</option>
<option value="50"${recordByPage == "50"?" selected":""}>50</option>
<option value="100"${recordByPage == "100"?" selected":""}>100</option>
</select>
</div>
`;
$pagination.append(pageSizeHtml);
$pagination.find('a').on('click', function (event) {
event.preventDefault();
if($(this).hasClass('off') === false) {
if(callback){
if(optionParam == null){
callback(parseInt($(this).data('page'))); // 페이지
} else {
callback(optionParam, parseInt($(this).data('page'))); // 페이지
}
}
}
});
$pagination.find('.page-size').on('change', function (event) {
event.preventDefault();
if(optionParam == null){
callback(1); // 페이지
} else {
callback(optionParam,1);
}
});
}else{
var pageHtml = '<div></div>';
$pagination.html(pageHtml);
}
}
728x90