style24
/
style24.front


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119
							<!DOCTYPE html>
<html lang="ko"
	xmlns:th="http://www.thymeleaf.org"
	xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
	layout:decorator="web/common/layout/DefaultLayoutWeb">
<!--
 *******************************************************************************
 * @source  : SocialMainFormWeb.html
 * @desc    : 소셜메인(핫딜메인) Page
 *============================================================================
 * Pastelmall
 * Copyright(C) 2020 TSIT, All rights reserved.
 *============================================================================
 * VER  DATE         AUTHOR      DESCRIPTION
 * ===  ===========  ==========  =============================================
 * 1.0  2021.3.11     sowon     최초 작성
 *******************************************************************************
 -->
<body>
<th:block layout:fragment="content">
	<!--  container -->
	<div id="container" class="container dp">
		<div class="breadcrumb"> 
			<ul>
				<li class="bread_home"><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_MAIN);">홈</a></li>
				<li class="bread_2depth">핫딜</li>
			</ul> 
		</div>
		<div class="wrap">
			<div class="content dp_hotdeal"> <!-- 페이지특정 클래스 = dp_hotdeal -->
				<div class="cont_head">
					<div>
                        <h3>[[${socialInfo.socialNm}]]</h3>
                    </div>
				</div>
				<div class="cont_body">
                    <div class="hotdeal">
                        <div id="countdown">
                            <span id="h-hours"></span>
                            <span id="h-minutes"></span>
                            <span id="h-seconds"></span>
                        </div>
                    </div>  
                    <div class="list_content">
                        <div class="itemsGrp rowtype"> <!-- itemsGrp rank hot deal --> <!-- rowtype 추가시 가로형태로 출력 -->
                        <th:block th:each="SocialData, SocialStat : ${socialGoods}">
                            <div th:class="${SocialData.stockQtySum == 0 ? 'item_prod sold_out' : 'item_prod'}" > 
                                <div class="item_state"> <!-- item_state AD soldout -->
                                    <a href="#none" class="itemLink">
                                        <div class="itemPic">
                                            <div class="shape ranker"><span>특가</span></div>
                                            <img alt="BLUE-a" class=" vLHTC pd_img" th:src="${@environment.getProperty('upload.goods.view') + '/' + SocialData.sysImgNm}">
                                            <button type="button" class="itemLike active">관심상품 추가</button>
                                        </div>
                                        <p class="itemBrand" th:text="${SocialData.brandKnm}"></p>
                                        <div class="itemName" th:text="${SocialData.goodsNm}" style="font-size: 18px;"></div>
                                        <p class="itemPrice" >
                                         [[${#numbers.formatInteger(SocialData.currAprice,0,'COMMA')} + 원]]
                                            <!-- [[${SocialData.currAprice}]]원 -->
                                            <span class="itemPrice_original" th:text="${#numbers.formatInteger(SocialData.listPrice,0,'COMMA')} + '원'"></span>
											<span class=" itemPercent" th:text="${#numbers.formatDecimal(SocialData.dcArate,1,0)} + '%'"></span>
                                        </p>
                                        <p class="itemBadge">
                                            <span class="badge13">베스트 </span>
                                        </p>
                                        <!-- <div class="itemcolorchip">
                                            <span class="chip_color35" value="ABM">BEIGE</span>
                                            <span class="chip_color54" value="BDS">BLACK</span>
                                            <span class="chip_color40" value="YBR">WHITE</span>
                                        </div> -->
                                        <div class="itemComment" th:text="${SocialData.goodsTnm}"></div>
                                    </a>
                                </div>
                            </div>
                              </th:block>
                        </div>
                    </div>
                </div>
		    </div>
        </div>
    </div>   

<script th:inline="javascript">
var socialInfo = [[${socialInfo}]];

$(function(){
       /* 핫딜 countDown */
       function hotdealTimer() {
           var endTime = new Date(socialInfo.socialEddt); // 남은시간 지정

               endTime = (Date.parse(endTime) / 1000);

               var now = new Date();
               now = (Date.parse(now) / 1000);

               var timeLeft = endTime - now;

               var days = Math.floor(timeLeft / 86400); 
               var hours = Math.floor((timeLeft - (days * 86400)) / 3600);
               var minutes = Math.floor((timeLeft - (days * 86400) - (hours * 3600 )) / 60);
               var seconds = Math.floor((timeLeft - (days * 86400) - (hours * 3600) - (minutes * 60)));

               if (hours < '10') { hours = '0' + hours; }
               if (minutes < '10') { minutes = '0' + minutes; }
               if (seconds < '10') { seconds = '0' + seconds; }

               //$('#d-days').html(days);
               $('#h-hours').html(hours);
               $('#h-minutes').html(minutes);
               $('#h-seconds').html(seconds);		
       }
       setInterval(function() { hotdealTimer(); }, 1000);
       /* countDown */
});
</script>
</th:block>

</body>
</html>