<!DOCTYPE html>
<html lang="ko"
	xmlns:th="http://www.thymeleaf.org"
	xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
	layout:decorator="web/common/layout/BrandLayoutWeb">
<!--
 *******************************************************************************
 * @source  : PlanningMainFormWeb.html
 * @desc    : 기획전메인 Page
 *============================================================================
 * STYLE24
 * Copyright(C) 2020 TSIT, All rights reserved.
 *============================================================================
 * VER  DATE         AUTHOR      DESCRIPTION
 * ===  ===========  ==========  =============================================
 * 1.0  2021.03.05   sowon       최초 작성
 *******************************************************************************
 -->
<body>

<th:block layout:fragment="content">
	<!--  container -->
	<div id="container" class="container dp">
		<div class="breadcrumb"> 
			<ul>
				<li class="bread_home" th:if="${brandGroupInfo==null}"><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_MAIN);">홈</a></li>
				<li class="bread_home" th:unless="${brandGroupInfo==null}"><a href="javascript:void(0);" th:onclick="cfnGoToBrandMain([[${brandGroupInfo.brandGroupNo}]]);">홈</a></li>
				<li class="bread_home" th:unless="${brandGroupInfo==null}"><a th:unless="${brandGroupInfo==null}" href="javascript:void(0);" th:onclick="cfnGoToBrandMain([[${brandGroupInfo.brandGroupNo}]]);" th:text="${brandGroupInfo.brandGroupNm}"></a></li>
				<li class="bread_2depth">기획전</li>
			</ul> 
		</div>
		<div class="wrap">
			<div class="content dp_Exhibition"> <!-- 페이지특정 클래스 = dp_Exhibition -->
				<div class="cont_head">
					<div>
						<h3>기획전</h3>
					</div>
				</div>
				<div class="cont_body">
					<div class="taps">
						<div>
							<ul>
								<li th:if="${brandGroupInfo==null}" th:class="${cateNo == null ? 'active' : ''}"><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_PLANNING_MAIN);">전체</a></li>
								<li th:unless="${brandGroupInfo==null}" th:class="${cateNo == null ? 'active' : ''}"><a href="javascript:void(0);" th:onclick="|cfnGoToPage(_PAGE_PLANNING_MAIN + '?brandGroupNo=${brandGroupInfo.brandGroupNo}');|">전체</a></li>
								<li th:if="${brandGroupInfo==null}" th:each="oneData, stat : ${cateList}" th:class="${oneData.cateNo == cateNo ? 'active' : '' }" ><a href="javascript:void(0);" th:onclick="|cfnGoToPage(_PAGE_PLANNING_MAIN + '?cateNo=${oneData.cateNo}');|">[[${oneData.cateNm}]]</a></li>
								<li th:unless="${brandGroupInfo==null}" th:each="oneData, stat : ${cateList}" th:class="${oneData.cateNo == cateNo ? 'active' : '' }" ><a href="javascript:void(0);" th:onclick="|cfnGoToPage(_PAGE_PLANNING_MAIN + '?cateNo=${oneData.cateNo}' + '&brandGroupNo=${brandGroupInfo.brandGroupNo}');|">[[${oneData.cateNm}]]</a></li>
							</ul>
						</div>
					</div>
					  <div class="count_wrap">
                        <div>
                            <p id="planningTotCnt"><span>0</span>개의 기획전</p>
                        </div>
                    </div>
					 <div class="nodata" style="display: none;" id="divPlanningNoData"> 
						<div class="txt_box">
							<div>
								<p>등록된 기획전이 없습니다.</p>
							</div>
							<div class="btn_box">
								<button class="btn btn_default" th:if="${brandGroupInfo==null}" onclick="cfnGoToPage(_PAGE_MAIN);"><span>메인으로 가기</span></button>
								<button class="btn btn_default" th:unless="${brandGroupInfo==null}" th:onclick="cfnGoToBrandMain([[${brandGroupInfo.brandGroupNo}]]);"><span th:text="${brandGroupInfo.brandGroupNm+' 홈으로 가기'}"></span></button>
							</div>
						</div>
					</div> 
					<div class="exhi_list" style="display: none;" id="divPlanningList">
					</div>
				</div>
			</div>
		</div>
	</div>
	<!-- // container -->

<script th:inline="javascript">
/*<![CDATA[*/
	let fnGetPlanningList = function(cateNo,brandGroupNo) {
		let actionUrl = '/planning/main/list';
		if (!gagajf.isNull(cateNo)) actionUrl += '?cateNo=' + cateNo;
		if (!gagajf.isNull(brandGroupNo)){
			if (!gagajf.isNull(cateNo)){
				actionUrl += '&brandGroupNo=' + brandGroupNo;
			}else{
				actionUrl += '?brandGroupNo=' + brandGroupNo;
			}
		}
		
		$.getJSON(actionUrl	, function(result, status) {
				if (status == 'success') {
					if(result.length == 0){
						$('#planningTotCnt').html('<span>0</span>개의 기획전');
					}
						
                    if (result.length > 0) {
                       $('#planningTotCnt').html('<span>' + result.length.addComma() + '</span>개의 기획전');
						
						$('#divPlanningList').html('');
						
						let tag ='';
						$.each(result, function(idx, item) {
						    tag += '  <div class="exhi_item">\n';
						    tag += '       <div class="exhi_item_img">\n';
						    if(!gagajf.isNull(brandGroupNo)){
								tag += '           <a href= "javascript:void(0);" onclick="cfnGoToPlanDetail(\'' + item.planSq + '\',\'' + brandGroupNo + '\')">\n';
							}else{
								tag += '           <a href= "javascript:void(0);" onclick="cfnGoToPlanDetail(\'' + item.planSq + '\')">\n';
							}
                            if (item.newYn == 'Y') {
						    	tag += '				<div class="shape ranker"><span>NEW</span></div>\n';
						    }
                            tag += '               <div class="thumb">\n';
						    tag += '                   <img src="' + _uploadImageUrl + item.mainImg + '?RS=430" alt="">\n';
						    tag += '               </div>\n';
						    tag += '               <div class="exhi_detail">\n';
						    tag += '                   <h3 class="tit">' + item.planNm + '</h3>\n';
						    tag += '                   <p class="sale">' + item.dtlTitle1 + '</p>\n';
						    tag += '               </div>\n';
						    tag += '           </a>\n';
						    tag += '       </div>\n';
                        	if (item.planningGoodsList.length > 0) {
								tag += '       <div class="exhi_item_pr">\n';
								tag += '           <ul class="prod_list clear">\n';
                                $.each(item.planningGoodsList, function(idx2, goods) {
                                    tag += '               <li>\n';
								    tag += '                   <div class="item_prod">\n';
								    tag += '                       <div class="item_state">\n';
								    tag += '                           <a  onclick="cfnGoToGoodsDetail(\'' + goods.goodsCd + '\',\'\',\'IN12_01\');" class="itemLink">\n';
								    tag += '                               <div class="itemPic">\n';
								    tag += '                                   <img alt="" class="vLHTC pd_img" src="' + _uploadGoodsUrl + '/' + goods.sysImgNm + '?RS=1000">\n';
								    tag += '                               </div>\n';
								    tag += '                               <div class="itemName">' + goods.goodsNm + '</div>\n';
								    tag += '                               <p class="itemPrice">' + goods.currPrice.addComma() + '</p>\n';
								    tag += '                           </a>\n';
								    tag += '                       </div>\n';
								    tag += '                   </div>\n';
								    tag += '               </li>\n';
                                });
                            }
                            tag += '           </ul>\n';
						    tag += '       </div>\n';
						    tag += '   </div>';

                        });    
						
						tag += '</div>\n';
						$('#divPlanningList').html(tag);
						$('#divPlanningNoData').hide();
						$('#divPlanningList').show();

                    }else{
                    	$('#divPlanningNoData').show();
    					$('#divPlanningList').hide();
                    
                	}
                }
		});											
	}
	
	$(document).ready(function() {
		fnGetPlanningList([[${cateNo}]],[[${brandGroupNo}]]);
		if(!gagajf.isNull([[${brandGroupNo}]])){
			$(".br_header").css('background-color','#fff');
		}

	});
/*]]>*/
</script>

</th:block>

</body>
</html>