style24
/
style24.front


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738
							<!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/DefaultLayoutWeb">
<!--
 *******************************************************************************
 * @source  : PlanningDetailFormWeb.html
 * @desc    : 기획전디테일 Page
 *============================================================================
 * Pastelmall
 * Copyright(C) 2020 TSIT, All rights reserved.
 *============================================================================
 * VER  DATE         AUTHOR      DESCRIPTION
 * ===  ===========  ==========  =============================================
 * 1.0  2021.3.9     sowon     최초 작성
 *******************************************************************************
 -->
<body>
<th:block layout:fragment="content">
<script src="https://developers.kakao.com/sdk/js/kakao.min.js"></script>
<div id="container" class="container dp" th:with="frontUrl=${@environment.getProperty('domain.front')}, goodsView=${@environment.getProperty('upload.goods.view')}, planView=${@environment.getProperty('upload.image.view')}">
		<div class="breadcrumb"> 
			<ul>
                <li class="bread_home"><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_MAIN);">홈</a></li>
				<li class="bread_2depth" th:if="${planInfo.planGb == 'P'}" ><a href="javascript:void(0);"onclick="cfnGoToPage(_PAGE_PLANNING_MAIN);">기획전</a></li>
				<li class="bread_2depth" th:if="${planInfo.planGb == 'E'}" ><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_EVENT_MAIN);">이벤트/혜택</a></li>
				<li class="bread_2depth" th:text="${planInfo.planNm}"></li>
			</ul> 
		</div>
		<div class="wrap">
            <!-- 상단 프로모션 배너 -->
				<div class="content wide dp_detail_visual">
					<div class="cont_head">
						<div>
							<h3 th:text="${planInfo.planNm}"></h3>
							<div class="shareSet">
								<button class="btn_share" data-name="openShare">공유하기</button>
								<div class="shareWrap">
									<div id="layerShare" class="setShare open">
										<span>
											<button type="button" class="kk"
												th:attr="onclick=|cfnSendToKakao('${stylelUrl+'/planning/detail/form?planSq='+planInfo.planSq}', '${planInfo.planNm}', '${planView+ '/'+planInfo.mainImg}');|">
												<span>카카오톡</span>
											</button>
											<button type="button" class="fb"
												th:attr="onclick=|sendSns('facebook', '${stylelUrl+'/planning/detail/form?planSq='+planInfo.planSq}', '${planInfo.planNm}', '', '');|">
												<span>페이스북</span>
											</button>
											<button type="button" class="tw"
												th:attr="onclick=|sendSns('twitter', '${stylelUrl+'/planning/detail/form?planSq='+planInfo.planSq}', '${planInfo.planNm+ '#style24몰'}', '', '');|">
												<span>트위터</span>
											</button>
											<button type="button" class="url btn_copy">
												<span>URL</span>
											</button>
										</span>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
				<div class="cont_body" th:if="${fsrcInfoTop != null}" th:utext="${#strings.replace(#strings.replace(fsrcInfoTop.fsrcPc,'&amplt;','<'),'&ampgt;','>')}">
                    <!-- 프로모션배너 type1 --> 
                    <!-- <div class="promotion_visual type1" th:if="${fsrcInfoTop != null and planInfo.planGb == 'P'}" th:utext="${#strings.replace(#strings.replace(fsrcInfoTop.fsrcPc,'&amplt;','<'),'&ampgt;','>')}"></div> -->
                    <!-- <div class="promotion_visual type2" th:if="${fsrcInfoTop != null}" th:utext="${#strings.replace(#strings.replace(fsrcInfoTop.fsrcPc,'&amplt;','<'),'&ampgt;','>')}"></div> -->           
                    <!-- 프로모션배너 type1 -->                    
                    <!-- 프로모션배너 type2 --> 
               <!-- <div class="promotion_visual type2">
                        <div class="swiper-container">
                            <div class="swiper-wrapper ">
                                <div class="swiper-slide">
                                    <img alt="" src="/images/pc/thumb/bigbanner_slide01.png">
                                </div>
                                <div class="swiper-slide">
                                    <img alt="" src="/images/pc/thumb/bigbanner_slide02.png"> 
                                </div>
                            </div>
                        </div>
                        <div class="swiper-button-prev"></div>
                        <div class="swiper-button-next"></div>
                        <div class="swiper-pagination"></div>
                    </div> -->
                    <!-- 프로모션배너 type2 -->                    
                </div>
            <!-- //상단 프로모션 배너 -->
            
            <th:block th:each="a, template : ${templateOrd}">
				<th:block th:if="${a.tmplType == 'G082_10'}">
						<div class="content wide dp_review" th:id="${a.tmplType}"></div> <!-- //리뷰 -->
					</th:block>
				<th:block th:if="${a.tmplType == 'G082_20'}">
						 <div class="content wide dp_coupon" th:id="${a.tmplType}"></div>  <!-- //할인쿠폰 -->
					</th:block>
				<th:block th:if="${a.tmplType == 'G082_30'}">
						<div class="content dp_mid_banner" th:id="${a.tmplType}"></div> <!-- //이미지-->
					</th:block>
				<th:block th:if="${a.tmplType == 'G082_40'}">
						<div class="coner_item01" th:id="${a.tmplType}"></div>
					</th:block>
				<th:block th:if="${a.tmplType == 'G082_50'}">
						<div class="content dp_special" th:id="${a.tmplType + a.planContSq}"></div>
				</th:block>
				<th:block th:if="${a.tmplType == 'G082_51'}">
						<div class="content dp_special" th:id="${a.tmplType + a.planContSq}"></div>
				</th:block>
				<th:block th:if="${a.tmplType == 'G082_52'}">
						<div class="content dp_special" th:id="${a.tmplType + a.planContSq}"></div>
				</th:block>
			</th:block>
            
            <!-- 관련상품 리스트 -->
			<div class="content sticky_nav_list" th:if="${planCornerListLength>0}">
				<div class="cont_head">
                    <div class="sticky_nav">
                        <ul>    
                        	<th:block th:each="cornerData, CornerStat : ${planCornerList}">
                            <li><a th:href="${'#brand' +CornerStat.index}" th:text="${cornerData.cornerNm}"></a></li> <!-- 섹션이동 -->
                            </th:block>
                        </ul>
                    </div>
				</div>
				<div class="cont_body">
                    <div class="list_content">
                    	<th:block th:each="cornerData, CornerStat : ${planCornerList}">
                        <div th:id="${'brand' +CornerStat.index}">
                            <div class="item_header"> <!-- 섹션이동 -->
                                <h4 th:text="${cornerData.cornerNm}"></h4>
                            </div>
                            <div class="itemsGrp"> <!-- itemsGrp rank hot deal -->
                            	<th:block th:each="cornerGoodsData, CornerGoodsStat : ${planCornerGoodsList}" th:if="${cornerGoodsData.cornerNm == cornerData.cornerNm}">
                       
                                <div class="item_prod">
                                    <div class="item_state">
                                        <button type="button" th:class="${cornerGoodsData.likeIt == 'likeit'}? 'itemLike likeit' : 'itemLike'" onclick="cfnPutWishList(this);" th:attr="goodsCd=${cornerGoodsData.goodsCd}, ithrCd='', contentsLoc='', planDtlSq=''">관심상품 추가</button>
                                        <a href="javascript:void(0);" th:onclick="cfnGoToGoodsDetail([[${cornerGoodsData.goodsCd}]])" class="itemLink">
                                            <!-- <div class="rank ranker"><span>1</span></div> -->
                                            <div class="itemPic">
                                                <img alt="BLUE-a" class=" vLHTC pd_img" th:src="${goodsView + '/' +cornerGoodsData.sysImgNm}">
                                            </div>
                                            <p class="itemBrand" th:text="${cornerGoodsData.brandGroupNm}"></p>
                                            <div class="itemName" th:text="${cornerGoodsData.goodsNm}"></div>
                                            <p class="itemPrice">[[${#numbers.formatInteger(cornerGoodsData.currPrice,0,'COMMA')}]]
                                                <span class="itemPrice_original" th:if="${cornerGoodsData.currPrice != cornerGoodsData.listPrice}" th:text="${#numbers.formatInteger(cornerGoodsData.listPrice,0,'COMMA')}"></span>
                                                <span class=" itemPercent" th:if="${cornerGoodsData.dcRate != '0'}" th:text="|${#numbers.formatDecimal(cornerGoodsData.dcRate,0,0)}%|"></span>
                                            </p>
                                            <div class="itemcolorchip">
                                                <span class="chip_color35" value="ABM">BEIGE</span>
                                                <span class="chip_color54" value="BDS">BLACK</span>
                                                <span class="chip_color40" value="YBR">WHITE</span>
                                            </div>
                                            <p class="itemBadge">
                                                <span class="badge13">베스트 </span>
                                            </p>
                                            <div class="itemComment" th:if="${cornerGoodsData.goodsTnm != null}" th:text="${cornerGoodsData.goodsTnm}"></div>
                                        </a>
                                    </div>
                                </div>  
                                </th:block>          
                            </div>
                            </th:block>
                        </div>                
                    </div>
                </div>
		    </div>
		  
            <!-- //관련상품 리스트 -->  

            <!-- 다른 기획전 보기 -->
            <div class="content other_dp_slide" th:if="${listSize > 0}">
                <div class="cont_head">
                    <div>
                        <h4 th:if="${planInfo.planGb == 'P'}">다른 기획전 보기</h4>
                        <h4 th:if="${planInfo.planGb == 'E'}">다른 이벤트 보기</h4>
                        <a href="javascript:void(0);" th:if="${planInfo.planGb == 'P'}" onclick="cfnGoToPage(_PAGE_PLANNING_MAIN);">전체보기</a>
                        <a href="javascript:void(0);" th:if="${planInfo.planGb == 'E'}" onclick="cfnGoToPage(_PAGE_EVENT_MAIN);">전체보기</a>
                    </div>
                </div>
                <div class="cont_body">
                    <div class="swiper-container">
                        <div class="swiper-wrapper">
                        	<th:block th:each="PlanData, PlanStat : ${planList}">
                            <div class="swiper-slide">                   
                                <a th:onclick="cfnGoToPlanDetail([[${PlanData.planSq}]])">
                                    <div class="thumb">
                                        <img th:src="${@environment.getProperty('upload.image.view')+PlanData.mainImg}" alt="${PlanData.planNm}">
                                    </div>
                                    <div class="txt">
                                        <p class="tit" th:text="${PlanData.planNm}"></p>
                                    </div>
                                </a>
                            </div>
                            </th:block>   
                        </div>
                    </div>
                    <div class="swiper-button-prev"></div>
                    <div class="swiper-button-next"></div>
                </div>
            </div>
            <!-- //다른 기획전 보기 -->
        </div>
<div class="modal fade couponInfo_pop" id="couponInfoPop" tabindex="-1" role="dialog" aria-labelledby="couponInfoLabel" aria-hidden="true">

</div>
<script th:inline="javascript">

let review = [[${reviewInfo}]];
let coupon = [[${couponInfo}]];
let plan = [[${planInfo}]];
let image = [[${imageInfo}]];
let goods1 = [[${goods1Info}]];
let goods2 = [[${goods2Info}]];
let goods4 = [[${goods4Info}]];
let template =[[${templateOrd}]];
let _mall = [[${@environment.getProperty('domain.front')}]];
let goodsView =[[${@environment.getProperty('upload.goods.view')}]]
let imgUrl=[[${@environment.getProperty('upload.image.view')}]];

if(review.length>0){
	
	var html = '';
	
	html += ' <div class="cont_head">';
	html += ' 	<div>';
	html += '		<h4>'+review[0].title+'</h4>';
	html += ' 	</div>';
	html += '	<div class="cont_body">';
	html += ' 		<div class="review_list">';
	$.each(review, function(idx, item)  {
		html += '		<div class="reviw_box">'
		html += '			<div class="best_review">';
		html += '				<a href="javascript:void();" id="btn_pdBestReview_pop" onclick="cfGoodsReviewDetail(\''+item.goodsCd+'\',\'\', \'Y\',\''+item.reviewSq+'\');">';
		html += '					<div class="pic">';
		if (item.fileGb == 'M') { 
			html += '								<span class="thumb mov" style="background-image: url('+ imgUrl +'/'+item.reviewSysImg +');"></span>';	
		}else{
			html += '								<span class="thumb" style="background-image: url('+ imgUrl +'/'+item.reviewSysImg +');"></span>';			
		}
		html += '                   </div>';
		html += '                  <div class="star_score">';
		html += '                      <span class="star">';
		html += '                          <em class="progbar" style="width:'+(item.score*20)+'%;"></em> <!-- 평점 style로 표기 -->';
		html += '                      </span>';
		if(item.bestYn == 'Y'){
			html += '<em class="ico ico_besttag"></em>';	
		}
		html += '                  </div>';
		html += '                  <div class="txt_best_review">';
		html += '                      <p>'+item.reviewContent+'</p>';
		html += '                  </div>';
		html += '                  <div class="info_writer">';
		html += '                      <span class="wr_id">'+item.maskingCustId+'</span>';
		html += '                      <span class="wr_date">'+item.regDt+'</span>';
		html += '                  </div>';
		html += '              </a>';
		html += '          </div>';
		html += '          <div class="review_item">';
		html += '              <div class="item_prod">';
		html += '                  <div class="item_state">';
		html += '                      <a href="javascript:void(0)" onclick="cfnGoToGoodsDetail(\'' + item.goodsCd + '\')" class="itemLink">';
		html += '                          <div class="itemPic">';
		html += '                            	<img alt="" class="vLHTC pd_img" src="'+ goodsView +'/'+item.sysImgNm +'">';
		html += '                          </div>';
		html += '                          <div class="itemName">'+item.goodsNm+'</div>';
		html += '                          <p class="itemPrice">'+item.currPrice.addComma()+'</p>';
		html += '                      </a>';
		html += '                  </div>';
		html += '              </div>';
		html += '          </div>';
		html += '      </div>  ';
	});
	html += '       </div>                    ';
	html += '	 </div>';
	html += '</div>';

	$("#G082_10").append(html);
}

if(image.length>0){
	var html = '';
	
	html += '<div class="cont_body">     ';
	html += '    <div class="mid_banner">';
	html += '        <div class="swiper-container">';
	html += '            <div class="swiper-wrapper">';
	for (var i = 0; i < image.length; i++) {
		html += '                	<div class="swiper-slide">';
		html += '                    	<img alt="" src="'+ imgUrl + image[i].itemVal +'">';
		html += '                	</div>';
	}
	html += '            </div>';
	html += '        </div>';
	html += '        <div class="swiper-button-prev"></div>';
	html += '        <div class="swiper-button-next"></div>';
	html += '        <div class="swiper-pagination"></div>';
	html += '    </div>';
	html += '</div>';
	
	
	$("#G082_30").append(html);
}

if(goods1.length>0){
	var array = [];

	for (var j = 0; j < template.length; j++) {
		if(template[j].tmplType == 'G082_50'){
			array.push(template[j].planContSq);
		}
		
	}	
	
	for (var i = 0; i < template.length; i++) {
		var html = '';
		if(template[i].tmplType == 'G082_50' && array[0] == template[i].planContSq && typeof array[0] != 'undefined') {
			html += '<div class="cont_head">';
			html += '	<div>';
			html += '        <h4>';
			if (template[i].linkUrl != null && template[i].linkUrl != '') { /* 링크 변경 예정 */
				html += '        <a href="http://'+template[i].linkUrl+'" target="_blank">'+template[i].title+' <i class="ico_arrow"></i></a>';
			}else{
				html += '        <a href="javascript:void(0)">'+template[i].title+'</a>';
			}
			html += '		</h4>';
			html += '    </div>';
			html += '</div>';
			html += '<div class="cont_body">';
			html += '    <div class="dp_listItems_cont type1">';
			html += '        <ul>';
		$.each(goods1, function(idx, item)  {
			if (item.planContSq == template[i].planContSq) {
				html += '            <li>';
				html += '                <div class="dp_listItems">';
				html += '                    <div class="dp_listItems_img">';
				html += '                        <img src="'+ goodsView +'/'+item.sysImgNm +'" alt="">';
				html += '                    </div>';
				html += '                    <div class="dp_listItems_info">';
				html += '                        <div class="dp_listItems_brand">'+item.brandGroupNm+'</div>';
				html += '                        <div class="dp_listItems_name">'+item.goodsNm+'<br></div>';
				html += '                        <div class="dp_listItems_price">';
				html += '                            <span class="price">'+item.currPrice.addComma()+'</span>';
				if (item.currPrice != item.listPrice) {
					html += '                            <del>'+item.listPrice.addComma()+'</del>';
					html += '                            <span class="percent">'+Math.floor(item.dcRate)+'%</span>';
				}
				html += '                        </div>';
				if(item.goodsTnm != null){
					html += '                        <div class="itemComment">'+item.goodsTnm+'</div>';
				}
				html += '                        <div class="ui_row">';
				html += '                            <button type="button" class="btn btn_default" onclick="cfnGoToGoodsDetail(\'' + item.goodsCd + '\')"><span>자세히 보기</span></button>';
				html += '                        </div>';
				html += '                    </div>';
				html += '                </div>';
				html += '            </li>';
			}
		});
		html += '        </ul>';
		html += '    </div>       ';
		html += '</div>';
		$("#G082_50" +array[0]).append(html);
	}
		if($("#G082_50" +template[i].planContSq).length){
			array.shift();
		}
	}
}

if(goods2.length>0){
	var array = [];

	for (var j = 0; j < template.length; j++) {
		if(template[j].tmplType == 'G082_51'){
			array.push(template[j].planContSq);
		}
	}	
	for (var i = 0; i < template.length; i++) {
		var html = '';
		
		if(template[i].tmplType == 'G082_51' && array[0] == template[i].planContSq && typeof array[0] != 'undefined'){
			html += '<div class="cont_head">';
			html += '	<div>';
			html += '        <h4>';
				if (template[i].linkUrl != null && template[i].linkUrl != '') { /* 링크 변경 예정 */
					html+='            <a href="http://'+template[i].linkUrl+'" target="_blank">'+template[i].title+'<i class="ico_arrow"></i></a>';
				}else{
					html+='            <a href="javascript:void(0)">'+template[i].title+'</a>';
				}
			html += '        </h4>';
			html += '    </div>';
			html += '</div>';
			html += '<div class="cont_body">';
			html += '    <div class="dp_listItems_cont type2">';
			html += '        <div class="swiper-container">';
			html += '            <div class="swiper-wrapper">';
			$.each(goods2, function(idx, item) {
				if (item.planContSq == template[i].planContSq) {
					html += '                <div class="swiper-slide">';
					html += '                    <div class="item_prod">';
					html += '                        <div class="item_state">';
					html += '                            <a onclick="cfnGoToGoodsDetail(\'' + item.goodsCd + '\')" class="itemLink">';
					html += '                                <div class="itemPic">';
					html += '                                    <img alt="BLUE-a" class=" vLHTC pd_img" src="'+ goodsView +'/'+item.sysImgNm +'">';
					html += '                                </div>';
					html += '                                <p class="itemBrand">'+item.brandGroupNm+'</p>';
					html += '                                <div class="itemName">'+item.goodsNm+'</div>';
					html += '                                <p class="itemPrice">'+item.currPrice.addComma();
					if (item.currPrice != item.listPrice) {
						html+='                                    <span class="itemPrice_original">'+item.listPrice.addComma()+'</span>';
						html+='                                    <span class=" itemPercent">'+Math.floor(item.dcRate)+'%</span>';
					}
					html += '                                </p>';
					if(item.goodsTnm != null){
						html += '                        <div class="itemComment">'+item.goodsTnm+'</div>';
					}
					html += '                            </a>';
					html += '                        </div>';
					html += '                    </div>';
					html += '                </div>           ';
				}
			});
			html += '            </div>';
			html += '        </div>';
			html += '        <div class="swiper-button-prev"></div>';
			html += '        <div class="swiper-button-next"></div>';
			html += '        <div class="swiper-pagination"></div>';
			html += '    </div>       ';
			html += '</div>';
			$("#G082_51" +array[0]).append(html);
		}
		
		if($("#G082_51" +template[i].planContSq).length){
			array.shift();
		}
	}
}

if(goods4.length>0){
	var array = [];

	for (var j = 0; j < template.length; j++) {
		if(template[j].tmplType == 'G082_52'){
			array.push(template[j].planContSq);
		}
	}	
	for (var i = 0; i < template.length; i++) {
		var html = '';
		if(template[i].tmplType == 'G082_52' && array[0] == template[i].planContSq && typeof array[0] != 'undefined'){
			html += '<div class="cont_head">';
			html += '<div>';
			html += '        <h4>';
			if (template[i].linkUrl != null && template[i].linkUrl != '') { /* 링크 변경 예정 */
				html+='            <a href="http://'+template[i].linkUrl+'" target="_blank">'+template[i].title+' <i class="ico_arrow"></i></a>';
			}else{
				html+='            <a href="javascript:void(0)">'+template[i].title+'</a>';
			}
			html += '        </h4>';
			html += '    </div>';
			html += '</div>';
			html += '<div class="cont_body">';
			html += '    <!-- 상품 노출 4열 type3 -->';
			html += '    <div class="dp_listItems_cont type3">';
			html += '        <div class="swiper-container">';
			html += '            <div class="swiper-wrapper">';
			$.each(goods4, function(idx, item) {
				if (item.planContSq == template[i].planContSq) {
					html += '                <div class="swiper-slide">';
					html += '                    <div class="item_prod">';
					html += '                        <div class="item_state">';
					html += '                            <a onclick="cfnGoToGoodsDetail(\'' + item.goodsCd + '\')" class="itemLink">';
					html += '                                <div class="itemPic">';
					html += '                                    <img alt="BLUE-a" class=" vLHTC pd_img" src="'+ goodsView +'/'+item.sysImgNm +'">';
					html += '                                </div>';
					html += '                                <p class="itemBrand">'+item.brandGroupNm+'</p>';
					html += '                                <div class="itemName">'+item.goodsNm+'</div>';
					html += '                                <p class="itemPrice">'+item.currPrice.addComma();
					if (item.currPrice != item.listPrice) {
						html+='                                    <span class="itemPrice_original">'+item.listPrice.addComma()+'</span>';
						html+='                                    <span class=" itemPercent">'+Math.floor(item.dcRate)+'%</span>';
					}
					html += '                                </p>';
					if(item.goodsTnm != null){
						html += '                        <div class="itemComment">'+item.goodsTnm+'</div>';
					}
					html += '                            </a>';
					html += '                        </div>';
					html += '                    </div>';
					html += '                </div>';
				}
			});
			html += '            </div>';
			html += '        </div>';
			html += '        <div class="swiper-button-prev"></div>';
			html += '        <div class="swiper-button-next"></div>';
			html += '        <div class="swiper-pagination"></div>';
			html += '    </div>       ';
			html += '</div>';
			$("#G082_52" +array[0]).append(html);
			
		}
		if($("#G082_52" +template[i].planContSq).length){
			array.shift();
		}
	}
}

if(coupon.length>0){
	var html = '';
	 
	html += '<div class="cont_head">';
	html += '	<div>';
	html += '		<h4>'+coupon[0].title+'</h4>';
	html += '	</div>';
	html += '</div>';
	html += '<div class="cont_body">';
	html += '	<div class="coupon_list">';
	html += '		<ul>';
	$.each(coupon, function(idx, item) {
		html += '			<li>';
		html += '				<div class="coupon">';
		html += '					<div>';
		html += '						<p class="cp_name">'+item.cpnNm+'</p>';
		html += '						<p class="cp_cont">';
		if (item.dcWay == '할인율') {
			html += '							<span> <span><em>'+item.dcPval+'%</em></span>';
		}else{
			html += '							<span><em>'+item.dcPval.addComma()+'</em>원</span>'; 
		}
		html += '						</p>';
		html += '						<p class="cp_condition">'+item.buyLimitAmt.addComma()+'원 이상 구매 시 최대 ' +item.maxDcAmt.addComma()+'원 할인';

		if (item.custPubLimitQty != 0) {
			html += '								<span>1인 최대 '+item.custPubLimitQty+'장</span>';	
		}
		html += '						</p>';
		html += '					</div>';
		if(typeof item.couponStat != 'undefined'){
			if (item.couponStat == '쿠폰받기') {
				html += '					<button type="button" id="coupon_" class="btn btn_dark btn_block btn_coupon_down" onclick="fnPlanCouponDown('+item.cpnId+')">';  /* btn_coupon_done */
				html += '						<span>쿠폰받기</span>';								/* 받기완료  */
				html += '					</button>';			
			}else{
				html += '					<button type="button"';
				html += '						class="btn btn_dark btn_block btn_coupon_done" disabled>';  
				html += '						<span>받기완료</span>';								
				html += '					</button>';			
			}
		}else{
			html += '					<button type="button" id="coupon_" class="btn btn_dark btn_block btn_coupon_down" onclick="fnPlanCouponDown('+item.cpnId+')">';  /* btn_coupon_done */
			html += '						<span>쿠폰받기</span>';								/* 받기완료  */
			html += '					</button>';		
		}
		
		html += '				</div>';
		html += '				<button type="button" class="btn_underline"	id="btn_couponInfo_pop" onclick="useInfoCoupon('+item.cpnId+')">';
		html += '					<span>사용안내</span>';
		html += '				</button>';
		html += '			</li>';
	});
	html += '		</ul>';
	html += '	</div>';
	html += '	<div class="announce_txt">';
	html += '		<div class="note_txt">';
	html += '			<img src="/images/pc/ico_content_find.png" alt="유의사항">';
	html += '			<p>유의사항</p>';
	html += '		</div>';
	html += '		<div class="announce_list">';
	html += coupon[0].note;
/* 	html += '			<ul>';
	html += '				<li>쿠폰 발급 기간 :'+ plan.dispStdt +'~'+ plan.dispEddt +'</li>';
	html += '				<li>본 쿠폰은 해당 기획전 상품에만 적용 가능합니다.</li>';
	html += '				<li>본 쿠폰은 해당 기획전 다운로드 버튼을 통해 발급받으실 수 있습니다.</li>';
	html += '			</ul>'; */
	html += '		</div>';
	html += '	</div>';
	html += '</div>';
	html += '</div>';
		
	$("#G082_20").append(html);
}

//사용안내 모달
var useInfoCoupon = function (id) {
	 $.ajax( {
		type		: "GET",
		url 		: '/planning/coupon/detail?cpnId='+ id,
		dataType 	: 'html',
		success 	: function(result) {
			if (result != null) {
				$("#couponInfoPop").html(result);
				$("#couponInfoPop").modal("show");
			}
		}
	});
	
	return false; 
}
//쿠폰 다운로드
var fnPlanCouponDown = function(obj){

	if (!cfCheckLogin()) {
		cfnGoToPage(_PAGE_LOGIN);
		return false;
	}
	
	let cpnId = obj;
	gagajf.ajaxJsonSubmit(_PAGE_PLANNING_CPN_DOWNLOAD, JSON.stringify({cpnId: cpnId}), fnPlanCouponCallBack);
}

// 쿠폰다운로드 콜백
var fnPlanCouponCallBack = function(result){
	
	// 화면 전환 필요		
}

// 설문조사


$(document).ready( function() {

	//공유 버튼 토글 
	$("button[data-name=openShare]").on("click", function(){
		$(this).toggleClass("on").next(".shareWrap").toggleClass("on");
		return false;
	});
	//영역밖 클릭으로 공유토글 닫기
	$("body").on('click', function(e) { 
		if(!$(".shareWrap.on").parent().has(e.target).length) {
			$("button[data-name=openShare]").removeClass("on");
			$(".shareWrap").removeClass("on");
		};
	});
	
	$('.btn_copy').bind('click', function() {
		copyToClipboard();
	});

	//팝업 - 쿠폰사용안내
	$(document).on('click','#btn_couponInfo_pop',function(e){
		$("#couponInfoPop .modal-content").load("popup_couponInfo.html");
		$("#couponInfoPop").modal("show");
		return false;
	});      
	$("#couponInfoPop_close").click(function() {
		$.modal.close();
	});					

    //팝업 - 상품 베스트 리뷰 (detail)
    $(document).on('click','#btn_pdBestReview_pop, .area_rv_best .best_review a',function(e){
        $("#pdBestReviewPop .modal-content").load("pd_bestreviewdetail_pop.html");
        $("#pdBestReviewPop").modal("show");
        return false;
    });      
    $("#pdBestReviewPop_close").click(function() {
        $.modal.close();
    });            

    /* SLIDE - 상단 프로모션 배너 */
	var promotion_visual_slide = new Swiper ('.dp_detail_visual .promotion_visual.type2 .swiper-container', {
		loop: true,
		slidesPerView: 1,
		speed : 1500,
		navigation: {
			nextEl: '.promotion_visual.type2 .swiper-button-next',
			prevEl: '.promotion_visual.type2 .swiper-button-prev',
		},
        pagination: {
			el: '.promotion_visual.type2 .swiper-pagination',
			clickable: true,
		},
	}); 

    /* SLIDE - 중간 배너 */
	var mid_banner_slide = new Swiper ('.dp_mid_banner .mid_banner .swiper-container', {
		loop: true,
		slidesPerView: 1,
		speed : 1500,
		navigation: {
			nextEl: '.mid_banner .swiper-button-next',
			prevEl: '.mid_banner .swiper-button-prev',
		},
        pagination: {
			el: '.mid_banner .swiper-pagination',
			clickable: true,
		},
	});

    /* SLIDE - 대표상품 슬라이드 2열 상품 */
    var dp_listItems_slide1 = new Swiper ('.dp_listItems_cont.type2 .swiper-container', {
        loop: false,
        slidesPerView: 2,
        slidesPerGroup: 2,
        spaceBetween: 20,
        speed : 800,
        navigation: {
            nextEl: '.dp_listItems_cont.type2 .swiper-button-next',
            prevEl: '.dp_listItems_cont.type2 .swiper-button-prev',
        },
        pagination: {
            el: '.dp_listItems_cont.type2 .swiper-pagination',
            clickable: true,
        },
    });

    /* SLIDE - 대표상품 슬라이드 4열 상품 */
    var dp_listItems_slide2 = new Swiper ('.dp_listItems_cont.type3 .swiper-container', {
        loop: false,
        slidesPerView: 4,
        slidesPerGroup: 4,
        spaceBetween: 20,
        speed : 800,
        navigation: {
            nextEl: '.dp_listItems_cont.type3 .swiper-button-next',
            prevEl: '.dp_listItems_cont.type3 .swiper-button-prev',
        },
        pagination: {
            el: '.dp_listItems_cont.type3 .swiper-pagination',
            clickable: true,
        },
    });

    /* SLIDE - 다른 기획전 보기 */
    var other_dp_slide_slide = new Swiper ('.other_dp_slide .swiper-container', {
		slidesPerView: 5,
        spaceBetween: 20,
		navigation: {
			nextEl: '.other_dp_slide .swiper-button-next',
			prevEl: '.other_dp_slide .swiper-button-prev',
		},
	});            

});
</script>
</th:block>

</body>
</html>