style24
/
style24.front


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145
							<!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">
		<th:block th:if="${socialInfo != null}">
			<div class="content wide dp_hotdeal"> <!-- 페이지특정 클래스 = dp_hotdeal -->
				<div class="cont_body">
                    <div class="hotdeal">
                    <img src="/images/pc/thumb/hotdeal_bg2.jpg" alt="핫한 아이템을 핫한 가격에 LAST DAY DEAL">
                        <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 class="item_prod" th:class="${SocialData.stockQtySum == 0 ? 'item_prod sold_out' : 'item_prod'}">
                                <div class="item_state"> <!-- item_state AD soldout -->
                                    <button type="button" th:class="${SocialData.likeIt == 'likeit'}? 'itemLike active' : 'itemLike'" onclick="cfnPutWishList(this);" th:attr="goodsCd=${SocialData.goodsCd}, ithrCd='', contentsLoc='', planDtlSq=''">관심상품 추가</button>
                                    <a href="javascript:void(0);" class="itemLink" th:onclick="cfnGoToGoodsDetail([[${SocialData.goodsCd}]])" >
                                        <div class="itemPic">
                                            <img alt="BLUE-a" class=" vLHTC pd_img" th:src="${@environment.getProperty('upload.goods.view') + '/' + SocialData.sysImgNm}">
                                        </div>
                                        <div class="itemSpecialPrice"><span>특가</span></div>
                                        <p class="itemBrand" th:text="${SocialData.brandGroupNm}"></p>
                                        <div class="itemName" th:text="${SocialData.goodsNm}"></div>
                                       <div class="itemComment" th:if="${SocialData.goodsTnm!=null}" th:text="${SocialData.goodsTnm}"></div>
                                        <p class="itemPrice">
                                             [[${#numbers.formatInteger(SocialData.currPrice,0,'COMMA')} + 원]]
                                            <span class="itemPrice_original" th:text="${#numbers.formatInteger(SocialData.listPrice,0,'COMMA')} + '원'"></span>
											<span class=" itemPercent" th:text="${#numbers.formatDecimal(SocialData.dcRate,1,0)} + '%'"></span>
                                        </p>
                                    </a>
                                    	 <div class="shopBagBtn">
                                            <button type="button" class="btn btn_defalt" onclick="socialAddCart(this)" th:attr="goodsCd=${SocialData.goodsCd}, minOrdQty=${SocialData.minOrdQty}, goodsType=${SocialData.goodsType}, optCd=${SocialData.optCd}">
                                                <span>쇼핑백 담기</span>
                                            </button>
                                        </div>
                                </div>
                            </div>
                            </th:block>
                        </div>
                    </div>
                </div>
		    </div>
		</th:block>
		<th:block th:unless="${socialInfo != null}">
				<div class="nodata" >
					<div class="txt_box">
						<p>
							진행하는 핫딜이 없습니다.
						</p>
					</div>
					<div class="btn_box">
						<button class="btn btn_default" th:onclick="cfnGoToPage(_PAGE_MAIN);"><span>홈으로 가기</span></button>
					</div>
				</div>	
		</th:block>
        </div>
    </div>   
<script th:inline="javascript">
var socialInfo = [[${socialInfo}]];
console.log(socialInfo);
var socialAddCart = function (obj) {
	let btnType = "C";
	let params = [];

	let cart = new Object();
    cart.goodsCd = $(obj).attr("goodsCd");
	cart.optCd = $(obj).attr("optCd");
	cart.goodsQty = $(obj).attr("minOrdQty");
	cart.goodsType = $(obj).attr("goodsType");
	cart.cartGb = btnType;
	cart.afLinkCd = $(obj).attr("afLinkCd");
	cart.ithrCd = "";
	cart.contentsLoc =  "";
	cart.planDtlSq = "";
	params.push(cart); 
	
	// 장바구니담기
	if (params.length > 0){
		cfnAddCart(params);	
	} 
}
$(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>