MallMainFormWeb.html 59 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449
  1. <!DOCTYPE html>
  2. <html lang="ko"
  3. xmlns:th="http://www.thymeleaf.org"
  4. xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
  5. layout:decorator="web/common/layout/DefaultLayoutWeb">
  6. <!--
  7. *******************************************************************************
  8. * @source : MallMainFormWeb.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.01.28 gagamel 최초 작성
  17. *******************************************************************************
  18. -->
  19. <body>
  20. <th:block layout:fragment="content">
  21. <div id="container" class="container main">
  22. <!-- <div class="breadcrumb"> (breadcrumb) </div> -->
  23. <div class="wrap ">
  24. <th:block th:if="${mainLayoutList}" th:each="mainLayoutData, mainStat : ${mainLayoutList}" th:with="contentsLoc=${#strings.replace(mainLayoutData.contentsLoc,'SMM','')}">
  25. <!-- <th:block th:if="${mainLayoutData.ContentsList != null and !mainLayoutData.ContentsList.empty}">-->
  26. <th:block th:if="${contentsLoc=='001'}">
  27. <!-- 1. 비주얼 슬라이드 -->
  28. <div class="content wide main_visual">
  29. <div class="cont_head dpnone">
  30. <p class="t_c">비주얼 슬라이드</p>
  31. </div>
  32. <div class="cont_body">
  33. <div class="swiper-container post-visual">
  34. <div class="swiper-wrapper ">
  35. <th:block th:each="ContentsData, ContentsStat : ${mainLayoutData.ContentsList}">
  36. <div class="swiper-slide">
  37. <th:block th:if="${ContentsData.imgPath1!=null && ContentsData.imgPath1!=''}">
  38. <div class="txtWrap">
  39. <th:block th:if="${ContentsData.strVar5!=null && ContentsData.strVar5!=''}">
  40. <p class="vrt_txt" th:if="${ContentsData.strVar5=='P' and ContentsData.planBrandCnt<2}" th:text="${ContentsData.planBrandGroupNm}"></p>
  41. <p class="vrt_txt" th:if="${ContentsData.strVar5=='P' and ContentsData.planBrandCnt>1}" th:text="${ContentsData.planBrandGroupNm+' 외'}"></p>
  42. <p class="vrt_txt" th:if="${ContentsData.strVar5=='P' and ContentsData.planGb=='E'}" >EVENT</p>
  43. </th:block>
  44. <dl th:class="${ContentsData.strVar7=='BLACK'?'':'w'}">
  45. <dt th:if="${ContentsData.strVar5=='P' and ContentsData.planBrandCnt<2}" th:text="${ContentsData.planBrandGroupNm}"></dt>
  46. <dt th:if="${ContentsData.strVar5=='P' and ContentsData.planBrandCnt>1}" th:text="${ContentsData.planBrandGroupNm+' 외'}"></dt>
  47. <dt th:if="${ContentsData.strVar5=='P' and ContentsData.planGb=='E' }" >EVENT</dt>
  48. <dd class="mainTitle">
  49. <input type="hidden" name="mainTitlee" th:value="${ContentsData.strTitle1}"/>
  50. </dd>
  51. <!-- <dd>NEW ARRIVAL</dd>-->
  52. <dd class="txt_xs" th:text="${ContentsData.subText1}"></dd>
  53. </dl>
  54. <button type="button" class="btn" th:onclick="cfnGoToPage([[${ContentsData.strVar1}]]);"><span>자세히 보기</span></button>
  55. </div>
  56. <!--<img src="/images/pc/thumb/main_visual01.jpg" alt="">-->
  57. <img th:src="${@environment.getProperty('domain.image')+ContentsData.imgPath1}">
  58. </th:block>
  59. </div>
  60. </th:block>
  61. </div>
  62. <div class="swiper-button-prev sbtn01_lb"></div>
  63. <div class="swiper-button-next sbtn01_rb"></div>
  64. </div>
  65. <div class="swiper-controls">
  66. <div class="swiper-pagination"></div>
  67. <div class="slide-curb">
  68. <div class="slide-curb-play sbtn01_play">슬라이드 재생</div>
  69. <div class="slide-curb-pause sbtn01_stop">슬라이드 정지</div>
  70. </div>
  71. </div>
  72. </div>
  73. </div>
  74. </th:block>
  75. <!-- 2. 스타일리포트 -->
  76. <th:block th:if="${contentsLoc=='002'}">
  77. <div class="content main_stylereport">
  78. <th:block th:if="${mainLayoutData.contentsTitle != null and !mainLayoutData.contentsTitle.empty}">
  79. <div class="cont_head">
  80. <p class="displayH t_c" th:text="${mainLayoutData.contentsTitle}"></p>
  81. </div>
  82. </th:block>
  83. <div class="cont_body">
  84. <div class="ui_row">
  85. <th:block th:each="ContentsData, ContentsStat : ${mainLayoutData.ContentsList}">
  86. <div class="ui_col_3 styleArea" th:if="${ContentsStat.count<5}">
  87. <a th:href="${ContentsData.strVar1}">
  88. <img th:src="${@environment.getProperty('domain.image')+ContentsData.imgPath1}">
  89. <dl>
  90. <dt class="styleTitleC"> <!--th:text="${ContentsData.strTitle1}"-->
  91. <input type="hidden" name="styleTitle" th:value="${ContentsData.strTitle1}"/>
  92. </dt>
  93. <dd class="styleNoteC"> <!--th:text="${ContentsData.subText1}"-->
  94. <input type="hidden" name="styleNote" th:value="${ContentsData.subText1}"/>
  95. </dd>
  96. <!--<dd>당신을 위해 준비한 아우터 픽을 만나보자</dd>-->
  97. </dl>
  98. </a>
  99. </div>
  100. </th:block>
  101. </div>
  102. </div>
  103. </div>
  104. </th:block>
  105. <!-- 3. 트렌디한 신상아이템 -->
  106. <th:block th:if="${contentsLoc=='003'}">
  107. <div class="content main_trendy" th:if="${mainLayoutData.goodsList != null and !mainLayoutData.goodsList.empty}">
  108. <div class="cont_head">
  109. <p class="displayH t_c" th:text="${mainLayoutData.contentsTitle}"></p>
  110. </div>
  111. <div class="cont_body">
  112. <div class="swiper-container post-trendy">
  113. <div class="swiper-wrapper">
  114. <th:block th:each="goodsData, goodsStat : ${mainLayoutData.goodsList}">
  115. <div class="swiper-slide" th:if="${goodsStat.count<21}">
  116. <div class="item_prod">
  117. <div class="item_state">
  118. <button type="button" class="itemLike" th:classappend="${goodsData.likeIt == 'likeit'}? 'likeit' : ''" onclick="cfnPutWishList(this);" th:attr="goodsCd=${goodsData.goodsCd}, ithrCd='', contentsLoc='SMM003', planDtlSq=''">관심상품 추가</button>
  119. <a href="javascript:void(0);" class="itemLink" th:onclick="cfnGoToGoodsDetail([[${goodsData.goodsCd}]], '', '', 'SMM003');">
  120. <div class=" itemPic">
  121. <th:block th:each="option,idx:${goodsData.videos}" th:with="videoArr=${#strings.arraySplit(idx.current,':')}">
  122. <iframe th:if="${videoArr[0]=='Y'}" id="pdThumbVideo" class="pd_mov" th:src="${'https://www.youtube.com/embed/'+videoArr[1]+'?autoplay=1&mute=1'}"></iframe>
  123. <iframe th:unless="${videoArr[0]=='Y'}" id="pdThumbVideo" class="pd_mov" th:src="${kollusMediaUrl+'/'+videoArr[1]+'?enable_initialize_focus=false&autoplay&mute&controls_activation=none'}" allow="fullscreen" allowFullScreen></iframe>
  124. </th:block>
  125. <img alt="BLUE-a" class=" vLHTC pd_img" th:src="${@environment.getProperty('upload.goods.view') + '/' + goodsData.sysImgNm}" onerror="noneImg(this)">
  126. </div>
  127. <p class="itemBrand" th:text="${goodsData.brandGroupNm}">BRAND NAME</p>
  128. <div class=" itemName" th:text="${goodsData.goodsFullNm}">스타 착용 여성 퍼 아플리케 오버핏 투마일 웨어링 점퍼</div>
  129. <p class="itemPrice" th:text="${#numbers.formatInteger(goodsData.currPrice,1,'COMMA')}">488,000원</p>
  130. <div class="itemComment" th:text="${goodsData.goodsTnm}">#가을느낌 물씬!</div>
  131. </a>
  132. </div>
  133. </div>
  134. </div>
  135. </th:block>
  136. </div>
  137. </div>
  138. <div class="swiper-pagination"></div>
  139. <div class="swiper-button-prev"></div>
  140. <div class="swiper-button-next"></div>
  141. </div>
  142. </div>
  143. </th:block>
  144. <!-- 4. 잇 아이템 -->
  145. <th:block th:if="${contentsLoc=='004'}">
  146. <div class="content main_it" th:if="${mainLayoutData.BestItemList != null and !mainLayoutData.BestItemList.empty}">
  147. <div class="cont_head">
  148. <p class="displayH" id="id004">
  149. <input type="hidden" name="title" th:value="${mainLayoutData.contentsTitle}">
  150. </p>
  151. <a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_BEST_MAIN);"><span>전체보기</span></a>
  152. </div>
  153. <div class="cont_body">
  154. <div class="it_nav">
  155. <ul>
  156. <th:block th:each="ContentsData, ContentsStat : ${mainLayoutData.BestItemList}">
  157. <li><button class="btn btn_link" th:attr="data-tab=${'it'+ContentsStat.count}"><span th:text="${ContentsData.cateNm}"></span></button></li>
  158. </th:block>
  159. </ul>
  160. </div>
  161. <th:block th:each="ContentsData, ContentsStat : ${mainLayoutData.BestItemList}">
  162. <div class="swiper-container post-it it_item" th:id="${'it'+ContentsStat.count}">
  163. <div class="swiper-wrapper">
  164. <th:block th:each="bestItemData, bestItemStat : ${ContentsData.goodsList}">
  165. <div class="swiper-slide">
  166. <div class=" item_prod sUiXc "> <!-- item_prod ranker d_detail -->
  167. <div class="item_state"> <!-- item_state AD soldout -->
  168. <button type="button" class="itemLike" th:classappend="${bestItemData.likeIt == 'likeit'}? 'likeit' : ''" onclick="cfnPutWishList(this);" th:attr="goodsCd=${bestItemData.goodsCd}, ithrCd='', contentsLoc='SMM004', planDtlSq=''">관심상품 추가</button>
  169. <a href="javascript:void(0);" class="itemLink" th:onclick="cfnGoToGoodsDetail([[${bestItemData.goodsCd}]], '', '', 'SMM004');">
  170. <div class="shape" th:classappend="${bestItemStat.count==1}?'ranker'"><span th:text="${bestItemStat.count}"></span></div>
  171. <div class="itemPic">
  172. <th:block th:each="option,idx:${bestItemData.videos}" th:with="videoArr=${#strings.arraySplit(idx.current,':')}">
  173. <iframe th:if="${videoArr[0]=='Y'}" id="pdThumbVideo" class="pd_mov" th:src="${'https://www.youtube.com/embed/'+videoArr[1]+'?autoplay=1&mute=1'}"></iframe>
  174. <iframe th:unless="${videoArr[0]=='Y'}" id="pdThumbVideo" class="pd_mov" th:src="${kollusMediaUrl+'/'+videoArr[1]+'?enable_initialize_focus=false&autoplay&mute&controls_activation=none'}" allow="fullscreen" allowFullScreen></iframe>
  175. </th:block>
  176. <img alt="BLACK-a" class=" vLHTC pd_img" th:src="${@environment.getProperty('upload.goods.view') + '/' + bestItemData.sysImgNm}" onerror="noneImg(this)">
  177. </div>
  178. <p class=" itemBrand" th:text="${bestItemData.brandGroupNm}">BRAND NAME</p>
  179. <div class=" itemName" th:text="${bestItemData.goodsFullNm}">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
  180. <p class="itemPrice">[[${#numbers.formatInteger(bestItemData.currPrice,0,'COMMA')}]]
  181. <span class="itemPrice_original" th:if="${bestItemData.currPrice != bestItemData.listPrice}" th:text="${#numbers.formatInteger(bestItemData.listPrice,3,'COMMA')}">89,000</span>
  182. <span class=" itemPercent" th:if="${bestItemData.currPrice != bestItemData.listPrice}" th:text="${(bestItemData.listPrice == 0 ? 0 : #numbers.formatDecimal((bestItemData.listPrice - bestItemData.currPrice) / (bestItemData.listPrice * 1.0) * 100, 1, 0)) + '%'}">10%</span>
  183. </p>
  184. <div class="itemComment" th:text="${bestItemData.goodsTnm}">#데일리웨어로 매일입고싶은</div>
  185. </a>
  186. </div>
  187. </div>
  188. </div>
  189. </th:block>
  190. </div>
  191. <div class="swiper-controls">
  192. <div class="swiper-scrollbar"></div>
  193. </div>
  194. </div>
  195. </th:block>
  196. </div>
  197. </div>
  198. </th:block>
  199. <!-- 5. 프로모션배너 -->
  200. <th:block th:if="${contentsLoc=='005'}">
  201. <div class="content main_2stage" th:if="${mainLayoutData.ContentsList != null and !mainLayoutData.ContentsList.empty}">
  202. <div class="cont_head dpnone">
  203. <p class="t_c">프로모션배너</p>
  204. </div>
  205. <div class="cont_body">
  206. <th:block th:each="ContentsData, ContentsStat : ${mainLayoutData.ContentsList}">
  207. <th:block th:if="${ContentsData.contentsType!=null && ContentsData.contentsType!=''}">
  208. <div class="bnnbox_crop" th:if="${ContentsData.contentsType=='1'}">
  209. <div class="" style="width: 100%;height: 230px;float: none;overflow: hidden;">
  210. <a th:href="${ContentsData.strVar1}" target="_blank">
  211. <img th:src="${@environment.getProperty('domain.image')+ContentsData.imgPath1}" alt="">
  212. </a>
  213. </div>
  214. </div>
  215. <div class="bnnbox_crop" th:if="${ContentsData.contentsType=='2'}">
  216. <div class="bnn_half">
  217. <a th:href="${ContentsData.strVar1}" target="_blank">
  218. <img th:src="${@environment.getProperty('domain.image')+ContentsData.imgPath1}" alt="">
  219. </a>
  220. </div>
  221. <div class="bnn_half">
  222. <a th:href="${ContentsData.strVar2}" target="_blank">
  223. <img th:src="${@environment.getProperty('domain.image')+ContentsData.imgPath2}" alt="">
  224. </a>
  225. </div>
  226. </div>
  227. </th:block>
  228. </th:block>
  229. </div>
  230. </div>
  231. </th:block>
  232. <!-- 6. 타임딜 : 슬라이드 -->
  233. <th:block th:if="${contentsLoc=='006'}">
  234. <th:block th:each="socialData, socialStat : ${mainLayoutData.socialInfo}">
  235. <div class="content wide main_deal" th:if="${socialData.socialGoodsList != null and !socialData.socialGoodsList.empty}">
  236. <div class="cont_head">
  237. <p class="displayH" id="id006">
  238. <input type="hidden" name="title" th:value="${mainLayoutData.contentsTitle}">
  239. </p>
  240. <a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_SOCIAL_MAIN);"><span>전체보기</span></a>
  241. <div class="deal_progress">
  242. <div class="bar_current" id="barCurrent" style="width:33.333%"><span>HERE</span></div>
  243. <div class="bar_bg"></div>
  244. </div>
  245. <th:block th:each="socialData, socialStat : ${mainLayoutData.socialInfo}">
  246. <form name="socailForm" id="socailForm">
  247. <input type="hidden" name="targetTime" th:value="${socialData.socialEddt}">
  248. </form>
  249. </th:block>
  250. <div class="count" >
  251. <span class="count_tit">남은 시간</span>
  252. <div class="hotdeal">
  253. <div id="countdown">
  254. <div id="tiles"></div>
  255. </div>
  256. <div class="count_time" id="countdownTime">
  257. <span id="h-hours">HOURS</span>
  258. <span id="h-minutes">MINS</span>
  259. <span id="h-seconds">SECS</span>
  260. </div>
  261. </div>
  262. </div>
  263. <script>
  264. /* 핫딜 countDown */
  265. // var target_date = new Date().getTime() + (1000*3600*8); // set the countdown date
  266. if(!gagajf.isNull($("#socailForm").find("input[name=targetTime]").val())){
  267. var target_date = $("#socailForm").find("input[name=targetTime]").val().toDate("YYYYMMDD");
  268. var days, hours, minutes, seconds; // variables for time units
  269. var countdown = document.getElementById("tiles"); // get tag element
  270. getCountdown();
  271. var timerStop = setInterval(function () { getCountdown(); }, 1000);
  272. var fixDate = new Date().getTime();
  273. var fixTarget = (target_date - fixDate) / 1000;
  274. var width = (86400-fixTarget)*100/86400;
  275. function getCountdown(){
  276. // find the amount of "seconds" between now and target
  277. var current_date = new Date().getTime();
  278. var seconds_left = (target_date - current_date) / 1000;
  279. seconds_left = seconds_left % 86400;
  280. hours = pad( parseInt(seconds_left / 3600) );
  281. seconds_left = seconds_left % 3600;
  282. minutes = pad( parseInt(seconds_left / 60) );
  283. seconds = pad( parseInt( seconds_left % 60 ) );
  284. // format countdown string + set tag value
  285. countdown.innerHTML = "<span>" + hours + "</span><span>" + minutes + "</span><span>" + seconds + "</span>";
  286. var elem = document.getElementById("barCurrent");
  287. function progressMove(){
  288. width += (100-width)/fixTarget;
  289. elem.style.width = width + "%";
  290. }
  291. progressMove();
  292. if(seconds_left < 1){
  293. clearInterval(timerStop);
  294. elem.style.width = "100%";
  295. }
  296. }
  297. function pad(n) {
  298. return (n < 10 ? '0' : '') + n;
  299. }
  300. /* countDown */
  301. }
  302. </script>
  303. </div>
  304. <div class="cont_body">
  305. <div class="swiper-container post-deal">
  306. <div class="swiper-wrapper">
  307. <!-- <th:block th:each="socialData, socialStat : ${mainLayoutData.socialInfo}">-->
  308. <th:block th:each="goodsData, goodsStat : ${socialData.socialGoodsList}">
  309. <div class="swiper-slide" th:if="${goodsStat.count<21}">
  310. <div class="item_prod">
  311. <div class="item_state">
  312. <button type="button" class="itemLike" th:classappend="${goodsData.likeIt == 'likeit'}? 'likeit' : ''" onclick="cfnPutWishList(this);" th:attr="goodsCd=${goodsData.goodsCd}, ithrCd='', contentsLoc='SMM006', planDtlSq=''">관심상품 추가</button>
  313. <a href="javascript:void(0);" class="itemLink" th:onclick="cfnGoToGoodsDetail([[${goodsData.goodsCd}]], '', '', 'SMM006');">
  314. <div class="itemPic">
  315. <img alt="" class="pd_img" th:src="${@environment.getProperty('upload.goods.view') + '/' + goodsData.sysImgNm}" onerror="noneImg(this)">
  316. </div>
  317. <p class="itemBrand" th:text="${goodsData.brandGroupNm}">BRAND NAME</p>
  318. <div class="itemName" th:text="${goodsData.goodsNm}">여성 체인 프린트 큐롯 스커트 프린트 큐롯 스커트</div>
  319. <p class="itemPrice">
  320. [[${#numbers.formatInteger(goodsData.currPrice,0,'COMMA')}]]
  321. <span class="itemPrice_original" th:if="${goodsData.currPrice != goodsData.listPrice}" th:text="${#numbers.formatInteger(goodsData.listPrice,0,'COMMA')} + '원'"></span>
  322. <span class=" itemPercent" th:if="${goodsData.currPrice != goodsData.listPrice}" th:text="${#numbers.formatDecimal(goodsData.dcRate,1,0)} + '%'"></span>
  323. <!--<span class="itemPercent" th:if="${planningGoods.currPrice != planningGoods.listPrice}" th:text="${(planningGoods.listPrice == 0 ? 0 : #numbers.formatDecimal((planningGoods.listPrice - planningGoods.currPrice) / (planningGoods.listPrice * 1.0) * 100, 1, 0)) + '%'}">10%</span>-->
  324. </p>
  325. <div class="itemComment" th:text="${goodsData.goodsTnm}">#데일리웨어로 매일입고싶은</div>
  326. </a>
  327. </div>
  328. </div>
  329. </div>
  330. </th:block>
  331. <!-- </th:block>-->
  332. </div>
  333. <div class="swiper-controls">
  334. <div class="swiper-scrollbar"></div>
  335. </div>
  336. </div>
  337. </div>
  338. </div>
  339. </th:block>
  340. </th:block>
  341. <!-- 7. 브랜드픽 -->
  342. <th:block th:if="${contentsLoc=='007'}">
  343. <div class="content main_pick" th:if="${mainLayoutData.ContentsList != null and !mainLayoutData.ContentsList.empty}">
  344. <div class="cont_head">
  345. <p class="displayH t_c" th:text="${mainLayoutData.contentsTitle}">브랜드 PICK1</p>
  346. </div>
  347. <div class="cont_body">
  348. <div class="swiper-container post-pick-nav">
  349. <div class="swiper-wrapper">
  350. <th:block th:each="ContentsData, ContentsStat : ${mainLayoutData.ContentsList}">
  351. <div class="swiper-slide"><img th:src="${@environment.getProperty('domain.image')+ContentsData.brandGroupImg}"></div>
  352. </th:block>
  353. </div>
  354. <div class="swiper-button-prev "></div>
  355. <div class="swiper-button-next "></div>
  356. </div>
  357. </div>
  358. <div class="swiper-container post-pick-for">
  359. <div class="swiper-wrapper">
  360. <th:block th:each="brandPickData, brandPickStat : ${mainLayoutData.brandPickList}">
  361. <div class="swiper-slide">
  362. <div class="pick_look">
  363. <div class="swiper-container post-lookbook">
  364. <div class="swiper-wrapper" id="id007">
  365. <th:block th:each="bannerData, bannerStat : ${brandPickData.BannerList}">
  366. <div class="swiper-slide" th:if="${bannerData.imgPath1 != ''}">
  367. <a th:href="${bannerData.strVar1}">
  368. <div class="text_box">
  369. <p class="title">
  370. <input type="hidden" name="title" th:value="${bannerData.strTitle1}">
  371. </p>
  372. <p class="sub_text" th:text="${bannerData.subText1}"> 2020 FALL / WINTER 신상살펴보기1</p>
  373. </div>
  374. <div class="img_box">
  375. <img th:src="${@environment.getProperty('domain.image')+bannerData.imgPath1}" alt="barnd lookbook">
  376. </div>
  377. </a>
  378. </div>
  379. </th:block>
  380. </div>
  381. <div class="swiper-controls">
  382. <div class="swiper-pagination"></div>
  383. </div>
  384. </div>
  385. </div>
  386. <div class="pick_item">
  387. <div class="itemGrp">
  388. <th:block th:each="goodsData, goodsStat : ${brandPickData.goodsList}">
  389. <div class="item_prod" th:if="${goodsStat.count<4}">
  390. <div class="item_state">
  391. <button type="button" class="itemLike" tabindex="0" th:classappend="${goodsData.likeIt == 'likeit'}? 'likeit' : ''" onclick="cfnPutWishList(this);" th:attr="goodsCd=${goodsData.goodsCd}, ithrCd='', contentsLoc='SMM007', planDtlSq=''">관심상품 추가</button>
  392. <a href="javascript:void(0);" class="itemLink" th:onclick="cfnGoToGoodsDetail([[${goodsData.goodsCd}]], '', '', 'SMM007');">
  393. <div class="itemPic">
  394. <th:block th:each="option,idx:${goodsData.videos}" th:with="videoArr=${#strings.arraySplit(idx.current,':')}">
  395. <iframe th:if="${videoArr[0]=='Y'}" id="pdThumbVideo" class="pd_mov" th:src="${'https://www.youtube.com/embed/'+videoArr[1]+'?autoplay=1&mute=1'}"></iframe>
  396. <iframe th:unless="${videoArr[0]=='Y'}" id="pdThumbVideo" class="pd_mov" th:src="${kollusMediaUrl+'/'+videoArr[1]+'?enable_initialize_focus=false&autoplay&mute&controls_activation=none'}" allow="fullscreen" allowFullScreen></iframe>
  397. </th:block>
  398. <img alt="BLACK-a" class=" vLHTC pd_img" th:src="${@environment.getProperty('upload.goods.view') + '/' + goodsData.sysImgNm}" onerror="noneImg(this)">
  399. </div>
  400. <div class=" itemName" th:text="${goodsData.goodsFullNm}">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
  401. <p class="itemPrice" th:text="${#numbers.formatInteger(goodsData.currPrice,1,'COMMA')}">80,100
  402. <span class="itemPrice_original" th:if="${goodsData.currPrice != goodsData.listPrice}" th:text="${#numbers.formatInteger(goodsData.listPrice,1,'COMMA')}">89,000</span>
  403. <span class=" itemPercent" th:if="${goodsData.currPrice != goodsData.listPrice}" th:text="${(goodsData.listPrice == 0 ? 0 : #numbers.formatDecimal((goodsData.listPrice - goodsData.currPrice) / (goodsData.listPrice * 1.0) * 100, 1, 0)) + '%'}">10%</span>
  404. </p>
  405. <div class="itemComment" th:text="${goodsData.goodsTnm}">#데일리웨어로 매일입고싶은</div>
  406. </a>
  407. </div>
  408. </div>
  409. </th:block>
  410. </div>
  411. </div>
  412. </div>
  413. </th:block>
  414. </div>
  415. </div>
  416. </div>
  417. </th:block>
  418. <!-- 8. 가로 긴 배너 슬라이드 -->
  419. <!-- bnn_1stage -->
  420. <th:block th:if="${contentsLoc=='008'}">
  421. <div class="content wide main_1stage" th:if="${mainLayoutData.ContentsList != null and !mainLayoutData.ContentsList.empty}">
  422. <div class="cont_head dpnone">
  423. <p class="t_c">배너 슬라이드</p>
  424. </div>
  425. <div class="cont_body">
  426. <div class="swiper-container post-bnnWide">
  427. <div class="swiper-wrapper ">
  428. <th:block th:each="ContentsData, ContentsStat : ${mainLayoutData.ContentsList}">
  429. <div class="swiper-slide silderBannerArea">
  430. <th:block th:if="${ContentsData.imgPath1!=null && ContentsData.imgPath1!=''}">
  431. <a th:href="${ContentsData.strVar1}">
  432. <div class="bnnbox" style="background:#e3e7ea;">
  433. <div class="txtWrap bannerNote">
  434. <p class="noteArea"> <!--th:text="${ContentsData.strTitle1}"-->
  435. <input type="hidden" name="bannerNote" th:value="${ContentsData.strTitle1}"/>
  436. </p>
  437. <!--<p>아우터 + 이너 단독세일</p>--> <!-- br 태그 줄바꿈해야함-->
  438. <!-- <button type="button" class="btn">VIEW MORE</button>-->
  439. </div>
  440. <img alt="BLUE-a" class=" vLHTC pd_img" th:src="${@environment.getProperty('domain.image')+ContentsData.imgPath1}">
  441. </div>
  442. </a>
  443. </th:block>
  444. </div>
  445. </th:block>
  446. </div>
  447. <div class="swiper-button-prev "></div>
  448. <div class="swiper-button-next "></div>
  449. </div>
  450. </div>
  451. <div class="cont_foot dpnone">
  452. CONT-FOOT
  453. </div>
  454. </div>
  455. </th:block>
  456. <!-- 9. MD추천 스타일 -->
  457. <th:block th:if="${contentsLoc=='009'}">
  458. <div class="content main_recomm" th:if="${mainLayoutData.mdPickList != null and !mainLayoutData.mdPickList.empty}">
  459. <div class="cont_head">
  460. <p class="displayH t_c" th:text="${mainLayoutData.contentsTitle}"></p>
  461. </div>
  462. <div class="cont_body">
  463. <div class="sec_head">
  464. <div class="filter action tag_list">
  465. <th:block th:each="titleData, titleStat : ${mainLayoutData.mdPickList}" >
  466. <th:block th:if="${titleData.goodsList!=null and !titleData.goodsList.empty}" >
  467. <button class="btn" th:attr="data-tab=${'tag'+titleStat.count}" th:text="${titleData.mdTitle}">따뜻한 무드2</button>
  468. </th:block>
  469. </th:block>
  470. </div>
  471. </div>
  472. <div class="sec_body">
  473. <th:block th:each="titleData, titleStat : ${mainLayoutData.mdPickList}">
  474. <div th:id="${'tag'+titleStat.count}" class="tagitem" > <!--th:classappend="${titleStat.count} == 1? active"-->
  475. <div class="swiper-container post-recomm">
  476. <div class="swiper-wrapper">
  477. <th:block th:if="${titleData.goodsList!=null and !titleData.goodsList.empty}">
  478. <th:block th:each="goodsData, goodsStat : ${titleData.goodsList}">
  479. <div class="swiper-slide">
  480. <div class="item_prod">
  481. <div class="item_state">
  482. <button type="button" class="itemLike" tabindex="0" th:classappend="${goodsData.likeIt == 'likeit'}? 'likeit' : ''" onclick="cfnPutWishList(this);" th:attr="goodsCd=${goodsData.goodsCd}, ithrCd='', contentsLoc='SMM009', planDtlSq=''">관심상품 추가</button>
  483. <a href="javascript:void(0);" class="itemLink" th:onclick="cfnGoToGoodsDetail([[${goodsData.goodsCd}]], '', '', 'SMM009');">
  484. <div class="itemPic">
  485. <th:block th:each="option,idx:${goodsData.videos}" th:with="videoArr=${#strings.arraySplit(idx.current,':')}">
  486. <iframe th:if="${videoArr[0]=='Y'}" id="pdThumbVideo" class="pd_mov" th:src="${'https://www.youtube.com/embed/'+videoArr[1]+'?autoplay=1&mute=1'}"></iframe>
  487. <iframe th:unless="${videoArr[0]=='Y'}" id="pdThumbVideo" class="pd_mov" th:src="${kollusMediaUrl+'/'+videoArr[1]+'?enable_initialize_focus=false&autoplay&mute&controls_activation=none'}" allow="fullscreen" allowFullScreen></iframe>
  488. </th:block>
  489. <img alt="" class=" vLHTC pd_img" th:src="${@environment.getProperty('upload.goods.view') + '/' + goodsData.sysImgNm}" onerror="noneImg(this)">
  490. </div>
  491. <p class="itemBrand" th:text="${goodsData.brandGroupNm}">BRAND NAME</p>
  492. <div class=" itemName" th:text="${goodsData.goodsFullNm}">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
  493. <p class="itemPrice">[[${#numbers.formatInteger(goodsData.currPrice,0,'COMMA')}]]
  494. <span class="itemPrice_original" th:if="${goodsData.currPrice != goodsData.listPrice}" th:text="${#numbers.formatInteger(goodsData.listPrice,1,'COMMA')}">89,000</span>
  495. <span class=" itemPercent" th:if="${goodsData.currPrice != goodsData.listPrice}" th:text="${(goodsData.listPrice == 0 ? 0 : #numbers.formatDecimal((goodsData.listPrice - goodsData.currPrice) / (goodsData.listPrice * 1.0) * 100, 1, 0)) + '%'}">10%</span>
  496. </p>
  497. <div class="itemComment" th:text="${goodsData.goodsTnm}">#주문 폭주 상품</div>
  498. </a>
  499. </div>
  500. </div>
  501. </div>
  502. </th:block>
  503. </th:block>
  504. </div>
  505. <div class="swiper-controls">
  506. <div class="swiper-pagination"></div>
  507. </div>
  508. </div>
  509. <div class="swiper-button-prev"></div>
  510. <div class="swiper-button-next"></div>
  511. </div>
  512. </th:block>
  513. </div>
  514. </div>
  515. </div>
  516. </th:block>
  517. <!-- 11. TV 슬라이드 -->
  518. <th:block th:if="${contentsLoc=='011'}">
  519. <div class="content wide main_tv" th:if="${mainLayoutData.ContentsList != null and !mainLayoutData.ContentsList.empty}">
  520. <div class="cont_head">
  521. <p class="displayH t_c" th:text="${mainLayoutData.contentsTitle}"></p>
  522. </div>
  523. <div class="cont_body">
  524. <div class="swiper-container post-tv">
  525. <div class="swiper-wrapper">
  526. <th:block th:each="item, stat : ${mainLayoutData.ContentsList}">
  527. <div class="swiper-slide">
  528. <div class="movbox">
  529. <iframe th:if="${item.strVar1=='Y'}" width="100%" height="100%" th:src="${'https://www.youtube.com/embed/'+item.strVar2+'?rel=0'}" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
  530. <iframe th:if="${item.strVar1=='M'}" class="pd_mov" th:src="${kollusMediaUrl+'/'+item.strVar2+'?enable_initialize_focus=false'}" allowfullscreen></iframe>
  531. </div>
  532. </div>
  533. </th:block>
  534. </div>
  535. <div class="swiper-button-prev white"></div> <!-- 클래스명 white 추가 -->
  536. <div class="swiper-button-next white"></div>
  537. </div>
  538. <div class="swiper-controls">
  539. <div class="swiper-pagination"></div>
  540. </div>
  541. </div>
  542. </div>
  543. </th:block>
  544. </th:block>
  545. <!-- </th:block>-->
  546. <!-- 10. 당신을위한제안 -->
  547. <div class="content main_foryou">
  548. <div class="cont_head">
  549. <p class="displayH">당신을 위한 제안</p>
  550. <span>스타일24에서 가장 주목받는 상품을 살펴보세요</span>
  551. </div>
  552. <div class="cont_body">
  553. <div class="post-sug fy_nav">
  554. <div class="swiper-container">
  555. <div class="swiper-wrapper">
  556. <div class="swiper-slide">
  557. <ul>
  558. <li><button class="btn btn_shape active" data-tab="fy1"><div><span class="number">1</span><span>BUCKAROO</span></div></button><a href="#none">자세히 보기</a></li>
  559. <li><button class="btn btn_shape" data-tab="fy2"><div><span class="number">2</span><span>기모청바지</span></div></button><a href="#none">자세히 보기</a></li>
  560. <li><button class="btn btn_shape" data-tab="fy3"><div><span class="number">3</span><span>겨울 팬츠</span></div></button><a href="#none">자세히 보기</a></li>
  561. <li><button class="btn btn_shape" data-tab="fy4"><div><span class="number">4</span><span>컨버스 주니어</span></div></button><a href="#none">자세히 보기</a></li>
  562. <li><button class="btn btn_shape" data-tab="fy5"><div><span class="number">5</span><span>모이몰른</span></div></button><a href="#none">자세히 보기</a></li>
  563. </ul>
  564. </div>
  565. <div class="swiper-slide">
  566. <ul>
  567. <li><button class="btn btn_shape" data-tab="fy6"><div><span class="number">6</span><span>컨버스 주니어</span></div></button><a href="#none">자세히 보기</a></li>
  568. <li><button class="btn btn_shape" data-tab="fy7"><div><span class="number">7</span><span>겨울 팬츠</span></div></button><a href="#none">자세히 보기</a></li>
  569. <li><button class="btn btn_shape" data-tab="fy8"><div><span class="number">8</span><span>BUCKAROO</span></div></button><a href="#none">자세히 보기</a></li>
  570. <li><button class="btn btn_shape" data-tab="fy9"><div><span class="number">9</span><span>모이몰른</span></div></button><a href="#none">자세히 보기</a></li>
  571. <li><button class="btn btn_shape" data-tab="fy10"><div><span class="number">10</span><span>기모청바지</span></div></button><a href="#none">자세히 보기</a></li>
  572. </ul>
  573. </div>
  574. </div>
  575. </div>
  576. <div class="swiper-controls">
  577. <div class="swiper-pagination"></div>
  578. </div>
  579. </div>
  580. <div class="fy_item active" id="fy1">
  581. <div class="part">
  582. <div class="item_prod">
  583. <div class="item_state">
  584. <button type="button" class="itemLike" tabindex="0">관심상품 추가</button>
  585. <a href="#none" class="itemLink" tabindex="0">
  586. <div class="itemPic">
  587. <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/main_sug01.jpg">
  588. </div>
  589. <div class="itemInfo">
  590. <p class="itemBrand">BRAND NAME</p>
  591. <div class=" itemName">자카드 방풍 패딩 스웨터 가디건 자카드 </div>
  592. <p class="itemPrice">80,100</p>
  593. </div>
  594. </a>
  595. </div>
  596. </div>
  597. <div class="item_prod">
  598. <div class="item_state">
  599. <button type="button" class="itemLike" tabindex="0">관심상품 추가</button>
  600. <a href="#none" class="itemLink" tabindex="0">
  601. <div class="itemPic">
  602. <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/main_sug02.jpg">
  603. </div>
  604. <div class="itemInfo">
  605. <p class="itemBrand">BRAND NAME</p>
  606. <div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
  607. <p class="itemPrice">80,100</p>
  608. </div>
  609. </a>
  610. </div>
  611. </div>
  612. </div>
  613. <div class="part lg">
  614. <div class="item_prod">
  615. <div class="item_state">
  616. <button type="button" class="itemLike" tabindex="0">관심상품 추가</button>
  617. <a href="#none" class="itemLink" tabindex="0">
  618. <div class="itemPic">
  619. <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/main_sug03.jpg">
  620. </div>
  621. <div class="itemInfo">
  622. <p class="itemBrand">BRAND NAME</p>
  623. <div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
  624. <p class="itemPrice">80,100</p>
  625. </div>
  626. </a>
  627. </div>
  628. </div>
  629. </div>
  630. <div class="part">
  631. <div class="item_prod">
  632. <div class="item_state">
  633. <button type="button" class="itemLike" tabindex="0">관심상품 추가</button>
  634. <a href="#none" class="itemLink" tabindex="0">
  635. <div class="itemPic">
  636. <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/main_sug04.jpg">
  637. </div>
  638. <div class="itemInfo">
  639. <p class="itemBrand">BRAND NAME</p>
  640. <div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
  641. <p class="itemPrice">80,100</p>
  642. </div>
  643. </a>
  644. </div>
  645. </div>
  646. <div class="item_prod">
  647. <div class="item_state">
  648. <button type="button" class="itemLike" tabindex="0">관심상품 추가</button>
  649. <a href="#none" class="itemLink" tabindex="0">
  650. <div class="itemPic">
  651. <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/main_sug05.jpg">
  652. </div>
  653. <div class="itemInfo">
  654. <p class="itemBrand">BRAND NAME</p>
  655. <div class=" itemName">남성 로고 자카드 방풍 패딩 가디건</div>
  656. <p class="itemPrice">80,100</p>
  657. </div>
  658. </a>
  659. </div>
  660. </div>
  661. </div>
  662. <div class="part">
  663. <div class="item_prod">
  664. <div class="item_state">
  665. <button type="button" class="itemLike" tabindex="0">관심상품 추가</button>
  666. <a href="#none" class="itemLink" tabindex="0">
  667. <div class="itemPic">
  668. <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/main_sug06.jpg">
  669. </div>
  670. <div class="itemInfo">
  671. <p class="itemBrand">BRAND NAME</p>
  672. <div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
  673. <p class="itemPrice">80,100</p>
  674. </div>
  675. </a>
  676. </div>
  677. </div>
  678. <div class="item_prod">
  679. <div class="item_state">
  680. <button type="button" class="itemLike" tabindex="0">관심상품 추가</button>
  681. <a href="#none" class="itemLink" tabindex="0">
  682. <div class="itemPic">
  683. <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/main_sug07.jpg">
  684. </div>
  685. <div class="itemInfo">
  686. <p class="itemBrand">BRAND NAME</p>
  687. <div class=" itemName">남성 로고 자카드 방풍 패딩 가디건 자카드 방풍 패딩 스웨터 가디건</div>
  688. <p class="itemPrice">80,100</p>
  689. </div>
  690. </a>
  691. </div>
  692. </div>
  693. </div>
  694. </div>
  695. <div class="fy_item" id="fy2">
  696. <div class="part">
  697. <div class="item_prod">
  698. <div class="item_state">
  699. <button type="button" class="itemLike" tabindex="0">관심상품 추가</button>
  700. <a href="#none" class="itemLink" tabindex="0">
  701. <div class="itemPic">
  702. <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/main_sug04.jpg">
  703. </div>
  704. <div class="itemInfo">
  705. <p class="itemBrand">BRAND NAME</p>
  706. <div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
  707. <p class="itemPrice">80,100</p>
  708. </div>
  709. </a>
  710. </div>
  711. </div>
  712. <div class="item_prod">
  713. <div class="item_state">
  714. <button type="button" class="itemLike" tabindex="0">관심상품 추가</button>
  715. <a href="#none" class="itemLink" tabindex="0">
  716. <div class="itemPic">
  717. <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/main_sug05.jpg">
  718. </div>
  719. <div class="itemInfo">
  720. <p class="itemBrand">BRAND NAME</p>
  721. <div class=" itemName">남성 로고 자카드 방풍 패딩 가디건</div>
  722. <p class="itemPrice">80,100</p>
  723. </div>
  724. </a>
  725. </div>
  726. </div>
  727. </div>
  728. <div class="part">
  729. <div class="item_prod">
  730. <div class="item_state">
  731. <button type="button" class="itemLike" tabindex="0">관심상품 추가</button>
  732. <a href="#none" class="itemLink" tabindex="0">
  733. <div class="itemPic">
  734. <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/main_sug01.jpg">
  735. </div>
  736. <div class="itemInfo">
  737. <p class="itemBrand">BRAND NAME</p>
  738. <div class=" itemName">자카드 방풍 패딩 스웨터 가디건 자카드 </div>
  739. <p class="itemPrice">80,100</p>
  740. </div>
  741. </a>
  742. </div>
  743. </div>
  744. <div class="item_prod">
  745. <div class="item_state">
  746. <button type="button" class="itemLike" tabindex="0">관심상품 추가</button>
  747. <a href="#none" class="itemLink" tabindex="0">
  748. <div class="itemPic">
  749. <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/main_sug02.jpg">
  750. </div>
  751. <div class="itemInfo">
  752. <p class="itemBrand">BRAND NAME</p>
  753. <div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
  754. <p class="itemPrice">80,100</p>
  755. </div>
  756. </a>
  757. </div>
  758. </div>
  759. </div>
  760. <div class="part">
  761. <div class="item_prod">
  762. <div class="item_state">
  763. <button type="button" class="itemLike" tabindex="0">관심상품 추가</button>
  764. <a href="#none" class="itemLink" tabindex="0">
  765. <div class="itemPic">
  766. <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/main_sug06.jpg">
  767. </div>
  768. <div class="itemInfo">
  769. <p class="itemBrand">BRAND NAME</p>
  770. <div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
  771. <p class="itemPrice">80,100</p>
  772. </div>
  773. </a>
  774. </div>
  775. </div>
  776. <div class="item_prod">
  777. <div class="item_state">
  778. <button type="button" class="itemLike" tabindex="0">관심상품 추가</button>
  779. <a href="#none" class="itemLink" tabindex="0">
  780. <div class="itemPic">
  781. <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/main_sug07.jpg">
  782. </div>
  783. <div class="itemInfo">
  784. <p class="itemBrand">BRAND NAME</p>
  785. <div class=" itemName">남성 로고 자카드 방풍 패딩 가디건 자카드 방풍 패딩 스웨터 가디건</div>
  786. <p class="itemPrice">80,100</p>
  787. </div>
  788. </a>
  789. </div>
  790. </div>
  791. </div>
  792. <div class="part lg">
  793. <div class="item_prod">
  794. <div class="item_state">
  795. <button type="button" class="itemLike" tabindex="0">관심상품 추가</button>
  796. <a href="#none" class="itemLink" tabindex="0">
  797. <div class="itemPic">
  798. <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/main_sug03.jpg">
  799. </div>
  800. <div class="itemInfo">
  801. <p class="itemBrand">BRAND NAME</p>
  802. <div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>
  803. <p class="itemPrice">80,100</p>
  804. </div>
  805. </a>
  806. </div>
  807. </div>
  808. </div>
  809. </div>
  810. <div class="fy_item" id="fy3"></div>
  811. <div class="fy_item" id="fy4"></div>
  812. <div class="fy_item" id="fy5"></div>
  813. <div class="fy_item" id="fy6"></div>
  814. <div class="fy_item" id="fy7"></div>
  815. <div class="fy_item" id="fy8"></div>
  816. <div class="fy_item" id="fy9"></div>
  817. <div class="fy_item" id="fy10"></div>
  818. </div>
  819. </div>
  820. <!-- End Of Main Contents -->
  821. </div>
  822. </div>
  823. <script th:inline="javascript">
  824. /*<![CDATA[*/
  825. var mainLayoutList = [[${mainLayoutList}]];
  826. // var targetTime = $("#socailForm").find("input[name=targetTime]").val();
  827. // if(targetTime != null && targetTime != ''){
  828. // /* 핫딜 countDown */
  829. // var endTime = new Date(targetTime); // 남은시간 지정
  830. // endTime = (Date.parse(endTime) / 1000);
  831. //
  832. // var countdown = document.getElementById("tiles"); // get tag element
  833. //
  834. // getCountdown();
  835. //
  836. // setInterval(function () { getCountdown(); }, 1000);
  837. //
  838. // function getCountdown(){
  839. // // find the amount of "seconds" between now and target
  840. // var now = new Date();
  841. // now = (Date.parse(now) / 1000);
  842. //
  843. // var timeLeft = endTime - now;
  844. //
  845. // var days = Math.floor(timeLeft / 86400);
  846. // var hours = Math.floor((timeLeft - (days * 86400)) / 3600);
  847. // var minutes = Math.floor((timeLeft - (days * 86400) - (hours * 3600 )) / 60);
  848. // var seconds = Math.floor((timeLeft - (days * 86400) - (hours * 3600) - (minutes * 60)));
  849. //
  850. // if (hours < '10') { hours = '0' + hours; }
  851. // if (minutes < '10') { minutes = '0' + minutes; }
  852. // if (seconds < '10') { seconds = '0' + seconds; }
  853. //
  854. // // format countdown string + set tag value
  855. // countdown.innerHTML = "<span>" + hours + "</span><span>" + minutes + "</span><span>" + seconds + "</span>";
  856. // }
  857. //
  858. // function pad(n) {
  859. // return (n < 10 ? '0' : '') + n;
  860. // }
  861. // }
  862. // 컨텐츠 호출
  863. $(document).ready( function() {
  864. //$("#header").load("head.html");
  865. //$("#footer").load("foot.html");
  866. $(".tag_list .btn").eq(0).trigger('click');
  867. let randomNum = Math.floor( ( Math.random() * 4 ) );
  868. $(".it_nav .btn").eq(randomNum).trigger('click');
  869. });
  870. /* SLIDE - MAIN_VISUAL */
  871. var agent = navigator.userAgent.toLowerCase();
  872. if ( (navigator.appName == 'Netscape' && agent.indexOf('trident') != -1) || (agent.indexOf("msie") != -1)) {
  873. // ie일 경우
  874. var post01 = new Swiper('.main_visual .post-visual.swiper-container', {
  875. // Optional parameters
  876. loop: true,
  877. slidesPerView: 'auto',
  878. spaceBetween: 100,
  879. // initialSlide: 0,
  880. // 초기 슬라이드의 색인 번호입니다
  881. centeredSlides: true,
  882. // slidesOffsetBefore: 250,
  883. // 컨테이너 시작 부분 (모든 슬라이드 이전)에 슬라이드 오프셋 추가 (픽셀 단위)
  884. speed : 1000,
  885. // Navigation arrows
  886. //autoplay: false,
  887. autoplay: {
  888. delay: 2000,
  889. disableOnInteraction: false,
  890. },
  891. navigation: {
  892. nextEl: '.post-visual .swiper-button-next',
  893. prevEl: '.post-visual .swiper-button-prev',
  894. },
  895. pagination: {
  896. el: '.main_visual .swiper-pagination',
  897. clickable: true,
  898. },
  899. });
  900. }else{
  901. // ie가 아닐 경우
  902. var post01 = new Swiper('.main_visual .post-visual', {
  903. // Optional parameters
  904. loop: true,
  905. slidesPerView: 'auto',
  906. spaceBetween: 70,
  907. // initialSlide: 0,
  908. // 초기 슬라이드의 색인 번호입니다
  909. centeredSlides: true,
  910. // slidesOffsetBefore: 250,
  911. // 컨테이너 시작 부분 (모든 슬라이드 이전)에 슬라이드 오프셋 추가 (픽셀 단위)
  912. speed : 1000,
  913. // Navigation arrows
  914. autoplay: {
  915. delay: 2000,
  916. disableOnInteraction: false,
  917. },
  918. navigation: {
  919. nextEl: '.post-visual .swiper-button-next',
  920. prevEl: '.post-visual .swiper-button-prev',
  921. },
  922. pagination: {
  923. el: '.main_visual .swiper-pagination',
  924. clickable: true,
  925. },
  926. });
  927. }
  928. //MAIN_VISUAL_자동재생 스탑
  929. $(document).on('click','.main_visual .slide-curb-pause',function(e){
  930. post01.autoplay.stop();
  931. $(this).hide();
  932. $('.main_visual .slide-curb-play').show();
  933. });
  934. //MAIN_VISUAL_자동재생 시작
  935. $(document).on('click','.main_visual .slide-curb-play',function(e){
  936. post01.autoplay.start();
  937. $(this).hide();
  938. $('.main_visual .slide-curb-pause').show();
  939. });
  940. /* SLIDE - MAIN_TRENDY */
  941. var main_trendy_slide = new Swiper('.main_trendy .post-trendy', {
  942. watchSlidesProgress: true,
  943. watchSlidesVisibility: true,
  944. allowTouchMove: false,
  945. loof: false,
  946. loopAdditionalSlides : 1,
  947. speed : 1000,
  948. autoplay: {
  949. delay: 30000,
  950. disableOnInteraction:false,
  951. },
  952. navigation: {
  953. nextEl: '.main_trendy .swiper-button-next',
  954. prevEl: '.main_trendy .swiper-button-prev',
  955. },
  956. // pagination: {
  957. // el: '.main_trendy .swiper-pagination',
  958. // clickable: true,
  959. // },
  960. slidesPerView: 'auto',
  961. spaceBetween: 22,
  962. });
  963. main_trendy_slide.on('slideChange', function () {
  964. var newitemIndex = main_trendy_slide.activeIndex;
  965. var slideWidth = $(".main_trendy .swiper-slide-visible").eq(0).width() + 22;
  966. $(".main_trendy .swiper-slide").removeClass('scaleBig');
  967. $(".main_trendy .swiper-slide-visible").eq(0).addClass('scaleBig');
  968. $(".main_trendy .swiper-slide-visible").eq(3).addClass('scaleBig');
  969. $(".main_trendy .swiper-wrapper").css("transform","translateX(-"+ (slideWidth * newitemIndex) +"px)");
  970. });
  971. main_trendy_slide.on('reachEnd', function () {
  972. var newitemIndex = main_trendy_slide.activeIndex + 1;
  973. var slideWidth = $(".main_trendy .swiper-slide-visible").eq(0).width() + 22;
  974. $(".main_trendy .swiper-slide").removeClass('scaleBig');
  975. $(".main_trendy .swiper-slide-visible").eq(1).addClass('scaleBig');
  976. $(".main_trendy .swiper-slide-visible").eq(4).addClass('scaleBig');
  977. $(".main_trendy .swiper-wrapper").css("transform","translateX(-"+ (slideWidth * newitemIndex) +"px)");
  978. function l(n) {
  979. if (n.direction !== "none")
  980. {
  981. var t = n.direction === "next" ? n.currentIndex + 1 : n.currentIndex - 1;
  982. o(t)
  983. }
  984. }
  985. });
  986. /* SLIDE - MAIN_IT */
  987. var main_it_slide = new Swiper ('.main_it .post-it', {
  988. //loop: true,
  989. slidesPerView: 'auto',
  990. spaceBetween: 20,
  991. slidesPerView: 4,
  992. observer: true,
  993. observeParents: true,
  994. speed : 1000,
  995. freeMode: true,
  996. autoplay: false,
  997. scrollbar: {
  998. el: '.main_it .swiper-scrollbar',
  999. hide: false,
  1000. },
  1001. });
  1002. //MAIN_IT_카테고리 탭
  1003. $(".main_it .it_nav .btn").click(function(){
  1004. var itActive = $(this).attr('data-tab');
  1005. $(".main_it .it_nav .btn").removeClass('active');
  1006. $(".main_it .it_item").removeClass('active');
  1007. $(this).addClass('active');
  1008. $('#'+itActive).addClass('active');
  1009. });
  1010. /* SLIDE - MAIN_DEAL */
  1011. var main_deal_slide = new Swiper ('.main_deal .post-deal', {
  1012. loop: false,
  1013. slidesPerView: 4,
  1014. // slidesToScroll: 4,
  1015. // centeredSlides: true,
  1016. speed : 1000,
  1017. autoWidth: true,
  1018. autoplay: false,
  1019. freeMode:true,
  1020. spaceBetween: 20,
  1021. // autoplay: {
  1022. // delay: 2000,
  1023. // disableOnInteraction: false,
  1024. // },
  1025. scrollbar: {
  1026. el: '.post-deal .swiper-scrollbar',
  1027. hide: false,
  1028. },
  1029. });
  1030. /* 브랜드 PICK 갯수체크 210430_수정 */
  1031. var pickCont = $('.post-pick-nav .swiper-slide');
  1032. var pickLength = pickCont.length;
  1033. if (pickLength < 2) {
  1034. /* SLIDE - MAIN_PICK */
  1035. var main_pick_nav = new Swiper('.main_pick .post-pick-nav', { //top
  1036. initialSlide: 0,
  1037. slidesPerView: 6,
  1038. // slidesPerGroup: 6,
  1039. loop: false,
  1040. watchOverflow : true,
  1041. loopeSlides: 6,
  1042. loopFillGroupWithBlank : true,
  1043. // slideToClickedSlide : true,
  1044. slideToClickedSlide : true,
  1045. loopAdditionalSlides : 1,
  1046. // centeredSlides : true,
  1047. watchSlidesVisibility: true,
  1048. watchSlidesProgress: true,
  1049. freeMode: false,
  1050. navigation: {
  1051. nextEl: '.main_pick .swiper-button-next',
  1052. prevEl: '.main_pick .swiper-button-prev',
  1053. },
  1054. // autoplay: {
  1055. // delay: 5000,
  1056. // disableOnInteraction: false,
  1057. // },
  1058. });
  1059. } else {
  1060. /* SLIDE - MAIN_PICK */
  1061. var main_pick_nav = new Swiper('.main_pick .post-pick-nav', { //top
  1062. initialSlide: 0,
  1063. slidesPerView: 6,
  1064. // slidesPerGroup: 6,
  1065. loop: true,
  1066. loopeSlides: 6,
  1067. loopFillGroupWithBlank : true,
  1068. // slideToClickedSlide : true,
  1069. slideToClickedSlide : true,
  1070. loopAdditionalSlides : 1,
  1071. // centeredSlides : true,
  1072. watchSlidesVisibility: true,
  1073. watchSlidesProgress: true,
  1074. freeMode: false,
  1075. navigation: {
  1076. nextEl: '.main_pick .swiper-button-next',
  1077. prevEl: '.main_pick .swiper-button-prev',
  1078. },
  1079. // autoplay: {
  1080. // delay: 5000,
  1081. // disableOnInteraction: false,
  1082. // },
  1083. });
  1084. }
  1085. /* 브랜드 PICK 갯수체크 210430_수정 */
  1086. var pickForCont = $('.post-pick-for .swiper-slide');
  1087. var pickForLength = pickForCont.length;
  1088. if (pickForLength < 2) {
  1089. var main_pick_post = new Swiper('.main_pick .post-pick-for', { //thumbs
  1090. initialSlide: 0,
  1091. slidesPerView: 1,
  1092. // slidesPerGroup: 6,
  1093. loop: false,
  1094. watchOverflow : true,
  1095. loopeSlides: 6,
  1096. spaceBetween: 10,
  1097. // loopFillGroupWithBlank : true,
  1098. loopAdditionalSlides: 1,
  1099. allowTouchMove: false,
  1100. navigation: {
  1101. nextEl: '.main_pick .swiper-button-next',
  1102. prevEl: '.main_pick .swiper-button-prev',
  1103. },
  1104. thumbs: {
  1105. swiper: main_pick_nav
  1106. },
  1107. // autoplay: {
  1108. // delay: 5000,
  1109. // disableOnInteraction: false,
  1110. // },
  1111. });
  1112. }else{
  1113. var main_pick_post = new Swiper('.main_pick .post-pick-for', { //thumbs
  1114. initialSlide: 0,
  1115. slidesPerView: 1,
  1116. // slidesPerGroup: 6,
  1117. loop: true,
  1118. loopeSlides: 6,
  1119. //spaceBetween: 10,
  1120. // loopFillGroupWithBlank : true,
  1121. loopAdditionalSlides: 1,
  1122. allowTouchMove: false,
  1123. navigation: {
  1124. nextEl: '.main_pick .swiper-button-next',
  1125. prevEl: '.main_pick .swiper-button-prev',
  1126. },
  1127. thumbs: {
  1128. swiper: main_pick_nav
  1129. },
  1130. // autoplay: {
  1131. // delay: 5000,
  1132. // disableOnInteraction: false,
  1133. // },
  1134. });
  1135. }
  1136. // main_pick_nav.controller.control = main_pick_post;
  1137. // main_pick_post.controller.control = main_pick_nav;
  1138. var main_pick_lookbook = new Swiper ('.main_pick .post-lookbook', {
  1139. slidesPerView: 1,
  1140. speed : 1000,
  1141. // loop: true,
  1142. watchOverflow: true, //loop와 함께 사용 불가.
  1143. autoplay: {
  1144. delay: 2000,
  1145. disableOnInteraction: false,
  1146. },
  1147. pagination: {
  1148. el: '.main_pick .post-lookbook .swiper-pagination',
  1149. clickable: true,
  1150. },
  1151. });
  1152. //210506_수정 : 기획전 배너 swiper 무한루프 변경.
  1153. var pickBnnCont = $('.post-bnnWide .swiper-slide');
  1154. var pickBnnLength = pickBnnCont.length;
  1155. if (pickBnnLength < 2) {
  1156. /* SLIDE - MAIN_BANNER WIDE */
  1157. var main_bnnWide_slide = new Swiper ('.main_1stage .post-bnnWide', {
  1158. slidesPerView: 1,
  1159. speed : 1500,
  1160. initialSlide: 0,
  1161. loop: false,
  1162. watchOverflow: true, //loop와 함께 사용 불가.
  1163. autoplay: {
  1164. delay: 4000,
  1165. disableOnInteraction: false,
  1166. },
  1167. navigation: {
  1168. nextEl: '.main_1stage .swiper-button-next',
  1169. prevEl: '.main_1stage .swiper-button-prev',
  1170. },
  1171. // allowTouchMove : false,
  1172. // centeredSlides: true,
  1173. });
  1174. }else{
  1175. /* SLIDE - MAIN_BANNER WIDE */
  1176. var main_bnnWide_slide = new Swiper ('.main_1stage .post-bnnWide', {
  1177. slidesPerView: 1,
  1178. speed : 1500,
  1179. initialSlide: 0,
  1180. loop: true,
  1181. watchOverflow: true, //loop와 함께 사용 불가.
  1182. autoplay: {
  1183. delay: 4000,
  1184. disableOnInteraction: false,
  1185. },
  1186. navigation: {
  1187. nextEl: '.main_1stage .swiper-button-next',
  1188. prevEl: '.main_1stage .swiper-button-prev',
  1189. },
  1190. // allowTouchMove : false,
  1191. // centeredSlides: true,
  1192. });
  1193. }
  1194. /* SLIDE - MAIN_RECOMM */
  1195. //MAIN_RECOMM_키워드 탭
  1196. $(".main_recomm .tag_list .btn").click(function(){
  1197. var recommActive = $(this).attr('data-tab');
  1198. $(".main_recomm .tag_list .btn").removeClass('active');
  1199. $(".main_recomm .tagitem").removeClass('active');
  1200. $(this).addClass('active');
  1201. $('#'+recommActive).addClass('active');
  1202. });
  1203. function init(){
  1204. if(main_recomm_slide != null) main_recomm_slide.destroy();
  1205. var main_recomm_slide = new Swiper ('.main_recomm .post-recomm', {
  1206. slidesPerView: 5,
  1207. slidesPerGroup: 5,
  1208. speed : 1500,
  1209. spaceBetween: 20,
  1210. loop : true,
  1211. pagination: {
  1212. el: '.main_recomm .swiper-pagination',
  1213. clickable: true,
  1214. },
  1215. navigation: {
  1216. nextEl: '.main_recomm .swiper-button-next',
  1217. prevEl: '.main_recomm .swiper-button-prev',
  1218. },
  1219. observer:true,
  1220. observeParents: true,
  1221. });
  1222. }
  1223. init();
  1224. /* SLIDE - MAIN_FORYOU */
  1225. var cntNum = 0;
  1226. var main_foryou_slide = new Swiper ('.main_foryou .post-sug .swiper-container', {
  1227. allowTouchMove: false,
  1228. loop: false,
  1229. effect: 'fade',
  1230. autoHeight: false,
  1231. autoplay: {
  1232. delay: 25000,
  1233. disableOnInteraction: false,
  1234. },
  1235. pagination: {
  1236. el: '.post-sug .swiper-pagination',
  1237. clickable: true,
  1238. },
  1239. on : {
  1240. slideChange: function(){
  1241. $(".fy_nav .swiper-slide li").children('.btn_shape').removeClass('active');
  1242. $(".fy_nav .swiper-slide-next li").eq(0).children('.btn_shape').addClass('active');
  1243. $(".fy_nav .swiper-slide-prev li").eq(0).children('.btn_shape').addClass('active');
  1244. foryouIndex = -1;
  1245. if(cntNum === 0){
  1246. $('.fy_item').removeClass('active');
  1247. $('#fy6').addClass('active');
  1248. cntNum = 1;
  1249. } else {
  1250. $('.fy_item').removeClass('active');
  1251. $('#fy1').addClass('active');
  1252. cntNum = 0;
  1253. }
  1254. clearInterval(ti);
  1255. ti = startTimeInterval();
  1256. }
  1257. },
  1258. });
  1259. function foryouInterval(_foryouIndex) {
  1260. var foryouCateItems = $(".main_foryou .fy_nav .swiper-slide-active ul li .btn_shape");
  1261. $(foryouCateItems[(_foryouIndex + 1) % 5]).addClass("active");
  1262. $(foryouCateItems[_foryouIndex % 5]).removeClass("active");
  1263. }
  1264. function foryouFy_item(_Fy_itemIndex) {
  1265. var fynavItems = $('.main_foryou .fy_nav .swiper-slide-active ul li .btn_shape.active');
  1266. var fyActive = $(fynavItems).attr('data-tab');
  1267. // $(".fy_nav .btn_shape").removeClass('active');
  1268. $(".fy_item").removeClass('active');
  1269. // $(".fy_item").addClass('active');
  1270. $('#'+fyActive).addClass('active');
  1271. }
  1272. var foryouIndex = 0;
  1273. var ti;
  1274. function startTimeInterval() {
  1275. return setInterval(function () {
  1276. $(".fy_nav .btn_shape").removeClass('active');
  1277. $(".fy_item").removeClass('active');
  1278. foryouInterval(foryouIndex);
  1279. foryouFy_item();
  1280. if (foryouIndex >= 5) foryouIndex = 0;
  1281. foryouIndex++;
  1282. }, 5000);
  1283. }
  1284. $(".fy_nav .btn_shape").click(function(){
  1285. var fyActive = $(this).attr('data-tab');
  1286. $(".fy_nav .btn_shape").removeClass('active');
  1287. $(".fy_item").removeClass('active');
  1288. $(this).addClass('active');
  1289. $('#'+fyActive).addClass('active');
  1290. });
  1291. $(".fy_nav ul li").click(function(){
  1292. foryouIndex = $(this).index();
  1293. clearInterval(ti);
  1294. ti = startTimeInterval();
  1295. });
  1296. ti = startTimeInterval();
  1297. /* SLIDE - MAIN_TV */
  1298. var main_tv_slide = new Swiper ('.main_tv .post-tv', {
  1299. loop: true,
  1300. slidesPerView: 'auto',
  1301. spaceBetween: 170,
  1302. centeredSlides: true,
  1303. speed : 800,
  1304. autoplay: false,
  1305. navigation: {
  1306. nextEl: '.main_tv .swiper-button-next',
  1307. prevEl: '.main_tv .swiper-button-prev',
  1308. },
  1309. pagination: {
  1310. el: '.main_tv .swiper-pagination',
  1311. clickable: true,
  1312. },
  1313. });
  1314. $(document).ready(function() {
  1315. // 몰메인 <br> 태그
  1316. $('.mainTitle').each(function (){
  1317. var brText = $(this).find("input[name=mainTitlee]").val();
  1318. let tag = brText.replace(/(<br>|<br\/>|<br \/>)/g, '<br>');
  1319. $(this).append(tag);
  1320. });
  1321. // 가로긴배너 슬라이드
  1322. $('.silderBannerArea').each(function (){
  1323. let tag = '';
  1324. if(!gagajf.isNull($(this).find("input[name=bannerNote]").val())) {
  1325. var noteText = $(this).find("input[name=bannerNote]").val();
  1326. tag = noteText.replace(/(<br>|<br\/>|<br \/>)/g, '<br>');
  1327. $(this).find('.noteArea').append(tag);
  1328. }
  1329. });
  1330. // 스타일리포트 <br> 태그
  1331. $('.styleArea').each(function (){
  1332. let tag = '';
  1333. let tag2 = '';
  1334. if(!gagajf.isNull($(this).find("input[name=styleTitle]").val())) {
  1335. var titleText = $(this).find("input[name=styleTitle]").val();
  1336. tag = titleText.replace(/(<br>|<br\/>|<br \/>)/g, '<br>');
  1337. $(this).find('.styleTitleC').append(tag);
  1338. }
  1339. if(!gagajf.isNull($(this).find("input[name=styleNote]").val())) {
  1340. var noteText = $(this).find("input[name=styleNote]").val();
  1341. tag2 = noteText.replace(/(<br>|<br\/>|<br \/>)/g, '<br>');
  1342. $(this).find('.styleNoteC').append(tag2);
  1343. }
  1344. });
  1345. // 잇아이템 <br> 태그
  1346. if(!gagajf.isNull($("#id004").find("input[name=title]").val())){
  1347. var id004Text = $("#id004").find("input[name=title]").val();
  1348. let tag = id004Text.replace(/(<br>|<br\/>|<br \/>)/g, '<br>');
  1349. $("#id004").append(tag);
  1350. }
  1351. // 핫딜 <br> 태그
  1352. if(!gagajf.isNull($("#id006").find("input[name=title]").val())){
  1353. var id006Text = $("#id006").find("input[name=title]").val();
  1354. let tag = id006Text.replace(/(<br>|<br\/>|<br \/>)/g, '<br>');
  1355. $("#id006").append(tag);
  1356. }
  1357. // 브랜드픽 <br> 태그
  1358. $('#id007 .title').each(function (){
  1359. let tag = '';
  1360. if(!gagajf.isNull($(this).find("input[name=title]").val())){
  1361. var brText = $(this).find("input[name=title]").val();
  1362. tag = brText.replace(/(<br>|<br\/>|<br \/>)/g, '<br>');
  1363. $(this).append(tag);
  1364. }
  1365. });
  1366. });
  1367. /*]]>*/
  1368. </script>
  1369. </th:block>
  1370. </body>
  1371. </html>