상품상세 개발중

src/main/java/com/style24/front/biz/service/TsfGoodsService.java

@@ -182,6 +182,7 @@ public class TsfGoodsService {
 	 * @since 2021. 2. 9
 	 */
 	public Collection<GoodsImg> getGoodsImgList(String goodsCd) {
+		log.info("aa\\ {}  ", goodsDao.getGoodsImgList(goodsCd));
 		return goodsDao.getGoodsImgList(goodsCd);
 	}
 

src/main/webapp/WEB-INF/views/web/goods/GoodsDetailFormWeb.html

@@ -20,7 +20,7 @@
 <th:block layout:fragment="content">
 <link rel="stylesheet" type="text/css" href="/ux/pc/css/swiper.min.css" />
 <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/Swiper/4.5.0/js/swiper.min.js"></script>
-<div id="container" class="container pd">
+<div id="container" class="container pd" th:with="imgGoodsUrl=${@environment.getProperty('upload.goods.view')}, uxImgUrl=${@environment.getProperty('domain.uximage')}">
 	<th:block th:include="~{web/goods/GoodsIncludeFormWeb :: goodsNaviForm}"></th:block>
 	
 	<div class="wrap">
@@ -33,34 +33,24 @@
 				<!-- CONT-BODY -->
 				<div class="item_detail">
 					<div class="area_pic">
-						<div class="thumb_nav_wrap">
+						<div class="thumb_nav_wrap"  th:if="${goodsImgList != null and !goodsImgList.empty}" >
 							<div class="thumbnav">
 									<div class="swiper-container">
 										<div class="swiper-wrapper">
-											<div class="swiper-slide on"><a href="#navLocate1"><span class="thumb"><img src="/images/pc/thumb/tmp_pdDetail1.jpg" alt=""></span></a></div><!-- 첫 슬라이드 클래스 on 추가 -->
-											<div class="swiper-slide"><a href="#navLocate2"><span class="thumb"><img src="/images/pc/thumb/tmp_pdDetail2.jpg" alt=""></span></a></div>
-											<div class="swiper-slide"><a href="#navLocate3"><span class="thumb"><img src="/images/pc/thumb/tmp_pdDetail3.jpg" alt=""></span></a></div>
-											<div class="swiper-slide"><a href="#navLocate4"><span class="thumb"><img src="/images/pc/thumb/tmp_pdDetail4.jpg" alt=""></span></a></div>
-											<div class="swiper-slide"><a href="#navLocate5"><span class="thumb"><img src="/images/pc/thumb/tmp_pdDetail5.jpg" alt=""></span></a></div>
-											<div class="swiper-slide"><a href="#navLocate6"><span class="thumb"><img src="/images/pc/thumb/tmp_pdDetail6.jpg" alt=""></span></a></div>
-											<div class="swiper-slide"><a href="#navLocate7"><span class="thumb"><img src="/images/pc/thumb/tmp_pdLookbook3.jpg" alt=""></span></a></div>
-											<div class="swiper-slide"><a href="#navLocate8"><span class="thumb"><img src="/images/pc/thumb/tmp_pdLookbook2.jpg" alt=""></span></a></div>
+										<th:block th:each="goodsImg, status : ${goodsImgList}">
+											<div class="swiper-slide" th:classappend="${status.first}? 'on' : ''"><a th:href="${'#navLocate'+ status.count}"><span class="thumb"><img th:src="${imgGoodsUrl+'/'+goodsImg.sysImgNm}" alt=""></span></a></div>
+										</th:block>	
 										</div>
 									</div>
 									<div class="swiper-button-next"></div>
 									<div class="swiper-button-prev"></div>
 								</div>
 						</div>
-						<div class="thumb_list_wrap">
+						<div class="thumb_list_wrap"  th:if="${goodsImgList != null and !goodsImgList.empty}" >
 							<ul>
-								<li id="navLocate1" class="on"><a href=""><span class="thumb"><img src="/images/pc/thumb/tmp_pdDetail1.jpg" alt=""></span></a></li><!-- 첫 데이터 클래스 on 추가 -->
-								<li id="navLocate2"><a href=""><span class="thumb"><img src="/images/pc/thumb/tmp_pdDetail2.jpg" alt=""></span></a></li>
-								<li id="navLocate3"><a href=""><span class="thumb"><img src="/images/pc/thumb/tmp_pdDetail3.jpg" alt=""></span></a></li>
-								<li id="navLocate4"><a href=""><span class="thumb"><img src="/images/pc/thumb/tmp_pdDetail4.jpg" alt=""></span></a></li>
-								<li id="navLocate5"><a href=""><span class="thumb"><img src="/images/pc/thumb/tmp_pdDetail5.jpg" alt=""></span></a></li>
-								<li id="navLocate6"><a href=""><span class="thumb"><img src="/images/pc/thumb/tmp_pdDetail6.jpg" alt=""></span></a></li>
-								<li id="navLocate7"><a href=""><span class="thumb"><img src="/images/pc/thumb/tmp_pdLookbook3.jpg" alt=""></span></a></li>
-								<li id="navLocate8"><a href=""><span class="thumb"><img src="/images/pc/thumb/tmp_pdLookbook2.jpg" alt=""></span></a></li>
+								<th:block th:each="goodsImg, status : ${goodsImgList}">
+								<li th:id="${'navLocate'+ status.count}"  th:classappend="${status.first}? 'on' : ''"><a href=""><span class="thumb"><img th:src="${imgGoodsUrl+'/'+goodsImg.sysImgNm}" alt=""></span></a></li>
+								</th:block>
 							</ul>
 						</div>
 					</div>