<!DOCTYPE html>
<html lang="ko" xmlns:th="http://www.thymeleaf.org">
<!--
 *******************************************************************************
 * @source  : OrderFreegiftInfoMob.html
 * @desc    : 주문 사은품 Page
 *============================================================================
 * STYLE24
 * Copyright(C) 2020 TSIT, All rights reserved.
 *============================================================================
 * VER  DATE         AUTHOR      DESCRIPTION
 * ===  ===========  ==========  =============================================
 * 1.0  2021.04.05   jsh77b     최초 작성
 *******************************************************************************
 -->

<th:block th:if="${freegiftList != null && #lists.size(freegiftList) > 0}">
<div class="foldGroup">
	<ul>
		<li class="fold_selgift">
			<div class="fold_head">
				<a href="javascript:void(0)">
					<div>
						<div class="fold_tit"><span>사은품</span>
						</div>
						<div class="data fixed">
							<span>사은품 총 <em class="total_gift">0</em>개 선택</span> 
							<span><em class="total_deduct">0</em> P차감</span>
						</div>
					</div>
				</a>
			</div>

			<div class="fold_cont">
				<div class="area_selgift">
					<th:block th:each="freegift, i : ${freegiftList}">
						<div class="gift_box necessary_gift_box">
							<p class="txt">
								<!-- 필수사은품 -->
								<th:block th:if="${freegift.allYn} == 'Y'">
									<span th:text="'사은품필수' + ${i.count}"></span>
								</th:block>
								<!-- //필수사은품 -->
								<!-- 선택사은품 -->
								<th:block th:if="${freegift.allYn} == 'N'">
									<span th:text="'사은품선택' + ${i.count}"></span>
								</th:block>
								<!-- //선택사은품 -->
								<th:block th:text="${freegift.freegiftNm}"></th:block>
							</p>
							<div class="form_field">
								<!-- 전체지급 사음품(필수) -->
								<th:block th:if="${freegift.allYn} == 'Y'">
									<th:block th:each="freegiftGoods, k : ${freegiftGoodsList}" th:with="imageUrl=${@environment.getProperty('upload.default.view')}">
										<th:block th:if="${freegift.freegiftSq} == ${freegiftGoods.freegiftSq}">
											<div class="gift">
												<input type="checkbox" th:name="'rdi-gift'+${i.count}" th:id="'rdi-gift'+${i.count}+${k.count}" class="chk_img freegiftRdo" th:value="${freegiftGoods.freegiftValSq}" usepoint="0" allYn="Y" checked onclick="return(false);">
												<label for="rdi-gift11"> 
													<span class="thumb"><img th:src="${imageUrl + '/' + freegiftGoods.sysImgNm}" width="" alt=""></span>
													<span class="name" th:text="${freegiftGoods.goodsNm}"></span> 
													<span class="deduct">무료</span>
												</label>
											</div>
										</th:block>
									</th:block>
								</th:block>
								<!-- //전체지급 사음품(필수) -->
								
								<!-- 선택지급 사음품(선택) -->
								<th:block th:if="${freegift.allYn} == 'N'">
									<th:block th:each="freegiftGoods, k : ${freegiftGoodsList}">
										<th:block th:if="${freegift.freegiftSq} == ${freegiftGoods.freegiftSq}">
											<div class="gift">
												<input type="radio" th:name="'rdi-gift'+${i.count}" th:id="'rdi-gift'+${i.count}+${k.count}" class="chk_img freegiftRdo" th:value="${freegiftGoods.freegiftValSq}" th:usepoint="${freegiftGoods.usePoint}" allYn="N" th:count="${i.count}">
												<label th:for="'rdi-gift'+${i.count}+${k.count}">
													<span class="thumb"><img th:src="${@environment.getProperty('domain.uximage')} + '/images/pc/thumb/tmp_gift1.jpg'" width="" alt=""></span>
													<span class="name" th:text="${freegiftGoods.goodsNm}"></span> 
													<span th:if="${freegiftGoods.usePoint} < 1" class="deduct" th:text="무료"></span>
													<span th:if="${freegiftGoods.usePoint} > 0" class="deduct" th:text="|${#numbers.formatInteger(freegiftGoods.usePoint, 1, 'COMMA')} P|"></span>
												</label>
											</div>
										</th:block>
									</th:block>
									<div class="gift">
										<input type="radio" th:name="'rdi-gift'+${i.count}" th:id="${i.count}+'0'" class="chk_img freegiftRdo" value="noSel" usepoint="0" allYn="N" count="100"> 
										<label th:for="${i.count}+'0'">
											<span class="thumb"><img th:src="${@environment.getProperty('domain.uximage')} + '/images/pc/thumb/tmp_gift_empty.jpg'" width="" alt=""></span>
											<span class="name">사은품 수령안함</span> <span class="deduct">수령거부</span>
										</label>
									</div>
								</th:block>
								<!-- //선택지급 사음품(선택) -->
							</div>
						</div>
					</th:block>

					<div class="form_field">
						<div class="agree_gift">
							<p>
								<input id="chk-agree_gift" type="checkbox">
								<label for="chk-agree_gift"><span>동의합니다</span></label>
							</p>
							<p class="txt">사은품 지급에 대한 내용을 확인하였으며, 이에 동의합니다.</p>
							<button type="button" class="btn_link_popup" id="btn_infoGift_btn">
								<span>보기</span>
							</button>
						</div>
						<!-- 210405_p태그 수정 -->
						<div class="agree_gift_con">
							<p>스타일포인트 차감 사은품을 선택하신 경우, 결제 시 고객님의 누적 포인트에서 차감됩니다.</p>
							<p>보유한 포인트의 금액을 넘어선 사은품은 신청이 불가합니다.</p>
							<p>사은품 신청 시 해외배송은 불가합니다. (적립포인트 사은품 및 온라인 사은품 제외)</p>
						</div>
						<!-- //210405_p태그 수정 -->
					</div>
				</div>
			</div>
		</li>
	</ul>
</div>

<script th:inline="javascript">
//할인관련정보 변수선언
var freegiftApplyAmtList	= [[${freegiftApplyAmtList}]];		// 사은품장바구니목록
var freegiftList			= [[${freegiftList}]];				// 사은품 프로모션 목록
var freegiftGoodsList		= [[${freegiftGoodsList}]];			// 사은품 프로모션 상품 목록
var dispYn 					= [[${order.dispYn}]]; 				// 노출여부

var freegiftInfoDispYn = function(temp) {
	if (temp == "Y") {
		$("#freegiftInfo .fold_head").addClass("on");
		$("#freegiftInfo .fold_cont").show();
	} else {
		$("#freegiftInfo .fold_head").removeClass("on");
		$("#freegiftInfo .fold_cont").hide();
	}
}

//컨텐츠 호출
$(document).ready( function() {
	// 사은품 화면 노출여부 체크
	if (freegiftList.length == null || freegiftList.length < 1) {
		$("#freegiftInfo").css("display", "none");
	} else {
		$("#freegiftInfo").css("display", "block");
	}
	
	//사은품노출여부
	freegiftInfoDispYn("Y");
	
	// 사은품시퀀스배열, 
	var freegiftSqArr 		= [];
	var freegiftGoodsArr 	= [];
	
	// 사은품 장바구니 상품 뿌리기
	for (i=0 ; i<freegiftApplyAmtList.length ; i++) {
		var obj = freegiftApplyAmtList[i];
		freegiftSqArr.push(obj.freegiftSq);
		freegiftGoodsArr.push(obj.goodsCd);
	}
	
	$(".freegiftSqArr").text(freegiftSqArr);
	$(".freegiftGoodsArr").text(freegiftGoodsArr);
});

$(document).on('click','#btn_infoGift_btn',function(e){
    $('.area_selgift .agree_gift_con').toggle();
	var privacyToggle = $('#btn_infoGift_btn').find('span');
    $(privacyToggle).text($(privacyToggle).text() == '보기' ? '닫기' : '보기');
    return false;
});
</script>
</th:block>
</html>











