From 46d5a1bfe2d584e3001fc6925007b40ed118df56 Mon Sep 17 00:00:00 2001 From: SeoJin Kim Date: Tue, 22 Feb 2022 01:51:27 +0900 Subject: [PATCH] =?UTF-8?q?[Spring][=EC=87=BC=ED=95=91=EB=AA=B0=20?= =?UTF-8?q?=ED=94=84=EB=A1=9C=EC=A0=9D=ED=8A=B8][52]=20=EB=A9=94=EC=9D=B8?= =?UTF-8?q?=ED=8E=98=EC=9D=B4=EC=A7=80=20=ED=8F=89=EC=A0=90=20=EC=88=9C=20?= =?UTF-8?q?=EC=83=81=ED=92=88=20=EB=85=B8=EC=B6=9C(=EB=B7=B0=20=EC=B2=98?= =?UTF-8?q?=EB=A6=AC)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit https://kimvampa.tistory.com/304 --- VamPa/src/main/webapp/WEB-INF/views/main.jsp | 55 +++++++++++++++ VamPa/src/main/webapp/resources/css/main.css | 67 +++++++++++++++++++ .../maven/com.vam/controller/pom.properties | 2 +- .../src/main/webapp/WEB-INF/views/main.jsp | 55 +++++++++++++++ .../src/main/webapp/resources/css/main.css | 67 +++++++++++++++++++ .../maven/com.vam/controller/pom.properties | 2 +- 6 files changed, 246 insertions(+), 2 deletions(-) diff --git a/VamPa/src/main/webapp/WEB-INF/views/main.jsp b/VamPa/src/main/webapp/WEB-INF/views/main.jsp index 725ee36..c8f0108 100644 --- a/VamPa/src/main/webapp/WEB-INF/views/main.jsp +++ b/VamPa/src/main/webapp/WEB-INF/views/main.jsp @@ -134,6 +134,34 @@ +
+
+ 평점순 상품 +
+
+ + +
+
+
+ +
+
+ ${ls.cateName} +
+
+ ${ls.ratingAvg} +
+
+ ${ls.bookName} +
+
+
+ + +
+
+ @@ -189,6 +217,33 @@ } ); + $(".ls_div").slick({ + slidesToShow: 4, + slidesToScroll: 4, + prevArrow : "", // 이전 화살표 모양 설정 + nextArrow : "", // 다음 화살표 모양 설정 + }); + + /* 이미지 삽입 */ + $(".image_wrap").each(function(i, obj){ + + const bobj = $(obj); + + if(bobj.data("bookid")){ + const uploadPath = bobj.data("path"); + const uuid = bobj.data("uuid"); + const fileName = bobj.data("filename"); + + const fileCallPath = encodeURIComponent(uploadPath + "/s_" + uuid + "_" + fileName); + + $(this).find("img").attr('src', '/display?fileName=' + fileCallPath); + } else { + $(this).find("img").attr('src', '/resources/img/goodsNoImage.png'); + } + + }); + + }); diff --git a/VamPa/src/main/webapp/resources/css/main.css b/VamPa/src/main/webapp/resources/css/main.css index eeb6a7c..2bebbd5 100644 --- a/VamPa/src/main/webapp/resources/css/main.css +++ b/VamPa/src/main/webapp/resources/css/main.css @@ -308,4 +308,71 @@ a{ height: auto; display: block; margin: auto; +} + +/* 상품 평점순 노출 관련 태그 */ +.ls_wrap{ + margin: 30px 0 30px 0; + padding: 0 10px 0 10px; +} +.ls_div_content{ + width: 80%; + margin: auto; + height: 275px; + border: 1px solid #dadada; +} +.image_wrap{ + width: 80%; + height: 60%; + margin: auto; + padding: 5% 0 5% 0; + display: flex; + align-items: center; +} +.ls_category{ + text-align: center; + font-size: 13px; + color: #3e74ab; +} +.ls_rating{ + text-align: center; + font-size: 13px; + color: #e15b6e; +} +.ls_bookName{ + text-align: center; + color: #333; + font-size: 15px; + font-weight: bold; +} +.ls_div_subject{ + font-weight: bold; + font-size: 26px; + padding-bottom: 10px; +} +.ls_div_content_prev{ + position: absolute; + top: 40%; + width: 40px; + height: 30px; + left: 27px; + font-weight: bold; + z-index: 1; + opacity: 35%; +} +.ls_div_content_prev:hover{ + opacity: 80%; +} +.ls_div_content_next{ + position: absolute; + top: 40%; + width: 40px; + height: 30px; + right: 27px; + font-weight: bold; + z-index: 1; + opacity: 35%; +} +.ls_div_content_next:hover{ + opacity: 80%; } \ No newline at end of file diff --git a/VamPa/target/m2e-wtp/web-resources/META-INF/maven/com.vam/controller/pom.properties b/VamPa/target/m2e-wtp/web-resources/META-INF/maven/com.vam/controller/pom.properties index c25ad11..0452933 100644 --- a/VamPa/target/m2e-wtp/web-resources/META-INF/maven/com.vam/controller/pom.properties +++ b/VamPa/target/m2e-wtp/web-resources/META-INF/maven/com.vam/controller/pom.properties @@ -1,5 +1,5 @@ #Generated by Maven Integration for Eclipse -#Mon Feb 07 20:50:26 KST 2022 +#Tue Feb 22 01:43:37 KST 2022 m2e.projectLocation=C\:\\Users\\sjinj\\git\\Blog_Project2\\VamPa m2e.projectName=VamPa groupId=com.vam diff --git a/VamPa_MySQL/src/main/webapp/WEB-INF/views/main.jsp b/VamPa_MySQL/src/main/webapp/WEB-INF/views/main.jsp index 725ee36..c8f0108 100644 --- a/VamPa_MySQL/src/main/webapp/WEB-INF/views/main.jsp +++ b/VamPa_MySQL/src/main/webapp/WEB-INF/views/main.jsp @@ -134,6 +134,34 @@ +
+
+ 평점순 상품 +
+
+ + +
+
+
+ +
+
+ ${ls.cateName} +
+
+ ${ls.ratingAvg} +
+
+ ${ls.bookName} +
+
+
+ + +
+
+ @@ -189,6 +217,33 @@ } ); + $(".ls_div").slick({ + slidesToShow: 4, + slidesToScroll: 4, + prevArrow : "", // 이전 화살표 모양 설정 + nextArrow : "", // 다음 화살표 모양 설정 + }); + + /* 이미지 삽입 */ + $(".image_wrap").each(function(i, obj){ + + const bobj = $(obj); + + if(bobj.data("bookid")){ + const uploadPath = bobj.data("path"); + const uuid = bobj.data("uuid"); + const fileName = bobj.data("filename"); + + const fileCallPath = encodeURIComponent(uploadPath + "/s_" + uuid + "_" + fileName); + + $(this).find("img").attr('src', '/display?fileName=' + fileCallPath); + } else { + $(this).find("img").attr('src', '/resources/img/goodsNoImage.png'); + } + + }); + + }); diff --git a/VamPa_MySQL/src/main/webapp/resources/css/main.css b/VamPa_MySQL/src/main/webapp/resources/css/main.css index eeb6a7c..2bebbd5 100644 --- a/VamPa_MySQL/src/main/webapp/resources/css/main.css +++ b/VamPa_MySQL/src/main/webapp/resources/css/main.css @@ -308,4 +308,71 @@ a{ height: auto; display: block; margin: auto; +} + +/* 상품 평점순 노출 관련 태그 */ +.ls_wrap{ + margin: 30px 0 30px 0; + padding: 0 10px 0 10px; +} +.ls_div_content{ + width: 80%; + margin: auto; + height: 275px; + border: 1px solid #dadada; +} +.image_wrap{ + width: 80%; + height: 60%; + margin: auto; + padding: 5% 0 5% 0; + display: flex; + align-items: center; +} +.ls_category{ + text-align: center; + font-size: 13px; + color: #3e74ab; +} +.ls_rating{ + text-align: center; + font-size: 13px; + color: #e15b6e; +} +.ls_bookName{ + text-align: center; + color: #333; + font-size: 15px; + font-weight: bold; +} +.ls_div_subject{ + font-weight: bold; + font-size: 26px; + padding-bottom: 10px; +} +.ls_div_content_prev{ + position: absolute; + top: 40%; + width: 40px; + height: 30px; + left: 27px; + font-weight: bold; + z-index: 1; + opacity: 35%; +} +.ls_div_content_prev:hover{ + opacity: 80%; +} +.ls_div_content_next{ + position: absolute; + top: 40%; + width: 40px; + height: 30px; + right: 27px; + font-weight: bold; + z-index: 1; + opacity: 35%; +} +.ls_div_content_next:hover{ + opacity: 80%; } \ No newline at end of file diff --git a/VamPa_MySQL/target/m2e-wtp/web-resources/META-INF/maven/com.vam/controller/pom.properties b/VamPa_MySQL/target/m2e-wtp/web-resources/META-INF/maven/com.vam/controller/pom.properties index 947de1f..b0d4ad0 100644 --- a/VamPa_MySQL/target/m2e-wtp/web-resources/META-INF/maven/com.vam/controller/pom.properties +++ b/VamPa_MySQL/target/m2e-wtp/web-resources/META-INF/maven/com.vam/controller/pom.properties @@ -1,5 +1,5 @@ #Generated by Maven Integration for Eclipse -#Mon Feb 07 20:50:27 KST 2022 +#Tue Feb 22 01:43:38 KST 2022 m2e.projectLocation=C\:\\Users\\sjinj\\git\\Blog_Project2\\VamPa_MySQL m2e.projectName=VamPa_MySQL groupId=com.vam