Fullstack-Study-241204-250625

커리큘럼(12-30/변경)

01. Java
02. git
03. Database 
04. Jsp [Server]

05. HTML,CSS 
07. JS
06. 미니프로젝트-2W

08. SpringFramework , SrpingBoot (v)
09. React JS [Front-end]
10. 중간프로젝트 (1M)
11. Linux 명령어
12. AWS 클라우드
13. DevOps - Docker
14. App - Android
15. 최종프로젝트 (1M)

---

스프링 부트

페이지네이션 실습

• Criteria

public class Criteria {
    // 사용자가 조회하는 페이지번호, 데이터개수
    
    private int page; // 페이지 번호
    private int amount;// 페이지 개수

    public Criteria(){
        this(1,10);
    }
    public Criteria(int page, int amount) {
        this.page = page;
        this.amount = amount;
    }
    
    // 리미트함수의 첫번째 값에 전달된 함수
    public int getPageStart(){
        return (page-1)*amount;
    }
}

• PageVO

public class PageVO {
    
    // 페이지네이션을 계산하기 위한 클래스
    private int start; // 시작페이지 번호
    private int end; // 끝페이지 번호
    private boolean prev; // 이전버튼 활성화 여부
    private boolean next; // 다음버튼 활성화 여부


    private int page; // 현재 조회하고 있는 페이지(cri객체와 연관)
    private int realEnd; // 맨 마지막 페이지에서 보이는 실제 끝번호값

    private Criteria cri; // 페이지 기준객체
    private List<Integer> pageList; // 페이지번호 리스트(타임리프에서 향상된 for문)

    // 생성될 때 cri객체와, 전체게시글 수 필요
    public PageVO(Criteria cri,int total){
        this.cri=cri;
        this.page = cri.getPage();

        // 끝페이지
        // 현재 조회하는 페이지 11-> 끝페이지 20번
        // 현재 조회하는 페이지 5 -> 끝페이지 10번
        this.end = (int)(Math.ceil(this.page/10.0))*10;

        // 페이지 시작번호 게산
        // 끝페이지 - 페이지네이션 개수 + 1
        this.start = this.end-10+1;

        // 실제 끝번호
        // 데이터가 53개라면 -> 실제 마지막 페이지 번호는 6
        // 데이터가 165개라면 -> 실제 마지막 페이지 번호는 17
        this.realEnd = (int)Math.ceil(total*1.0/cri.getAmount());

        // 실제 마지막번호로 다시 계산
        // 데이터가 165개일때
        // 1~10 페이지 조회시, end= 10 , realEnd = 17
        // 11~20 페이지 조회시, end = 20 , realEnd 17;

        if(this.end>this.realEnd){
            this.end=this.realEnd;
        }

        this.prev=this.start>10;
        this.next=this.end<this.realEnd;

        // 페이지 리스트 초기화
        this.pageList=new ArrayList<Integer>();
        for(int i=this.start;i<=this.end;i++){
            this.pageList.add(i);
        }
    }
}

• Controller

@GetMapping("/productList")
public String productList(Model model, Criteria ct){
    List<ProductVO> list = productService.getList("admin",ct);
    log.info(list.toString());
    int total = productService.getTotal("admin");
    PageVO pageVo = new PageVO(ct,total);
    model.addAttribute("list",list);
    model.addAttribute("pageVo",pageVo);
    return "product/productList";
}

• Mapper

• limit함수
• 시작지점, 데이터개수

<select id="getList" resultType="ProductVO">
    select * from PRODUCT where prod_writer=#{prodWriter}
    order by prod_id desc
    limit #{cri.pageStart},#{cri.amount}
</select>

• html

<div class="page">
	<ul>
		<th:block th:if="${pageVo.prev}">
		<li><a th:href="@{/product/productList(page=1,amount=${pageVo.cri.amount})}"><i class="fa fa-angle-double-left"
					aria-hidden="true"></i></a></li>
		<li style="margin-right:5px;"><a th:href="@{/product/productList(page=${pageVo.start - pageVo.cri.amount},amount=${pageVo.cri.amount})}"><i class="fa fa-angle-left"
					aria-hidden="true"></i></a></li>
		</th:block>
		<th:block th:each="page:${pageVo.pageList}">
			<li th:class="${page==pageVo.page?'on':''}"><a th:href="@{/product/productList(page=${page},amount=${pageVo.cri.amount})}">[[${page}]]</a></li>
		</th:block>
		<th:block th:if="${pageVo.next}">
		<li style="margin-left:5px;"><a th:href="@{/product/productList(page=${pageVo.end+1},amount=${pageVo.cri.amount})}"><i class="fa fa-angle-right"
					aria-hidden="true"></i></a></li>
		<li ><a th:href="@{/product/productList(page=${pageVo.realEnd},amount=${pageVo.cri.amount})}">
			<i class="fa fa-angle-double-right" aria-hidden="true"></i></a>
		</li>
		</th:block>
	</ul>
</div>