GoodsDetailFormWeb.html 78 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740174117421743174417451746174717481749175017511752175317541755175617571758175917601761176217631764176517661767176817691770177117721773177417751776
  1. <!DOCTYPE html>
  2. <html lang="ko"
  3. xmlns:th="http://www.thymeleaf.org"
  4. xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
  5. layout:decorator="web/common/layout/DefaultLayoutWeb">
  6. <!--
  7. *******************************************************************************
  8. * @source : GoodsDetailFormWeb.html
  9. * @desc : 상품상세 Page
  10. *============================================================================
  11. * STYLE24
  12. * Copyright(C) 2020 TSIT, All rights reserved.
  13. *============================================================================
  14. * VER DATE AUTHOR DESCRIPTION
  15. * === =========== ========== =============================================
  16. * 1.0 2021.03.02 eskim 최초 작성
  17. *******************************************************************************
  18. -->
  19. <body>
  20. <th:block layout:fragment="content">
  21. <div id="container" class="container pd" th:with="imgGoodsUrl=${@environment.getProperty('upload.goods.view')}, uxImgUrl=${@environment.getProperty('domain.uximage')}, imgUrl=${@environment.getProperty('upload.image.view')}">
  22. <script src="https://developers.kakao.com/sdk/js/kakao.min.js"></script>
  23. <!-- <th:block th:include="~{web/goods/GoodsIncludeFormWeb :: goodsNaviForm}"></th:block> -->
  24. <div class="wrap">
  25. <!-- 상품 대표설명 -->
  26. <div class="content pd_detail">
  27. <div class="cont_head">
  28. <h3 class="sr-only">상품 대표설명</h3>
  29. </div>
  30. <div class="cont_body">
  31. <!-- CONT-BODY -->
  32. <div class="item_detail">
  33. <div class="area_pic" th:if="${(goodsImgList != null and !goodsImgList.empty) or (goodsVideoList != null and !goodsVideoList.empty)}"
  34. th:with="videoYn=${(goodsVideoList != null and !goodsVideoList.empty)? 'Y' :'N'}">
  35. <div class="thumb_nav_wrap" >
  36. <div class="thumbnav">
  37. <div class="swiper-container" >
  38. <div class="swiper-wrapper">
  39. <th:block th:each="goodsVideo, status : ${goodsVideoList}">
  40. <div class="swiper-slide" th:classappend="${status.first}? 'on' : ''" >
  41. <a th:href="${'#navLocate'+ status.count}">
  42. <span class="thumb mov">
  43. <th:block th:if="${goodsVideo.videoGb == 'Y'}">
  44. <img th:src="${'https://img.youtube.com/vi/'+goodsVideo.kmcKey+'/default.jpg'}" alt="" th:onerror="'this.src=\''+@{${uxImgUrl}+ '/images/pc/thumb/bg_item_none.png'}+'\';'">
  45. </th:block>
  46. <th:block th:unless="${goodsVideo.videoGb == 'Y'}">
  47. <iframe width="100%" height="100%" th:src="${kollusMediaUrl+'/'+goodsVideo.kmcKey +'?player_version=html5'}" frameborder="0" allowfullscreen webkitallowfullscreen mozallowfullscreen></iframe>
  48. </th:block>
  49. </span>
  50. </a>
  51. </div>
  52. </th:block>
  53. <th:block th:each="goodsImg, status : ${goodsImgList}">
  54. <div class="swiper-slide" th:classappend="${status.first and videoYn == 'N'}? 'on' : ''" th:with="count=${(videoYn == 'Y')? (status.count +1): status.count }"
  55. th:if="${ not (#strings.contains(goodsImg.sysImgNm,'_S1')
  56. or #strings.contains(goodsImg.sysImgNm,'_L1')
  57. or #strings.contains(goodsImg.sysImgNm,'_L2'))}">
  58. <a th:href="${'#navLocate'+ count}">
  59. <span class="thumb">
  60. <img th:src="${imgGoodsUrl+'/'+goodsImg.sysImgNm+'?RS=48'}" alt="" th:onerror="'this.src=\''+@{${uxImgUrl}+ '/images/pc/thumb/bg_item_none.png'}+'\';'">
  61. </span>
  62. </a>
  63. </div>
  64. </th:block>
  65. </div>
  66. </div>
  67. <div class="swiper-button-next"></div>
  68. <div class="swiper-button-prev"></div>
  69. </div>
  70. </div>
  71. <div class="thumb_list_wrap">
  72. <ul>
  73. <th:block th:each="goodsVideo, status : ${goodsVideoList}">
  74. <li th:id="${'navLocate'+ status.count}" th:classappend="${status.first}? 'on' : ''">
  75. <div class="movbox">
  76. <th:block th:if="${goodsVideo.videoGb == 'Y'}">
  77. <iframe id="prodctThumbVideo" class="pd_mov" width="100%" height="100%" th:src="${'https://www.youtube.com/embed/'+goodsVideo.kmcKey+'?rel=0&autoplay=1&mute=1'}" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
  78. </th:block>
  79. <th:block th:unless="${goodsVideo.videoGb == 'Y'}">
  80. <iframe id="prodctThumbVideo" class="pd_mov" width="100%" height="100%" th:src="${kollusMediaUrl+'/'+goodsVideo.kmcKey +'?enable_initialize_focus=false&autoplay&mute&controls_activation=none'}" frameborder="0" allowfullscreen></iframe>
  81. </th:block>
  82. </div>
  83. </li>
  84. </th:block>
  85. <th:block th:each="goodsImg, status : ${goodsImgList}" >
  86. <th:block th:with="count=${(videoYn == 'Y')? (status.count +1): status.count }">
  87. <li th:id="${'navLocate'+ count}" th:classappend="${status.first and videoYn == 'N'}? 'on' : ''"
  88. th:if="${ not (#strings.contains(goodsImg.sysImgNm,'_S1')
  89. or #strings.contains(goodsImg.sysImgNm,'_L1')
  90. or #strings.contains(goodsImg.sysImgNm,'_L2'))}">
  91. <a href="javascript:void(0);">
  92. <span class="thumb">
  93. <img th:src="${imgGoodsUrl+'/'+goodsImg.sysImgNm+'?RS=1080'}" alt="" th:onerror="'this.src=\''+@{${uxImgUrl}+ '/images/pc/thumb/bg_item_none.png'}+'\';'">
  94. </span>
  95. </a>
  96. </li>
  97. </th:block>
  98. </th:block>
  99. </ul>
  100. </div>
  101. </div>
  102. <form name="cartForm" id="cartForm" method="post">
  103. <input type="hidden" name="mode">
  104. <input type="hidden" name="goodsCd" th:value="${params.goodsCd}" />
  105. <input type="hidden" name="contentsLoc" th:value="${params.contentsLoc}" />
  106. <input type="hidden" name="ithrCd" th:value="${params.ithrCd}" />
  107. <input type="hidden" name="planDtlSq" th:value="${params.planDtlSq}" />
  108. <input type="hidden" name="adminYn" th:value="${params.adminYn}" />
  109. <input type="hidden" name="optCd" />
  110. <input type="hidden" name="optCd1" />
  111. <input type="hidden" name="optCd2" />
  112. <input type="hidden" name="addPrice" />
  113. <input type="hidden" name="ordQty" />
  114. <input type="hidden" name="stock" />
  115. <input type="hidden" name="minOrdQty"/>
  116. <input type="hidden" name="maxOrdQty"/>
  117. <input type="hidden" name="goodsType" th:value="${goodsInfo.goodsType}"/>
  118. <input type="hidden" name="selfGoodsYn" th:value="${goodsInfo.selfGoodsYn}"/>
  119. <div class="area_desc">
  120. <div class="desc_wrap">
  121. <div class="timer_box" style="display:none;">
  122. <p>
  123. <span class="tit">남은시간</span>
  124. <span class="timer">
  125. <em id="d-hours">0</em>
  126. <em id="d-minutes">0</em>
  127. <em id="d-seconds">0</em>
  128. </span>
  129. </p>
  130. </div>
  131. <div class="descript_box">
  132. <div class="desc_top">
  133. <a href="javascript:void(0);" class="btn_brand" th:onclick="cfnGoToBrandMain([[${goodsInfo.brandGroupNo}]])" th:text="${goodsInfo.brandGroupNm}">NBA 키즈</a>
  134. <div class="shareSet">
  135. <button class="btn_share" data-name="openShare">공유하기</button>
  136. <th:block th:include="~{web/goods/GoodsIncludeFormWeb :: goodsSnsForm}"></th:block>
  137. </div>
  138. <button type="button" class="itemLike" th:classappend="${goodsInfo.wishYn == 'Y'}? 'likeit' : ''" onclick="cfnPutWishList(this);" th:attr="goodsCd=${params.goodsCd}, ithrCd=${params.ithrCd}, contentsLoc=${params.contentsLoc}, planDtlSq=${params.planDtlSq}">관심상품 추가</button>
  139. </div>
  140. <div class="desc_info">
  141. <div class="title_blk">
  142. <span class="codenumber" th:text="${goodsInfo.goodsCd}">
  143. N204TJ112P
  144. </span>
  145. <span class="comment" th:text="${goodsInfo.goodsTnm}">
  146. #가을 느낌 물씬!
  147. </span>
  148. <span class="name" th:text="${goodsInfo.goodsFullNm}">
  149. 유니 삼단블록 플리스 집업 유니 삼단블록 플리스 집업 유니 삼단블록 플리스 집업
  150. </span>
  151. </div>
  152. <div class="price_blk">
  153. <span class="sale_percent" th:if="${goodsInfo.dcRate > 0}" th:text="|${#numbers.formatDecimal(goodsInfo.dcRate,0,0)}%|">
  154. 5%
  155. </span>
  156. <span class="sale_price" >
  157. <em th:text="${#numbers.formatInteger(goodsInfo.currPrice, 0,'COMMA')}">134,100</em>원
  158. </span>
  159. <del class="org_price" th:if="${goodsInfo.listPrice > goodsInfo.currPrice}" >
  160. <em th:text="${#numbers.formatInteger(goodsInfo.listPrice, 0,'COMMA')}">149,000</em>원
  161. </del>
  162. <span class="save_point" th:if="${goodsInfo.pntAmt > 0}">
  163. 스타일포인트 <th:block th:text="${#numbers.formatInteger(goodsInfo.pntAmt, 0,'COMMA')}"></th:block>P 적립예정
  164. </span>
  165. <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}]],[[${goodsInfo.goodsType}]])"><span>쿠폰받기</span></button>
  166. </div>
  167. </div>
  168. <div class="desc_status" th:if="${not #strings.isEmpty(goodsInfo.delvResDt) }">
  169. <p>예약판매 상품 - <th:block th:text="${goodsInfo.delvResDt}"></th:block> 출고예정</p>
  170. </div>
  171. </div>
  172. <div class="benefit_box" th:if="${(cardInfoList != null and !cardInfoList.empty) or
  173. (goodsCouponList != null and !goodsCouponList.empty) or
  174. (tmtbList != null and !tmtbList.empty) or
  175. (freeGoodsList != null and !freeGoodsList.empty)}" >
  176. <dl>
  177. <div class="bnf_shopping" th:if="${(goodsCouponList != null and !goodsCouponList.empty) or
  178. (tmtbList != null and !tmtbList.empty) or
  179. (freeGoodsList != null and !freeGoodsList.empty)}" >
  180. <dt>쇼핑혜택</dt>
  181. <dd>
  182. <span th:if="${goodsCouponList != null and !goodsCouponList.empty}">
  183. <th:block th:each="goodsCoupon, status : ${goodsCouponList}" th:if="${status.first}">
  184. 최대 <em class="c_primary" >
  185. <th:block th:if="${goodsCoupon.dcWay == 'G240_10'}" th:text="|${#numbers.formatInteger(goodsCoupon.dcVal, 0,'COMMA')}원|"></th:block>
  186. <th:block th:unless="${goodsCoupon.dcWay == 'G240_10'}" th:text="|${goodsCoupon.dcVal}%|"></th:block>
  187. </em> 쿠폰 할인
  188. </th:block>
  189. </span>
  190. <span th:if="${tmtbList != null and !tmtbList.empty}">
  191. <th:block th:each="tmtb, status : ${tmtbList}" th:if="${status.first}">
  192. <em class="c_primary"><th:block th:text="${#numbers.formatInteger(tmtb.sectionVal, 0,'COMMA')}"></th:block><th:block th:text="${(tmtb.sectionGb == 'G810_10')? '개':'금액'}"></th:block></em> 이상 구매 시
  193. <em class="c_primary"><th:block th:text="${#numbers.formatInteger(tmtb.dcVal, 0,'COMMA')}"></th:block><th:block th:text="${(tmtb.dcWay == 'G240_10')? '원':'%'}"></th:block></em></em> 할인
  194. </th:block>
  195. </span>
  196. <span th:if="${freeGoodsList != null and !freeGoodsList.empty}">
  197. <th:block th:each="freeGoods, status : ${freeGoodsList}" th:if="${status.first}">
  198. <th:block th:text="${freeGoods.goodsNm}"></th:block> 증정 <th:block th:if="${freeGoods.allYn == 'Y'}" th:text="${'외 택1'}"></th:block></span>
  199. <button type="button" id="btn_bnfShopping_pop" class="btn_popup" th:onclick="cfGoodsShopBenefitInfo([[${goodsInfo.goodsCd}]])"><span>자세히</span></button>
  200. </dd>
  201. </div>
  202. <div class="bnf_card" th:if="${cardInfoList != null and !cardInfoList.empty}">
  203. <dt>카드혜택</dt>
  204. <dd>
  205. <th:block th:each="cardInfo, status : ${cardInfoList}">
  206. <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>
  207. <span th:if="${cardInfo.prmtGb == 'A' and cardInfo.dcGb == '3'}" th:text="${cardInfo.prmtNm}">프로모션명</span>
  208. <span th:if="${cardInfo.prmtGb == 'B'}">신용카드 무이자 혜택</span>
  209. </th:block>
  210. <button type="button" id="btn_bnfCard_pop" class="btn_popup" onclick="cfCardInfo();return false;"><span>자세히</span></button>
  211. </dd>
  212. </div>
  213. </dl>
  214. </div>
  215. <div class="option_box">
  216. <th:block th:if="${goodsInfo.selfGoodsYn =='Y' }"> <!-- 자사상품 -->
  217. <th:block th:if="${goodsInfo.goodsType =='G056_N' }"> <!-- 일반상품 -->
  218. <div class="opt_color" th:if="${goodsOption1List != null and !goodsOption1List.empty}" >
  219. <div class="opt_header">
  220. <span class="title">컬러</span>
  221. <span class="color" th:text="${goodsInfo.colorNm}">그레이</span>
  222. </div>
  223. <ul >
  224. <li th:each="goodsOption1, status : ${goodsOption1List}">
  225. <a href="javascript:void(0);" th:class="${params.colorCd == goodsOption1.optCd1}? 'on':''" th:onclick="cfnGoToGoodsDetail([[${goodsInfo.goodsCd}]], [[${goodsOption1.optCd1}]])"> <!-- 해당 컬러 상품페이지로 이동 -->
  226. <img th:src="${imgGoodsUrl+'/'+goodsOption1.sysImgNm +'?RS=64'}" alt="" th:onerror="'this.src=\''+@{${uxImgUrl}+ '/images/pc/thumb/bg_item_none.png'}+'\';'">
  227. </a>
  228. </li>
  229. </ul>
  230. </div>
  231. <div class="opt_size" th:if="${goodsOption2List != null and !goodsOption2List.empty}" >
  232. <div class="opt_header">
  233. <span class="title">사이즈</span>
  234. <span class="size">
  235. <em id="selectOptCd1"></em>
  236. <em id="selectOptCd1addPrice"></em>
  237. </span>
  238. <button type="button" id="btn_infoSize_pop" class="btn_popup" th:onclick="cfGoodsSizeInfo([[${goodsInfo.goodsCd}]],[[${goodsInfo.colorCd}]] )"><span>사이즈정보</span></button>
  239. </div>
  240. <div class="form_field">
  241. <div th:each="goodsOption2, status : ${goodsOption2List}">
  242. <input type="radio" name="opt" th:id="${goodsOption2.optCd}" th:disabled="${goodsOption2.soldoutYn == 'Y' or goodsOption2.stockQty <= 0}"
  243. th:attr="addPrice=${goodsOption2.addPrice}, optCd1=${goodsOption2.optCd1}, optCd2=${goodsOption2.optCd2}, optCd=${goodsOption2.optCd}"
  244. th:onclick="fnViewStock(this, [[${goodsInfo.goodsCd}]],[[${goodsOption2.optCd}]],[[${goodsOption2.optCd1}]],[[${goodsOption2.optCd2}]],[[${goodsInfo.minOrdQty}]], [[${goodsInfo.maxOrdQty}]] )" />
  245. <label th:for="${goodsOption2.optCd}"><span th:text="${goodsOption2.optCd2}" >100</span></label>
  246. </div>
  247. </div>
  248. </div>
  249. </th:block>
  250. <th:block th:if="${goodsInfo.goodsType =='G056_S' }"> <!-- 세트상품 -->
  251. <div class="opt_set_select" th:if="${goodsComposeList != null and !goodsComposeList.empty}" >
  252. <th:block th:each="goodsCompose, status : ${goodsComposeList}">
  253. <div class="set_option">
  254. <div class="opt_header">
  255. <span class="title" th:text="${goodsCompose.compsGoodsFullNm}">옵션</span>
  256. <button type="button" id="btn_infoSize_pop" class="btn_popup" th:onclick="cfGoodsSizeInfo([[${goodsCompose.compsGoodsCd}]],[[${goodsCompose.colorCd}]] )"><span>사이즈정보</span></button>
  257. </div>
  258. <div class="form_field">
  259. <div class="select_custom item_opt1" th:classappend="${'item_opt1_'+status.count +' '+goodsCompose.compsGoodsCd}"
  260. th:if="${goodsCompose.goodsOption1List != null and !goodsCompose.goodsOption1List.empty}" >
  261. <div class="combo">
  262. <div class="select">옵션1선택</div>
  263. <ul class="list">
  264. <th:block th:each="goodsOption, optionStatus : ${goodsCompose.goodsOption1List}" >
  265. <li th:onclick="fnOption2([[${status.count}]], [[${goodsOption.goodsCd}]],[[${goodsOption.optCd1}]],[[${goodsCompose.qty}]],[[${goodsInfo.minOrdQty}]], [[${goodsInfo.maxOrdQty}]])"
  266. th:attr="aria-disabled=${(goodsCompose.goodsStat != 'G008_90')? 'true':''}, data-soldout=${(goodsCompose.goodsStat != 'G008_90')? 'true':''}"
  267. >
  268. <div th:text="${goodsOption.optCd1Nm}">상품옵션</div>
  269. <div th:if="${goodsOption.addPrice > 0}" th:text="|+${#numbers.formatInteger(goodsOption.addPrice, 0,'COMMA')}원|">0원</div>
  270. <input type="hidden" name="opt" th:attr="addPrice=${goodsOption.addPrice}, optCd1=${goodsOption.optCd1},optCd2=${goodsOption.optCd2}, optCd=${goodsOption.optCd}"/>
  271. </li>
  272. </th:block>
  273. </ul>
  274. </div>
  275. </div>
  276. </div>
  277. <div class="form_field">
  278. <div class="select_custom item_opt2" th:classappend="${'item_opt2_'+status.count +' '+goodsCompose.compsGoodsCd}" disabled>
  279. <div class="combo">
  280. <div class="select">옵션2선택</div>
  281. <ul class="list" th:id="|goodsOpt2${goodsCompose.compsGoodsCd}|" >
  282. <!-- 옵션2 -->
  283. </ul>
  284. </div>
  285. </div>
  286. </div>
  287. </div>
  288. </th:block>
  289. </div>
  290. </th:block>
  291. </th:block>
  292. <th:block th:if="${goodsInfo.selfGoodsYn =='N' }"> <!-- 입점상품 -->
  293. <div class="opt_select" th:if="${goodsOption1List != null and !goodsOption1List.empty}">
  294. <div class="opt_header">
  295. <span class="title">옵션</span>
  296. <button type="button" id="btn_infoSize_pop" class="btn_popup" th:onclick="cfGoodsSizeInfo([[${goodsInfo.goodsCd}]],[[${goodsInfo.colorCd}]] )"><span>사이즈정보</span></button>
  297. </div>
  298. <div class="form_field">
  299. <div class="select_custom item_opt1 item_opt1_1" th:classappend="${goodsInfo.goodsCd}" >
  300. <div class="combo">
  301. <div class="select">옵션1선택</div>
  302. <ul class="list">
  303. <th:block th:each="goodsOption, optionStatus : ${goodsOption1List}" >
  304. <li th:onclick="fnOption2([[${optionStatus.count}]], [[${goodsOption.goodsCd}]],[[${goodsOption.optCd1}]],1,[[${goodsInfo.minOrdQty}]], [[${goodsInfo.maxOrdQty}]])">
  305. <div th:text="${goodsOption.optCd1}">상품옵션</div>
  306. <div th:if="${goodsOption.addPrice > 0}" th:text="|+${#numbers.formatInteger(goodsOption.addPrice, 0,'COMMA')}원|">0원</div>
  307. <input type="hidden" name="opt" th:attr="addPrice=${goodsOption.addPrice}, optCd1=${goodsOption.optCd1},optCd2=${goodsOption.optCd2}, optCd=${goodsOption.optCd}"/>
  308. </li>
  309. </th:block>
  310. </ul>
  311. </div>
  312. </div>
  313. </div>
  314. <div class="form_field">
  315. <div class="select_custom item_opt2 item_opt2_1" th:classappend="${goodsInfo.goodsCd}" disabled>
  316. <div class="combo">
  317. <div class="select">옵션2선택</div>
  318. <ul class="list" th:id="|goodsOpt2${goodsInfo.goodsCd}|" >
  319. <!-- 옵션2 -->
  320. </ul>
  321. </div>
  322. </div>
  323. </div>
  324. </div>
  325. </th:block>
  326. <!-- 해당 상품 품절시 노출 -->
  327. <div class="info_restock" style="display:none;">
  328. <a href="javascript:void(0);" id="btn_pushRestock_pop" class="btn_popup" th:onclick="cfGoodsInstockAlarmInfo([[${goodsInfo.goodsCd}]], [[${goodsInfo.colorCd}]])">재입고 시 알림을 받아보세요</a>
  329. </div>
  330. <!-- //해당 상품 품절시 노출 -->
  331. <div class="opt_count">
  332. <div class="opt_header">
  333. <span class="title">수량</span>
  334. </div>
  335. <div class="number_count">
  336. <span class="minus min_val" onclick="fnAdjustOrderEa(this);" adjust="-"><em class="sr-only">감소</em></span>
  337. <input type="text" name="cea" maxlength="3" style="ime-mode:disabled" th:value="${goodsInfo.minOrdQty}" readonly >
  338. <input type="hidden" name="coption" value="" th:attr="price=${goodsInfo.currPrice}">
  339. <span class="plus" onclick="fnAdjustOrderEa(this);" adjust="+"><em class="sr-only">추가</em></span>
  340. </div>
  341. </div>
  342. </div>
  343. <div class="price_box" style="display:none;">
  344. <p class="number">
  345. 총&nbsp;<span id="goodsTotalQty">0</span>개
  346. </p>
  347. <p class="price">
  348. <span>
  349. <b id="goodsTotalPrice">0</b><em>원</em>
  350. </span>
  351. </p>
  352. </div>
  353. <div class="btn_box">
  354. <div class="btn_group_block ui_row">
  355. <th:block th:if="${goodsInfo.stockQty > 0 and goodsInfo.goodsStat == 'G008_90'}">
  356. <div class="ui_col_6">
  357. <button type="button" class="btn btn_dark btn_block" id="btnGoodsWish" onclick="fnAddCart('C');"><span>쇼핑백</span></button>
  358. </div>
  359. <div class="ui_col_6">
  360. <button type="button" class="btn btn_primary btn_block" id="btnGoodsCart" onclick="fnAddCart('O');"><span>바로구매</span></button>
  361. </div>
  362. </th:block>
  363. <th:block th:unless="${goodsInfo.stockQty > 0 and goodsInfo.goodsStat == 'G008_90'}">
  364. <div class="ui_col_12">
  365. <button type="button" class="btn btn_dark btn_block" disabled=""><span>SOLD OUT</span></button>
  366. </div>
  367. </th:block>
  368. </div>
  369. </div>
  370. <div class="npay_box" style="display:none;">
  371. <a href="">네이버id로 간편구매~</a>
  372. </div>
  373. <div class="exinfo_box">
  374. <ul>
  375. <li th:if="${reviewDisplayYn == 'Y'}">
  376. <div class="ex_review">
  377. <a href="javascript:void(0);" id="btn_pdReview_pop" th:onclick="cfGoodsReview([[${goodsInfo.goodsCd}]])">
  378. <span class="tit">리뷰<em class="number">(<th:block th:text="${(goodsInfo.reviewRegCnt <= 9999) ? #numbers.formatInteger(goodsInfo.reviewRegCnt, 0,'COMMA') : '9,999+'}"></th:block>)</em></span>
  379. <div class="star_score" th:if="${goodsInfo.reviewRegCnt > 0 }">
  380. <span class="star" th:with="starScore=${#numbers.formatDecimal((goodsInfo.score*100/5), 0,0)}">
  381. <em class="progbar" th:style="${'width:'+starScore+'%;' }"></em> <!-- 평점 style로 표기 -->
  382. </span>
  383. <span class="score"><em th:text="${goodsInfo.score}">4.3</em>점</span>
  384. </div>
  385. </a>
  386. </div>
  387. <!-- 베스트 리뷰 등록시 노출 -->
  388. <div class="best_review" th:if="${bestReviewList != null and !bestReviewList.empty}">
  389. <th:block th:each="bestReview, status : ${bestReviewList}" th:if="${status.first}">
  390. <a href="javascript:void(0);" id="btn_pdBestReview_pop" th:onclick="cfGoodsReviewDetail([[${goodsInfo.goodsCd}]],'Y', '',[[${bestReview.reviewSq}]])" >
  391. <div class="pic" th:if="${bestReview.reviewAttachList != null and !bestReview.reviewAttachList.empty}">
  392. <th:block th:each="reviewAttach, attachStatus : ${bestReview.reviewAttachList}" th:if="${attachStatus.first}">
  393. <span class="thumb" th:classAppend="${(reviewAttach.fileGb == 'M') ? 'mov' :''}" th:style="${'background-image:url('+imgUrl+ reviewAttach.sysFileNm+');'}"></span><!-- 동영상의 썸네일일 경우 mov 클래스 추가 -->
  394. </th:block>
  395. </div>
  396. <div class="star_score" th:with="starScore=${#numbers.formatDecimal((bestReview.iscore*100/5), 0,0)}">
  397. <span class="star">
  398. <em class="progbar" th:style="${'width:'+starScore+'%;' }"></em> <!-- 평점 style로 표기 -->
  399. </span>
  400. <em class="ico ico_besttag"></em>
  401. </div>
  402. <div class="txt_best_review">
  403. <p th:text="${bestReview.reviewContent}">옷</p>
  404. </div>
  405. </a>
  406. </th:block>
  407. </div>
  408. <!-- //베스트 리뷰 등록시 노출 -->
  409. </li>
  410. <li>
  411. <div class="ex_qna">
  412. <a href="javascript:void(0);" id="btn_pdQnaList_pop" th:onclick="cfGoodsQng([[${goodsInfo.goodsCd}]])" >
  413. <span class="tit">문의<em class="number">(<th:block th:text="${(goodsInfo.goodsQnaCnt <= 9999) ? #numbers.formatInteger(goodsInfo.goodsQnaCnt, 0,'COMMA') : '9,999+'}"></th:block>)</em></span>
  414. </a>
  415. </div>
  416. </li>
  417. <li>
  418. <div class="ex_shipping">
  419. <a href="javascript:void(0);" id="btn_pdDeliveryPop" th:onclick="cfGoodsDelivery([[${goodsInfo.goodsCd}]])">
  420. <span class="tit">배송/교환/반품</span>
  421. <!-- 해당 배송정보 선택노출 -->
  422. <span class="txt_shippingfee" th:if="${goodsInfo.delvFee > 0}">배송비 <th:block th:text="${#numbers.formatInteger(goodsInfo.delvFee, 0,'COMMA')}" ></th:block>원
  423. <th:block th:if="${goodsInfo.minOrdAmt > 0}">(<th:block th:text="${#numbers.formatInteger(goodsInfo.minOrdAmt, 0,'COMMA')}" ></th:block>원 이상 무료배송)</th:block>
  424. </span>
  425. <span class="txt_shippingfee" th:if="${goodsInfo.delvFee <= 0}">무료배송</span>
  426. <span class="txt_shippingfee" th:if="${goodsInfo.quikDelvYn = 'Y'}">총알배송(오전 10시까지 주문 시)</span>
  427. <!-- //해당 배송정보 선택노출 -->
  428. </a>
  429. </div>
  430. </li>
  431. </ul>
  432. </div>
  433. </div>
  434. </div>
  435. </form>
  436. </div>
  437. </div>
  438. </div>
  439. <!-- 상품 대표설명 -->
  440. <!-- 함께하면 할인되는 다다익선 상품 -->
  441. <div class="content pd_together" id="goodsTmtbArea">
  442. </div>
  443. <!-- // 함께하면 할인되는 다다익선 상품 -->
  444. <!-- 상품상세정보 -->
  445. <div class="content pd_descrp">
  446. <div class="cont_head">
  447. <h3 class="sr-only">상품상세정보</h3>
  448. </div>
  449. <div class="cont_body">
  450. <!-- 상품설명 노출 -->
  451. <div class="descrp_box" th:if="${goodsInfo.tobeFormYn == 'Y'}">
  452. <div class="desc_simple"> <!-- 상품 간략설명-->
  453. <span class="tit_desc" th:if="${goodsInfo.goodsTitle != null and !goodsInfo.goodsTitle.empty}" th:utext="${#strings.unescapeJava(#strings.escapeJava(goodsInfo.goodsTitle))}">사이드 밴딩으로 편안한 만능 슬랙스!</span>
  454. <p class="ptxt01"th:if="${goodsInfo.goodsTitleDesc}" th:utext="${#strings.unescapeJava(#strings.escapeJava(goodsInfo.goodsTitleDesc))}">
  455. 슬림핏에 사이드 밴딩으로 편안함을 더해준 슬랙스입니다.
  456. </p>
  457. </div>
  458. <div class="desc_character" th:if="${goodsInfo.goodsSpecialDesc != null and !goodsInfo.goodsSpecialDesc.empty}"> <!-- 상품특징 -->
  459. <span class="tit_desc">상품특징</span>
  460. <p class="ptxt01">
  461. <th:block th:utext="${#strings.unescapeJava(#strings.escapeJava(goodsInfo.goodsSpecialDesc))}"></th:block>
  462. </p>
  463. </div>
  464. </div>
  465. <!-- //상품설명 노출 -->
  466. <!-- 관리자 에디터입력 내용 공지 html -->
  467. <div class="mdhtml_box">
  468. <th:block th:if="${goodsNoticeList != null and !goodsNoticeList.empty}" >
  469. <th:block th:each="goodsNotice, status : ${goodsNoticeList}" th:utext="${#strings.unescapeJava(#strings.escapeJava(goodsNotice.noticeContent))}"></th:block >
  470. </th:block>
  471. <!-- 관리자 에디터입력 내용 공지 html -->
  472. <th:block th:each="goodsVideo, status : ${goodsVideoList}">
  473. <div class="movblock">
  474. <th:block th:if="${goodsVideo.videoGb == 'Y'}">
  475. <iframe th:src="${'https://www.youtube.com/embed/'+goodsVideo.kmcKey+'?rel=0'}" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
  476. </th:block>
  477. <th:block th:unless="${goodsVideo.videoGb == 'Y'}">
  478. </th:block>
  479. </div>
  480. </th:block>
  481. <!-- 공통상품베너 -->
  482. <th:block th:if="${goodsBannerList != null and !goodsBannerList.empty}">
  483. <th:block th:each="goodsBanner, status : ${goodsBannerList}" >
  484. <th:block th:if="${goodsBanner.strVar1 != null and not #strings.equals(goodsBanner.strVar1, '#')}">
  485. <a th:href="${goodsBanner.strVar1}" target="_blank">
  486. <img th:src="${imgUrl+goodsBanner.imgPath1}" alt="">
  487. </a>
  488. </th:block>
  489. <th:block th:unless="${goodsBanner.strVar1 != null and not #strings.equals(goodsBanner.strVar1, '#')}">
  490. <img th:src="${imgUrl+goodsBanner.imgPath1}" alt="">
  491. </th:block>
  492. </th:block>
  493. </th:block>
  494. <!-- 관리자 에디터입력 내용 노출 상단 html -->
  495. <th:block th:if="${goodsInfo.goodsTopDesc != null and !goodsInfo.goodsTopDesc.empty and goodsInfo.selfGoodsYn =='Y'}" th:utext="${#strings.unescapeJava(#strings.escapeJava(goodsInfo.goodsTopDesc))}"></th:block >
  496. <th:block th:if="${goodsInfo.goodsDesc != null and !goodsInfo.goodsDesc.empty}" th:utext="${#strings.unescapeJava(#strings.escapeJava(goodsInfo.goodsDesc))}"></th:block>
  497. </div>
  498. <th:block th:if="${goodsInfo.tobeFormYn == 'Y'}">
  499. <!-- 착용컷 노출 -->
  500. <div class="view_outfit_box" th:if="${#strings.contains(goodsImgList,'_M1')
  501. or #strings.contains(goodsImgList,'_M2')
  502. or #strings.contains(goodsImgList,'_M3')
  503. or #strings.contains(goodsImgList,'_M4')
  504. or #strings.contains(goodsImgList,'_M5')}">
  505. <span class="tit_view">OUTFIT VIEW</span>
  506. <th:block th:each="goodsImg, status : ${goodsImgList}" th:if="${status.first}">
  507. <span class="model_info" th:text="${goodsImg.modelInfo}">(모델정보 : 185cm / 78kg / XL 착용)</span>
  508. </th:block>
  509. <div class="view">
  510. <th:block th:each="goodsImg, status : ${goodsImgList}" th:if="${#strings.contains(goodsImg.sysImgNm,'_M1')
  511. or #strings.contains(goodsImg.sysImgNm,'_M2')
  512. or #strings.contains(goodsImg.sysImgNm,'_M3')
  513. or #strings.contains(goodsImg.sysImgNm,'_M4')
  514. or #strings.contains(goodsImg.sysImgNm,'_M5')}">
  515. <img th:src="${imgGoodsUrl+'/'+goodsImg.sysImgNm+'?RS=720'}" alt="">
  516. </th:block>
  517. </div>
  518. </div>
  519. <!-- //착용컷 노출 -->
  520. <!-- 상품컷 노출 -->
  521. <div class="view_detail_box" th:if="${#strings.contains(goodsImgList,'_01')
  522. or #strings.contains(goodsImgList,'_02')
  523. or #strings.contains(goodsImgList,'_D1')
  524. or #strings.contains(goodsImgList,'_D2')
  525. or #strings.contains(goodsImgList,'_D3')
  526. or #strings.contains(goodsImgList,'_D4')
  527. or #strings.contains(goodsImgList,'_D5')}">
  528. <span class="tit_view">PRODUCT VIEW</span>
  529. <div class="view">
  530. <th:block th:each="goodsImg, status : ${goodsImgList}" th:if="${#strings.contains(goodsImg.sysImgNm,'_01.')
  531. or #strings.contains(goodsImg.sysImgNm,'_02.')
  532. or #strings.contains(goodsImg.sysImgNm,'_D1.')
  533. or #strings.contains(goodsImg.sysImgNm,'_D2.')
  534. or #strings.contains(goodsImg.sysImgNm,'_D3.')
  535. or #strings.contains(goodsImg.sysImgNm,'_D4.')
  536. or #strings.contains(goodsImg.sysImgNm,'_D5.')}">
  537. <img th:src="${imgGoodsUrl+'/'+goodsImg.sysImgNm+'?RS=720'}" alt="">
  538. </th:block>
  539. </div>
  540. </div>
  541. <!-- //상품컷 노출 -->
  542. <!-- 원단 노출 -->
  543. <div class="view_fabric_box" th:if="${#strings.contains(goodsImgList,'_S1')}">
  544. <span class="tit_view">FABRIC</span>
  545. <div class="view">
  546. <th:block th:each="goodsImg, status : ${goodsImgList}" th:if="${#strings.contains(goodsImg.sysImgNm,'_S1')}">
  547. <img th:src="${imgGoodsUrl+'/'+goodsImg.sysImgNm+'?RS=720'}" alt="">
  548. </th:block>
  549. </div>
  550. </div>
  551. <!-- //원단 노출 -->
  552. <!-- 라벨 노출 -->
  553. <div class="view_label_box" th:if="${#strings.contains(goodsImgList,'_L1')
  554. or #strings.contains(goodsImgList,'_L2')}">
  555. <span class="tit_view">LABEL INFO</span>
  556. <div class="view">
  557. <span>
  558. <th:block th:each="goodsImg, status : ${goodsImgList}" th:if="${#strings.contains(goodsImg.sysImgNm,'_L1')
  559. or #strings.contains(goodsImg.sysImgNm,'_L2')}">
  560. <img th:src="${imgGoodsUrl+'/'+goodsImg.sysImgNm+'?RS=250'}" alt="">
  561. </th:block>
  562. </span>
  563. </div>
  564. </div>
  565. <!-- //라벨 노출 -->
  566. </th:block>
  567. <!-- 관리자 에디터입력 내용 노출 하다단 html -->
  568. <div class="mdhtml_box" th:if="${goodsInfo.goodsDownDesc != null and !goodsInfo.goodsDownDesc.empty and goodsInfo.selfGoodsYn =='Y'}" th:utext="${#strings.unescapeJava(#strings.escapeJava(goodsInfo.goodsDownDesc))}"></div>
  569. <!-- 브랜드 노출 -->
  570. <div class="brand_box">
  571. <p class="name" th:text="${goodsInfo.brandGroupNm}">TBJ 티비제이</p>
  572. <a href="javascript:void(0);" class="btn btn_default" th:onclick="cfnGoToBrandMain([[${goodsInfo.brandGroupNo}]])" ><span>브랜드 홈 바로가기</span></a>
  573. </div>
  574. <!-- //브랜드 노출 -->
  575. <!-- 상품필수정보 노출 -->
  576. <div class="required_box" >
  577. <div class="area_infotbl" th:if="${goodsInfo.goodsType == 'G056_N' and goodsNotiList != null and !goodsNotiList.empty}">
  578. <span class="title">상품고시정보</span>
  579. <div class="tbl type1 mt30">
  580. <table>
  581. <tbody>
  582. <tr th:each="goodsNoti, status : ${goodsNotiList}" >
  583. <th th:text="${goodsNoti.niItemNm}">스타일</th>
  584. <td th:text="${goodsNoti.niContent}">F94U-MD01XA60F0</td>
  585. </tr>
  586. </tbody>
  587. </table>
  588. </div>
  589. </div>
  590. <div class="area_infotbl" th:if="${goodsInfo.goodsType == 'G056_S' and goodsComposeList != null and !goodsComposeList.empty}">
  591. <span class="title">상품고시정보</span>
  592. <th:block th:each="goodsCompose, status : ${goodsComposeList}">
  593. <div class="tbl type1 mt30">
  594. <table>
  595. <tbody>
  596. <tr th:each="goodsNoti, status : ${goodsCompose.goodsNotiList}" >
  597. <th th:text="${goodsNoti.niItemNm}">스타일</th>
  598. <td th:text="${goodsNoti.niContent}">F94U-MD01XA60F0</td>
  599. </tr>
  600. </tbody>
  601. </table>
  602. </div>
  603. </th:block>
  604. </div>
  605. <div class="area_kcl" th:if="${goodsInfo.goodsType == 'G056_N' and goodsSafeNo != null}">
  606. <i class="ico ico_kcl"></i>
  607. <th:block th:if="${not #strings.contains(goodsSafeNo.certNum, '해당')}" >
  608. <p class="tit normal" th:text="${goodsSafeNo.certDiv + ' / ' + goodsSafeNo.certOrganName}">
  609. 어린이제품 안전인증 / 한국건설생활시험연구원(KCL)
  610. </p>
  611. </th:block>
  612. <p class="normal" >
  613. <th:block th:if="${#strings.contains(goodsSafeNo.certNum, '해당')}" >
  614. 해당 없음
  615. </th:block>
  616. <th:block th:unless="${#strings.contains(goodsSafeNo.certNum, '해당')}" >
  617. 인증번호: <th:block th:text="${goodsSafeNo.certNum}"></th:block>
  618. <a th:href="@{http://www.safetykorea.kr/search/searchPop(certNum=${goodsSafeNo.certNum})}" target="_blank" class="linktxt3">상세보기</a>
  619. </th:block>
  620. </p>
  621. <p class="t_info dot_info">
  622. 해당 인증정보는 판매자가 등록한 것으로 등록정보에 대한 일체의 책임은 판매자에게 있습니다.
  623. </p>
  624. </div>
  625. <th:block th:if="${goodsInfo.goodsType == 'G056_S'}">
  626. <th:block th:each="goodsCompose, status : ${goodsComposeList}">
  627. <th:block th:if="${goodsCompose.goodsSafeNo != null}">
  628. <div class="area_kcl" >
  629. <i class="ico ico_kcl"></i>
  630. <th:block th:if="${not #strings.contains(goodsCompose.goodsSafeNo.certNum, '해당')}" >
  631. <p class="tit normal" th:text="${goodsCompose.goodsSafeNo.certDiv + ' / ' + goodsCompose.goodsSafeNo.certOrganName}">
  632. 어린이제품 안전인증 / 한국건설생활시험연구원(KCL)
  633. </p>
  634. </th:block>
  635. <p class="normal" >
  636. <th:block th:if="${#strings.contains(goodsCompose.goodsSafeNo.certNum, '해당')}" >
  637. 해당 없음
  638. </th:block>
  639. <th:block th:unless="${#strings.contains(goodsCompose.goodsSafeNo.certNum, '해당')}" >
  640. 인증번호: <th:block th:text="${goodsCompose.goodsSafeNo.certNum}"></th:block>
  641. <a th:href="@{http://www.safetykorea.kr/search/searchPop(certNum=${goodsCompose.goodsSafeNo.certNum})}" target="_blank" class="linktxt3">상세보기</a>
  642. </th:block>
  643. </p>
  644. <p class="t_info dot_info">
  645. 해당 인증정보는 판매자가 등록한 것으로 등록정보에 대한 일체의 책임은 판매자에게 있습니다.
  646. </p>
  647. </div>
  648. </th:block>
  649. </th:block>
  650. </th:block>
  651. <div class="area_infotbl">
  652. <span class="title">상품기본정보</span>
  653. <th:block th:if="${goodsInfo.goodsType == 'G056_N'} ">
  654. <div class="tbl type1 mt30">
  655. <table>
  656. <tbody>
  657. <tr>
  658. <th>상품코드</th>
  659. <td th:text="${goodsInfo.goodsCd}">14443216</td>
  660. </tr>
  661. <tr>
  662. <th>상품구분</th>
  663. <td th:text="${goodsInfo.goodsGbNm}">병행수입</td>
  664. </tr>
  665. <tr>
  666. <th>브랜드</th>
  667. <td th:text="${goodsInfo.brandGroupNm}">TBJ</td>
  668. </tr>
  669. <tr>
  670. <th>상품명</th>
  671. <td th:text="${goodsInfo.goodsNm}">남성 테이퍼드 핏 겨울 기모면 스판 올 밴딩 팬츠</td>
  672. </tr>
  673. <th:block th:if="${goodsNotiList != null and !goodsNotiList.empty}">
  674. <th:block th:each="goodsNoti, status : ${goodsNotiList}" th:if="${goodsNoti.niItemCd == 'G005_005'}">
  675. <tr>
  676. <th th:text="${goodsNoti.niItemNm}">제조사</th>
  677. <td th:text="${goodsNoti.niContent}"></td>
  678. </tr>
  679. </th:block>
  680. </th:block>
  681. <tr>
  682. <th>제조국</th>
  683. <td th:text="${goodsInfo.originNm}">베트남</td>
  684. </tr>
  685. </tbody>
  686. </table>
  687. </div>
  688. </th:block>
  689. <th:block th:unless="${goodsInfo.goodsType == 'G056_N'} ">
  690. <th:block th:if="${goodsComposeList != null and !goodsComposeList.empty}">
  691. <th:block th:each="goodsCompose, status : ${goodsComposeList}">
  692. <div class="tbl type1 mt30">
  693. <table>
  694. <tbody>
  695. <tr>
  696. <th>상품코드</th>
  697. <td th:text="${goodsCompose.compsGoodsCd}">14443216</td>
  698. </tr>
  699. <tr>
  700. <th>상품구분</th>
  701. <td th:text="${goodsCompose.goodsGbNm}">병행수입</td>
  702. </tr>
  703. <tr>
  704. <th>브랜드</th>
  705. <td th:text="${goodsCompose.brandGroupNm}">TBJ</td>
  706. </tr>
  707. <tr>
  708. <th>상품명</th>
  709. <td th:text="${goodsCompose.compsGoodsNm}">남성 테이퍼드 핏 겨울 기모면 스판 올 밴딩 팬츠</td>
  710. </tr>
  711. <th:block th:if="${goodsCompose.goodsNotiList != null and !goodsCompose.goodsNotiList.empty}">
  712. <th:block th:each="goodsNoti, status : ${goodsCompose.goodsNotiList}" th:if="${goodsNoti.niItemCd == 'G005_005'}">
  713. <tr>
  714. <th th:text="${goodsNoti.niItemNm}">제조사</th>
  715. <td th:text="${goodsNoti.niContent}"></td>
  716. </tr>
  717. </th:block>
  718. </th:block>
  719. <tr>
  720. <th>제조국</th>
  721. <td th:text="${goodsCompose.originNm}">베트남</td>
  722. </tr>
  723. </tbody>
  724. </table>
  725. </div>
  726. </th:block>
  727. </th:block>
  728. </th:block>
  729. <p class="t_info dot_info mt20">
  730. 주문제작 상품의 경우 주문 후 제작되어 판매되는 상품으로 제작 시점부터 반품/교환이 어려울 수 있습니다.
  731. </p>
  732. </div>
  733. </div>
  734. <!-- //상품필수정보 노출 -->
  735. </div>
  736. <div class="btn_more_box covered">
  737. <button type="button" class="btn btn_default btn_md">
  738. <span>상세정보 더보기</span>
  739. </button>
  740. </div>
  741. </div>
  742. <!-- //상품상세정보 -->
  743. <!-- 이 상품과 함께 본 상품 -->
  744. <div class="content wide pd_clickother" id="goodsTogetherbArea">
  745. </div>
  746. <!-- // 이 상품과 함께 본 상품 -->
  747. <!-- STYLE24의 스타일링 추천 -->
  748. <div class="content wide pd_recommend" th:if="${lookbookList != null and !lookbookList.empty}">
  749. <div class="cont_head">
  750. <h3 class="subH1 t_c mb40">STYLE24의 스타일링 추천</h3>
  751. </div>
  752. <div class="cont_body" th:with="ithrCd=aa , contentsLoc=bb ">
  753. <!-- CONT-BODY -->
  754. <div class="area_slider">
  755. <div class="swiper-container">
  756. <div class="swiper-wrapper" >
  757. <div class="swiper-slide" th:each="lookbook, status : ${lookbookList}">
  758. <div class="page">
  759. <div class="pic">
  760. <span class="thumb" th:style="${'background-image:url(' + imgUrl+ lookbook.sysFileNm+');'}"></span>
  761. <!-- 상품피커 -->
  762. <th:block th:if="${lookbook.lookbookGoodsList != null and !lookbook.lookbookGoodsList.empty}"
  763. th:each="lookbookGoods, goodsStatus : ${lookbook.lookbookGoodsList}">
  764. <div class="item_picker" th:style="${'left:'+lookbookGoods.xlim+'%; top:'+lookbookGoods.ylim+'%;'}">
  765. <button type="button" th:onclick="fnLookbookPicker(this,[[${lookbookGoods.goodsCd}]]);"><span class="ico ico_picker"></span></button>
  766. <div class="pick_descr" >
  767. <a href="javascript:void(0);" >
  768. </a>
  769. </div>
  770. </div>
  771. </th:block>
  772. <!-- //상품피커 -->
  773. </div>
  774. <div class="item_wrap">
  775. <div class="item_area" th:if="${lookbook.lookbookGoodsList != null and !lookbook.lookbookGoodsList.empty}">
  776. <h5>
  777. 룩북 속 상품
  778. <span data-font="lato">(<th:block th:text="${#lists.size(lookbook.lookbookGoodsList)}"></th:block>)</span>
  779. </h5>
  780. <div class="li_item">
  781. <ul >
  782. <li th:each="lookbookGoods, status : ${lookbook.lookbookGoodsList}">
  783. <div class="item_prod" th:classappend="${(lookbookGoods.stockQty <= 0 or lookbookGoods.soldoutYn == 'Y')}? 'unable' : ''"
  784. th:attr="goodsCd=${lookbookGoods.goodsCd}, optCdInfo=${lookbookGoods.optCdInfo},
  785. minOrdQty=${lookbookGoods.minOrdQty}, goodsType=${lookbookGoods.goodsType},
  786. ithrCd=${ithrCd}, contentsLoc=${contentsLoc}"> <!-- 판매불가 상품에 unable 추가 -->
  787. <div class="item_state">
  788. <th:block th:each="optCd : ${#strings.arraySplit(lookbookGoods.optCdInfo,',')}">
  789. <input type="hidden" name="lookbookGoodsOptCd" th:value="${optCd}"/>
  790. </th:block>
  791. <th:block th:if="${(lookbookGoods.stockQty <= 0 or lookbookGoods.soldoutYn == 'Y')}">
  792. <a href="javascript:void(0);" class="itemLink" >
  793. </th:block>
  794. <th:block th:unless="${(lookbookGoods.stockQty <= 0 or lookbookGoods.soldoutYn == 'Y')}">
  795. <a href="javascript:void(0);" class="itemLink" th:onclick="cfnGoToGoodsDetail([[${lookbookGoods.goodsCd}]], '',[[${ithrCd}]],[[${contentsLoc}]] )">
  796. </th:block>
  797. <div class="itemPic">
  798. <img alt="" class="vLHTC pd_img" th:src="${imgGoodsUrl+'/'+lookbookGoods.sysImgNm+'?RS=100'}" th:onerror="'this.src=\''+@{${uxImgUrl}+ '/images/pc/thumb/bg_item_none.png'}+'\';'">
  799. </div>
  800. <p class="itemBrand" th:text="${lookbookGoods.brandGroupNm}">CURLYSUE 컬리수</p>
  801. <div class="itemName" th:text="${lookbookGoods.goodsFullNm}">[★2020 겨울신상★] 리버시블 경량점퍼 CPW0XQJM51 [겨울]</div>
  802. <p class="itemPrice">
  803. <span id="itemCurrprice" th:text="${#numbers.formatInteger(lookbookGoods.currPrice, 0,'COMMA')}">1,000,000</span>
  804. <span class="itemPrice_original" th:if="${lookbookGoods.listPrice > lookbookGoods.currPrice}" th:text="${#numbers.formatInteger(lookbookGoods.listPrice, 0,'COMMA')}">1,000,000</span>
  805. <span class="itemPercent" th:if="${lookbookGoods.dcRate > 0}" th:text="|${#numbers.formatDecimal(lookbookGoods.dcRate,0,0)}%|">30%</span>
  806. </p>
  807. </a>
  808. </div>
  809. </div>
  810. </li>
  811. </ul>
  812. </div>
  813. <button type="button" class="btn btn_block btn_md" onclick="fnAddCartLookBookGoods(this);"><span>모두 쇼핑백 담기</span></button>
  814. </div>
  815. </div>
  816. </div>
  817. </div>
  818. </div>
  819. </div>
  820. <!-- Add Pagination -->
  821. <div class="swiper-pagination"></div>
  822. <!-- Add Arrows -->
  823. <div class="swiper-button-next"></div>
  824. <div class="swiper-button-prev"></div>
  825. </div>
  826. <!-- // CONT-BODY -->
  827. </div>
  828. </div>
  829. <!-- // STYLE24의 스타일링 추천 -->
  830. <!-- 브랜드 추천상품 -->
  831. <div class="content wide pd_brand" id="goodsRecommendbArea">
  832. </div>
  833. <!-- // 브랜드 추천상품 -->
  834. <!-- 이 상품과 비슷한 상품 -->
  835. <div class="content wide pd_relate" id="goodsLikebArea">
  836. </div>
  837. <!-- // 이 상품과 비슷한 상품 -->
  838. </div>
  839. <!-- 상품썸네일 크게보기 팝업 -->
  840. <div class="pd_pop full_pop pd_itemthumb_pop" id="pdItemThumbPop">
  841. <div class="full_popup_wrap">
  842. <h5 class="sr-only">상품썸네일 크게보기</h5>
  843. <div class="btn_close">
  844. <a href="" id="btn_close_itemThumbPop">닫기버튼</a>
  845. </div>
  846. <div class="full_pop_container">
  847. <!-- 배송교환반품안내 리스트 내용 -->
  848. </div>
  849. </div>
  850. </div>
  851. <!-- //상품썸네일 크게보기 팝업 -->
  852. </div>
  853. <!-- 바로구매 장바구니 등록 정보 저장을 위한 form -->
  854. <form id="directOrderForm" method="POST" action="/order/noMember"></form>
  855. <script th:src="@{'/biz/goods.js?v=' + ${#calendars.format(#calendars.createNow(), 'yyyyMMddHHmmss')}}" src="/biz/goods.js"></script>
  856. <script th:inline="javascript">
  857. /*<![CDATA[*/
  858. var cateNm = "";
  859. // 다다익선 상품
  860. var fnGoodsTmtbSearch = function(params) {
  861. gagajf.ajaxSubmit("/goods/detail/tmtb/frame", "html", "goodsTmtbArea", params);
  862. }
  863. //세트 사이즈 클릭시
  864. function fnViewStockSet(obj, goodsCd, optCd1, optCd2, minOrdQty, maxOrdQty) {
  865. let target=$('.select_custom.item_opt2');
  866. let targetSize = target.length; //구성품 갯수
  867. let cnt = 0;
  868. let itemSize = 0;
  869. target.each(function(){
  870. if (typeof ($(this).find('.select').find('input[name=opt2]').val()) != 'undefined' && !gagajf.isNull($(this).find('.select').find('input[name=opt2]').val())){
  871. if (goodsCd != $(this).find('.select').find('input[name=opt2]').attr('goodscd')){
  872. itemSize ++;
  873. }
  874. }
  875. });
  876. //내가 선택한 상품
  877. if (typeof ($(obj).find('input[name=opt2]').val()) != 'undefined' && !gagajf.isNull($(obj).find('input[name=opt2]').val())){
  878. itemSize ++;
  879. }
  880. let mGoodsCd = $("#cartForm input[name=goodsCd]").val();
  881. let selfGoodsYn = $("#cartForm input[name=selfGoodsYn]").val();
  882. let goodsOption = [];
  883. if (targetSize == itemSize){
  884. target.each(function() {
  885. if (typeof ($(this).find('.select').find('input[name=opt2]').val()) != 'undefined' && !gagajf.isNull($(this).find('.select').find('input[name=opt2]').val())){
  886. if (goodsCd != $(this).find('.select').find('input[name=opt2]').val()){
  887. goodsOption.push($(this).find('input[name=opt2]').val());
  888. }
  889. }
  890. });
  891. //내가 선택하 옵션
  892. goodsOption.push($(obj).find('input[name=opt2]').val()); //goodsCd|optCd|qty
  893. var maxCnt = maxOrdQty;
  894. var data = {arrGoodsOption : goodsOption
  895. ,minOrdQty : minOrdQty
  896. ,maxOrdQty : maxOrdQty
  897. ,goodsCd : mGoodsCd
  898. ,selfGoodsYn : selfGoodsYn
  899. };
  900. var jsonData = JSON.stringify(data);
  901. gagajf.ajaxJsonSubmit('/goods/detail/ajaxGoodsSetStockQty', jsonData, function(result) {
  902. var itemCnt = eval(result); //해당 아이템에 선택되어진 사이즈의 수량
  903. //console.log("itemCnt : "+itemCnt);
  904. if (maxCnt > itemCnt) {
  905. maxCnt = itemCnt;
  906. }
  907. if (minOrdQty > itemCnt) {
  908. //alert("무슨작업을 해야할가요?");
  909. return false; //무슨작업을 해야하나?
  910. }
  911. $("#cartForm input[name=ordQty]").val(minOrdQty);
  912. $("#cartForm input[name=maxOrdQty]").val(maxCnt);
  913. $("#cartForm input[name=minOrdQty]").val(minOrdQty);
  914. $("#cartForm input[name=cea]").val(minOrdQty);
  915. $("#cartForm input[name=cea]").attr("readonly",false);
  916. $("#cartForm input[name=stock]").val(itemCnt);
  917. fnSetTotalPrice();
  918. });
  919. }
  920. }
  921. // 수량 변경 클릭
  922. var fnAdjustOrderEa = function(obj) {
  923. if("G056_N" == $("#cartForm input[name=goodsType]").val() && "Y" == $("#cartForm input[name=selfGoodsYn]").val()){
  924. if(gagajf.isNull($("#cartForm input[name=optCd2]").val())){
  925. mcxDialog.alert("사이즈를 선택해 주세요.");
  926. return false;
  927. }
  928. }else{
  929. let target=$('.select_custom.item_opt2');
  930. let targetSize = target.length; //구성품 갯수
  931. let itemSize = 0;
  932. target.each(function(){
  933. if (typeof ($(this).find('.select').find('input[name=opt2]').val()) != 'undefined' && !gagajf.isNull($(this).find('.select').find('input[name=opt2]').val())){
  934. itemSize ++;
  935. }
  936. });
  937. if (targetSize != itemSize){
  938. mcxDialog.alert("옵션을 선택해 주세요.");
  939. return false;
  940. }
  941. }
  942. let $obj = $(obj);
  943. let $target = $obj.parent().children('input[name="cea"]');
  944. let minOrdQty = parseInt($("#cartForm input[name=minOrdQty]").val());
  945. let ea =parseInt($target.val());
  946. if ($obj.attr('adjust') == '-') --ea;
  947. else ++ea;
  948. //var maxOrdQty = $("#cartForm input[name=maxOrdQty]").val();
  949. //if (maxOrdQty && ea > maxOrdQty) ea = maxOrdQty;
  950. if (ea.toString().length > parseInt($target.attr('maxlength'))) --ea;
  951. if (ea < 1) ea = minOrdQty;
  952. $target.val(ea);
  953. fnChangeOrderEa();
  954. }
  955. //옵션 갯수 변경
  956. var fnChangeOrderEa = function() {
  957. if("G056_N" == $("#cartForm input[name=goodsType]").val() && "Y" == $("#cartForm input[name=selfGoodsYn]").val()){
  958. if(gagajf.isNull($("#cartForm input[name=optCd2]").val())){
  959. mcxDialog.alert("사이즈를 선택해 주세요.");
  960. return false;
  961. }
  962. }else{
  963. let target=$('.select_custom.item_opt2');
  964. let targetSize = target.length; //구성품 갯수
  965. let itemSize = 0;
  966. target.each(function(){
  967. if (typeof ($(this).find('.select').find('input[name=opt2]').val()) != 'undefined' && !gagajf.isNull($(this).find('.select').find('input[name=opt2]').val())){
  968. itemSize ++;
  969. }
  970. });
  971. if (targetSize != itemSize){
  972. mcxDialog.alert("옵션을 선택해 주세요.");
  973. return false;
  974. }
  975. }
  976. //let f = document.cartForm;
  977. let ea = parseInt($("#cartForm input[name=cea]").val());
  978. let buymin = parseInt($("#cartForm input[name=minOrdQty]").val());
  979. let buymax = parseInt($("#cartForm input[name=maxOrdQty]").val());
  980. let alertMsg = '';
  981. if (ea < buymin) {
  982. alertMsg = buymin+"개 부터 구매 가능합니다.";
  983. ea = buymin;
  984. }
  985. if (ea > buymax) {
  986. alertMsg = buymax+"개 까지만 구매 가능합니다.";
  987. ea = buymax;
  988. }
  989. $("#cartForm input[name=cea]").val(ea);
  990. $("#cartForm input[name=ordQty]").val(ea);
  991. if (alertMsg != ''){
  992. mcxDialog.alert(alertMsg);
  993. //return;
  994. }
  995. if (ea <= 1){
  996. $('.number_count').find('.minus').addClass('min_val');
  997. }else{
  998. $('.number_count').find('.minus').removeClass('min_val');
  999. }
  1000. fnSetTotalPrice();
  1001. }
  1002. //합계 계산
  1003. var fnSetTotalPrice = function() {
  1004. //let f = document.cartForm;
  1005. $('.price_box').show();
  1006. let totalEa = 0;
  1007. let totalPrice = 0;
  1008. $('input[name="cea"]').each(function() {
  1009. let ea = parseInt($(this).val());
  1010. let addPrice = 0;
  1011. if("G056_N" == $("#cartForm input[name=goodsType]").val() && "Y" == $("#cartForm input[name=selfGoodsYn]").val()){
  1012. let target=$('.opt_size').find('input[name=opt]');
  1013. target.each(function() {
  1014. if ($(this).is(":checked")){
  1015. addPrice += Number($(this).attr('addPrice'));
  1016. }
  1017. });
  1018. }else{
  1019. let target=$('.select_custom.item_opt2');
  1020. target.each(function() {
  1021. if (typeof ($(this).find('input[name=opt2]').val()) != 'undefined' && !gagajf.isNull($(this).find('input[name=opt2]').val())){
  1022. addPrice += Number($(this).find('input[name=opt2]').attr('addPrice'));
  1023. }
  1024. });
  1025. }
  1026. let goodsPrice = parseInt($(this).parent().find('input[name="coption"]').attr('price'));
  1027. totalEa += ea;
  1028. if (goodsPrice > 0) {
  1029. totalPrice += ((goodsPrice+addPrice) * ea);
  1030. }
  1031. });
  1032. $('#goodsTotalQty').html(totalEa.addComma());
  1033. $('#goodsTotalPrice').html(totalPrice.addComma());
  1034. }
  1035. //장바구니담기
  1036. var fnAddCart = function(btnType){
  1037. let goodsType = $("#cartForm input[name=goodsType]").val();
  1038. if (goodsType == 'G056_N'){
  1039. if (gagajf.isNull($("#cartForm input[name=optCd2]").val())) {
  1040. if("Y" == $("#cartForm input[name=selfGoodsYn]").val()){
  1041. mcxDialog.alert("사이즈를 선택해 주세요.");
  1042. return false;
  1043. }else{
  1044. mcxDialog.alert("옵션을 선택해 주세요.");
  1045. return false;
  1046. }
  1047. }
  1048. let compsList = [];
  1049. let obj = new Object();
  1050. obj.goodsCd = $("#cartForm input[name=goodsCd]").val();
  1051. obj.optCd = $("#cartForm input[name=optCd]").val();
  1052. obj.goodsQty = $("#cartForm input[name=ordQty]").val();
  1053. obj.goodsType = $("#cartForm input[name=goodsType]").val();
  1054. obj.cartGb = btnType;
  1055. obj.afLinkCd =$("#cartForm input[name=afLinkCd]").val();
  1056. obj.ithrCd =$("#cartForm input[name=ithrCd]").val();
  1057. obj.contentsLoc =$("#cartForm input[name=contentsLoc]").val();
  1058. obj.planDtlSq = $("#cartForm input[name=planDtlSq]").val();
  1059. compsList.push(obj);
  1060. // 장바구니담기
  1061. cfnAddCart(compsList);
  1062. }else if (goodsType == 'G056_S'){ //수정요
  1063. let target=$('.select_custom.item_opt2');
  1064. let targetSize = target.length; //구성품 갯수
  1065. let itemSize = 0;
  1066. target.each(function(){
  1067. if (typeof ($(this).find('.select').find('input[name=opt2]').val()) != 'undefined' && !gagajf.isNull($(this).find('.select').find('input[name=opt2]').val())){
  1068. itemSize ++;
  1069. }
  1070. });
  1071. if (targetSize != itemSize){
  1072. mcxDialog.alert("옵션을 선택해 주세요.");
  1073. return false;
  1074. }
  1075. let cartGoodsList = [];
  1076. let compsList = [];
  1077. let goodsList = {
  1078. cartCompsList : new Array()
  1079. }
  1080. target.each(function() {
  1081. var arrInfo = $(this).find('input[name=opt2]').val().split('|'); // 상품코드|사이즈|구성수량
  1082. var obj = new Object();
  1083. obj.cartGb = btnType;
  1084. obj.goodsType = $("#cartForm input[name=goodsType]").val();
  1085. obj.goodsCd = $("#cartForm input[name=goodsCd]").val();
  1086. obj.itemCd = arrInfo[0];
  1087. obj.optCd = arrInfo[1];
  1088. obj.goodsQty = $("#cartForm input[name=ordQty]").val();
  1089. obj.afLinkCd =$("#cartForm input[name=afLinkCd]").val();
  1090. obj.ithrCd =$("#cartForm input[name=ithrCd]").val();
  1091. obj.contentsLoc =$("#cartForm input[name=contentsLoc]").val();
  1092. obj.planDtlSq = $("#cartForm input[name=planDtlSq]").val();
  1093. compsList.push(obj);
  1094. });
  1095. goodsList.cartCompsList = compsList;
  1096. cartGoodsList.push(goodsList);
  1097. // 장바구니담기
  1098. cfnAddCart(cartGoodsList);
  1099. }
  1100. }
  1101. // 룩북속 상품 쇼핑백 담기
  1102. var fnAddCartLookBookGoods = function(obj){
  1103. let $obj = $(obj);
  1104. let $target = $obj.parent().find('.li_item').find('.item_prod');
  1105. let goodsSize = $target.length;
  1106. let btnType = "C";
  1107. let params = [];
  1108. let goodsIdx = 0;
  1109. $target.each(function(){
  1110. goodsIdx ++;
  1111. if ($(this).hasClass('unable')) {
  1112. }else{
  1113. // 옵션확인
  1114. let goodsCnt = $(this).find('input[name=lookbookGoodsOptCd]').length;
  1115. if (goodsCnt == 1){
  1116. let arrOpt = $(this).find('input[name=lookbookGoodsOptCd]').val();
  1117. let arrOptInfo = arrOpt.split(':');
  1118. let obj = new Object();
  1119. obj.goodsCd = $(this).attr("goodsCd");
  1120. //obj.optCd = $(this).attr("optCd");
  1121. obj.optCd = arrOptInfo[1];
  1122. obj.goodsQty = $(this).attr("minOrdQty");
  1123. obj.goodsType = $(this).attr("goodsType");
  1124. obj.cartGb = btnType;
  1125. obj.afLinkCd = '';
  1126. obj.ithrCd = $(this).attr("ithrCd");
  1127. obj.contentsLoc = $(this).attr("contentsLoc");
  1128. obj.planDtlSq = '';
  1129. obj.multiGoodsGb = 'O' // 단품, 세트 혼합쇼핑백처리일경우, 마지막이 아닌경우는 'O'아니고 NULL 아닌값
  1130. if (goodsIdx == goodsSize){
  1131. obj.multiGoodsGb = 'E' // 단품, 세트 혼합쇼핑백처리일경우, 마지막이 아닌경우는 'O'아니고 NULL 아닌값
  1132. }
  1133. params.push(obj);
  1134. // 장바구니담기
  1135. cfnAddCart(params);
  1136. }else{
  1137. let $goods = $(this);
  1138. let cartGoodsList = [];
  1139. let compsList = [];
  1140. let goodsList = {
  1141. cartCompsList : new Array()
  1142. }
  1143. let arrInfo = $(this).find('input[name=lookbookGoodsOptCd]').val().split(','); // 상품코드단위
  1144. $.each(arrInfo, function(idx, item) {
  1145. let arrOptInfo = item.split(':');
  1146. let obj = new Object();
  1147. obj.cartGb = btnType;
  1148. obj.goodsType = $goods.attr("goodsType");
  1149. obj.goodsCd = $goods.attr("goodsCd");
  1150. obj.itemCd =arrOptInfo[0];
  1151. obj.optCd = arrOptInfo[1];
  1152. obj.goodsQty = $goods.attr("minOrdQty");
  1153. obj.afLinkCd = '';
  1154. obj.ithrCd = $goods.attr("ithrCd");
  1155. obj.contentsLoc = $goods.attr("contentsLoc");
  1156. obj.planDtlSq = ''
  1157. obj.multiGoodsGb = 'O' // 단품, 세트 혼합쇼핑백처리일경우, 마지막이 아닌경우는 'O'아니고 NULL 아닌값
  1158. if (goodsIdx == goodsSize){
  1159. obj.multiGoodsGb = 'E' // 단품, 세트 혼합쇼핑백처리일경우, 마지막이 아닌경우는 'O'아니고 NULL 아닌값
  1160. }
  1161. compsList.push(obj);
  1162. });
  1163. goodsList.cartCompsList = compsList;
  1164. cartGoodsList.push(goodsList);
  1165. // 장바구니담기
  1166. cfnAddCart(cartGoodsList);
  1167. }
  1168. }
  1169. });
  1170. // 장바구니담기
  1171. /* if (params.length > 0){
  1172. cfnAddCart(params);
  1173. } */
  1174. }
  1175. // 품절처리
  1176. var fnOptionSoldout = function(){
  1177. let $target=$("#cartForm").find('.form_field');
  1178. let soldout = false;
  1179. for(var i=0;i<$target.find('input[name="opt"]').length;i++){
  1180. if($target.find('input[name="opt"]').eq(i).attr('disabled')) {
  1181. soldout = true;
  1182. }
  1183. }
  1184. let goodsType = [[${goodsInfo.goodsType}]];
  1185. if (soldout && goodsType == 'G056_N'&& $("#cartForm input[name=selfGoodsYn]").val() == 'Y') {
  1186. $(".info_restock").show();
  1187. }
  1188. }
  1189. // 옵션2 조회
  1190. var fnOption2 = function(ridx, goodsCd, optCd1, qty, minOrdQty, maxOrdQty ){
  1191. let selfGoodsYn = $("#cartForm input[name=selfGoodsYn]").val();
  1192. let data = {goodsCd : goodsCd
  1193. ,optCd1 : optCd1
  1194. ,adminYn : $("#cartForm input[name=adminYn]").val()
  1195. };
  1196. let jsonData = JSON.stringify(data);
  1197. gagajf.ajaxJsonSubmit('/goods/detail/option2/list', jsonData, function(result) {
  1198. if (result.dataList != null && result.dataList.length > 0) {
  1199. let tag = "";
  1200. let $obj = null;
  1201. if (selfGoodsYn == "Y"){
  1202. if (ridx == 1){
  1203. $obj = $('.opt_set_select .select_custom.item_opt2.item_opt2_1');
  1204. }else if (ridx == 2){
  1205. $obj = $('.opt_set_select .select_custom.item_opt2.item_opt2_2');
  1206. }else if (ridx == 3){
  1207. $obj = $('.opt_set_select .select_custom.item_opt2.item_opt2_3');
  1208. }else if (ridx == 4){
  1209. $obj = $('.opt_set_select .select_custom.item_opt2.item_opt2_4');
  1210. }else{
  1211. $obj = $('.opt_set_select .select_custom.item_opt2.item_opt2_5');
  1212. }
  1213. }else{
  1214. $obj = $('.form_field .select_custom.item_opt2.item_opt2_1');
  1215. }
  1216. $.each(result.dataList, function(idx, item) {
  1217. if (idx == 0){
  1218. //$obj = $('#goodsOpt2'+item.goodsCd);
  1219. //$obj = $('.form_field .select_custom.item_opt2.item_opt2_1');
  1220. $obj.html('');
  1221. $('.form_field .select_custom.item_opt2.' +item.goodsCd ).attr('disabled', false)
  1222. //------
  1223. tag += '<div class="combo">\n';
  1224. tag += '<div class="select">옵션2선택</div>\n';
  1225. tag += '<ul class="list">\n';
  1226. //------
  1227. //tag += '<li class="selected" id="goodsOpt2'+item.goodsCd+'">선택</li>\n';
  1228. }
  1229. let soldoutYn = "";
  1230. let saleQty = (Number(qty) * Number(minOrdQty));
  1231. if ("Y" == item.soldoutYn || Number(item.stockQty) <= Number(saleQty))soldoutYn = "true";
  1232. if (selfGoodsYn == "Y"){
  1233. tag += '<li aria-disabled="'+soldoutYn+'" data-soldout="'+soldoutYn +'" onclick="fnViewStockSet(this, \''+ item.goodsCd+'\' , \''+ item.optCd1+'\' , \''+ item.optCd2+'\', \''+ minOrdQty+'\', \''+ maxOrdQty+'\')">\n';
  1234. }else{
  1235. tag += '<li aria-disabled="'+soldoutYn+'" data-soldout="'+soldoutYn +'" onclick="fnViewStock(this, \''+ item.goodsCd+'\' , \''+ item.optCd+'\' , \''+ item.optCd1+'\' , \''+ item.optCd2+'\', \''+ minOrdQty+'\', \''+ maxOrdQty+'\')">\n';
  1236. }
  1237. tag += '<div class="opt_name">'+ item.optCd2+'</div>\n';
  1238. if (item.addPrice > 0){
  1239. tag += '<div class="opt_price">+'+ item.addPrice.addComma() +'원</div>\n';
  1240. }
  1241. tag += '<input type="hidden" name="opt2" value="'+ item.goodsCd+'|'+item.optCd +'|'+qty +'" goodsCd="'+item.goodsCd+'" id="'+item.optCd+'" addPrice="'+item.addPrice+'" optCd="'+item.optCd+'" optCd1="'+item.optCd1+'" optCd2="'+item.optCd2+'" />\n';
  1242. tag += '</li>\n';
  1243. });
  1244. if (!gagajf.isNull(tag)){
  1245. //------
  1246. tag += '</ul>\n';
  1247. tag += '</div>\n';
  1248. //------
  1249. }
  1250. $obj.append(tag);
  1251. if (selfGoodsYn == "Y"){
  1252. if (ridx == 1){
  1253. var opt_selecter02_1 = new sCombo('.opt_set_select .select_custom.item_opt2.item_opt2_1');
  1254. $('.opt_set_select .select_custom.item_opt2.item_opt2_1').find('.combo .select').trigger('click');
  1255. }else if (ridx == 2){
  1256. var opt_selecter02_2 = new sCombo('.opt_set_select .select_custom.item_opt2.item_opt2_2');
  1257. $('.opt_set_select .select_custom.item_opt2.item_opt2_2').find('.combo .select').trigger('click');
  1258. }else if (ridx == 3){
  1259. var opt_selecter02_3 = new sCombo('.opt_set_select .select_custom.item_opt2.item_opt2_3');
  1260. $('.opt_set_select .select_custom.item_opt2.item_opt2_3').find('.combo .select').trigger('click');
  1261. }else if (ridx == 4){
  1262. var opt_selecter02_4 = new sCombo('.opt_set_select .select_custom.item_opt2.item_opt2_4');
  1263. $('.opt_set_select .select_custom.item_opt2.item_opt2_4').find('.combo .select').trigger('click');
  1264. }else{
  1265. var opt_selecter02_5 = new sCombo('.opt_set_select .select_custom.item_opt2.item_opt2_5');
  1266. $('.opt_set_select .select_custom.item_opt2.item_opt2_5').find('.combo .select').trigger('click');
  1267. }
  1268. }else{
  1269. var opt_selecter02 = new sCombo('.opt_select .select_custom.item_opt2.item_opt2_1');
  1270. $('.opt_select .select_custom.item_opt2.item_opt2_1').find('.combo .select').trigger('click');
  1271. }
  1272. }
  1273. });
  1274. }
  1275. //룩북 피커 선택시 레이어 노출
  1276. var fnLookbookPicker = function(obj,goodsCd){
  1277. let $obj = $(obj);
  1278. var str = '<div class="modal fade pd_pop pd_lookbook_pop" id="layer_lookbook_goods" tabindex="-1" role="dialog" aria-labelledby="pd_lookbook_label" aria-hidden="true">';
  1279. let $target = $obj.parent().parent().parent().find('.item_prod');
  1280. let goodsImg = '';
  1281. let brandName = '';
  1282. let goodsName = '';
  1283. let currPrice = '';
  1284. let listPrice = '';
  1285. let dcRate = '';
  1286. let soldout = '';
  1287. $target.each(function(){
  1288. if ($(this).attr('goodsCd') == goodsCd) {
  1289. if ($(this).hasClass('unable')) soldout = 'sold_out';
  1290. goodsImg = $(this).find('.itemPic').children('.pd_img').attr('src');
  1291. brandName = $(this).find('.itemBrand').text();
  1292. goodsName = $(this).find('.itemName').text();
  1293. currPrice = $(this).find('#itemCurrprice').text();
  1294. listPrice = $(this).find('.itemPrice_original').text();
  1295. dcRate = $(this).find('.itemPercent').text();
  1296. }
  1297. });
  1298. if (gagajf.isNull(goodsName)){
  1299. return false;
  1300. }
  1301. let tag = '';
  1302. tag += ' <div class="modal-dialog" role="document">\n';
  1303. tag += ' <div class="modal-content">\n';
  1304. tag += ' <div class="modal-header">\n';
  1305. tag += ' <h5 class="modal-title sr-only" id="layer_lookbook_goods">상품정보</h5>\n';
  1306. tag += ' </div>\n';
  1307. tag += ' <div class="modal-body">\n';
  1308. tag += ' <div class="itemsGrp">\n';
  1309. tag += ' <div class="item_prod '+ soldout+'"> <!-- 품절일때 sold_out 클래스 추가 요청 -->\n';
  1310. tag += ' <div class="item_state">\n';
  1311. tag += ' <div class="itemLink">\n';
  1312. tag += ' <div class="itemPic">\n';
  1313. tag += ' <img alt="BLACK-a" class=" vLHTC pd_img" src="'+goodsImg +'?RS=260" onerror="this.src=\'/images/pc/thumb/bg_item_none.png\'">\n';
  1314. tag += ' </div>\n';
  1315. tag += ' <p class="itemBrand">'+brandName+'</p>\n';
  1316. tag += ' <div class="itemName">'+goodsName+'</div>\n';
  1317. if (listPrice != currPrice){
  1318. tag += ' <span class="itemPrice_original">'+listPrice+'</span>\n';
  1319. }
  1320. tag += ' <p class="itemPrice">'+currPrice+'\n';
  1321. if (!gagajf.isNull(dcRate)){
  1322. tag += ' <span class="itemPercent">'+dcRate+'</span>\n';
  1323. }
  1324. tag += ' </p>\n';
  1325. if (gagajf.isNull(soldout)){
  1326. tag += ' <button type="button" class="btn btn_default" onclick="cfnGoToGoodsDetail(\''+goodsCd+'\',\'\',\'\')"><span>자세히 보기</span></button>\n';
  1327. }
  1328. tag += ' </div>\n';
  1329. tag += ' </div>\n';
  1330. tag += ' </div>\n';
  1331. tag += ' </div>\n';
  1332. tag += ' </div>\n';
  1333. tag += ' </div>\n';
  1334. tag += ' </div>\n';
  1335. tag += ' <a href="javascript:void(0);" rel="modal:close" onclick="cfCloseLayer(\'layer_lookbook_goods\')" class="close-modal">Close</a>\n';
  1336. if ($('#layer_lookbook_goods').length == 0) {
  1337. $('body').append(str+tag+'</div>');
  1338. $('#layer_lookbook_goods').modal("show");
  1339. }
  1340. }
  1341. $(document).ready( function() {
  1342. $('.timer_box').css('display', 'none');
  1343. //공유 버튼 토글
  1344. $("button[data-name=openShare]").on("click", function(){
  1345. $(this).toggleClass("on").next(".shareWrap").toggleClass("on");
  1346. return false;
  1347. });
  1348. //영역밖 클릭으로 공유토글 닫기
  1349. $("body").on('click', function(e) {
  1350. if(!$(".shareWrap.on").parent().has(e.target).length) {
  1351. $("button[data-name=openShare]").removeClass("on");
  1352. $(".shareWrap").removeClass("on");
  1353. };
  1354. });
  1355. var params = new Object();
  1356. params.goodsCd = [[${params.goodsCd}]];
  1357. params.viewDt = [[${params.viewDt}]];
  1358. params.preview = [[${params.preview}]];
  1359. params.adminYn = [[${params.adminYn}]];
  1360. params.goodsType = [[${params.goodsType}]];
  1361. params.supplyCompCd = [[${params.supplyCompCd}]];
  1362. params.brandGroupNm = [[${goodsInfo.brandGroupNm}]];
  1363. // 다다익선 상품(ajax html)
  1364. params.goodsOtherGb = "tmtb";
  1365. params.ithrCd = "tmtb";
  1366. params.contentsLoc = "tmtb";
  1367. fnGoodsTmtbSearch(params);
  1368. // 함께본 상품(ajax html)
  1369. params.goodsOtherGb = "together";
  1370. params.ithrCd = "tmtb";
  1371. params.contentsLoc = "tmtb";
  1372. fnGoodsTogetherSearch(params);
  1373. // 추천 상품(ajax html)
  1374. params.goodsOtherGb = "recommend";
  1375. params.ithrCd = "tmtb";
  1376. params.contentsLoc = "tmtb";
  1377. fnGoodsRecommendSearch(params);
  1378. // 비슷한 상품(ajax html)
  1379. params.goodsOtherGb = "like";
  1380. params.ithrCd = "tmtb";
  1381. params.contentsLoc = "tmtb";
  1382. fnGoodsLikeSearch(params);
  1383. // 상품 대표설명 > 좌측 상품썸네일 navi, 우측 상품정보 고정
  1384. $(window).scroll(function(){
  1385. var scrollTop= $(window).scrollTop();
  1386. var firstFixed = $('#header').outerHeight();
  1387. var thumbListWrap_h = $('.pd_detail .thumb_list_wrap').outerHeight();
  1388. var descWrap_h = $('.pd_detail .desc_wrap').outerHeight();
  1389. var secondFixed_left = firstFixed + $('.pd_detail').outerHeight() - $('.pd_detail .thumb_nav_wrap').outerHeight();
  1390. var secondFixed_right = firstFixed + $('.pd_detail .desc_wrap').outerHeight() - $(window).outerHeight();
  1391. var secondFixed_right2 = firstFixed + $('.pd_detail').outerHeight() - $(window).outerHeight();
  1392. /* 좌측 상품썸네일 navi 고정 */
  1393. if (scrollTop > firstFixed){
  1394. $('.pd_detail .area_pic .thumb_nav_wrap').removeClass('fixbottom').addClass('fixtop');
  1395. }
  1396. else if (scrollTop < firstFixed){
  1397. $('.pd_detail .area_pic .thumb_nav_wrap').removeClass('fixtop');
  1398. }
  1399. if (scrollTop > secondFixed_left){
  1400. $('.pd_detail .area_pic .thumb_nav_wrap').removeClass('fixtop').addClass('fixbottom');
  1401. }
  1402. /* 우측 상품정보 고정 */
  1403. if (thumbListWrap_h > descWrap_h && scrollTop > secondFixed_right) {
  1404. $('.pd_detail .area_desc .desc_wrap').removeClass('absbottom').addClass('fixbottom');
  1405. }
  1406. else if (thumbListWrap_h > descWrap_h && scrollTop < secondFixed_right) {
  1407. $('.pd_detail .area_desc .desc_wrap').removeClass('fixbottom');
  1408. }
  1409. if (thumbListWrap_h > descWrap_h && scrollTop > secondFixed_right2) {
  1410. $('.pd_detail .area_desc .desc_wrap').removeClass('fixbottom').addClass('absbottom');
  1411. }
  1412. });
  1413. //슬라이드 - 상품 대표설명 > 좌측 상품썸네일 navi
  1414. var thumbNavSwiper = new Swiper('.area_pic .thumb_nav_wrap .swiper-container', {
  1415. direction: 'vertical',
  1416. slidesPerView: 6,
  1417. slidesPerGroup : 6,
  1418. spaceBetween: 10,
  1419. navigation: {
  1420. nextEl: '.area_pic .thumb_nav_wrap .swiper-button-next',
  1421. prevEl: '.area_pic .thumb_nav_wrap .swiper-button-prev',
  1422. },
  1423. });
  1424. //상품 대표설명 > 상품썸네일 1개일때
  1425. var thumblist = $('.area_pic .thumb_list_wrap li');
  1426. var thumblistLength = thumblist.length;
  1427. if (thumblistLength == 1) {
  1428. thumblist.parents('.area_pic').addClass('onlyitem');
  1429. } else {
  1430. thumblist.parents('.area_pic').removeClass('onlyitem');
  1431. }
  1432. //상품 대표설명 > 좌측 상품썸네일 6개 이하일때
  1433. var thumbnavSlide = $('.area_pic .thumb_nav_wrap .swiper-container .swiper-slide');
  1434. var thumbnavLength = thumbnavSlide.length;
  1435. if (thumbnavLength < 7) {
  1436. thumbnavSlide.parents('.thumbnav').addClass('disabled');
  1437. } else {
  1438. thumbnavSlide.parents('.thumbnav').removeClass('disabled');
  1439. }
  1440. //상품 대표설명 > 좌측 상품썸네일 navi 선택시 해당 대표 썸네일 위치로 이동
  1441. $(document).on('click','.pd_detail .area_pic .thumbnav .swiper-slide a',function(e){
  1442. e.preventDefault();
  1443. var hdHeight = $('#header').outerHeight();
  1444. var targetThumb = $($(this).attr('href'));
  1445. var topThumb = targetThumb.offset().top - hdHeight;
  1446. $(this).parents('.thumbnav').find('.swiper-slide').removeClass('on');
  1447. $(this).parent('.swiper-slide').addClass('on');
  1448. targetThumb.siblings('li').removeClass('on');
  1449. targetThumb.addClass('on');
  1450. $('html,body').animate({scrollTop : topThumb}, 500);
  1451. return false;
  1452. });
  1453. var opt_selecter01 = new sCombo('.opt_select .select_custom.item_opt1.item_opt1_1');
  1454. var opt_selecter01_1 = new sCombo('.opt_set_select .select_custom.item_opt1.item_opt1_1');
  1455. var opt_selecter01_2 = new sCombo('.opt_set_select .select_custom.item_opt1.item_opt1_2');
  1456. var opt_selecter01_3 = new sCombo('.opt_set_select .select_custom.item_opt1.item_opt1_3');
  1457. var opt_selecter01_4 = new sCombo('.opt_set_select .select_custom.item_opt1.item_opt1_4');
  1458. var opt_selecter01_5 = new sCombo('.opt_set_select .select_custom.item_opt1.item_opt1_5');
  1459. if (!gagajf.isNull([[${goodsInfo.socialSq}]])){
  1460. $('.timer_box').css('display', 'block');
  1461. /* 행사 남은시간 */
  1462. function promotionTimer() {
  1463. var endTime = new Date([[${goodsInfo.socialEddt}]]); // 남은시간 지정 30 March 2021 9:56:00 GMT+0900
  1464. endTime = (Date.parse(endTime) / 1000);
  1465. var now = new Date();
  1466. now = (Date.parse(now) / 1000);
  1467. var timeLeft = endTime - now;
  1468. var days = Math.floor(timeLeft / 86400);
  1469. var hours = Math.floor((timeLeft - (days * 86400)) / 3600);
  1470. var minutes = Math.floor((timeLeft - (days * 86400) - (hours * 3600 )) / 60);
  1471. var seconds = Math.floor((timeLeft - (days * 86400) - (hours * 3600) - (minutes * 60)));
  1472. if (hours < '10') { hours = '0' + hours; }
  1473. if (minutes < '10') { minutes = '0' + minutes; }
  1474. if (seconds < '10') { seconds = '0' + seconds; }
  1475. if (Number(days) > 0 ){
  1476. hours = Number(hours) + (Number(days) * 24);
  1477. }
  1478. $('#d-hours').html(hours);
  1479. $('#d-minutes').html(minutes);
  1480. $('#d-seconds').html(seconds);
  1481. }
  1482. setInterval(function() { promotionTimer(); }, 1000);
  1483. }
  1484. //스타일링 추천 picker
  1485. $(document).on('mouseenter','.pd_recommend .area_slider .item_picker button',function(e){
  1486. $(this).parents('.item_picker').find('.pick_descr').show();
  1487. return false;
  1488. }).on('mouseleave','.pd_recommend .area_slider .item_picker button', function(e){
  1489. $(this).parents('.item_picker').find('.pick_descr').hide();
  1490. return false;
  1491. });
  1492. //상품상세정보 더보기
  1493. $(document).on('click','.pd_descrp .btn_more_box button',function(e){
  1494. $('.pd_descrp .cont_body').toggleClass('on');
  1495. $(this).toggleClass('active');
  1496. $(this).parent('.btn_more_box').toggleClass('covered');
  1497. var descrpToggle = $(this).find('span');
  1498. $(descrpToggle).text($(descrpToggle).text() == '상세정보 더보기' ? '상세정보 접기' : '상세정보 더보기');
  1499. return false;
  1500. });
  1501. //슬라이드 - STYLE24의 스타일링 추천
  1502. var rcmdItemSwiper = new Swiper('.pd .pd_recommend .area_slider .swiper-container', {
  1503. slidesPerView: 1,
  1504. spaceBetween: 0,
  1505. navigation: {
  1506. nextEl: '.pd_recommend .swiper-button-next',
  1507. prevEl: '.pd_recommend .swiper-button-prev',
  1508. },
  1509. pagination: {
  1510. el: '.pd_recommend .swiper-pagination',
  1511. clickable: true,
  1512. },
  1513. });
  1514. fnOptionSoldout();
  1515. // 광고 스크립트용
  1516. var goodsNavigation = [[${goodsNavigation}]];
  1517. var cate1Nm = "";
  1518. var cate2Nm = "";
  1519. var cate3Nm = "";
  1520. var cate4Nm = "";
  1521. var cate5Nm = "";
  1522. if (!gagajf.isNull(goodsNavigation)) {
  1523. cate1Nm = goodsNavigation.cate1Nm;
  1524. cate2Nm = goodsNavigation.cate2Nm;
  1525. cate3Nm = goodsNavigation.cate3Nm;
  1526. cate4Nm = goodsNavigation.cate4Nm;
  1527. cate5Nm = goodsNavigation.cate3Nm;
  1528. if (!gagajf.isNull(cate1Nm)) {
  1529. cateNm += cate1Nm;
  1530. }
  1531. if (!gagajf.isNull(cate2Nm)) {
  1532. cateNm += ' > ' + cate2Nm;
  1533. }
  1534. if (!gagajf.isNull(cate3Nm)) {
  1535. cateNm += ' > ' + cate3Nm;
  1536. }
  1537. if (!gagajf.isNull(cate4Nm)) {
  1538. cateNm += ' > ' + cate4Nm;
  1539. }
  1540. if (!gagajf.isNull(cate5Nm)) {
  1541. cateNm += ' > ' + cate5Nm;
  1542. }
  1543. }
  1544. // 광고 스크립트용
  1545. var snsGoodsImg = _uploadGoodsUrl + [[${goodsInfo.sysImgNm}]];
  1546. var snsUrl = location.protocol + _PAGE_GOODS_DETAIL + params.goodsCd +'&colorCd =' + params.colorCd ;
  1547. var snsGoodsFullNm = [[${goodsInfo.goodsFullNm}]];
  1548. <!-- 페이스북 카카오스토리 연동 관련 메타태그 -->
  1549. $("meta[property='og:url']").attr('content', snsUrl);
  1550. $("meta[property='og:title']").attr('content', snsGoodsFullNm);
  1551. $("meta[property='og:description']").attr('content', snsGoodsFullNm);
  1552. $("meta[property='og:image']").attr('content', snsGoodsImg);
  1553. <!-- 트위터 관련 메타태그 -->
  1554. $("meta[name='twitter:url']").attr('content', snsUrl);
  1555. $("meta[name='twitter:title']").attr('content', snsGoodsFullNm);
  1556. $("meta[name='twitter:description']").attr('content', snsGoodsFullNm);
  1557. $("meta[name='twitter:image']").attr('content', snsGoodsImg);
  1558. // 추천솔류션 meta 설정
  1559. $("meta[property='eg:type']").attr('content',"product");
  1560. $("meta[property='eg:cuid']").attr('content',eglqueueCuid);
  1561. $("meta[property='eg:itemId']").attr('content', [[${goodsInfo.goodsCd}]] );
  1562. $("meta[property='eg:itemName']").attr('content',[[${goodsInfo.goodsFullNm}]] );
  1563. $("meta[property='eg:itemImage']").attr('content', snsGoodsImg);
  1564. $("meta[property='eg:itemUrl']").attr('content',snsUrl);
  1565. $("meta[property='eg:originalPrice']").attr('content',[[${goodsInfo.listPrice}]]);
  1566. $("meta[property='eg:salePrice']").attr('content',[[${goodsInfo.currPrice}]]);
  1567. $("meta[property='eg:category1']").attr('content',cate1Nm);
  1568. $("meta[property='eg:category2']").attr('content',cate2Nm);
  1569. $("meta[property='eg:category3']").attr('content',cate3Nm);
  1570. $("meta[property='eg:category4']").attr('content',cate4Nm);
  1571. $("meta[property='eg:category5']").attr('content',cate5Nm);
  1572. $("meta[property='eg:brandId']").attr('content',[[${goodsInfo.brandGroupNo}]]);
  1573. $("meta[property='eg:brandName']").attr('content',[[${goodsInfo.brandGroupNm}]]);
  1574. $("meta[property='eg:regDate']").attr('content',[[${goodsInfo.regDt}]].toDate("YYYYMMDDHHmmss").format("YYYY-MM-DDTHH:mm:ssZ"));
  1575. $("meta[property='eg:updateDate']").attr('content',[[${goodsInfo.updDt}]].toDate("YYYYMMDDHHmmss").format("YYYY-MM-DDTHH:mm:ssZ"));
  1576. $("meta[property='eg:stock']").attr('content',"");
  1577. $("meta[property='eg:state']").attr('content',[[${goodsInfo.goodsStatNm}]]);
  1578. $("meta[property='eg:description']").attr('content',null);
  1579. $("meta[property='eg:extraImage']").attr('content',null);
  1580. $("meta[property='eg:locale']").attr('content',"KR");
  1581. $("meta[property='eg:isNew']").attr('content',([[${goodsInfo.formalGb}]] == 'G009_10')? 'True' :'False');
  1582. $("meta[property='eg:etc1']").attr('content', [[${goodsInfo.selfGoodsYn}]]);
  1583. // ep 쿠폰확인
  1584. fnEpCouponDown([[${afLinkCd}]], [[${params.goodsCd}]], 1);
  1585. });
  1586. // 상품평 레이어 호출후 콜백에서 호출하므로 여기에 있어야함
  1587. var fnReviewLayerCollBack = function(){
  1588. //슬라이드 - 베스트리뷰
  1589. var bestReviewtSwiper = new Swiper('.area_rv_best .swiper-container', {
  1590. slidesPerView: 2,
  1591. spaceBetween: 20,
  1592. navigation: {
  1593. nextEl: '.area_rv_best .swiper-button-next',
  1594. prevEl: '.area_rv_best .swiper-button-prev',
  1595. },
  1596. pagination: {
  1597. el: '.area_rv_best .swiper-pagination',
  1598. clickable: true,
  1599. },
  1600. });
  1601. }
  1602. $(document).on('click','.option_box [class^="opt_"] .select_custom .select',function(e){
  1603. let selectHeight = $(this);
  1604. let selectHeight02 = selectHeight.outerHeight();
  1605. if($(this).find('.opt_name').length){
  1606. $(this).siblings('.list').css({"top":selectHeight02});
  1607. }else{
  1608. $(this).siblings('.list').css({"top":"52px"});
  1609. }
  1610. });
  1611. /*]]>*/
  1612. </script>
  1613. <!-- 광고 스크립트 -->
  1614. <th:block th:replace="~{web/common/advertisements/GoodsDetailScriptsWeb :: scripts}"></th:block>
  1615. <!-- //광고 스크립트 -->
  1616. </th:block>
  1617. </body>
  1618. </html>