Merge branch 'master' into chore/#51

coconut-thisABLE · Mar 25, 2022 · 56ca4a3 · 56ca4a3
2 parents 89198d8 + c32dddb
commit 56ca4a3
Show file tree

Hide file tree

Showing 4 changed files with 20 additions and 6 deletions.
diff --git a/thisable/src/components/DetailPage/DetailPage.js b/thisable/src/components/DetailPage/DetailPage.js
@@ -3,7 +3,7 @@ import { useParams } from "react-router-dom";
 import MapPage from "../MapPage/MapPage";
 import ReviewPage from "./ReviewPage";
 import ToggleView from "./ToggleView";
-import { getPlaceDetail } from "../../services/user.service";
+import { getPlaceDetail, getReviewAverage } from "../../services/user.service";
 import slopeImg from "../../assets/images/slope.svg";
 import chargerImg from "../../assets/images/charger.svg";
 import toiletImg from "../../assets/images/toilet.svg";
@@ -12,12 +12,14 @@ import "./DetailPage.css";
 
 function DetailPage() {
   const [place, setPlace] = useState("");
-
+  const [reviewCount, setReviewCount] = useState("");
   let { id } = useParams();
 
   useEffect(async () => {
     const detail = await getPlaceDetail(id);
+    const averageNum = await getReviewAverage(id);
     setPlace(detail.response);
+    setReviewCount(averageNum);
   }, [id]);
 
   return (
@@ -28,7 +30,9 @@ function DetailPage() {
           <div className="placetype">{place.locationType}</div>
         </div>
         <div className="placeaddress">{place.address}</div>
-        <div className="placerate">★★★☆☆ (1023)</div>
+        <div className="placerate">
+          {reviewCount.average} ({reviewCount.count})
+        </div>
         <div className="placeiconlist">
           {place.isToiletExists && (
             <div className="placeicon">

diff --git a/thisable/src/components/DetailPage/ReviewPage.js b/thisable/src/components/DetailPage/ReviewPage.js
@@ -3,6 +3,7 @@ import React, { useState, useEffect } from "react";
 import { Rating } from "react-simple-star-rating";
 import {
   getReview,
+  getReviewAverage,
   postReview,
   postReviewRecommend,
   postReviewDiscourage,
@@ -11,6 +12,7 @@ import {
 function ReviewPage({ locationId }) {
   const [reviews, setReviews] = useState("");
   const [rating, setRating] = useState(0);
+  const [reviewNum, setReviewNum] = useState("");
 
   const handleRating = (rate) => {
     setRating(rate / 20);
@@ -19,8 +21,9 @@ function ReviewPage({ locationId }) {
 
   useEffect(async () => {
     const reviewList = await getReview(locationId);
+    const averageNum = await getReviewAverage(locationId);
     setReviews(reviewList);
-    console.log(reviewList.response);
+    setReviewNum(averageNum.count);
   }, [locationId]);
 
   const [inputValue, setInputValue] = useState("");
@@ -90,7 +93,7 @@ function ReviewPage({ locationId }) {
       </div>
       <div className="reviewlist">
         <div className="reviewlisttitle">
-          <div className="reviewlistnum">후기 435개</div>
+          <div className="reviewlistnum">후기 {reviewNum}개</div>
           <div className="reviewlistsort">사용자 추천순 | 최근 작성순</div>
         </div>
         {renderReviews}

diff --git a/thisable/src/components/MainPage/MainPage.css b/thisable/src/components/MainPage/MainPage.css
@@ -45,4 +45,5 @@
 .placeIcon > img {
     margin-right: 5px;
     width: 35px;
-}
+}
+
diff --git a/thisable/src/services/user.service.js b/thisable/src/services/user.service.js
@@ -28,6 +28,12 @@ export const getReview = (id) => {
   });
 };
 
+export const getReviewAverage = (id) => {
+  return axios.get(baseUrl + "/" + id + "/review/average").then((response) => {
+    return response.data;
+  });
+};
+
 export const postReview = (locationId, detail, star) => {
   return axios
     .post(baseUrl + "/review", {