|
|
@@ -0,0 +1,619 @@
|
|
|
+<!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 : GoodsDetailFormWeb.html
|
|
|
+ * @desc : 딜 상품상세 Page
|
|
|
+ *============================================================================
|
|
|
+ * STYLE24
|
|
|
+ * Copyright(C) 2020 TSIT, All rights reserved.
|
|
|
+ *============================================================================
|
|
|
+ * VER DATE AUTHOR DESCRIPTION
|
|
|
+ * === =========== ========== =============================================
|
|
|
+ * 1.0 2021.03.02 eskim 최초 작성
|
|
|
+ *******************************************************************************
|
|
|
+ -->
|
|
|
+<body>
|
|
|
+<th:block layout:fragment="content">
|
|
|
+<script src="https://cdnjs.cloudflare.com/ajax/libs/ion-rangeslider/2.3.1/js/ion.rangeSlider.min.js"></script>
|
|
|
+<div id="container" class="container pd deal" th:with="imgGoodsUrl=${@environment.getProperty('upload.goods.view')}, uxImgUrl=${@environment.getProperty('domain.uximage')}, imgUrl=${@environment.getProperty('upload.image.view')}">
|
|
|
+ <div class="wrap">
|
|
|
+ <!-- 상품 대표설명 -->
|
|
|
+ <div class="content pd_detail">
|
|
|
+ <div class="cont_head">
|
|
|
+ <h3 class="sr-only">상품 대표설명</h3>
|
|
|
+ </div>
|
|
|
+ <div class="cont_body">
|
|
|
+ <!-- CONT-BODY -->
|
|
|
+ <div class="item_detail">
|
|
|
+ <div class="area_pic">
|
|
|
+ <div class="thumb_nav_wrap" th:if="${goodsImgList != null and !goodsImgList.empty}" >
|
|
|
+ <div class="thumbnav">
|
|
|
+ <div class="swiper-container">
|
|
|
+ <div class="swiper-wrapper">
|
|
|
+ <th:block th:each="goodsImg, status : ${goodsImgList}">
|
|
|
+ <div class="swiper-slide" th:classappend="${status.first}? 'on' : ''"
|
|
|
+ th:if="${ not (#strings.contains(goodsImg.sysImgNm,'_S1.')
|
|
|
+ or #strings.contains(goodsImg.sysImgNm,'_L1.')
|
|
|
+ or #strings.contains(goodsImg.sysImgNm,'_L2.'))}">
|
|
|
+ <a th:href="${'#navLocate'+ status.count}"><span class="thumb"><img th:src="${imgGoodsUrl+'/'+goodsImg.sysImgNm}" alt="" th:onerror="'this.src=\''+@{${uxImgUrl}+ '/images/pc/thumb/bg_item_none.png'}+'\';'"></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" th:if="${goodsImgList != null and !goodsImgList.empty}" >
|
|
|
+ <ul>
|
|
|
+ <th:block th:each="goodsImg, status : ${goodsImgList}">
|
|
|
+ <li th:id="${'navLocate'+ status.count}" th:classappend="${status.first}? 'on' : ''"
|
|
|
+ th:if="${ not (#strings.contains(goodsImg.sysImgNm,'_S1.')
|
|
|
+ or #strings.contains(goodsImg.sysImgNm,'_L1.')
|
|
|
+ or #strings.contains(goodsImg.sysImgNm,'_L2.'))}">
|
|
|
+ <a href="javascript:void(0);"><span class="thumb"><img th:src="${imgGoodsUrl+'/'+goodsImg.sysImgNm}" alt="" th:onerror="'this.src=\''+@{${uxImgUrl}+ '/images/pc/thumb/bg_item_none.png'}+'\';'"></span></a></li>
|
|
|
+ </th:block>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <form name="cartForm" id="cartForm" method="post">
|
|
|
+ <input type="hidden" name="mode">
|
|
|
+ <input type="hidden" name="goodsCd" th:value="${params.goodsCd}" />
|
|
|
+ <input type="hidden" name="contentsLoc" th:value="${params.contentsLoc}" />
|
|
|
+ <input type="hidden" name="ithrCd" th:value="${params.ithrCd}" />
|
|
|
+ <input type="hidden" name="planDtlSq" th:value="${params.planDtlSq}" />
|
|
|
+ <input type="hidden" name="adminYn" th:value="${params.adminYn}" />
|
|
|
+ <input type="hidden" name="optCd" />
|
|
|
+ <input type="hidden" name="optCd1" />
|
|
|
+ <input type="hidden" name="optCd2" />
|
|
|
+ <input type="hidden" name="addPrice" />
|
|
|
+ <input type="hidden" name="ordQty" />
|
|
|
+ <input type="hidden" name="stock" />
|
|
|
+ <input type="hidden" name="minOrdQty"/>
|
|
|
+ <input type="hidden" name="maxOrdQty"/>
|
|
|
+ <input type="hidden" name="goodsType" th:value="${goodsInfo.goodsType}"/>
|
|
|
+ <input type="hidden" name="selfGoodsYn" th:value="${goodsInfo.selfGoodsYn}"/>
|
|
|
+ <div class="area_desc">
|
|
|
+ <div class="desc_wrap">
|
|
|
+ <div class="timer_box" style="display:none;">
|
|
|
+ <p>
|
|
|
+ <span class="tit">남은시간</span>
|
|
|
+ <span class="timer">
|
|
|
+ <em id="d-days">0</em>
|
|
|
+ <em id="d-hours">0</em>
|
|
|
+ <em id="d-minutes">0</em>
|
|
|
+ <em id="d-seconds">0</em>
|
|
|
+ </span>
|
|
|
+ </p>
|
|
|
+ </div>
|
|
|
+ <div class="descript_box">
|
|
|
+ <div class="desc_top">
|
|
|
+ <button type="button" class="itemShare">상품 공유하기</button>
|
|
|
+ <button type="button" class="itemLike">관심상품 추가</button>
|
|
|
+ </div>
|
|
|
+ <div class="desc_info">
|
|
|
+ <div class="title_blk">
|
|
|
+ <span class="comment" th:text="${goodsInfo.goodsTnm}">
|
|
|
+ #본사 직영 인기캐주얼 특가전
|
|
|
+ </span>
|
|
|
+ <span class="name" th:text="${goodsInfo.goodsFullNm}">
|
|
|
+ [NBA외] 본사 직영~ 봄 신상 야구모자/백팩 외 99종 무료배송!
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ <div class="price_blk">
|
|
|
+ <span class="sale_price">
|
|
|
+ <em>134,100</em>원 ~
|
|
|
+ </span>
|
|
|
+ <button type="button" id="btn_saleCoupon_pop" class="btn btn_primary btn_sm btn_coupon" th:if="${goodsCouponList != null and !goodsCouponList.empty}" th:onclick="cfGoodsCouponInfo([[${goodsInfo.goodsCd}]])"><span>쿠폰받기</span></button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="benefit_box" th:if="${(cardInfoList != null and !cardInfoList.empty) or
|
|
|
+ (goodsCouponList != null and !goodsCouponList.empty)
|
|
|
+ }" >
|
|
|
+ <dl>
|
|
|
+ <div class="bnf_shopping" th:if="${goodsCouponList != null and !goodsCouponList.empty}">
|
|
|
+ <dt>쇼핑혜택</dt>
|
|
|
+ <!------------ 색상 강조 텍스트 영역 <em class="c_primary"></em> 사용요청 ------------>
|
|
|
+ <dd>
|
|
|
+ <span th:if="${goodsCouponList != null and !goodsCouponList.empty}">
|
|
|
+ <th:block th:each="goodsCoupon, status : ${goodsCouponList}" th:if="${status.first}">
|
|
|
+ 최대 <em class="c_primary" >
|
|
|
+ <th:block th:if="${goodsCoupon.dcWay == 'G240_10'}" th:text="|${#numbers.formatInteger(goodsCoupon.dcVal, 0,'COMMA')}원|"></th:block>
|
|
|
+ <th:block th:unless="${goodsCoupon.dcWay == 'G240_10'}" th:text="|${goodsCoupon.dcVal}%|"></th:block>
|
|
|
+ </em> 쿠폰 할인
|
|
|
+ </th:block>
|
|
|
+ </span>
|
|
|
+ <span><em class="c_primary">99개</em> 이상 구매 시 <em class="c_primary">9,999,999원</em> 할인</span>
|
|
|
+ <span>미니언즈 우산 증정</span>
|
|
|
+ <button type="button" id="btn_bnfShopping_pop" class="btn_popup" th:onclick="cfGoodsShopBenefitInfo([[${goodsInfo.goodsCd}]])"><span>자세히</span></button>
|
|
|
+ </dd>
|
|
|
+ </div>
|
|
|
+ <div class="bnf_card" th:if="${cardInfoList != null and !cardInfoList.empty}">
|
|
|
+ <dt>카드혜택</dt>
|
|
|
+ <dd>
|
|
|
+ <th:block th:each="cardInfo, status : ${cardInfoList}">
|
|
|
+ <span th:if="${cardInfo.prmtGb == 'A' and cardInfo.dcGb != '3'}"><th:block th:text="${cardInfo.prmtTargetNm}"></th:block> <em class="c_primary"><th:block th:text="${#numbers.formatInteger(cardInfo.dcVal, 0,'COMMA')+ cardInfo.dcWayNm}"></th:block></em> <th:block th:text="${cardInfo.prmtGbNm}"></span>
|
|
|
+ <span th:if="${cardInfo.prmtGb == 'A' and cardInfo.dcGb == '3'}" th:text="${cardInfo.prmtNm}">프로모션명</span>
|
|
|
+ <span th:if="${cardInfo.prmtGb == 'B'}">신용카드 무이자 혜택</span>
|
|
|
+ </th:block>
|
|
|
+ <button type="button" id="btn_bnfCard_pop" class="btn_popup" onclick="cfCardInfo();return false;"><span>자세히</span></button>
|
|
|
+ </dd>
|
|
|
+ </div>
|
|
|
+ </dl>
|
|
|
+ </div>
|
|
|
+ <div class="option_box">
|
|
|
+ <div class="opt_select">
|
|
|
+ <form class="form_wrap">
|
|
|
+ <div class="form_field">
|
|
|
+ <div class="select_custom deal_opt_item">
|
|
|
+ <div class="combo">
|
|
|
+ <div class="select">
|
|
|
+ <div class="item_prod">
|
|
|
+ <div class="item_state">
|
|
|
+ <a href="javascript:void(0)" class="itemLink">
|
|
|
+ <div class="itemPic">
|
|
|
+ <img alt="" class="vLHTC pd_img" src="/images/pc/thumb/tmp_pdDetail1.jpg">
|
|
|
+ </div>
|
|
|
+ <div class="itemName">선택</div>
|
|
|
+ </a>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <ul class="list">
|
|
|
+ <!-- 선택처리 class="selected" / 선택불가 aria-disabled="true" / 품절표기 data-soldout="true" 추가 -->
|
|
|
+ <li class="selected">
|
|
|
+ <div class="item_prod">
|
|
|
+ <div class="item_state">
|
|
|
+ <a href="javascript:void(0)" class="itemLink">
|
|
|
+ <div class="itemPic">
|
|
|
+ <img alt="" class="vLHTC pd_img" src="/images/pc/thumb/tmp_pdDetail1.jpg">
|
|
|
+ </div>
|
|
|
+ <div class="itemName"><span class="tit_option">[상품1]</span>유니 삼단블록 플리스 집업 유니 삼단블록 플리스 집업 유니 삼단블록 플리스 집업</div>
|
|
|
+ <p class="itemPrice">134,100
|
|
|
+ <span class="itemPrice_original">149,000</span>
|
|
|
+ <span class="itemPercent">30%</span>
|
|
|
+ </p>
|
|
|
+ </a>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </li>
|
|
|
+ <li>
|
|
|
+ <div class="item_prod">
|
|
|
+ <div class="item_state">
|
|
|
+ <a href="javascript:void(0)" class="itemLink">
|
|
|
+ <div class="itemPic">
|
|
|
+ <img alt="" class="vLHTC pd_img" src="/images/pc/thumb/tmp_pdDetail1.jpg">
|
|
|
+ </div>
|
|
|
+ <div class="itemName"><span class="tit_option">[상품2]</span>유니 삼단블록 플리스 집업 유니 삼단블록 플리스 집업 유니 삼단블록 플리스 집업</div>
|
|
|
+ <p class="itemPrice">134,100
|
|
|
+ <span class="itemPrice_original">149,000</span>
|
|
|
+ <span class="itemPercent">30%</span>
|
|
|
+ </p>
|
|
|
+ </a>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </li>
|
|
|
+ <li>
|
|
|
+ <div class="item_prod">
|
|
|
+ <div class="item_state">
|
|
|
+ <a href="javascript:void(0)" class="itemLink">
|
|
|
+ <div class="itemPic">
|
|
|
+ <img alt="" class="vLHTC pd_img" src="/images/pc/thumb/tmp_pdDetail1.jpg">
|
|
|
+ </div>
|
|
|
+ <div class="itemName"><span class="tit_option">[상품3]</span>유니 삼단블록 플리스 집업 유니 삼단블록 플리스 집업 유니 삼단블록 플리스 집업</div>
|
|
|
+ <p class="itemPrice">134,100
|
|
|
+ <span class="itemPrice_original">149,000</span>
|
|
|
+ <span class="itemPercent">30%</span>
|
|
|
+ </p>
|
|
|
+ </a>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </li>
|
|
|
+ <li aria-disabled="true">
|
|
|
+ <div class="item_prod">
|
|
|
+ <div class="item_state">
|
|
|
+ <a href="javascript:void(0)" class="itemLink">
|
|
|
+ <div class="itemPic">
|
|
|
+ <img alt="" class="vLHTC pd_img" src="/images/pc/thumb/tmp_pdDetail1.jpg">
|
|
|
+ </div>
|
|
|
+ <div class="itemName"><span class="tit_option">[상품4]</span>유니 삼단블록 플리스 집업 유니 삼단블록 플리스 집업 유니 삼단블록 플리스 집업</div>
|
|
|
+ <p class="itemPrice">134,100
|
|
|
+ <span class="itemPrice_original">149,000</span>
|
|
|
+ <span class="itemPercent">30%</span>
|
|
|
+ </p>
|
|
|
+ </a>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </li><li aria-disabled="true" data-soldout="true">
|
|
|
+ <div class="item_prod">
|
|
|
+ <div class="item_state">
|
|
|
+ <a href="javascript:void(0)" class="itemLink">
|
|
|
+ <div class="itemPic">
|
|
|
+ <img alt="" class="vLHTC pd_img" src="/images/pc/thumb/tmp_pdDetail1.jpg">
|
|
|
+ </div>
|
|
|
+ <div class="itemName"><span class="tit_option">[상품5]</span>유니 삼단블록 플리스 집업 유니 삼단블록 플리스 집업 유니 삼단블록 플리스 집업</div>
|
|
|
+ <p class="itemPrice">134,100
|
|
|
+ <span class="itemPrice_original">149,000</span>
|
|
|
+ <span class="itemPercent">30%</span>
|
|
|
+ </p>
|
|
|
+ </a>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="form_field">
|
|
|
+ <div class="select_custom deal_opt1" disabled>
|
|
|
+ <div class="combo">
|
|
|
+ <div class="select">선택</div>
|
|
|
+ <ul class="list">
|
|
|
+ <!-- 선택처리 class="selected" / 선택불가 aria-disabled="true" / 품절표기 data-soldout="true" 추가 -->
|
|
|
+ <li class="selected">선택</li>
|
|
|
+ <li>상품옵션01</li>
|
|
|
+ <li>상품옵션02</li>
|
|
|
+ <li>상품옵션03</li>
|
|
|
+ <li aria-disabled="true">
|
|
|
+ <div>상품옵션05</div>
|
|
|
+ <div>120,000원</div>
|
|
|
+ </li>
|
|
|
+ <li>상품옵션06</li>
|
|
|
+ <li aria-disabled="true" data-soldout="true">
|
|
|
+ <div>상품옵션07</div>
|
|
|
+ <div>120,000원</div>
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="form_field">
|
|
|
+ <div class="select_custom deal_opt2" disabled>
|
|
|
+ <div class="combo">
|
|
|
+ <div class="select">선택</div>
|
|
|
+ <ul class="list">
|
|
|
+ <!-- 선택처리 class="selected" / 선택불가 aria-disabled="true" / 품절표기 data-soldout="true" 추가 -->
|
|
|
+ <li class="selected">선택</li>
|
|
|
+ <li>상품옵션11</li>
|
|
|
+ <li>상품옵션12</li>
|
|
|
+ <li>상품옵션13</li>
|
|
|
+ <li aria-disabled="true">
|
|
|
+ <div>상품옵션15</div>
|
|
|
+ <div>120,000원</div>
|
|
|
+ </li>
|
|
|
+ <li>상품옵션16</li>
|
|
|
+ <li aria-disabled="true" data-soldout="true">
|
|
|
+ <div>상품옵션17</div>
|
|
|
+ <div>120,000원</div>
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </form>
|
|
|
+ </div>
|
|
|
+ <div class="opt_result">
|
|
|
+ <div class="result_item">
|
|
|
+ <div class="opt_header">
|
|
|
+ <span class="item_name">[상품1] 남성 테이퍼드핏 기모면 올밴딩 팬트</span>
|
|
|
+ <span class="item_option">다크그레이/XXL</span>
|
|
|
+ </div>
|
|
|
+ <div class="number_count">
|
|
|
+ <span class="minus"><em class="sr-only">감소</em></span>
|
|
|
+ <input type="text" name="" maxlength="3" style='ime-mode:disabled' value="1" />
|
|
|
+ <span class="plus"><em class="sr-only">추가</em></span>
|
|
|
+ </div>
|
|
|
+ <div class="item_price">
|
|
|
+ <p><em>99,999,999</em>원</p>
|
|
|
+ </div>
|
|
|
+ <button type="button" class="btn_delete_item"><span>삭제</span></button>
|
|
|
+ </div>
|
|
|
+ <div class="result_item">
|
|
|
+ <div class="opt_header">
|
|
|
+ <span class="item_name">[상품1] 남성 테이퍼드핏 기모면 올밴딩 팬트</span>
|
|
|
+ <span class="item_option">블루그레이/S</span>
|
|
|
+ </div>
|
|
|
+ <div class="number_count">
|
|
|
+ <span class="minus"><em class="sr-only">감소</em></span>
|
|
|
+ <input type="text" name="" maxlength="3" style='ime-mode:disabled' value="1" />
|
|
|
+ <span class="plus"><em class="sr-only">추가</em></span>
|
|
|
+ </div>
|
|
|
+ <div class="item_price">
|
|
|
+ <p><em>99,999,999</em>원</p>
|
|
|
+ </div>
|
|
|
+ <button type="button" class="btn_delete_item"><span>삭제</span></button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="price_box">
|
|
|
+ <p class="number">
|
|
|
+ 총 <span id="goodsTotalQty">0</span>개
|
|
|
+ </p>
|
|
|
+ <p class="price">
|
|
|
+ <span>
|
|
|
+ <b id="goodsTotalPrice">0</b><em>원</em>
|
|
|
+ </span>
|
|
|
+ </p>
|
|
|
+ </div>
|
|
|
+ <div class="btn_box">
|
|
|
+ <div class="btn_group_block ui_row">
|
|
|
+ <div class="ui_col_6">
|
|
|
+ <button type="button" class="btn btn_dark btn_block" id="btnGoodsWish" onclick="fnAddCart('C');"><span>쇼핑백</span></button>
|
|
|
+ </div>
|
|
|
+ <div class="ui_col_6">
|
|
|
+ <button type="button" class="btn btn_primary btn_block" id="btnGoodsCart" onclick="fnAddCart('O');"><span>바로구매</span></button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="btn_group_block ui_row">
|
|
|
+ <div class="ui_col_12">
|
|
|
+ <button type="button" class="btn btn_dark btn_block" disabled><span>SOLD OUT</span></button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </form>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- 상품 대표설명 -->
|
|
|
+
|
|
|
+ <th:block th:include="~{web/goods/GoodsIncludeFormWeb :: goodsDealComposeForm}"></th:block>
|
|
|
+ <!-- //***** 상품소개영역 ***** -->
|
|
|
+ <!-- 이 상품과 함께 본 상품 -->
|
|
|
+ <div class="content wide pd_clickother" id="goodsTogetherbArea">
|
|
|
+ </div>
|
|
|
+ <!-- // 이 상품과 함께 본 상품 -->
|
|
|
+ </div>
|
|
|
+</div>
|
|
|
+
|
|
|
+
|
|
|
+ <script th:inline="javascript">
|
|
|
+/*<![CDATA[*/
|
|
|
+
|
|
|
+ var cateNm = "";
|
|
|
+
|
|
|
+ // 함께본 상품
|
|
|
+ var fnGoodsTogetherSearch = function(params) {
|
|
|
+ gagajf.ajaxSubmit("/goods/detail/together/frame", "html", "goodsTogetherbArea", params);
|
|
|
+ }
|
|
|
+
|
|
|
+ $(document).ready( function() {
|
|
|
+
|
|
|
+ $('.timer_box').css('display', 'none');
|
|
|
+
|
|
|
+ var params = new Object();
|
|
|
+ params.goodsCd = [[${params.goodsCd}]];
|
|
|
+ params.viewDt = [[${params.viewDt}]];
|
|
|
+ params.preview = [[${params.preview}]];
|
|
|
+ params.adminYn = [[${params.adminYn}]];
|
|
|
+ params.goodsType = [[${params.goodsType}]];
|
|
|
+ params.supplyCompCd = [[${params.supplyCompCd}]];
|
|
|
+ params.brandGroupNm = [[${goodsInfo.brandGroupNm}]];
|
|
|
+
|
|
|
+ // 함께본 상품(ajax html)
|
|
|
+ params.goodsOtherGb = "together";
|
|
|
+ params.ithrCd = "tmtb";
|
|
|
+ params.contentsLoc = "tmtb";
|
|
|
+ fnGoodsTogetherSearch(params);
|
|
|
+
|
|
|
+ if (!gagajf.isNull([[${goodsInfo.socialSq}]])){
|
|
|
+ $('.timer_box').css('display', 'block');
|
|
|
+ /* 행사 남은시간 */
|
|
|
+ function promotionTimer() {
|
|
|
+ var endTime = new Date([[${goodsInfo.socialEddt}]]); // 남은시간 지정 30 March 2021 9:56:00 GMT+0900
|
|
|
+ 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; }
|
|
|
+
|
|
|
+ if (Number(days) > 0 ){
|
|
|
+ $('#d-days').html(days);
|
|
|
+ }else{
|
|
|
+ $('#d-days').css('display','none');
|
|
|
+ }
|
|
|
+ $('#d-hours').html(hours);
|
|
|
+ $('#d-minutes').html(minutes);
|
|
|
+ $('#d-seconds').html(seconds);
|
|
|
+ }
|
|
|
+ setInterval(function() { promotionTimer(); }, 1000);
|
|
|
+ }
|
|
|
+
|
|
|
+ //상품 대표설명 > 우측 상품정보
|
|
|
+ /* 딜 옵션선택 후 다음 옵션 활성화 */
|
|
|
+ var detail_deal_option01 = new sCombo('.pd_detail .opt_select .select_custom.deal_opt_item');
|
|
|
+ var detail_deal_option02 = new sCombo('.pd_detail .opt_select .select_custom.deal_opt1');
|
|
|
+ var detail_deal_option03 = new sCombo('.pd_detail .opt_select .select_custom.deal_opt2');
|
|
|
+ $('.pd_detail .opt_select .select_custom .combo .list > li').click(function(e) {
|
|
|
+ $(this).parents('.form_field').next('.form_field').find('.select_custom').attr('disabled', false);
|
|
|
+ return false;
|
|
|
+ });
|
|
|
+
|
|
|
+ // 하단 우측 상품선택영역
|
|
|
+ /* 딜 옵션선택 후 다음 옵션 활성화 */
|
|
|
+ var desc_option01 = new sCombo('.pd_desc_wrap .opt_select .select_custom.deal_opt_item');
|
|
|
+ var desc_option02 = new sCombo('.pd_desc_wrap .opt_select .select_custom.deal_opt1');
|
|
|
+ var desc_option03 = new sCombo('.pd_desc_wrap .opt_select .select_custom.deal_opt2');
|
|
|
+ $('.pd_desc_wrap .opt_select .select_custom .combo .list > li').click(function(e) {
|
|
|
+ $(this).parents('.form_field').next('.form_field').find('.select_custom').attr('disabled', false);
|
|
|
+ return false;
|
|
|
+ });
|
|
|
+
|
|
|
+ // 상품선택 옵션 : 하단 상품정보 영역
|
|
|
+ var tab_review_item = new sCombo('.tab_detail_cont .select_custom.deal_opt_item.forReview');
|
|
|
+ var tab_qna_item = new sCombo('.tab_detail_cont .select_custom.deal_opt_item.forQna');
|
|
|
+ var tab_exinfo_item = new sCombo('.tab_detail_cont .select_custom.deal_opt_item.forExinfo');
|
|
|
+
|
|
|
+ // 상품선택 옵션 : 상세정보 > 상품 > 팝업
|
|
|
+ var pop_desc_option01 = new sCombo('.pd_descrp_pop .select_custom.deal_opt_item');
|
|
|
+ var pop_desc_option02 = new sCombo('.pd_detail .opt_select .select_custom.deal_opt1');
|
|
|
+ var pop_desc_option03 = new sCombo('.pd_detail .opt_select .select_custom.deal_opt2');
|
|
|
+
|
|
|
+ /* 상품옵션변경 팝업 > 수량조절 */
|
|
|
+ //수량1개 이하 감소버튼 비활성화
|
|
|
+ var valItemCount = $('.option_box .result_item .number_count input').val();
|
|
|
+ if ( valItemCount == 1 ) {
|
|
|
+ $(' .option_box .result_item .number_count .minus').addClass('min_val');
|
|
|
+ }
|
|
|
+ //수량조절 이벤트
|
|
|
+ $(document).on('click','.option_box .result_item .number_count .minus',function(e){
|
|
|
+ var $input = $(this).parent().find('input');
|
|
|
+ var count = parseInt($input.val()) - 1;
|
|
|
+ count = count < 1 ? 1 : count;
|
|
|
+ $input.val(count);
|
|
|
+ $input.change();
|
|
|
+ //수량1개 이하 감소버튼 비활성화
|
|
|
+ if ($input.val() == 1) {
|
|
|
+ $(this).parent('.number_count').find('.minus').addClass('min_val');
|
|
|
+ }
|
|
|
+ return false;
|
|
|
+ }).on('click','.option_box .result_item .number_count .plus',function(e){
|
|
|
+ var $input = $(this).parent().find('input');
|
|
|
+ $input.val(parseInt($input.val()) + 1);
|
|
|
+ $input.change();
|
|
|
+ //수량2개 이상부터 감소버튼 활성화
|
|
|
+ $(this).parent('.number_count').find('.minus').removeClass('min_val');
|
|
|
+ return false;
|
|
|
+ }).on('keyup','.option_box .result_item .number_count input[type=text]',function(e){
|
|
|
+ //텍스트, 0 입력금지
|
|
|
+ $(this).val($(this).val().replace(/[^1-9]/g,""));
|
|
|
+ });
|
|
|
+
|
|
|
+ //상품상세정보 더보기
|
|
|
+ $(document).on('click','.pd_descrp_pop .btn_more_box button',function(e){
|
|
|
+ $('.pd_descrp_pop .cont_body').toggleClass('on');
|
|
|
+ $(this).toggleClass('active');
|
|
|
+ $(this).parent('.btn_more_box').toggleClass('covered');
|
|
|
+ var descrpToggle = $(this).find('span');
|
|
|
+ $(descrpToggle).text($(descrpToggle).text() == '상세정보 더보기' ? '상세정보 접기' : '상세정보 더보기');
|
|
|
+ return false;
|
|
|
+ });
|
|
|
+
|
|
|
+ //상품상세정보 탭
|
|
|
+ $(document).on('click','.pd.deal .tab_detail_nav ul li',function(e){
|
|
|
+ $(this).addClass('active').siblings().removeClass('active');
|
|
|
+ $('.pd.deal .tab_detail_cont').hide();
|
|
|
+ $('.pd.deal .tab_detail_cont').eq($(this).index()).show();
|
|
|
+
|
|
|
+ //상품상세정보 호출
|
|
|
+ $('.pd_review .cont_body').load('pd_review_pop.html');
|
|
|
+ $('.pd_qnalist .cont_body').load('pd_qnalist_pop.html');
|
|
|
+ $('.pd_delivery .cont_body').load('pd_delivery_pop.html');
|
|
|
+
|
|
|
+ return false;
|
|
|
+ });
|
|
|
+
|
|
|
+ //슬라이드 - 이 상품과 함께 본 상품
|
|
|
+ var otherItemSwiper = new Swiper('.pd .pd_clickother .area_slider .swiper-container', {
|
|
|
+ slidesPerView: 5,
|
|
|
+ spaceBetween: 20,
|
|
|
+ navigation: {
|
|
|
+ nextEl: '.pd_clickother .swiper-button-next',
|
|
|
+ prevEl: '.pd_clickother .swiper-button-prev',
|
|
|
+ },
|
|
|
+ pagination: {
|
|
|
+ el: '.pd_clickother .swiper-pagination',
|
|
|
+ clickable: true,
|
|
|
+ },
|
|
|
+ });
|
|
|
+
|
|
|
+ // 광고 스크립트용
|
|
|
+ var goodsNavigation = [[${goodsNavigation}]];
|
|
|
+ var cate1Nm = "";
|
|
|
+ var cate2Nm = "";
|
|
|
+ var cate3Nm = "";
|
|
|
+ var cate4Nm = "";
|
|
|
+ var cate5Nm = "";
|
|
|
+ if (!gagajf.isNull(goodsNavigation)) {
|
|
|
+ cate1Nm = goodsNavigation.cate1Nm;
|
|
|
+ cate2Nm = goodsNavigation.cate2Nm;
|
|
|
+ cate3Nm = goodsNavigation.cate3Nm;
|
|
|
+ cate4Nm = goodsNavigation.cate4Nm;
|
|
|
+ cate5Nm = goodsNavigation.cate3Nm;
|
|
|
+
|
|
|
+ if (!gagajf.isNull(cate1Nm)) {
|
|
|
+ cateNm += cate1Nm;
|
|
|
+ }
|
|
|
+ if (!gagajf.isNull(cate2Nm)) {
|
|
|
+ cateNm += ' > ' + cate2Nm;
|
|
|
+ }
|
|
|
+ if (!gagajf.isNull(cate3Nm)) {
|
|
|
+ cateNm += ' > ' + cate3Nm;
|
|
|
+ }
|
|
|
+ if (!gagajf.isNull(cate4Nm)) {
|
|
|
+ cateNm += ' > ' + cate4Nm;
|
|
|
+ }
|
|
|
+ if (!gagajf.isNull(cate5Nm)) {
|
|
|
+ cateNm += ' > ' + cate5Nm;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ // 광고 스크립트용
|
|
|
+
|
|
|
+ var snsGoodsImg = _uploadGoodsUrl + [[${goodsInfo.sysImgNm}]];
|
|
|
+ var snsUrl = location.protocol + _PAGE_GOODS_DETAIL + params.goodsCd +'&colorCd =' + params.colorCd ;
|
|
|
+ var snsGoodsFullNm = [[${goodsInfo.goodsFullNm}]];
|
|
|
+
|
|
|
+ <!-- 페이스북 카카오스토리 연동 관련 메타태그 -->
|
|
|
+ $("meta[property='og:url']").attr('content', snsUrl);
|
|
|
+ $("meta[property='og:title']").attr('content', snsGoodsFullNm);
|
|
|
+ $("meta[property='og:description']").attr('content', snsGoodsFullNm);
|
|
|
+ $("meta[property='og:image']").attr('content', snsGoodsImg);
|
|
|
+
|
|
|
+ <!-- 트위터 관련 메타태그 -->
|
|
|
+ $("meta[name='twitter:url']").attr('content', snsUrl);
|
|
|
+ $("meta[name='twitter:title']").attr('content', snsGoodsFullNm);
|
|
|
+ $("meta[name='twitter:description']").attr('content', snsGoodsFullNm);
|
|
|
+ $("meta[name='twitter:image']").attr('content', snsGoodsImg);
|
|
|
+
|
|
|
+ // 추천솔류션 meta 설정
|
|
|
+ $("meta[property='eg:type']").attr('content',"product");
|
|
|
+ $("meta[property='eg:cuid']").attr('content',eglqueueCuid);
|
|
|
+ $("meta[property='eg:itemId']").attr('content', [[${goodsInfo.goodsCd}]] );
|
|
|
+ $("meta[property='eg:itemName']").attr('content',[[${goodsInfo.goodsFullNm}]] );
|
|
|
+ $("meta[property='eg:itemImage']").attr('content', snsGoodsImg);
|
|
|
+ $("meta[property='eg:itemUrl']").attr('content',snsUrl);
|
|
|
+ $("meta[property='eg:originalPrice']").attr('content',[[${goodsInfo.listPrice}]]);
|
|
|
+ $("meta[property='eg:salePrice']").attr('content',[[${goodsInfo.currPrice}]]);
|
|
|
+ $("meta[property='eg:category1']").attr('content',cate1Nm);
|
|
|
+ $("meta[property='eg:category2']").attr('content',cate2Nm);
|
|
|
+ $("meta[property='eg:category3']").attr('content',cate3Nm);
|
|
|
+ $("meta[property='eg:category4']").attr('content',cate4Nm);
|
|
|
+ $("meta[property='eg:category5']").attr('content',cate5Nm);
|
|
|
+ $("meta[property='eg:brandId']").attr('content',[[${goodsInfo.brandGroupNo}]]);
|
|
|
+ $("meta[property='eg:brandName']").attr('content',[[${goodsInfo.brandGroupNm}]]);
|
|
|
+ $("meta[property='eg:regDate']").attr('content',[[${goodsInfo.regDt}]].toDate("YYYYMMDDHHmmss").format("YYYY-MM-DDTHH:mm:ssZ"));
|
|
|
+ $("meta[property='eg:updateDate']").attr('content',[[${goodsInfo.updDt}]].toDate("YYYYMMDDHHmmss").format("YYYY-MM-DDTHH:mm:ssZ"));
|
|
|
+ $("meta[property='eg:stock']").attr('content',"");
|
|
|
+ $("meta[property='eg:state']").attr('content',[[${goodsInfo.goodsStatNm}]]);
|
|
|
+ $("meta[property='eg:description']").attr('content',null);
|
|
|
+ $("meta[property='eg:extraImage']").attr('content',null);
|
|
|
+ $("meta[property='eg:locale']").attr('content',"KR");
|
|
|
+ $("meta[property='eg:isNew']").attr('content',([[${goodsInfo.formalGb}]] == 'G009_10')? 'True' :'False');
|
|
|
+ $("meta[property='eg:etc1']").attr('content', [[${goodsInfo.selfGoodsYn}]]);
|
|
|
+ });
|
|
|
+
|
|
|
+/*]]>*/
|
|
|
+</script>
|
|
|
+<!-- 광고 스크립트 -->
|
|
|
+<!-- <th:block th:replace="~{web/common/advertisements/GoodsDetailScriptsWeb :: scripts}"></th:block> -->
|
|
|
+<!-- //광고 스크립트 -->
|
|
|
+
|
|
|
+</th:block>
|
|
|
+
|
|
|
+</body>
|
|
|
+</html>
|
bin2107