GoodsDetailFormMob.html 98 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415141614171418141914201421142214231424142514261427142814291430143114321433143414351436143714381439144014411442144314441445144614471448144914501451145214531454145514561457145814591460146114621463146414651466146714681469147014711472147314741475147614771478147914801481148214831484148514861487148814891490149114921493149414951496149714981499150015011502150315041505150615071508150915101511151215131514151515161517151815191520152115221523152415251526152715281529153015311532153315341535153615371538153915401541154215431544154515461547154815491550155115521553155415551556155715581559156015611562156315641565156615671568156915701571157215731574157515761577157815791580158115821583158415851586158715881589159015911592159315941595159615971598159916001601160216031604160516061607160816091610161116121613161416151616161716181619162016211622162316241625162616271628162916301631163216331634163516361637163816391640164116421643164416451646164716481649165016511652165316541655165616571658165916601661166216631664166516661667166816691670167116721673167416751676167716781679168016811682168316841685168616871688168916901691169216931694169516961697169816991700170117021703170417051706170717081709171017111712171317141715171617171718171917201721172217231724172517261727172817291730173117321733173417351736173717381739174017411742174317441745174617471748174917501751175217531754175517561757175817591760176117621763176417651766176717681769177017711772177317741775177617771778177917801781178217831784178517861787178817891790179117921793179417951796179717981799180018011802180318041805180618071808180918101811181218131814181518161817181818191820182118221823182418251826182718281829183018311832183318341835183618371838183918401841184218431844184518461847184818491850185118521853185418551856185718581859186018611862186318641865186618671868186918701871187218731874187518761877187818791880188118821883188418851886188718881889189018911892189318941895189618971898189919001901190219031904190519061907190819091910191119121913191419151916191719181919192019211922192319241925192619271928192919301931193219331934193519361937193819391940194119421943194419451946194719481949195019511952195319541955195619571958195919601961196219631964196519661967196819691970197119721973197419751976197719781979198019811982198319841985198619871988198919901991199219931994199519961997199819992000200120022003200420052006200720082009201020112012201320142015201620172018201920202021202220232024202520262027202820292030203120322033203420352036203720382039204020412042204320442045204620472048204920502051205220532054205520562057205820592060206120622063206420652066206720682069207020712072207320742075207620772078207920802081208220832084208520862087208820892090209120922093209420952096209720982099210021012102210321042105210621072108210921102111211221132114211521162117211821192120212121222123212421252126212721282129213021312132213321342135213621372138213921402141214221432144214521462147214821492150215121522153215421552156215721582159216021612162216321642165216621672168216921702171217221732174217521762177217821792180218121822183218421852186218721882189219021912192219321942195219621972198219922002201220222032204220522062207220822092210221122122213221422152216221722182219222022212222222322242225222622272228222922302231223222332234223522362237223822392240224122422243224422452246224722482249
  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="mob/common/layout/GoodsLayoutMob">
  6. <!--
  7. *******************************************************************************
  8. * @source : GoodsDetailFormMob.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.04.02 eskim 최초 작성
  17. *******************************************************************************
  18. -->
  19. <body>
  20. <th:block layout:fragment="content">
  21. <main role="" id="" class="container pd" th:with="imgGoodsUrl=${@environment.getProperty('upload.goods.view')}, uxImgUrl=${@environment.getProperty('domain.uximage')}, imgUrl=${@environment.getProperty('upload.image.view')}">
  22. <!-- ★ 컨텐츠 시작 -->
  23. <form name="cartForm" id="cartForm" method="post">
  24. <input type="hidden" name="mode">
  25. <input type="hidden" name="goodsCd" th:value="${params.goodsCd}" />
  26. <input type="hidden" name="contentsLoc" th:value="${params.contentsLoc}" />
  27. <input type="hidden" name="ithrCd" th:value="${params.ithrCd}" />
  28. <input type="hidden" name="planDtlSq" th:value="${params.planDtlSq}" />
  29. <input type="hidden" name="adminYn" th:value="${params.adminYn}" />
  30. <input type="hidden" name="optCd" />
  31. <input type="hidden" name="optCd1" />
  32. <input type="hidden" name="optCd2" />
  33. <input type="hidden" name="addPrice" />
  34. <input type="hidden" name="ordQty" />
  35. <input type="hidden" name="stock" />
  36. <input type="hidden" name="minOrdQty"/>
  37. <input type="hidden" name="maxOrdQty"/>
  38. <input type="hidden" name="currPrice" th:value="${goodsInfo.currPrice}"/>
  39. <input type="hidden" name="goodsType" th:value="${goodsInfo.goodsType}"/>
  40. <input type="hidden" name="selfGoodsYn" th:value="${goodsInfo.selfGoodsYn}"/>
  41. <section class="pd_detail">
  42. <!-- 210409_ 구조변경 : .pd_info, .pd_info1 추가 -->
  43. <div class="pd_info">
  44. <div class="pd_info1" data-speed="10">
  45. <div class="inner wide" th:if="${(goodsImgList != null and !goodsImgList.empty) or (goodsVideoList != null and !goodsVideoList.empty)}">
  46. <div class="thumb_box">
  47. <div class="area_slider">
  48. <div class="swiper-container thumb_list">
  49. <div class="swiper-wrapper">
  50. <th:block th:each="goodsVideo, status : ${goodsVideoList}">
  51. <div class="swiper-slide">
  52. <div class="movbox">
  53. <th:block th:if="${goodsVideo.videoGb == 'Y'}">
  54. <iframe 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>
  55. </th:block>
  56. <th:block th:unless="${goodsVideo.videoGb == 'Y'}">
  57. <iframe id="child" class="pd_mov" width="100%" height="100%" th:src="${kollusMediaUrl+'/'+goodsVideo.kmcKey +'?enable_initialize_focus=false&autoplay&mute&controls_activation=none'}" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
  58. </th:block>
  59. </div>
  60. </div>
  61. </th:block>
  62. <th:block th:each="goodsImg, status : ${goodsImgList}">
  63. <div class="swiper-slide" th:if="${ not (#strings.contains(goodsImg.sysImgNm,'_S1')
  64. or #strings.contains(goodsImg.sysImgNm,'_L1')
  65. or #strings.contains(goodsImg.sysImgNm,'_L2'))}">
  66. <div class="thumb" ><img th:src="${imgGoodsUrl+'/'+goodsImg.sysImgNm+'?RS=1080'}" alt="" th:onerror="'this.src=\''+@{${uxImgUrl}+ '/images/pc/thumb/bg_item_none.png'}+'\';'"></div></div> <!-- mov -->
  67. </th:block>
  68. </div>
  69. <!-- Add Pagination -->
  70. <div class="swiper-pagination"></div>
  71. </div>
  72. </div>
  73. </div>
  74. </div>
  75. </div>
  76. <div class="inner">
  77. <!-- 210409_ 구조변경 : .covered 추가 -->
  78. <div class="covered">
  79. <div class="timer_box" style="display:none;">
  80. <p>
  81. <span class="tt">남은시간</span>
  82. <span class="timer">
  83. <em id="d-hours">0</em>
  84. <em id="d-minutes">0</em>
  85. <em id="d-seconds">0</em>
  86. </span>
  87. </p>
  88. </div>
  89. <div class="descript_box">
  90. <p class="name" th:text="${goodsInfo.goodsFullNm}">유니 삼단블록 플리스 집업</p>
  91. <p class="comment" th:text="${goodsInfo.goodsTnm}">#가을 느낌 물씬!</p>
  92. <p class="price_blk">
  93. <span class="sale_price"><em th:text="${#numbers.formatInteger(goodsInfo.currPrice, 0,'COMMA')}">134,100</em>원</span>
  94. <span class="org_price" th:if="${goodsInfo.listPrice > goodsInfo.currPrice}" ><del><em th:text="${#numbers.formatInteger(goodsInfo.listPrice, 0,'COMMA')}">149,000</em>원</del></span>
  95. <span class="sale_percent" th:if="${goodsInfo.dcRate > 0}" th:text="|${#numbers.formatDecimal(goodsInfo.dcRate,0,0)}%|">30%</span>
  96. </p>
  97. <p class="save_point" th:if="${goodsInfo.pntAmt > 0}">스타일포인트 <th:block th:text="${#numbers.formatInteger(goodsInfo.pntAmt, 0,'COMMA')}"></th:block>P 적립예정</p>
  98. <div class="btn_group_flex">
  99. <div><button type="button" class="btn btn_default" id="btn_saleCoupon_pop" th:onclick="cfGoodsCouponInfo([[${goodsInfo.goodsCd}]],[[${goodsInfo.goodsType}]])">쿠폰받기</button></div>
  100. </div>
  101. </div>
  102. </div>
  103. </div>
  104. <div class="inner wide" th:if="${not #strings.isEmpty(goodsInfo.delvResDt) }">
  105. <div class="desc_status">예약판매 상품 - <em th:text="${goodsInfo.delvResDt}">2020.12.30</em> 출고예정</div>
  106. </div>
  107. <div class="inner" th:if="${goodsInfo.selfGoodsYn =='Y' and goodsInfo.goodsType =='G056_N'}"> <!-- 자사상품,일반상품 -->
  108. <div class="option_box">
  109. <div class="opt_color" th:if="${goodsOption1List != null and !goodsOption1List.empty}">
  110. <div class="opt_header">
  111. <span class="title">컬러</span>
  112. <span class="color" th:text="${goodsInfo.colorNm}">그레이</span>
  113. </div>
  114. <ul>
  115. <li th:each="goodsOption1, status : ${goodsOption1List}">
  116. <a href="javascript:void(0);" th:class="${params.colorCd == goodsOption1.optCd1}? 'on':''" th:onclick="cfnGoToGoodsDetail([[${goodsInfo.goodsCd}]], [[${goodsOption1.optCd1}]])"> <!-- 해당 컬러 상품페이지로 이동 -->
  117. <img th:src="${imgGoodsUrl+'/'+goodsOption1.sysImgNm+'?RS=50'}" alt="" th:onerror="'this.src=\''+@{${uxImgUrl}+ '/images/pc/thumb/bg_item_none.png'}+'\';'">
  118. </a>
  119. </li>
  120. </ul>
  121. </div>
  122. <div class="opt_size" th:if="${goodsOption2List != null and !goodsOption2List.empty}">
  123. <div class="opt_header">
  124. <span class="title">사이즈</span>
  125. <span class="size">
  126. <em class="selectOptCd1"></em>
  127. <em class="selectOptCd1addPrice"></em>
  128. </span>
  129. </div>
  130. <div class="form_field">
  131. <div th:each="goodsOption2, status : ${goodsOption2List}">
  132. <input type="radio" name="opt" th:id="${goodsOption2.optCd}" th:disabled="${goodsOption2.soldoutYn == 'Y' or goodsOption2.stockQty <= 0}"
  133. th:attr="addPrice=${goodsOption2.addPrice}, optCd1=${goodsOption2.optCd1}, optCd2=${goodsOption2.optCd2}, optCd=${goodsOption2.optCd}"
  134. />
  135. <label th:for="${goodsOption2.optCd}" th:onclick="fnViewStock(this, [[${goodsInfo.goodsCd}]],[[${goodsOption2.optCd}]],[[${goodsOption2.optCd1}]],[[${goodsOption2.optCd2}]],[[${goodsInfo.minOrdQty}]], [[${goodsInfo.maxOrdQty}]] )"><span th:text="${goodsOption2.optCd2}">90</span></label>
  136. </div>
  137. </div>
  138. </div>
  139. <div class="info_restock" style="display:none;"><a href="javascript:void(0);" id="btn_pushRestock_pop" class="btn_popup" th:onclick="cfGoodsInstockAlarmInfo([[${goodsInfo.goodsCd}]], [[${goodsInfo.colorCd}]])">재입고 알림 신청</a></div>
  140. </div>
  141. </div>
  142. <div class="inner" th:if="${(cardInfoList != null and !cardInfoList.empty) or
  143. (goodsCouponList != null and !goodsCouponList.empty) or
  144. (tmtbList != null and !tmtbList.empty) or
  145. (freeGoodsList != null and !freeGoodsList.empty)}" >
  146. <div class="benefit_box">
  147. <dl class="bnf_shopping" th:if="${(goodsCouponList != null and !goodsCouponList.empty) or
  148. (tmtbList != null and !tmtbList.empty) or
  149. (freeGoodsList != null and !freeGoodsList.empty)}" >
  150. <dt>쇼핑혜택</dt>
  151. <dd>
  152. <th:block th:if="${goodsCouponList != null and !goodsCouponList.empty}">
  153. <span th:each="goodsCoupon, status : ${goodsCouponList}" th:if="${status.first}">최대 <em>
  154. <th:block th:if="${goodsCoupon.dcWay == 'G240_10'}" th:text="|${#numbers.formatInteger(goodsCoupon.dcVal, 0,'COMMA')}원|"></th:block>
  155. <th:block th:unless="${goodsCoupon.dcWay == 'G240_10'}" th:text="|${goodsCoupon.dcVal}%|"></th:block>
  156. </em> 쿠폰 할인</span>
  157. </th:block>
  158. <th:block th:if="${tmtbList != null and !tmtbList.empty}">
  159. <span th:each="tmtb, status : ${tmtbList}" th:if="${status.first}">
  160. <em><th:block th:text="${#numbers.formatInteger(tmtb.sectionVal, 0,'COMMA')}"></th:block><th:block th:text="${(tmtb.sectionGb == 'G810_10')? '개':'금액'}"></th:block></em> 이상 구매 시
  161. <em><th:block th:text="${#numbers.formatInteger(tmtb.dcVal, 0,'COMMA')}"></th:block><th:block th:text="${(tmtb.dcWay == 'G240_10')? '원':'%'}"></th:block></em></em> 할인
  162. </span>
  163. </th:block>
  164. <span th:if="${freeGoodsList != null and !freeGoodsList.empty}">
  165. <th:block th:each="freeGoods, status : ${freeGoodsList}" th:if="${status.first}">
  166. <th:block th:text="${freeGoods.goodsNm}"></th:block> 증정 <th:block th:if="${freeGoods.allYn == 'N'}" th:text="${'외 택1'}"></th:block></span>
  167. <button type="button" id="btn_bnfShopping_pop" class="btn_popup" th:onclick="cfGoodsShopBenefitInfo([[${goodsInfo.goodsCd}]])"><span>자세히</span></button>
  168. </dd>
  169. </dl>
  170. <dl class="bnf_card" th:if="${cardInfoList != null and !cardInfoList.empty}">
  171. <dt>카드혜택</dt>
  172. <dd>
  173. <th:block th:each="cardInfo, status : ${cardInfoList}">
  174. <span th:if="${cardInfo.prmtGb == 'A' and cardInfo.dcGb != '3'}"><th:block th:text="${cardInfo.prmtTargetNm}"></th:block> <em><th:block th:text="${#numbers.formatInteger(cardInfo.dcVal, 0,'COMMA')+ cardInfo.dcWayNm}"></th:block></em> <th:block th:text="${cardInfo.prmtGbNm}"></span>
  175. <span th:if="${cardInfo.prmtGb == 'A' and cardInfo.dcGb == '3'}" th:text="${cardInfo.prmtNm}">프로모션명</span>
  176. <span th:if="${cardInfo.prmtGb == 'B'}">신용카드 무이자 혜택</span>
  177. </th:block>
  178. <button type="button" id="btn_bnfCard_pop" class="btn_popup" onclick="cfCardInfo();return false;"><span>자세히</span></button>
  179. </dd>
  180. </dl>
  181. </div>
  182. </div>
  183. </div>
  184. <div class="inner tmtb" th:if="${goodsList != null and !goodsList.empty}" >
  185. <div class="pd_together" id="goodsTmtbArea">
  186. <h3 class="tit">
  187. 함께하면 할인되는 다다익선 상품
  188. </h3>
  189. <div class="area_slider">
  190. <div class="swiper-container swiper-container-initialized swiper-container-horizontal">
  191. <div class="swiper-wrapper">
  192. <div class="swiper-slide" th:each="goodsInfo, status : ${goodsList}">
  193. <div class="item_prod">
  194. <div class="item_state">
  195. <button type="button" class="itemLike" th:classappend="${goodsInfo.wishYn == 'Y'}? 'likeit active' : ''" onclick="cfnPutWishList(this);" th:attr="goodsCd=${goodsInfo.goodsCd}, ithrCd=${params.ithrCd}, contentsLoc=${params.contentsLoc}, planDtlSq=''">관심상품 추가</button>
  196. <a href="javascript:void(0);" onclick="cfnGoToGoodsDetail([[${goodsInfo.goodsCd}]], '',[[${params.ithrCd}]],'[[${params.contentsLoc}]]','','pc_detail');" class="itemLink" >
  197. <div class="itemPic">
  198. <img alt="" class="vLHTC pd_img" th:src="${imgGoodsUrl+'/'+goodsInfo.sysImgNm+'?RS=156'}" th:onerror="'this.src=\''+@{${uxImgUrl}+ '/images/pc/thumb/bg_item_none.png'}+'\';'">
  199. </div>
  200. <p class="itemBrand" th:text="${goodsInfo.brandGroupNm}">BRAND NAME1</p>
  201. <div class="itemName" th:text="${goodsInfo.goodsFullNm}">남성 로고 자카드 방풍 패딩</div>
  202. <p class="itemPrice">
  203. <th:block th:text="${#numbers.formatInteger(goodsInfo.currPrice, 0,'COMMA')}"></th:block>
  204. </p>
  205. </a>
  206. </div>
  207. </div>
  208. </div>
  209. </div>
  210. </div>
  211. </div>
  212. </div>
  213. </div>
  214. <div class="inner wide">
  215. <div class="brand_home">
  216. <a href="javascript:void(0);" class="link_go" th:onclick="cfnGoToBrandMain([[${goodsInfo.brandGroupNo}]])" th:text="|${goodsInfo.brandGroupNm} 브랜드홈|" >NBA 브랜드홈</a>
  217. </div>
  218. </div>
  219. <div class="inner wide">
  220. <div class="content pd_descrp">
  221. <div class="cont_head">
  222. <h3 class="sr-only">상품상세정보</h3>
  223. </div>
  224. <div class="cont_body">
  225. <!-- 상품설명 노출 -->
  226. <div class="descrp_box" th:if="${goodsInfo.tobeFormYn == 'Y'}">
  227. <div class="desc_simple"> <!-- 상품 간략설명-->
  228. <span class="tit_desc" th:if="${goodsInfo.goodsTitle != null and !goodsInfo.goodsTitle.empty}" th:utext="${#strings.unescapeJava(#strings.escapeJava(goodsInfo.goodsTitle))}">사이드 밴딩으로 편안한 만능 슬랙스!</span>
  229. <p class="ptxt01"th:if="${goodsInfo.goodsTitleDesc}" th:utext="${#strings.unescapeJava(#strings.escapeJava(goodsInfo.goodsTitleDesc))}">
  230. 슬림핏에 사이드 밴딩으로 편안함을 더해준 슬랙스입니다.
  231. </p>
  232. </div>
  233. <div class="desc_character" th:if="${goodsInfo.goodsSpecialDesc != null and !goodsInfo.goodsSpecialDesc.empty}"> <!-- 상품특징 -->
  234. <span class="tit_desc">상품특징</span>
  235. <p class="ptxt01" th:utext="${#strings.unescapeJava(#strings.escapeJava(goodsInfo.goodsSpecialDesc))}">
  236. - 지퍼플러 장식을 더해 완성도를 높여줌
  237. </p>
  238. </div>
  239. </div>
  240. <!-- //상품설명 노출 -->
  241. <!-- 관리자 에디터입력 내용 노출 -->
  242. <div class="mdhtml_box">
  243. <th:block th:if="${goodsNoticeList != null and !goodsNoticeList.empty}" >
  244. <th:block th:each="goodsNotice, status : ${goodsNoticeList}" th:utext="${#strings.unescapeJava(#strings.escapeJava(goodsNotice.noticeContent))}"></th:block >
  245. </th:block>
  246. <!-- 관리자 에디터입력 내용 공지 html -->
  247. <th:block th:each="goodsVideo, status : ${goodsVideoList}">
  248. <div class="movblock">
  249. <th:block th:if="${goodsVideo.videoGb == 'Y'}">
  250. <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>
  251. </th:block>
  252. <th:block th:unless="${goodsVideo.videoGb == 'Y'}">
  253. <iframe class="pd_mov" width="100%" height="100%" th:src="${kollusMediaUrl+'/'+goodsVideo.kmcKey +'?enable_initialize_focus=false&autoplay&mute&controls_activation=none'}" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
  254. </th:block>
  255. </div>
  256. </th:block>
  257. <!-- 공통상품베너 -->
  258. <th:block th:if="${goodsBannerList != null and !goodsBannerList.empty}">
  259. <th:block th:each="goodsBanner, status : ${goodsBannerList}" >
  260. <th:block th:if="${goodsBanner.strVar1 != null and not #strings.equals(goodsBanner.strVar1, '#')}">
  261. <a th:href="${goodsBanner.strVar1}" target="_blank">
  262. <img th:src="${imgUrl+goodsBanner.imgPath1}" alt="">
  263. </a>
  264. </th:block>
  265. <th:block th:unless="${goodsBanner.strVar1 != null and not #strings.equals(goodsBanner.strVar1, '#')}">
  266. <img th:src="${imgUrl+goodsBanner.imgPath1}" alt="">
  267. </th:block>
  268. </th:block>
  269. </th:block>
  270. </div>
  271. <div class="view_outfit_box" >
  272. <!-- 관리자 에디터입력 내용 노출 상단 html -->
  273. <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 >
  274. <th:block th:if="${goodsInfo.goodsDesc != null and !goodsInfo.goodsDesc.empty}" th:utext="${#strings.unescapeJava(#strings.escapeJava(goodsInfo.goodsDesc))}"></th:block>
  275. </div>
  276. <th:block th:if="${goodsInfo.tobeFormYn == 'Y'}">
  277. <!-- 착용컷 노출 -->
  278. <div class="view_outfit_box" th:if="${#strings.contains(goodsImgList,'_M1')
  279. or #strings.contains(goodsImgList,'_M2')
  280. or #strings.contains(goodsImgList,'_M3')
  281. or #strings.contains(goodsImgList,'_M4')
  282. or #strings.contains(goodsImgList,'_M5')}">
  283. <span class="tit_view">OUTFIT VIEW</span>
  284. <span class="model_info">(모델정보 : 185cm / 78kg / XL 착용)</span>
  285. <div class="view">
  286. <th:block th:each="goodsImg, status : ${goodsImgList}" th:if="${#strings.contains(goodsImg.sysImgNm,'_M1')
  287. or #strings.contains(goodsImg.sysImgNm,'_M2')
  288. or #strings.contains(goodsImg.sysImgNm,'_M3')
  289. or #strings.contains(goodsImg.sysImgNm,'_M4')
  290. or #strings.contains(goodsImg.sysImgNm,'_M5')}">
  291. <img th:src="${imgGoodsUrl+'/'+goodsImg.sysImgNm+'?RS=360'}" alt="">
  292. </th:block>
  293. </div>
  294. </div>
  295. <!-- //착용컷 노출 -->
  296. <!-- 상품컷 노출 -->
  297. <div class="view_detail_box" th:if="${#strings.contains(goodsImgList,'_01')
  298. or #strings.contains(goodsImgList,'_02')
  299. or #strings.contains(goodsImgList,'_D1')
  300. or #strings.contains(goodsImgList,'_D2')
  301. or #strings.contains(goodsImgList,'_D3')
  302. or #strings.contains(goodsImgList,'_D4')
  303. or #strings.contains(goodsImgList,'_D5')}">
  304. <span class="tit_view">PRODUCT VIEW</span>
  305. <div class="view">
  306. <th:block th:each="goodsImg, status : ${goodsImgList}" th:if="${#strings.contains(goodsImg.sysImgNm,'_01')
  307. or #strings.contains(goodsImg.sysImgNm,'_02')
  308. or #strings.contains(goodsImg.sysImgNm,'_D1')
  309. or #strings.contains(goodsImg.sysImgNm,'_D2')
  310. or #strings.contains(goodsImg.sysImgNm,'_D3')
  311. or #strings.contains(goodsImg.sysImgNm,'_D4')
  312. or #strings.contains(goodsImg.sysImgNm,'_D5')}">
  313. <img th:src="${imgGoodsUrl+'/'+goodsImg.sysImgNm+'?RS=360'}" alt="">
  314. </th:block>
  315. </div>
  316. </div>
  317. <!-- //상품컷 노출 -->
  318. <!-- 원단 노출 -->
  319. <div class="view_fabric_box" th:if="${#strings.contains(goodsImgList,'_S1')}">
  320. <span class="tit_view">FABRIC</span>
  321. <div class="view">
  322. <th:block th:each="goodsImg, status : ${goodsImgList}" th:if="${#strings.contains(goodsImg.sysImgNm,'_S1')}">
  323. <img th:src="${imgGoodsUrl+'/'+goodsImg.sysImgNm}" alt="">
  324. </th:block>
  325. </div>
  326. </div>
  327. <!-- //원단 노출 -->
  328. <!-- 라벨 노출 -->
  329. <div class="view_label_box" th:if="${#strings.contains(goodsImgList,'_L1')
  330. or #strings.contains(goodsImgList,'_L2')}">
  331. <span class="tit_view">LABEL INFO</span>
  332. <div class="view">
  333. <span>
  334. <th:block th:each="goodsImg, status : ${goodsImgList}" th:if="${#strings.contains(goodsImg.sysImgNm,'_L1')
  335. or #strings.contains(goodsImg.sysImgNm,'_L2')}">
  336. <img th:src="${imgGoodsUrl+'/'+goodsImg.sysImgNm}" alt="">
  337. </th:block>
  338. </span>
  339. </div>
  340. </div>
  341. <!-- //라벨 노출 -->
  342. <div class="view_detail_box" th:if="${not #strings.contains(goodsImgList,'_01')}">
  343. <div class="view">
  344. <th:block th:each="goodsImg, status : ${goodsImgList}" >
  345. <img th:src="${imgGoodsUrl+'/'+goodsImg.sysImgNm+'?RS=360'}" alt="">
  346. </th:block>
  347. </div>
  348. </div>
  349. </th:block>
  350. <!-- 관리자 에디터입력 내용 노출 하다단 html -->
  351. <div class="mdhtml_box" th:if="${goodsInfo.goodsDownDesc != null and !goodsInfo.goodsDownDesc.empty}" th:utext="${#strings.unescapeJava(#strings.escapeJava(goodsInfo.goodsDownDesc))}"></div>
  352. <!-- 브랜드 노출 -->
  353. <div class="brand_box">
  354. <p class="name" th:text="${goodsInfo.brandGroupNm}">TBJ 티비제이</p>
  355. <a href="javascript:void(0);" class="brend_home" th:onclick="cfnGoToBrandMain([[${goodsInfo.brandGroupNo}]])" ><span>브랜드 홈 바로가기</span></a>
  356. </div>
  357. <!-- //브랜드 노출 -->
  358. <!-- 상품필수정보 노출 -->
  359. <div class="required_box">
  360. <div class="area_infotbl" th:if="${goodsInfo.goodsType == 'G056_N' and goodsNotiList != null and !goodsNotiList.empty}">
  361. <span class="title">상품고시정보</span>
  362. <div class="tbl type1">
  363. <table>
  364. <tbody>
  365. <tr th:each="goodsNoti, status : ${goodsNotiList}" >
  366. <th th:text="${goodsNoti.niItemNm}">스타일</th>
  367. <td th:text="${goodsNoti.niContent}">F94U-MD01XA60F0</td>
  368. </tr>
  369. </tbody>
  370. </table>
  371. </div>
  372. </div>
  373. <div class="area_infotbl" th:if="${goodsInfo.goodsType == 'G056_S' and goodsComposeList != null and !goodsComposeList.empty}">
  374. <span class="title">상품고시정보</span>
  375. <th:block th:each="goodsCompose, status : ${goodsComposeList}">
  376. <div class="tbl type1">
  377. <table>
  378. <tbody>
  379. <tr th:each="goodsNoti, status : ${goodsCompose.goodsNotiList}" >
  380. <th th:text="${goodsNoti.niItemNm}">스타일</th>
  381. <td th:text="${goodsNoti.niContent}">F94U-MD01XA60F0</td>
  382. </tr>
  383. </tbody>
  384. </table>
  385. </div>
  386. </th:block>
  387. </div>
  388. <th:block th:if="${goodsInfo.goodsType == 'G056_N' and goodsSafeNo != null}" >
  389. <th:block th:if="${goodsSafeNo.certTargetGb == 'G083_3'}" > <!-- 상세별도표시 -->
  390. <div class="area_kcl no-mark">
  391. <div>
  392. <p class="tit normal"><th:block th:if="${goodsSafeNo.certFormNm}" th:text="${goodsSafeNo.certFormNm + '/'}"></th:block> 제품 상세정보 내 별도 표기</p>
  393. <p class="normal">제품 상세정보 내 표기되어 있습니다. 상품 정보를 확인해주세요.</p>
  394. </div>
  395. </div>
  396. </th:block>
  397. <th:block th:unless="${goodsSafeNo.certTargetGb == 'G083_3'}" > <!-- 인증 -->
  398. <th:block th:if="${goodsSafeNo.certType == 'G081_3'}" > <!-- 공급자적합성 -->
  399. <div class="area_kcl">
  400. <div><i class="ico ico_kcl"></i></div>
  401. <div>
  402. <p class="tit normal"><th:block th:text="${goodsSafeNo.certFormNm}"></th:block> / 공급자적합성확인</p>
  403. <p class="normal">공급자 적합성 확인 품목으로 국가통합인증을 필함</p>
  404. </div>
  405. </div>
  406. </th:block>
  407. <th:block th:unless="${goodsSafeNo.certType == 'G081_3'}" > <!-- 공급자적합성 외 -->
  408. <div class="area_kcl" >
  409. <div><i class="ico ico_kcl"></i></div>
  410. <div>
  411. <th:block th:if="${goodsSafeNo.certFormGb != 'G084_4' and goodsSafeNo.certFormGb != 'G084_5' }">
  412. <p class="tit normal" th:text="${goodsSafeNo.certDiv + ' / ' + goodsSafeNo.certOrganName}">어린이제품 안전인증 / 한국건설생활시험연구원(KCL)</p>
  413. </th:block>
  414. <th:block th:unless="${goodsSafeNo.certFormGb != 'G084_4' and goodsSafeNo.certFormGb != 'G084_5' }">
  415. <p class="tit normal" th:text="${goodsSafeNo.certFormNm + ' 안전인증'}"></p>
  416. </th:block>
  417. <p class="normal" >
  418. <th:block th:if="${goodsSafeNo.certFormGb != 'G084_4' and goodsSafeNo.certFormGb != 'G084_5' }">
  419. <span>인증번호:</span> <a class="num" th:href="@{http://www.safetykorea.kr/search/searchPop(certNum=${goodsSafeNo.certNum})}" target="_blank" th:text="${goodsSafeNo.certNum}">CB123A123-1234</a>
  420. </th:block>
  421. <th:block th:uless="${goodsSafeNo.certFormGb != 'G084_4' and goodsSafeNo.certFormGb != 'G084_5' }">
  422. <span>인증번호:</span> <th:block th:text="${goodsSafeNo.certNum}">CB123A123-1234</th:block>
  423. </th:block>
  424. </p>
  425. </div>
  426. </div>
  427. </th:block>
  428. </th:block>
  429. <p class="t_info dot_info mt10">
  430. 해당 인증정보는 판매자가 등록한 것으로 등록정보에 대한 일체의 책임은 판매자에게 있습니다.
  431. </p>
  432. </th:block>
  433. <th:block th:if="${goodsInfo.goodsType == 'G056_S'}">
  434. <th:block th:each="goodsCompose, status : ${goodsComposeList}">
  435. <th:block th:if="${goodsCompose.goodsSafeNo != null}">
  436. <th:block th:if="${goodsCompose.goodsSafeNo.certTargetGb == 'G083_3'}" > <!-- 상세별도표시 -->
  437. <div class="area_kcl no-mark">
  438. <div>
  439. <p class="tit normal"><th:block th:if="${goodsCompose.goodsSafeNo.certFormNm}" th:text="${goodsCompose.goodsSafeNo.certFormNm + '/'}"></th:block> 제품 상세정보 내 별도 표기</p>
  440. <p class="normal">제품 상세정보 내 표기되어 있습니다. 상품 정보를 확인해주세요.</p>
  441. </div>
  442. </div>
  443. </th:block>
  444. <th:block th:unless="${goodsCompose.goodsSafeNo.certTargetGb == 'G083_3'}" > <!-- 인증 -->
  445. <th:block th:if="${goodsCompose.goodsSafeNo.certType == 'G081_3'}" > <!-- 공급자적합성 -->
  446. <div class="area_kcl">
  447. <div><i class="ico ico_kcl"></i></div>
  448. <div>
  449. <p class="tit normal"><th:block th:text="${goodsCompose.goodsSafeNo.certFormNm}"></th:block> / 공급자적합성확인</p>
  450. <p class="normal">공급자 적합성 확인 품목으로 국가통합인증을 필함</p>
  451. </div>
  452. </div>
  453. </th:block>
  454. <th:block th:unless="${goodsCompose.goodsSafeNo.certType == 'G081_3'}" > <!-- 공급자적합성 외 -->
  455. <div class="area_kcl" >
  456. <div><i class="ico ico_kcl"></i></div>
  457. <div>
  458. <th:block th:if="${goodsCompose.goodsSafeNo.certFormGb != 'G084_4' and goodsCompose.goodsSafeNo.certFormGb != 'G084_5' }">
  459. <p class="tit normal" th:text="${goodsSafeNo.certDiv + ' / ' + goodsSafeNo.certOrganName}">어린이제품 안전인증 / 한국건설생활시험연구원(KCL)</p>
  460. </th:block>
  461. <th:block th:unless="${goodsCompose.goodsSafeNo.certFormGb != 'G084_4' and goodsCompose.goodsSafeNo.certFormGb != 'G084_5' }">
  462. <p class="tit normal" th:text="${goodsCompose.goodsSafeNo.certFormNm + ' 안전인증'}"></p>
  463. </th:block>
  464. <p class="normal" >
  465. <th:block th:if="${goodsCompose.goodsSafeNo.certFormGb != 'G084_4' and goodsCompose.goodsSafeNo.certFormGb != 'G084_5' }">
  466. <span>인증번호:</span> <a class="num" th:href="@{http://www.safetykorea.kr/search/searchPop(certNum=${goodsCompose.goodsSafeNo.certNum})}" target="_blank" th:text="${goodsSafeNo.certNum}">CB123A123-1234</a>
  467. </th:block>
  468. <th:block th:uless="${goodsCompose.goodsSafeNo.certFormGb != 'G084_4' and goodsCompose.goodsSafeNo.certFormGb != 'G084_5' }">
  469. <span>인증번호:</span> <th:block th:text="${goodsCompose.goodsSafeNo.certNum}">CB123A123-1234</th:block>
  470. </th:block>
  471. </p>
  472. </div>
  473. </div>
  474. </th:block>
  475. </th:block>
  476. <p class="t_info dot_info mt10" >
  477. 해당 인증정보는 판매자가 등록한 것으로 등록정보에 대한 일체의 책임은 판매자에게 있습니다.
  478. </p>
  479. </th:block>
  480. </th:block>
  481. </th:block>
  482. <div class="area_infotbl">
  483. <span class="title">상품기본정보</span>
  484. <th:block th:if="${goodsInfo.goodsType == 'G056_N'} ">
  485. <div class="tbl type1">
  486. <table>
  487. <tbody>
  488. <tr>
  489. <th>상품코드</th>
  490. <td th:text="${goodsInfo.goodsCd}">14443216</td>
  491. </tr>
  492. <tr>
  493. <th>상품구분</th>
  494. <td th:text="${goodsInfo.goodsGbNm}">병행수입</td>
  495. </tr>
  496. <tr>
  497. <th>브랜드</th>
  498. <td th:text="${goodsInfo.brandGroupNm}">TBJ</td>
  499. </tr>
  500. <tr>
  501. <th>상품명</th>
  502. <td th:text="${goodsInfo.goodsNm}">남성 테이퍼드 핏 겨울 기모면 스판 올 밴딩 팬츠</td>
  503. </tr>
  504. <th:block th:if="${goodsNotiList != null and !goodsNotiList.empty}">
  505. <th:block th:each="goodsNoti, status : ${goodsNotiList}" th:if="${goodsNoti.niItemCd == 'G005_005'}">
  506. <tr>
  507. <th th:text="${goodsNoti.niItemNm}">제조사</th>
  508. <td th:text="${goodsNoti.niContent}"></td>
  509. </tr>
  510. </th:block>
  511. </th:block>
  512. <tr>
  513. <th>제조국</th>
  514. <td th:text="${goodsInfo.originNm}">베트남</td>
  515. </tr>
  516. </tbody>
  517. </table>
  518. </div>
  519. </th:block>
  520. <th:block th:unless="${goodsInfo.goodsType == 'G056_N'} ">
  521. <th:block th:if="${goodsComposeList != null and !goodsComposeList.empty}">
  522. <th:block th:each="goodsCompose, status : ${goodsComposeList}">
  523. <div class="tbl type1">
  524. <table>
  525. <tbody>
  526. <tr>
  527. <th>상품코드</th>
  528. <td th:text="${goodsCompose.compsGoodsCd}">14443216</td>
  529. </tr>
  530. <tr>
  531. <th>상품구분</th>
  532. <td th:text="${goodsCompose.goodsGbNm}">병행수입</td>
  533. </tr>
  534. <tr>
  535. <th>브랜드</th>
  536. <td th:text="${goodsCompose.brandGroupNm}">TBJ</td>
  537. </tr>
  538. <tr>
  539. <th>상품명</th>
  540. <td th:text="${goodsCompose.compsGoodsNm}">남성 테이퍼드 핏 겨울 기모면 스판 올 밴딩 팬츠</td>
  541. </tr>
  542. <th:block th:if="${goodsCompose.goodsNotiList != null and !goodsCompose.goodsNotiList.empty}">
  543. <th:block th:each="goodsNoti, status : ${goodsCompose.goodsNotiList}" th:if="${goodsNoti.niItemCd == 'G005_005'}">
  544. <tr>
  545. <th th:text="${goodsNoti.niItemNm}">제조사</th>
  546. <td th:text="${goodsNoti.niContent}"></td>
  547. </tr>
  548. </th:block>
  549. </th:block>
  550. <tr>
  551. <th>제조국</th>
  552. <td th:text="${goodsCompose.originNm}">베트남</td>
  553. </tr>
  554. </tbody>
  555. </table>
  556. </div>
  557. </th:block>
  558. </th:block>
  559. </th:block>
  560. <p class="t_info dot_info mt10">
  561. 주문제작 상품의 경우 주문 후 제작되어 판매되는 상품으로 제작 시점부터 반품/교환이 어려울 수 있습니다.
  562. </p>
  563. </div>
  564. </div>
  565. <!-- //상품필수정보 노출 -->
  566. </div>
  567. <div class="btn_more_box">
  568. <div class="btn_group_flex">
  569. <div>
  570. <button type="button" class="btn btn_default">
  571. <span>상세정보 더보기</span>
  572. </button>
  573. </div>
  574. </div>
  575. </div>
  576. </div>
  577. </div>
  578. <div class="inner">
  579. <!-- 리뷰영역 -->
  580. <div class="riview_box" th:if="${reviewDisplayYn == 'Y'}">
  581. <div class="ex_review">
  582. <a href="javascript:void(0);" id="btn_pdReview_pop" th:onclick="cfGoodsReview([[${goodsInfo.goodsCd}]])">
  583. <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>
  584. <div class="star_score" th:if="${goodsInfo.reviewRegCnt > 0 }">
  585. <span class="star" th:with="starScore=${#numbers.formatDecimal((goodsInfo.score*100/5), 0,0)}">
  586. <em class="progbar" th:style="${'width:'+starScore+'%;' }"></em> <!-- 평점 style로 표기 -->
  587. </span>
  588. <span class="score" th:text="|${goodsInfo.score}점|">4.3점</span>
  589. </div>
  590. </a>
  591. </div>
  592. <div class="area_slider" id="btn_pdBestReview_pop" th:if="${bestReviewList != null and !bestReviewList.empty}">
  593. <div class="swiper-container">
  594. <div class="swiper-wrapper">
  595. <div class="swiper-slide" th:each="bestReview, status : ${bestReviewList}" >
  596. <!-- 베스트 리뷰 등록시 노출 -->
  597. <div class="best_review">
  598. <a href="javascript:void(0);" th:onclick="cfGoodsReviewDetail([[${goodsInfo.goodsCd}]],'Y', '',[[${bestReview.reviewSq}]])">
  599. <div class="star_score" th:with="starScore=${#numbers.formatDecimal((bestReview.iscore*100/5), 0,0)}">
  600. <span class="star">
  601. <em class="progbar" th:style="${'width:'+starScore+'%;' }"></em> <!-- 평점 style로 표기 -->
  602. </span>
  603. <em class="ico ico_besttag"></em>
  604. </div>
  605. <div class="lap">
  606. <th:block th:if="${bestReview.reviewAttachList != null and !bestReview.reviewAttachList.empty}">
  607. <div class="pic" >
  608. <th:block th:each="reviewAttach, attachStatus : ${bestReview.reviewAttachList}" th:if="${attachStatus.first}">
  609. <span class="thumb " th:classAppend="${(reviewAttach.fileGb == 'M') ? 'mov' :''}" th:style="${'background-image:url('+imgUrl+ reviewAttach.sysFileNm+');'}"></span><!-- 동영상의 썸네일일 경우 mov 클래스 추가 -->
  610. </th:block>
  611. </div>
  612. </th:block>
  613. <th:block th:unless="${bestReview.reviewAttachList != null and !bestReview.reviewAttachList.empty}">
  614. <div class="pic none" >
  615. </div>
  616. </th:block>
  617. <div class="txt_best_review">
  618. <p th:text="${bestReview.reviewContent}">옷</p>
  619. </div>
  620. </div>
  621. </a>
  622. </div>
  623. <!-- //베스트 리뷰 등록시 노출 -->
  624. </div>
  625. </div>
  626. <!-- Add Pagination -->
  627. <div class="swiper-pagination"></div>
  628. </div>
  629. </div>
  630. </div>
  631. <!-- //리뷰영역 -->
  632. <!-- 문의,사이즈정보,배송/교환/반품 -->
  633. <div class="exinfo_box">
  634. <ul>
  635. <li>
  636. <div class="ex_qna">
  637. <a href="javascript:void(0);" id="btn_pdQnaList_pop" th:onclick="cfGoodsQng([[${goodsInfo.goodsCd}]])">
  638. <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>
  639. </a>
  640. </div>
  641. </li>
  642. <li>
  643. <div class="ex_size">
  644. <a href="javascript:void(0)" id="btn_pdSizeInfo_pop" th:onclick="cfGoodsSizeInfo([[${goodsInfo.goodsCd}]],[[${goodsInfo.colorCd}]] )">
  645. <span class="tit">사이즈</span>
  646. </a>
  647. </div>
  648. </li>
  649. <li>
  650. <div class="ex_shipping">
  651. <a href="javascript:void(0)" id="btn_pdDelivery_Pop" th:onclick="cfGoodsDelivery([[${goodsInfo.goodsCd}]])">
  652. <span class="tit">배송/교환/반품</span>
  653. </a>
  654. <!-- 해당 배송정보 선택노출 -->
  655. <span class="txt_shippingfee" th:if="${goodsInfo.delvFee > 0}">배송비 <th:block th:text="${#numbers.formatInteger(goodsInfo.delvFee, 0,'COMMA')}" ></th:block>원
  656. <th:block th:if="${goodsInfo.minOrdAmt > 0}">(<th:block th:text="${#numbers.formatInteger(goodsInfo.minOrdAmt, 0,'COMMA')}" ></th:block>원 이상 무료배송)</th:block>
  657. </span>
  658. <span class="txt_shippingfee" th:if="${goodsInfo.delvFee <= 0}">무료배송</span>
  659. <span class="txt_shippingfee" th:if="${goodsInfo.quikDelvYn = 'Y'}">총알배송(오전 10시까지 주문 시)</span>
  660. <!-- //해당 배송정보 선택노출 -->
  661. </div>
  662. </li>
  663. </ul>
  664. </div>
  665. <!-- //문의,사이즈정보,배송/교환/반품 -->
  666. </div>
  667. <div class="inner" id="otherGoodsArea" style="display:none;">
  668. <div class="recommendedArea">
  669. <!-- 이상품과 함께 본 상품영역-->
  670. <div class="pd_clickother" id="goodsTogetherbArea">
  671. </div>
  672. <!-- //이상품과 함께 본 상품영역-->
  673. <!-- STYLE24의 스타일링 추천 -->
  674. <div class="pd_recommend" th:if="${lookbookList != null and !lookbookList.empty}">
  675. <h3 class="tit">STYLE24의 스타일링 추천</h3>
  676. <!-- 상품이미지pic -->
  677. <div class="area_slider pic_img" >
  678. <div class="swiper-container">
  679. <div class="swiper-wrapper">
  680. <div class="swiper-slide" th:each="lookbook, status : ${lookbookList}">
  681. <div class="page">
  682. <div class="pic">
  683. <span class="thumb" th:style="${'background-image:url(' + imgUrl+ lookbook.sysFileNm+');'}"></span>
  684. <!-- 상품피커 -->
  685. <th:block th:if="${lookbook.lookbookGoodsList != null and !lookbook.lookbookGoodsList.empty}"
  686. th:each="lookbookGoods, goodsStatus : ${lookbook.lookbookGoodsList}">
  687. <div class="item_picker" th:style="${'left:'+lookbookGoods.xlim+'%; top:'+lookbookGoods.ylim+'%;'}" >
  688. <div>
  689. <button type="button"><span class="ico ico_picker"></span></button>
  690. <div class="pick_descr">
  691. <a href="javascript:void(0)"><th:block th:text="${lookbookGoods.goodsFullNm}"></th:block></a>
  692. </div>
  693. </div>
  694. </div>
  695. <!-- //상품피커 -->
  696. </th:block>
  697. </div>
  698. </div>
  699. </div>
  700. </div>
  701. <!-- Add Pagination -->
  702. <div class="swiper-pagination"></div>
  703. </div>
  704. </div>
  705. <!-- //상품이미지pic -->
  706. <!-- 상품이미지pic 리스트 -->
  707. <div class="area_slider pic_list" th:with="ithrCd=aa , contentsLoc=bb ">
  708. <div class="box" th:each="lookbook, status : ${lookbookList}">
  709. <div class="swiper-container" th:if="${lookbook.lookbookGoodsList != null and !lookbook.lookbookGoodsList.empty}">
  710. <div class="swiper-wrapper">
  711. <div class="swiper-slide" th:each="lookbookGoods, goodsStatus : ${lookbook.lookbookGoodsList}" >
  712. <div class="item_prod" th:classappend="${(lookbookGoods.stockQty <= 0 or lookbookGoods.soldoutYn == 'Y')}? 'unable' : ''"
  713. th:attr="goodsCd=${lookbookGoods.goodsCd}, optCdInfo=${lookbookGoods.optCdInfo},
  714. minOrdQty=${lookbookGoods.minOrdQty}, goodsType=${lookbookGoods.goodsType},
  715. ithrCd=${ithrCd}, contentsLoc=${contentsLoc}"> <!-- 판매불가 상품에 unable 추가 -->
  716. <div class="item_state">
  717. <th:block th:each="optCd : ${#strings.arraySplit(lookbookGoods.optCdInfo,',')}">
  718. <input type="hidden" name="lookbookGoodsOptCd" th:value="${optCd}"/>
  719. </th:block>
  720. <button type="button" class="itemLike" th:classappend="${lookbookGoods.wishYn == 'Y'}? 'likeit active' : ''" onclick="cfnPutWishList(this);" th:attr="goodsCd=${lookbookGoods.goodsCd}, ithrCd=${ithrCd}, contentsLoc=${contentsLoc}, planDtlSq=''">관심상품 추가</button>
  721. <th:block th:if="${(lookbookGoods.stockQty <= 0 or lookbookGoods.soldoutYn == 'Y')}">
  722. <a href="javascript:void(0);" class="itemLink" >
  723. </th:block>
  724. <th:block th:unless="${(lookbookGoods.stockQty <= 0 or lookbookGoods.soldoutYn == 'Y')}">
  725. <a href="javascript:void(0);" class="itemLink" th:onclick="cfnGoToGoodsDetail([[${lookbookGoods.goodsCd}]], '',[[${ithrCd}]],[[${contentsLoc}]] )">
  726. </th:block>
  727. <div class="itemPic">
  728. <img class="vLHTC pd_img" th:src="${imgGoodsUrl+'/'+lookbookGoods.sysImgNm+'?RS=96'}" th:onerror="'this.src=\''+@{${uxImgUrl}+ '/images/pc/thumb/bg_item_none.png'}+'\';'">
  729. </div>
  730. <p class="itemBrand" th:text="${lookbookGoods.brandGroupNm}">BRAND NAME</p>
  731. <div class="itemName" th:text="${lookbookGoods.goodsFullNm}">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
  732. <p class="itemPrice" th:text="${#numbers.formatInteger(lookbookGoods.currPrice, 0,'COMMA')}">80,100</p>
  733. </a>
  734. </div>
  735. </div>
  736. </div>
  737. </div>
  738. </div>
  739. <div class="btn_group_flex">
  740. <div>
  741. <button type="button" class="btn btn_default" onclick="fnAddCartLookBookGoods(this);"><span>모두 쇼핑백 담기</span></button>
  742. </div>
  743. </div>
  744. </div>
  745. </div>
  746. <!-- //상품이미지pic 리스트 -->
  747. <script>
  748. $('#otherGoodsArea').css('display','block');
  749. </script>
  750. </div>
  751. <!-- //STYLE24의 스타일링 추천 -->
  752. <!-- 동일브랜드 추천상품 -->
  753. <div class="pd_clickother" id="goodsRecommendbArea">
  754. </div>
  755. <!-- //동일브랜드 추천상품 -->
  756. <!-- 이 상품과 비슷한 상품영역 -->
  757. <div class="pd_clickother" id="goodsLikebArea">
  758. </div>
  759. <!-- //이 상품과 비슷한 상품영역 -->
  760. </div>
  761. </div>
  762. <!-- 구매하기팝업 -->
  763. <div class="btPop btPopAuto pd_pop Purchase_pop" id="btPopAuto_back">
  764. <a class="btn btPop_close">Close </a>
  765. <div class="header btPop_head btPopAuto_head">
  766. 구매하기팝업
  767. </div>
  768. <div class="body btPop_body btPopAuto_body">
  769. <div class="option_result op1">
  770. <!-- 옵션 -->
  771. <div class="option_box">
  772. <th:block th:if="${goodsInfo.selfGoodsYn =='Y' }"> <!-- 자사상품 -->
  773. <th:block th:if="${goodsInfo.goodsType =='G056_N' }"> <!-- 일반상품 -->
  774. <div class="opt_color" th:if="${goodsOption1List != null and !goodsOption1List.empty}">
  775. <div class="opt_header">
  776. <span class="title">컬러</span>
  777. <span class="color" th:text="${goodsInfo.colorNm}">그레이</span>
  778. </div>
  779. <ul>
  780. <li th:each="goodsOption1, status : ${goodsOption1List}">
  781. <a href="javascript:void(0);" th:class="${params.colorCd == goodsOption1.optCd1}? 'on':''" th:onclick="cfnGoToGoodsDetail([[${goodsInfo.goodsCd}]], [[${goodsOption1.optCd1}]])"> <!-- 해당 컬러 상품페이지로 이동 -->
  782. <img th:src="${imgGoodsUrl+'/'+goodsOption1.sysImgNm+'?RS=50'}" alt="">
  783. </a>
  784. </li>
  785. </ul>
  786. </div>
  787. <div class="opt_size" th:if="${goodsOption2List != null and !goodsOption2List.empty}">
  788. <div class="opt_header">
  789. <span class="title">사이즈</span>
  790. <span class="size">
  791. <em class="selectOptCd1"></em>
  792. <em class="selectOptCd1addPrice"></em>
  793. </span>
  794. </div>
  795. <div class="form_field">
  796. <div th:each="goodsOption2, status : ${goodsOption2List}">
  797. <input type="radio" name="opt" th:id="${goodsOption2.optCd}" th:disabled="${goodsOption2.soldoutYn == 'Y' or goodsOption2.stockQty <= 0}"
  798. th:attr="addPrice=${goodsOption2.addPrice}, optCd1=${goodsOption2.optCd1}, optCd2=${goodsOption2.optCd2}, optCd=${goodsOption2.optCd}"
  799. th:onclick="fnViewStock(this, [[${goodsInfo.goodsCd}]],[[${goodsOption2.optCd}]],[[${goodsOption2.optCd1}]],[[${goodsOption2.optCd2}]],[[${goodsInfo.minOrdQty}]], [[${goodsInfo.maxOrdQty}]] )" />
  800. <label th:for="${goodsOption2.optCd}"><span th:text="${goodsOption2.optCd2}">90</span></label>
  801. </div>
  802. </div>
  803. </div>
  804. <!-- 해당상품 품절시 노출 -->
  805. <div class="info_restock" style="display:none;"><a href="javascript:void(0);" id="btn_pushRestock_pop" class="btn_popup" th:onclick="cfGoodsInstockAlarmInfo([[${goodsInfo.goodsCd}]], [[${goodsInfo.colorCd}]])">재입고 알림 신청</a></div>
  806. <!-- //해당상품 품절시 노출 -->
  807. <div class="opt_count">
  808. <div class="opt_header">
  809. <span class="title">수량</span>
  810. </div>
  811. <div class="number_count">
  812. <span class="minus" onclick="fnAdjustOrderEa(this);" adjust="-"><em class="sr-only">감소</em></a></span>
  813. <input type="text" name="cea" maxlength="3" style="ime-mode:disabled" th:value="${goodsInfo.minOrdQty}" onblur="fnChangeOrderEa(this)"
  814. th:attr="minOrdQty=${goodsInfo.minOrdQty}, maxOrdQty=${goodsInfo.maxOrdQty}" data-valid-type="numeric">
  815. <input type="hidden" name="coption" value="" th:attr="price=${goodsInfo.currPrice}">
  816. <span class="plus" onclick="fnAdjustOrderEa(this);" adjust="+"><em class="sr-only">추가</em></span>
  817. </div>
  818. </div>
  819. </th:block>
  820. </th:block>
  821. <th:block th:if="${goodsInfo.selfGoodsYn =='N' or goodsInfo.goodsType =='G056_S'}"> <!-- 입점상품 -->
  822. <div class="opt_select">
  823. <div class="form_wrap">
  824. <div class="form_field">
  825. <div class="select_custom option_open">
  826. <div class="combo">
  827. <div class="select">옵션을 선택해주세요</div>
  828. </div>
  829. </div>
  830. </div>
  831. </div>
  832. </div>
  833. <div class="opt_result">
  834. </div>
  835. </th:block>
  836. </div>
  837. <!-- 네이버결제 -->
  838. <div class="npay_box" style="display:none;">
  839. <div class="np_head">
  840. <div><img src="/images/mo/img_npay_txt.png" alt="NAVER 네이버 ID로 간편구매 네이버페이"></div>
  841. <div><button><img src="/images/mo/btn_npay_txt.png" alt="Npay 구매"></button></div>
  842. </div>
  843. <div class="np_body">
  844. <a href="#none"><em>[멥버십]</em>첫달 무료가입하고 추가 4%!</a>
  845. </div>
  846. </div>
  847. </div>
  848. <!-- 옵션선택팝업 -->
  849. <div class="pop_option_select">
  850. <div class="close">닫기</div>
  851. <div class="pp_body">
  852. <div class="pp_cont">
  853. <div class="opt_select">
  854. <div class="opt_header">
  855. <span class="title">옵션선택</span>
  856. <div class="check_excluding form_field">
  857. <div>
  858. <input id="soldoutSkipYn" name="soldoutSkipYn" type="checkbox" value="Y" th:onclick="fnOption1(this,[[${goodsInfo.goodsCd}]]);"><label for="soldoutSkipYn"><span>품절제외</span> </label>
  859. </div>
  860. <div class="guidance" >
  861. <!--210409_ 추가 : .guidance에 .ontoast 추가 시, toast 팝업 작동 -->
  862. <p>품절 옵션이 제외되었습니다</p>
  863. </div>
  864. <script>
  865. function getGuidance() {
  866. if($('.pop_option_select').find('input[name=soldoutSkipYn]').is(":checked")){
  867. $(".guidance").addClass("ontoast");
  868. setTimeout(function(){$(".guidance").removeClass("ontoast");}, 5000);
  869. }
  870. }
  871. </script>
  872. </div>
  873. </div>
  874. <!-- 일반상품일때 -->
  875. <th:block th:if="${goodsInfo.selfGoodsYn =='N' }"> <!-- 입점상품 -->
  876. <div class="nomOption">
  877. <div class="form_wrap">
  878. <div class="form_field" th:id="${'form_field1_'+goodsInfo.goodsCd}">
  879. <div class="select_custom item_opt1 item_opt1_1" th:classappend="${goodsInfo.goodsCd}" th:attr="id=${goodsInfo.goodsCd}">
  880. <div class="combo">
  881. <div class="select">선택</div>
  882. <ul class="list" style="display: none;">
  883. <!-- <li class="selected" th:id="|selfGoodsOpt1${goodsInfo.goodsCd}|" >선택</li> -->
  884. <th:block th:each="goodsOption, optionStatus : ${goodsOption1List}" >
  885. <li th:onclick="fnOption2([[${optionStatus.count}]], [[${goodsOption.goodsCd}]],[[${goodsOption.optCd1}]],[[${goodsInfo.minOrdQty}]], [[${goodsInfo.maxOrdQty}]])"
  886. th:attr="aria-disabled=${(goodsOption.goodsStat != 'G008_90' or goodsOption.stockQty <= 0)? 'true':''}, data-soldout=${(goodsOption.goodsStat != 'G008_90' or goodsOption.stockQty <= 0)? 'true':''}">
  887. <div th:text="${goodsOption.optCd1}">상품옵션</div>
  888. <div th:if="${goodsOption.addPrice > 0}" th:text="|${#numbers.formatInteger(goodsOption.addPrice, 0,'COMMA')}원|">0원</div>
  889. <input type="hidden" name="opt" th:value="${goodsOption.goodsCd}" th:attr="selfGoodsYn=${goodsOption.selfGoodsYn}"/>
  890. </li>
  891. </th:block>
  892. </ul>
  893. </div>
  894. </div>
  895. </div>
  896. <div class="form_field" th:id="${'form_field2_'+goodsInfo.goodsCd}">
  897. <div class="select_custom item_opt2 item_opt2_1" th:classappend="${goodsInfo.goodsCd}" disabled th:attr="qty=${goodsInfo.minOrdQty}">
  898. <div class="combo">
  899. <div class="select">선택</div>
  900. <ul class="list" th:id="|goodsOpt2${goodsInfo.goodsCd}|" >
  901. <!-- 옵션2 -->
  902. </ul>
  903. </div>
  904. </div>
  905. </div>
  906. </div>
  907. </div>
  908. </th:block>
  909. <!-- //일반상품일때 -->
  910. <!-- 셋트상품일때 -->
  911. <th:block th:if="${goodsInfo.goodsType =='G056_S' }"> <!-- 세트상품 -->
  912. <div class="setOption" th:if="${goodsComposeList != null and !goodsComposeList.empty}" >
  913. <div class="form_wrap" th:each="goodsCompose, status : ${goodsComposeList}">
  914. <div class="form_field" th:id="${'form_field1_'+goodsCompose.compsGoodsCd}">
  915. <p class="title" th:text="${goodsCompose.compsGoodsFullNm}">슬림핏</p>
  916. <div class="select_custom item_opt1" th:classappend="${'item_opt1_'+status.count +' '+goodsCompose.compsGoodsCd}" th:attr="id=${goodsCompose.compsGoodsCd}, qty=${goodsCompose.qty}"
  917. th:if="${goodsCompose.goodsOption1List != null and !goodsCompose.goodsOption1List.empty}" >
  918. <div class="combo">
  919. <div class="select">선택</div>
  920. <ul class="list" style="display: none;">
  921. <th:block th:each="goodsOption, optionStatus : ${goodsCompose.goodsOption1List}" >
  922. <!-- <li class="selected" th:id="|selfGoodsOpt1${goodsCompose.compsGoodsCd}|" th:if=${optionStatus.first}>선택</li> -->
  923. <li th:onclick="fnOption2([[${status.count}]], [[${goodsOption.goodsCd}]],[[${goodsOption.optCd1}]],[[${goodsInfo.minOrdQty}]], [[${goodsInfo.maxOrdQty}]])"
  924. th:attr="aria-disabled=${(goodsCompose.goodsStat != 'G008_90')? 'true':''}, data-soldout=${(goodsCompose.goodsStat != 'G008_90')? 'true':''}"
  925. ><th:block th:text="${goodsOption.optCd1Nm}"></th:block>
  926. <input type="hidden" name="opt" th:value="${goodsOption.goodsCd}" th:attr="optCd1=${goodsOption.optCd1},optCd1Nm=${goodsOption.optCd1Nm},optCd2=${goodsOption.optCd2},optCd=${goodsOption.optCd}"/>
  927. </li>
  928. </th:block>
  929. </ul>
  930. </div>
  931. </div>
  932. </div>
  933. <div class="form_field" th:id="${'form_field2_'+goodsCompose.compsGoodsCd}">
  934. <div class="select_custom item_opt2" th:classappend="${'item_opt2_'+status.count +' '+goodsCompose.compsGoodsCd}" disabled>
  935. <div class="combo">
  936. <div class="select">선택</div>
  937. <ul class="list" th:id="|goodsOpt2${goodsCompose.compsGoodsCd}|">
  938. </ul>
  939. </div>
  940. </div>
  941. </div>
  942. </div>
  943. </div>
  944. </th:block>
  945. </div>
  946. </div>
  947. </div>
  948. </div>
  949. <!-- //옵션선택팝업 -->
  950. </div>
  951. <div class="body btPop_foot btPopAuto_foot">
  952. <!-- 총 결재금액, 하단버튼 -->
  953. <div class="pay_box">
  954. <div class="price_box">
  955. <p class="number">
  956. 총&nbsp;<span id="goodsTotalQty">0</span>개
  957. </p>
  958. <p class="price">
  959. <span>
  960. <b id="goodsTotalPrice">0</b><em>원</em>
  961. </span>
  962. </p>
  963. </div>
  964. <div class="btn_box">
  965. <button type="button" class="gift" onclick="fnAddCart('G');" th:if="${goodsInfo.giftPackYn == 'Y'}"><span><span>선물해보세요!</span></span></button>
  966. <th:block th:if="${goodsInfo.stockQty > 0 and goodsInfo.goodsStat == 'G008_90'}">
  967. <button type="button" class="cart" id="btnGoodsWish" onclick="fnAddCart('C');"><span>쇼핑백</span></button>
  968. <button type="button" class="buyNow" id="btnGoodsCart" onclick="fnAddCart('O');"><span>바로구매</span></button>
  969. </th:block>
  970. <th:block th:unless="${goodsInfo.stockQty > 0 and goodsInfo.goodsStat == 'G008_90'}">
  971. <button class="cantbuying" style="display:block;">SOLD OUT</button>
  972. </th:block>
  973. </div>
  974. </div>
  975. </div>
  976. </div>
  977. <!-- 구매하기팝업 -->
  978. </section>
  979. <!-- ★ 컨텐츠 종료 -->
  980. </form>
  981. <!-- 바닥메뉴 -->
  982. <div class="product_floormenu"><!-- ☞☞ 제품이 품절되면 soldout클래스 추가 -->
  983. <div class="share_like">
  984. <button type="button" class="share">공유하기</button>
  985. <!-- <th:block th:include="~{web/goods/GoodsIncludeFormMob :: goodsSnsForm}"></th:block> -->
  986. <button type="button" class="like" th:classappend="${goodsInfo.wishYn == 'Y'}? 'active' : ''"
  987. onclick="cfnPutWishList(this);"
  988. th:attr="goodsCd=${params.goodsCd}, ithrCd=${params.ithrCd}, contentsLoc=${params.contentsLoc}, planDtlSq=${params.planDtlSq}">위시리스트</button>
  989. </div>
  990. <div class="prd_buy">
  991. <th:block th:if="${goodsInfo.stockQty > 0 and goodsInfo.goodsStat == 'G008_90'}">
  992. <button type="button" class="buying btPop_auto" id="btn_purchase">구매하기</button>
  993. </th:block>
  994. <th:block th:unless="${goodsInfo.stockQty > 0 and goodsInfo.goodsStat == 'G008_90'}">
  995. <button type="button" class="cantbuying" style="display:block;">SOLD OUT</button>
  996. </th:block>
  997. </div>
  998. </div>
  999. <!-- //바닥메뉴 -->
  1000. <div class="pd_pop full_pop pd_itemthumb_pop" id="pdItemThumbPop" style="display: none;" th:if="${goodsImgList != null and !goodsImgList.empty}" >
  1001. <div class="full_popup_wrap">
  1002. <h5 class="sr-only">상품썸네일 크게보기</h5>
  1003. <div class="btn_close">
  1004. <a href="javascript:void(0);" id="btn_close_itemThumbPop" onclick="cfCloseLayer('pdItemThumbPop')">닫기버튼</a>
  1005. </div>
  1006. <div class="full_pop_container">
  1007. <div id="popThumb1" class="scaleview">
  1008. <video id="video_0" loop="" autoplay="" poster="https://images.kolonmall.com/Prod_Img/JN/2021/LM15/L4PAM21041GRX_LM15.jpg" data-playing="">
  1009. <source src="https://images.kolonmall.com/Prod_Img/product_video/L4PAM21041GRX.mp4" type="video/mp4">
  1010. </video>
  1011. <div class="video_controls">
  1012. <button type="button" class="btn_video_play"><span>play</span></button>
  1013. <button type="button"class="btn_video_pause"><span>pause</span></button>
  1014. </div>
  1015. </div>
  1016. <th:block th:each="goodsImg, status : ${goodsImgList}">
  1017. <div id="popThumb2" class="scaleview" th:if="${ not (#strings.contains(goodsImg.sysImgNm,'_S1.')
  1018. or #strings.contains(goodsImg.sysImgNm,'_L1.')
  1019. or #strings.contains(goodsImg.sysImgNm,'_L2.'))}">
  1020. <img th:src="${imgGoodsUrl+'/'+goodsImg.sysImgNm+'?RS=1080'}" alt="" th:onerror="'this.src=\''+@{${uxImgUrl}+ '/images/pc/thumb/bg_item_none.png'}+'\';'">
  1021. </div>
  1022. </th:block>
  1023. </div>
  1024. </div>
  1025. </div>
  1026. </main>
  1027. <!-- 바로구매 및 선물하기 장바구니 등록 정보 저장을 위한 form -->
  1028. <form id="directOrderForm" method="POST" action="/order/noMember"></form>
  1029. <script th:src="@{'/biz/goods.js?v=' + ${#calendars.format(#calendars.createNow(), 'yyyyMMddHHmmss')}}" src="/biz/goods.js"></script>
  1030. <script th:inline="javascript">
  1031. /*<![CDATA[*/
  1032. var cateNm = "";
  1033. // 다다익선 상품
  1034. //var fnGoodsTmtbSearch = function(params) {
  1035. // gagajf.ajaxSubmit("/goods/detail/tmtb/frame", "html", "goodsTmtbArea", params);
  1036. //}
  1037. // 품절처리
  1038. var fnOptionSoldout = function(){
  1039. let $target=$("#cartForm").find('.form_field2');
  1040. let soldout = false;
  1041. for(var i=0;i<$target.find('input[name="opt"]').length;i++){
  1042. if($target.find('input[name="opt"]').eq(i).attr('disabled')) {
  1043. soldout = true;
  1044. }
  1045. }
  1046. let goodsType = [[${goodsInfo.goodsType}]];
  1047. if (soldout && goodsType == 'G056_N'&& $("#cartForm input[name=selfGoodsYn]").val() == 'Y') {
  1048. $(".info_restock").show();
  1049. }
  1050. }
  1051. //사이즈 클릭시 - 입점단품
  1052. var fnViewStockSelfNo = function(obj) {
  1053. let $obj = $(obj);
  1054. let $target = $obj.find('input[name="opt2"]');
  1055. let goodsCd = $target.attr("goodsCd");
  1056. //let currPrice = $target.attr("currPrice");
  1057. let currPrice = $('#cartForm input[name=currPrice]').val();
  1058. let optCd = $target.attr("optCd");
  1059. let optCd1 = $target.attr("optCd1");
  1060. let optCd1Nm = $target.attr("optCd1Nm");
  1061. let optCd2 = $target.attr("optCd2");
  1062. let minOrdQty = $target.attr("minOrdQty");
  1063. let maxOrdQty = $target.attr("maxOrdQty");
  1064. let addPrice = $target.attr("addPrice");
  1065. let selfGoodsYn = $target.attr("selfGoodsYn");
  1066. let optQty = minOrdQty;
  1067. let maxCnt = maxOrdQty;
  1068. let params = new Object();
  1069. params.goodsCd = goodsCd;
  1070. params.optCd = optCd;
  1071. params.optCd1 = optCd1;
  1072. params.optCd2 = optCd2;
  1073. params.selfGoodsYn = selfGoodsYn;
  1074. // 중복선택 확인 opt_result
  1075. var overlap = 0;
  1076. $('.pd_detail .opt_result .number_count').each(function() {
  1077. if ($('input[name="coption"]', this).val() == optCd) {
  1078. ++overlap;
  1079. }
  1080. });
  1081. if (overlap > 0) {
  1082. mcxDialog.alert("이미 선택하신 옵션입니다.");
  1083. return false;
  1084. }
  1085. $.get("/goods/detail/ajaxGoodsStockQty", $.param(params), function(result) {
  1086. let itemCnt = eval(result); //해당 아이템에 선택되어진 사이즈의 수량
  1087. if (maxCnt > itemCnt) {
  1088. maxCnt = itemCnt;
  1089. }
  1090. if (minOrdQty > itemCnt) {
  1091. //alert("무슨작업을 해야할가요?");
  1092. return false; //무슨작업을 해야하나?
  1093. }
  1094. //상품정보
  1095. let price = parseInt(currPrice)+ parseInt(addPrice);
  1096. let tag = "";
  1097. tag += '<div class="result_item result_'+optCd+'">\n';
  1098. tag += ' <div class="opt_header">\n';
  1099. tag += ' <div class="bundle">\n';
  1100. tag += ' <span class="item_option">'+optCd1Nm+'/'+optCd2+'</span>\n';
  1101. tag += ' </div>\n';
  1102. tag += ' </div>\n';
  1103. tag += ' <div class="number_count">\n';
  1104. tag += ' <span class="minus min_val" onclick="fnAdjustOrderEa(this);" adjust="-"><em class="sr-only">감소</em></span>\n';
  1105. tag += ' <input type="text" name="cea" optCd="'+optCd+'" maxlength="3" style="ime-mode:disabled" value="' +optQty+'" onblur="fnChangeOrderEa(this)" minOrdQty="'+minOrdQty+'" maxOrdQty="'+maxOrdQty+'" data-valid-type="numeric">\n';
  1106. tag += ' <input type="hidden" name="coption" value="'+optCd+'" goodsCd="'+goodsCd+'" price="'+currPrice+'" addPrice="'+addPrice+'">\n';
  1107. tag += ' <span class="plus" onclick="fnAdjustOrderEa(this);" adjust="+"><em class="sr-only">추가</em></span>\n';
  1108. tag += ' </div>\n';
  1109. tag += ' <div class="item_price">\n';
  1110. tag += ' <p><em id="goodsPrice">'+price.addComma() +'</em>원</p>\n';
  1111. tag += ' </div>\n';
  1112. tag += ' <button type="button" class="btn_delete_item" onclick="fnSelectGoodsDel(\''+optCd+'\')"><span>삭제</span></button>\n';
  1113. tag += '</div>\n';
  1114. let $objUp = $('.pd_detail .opt_result');
  1115. $objUp.append(tag);
  1116. fnSetTotalPrice();
  1117. $('.pop_option_select').css("display", "none");
  1118. }, "text");
  1119. }
  1120. //세트 사이즈 클릭시
  1121. function fnViewStockSet(obj, goodsCd, optCd, optCd1, optCd2, minOrdQty, maxOrdQty) {
  1122. let target=$('.select_custom.item_opt2');
  1123. let targetSize = target.length; //구성품 갯수
  1124. let goodsOption = [];
  1125. let cnt = 0;
  1126. let itemSize = 0;
  1127. let resultOptCd = "";
  1128. target.each(function(){
  1129. if (typeof ($(this).find('.select').find('input[name=opt2]').val()) != 'undefined' && !gagajf.isNull($(this).find('.select').find('input[name=opt2]').val())){
  1130. if (goodsCd != $(this).find('.select').find('input[name=opt2]').attr('goodscd')){
  1131. itemSize ++;
  1132. resultOptCd += $(this).find('.select').find('input[name=opt2]').attr('optcd') + "_";
  1133. goodsOption.push($(this).find('input[name=opt2]').val()); //goodsCd|optCd|qty
  1134. }
  1135. }
  1136. });
  1137. //내가 선택한 상품
  1138. if (typeof ($(obj).find('input[name=opt2]').val()) != 'undefined' && !gagajf.isNull($(obj).find('input[name=opt2]').val())){
  1139. itemSize ++;
  1140. }
  1141. //내가 선택하 옵션
  1142. resultOptCd += $(obj).find('input[name=opt2]').attr('optcd') + "_";
  1143. goodsOption.push($(obj).find('input[name=opt2]').val()); //goodsCd|optCd|qty
  1144. // 중복선택 확인 opt_result
  1145. let arrSelOpt = resultOptCd.split("_"); // 내가 선택한 옵션목록
  1146. let selCnt = 0;
  1147. let overlap = 0;
  1148. $('.pd_detail .opt_result .number_count').each(function() {
  1149. let val = $('input[name="coption"]', this).val();
  1150. val = val.replaceAll('result_', '');
  1151. let arrOpt = val.split("_");
  1152. for(var i=0;i<arrOpt.length;i++){
  1153. for(var j=0;j<arrSelOpt.length;j++){
  1154. if (gagajf.isNull(arrOpt[i]) || gagajf.isNull(arrSelOpt[j])) continue;
  1155. if (arrOpt[i] == arrSelOpt[j]){
  1156. selCnt++;
  1157. }
  1158. }
  1159. }
  1160. if (Number(itemSize) == Number(selCnt)) {
  1161. ++overlap;
  1162. }
  1163. });
  1164. if (overlap > 0) {
  1165. mcxDialog.alert("이미 선택하신 옵션입니다.");
  1166. return false;
  1167. }
  1168. let mGoodsCd = $("#cartForm input[name=goodsCd]").val();
  1169. let selfGoodsYn = $("#cartForm input[name=selfGoodsYn]").val();
  1170. if (targetSize == itemSize){
  1171. let maxCnt = maxOrdQty;
  1172. let optQty = minOrdQty;
  1173. let data = {arrGoodsOption : goodsOption
  1174. ,minOrdQty : minOrdQty
  1175. ,maxOrdQty : maxOrdQty
  1176. ,goodsCd : mGoodsCd
  1177. ,selfGoodsYn : selfGoodsYn
  1178. };
  1179. let jsonData = JSON.stringify(data);
  1180. gagajf.ajaxJsonSubmit('/goods/detail/ajaxGoodsSetStockQty', jsonData, function(result) {
  1181. var itemCnt = eval(result); //해당 아이템에 선택되어진 사이즈의 수량
  1182. if (maxCnt > itemCnt) {
  1183. maxCnt = itemCnt;
  1184. }
  1185. if (minOrdQty > itemCnt) {
  1186. //alert("무슨작업을 해야할가요?");
  1187. return false; //무슨작업을 해야하나?
  1188. }
  1189. //상품정보
  1190. let $selObj = $('.pop_option_select .setOption .form_wrap');
  1191. let currPrice = Number($('#cartForm input[name=currPrice]').val());
  1192. let price = currPrice;
  1193. let addPrice = 0;
  1194. resultOptCd = "";
  1195. $selObj.each(function() {
  1196. resultOptCd += $(this).find('input[name=opt2]').attr('optcd') + "_";
  1197. });
  1198. let tag = "";
  1199. tag += '<div class="result_item result_'+resultOptCd+'">\n';
  1200. tag += ' <div class="opt_header">\n';
  1201. $selObj.each(function() {
  1202. tag += ' <div class="bundle">\n';
  1203. tag += ' <span class="item_name">'+$(this).find('.title').text()+'</span>\n';
  1204. tag += ' <span class="item_option">'+$(this).find('input[name=opt2]').attr('optcd1Nm')+'/'+$(this).find('input[name=opt2]').attr('optcd2')+'</span>\n';
  1205. tag += ' <input type="hidden" name="selOption" goodsCd="'+goodsCd+'" optCd="'+optCd+'" qty="'+$(this).find('.item_opt1 ').attr('qty')+'" /> \n';
  1206. tag += ' </div>\n';
  1207. addPrice += Number($(this).find('input[name=opt2]').attr('addprice'));
  1208. });
  1209. price = Number(currPrice) + Number(addPrice);
  1210. tag += ' </div>\n';
  1211. tag += ' <div class="number_count">\n';
  1212. tag += ' <span class="minus min_val" onclick="fnAdjustOrderEa(this);" adjust="-"><em class="sr-only">감소</em></span>\n';
  1213. tag += ' <input type="text" name="cea" optCd="'+resultOptCd+'" maxlength="3" style="ime-mode:disabled" value="' +optQty+'" onblur="fnChangeOrderEa(this)" minOrdQty="'+minOrdQty+'" maxOrdQty="'+maxCnt+'" data-valid-type="numeric">\n';
  1214. tag += ' <input type="hidden" name="coption" value="'+resultOptCd+'" goodsCd="'+goodsCd+'" price="'+currPrice+'" addPrice="'+addPrice+'">\n';
  1215. tag += ' <span class="plus" onclick="fnAdjustOrderEa(this);" adjust="+"><em class="sr-only">추가</em></span>\n';
  1216. tag += ' </div>\n';
  1217. tag += ' <div class="item_price">\n';
  1218. tag += ' <p><em id="goodsPrice">'+price.addComma() +'</em>원</p>\n';
  1219. tag += ' </div>\n';
  1220. tag += ' <button type="button" class="btn_delete_item" onclick="fnSelectGoodsDel(\''+resultOptCd+'\')"><span>삭제</span></button>\n';
  1221. tag += '</div>\n';
  1222. let $objUp = null;
  1223. $objUp = $('.pd_detail .opt_result');
  1224. $objUp.append(tag);
  1225. fnSetTotalPrice();
  1226. $('.pop_option_select').css("display", "none");
  1227. });
  1228. }
  1229. }
  1230. // 옵션1 조회
  1231. var fnOption1 = function(ridx,goodsCd){
  1232. // 품절제외 여부
  1233. let optionSoldoutSkip = $('.pop_option_select').find('input[name=soldoutSkipYn]').is(":checked") ? 'Y' : 'N';
  1234. // 입점
  1235. if("N" == $("#cartForm input[name=selfGoodsYn]").val() ){
  1236. let data = {goodsCd : goodsCd
  1237. ,optionSoldoutSkip : optionSoldoutSkip
  1238. };
  1239. let jsonData = JSON.stringify(data);
  1240. fnOption1Display(ridx, jsonData );
  1241. }else if("G056_S" == $("#cartForm input[name=goodsType]").val() ){
  1242. let idx = 1;
  1243. target=$('.select_custom.item_opt1');
  1244. target.each(function(){
  1245. let data = {goodsCd : $(this).attr('id')
  1246. ,optionSoldoutSkip : optionSoldoutSkip
  1247. };
  1248. let jsonData = JSON.stringify(data);
  1249. fnOption1Display(idx, jsonData );
  1250. idx++;
  1251. });
  1252. }
  1253. }
  1254. // 옵션1 노출처리
  1255. var fnOption1Display = function(ridx, jsonData ){
  1256. gagajf.ajaxJsonSubmit('/goods/detail/option1/list', jsonData, function(result) {
  1257. if (result.dataList != null && result.dataList.length > 0) {
  1258. let tag = "";
  1259. let $obj = null;
  1260. let selfGoodsYn = 'N';
  1261. $.each(result.dataList, function(idx, item) {
  1262. if (idx == 0){
  1263. //$('.form_field .select_custom.item_opt1.' +item.goodsCd ).attr('disabled', false)
  1264. //------
  1265. tag += '<div class="select_custom item_opt1 item_opt1_'+ridx+ ' '+goodsCd+'">\n';
  1266. tag += '<div class="combo">\n';
  1267. tag += '<div class="select">선택</div>\n';
  1268. tag += '<ul class="list" style="display: none;">\n';
  1269. //------
  1270. //tag += '<li class="selected" id="selfGoodsOpt'+item.goodsCd+'">선택</li>\n';
  1271. selfGoodsYn = item.selfGoodsYn;
  1272. }
  1273. let soldoutYn = "";
  1274. if ("G008_90" != item.goodsStat || item.stockQty <= 0 || item.goodsStat != 'G008_90') soldoutYn = "true";
  1275. tag += '<li aria-disabled="'+soldoutYn+'" data-soldout="'+soldoutYn +'" onclick="fnOption2('+ ridx+', \''+ item.goodsCd+'\' , \''+ item.optCd1+'\', \''+ item.minOrdQty+'\', \''+ item.maxOrdQty+'\' )">\n';
  1276. tag += '<div>' +item.optCd1 +'</div>';
  1277. tag += '<input type="hidden" name="opt" value="'+ item.goodsCd+'" optCd1="'+ item.optCd1 +'" qty="'+ item.qty +'" />\n';
  1278. tag += '</li>\n';
  1279. });
  1280. if (!gagajf.isNull(tag)){
  1281. //------
  1282. tag += '</ul>\n';
  1283. tag += '</div>\n';
  1284. tag += '</div>\n';
  1285. //------
  1286. }
  1287. if (selfGoodsYn == "Y"){
  1288. if (ridx == 1){
  1289. $obj = $('.pop_option_select .select_custom.item_opt1.item_opt1_1');
  1290. }else if (ridx == 2){
  1291. $obj = $('.pop_option_select .select_custom.item_opt1.item_opt1_2');
  1292. }else if (ridx == 3){
  1293. $obj = $('.pop_option_select .select_custom.item_opt1.item_opt1_3');
  1294. }else if (ridx == 4){
  1295. $obj = $('.pop_option_select .select_custom.item_opt1.item_opt1_4');
  1296. }else{
  1297. $obj = $('.pop_option_select .select_custom.item_opt1.item_opt1_5');
  1298. }
  1299. }else{
  1300. $obj = $('.pop_option_select .select_custom.item_opt1.item_opt1_1');
  1301. ridx = 1; // 입점은 1로 고정
  1302. }
  1303. // $obj.html('');
  1304. // $obj.append(tag);
  1305. $obj.remove();
  1306. $('#form_field1_'+ goodsCd).append(tag);
  1307. if (selfGoodsYn == "Y"){
  1308. if (ridx == 1){
  1309. var opt_selecter01_1 = new sCombo('.pop_option_select .select_custom.item_opt1.item_opt1_1');
  1310. //$('.pop_option_select .select_custom.item_opt2.item_opt2_1 .combo .list > li').eq(0).trigger("click");
  1311. //$('.pop_option_select .select_custom.item_opt2.item_opt2_1').attr('disabled',true);
  1312. //$('.pop_option_select .select_custom.item_opt1.item_opt1_1').addClass('on');
  1313. //$('.pop_option_select .select_custom.item_opt1.item_opt1_1').find('.list').css('display','block');
  1314. }else if (ridx == 2){
  1315. var opt_selecter01_2 = new sCombo('.pop_option_select .select_custom.item_opt1.item_opt1_2');
  1316. //$('.pop_option_select .select_custom.item_opt2.item_opt2_2 .combo .list > li').eq(0).trigger("click");
  1317. //$('.pop_option_select .select_custom.item_opt2.item_opt2_2').attr('disabled',true);
  1318. }else if (ridx == 3){
  1319. var opt_selecter01_3 = new sCombo('.pop_option_select .select_custom.item_opt1.item_opt1_3');
  1320. //$('.pop_option_select .select_custom.item_opt2.item_opt2_3 .combo .list > li').eq(0).trigger("click");
  1321. //$('.pop_option_select .select_custom.item_opt2.item_opt2_3').attr('disabled',true);
  1322. }else if (ridx == 4){
  1323. var opt_selecter01_4 = new sCombo('.pop_option_select .select_custom.item_opt1.item_opt1_4');
  1324. //$('.pop_option_select .select_custom.item_opt2.item_opt2_4 .combo .list > li').eq(0).trigger("click");
  1325. //$('.pop_option_select .select_custom.item_opt2.item_opt2_4').attr('disabled',true);
  1326. }else{
  1327. var opt_selecter01_5 = new sCombo('.pop_option_select .select_custom.item_opt1.item_opt1_5');
  1328. //$('.pop_option_select .select_custom.item_opt2.item_opt2_4 .combo .list > li').eq(0).trigger("click");
  1329. //$('.pop_option_select .select_custom.item_opt2.item_opt2_4').attr('disabled',true);
  1330. }
  1331. }else{
  1332. var opt_selecter01_1 = new sCombo('.pop_option_select .select_custom.item_opt1.item_opt1_1');
  1333. //$('.pop_option_select .select_custom.item_opt2 .combo .list > li').eq(0).trigger("click");
  1334. //$('.pop_option_select .select_custom.item_opt2.item_opt2_1').attr('disabled',true);
  1335. //$('.pop_option_select .select_custom.item_opt1.item_opt1_1').addClass('on');
  1336. //$('.pop_option_select .select_custom.item_opt1.item_opt1_1').find('.list').css('display','block');
  1337. }
  1338. }
  1339. //품절 제외 메세지 처리
  1340. getGuidance();
  1341. });
  1342. }
  1343. // 옵션2 조회
  1344. var fnOption2 = function(ridx, goodsCd, optCd1, minOrdQty, maxOrdQty){
  1345. // 품절제외 여부
  1346. let optionSoldoutSkip = $('.pop_option_select').find('input[name=soldoutSkipYn]').is(":checked") ? 'Y' : 'N';
  1347. let selfGoodsYn = $("#cartForm input[name=selfGoodsYn]").val();
  1348. let data = {goodsCd : goodsCd
  1349. ,optCd1 : optCd1
  1350. ,optionSoldoutSkip : optionSoldoutSkip
  1351. ,mastrGoodsCd : $('#cartFprm input[name=goodsCd]').val()
  1352. };
  1353. let jsonData = JSON.stringify(data);
  1354. gagajf.ajaxJsonSubmit('/goods/detail/option2/list', jsonData, function(result) {
  1355. if (result.dataList != null && result.dataList.length > 0) {
  1356. let tag = "";
  1357. let $obj = null;
  1358. let qty = 0; // 구성수량
  1359. if (selfGoodsYn == "Y"){
  1360. if (ridx == 1){
  1361. $obj = $('.pop_option_select .select_custom.item_opt2.item_opt2_1');
  1362. }else if (ridx == 2){
  1363. $obj = $('.pop_option_select .select_custom.item_opt2.item_opt2_2');
  1364. }else if (ridx == 3){
  1365. $obj = $('.pop_option_select .select_custom.item_opt2.item_opt2_3');
  1366. }else if (ridx == 4){
  1367. $obj = $('.pop_option_select .select_custom.item_opt2.item_opt2_4');
  1368. }else{
  1369. $obj = $('.pop_option_select .select_custom.item_opt2.item_opt2_5');
  1370. }
  1371. qty = $obj.parent().parent().find('.select_custom').attr('qty'); // 구성수량
  1372. }else{
  1373. $obj = $('.pop_option_select .select_custom.item_opt2.item_opt2_1');
  1374. qty = $obj.attr('qty'); // 구성수량
  1375. }
  1376. $.each(result.dataList, function(idx, item) {
  1377. if (idx == 0){
  1378. //$obj = $('#goodsOpt2'+item.goodsCd);
  1379. //$obj = $('.form_field .select_custom.item_opt2.item_opt2_1');
  1380. // $obj.html('');
  1381. $obj.remove();
  1382. // $('.form_field .select_custom.item_opt2.' +item.goodsCd ).attr('disabled', false)
  1383. //------
  1384. tag += '<div class="select_custom item_opt2 item_opt2_'+ridx+ ' '+goodsCd+'">\n';
  1385. tag += '<div class="combo">\n';
  1386. tag += '<div class="select">선택</div>\n';
  1387. tag += '<ul class="list">\n';
  1388. //------
  1389. //tag += '<li class="selected" id="goodsOpt2'+item.goodsCd+'">선택</li>\n';
  1390. }
  1391. let soldoutYn = "";
  1392. let saleQty = (Number(qty) * Number(minOrdQty));
  1393. if ("Y" == item.soldoutYn || Number(item.stockQty) <= Number(saleQty))soldoutYn = "true";
  1394. if (selfGoodsYn == "Y"){
  1395. tag += '<li aria-disabled="'+soldoutYn+'" data-soldout="'+soldoutYn +'" onclick="fnViewStockSet(this, \''+ item.goodsCd+'\' , \''+ item.optCd+'\' , \''+ item.optCd1+'\' , \''+ item.optCd2+'\', \''+ minOrdQty+'\', \''+ maxOrdQty+'\')">\n';
  1396. }else{
  1397. tag += '<li aria-disabled="'+soldoutYn+'" data-soldout="'+soldoutYn +'" onclick="fnViewStockSelfNo(this)">\n';
  1398. }
  1399. tag += item.optCd2;
  1400. if (item.addPrice > 0){
  1401. tag += ' (+'+ item.addPrice.addComma() +'원)\n';
  1402. }else{
  1403. }
  1404. tag += '<input type="hidden" name="opt2" value="'+ item.goodsCd+'|'+item.optCd +'|'+qty +'" goodsCd="'+item.goodsCd+'" currPrice="'+ item.currPrice +'" addPrice="'+item.addPrice+'" optCd="'+item.optCd+'" optCd1="'+item.optCd1+'" optCd1Nm="'+item.optCd1Nm+'" optCd2="'+item.optCd2+'" minOrdQty="'+minOrdQty+'" maxOrdQty="'+maxOrdQty+'" selfGoodsYn="'+selfGoodsYn+'"/>\n';
  1405. tag += '</li>\n';
  1406. });
  1407. if (!gagajf.isNull(tag)){
  1408. //------
  1409. tag += '</ul>\n';
  1410. tag += '</div>\n';
  1411. tag += '</div>\n';
  1412. //------
  1413. }
  1414. // $obj.append(tag);
  1415. $('#form_field2_'+ goodsCd).append(tag);
  1416. if (selfGoodsYn == "Y"){
  1417. if (ridx == 1){
  1418. var opt_selecter02_1 = new sCombo('.pop_option_select .select_custom.item_opt2.item_opt2_1');
  1419. //$('.pop_option_select .select_custom.item_opt2.item_opt2_1').addClass('on');
  1420. //$('.pop_option_select .select_custom.item_opt2.item_opt2_1').find('.list').css('display','block');
  1421. }else if (ridx == 2){
  1422. var opt_selecter02_2 = new sCombo('.pop_option_select .select_custom.item_opt2.item_opt2_2');
  1423. //$('.pop_option_select .select_custom.item_opt2.item_opt2_2').addClass('on');
  1424. //$('.pop_option_select .select_custom.item_opt2.item_opt2_2').find('.list').css('display','block');
  1425. }else if (ridx == 3){
  1426. var opt_selecter02_3 = new sCombo('.pop_option_select .select_custom.item_opt2.item_opt2_3');
  1427. //$('.pop_option_select .select_custom.item_opt2.item_opt2_3').addClass('on');
  1428. //$('.pop_option_select .select_custom.item_opt2.item_opt2_3').find('.list').css('display','block');
  1429. }else if (ridx == 4){
  1430. var opt_selecter02_4 = new sCombo('.pop_option_select .select_custom.item_opt2.item_opt2_4');
  1431. //$('.pop_option_select .select_custom.item_opt2.item_opt2_4').addClass('on');
  1432. //$('.pop_option_select .select_custom.item_opt2.item_opt2_4').find('.list').css('display','block');
  1433. }else{
  1434. var opt_selecter02_5 = new sCombo('.pop_option_select .select_custom.item_opt2.item_opt2_5');
  1435. //$('.pop_option_select .select_custom.item_opt2.item_opt2_5').addClass('on');
  1436. //$('.pop_option_select .select_custom.item_opt2.item_opt2_5').find('.list').css('display','block');
  1437. }
  1438. }else{
  1439. var opt_selecter02_1 = new sCombo('.pop_option_select .select_custom.item_opt2.item_opt2_1');
  1440. //$('.pop_option_select .select_custom.item_opt2.item_opt2_1').addClass('on');
  1441. //$('.pop_option_select .select_custom.item_opt2.item_opt2_1').find('.list').css('display','block');
  1442. }
  1443. }
  1444. });
  1445. }
  1446. // 수량 변경 클릭
  1447. var fnAdjustOrderEa = function(obj) {
  1448. let $obj = $(obj);
  1449. let $target = $obj.parent().children('input[name="cea"]');
  1450. let ea =parseInt($target.val());
  1451. let minOrdQty = 0;
  1452. let maxOrdQty = 0;
  1453. if ("Y" == $("#cartForm input[name=selfGoodsYn]").val() && "G056_N" == $("#cartForm input[name=goodsType]").val()){
  1454. if(gagajf.isNull($("#cartForm input[name=optCd2]").val())){
  1455. mcxDialog.alert("사이즈를 선택해 주세요.");
  1456. return false;
  1457. }
  1458. minOrdQty = parseInt($("#cartForm input[name=minOrdQty]").val());
  1459. maxOrdQty = parseInt($("#cartForm input[name=maxOrdQty]").val());
  1460. }else{
  1461. minOrdQty = parseInt( $target.attr('minOrdQty'));
  1462. maxOrdQty = parseInt( $target.attr('maxOrdQty'));
  1463. }
  1464. if ($obj.attr('adjust') == '-') --ea;
  1465. else ++ea;
  1466. //var maxOrdQty = $("#cartForm input[name=maxOrdQty]").val();
  1467. //if (maxOrdQty && ea > maxOrdQty) ea = maxOrdQty;
  1468. if (ea.toString().length > maxOrdQty) --ea;
  1469. if (ea < 1) ea = minOrdQty;
  1470. $target.val(ea);
  1471. $target.attr('value', ea);
  1472. fnChangeOrderEa($target[0]);
  1473. }
  1474. //옵션 갯수 변경
  1475. var fnChangeOrderEa = function(obj) {
  1476. let $obj = $(obj);
  1477. let $target = $obj.parent().children('input[name="cea"]');
  1478. let ea = parseInt($obj.val());
  1479. let optCd = $(obj).attr('optCd');
  1480. let minOrdQty = parseInt($("#cartForm input[name=minOrdQty]").val());
  1481. let maxOrdQty = parseInt($("#cartForm input[name=maxOrdQty]").val());
  1482. if ("Y" == $("#cartForm input[name=selfGoodsYn]").val() && "G056_N" == $("#cartForm input[name=goodsType]").val()){
  1483. if(gagajf.isNull($("#cartForm input[name=optCd2]").val())){
  1484. mcxDialog.alert("사이즈를 선택해 주세요.");
  1485. return false;
  1486. }
  1487. }else{
  1488. maxOrdQty = parseInt($(obj).attr('maxOrdQty'));
  1489. minOrdQty = parseInt($(obj).attr('minOrdQty'));
  1490. optCd = $(obj).attr('optCd');
  1491. }
  1492. let alertMsg = '';
  1493. if (ea < minOrdQty) {
  1494. alertMsg = minOrdQty+"개 부터 구매 가능합니다.";;
  1495. ea = minOrdQty;
  1496. }
  1497. if (ea > maxOrdQty) {
  1498. alertMsg = maxOrdQty+"개 까지만 구매 가능합니다.";
  1499. ea = maxOrdQty;
  1500. }
  1501. if ("Y" == $("#cartForm input[name=selfGoodsYn]").val() && "G056_N" == $("#cartForm input[name=goodsType]").val()){
  1502. $("#cartForm input[name=cea]").val(ea);
  1503. $("#cartForm input[name=ordQty]").val(ea);
  1504. }
  1505. //obj.value = ea;
  1506. $target.val(ea);
  1507. $target.attr('value', ea);
  1508. if (alertMsg != ''){
  1509. mcxDialog.alert(alertMsg);
  1510. return false;
  1511. }
  1512. if (ea <= 1){
  1513. $('.number_count').find('.minus').addClass('min_val');
  1514. }else{
  1515. $('.number_count').find('.minus').removeClass('min_val');
  1516. }
  1517. if ("Y" == $("#cartForm input[name=selfGoodsYn]").val() && "G056_N" == $("#cartForm input[name=goodsType]").val()){
  1518. }else{
  1519. let addPrice = parseInt($obj.parent().find('input[name="coption"]').attr('addprice'));
  1520. let goodsPrice = parseInt($obj.parent().find('input[name="coption"]').attr('price'));
  1521. let totalPrice = ((goodsPrice+addPrice) * ea);
  1522. $('.opt_result .result_'+optCd+' .number_count').find('input[name=cea]').val(ea);
  1523. $('.opt_result .result_'+optCd+' .number_count').find('input[name=cea]').attr('value',ea);
  1524. $('.opt_result .result_'+optCd+' .item_price').find('em').text(totalPrice.addComma());
  1525. }
  1526. fnSetTotalPrice();
  1527. }
  1528. //합계 계산
  1529. var fnSetTotalPrice = function() {
  1530. //let f = document.cartForm;
  1531. let totalEa = 0;
  1532. let totalPrice = 0;
  1533. $('input[name="cea"]').each(function() {
  1534. let ea = parseInt($(this).val());
  1535. let addPrice = 0;
  1536. let target=$('.select_custom.item_opt2');
  1537. target.each(function() {
  1538. if (typeof ($(this).find('input[name=opt2]').val()) != 'undefined' && !gagajf.isNull($(this).find('input[name=opt2]').val())){
  1539. addPrice += Number($(this).find('input[name=opt2]').attr('addPrice'));
  1540. }
  1541. });
  1542. let goodsPrice = parseInt($(this).parent().find('input[name="coption"]').attr('price'));
  1543. totalEa += ea;
  1544. if (goodsPrice > 0) {
  1545. totalPrice += ((goodsPrice+addPrice) * ea);
  1546. }
  1547. });
  1548. $('#goodsTotalQty').html(totalEa.addComma());
  1549. $('#goodsTotalPrice').html(totalPrice.addComma());
  1550. }
  1551. // 선택상품 삭제
  1552. var fnSelectGoodsDel = function(optCd){
  1553. $('.result_'+optCd).remove();
  1554. fnSetTotalPrice();
  1555. }
  1556. //장바구니담기
  1557. var fnAddCart = function(btnType){
  1558. let params = [];
  1559. let goodsType = $("#cartForm input[name=goodsType]").val();
  1560. let selfGoodsYn = $("#cartForm input[name=selfGoodsYn]").val();
  1561. if (goodsType == 'G056_N' && selfGoodsYn == 'Y' ){
  1562. if (gagajf.isNull($("#cartForm input[name=optCd2]").val())) {
  1563. mcxDialog.alert("사이즈를 선택해 주세요.");
  1564. return;
  1565. }
  1566. let compsList = [];
  1567. let obj = new Object();
  1568. obj.goodsCd = $("#cartForm input[name=goodsCd]").val();
  1569. obj.optCd = $("#cartForm input[name=optCd]").val();
  1570. obj.goodsQty = $("#cartForm input[name=ordQty]").val();
  1571. obj.goodsType = $("#cartForm input[name=goodsType]").val();
  1572. obj.cartGb = btnType;
  1573. obj.afLinkCd =$("#cartForm input[name=afLinkCd]").val();
  1574. obj.ithrCd =$("#cartForm input[name=ithrCd]").val();
  1575. obj.contentsLoc =$("#cartForm input[name=contentsLoc]").val();
  1576. obj.planDtlSq = $("#cartForm input[name=planDtlSq]").val();
  1577. compsList.push(obj);
  1578. // 장바구니담기
  1579. cfnAddCart(compsList);
  1580. }else {
  1581. let cartGoodsList = [];
  1582. let target = $('#cartForm input[name=cea]');
  1583. if (goodsType == 'G056_N'){
  1584. let compsList = [];
  1585. target.each(function() {
  1586. let ea = parseInt($(this).val());
  1587. let goodsCd = $(this).parent().find('input[name="coption"]').attr('goodscd');
  1588. let optCd = $(this).parent().find('input[name="coption"]').val();
  1589. //let addPrice = parseInt($(this).parent().find('input[name="coption"]').attr('addprice'));
  1590. //let goodsPrice = parseInt($(this).parent().find('input[name="coption"]').attr('price'));
  1591. var obj = new Object();
  1592. obj.cartGb = btnType;
  1593. obj.goodsType = $("#cartForm input[name=goodsType]").val();
  1594. obj.goodsCd = goodsCd
  1595. obj.optCd = optCd;
  1596. obj.goodsQty = ea;
  1597. obj.afLinkCd =$("#cartForm input[name=afLinkCd]").val();
  1598. obj.ithrCd =$("#cartForm input[name=ithrCd]").val();
  1599. obj.contentsLoc =$("#cartForm input[name=contentsLoc]").val();
  1600. obj.planDtlSq = $("#cartForm input[name=planDtlSq]").val();
  1601. compsList.push(obj);
  1602. });
  1603. // 장바구니담기
  1604. cfnAddCart(compsList);
  1605. }else{ // 세트
  1606. target.each(function() {
  1607. let compsList = [];
  1608. let goodsList = {
  1609. cartCompsList : new Array()
  1610. }
  1611. let ea = parseInt($(this).val());
  1612. let targetItem = $(this).parent().parent().find('.bundle'); // 구성상품
  1613. targetItem.each(function() {
  1614. var obj = new Object();
  1615. obj.cartGb = btnType;
  1616. obj.goodsType = $("#cartForm input[name=goodsType]").val();
  1617. obj.goodsCd = $("#cartForm input[name=goodsCd]").val();
  1618. obj.itemCd = $(this).find('input[name=selOption]').attr('goodsCd');
  1619. obj.optCd = $(this).find('input[name=selOption]').attr('optCd');
  1620. obj.goodsQty = ea;
  1621. obj.afLinkCd =$("#cartForm input[name=afLinkCd]").val();
  1622. obj.ithrCd =$("#cartForm input[name=ithrCd]").val();
  1623. obj.contentsLoc =$("#cartForm input[name=contentsLoc]").val();
  1624. obj.planDtlSq = $("#cartForm input[name=planDtlSq]").val();
  1625. compsList.push(obj);
  1626. });
  1627. goodsList.cartCompsList = compsList;
  1628. cartGoodsList.push(goodsList);
  1629. });
  1630. // 장바구니담기
  1631. cfnAddCart(cartGoodsList);
  1632. }
  1633. }
  1634. }
  1635. // 룩북속 상품 쇼핑백 담기
  1636. var fnAddCartLookBookGoods = function(obj){
  1637. let $obj = $(obj);
  1638. let $target = $obj.parent().parent().parent().find('.swiper-container').find('.item_prod');
  1639. let goodsSize = $target.length;
  1640. let btnType = "C";
  1641. let params = [];
  1642. let goodsIdx = 0;
  1643. $target.each(function(){
  1644. goodsIdx ++;
  1645. if ($(this).hasClass('unable')) {
  1646. }else{
  1647. // 옵션확인
  1648. let goodsCnt = $(this).find('input[name=lookbookGoodsOptCd]').length;
  1649. if (goodsCnt == 1){
  1650. let arrOpt = $(this).find('input[name=lookbookGoodsOptCd]').val();
  1651. let arrOptInfo = arrOpt.split(':');
  1652. let obj = new Object();
  1653. obj.goodsCd = $(this).attr("goodsCd");
  1654. //obj.optCd = $(this).attr("optCd");
  1655. obj.optCd = arrOptInfo[1];
  1656. obj.goodsQty = $(this).attr("minOrdQty");
  1657. obj.goodsType = $(this).attr("goodsType");
  1658. obj.cartGb = btnType;
  1659. obj.afLinkCd = '';
  1660. obj.ithrCd = $(this).attr("ithrCd");
  1661. obj.contentsLoc = $(this).attr("contentsLoc");
  1662. obj.planDtlSq = '';
  1663. obj.multiGoodsGb = 'O' // 단품, 세트 혼합쇼핑백처리일경우, 마지막이 아닌경우는 'O'아니고 NULL 아닌값
  1664. if (goodsIdx == goodsSize){
  1665. obj.multiGoodsGb = 'E' // 단품, 세트 혼합쇼핑백처리일경우, 마지막이 아닌경우는 'O'아니고 NULL 아닌값
  1666. }
  1667. params.push(obj);
  1668. // 장바구니담기
  1669. cfnAddCart(params);
  1670. }else{
  1671. let $goods = $(this);
  1672. let cartGoodsList = [];
  1673. let compsList = [];
  1674. let goodsList = {
  1675. cartCompsList : new Array()
  1676. }
  1677. let arrInfo = $(this).find('input[name=lookbookGoodsOptCd]').val().split(','); // 상품코드단위
  1678. $.each(arrInfo, function(idx, item) {
  1679. let arrOptInfo = item.split(':');
  1680. let obj = new Object();
  1681. obj.cartGb = btnType;
  1682. obj.goodsType = $goods.attr("goodsType");
  1683. obj.goodsCd = $goods.attr("goodsCd");
  1684. obj.itemCd =arrOptInfo[0];
  1685. obj.optCd = arrOptInfo[1];
  1686. obj.goodsQty = $goods.attr("minOrdQty");
  1687. obj.afLinkCd = '';
  1688. obj.ithrCd = $goods.attr("ithrCd");
  1689. obj.contentsLoc = $goods.attr("contentsLoc");
  1690. obj.planDtlSq = ''
  1691. obj.multiGoodsGb = 'O' // 단품, 세트 혼합쇼핑백처리일경우, 마지막이 아닌경우는 'O'아니고 NULL 아닌값
  1692. if (goodsIdx == goodsSize){
  1693. obj.multiGoodsGb = 'E' // 단품, 세트 혼합쇼핑백처리일경우, 마지막이 아닌경우는 'O'아니고 NULL 아닌값
  1694. }
  1695. compsList.push(obj);
  1696. });
  1697. goodsList.cartCompsList = compsList;
  1698. cartGoodsList.push(goodsList);
  1699. // 장바구니담기
  1700. cfnAddCart(cartGoodsList);
  1701. }
  1702. }
  1703. });
  1704. // 장바구니담기
  1705. /* if (params.length > 0){
  1706. cfnAddCart(params);
  1707. } */
  1708. }
  1709. $(document).ready( function() {
  1710. $('.timer_box').css('display', 'none');
  1711. var params = new Object();
  1712. params.goodsCd = [[${params.goodsCd}]];
  1713. params.viewDt = [[${params.viewDt}]];
  1714. params.preview = [[${params.preview}]];
  1715. params.adminYn = [[${params.adminYn}]];
  1716. params.goodsType = [[${params.goodsType}]];
  1717. params.supplyCompCd = [[${params.supplyCompCd}]];
  1718. params.brandGroupNm = [[${goodsInfo.brandGroupNm}]];
  1719. // 함께본 상품(ajax html)
  1720. params.goodsOtherGb = "together";
  1721. params.ithrCd = "tmtb";
  1722. params.contentsLoc = "tmtb";
  1723. fnGoodsTogetherSearch(params);
  1724. // 추천 상품(ajax html)
  1725. params.goodsOtherGb = "recommend";
  1726. params.ithrCd = "tmtb";
  1727. params.contentsLoc = "tmtb";
  1728. fnGoodsRecommendSearch(params);
  1729. // 비슷한 상품(ajax html)
  1730. params.goodsOtherGb = "like";
  1731. params.ithrCd = "tmtb";
  1732. params.contentsLoc = "tmtb";
  1733. fnGoodsLikeSearch(params);
  1734. var opt_selecter01_1 = new sCombo('.pop_option_select .select_custom.item_opt1.item_opt1_1');
  1735. var opt_selecter01_2 = new sCombo('.pop_option_select .select_custom.item_opt1.item_opt1_2');
  1736. var opt_selecter01_3 = new sCombo('.pop_option_select .select_custom.item_opt1.item_opt1_3');
  1737. var opt_selecter01_4 = new sCombo('.pop_option_select .select_custom.item_opt1.item_opt1_4');
  1738. var opt_selecter01_5 = new sCombo('.pop_option_select .select_custom.item_opt1.item_opt1_5');
  1739. if (!gagajf.isNull([[${goodsInfo.socialSq}]])){
  1740. $('.timer_box').css('display', 'block');
  1741. /* 행사 남은시간 */
  1742. function promotionTimer() {
  1743. var endTime = new Date([[${goodsInfo.socialEddt}]]); // 남은시간 지정 30 March 2021 9:56:00 GMT+0900
  1744. endTime = (Date.parse(endTime) / 1000);
  1745. var now = new Date();
  1746. now = (Date.parse(now) / 1000);
  1747. var timeLeft = endTime - now;
  1748. var days = Math.floor(timeLeft / 86400);
  1749. var hours = Math.floor((timeLeft - (days * 86400)) / 3600);
  1750. var minutes = Math.floor((timeLeft - (days * 86400) - (hours * 3600 )) / 60);
  1751. var seconds = Math.floor((timeLeft - (days * 86400) - (hours * 3600) - (minutes * 60)));
  1752. if (hours < '10') { hours = '0' + hours; }
  1753. if (minutes < '10') { minutes = '0' + minutes; }
  1754. if (seconds < '10') { seconds = '0' + seconds; }
  1755. if (Number(days) > 0 ){
  1756. hours = Number(hours) + (Number(days) * 24);
  1757. }
  1758. $('#d-hours').html(hours);
  1759. $('#d-minutes').html(minutes);
  1760. $('#d-seconds').html(seconds);
  1761. }
  1762. setInterval(function() { promotionTimer(); }, 1000);
  1763. }
  1764. //상품상세정보 더보기
  1765. $(document).on('click','.pd_descrp .btn_more_box button',function(e){
  1766. $('.pd_descrp .cont_body').toggleClass('on');
  1767. $(this).toggleClass('active');
  1768. $(this).parent('.btn_more_box').toggleClass('covered');
  1769. var descrpToggle = $(this).find('span');
  1770. $(descrpToggle).text($(descrpToggle).text() == '상세정보 더보기' ? '상세정보 접기' : '상세정보 더보기');
  1771. return false;
  1772. });
  1773. //슬라이드 - 함께하면 할인되는 다다익선 상품
  1774. var togetherItemSwiper = new Swiper('.pd .pd_together .area_slider .swiper-container', {
  1775. slidesPerView: 3,
  1776. spaceBetween: 8,
  1777. });
  1778. //슬라이드 - 베스트리뷰
  1779. var riviewSwiper = new Swiper('.riview_box .area_slider .swiper-container', {
  1780. observer: true,
  1781. observeParents: true,
  1782. slidesPerView: 1,
  1783. spaceBetween: 8,
  1784. loop: true,
  1785. pagination: {
  1786. el: '.swiper-pagination',
  1787. type: 'fraction',
  1788. },
  1789. });
  1790. //슬라이드 - 제품사진
  1791. var thumbswiper = new Swiper('.pd .thumb_box .area_slider .swiper-container', {
  1792. slidesPerView:1,
  1793. pagination: {
  1794. el: '.swiper-pagination',
  1795. type: 'fraction',
  1796. },
  1797. });
  1798. //슬라이드 - STYLE24의 스타일링 추천
  1799. var rcmdPicimgSwiper = new Swiper('.pd .pd_recommend .area_slider.pic_img .swiper-container', {
  1800. slidesPerView: 1,
  1801. spaceBetween: 0,
  1802. pagination: {
  1803. el: '.swiper-pagination',
  1804. type: 'fraction',
  1805. },
  1806. });
  1807. var rcmdPiclistSwiper = new Swiper('.pd .pd_recommend .area_slider.pic_list .swiper-container', {
  1808. observer: true,
  1809. observeParents: true,
  1810. slidesPerView: 3,
  1811. spaceBetween: 8,
  1812. });
  1813. $(".pic_list > div").hide();
  1814. $(".pic_list > div").eq(0).fadeIn();
  1815. rcmdPicimgSwiper.on('slideChange', function () {
  1816. var pic_index=this.activeIndex;
  1817. $(".pic_list > div").hide();
  1818. $(".pic_list > div").eq(pic_index).fadeIn();
  1819. });
  1820. //슬라이드 - 베스트리뷰팝업
  1821. var bestreviewdetailSwiper = new Swiper('.pd_bestreviewdetail_pop .area_slider .swiper-container', {
  1822. observer: true,
  1823. observeParents: true,
  1824. slidesPerView: 1,
  1825. pagination: {
  1826. el: '.swiper-pagination',
  1827. type: 'fraction',
  1828. },
  1829. });
  1830. //슬라이드 - 포토,영상리뷰팝업
  1831. var photoreviewdetailSwiper = new Swiper('.pd_photoreviewdetail_pop .area_slider .swiper-container', {
  1832. observer: true,
  1833. observeParents: true,
  1834. slidesPerView: 1,
  1835. pagination: {
  1836. el: '.swiper-pagination',
  1837. type: 'fraction',
  1838. },
  1839. });
  1840. $(document).on('click','.pd_detail .thumb_box',function(e){
  1841. $('#pdItemThumbPop').css("display", "block");
  1842. return false;
  1843. })
  1844. $(document).on('click','.pd_bestreviewdetail_pop .thumblist ul li',function(e){
  1845. $(this).parents(".swiper-slide").find(".review > .pic > .thumb").empty();
  1846. $(this).parents(".swiper-slide").find(".thumblist ul li .pic").removeClass('active');
  1847. $(this).find(".pic").addClass('active');
  1848. var thumbIndex = $(this).index();
  1849. var thumbImg = $(this).find('.pic .thumb').attr('style');
  1850. var thumbImgSrc = thumbImg.split("background-image:url(")[1];
  1851. thumbImgHtml = "<img src="+ thumbImgSrc +" alt=''>";
  1852. $(this).parents(".swiper-slide").find(".review > .pic > .thumb").append(thumbImgHtml);
  1853. return false;
  1854. });
  1855. // 포토,베스트리뷰숨김
  1856. var review_open=$(".btn_review_open");
  1857. $(document).on('click','.btn_review_open',function(e){
  1858. $(this).toggleClass('active');
  1859. $(this).next(".review_list").toggleClass('active');
  1860. return false;
  1861. });
  1862. //팝업 - 구매하기 > 옵션선택 > 옵션셀렉트팝업
  1863. $(document).on('click','.Purchase_pop .option_result .option_open',function(e){
  1864. $(".Purchase_pop .pop_option_select").show();
  1865. //$(".Purchase_pop .pop_option_select").find('.select_custom.item_opt1.item_opt1_1').addClass('on');
  1866. //$(".Purchase_pop .pop_option_select").find('.select_custom.item_opt1.item_opt1_1 .list').css('display','block');
  1867. return false;
  1868. });
  1869. $(document).on('click','.Purchase_pop .close',function(e){
  1870. $(".Purchase_pop .pop_option_select").hide();
  1871. return false;
  1872. });
  1873. //관심상품 등록
  1874. $(document).on('click','.pd .itemLike',function(e){
  1875. $(this).toggleClass('active');
  1876. return false;
  1877. });
  1878. fnOptionSoldout();
  1879. // 광고 스크립트용
  1880. var goodsNavigation = [[${goodsNavigation}]];
  1881. var cate1Nm = "";
  1882. var cate2Nm = "";
  1883. var cate3Nm = "";
  1884. var cate4Nm = "";
  1885. var cate5Nm = "";
  1886. if (!gagajf.isNull(goodsNavigation)) {
  1887. cate1Nm = goodsNavigation.cate1Nm;
  1888. cate2Nm = goodsNavigation.cate2Nm;
  1889. cate3Nm = goodsNavigation.cate3Nm;
  1890. cate4Nm = goodsNavigation.cate4Nm;
  1891. cate5Nm = goodsNavigation.cate3Nm;
  1892. if (!gagajf.isNull(cate1Nm)) {
  1893. cateNm += cate1Nm;
  1894. }
  1895. if (!gagajf.isNull(cate2Nm)) {
  1896. cateNm += ' > ' + cate2Nm;
  1897. }
  1898. if (!gagajf.isNull(cate3Nm)) {
  1899. cateNm += ' > ' + cate3Nm;
  1900. }
  1901. if (!gagajf.isNull(cate4Nm)) {
  1902. cateNm += ' > ' + cate4Nm;
  1903. }
  1904. if (!gagajf.isNull(cate5Nm)) {
  1905. cateNm += ' > ' + cate5Nm;
  1906. }
  1907. }
  1908. // 광고 스크립트용
  1909. var snsGoodsImg = _uploadGoodsUrl + [[${goodsInfo.sysImgNm}]];
  1910. var snsUrl = location.protocol + _PAGE_GOODS_DETAIL + params.goodsCd +'&colorCd =' + params.colorCd ;
  1911. var snsGoodsFullNm = [[${goodsInfo.goodsFullNm}]];
  1912. <!-- 페이스북 카카오스토리 연동 관련 메타태그 -->
  1913. $("meta[property='og:url']").attr('content', snsUrl);
  1914. $("meta[property='og:title']").attr('content', snsGoodsFullNm);
  1915. $("meta[property='og:description']").attr('content', snsGoodsFullNm);
  1916. $("meta[property='og:image']").attr('content', snsGoodsImg);
  1917. <!-- 트위터 관련 메타태그 -->
  1918. $("meta[name='twitter:url']").attr('content', snsUrl);
  1919. $("meta[name='twitter:title']").attr('content', snsGoodsFullNm);
  1920. $("meta[name='twitter:description']").attr('content', snsGoodsFullNm);
  1921. $("meta[name='twitter:image']").attr('content', snsGoodsImg);
  1922. // 추천솔류션 meta 설정
  1923. $("meta[property='eg:type']").attr('content',"product");
  1924. $("meta[property='eg:cuid']").attr('content',eglqueueCuid);
  1925. $("meta[property='eg:itemId']").attr('content', [[${goodsInfo.goodsCd}]] );
  1926. $("meta[property='eg:itemName']").attr('content',[[${goodsInfo.goodsFullNm}]] );
  1927. $("meta[property='eg:itemImage']").attr('content', snsGoodsImg);
  1928. $("meta[property='eg:itemUrl']").attr('content',snsUrl);
  1929. $("meta[property='eg:originalPrice']").attr('content',[[${goodsInfo.listPrice}]]);
  1930. $("meta[property='eg:salePrice']").attr('content',[[${goodsInfo.currPrice}]]);
  1931. $("meta[property='eg:category1']").attr('content',cate1Nm);
  1932. $("meta[property='eg:category2']").attr('content',cate2Nm);
  1933. $("meta[property='eg:category3']").attr('content',cate3Nm);
  1934. $("meta[property='eg:category4']").attr('content',cate4Nm);
  1935. $("meta[property='eg:category5']").attr('content',cate5Nm);
  1936. $("meta[property='eg:brandId']").attr('content',[[${goodsInfo.brandGroupNo}]]);
  1937. $("meta[property='eg:brandName']").attr('content',[[${goodsInfo.brandGroupNm}]]);
  1938. $("meta[property='eg:regDate']").attr('content',[[${goodsInfo.regDt}]].toDate("YYYYMMDDHHmmss").format("YYYY-MM-DDTHH:mm:ssZ"));
  1939. $("meta[property='eg:updateDate']").attr('content',[[${goodsInfo.updDt}]].toDate("YYYYMMDDHHmmss").format("YYYY-MM-DDTHH:mm:ssZ"));
  1940. $("meta[property='eg:stock']").attr('content',"");
  1941. $("meta[property='eg:state']").attr('content',[[${goodsInfo.goodsStatNm}]]);
  1942. $("meta[property='eg:description']").attr('content',null);
  1943. $("meta[property='eg:extraImage']").attr('content',null);
  1944. $("meta[property='eg:locale']").attr('content',"KR");
  1945. $("meta[property='eg:isNew']").attr('content',([[${goodsInfo.formalGb}]] == 'G009_10')? 'True' :'False');
  1946. $("meta[property='eg:etc1']").attr('content', [[${goodsInfo.selfGoodsYn}]]);
  1947. // ep 쿠폰확인
  1948. fnEpCouponDown([[${afLinkCd}]], [[${params.goodsCd}]], 1);
  1949. $('.Purchase_pop .btPop_close').click(function(){
  1950. $('html, body').css({'overflow': 'visible', 'height': '100%'});
  1951. $('.container').removeClass('btPop_open');
  1952. autome.style.top = 100 + "%";
  1953. return false;
  1954. });
  1955. });
  1956. // 상품상세 asis html 이지미 경로 수정
  1957. window.onload = function(){
  1958. $(".pd_descrp .cont_body").find('img').each(function() {
  1959. let tmpImgSrc = $(this).attr('src');
  1960. if (tmpImgSrc.indexOf('Upload') == 1 ){ // /Upload
  1961. $(this).attr('src' , tmpImgSrc.replace('/Upload', _imgUrl+"/Local"));
  1962. }
  1963. });
  1964. /*
  1965. let goodsVideoList = [[${goodsVideoList}]];
  1966. let videoFlag = false;
  1967. if (goodsVideoList != null){
  1968. $.each(goodsVideoList, function(idx, goodsVideo) {
  1969. if ("M" == goodsVideo.videoGb){
  1970. videoFlag = true;
  1971. return false;
  1972. }
  1973. });
  1974. }
  1975. if (videoFlag){
  1976. try {
  1977. var controller = new VgControllerClient({
  1978. target_window: document.getElementById('child').contentWindow
  1979. });
  1980. //console.log(controller.get_screen());
  1981. //controller.enable_fullscreen_button(true);
  1982. // 여기서부터 이벤트 리스너를 등록하거나, 웹페이지 Element에 메소드를 bind하면 됩니다.
  1983. } catch(e) {
  1984. // Videogateweay Controller Library는 window.postMessage API를 이용하기 때문에
  1985. // 해당 기능을 지원하지 않는 웹브라우져에서는 동작하지 않습니다.
  1986. // 이 부분에 적절한 fail-over 코드를 추가하여 주십시요.
  1987. }
  1988. controller.mute();
  1989. controller.play();
  1990. controller.set_control_visibility(false);
  1991. } */
  1992. /* $(window).scroll(function(){
  1993. var scrollTop= $(window).scrollTop();
  1994. var itemTop=$('.descript_box').offset().top;
  1995. var winHeight = $(window).height();
  1996. console.log(winHeight-scrollTop);
  1997. console.log(winHeight/1.5);
  1998. if (winHeight-scrollTop <= winHeight/1.5){
  1999. controller.pause();
  2000. } else {
  2001. controller.play();
  2002. controller.set_control_visibility(false);
  2003. }
  2004. controller.on('done', function() {
  2005. controller.play();
  2006. controller.set_control_visibility(false);
  2007. });
  2008. }); */
  2009. $(document).on('click','.pop_open_btn',function(){
  2010. $('.modal.photo_comment_popup .pop_detail').toggleClass('active');
  2011. });
  2012. };
  2013. /*]]>*/
  2014. </script>
  2015. <!-- 광고 스크립트 -->
  2016. <th:block th:replace="~{mob/common/advertisements/GoodsDetailScriptsMob :: scripts}"></th:block>
  2017. <!-- //광고 스크립트 -->
  2018. </th:block>
  2019. </body>
  2020. </html>