index
- 서론
- 기획 및 명세
- 패키지 트리
- 프로젝트 환경
- 메시지와 국제화
- 예외 다루기
- 검증
- 계정 관련
- 권한 인터셉터
- 도서 관련
- 대여 관련
- 오프라인 관련
- about ajax
- 지식 공유 - ajax
- DTO, Form, VO, Entity
- 후기
대여 예약, 수령, 반납에 대한 내용이다.
“시간적 여유가 있었으면” 하는 아쉬움이 남아있다.
도서 예약
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
$('#reservBtn').on('click', function(){
let isbn = '${book.code}';
let memberId = '${user.id}';
let date = $('#reserv').val();
let data = { "memberId" : memberId, "isbn" : isbn, "date" : date };
if(date == ''){
return;
} else {
$.ajax({
type: 'post',
url: '${path}/rentals/reserve',
contentType: 'application/json',
data: JSON.stringify(data),
dataType: 'json',
success: function(data){
alert(data.id+ ' 님의 예약 완료');
},
error: function(request,status,error){
alert("fail");
}
})
}
})
1
2
3
4
5
6
7
8
@PostMapping("reserve")
@ResponseBody
public ReserveBook reserve(@RequestBody ReserveBookDto reserveBookDto) {
Integer num = bs.findExistNum(reserveBookDto.getIsbn());
ReserveBook reserve = reserveBookDto.createReservBook(num);
int result = rs.reserveBook(reserve);
return reserve;
}
도서 상세 게시글에서의 대여 예약 장면과
이벤트 핸들링이다.
필요한 정보를 가져와 post 방식으로 비동기 요청을 보낸다.
방법이야 가지각색이지만 json 형태로 시도했다.
json 형태를 받기 위해 @RequestBody 와 Dto 객체를 이용했다.
(쿼리문은 기본 CRUD 수준이라 설명은 생략)
- 도서의 재고가 존재하는지 확인
- 대여 예약 테이블에 Insert
반환을 대여 예약 객체로 했는데 딱히 사용하진 않았다.
ajax 를 사용하면서 가장 힘들었던 건,
무엇을 반환하고 무엇을 출력해줄까에 대한 스트레스였다..
그냥 숫자 하나를 반환하고 예외 처리만 잘해주는 게 세상 편한 느낌이다.
도서 수령
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
<form action="${path}/offline/${user.id}/receipt" method="post">
<table class="table">
<thead>
<tr>
<th colspan="3">도서명</th>
<th colspan="2">예약일</th>
<th>수령</th>
</tr>
</thead>
<tbody>
<c:choose>
<c:when test="${!empty reserves}">
<c:forEach var="reserve" items="${reserves}">
<tr>
<td colspan="3">${reserve.title}</td>
<td colspan="2"><f:formatDate value="${reserve.date}"
pattern="yyyy-MM-dd" /></td>
<td>
<button class="btn btn-danger btn-sm" name="code"
value="${reserve.code}">수령</button>
</td>
</tr>
</c:forEach>
</c:when>
<c:otherwise>
<tr>
<td colspan="6">대여 예약된 책이 없습니다.</td>
</tr>
</c:otherwise>
</c:choose>
</tbody>
</table>
</form>
1
2
3
4
5
6
7
8
9
10
11
@PostMapping("receipt")
@Transactional
public String rentalReceipt(@PathVariable String id, rentalDto rsv) {
String code = rsv.getCode();
rs.reserveCancle(id, code);
Integer num = bs.findExistNum(code);
rs.rentalBook(id, code, num);
MemberCard mc = ms.findGradeById(id);
ms.updateLend(id, mc.getPremiumGrade());
return "redirect:/offline/"+id;
}
오프라인 화면은 나름 Betty 의 시그니쳐이다.
사용자가 “실제”로 도서관에서 할 수 있는 행위 중 최소한을 화면에 그렸다.
수령 버튼 자체에 ISBN 을 담고, 유저 아이디는 경로 변수에 담았다.
대여에 필요한 정보는 사실 이게 끝이다.
서버 쪽 로직은 미숙한 것 같지만
Betty 는 더이상 손 볼 생각이 없기 때문에 이거로 만족해야겠다.
- 대여 예약 테이블에서 삭제하고,
- 다시 도서 코드를 통해 실물 재고를 확인하고,
- 대여 중 테이블로 옮기고,
- 멤버십 카드를 통해 대여료를 지불한다.
이후 다시 오프라인 화면으로 리다이렉트 시킨다.
도서 반납
대여 예약 후 수령이 완료된 도서는 이렇게 반납 해야될 목록에 나타난다.
로직은 도서 수령 쪽과 거진 동일한 수준이다.