<!DOCTYPE html>
<html lang="ko"
	xmlns:th="http://www.thymeleaf.org">
<!--
 *******************************************************************************
 * @source  : GoodsSetForm.html
 * @desc    : 세트상품 구성 관리
 *============================================================================
 * SISUN
 * Copyright(C) 2019 TSIT, All rights reserved.
 *============================================================================
 * VER  DATE         AUTHOR      DESCRIPTION
 * ===  ===========  ==========  =============================================
 * 1.0  2020.11.04   eskim       최초 작성
 *******************************************************************************
 -->	
	<div class="modalPopup frGoodsPro" data-width="1100">
		<div class="panelStyle" style="max-height:900px;overflow-y:scroll;">
			<div class="panelTitle">
				<h2>사은품 프로모션 관리</h2>
				<button type="button" class="close" onclick="fnFreeGoodsPromotionFormClose()"><i class="fa fa-times"></i></button>
			</div>

			<form id="freeGoodsPromotionForm" name="freeGoodsPromotionForm" th:method="post" >
				<input type="hidden" name="gbn" th:value="${param.gbn}" />
				<div class="panelContent">
					<ul class="notice">
						<li>구성상품 등록시 기본값&nbsp;
							<!-- 아이콘 툴팁 -->
							<div class="iconTooltip">
								<i class="fa fa-info" aria-hidden="true"></i>
								<span class="left" style="width:400px; text-align:left;">
									<!-- class="left" 또는 class="right" -->
									- 상품상태 : 정보부족<br/>
									- 정상가 : 구성상품의 정상가 합<br/>
									- 판매가 : 구성상품 판매가 입력값의 합<br/>
									- 브랜드코드 : 구성상품의 기준여부 'Y'상품의 브랜드코드<br/>
									- 품목코드 : 구성상품의 기준여부 'Y'상품의 품목코드<br/>
									- 포인트 : 구성상품의 기준여부 'Y'상품의 브랜드 포인트<br/>
									- 배송비정책 : 구성상품의 기준여부 'Y'상품의 브랜드 배송비정책<br/>
								</span>
							</div>
							<!-- //아이콘 툴팁 -->
						</li>
					</ul>
					<table class="frmStyle">
						<colgroup>
							<col width="10%"/>
							<col width="50%"/>
							<col width="10%"/>
							<col width="40%"/>
						</colgroup>
						<tr>
							<th>프로모션명<em class="required" title="필수"></em></th>
							<td>
								<!-- 수정시 프로모션명 입력 : before -->
								<input class="w50p" type="text" id="freegiftNm" name="freegiftNm" maxlength="30"/>
							</td>
							<th>프로모션ID</th>
							<td>
								<!-- 프로모션 ID 입력 : before -->
								<span />
							</td>
						</tr>
						<tr>
							<th>행사 기간<em class="required" title="필수"></em></th>
							<td>
								<input type="text" class="schDate w100" id="freegiftStdt" name="freegiftStdt" maxlength="10" required="required" data-valid-name="시작일자"/>
								~
								<input type="text" class="schDate w100" id="freegiftEddt" name="freegiftEddt" maxlength="10" required="required" data-valid-name="종료일자"/>
							</td>
							<!-- <td id="promotionTerms">수정시 행사기간 입력되도록 수정(JAVASCRIPT?) : before</td> -->
							<th>상태</th>
							<td>
								<!-- 상태 입력 : before -->
								<span />
							</td>
						</tr>
						<tr>
							<th>적용 몰 구분<em class="required" title="필수"></em></th>
							<td colspan="3">
								<!-- 적용 몰 구분 입력(공통 가져와야할듯?) : before -->
								<input type="checkbox" id="jasa"/><label for="jasa">자사몰</label>
							</td>
						</tr>
					</table>
				</div>

				<div class="panelStyle" style="margin:unset;">
					<!-- TITLE -->
					<div class="panelTitle">
						<h2>적용 대상 상품 등록</h2>
						<span class="panelControl">
							<i class="fa inner-fa-chevron-up"></i>    <!-- 열림/닫힘 화살표 -->
						</span>
					</div>
					<!-- //TITLE -->
					<div class="inner-panelContent">
						<div><i class="fa fa-info-circle"></i> 브랜드/공급업체/상품 중 1가지는 필수로 지정하셔야 합니다.</div>
						<div><i class="fa fa-info-circle"></i> 브랜드와 공급업체는 지정 시, 해당 브랜드의 공급처와 같은 AND조건으로 적용됩니다.(예시:A브랜드 상품 중 B업체 상품만)</div>
						<div><i class="fa fa-info-circle"></i> 공급업체와 브랜드를 적용하시더라도 적용상품은 별개로 등록된 상품을 기준으로 사은품 지급기준으로 적용하실 수 있습니다.</div>

						<div class="panelContent">
							<table class="frmStyle">
								<colgroup>
									<col width="10%"/>
									<col width="90%"/>
								</colgroup>
								<tr>
									<th>공급업체/브랜드</th>
									<td>
										<!-- 수정시 프로모션명 입력 : before -->
										<div class="padding10 wid45">
											<span>공급업체 설정</span>
											<div class="padding10 inner-tb-solid">
												<button type="button" class="btn btnRight btn-success btn-lg" id="btnAddCompany">업체 추가</button>
												<button type="button" class="btn btnRight btn-success btn-lg" id="btnDeleteCompany">선택삭제</button>
												<span>선택 : 00개</span>
												<br/>
												<div id="gridCompanyList" style="width:100%; height:300px;" class="ag-theme-balgam lh60"></div>
												<table class="frmStyle aC">
													<thead>
														<tr>
															<th style="width:5%;"><label class="chkBox"><input type="checkbox" id="companyAll"/></label></th>
															<th style="width:30%;">공급처ID</th>
															<th style="width:55%;">공급업체명</th>
														</tr>
													</thead>
													<tbody>
														<tr>
															<td><label class="chkBox"><input type="checkbox" class="brand_idx" value="company_idx"/></label></td>
															<td>1211</td>
															<td>업체이름</td>
														</tr>
													</tbody>
												</table>
											</div>
										</div>
										<div class="padding10 wid45">
											<span>브랜드 설정</span>
											<div class="padding10 inner-tb-solid">
												<button type="button" class="btn btnRight btn-success btn-lg" id="btnAddBrand">브랜드 추가</button>
												<button type="button" class="btn btnRight btn-success btn-lg" id="btnDeleteBrand">선택삭제</button>
												<span>선택 : 00개</span>
												<br/>
												<table class="frmStyle aC">
													<thead>
														<tr>
															<th style="width:5%;"><label class="chkBox"><input type="checkbox" id="brandAll"/></label></th>
															<th style="width:30%;">브랜드ID</th>
															<th style="width:55%;">브랜드명</th>
														</tr>
													</thead>
													<tbody>
														<tr>
															<td><label class="chkBox"><input type="checkbox" class="brand_idx" value="brand_idx"/></label></td>
															<td>1211</td>
															<td>브랜드이름</td>
														</tr>
													</tbody>
												</table>
											</div>
										</div>
									</td>
								</tr>
								<tr>
									<th>적용상품</th>
									<td>
										<div class="padding10">
											<button type="button" class="btn btnRight btn-success btn-lg" id="btnAddGoods">상품 추가</button>
											<button type="button" class="btn btnRight btn-success btn-lg" id="btnDeleteGoods">선택삭제</button>
											<span>선택 : 00개</span>
											<br/>
											<div class="padding10 inner-tb-solid">
												<table class="frmStyle aC">
													<thead>
														<tr>
															<th style="width:5%;"><label class="chkBox"><input type="checkbox" id="goodsAll"/></label></th>
															<th style="width:15%;">Product ID</th>
															<th style="width:15%;">브랜드명</th>
															<th style="width:35%;">상품명</th>
															<th style="width:10%;">판매상태</th>
															<th class="cRed" style="width:10%;">정상가</th>
															<th class="cRed" style="width:10%;">판매가</th>
														</tr>
													</thead>
													<tbody>
														<tr>
															<td><label class="chkBox"><input type="checkbox" class="brand_idx" value="brand_idx"/></label></td>
															<td>1211</td>
															<td>브랜드이름</td>
															<td>덕다운패딩</td>
															<td>판매중</td>
															<td>202,000</td>
															<td>199,000</td>
														</tr>
													</tbody>
												</table>
											</div>
										</div>
									</td>
								</tr>
							</table>
						</div>
					</div>
				</div>

				<div class="panelStyle" style="margin:unset;">
					<!-- TITLE -->
					<div class="panelTitle">
						<h2>제외 대상 상품</h2>
						<span class="panelControl">
							<i class="fa inner-fa-chevron-up"></i>    <!-- 열림/닫힘 화살표 -->
						</span>
					</div>
					<!-- //TITLE -->
					<div class="inner-panelContent">
						<div class="panelContent">
							<table class="frmStyle">
								<colgroup>
									<col width="10%"/>
									<col width="90%"/>
								</colgroup>
								<tr>
									<th>제외 대상</th>
									<td>
										<div class="padding10">
											<button type="button" class="btn btnRight btn-success btn-lg" id="btnAddExtGoods">상품 추가</button>
											<button type="button" class="btn btnRight btn-success btn-lg" id="btnDeleteExtGoods">선택삭제</button>
											<span>선택 : 00개</span>
											<br/>
											<div class="padding10 inner-tb-solid">
												<table class="frmStyle aC">
													<thead>
														<tr>
															<th style="width:5%;"><label class="chkBox"><input type="checkbox" id="ExtGoodsAll"/></label></th>
															<th style="width:15%;">Product ID</th>
															<th style="width:15%;">브랜드명</th>
															<th style="width:35%;">상품명</th>
															<th style="width:10%;">판매상태</th>
															<th class="cRed" style="width:10%;">정상가</th>
															<th class="cRed" style="width:10%;">판매가</th>
														</tr>
													</thead>
													<tbody>
														<tr>
															<td><label class="chkBox"><input type="checkbox" class="brand_idx" value="brand_idx"/></label></td>
															<td>1211</td>
															<td>브랜드이름</td>
															<td>덕다운패딩</td>
															<td>판매중</td>
															<td>202,000</td>
															<td>199,000</td>
														</tr>
													</tbody>
												</table>
											</div>
										</div>
									</td>
								</tr>
							</table>
						</div>
					</div>
				</div>

				<div class="panelStyle" style="margin:unset;">
					<!-- TITLE -->
					<div class="panelTitle">
						<h2>적용 사은품 정보</h2>
						<span class="panelControl">
						<i class="fa inner-fa-chevron-up"></i>    <!-- 열림/닫힘 화살표 -->
					</span>
					</div>
					<!-- //TITLE -->
					<div class="inner-panelContent">
						<div class="panelContent">
							<table class="frmStyle">
								<colgroup>
									<col width="10%"/>
									<col width="90%"/>
								</colgroup>
								<tr>
									<th>지급 방법<em class="required" title="필수"></em></th>
									<td>
										<div>
											<span><label class="rdoBtn"><input type="radio" name="sendBox"/>모두 지급 (설정한 사은품을 모두 지급합니다)</label></span>
											<span><label class="rdoBtn"><input type="radio" name="sendBox"/>선택 사은품 (목록 중 1개를 선택하게 합니다)</label></span>
										</div>
									</td>
								</tr>
								<tr>
									<th>사은품 조건1<em class="required" title="필수"></em><br/>(최대 2개)</th>
									<td>
										<div>
											<div><i class="fa fa-info-circle"></i> 사은품은 최대 <font color="red">5</font>개까지 설정하실 수 있습니다.</div>
											<div><i class="fa fa-info-circle"></i> 구매 금액 조건을 추가하시면 구매 금액 충족 조건에 맞는 것으로 지급됩니다. 구매금액 조건은 최대 2개까지만등록 하실 수 있습니다.</div>
											<div><i class="fa fa-info-circle"></i> 장바구니에 담았을 때의 가격 기준으로 적용됩니다.(주문상품쿠폰(다운로드쿠폰)/장바구니 쿠폰 할인 적용 전 판매가)</div>
											<label for="saleAmt">구매금액</label><input type="text" class="w300" id="saleAmt" /> <br/>
											<span>사은품 목록</span>
											<button type="button" class="btn btnRight btn-success btn-lg" id="btnAddFreeGoods1">+ 사은품 선택</button>
											<button type="button" class="btn btnRight btn-success btn-lg" id="btnDeleteFreeGoods1">선택삭제</button>
											<input type="button" value="+ 사은품 선택" id="goodsList" /> <!-- 선택 시 팝업 노출 -->
											<input type="button" value="선택삭제" id="deleteGoodsList" />
											<br/>
											<table class="frmStyle aC">
												<thead>
													<tr>
														<th style="width:5%;"><label class="chkBox"><input type="checkbox" id="freeGoodsAll1"/></label></th>
														<th style="width:15%;">사은품 코드</th>
														<th style="width:40%;">사은품명</th>
														<th style="width:10%;">포인트액</th>
														<th style="width:10%;">지급수량</th>
														<th style="width:10%;">한정수량</th>
														<th style="width:10%;">잔여수량</th>
													</tr>
												</thead>
												<tbody>
													<tr>
														<td><label class="chkBox"><input type="checkbox" class="brand_idx" value="brand_idx"/></label></td>
														<td>1211</td>
														<td>사은품목도리</td>
														<td><input type="text" class="w100" placeholder="0" /></td>
														<td><input type="text" class="w100" placeholder="1" /></td>
														<td><input type="text" class="w100" placeholder="0" /></td>
														<td>88</td>
													</tr>
												</tbody>
											</table>
										</div>
									</td>
								</tr>
								<tr>
									<th>사은품 조건2<em class="required" title="필수"></em><br/>(최대 2개)</th>
									<td>
										<div>
											<label for="saleAmt2">구매금액</label><input type="text" class="w300" id="saleAmt2" /> <br/>
											<span>사은품 목록</span>
											<button type="button" class="btn btnRight btn-success btn-lg" id="btnAddFreeGoods2">+ 사은품 선택</button>
											<button type="button" class="btn btnRight btn-success btn-lg" id="btnDeleteFreeGoods2">선택삭제</button>
											<br/>
											<table class="frmStyle aC">
												<thead>
													<tr>
														<th style="width:5%;"><label class="chkBox"><input type="checkbox" id="freeGoodsAll2"/></label></th>
														<th style="width:15%;">사은품 코드</th>
														<th style="width:40%;">사은품명</th>
														<th style="width:10%;">포인트액</th>
														<th style="width:10%;">지급수량</th>
														<th style="width:10%;">한정수량</th>
														<th style="width:10%;">잔여수량</th>
													</tr>
												</thead>
												<tbody>
													<tr>
														<td><label class="chkBox"><input type="checkbox" class="brand_idx" value="brand_idx"/></label></td>
														<td>1211</td>
														<td>사은품목도리</td>
														<td><input type="text" class="w100" placeholder="0" /></td>
														<td><input type="text" class="w100" placeholder="1" /></td>
														<td><input type="text" class="w100" placeholder="0" /></td>
														<td>88</td>
													</tr>
												</tbody>
											</table>
										</div>
									</td>
								</tr>
							</table>
						</div>
					</div>
				</div>

				<div class="panelStyle" style="margin:unset;">
					<!-- //TITLE -->
					<div class="inner-panelContent">
						<div class="panelContent">
							<table class="frmStyle">
								<colgroup>
									<col width="10%"/>
									<col width="40%"/>
									<col width="10%"/>
									<col width="40%"/>
								</colgroup>
								<tr>
									<th>등록자</th>
									<td>
										<span>등록자이름(연.월.일 시간:분:초)</span>
									</td>
									<th>최종수정자</th>
									<td>
										<span>수정자이름(연.월.일 시간:분:초)</span>
									</td>
								</tr>
							</table>
						</div>
					</div>
				</div>
			</form>

			<ul class="panelBar">
				<li  class="right">
					<!-- <th:block th:if="${sessionInfo.roleCd == 'G001_0000' OR sessionInfo.roleCd == 'G001_A000' OR sessionInfo.roleCd == 'G001_A101' OR sessionInfo.roleCd == 'G001_A100' OR sessionInfo.roleCd == 'G001_A001'}"> -->
						<button type="button" class="btn btnRight btn-success btn-lg" id="btnSearchList">목록</button>
						<button type="button" class="btn btnRight btn-success btn-lg" id="btnFreegoodsPromotionSave">저장</button>
						<button type="button" class="btn btnRight btn-success btn-lg" id="btnChangeStatIng">진행</button>
						<button type="button" class="btn btnRight btn-success btn-lg" id="btnPromotionDelete">삭제</button>
						<button type="button" class="btn btnRight btn-success btn-lg" id="btnPromotionStop">중지</button>
					<!-- </th:block> -->
				</li>
			</ul>
		</div>	
	</div>

	<script th:inline="javascript">
		let columnCompanyList = [
			{width: 40, minWidth: 40, cellClass: 'text-center', headerCheckboxSelection: true, checkboxSelection: true, filter: false},
			{headerName: "공급처ID", field: "supplyCompCd", width: 120, cellClass: 'text-center'},
			{headerName: "공급업체명", field: "supplyCompNm", width: 150, cellClass: 'text-center'}
		];
		let gridOptionsCompanyList = gagaAgGrid.getGridOptions(columnCompanyList);
		gridOptionsCompanyList.rowSelection = "multiple";

		$(document).ready(function() {
			gagaAgGrid.createGrid("gridCompanyList", gridOptionsCompanyList);
			cfnCreateCalendar('#promotionTerms', 'freegoodsStdt', 'freegoodsEddt', true, '행사기간', 'X');
		});

		var fnSetPopupBrandInfo = function(result) {
			// $("#goodsPopupForm input[name=brandCd]").val(result[0].brandCd);

		}

		// 공급업체 설정 업체 추가 버튼 클릭시
		$('#btnAddCompany').on('click', function() {
			cfnOpenCompanyListPopup('fnSetPopupBrandInfo');
		});

		//패널영역 줄이기
		$(document).on("click",".panelControl .inner-fa-chevron-up", function() {
			$(this).parent().parent().parent().find(".inner-panelContent").slideUp(100);
			$(this).attr("class","fa inner-fa-chevron-down");
		});
		//패널영역 펼치기
		$(document).on("click",".panelControl .inner-fa-chevron-down", function() {
			$(this).parent().parent().parent().find(".inner-panelContent").slideDown(100);
			$(this).attr("class","fa inner-fa-chevron-up");
		});

		//창종료
		var fnFreeGoodsPromotionFormClose = function(){
			uifnPopupClose('popupFreeGoodsPromotionRegi');
		}
	</script>
</html>
