PlanningDetailFormMob.html 41 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075
  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/SubLayoutMob">
  6. <!--
  7. *******************************************************************************
  8. * @source : PlanningDetailFormMob.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.05.12 sowon 최초 작성
  17. *******************************************************************************
  18. -->
  19. <body>
  20. <th:block layout:fragment="content">
  21. <script src="https://developers.kakao.com/sdk/js/kakao.min.js"></script>
  22. <main role="" id="" class="container dp">
  23. <section class="content">
  24. <div class="inner">
  25. <div class="promotion_tit">
  26. <h3 th:text="${planInfo.planNm}"></h3>
  27. <div class="period">
  28. <span th:text="${planInfo.dispStdt}"></span> - <span th:text="${planInfo.dispEddt}"></span>
  29. </div>
  30. <button type="button" class="share_btn"><img src="/images/mo/ico_share_btn.png" alt="공유" /></button>
  31. </div>
  32. </div>
  33. <div class="inner wide">
  34. <div class="promotion_visual type1" th:if="${fsrcInfoTop != null}" th:utext="${#strings.replace(#strings.replace(fsrcInfoTop.fsrcMob,'&amplt;','<'),'&ampgt;','>')}">>
  35. </div>
  36. </div>
  37. <th:block th:each="a, template : ${templateOrd}">
  38. <th:block th:if="${a.tmplType == 'G082_10'}">
  39. <div class="inner bg_gray" th:id="${a.tmplType}">
  40. </div>
  41. </th:block>
  42. <th:block th:if="${a.tmplType == 'G082_20'}">
  43. <div class="inner" th:id="${a.tmplType}">
  44. </div>
  45. </th:block>
  46. <th:block th:if="${a.tmplType == 'G082_30'}"><!-- 이미지 -->
  47. <div class="inner wide" th:id="${a.tmplType}">
  48. </div>
  49. </th:block>
  50. <th:block th:if="${a.tmplType == 'G082_50'}">
  51. <div class="inner wide" th:id="${a.tmplType + a.planContSq}">
  52. </div>
  53. </th:block>
  54. <th:block th:if="${a.tmplType == 'G082_51'}">
  55. <div class="inner" th:id="${a.tmplType + a.planContSq}">
  56. <div class="dp_listItems_wrap">
  57. <h2 class="dp_subtitle">
  58. <a th:if="${a.linkUrl!=null && a.linkUrl!=''}" th:href="${a.linkUrl}" th:text="${a.title}"></a>
  59. <a th:unless="${a.linkUrl!=null && a.linkUrl!=''}" href="javascript:void(0)" th:text="${a.title}"></a>
  60. </h2>
  61. <div class="itemsGrp" th:id="'group_'+${a.planContSq}">
  62. </div>
  63. <button class="btn btn_default" th:id="'moreBtn_'+${a.planContSq}" th:onclick="moreBtn([[${a.planContSq}]])">더보기</button>
  64. </div>
  65. </div>
  66. </th:block>
  67. <th:block th:if="${a.tmplType == 'G082_52'}">
  68. <div class="inner" th:id="${a.tmplType + a.planContSq}">
  69. </div>
  70. </th:block>
  71. </th:block>
  72. <div class="inner" th:if="${fsrcInfoBtm != null}" th:utext="${#strings.replace(#strings.replace(fsrcInfoBtm.fsrcMob,'&amplt;','<'),'&ampgt;','>')}"></div>
  73. <div class="inner" th:if="${planInfo.pollSq != null}">
  74. <div class="dp_btn_area">
  75. <div class="btn_wrap">
  76. <a href="javascript:;" id="btn_survey" class="btn btn_primary" onclick="javascript:fnJoinConfirm()"><span>설문조사 참여하기</span></a>
  77. </div>
  78. </div>
  79. </div>
  80. <!-- 댓글리스트 -->
  81. <th:block th:if="${planInfo.replyYn == 'Y'}">
  82. <div class="inner wide">
  83. <form action="" class="form_wrap">
  84. <div class="cmt_wrap">
  85. <div class="cmt_write">
  86. <div class="cmt_tarea">
  87. <div class="form_field">
  88. <div class="ui_col_12 comment_textarea">
  89. <div class="input_wrap">
  90. <textarea class="doc_contactus" name="replyText" id="replyText" placeholder="500자 이내로 입력해 주세요." style="resize: none;" onclick="fnTextConfirm()" maxlength="500"></textarea>
  91. <p class="txt_cnt">
  92. <span id="contactus_cnt" class="contactus_cnt"><em class="c_primary" id="cmt_cnt">0</em>/500</span>
  93. </p>
  94. </div>
  95. </div>
  96. </div>
  97. </div>
  98. <div class="cmt_thumb">
  99. <div class="form_field">
  100. <div class="input_wrap">
  101. <div class="form_field">
  102. <div class="imgUpload">
  103. <label for="fileAdd" class="fileAdd" id="fileAdd_reply">첫번째업로드</label>
  104. <input type="file" id="fileAdd" name="files" accept=".jpeg, .jpg, .png">
  105. </div>
  106. </div>
  107. </div>
  108. </div>
  109. </div>
  110. <div class="btn_wrap">
  111. <button type="button" id="btn_cmt_regist" class="btn btn_dark" onclick="fnReplySave()"><span>등록</span></button>
  112. </div>
  113. </div>
  114. <!-- 댓글 -->
  115. <div class="cmt_group" id="replyList">
  116. <!-- <div class="paging_wrap">
  117. <ul class="pageNav">
  118. <li class="prev"><a href="#"><span class="sr-only">이전</span></a></li>
  119. <li class="active">01</li>
  120. <li>/</li>
  121. <li>10</li>
  122. <li class="next"><a href="#"><span class="sr-only">다음</span></a></li>
  123. </ul>
  124. </div> -->
  125. <!-- 임시 -->
  126. <div class="paging_wrap">
  127. <ul class="pageNav" id="paging">
  128. </ul>
  129. </div>
  130. <!-- 임시 -->
  131. </div>
  132. </div>
  133. </form>
  134. </div>
  135. </th:block>
  136. <th:block th:if="${#lists.size(planCornerList)}>0">
  137. <div class="inner" id="cornerInner">
  138. <div class="dp_listItems_wrap typeSelector">
  139. <div class="items_option">
  140. <div class="open_categori" style="position: relative; width: 100%; z-index: 0;">
  141. <a id="filter"></a>
  142. </div>
  143. </div>
  144. </div>
  145. </div>
  146. <div id="cornerGoodsList"></div>
  147. </th:block>
  148. <div class="inner">
  149. <div class="other_promotion_slide">
  150. <h2 th:if="${planInfo.planGb == 'P'}" class="dp_subtitle">다른 기획전 보기</h2>
  151. <h2 th:if="${planInfo.planGb == 'E'}" class="dp_subtitle">다른 이벤트 보기</h2>
  152. <div class="swiper-container">
  153. <div class="swiper-wrapper">
  154. <th:block th:each="PlanData, PlanStat : ${planList}">
  155. <div class="swiper-slide">
  156. <a th:onclick="cfnGoToPlanDetail([[${PlanData.planSq}]])" class="dp_lookbook_item" tabindex="0">
  157. <div class="img">
  158. <img th:src="${@environment.getProperty('upload.image.view')+PlanData.mainImg}" alt="${PlanData.planNm}">
  159. </div>
  160. <div class="txt">
  161. <div class="tit" th:text="${PlanData.planNm}"></div>
  162. </div>
  163. </a>
  164. </div>
  165. </th:block>
  166. </div>
  167. </div>
  168. </div>
  169. </div>
  170. </section>
  171. <!-- 코너 클릭 팝 -->
  172. <div id="odDatePop" class="popup_box odDatePop">
  173. <div class="lap">
  174. <div class="popup_close">카테고리닫기</div>
  175. <div class="popup_head sr-only">
  176. <h2 class="">기간 선택 팝업</h2>
  177. </div>
  178. <div class="popup_con">
  179. <div class="button_list clear">
  180. <th:block th:if="${planCornerList!=null}" th:each="a, cornerStat : ${planCornerList}">
  181. <button type="button" th:onclick="fnCornerClick([[${cornerStat.index+1}]], [[${a.cornerNm}]])"><span th:text="${a.cornerNm}"></span></button>
  182. </th:block>
  183. </div>
  184. </div>
  185. </div>
  186. </div>
  187. <!-- 쿠폰사용안내 팝업 -->
  188. <div class="modal fade couponInfo_pop" id="couponInfoPop" tabindex="-1" role="dialog" aria-labelledby="couponInfoLabel" aria-hidden="true">
  189. <div class="modal-dialog" role="document">
  190. <div class="modal-content">
  191. <!-- 쿠폰사용안내 팝업 내용 -->
  192. </div>
  193. </div>
  194. <a href="#close-modal" rel="modal:close" id="couponInfoPop_close" class="close-modal">Close</a>
  195. </div>
  196. </main>
  197. <div class="modal pop_full photo_comment_popup" id="photo_full_popup" tabindex="-1" role="dialog" aria-labelledby="comment_popup" aria-hidden="true">
  198. </div>
  199. <th:block th:each="a, template : ${templateOrd}">
  200. <th:block th:if="${a.tmplType == 'G082_51'}">
  201. <form th:id="'searchForm1_'+${a.tmplType + a.planContSq}" name="searchForm1" th:action="@{'/planning/goods/list'}" th:method="post">
  202. <input type="hidden" name="pageNo2" value="1" />
  203. <input type="hidden" name="pageSize2" value="6" />
  204. <input type="hidden" name="tmplType" th:value="${a.tmplType}" />
  205. <input type="hidden" name="planContSq" th:value="${a.planContSq}" />
  206. <input type="hidden" name="planSq" th:value="${planInfo.planSq}" />
  207. </form>
  208. </th:block>
  209. </th:block>
  210. <form id="searchForm" name="searchForm" th:action="@{/planning/reply/list}" th:method="post">
  211. <input type="hidden" name="pageNo" value="1" />
  212. <input type="hidden" name="planSq" th:value="${planInfo.planSq}" />
  213. <input type="hidden" name="pageSize" value="10" />
  214. </form>
  215. <script src="/ux/plugins/gaga/gaga.paging.js"></script>
  216. <script th:inline="javascript">
  217. let review = [[${reviewInfo}]];
  218. let coupon = [[${couponInfo}]];
  219. let plan = [[${planInfo}]];
  220. let image = [[${imageInfo}]];
  221. let goods1 = [[${goods1Info}]];
  222. let goods2 = [[${goods2Info}]];
  223. let goods4 = [[${goods4Info}]];
  224. let template =[[${templateOrd}]];
  225. let replyList = [[${replyList}]];
  226. let replyCount = [[${replyCount}]];
  227. let replyAttachList = [[${replyAttachList}]];
  228. let planCornerGoodsList = [[${planCornerGoodsList}]];
  229. let planCornerList = [[${planCornerList}]];
  230. let _mall = [[${@environment.getProperty('domain.front')}]];
  231. let goodsView =[[${@environment.getProperty('upload.goods.view')}]]
  232. let imgUrl=[[${@environment.getProperty('upload.image.view')}]];
  233. var ajaxReplyList = function () {
  234. gagaPaging.init('searchForm', fnSearchCallback, 'paging', 10);
  235. gagaPaging.load(1);
  236. }
  237. var fnSearchCallback = function (result) {
  238. $("#replyList").html('');
  239. if (result!=null) {
  240. var html = '';
  241. html += '<div class="cmt_list_tit">';
  242. html += ' <strong>댓글</strong><span class="cnt">('+result.replyCount.addComma()+')</span> ';
  243. html += '</div>';
  244. if (result.replyList.length>0) {
  245. html += '<ul class="cmt_list">';
  246. $.each(result.replyList, function (idx, item) {
  247. html += ' <li>';
  248. html += ' <div class="cmt_top">';
  249. html += ' <span class="writer">'+item.maskingCustId+'</span>';
  250. html += ' <span class="date">'+item.entryDt+'</span>';
  251. if (item.entryCustNo == result.custNo) {
  252. html += ' <button type="button" id="btn_cmt_delete" class="btn_del" value="'+item.planEntrySq+'" onclick="fnDelReply(this.value)">삭제</button>';
  253. }
  254. html += ' </div>';
  255. html += ' <div class="cmt_cont">';
  256. if (result.replyAttachList.length>0) {
  257. html += ' <div class="img_wrap clear">';
  258. for (var i = 0; i < result.replyAttachList.length; i++) {
  259. if(result.replyAttachList[i].planEntrySq == item.planEntrySq){
  260. html += ' <div class="pics"><img class="picsThumbs" src="'+ imgUrl +'/'+result.replyAttachList[i].sysFileNm +'" onclick="cfPlanReplyDetail(\''+item.planSq+'\',\''+item.planEntrySq+'\',\''+result.replyAttachList[i].planEntryAtSq+'\');"></div>';
  261. }
  262. }
  263. html += ' </div>';
  264. }
  265. html += ' <p>'+item.entryVal1.escapeHtml()+'</p>';
  266. html += ' </div>';
  267. html += ' </li>';
  268. });
  269. html += '</ul>';
  270. }else{
  271. html += '<div class="nodata"> ';
  272. html += ' <div class="txt_box"> ';
  273. html += ' <p> ';
  274. html += ' 등록된 댓글이 없습니다. ';
  275. html += ' </p> ';
  276. html += ' </div> ';
  277. html += '</div> ';
  278. }
  279. }
  280. $("#replyList").append(html);
  281. // Create pagination
  282. gagaPaging.createPagination(result.paging.pageable);
  283. }
  284. // 댓글 삭제
  285. var fnDelReply = function(obj) {
  286. data = {planEntrySq : obj};
  287. var jsonData = JSON.stringify(data);
  288. mcxDialog.confirm("댓글을 삭제 하시겠습니까?", {
  289. cancelBtnText : "취소",
  290. sureBtnText : "확인",
  291. sureBtnClick : function() {
  292. gagajf.ajaxJsonSubmit('/planning/reply/delete', jsonData,function() {
  293. ajaxReplyList();
  294. });
  295. }
  296. })
  297. }
  298. $('#fileAdd').on('change', function() { fnChooseFile(this); });
  299. var fnChooseFile = function(obj) {
  300. var picLength = $(".pics").length;
  301. // multiple 속성이 있으면 files에는 다수의 객체가 할당됨
  302. var file = obj.files[0];
  303. if (!gagajf.isNull(file.name)) {
  304. var extension = "\.(jpg|jpeg|png)$";
  305. if (!(new RegExp(extension, "i")).test(file.name)) {
  306. mcxDialog.alertC('이미지는 [jpg, jpeg, png] 파일만 가능합니다.', {
  307. sureBtnText: "확인",
  308. sureBtnClick: function() {
  309. //$(obj).parent('.imgUpload').find('.removes').trigger('click');
  310. $('.imgUpload').find('span').eq(0).remove();
  311. }
  312. });
  313. return false;
  314. }
  315. }
  316. // 이거 왜 안먹히지
  317. if (!gagajf.isNull(file.size) && Number(file.size) > (10 * 1000000)) {
  318. mcxDialog.alertC('이미지는 최대 10MB 이하 파일만 가능합니다.', {
  319. sureBtnText: "확인",
  320. sureBtnClick: function() {
  321. $(obj).parent('.imgUpload').find('.removes').trigger('click');
  322. }
  323. });
  324. return false;
  325. }
  326. // 파일 업로드
  327. gagajf.ajaxFileUpload('/common/file/upload?subDir=/reply'
  328. , file
  329. , function(result) {
  330. // 업로드한 파일명 설정
  331. $(".imgUpload").find('.pics').last().append("<input type='hidden' name='orgFileNm' id='orgFileNm"+(picLength+1)+"' value='"+result.oldFileName+"'>");
  332. $(".imgUpload").find('.pics').last().append("<input type='hidden' name='sysFileNm' id='sysFileNm"+(picLength+1)+"' value='"+result.newFileName+"'>");
  333. }
  334. );
  335. }
  336. //댓글 등록 버튼 클릭 시
  337. var fnReplySave = function() {
  338. var fileLength = $("input[name='sysFileNm']").length;
  339. var content = $('#replyText').val();
  340. if (content.length < 2){
  341. mcxDialog.alert("최소 2자 이상 입력해주세요.");
  342. return;
  343. }
  344. var yokList = new Array('<script>','script','D쥐고','D지고','jonna','jot같','mi쳤','ssㅑ','tlqkf','wlfkf','같은새끼','같은새끼','개새끼','개같','개넷','개년','개념빠가','개독','개련','개련','개마이','개부랄','개삼성','개새기','개새끼','개섹','개셈','개소리','개쓰래기','개저씨','계새끼','골빈','골1빈','골빈','괘새끼','껒여','꺼지세요','꺼져요','로꺼져','로꺼져','로꺼.져','꺼.지','나빼썅','나쁜새끼','년놈','늬믜','늬미','니년','니믜','니미럴','닝기리','다꺼져','닥쳐라','닥치세','도라이','뒈져','뒤져버','디져라','디졌','디지고','디질','딴년','또라이','또라인','똘아이','ㅁㅊ','ㅁ친','맘충','보이루','망돌','머갈','먹.금','먹.끔','먹1금','먹금','먹끔','명존','믜칀','믜친','미:놈','미:놈','미1친','미놈','미시친발','미쳣네','미쳤나','미쳤니','미췬','미칀','미친새','미친~','미친개','미친새','미친색','미친ㅋ','미틴','및힌','별창','병1신','병1크','병맛','병신','병크','봊','븅신','빠큐','빡새끼','빻았','빻은','뻐규','뻐큐','뻑유','뻑큐','뻨큐','뼈큐','뽄새','뽄세','삐걱','ㅄ','ㅅ','ㅂ','ㅅ.ㅂ','ㅅ1ㅂ','ㅅ1발','ㅅㄲ네','ㅅㄲ들','ㅅ루','ㅅㅋ','ㅅㅡ루','사새끼','새.끼','새1끼','새1키','새77ㅣ','새끼라','새끼야','새퀴','새킈','새키','색희','색히','샊기','샊히','샹년','섀키','솔1친','솔친','쉬발','쉬버','쉬이바','쉬이이','쉬이이이','쉬펄','슈1발','슈레기','슈발','슈벌','슈우벌','슈ㅣ발','스.루','스벌','스죄','스타죄국','싑창','시1발','시미발친','시미친발','시바','시바류','시바시바','시바알','시바앙','시발','시방새','시벌탱','시볼탱','시부럴','시부렬','시부울','시뷰럴','시뷰렬','시빨','시새발끼','시이발','시친발미','시키가','시팔','시펄','십창','십팔','ㅆ1ㄺ','ㅆ1ㅂ','ㅆㄹㄱ','ㅆㄺ','ㅆㅂ','싸가지없','싸가지없','싸물어','쌉가','쌍년','쌍놈','쌔끼','썅','썌끼','쒸펄','쓰1레기','쓰래기같','쓰레기새','쓰레기새','쓰렉','씝창','씨1발','씨바라','씨바알','씨발','씨방새','씨버럼','씨벌','씨벌탱','씨볼탱','씨부럴','씨부렬','씨뷰럴','씨뷰렬','씨빠빠','씨빨','씨뻘','씨새발끼','씨이발','씨팔','씹귀','씹덕','씹못','씹뻐럴','씹새끼','씹쌔','씹창','씹치','씹팔','씹할','ㅇㅍㅊㅌ','아가리','아닥','아오ㅅㅂ','아오시바','아오ㅅㅂ','아오시바','애미','앰','앰창','얘쁘','얘쁜','얪','에라이퉤','에라이퉷','에라이퉤','에라이퉷','엠뷩신','엠븽신','엠빙신','엠생','엠창','엿같','엿이나','예.질','예1질','예질','옘병','외1퀴','외퀴','웅앵','웅엥','은년','은새끼','이새끼','이따위','이새끼','입털','입털','ㅈ.ㄴ','ㅈㄴ','ㅈㄹ','절라','정병','젖같','젗같','젼나','젼낰','졀라','졀리','졌같은','졏같','조낸','조온','조온나','족까','존나','존나','존','나','존.나','존1','존1나','존귀','존귘','존ㄴ나','존나','존낙','존내','졸라','좁밥','조센징','짱깨','짱개','짱꼴라','꼴라','착짱','죽짱','짱골라','좃','종나','좆','좆까','좇같','죠낸','죠온나','죤나','죤내','죵나','죶','죽어버려','죽여버리고','죽여버리고','죽여불고','죽여뿌고','중립충','줬같은','쥐랄','쥰나','쥰내','쥰니','쥰트','즤랄','지랄','지1랄','지1뢰','지껄이','지들이','지랄','지롤','지뢰','지인지조','짱깨','짱께','쪼녜','쪼다','착짱죽짱','섬숭이','쪽본','쪽1바리','쪽바리','쪽발','쫀맛','쫀1','쫀귀','쫀맛','쫂','쫓같','쬰잘','쬲','찝째끼','창년','창녀','창놈','창넘','처먹','凸','첫빠','쳐마','친년','친놈','친구년','친년','친노마','친놈','손놈','남미새','여미새','혐석','호로새끼','호로잡','화낭년','화냥년','후.려','후1려','후1빨','후려','후빨','ㅗ');
  345. if(yokList.indexOf(content)>=0){
  346. mcxDialog.alert("입력 불가한 내용을 포함하고 있습니다.");
  347. $('#replyText').val('');
  348. $('#cmt_cnt').text(0);
  349. return;
  350. }
  351. //파일관련 데이터 담기
  352. var multiReplyOrgFile = [];
  353. var multiReplySysFile = [];
  354. for (var i = 0; i < fileLength; i++) {
  355. multiReplyOrgFile.push($(".pics").eq(i).find('input[name="orgFileNm"]').val());
  356. multiReplySysFile.push($(".pics").eq(i).find('input[name="sysFileNm"]').val());
  357. }
  358. data = {entryVal1 : content,
  359. planSq : plan.planSq,
  360. multiReplyOrgFile : multiReplyOrgFile,
  361. multiReplySysFile : multiReplySysFile};
  362. var jsonData = JSON.stringify(data);
  363. mcxDialog.confirm("댓글을 등록 하시겠습니까?", {
  364. cancelBtnText : "취소",
  365. sureBtnText : "확인",
  366. sureBtnClick : function() {
  367. gagajf.ajaxJsonSubmit('/planning/reply/save', jsonData,function() {
  368. ajaxReplyList();
  369. $('#replyText').val('');
  370. $('.pics').remove();
  371. $('.fileAdd').show();
  372. //댓글 작성시 글자 카운트
  373. $('#cmt_cnt').text(0);
  374. });
  375. }
  376. })
  377. }
  378. if(planCornerList.length>0){
  379. var html = '';
  380. $.each(planCornerList, function(idx, item) {
  381. html += '<div class="inner" >';
  382. html += ' <div class="dp_listItems_wrap type'+(idx+1)+'"> ';
  383. html += ' <h2 class="dp_subtitle">'+item.cornerNm+'</h2>';
  384. html += ' <div class="list_content">';
  385. html += ' <div class="itemsGrp">';
  386. $.each(planCornerGoodsList, function(idx2, item2) {
  387. if (item2.cornerNm == item.cornerNm) {
  388. html += ' <div class="item_prod">';
  389. html += ' <div class="item_state">';
  390. html += ' <button type="button" class="itemLike';
  391. if(item2.likeIt == 'likeit'){
  392. html += ' likeit';
  393. }
  394. html += ' "';
  395. html += 'onClick="cfnPutWishList(this);" goodsCd=\''+item2.goodsCd+'\', ithrCd=\'\', contentsLoc=\'\', planDtlSq=\'\'>관심상품 추가</button>';
  396. html += ' <a href="javascript:void(0);" onclick="cfnGoToGoodsDetail(\'' + item2.goodsCd + '\')" class="itemLink">';
  397. html += ' <div class="itemPic">';
  398. html += ' <img class="vLHTC pd_img" src="'+ goodsView +'/'+item2.sysImgNm +'">';
  399. html += ' </div>';
  400. html += ' <p class="itemBrand">'+item2.brandGroupNm+'</p>';
  401. html += ' <div class="itemName">'+item2.goodsNm+'</div>';
  402. html += ' <p class="itemPrice">';
  403. if (item2.currPrice != item2.listPrice) {
  404. html += ' <span class="itemPrice_original">'+item2.listPrice.addComma()+'</span>';
  405. }
  406. html += item2.currPrice.addComma();
  407. if (item2.dcRate != 0) {
  408. html += ' <span class="itemPercent">'+item2.dcRate.addComma()+'%</span>';
  409. }
  410. html += ' </p>';
  411. html += ' <div class="itemcolorchip">';
  412. if(!gagajf.isNull(item2.colorChips)){
  413. var colorArr = item2.colorChips.split(",");
  414. var colorCd = '';
  415. var rgbColor = '';
  416. for(let i=0; i<colorArr.length; i++){
  417. var colorInfo = colorArr[i].split(":");
  418. colorCd = colorInfo[0];
  419. rgbColor = colorInfo[1];
  420. if(rgbColor=='#FFFFFF'){
  421. html += ' <span class="chip_color" style="background-color: '+rgbColor+';border:1px solid #aaa;" value="'+colorCd+'">'+colorCd+'</span>';
  422. }else{
  423. html += ' <span class="chip_color" style="background-color: '+rgbColor+'" value="'+colorCd+'">'+colorCd+'</span>';
  424. }
  425. }
  426. }
  427. html += ' </div>';
  428. if(!gagajf.isNull(item2.icon)){
  429. var iconArr = item2.icon.split(",");
  430. var iconGb = '';
  431. var iconNm = '';
  432. html += ' <p class="itemBadge">';
  433. for(let i=0; i<iconArr.length; i++){
  434. var iconInfo = iconArr[i].split(":");
  435. iconGb = iconInfo[0];
  436. iconNm = iconInfo[1];
  437. html += ' <span class="badge13" value="'+iconGb+'">'+iconNm+' </span>';
  438. }
  439. html += ' </p>';
  440. }
  441. if(item2.goodsTnm != null){
  442. html += ' <div class="itemComment">'+item2.goodsTnm+'</div>';
  443. }
  444. html += ' </a>';
  445. html += ' </div>';
  446. html += ' </div>';
  447. }
  448. });
  449. html += ' </div>';
  450. html += ' </div>';
  451. html += ' </div>';
  452. html += '</div>';
  453. });
  454. $("#cornerGoodsList").append(html);
  455. }
  456. if(goods1.length>0){
  457. var array = [];
  458. for (var j = 0; j < template.length; j++) {
  459. if(template[j].tmplType == 'G082_50'){
  460. array.push(template[j].planContSq);
  461. }
  462. }
  463. for (var i = 0; i < template.length; i++) {
  464. var html = '';
  465. if(template[i].tmplType == 'G082_50' && array[0] == template[i].planContSq && typeof array[0] != 'undefined') {
  466. html += '<div class="dp_listItems_cont type1">\n';
  467. html += ' <h2 class="dp_subtitle">\n';
  468. if (template[i].linkUrl != null && template[i].linkUrl != '') { /* 링크 변경 예정 */
  469. if (template[i].linkOpenGb == 'M') { //본창
  470. html += ' <a href="'+template[i].linkUrl+'" target="_self">'+template[i].title+'</a>\n';
  471. }else{
  472. html += ' <a href="'+template[i].linkUrl+'" target="_blank">'+template[i].title+'</a>\n';
  473. }
  474. }else{
  475. html += ' <a href="javascript:void(0)">'+template[i].title+'</a>\n';
  476. }
  477. html += ' </h2>\n';
  478. html += ' <div class="swiper-container item01">\n';
  479. html += ' <div class="swiper-wrapper">\n';
  480. $.each(goods1, function(idx, item) {
  481. if (item.planContSq == template[i].planContSq) {
  482. html += ' <div class="swiper-slide">\n';
  483. html += ' <div class="item_prod">\n';
  484. html += ' <div class="item_state">\n';
  485. html += ' <a href="#none" class="itemLink">\n';
  486. html += ' <div class="itemPic">\n';
  487. html += ' <img class="vLHTC pd_img" src="'+ goodsView +'/'+item.sysImgNm +'?RS=780" alt="">\n';
  488. html += ' </div>\n';
  489. html += ' <p class="itemBrand">'+item.brandGroupNm+'</p>\n';
  490. html += ' <div class="itemName">'+item.goodsNm+'</div>\n';
  491. html += ' <p class="itemPrice">\n';
  492. if (item.currPrice != item.listPrice) {
  493. html += ' <span class="itemPrice_original">'+item.listPrice.addComma()+'</span>\n';
  494. }
  495. html += item.currPrice.addComma();
  496. if (item.currPrice != item.listPrice) {
  497. html += ' <span class="itemPercent">'+Math.floor(item.dcRate)+'%</span>\n';
  498. }
  499. html += ' </p>\n';
  500. if(item.goodsTnm != null){
  501. html += ' <div class="itemComment">'+item.goodsTnm+'</div>\n';
  502. }
  503. html += ' </a>\n';
  504. html += ' </div>\n';
  505. html += ' </div>\n';
  506. html += ' </div>\n';
  507. }
  508. });
  509. html += ' </div>\n';
  510. html += ' <div class="swiper-pagination"></div>\n';
  511. html += ' </div>\n';
  512. html += '</div>\n';
  513. $("#G082_50" +array[0]).append(html);
  514. }
  515. if($("#G082_50" +template[i].planContSq).length){
  516. array.shift();
  517. }
  518. }
  519. }
  520. var fnCompleteList = function () {
  521. $.each(template, function(idx, item) {
  522. if(item.tmplType == "G082_51"){
  523. var form = '#searchForm1_G082_51'+item.planContSq;
  524. gagajf.ajaxFormSubmit('/planning/goods/list', form, fnGetCompleteCallback);
  525. }
  526. });
  527. }
  528. var fnGetCompleteCallback = function (result) {
  529. if (result.dataList != null && result.dataList.length > 0) {
  530. var html = '';
  531. $.each(result.dataList, function(idx, item) {
  532. html += ' <div class="item_prod">';
  533. html += ' <div class="item_state">';
  534. html += ' <a onclick="cfnGoToGoodsDetail(\'' + item.goodsCd + '\')" class="itemLink">';
  535. html += ' <div class="itemPic">';
  536. html += ' <img class="vLHTC pd_img" src="'+ goodsView +'/'+item.sysImgNm +'">';
  537. html += ' </div>';
  538. html += ' <p class="itemBrand">'+item.brandGroupNm+'</p>';
  539. html += ' <div class="itemName">'+item.goodsNm+'</div>';
  540. html += ' <p class="itemPrice">';
  541. if (item.currPrice != item.listPrice) {
  542. html += ' <span class="itemPrice_original">'+item.listPrice.addComma()+'</span>';
  543. }
  544. html += item.currPrice.addComma();
  545. if (item.currPrice != item.listPrice) {
  546. html += ' <span class="itemPercent">'+Math.floor(item.dcRate)+'%</span>';
  547. }
  548. html += ' </p>';
  549. if(item.goodsTnm != null){
  550. html += ' <div class="itemComment">'+item.goodsTnm+'</div>';
  551. }
  552. html += ' </a>';
  553. html += ' </div>';
  554. html += ' </div>';
  555. });
  556. $('#group_'+result.dataList[0].planContSq).append(html);
  557. if (result.paging1.pageable2.totalPage > result.paging1.pageable2.pageNo) {
  558. $('#moreBtn_' + result.dataList[0].planContSq).show();
  559. $('#searchForm1_G082_51'+result.dataList[0].planContSq +' input[name=pageNo2]').val(result.paging1.pageable2.pageNo + 1);
  560. }else{
  561. $('#moreBtn_' + result.dataList[0].planContSq).hide();
  562. }
  563. }
  564. }
  565. var moreBtn = function (obj) {
  566. var form = '#searchForm1_G082_51'+obj;
  567. gagajf.ajaxFormSubmit('/planning/goods/list', form, fnGetCompleteCallback);
  568. }
  569. if(goods4.length>0){
  570. var array = [];
  571. var html = '';
  572. for (var j = 0; j < template.length; j++) {
  573. if(template[j].tmplType == 'G082_52'){
  574. array.push(template[j].planContSq);
  575. }
  576. }
  577. for (var i = 0; i < template.length; i++) {
  578. if(template[i].tmplType == 'G082_52' && array[0] == template[i].planContSq && typeof array[0] != 'undefined'){
  579. html += '<div class="dp_listItems_cont type2">';
  580. if (template[i].linkUrl != null && template[i].linkUrl != '') { /* 링크 변경 예정 */
  581. if (template[i].linkOpenGb == "M") { //본창
  582. html += ' <h2 class="dp_subtitle"><a href="'+template[i].linkUrl+'" target="_self">'+template[i].title+' </a></h2>';
  583. }else{
  584. html += ' <h2 class="dp_subtitle"><a href="'+template[i].linkUrl+'" target="_blank">'+template[i].title+' </a></h2>';
  585. }
  586. }else{
  587. html += ' <h2 class="dp_subtitle"><a href="javascript:void(0)">'+template[i].title+' </a></h2>';
  588. }
  589. html += ' <div class="swiper-container item02">';
  590. html += ' <div class="swiper-wrapper">';
  591. $.each(goods4, function(idx, item) {
  592. html += ' <div class="swiper-slide">';
  593. html += ' <div class="item_prod">';
  594. html += ' <div class="item_state">';
  595. html += ' <a onclick="cfnGoToGoodsDetail(\'' + item.goodsCd + '\')" class="itemLink">';
  596. html += ' <div class="itemPic">';
  597. html += ' <img class="vLHTC pd_img" src="'+ goodsView +'/'+item.sysImgNm +'">';
  598. html += ' </div>';
  599. html += ' <p class="itemBrand">'+item.brandGroupNm+'</p>';
  600. html += ' <div class="itemName">'+item.goodsNm+'</div>';
  601. html += ' <p class="itemPrice">';
  602. if (item.currPrice != item.listPrice) {
  603. html += ' <span class="itemPrice_original">'+item.listPrice.addComma()+'</span>';
  604. }
  605. html += item.currPrice.addComma();
  606. if (item.currPrice != item.listPrice) {
  607. html += ' <span class="itemPercent">'+Math.floor(item.dcRate)+'%</span>';
  608. }
  609. html += ' </p>';
  610. if(item.goodsTnm != null){
  611. html += ' <div class="itemComment">'+item.goodsTnm+'</div>';
  612. }
  613. html += ' </a>';
  614. html += ' </div>';
  615. html += ' </div>';
  616. html += ' </div>';
  617. })
  618. html += ' </div>';
  619. html += ' <div class="swiper-pagination"></div>';
  620. html += ' </div>';
  621. html += '</div>';
  622. $("#G082_52" +array[0]).append(html);
  623. }
  624. if($("#G082_52" +template[i].planContSq).length){
  625. array.shift();
  626. }
  627. }
  628. }
  629. if(review.length>0){
  630. var html = '';
  631. html += '<div class="dp_review_cont">\n';
  632. html += ' <div class="dp_review">\n';
  633. html += ' <h2 class="dp_subtitle">'+review[0].title+'</h2>\n';
  634. html += ' <div class="review">\n';
  635. html += ' <div class="swiper-container review_list">\n';
  636. html += ' <div class="swiper-wrapper">\n';
  637. $.each(review, function(idx, item) {
  638. html += ' <div class="swiper-slide">\n';
  639. html += ' <div>\n';
  640. html += ' <div class="best_review">\n';
  641. if(item.reviewSysImg!= null){
  642. html += ' <a href="javascript:void();" onclick="cfGoodsReviewDetail(\''+item.goodsCd+'\',\'\', \'Y\',\''+item.reviewSq+'\');">\n';
  643. }else{
  644. html += ' <a href="javascript:void();" onclick="cfGoodsReviewDetail(\''+item.goodsCd+'\',\'\', \'N\',\''+item.reviewSq+'\');">\n';
  645. }
  646. html += ' <div class="lap">\n';
  647. html += ' <div class="pic">\n';
  648. if(item.reviewSysImg!= null){
  649. if (item.fileGb == 'M') {
  650. html += ' <span class="thumb mov" style="background-image:url('+ imgUrl+item.reviewSysImg +');"></span>\n';
  651. }else{
  652. html += ' <span class="thumb" style="background-image:url('+ imgUrl +item.reviewSysImg +');"></span>\n';
  653. }
  654. }else{
  655. html += ' <span class="thumb" style="background-image:url('+ goodsView+'/'+item.sysImgNm +');"></span>\n';
  656. }
  657. html += ' </div>\n';
  658. html += ' <div class="info">\n';
  659. html += ' <div>\n';
  660. html += ' <div class="star_score">\n';
  661. html += ' <span class="star">\n';
  662. html += ' <em class="progbar" style="width:'+(item.score*20)+'%;"></em>\n';
  663. html += ' </span>\n';
  664. if(item.bestYn == 'Y'){
  665. html += ' <em class="ico ico_besttag"></em>\n';
  666. }
  667. html += ' </div>\n';
  668. html += ' <div class="txt_best_review">\n';
  669. html += ' <p>'+item.reviewContent+'</p>';
  670. html += ' </div>\n';
  671. html += ' <div class="writer">\n';
  672. html += ' <span class="wr_id">'+item.maskingCustId+'</span>\n';
  673. html += ' <span class="wr_date">'+item.regDt+'</span>\n';
  674. html += ' </div>\n';
  675. html += ' </div>\n';
  676. html += ' </div>\n';
  677. html += ' </div>\n';
  678. html += ' </a>\n';
  679. html += ' </div>\n';
  680. html += ' <div class="product_view">\n';
  681. html += ' <div class="item_prod">\n';
  682. html += ' <div class="item_state">\n';
  683. html += ' <a href="javascript:void(0)" onclick="cfnGoToGoodsDetail(\'' + item.goodsCd + '\')" class="itemLink">\n';
  684. html += ' <div class="itemPic">\n';
  685. html += ' <img alt="" class="vLHTC pd_img" src="'+ goodsView +'/'+item.sysImgNm +'">\n';
  686. html += ' </div>\n';
  687. html += ' <div class="itemName">'+item.goodsNm+'</div>\n';
  688. html += ' <p class="itemPrice">\n';
  689. html += ' <span class="itemPrice_sale">'+item.currPrice.addComma()+'</span>\n';
  690. html += ' </p>\n';
  691. html += ' </a>\n';
  692. html += ' </div>\n';
  693. html += ' </div>\n';
  694. html += ' </div>\n';
  695. html += ' </div>\n';
  696. html += ' </div>\n';
  697. });
  698. html += ' </div>\n';
  699. html += ' <div class="swiper-pagination"></div>\n';
  700. html += ' </div>\n';
  701. html += ' </div>\n';
  702. html += ' </div>\n';
  703. html += '</div>\n';
  704. $("#G082_10").append(html);
  705. }
  706. /* 이미지 */
  707. if(image.length>0){
  708. var html = '';
  709. html += '<div class="promotion_visual type2">';
  710. html += ' <div class="big_banner_slide">';
  711. html += ' <div class="swiper-container">';
  712. html += ' <div class="swiper-wrapper">';
  713. $.each(image, function(idx, item) {
  714. html += ' <div class="swiper-slide">';
  715. if (item.linkOpenGb == 'M') {
  716. html += ' <a href="'+item.linkUrl+'" target="_self"><img src="'+ imgUrl + item.itemVal +'?RS=1206" ></a>';
  717. }else{
  718. html += ' <a href="'+item.linkUrl+'" target="_blank"><img src="'+ imgUrl + item.itemVal +'?RS=1206" ></a>';
  719. }
  720. html += ' </div>';
  721. });
  722. html += ' </div>';
  723. html += ' <div class="swiper-pagination"></div>';
  724. html += ' </div>';
  725. html += ' </div>';
  726. html += '</div>';
  727. $("#G082_30").append(html);
  728. }
  729. if(coupon.length>0){
  730. var html = '';
  731. html += '<div class="dp_coupon">';
  732. html += ' <h2 class="dp_subtitle">'+coupon[0].title+'</h2>';
  733. html += ' <div class="coupon_list">';
  734. html += ' <ul class="clear">';
  735. $.each(coupon, function(idx, item) {
  736. if (item.couponStat == '쿠폰받기') {
  737. html += ' <li> ';
  738. }else{
  739. html += ' <li class="off"> ';
  740. }
  741. html += ' <div class="cp_top">';
  742. html += ' <div class="cp_detail">';
  743. html += ' <p class="tit">'+item.cpnNm+'</p>';
  744. html += ' <strong class="sale_t won_t"><span>'+item.dcVal.addComma()+'</span>'+item.dcWay+'</strong>';
  745. html += ' <p class="cp_cont">'+item.useCondition+'</p>';
  746. html += ' <span class="cp_cnt">'+item.issueCondition+'</span>';
  747. html += ' </div>';
  748. html += ' <span class="cp_shape"></span>';
  749. html += ' </div>';
  750. html += ' <div class="cp_date" id="dp_coupon1">';
  751. if (item.couponStat == '쿠폰받기') {
  752. html += ' <button type="button" id="coupon_'+item.cpnId+'" onclick="fnPlanCouponDown('+item.cpnId+')"><span>쿠폰 받기</span></button>';
  753. }else{
  754. html += ' <button type="button" id="coupon_'+item.cpnId+'" onclick="fnPlanCouponDown('+item.cpnId+')"><span>받기 완료</span></button>';
  755. }
  756. html += ' </div>';
  757. html += ' <div class="cp_info">';
  758. html += ' <button type="button" id="modalBasic" class="btn_couponInfo_pop" onclick="usePlanInfoCoupon('+item.cpnId+')"><span>사용안내</span></button>';
  759. html += ' </div>';
  760. html += ' </li>';
  761. });
  762. html += ' </ul>';
  763. html += ' </div>';
  764. html += ' <div class="announce_txt">';
  765. html += ' <div class="note_txt">';
  766. html += ' <img src="/images/mo/ico_content_find.png" alt="유의사항">';
  767. html += ' <p>유의사항</p>';
  768. html += ' </div>';
  769. html += ' <div class="announce_list">';
  770. html += ' <ul>';
  771. html += coupon[0].note;
  772. html += ' </ul>';
  773. html += ' </div>';
  774. html += ' </div>';
  775. html += '</div>';
  776. $("#G082_20").append(html);
  777. }
  778. //쿠폰 사용안내 모달
  779. var usePlanInfoCoupon = function (id) {
  780. var data = {cpnId : id
  781. ,planSq : plan.planSq};
  782. var jsonData = JSON.stringify(data);
  783. $.ajax( {
  784. type : "POST",
  785. url : '/planning/coupon/detailpop',
  786. data : jsonData,
  787. contentType: 'application/json',
  788. dataType : 'html',
  789. success : function(result) {
  790. if (result != null) {
  791. $("#couponInfoPop").html(result);
  792. $("#couponInfoPop").modal("show");
  793. }
  794. }
  795. });
  796. return false;
  797. }
  798. //설문조사 참여 버튼 클릭
  799. var fnJoinConfirm = function () {
  800. let planSq = plan.planSq;
  801. cfnGoToPollDetail(planSq);
  802. }
  803. //쿠폰 다운로드
  804. var fnPlanCouponDown = function(obj){
  805. if (!cfCheckLogin()) {
  806. cfnGoToPage(_PAGE_LOGIN);
  807. return false;
  808. }
  809. let cpnId = obj;
  810. gagajf.ajaxJsonSubmit(_PAGE_PLANNING_CPN_DOWNLOAD, JSON.stringify({cpnId: cpnId}), fnPlanCouponCallBack);
  811. }
  812. // 쿠폰다운로드 콜백
  813. var fnPlanCouponCallBack = function(result){
  814. $.each(result.couponList, function (idx, item) {
  815. if (Number(item.custPubLimitQty) > 0){
  816. if (Number(item.custPubLimitQty) <= Number(item.custCouponCnt)){
  817. $('#coupon_'+ item.cpnId).html('<span>받기완료</span>');
  818. $('#coupon_'+ item.cpnId).attr('disabled', true);
  819. }
  820. }
  821. });
  822. }
  823. var fnCornerClick = function(obj,obj2) {
  824. $("#filter").text(obj2);
  825. var offset = $('.dp_listItems_wrap.type'+obj).offset(); //선택한 태그의 위치를 반환
  826. //animate()메서드를 이용해서 선택한 태그의 스크롤 위치를 지정해서 0.4초 동안 부드럽게 해당 위치로 이동함
  827. $('html').animate({scrollTop : offset.top - 77}, 400);
  828. }
  829. //댓글 입력 확인
  830. var fnTextConfirm = function() {
  831. //로그인 확인
  832. if (!cfCheckLogin()) {
  833. mcxDialog.alert("로그인 후 참여 가능합니다.");
  834. $("#replyText").val('');
  835. return false;
  836. }
  837. }
  838. $(document).ready(function(){
  839. if(plan.planGb == "P"){
  840. $('#htopTitle').text('기획전');
  841. }else{
  842. $('#htopTitle').text('이벤트');
  843. }
  844. ajaxReplyList();
  845. fnCompleteList();
  846. $("#filter").text(planCornerList[0].cornerNm);
  847. //Q3 글자 수 카운트
  848. $('.doc_contactus').keyup(function (e){
  849. var content = $(this).val();
  850. $('#contactus_cnt em').html(content.length);
  851. if (content.length > 500){
  852. $(this).val(content.substring(0, 500));
  853. $('#contactus_cnt em').html("500");
  854. }
  855. });
  856. $(document).on('click','.pop_open_btn',function(){
  857. $('.modal.photo_comment_popup .pop_detail').toggleClass('active');
  858. });
  859. //상단 빅배너 슬라이드
  860. var big_banner_slide = new Swiper('.big_banner_slide .swiper-container', {
  861. slidesPerView: 1,
  862. spaceBetween: 8,
  863. centerMode: true,
  864. pagination: {
  865. el: '.big_banner_slide .swiper-pagination',
  866. },
  867. });
  868. //review 슬라이드
  869. var dp_reviewitem_slide = new Swiper('.review .swiper-container', {
  870. slidesPerView: 1,
  871. spaceBetween: 8,
  872. loop: true,
  873. centerMode: true,
  874. pagination: {
  875. el: '.review .swiper-pagination',
  876. type: 'fraction',
  877. },
  878. });
  879. // 아이템스라이드(리스트갯수1)
  880. var dp_listItems_cont1 = new Swiper('.dp_listItems_cont .swiper-container.item01', {
  881. slidesPerView: 1,
  882. spaceBetween: 0,
  883. centerMode: true,
  884. pagination: {
  885. el: '.dp_listItems_cont .swiper-container.item01 .swiper-pagination',
  886. },
  887. });
  888. // 아이템스라이드(리스트갯수2)
  889. var dp_listItems_slide3 = new Swiper('.dp_listItems_cont .swiper-container.item02', {
  890. slidesPerView: 'auto',
  891. slidesPerView: 2,
  892. spaceBetween: 8,
  893. centerMode: true,
  894. });
  895. // 아이템스라이드(리스트갯수3)
  896. var dp_listItems_slide3 = new Swiper('.dp_listItems_slide .swiper-container.item03', {
  897. slidesPerView: 3,
  898. spaceBetween: 8,
  899. centerMode: true,
  900. });
  901. // 다른기획전
  902. var other_promotion_slide = new Swiper('.other_promotion_slide .swiper-container', {
  903. slidesPerView: 2,
  904. spaceBetween: 8,
  905. centerMode: true,
  906. });
  907. $(document).on('click','.popup_box .button_list button',function(){
  908. $('.popup_box .button_list button').removeClass('on');
  909. $(this).addClass('on');
  910. });
  911. //기간 선택 팝업
  912. $(document).on("click", ".open_categori", function(){
  913. $('#odDatePop').show().addClass("active");
  914. $("body").css({"overflow":"hidden"});
  915. });
  916. //팝업_닫기
  917. $('.popup_close').on("click",function(){
  918. $('.popup_box').hide().removeClass('active');
  919. $("body").css({"overflow":"visible"});
  920. });
  921. $('#btn1').click(function(){
  922. var offset = $('.dp_listItems_wrap.type1').offset(); //선택한 태그의 위치를 반환
  923. //animate()메서드를 이용해서 선택한 태그의 스크롤 위치를 지정해서 0.4초 동안 부드럽게 해당 위치로 이동함
  924. $('html').animate({scrollTop : offset.top}, 400);
  925. });
  926. // Full size Popup
  927. /* $(document).on('click','.cmt_wrap .cmt_cont .pics',function(){
  928. $("#photo_full_popup").modal("show");
  929. });
  930. $(".close-modal").click(function() {
  931. $("#photo_full_popup").modal("hide");
  932. }); */
  933. // 210415_드롭박스 상단고정
  934. $(window).scroll(function(){
  935. var scrollTop= $(window).scrollTop();
  936. var itemTop=$('.dp .dp_listItems_wrap.type1').offset().top;
  937. if (scrollTop >= itemTop){
  938. $('.dp .dp_listItems_wrap .items_option').addClass('fix');
  939. } else {
  940. $('.dp .dp_listItems_wrap .items_option').removeClass('fix');
  941. }
  942. });
  943. //210510_추가 : 토스트 팝업 button 클릭 시 팝업 닫기.
  944. $(document).on('click','.popup_box.odDatePop .button_list button',function(){
  945. $(this).parents('.popup_box.odDatePop').hide().removeClass('active');
  946. $("body").css({"overflow":"visible"});
  947. })
  948. //카테고리
  949. function category(){
  950. var categoryOpen=$(".open_categori .select_dress");
  951. var categoryClose=$(".category_box .category_close");
  952. var categoryPop=$(".category_box");
  953. categoryOpen.on("click",function(){
  954. categoryPop.show();
  955. categoryPop.addClass("active");
  956. $("body").css({"overflow":"hidden"});
  957. });
  958. categoryClose.on("click",function(){
  959. categoryPop.hide();
  960. $("body").css({"overflow":"visible"});
  961. });
  962. }
  963. category();
  964. });
  965. </script>
  966. </th:block>
  967. </body>
  968. </html>