룩북 배너 등록

src/main/java/com/style24/admin/biz/web/TsaDisplayController.java

@@ -751,6 +751,11 @@ public class TsaDisplayController extends TsaBaseController {
 		mav.addObject("mode", mode);
 		mav.addObject("lookbookSq", lookbookSq);
 		mav.addObject("brandGroupList", rendererService.getSelfBrandGroupList());
+
+		if(!"".equals(lookbookSq)){
+			mav.addObject("lookbookMstInfo", coreLookbookService.getLookbookMstInfo(lookbookSq));
+			mav.addObject("lookbookBannerList", coreLookbookService.getLookbookBannerDetailList(lookbookSq));
+		}
 		mav.setViewName("display/LookbookBannerPopupForm");
 		return mav;
 	}
@@ -804,4 +809,5 @@ public class TsaDisplayController extends TsaBaseController {
 		coreLookbookService.deleteLookbook(lookbook);
 		return super.ok(message.getMessage("SUCC_0009"));
 	}
+
 }

src/main/webapp/WEB-INF/views/display/LookbookBannerPopupForm.html

@@ -95,8 +95,8 @@
 						</td>
 						<th>노출여부<i class="required" title="필수"></i></th>
 						<td>
-							<label class="rdoBtn"><input type="radio" name="dispYn" value="Y" checked="checked"/>Y</label>
-							<label class="rdoBtn"><input type="radio" name="dispYn" value="N">N</label>
+							<label class="rdoBtn"><input type="radio" name="dispYn" value="Y"/>Y</label>
+							<label class="rdoBtn"><input type="radio" name="dispYn" value="N" checked="checked">N</label>
 						</td>
 					</tr>
 					<tr>
@@ -128,6 +128,9 @@
 </div>
 <script type="text/javascript" src="/ux/plugins/gaga/gaga.paging.js?v=2019072202"></script>
 <script th:inline="javascript">
+	var mode = [[${mode}]];
+	var lookbookMstInfo = [[${lookbookMstInfo}]];
+	var lookbookBannerList = [[${lookbookBannerList}]];
 
 	var bannerIdx = 0;
 	$("#btnAddBanner").on('click', function(){
@@ -156,7 +159,9 @@
 		html += '			</td>';
 		html += '			<th>이미지설명</th>';
 		html += '			<td><textarea class="textareaR4" name="imgDesc" id="imgDesc'+bannerIdx+'"></textarea></td>';
-		html += '			<td><input name="dispOrd" type="text" class="w80" placeholder="전시순서" style="margin-left:5px; text-align:center"/><button type="button" class="btn btn-danger btn-lg" onclick="fnDeleteBanner(this);">삭제</button></td>';
+		html += '			<td><input name="dispOrd" type="text" class="w80" placeholder="전시순서" style="margin-left:5px; text-align:center"/>';
+		//html += '			<button type="button" class="btn btn-success btn-lg" onclick="fnAddPicker(this);">피커추가</button>';
+		html += '			<button type="button" class="btn btn-danger btn-lg" onclick="fnDeleteBanner(this);">삭제</button></td>';
 		html += '		</tr>';
 		html += '	</thead>';
 		html += '</table>';
@@ -224,7 +229,7 @@
 		var bannerIndex=0;
 		$(".bannerTableC").each(function (){
 			var bannerInfo = {
-				orgFileNm : $(this).find("input[name=bannerNewImgFile]").val()
+				orgFileNm : $(this).find("input[name=bannerImgPath]").val()
 				,sysFileNm : $(this).find("input[name=bannerNewImgFile]").val()
 				,imgDesc : $(this).find("textarea[name=imgDesc]").val()
 				,dispOrd : $(this).find("input[name=dispOrd]").val()
@@ -252,6 +257,7 @@
 					,mainDispYn : 'N'
 					,dispOrd : 1
 					,bannerList : bannerList
+					,mode : mode
 				};
 
 				var jsonData = JSON.stringify(data);
@@ -304,7 +310,111 @@
 		}
 	});
 
+	// 컨텐츠 추가 날짜 설정
+	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 fnCreateLookbookLayout = function (){
+		//마스터정보 셋팅
+		var dispStdt = lookbookMstInfo.dispStdt.split(" ");
+		var dispStTime = dispStdt[1].replace(/[^0-9]/g, '');
+		var dispEddt = lookbookMstInfo.dispEddt.split(" ");
+		var dispEdTime = dispEddt[1].replace(/[^0-9]/g, '');
+		$("#lbBannerForm input[name=lbDispStdt]").val(dispStdt[0]);
+		$("#lbBannerForm #lbStTimeHour").val(dispStTime.substr(0,2));
+		$("#lbBannerForm #lbStTimeMin").val(dispStTime.substr(2,2));
+		$("#lbBannerForm input[name=lbDispEddt]").val(dispEddt[0]);
+		$("#lbBannerForm #lbEdTimeHour").val(dispEdTime.substr(0,2));
+		$("#lbBannerForm #lbEdTimeMin").val(dispEdTime.substr(2,2));
+		$("#lbBannerForm input[name=title]").val(lookbookMstInfo.title);
+		$("#lbBannerForm select[name=brandCd]").val(lookbookMstInfo.brandCd);
+		$('input:radio[name="dispYn"]:radio[value='+lookbookMstInfo.dispYn+']').prop('checked', true);
+		var tnImgPath = lookbookMstInfo.sysTnfileNm;
+		var tnSrc = $("#uploadDefaultUrl").val().replace('/lookbook/thumbnail/', '');
+		tnSrc = tnSrc + tnImgPath;
+		$("#lbBannerForm input[name=orgTnfileNm]").val(tnImgPath);
+		$("#lbBannerForm input[name=sysTnfileNm]").val(tnImgPath);
+		$("#lbBannerForm input[name=newSysTnfileNm]").val(tnImgPath);
+		$("#lbBannerForm #bannerPreViewUrl").attr('src', tnSrc);
+		$("#lbBannerForm #imgView").removeClass("off").addClass("on");
+
+		if(lookbookBannerList.length > 0){
+			for(let i=0; i<lookbookBannerList.length; i++){
+				var html = '';
+				var imgPath = lookbookBannerList[i].sysFileNm;
+				var src = $("#uploadDefaultBannerUrlPop").val().replace('/lookbook/banner/', '');
+				src = src + imgPath;
+				html += '<table class="frmStyle bannerTableC" id="bannerTable'+i+'">';
+				html += '	<input type="hidden" name="lookbookbSq" value="'+lookbookBannerList[i].lookbookbSq+'">';
+				html += '	<colgroup>';
+				html += '		<col style="width:10%"/>';
+				html += '		<col style="width:30%"/>';
+				html += '		<col style="width:10%"/>';
+				html += '		<col style="width:45%"/>';
+				html += '		<col style="width:5%"/>';
+				html += '	</colgroup>';
+				html += '	<thead>';
+				html += '		<tr>';
+				html += '			<th>배너이미지</th>';
+				html += '			<td>';
+				html += '				<div class="uFile w300">';
+				html += '					<input id="bannerFile'+i+'" name="file" type="file" class="uFileInput w300" onchange="fnBannerImgFileUpload(this, '+i+')"">';
+				html += '					<label for="bannerFile'+i+'" class="uFileLabel">파일선택</label>';
+				html += '					<input type="hidden" name="bannerImgPath" value="'+imgPath+'">';
+				html += '					<input type="hidden" name="bannerNewImgFile" value="">';
+				html += '				</div>';
+				html += '				<div id="bannerImgView_'+i+'">';
+				html += '					<img id="bannerPreViewUrl_'+i+'" src="'+src+'" style="height:100px; max-width:500px;"/>';
+				html += '				</div>';
+				html += '			</td>';
+				html += '			<th>이미지설명</th>';
+				html += '			<td><textarea class="textareaR4" name="imgDesc" id="imgDesc'+i+'">'+lookbookBannerList[i].imgDesc+'</textarea></td>';
+				html += '			<td><input name="dispOrd" type="text" class="w80" placeholder="전시순서" style="margin-left:5px; text-align:center" value="'+lookbookBannerList[i].dispOrd+'"/>';
+				html += '				<button type="button" class="btn btn-success btn-lg" onclick="fnAddPicker(this);">피커추가</button>';
+				html += '				<button type="button" class="btn btn-danger btn-lg" onclick="fnDeleteBanner(this);">삭제</button></td>';
+				html += '		</tr>';
+				html += '	</thead>';
+				html += '</table>';
+
+				$("#bannerDiv").append(html);
+				$("#bannerDiv").sortable();
+				fnResetIdx();
+			}
+		}
+	}
+
 	$(document).ready(function() {
+		// 상세/수정일때
+		if(mode != 'N'){
+			fnCreateLookbookLayout();
+		}
 		//sortable Item List
 		$("#bannerDiv").sortable({
 			stop: function(event, ui) {

src/main/webapp/WEB-INF/views/display/LookbookListForm.html

@@ -156,6 +156,14 @@
 	let gridOptions = gagaAgGrid.getGridOptions(columnDefs);
 	gridOptions.rowSelection = "multiple";
 
+	// 셀 클릭 이벤트
+	gridOptions.onCellClicked = function(event) {
+		if (event.colDef.field == 'lookbookSq') {
+			// 룩북 상세
+			cfnOpenLookbookBannerPopup('U',event.data.lookbookSq);
+		}
+	}
+
 	// 등록 팝업
 	$("#btnReg").on('click', function(){
 		cfnOpenLookbookBannerPopup('N');