모든 페이지 내에 카테고리 만들기

Common

페이지마다 카테고리 공통적으로 들어가도록 ccategories가 모든 카테고리

List<Category> categories = categoryRepo.findAll();

model.addAttribute("ccategories", categories);

 

 

fragments폴더안에 categories.html 생성

<div class="col-3" th:fragment="categories">
    <h3 class="display-4">Categories</h3>
    <ul class="list-group">
        <li class="list-group-item">
            <a href="/category/all" class="nav-link">All Products</a>
        </li>
        <li class="list-group-item" th:each="category: ${ccategories}">
            <a class="nav-link" th:href="@{'/category/' + ${category.slug}}" th:text="${category.name}"></a>
        </li>
    </ul>
</div>

th:fragment="categories"

th:each="category: ${ccategories}"

모든 카테고리를 받고 

 

 

모든 페이지에 적용하도록 page.html에 fragment를 받는다.

<div th:replace="/fragments/categories :: categories"></div>

 

 

- 카테고리 클릭시 링크주소를 만든다

CategoriesController 만들기

@GetMapping("/{slug}")
public String category(@PathVariable String slug, Model model,@RequestParam(value = "page",defaultValue = "0") int page) {

    int perPage = 4; //한페이지에 4개
    Pageable pageable = PageRequest.of(page, perPage); //표시할페이지, 한페이지당 몇개(4개)
    long count = 0;

    //카테고리 선택 (전체,과일,채소)
    if(slug.equals("전체")) {
        Page<Product> products = productRepo.findAll(pageable);
        count = productRepo.count(); //전체 제품 수

        model.addAttribute("products", products);			
    }else { //카테고리별 페이징
        Category category = categoryRepo.findBySlug(slug);
        if(category == null) { //카테고리 없으면
            return "redirect:/"; //홈페이지로
        }
        int categoryId = category.getId();
        String categoryName = category.getName();
        //해당 페에지에 제품 수 (페이지네이션)
        List<Product> products = productRepo.findAllByCategoryId(categoryId,pageable);
        count = productRepo.countByCategoryId(categoryId);

        model.addAttribute("products", products); //선택한 카테고리의 제품들
        model.addAttribute("categoryName", categoryName);
    }

    double pageCount = Math.ceil((double)count / (double)perPage);
    model.addAttribute("pageCount", (int)pageCount); //총페이지
    model.addAttribute("perPage", perPage); 		 //한 페이지당 상품갯수
    model.addAttribute("count", count);				 //전체 상품개수
    model.addAttribute("page", page); 				 //현재 페이지


    return "products";
}

 

- 총페이지(pageCount) 계산은  타입을 double로 하여 소수점 나오도록  

13/6개 = 2.1(3페이지)

 

 

 

페이지별 카테고리

ex) 페이지네이션과 해당 제품들 (2페이지에 카테고리 4개로 설정해놓은)

List<Product> products = productRepo.findAllByCategoryId(categoryId,pageable);
count = productRepo.countByCategoryId(categoryId);

long count = productRepo.count();  //전체 상품갯수

페이지를 보여주기 위한 계산이 위에 메서드로 정의함

 

 

 

 

 

카테고리(전체,과일,채소)별로 클릭 할때 나오는 상품view 만들기

 

[ products.html ]

th:text="${categoryName} ?: '모든제품'" 
→ 참은 생략되어있고 없으면 모든제품

※  ?:  (띄어쓰지말고 붙여써야 오류안남)

 

---

 

오류

Parameter value[1] did not match expected type ~

 

---

해결

 

Category - 카테고리 id는 int 

---

Product - 카테고리 id는 String

---

[ CategoriesController ]

String categoryId = Integer.toString(category.getId());

 

카테고리id int=>String 변환