마이페이지 단테 수정

src/main/java/com/style24/front/biz/web/TsfNoMemberController.java

@@ -1504,4 +1504,53 @@ public class TsfNoMemberController extends TsfBaseController {
 		result.set("isValid", isValid);
 		return result;
 	}
+
+	/**
+	 * 비회원 취반교목록 사전 정보 조회 (모바일)
+	 *
+	 * @param Order
+	 * @return ModelAndView
+	 * @author card007
+	 * @since 2021. 06. 01
+	 */
+	@ResponseBody
+	@PostMapping("/cre/list/pre/info")
+	public GagaMap getCreListPreInfo(@RequestBody OrderChange orderChange) {
+		GagaMap result = new GagaMap();
+
+		// 페이징 처리 설정
+		TscPageRequest pageable = new TscPageRequest((orderChange.getPageNo() > 0 ? orderChange.getPageNo() - 1 : 0), orderChange.getPageSize(), orderChange.getPageUnit());
+		pageable.setTotalCount(orderChangeService.getPagingCreListCount(orderChange));
+		orderChange.setPageable(pageable);
+
+		result.set("paging"		, pageable);
+		result.set("creList"	, orderChangeService.getPagingCreList(orderChange));
+
+		return result;
+	}
+
+	/**
+	 * 비회원 취반교목록 조회 (모바일)
+	 *
+	 * @param Order
+	 * @return ModelAndView
+	 * @author card007
+	 * @since 2021. 06. 01
+	 */
+	@ResponseBody
+	@PostMapping("/cre/list/info")
+	public ModelAndView getCreListInfo2(@RequestBody OrderChange orderChange) {
+		// 주문목록조회
+		ModelAndView mav = new ModelAndView();
+
+		Collection<GagaMap> creList = orderChangeService.getCreList(orderChange);
+
+		mav.addObject("creList"			, 	creList);
+		mav.addObject("creListCnt"		, 	creList.size());
+		mav.addObject("pageNo"			, 	orderChange.getPageNo());
+
+		mav.setViewName(super.getDeviceViewName("mypage/NoMemberCreListInfo"));
+
+		return mav;
+	}
 }

src/main/webapp/WEB-INF/views/mob/mypage/MypageCancelFormMob.html

@@ -60,16 +60,25 @@
 											<div class="name" th:text="${cancel.goodsNm}"></div>
 										</div>
 										<div class="od_opt">
+											<!-- 세트상품일때 -->
+											<th:block th:if="${cancel.goodsType} == 'G056_S'">
+												<th:block th:each="option , index2 : ${cancel.colorNmArr}">
+													<div class="option">
+														<em th:text="${cancel.itemNmArr[index2.index]}"></em>
+														<em th:text="${option}"></em>
+														<em th:text="${cancel.optCd2Arr[index2.index]}"></em>
+													</div>
+												</th:block>
+											</th:block>
+											<!-- //세트상품일때 -->
+											<!-- 단품상품일때 -->
+											<th:block th:unless="${cancel.goodsType} == 'G056_S'">
 												<div class="option">
-													<th:block th:if="${cancel.goodsType == 'G056_S'}" th:each="option, status : ${cancel.colorNmArr}">
-														<em th:text="${cancel.itemNmArr[status.index]}"></em>
-														<em th:text="${cancel.optCd2Arr[status.index]}"></em>
-													</th:block>
-													<th:block th:unless="${cancel.goodsType == 'G056_S'}">
-														<em th:text="${cancel.colorNm}"></em>
-														<em th:text="${cancel.optCd2}"></em>
-													</th:block>
+													<em th:text="${cancel.colorNm}"></em>
+													<em th:text="${cancel.optCd2}"></em>
 												</div>
+											</th:block>
+											<!-- //단품상품일때 -->
 										</div>
 										<div class="od_calc">
 											<th:block th:if="${(cancel.ordAmt - cancel.cnclRtnAmt) > (cancel.realOrdAmt + cancel.pntDcAmt + cancel.gfcdUseAmt)}">
@@ -96,7 +105,7 @@
 							</div>
 							<th:block th:if="${#lists.size(cancelList.cancelList) == status.count}">
 								<div class="goods_txt">
-									<p class="cf_txt cf_desc">취소하실 상품의 수량을 선택하신 후<br>취소 신청을 하실 수 있습니다.</p>
+									<p class="cf_txt cf_desc">취소하실 상품의 수량을 선택하신 후<br>주문 취소를 하실 수 있습니다.</p>
 								</div>
 							</th:block>
 						</div>
@@ -210,7 +219,7 @@
 			</div>
 			<div class="popup_con">
 				<div class="button_list clear">
-					<button type="button" qty=0 onclick="fnChangeCancelQty(this);"><span>수량 0개</span></button>
+					<button type="button" class="on" qty=0 onclick="fnChangeCancelQty(this);"><span>수량 0개</span></button>
 					<th:block th:each="num : ${#numbers.sequence(1, cancel.ordCanChgQty)}">
 						<button type="button" th:qty="${num}" onclick="fnChangeCancelQty(this);"><span th:text="|수량 ${num}개|"></span></button>
 					</th:block>

src/main/webapp/WEB-INF/views/mob/mypage/MypageCreCancelDetailFormMob.html

@@ -64,6 +64,7 @@
 										<div class="option">
 											<th:block th:if="${cancelDtl.goodsType == 'G056_S'}">
 												<th:block th:each="option, status : ${cancelDtl.colorNmArr}">
+													<em th:text="${cancelDtl.itemNmArr[status.index]}"></em>
 													<em th:text="${option}"></em>
 													<em th:text="${cancelDtl.optCd2Arr[status.index]}"></em>
 												</th:block>

src/main/webapp/WEB-INF/views/mob/mypage/MypageCreExchangeDetailFormMob.html

@@ -68,33 +68,48 @@
 										<div class="name" th:text="${exchangeDtl.goodsNm}"></div>
 									</div>
 									<div class="od_opt">
-										<div class="option">
-											<th:block th:if="${exchangeDtl.goodsType == 'G056_S'}">
-												<th:block th:each="option, status : ${exchangeDtl.colorNmArr}">
+										<!-- 세트상품일때 -->
+										<th:block th:if="${exchangeDtl.goodsType} == 'G056_S'">
+											<th:block th:each="option , index2 : ${exchangeDtl.colorNmArr}">
+												<div class="option">
+													<em th:text="${exchangeDtl.itemNmArr[index2.index]}"></em>
 													<em th:text="${option}"></em>
-													<em th:text="${exchangeDtl.optCd2Arr[status.index]}"></em>
-												</th:block>
+													<em th:text="${exchangeDtl.optCd2Arr[index2.index]}"></em>
+												</div>
 											</th:block>
-											<th:block th:unless="${exchangeDtl.goodsType == 'G056_S'}">
+										</th:block>
+										<!-- //세트상품일때 -->
+										<!-- 단품상품일때 -->
+										<th:block th:unless="${exchangeDtl.goodsType} == 'G056_S'">
+											<div class="option">
 												<em th:text="${exchangeDtl.colorNm}"></em>
 												<em th:text="${exchangeDtl.optCd2}"></em>
-											</th:block>
-										</div>
+											</div>
+										</th:block>
+										<!-- //단품상품일때 -->
 									</div>
 									<div class="od_exchange_opt">
 										<span>교환옵션</span>
 										<div class="option">
-											<th:block th:if="${exchangeDtl.goodsType == 'G056_S'}">
-												<th:block th:each="option, status : ${exchangeDtl.chgColorNmArr}">
-													<em th:text="${exchangeDtl.chgItemNmArr[status.index]}"></em>
-													<em th:text="${option}"></em>
-													<em th:text="${exchangeDtl.chgOptCd2Arr[status.index]}"></em>
+											<!-- 세트상품일때 -->
+											<th:block th:if="${exchangeDtl.goodsType} == 'G056_S'">
+												<th:block th:each="option , index2 : ${exchangeDtl.chgColorNmArr}">
+													<div class="option">
+														<em th:text="${exchangeDtl.chgItemNmArr[index2.index]}"></em>
+														<em th:text="${option}"></em>
+														<em th:text="${exchangeDtl.chgOptCd2Arr[index2.index]}"></em>
+													</div>
 												</th:block>
 											</th:block>
-											<th:block th:unless="${exchangeDtl.goodsType == 'G056_S'}">
-												<em th:text="${exchangeDtl.chgColorNm}"></em>
-												<em th:text="${exchangeDtl.chgOptCd2}"></em>
+											<!-- //세트상품일때 -->
+											<!-- 단품상품일때 -->
+											<th:block th:unless="${exchangeDtl.goodsType} == 'G056_S'">
+												<div class="option">
+													<em th:text="${exchangeDtl.chgColorNm}"></em>
+													<em th:text="${exchangeDtl.chgOptCd2}"></em>
+												</div>
 											</th:block>
+											<!-- //단품상품일때 -->
 										</div>
 									</div>
 									<div class="od_calc">

src/main/webapp/WEB-INF/views/mob/mypage/MypageCreListFormMob.html

@@ -60,7 +60,7 @@
 		<div class="popup_con">
 			<div class="button_list clear">
 				<button type="button" onclick="fnSetSearchPeriod(1);" period="1"><span>최근 1개월</span></button>
-				<button type="button" onclick="fnSetSearchPeriod(3);" period="3"><span>최근 3개월</span></button>
+				<button type="button" class="on" onclick="fnSetSearchPeriod(3);" period="3"><span>최근 3개월</span></button>
 				<button type="button" onclick="fnSetSearchPeriod(6);" period="6"><span>최근 6개월</span></button>
 				<button type="button" onclick="fnSetSearchPeriod(9);" period="9"><span>최근 9개월</span></button>
 				<button type="button" onclick="fnSetSearchPeriod(12);" period="12"><span>최근 12개월</span></button>
@@ -116,61 +116,23 @@ $(document).ready(function() {
 		, "stDate" 			: ""
 		, "edDate" 			: ""
 	}
-	
-	// AJAX 변수 설정
-	//jsonData = JSON.stringify(jsonObj);
-	
-	// 전체페이지 구하기
-	//totalPage 	= parseInt(totalCnt / 10);
-	//remainList 	= totalCnt % 10; 
-	
-	// 나머지가 있으면 전체 페이지 + 1
-	//if (remainList > 0) {
-	//	totalPage = totalPage + 1;
-	//}
-	
-	//fnSetSearchPeriod(3);
-	
-	//var win = $(window);
-	 
-	// Each time the user scrolls
-	//win.scroll(function() {
-		// End of the document reached?
-		//if ($(document).height() - win.height() == win.scrollTop()) {
-		//	if (scrollTemp) {
-		//		var tempPage 	= parseInt($("#searchForm input[name=pageNo]").val());
-		//		tempPage 		= tempPage + 1;
-		//
-		//		if (totalPage > tempPage) {
-		//			scrollTemp = false;
-		//			fnGetInfiniteScrollDataList(tempPage);
-		//		}
-		//	}
-		//}
-	//});
-	
-	
 });
 
 //사파리 - event.persisted || 크롬 - window.performance.navigation.type 이 1이면 새로고침, 2면 페이지 이동을 통한 캐쉬페이징
 $(window).on("pageshow", function(event) {
 	if ((event.originalEvent && event.originalEvent.persisted) || (window.performance && window.performance.navigation.type == 2)) {
-		var historyData = sessionStorage.getItem(document.location.href);
-		if (historyData != null) {
-			historyData = JSON.parse(historyData);
-		} else {
-			historyData = {};
-		}
+		// 캐쉬페이징
 	} else {
 		// 2021.05.28 인피니티스크롤 초기화
 		fnMypageCreListInfiniteScrollInit();
-		fnGetInfiniteScrollDataList();
 	}
+	
+	// 데이터 조회
+	gagaInfiniteScroll.getHistory();
 });
 
 //취소,반품,교환목록조회
 var fnGetInfiniteScrollDataList = function() {
-	
 	// 2021.05.28 페이지 기능 수정
 	if (pageNo <= totalPage) {
 		pageNo++;
@@ -222,26 +184,6 @@ var fnGetInfiniteScrollDataList = function() {
 			});
 		}
 	}, true);
-	//$.ajax( {
-	//	type		: "POST",
-	//	url 		: '/mypage/cre/listInfo',
-	//	data		: JSON.stringify(jsonObj),
-	//	dataType 	: 'html',
-	//	beforeSend : function(xhr, settings) {
-	//		xhr.setRequestHeader("AJAX"			, "true");
-	//		xhr.setRequestHeader('Accept'		, 'application/json');
-	//		xhr.setRequestHeader('Content-Type'	, 'application/json');
-	//	},
-	//	success 	: function(result) {
-	//		if (result != null) {
-	//			$("#listBox").css("display", "block");
-	//			$("#listBox").append(result);
-	//			
-	//			scrollTemp = true;
-	//			
-	//		}
-	//	}
-	//});
 }
 
 //검색기간 버튼 클릭 이벤트 처리
@@ -263,7 +205,7 @@ var fnSetSearchPeriod = function(period) {
 	$('#searchForm input[name=stDate]').val(stDate);
 	
 	// 인피니티스크롤 초기화
-	fnMypageOrderListInfiniteScrollInit();
+	fnMypageCreListInfiniteScrollInit();
 	
 	$("#odDatePop .popup_con button").removeClass("on");
 	
@@ -279,6 +221,7 @@ var fnSetSearchPeriod = function(period) {
 		}
 	});
 	
+	// 데이터 조회
 	fnGetInfiniteScrollDataList();
 	
 	// 팝업닫기
@@ -306,7 +249,9 @@ $('#odStatusPop .popup_con .button_list .ordDtlStat').on('click', function() {
 	});
 	
 	// 인피니티스크롤 초기화
-	fnMypageOrderListInfiniteScrollInit();
+	fnMypageCreListInfiniteScrollInit();
+	
+	// 데이터 조회
 	fnGetInfiniteScrollDataList();
 	
 	// 팝업닫기
@@ -359,8 +304,6 @@ var getTotalPage = function(param) {
 		totalPage = totalPage + 1;
 	}
 }
-
-$(function() { gagaInfiniteScroll.getHistory(); });
 /*]]>*/
 </script>
 

src/main/webapp/WEB-INF/views/mob/mypage/MypageCreListInfoMob.html

@@ -20,7 +20,7 @@
 					<div class="goods_section">
 						<div class="goods_status">
 							<p class="dlvr_staus" th:text="${cre.chgStatNm}"></p>
-							<p class="dlvr_desc"><th:block th:text="|${cre.chgDate} ${cre.chgTime}|"></p>
+							<p class="dlvr_desc" th:text="|${cre.chgDate} ${cre.chgTime}|"></p>
 						</div>
 						<div class="goods_detail">
 							<a href="javascript:void(0)" th:attr="goodsCd=${cre.goodsCd}" onclick="fnGoToGoodsDetail(this)">
@@ -50,6 +50,7 @@
 										<th:block th:if="${cre.goodsType} == 'G056_S'">
 											<th:block th:each="option , index2 : ${cre.colorNmArr}">
 												<div class="option">
+													<em th:text="${cre.itemNmArr[index2.index]}"></em>
 													<em th:text="${option}"></em>
 													<em th:text="${cre.optCd2Arr[index2.index]}"></em>
 												</div>
@@ -76,8 +77,9 @@
 													<th:block th:if="${cre.goodsType} == 'G056_S'">
 														<th:block th:each-="option, index2, ${exchange.colorNmArr}">
 															<div class="option">
-																<em th:text="${exchange.itemNmArr[index2]}"></em>
-																<em th:text="${exchange.optCd2Arr[index2]}"></em>
+																<em th:text="${exchange.itemNmArr[index2.index]}"></em>
+																<em th:text="${option}"></em>
+																<em th:text="${exchange.optCd2Arr[index2.index]}"></em>
 															</div>
 														</th:block>
 													</th:block>

src/main/webapp/WEB-INF/views/mob/mypage/MypageCreReturnDetailFormMob.html

@@ -66,18 +66,25 @@
 										<div class="name" th:text="${returnDtl.goodsNm}"></div>
 									</div>
 									<div class="od_opt">
-										<div class="option">
-											<th:block th:if="${returnDtl.goodsType == 'G056_S'}">
-												<th:block th:each="option, status : ${returnDtl.colorNmArr}">
+										<!-- 세트상품일때 -->
+										<th:block th:if="${returnDtl.goodsType} == 'G056_S'">
+											<th:block th:each="option , index2 : ${returnDtl.colorNmArr}">
+												<div class="option">
+													<em th:text="${returnDtl.itemNmArr[index2.index]}"></em>
 													<em th:text="${option}"></em>
-													<em th:text="${returnDtl.optCd2Arr[status.index]}"></em>
-												</th:block>
+													<em th:text="${returnDtl.optCd2Arr[index2.index]}"></em>
+												</div>
 											</th:block>
-											<th:block th:unless="${returnDtl.goodsType == 'G056_S'}">
+										</th:block>
+										<!-- //세트상품일때 -->
+										<!-- 단품상품일때 -->
+										<th:block th:unless="${returnDtl.goodsType} == 'G056_S'">
+											<div class="option">
 												<em th:text="${returnDtl.colorNm}"></em>
 												<em th:text="${returnDtl.optCd2}"></em>
-											</th:block>
-										</div>
+											</div>
+										</th:block>
+										<!-- //단품상품일때 -->
 									</div>
 									<div class="od_calc">
 										<p class="price">
@@ -136,36 +143,38 @@
 				</div>
 			</div>
 		</div>
-		<div class="inner">
-			<div class="tbl_wrap">
-				<div class="tbl_tit"> 
-					<h3>반품 회수지 주소</h3>
-					<th:block th:if="${oneData.chgStat == 'G685_50' or oneData.chgStat == 'G685_51'}">
-						<button type="button" id="btn_adrsChange_pop" class="btn_popup" onclick="fnChangeDeliveryAddr();">
-							<span>회수지 변경</span>
-						</button>
-					</th:block>
-				</div>
-				<div class="tbl">
-					<div class="ship_info">
-						<dl>
-							<div class="name">
-								<dt><span class="sr-only">배송지명</span></dt>
-								<dd id="chgerNm" th:text="${oneData.chgerNm}"></dd>
-							</div>
-							<div class="addr">
-								<dt><span class="sr-only">배송주소</span></dt>
-								<dd id="chgerAddr" th:text="|${oneData.chgerBaseAddr} ${oneData.chgerDtlAddr}|"></dd>
-							</div>
-							<div class="phone">
-								<dt><span class="sr-only">휴대폰 번호</span></dt>
-								<dd id="chgerPhnno" th:text="${oneData.chgerPhnno}"></dd>
-							</div>
-						</dl>
+		<th:block th:if="${oneData.wdGb == 'W'}">
+			<div class="inner">
+				<div class="tbl_wrap">
+					<div class="tbl_tit"> 
+						<h3>반품 회수지 주소</h3>
+						<th:block th:if="${oneData.chgStat == 'G685_50' or oneData.chgStat == 'G685_51'}">
+							<button type="button" id="btn_adrsChange_pop" class="btn_popup" onclick="fnChangeDeliveryAddr();">
+								<span>회수지 변경</span>
+							</button>
+						</th:block>
+					</div>
+					<div class="tbl">
+						<div class="ship_info">
+							<dl>
+								<div class="name">
+									<dt><span class="sr-only">배송지명</span></dt>
+									<dd id="chgerNm" th:text="${oneData.chgerNm}"></dd>
+								</div>
+								<div class="addr">
+									<dt><span class="sr-only">배송주소</span></dt>
+									<dd id="chgerAddr" th:text="|${oneData.chgerBaseAddr} ${oneData.chgerDtlAddr}|"></dd>
+								</div>
+								<div class="phone">
+									<dt><span class="sr-only">휴대폰 번호</span></dt>
+									<dd id="chgerPhnno" th:text="${oneData.chgerPhnno}"></dd>
+								</div>
+							</dl>
+						</div>
 					</div>
 				</div>
 			</div>
-		</div>
+		</th:block>
 		<th:block th:if="${not #strings.isEmpty(oneData.wdInvoiceNo) and not #strings.isEmpty(oneData.shipCompNm)}">
 			<div class="inner">
 				<div class="tbl_wrap">

src/main/webapp/WEB-INF/views/mob/mypage/MypageExchangeFormMob.html

@@ -61,6 +61,7 @@
 											<th:block th:if="${exchange.goodsType == 'G056_S'}" th:each="option, status : ${exchange.colorNmArr}">
 												<div class="option">
 													<em th:text="${exchange.itemNmArr[status.index]}"></em>
+													<em th:text="${option}"></em>
 													<em th:text="${exchange.optCd2Arr[status.index]}"></em>
 												</div>
 											</th:block>
@@ -79,6 +80,7 @@
 												<span>교환옵션</span>
 												<div class="option">
 													<em th:text="${exchange.itemNmArr[status.index]}"></em>
+													<em th:text="${option}"></em>
 													<em th:text="${exchange.optCd2Arr[status.index]}"></em>
 												</div>
 											</th:block>

src/main/webapp/WEB-INF/views/mob/mypage/MypageOrderListFormMob.html

@@ -136,7 +136,7 @@
 		<div class="popup_con">
 			<div class="button_list clear">
 				<button type="button" onclick="fnSetSearchPeriod(1);" period="1"><span>최근 1개월</span></button>
-				<button type="button" onclick="fnSetSearchPeriod(3);" period="3"><span>최근 3개월</span></button>
+				<button type="button" class="on" onclick="fnSetSearchPeriod(3);" period="3"><span>최근 3개월</span></button>
 				<button type="button" onclick="fnSetSearchPeriod(6);" period="6"><span>최근 6개월</span></button>
 				<button type="button" onclick="fnSetSearchPeriod(9);" period="9"><span>최근 9개월</span></button>
 				<button type="button" onclick="fnSetSearchPeriod(12);" period="12"><span>최근 12개월</span></button>
@@ -176,7 +176,6 @@ var totalCnt		= [[${totalCnt}]];
 var totalPage		= 0;
 var remainList		= 0;
 var jsonObj 		= {};
-var scrollTemp		= true;
 var mypageMainYn	= [[${mypageMainYn}]];
 let customerInfo 	= [[${customerInfo}]];
 var pageNo			= 0;
@@ -195,9 +194,6 @@ $(document).ready(function() {
 		, "custNo"			: custNo
 	}
 	
-	// AJAX 변수 설정
-	jsonData = JSON.stringify(jsonObj);
-	
 	// 마이페이지 메인화면일때 초기 1개월 조회
 	if (mypageMainYn == 'Y') {
 		// 타이틀명
@@ -218,31 +214,17 @@ $(document).ready(function() {
 //사파리 - event.persisted || 크롬 - window.performance.navigation.type 이 1이면 새로고침, 2면 페이지 이동을 통한 캐쉬페이징
 $(window).on("pageshow", function(event) {
 	if ((event.originalEvent && event.originalEvent.persisted) || (window.performance && window.performance.navigation.type == 2)) {
-		var historyData = sessionStorage.getItem(document.location.href);
-		if (historyData != null) {
-			historyData = JSON.parse(historyData);
-		} else {
-			historyData = {};
-		}
+		// 캐쉬페이징
 	} else {
-		// 마이페이지 메인화면일때 초기 1개월 조회
-		if (mypageMainYn == 'Y') {
-			jsonObj.pageSize = 1;
-			jsonObj.pageUnit = 1;
-			fnSetSearchPeriod(1);
-		}
-		// 마이페이지 주문목록화면일때
-		else {
-			// 2021.05.28 인피니티스크롤 초기화
-			fnMypageOrderListInfiniteScrollInit();
-			fnGetInfiniteScrollDataList();
-		}
+		// 인피니티스크롤 초기화
+		fnMypageOrderListInfiniteScrollInit();
 	}
+	
+	gagaInfiniteScroll.getHistory();
 });
 
 // 주문 목록 조회
 var fnGetInfiniteScrollDataList = function() {
-	
 	// 2021.05.28 마이페이지메인 주문목록 확인
 	if (mypageMainYn == 'Y') {
 		jsonObj.pageSize = 1;
@@ -341,6 +323,7 @@ var fnSetSearchPeriod = function(period) {
 		}
 	});
 	
+	// 데이터 조회
 	fnGetInfiniteScrollDataList();
 	
 	// 팝업닫기
@@ -369,13 +352,15 @@ $('#odStatusPop .popup_con .button_list .ordDtlStat').on('click', function() {
 	
 	// 인피니티스크롤 초기화
 	fnMypageOrderListInfiniteScrollInit();
+	
+	// 데이터 조회
 	fnGetInfiniteScrollDataList();
 	
 	// 팝업닫기
 	$(".popup_close").trigger("click");
 });
 
-// 2021.04.21 인피니티 스크롤 기능 구현전 추후 수정
+// 인피니티 스크롤 초기화
 var fnMypageOrderListInfiniteScrollInit = function(){
 	sessionStorage.removeItem(document.location.href);
 	
@@ -384,8 +369,6 @@ var fnMypageOrderListInfiniteScrollInit = function(){
 	// History 초기화
 	$("#listBox").html("");
 }
-
-$(function() { gagaInfiniteScroll.getHistory(); });
 </script>
 
 <script>
@@ -466,16 +449,6 @@ $(function() { gagaInfiniteScroll.getHistory(); });
 		cfnGoToPage(_PAGE_CUSTOMER_GRADE_BENEFIT);
 	}
 	
-	// 인피니티 스크롤 초기화
-	var fnOrderListInfiniteScrollInit = function (){
-		sessionStorage.removeItem(document.location.href);
-		$("#listBox").html("");
-	}
-	
-	var fnOrderListSearch = function (){
-		gagaInfiniteScroll.getHistory();
-	}
-	
 	var getTotalPage = function(param) {
 		// 전체페이지 구하기
 		totalPage 	= parseInt(param / 10);

src/main/webapp/WEB-INF/views/mob/mypage/MypageOrderListInfoMob.html

@@ -78,10 +78,25 @@
 										<div class="name" th:text="${ordDtl.goodsNm}"></div>
 									</div>
 									<div class="od_opt">
-										<div class="option" th:each="colorNm, index : ${ordDtl.colorNmArr}">
-											<em th:text="${colorNm}"></em>
-											<em th:text="${ordDtl.optCd2Arr[index.index]}"></em>
-										</div>
+										<!-- 세트상품일때 -->
+										<th:block th:if="${ordDtl.goodsType} == 'G056_S'">
+											<th:block th:each="option , index : ${ordDtl.colorNmArr}">
+												<div class="option">
+													<em th:text="${ordDtl.itemNmArr[index.index]}"></em>
+													<em th:text="${option}"></em>
+													<em th:text="${ordDtl.optCd2Arr[index.index]}"></em>
+												</div>
+											</th:block>
+										</th:block>
+										<!-- //세트상품일때 -->
+										<!-- 단품상품일때 -->
+										<th:block th:unless="${ordDtl.goodsType} == 'G056_S'">
+											<div class="option">
+												<em th:text="${ordDtl.colorNm}"></em>
+												<em th:text="${ordDtl.optCd2}"></em>
+											</div>
+										</th:block>
+										<!-- //단품상품일때 -->
 									</div>
 									<div class="od_calc">
 										<!-- 판매금액과 할인금액이 같으면 표시 안함 -->

src/main/webapp/WEB-INF/views/mob/mypage/MypageReturnFormMob.html

@@ -61,16 +61,25 @@
 											<div class="name" th:text="${return.goodsNm}"></div>
 										</div>
 										<div class="od_opt">
-											<div class="option">
-												<th:block th:if="${return.goodsType == 'G056_S'}" th:each="option, status : ${return.colorNmArr}">
-													<em th:text="${return.itemNmArr[status.index]}"></em>
-													<em th:text="${return.optCd2Arr[status.index]}"></em>
+											<!-- 세트상품일때 -->
+											<th:block th:if="${return.goodsType} == 'G056_S'">
+												<th:block th:each="option , index2 : ${return.colorNmArr}">
+													<div class="option">
+														<em th:text="${return.itemNmArr[index2.index]}"></em>
+														<em th:text="${option}"></em>
+														<em th:text="${return.optCd2Arr[index2.index]}"></em>
+													</div>
 												</th:block>
-												<th:block th:unless="${return.goodsType == 'G056_S'}">
+											</th:block>
+											<!-- //세트상품일때 -->
+											<!-- 단품상품일때 -->
+											<th:block th:unless="${return.goodsType} == 'G056_S'">
+												<div class="option">
 													<em th:text="${return.colorNm}"></em>
 													<em th:text="${return.optCd2}"></em>
-												</th:block>
-											</div>
+												</div>
+											</th:block>
+											<!-- //단품상품일때 -->
 										</div>
 										<div class="od_calc">
 											<th:block th:if="${(return.ordAmt - return.cnclRtnAmt) > (return.realOrdAmt + return.pntDcAmt + return.gfcdUseAmt)}">

src/main/webapp/WEB-INF/views/mob/mypage/NoMemberCancelFormMob.html

@@ -59,16 +59,25 @@
 											<div class="name" th:text="${cancel.goodsNm}"></div>
 										</div>
 										<div class="od_opt">
+											<!-- 세트상품일때 -->
+											<th:block th:if="${cancel.goodsType} == 'G056_S'">
+												<th:block th:each="option , index2 : ${cancel.colorNmArr}">
+													<div class="option">
+														<em th:text="${cancel.itemNmArr[index2.index]}"></em>
+														<em th:text="${option}"></em>
+														<em th:text="${cancel.optCd2Arr[index2.index]}"></em>
+													</div>
+												</th:block>
+											</th:block>
+											<!-- //세트상품일때 -->
+											<!-- 단품상품일때 -->
+											<th:block th:unless="${cancel.goodsType} == 'G056_S'">
 												<div class="option">
-													<th:block th:if="${cancel.goodsType == 'G056_S'}" th:each="option, status : ${cancel.colorNmArr}">
-														<em th:text="${cancel.itemNmArr[status.index]}"></em>
-														<em th:text="${cancel.optCd2Arr[status.index]}"></em>
-													</th:block>
-													<th:block th:unless="${cancel.goodsType == 'G056_S'}">
-														<em th:text="${cancel.colorNm}"></em>
-														<em th:text="${cancel.optCd2}"></em>
-													</th:block>
+													<em th:text="${cancel.colorNm}"></em>
+													<em th:text="${cancel.optCd2}"></em>
 												</div>
+											</th:block>
+											<!-- //단품상품일때 -->
 										</div>
 										<div class="od_calc">
 											<th:block th:if="${(cancel.ordAmt - cancel.cnclRtnAmt) > (cancel.realOrdAmt + cancel.pntDcAmt + cancel.gfcdUseAmt)}">
@@ -95,7 +104,7 @@
 							</div>
 							<th:block th:if="${#lists.size(cancelList.cancelList) == status.count}">
 								<div class="goods_txt">
-									<p class="cf_txt cf_desc">취소하실 상품의 수량을 선택하신 후<br>취소 신청을 하실 수 있습니다.</p>
+									<p class="cf_txt cf_desc">취소하실 상품의 수량을 선택하신 후<br>주문 취소를 하실 수 있습니다.</p>
 								</div>
 							</th:block>
 						</div>
@@ -209,7 +218,7 @@
 			</div>
 			<div class="popup_con">
 				<div class="button_list clear">
-					<button type="button" qty=0 onclick="fnChangeCancelQty(this);"><span>수량 0개</span></button>
+					<button type="button" qty=0 class="on" onclick="fnChangeCancelQty(this);"><span>수량 0개</span></button>
 					<th:block th:each="num : ${#numbers.sequence(1, cancel.ordCanChgQty)}">
 						<button type="button" th:qty="${num}" onclick="fnChangeCancelQty(this);"><span th:text="|수량 ${num}개|"></span></button>
 					</th:block>

src/main/webapp/WEB-INF/views/mob/mypage/NoMemberCreCancelDetailFormMob.html

@@ -59,6 +59,7 @@
 										<div class="option">
 											<th:block th:if="${cancelDtl.goodsType == 'G056_S'}">
 												<th:block th:each="option, status : ${cancelDtl.colorNmArr}">
+													<em th:text="${cancelDtl.itemNmArr[status.index]}"></em>
 													<em th:text="${option}"></em>
 													<em th:text="${cancelDtl.optCd2Arr[status.index]}"></em>
 												</th:block>

src/main/webapp/WEB-INF/views/mob/mypage/NoMemberCreExchangeDetailFormMob.html

@@ -63,33 +63,48 @@
 										<div class="name" th:text="${exchangeDtl.goodsNm}"></div>
 									</div>
 									<div class="od_opt">
-										<div class="option">
-											<th:block th:if="${exchangeDtl.goodsType == 'G056_S'}">
-												<th:block th:each="option, status : ${exchangeDtl.colorNmArr}">
+										<!-- 세트상품일때 -->
+										<th:block th:if="${exchangeDtl.goodsType} == 'G056_S'">
+											<th:block th:each="option , index2 : ${exchangeDtl.colorNmArr}">
+												<div class="option">
+													<em th:text="${exchangeDtl.itemNmArr[index2.index]}"></em>
 													<em th:text="${option}"></em>
-													<em th:text="${exchangeDtl.optCd2Arr[status.index]}"></em>
-												</th:block>
+													<em th:text="${exchangeDtl.optCd2Arr[index2.index]}"></em>
+												</div>
 											</th:block>
-											<th:block th:unless="${exchangeDtl.goodsType == 'G056_S'}">
+										</th:block>
+										<!-- //세트상품일때 -->
+										<!-- 단품상품일때 -->
+										<th:block th:unless="${exchangeDtl.goodsType} == 'G056_S'">
+											<div class="option">
 												<em th:text="${exchangeDtl.colorNm}"></em>
 												<em th:text="${exchangeDtl.optCd2}"></em>
-											</th:block>
-										</div>
+											</div>
+										</th:block>
+										<!-- //단품상품일때 -->
 									</div>
 									<div class="od_exchange_opt">
 										<span>교환옵션</span>
 										<div class="option">
-											<th:block th:if="${exchangeDtl.goodsType == 'G056_S'}">
-												<th:block th:each="option, status : ${exchangeDtl.chgColorNmArr}">
-													<em th:text="${exchangeDtl.chgItemNmArr[status.index]}"></em>
-													<em th:text="${option}"></em>
-													<em th:text="${exchangeDtl.chgOptCd2Arr[status.index]}"></em>
+											<!-- 세트상품일때 -->
+											<th:block th:if="${exchangeDtl.goodsType} == 'G056_S'">
+												<th:block th:each="option , index2 : ${exchangeDtl.chgColorNmArr}">
+													<div class="option">
+														<em th:text="${exchangeDtl.chgItemNmArr[index2.index]}"></em>
+														<em th:text="${option}"></em>
+														<em th:text="${exchangeDtl.chgOptCd2Arr[index2.index]}"></em>
+													</div>
 												</th:block>
 											</th:block>
-											<th:block th:unless="${exchangeDtl.goodsType == 'G056_S'}">
-												<em th:text="${exchangeDtl.chgColorNm}"></em>
-												<em th:text="${exchangeDtl.chgOptCd2}"></em>
+											<!-- //세트상품일때 -->
+											<!-- 단품상품일때 -->
+											<th:block th:unless="${exchangeDtl.goodsType} == 'G056_S'">
+												<div class="option">
+													<em th:text="${exchangeDtl.chgColorNm}"></em>
+													<em th:text="${exchangeDtl.chgOptCd2}"></em>
+												</div>
 											</th:block>
+											<!-- //단품상품일때 -->
 										</div>
 									</div>
 									<div class="od_calc">

src/main/webapp/WEB-INF/views/mob/mypage/NoMemberCreListFormMob.html

@@ -17,7 +17,7 @@
 <th:block layout:fragment="content">
 
 <!-- 취소/반품/교환목록조회 -->
-<form id="searchForm" name="searchForm" th:action="@{'/mypage/cre/list'}" th:method="post">
+<form id="searchForm" name="searchForm" th:action="@{'/noMember/cre/list'}" th:method="post">
 	<input type="hidden" name="pageNo" 		value=1 />
 	<input type="hidden" name="pageSize" 	value=5 />
 	<input type="hidden" name="pageUnit" 	value=10 />
@@ -75,7 +75,7 @@
 		<div class="popup_con">
 			<div class="button_list clear">
 				<button type="button" onclick="fnSetSearchPeriod(1);" period="1"><span>최근 1개월</span></button>
-				<button type="button" onclick="fnSetSearchPeriod(3);" period="3"><span>최근 3개월</span></button>
+				<button type="button" class="on" onclick="fnSetSearchPeriod(3);" period="3"><span>최근 3개월</span></button>
 				<button type="button" onclick="fnSetSearchPeriod(6);" period="6"><span>최근 6개월</span></button>
 				<button type="button" onclick="fnSetSearchPeriod(9);" period="9"><span>최근 9개월</span></button>
 				<button type="button" onclick="fnSetSearchPeriod(12);" period="12"><span>최근 12개월</span></button>
@@ -106,12 +106,18 @@
 </div>		
 <!-- //주문상태 선택 팝업 -->
 
+<script src="/ux/plugins/gaga/gaga.infinite.scrollSession.js"></script>
+<script src="/ux/plugins/jquery/jquery.history.min.js"></script>
 <script th:inline="javascript">
 //AJAX 로드를 위한 변수 설정
 let ordNo			= [[${ordNo}]];
 let ordNm			= [[${ordNm}]];
 let ordPhnno		= [[${ordPhnno}]];
-let totalCnt 	= [[${totalCnt}]];
+var totalCnt		= [[${totalCnt}]];
+var totalPage		= 0;
+var remainList		= 0;
+var pageNo			= 0;
+var jsonObj 		= {};
 
 /*<![CDATA[*/
 $(document).ready(function() {
@@ -129,76 +135,28 @@ $(document).ready(function() {
 		, "ordNm"			: ordNm
 		, "ordPhnno"		: ordPhnno
 	}
-	
-	// AJAX 변수 설정
-	jsonData = JSON.stringify(jsonObj);
-	
-	// 전체페이지 구하기
-	totalPage 	= parseInt(totalCnt / 10);
-	remainList 	= totalCnt % 10; 
-	
-	// 나머지가 있으면 전체 페이지 + 1
-	if (remainList > 0) {
-		totalPage = totalPage + 1;
+});
+
+//사파리 - event.persisted || 크롬 - window.performance.navigation.type 이 1이면 새로고침, 2면 페이지 이동을 통한 캐쉬페이징
+$(window).on("pageshow", function(event) {
+	if ((event.originalEvent && event.originalEvent.persisted) || (window.performance && window.performance.navigation.type == 2)) {
+		// 캐쉬페이징
+	} else {
+		// 2021.05.28 인피니티스크롤 초기화
+		fnMypageCreListInfiniteScrollInit();
 	}
 	
-	fnSetSearchPeriod(3);
-	
-	var win = $(window);
-	 
-	// Each time the user scrolls
-	win.scroll(function() {
-		// End of the document reached?
-		if ($(document).height() - win.height() == win.scrollTop()) {
-			if (scrollTemp) {
-				var tempPage 	= parseInt($("#searchForm input[name=pageNo]").val());
-				tempPage 		= tempPage + 1;
-				
-				if (totalPage > tempPage) {
-					scrollTemp = false;
-					fnGetInfiniteScrollDataList(tempPage);
-				}
-			}
-		}
-	});
-	
-	// 주문상세상태코드 셀렉트박스 변경 이벤트
-	$('#odStatusPop .popup_con .button_list .ordDtlStat').on('click', function() {
-		let code = $(this).attr('code');
-		$('#searchForm input[name=chgStat]').val(code);
-		jsonObj.chgStat = code;
-
-		$("#odStatusPop .popup_con button").removeClass("on");
-
-		// 상태값설정
-		$("#odStatusPop .popup_con button").each(function() {
-			var tempCode = $(this).attr("code");
-			if (tempCode == code) {
-				$(this).addClass("on");
-
-				// 상태값 명칭
-				var ordDtlStatNm = $(this).find("span").text();
-				$(".container .my_order .od_status_btn").text(ordDtlStatNm);
-			}
-		});
-		
-		// 리헷
-		$("#listBox").html("");
-		
-		// 초기화설정
-		fnGetInfiniteScrollDataList(1);
-
-		// 팝업 닫기
-		$(".popup_close").trigger("click");
-	});
+	// 데이터 조회
+	gagaInfiniteScroll.getHistory();
 });
 
 //취소,반품,교환목록조회
-var fnGetInfiniteScrollDataList = function(pageNo) {
-
-	// 페이지번호가 없으면 1페이지 설정
-	if (pageNo == null || pageNo == 0) {
-		pageNo = 1;
+var fnGetInfiniteScrollDataList = function() {
+	// 2021.05.28 페이지 기능 수정
+	if (pageNo <= totalPage) {
+		pageNo++;
+	} else {
+		return false;
 	}
 	
 	// 페이지설정
@@ -207,27 +165,44 @@ var fnGetInfiniteScrollDataList = function(pageNo) {
 	jsonObj.pageNo = pageNo;
 	jsonObj.stDate = $("#searchForm input[name=stDate]").val();
 	jsonObj.edDate = $("#searchForm input[name=edDate]").val();
+	jsonObj.chgStat	= $('#searchForm input[name=chgStat]').val();
 	
-	$.ajax( {
-		type		: "POST",
-		url 		: '/noMember/cre/listInfo',
-		data		: JSON.stringify(jsonObj),
-		dataType 	: 'html',
-		beforeSend : function(xhr, settings) {
-			xhr.setRequestHeader("AJAX"			, "true");
-			xhr.setRequestHeader('Accept'		, 'application/json');
-			xhr.setRequestHeader('Content-Type'	, 'application/json');
-		},
-		success 	: function(result) {
-			if (result != null) {
-				$("#listBox").css("display", "block");
-				$("#listBox").append(result);
-				
-				scrollTemp = true;
-				
-			}
+	gagajf.ajaxJsonSubmit('/noMember/cre/list/pre/info', JSON.stringify(jsonObj), function(result) {
+		let totalCount 	= result.paging.totalCount;
+		totalCnt 		= totalCount;
+		
+		getTotalPage(totalCount);
+		
+		gagaInfiniteScroll.pageStatus.totalCount = totalCount;
+		
+		let ordChgSqArr = [];
+		$.each(result.creList, function(idx, item) {
+			ordChgSqArr.push(item.ordChgSq);
+		});
+		
+		jsonObj.ordChgSqArr = ordChgSqArr;
+		
+		if (ordChgSqArr.length > 0) {
+			$.ajax({
+				type: "POST",
+				url: '/noMember/cre/list/info',
+				data: JSON.stringify(jsonObj),
+				dataType: 'html',
+				beforeSend: function (xhr, settings) {
+					xhr.setRequestHeader("AJAX", "true");
+					xhr.setRequestHeader('Accept', 'application/json');
+					xhr.setRequestHeader('Content-Type', 'application/json');
+				},
+				success: function (result) {
+					if (result != null) {
+						// 2021.05.28
+						$("#listBox").css("display", "block");
+						gagaInfiniteScroll.draw(result);
+					}
+				}
+			});
 		}
-	});
+	}, true);
 }
 
 //검색기간 버튼 클릭 이벤트 처리
@@ -248,11 +223,8 @@ var fnSetSearchPeriod = function(period) {
 	$('#searchForm input[name=edDate]').val(edDate);
 	$('#searchForm input[name=stDate]').val(stDate);
 	
-	// 리헷
-	$("#listBox").html("");
-	
-	// 초기화설정
-	fnGetInfiniteScrollDataList(1);
+	// 인피니티스크롤 초기화
+	fnMypageCreListInfiniteScrollInit();
 	
 	$("#odDatePop .popup_con button").removeClass("on");
 	
@@ -267,9 +239,52 @@ var fnSetSearchPeriod = function(period) {
 			$(".container .my_order .od_date_btn").text(periodStr);
 		}
 	});
+	
+	// 데이터 조회
+	fnGetInfiniteScrollDataList();
+	
+	// 팝업 닫기
+	$(".popup_close").trigger("click");
+}
 
+// 주문상세상태코드 셀렉트박스 변경 이벤트
+$('#odStatusPop .popup_con .button_list .ordDtlStat').on('click', function() {
+	let code = $(this).attr('code');
+	$('#searchForm input[name=chgStat]').val(code);
+	jsonObj.chgStat = code;
+	
+	$("#odStatusPop .popup_con button").removeClass("on");
+	
+	// 상태값설정
+	$("#odStatusPop .popup_con button").each(function() {
+		var tempCode = $(this).attr("code");
+		if (tempCode == code) {
+			$(this).addClass("on");
+			
+			// 상태값 명칭
+			var ordDtlStatNm = $(this).find("span").text();
+			$(".container .my_order .od_status_btn").text(ordDtlStatNm);
+		}
+	});
+	
+	// 인피니티스크롤 초기화
+	fnMypageCreListInfiniteScrollInit();
+	
+	// 데이터 조회
+	fnGetInfiniteScrollDataList();
+	
 	// 팝업 닫기
 	$(".popup_close").trigger("click");
+});
+
+// 인피니티 스크롤 초기화
+var fnMypageCreListInfiniteScrollInit = function(){
+	sessionStorage.removeItem(document.location.href);
+	
+	pageNo = 0;
+	
+	// History 초기화
+	$("#listBox").html("");
 }
 
 // 취반교 상세 페이지 이동
@@ -295,6 +310,17 @@ var fnGoToCreDetail = function(param) {
 
 	cfnGoToPage(_frontUrl + url);
 }
+
+var getTotalPage = function(param) {
+	// 전체페이지 구하기
+	totalPage 	= parseInt(param / 10);
+	remainList 	= param % 10;
+	
+	// 나머지가 있으면 전체 페이지 + 1
+	if (remainList > 0) {
+		totalPage = totalPage + 1;
+	}
+}
 /*]]>*/
 </script>
 

src/main/webapp/WEB-INF/views/mob/mypage/NoMemberCreReturnDetailFormMob.html

@@ -61,18 +61,25 @@
 										<div class="name" th:text="${returnDtl.goodsNm}"></div>
 									</div>
 									<div class="od_opt">
-										<div class="option">
-											<th:block th:if="${returnDtl.goodsType == 'G056_S'}">
-												<th:block th:each="option, status : ${returnDtl.colorNmArr}">
+										<!-- 세트상품일때 -->
+										<th:block th:if="${returnDtl.goodsType} == 'G056_S'">
+											<th:block th:each="option , index2 : ${returnDtl.colorNmArr}">
+												<div class="option">
+													<em th:text="${returnDtl.itemNmArr[index2.index]}"></em>
 													<em th:text="${option}"></em>
-													<em th:text="${returnDtl.optCd2Arr[status.index]}"></em>
-												</th:block>
+													<em th:text="${returnDtl.optCd2Arr[index2.index]}"></em>
+												</div>
 											</th:block>
-											<th:block th:unless="${returnDtl.goodsType == 'G056_S'}">
+										</th:block>
+										<!-- //세트상품일때 -->
+										<!-- 단품상품일때 -->
+										<th:block th:unless="${returnDtl.goodsType} == 'G056_S'">
+											<div class="option">
 												<em th:text="${returnDtl.colorNm}"></em>
 												<em th:text="${returnDtl.optCd2}"></em>
-											</th:block>
-										</div>
+											</div>
+										</th:block>
+										<!-- //단품상품일때 -->
 									</div>
 									<div class="od_calc">
 										<p class="price">
@@ -126,36 +133,38 @@
 				</div>
 			</div>
 		</div>
-		<div class="inner">
-			<div class="tbl_wrap">
-				<div class="tbl_tit"> 
-					<h3>반품 회수지 주소</h3>
-					<th:block th:if="${oneData.chgStat == 'G685_50' or oneData.chgStat == 'G685_51'}">
-						<button type="button" id="btn_adrsChange_pop" class="btn_popup" onclick="fnChangeDeliveryAddr();">
-							<span>회수지 변경</span>
-						</button>
-					</th:block>
-				</div>
-				<div class="tbl">
-					<div class="ship_info">
-						<dl>
-							<div class="name">
-								<dt><span class="sr-only">배송지명</span></dt>
-								<dd id="chgerNm" th:text="${oneData.chgerNm}"></dd>
-							</div>
-							<div class="addr">
-								<dt><span class="sr-only">배송주소</span></dt>
-								<dd id="chgerAddr" th:text="|${oneData.chgerBaseAddr} ${oneData.chgerDtlAddr}|"></dd>
-							</div>
-							<div class="phone">
-								<dt><span class="sr-only">휴대폰 번호</span></dt>
-								<dd id="chgerPhnno" th:text="${oneData.chgerPhnno}"></dd>
-							</div>
-						</dl>
+		<th:block th:if="${oneData.wdGb == 'W'}">
+			<div class="inner">
+				<div class="tbl_wrap">
+					<div class="tbl_tit"> 
+						<h3>반품 회수지 주소</h3>
+						<th:block th:if="${oneData.chgStat == 'G685_50' or oneData.chgStat == 'G685_51'}">
+							<button type="button" id="btn_adrsChange_pop" class="btn_popup" onclick="fnChangeDeliveryAddr();">
+								<span>회수지 변경</span>
+							</button>
+						</th:block>
+					</div>
+					<div class="tbl">
+						<div class="ship_info">
+							<dl>
+								<div class="name">
+									<dt><span class="sr-only">배송지명</span></dt>
+									<dd id="chgerNm" th:text="${oneData.chgerNm}"></dd>
+								</div>
+								<div class="addr">
+									<dt><span class="sr-only">배송주소</span></dt>
+									<dd id="chgerAddr" th:text="|${oneData.chgerBaseAddr} ${oneData.chgerDtlAddr}|"></dd>
+								</div>
+								<div class="phone">
+									<dt><span class="sr-only">휴대폰 번호</span></dt>
+									<dd id="chgerPhnno" th:text="${oneData.chgerPhnno}"></dd>
+								</div>
+							</dl>
+						</div>
 					</div>
 				</div>
 			</div>
-		</div>
+		</th:block>
 		<th:block th:if="${not #strings.isEmpty(oneData.wdInvoiceNo) and not #strings.isEmpty(oneData.shipCompNm)}">
 			<div class="inner">
 				<div class="tbl_wrap">

src/main/webapp/WEB-INF/views/mob/mypage/NoMemberExchangeFormMob.html

@@ -60,6 +60,7 @@
 											<th:block th:if="${exchange.goodsType == 'G056_S'}" th:each="option, status : ${exchange.colorNmArr}">
 												<div class="option">
 													<em th:text="${exchange.itemNmArr[status.index]}"></em>
+													<em th:text="${option}"></em>
 													<em th:text="${exchange.optCd2Arr[status.index]}"></em>
 												</div>
 											</th:block>
@@ -78,6 +79,7 @@
 												<span>교환옵션</span>
 												<div class="option">
 													<em th:text="${exchange.itemNmArr[status.index]}"></em>
+													<em th:text="${option}"></em>
 													<em th:text="${exchange.optCd2Arr[status.index]}"></em>
 												</div>
 											</th:block>

src/main/webapp/WEB-INF/views/mob/mypage/NoMemberOrderListFormMob.html

@@ -76,7 +76,7 @@
 		<div class="popup_con">
 			<div class="button_list clear">
 				<button type="button" onclick="fnSetSearchPeriod(1);" period="1"><span>최근 1개월</span></button>
-				<button type="button" onclick="fnSetSearchPeriod(3);" period="3"><span>최근 3개월</span></button>
+				<button type="button" class="on" onclick="fnSetSearchPeriod(3);" period="3"><span>최근 3개월</span></button>
 				<button type="button" onclick="fnSetSearchPeriod(6);" period="6"><span>최근 6개월</span></button>
 				<button type="button" onclick="fnSetSearchPeriod(9);" period="9"><span>최근 9개월</span></button>
 				<button type="button" onclick="fnSetSearchPeriod(12);" period="12"><span>최근 12개월</span></button>
@@ -105,6 +105,9 @@
 	</div>
 </div>
 <!-- //주문상태 선택 팝업 -->
+
+<script src="/ux/plugins/gaga/gaga.infinite.scrollSession.js"></script>
+<script src="/ux/plugins/jquery/jquery.history.min.js"></script>
 <script th:inline="javascript">
 // 변수설정
 let ordNo			= [[${ordNo}]];
@@ -114,14 +117,9 @@ var totalCnt		= [[${totalCnt}]];
 var totalPage		= 0;
 var remainList		= 0;
 var jsonObj 		= {};
-var scrollTemp		= true;
 
 // 초기설정
 $(document).ready(function() {
-	
-	// 인피니티스크롤 초기화
-	//fnGoodsReviewInfiniteScrollInit();
-
 	// 타이틀명
 	$('#htopTitle').text('마이페이지');
 
@@ -137,76 +135,27 @@ $(document).ready(function() {
 		, "ordNm"			: ordNm
 		, "ordPhnno"		: ordPhnno
 	}
-	
-	// AJAX 변수 설정
-	jsonData = JSON.stringify(jsonObj);
-
-	// 전체페이지 구하기
-	totalPage 	= parseInt(totalCnt / 10);
-	remainList 	= totalCnt % 10;
+});
 
-	// 나머지가 있으면 전체 페이지 + 1
-	if (remainList > 0) {
-		totalPage = totalPage + 1;
+//사파리 - event.persisted || 크롬 - window.performance.navigation.type 이 1이면 새로고침, 2면 페이지 이동을 통한 캐쉬페이징
+$(window).on("pageshow", function(event) {
+	if ((event.originalEvent && event.originalEvent.persisted) || (window.performance && window.performance.navigation.type == 2)) {
+		// 캐쉬페이징
+	} else {
+		// 인피니티스크롤 초기화
+		fnMypageOrderListInfiniteScrollInit();
 	}
-
-	fnSetSearchPeriod(3);
-
-	var win = $(window);
-
-	// Each time the user scrolls
-	win.scroll(function() {
-		// End of the document reached?
-		if ($(document).height() - win.height() == win.scrollTop()) {
-			if (scrollTemp) {
-				var tempPage 	= parseInt($("#searchForm input[name=pageNo]").val());
-				tempPage 		= tempPage + 1;
-
-				if (totalPage > tempPage) {
-					scrollTemp = false;
-					fnGetInfiniteScrollDataList(tempPage);
-				}
-			}
-		}
-	});
-
-	// 주문상세상태코드 셀렉트박스 변경 이벤트
-	$('#odStatusPop .popup_con .button_list .ordDtlStat').on('click', function() {
-		let code = $(this).attr('code');
-		$('#searchForm input[name=ordDtlStat]').val(code);
-		jsonObj.ordDtlStat = code;
-
-		$("#odStatusPop .popup_con button").removeClass("on");
-
-		// 상태값설정
-		$("#odStatusPop .popup_con button").each(function() {
-			var tempCode = $(this).attr("code");
-			if (tempCode == code) {
-				$(this).addClass("on");
-
-				// 상태값 명칭
-				var ordDtlStatNm = $(this).find("span").text();
-				$(".container .my_order .od_status_btn").text(ordDtlStatNm);
-			}
-		});
-
-		// 리헷
-		$("#listBox").html("");
-
-		// 초기화설정
-		fnGetInfiniteScrollDataList(1);
-
-		// 팝업 닫기
-		$(".popup_close").trigger("click");
-	});
+	
+	gagaInfiniteScroll.getHistory();
 });
 
 // 주문 목록 조회
-var fnGetInfiniteScrollDataList = function(pageNo) {
-
-	// 페이지번호가 없으면 1페이지 설정
-	if (pageNo == null || pageNo == 0) {
-		pageNo = 1;
+var fnGetInfiniteScrollDataList = function() {
+	// 2021.05.28 페이지 기능 수정
+	if (pageNo <= totalPage) {
+		pageNo++;
+	} else {
+		return false;
 	}
 	
 	// 페이지설정
@@ -215,35 +164,15 @@ var fnGetInfiniteScrollDataList = function(pageNo) {
 	jsonObj.pageNo = pageNo;
 	jsonObj.stDate = $("#searchForm input[name=stDate]").val();
 	jsonObj.edDate = $("#searchForm input[name=edDate]").val();
-	
-	//$.ajax( {
-	//	type		: "POST",
-	//	url 		: '/noMember/order/listInfo',
-	//	data		: JSON.stringify(jsonObj),
-	//	dataType 	: 'html',
-	//	beforeSend : function(xhr, settings) {
-	//		xhr.setRequestHeader("AJAX"			, "true");
-	//		xhr.setRequestHeader('Accept'		, 'application/json');
-	//		xhr.setRequestHeader('Content-Type'	, 'application/json');
-	//	},
-	//	success 	: function(result) {
-	//		if (result != null) {
-	//			$("#listBox").css("display", "block");
-	//			$("#listBox").append(result);
-	//			scrollTemp = true;
-	//			
-	//			// 인피니티 스크롤 기억기능
-	//			//gagaInfiniteScroll.draw(result);
-	//			//gagaInfiniteScroll.draw('not');
-	//		}
-	//	}
-	//});
+	jsonObj.ordDtlStat = $('#searchForm input[name=ordDtlStat]').val();
 	
 	gagajf.ajaxJsonSubmit('/noMember/order/list/pre/info', JSON.stringify(jsonObj), function(result) {
 		let totalCount = result.paging.totalCount;
 		totalCnt = totalCount;
+		
 		getTotalPage(totalCount);
-		//gagaInfiniteScroll.pageStatus.totalCount = totalCount;
+		
+		gagaInfiniteScroll.pageStatus.totalCount = totalCount;
 		
 		let ordNoList = [];
 		$.each(result.ordNoList, function(idx, item) {
@@ -266,8 +195,7 @@ var fnGetInfiniteScrollDataList = function(pageNo) {
 				success: function (result) {
 					if (result != null) {
 						$("#listBox").css("display", "block");
-						$("#listBox").append(result);
-						scrollTemp = true;
+						gagaInfiniteScroll.draw(result);
 					}
 				}
 			});
@@ -293,11 +221,8 @@ var fnSetSearchPeriod = function(period) {
 	$('#searchForm input[name=edDate]').val(edDate);
 	$('#searchForm input[name=stDate]').val(stDate);
 	
-	// 리헷
-	$("#listBox").html("");
-	
-	// 초기화설정
-	fnGetInfiniteScrollDataList(1);
+	// 인피니티스크롤 초기화
+	fnMypageOrderListInfiniteScrollInit();
 	
 	$("#odDatePop .popup_con button").removeClass("on");
 	
@@ -312,42 +237,53 @@ var fnSetSearchPeriod = function(period) {
 			$(".container .my_order .od_date_btn").text(periodStr);
 		}
 	});
-
+	
+	// 데이터 조회
+	fnGetInfiniteScrollDataList();
+	
 	// 팝업닫기
 	$(".popup_close").trigger("click");
 }
 
-// 2021.04.21 인피니티 스크롤 기능 구현전 추후 수정
-// 인피니트 스크롤 초기화
-/*
-var fnGoodsReviewInfiniteScrollInit = function(){
-	// sessionStorage.removeItem(document.location.href);
-	History.replaceState(null, null);
-	gagaInfiniteScroll.pageStatus = {
-			  pageNum 			: []      // [0,1,2...] 로드된 페이지 (Array)
-			, loadPage 			: 0      // 로드할 페이지
-			, loadAlign 		: 'not' // 로드 상태(prev, next, not)
-			, historyScroll 	: 0 //
-			, nowPage 			: null    // 현재 페이지
-			, pageUrl 			: {       // page url
-				
-			}
-	}
+// 주문상세상태코드 셀렉트박스 변경 이벤트
+$('#odStatusPop .popup_con .button_list .ordDtlStat').on('click', function() {
+	let code = $(this).attr('code');
+	$('#searchForm input[name=ordDtlStat]').val(code);
+	jsonObj.ordDtlStat = code;
 	
-	//History 초기화
-	$("#listBox").html("");
-}
+	$("#odStatusPop .popup_con button").removeClass("on");
+	
+	// 상태값설정
+	$("#odStatusPop .popup_con button").each(function() {
+		var tempCode = $(this).attr("code");
+		if (tempCode == code) {
+			$(this).addClass("on");
+			
+			// 상태값 명칭
+			var ordDtlStatNm = $(this).find("span").text();
+			$(".container .my_order .od_status_btn").text(ordDtlStatNm);
+		}
+	});
+	
+	// 인피니티스크롤 초기화
+	fnMypageOrderListInfiniteScrollInit();
+	
+	// 데이터 조회
+	fnGetInfiniteScrollDataList();
+	
+	// 팝업 닫기
+	$(".popup_close").trigger("click");
+});
 
-var fnDrawInfiniteScrollData = function (result){
-	let totalCnt 								= result.totalCnt;
-	gagaInfiniteScroll.pageStatus.totalCount 	= result.totalCnt;
+// 인피니티 스크롤 초기화
+var fnMypageOrderListInfiniteScrollInit = function(){
+	sessionStorage.removeItem(document.location.href);
 	
-	var htm = fnCreateGoodsList(result);
-	gagaInfiniteScroll.draw(htm);
+	pageNo = 0;
+	
+	// History 초기화
+	$("#listBox").html("");
 }
-
-$(function() { gagaInfiniteScroll.getHistory(); });
-*/
 </script>
 
 <script>

src/main/webapp/WEB-INF/views/mob/mypage/NoMemberReturnFormMob.html

@@ -60,16 +60,25 @@
 											<div class="name" th:text="${return.goodsNm}"></div>
 										</div>
 										<div class="od_opt">
-											<div class="option">
-												<th:block th:if="${return.goodsType == 'G056_S'}" th:each="option, status : ${return.colorNmArr}">
-													<em th:text="${return.itemNmArr[status.index]}"></em>
-													<em th:text="${return.optCd2Arr[status.index]}"></em>
+											<!-- 세트상품일때 -->
+											<th:block th:if="${return.goodsType} == 'G056_S'">
+												<th:block th:each="option , index2 : ${return.colorNmArr}">
+													<div class="option">
+														<em th:text="${return.itemNmArr[index2.index]}"></em>
+														<em th:text="${option}"></em>
+														<em th:text="${return.optCd2Arr[index2.index]}"></em>
+													</div>
 												</th:block>
-												<th:block th:unless="${return.goodsType == 'G056_S'}">
+											</th:block>
+											<!-- //세트상품일때 -->
+											<!-- 단품상품일때 -->
+											<th:block th:unless="${return.goodsType} == 'G056_S'">
+												<div class="option">
 													<em th:text="${return.colorNm}"></em>
 													<em th:text="${return.optCd2}"></em>
-												</th:block>
-											</div>
+												</div>
+											</th:block>
+											<!-- //단품상품일때 -->
 										</div>
 										<div class="od_calc">
 											<th:block th:if="${(return.ordAmt - return.cnclRtnAmt) > (return.realOrdAmt + return.pntDcAmt + return.gfcdUseAmt)}">

src/main/webapp/WEB-INF/views/web/mypage/MypageCreExchangeDetailFormWeb.html

@@ -102,7 +102,7 @@
 										<div class="button_box">
 <!--											<p th:if="${exchangeDtl.chgStat == 'G685_20' or exchangeDtl.chgStat == 'G685_21'}"><button type="button" class="btn btn_default btn_sm" th:attr="ordNo=${exchangeDtl.ordNo}, ordChgSq=${exchangeDtl.ordChgSq}, cancelGb=${exchangeDtl.chgGb}" onclick="fnCreCancel(this);"><span>신청취소</span></button></p>-->
 											<p th:if="${exchangeDtl.chgStat == 'G685_32' or exchangeDtl.chgStat == 'G685_21'}"><button type="button" class="btn btn_default btn_sm" th:attr="ordNo=${exchangeDtl.ordNo}, ordChgSq=${exchangeDtl.ordChgSq}" onclick="fnCrePayAddCost(this);"><span>결제하기</span></button></p>
-											<p th:if="${exchangeDtl.chgStat == 'G685_40' and  xchangeDtl.ordDtlStat == 'G013_50'}"><button type="button" class="btn btn_default btn_sm" th:attr="ordNo=${exchangeDtl.ordNo}, ordDtlNo=${exchangeDtl.ordDtlNo}, shipCompCd=${exchangeDtl.exchangeShipCompCd}, invoiceNo=${exchangeDtl.exchangeInvoiceNo}" onclick="fnGoToDelivery(this);"><span>배송조회</span></button></p>
+											<p th:if="${exchangeDtl.chgStat == 'G685_40' and exchangeDtl.ordDtlStat == 'G013_50'}"><button type="button" class="btn btn_default btn_sm" th:attr="ordNo=${exchangeDtl.ordNo}, ordDtlNo=${exchangeDtl.ordDtlNo}, shipCompCd=${exchangeDtl.exchangeShipCompCd}, invoiceNo=${exchangeDtl.exchangeInvoiceNo}" onclick="fnGoToDelivery(this);"><span>배송조회</span></button></p>
 											<p><button type="button" class="btn btn_default btn_sm" onclick="cfnGoToPage(_PAGE_ONETOONE_QNA_REG);"><span>1:1 문의</span></button></p>
 										</div>
 									</div>