| 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024 |
- <!DOCTYPE html>
- <html lang="ko"
- xmlns:th="http://www.thymeleaf.org">
- <!--
- *******************************************************************************
- * @source : MainContentsPopupForm.html
- * @desc : 메인전시 컨텐츠 수정 팝업 Page
- *============================================================================
- * STYLE24
- * Copyright(C) 2020 TSIT, All rights reserved.
- *============================================================================
- * VER DATE AUTHOR DESCRIPTION
- * === =========== ========== =============================================
- * 1.0 2021.2.23 bin2107 최초 작성
- *******************************************************************************
- -->
- <div class="modalPopup" data-width="1500" >
- <div class="panelStyle">
- <div class="panelTitle">
- <h2 id="popTitle" th:text="${contentsLoc}"></h2>
- <button type="button" class="close" onclick="fnMainContentsPopupFormClose()"><i class="fa fa-times"></i></button>
- </div>
- <div class="panelContent">
- <ul class="panelBar">
- <li class="aL">
- <span class="cBlue">* 상단으로 드래그&드랍하여 순서 변경 가능합니다.</span>
- </li>
- <li class="aR">
- <button type="button" class="btn btn btn-base btn-sm" id="btnPopAddRow">컨텐츠 추가</button>
- <button type="button" class="btn btn btn-dark btn-sm" id="btnPopSave">임시저장</button>
- <input type="hidden" name="uploadDefaultUrlPop" id="uploadDefaultUrlPop" th:value="${@environment.getProperty('upload.image.view') + '/contents/'}"/>
- </li>
- </ul>
- </div>
- <form name="contentsTitleForm" id="contentsTitleForm" style="width:1170px; overflow:auto; display: none;">
- <table class="frmStyle">
- <colgroup>
- <col style="width:10%;"/>
- <col style="width:40%;"/>
- <col style="width:10%;"/>
- <col style="width:40%;"/>
- </colgroup>
- <tr>
- <th>컨텐츠 타이틀</th>
- <td colspan="3"><input type="text" style="width:43.5%;" name="contentsTitle" maxlength="40" required="required" data-valid-name="컨텐츠타이틀" th:value="${contentsTitle}"></td>
- </tr>
- </table>
- </form>
- <form style="height:600px; width:1470px; overflow:auto;" id="popSortable">
- </form>
- </div>
- </div>
- <script th:inline="javascript">
- /*<![CDATA[*/
- var cateNo = [[${cateNo}]];
- var contentsLoc = [[${contentsLoc}]];
- var brandGroupNo = [[${brandGroupNo}]];
- var contentsTitle = [[${contentsTitle}]];
- var contentsLocArr = gagajf.convertToArray([[${contentsLocList}]]);
- var tdWidth = $("#sortable").find("td").width();
- var tdDeleteWidth = parseInt(tdWidth/11, 10);
- tdWidth = tdWidth - tdDeleteWidth;
- var tableLen = 0; // 테이블 ID
- // 컨텐츠 미리보기 리스트
- var fnGetContentsPreviewList = function() {
- $("#popSortable").html('');
- var data = {cateNo : cateNo
- ,contentsLoc : contentsLoc
- ,brandGroupNo : brandGroupNo
- };
- var jsonData = JSON.stringify(data);
- gagajf.ajaxJsonSubmit('/display/contents/preview/list', jsonData, fnCreatePopLayout);
- }
- var fnCreateCateMainLayout = function(result){
- var html = '';
- for(let i=0; i<result.length; i++){
- html += '<form name="contentsTitleForm" id="contentsTitleForm" style="width:1170px; overflow:auto;>';
- html += ' <table className="frmStyle">';
- html += ' <colgroup>';
- html += ' <col style="width:10%;"/>';
- html += ' <col style="width:40%;"/>';
- html += ' <col style="width:10%;"/>';
- html += ' <col style="width:40%;"/>';
- html += ' </colgroup>';
- html += ' <tr>';
- html += ' <th>컨텐츠 타이틀</th>';
- html += ' <td colSpan="3"><input type="text" style="width:43.5%;" name="contentsTitle" maxLength="40" required="required" data-valid-name="컨텐츠타이틀" value"'+result[i].mdTitle+'">';
- html += ' </td>';
- html += ' </tr>';
- html += ' <tr>';
- html += ' <th>전시 설정</th>';
- html += ' <td>';
- if(result[i].useYn=='Y'){
- html += ' <label class="rdoBtn"><input type="radio" name="dispYn" value="Y" checked="checked"/>노출</label>';
- html += ' <label class="rdoBtn"><input type="radio" name="dispYn" value="N"/>비노출</label>';
- }else{
- html += ' <label class="rdoBtn"><input type="radio" name="dispYn" value="Y"/>노출</label>';
- html += ' <label class="rdoBtn"><input type="radio" name="dispYn" value="N" checked="checked"/>비노출</label>';
- }
- html += ' </td>';
- if(result[i].contentsLoc=='SCM003'){
- html += ' <th>상품 노출 개수</th>';
- html += ' <td>';
- if(result[i].strVar1=='10'){
- html += ' <label class="rdoBtn"><input type="radio" name="dispCnt" value="10" checked="checked"/>10개</label>';
- html += ' <label class="rdoBtn"><input type="radio" name="dispCnt" value="20"/>20개</label>';
- html += ' <label class="rdoBtn"><input type="radio" name="dispCnt" value="30"/>30개</label>';
- }else if(result[i].strVar1=='20'){
- html += ' <label class="rdoBtn"><input type="radio" name="dispCnt" value="10"/>10개</label>';
- html += ' <label class="rdoBtn"><input type="radio" name="dispCnt" value="20" checked="checked"/>20개</label>';
- html += ' <label class="rdoBtn"><input type="radio" name="dispCnt" value="30"/>30개</label>';
- }else{
- html += ' <label class="rdoBtn"><input type="radio" name="dispCnt" value="10"/>10개</label>';
- html += ' <label class="rdoBtn"><input type="radio" name="dispCnt" value="20"/>20개</label>';
- html += ' <label class="rdoBtn"><input type="radio" name="dispCnt" value="30" checked="checked"/>30개</label>';
- }
- html += ' </td>';
- }
- html += ' </tr>';
- html += ' </table>';
- html += '</form>';
- }
- }
- var createIdx = 0;
- var fnCreatePopLayout = function(result) {
- var html = '';
- for(var i=0; i<result.length; i++){
- var dispStdt = result[i].dispStdt.split(" ");
- var dispEddt = result[i].dispEddt.split(" ");
- html += '<table class="frmStyle mcTable" style="margin-bottom:30px" id="mcTable'+i+'">';
- html += '<input type="hidden" name="tableIdx" value="'+i+'" data-id="'+i+'">';
- html += '<colgroup>';
- html += '<col style="width:10%;"/>';
- html += '<col style="width:55%;"/>';
- html += '<col/>';
- html += '</colgroup>';
- 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]+'"/>';
- html += '<select name="stTimeHour" required="required" data-valid-name="노출기간 시작시간">';
- html += fnCreateTimeOption(24, dispStdt[1].split(":")[0]);
- html += '</select>';
- html += '<select name="stTimeMin" required="required" data-valid-name="노출기간 시작시간">';
- html += fnCreateTimeOption(60, dispStdt[1].split(":")[1]);
- html += '</select>';
- html += '<span> ~ </span>';
- html += '<input name="dispEddt" type="text" class="w80 schDate" maxlength="10" required="required" data-valid-name="노출종료일" data-valid-type="calendar" value="'+dispEddt[0]+'"/>';
- html += '<select name="edTimeHour" required="required" data-valid-name="노출기간 종료시간">';
- html += fnCreateTimeOption(24, dispEddt[1].split(":")[0]);
- html += '</select>';
- html += '<select name="edTimeMin" required="required" data-valid-name="노출기간 종료시간">';
- html += fnCreateTimeOption(60, dispEddt[1].split(":")[1]);
- html += '</select>';
- html += '<input name="dispOrd" type="text" class="w80"placeholder="전시순서" style="margin-left:5px; text-align:center"/>';
- html += '</td>';
- if(contentsLoc!='SCM002' && contentsLoc!='SCM003'){
- html += '<td class="aL">';
- if(contentsLoc!='SMM005'){
- html += '<button type="button" class="btn btn-base btn-lg" onclick="fnAddTitlePopRow(this);">타이틀추가</button>';
- }
- if(contentsLoc=='SMM001' || contentsLoc=='SMM002' || contentsLoc=='SBM004' || contentsLoc=='SBMM004' || contentsLoc=='SCM001'){
- html += '<button type="button" class="btn btn-base btn-lg" onclick="fnAddSubTextPopRow(this);">서브텍스트추가</button>';
- }
- if(contentsLoc=='SBM005' || contentsLoc=='SBMM005'){
- html += '<button type="button" class="btn btn-base btn-lg" onclick="fnAddBrandDescRow(this);">브랜드소개추가</button>';
- }
- if(contentsLoc!='SMM005' && contentsLoc!='SBM005' && contentsLoc!='SBMM005'){
- html += '<button type="button" class="btn btn-base btn-lg" onclick="fnAddImgPopRow(this);">이미지추가</button>';
- }
- html += '<button type="button" class="btn btn-base btn-lg" onclick="fnAddLinkPopRow(this);">링크추가</button>';
- html += '<button type="button" class="btn btn-danger btn-lg" onclick="fnDeleteContentsRow(this);">삭제</button></td>';
- }
- html += '</tr>';
- if(contentsLoc=='SCM002' || contentsLoc=='SCM003'){
- html += ' <tr>';
- html += ' <th>전시 설정</th>';
- html += ' <td>';
- if(result[i].useYn=='Y'){
- html += ' <label class="rdoBtn"><input type="radio" name="dispYn" value="Y" checked="checked"/>노출</label>';
- html += ' <label class="rdoBtn"><input type="radio" name="dispYn" value="N"/>비노출</label>';
- }else{
- html += ' <label class="rdoBtn"><input type="radio" name="dispYn" value="Y"/>노출</label>';
- html += ' <label class="rdoBtn"><input type="radio" name="dispYn" value="N" checked="checked"/>비노출</label>';
- }
- html += ' </td>';
- if(result[i].contentsLoc=='SCM003'){
- html += ' <th>상품 노출 개수</th>';
- html += ' <td>';
- if(result[i].strVar1=='10'){
- html += ' <label class="rdoBtn"><input type="radio" name="dispCnt" value="10" checked="checked"/>10개</label>';
- html += ' <label class="rdoBtn"><input type="radio" name="dispCnt" value="20"/>20개</label>';
- html += ' <label class="rdoBtn"><input type="radio" name="dispCnt" value="30"/>30개</label>';
- }else if(result[i].strVar1=='20'){
- html += ' <label class="rdoBtn"><input type="radio" name="dispCnt" value="10"/>10개</label>';
- html += ' <label class="rdoBtn"><input type="radio" name="dispCnt" value="20" checked="checked"/>20개</label>';
- html += ' <label class="rdoBtn"><input type="radio" name="dispCnt" value="30"/>30개</label>';
- }else{
- html += ' <label class="rdoBtn"><input type="radio" name="dispCnt" value="10"/>10개</label>';
- html += ' <label class="rdoBtn"><input type="radio" name="dispCnt" value="20"/>20개</label>';
- html += ' <label class="rdoBtn"><input type="radio" name="dispCnt" value="30" checked="checked"/>30개</label>';
- }
- html += ' </td>';
- }
- html += ' </tr>';
- }
- if(contentsLoc=='SMM001'){
- html += '<tr>';
- html += ' <th>컨텐츠유형</th>';
- html += ' <td class="planArea" name="planArea" id="planArea'+i+'" colspan="3">';
- if(result[i].strVar5=='P'){
- html += ' <label class="rdoBtn"><input type="radio" name="contentsType'+i+'" value="P" onclick="fnChangeContentsType(this,'+i+');" checked="checked"/>기획전</label>';
- html += ' <label class="rdoBtn"><input type="radio" name="contentsType'+i+'" value="E" onclick="fnChangeContentsType(this,'+i+');"/>이벤트</label>';
- }else{
- html += ' <label class="rdoBtn"><input type="radio" name="contentsType'+i+'" value="P" onclick="fnChangeContentsType(this,'+i+');" />기획전</label>';
- html += ' <label class="rdoBtn"><input type="radio" name="contentsType'+i+'" value="E" onclick="fnChangeContentsType(this,'+i+');" checked="checked"/>이벤트</label>';
- }
- if(result[i].strVar5=='P') {
- html += ' <input type="text" class="w100 inputPlan" name="planSq' + i + '" value="' + result[i].strVar6 + '"/>';
- html += ' <button type="button" class="btn btn btn-dark btn-sm btnPlan" onclick="fnSearchPlan(' + i + ');">기획전검색</button>';
- }else{
- html += ' <input type="text" class="w100 inputPlan" name="planSq' + i + '" value="" style="display: none;"/>';
- html += ' <button type="button" class="btn btn btn-dark btn-sm btnPlan" onclick="fnSearchPlan(' + i + ');" style="display: none;">기획전검색</button>';
- }
- html += ' </td>';
- html += '</tr>';
- html += '<tr>';
- html += ' <th>썸네일 <br>글자 색상</th>';
- html += ' <td colspan="3">';
- if(result[i].strVar7=='BLACK'){
- html += ' <label class="rdoBtn"><input type="radio" name="thumTextColor'+i+'" value="BLACK" checked="checked"/>BLACK</label>';
- html += ' <label class="rdoBtn"><input type="radio" name="thumTextColor'+i+'" value="WHITE" />WHITE</label>';
- }else{
- html += ' <label class="rdoBtn"><input type="radio" name="thumTextColor'+i+'" value="BLACK" />BLACK</label>';
- html += ' <label class="rdoBtn"><input type="radio" name="thumTextColor'+i+'" value="WHITE" checked="checked"/>WHITE</label>';
- }
- html += ' </td>';
- html += '</tr>';
- }
- if(contentsLoc=='SMM005'){
- html += '<tr>';
- html += ' <th>배너유형</th>';
- html += ' <td class="bannerArea" id="bannerArea'+i+'">';
- if(result[i].contentsType=='1'){
- html += ' <label class="rdoBtn"><input type="radio" name="bannerType'+i+'" value="1" checked="checked">1단</label>';
- html += ' <label class="rdoBtn"><input type="radio" name="bannerType'+i+'" value="2" >2단</label>';
- }else{
- html += ' <label class="rdoBtn"><input type="radio" name="bannerType'+i+'" value="1" >1단</label>';
- html += ' <label class="rdoBtn"><input type="radio" name="bannerType'+i+'" value="2" checked="checked">2단</label>';
- }
- html += ' </td>';
- html += '</tr>';
- /*html += '<tr id="bannerImgTr1" name="imgPopRow">';
- html += ' <th>이미지1</th>';
- html += ' <td>';
- html += ' <div id="ImageArea1" style="height:33px;">';
- html += ' <span className="uFile w300">';
- html += ' <input id="file_1" name="file" type="file" className="uFileInput w300" data-valid-name="이미지파일" onChange="fnPopFileUpload(this, 1)"/>';
- html += ' <label htmlFor="file_1" className="uFileLabel"></label>';
- html += ' <input type="hidden" name="imgPath" value="'+result[i].imgPath1+'"/>';
- html += ' <input type="hidden" name="newImgFile" value="" />';
- html += ' </span>';
- html += ' <span className="memAdd off" id="imgFileNm1"></span>';
- html += ' </div>';
- html += ' </td>';
- html += '</tr>';
- html += '<tr id="bannerLinkTr1" name="linkRow">';
- html += ' <th>링크1</th>';
- html += ' <td><input type="text" class="w400" name="linkUrl" maxlength="300" required="required" data-valid-name="LINK" value="'+result[i].strVar1+'"/></td>';
- html += '</tr>';
- if(result[i].contentsType==2){
- html += '<tr id="bannerImgTr2" name="imgPopRow">';
- html += ' <th>이미지2</th>';
- html += ' <td>';
- html += ' <div id="ImageArea2" style="height:33px;">';
- html += ' <span className="uFile w300">';
- html += ' <input id="file_2" name="file" type="file" className="uFileInput w300" data-valid-name="이미지파일" onChange="fnPopFileUpload(this, 2)"/>';
- html += ' <label htmlFor="file_2" className="uFileLabel"></label>';
- html += ' <input type="hidden" name="imgPath" value="'+result[i].imgPath2+'"/>';
- html += ' <input type="hidden" name="newImgFile" value="" />';
- html += ' </span>';
- html += ' <span className="memAdd off" id="imgFileNm2"></span>';
- html += ' </div>';
- html += ' </td>';
- html += '</tr>';
- html += '<tr id="bannerLinkTr2" name="linkRow" >';
- html += ' <th>링크2</th>';
- html += ' <td><input type="text" class="w400" name="linkUrl" maxlength="300" required="required" data-valid-name="LINK" value="'+result[i].strVar2+'"/></td>';
- html += '</tr>';
- }*/
- }
- html += '</thead><tbody>';
- if(contentsLoc!='SCM002' && contentsLoc!='SCM003'){
- for(var j=1; j<5; j++){
- var strTitle = eval("result["+i+"].strTitle" + j);
- var imgPath = eval("result["+i+"].imgPath" + j);
- var strVar = eval("result["+i+"].strVar" + j);
- var subText = eval("result["+i+"].subText" + j);
- if(strTitle!=null && strTitle!='null' && strTitle!='' ){
- html += fnAddTitlePopRow(strTitle);
- }
- if(imgPath!=null && imgPath!='null' && imgPath!='' ){
- html += fnAddImgPopRow(imgPath);
- }
- if(strVar!=null && strVar!='null' && strVar!='' ){
- html += fnAddLinkPopRow(strVar);
- }
- if(subText!=null && subText!='null' && subText!='' ){
- html += fnAddSubTextPopRow(subText);
- }
- }
- }
- html += '</tbody></table>';
- }
- $("#popSortable").append(html);
- $("#popSortable").sortable();
- $('.schDate').datepicker("destroy");
- $('.schDate').datepicker({
- changeMonth: true,
- changeYear: true,
- defaultDate: $('.schDate').val()
- });
- tableLen = $(".mcTable").length;
- }
- /**
- * 컨텐츠 추가 버튼
- */
- var dataIdx=0;
- $("#btnPopAddRow").on("click", function (){
- dataIdx = tableLen;
- if(contentsLoc=='SCM002' || contentsLoc=='SCM003'){
- if($(".mcTable").length > 0){
- mcxDialog.alert('컨텐츠 추가를 1개 이상 할 수 없습니다.');
- return;
- }
- }
- var html = '<table class="frmStyle mcTable" style="margin-bottom:30px" id="mcTable'+dataIdx+'">';
- html += '<input type="hidden" name="tableIdx" value="'+dataIdx+'" data-id="'+dataIdx+'">';
- html += '<colgroup>';
- html += '<col style="width:10%;"/>';
- html += '<col style="width:55%;"/>';
- html += '<col/>';
- html += '</colgroup>';
- 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"/>';
- html += '<select name="stTimeHour" required="required" data-valid-name="노출기간 시작시간">';
- html += fnCreateTimeOption(24);
- html += '</select>';
- html += '<select name="stTimeMin" required="required" data-valid-name="노출기간 시작시간">';
- html += fnCreateTimeOption(60);
- html += '</select>';
- html += '<span> ~ </span>';
- html += '<input name="dispEddt" type="text" class="w80 schDate" maxlength="10" required="required" data-valid-name="노출종료일" data-valid-type="calendar"/>';
- html += '<select name="edTimeHour" required="required" data-valid-name="노출기간 종료시간">';
- html += fnCreateTimeOption(24,23);
- html += '</select>';
- html += '<select name="edTimeMin" required="required" data-valid-name="노출기간 종료시간">';
- html += fnCreateTimeOption(60,59);
- html += '</select>';
- html += '<input name="dispOrd" type="text" class="w80"placeholder="전시순서" style="margin-left:5px; text-align:center"/>';
- html += '</td>';
- html += '<td class="aL">';
- if(contentsLoc!='SCM002' && contentsLoc!='SCM003'){
- if(contentsLoc!='SMM005'){
- html += '<button type="button" class="btn btn-base btn-lg" onclick="fnAddTitlePopRow(this);">타이틀추가</button>';
- }
- if(contentsLoc=='SMM001' || contentsLoc=='SMM002' || contentsLoc=='SBM004' || contentsLoc=='SBMM004' || contentsLoc=='SCM001'){
- html += '<button type="button" class="btn btn-base btn-lg" onclick="fnAddSubTextPopRow(this);">서브텍스트추가</button>';
- }
- if(contentsLoc=='SBM005' || contentsLoc=='SBMM005'){
- html += '<button type="button" class="btn btn-base btn-lg" onclick="fnAddBrandDescRow(this);">브랜드소개추가</button>';
- }
- if(contentsLoc!='SBM005' && contentsLoc!='SBMM005') {
- html += '<button type="button" class="btn btn-base btn-lg" onclick="fnAddImgPopRow(this);">이미지추가</button>';
- }
- html += '<button type="button" class="btn btn-base btn-lg" onclick="fnAddLinkPopRow(this);">링크추가</button>';
- }
- html += '<button type="button" class="btn btn-danger btn-lg" onclick="fnDeleteContentsRow(this);">삭제</button></td>';
- html += '</tr>';
- if(contentsLoc=='SCM002' || contentsLoc=='SCM003'){
- html += ' <tr>';
- html += ' <th>전시 설정</th>';
- html += ' <td>';
- html += ' <label class="rdoBtn"><input type="radio" name="dispYn" value="Y" checked="checked"/>노출</label>';
- html += ' <label class="rdoBtn"><input type="radio" name="dispYn" value="N"/>비노출</label>';
- html += ' </td>';
- if(contentsLoc=='SCM003'){
- html += ' <th>상품 노출 개수</th>';
- html += ' <td>';
- html += ' <label class="rdoBtn"><input type="radio" name="dispCnt" value="10" checked="checked"/>10개</label>';
- html += ' <label class="rdoBtn"><input type="radio" name="dispCnt" value="20"/>20개</label>';
- html += ' <label class="rdoBtn"><input type="radio" name="dispCnt" value="30"/>30개</label>';
- html += ' </td>';
- }
- html += ' </tr>';
- }
- if(contentsLoc=='SMM001'){
- html += '<tr>';
- html += ' <th>컨텐츠유형</th>';
- html += ' <td class="planArea" name="planArea" id="planArea'+dataIdx+'" colspan="3">';
- html += ' <label class="rdoBtn"><input type="radio" name="contentsType'+dataIdx+'" value="P" onclick="fnChangeContentsType(this,'+dataIdx+');" checked="checked"/>기획전</label>';
- html += ' <label class="rdoBtn"><input type="radio" name="contentsType'+dataIdx+'" value="E" onclick="fnChangeContentsType(this,'+dataIdx+');"/>이벤트</label>';
- html += ' <input type="text" class="w100 inputPlan" name="planSq'+dataIdx+'" value=""/>';
- html += ' <button type="button" class="btn btn btn-dark btn-sm btnPlan" onclick="fnSearchPlan('+dataIdx+');">기획전검색</button>';
- html += ' </td>';
- html += '</tr>';
- html += '<tr>';
- html += ' <th>썸네일 <br>글자 색상</th>';
- html += ' <td colspan="3">';
- html += ' <label class="rdoBtn"><input type="radio" name="thumTextColor'+dataIdx+'" value="BLACK" checked="checked"/>BLACK</label>';
- html += ' <label class="rdoBtn"><input type="radio" name="thumTextColor'+dataIdx+'" value="WHITE" />WHITE</label>';
- html += ' </td>';
- html += '</tr>';
- }
- if(contentsLoc=='SMM005'){
- html += '<tr>';
- html += ' <th>배너유형</th>';
- html += ' <td class="bannerArea" id="bannerArea'+dataIdx+'">';
- html += ' <label class="rdoBtn"><input type="radio" name="bannerType'+dataIdx+'" value="1" checked="checked">1단</label>'; /*onclick="fnChangeBannerType(this,1);"*/
- html += ' <label class="rdoBtn"><input type="radio" name="bannerType'+dataIdx+'" value="2" >2단</label>';
- html += ' </td>';
- html += '</tr>';
- /*html += '<tr id="bannerImgTr1" name="imgPopRow" style="display: none;">';
- html += ' <th>이미지1</th>';
- html += ' <td>';
- html += ' <div id="ImageArea1" style="height:33px;">';
- html += ' <span className="uFile w300">';
- html += ' <input id="file_1" name="file" type="file" className="uFileInput w300" data-valid-name="이미지파일" onChange="fnPopFileUpload(this, 1)"/>';
- html += ' <label htmlFor="file_1" className="uFileLabel"></label>';
- html += ' <input type="hidden" name="imgPath" value=""/>';
- html += ' <input type="hidden" name="newImgFile" value="" />';
- html += ' </span>';
- html += ' <span className="memAdd off" id="imgFileNm1"></span>';
- html += ' </div>';
- html += ' </td>';
- html += '</tr>';
- html += '<tr id="bannerLinkTr1" name="linkRow" style="display: none;">';
- html += ' <th>링크1</th>';
- html += ' <td><input type="text" class="w400" name="linkUrl" maxlength="300" required="required" data-valid-name="LINK" value="#"/></td>';
- html += '</tr>';
- html += '<tr id="bannerImgTr2" name="imgPopRow" style="display: none;">';
- html += ' <th>이미지2</th>';
- html += ' <td>';
- html += ' <div id="ImageArea2" style="height:33px;">';
- html += ' <span className="uFile w300">';
- html += ' <input id="file_2" name="file" type="file" className="uFileInput w300" data-valid-name="이미지파일" onChange="fnPopFileUpload(this, 2)"/>';
- html += ' <label htmlFor="file_2" className="uFileLabel"></label>';
- html += ' <input type="hidden" name="imgPath" value=""/>';
- html += ' <input type="hidden" name="newImgFile" value="" />';
- html += ' </span>';
- html += ' <span className="memAdd off" id="imgFileNm2"></span>';
- html += ' </div>';
- html += ' </td>';
- html += '</tr>';
- html += '<tr id="bannerLinkTr2" name="linkRow" style="display: none;">';
- html += ' <th>링크2</th>';
- html += ' <td><input type="text" class="w400" name="linkUrl" maxlength="300" required="required" data-valid-name="LINK" value="#"/></td>';
- html += '</tr>';*/
- }
- html += '</thead><tbody>';
- html += '</tbody></table>';
- $("#popSortable").prepend(html);
- $("#popSortable").sortable();
- $('.schDate').datepicker("destroy");
- $('.schDate').datepicker({
- changeMonth: true,
- changeYear: true,
- defaultDate: $('.schDate').val()
- });
- tableLen = tableLen+1;
- });
- var fnChangeBannerType = function (obj, idx){
- if(idx==1){
- $(obj).closest("table").find("[id=bannerImgTr1]").show();
- $(obj).closest("table").find("[id=bannerLinkTr1]").show();
- $(obj).closest("table").find("[id=bannerImgTr2]").hide();
- $(obj).closest("table").find("[id=bannerLinkTr2]").hide();
- }else{
- $(obj).closest("table").find("[id=bannerImgTr1]").show();
- $(obj).closest("table").find("[id=bannerLinkTr1]").show();
- $(obj).closest("table").find("[id=bannerImgTr2]").show();
- $(obj).closest("table").find("[id=bannerLinkTr2]").show();
- }
- }
- // 몰메인>메인롤링배너 컨텐츠유형 선택시
- var fnChangeContentsType = function (obj, idx){
- var radioVal = $(obj).closest("td").find("input[name=contentsType"+idx+"]:checked").val();
- if(radioVal=='P'){
- $("#planArea"+idx+" .inputPlan").show();
- $("#planArea"+idx+" .btnPlan").show();
- }else{
- $("#planArea"+idx).find("input[name=planSq"+idx+"]").val('');
- $("#planArea"+idx+" .inputPlan").hide();
- $("#planArea"+idx+" .btnPlan").hide();
- }
- }
- // 몰메인>메인롤링배너 기획전 조회
- var tableDataId = 0;
- var fnSearchPlan = function (idx){
- cfnOpenPlanPopup('callbackPlanPopup');
- tableDataId = idx;
- }
- var callbackPlanPopup = function (result){
- $("#mcTable"+tableDataId+" .planArea").find("input[name=planSq"+tableDataId+"]").val(result[0].planSq);
- }
- // SMM005 데이터 validation 체크
- /*function smm005DataValidation(){
- $(".mcTable").each(function(i){
- var thisIdx = $(this).find("input[name=tableIdx]").val();
- var contentsType = $(this).find("input:radio[name=bannerType"+thisIdx+"]:checked").val();
- var imgPath1 = $(this).find("[id=ImageArea1]").find("input[name=imgPath]").val();
- var imgPath2 = $(this).find("[id=ImageArea2]").find("input[name=imgPath]").val();
- var link1 = $(this).find("[id=bannerLinkTr1]").find("input[name=linkUrl]").val();
- var link2 = $(this).find("[id=bannerLinkTr2]").find("input[name=linkUrl]").val();
- if(gagajf.isNull(imgPath1)){
- mcxDialog.alert('배너1 이미지를 선택해주세요.');
- return false;
- }
- if(gagajf.isNull(link1)){
- mcxDialog.alert('배너1 링크를 선택해주세요.');
- return false;
- }
- if(contentsType==2){
- if(gagajf.isNull(imgPath2)){
- mcxDialog.alert('배너2 이미지를 선택해주세요.');
- return false;
- }
- if(gagajf.isNull(link2)){
- mcxDialog.alert('배너2 링크를 선택해주세요.');
- return false;
- }
- }
- });
- return true;
- }*/
- // SMM001 데이터 validation 체크
- function smm001DataValidation(){
- $(".mcTable").each(function(i){
- var thisIdx = $(this).find("input[name=tableIdx]").val();
- var contentsTypeVal = $(this).find("input:radio[name=contentsType"+thisIdx+"]:checked").val();
- var textColorVal = $(this).find("input:radio[name=thumTextColor"+thisIdx+"]:checked").val();
- if(gagajf.isNull(contentsTypeVal)){
- mcxDialog.alert('컨텐츠 유형을 선택해주세요.');
- return false;
- }
- if(contentsTypeVal=='P'){
- if(gagajf.isNull($(this).find("input[name=planSq"+thisIdx+"]").val())){
- mcxDialog.alert('기획전 번호를 입력해주세요.');
- return false;
- }
- }
- if(gagajf.isNull(textColorVal)){
- mcxDialog.alert('썸네일 글자 색상을 선택해주세요.');
- return false;
- }
- });
- return true;
- }
- /**
- * 임시저장
- */
- var dataArr = [];
- $("#btnPopSave").on("click", function (){
- if (!gagajf.checkRequired("#popSortable")) {
- return;
- }
- if(contentsLoc=='SMM002'||contentsLoc=='SMM003'||contentsLoc=='SMM004'||contentsLoc=='SMM006'||contentsLoc=='SMM007'
- ||contentsLoc=='SMM009' ||contentsLoc=='SMM010'||contentsLoc=='SMM011'||contentsLoc=='SBM005' || contentsLoc=='SBMM005'
- || contentsLoc=='SCM002' || contentsLoc=='SCM003' || contentsLoc=='SBM010'){
- if(!gagajf.checkRequired("#contentsTitleForm")){
- return;
- }
- }
- if(contentsLoc=='SMM001'){
- if(!smm001DataValidation()){
- return false;
- }
- }
- /*if(contentsLoc=='SMM005'){
- if(!smm005DataValidation()){
- return false;
- }
- }*/
- var titleBool = true;
- $("#popSortable").find('input[name=title]').each(function(idx, title) {
- if ($(title).val()==''){
- titleBool = false;
- $(title).focus();
- gagajf.alertMessage($(title), 'input');
- return;
- }
- });
- if(!titleBool){
- return false;
- }
- dataArr = [];
- $("#popSortable table").each(function(){
- var newImgFileArr = [];
- var imgPath1 = '';
- var imgPath2 = '';
- var imgPath3 = '';
- var imgPath4 = '';
- var strVar1 = '';
- var strVar2 = '';
- var strVar3 = '';
- var strVar4 = '';
- var strVar5 = '';
- var strVar6 = '';
- var strVar7 = '';
- var strVar8 = '';
- var strTitle1 = '';
- var strTitle2 = '';
- var strTitle3 = '';
- var strTitle4 = '';
- var subText1 = '';
- var subText2 = '';
- var subText3 = '';
- var subText4 = '';
- var contentsType = '';
- var useYn = 'Y';
- var i = 1;
- $(this).find('input[name=imgPath]').each(function(){
- eval("imgPath" + i + "='"+$(this).val()+"'");
- i++;
- });
- $(this).find('input[name=newImgFile]').each(function(){
- newImgFileArr.push($(this).val());
- });
- i = 1;
- $(this).find('input[name=title]').each(function(){
- var title = $(this).val().replace(/[\']/gi, "\\'");
- eval("strTitle" + i + "='"+title+"'");
- i++;
- });
- i = 1;
- $(this).find('input[name=link]').each(function(){
- _mall = [[${@environment.getProperty('domain.front')}]];
- var val = $(this).val();
- val = val.replace('https:'+_mall, '');
- val = val.replace('http:'+_mall, '');
- val = val.replace(_mall, '');
- eval("strVar" + i + "='"+val+"'");
- i++;
- });
- i = 1;
- $(this).find('input[name=subText]').each(function(){
- var subText = $(this).val().replace(/[\']/gi, "\\'");
- eval("subText" + i + "='"+subText+"'");
- i++;
- });
- var dispStdt = $(this).find("[name=dispStdt]").val().replace(/[^0-9]/g, '') + "" +$(this).find("[name=stTimeHour]").val().replace('시', '') + "" +$(this).find("[name=stTimeMin]").val().replace('분', '') + "00";
- var dispEddt = $(this).find("[name=dispEddt]").val().replace(/[^0-9]/g, '') + "" +$(this).find("[name=edTimeHour]").val().replace('시', '') + "" +$(this).find("[name=edTimeMin]").val().replace('분', '') + "59";
- var dispOrd = $(this).find("[name=dispOrd]").val();
- if(contentsLoc=='SMM001'){
- var thisIdx = $(this).find("input[name=tableIdx]").val();
- strVar5 = $(this).find("input:radio[name=contentsType"+thisIdx+"]:checked").val();
- strVar6 = $(this).find("input[name=planSq"+thisIdx+"]").val();
- strVar7 = $(this).find("input:radio[name=thumTextColor"+thisIdx+"]:checked").val();
- }
- if(contentsLoc=='SMM005'){
- var thisIdx = $(this).find("input[name=tableIdx]").val();
- contentsType = $(this).find("input:radio[name=bannerType"+thisIdx+"]:checked").val();
- /*imgPath1 = $(this).find("#ImageArea1").find("input[name=imgPath]").val();
- strVar1 = $(this).find("#bannerLinkTr1").find("input[name=linkUrl]").val();
- imgPath2 = $(this).find("#ImageArea2").find("input[name=imgPath]").val();
- strVar2 = $(this).find("#bannerLinkTr2").find("input[name=linkUrl]").val();*/
- }
- if(contentsLoc=='SCM002' || contentsLoc=='SCM003'){
- useYn = $(this).find("input:radio[name=dispYn]:checked").val();
- }
- if(contentsLoc=='SCM003'){
- strVar1 = $(this).find("input:radio[name=dispCnt]:checked").val();
- }
- var data = {cateNo : cateNo
- , contentsLoc : contentsLoc
- , contentsType : contentsType
- , dispStdt : dispStdt
- , dispEddt : dispEddt
- , newImgFileArr : newImgFileArr
- , imgPath1 : imgPath1
- , imgPath2 : imgPath2
- , imgPath3 : imgPath3
- , imgPath4 : imgPath4
- , strVar1 : strVar1
- , strVar2 : strVar2
- , strVar3 : strVar3
- , strVar4 : strVar4
- , strVar5 : strVar5
- , strVar6 : strVar6
- , strVar7 : strVar7
- , strVar8 : strVar8
- , strTitle1 : strTitle1
- , strTitle2 : strTitle2
- , strTitle3 : strTitle3
- , strTitle4 : strTitle4
- , subText1 : subText1
- , subText2 : subText2
- , subText3 : subText3
- , subText4 : subText4
- , useYn : useYn
- , dispOrd : dispOrd
- , brandGroupNo : brandGroupNo
- };
- dataArr.push(data);
- });
- if(dataArr.length==0){
- var data = {cateNo : cateNo
- , contentsLoc : contentsLoc
- , brandGroupNo : brandGroupNo
- };
- dataArr.push(data);
- }else{
- var dataArrSort = [];
- dataArr.forEach(function(item, index){
- if(dataArr[index].dispOrd>0){
- for(var i=1; i<dataArr.length; i++){
- if(i>index){
- if(dataArr[index].dispOrd==dataArr[i].dispOrd){
- dataArr[i].dispOrd = Number(dataArr[i].dispOrd) + 1;
- }
- }
- }
- }
- });
- dataArr.forEach(function(item, index){
- if(dataArr[index].dispOrd != ''){
- dataArrSort[dataArr[index].dispOrd-1] = item;
- }
- });
- dataArr.forEach(function(item, index){
- if(dataArr[index].dispOrd == ''){
- var empty = false;
- for(var i=0; i<dataArrSort.length; i++){
- if(typeof dataArrSort[i] == 'undefined'){
- dataArrSort[i] = item;
- empty = true;
- break;
- }
- };
- if(!empty){
- dataArrSort.push(item);
- }
- }
- });
- dataArr = dataArrSort;
- }
- if(contentsLoc=='SMM002'||contentsLoc=='SMM003'||contentsLoc=='SMM004'||contentsLoc=='SMM006'||contentsLoc=='SMM007'
- ||contentsLoc=='SMM009' ||contentsLoc=='SMM010'||contentsLoc=='SMM011'||contentsLoc=='SBM005' || contentsLoc=='SBMM005'
- || contentsLoc=='SCM002' || contentsLoc=='SCM003' || contentsLoc=='SBM010'){
- var data = {
- cateNo : cateNo
- , contentsLoc : contentsLoc
- , contentsTitle : $("#contentsTitleForm input[name=contentsTitle]").val()
- , brandGroupNo : brandGroupNo
- }
- dataArr.push(data);
- }
- var jsonData = JSON.stringify(dataArr);
- mcxDialog.confirm('컨텐츠를 저장 하시겠습니까?', {
- cancelBtnText: "취소",
- sureBtnText: "확인",
- sureBtnClick: function(){
- gagajf.ajaxJsonSubmit('/display/contents/preview/save', jsonData, fnGetContentsPreviewList);
- }
- });
- });
- /**
- * 파일첨부
- */
- var fnPopFileUpload = function (obj, ind){
- var file = obj.files[0];
- file.name = 'test';
- if (typeof(file) == 'undefined'){
- return;
- }
- // 파일 업로드
- gagajf.ajaxFileUpload('/common/file/upload?subDir=/contents'
- , file
- , function(result) {
- $(obj).closest('div').find('input:hidden[name=newImgFile]').val(result.newFileName);
- $("#bannerPreViewUrlPop_"+ind).attr('src', $("#uploadDefaultUrlPop").val()+result.newFileName);
- $("#imgViewPop_"+ind).removeClass("off").addClass("on");
- }
- , 'image'
- );
- }
- /**
- * 링크추가
- */
- var fnAddLinkPopRow = function (param){
- var val = typeof param=='object'?'#':param;
- var html = '<tr name="linkPopRow">';
- html += '<th>링크 (없으면 #)</th>';
- html += '<td><input name="link" type="text" maxlength="200" required="required" data-valid-name="링크" value="'+val+'"/></td>';
- html += '<td class="aL"><button type="button" class="btn icn" onclick="fnDeleteTrRow(this);"><i class="fa fa-times" aria-hidden="true"></i></button></td>';
- html += '</tr>';
- if(typeof param == 'object'){
- if(contentsLoc=='SMM005'){
- if($(param).closest("table").find("tbody").find("tr[name=linkPopRow]").length>1){
- mcxDialog.alert("링크는 최대 2개까지 등록 가능합니다");
- return;
- }
- }else{
- if($(param).closest("table").find("tbody").find("tr[name=linkPopRow]").length>3){
- mcxDialog.alert("링크는 4개까지 등록 가능합니다");
- return;
- }
- }
- $(param).closest("table").find("tbody").append(html);
- }else{
- return html;
- }
- }
- /**
- * 서브텍스트추가
- */
- var fnAddSubTextPopRow = function (param){
- var val = typeof param=='object'?'':param;
- var html = '<tr name="subTextPopRow">'
- html += '<th>서브텍스트</th>';
- html += '<td><input type="text" name="subText" maxlength="200" value="'+val+'"/></td>';
- html += '<td class="aL"><button type="button" class="btn icn" onclick="fnDeleteTrRow(this);"><i class="fa fa-times" aria-hidden="true"></i></button></td>';
- html += '</tr>';
- if(typeof param == 'object'){
- if($(param).closest("table").find("tbody").find("tr[name=subTextPopRow]").length>3){
- mcxDialog.alert("서브텍스트는 4개까지 등록 가능합니다");
- return;
- }
- $(param).closest("table").find("tbody").append(html);
- }else{
- return html;
- }
- }
- /**
- * 브랜드 소개추가
- */
- var fnAddBrandDescRow = function (param){
- var val = typeof param=='object'?'':param;
- var html = '<tr name="subTextPopRow">'
- html += '<th>브랜드소개</th>';
- html += '<td><input type="text" name="subText" maxlength="200" value="'+val+'"/></td>';
- html += '<td class="aL"><button type="button" class="btn icn" onclick="fnDeleteTrRow(this);"><i class="fa fa-times" aria-hidden="true"></i></button></td>';
- html += '</tr>';
- if(typeof param == 'object'){
- if($(param).closest("table").find("tbody").find("tr[name=subTextPopRow]").length>0){
- mcxDialog.alert("브랜드소개는 1개까지 등록 가능합니다");
- return;
- }
- $(param).closest("table").find("tbody").append(html);
- }else{
- return html;
- }
- }
- /**
- * 이미지 추가
- */
- var imgIndex = 0;
- var fnAddImgPopRow = function (param){
- var src = '';
- var imgPath = '';
- if(typeof param!='object'){
- src = $("#uploadDefaultUrlPop").val().replace('/contents/', '')+param;
- imgPath = param;
- }
- var html = '<tr name="imgPopRow">';
- html += '<th>이미지';
- html += '</th>';
- html += '<td><div class="uFile w300">';
- html += '<input id="filePop_'+imgIndex+'" name="file" type="file" class="uFileInput w300" onchange="fnPopFileUpload(this, '+imgIndex+')"/>';
- html += '<label for="filePop_'+imgIndex+'" class="uFileLabel">파일선택</label>';
- html += '<input type="hidden" name="imgPath" value="'+imgPath+'"/>';
- html += '<input type="hidden" name="newImgFile" value="" />';
- html += '</div>';
- html += '<div id="imgViewPop_'+imgIndex+'" class=';
- if(src!=''){
- html += '"on">';
- }else{
- html += '"off">';
- }
- html += '<img id="bannerPreViewUrlPop_'+imgIndex+'" src="'+src+'" style="height:100px; max-width:500px;" onclick="cfnOpenImagePreViewPopup(\'bannerPreimgViewPop\',$(this).attr(\'src\'));"/>';
- html += '</div></td>';
- html += '<td class="aL"><button type="button" class="btn icn" onclick="fnDeleteTrRow(this);"><i class="fa fa-times" aria-hidden="true"></i></button></td>';
- html += '</tr>';
- if(typeof param == 'object'){
- if(contentsLoc=='SMM005'){
- if($(param).closest("table").find("tbody").find("tr[name=imgPopRow]").length>1){
- mcxDialog.alert("이미지는 최대 2개까지 등록 가능합니다");
- return;
- }
- }else{
- if($(param).closest("table").find("tbody").find("tr[name=imgPopRow]").length>3){
- mcxDialog.alert("이미지는 4개까지 등록 가능합니다");
- return;
- }
- }
- imgIndex++;
- $(param).closest("table").find("tbody").append(html);
- }else{
- imgIndex++;
- return html;
- }
- }
- /**
- * 타이틀추가
- */
- var fnAddTitlePopRow = function (param){
- var val = typeof param=='object'?'':param;
- var html = '<tr name="titlePopRow">';
- html += '<th>타이틀</th>';
- html += '<td><input name="title" type="text" maxlength="200" data-valid-name="타이틀" value="'+val+'"/></td>';
- html += '<td class="aL"><button type="button" class="btn icn" onclick="fnDeleteTrRow(this);"><i class="fa fa-times" aria-hidden="true"></i></button></td>';
- html += '</tr>';
- if(typeof param == 'object'){
- if($(param).closest("table").find("tbody").find("tr[name=titlePopRow]").length>3){
- mcxDialog.alert("타이틀은 4개까지 등록 가능합니다");
- return;
- }
- $(param).closest("table").find("tbody").append(html);
- }else{
- return html;
- }
- }
- // 컨텐츠 행삭제
- var fnDeleteContentsRow = function (obj){
- $(obj).closest("table").remove();
- }
- // 행삭제
- var fnDeleteTrRow = function (obj){
- $(obj).closest("tr").remove();
- }
- // 컨텐츠 추가 날짜 설정
- var fnCreateTimeOption = function(val, sel) {
- var html = '';
- for(var i=0; i<val; i++){
- var time = 0;
- if(i<10){
- time = '0'+i;
- }else {
- time = i;
- }
- var select = false;
- if(sel==time){
- select = true;
- }
- if(val==24){
- time += '시';
- }else if(val==60){
- time += '분';
- }
- html += '<option value="'+time+'"';
- if(select){
- html += 'selected="selected"';
- }
- html += '>'+time+'</option>';
- }
- return html;
- }
- // 창닫기
- var fnMainContentsPopupFormClose = function (){
- uifnPopupClose('popupMainContents');
- }
- $(document).ready(function() {
- $("#popTitle").text("["+contentsLoc+"] "+gagaAgGrid.lookupValue(contentsLocArr, contentsLoc));
- if(contentsLoc=='SMM002'||contentsLoc=='SMM003'||contentsLoc=='SMM004'||contentsLoc=='SMM006'||contentsLoc=='SMM007'
- ||contentsLoc=='SMM009' ||contentsLoc=='SMM010'||contentsLoc=='SMM011'||contentsLoc=='SBM005' || contentsLoc=='SBMM005'
- || contentsLoc=='SCM002' || contentsLoc=='SCM003' || contentsLoc=='SBM010'){
- $("#contentsTitleForm").show();
- }else{
- $("#contentsTitleForm").hide();
- }
- $("#popSortable").disableSelection();
- fnGetContentsPreviewList();
- });
- /*]]>*/
- </script>
- </html>
|