# 강좌 목록 구현
강좌에 대해서 회원이 강좌 신청 하는 로직 구현
- 강좌 목록 가져오기
강좌 목록이 나오고 강좌를 선택하도록 구현
- course/index
<body>
<h1> 강좌 정보 페이지 </h1>
<div th:replace="/fragments/layout.html :: fragment-body-menu"></div>
<ul>
<li th:each="x : ${list}">
<a th:href="'/course/' + ${x.id}">
<h3 th:text="${x.subject}">강좌명</h3>
</a>
<div>
<p th:text="${x.summary}"></p>
<p>
판매가 : <span class="price" th:text="${x.price}"></span>
판매가 : <span th:text="${x.salePrice}"></span>
</p>
</div>
</li>
</ul>
</body>- CourseController
frontList는 관리자와 회원용 리스트를 나누기 위해 사용
@RequiredArgsConstructor
@Controller
public class CourseController extends BaseController{
private final CourseService courseService;
private final CategoryService categoryService;
@GetMapping("/course")
public String list(Model model, CourseParam param){
List<CourseDto> list = courseService.frontList(param);
model.addAttribute("list",list);
return "course/index";
}
}- CourseService
// 프론트용 강좌 목록
List<CourseDto> frontList(CourseParam param);
- CourseServiceImpl
@Override
public List<CourseDto> frontList(CourseParam param) {
List<Course> courseList = courseRepository.findAll();
return CourseDto.of(courseList);
}
- CourseDto
여러건을 바꿔주기 위해 CourseDto에 List용 of 메서드 생성
public static CourseDto of(Course course) {
return CourseDto.builder()
.id(course.getId())
.categoryId(course.getCategoryId())
.imagePath(course.getImagePath())
.keyword(course.getKeyword())
.subject(course.getSubject())
.summary(course.getSummary())
.contents(course.getContents())
.price(course.getPrice())
.salePrice(course.getSalePrice())
.saleEndDt(course.getSaleEndDt())
.regDt(course.getRegDt())
.build();
}
public static List<CourseDto> of(List<Course> courses){
if(courses != null){
List<CourseDto> courseDtoList = new ArrayList<>();
for (Course x : courses) {
// 위에 있는 of 메서드를 호출하고 하나씩 추가한다
courseDtoList.add(CourseDto.of(x));
}
return courseDtoList;
}
return null;
}
- index
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>강좌 정보 페이지</title>
<style>
span.price {
text-decoration: line-through;
}
</style>
</head>
<body>
<h1> 강좌 정보 페이지 </h1>
<!-- <div th:replace="/fragments/layout.html :: fragment-body-menu"></div>-->
<div>
<a href="#">전체</a>
|
<a href="#">프로그래밍</a>
|
<a href="#">디자인인</a>
</div>
<ul>
<li th:each="x : ${list}">
<a th:href="'/course/' + ${x.id}">
<h3 th:text="${x.subject}">강좌명</h3>
</a>
<div>
<p th:text="${x.summary}"></p>
<p>
판매가 : <span class="price" th:text="${x.price}"></span>
판매가 : <span th:text="${x.salePrice}"></span>
</p>
</div>
</li>
</ul>
</body>
</html>
카테고리를 바꿔가며 카테고리에 해당하는 내용을 볼 수 있는 로직 구현
course에 category 정보가 있기 때문에 카테고리만으로 프로그램이 몇개가 등록되었는지 알 수 있다
- CategoryMapper
@Mapper
public interface CategoryMapper {
List<CategoryDto> select(CategoryDto param);
}
- CategoryMapper.xml
<!DOCTYPE mapper
PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
"http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="com.zerobase.fastlms.admin.mapper.CategoryMapper">
<select id="select"
resultType="com.zerobase.fastlms.admin.dto.CategoryDto">
SELECT c.* ,
(SELECT COUNT(*) FROM course WHERE category_id = c.id) AS course_count
FROM category c
where using_yn = 1
order by sort_value desc
</select>
</mapper>
- CategoryDto
public class CategoryDto {
Long id;
String categoryName;
int sortValue;
boolean usingYn;
// 추가 칼럼
int course_count;
- CategoryService
// 프론트 카테고리 정보
List<CategoryDto> frontList(CategoryDto param);
- CategoryServiceImpl
@Override
public List<CategoryDto> frontList(CategoryDto param) {
return categoryMapper.select(param);
}
- CategoryController
파마미터 값으로 CourseParam 을 사용하고 있으니 categoryList에서는 빌더를 통해 Dto를 받아온다
@GetMapping("/course")
public String list(Model model, CourseParam param){
List<CourseDto> list = courseService.frontList(param);
model.addAttribute("list",list);
List<CategoryDto> categoryList = categoryService.frontList(CategoryDto.builder().build());
model.addAttribute("categoryList", categoryList);
return "course/index";
}
- course/index
카테고리 이름을 each로 돌려주고 각 category마다 id값을 부여한다
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>강좌 정보 페이지</title>
...
<a href="?">전체</a>
<th:block th:each="y : ${categoryList}">
|
<a th:href="'/course?categoryId=' + ${y.id}">
<span th:text="${y.categoryName}">카테고리명</span></a>
</th:block>
<hr/>
</div>
...
</body>
</html>
이제 부여해준 id값을 토대로 데이터가 필터링되면 된다
html에서 넘어올 categoryId값을 CourseParam 클래스로 받을 것이다
- CourseParam
@Data
public class CourseParam extends CommonParam {
long categoryId;
}
- CourseServiceImpl
@Override
public List<CourseDto> frontList(CourseParam param) {
// 이 경우는 전체니까 전체를 가져오는 값을 넣으면 된다
if(param.getCategoryId() < 1){
List<Course> courseList = courseRepository.findAll();
return CourseDto.of(courseList);
}
Optional<List<Course>> optionalCourses = courseRepository.findByCategoryId(param.getCategoryId());
if(optionalCourses.isPresent()){
return CourseDto.of(optionalCourses.get());
}
return null;
}
}
'개인프로젝트(수강프로그램)' 카테고리의 다른 글
| 강좌신청 (0) | 2022.04.25 |
|---|---|
| 강좌 목록 구현 (0) | 2022.04.25 |
| 강좌목록 (0) | 2022.04.20 |
| 카테고리 화면 (0) | 2022.04.19 |
| 회원상세 및 상태처리 (0) | 2022.04.19 |
