2024-03-21 14:15 마이페이지 성능개선을 위해서 이용내역 ajax로 분리 처리함

2024-03-21 14:15:57 +09:00 · 2024-03-21 14:15:57 +09:00 · f02d3bfd5c
commit f02d3bfd5c
parent bf289e9e42
6 changed files with 302 additions and 93 deletions
--- a/src/main/java/itn/let/uat/uia/web/EgovMypageController.java
+++ b/src/main/java/itn/let/uat/uia/web/EgovMypageController.java
@ -293,6 +293,9 @@ public class EgovMypageController {
 			model.addAttribute("mberManageVO", mberManageVO);
 		}
 		
+		/*
+		 * #1.로딩 문제 해결을 위해 ajax로 이전	2024-03-21
+		 * 								/web/user/subcontent/mberInfo_cash_pointAjax.do
 		{//캐시 정보
 			List<MjonPayVO> cashInfoList = mjonPayService.selectCashInfoList(userId);
 			model.addAttribute("cashInfoList", cashInfoList);
@ -302,9 +305,15 @@ public class EgovMypageController {
 			List<MjonPayVO> pointInfoList = mjonPayService.selectPointInfoList(userId);
 			model.addAttribute("pointInfoList", pointInfoList);
 		}
+		*/
+		
 		MjonMsgVO mjonMsgVO = new MjonMsgVO();
 		mjonMsgVO.setUserId(userId);
 		
+		/*
+  		 * #2.로딩 문제 해결을 위해 ajax로 이전	2024-03-21
+		 * 								/web/user/subcontent/mberInfo_send_reservAjax.do
+		 *
 		{ // 발송건수
 			mjonMsgVO.setReserveYn("N");
 			List<MjonMsgVO>  sendTotList = mjonMsgService.selectWithKakaoSendTotCnt(mjonMsgVO);
@ -316,7 +325,7 @@ public class EgovMypageController {
 			List<MjonMsgVO>  reservToList = mjonMsgService.selectWithKakaoSendTotCnt(mjonMsgVO);
 			model.addAttribute("reservToList", reservToList);
 		}
-		
+		*/
 		
 		
 		{// 충전캐시
@ -329,12 +338,14 @@ public class EgovMypageController {
 			model.addAttribute("sumPoint", sumPoint);
 		}
 		
+		/*
 		{// 총 사용금액
 			MjonPayVO mjonPayVO = new MjonPayVO();
 			mjonPayVO.setUserId(userId);
 			List<MjonPayVO>  usedCashTotList = mjonPayService.selectUsedCashWithKakaoTotCnt(mjonPayVO);	
 			model.addAttribute("usedCashTotList", usedCashTotList);
 		}
+		*/
 		
 		{// 사용가능한 금액
 			MberManageVO mberManageVO = mjonMsgDataService.selectMberManageInfo(userId);
@ -437,6 +448,75 @@ public class EgovMypageController {
 		return "web/user/mberInfoIndex";
 	}
 	
+    /**
+     * 마이페이지 - 이용내역	-	ajax
+     * @param mjonMsgVO
+     * @param model
+     * @return	"/web/member/pay/PayUserListAjax.do"
+     * @throws Exception
+     */
+	@RequestMapping(value="/web/user/subcontent/mberInfo_cash_pointAjax.do")
+    public String mberInfo_cash_pointAjax(@ModelAttribute("searchVO") MjonMsgVO mjonMsgVO,
+    		HttpServletRequest request,
+    		ModelMap model) throws Exception{
+    	
+		System.out.println("mberInfo_cash_pointAjax");
+		
+    	LoginVO	loginVO = (LoginVO)EgovUserDetailsHelper.getAuthenticatedUser();
+    	String userId = loginVO == null ? "" : EgovStringUtil.isNullToString(loginVO.getId());
+
+		
+		{//캐시 정보
+			List<MjonPayVO> cashInfoList = mjonPayService.selectCashInfoList(userId);
+			model.addAttribute("cashInfoList", cashInfoList);
+		}
+		
+		{//포인트 정보
+			List<MjonPayVO> pointInfoList = mjonPayService.selectPointInfoList(userId);
+			model.addAttribute("pointInfoList", pointInfoList);
+		}
+		
+		System.out.println("mberInfo_cash_pointAjax_end");
+    	
+    	return "/web/user/subcontent/mberInfo_cash_pointAjax";
+    }
+	
+    /**
+     * 마이페이지 - 이용내역	-	발송건수/예약건수	ajax
+     * @param mjonMsgVO
+     * @param model
+     * @return	"/web/member/pay/PayUserListAjax.do"
+     * @throws Exception
+     */
+	@RequestMapping(value="/web/user/subcontent/mberInfo_send_reservAjax.do")
+    public String mberInfo_send_reservAjax(    		
+    		HttpServletRequest request,
+    		ModelMap model) throws Exception{
+    	
+		System.out.println("mberInfo_cash_pointAjax");
+		
+    	LoginVO	loginVO = (LoginVO)EgovUserDetailsHelper.getAuthenticatedUser();
+    	String userId = loginVO == null ? "" : EgovStringUtil.isNullToString(loginVO.getId());
+
+		MjonMsgVO mjonMsgVO = new MjonMsgVO();
+		mjonMsgVO.setUserId(userId);
+		
+		{ // 발송건수
+			mjonMsgVO.setReserveYn("N");
+			List<MjonMsgVO>  sendTotList = mjonMsgService.selectWithKakaoSendTotCnt(mjonMsgVO);
+			model.addAttribute("sendTotList", sendTotList);
+		}
+		
+		{ // 예약건수
+			mjonMsgVO.setReserveYn("Y");
+			List<MjonMsgVO>  reservToList = mjonMsgService.selectWithKakaoSendTotCnt(mjonMsgVO);
+			model.addAttribute("reservToList", reservToList);
+		}
+		
+		System.out.println("mberInfo_cash_pointAjax_end");
+    	
+    	return "/web/user/subcontent/mberInfo_send_reservAjax";
+    }
 	
 	//발송문자 건수 계산하는 함수
 	public String[] getTotalSendCnt(List<MjonMsgSentVO> mjonMsgSentVO) {
--- a/src/main/resources/egovframework/sqlmap/let/msg/MjonMsgData_SQL_mysql.xml
+++ b/src/main/resources/egovframework/sqlmap/let/msg/MjonMsgData_SQL_mysql.xml
@ -6605,6 +6605,7 @@

 	<!-- 사용자 총 사용금액 조회(카카오 테스트용) -->
 	<select id="mjonMsgDAO.selectWithKakaoSendTotCnt" parameterClass="mjonMsgVO" resultClass="mjonMsgVO">
+		/*	mjonMsgDAO.selectWithKakaoSendTotCnt	*/
 		WITH TBL AS
 		(
 			SELECT
--- a/src/main/resources/egovframework/sqlmap/let/pay/MjonPay_SQL_mysql.xml
+++ b/src/main/resources/egovframework/sqlmap/let/pay/MjonPay_SQL_mysql.xml
@ -2149,6 +2149,7 @@
 	</select>
 	
 	<select id="mjonPayDAO.selectUsedCashWithKakaoTotCnt" parameterClass="mjonPayVO" resultClass="mjonPayVO">
+		/*	mjonPayDAO.selectUsedCashWithKakaoTotCnt	*/
 		SELECT
 			'CASH' AS divFlag
 			, ifnull(ROUND(SUM(M.eachPrice) + (SUM(M.totalPrice) * 0), 2), 0) AS totalPrice
--- a/src/main/webapp/WEB-INF/jsp/web/user/mberInfoIndex.jsp
+++ b/src/main/webapp/WEB-INF/jsp/web/user/mberInfoIndex.jsp
@ -40,6 +40,11 @@ $(document).ready(function(){
 	
 	thisYearStart = date.getFullYear() + "/01/01" ;
 	thisYearEnd = date.getFullYear() + "/12/31" ;
+
+	//이용내역 loading
+	subContent();			//이용내역 총금액
+
+	subContentSendReserv();	//발송,예약건수
 });

 //기간 요일 지정
@ -68,6 +73,76 @@ function payUserListAjax(pageNo){
 	});
 }

+//마이페이지 - 세부내역
+function subContent(p_content_no){	
+	
+	var sendData =  $(document.listForm).serializeArray();
+	var v_html_pre	=	'<table>'
+			+	'<caption>구분, 충전금액, 사용금액, 잔액 등 정보를 제공하는 표</caption>'
+			+	'<colgroup>'
+			+	'<col style="width: 115px;">'
+			+	'<col style="width: calc((100% - 115px)/3);">'
+			+	'<col style="width: calc((100% - 115px)/3);">'
+			+	'<col style="width: calc((100% - 115px)/3);">'
+			+	'</colgroup>'
+			+	'<thead>'
+			+	'<tr>'
+			+	'<th scope="col">구분</th>'
+			+	'<th scope="col">충전금액</th>'
+			+	'<th scope="col">사용금액</th>'
+			+	'<th scope="col">잔액</th>'
+			+	'</tr>'
+			+	'</thead>'
+			+	'<tbody>'
+			+	'<tr><td colspan="4">LOADING...</td></tr>'
+			+	'</tbody>'
+			+	'</table>';
+	//$("#prePaymentYn_Y").html('<div class="list_info"><table class="tType4"><tbody><tr><td colspan="12">LOADING...</td></tr></tbody></table></div>');
+	$("#prePaymentYn_Y").html(v_html_pre);
+
+		
+	
+	$("#prePaymentYn_Y").load("/web/user/subcontent/mberInfo_cash_pointAjax.do", sendData ,function(response, status, xhr){
+	});
+	
+}
+
+//마이페이지 - 세부내역	-	발송/예약건수
+function subContentSendReserv(p_content_no){	
+	
+	var sendData =  $(document.listForm).serializeArray();
+	var v_html_pre	=	'<table>'
+			+	'<caption>구분, 문자, 알림톡, 친구톡, 팩스, 계 등 정보를 제공하는 표</caption>'
+			+	'<colgroup>'
+			+	'<col style="width: calc(100% / 5);">'
+			+	'<col style="width: calc(100% / 5);">'
+			+	'<col style="width: calc(100% / 5);">'
+			+	'<col style="width: calc(100% / 5);">'
+			+	'<col style="width: calc(100% / 5);">'
+			+	'</colgroup>'
+			+	'<thead>'
+			+	'<tr>'
+			+	'<th scope="col">구분</th>'
+			+	'<th scope="col">문자</th>'
+			+	'<th scope="col">알림톡</th>'
+			+	'<th scope="col">팩스</th>'
+			+	'<th scope="col">계</th>'
+			+	'</tr>'
+			+	'</thead>'			
+			+	'<tbody>'
+			+	'<tr><td colspan="5">LOADING...</td></tr>'
+			+	'</tbody>'
+			+	'</table>';
+	//$("#prePaymentYn_Y").html('<div class="list_info"><table class="tType4"><tbody><tr><td colspan="12">LOADING...</td></tr></tbody></table></div>');
+	$("#send_reserv").html(v_html_pre);
+
+		
+	
+	$("#send_reserv").load("/web/user/subcontent/mberInfo_send_reservAjax.do", sendData ,function(response, status, xhr){
+	});
+	
+}
+
 //[문자]상세보기 버튼 실행
 function fnRevDetailPop(msgGroupId, fileCnt){
 	document.resPopForm.msgGroupId.value = msgGroupId;
@ -370,43 +445,8 @@ function getMberGrdChk() {
 					<c:choose>
 						<c:when test="${mberManageVO.prePaymentYn eq 'Y'}">
 							<p class="reqTxt2">(단위 : 건, 원)</p>
-							<div class="table_wrap">
-								<table>
-									<caption>구분, 충전금액, 사용금액, 잔액 등 정보를 제공하는 표</caption>
-									<colgroup>
-										<col style="width: 115px;">
-										<col style="width: calc((100% - 115px)/3);">
-										<col style="width: calc((100% - 115px)/3);">
-										<col style="width: calc((100% - 115px)/3);">
-									</colgroup>
-									<thead>
-										<tr>
-											<th scope="col">구분</th>
-											<th scope="col">충전금액</th>
-											<th scope="col">사용금액</th>
-											<th scope="col">잔액</th>
-										</tr>
-									</thead>
-									<tbody>
-										<tr>
-											<td>캐시</td>
-											<c:forEach var="cashInfo" items="${cashInfoList}" varStatus="status">
-											<td>
-												<fmt:formatNumber value="${cashInfo.cashSum}" pattern="" />
-											</td>
-											</c:forEach>
-										</tr>
-										<tr>
-											<td>포인트</td>
-											<c:forEach var="pointInfo" items="${pointInfoList}" varStatus="status">
-											<td>
-												<fmt:formatNumber value="${pointInfo.sumPay}" pattern="" />
-											</td>
-											</c:forEach>
-										</tr>
-									</tbody>
-								</table>
-							</div>
+							<div class="table_wrap" id="prePaymentYn_Y">
+							</div>							
 						</c:when>
 						<c:otherwise>
 							<p class="reqTxt2">(단위 : 건, 원) VAT 별도</p>
@ -487,61 +527,8 @@ function getMberGrdChk() {
 					<button type="button" onclick="location.href='/web/member/pay/PayUserSWList.do';">
 						<img src="/publish/images/content/mypage_plus.png" alt="더보기">
 					</button>
-					<div class="table_wrap">
-						<table>
-							<caption>구분, 문자, 알림톡, 친구톡, 팩스, 계 등 정보를 제공하는 표</caption>
-							<colgroup>
-								<col style="width: calc(100% / 5);">
-								<col style="width: calc(100% / 5);">
-								<col style="width: calc(100% / 5);">
-								<col style="width: calc(100% / 5);">
-								<col style="width: calc(100% / 5);">
-							</colgroup>
-							<thead>
-								<tr>
-									<th scope="col">구분</th>
-									<th scope="col">문자</th>
-									<th scope="col">알림톡</th>
-									<th scope="col">팩스</th>
-									<th scope="col">계</th>
-								</tr>
-							</thead>
-							<tbody>
-								<tr>
-									<td>발송건(매)수</td>
-									<c:set var="sandSum" value="0"/>
-									<c:forEach var="sendToInfo" items="${sendTotList}" varStatus="status">
-									<td>
-										<fmt:formatNumber value="${sendToInfo.totCnt}" pattern="" />
-										<c:if test="${sendToInfo.msgType eq 'fax' && sendToInfo.fileCnt ne '0'}">
-											(<c:out value="${sendToInfo.fileCnt }"/>)
-										</c:if>
-									</td>
-									<c:set var="sandSum" value="${sandSum + sendToInfo.totCnt}"/>
-									</c:forEach>
-									<td>
-										<fmt:formatNumber value="${sandSum}" pattern="" />
-									</td>
-								</tr>
-								<tr>
-									<td>예약건(매)수</td>
-									<c:set var="reservSum" value="0"/>
-									<c:forEach var="reservToInfo" items="${reservToList}" varStatus="status">
-									<td>
-										<fmt:formatNumber value="${reservToInfo.totCnt}" pattern="" />
-										<c:if test="${reservToInfo.msgType eq 'fax' && reservToInfo.fileCnt ne '0'}">
-											(<c:out value="${reservToInfo.fileCnt }"/>)
-										</c:if>
-									</td>
-									<c:set var="reservSum" value="${reservSum + reservToInfo.totCnt}"/>
-									</c:forEach>
-									<td>
-										<fmt:formatNumber value="${reservSum}" pattern="" />
-									</td>
-								</tr>
-							</tbody>
-						</table>
-					</div>
+					<div class="table_wrap" id="send_reserv">
+					</div>					
 				</div>
 				<p class="tType1_title">
 					<img src="/publish/images/content/icon_details_breakdown.png" alt="알림톡 아이콘 이미지">세부내역
--- a/src/main/webapp/WEB-INF/jsp/web/user/subcontent/mberInfo_cash_pointAjax.jsp
+++ b/src/main/webapp/WEB-INF/jsp/web/user/subcontent/mberInfo_cash_pointAjax.jsp
@ -0,0 +1,61 @@
+<%--
+  Class Name : mberInfo_cash_point.jsp
+  Description : 마이페이지 - 이용내역 캐시&포인트
+  Modification Information
+
+      수정일         수정자                   수정내용
+    -------    --------    ---------------------------
+    2021.03.31    신명섭          최초 생성
+
+    Copyright (C) 2009 by ITN  All right reserved.
+--%>
+<%@ page contentType="text/html; charset=utf-8"%>
+<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
+<%@ taglib prefix="ui" uri="http://egovframework.gov/ctl/ui"%>
+<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
+<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
+<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
+<%@ taglib prefix="ec" uri="/WEB-INF/tld/ecnet_tld.tld"%>
+
+<script src="/publish/js/content.js"></script>
+<script>
+$(document).ready(function(){
+
+});
+
+</script>
+								<table>
+									<caption>구분, 충전금액, 사용금액, 잔액 등 정보를 제공하는 표</caption>
+									<colgroup>
+										<col style="width: 115px;">
+										<col style="width: calc((100% - 115px)/3);">
+										<col style="width: calc((100% - 115px)/3);">
+										<col style="width: calc((100% - 115px)/3);">
+									</colgroup>
+									<thead>
+										<tr>
+											<th scope="col">구분</th>
+											<th scope="col">충전금액</th>
+											<th scope="col">사용금액</th>
+											<th scope="col">잔액</th>
+										</tr>
+									</thead>
+									<tbody>
+										<tr>
+											<td>캐시</td>
+											<c:forEach var="cashInfo" items="${cashInfoList}" varStatus="status">
+											<td>
+												<fmt:formatNumber value="${cashInfo.cashSum}" pattern="" />
+											</td>
+											</c:forEach>
+										</tr>
+										<tr>
+											<td>포인트</td>
+											<c:forEach var="pointInfo" items="${pointInfoList}" varStatus="status">
+											<td>
+												<fmt:formatNumber value="${pointInfo.sumPay}" pattern="" />
+											</td>
+											</c:forEach>
+										</tr>
+									</tbody>
+								</table>
--- a/src/main/webapp/WEB-INF/jsp/web/user/subcontent/mberInfo_send_reservAjax.jsp
+++ b/src/main/webapp/WEB-INF/jsp/web/user/subcontent/mberInfo_send_reservAjax.jsp
@ -0,0 +1,79 @@
+<%--
+  Class Name : mberInfo_cash_point.jsp
+  Description : 마이페이지 - 이용내역 캐시&포인트
+  Modification Information
+
+      수정일         수정자                   수정내용
+    -------    --------    ---------------------------
+    2021.03.31    신명섭          최초 생성
+
+    Copyright (C) 2009 by ITN  All right reserved.
+--%>
+<%@ page contentType="text/html; charset=utf-8"%>
+<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
+<%@ taglib prefix="ui" uri="http://egovframework.gov/ctl/ui"%>
+<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
+<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
+<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
+<%@ taglib prefix="ec" uri="/WEB-INF/tld/ecnet_tld.tld"%>
+
+<script src="/publish/js/content.js"></script>
+<script>
+$(document).ready(function(){
+
+});
+
+</script>
+						<table>
+							<caption>구분, 문자, 알림톡, 친구톡, 팩스, 계 등 정보를 제공하는 표</caption>
+							<colgroup>
+								<col style="width: calc(100% / 5);">
+								<col style="width: calc(100% / 5);">
+								<col style="width: calc(100% / 5);">
+								<col style="width: calc(100% / 5);">
+								<col style="width: calc(100% / 5);">
+							</colgroup>
+							<thead>
+								<tr>
+									<th scope="col">구분</th>
+									<th scope="col">문자</th>
+									<th scope="col">알림톡</th>
+									<th scope="col">팩스</th>
+									<th scope="col">계</th>
+								</tr>
+							</thead>
+							<tbody>
+								<tr>
+									<td>발송건(매)수</td>
+									<c:set var="sandSum" value="0"/>
+									<c:forEach var="sendToInfo" items="${sendTotList}" varStatus="status">
+									<td>
+										<fmt:formatNumber value="${sendToInfo.totCnt}" pattern="" />
+										<c:if test="${sendToInfo.msgType eq 'fax' && sendToInfo.fileCnt ne '0'}">
+											(<c:out value="${sendToInfo.fileCnt }"/>)
+										</c:if>
+									</td>
+									<c:set var="sandSum" value="${sandSum + sendToInfo.totCnt}"/>
+									</c:forEach>
+									<td>
+										<fmt:formatNumber value="${sandSum}" pattern="" />
+									</td>
+								</tr>
+								<tr>
+									<td>예약건(매)수</td>
+									<c:set var="reservSum" value="0"/>
+									<c:forEach var="reservToInfo" items="${reservToList}" varStatus="status">
+									<td>
+										<fmt:formatNumber value="${reservToInfo.totCnt}" pattern="" />
+										<c:if test="${reservToInfo.msgType eq 'fax' && reservToInfo.fileCnt ne '0'}">
+											(<c:out value="${reservToInfo.fileCnt }"/>)
+										</c:if>
+									</td>
+									<c:set var="reservSum" value="${reservSum + reservToInfo.totCnt}"/>
+									</c:forEach>
+									<td>
+										<fmt:formatNumber value="${reservSum}" pattern="" />
+									</td>
+								</tr>
+							</tbody>
+						</table>