MainContentsPopupForm.html 55 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285
  1. <!DOCTYPE html>
  2. <html lang="ko"
  3. xmlns:th="http://www.thymeleaf.org">
  4. <!--
  5. *******************************************************************************
  6. * @source : MainContentsPopupForm.html
  7. * @desc : 메인전시 컨텐츠 수정 팝업 Page
  8. *============================================================================
  9. * STYLE24
  10. * Copyright(C) 2020 TSIT, All rights reserved.
  11. *============================================================================
  12. * VER DATE AUTHOR DESCRIPTION
  13. * === =========== ========== =============================================
  14. * 1.0 2021.2.23 bin2107 최초 작성
  15. *******************************************************************************
  16. -->
  17. <div class="modalPopup" data-width="1500" >
  18. <div class="panelStyle">
  19. <div class="panelTitle">
  20. <h2 id="popTitle" th:text="${contentsLoc}"></h2>
  21. <button type="button" class="close" onclick="fnMainContentsPopupFormClose()"><i class="fa fa-times"></i></button>
  22. </div>
  23. <div class="panelContent">
  24. <ul class="panelBar">
  25. <li class="aL">
  26. <span class="cBlue">* 상단으로 드래그&amp;드랍하여 순서 변경 가능합니다.</span>
  27. </li>
  28. <li class="aR">
  29. <button type="button" class="btn btn btn-base btn-sm" id="btnPopAddRow">컨텐츠 추가</button>
  30. <button type="button" class="btn btn btn-dark btn-sm" id="btnPopSave">임시저장</button>
  31. <input type="hidden" name="uploadDefaultUrlPop" id="uploadDefaultUrlPop" th:value="${@environment.getProperty('upload.image.view') + '/contents/'}"/>
  32. </li>
  33. </ul>
  34. </div>
  35. <form style="height:600px; width:1470px; overflow:auto;" id="popSortable">
  36. </form>
  37. </div>
  38. </div>
  39. <script type="text/javascript" src="/ux/plugins/summernote/summernote.js?v=2020103001"></script>
  40. <script type="text/javascript" src="/ux/plugins/gaga/gaga.summernote.js?v=2020103001"></script>
  41. <script type="text/javascript" src="/ux/plugins/gaga/gaga.kollus.js"></script>
  42. <script th:inline="javascript">
  43. /*<![CDATA[*/
  44. var cateNo = [[${cateNo}]];
  45. var contentsLoc = [[${contentsLoc}]];
  46. var brandGroupNo = [[${brandGroupNo}]];
  47. var contentsLocArr = gagajf.convertToArray([[${contentsLocList}]]);
  48. var tdWidth = $("#sortable").find("td").width();
  49. var tdDeleteWidth = parseInt(tdWidth/11, 10);
  50. tdWidth = tdWidth - tdDeleteWidth;
  51. var cate1List = [[${cate1List}]];
  52. var tableLen = 0; // 테이블 ID
  53. // 컨텐츠 미리보기 리스트
  54. var fnGetContentsPreviewList = function() {
  55. $("#popSortable").html('');
  56. var data = {cateNo : cateNo
  57. ,contentsLoc : contentsLoc
  58. ,brandGroupNo : brandGroupNo
  59. };
  60. var jsonData = JSON.stringify(data);
  61. gagajf.ajaxJsonSubmit('/display/contents/preview/list', jsonData, fnCreatePopLayout);
  62. }
  63. var createIdx = 0;
  64. var fnCreatePopLayout = function(result) {
  65. var html = '';
  66. var descIdx = '';
  67. for(var i=0; i<result.length; i++){
  68. descIdx = i;
  69. var dispStdt = result[i].dispStdt.split(" ");
  70. var dispEddt = result[i].dispEddt.split(" ");
  71. var cate1No = result[i].contentsType;
  72. html += '<table class="frmStyle mcTable" style="margin-bottom:30px" id="mcTable'+i+'">';
  73. html += '<input type="hidden" name="tableIdx" value="'+i+'" data-id="'+i+'">';
  74. html += '<colgroup>';
  75. html += '<col style="width:10%;"/>';
  76. html += '<col style="width:55%;"/>';
  77. html += '<col/>';
  78. html += '</colgroup>';
  79. html += '<thead><tr><th>전시일시</th><td><input name="dispStdt" type="text" class="w80 schDate" maxlength="10" required="required" data-valid-name="노출시작일" data-valid-type="calendar" value="'+dispStdt[0]+'"/>';
  80. html += '<select name="stTimeHour" required="required" data-valid-name="노출기간 시작시간">';
  81. html += fnCreateTimeOption(24, dispStdt[1].split(":")[0]);
  82. html += '</select>';
  83. html += '<select name="stTimeMin" required="required" data-valid-name="노출기간 시작시간">';
  84. html += fnCreateTimeOption(60, dispStdt[1].split(":")[1]);
  85. html += '</select>';
  86. html += '<span> ~ </span>';
  87. html += '<input name="dispEddt" type="text" class="w80 schDate" maxlength="10" required="required" data-valid-name="노출종료일" data-valid-type="calendar" value="'+dispEddt[0]+'"/>';
  88. html += '<select name="edTimeHour" required="required" data-valid-name="노출기간 종료시간">';
  89. html += fnCreateTimeOption(24, dispEddt[1].split(":")[0]);
  90. html += '</select>';
  91. html += '<select name="edTimeMin" required="required" data-valid-name="노출기간 종료시간">';
  92. html += fnCreateTimeOption(60, dispEddt[1].split(":")[1]);
  93. html += '</select>';
  94. html += '<input name="dispOrd" type="text" class="w80"placeholder="전시순서" style="margin-left:5px; text-align:center"/>';
  95. html += '</td>';
  96. if(contentsLoc!='SCM002' && contentsLoc!='SCM003'){
  97. html += '<td class="aL">';
  98. if(contentsLoc!='SMM005' && contentsLoc!='SMM011' && contentsLoc!='SBM012' && contentsLoc!='SBMM012'){
  99. html += '<button type="button" class="btn btn-base btn-lg" onclick="fnAddTitlePopRow(this);">타이틀추가</button>';
  100. }
  101. if(contentsLoc=='SMM001' || contentsLoc=='SMM002' || contentsLoc=='SBM004' || contentsLoc=='SBMM004' || contentsLoc=='SCM001' || contentsLoc=='SOM001'){
  102. html += '<button type="button" class="btn btn-base btn-lg" onclick="fnAddSubTextPopRow(this);">서브텍스트추가</button>';
  103. }
  104. if(contentsLoc=='SBM005' || contentsLoc=='SBMM005'){
  105. html += '<button type="button" class="btn btn-base btn-lg" onclick="fnAddBrandDescRow(this);">브랜드소개추가</button>';
  106. }
  107. if(contentsLoc!='SMM005' && contentsLoc!='SBM005' && contentsLoc!='SBMM005' && contentsLoc!='SGNB001' && contentsLoc!='SGNB002' && contentsLoc!='SMM011' && contentsLoc!='SBM012' && contentsLoc!='SBMM012'){
  108. html += '<button type="button" class="btn btn-base btn-lg" onclick="fnAddImgPopRow(this);">이미지추가</button>';
  109. }
  110. if(contentsLoc!='SMM011' && contentsLoc!='SBM012' && contentsLoc!='SBMM012'){
  111. html += '<button type="button" class="btn btn-base btn-lg" onclick="fnAddLinkPopRow(this);">링크추가</button>';
  112. }
  113. html += '<button type="button" class="btn btn-danger btn-lg" onclick="fnDeleteContentsRow(this);">삭제</button></td>';
  114. }
  115. html += '</tr>';
  116. if(contentsLoc=='SBM004' || contentsLoc=='SBM005' || contentsLoc=='SBMM004' || contentsLoc=='SBMM005'){
  117. html += '<tr class="cateTypeTr">';
  118. html += ' <th>클릭시<br>페이지창</th>';
  119. html += ' <td colspan="3">';
  120. if(result[i].contentsType=='SELF'){
  121. html += ' <label class="rdoBtn"><input type="radio" name="pageTarget'+i+'" value="SELF" checked="checked"/>현재창</label>';
  122. html += ' <label class="rdoBtn"><input type="radio" name="pageTarget'+i+'" value="BLANK" />새창</label>';
  123. }else{
  124. html += ' <label class="rdoBtn"><input type="radio" name="pageTarget'+i+'" value="SELF" />현재창</label>';
  125. html += ' <label class="rdoBtn"><input type="radio" name="pageTarget'+i+'" value="BLANK" checked="checked"/>새창</label>';
  126. }
  127. html += ' </td>';
  128. html += '</tr>';
  129. }
  130. if(contentsLoc=='SMM011' || contentsLoc=='SBM012' || contentsLoc=='SBMM012'){
  131. html += '<tr class="cateTypeTr">';
  132. html += ' <th>동영상구분</th>';
  133. html += ' <td colspan="3">';
  134. if(result[i].strVar1=='Y'){
  135. html += ' <label class="rdoBtn"><input type="radio" name="tvPlayer'+i+'" value="Y" onclick="fnChangeTvPlayer(this,'+i+');" checked="checked" />YouTube</label>';
  136. html += ' <label class="rdoBtn"><input type="radio" name="tvPlayer'+i+'" value="M" onclick="fnChangeTvPlayer(this,'+i+');"/>MP4</label>';
  137. }else{
  138. html += ' <label class="rdoBtn"><input type="radio" name="tvPlayer'+i+'" value="Y" onclick="fnChangeTvPlayer(this,'+i+');" />YouTube</label>';
  139. html += ' <label class="rdoBtn"><input type="radio" name="tvPlayer'+i+'" value="M" onclick="fnChangeTvPlayer(this,'+i+');" checked="checked" />MP4</label>';
  140. }
  141. html += ' </td>';
  142. html += '</tr>';
  143. html += '<tr class="cateTypeTr" name="tvY'+i+'">';
  144. html += ' <th>미디어<br>컨텐츠키</th>';
  145. html += ' <td colspan="3">';
  146. html += ' <input name="tvMediaKey'+i+'" type="text" class="w150" maxlength="200" data-valid-name="미디어 컨텐츠키" value="'+result[i].strVar2+'"/>';
  147. html += ' </td>';
  148. html += '</tr>';
  149. if(result[i].strVar1=='M'){
  150. html += '<tr class="cateTypeTr" name="tvM'+i+'">';
  151. html +=' <th>파일첨부<em className="required" title="필수"></em></th>';
  152. html +=' <td className="infoTxt" colSpan="5">';
  153. html +=' <div className="uFile w300">';
  154. html +=' <input id="file'+i+'" name="file" type="file" className="uFileInput w300" onchange="fnVideoFileUpload(this, '+i+')"/>';
  155. html +=' <label htmlFor="file'+i+'" className="uFileLabel">파일선택</label>';
  156. html +=' <input type="hidden" name="kufKey" value="'+result[i].strVar3+'"/>';
  157. html +=' <input type="hidden" name="kmcKey"/>';
  158. html +=' </div>';
  159. html +=' </td>';
  160. html += '</tr>';
  161. }
  162. }
  163. if(contentsLoc=='SGNB001'){
  164. var src = '';
  165. var src2 = '';
  166. html += '<tr class="cateTypeTr">';
  167. html += ' <th>유형선택</th>';
  168. html += ' <td colspan="3">';
  169. html += ' <label class="rdoBtn"><input type="radio" name="cateType'+i+'" value="OPEN" onclick="fnChangeGnbCateType(this,'+i+');"';
  170. if(result[i].contentsType=='OPEN'){
  171. html += ' checked="checked" ';
  172. }
  173. html += '/>오픈배너</label>';
  174. html += ' <label class="rdoBtn"><input type="radio" name="cateType'+i+'" value="IMG" onclick="fnChangeGnbCateType(this,'+i+');" ';
  175. if(result[i].contentsType=='IMG'){
  176. html += ' checked="checked" ';
  177. }
  178. html += '/>이미지배너</label>';
  179. html += ' <label class="rdoBtn"><input type="radio" name="cateType'+i+'" value="TEXT" onclick="fnChangeGnbCateType(this,'+i+');" ';
  180. if(result[i].contentsType=='TEXT'){
  181. html += ' checked="checked" ';
  182. }
  183. html += '/>텍스트배너</label>';
  184. html += ' </td>';
  185. html += '</tr>';
  186. if(!gagajf.isNull(result[i].imgPath1)){
  187. src = $("#uploadDefaultUrlPop").val().replace('/contents/', '')+result[i].imgPath1;
  188. src2 = $("#uploadDefaultUrlPop").val().replace('/contents/', '')+result[i].imgPath2;
  189. }
  190. console.log('src::'+src);
  191. html += '<tr name="imgPopRow" id="openBanner0" ';
  192. if(result[i].contentsType=='TEXT'){
  193. html += ' style="display:none;"';
  194. }
  195. html += '>';
  196. html += ' <th>띠배너<br>이미지</th>';
  197. html += ' <td><div class="uFile w300">';
  198. html += ' <input id="filePop_0" name="file" type="file" class="uFileInput w300" onchange="fnPopFileUpload(this, 0)"/>';
  199. html += ' <label for="filePop_0" class="uFileLabel">파일선택</label>';
  200. html += ' <input type="hidden" name="imgPath" value="'+result[i].imgPath1+'"/>';
  201. html += ' <input type="hidden" name="newImgFile" value="" />';
  202. html += ' </div>';
  203. html += ' <div id="imgViewPop_0" class=';
  204. if(src!=''){
  205. html += '"on">';
  206. }else{
  207. html += '"off">';
  208. }
  209. html += ' <img id="bannerPreViewUrlPop_0" src="'+src+'" style="height:100px; max-width:500px;" onclick="cfnOpenImagePreViewPopup(\'bannerPreimgViewPop\',$(this).attr(\'src\'));"/>';
  210. html += ' </div></td>';
  211. html += '</tr>';
  212. html += '<tr class="cateTypeTr" name="openBannerTypeTr'+i+'" id="openBannerTypeTr" ';
  213. if(result[i].contentsType!='OPEN'){
  214. html += ' style="display:none;"';
  215. }
  216. html += '>';
  217. html += ' <th>확장형 배너<br>유형</th>';
  218. html += ' <td colspan="3">';
  219. if(result[i].strVar7=='IMG'){
  220. html += ' <label class="rdoBtn"><input type="radio" name="openBannerType'+i+'" value="IMG" onclick="fnChangeOpenBannerType(this,'+i+');" checked="checked"/>이미지형</label>';
  221. html += ' <label class="rdoBtn"><input type="radio" name="openBannerType'+i+'" value="HTML" onclick="fnChangeOpenBannerType(this,'+i+');"/>HTML형</label>';
  222. }else{
  223. html += ' <label class="rdoBtn"><input type="radio" name="openBannerType'+i+'" value="IMG" onclick="fnChangeOpenBannerType(this,'+i+');" />이미지형</label>';
  224. html += ' <label class="rdoBtn"><input type="radio" name="openBannerType'+i+'" value="HTML" onclick="fnChangeOpenBannerType(this,'+i+');" checked="checked"/>HTML형</label>';
  225. }
  226. html += ' </td>';
  227. html += '</tr>';
  228. html += '<tr name="imgPopRow" id="openBanner1" ';
  229. if(result[i].contentsType!='OPEN' && result[i].strVar7!='IMG'){
  230. html += ' style="display:none;"';
  231. }
  232. html +='>';
  233. html += ' <th>오픈배너<br>이미지</th>';
  234. html += ' <td><div class="uFile w300">';
  235. html += ' <input id="filePop_1" name="file" type="file" class="uFileInput w300" onchange="fnPopFileUpload(this, 1)"/>';
  236. html += ' <label for="filePop_1" class="uFileLabel">파일선택</label>';
  237. html += ' <input type="hidden" name="imgPath" value="'+result[i].imgPath2+'"/>';
  238. html += ' <input type="hidden" name="newImgFile" value="" />';
  239. html += ' </div>';
  240. html += ' <div id="imgViewPop_1" class=';
  241. if(src!=''){
  242. html += '"on">';
  243. }else{
  244. html += '"off">';
  245. }
  246. html += ' <img id="bannerPreViewUrlPop_1" src="'+src2+'" style="height:100px; max-width:500px;" onclick="cfnOpenImagePreViewPopup(\'bannerPreimgViewPop\',$(this).attr(\'src2\'));"/>';
  247. html += ' </div></td>';
  248. html += '</tr>';
  249. html += '<tr name="imgPopRow" id="openBanner2" ';
  250. if(result[i].contentsType!='OPEN' || result[i].strVar7!='HTML'){
  251. html += ' style="display:none;"';
  252. }
  253. html += '>';
  254. html += ' <input type="hidden" name="htmlDesc'+i+'" id="htmlDesc'+i+'" value="'+result[i].html+'">';
  255. html += ' <th>오픈배너<br>HTML</th>';
  256. html += ' <td class="padT10"><div class="tabJrContArea">';
  257. html += ' <textarea class="textareaR3 summernote" name="openBannerDesc'+i+'" id="openBannerDesc'+i+'" ></textarea>';
  258. html += ' </div>';
  259. html += ' </td>';
  260. html += '</tr>';
  261. html += ' <tr name="tabBgColorRow'+i+'"';
  262. if(result[i].contentsType=='TEXT'){
  263. html += 'style="display:none;"';
  264. }
  265. html += ' >';
  266. html += ' <th>배경 RGB코드</th>';
  267. html += ' <td><input name="gnbBgColor' + i + '" type="text" maxlength="200" data-valid-name="배경 RGB코드" value="' + result[i].strVar5 + '"/></td>';
  268. html += ' </tr>';
  269. html += ' <tr name="tabShowYnRow'+i+'"';
  270. if(result[i].contentsType!='OPEN'){
  271. html += 'style="display:none;"';
  272. }
  273. html += ' >';
  274. html += ' <th>닫기 버튼<br>노출여부</th>';
  275. html += ' <td>';
  276. if(result[i].strVar8=='Y'){
  277. html += ' <label class="rdoBtn"><input type="radio" name="todayYn'+i+'" value="Y" checked="checked"/>노출</label>';
  278. html += ' <label class="rdoBtn"><input type="radio" name="todayYn'+i+'" value="N" />비노출</label>';
  279. }else{
  280. html += ' <label class="rdoBtn"><input type="radio" name="todayYn'+i+'" value="Y" />노출</label>';
  281. html += ' <label class="rdoBtn"><input type="radio" name="todayYn'+i+'" value="N" checked="checked"/>비노출</label>';
  282. }
  283. html += ' </td>';
  284. html += ' </tr>';
  285. }
  286. if(contentsLoc=='SCM002' || contentsLoc=='SCM003'){
  287. html += ' <tr>';
  288. html += ' <th>전시 설정</th>';
  289. html += ' <td>';
  290. if(result[i].useYn=='Y'){
  291. html += ' <label class="rdoBtn"><input type="radio" name="dispYn" value="Y" checked="checked"/>노출</label>';
  292. html += ' <label class="rdoBtn"><input type="radio" name="dispYn" value="N"/>비노출</label>';
  293. }else{
  294. html += ' <label class="rdoBtn"><input type="radio" name="dispYn" value="Y"/>노출</label>';
  295. html += ' <label class="rdoBtn"><input type="radio" name="dispYn" value="N" checked="checked"/>비노출</label>';
  296. }
  297. html += ' </td>';
  298. if(result[i].contentsLoc=='SCM003'){
  299. html += ' <th>상품 노출 개수</th>';
  300. html += ' <td>';
  301. if(result[i].strVar1=='10'){
  302. html += ' <label class="rdoBtn"><input type="radio" name="dispCnt" value="10" checked="checked"/>10개</label>';
  303. html += ' <label class="rdoBtn"><input type="radio" name="dispCnt" value="20"/>20개</label>';
  304. html += ' <label class="rdoBtn"><input type="radio" name="dispCnt" value="30"/>30개</label>';
  305. }else if(result[i].strVar1=='20'){
  306. html += ' <label class="rdoBtn"><input type="radio" name="dispCnt" value="10"/>10개</label>';
  307. html += ' <label class="rdoBtn"><input type="radio" name="dispCnt" value="20" checked="checked"/>20개</label>';
  308. html += ' <label class="rdoBtn"><input type="radio" name="dispCnt" value="30"/>30개</label>';
  309. }else{
  310. html += ' <label class="rdoBtn"><input type="radio" name="dispCnt" value="10"/>10개</label>';
  311. html += ' <label class="rdoBtn"><input type="radio" name="dispCnt" value="20"/>20개</label>';
  312. html += ' <label class="rdoBtn"><input type="radio" name="dispCnt" value="30" checked="checked"/>30개</label>';
  313. }
  314. html += ' </td>';
  315. }
  316. html += ' </tr>';
  317. }
  318. if(contentsLoc=='SMM001' || contentsLoc=='SOM001'){
  319. html += '<tr>';
  320. html += ' <th>컨텐츠유형</th>';
  321. html += ' <td class="planArea" name="planArea" id="planArea'+i+'" colspan="3">';
  322. if(result[i].strVar5=='P'){
  323. html += ' <label class="rdoBtn"><input type="radio" name="contentsType'+i+'" value="P" onclick="fnChangeContentsType(this,'+i+');" checked="checked"/>기획전</label>';
  324. html += ' <label class="rdoBtn"><input type="radio" name="contentsType'+i+'" value="E" onclick="fnChangeContentsType(this,'+i+');"/>이벤트</label>';
  325. }else{
  326. html += ' <label class="rdoBtn"><input type="radio" name="contentsType'+i+'" value="P" onclick="fnChangeContentsType(this,'+i+');" />기획전</label>';
  327. html += ' <label class="rdoBtn"><input type="radio" name="contentsType'+i+'" value="E" onclick="fnChangeContentsType(this,'+i+');" checked="checked"/>이벤트</label>';
  328. }
  329. if(result[i].strVar5=='P') {
  330. html += ' <input type="text" class="w100 inputPlan" name="planSq' + i + '" value="' + result[i].strVar6 + '"/>';
  331. html += ' <button type="button" class="btn btn btn-dark btn-sm btnPlan" onclick="fnSearchPlan(' + i + ');">기획전검색</button>';
  332. }else{
  333. html += ' <input type="text" class="w100 inputPlan" name="planSq' + i + '" value="" style="display: none;"/>';
  334. html += ' <button type="button" class="btn btn btn-dark btn-sm btnPlan" onclick="fnSearchPlan(' + i + ');" style="display: none;">기획전검색</button>';
  335. }
  336. html += ' </td>';
  337. html += '</tr>';
  338. html += '<tr>';
  339. html += ' <th>썸네일 <br>글자 색상</th>';
  340. html += ' <td colspan="3">';
  341. if(result[i].strVar7=='BLACK'){
  342. html += ' <label class="rdoBtn"><input type="radio" name="thumTextColor'+i+'" value="BLACK" checked="checked"/>BLACK</label>';
  343. html += ' <label class="rdoBtn"><input type="radio" name="thumTextColor'+i+'" value="WHITE" />WHITE</label>';
  344. }else{
  345. html += ' <label class="rdoBtn"><input type="radio" name="thumTextColor'+i+'" value="BLACK" />BLACK</label>';
  346. html += ' <label class="rdoBtn"><input type="radio" name="thumTextColor'+i+'" value="WHITE" checked="checked"/>WHITE</label>';
  347. }
  348. html += ' </td>';
  349. html += '</tr>';
  350. }
  351. if(contentsLoc=='SMM005'){
  352. html += '<tr>';
  353. html += ' <th>배너유형</th>';
  354. html += ' <td class="bannerArea" id="bannerArea'+i+'">';
  355. if(result[i].contentsType=='1'){
  356. html += ' <label class="rdoBtn"><input type="radio" name="bannerType'+i+'" value="1" checked="checked">1단</label>';
  357. html += ' <label class="rdoBtn"><input type="radio" name="bannerType'+i+'" value="2" >2단</label>';
  358. }else{
  359. html += ' <label class="rdoBtn"><input type="radio" name="bannerType'+i+'" value="1" >1단</label>';
  360. html += ' <label class="rdoBtn"><input type="radio" name="bannerType'+i+'" value="2" checked="checked">2단</label>';
  361. }
  362. html += ' </td>';
  363. html += '</tr>';
  364. }
  365. html += '</thead><tbody>';
  366. if(contentsLoc!='SCM002' && contentsLoc!='SCM003' && contentsLoc!='SMM011' && contentsLoc!='SBM012' && contentsLoc!='SBMM012'){
  367. for(var j=1; j<5; j++){
  368. var strTitle = eval("result["+i+"].strTitle" + j);
  369. var imgPath = eval("result["+i+"].imgPath" + j);
  370. var strVar = eval("result["+i+"].strVar" + j);
  371. var subText = eval("result["+i+"].subText" + j);
  372. if(strTitle!=null && strTitle!='null' && strTitle!='' ){
  373. html += fnAddTitlePopRow(strTitle);
  374. }
  375. if(contentsLoc!='SGNB001'){
  376. if(imgPath!=null && imgPath!='null' && imgPath!='' ){
  377. html += fnAddImgPopRow(imgPath);
  378. }
  379. }
  380. if(strVar!=null && strVar!='null' && strVar!='' ){
  381. html += fnAddLinkPopRow(strVar);
  382. }
  383. if(subText!=null && subText!='null' && subText!='' ){
  384. html += fnAddSubTextPopRow(subText);
  385. }
  386. }
  387. }
  388. html += '</tbody></table>';
  389. }
  390. $("#popSortable").append(html);
  391. $("#popSortable").sortable();
  392. $('.schDate').datepicker("destroy");
  393. $('.schDate').datepicker({
  394. changeMonth: true,
  395. changeYear: true,
  396. defaultDate: $('.schDate').val()
  397. });
  398. // SGNB001 일때 확장형 배너 summernote
  399. if(contentsLoc=='SGNB001'){
  400. fnOpenBannerSummernote();
  401. }
  402. tableLen = $(".mcTable").length;
  403. }
  404. var fnOpenBannerSummernote = function (){
  405. $('.mcTable').each(function(){
  406. let idx = $(this).find('[name=tableIdx]').val();
  407. let bannerCateType = $("#mcTable"+idx).find('input:radio[name=cateType'+idx+']:checked').val();
  408. // if(bannerCateType=='OPEN'){
  409. // let bannerType = $("#mcTable"+idx).find('input:radio[name=openBannerType'+idx+']:checked').val();
  410. // if(bannerType=='HTML'){
  411. // let htmlDesc = $("#mcTable"+idx).find('input[name=htmlDesc'+idx+']').val();
  412. // gagaSn.setContents('#openBannerDesc'+idx, '');
  413. // $('#openBannerDesc'+idx).summernote('code', htmlDesc);
  414. // }
  415. // }
  416. let htmlDesc = $("#mcTable"+idx).find('input[name=htmlDesc'+idx+']').val();
  417. gagaSn.setContents('#openBannerDesc'+idx, '');
  418. $('#openBannerDesc'+idx).summernote('code', htmlDesc);
  419. });
  420. }
  421. var fnChangeTvPlayer = function (obj,idx){
  422. let tvPlayer = $("#mcTable"+idx).find("input:radio[name=tvPlayer"+idx+"]:checked").val();
  423. if(tvPlayer == 'Y'){
  424. $(obj).closest("table").find("[name=tvY"+idx+"]").show();
  425. $(obj).closest("table").find("[name=tvM"+idx+"]").hide();
  426. }else{
  427. $(obj).closest("table").find("[name=tvY"+idx+"]").show();
  428. $(obj).closest("table").find("[name=tvM"+idx+"]").show();
  429. }
  430. }
  431. var fnChangeOpenBannerType = function (obj, idx){
  432. let openBannerType = $("#mcTable"+idx).find("input:radio[name=openBannerType"+idx+"]:checked").val();
  433. if(openBannerType == 'IMG'){
  434. $(obj).closest("table").find("[id=openBanner1]").show();
  435. $(obj).closest("table").find("[id=openBanner2]").hide();
  436. }else{
  437. $(obj).closest("table").find("[id=openBanner1]").hide();
  438. $(obj).closest("table").find("[id=openBanner2]").show();
  439. }
  440. }
  441. var fnChangeGnbCateType = function (obj, idx){
  442. let cateType = $("#mcTable"+idx).find("input:radio[name=cateType"+idx+"]:checked").val();
  443. if(cateType=='OPEN'){
  444. $(obj).closest("table").find("[name=tabBgColorRow"+idx+"]").show();
  445. $(obj).closest("table").find("[name=tabShowYnRow"+idx+"]").show();
  446. $(obj).closest("table").find("[name=openBannerTypeTr"+idx+"]").show();
  447. $(obj).closest("table").find("input:radio[name=openBannerType"+idx+"]:input[value=IMG]").prop('checked',true);
  448. $(obj).closest("table").find("[id=openBanner0]").show();
  449. $(obj).closest("table").find("[id=openBanner1]").show();
  450. $(obj).closest("table").find("[id=openBanner2]").hide();
  451. $(obj).closest("table").find("[name=file]").closest('div').find('label').text('파일선택');
  452. $(obj).closest("table").find("[name=imgPath]").val('');
  453. $(obj).closest("table").find("[name=newImgFile]").val('');
  454. $("#bannerPreViewUrlPop_0").attr('src', '');
  455. $("#imgViewPop_0").removeClass("on").addClass("off");
  456. $("#bannerPreViewUrlPop_1").attr('src', '');
  457. $("#imgViewPop_1").removeClass("on").addClass("off");
  458. }else if(cateType=='IMG'){
  459. $(obj).closest("table").find("[name=tabBgColorRow"+idx+"]").show();
  460. $(obj).closest("table").find("[name=tabShowYnRow"+idx+"]").hide();
  461. $(obj).closest("table").find("[name=openBannerTypeTr"+idx+"]").hide();
  462. $(obj).closest("table").find("input:radio[name=openBannerType"+idx+"]:input[value=IMG]").prop('checked',true);
  463. $(obj).closest("table").find("[id=openBanner0]").show();
  464. $(obj).closest("table").find("[id=openBanner1]").hide();
  465. $(obj).closest("table").find("[id=openBanner2]").hide();
  466. $(obj).closest("table").find("[name=file]").closest('div').find('label').text('파일선택');
  467. $(obj).closest("table").find("[name=imgPath]").val('');
  468. $(obj).closest("table").find("[name=newImgFile]").val('');
  469. $("#bannerPreViewUrlPop_0").attr('src', '');
  470. $("#imgViewPop_0").removeClass("on").addClass("off");
  471. $("#bannerPreViewUrlPop_1").attr('src', '');
  472. $("#imgViewPop_1").removeClass("on").addClass("off");
  473. }else if(cateType=='TEXT'){
  474. $(obj).closest("table").find("[name=tabBgColorRow"+idx+"]").hide();
  475. $(obj).closest("table").find("[name=tabShowYnRow"+idx+"]").hide();
  476. $(obj).closest("table").find("[name=openBannerTypeTr"+idx+"]").hide();
  477. $(obj).closest("table").find("input:radio[name=openBannerType"+idx+"]:input[value=IMG]").prop('checked',true);
  478. $(obj).closest("table").find("[id=openBanner0]").hide();
  479. $(obj).closest("table").find("[id=openBanner1]").hide();
  480. $(obj).closest("table").find("[id=openBanner2]").hide();
  481. $(obj).closest("table").find("[name=file]").closest('div').find('label').text('파일선택');
  482. $(obj).closest("table").find("[name=imgPath]").val('');
  483. $(obj).closest("table").find("[name=newImgFile]").val('');
  484. $("#bannerPreViewUrlPop_0").attr('src', '');
  485. $("#imgViewPop_0").removeClass("on").addClass("off");
  486. $("#bannerPreViewUrlPop_1").attr('src', '');
  487. $("#imgViewPop_1").removeClass("on").addClass("off");
  488. }
  489. }
  490. /**
  491. * 컨텐츠 추가 버튼
  492. */
  493. var dataIdx=0;
  494. $("#btnPopAddRow").on("click", function (){
  495. dataIdx = tableLen;
  496. if(contentsLoc=='SCM002' || contentsLoc=='SCM003'){
  497. if($(".mcTable").length > 0){
  498. mcxDialog.alert('컨텐츠 추가를 1개 이상 할 수 없습니다.');
  499. return;
  500. }
  501. }
  502. var html = '<table class="frmStyle mcTable" style="margin-bottom:30px" id="mcTable'+dataIdx+'">';
  503. html += '<input type="hidden" name="tableIdx" value="'+dataIdx+'" data-id="'+dataIdx+'">';
  504. html += '<colgroup>';
  505. html += '<col style="width:10%;"/>';
  506. html += '<col style="width:55%;"/>';
  507. html += '<col/>';
  508. html += '</colgroup>';
  509. html += '<thead><tr><th>전시일시</th><td><input name="dispStdt" type="text" class="w80 schDate" maxlength="10" required="required" data-valid-name="노출시작일" data-valid-type="calendar"/>';
  510. html += '<select name="stTimeHour" required="required" data-valid-name="노출기간 시작시간">';
  511. html += fnCreateTimeOption(24);
  512. html += '</select>';
  513. html += '<select name="stTimeMin" required="required" data-valid-name="노출기간 시작시간">';
  514. html += fnCreateTimeOption(60);
  515. html += '</select>';
  516. html += '<span> ~ </span>';
  517. html += '<input name="dispEddt" type="text" class="w80 schDate" maxlength="10" required="required" data-valid-name="노출종료일" data-valid-type="calendar"/>';
  518. html += '<select name="edTimeHour" required="required" data-valid-name="노출기간 종료시간">';
  519. html += fnCreateTimeOption(24,23);
  520. html += '</select>';
  521. html += '<select name="edTimeMin" required="required" data-valid-name="노출기간 종료시간">';
  522. html += fnCreateTimeOption(60,59);
  523. html += '</select>';
  524. html += '<input name="dispOrd" type="text" class="w80"placeholder="전시순서" style="margin-left:5px; text-align:center"/>';
  525. html += '</td>';
  526. html += '<td class="aL">';
  527. if(contentsLoc!='SCM002' && contentsLoc!='SCM003' && contentsLoc!='SMM011' && contentsLoc!='SBM012' && contentsLoc!='SBMM012'){
  528. if(contentsLoc!='SMM005'){
  529. html += '<button type="button" class="btn btn-base btn-lg" id="addTitle'+dataIdx+'" onclick="fnAddTitlePopRow(this);">타이틀추가</button>';
  530. }
  531. if(contentsLoc=='SMM001' || contentsLoc=='SMM002' || contentsLoc=='SBM004' || contentsLoc=='SBMM004' || contentsLoc=='SCM001' || contentsLoc=='SOM001'){
  532. html += '<button type="button" class="btn btn-base btn-lg" id="addSubText'+dataIdx+'" onclick="fnAddSubTextPopRow(this);">서브텍스트추가</button>';
  533. }
  534. if(contentsLoc=='SBM005' || contentsLoc=='SBMM005'){
  535. html += '<button type="button" class="btn btn-base btn-lg" onclick="fnAddBrandDescRow(this);">브랜드소개추가</button>';
  536. }
  537. if(contentsLoc!='SBM005' && contentsLoc!='SBMM005' && contentsLoc!='SGNB001') {
  538. html += '<button type="button" class="btn btn-base btn-lg" id="addImg'+dataIdx+'" onclick="fnAddImgPopRow(this);">이미지추가</button>';
  539. }
  540. html += '<button type="button" class="btn btn-base btn-lg" id="addLink'+dataIdx+'" onclick="fnAddLinkPopRow(this);">링크추가</button>';
  541. }
  542. html += '<button type="button" class="btn btn-danger btn-lg" onclick="fnDeleteContentsRow(this);">삭제</button></td>';
  543. html += '</tr>';
  544. if(contentsLoc=='SBM004' || contentsLoc=='SBM005' || contentsLoc=='SBMM004' || contentsLoc=='SBMM005'){
  545. html += '<tr class="cateTypeTr">';
  546. html += ' <th>클릭시<br>페이지창</th>';
  547. html += ' <td colspan="3">';
  548. html += ' <label class="rdoBtn"><input type="radio" name="pageTarget'+dataIdx+'" value="SELF" checked="checked"/>현재창</label>';
  549. html += ' <label class="rdoBtn"><input type="radio" name="pageTarget'+dataIdx+'" value="BLANK" />새창</label>';
  550. html += ' </td>';
  551. html += '</tr>';
  552. }
  553. if(contentsLoc=='SMM011' || contentsLoc=='SBM012' || contentsLoc=='SBMM012'){
  554. html += '<tr class="cateTypeTr">';
  555. html += ' <th>동영상구분</th>';
  556. html += ' <td colspan="3">';
  557. html += ' <label class="rdoBtn"><input type="radio" name="tvPlayer'+dataIdx+'" value="Y" onclick="fnChangeTvPlayer(this,'+dataIdx+');" checked="checked" />YouTube</label>';
  558. html += ' <label class="rdoBtn"><input type="radio" name="tvPlayer'+dataIdx+'" value="M" onclick="fnChangeTvPlayer(this,'+dataIdx+');"/>MP4</label>';
  559. html += ' </td>';
  560. html += '</tr>';
  561. html += '<tr class="cateTypeTr" name="tvY'+dataIdx+'">';
  562. html += ' <th>미디어<br>컨텐츠키</th>';
  563. html += ' <td colspan="3">';
  564. html += ' <input name="tvMediaKey'+dataIdx+'" type="text" class="w150" maxlength="200" data-valid-name="미디어 컨텐츠키" value=""/>';
  565. html += ' </td>';
  566. html += '</tr>';
  567. html += '<tr class="cateTypeTr" name="tvM'+dataIdx+'" style="display: none;">';
  568. html +=' <th>파일첨부<em className="required" title="필수"></em></th>';
  569. html +=' <td className="infoTxt" colSpan="5">';
  570. html +=' <div className="uFile w300">';
  571. html +=' <input id="file'+dataIdx+'" name="file" type="file" className="uFileInput w300" onchange="fnVideoFileUpload(this, '+dataIdx+')"/>';
  572. html +=' <label htmlFor="file'+dataIdx+'" className="uFileLabel">파일선택</label>';
  573. html +=' <input type="hidden" name="kufKey"/>';
  574. html +=' <input type="hidden" name="kmcKey"/>';
  575. html +=' </div>';
  576. html +=' </td>';
  577. html += '</tr>';
  578. }
  579. if(contentsLoc=='SGNB001'){
  580. html += '<tr class="cateTypeTr">';
  581. html += ' <th>유형선택</th>';
  582. html += ' <td colspan="3">';
  583. html += ' <label class="rdoBtn"><input type="radio" name="cateType'+dataIdx+'" value="OPEN" onclick="fnChangeGnbCateType(this,'+dataIdx+');" checked="checked"/>오픈배너</label>';
  584. html += ' <label class="rdoBtn"><input type="radio" name="cateType'+dataIdx+'" value="IMG" onclick="fnChangeGnbCateType(this,'+dataIdx+');"/>이미지배너</label>';
  585. html += ' <label class="rdoBtn"><input type="radio" name="cateType'+dataIdx+'" value="TEXT" onclick="fnChangeGnbCateType(this,'+dataIdx+');"/>텍스트배너</label>';
  586. html += ' </td>';
  587. html += '</tr>';
  588. var src = '';
  589. html += '<tr name="imgPopRow" id="openBanner0">';
  590. html += ' <th>띠배너<br>이미지</th>';
  591. html += ' <td><div class="uFile w300">';
  592. html += ' <input id="filePop_0" name="file" type="file" class="uFileInput w300" onchange="fnPopFileUpload(this, 0)"/>';
  593. html += ' <label for="filePop_0" class="uFileLabel">파일선택</label>';
  594. html += ' <input type="hidden" name="imgPath" value=""/>';
  595. html += ' <input type="hidden" name="newImgFile" value="" />';
  596. html += ' </div>';
  597. html += ' <div id="imgViewPop_0" class=';
  598. if(src!=''){
  599. html += '"on">';
  600. }else{
  601. html += '"off">';
  602. }
  603. html += ' <img id="bannerPreViewUrlPop_0" src="'+src+'" style="height:100px; max-width:500px;" onclick="cfnOpenImagePreViewPopup(\'bannerPreimgViewPop\',$(this).attr(\'src\'));"/>';
  604. html += ' </div></td>';
  605. html += '</tr>';
  606. html += '<tr class="cateTypeTr" name="openBannerTypeTr'+dataIdx+'" id="openBannerTypeTr">';
  607. html += ' <th>확장형 배너<br>유형</th>';
  608. html += ' <td colspan="3">';
  609. html += ' <label class="rdoBtn"><input type="radio" name="openBannerType'+dataIdx+'" value="IMG" onclick="fnChangeOpenBannerType(this,'+dataIdx+');" checked="checked"/>이미지형</label>';
  610. html += ' <label class="rdoBtn"><input type="radio" name="openBannerType'+dataIdx+'" value="HTML" onclick="fnChangeOpenBannerType(this,'+dataIdx+');"/>HTML형</label>';
  611. html += ' </td>';
  612. html += '</tr>';
  613. html += '<tr name="imgPopRow" id="openBanner1">';
  614. html += ' <th>오픈배너<br>이미지</th>';
  615. html += ' <td><div class="uFile w300">';
  616. html += ' <input id="filePop_1" name="file" type="file" class="uFileInput w300" onchange="fnPopFileUpload(this, 1)"/>';
  617. html += ' <label for="filePop_1" class="uFileLabel">파일선택</label>';
  618. html += ' <input type="hidden" name="imgPath" value=""/>';
  619. html += ' <input type="hidden" name="newImgFile" value="" />';
  620. html += ' </div>';
  621. html += ' <div id="imgViewPop_1" class=';
  622. if(src!=''){
  623. html += '"on">';
  624. }else{
  625. html += '"off">';
  626. }
  627. html += ' <img id="bannerPreViewUrlPop_1" src="'+src+'" style="height:100px; max-width:500px;" onclick="cfnOpenImagePreViewPopup(\'bannerPreimgViewPop\',$(this).attr(\'src\'));"/>';
  628. html += ' </div></td>';
  629. html += '</tr>';
  630. html += '<tr name="imgPopRow" id="openBanner2" style="display: none;">';
  631. html += ' <input type="hidden" name="htmlDesc'+dataIdx+'" id="htmlDesc'+dataIdx+'" value="">';
  632. html += ' <th>오픈배너<br>HTML</th>';
  633. html += ' <td class="padT10"><div class="tabJrContArea">';
  634. html += ' <textarea class="textareaR3 summernote" name="openBannerDesc'+dataIdx+'" id="openBannerDesc'+dataIdx+'"></textarea>';
  635. html += ' </div>';
  636. html += ' </td>';
  637. html += '</tr>';
  638. html += ' <tr name="tabBgColorRow'+dataIdx+'">';
  639. html += ' <th>배경 RGB코드</th>';
  640. html += ' <td><input name="gnbBgColor'+dataIdx+'" type="text" maxlength="200" data-valid-name="배경 RGB코드" value=""/></td>';
  641. html += ' </tr>';
  642. html += ' <tr name="tabShowYnRow'+dataIdx+'">';
  643. html += ' <th>오늘하루 보지않기<br>노출여부</th>';
  644. html += ' <td>';
  645. html += ' <label class="rdoBtn"><input type="radio" name="todayYn'+dataIdx+'" value="Y" checked="checked"/>노출</label>';
  646. html += ' <label class="rdoBtn"><input type="radio" name="todayYn'+dataIdx+'" value="N" />비노출</label>';
  647. html += ' </td>';
  648. html += ' </tr>';
  649. }
  650. if(contentsLoc=='SCM002' || contentsLoc=='SCM003'){
  651. html += ' <tr>';
  652. html += ' <th>전시 설정</th>';
  653. html += ' <td>';
  654. html += ' <label class="rdoBtn"><input type="radio" name="dispYn" value="Y" checked="checked"/>노출</label>';
  655. html += ' <label class="rdoBtn"><input type="radio" name="dispYn" value="N"/>비노출</label>';
  656. html += ' </td>';
  657. if(contentsLoc=='SCM003'){
  658. html += ' <th>상품 노출 개수</th>';
  659. html += ' <td>';
  660. html += ' <label class="rdoBtn"><input type="radio" name="dispCnt" value="10" checked="checked"/>10개</label>';
  661. html += ' <label class="rdoBtn"><input type="radio" name="dispCnt" value="20"/>20개</label>';
  662. html += ' <label class="rdoBtn"><input type="radio" name="dispCnt" value="30"/>30개</label>';
  663. html += ' </td>';
  664. }
  665. html += ' </tr>';
  666. }
  667. if(contentsLoc=='SMM001' || contentsLoc=='SOM001'){
  668. html += '<tr>';
  669. html += ' <th>컨텐츠유형</th>';
  670. html += ' <td class="planArea" name="planArea" id="planArea'+dataIdx+'" colspan="3">';
  671. html += ' <label class="rdoBtn"><input type="radio" name="contentsType'+dataIdx+'" value="P" onclick="fnChangeContentsType(this,'+dataIdx+');" checked="checked"/>기획전</label>';
  672. html += ' <label class="rdoBtn"><input type="radio" name="contentsType'+dataIdx+'" value="E" onclick="fnChangeContentsType(this,'+dataIdx+');"/>이벤트</label>';
  673. html += ' <input type="text" class="w100 inputPlan" name="planSq'+dataIdx+'" value=""/>';
  674. html += ' <button type="button" class="btn btn btn-dark btn-sm btnPlan" onclick="fnSearchPlan('+dataIdx+');">기획전검색</button>';
  675. html += ' </td>';
  676. html += '</tr>';
  677. html += '<tr>';
  678. html += ' <th>썸네일 <br>글자 색상</th>';
  679. html += ' <td colspan="3">';
  680. html += ' <label class="rdoBtn"><input type="radio" name="thumTextColor'+dataIdx+'" value="BLACK" checked="checked"/>BLACK</label>';
  681. html += ' <label class="rdoBtn"><input type="radio" name="thumTextColor'+dataIdx+'" value="WHITE" />WHITE</label>';
  682. html += ' </td>';
  683. html += '</tr>';
  684. }
  685. if(contentsLoc=='SMM005'){
  686. html += '<tr>';
  687. html += ' <th>배너유형</th>';
  688. html += ' <td class="bannerArea" id="bannerArea'+dataIdx+'">';
  689. html += ' <label class="rdoBtn"><input type="radio" name="bannerType'+dataIdx+'" value="1" checked="checked">1단</label>'; /*onclick="fnChangeBannerType(this,1);"*/
  690. html += ' <label class="rdoBtn"><input type="radio" name="bannerType'+dataIdx+'" value="2" >2단</label>';
  691. html += ' </td>';
  692. html += '</tr>';
  693. }
  694. html += '</thead><tbody>';
  695. html += '</tbody></table>';
  696. $("#popSortable").prepend(html);
  697. $("#popSortable").sortable();
  698. $('.schDate').datepicker("destroy");
  699. $('.schDate').datepicker({
  700. changeMonth: true,
  701. changeYear: true,
  702. defaultDate: $('.schDate').val()
  703. });
  704. if(contentsLoc=='SMM001' || contentsLoc=='SOM001'){
  705. $("#addTitle"+dataIdx).click();
  706. $("#addSubText"+dataIdx).click();
  707. $("#addLink"+dataIdx).click();
  708. $("#addImg"+dataIdx).click();
  709. }
  710. if(contentsLoc=='SGNB001'){
  711. gagaSn.setContents('#openBannerDesc'+dataIdx, '');
  712. }
  713. tableLen = tableLen+1;
  714. });
  715. var fnVideoFileUpload = function (obj, idx){
  716. var file = obj.files[0];
  717. gagaKollus.upload('Display', file, $(obj).find('input[name=kufKey]'));
  718. }
  719. var fnChangeBannerType = function (obj, idx){
  720. if(idx==1){
  721. $(obj).closest("table").find("[id=bannerImgTr1]").show();
  722. $(obj).closest("table").find("[id=bannerLinkTr1]").show();
  723. $(obj).closest("table").find("[id=bannerImgTr2]").hide();
  724. $(obj).closest("table").find("[id=bannerLinkTr2]").hide();
  725. }else{
  726. $(obj).closest("table").find("[id=bannerImgTr1]").show();
  727. $(obj).closest("table").find("[id=bannerLinkTr1]").show();
  728. $(obj).closest("table").find("[id=bannerImgTr2]").show();
  729. $(obj).closest("table").find("[id=bannerLinkTr2]").show();
  730. }
  731. }
  732. // 몰메인>메인롤링배너 컨텐츠유형 선택시
  733. var fnChangeContentsType = function (obj, idx){
  734. var radioVal = $(obj).closest("td").find("input[name=contentsType"+idx+"]:checked").val();
  735. if(radioVal=='P'){
  736. $("#planArea"+idx+" .inputPlan").show();
  737. $("#planArea"+idx+" .btnPlan").show();
  738. }else{
  739. $("#planArea"+idx).find("input[name=planSq"+idx+"]").val('');
  740. $("#planArea"+idx+" .inputPlan").hide();
  741. $("#planArea"+idx+" .btnPlan").hide();
  742. }
  743. }
  744. // 몰메인>메인롤링배너 기획전 조회
  745. var tableDataId = 0;
  746. var fnSearchPlan = function (idx){
  747. cfnOpenPlanPopup('callbackPlanPopup');
  748. tableDataId = idx;
  749. }
  750. var callbackPlanPopup = function (result){
  751. $("#mcTable"+tableDataId+" .planArea").find("input[name=planSq"+tableDataId+"]").val(result[0].planSq);
  752. $("#mcTable"+tableDataId).find("tr[name=titlePopRow]").find("input[name=title]").val(result[0].planNm);
  753. $("#mcTable"+tableDataId).find("tr[name=subTextPopRow]").find("input[name=subText]").val(result[0].dtlTitle1);
  754. $("#mcTable"+tableDataId).find("tr[name=linkPopRow]").find("input[name=link]").val('/planning/detail/form?planSq='+result[0].planSq);
  755. $("#mcTable"+tableDataId).find("tr[name=imgPopRow]").find("input[name=imgPath]").val(result[0].mainPimg);
  756. $("#mcTable"+tableDataId).find("#bannerPreViewUrlPop_"+tableDataId).attr('src',$("#uploadDefaultUrlPop").val().replace('/contents/', '')+result[0].mainPimg);
  757. $("#mcTable"+tableDataId).find("#imgViewPop_"+tableDataId).removeClass("off").addClass("on");
  758. let stdt = result[0].dispStdt.split(" ");
  759. let eddt = result[0].dispEddt.split(" ");
  760. let stdtTime;
  761. let eddtTime;
  762. $("#mcTable"+tableDataId).find("[name=dispStdt]").val(stdt[0]);
  763. $("#mcTable"+tableDataId).find("[name=dispEddt]").val(eddt[0]);
  764. if(!gagajf.isNull(stdt[1])){
  765. stdtTime = stdt[1].split(":");
  766. }
  767. if(!gagajf.isNull(eddt[1])){
  768. eddtTime = eddt[1].split(":");
  769. }
  770. $("#mcTable"+tableDataId).find("[name=stTimeHour]").val(stdtTime[0]+'시').prop("selected", true);
  771. $("#mcTable"+tableDataId).find("[name=stTimeMin]").val(stdtTime[1]+'분').prop("selected", true);
  772. $("#mcTable"+tableDataId).find("[name=edTimeHour]").val(eddtTime[0]+'시').prop("selected", true);
  773. $("#mcTable"+tableDataId).find("[name=edTimeMin]").val(eddtTime[1]+'분').prop("selected", true);
  774. }
  775. // SMM001 데이터 validation 체크
  776. function smm001DataValidation(){
  777. $(".mcTable").each(function(i){
  778. var thisIdx = $(this).find("input[name=tableIdx]").val();
  779. var contentsTypeVal = $(this).find("input:radio[name=contentsType"+thisIdx+"]:checked").val();
  780. var textColorVal = $(this).find("input:radio[name=thumTextColor"+thisIdx+"]:checked").val();
  781. if(gagajf.isNull(contentsTypeVal)){
  782. mcxDialog.alert('컨텐츠 유형을 선택해주세요.');
  783. return false;
  784. }
  785. if(contentsTypeVal=='P'){
  786. if(gagajf.isNull($(this).find("input[name=planSq"+thisIdx+"]").val())){
  787. mcxDialog.alert('기획전 번호를 입력해주세요.');
  788. return false;
  789. }
  790. }
  791. if(gagajf.isNull(textColorVal)){
  792. mcxDialog.alert('썸네일 글자 색상을 선택해주세요.');
  793. return false;
  794. }
  795. });
  796. return true;
  797. }
  798. /**
  799. * 임시저장
  800. */
  801. var dataArr = [];
  802. $("#btnPopSave").on("click", function (){
  803. if (!gagajf.checkRequired("#popSortable")) {
  804. return;
  805. }
  806. if(contentsLoc=='SMM001' || contentsLoc=='SOM001'){
  807. if(!smm001DataValidation()){
  808. return false;
  809. }
  810. }
  811. var titleBool = true;
  812. $("#popSortable").find('input[name=title]').each(function(idx, title) {
  813. if ($(title).val()==''){
  814. titleBool = false;
  815. $(title).focus();
  816. gagajf.alertMessage($(title), 'input');
  817. return;
  818. }
  819. });
  820. if(!titleBool){
  821. return false;
  822. }
  823. dataArr = [];
  824. $("#popSortable table").each(function(){
  825. var newImgFileArr = [];
  826. var imgPath1 = '';
  827. var imgPath2 = '';
  828. var imgPath3 = '';
  829. var imgPath4 = '';
  830. var strVar1 = '';
  831. var strVar2 = '';
  832. var strVar3 = '';
  833. var strVar4 = '';
  834. var strVar5 = '';
  835. var strVar6 = '';
  836. var strVar7 = '';
  837. var strVar8 = '';
  838. var strTitle1 = '';
  839. var strTitle2 = '';
  840. var strTitle3 = '';
  841. var strTitle4 = '';
  842. var subText1 = '';
  843. var subText2 = '';
  844. var subText3 = '';
  845. var subText4 = '';
  846. var contentsType = '';
  847. var useYn = 'Y';
  848. var html = '';
  849. var i = 1;
  850. $(this).find('input[name=imgPath]').each(function(){
  851. eval("imgPath" + i + "='"+$(this).val()+"'");
  852. i++;
  853. });
  854. $(this).find('input[name=newImgFile]').each(function(){
  855. newImgFileArr.push($(this).val());
  856. });
  857. i = 1;
  858. $(this).find('input[name=title]').each(function(){
  859. var title = $(this).val().replace(/[\']/gi, "\\'");
  860. eval("strTitle" + i + "='"+title+"'");
  861. i++;
  862. });
  863. i = 1;
  864. $(this).find('input[name=link]').each(function(){
  865. _mall = [[${@environment.getProperty('domain.front')}]];
  866. var val = $(this).val();
  867. val = val.replace('https:'+_mall, '');
  868. val = val.replace('http:'+_mall, '');
  869. val = val.replace(_mall, '');
  870. eval("strVar" + i + "='"+val+"'");
  871. i++;
  872. });
  873. i = 1;
  874. $(this).find('input[name=subText]').each(function(){
  875. var subText = $(this).val().replace(/[\']/gi, "\\'");
  876. eval("subText" + i + "='"+subText+"'");
  877. i++;
  878. });
  879. if(contentsLoc=='SMM011' || contentsLoc=='SBM012' || contentsLoc=='SBMM012'){
  880. var thisIdx = $(this).find("input[name=tableIdx]").val();
  881. strVar1 = $(this).find("input:radio[name=tvPlayer"+thisIdx+"]:checked").val();
  882. strVar2 = $(this).find("input[name=tvMediaKey"+thisIdx+"]").val();
  883. strVar3 = $(this).find("input[name=kufKey]").val();
  884. }
  885. var dispStdt = $(this).find("[name=dispStdt]").val().replace(/[^0-9]/g, '') + "" +$(this).find("[name=stTimeHour]").val().replace('시', '') + "" +$(this).find("[name=stTimeMin]").val().replace('분', '') + "00";
  886. var dispEddt = $(this).find("[name=dispEddt]").val().replace(/[^0-9]/g, '') + "" +$(this).find("[name=edTimeHour]").val().replace('시', '') + "" +$(this).find("[name=edTimeMin]").val().replace('분', '') + "59";
  887. var dispOrd = $(this).find("[name=dispOrd]").val();
  888. if(contentsLoc=='SBM004' || contentsLoc=='SBM005' || contentsLoc=='SBMM004' || contentsLoc=='SBMM005'){
  889. var thisIdx = $(this).find("input[name=tableIdx]").val();
  890. contentsType = $(this).find("input:radio[name=pageTarget"+thisIdx+"]:checked").val();
  891. }
  892. if(contentsLoc=='SGNB001'){
  893. var thisIdx = $(this).find("input[name=tableIdx]").val();
  894. contentsType = $(this).find("input:radio[name=cateType"+thisIdx+"]:checked").val();
  895. strVar5 = $(this).find("input[name=gnbBgColor"+thisIdx+"]").val();
  896. strVar6 = $(this).find("input[name=gnbTextColor"+thisIdx+"]").val();
  897. strVar8 = $(this).find("input:radio[name=todayYn"+thisIdx+"]:checked").val();
  898. strVar7 = $(this).find("input:radio[name=openBannerType"+thisIdx+"]:checked").val();
  899. if($(this).find("input:radio[name=openBannerType"+thisIdx+"]:checked").val() == 'HTML'){
  900. html = $(this).find("textarea[name=openBannerDesc"+thisIdx+"]").val();
  901. }
  902. }
  903. if(contentsLoc=='SMM001' || contentsLoc=='SOM001'){
  904. var thisIdx = $(this).find("input[name=tableIdx]").val();
  905. strVar5 = $(this).find("input:radio[name=contentsType"+thisIdx+"]:checked").val();
  906. strVar6 = $(this).find("input[name=planSq"+thisIdx+"]").val();
  907. strVar7 = $(this).find("input:radio[name=thumTextColor"+thisIdx+"]:checked").val();
  908. }
  909. if(contentsLoc=='SMM005'){
  910. var thisIdx = $(this).find("input[name=tableIdx]").val();
  911. contentsType = $(this).find("input:radio[name=bannerType"+thisIdx+"]:checked").val();
  912. }
  913. if(contentsLoc=='SCM002' || contentsLoc=='SCM003'){
  914. useYn = $(this).find("input:radio[name=dispYn]:checked").val();
  915. }
  916. if(contentsLoc=='SCM003'){
  917. strVar1 = $(this).find("input:radio[name=dispCnt]:checked").val();
  918. }
  919. var data = {cateNo : cateNo
  920. , contentsLoc : contentsLoc
  921. , contentsType : contentsType
  922. , dispStdt : dispStdt
  923. , dispEddt : dispEddt
  924. , newImgFileArr : newImgFileArr
  925. , imgPath1 : imgPath1
  926. , imgPath2 : imgPath2
  927. , imgPath3 : imgPath3
  928. , imgPath4 : imgPath4
  929. , strVar1 : strVar1
  930. , strVar2 : strVar2
  931. , strVar3 : strVar3
  932. , strVar4 : strVar4
  933. , strVar5 : strVar5
  934. , strVar6 : strVar6
  935. , strVar7 : strVar7
  936. , strVar8 : strVar8
  937. , strTitle1 : strTitle1
  938. , strTitle2 : strTitle2
  939. , strTitle3 : strTitle3
  940. , strTitle4 : strTitle4
  941. , subText1 : subText1
  942. , subText2 : subText2
  943. , subText3 : subText3
  944. , subText4 : subText4
  945. , useYn : useYn
  946. , dispOrd : dispOrd
  947. , brandGroupNo : brandGroupNo
  948. , html : html
  949. };
  950. dataArr.push(data);
  951. });
  952. if(dataArr.length==0){
  953. var data = {cateNo : cateNo
  954. , contentsLoc : contentsLoc
  955. , brandGroupNo : brandGroupNo
  956. };
  957. dataArr.push(data);
  958. }else{
  959. var dataArrSort = [];
  960. dataArr.forEach(function(item, index){
  961. if(dataArr[index].dispOrd>0){
  962. for(var i=1; i<dataArr.length; i++){
  963. if(i>index){
  964. if(dataArr[index].dispOrd==dataArr[i].dispOrd){
  965. dataArr[i].dispOrd = Number(dataArr[i].dispOrd) + 1;
  966. }
  967. }
  968. }
  969. }
  970. });
  971. dataArr.forEach(function(item, index){
  972. if(dataArr[index].dispOrd != ''){
  973. dataArrSort[dataArr[index].dispOrd-1] = item;
  974. }
  975. });
  976. dataArr.forEach(function(item, index){
  977. if(dataArr[index].dispOrd == ''){
  978. var empty = false;
  979. for(var i=0; i<dataArrSort.length; i++){
  980. if(typeof dataArrSort[i] == 'undefined'){
  981. dataArrSort[i] = item;
  982. empty = true;
  983. break;
  984. }
  985. };
  986. if(!empty){
  987. dataArrSort.push(item);
  988. }
  989. }
  990. });
  991. dataArr = dataArrSort;
  992. }
  993. var jsonData = JSON.stringify(dataArr);
  994. console.log('jsonData::'+jsonData);
  995. mcxDialog.confirm('컨텐츠를 저장 하시겠습니까?', {
  996. cancelBtnText: "취소",
  997. sureBtnText: "확인",
  998. sureBtnClick: function(){
  999. gagajf.ajaxJsonSubmit('/display/contents/preview/save', jsonData, fnGetContentsPreviewList);
  1000. }
  1001. });
  1002. });
  1003. /**
  1004. * 파일첨부
  1005. */
  1006. var fnPopFileUpload = function (obj, ind){
  1007. var file = obj.files[0];
  1008. file.name = 'test';
  1009. if (typeof(file) == 'undefined'){
  1010. return;
  1011. }
  1012. // 파일 업로드
  1013. gagajf.ajaxFileUpload('/common/file/upload?subDir=/contents'
  1014. , file
  1015. , function(result) {
  1016. $(obj).closest('div').find('input:hidden[name=newImgFile]').val(result.newFileName);
  1017. $("#bannerPreViewUrlPop_"+ind).attr('src', $("#uploadDefaultUrlPop").val()+result.newFileName);
  1018. $("#imgViewPop_"+ind).removeClass("off").addClass("on");
  1019. }
  1020. , 'image'
  1021. );
  1022. }
  1023. /**
  1024. * 링크추가
  1025. */
  1026. var fnAddLinkPopRow = function (param){
  1027. var val = typeof param=='object'?'#':param;
  1028. var html = '<tr name="linkPopRow">';
  1029. html += '<th>링크 (없으면 #)</th>';
  1030. html += '<td><input name="link" type="text" maxlength="200" required="required" data-valid-name="링크" value="'+val+'"/></td>';
  1031. html += '<td class="aL"><button type="button" class="btn icn" onclick="fnDeleteTrRow(this);"><i class="fa fa-times" aria-hidden="true"></i></button></td>';
  1032. html += '</tr>';
  1033. if(typeof param == 'object'){
  1034. if(contentsLoc=='SMM005'){
  1035. if($(param).closest("table").find("tbody").find("tr[name=linkPopRow]").length>1){
  1036. mcxDialog.alert("링크는 최대 2개까지 등록 가능합니다");
  1037. return;
  1038. }
  1039. }else{
  1040. if($(param).closest("table").find("tbody").find("tr[name=linkPopRow]").length>3){
  1041. mcxDialog.alert("링크는 4개까지 등록 가능합니다");
  1042. return;
  1043. }
  1044. }
  1045. $(param).closest("table").find("tbody").append(html);
  1046. }else{
  1047. return html;
  1048. }
  1049. }
  1050. /**
  1051. * 서브텍스트추가
  1052. */
  1053. var fnAddSubTextPopRow = function (param){
  1054. var val = typeof param=='object'?'':param;
  1055. var html = '<tr name="subTextPopRow">'
  1056. html += '<th>서브텍스트</th>';
  1057. html += '<td><input type="text" name="subText" maxlength="200" value="'+val+'"/></td>';
  1058. html += '<td class="aL"><button type="button" class="btn icn" onclick="fnDeleteTrRow(this);"><i class="fa fa-times" aria-hidden="true"></i></button></td>';
  1059. html += '</tr>';
  1060. if(typeof param == 'object'){
  1061. if($(param).closest("table").find("tbody").find("tr[name=subTextPopRow]").length>3){
  1062. mcxDialog.alert("서브텍스트는 4개까지 등록 가능합니다");
  1063. return;
  1064. }
  1065. $(param).closest("table").find("tbody").append(html);
  1066. }else{
  1067. return html;
  1068. }
  1069. }
  1070. /**
  1071. * 브랜드 소개추가
  1072. */
  1073. var fnAddBrandDescRow = function (param){
  1074. var val = typeof param=='object'?'':param;
  1075. var html = '<tr name="subTextPopRow">'
  1076. html += '<th>브랜드소개</th>';
  1077. html += '<td><input type="text" name="subText" maxlength="200" value="'+val+'"/></td>';
  1078. html += '<td class="aL"><button type="button" class="btn icn" onclick="fnDeleteTrRow(this);"><i class="fa fa-times" aria-hidden="true"></i></button></td>';
  1079. html += '</tr>';
  1080. if(typeof param == 'object'){
  1081. if($(param).closest("table").find("tbody").find("tr[name=subTextPopRow]").length>0){
  1082. mcxDialog.alert("브랜드소개는 1개까지 등록 가능합니다");
  1083. return;
  1084. }
  1085. $(param).closest("table").find("tbody").append(html);
  1086. }else{
  1087. return html;
  1088. }
  1089. }
  1090. /**
  1091. * 이미지 추가
  1092. */
  1093. var imgIndex = 0;
  1094. var fnAddImgPopRow = function (param){
  1095. var src = '';
  1096. var imgPath = '';
  1097. if(typeof param!='object'){
  1098. src = $("#uploadDefaultUrlPop").val().replace('/contents/', '')+param;
  1099. imgPath = param;
  1100. }
  1101. var html = '<tr name="imgPopRow">';
  1102. html += '<th>이미지';
  1103. html += '</th>';
  1104. html += '<td><div class="uFile w300">';
  1105. html += '<input id="filePop_'+imgIndex+'" name="file" type="file" class="uFileInput w300" onchange="fnPopFileUpload(this, '+imgIndex+')"/>';
  1106. html += '<label for="filePop_'+imgIndex+'" class="uFileLabel">파일선택</label>';
  1107. html += '<input type="hidden" name="imgPath" value="'+imgPath+'"/>';
  1108. html += '<input type="hidden" name="newImgFile" value="" />';
  1109. html += '</div>';
  1110. html += '<div id="imgViewPop_'+imgIndex+'" class=';
  1111. if(src!=''){
  1112. html += '"on">';
  1113. }else{
  1114. html += '"off">';
  1115. }
  1116. html += '<img id="bannerPreViewUrlPop_'+imgIndex+'" src="'+src+'" style="height:100px; max-width:500px;" onclick="cfnOpenImagePreViewPopup(\'bannerPreimgViewPop\',$(this).attr(\'src\'));"/>';
  1117. html += '</div></td>';
  1118. html += '<td class="aL"><button type="button" class="btn icn" onclick="fnDeleteTrRow(this);"><i class="fa fa-times" aria-hidden="true"></i></button></td>';
  1119. html += '</tr>';
  1120. if(typeof param == 'object'){
  1121. if(contentsLoc=='SMM005'){
  1122. if($(param).closest("table").find("tbody").find("tr[name=imgPopRow]").length>1){
  1123. mcxDialog.alert("이미지는 최대 2개까지 등록 가능합니다");
  1124. return;
  1125. }
  1126. }else{
  1127. if($(param).closest("table").find("tbody").find("tr[name=imgPopRow]").length>3){
  1128. mcxDialog.alert("이미지는 4개까지 등록 가능합니다");
  1129. return;
  1130. }
  1131. }
  1132. imgIndex++;
  1133. $(param).closest("table").find("tbody").append(html);
  1134. }else{
  1135. imgIndex++;
  1136. return html;
  1137. }
  1138. }
  1139. /**
  1140. * 타이틀추가
  1141. */
  1142. var fnAddTitlePopRow = function (param){
  1143. var val = typeof param=='object'?'':param;
  1144. var html = '<tr name="titlePopRow">';
  1145. html += '<th>타이틀</th>';
  1146. html += '<td><input name="title" type="text" maxlength="200" data-valid-name="타이틀" value="'+val+'"/></td>';
  1147. html += '<td class="aL"><button type="button" class="btn icn" onclick="fnDeleteTrRow(this);"><i class="fa fa-times" aria-hidden="true"></i></button></td>';
  1148. html += '</tr>';
  1149. if(typeof param == 'object'){
  1150. if($(param).closest("table").find("tbody").find("tr[name=titlePopRow]").length>3){
  1151. mcxDialog.alert("타이틀은 4개까지 등록 가능합니다");
  1152. return;
  1153. }
  1154. $(param).closest("table").find("tbody").append(html);
  1155. }else{
  1156. return html;
  1157. }
  1158. }
  1159. // 컨텐츠 행삭제
  1160. var fnDeleteContentsRow = function (obj){
  1161. $(obj).closest("table").remove();
  1162. }
  1163. // 행삭제
  1164. var fnDeleteTrRow = function (obj){
  1165. $(obj).closest("tr").remove();
  1166. }
  1167. // 컨텐츠 추가 날짜 설정
  1168. var fnCreateTimeOption = function(val, sel) {
  1169. var html = '';
  1170. for(var i=0; i<val; i++){
  1171. var time = 0;
  1172. if(i<10){
  1173. time = '0'+i;
  1174. }else {
  1175. time = i;
  1176. }
  1177. var select = false;
  1178. if(sel==time){
  1179. select = true;
  1180. }
  1181. if(val==24){
  1182. time += '시';
  1183. }else if(val==60){
  1184. time += '분';
  1185. }
  1186. html += '<option value="'+time+'"';
  1187. if(select){
  1188. html += 'selected="selected"';
  1189. }
  1190. html += '>'+time+'</option>';
  1191. }
  1192. return html;
  1193. }
  1194. // 동영상파일 선택 시
  1195. $('#popSortable input[name=file]').on('change', function() {
  1196. var file = this.files[0];
  1197. gagaKollus.upload('Display', file, $('input[name=kufKey]'));
  1198. });
  1199. // 창닫기
  1200. var fnMainContentsPopupFormClose = function (){
  1201. uifnPopupClose('popupMainContents');
  1202. }
  1203. $(document).ready(function() {
  1204. $("#popTitle").text("["+contentsLoc+"] "+gagaAgGrid.lookupValue(contentsLocArr, contentsLoc));
  1205. $("#popSortable").disableSelection();
  1206. fnGetContentsPreviewList();
  1207. });
  1208. /*]]>*/
  1209. </script>
  1210. </html>