<!DOCTYPE html>
<html lang="ko"
	  xmlns:th="http://www.thymeleaf.org">
<!--
 *******************************************************************************
 * @source  : DeliveryListForm.html
 * @desc    : 배송목록 Page
 *============================================================================
 * ISTYLE24
 * Copyright(C) 2020 TSIT, All rights reserved.
 *============================================================================
 * VER  DATE         AUTHOR      DESCRIPTION
 * ===  ===========  ==========  =============================================
 * 1.0  2020.11.10   moon        최초 작성
 *******************************************************************************
 -->
<div id="main">
	<!-- 메인타이틀 영역 -->
	<div class="main-title">
	</div>
	<!-- //메인타이틀 영역 -->
	
	<!-- 메뉴 설명 -->
	<div class="infoBox menu-desc">
	</div>
	<!-- //메뉴 설명 -->
	<!-- 검색조건 영역 -->
	<form id="searchForm" name="searchForm" action="#" th:action="@{'/delivery/list/'}" onsubmit="fnSearchList(); return false;">
	<div class="panelStyle">
		<!-- TITLE -->
		<div class="panelTitle">
			<h3><i class="fa fa-info-circle"></i>아래 검색조건 <font color="red">기간, 키워드</font>중 하나를 꼭 입력해 주세요.</h3>
			<span class="panelControl">
				<i class="fa fa-chevron-up"></i>
			</span>
		</div>
		<!-- //TITLE -->
		<div class="panelContent">	
			
				<table class="frmStyle">
					<colgroup>
						<col style="width:8%;"/>
						<col style="width:12%;"/>
						<col style="width:8%;"/>
						<col style="width:12%;"/>
						<col style="width:8%;"/>
						<col style="width:12%;"/>
						<col style="width:8%;"/>
						<col style="width:12%;"/>

					</colgroup>
					<tr>
						<!-- 
						<th>사이트</th>
						<td>
							<select name="siteCd" id="siteCd">
								<option value="">[전체]</option>
								<option th:if="${siteCdList}" th:each="oneData, status : ${siteCdList}" th:value="${oneData.cd}" th:text="${oneData.cdNm}"></option>
							</select>
						</td>
						-->
						<th>몰구분</th>
						<td>
							<select name="mallGb" style="width: 100px;">
								<option value="" th:if="${sessionInfo.roleCd} != 'G001_B000' and ${sessionInfo.roleCd} != 'G001_C000'">[전체]</option>
								<option th:if="${mallGbList}" th:each="oneData, status : ${mallGbList}" th:value="${oneData.cd}" th:text="${oneData.cdNm}"></option>
							</select>
						</td>

						<th>업체/브랜드<em class="required" title="필수"></em></th>
						<td colspan="3">
								<select name="supplyCompCd" id="supplyCompCd">
									<option value="">[전체]</option>
									<option th:if="${supplyCompList}" th:each="oneData, status : ${supplyCompList}" th:value="${oneData.cd}" th:text="${oneData.cdNm}"></option>
								</select>
								/
								<span id="multiBrand"></span>
						</td>
												
						<th>주문상세상태</th>
						<td>
							<div class="multiCheckBox" style="width:270px">
								<button type="button" class="sltBtn" data-name="[전체]" style="overflow-x: hidden; padding-right:5px;">[전체]</button>
								<ul style="display: none; box-shadow: 3px 3px 3px; overflow-y: scroll; height: 112px;" id="group1">
									<li th:if="${ordDtlStatList}" th:each="oneData, status : ${ordDtlStatList}">
										<label class="chkBox" data-group="group1">
											<input type="checkbox" name="multiOrdDtlStat" th:value="${oneData.cd}" th:text="|[${oneData.cd}] ${oneData.cdNm}|">
										</label>
									</li>
								</ul>
							</div>
						</td>
					</tr>
					<tr>
						<th>주문자명</th>
						<td>
							<input type="text" class="" name="orderNm" placeholder="" maxlength="20"/>
						</td>
						<th>주문자휴대폰번호</th>
						<td>
							<input type="text" class="" name="orderPhnno" placeholder="" maxlength="20"/>
						</td>
						<th>주문상세번호</th>
						<td>
							<input type="text" class="" name="ordDtlNo" placeholder="" maxlength="20"/>
						</td>
						<th rowspan="4">키워드<i class="star"></i></th>
						<td rowspan="4" colspan="5">
							<select class="w130" name="search" id="search">
								<option value="searchOrdNo">주문번호</option>
								<option value="searchExtmallOrderId">외부몰주문번호</option>
							</select>
							<textarea class="textareaR3 w70p" name="condition" id="condition"></textarea>
						</td>
					</tr>
					<tr>
						<th>수령인</th>
						<td>
							<input type="text" class="" name="recipNm" placeholder="" maxlength="20"/>
						</td>
						<th>송장번호</th>
						<td>
							<input type="text" class="" name="invoiceNo" placeholder="" maxlength="20"/>
						</td>
						<th>상품코드</th>
						<td>
							<input type="text" class="" name="goodsCd" placeholder="" maxlength="20"/>
						</td>
					</tr>
					<tr>
						<th>출고유형</th>
						<td>
							<select class="w150" name="shotDelvYn" id="shotDelvYn">
								<option value="">전체</option>
								<option value="N">일반배송</option>
								<option value="Y">총알배송</option>
							</select>
								
						</td>
						<th>출고처</th>
						<td>
							<select name="delvLocCd" id="delvLocCd">
								<option value="">[전체]</option>
								<option th:if="${deliveryLocList}" th:each="oneData, status : ${deliveryLocList}" th:value="${oneData.cd}" th:text="|[${oneData.cd}] ${oneData.cdNm}|"></option>
							</select>
						</td>
						<th>배송지연일</th>
						<td>
							<input type="text" class="" name="delvDelayDays" data-valid-type="integer" placeholder="" maxlength="3" style="width:20%;"/>일
							이상(결제일 기준)
						</td>
					</tr>
					<tr>
						<th>기간</th>
						<td colspan="8">
							<select name="termGb" id="termGb">
								<option value="ordDt">주문등록일</option>
								<option value="delvDt">배송일자</option>
								<option value="delvStDt">배송시작일자</option>
							</select>
							<span id="terms"></span>
						</td>
					</tr>
				</table>
				<ul class="panelBar">
					<li class="center">
					<button type="button" class="btn btn-base btn-lg" id="btnSearch">조회</button>
					<button type="button" class="btn btn-gray btn-lg" onclick="$('#searchForm')[0].reset(); fnInitCalendar(); $('#multiBrand').empty();">초기화</button>
					<button type="button" id="btnExcel" class="btn btn-info btn-lg">엑셀다운로드</button>
					</li>
				</ul>
			
		</div>
	</div>
	<!-- //검색조건 영역 -->

	<!-- 리스트 영역 -->
	<div class="panelStyle">
		<ul class="panelBar">
			<li class="left">
				<button type="button" id="btnSoldout" class="btn btn-danger btn-lg">품절처리</button>
				<!-- <button type="button" id="btnSave" class="btn btn-success btn-lg btnRight" onclick="deliveryInfoSave();">저장</button>
				<button type="button" id="btnWith" class="btn btn-success btn-lg btnRight">T</button> -->
			</li>
			<li class="right">
				검색결과 : <strong><span id="gridRowTotalCount">0</span> 건</strong>&nbsp;
				쪽번호 <span id="pgNo">0</span>/ <strong id="endPgNo">0</strong>&nbsp;&nbsp;
				<select id="pageSize" name="pageSize">
					<option value="50" selected="selected">50개씩 보기</option>
					<option value="100">100개씩 보기</option>
					<option value="500">500개씩 보기</option>
					<option value="1000">1000개씩 보기</option>
				</select>
				<input type="hidden" name="pageNo" id="pageNo" value ="1"/>
			</li>
		</ul>

		<div id="gridDeliveryList" style="width:100%; height: 700px;" class="ag-theme-balham"></div>
		<ul class="panelBar">
			<li class="center">
				<div class="tablePaging" id="deliveryListPagination"></div>
			</li>
		</ul>
	</div>
	</form>
	<!-- //리스트 영역 -->
</div>
<script type="text/javascript" src="/ux/plugins/gaga/gaga.paging.js?v=20210114"></script>
<script th:inline="javascript">
	/*<![CDATA[*/
	/*************************************************************************
	* AG-GRID 영역 
	**************************************************************************/
	var shipCompanyList =  gagajf.convertToArray([[${shipCompanyList}]]);
	var roleCd          = [[${sessionInfo.roleCd}]];
	var currOrdNo       = 0;
	var columnDefs = [
		{
			headerName: "결품",
			field: "soldout",
			width: 50,
			cellClass: 'text-center',
			headerCheckboxSelection: true,
			headerCheckboxSelectionFilteredOnly: true
			,
			checkboxSelection: function (params) {
				return (params.data.ordDtlStat == 'G013_20') ? true : false;
			}
		},
		{headerName: "지연일",	field: "delvDelayDays", 	width: 70, cellClass: 'text-center'},
		{headerName: "주문번호",	field: "ordNo", width: 95, cellClass: 'text-center',
			cellRenderer: function (params) {
				if (roleCd.indexOf("C") < 0) {
					return "<a href=\"javascript:void(0);\" onclick=\"fnOrderDetailPopup('" + params.data.ordNo + "');\">" + params.data.ordNo + "</a>";
				} else {
					return params.value;
				}
			}
		},
		{headerName: "주문상세번호", 	field: "ordDtlNo", 		width: 90, cellClass: 'text-center'},
		{headerName: "주문상세상태", 	field: "ordDtlStatNm", 	width: 120, cellClass: 'text-center'},
		{headerName: "주문교환", 		field: "ordExchGb", 	width: 80, cellClass: 'text-center',
			cellRenderer: function (params) {
				if (params.value == "Y") {
					return "교환";
				} else {
					return "주문";
				}
			}
		},
		// {headerName: "사이트", field: "siteNm", width: 120, cellClass: 'text-center'},
		// {headerName: "판매몰", field: "sellStoreNm", width: 150, cellClass: 'text-left'},
		{headerName: "판매몰명", 		field: "extmallNm", 	width: 150, cellClass: 'text-left'},
		{headerName: "주문일시", 		field: "ordDt", 		width: 150, cellClass: 'text-center',
			cellRenderer: function (params) {
				return !gagajf.isNull(params.value) ? gagaAgGrid.toDateTimeFormat(params.value) : '';
			}
		},
		{headerName: "결제일시", 		field: "ordDt", 		width: 150, cellClass: 'text-center',
			cellRenderer: function (params) {
				return !gagajf.isNull(params.value) ? gagaAgGrid.toDateTimeFormat(params.value) : '';
			}
		},
		{headerName: "몰구분", 		field: "mallGbNm", 		width: 70, cellClass: 'text-center'},
		{headerName: "주문자", 		field: "ordNm", 		width: 100, cellClass: 'text-center',
			cellRenderer: function (params) {
				if (roleCd.indexOf("C") < 0 && !gagajf.isNull(params.value) && params.data.mallGb === 'G011_10' && params.data.custNo > 0) {
					return '<a href="javascript:void(0);" onclick=\"cfnOpenCustDetailPopup(' + params.data.custNo + ');\">' + params.data.ordNm + '</a>';
				} else {
					return params.data.ordNm;
				}
			}
		},
		{headerName: "휴대번호", 		field: "ordPhnno", 		width: 100, cellClass: 'text-center'},
		{headerName: "수령인", 		field: "recipNm", 		width: 100, cellClass: 'text-center'},
		{headerName: "공급업체", 		field: "supplyCompNm", 	width: 150, cellClass: 'text-center'},
		{headerName: "브랜드", 		field: "supplyCompNm", 	width: 150, cellClass: 'text-center'},
		{headerName: "상품코드", 		field: "goodsCd", 		width: 120, cellClass: 'text-center',
			cellRenderer: function (params) {
				if (roleCd.indexOf("C") < 0) {
					return "<a href=\"javascript:void(0);\" onclick=\"cfnOpenGoodsDetailPopup('U','" + params.value + "');\">" + params.value + "</a>";
				} else {
					return params.value;
				}
			}
		},
		{headerName: "구성유형", 		field: "goodsTypeNm",	 width: 130, cellClass: 'text-center',
			cellRenderer: function (params) {
				var option;
				if (params.data.goodsType == 'G056_S') {
					option = "<a href=\"javascript:void(0);\" onclick=\"fnOrderDetailItemForm('" + params.data.ordDtlNo + "');\">" + params.value + "</a>";
				} else {
					option = params.value
				}
				return option;
			}
		},
		{headerName: "상품명", 		field: "goodsNm", 		width: 280, cellClass: 'text-left'},
		{headerName: "옵션코드", 		field: "optCd", 		width: 100, cellClass: 'text-left'},
		{headerName: "옵션코드1", 		field: "optCd1", 		width: 100, cellClass: 'text-center'},
		{headerName: "옵션코드2", 		field: "optCd2", 		width: 100, cellClass: 'text-center'},
		{headerName: "주문수량", 		field: "ordQty", 		width: 80, cellClass: 'text-center'},
		{headerName: "취소수량", 		field: "cnclRtnQty", 	width: 80, cellClass: 'text-center'},
		{headerName: "판매수량", 		field: "saleQty", 		width: 80, cellClass: 'text-right'},
		{headerName: "판매금액", 		field: "saleAmt", 		width: 100, cellClass: 'text-right'
			, valueFormatter: function (params) {
				return params.value.addComma();
			}
		},
		{headerName: "실결제금액", 	field: "realOrdAmt", 	width: 100, cellClass: 'text-right'
			, valueFormatter: function (params) {
				return params.value.addComma();
			}
		},
		{headerName: "출고유형", 		field: "shotDelvYn", 	width: 80, cellClass: 'text-center'},
		{headerName: "출고처", 		field: "delvLocNm", 	width: 100, cellClass: 'text-center'},
		{headerName: "출고택배사", 	field: "shipCompCd", 	width: 170, cellClass: 'text-center'
			, valueGetter: function (params) { return gagaAgGrid.lookupValue(shipCompanyList, params.data.shipCompCd); }
		},
		{headerName: "배송추적", 		field: "invcTracking", 	width: 80, cellClass: 'text-center',
			cellRenderer: function (params) {
				if (params.value == "Y") {
					return "요청";
				} else {
					return "미요청";
				}
			}
		},
		{headerName: "출고송장", 		field: "invoiceNo", 	width: 150, cellClass: 'text-left'},
		{headerName: "송장등록수정", 	field: "invoiceNo", 	width: 120, cellClass: 'text-center'
			, cellRenderer : function (params) {
				var buttonTag = '';
				if (params.data.ordDtlStat == 'G013_30' || params.data.ordDtlStat == 'G013_40' || params.data.ordDtlStat == 'G013_50' || params.data.ordDtlStat == 'G013_55') {
					buttonTag = '<button type="button"class="btn btn-success" onClick="fnSaveInvoiceNo('+params.data.ordDtlNo+');">송장등록수정</button>';
				
				}
				return buttonTag;
			}
		},
		{headerName: "배송완료처리", 	field: "ordDtlStat", width: 120, cellClass: 'text-center'
			, cellRenderer: function(params) {
				var buttonTag = '';
				if (params.value == 'G013_50' || params.value == 'G013_55'  ) {
					buttonTag = '<button type="button"class="btn btn-success" onClick="deliveryComplete(\''+params.data.ordNo+ '\' , \''+params.data.ordDtlNo+'\' , \'' + params.data.ordDtlStat + '\');">배송완료</button>';
					
				}
				return buttonTag;
			}
		},
		{headerName: "외부몰주문번호", 	field: "extmallOrderId",width: 150, cellClass: 'text-left'},
		{headerName: "샵링커주문번호", field: "agentOrderId", 	width: 150, cellClass: 'text-left'},
		{headerName: "배송메모", 		field: "delvMemo", 		width: 200, cellClass: 'text-left'},
		{headerName: "우편번호", 		field: "recipZipcode", 		width: 80, cellClass: 'text-center'},
		{headerName: "기본주소", 		field: "recipBaseAddr", 	width: 200, cellClass: 'text-left'},
		{headerName: "상세주소", 		field: "recipDtlAddr", 		width: 200, cellClass: 'text-left'},
		{headerName: "product_no", 	field: "productNo", 	width: 100, cellClass: 'text-center'},
		{headerName: "product_code",field: "productCode", 	width: 100, cellClass: 'text-center'}
		
	];

	//Get GridOptions
	var gridOptions = gagaAgGrid.getGridOptions(columnDefs);

	//Grid editable
	//gridOptions.defaultColDef.editable = true;

	gridOptions.suppressRowClickSelection = true;
	gridOptions.rowSelection = 'multiple';
	gridOptions.isRowSelectable = function(rowNode) {
		return rowNode.data.ordDtlStat == 'G013_20' || rowNode.data.ordDtlStat == 'G013_25';
	}
	gridOptions.getRowStyle = function (params) {
		if (params.data.ordExchGb === 'Y') {
			return {background: 'orange'}
		}
	}

	var fnInitCalendar = function () {
		$(".btnToday").trigger('click');
	}
	
	
	/*************************************************************************
	*  주문상세 팝업  
	**************************************************************************/		
	var fnOrderDetailPopup = function(ordNo){
		currOrdNo = ordNo;
		cfnOpenOrderDetailPopup(currOrdNo);
	}
	
	/*************************************************************************
	*  팝업 콜백 
	**************************************************************************/		
	var fnReOpenOrderDetailPopup = function () {
		cfnOpenOrderDetailPopup(currOrdNo);
		fnSearchList();
	};
	
	
	/*************************************************************************
	* 조회 클릭
	**************************************************************************/
	$('#btnSearch').on('click', function () {
		fnSearchList();
	});

	/*************************************************************************
	* 조회 
	**************************************************************************/	
	var fnSearchList = function () {
	
		if ($('#searchForm input[name=ordNo]').val() == '') {
			if ($('#stDate').val() == '') {
				mcxDialog.alert('시작 기간을 입력하세요.');
				return;
			}

			if ($('#edDate').val() == '') {
				mcxDialog.alert('종료 기간을 입력하세요.');
				return;
			}
		}

		gagaPaging.init('searchForm', fnSearchCallBack, 'deliveryListPagination', $('#searchForm').find('#pageSize').val());
	    gagaPaging.load($("#searchForm input[name=pageNo]").val());

	}

	/*************************************************************************
	* 조회 콜백
	**************************************************************************/	
	var fnSearchCallBack = function(result){

		$('#searchForm').find('#gridRowTotalCount').html(result.pageing.pageable.totalCount.addComma());
		$('#searchForm').find('#pageNo').val(result.pageing.pageable.pageNo.addComma());
		$('#searchForm').find('#pgNo').html(result.pageing.pageable.pageNo.addComma());
		$('#searchForm').find('#endPgNo').html(result.pageing.pageable.totalPage.addComma());
		gridOptions.api.setRowData(result.deliveryList);
		gagaPaging.createPagination(result.pageing.pageable);
		
	}
	

	/*************************************************************************
	* 구성상품 내역 팝업 호출 
	**************************************************************************/	
	var fnOrderDetailItemForm = function (ordDtlNo) {
		var actionUrl = "/delivery/detail/item/form/" + ordDtlNo;
		cfnOpenModalPopup(actionUrl, 'popupDeliveryDetailItemForm');
	}
	
	
	/*************************************************************************
	* 엑셀다운로드 
	**************************************************************************/		
	$('#btnExcel').on('click', function () {
		var totalRows = gridOptions.api.getDisplayedRowCount();
		if (totalRows == 0) {
			mcxDialog.alert('조회된 내역이 없습니다.');
			return;
		}
		var date = new Date().format("YYYYMMDDHHmmss");
		var params = {

			fileName: "배송목록_" + date,
			sheetName: "DATA"
		}
		gridOptions.excelStyles = [
			{
				id: 'dateFormat',
				dataType: 'dateTime',
				numberFormat: {
					format: 'YYYY-MM-DD;@'
				}
			},
			{
				id: 'textFormat',
				dataType: 'string'
			}
		]
		gridOptions.api.exportDataAsExcel(params);
	});


	/*************************************************************************
	* 품절처리
	**************************************************************************/		
	$('#btnSoldout').on('click', function () {
		var selectedData = gridOptions.api.getSelectedRows();

		if (selectedData.length == 0) {
			mcxDialog.alert('선택된 행이 없습니다.');
			return;
		}
		
		mcxDialog.confirm('품절 처리하시겠습니까?', {
			cancelBtnText: "취소",
			sureBtnText: "확인",
			sureBtnClick: function () {
				var jsonData = JSON.stringify(selectedData);
				gagajf.ajaxJsonSubmit('/delivery/list/soldout'
					, jsonData
					, function () {
						$('#btnSearch').trigger('click');
					});
			}
		});
	});

	
	/*************************************************************************
	* 배송완료처리 -수동
	**************************************************************************/		
	var deliveryComplete = function (ordNo,ordDtlNo, odStat) {
		
		mcxDialog.confirm('배송완료 처리를 하시겠습니까?', {
			cancelBtnText: "취소",
			sureBtnText: "확인",
			sureBtnClick: function () {
				var jsonData = {
					"ordNo": ordNo,
					"ordDtlNo": ordDtlNo,
					"orgOrdDtlStat": odStat
				};
				var tranData = JSON.stringify(jsonData);
				gagajf.ajaxJsonSubmit('/delivery/complete/save', tranData, fnSearchList);
			}
		});

	}


	/*************************************************************************
	* 송장변경 팝업호출
	**************************************************************************/			
	var fnSaveInvoiceNo = function (ordDtlNo) {
		var actionUrl = "/delivery/save/invoice/form/" + ordDtlNo ;
		cfnOpenModalPopup(actionUrl, 'popupChangeInvoice');
	};

	/*************************************************************************
	*  업체 콤보박스 변경 시
	**************************************************************************/	
	$('#searchForm select[name=supplyCompCd]').on('change', function() {
		var actionUrl = '/renderer/supplyCompany/brand/list/'+ $(this).val();
		
		cfnCreateMultiCombo(actionUrl, "multiBrand",  "[전체]", null, 'Y');
		
		
		var actionUrl2 = '/renderer/delvloc/list/'+ $(this).val();	

		cfnCreateCombo(actionUrl2, $('#searchForm select[name=delvLocCd]'), "[전체]");


		
	});
	

	
	/*************************************************************************
	* init
	**************************************************************************/	
	$(document).ready(function () {
		gagaAgGrid.createGrid('gridDeliveryList', gridOptions);
		var hideList = ["btnThisWeek", "btnYesterWeek", "btnRecentMonth", "btnThisMonth", "btnYesterMonth", "btnRecent3Month"];
		cfnCreateCalendar('#terms', 'stDate', 'edDate', true, '주문', '', hideList);
		$(".btnToday").trigger('click');
		$('#searchForm select[name=mallGb]').trigger('change');
		$('#searchForm').find('#multiBrand').empty();
	});

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