アプリケーション映画/レビュー項目-(4)

19258 ワード
Multipart テキストリンク

ページと映画のコメントを参照

  • ブラウズページは実際の映画評論の空間であり、より多くの機能を追加する必要がある.
  • 映画評論に関する機能はAjaxによって記述されている.
  • ブラウズページは、リストページでムービー番号をクリックしたときに移動する「/movie/read」URLを処理する必要があります.

    • MovieServiceとMovieServiceImpl

  • MovieServiceは、特定のムービー番号を使用してMovieDTOを返す機能を定義し、ServiceImplで実装される.
    •   //조회처리
    MovieDTO readMovie(Long mno);
  • MovieServiceImplでMovieDTOを作成するには、MovieRepositoryからインポートされたMovie、MovieImageリスト、スコア平均値、コメントカウントリストを加工する必要があります.
    •  @Override
    public MovieDTO getMovie(Long mno) {

        List<Object[]> result = movieRepository.getMovieWithAll(mno);
        Movie movie =(Movie)result.get(0)[0];
        //Movie 엔티티는 가장 앞에 존재(모든 Row가 동일한 값을 가집니다.)
        
        List<MovieImage>movieImageList = new ArrayList<>();
        //영화의 이미지 개수 만큼 MovieImage객체 필요
        
        result.forEach(arr ->{
            MovieImage movieImage = (MovieImage)arr[1];
            movieImageList.add(movieImage);
        });
        
        Double avg = (Double) result.get(0)[2];
        //평균 평점 - 모든 Row가 동일한 값
        Long reviewCnt = (Long)result.get(0)[3];
        //리뷰 개수 - 모든 Row가 동일한 값
        
        return entityToDto(movie,movieImageList,avg,reviewCnt);
    }

    MovieControllerとRead。html

  • ムービーコントローラget方式"/movie/read?処理はmno=xxx"と同じURLです.(修正操作も同じコードを使用します.)
    •  @GetMapping({"/read","/modify"})
    public void read(long mno, @ModelAttribute("pageRequestDTO")PageRequestDTO pageRequestDTO,Model model){
        MovieDTO movieDTO = movieService.getMovie(mno);
        
        model.addAttribute("dto",movieDTO);
    }
  • read.htmlを作成します.
    • <!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">

<th:block th:replace="~{/layout/basic :: setContent(~{this::content} )}">

    <th:block th:fragment="content">

        <h1 class="mt-4">Movie Read Page</h1>

        <div class="form-group">
            <label>Title</label>
            <input type="text" class="form-control" name="title" th:value="${dto.title}" readonly>
        </div>
        <div class="form-group">
            <lable>Review Count</lable>
            <input type="text" class="form-control" name="reviewCnt" th:value="${dto.reviewCnt}" readonly>
        </div>
        <div class="form-group">
            <label>AVG</label>
            <input type="text" class="form-control" name="avg" th:value="${dto.avg}" readonly>
        </div>
        <style>
            .uploadResult {
                width: 100%;
                background-color: gray;
                margin-top: 10px;
            }

            .uploadResult ul {
                display: flex;
                flex-flow: row;
                justify-content: center;
                align-items: center;
                vertical-align: top;
                overflow: auto;
            }

            .uploadResult ul li {
                list-style: none;
                padding: 10px;
                margin-left: 2em;
            }

            .uploadResult ul li img {
                width: 100px;
            }
        </style>
        <div class="uploadResult">
            <ul>
                <li th:each="movieImage : ${dto.imageDTOList}">
                    <img th:if="${movieImage.path != null}" th:src="|/display?fileName=${movieImage.getThumbnailURL()}|">
                </li>
            </ul>
        </div>
        <button type="button" class="btn btn-primary">Review Count
            <span class="badge badge-light">[[${dto.reviewCnt}]]</span>
        </button>
        <script>

        </script>
    </th:block>
</th:block>
</html>
  • コメントはまだ処理されていませんが、画面出力は以下の通りです.
    • カスタムラベル&単純ラベル
    BOJ 1259