<!DOCTYPE html>
<html lang="ko"
	xmlns:th="http://www.thymeleaf.org">
<!--
 *******************************************************************************
 * @source  : PlanCornerCopyForm.html
 * @desc    : 기획전 코너 복사 화면 Page
 *============================================================================
 * SISUN
 * Copyright(C) 2020 TSIT, All rights reserved.
 *============================================================================
 * VER  DATE         AUTHOR      DESCRIPTION
 * ===  ===========  ==========  =============================================
 * 1.0  2021.02.18   sowon   최초 작성
 *******************************************************************************
 -->
<div class="modalPopup" data-width="1200" data-height="800"	id="popupCornerCopy">
	<div class="panelStyle" style="height: 750px;">
		<div class="panelTitle">
			<strong>기획전 복사</strong>
			<button type="button" class="close"	onclick="uifnPopupClose('popupCornerCopy')">
				<i class="fa fa-times"></i>
			</button>
		</div>


		<div class="panelContent">
			<input type="hidden" name="planSq" id="OrdPlanSq" th:value="${planSq}" />
			<form id="planCornerCopyForm" name="planCornerCopyForm" action="#" th:action="@{'/marketing/planning/corner/list'}" th:method="post">
				<input type="hidden" name="copyMode" id="copyMode" th:value="${copyMode}" />
				<table class="frmStyle">
					<colgroup>
						<col style="width: 10%" />
						<col style="width: 40%;" />
						<col />
					</colgroup>
					<tr>
						<th >기획전명</th>
						<td>
							<select name="planSq" id="planSq">
								<option value="">선택</option>
								<option th:if="${planList}"	th:each="oneData, status : ${planList}"	th:value="${oneData.planSq}" th:text="|[${oneData.planSq}]  ${oneData.planNm}|"></option>
							</select>
						</td>
					</tr>
				</table>

				<ul class="panelBar">
					<li class="right" style="margin-right: -19px; margin-top: 10px;">
						<span class="btnRight">
							<button type="button" class="btn btn-default btn-lg" onclick="fnPlanCornerCopy();">복사</button>
						</span>
					</li>
				</ul>

				<ul class="boxContent">
					<li>
						<div id="gridListCornerCopy" style="width: 100%; height: 200px;" class="ag-theme-balham"></div>
					</li>
				</ul>
			</form>
		</div>

		<div class="panelContent">
			<div>
				<h4>
					코너명 : <label id="cornerNmCopy"></label>
				</h4>
			</div>
			<div id="gridListGoodsCopy" style="width: 100%; height: 300px;"	class="ag-theme-balham"></div>
		</div>

	</div>
</div>

<script th:inline="javascript">
/*<![CDATA[*/

	var copyMode = [[${copyMode}]]
	var cornerList = [[${cornerList}]];
	var cornerDispTypeCopyList =  gagajf.convertToArray([[${cornerDispTypeCopyList}]]);
	var planDtlStatCopyList =  gagajf.convertToArray([[${planDtlStatCopyList}]]);

	var columnDefsCorner = [
		{width: 40, minWidth: 40, cellClass: 'text-center', headerCheckboxSelection: true, checkboxSelection: true, filter: false},
		{headerName: "코너번호"		, field:'planDtlSq'			, width:120, cellClass: 'text-left', editable: false },
		{headerName: "코너명"			, field:'cornerNm'			, width:350, cellClass: 'text-left',
			cellRenderer: function(params) {return '<a href="javascript:void(0);">' + params.value + '</a>'; },
			cellEditor: 'textCellEditor',
			cellEditorParams: { maxlength: 50, required: true }
		},
		{headerName: "코너유형"		, field:'cornerDispType'		, width:130, cellClass: 'text-left',
			cellEditor: 'agRichSelectCellEditor',
			cellEditorParams: { values: gagaAgGrid.extractValues(cornerDispTypeCopyList) , maxlength: 50, required: true },
			valueFormatter: function (params) { return gagaAgGrid.lookupValue(cornerDispTypeCopyList, params.value); },
			valueParser: function (params) { return gagaAgGrid.lookupKey(cornerDispTypeCopyList, params.newValue); }
		},
		{headerName: "전시순서"		, field:'dispOrd'				, width:100, cellClass: 'text-right',
			cellEditor: 'textCellEditor',
			cellEditorParams: { maxlength: 3, required: true }
		},
		{headerName: "상태"			, field:'planDtlStat'			, width:100, cellClass: 'text-left',
			cellEditor: 'agRichSelectCellEditor',
			cellEditorParams: { values: gagaAgGrid.extractValues(planDtlStatCopyList) , maxlength: 50, required: true },
			valueFormatter: function (params) { return gagaAgGrid.lookupValue(planDtlStatCopyList, params.value); },
			valueParser: function (params) { return gagaAgGrid.lookupKey(planDtlStatCopyList, params.newValue); }
		},
		{headerName: "기획전 일련번호"	, field:'planSq'	, width:90, cellClass: 'text-left', hide: true},
		{headerName: "시작일"			, field:'startSearchDate'	, width:110, cellClass: 'text-left',
			cellEditor: 'textCellEditor',
			cellEditorParams: { maxlength: 10, required: true }
		},
		{headerName: "시작시간"		, field:'startSearchTime'	, width:110, cellClass: 'text-center',
			cellEditor: 'textCellEditor',
			cellEditorParams: { maxlength: 6, required: true }
		},
		{headerName: "종료일"			, field:'endSearchDate'		, width:110, cellClass: 'text-left',
			cellEditor: 'textCellEditor',
			cellEditorParams: { maxlength: 10, required: true }
		},
		{headerName: "종료시간"		, field:'endSearchTime'		, width:110, cellClass: 'text-center',
			cellEditor: 'textCellEditor',
			cellEditorParams: { maxlength: 6, required: true }
		},
		{headerName: "등록자"			, field:'regId'				, width:120, cellClass: 'text-center'},
		{headerName: "수정자"			, field:'updId'				, width:120, cellClass: 'text-center'}
	];

	var gridOptionsCornerCopy = gagaAgGrid.getGridOptions(columnDefsCorner);
	gridOptionsCornerCopy.defaultColDef.editable = true;
	gridOptionsCornerCopy.rowSelection = 'multiple';

	

	// 기획전명 변경 시
	$('#planCornerCopyForm select[name=planSq]').on('change', function() {
		fnCornerSearchCopy();
	});

	// 코너 셀 클릭 이벤트
	gridOptionsCornerCopy.onCellClicked = function(event) {
		var field = event.colDef.field;
		if (field != 'cornerNm') return;

		fnCornerGoodsSearchCopy(event.data);
	}

	// 코너 상품 조회
	var fnCornerGoodsSearchCopy = function(data) {
		if (!gagajf.isNull(data.cornerNm)) {

			var data = {planDtlSq : data.planDtlSq};
			var jsonData = JSON.stringify(data);
			
			gagajf.ajaxJsonSubmit('/marketing/planning/corner/goods/list', jsonData, function(result) {
				gridOptionsGoodsCopy.api.setRowData(result.planGoodsList);
			})
			$('#cornerNmCopy').html(data.cornerNm);
		}
	}

	// 코너 조회
	var fnCornerSearchCopy = function() {
		var formId = '#planCornerCopyForm';
		gagaAgGrid.fetch($(formId).prop('action'), gridOptionsCornerCopy, formId
						, function() {
								if (gridOptionsCornerCopy.api.getDisplayedRowCount() >= 1) {
									gridOptionsCornerCopy.api.getRowNode(0).setSelected(true);
									fnCornerGoodsSearchCopy(gridOptionsCornerCopy.api.getRowNode(0).data);
								} else {
									$('#gridListGoodsCopy').html('');
									$('#cornerNmCopy').html('');
									gagaAgGrid.createGrid('gridListGoodsCopy', gridOptionsGoodsCopy);
								}
				});
	}

	// 코너 복사
	var fnPlanCornerCopy = function() {
		var selectData = gagaAgGrid.selectedRowData(gridOptionsCornerCopy);

		if (selectData.length < 1) {
			mcxDialog.alert('선택 된 코너가 없습니다.');
			return;
		}

		$(selectData).each(function(idx, data) {
			console.log(copyMode);
			if (copyMode == 'CORNER') {
				data.planSq = $('#OrdPlanSq').val(); // 코너 복사 시 선택 된 기획전 번호
				console.log(data.planSq);
			} else {
				data.copyPlanSq = $('#planCornerCopyForm select[name=planSq]').val(); // 기획전 복사 시 복사 될 기획전 번호
			}
			data.copyPlanDtlSq = data.planDtlSq;
			data.copyMode = $('#copyMode').val();
		});

		mcxDialog.confirm('선택된 코너를 복사하시겠습니까?',{
			cancelBtnText: "취소",
			sureBtnText: "확인",
			sureBtnClick: function() {
				var jsonData = JSON.stringify(selectData);

				gagajf.ajaxJsonSubmit('/marketing/planning/corner/copy', jsonData, function() {
					if (copyMode == 'CORNER') {
						fnCornerSearch();
					} else {
						fnSearch();						
						uifnPopupClose('popupEventDetail');
					}
					uifnPopupClose('popupCornerCopy')
				});
			}
		});
	}

	var columnDefsGoodsCopy = [
		{headerName: "상품코드"	, field:'goodsCd'		, width:150, cellClass: 'text-left'},
		{headerName: "상품명"		, field:'goodsNm'		, width:350, cellClass: 'text-left'},
		/* {headerName: "전시순서"	, field:'dispOrd'		, width:80 , cellClass: 'text-right'}, */
		{headerName: "가용재고"	, field:'stockQtySum'	, width:80 , cellClass: 'text-right',
			cellRenderer: function(params) {return !gagajf.isNull(params.value) ? params.value : '0'; }
		},
		{headerName: "할인율"		, field:'dcRate'		, width:80 , cellClass: 'text-right'},
		{headerName: "정상가"		, field:'listPrice'		, width:100, cellClass: 'text-right'
			, valueFormatter: function(params) { return params.value.addComma(); }
		},
		{headerName: "판매가"		, field:'currPrice'		, width:100, cellClass: 'text-right'
			, valueFormatter: function(params) { return params.value.addComma(); }
		},
		{headerName: "업체"		, field:'supplyCompNm'	, width:150, cellClass: 'text-left'},
		{headerName: "기획전상세"	, field:'planDtlSq'		, width:150, cellClass: 'text-left', hide: true},
		{headerName: "등록일"		, field:'regDt'			, width:100,  cellClass: 'text-left',
			cellRenderer: function(params) { return !gagajf.isNull(params.value) ? params.value.toDate("YYYY-MM-DD HH:MM:SS").format("YYYY-MM-DD") : ''; }
		},
		{headerName: "정상/이월여부", field:'formalGb'		, width:150, cellClass: 'text-left'}
	];

	var gridOptionsGoodsCopy = gagaAgGrid.getGridOptions(columnDefsGoodsCopy);
	
	$(document).ready(function() {
		gagaAgGrid.createGrid('gridListCornerCopy', gridOptionsCornerCopy);
		gagaAgGrid.createGrid('gridListGoodsCopy', gridOptionsGoodsCopy);
	});

/*]]>*/
</script>
</html>