itn 2023-06-14
주소록 대량등록 성능개선(브라우저 응답없음 창 노출안되도록 로딩바 처리)
@a68d83c52da886b0504640bc2a743d02fce8f924
src/main/webapp/WEB-INF/jsp/layout/include/defaultResource.jsp
--- src/main/webapp/WEB-INF/jsp/layout/include/defaultResource.jsp
+++ src/main/webapp/WEB-INF/jsp/layout/include/defaultResource.jsp
@@ -71,7 +71,7 @@
 				<script type="text/javascript" src="/js/fileupload/jquery.fileupload.js"></script>
 		
 		<script type="text/javascript" src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
-		<script type="text/javascript" src="/js/MJUtill.js?date=202301070009"></script>
+		<script type="text/javascript" src="/js/MJUtill.js?date=202306140010"></script>
 		
 		<!-- Uncaught TypeError: e.widget is not a function로 인해 가장 마지막에 선언_이준호_220510 -->
 		<script type="text/javascript" src="/dist/js/jquery_wrapper.min.js"></script>
src/main/webapp/WEB-INF/jsp/web/addr/AddrList.jsp
--- src/main/webapp/WEB-INF/jsp/web/addr/AddrList.jsp
+++ src/main/webapp/WEB-INF/jsp/web/addr/AddrList.jsp
@@ -12,6 +12,15 @@
 var tableErrorCheckData = [];
 var addrMassDupliSaveList = null;
 
+var gArrRestartIndex = 0;	//배열 재시작카운드
+var gNameList = [];		//치환문자 이름
+var gPhoneList = [];	//받는사람
+var gInfo1List = [];		//치환문자1
+var gInfo2List = [];		//치환문자2
+var gInfo3List = [];		//치환문자3
+var gInfo4List = [];		//치환문자4
+var gMemoList = [];			//메모
+
 $(document).ready(function(){
 	listAddrGrp();
 	addrLoadAjax();
@@ -225,7 +234,7 @@
 			alert("붙여넣을 연락처를 복사해주세요.");
 			return false;
 		}else{
-			if (elmLen > 20000) {
+			if (elmLen > 20001) {
 				alert("2만줄 이상의 업로드는 데이터 부하로 업로드 할수 없습니다.");
 				return false;
 			}			
@@ -887,9 +896,18 @@
 	return isReturn;	
 }
 
+
 //저장
 function SetAddrMassSave(){
-
+	gArrRestartIndex = 0;	//배열 재시작카운드
+	gNameList = [];		//치환문자 이름
+	gPhoneList = [];	//받는사람
+	gInfo1List = [];		//치환문자1
+	gInfo2List = [];		//치환문자2
+	gInfo3List = [];		//치환문자3
+	gInfo4List = [];		//치환문자4
+	gMemoList = [];			//메모
+	
 	var selectedData = tableR.getRows();
 	if (selectedData == "" || selectedData == null) {
 		alert("한 개 이상의 연락처를 입력하세요");
@@ -900,13 +918,9 @@
 		return false;
 	}
 	
-	// 주소록 이름에 이모지 체크
-// 	if(!addrEmojiCheck(selectedData, tableR)) return false;
-	
 	var selectMassVal = $("#addrGrpIdInfo option:selected").val();
 	
 	var loginVO = '${LoginVO}';
-
 	if(loginVO == "" || loginVO == null){
 		alert("로그인 후 이용이 가능합니다.");
 		return false;
@@ -925,169 +939,193 @@
 		}
 	}	
 	
-	//수신번호 리스트 체크하기
-	var phoneList = [];
-	var nameList = [];
-	var info1List = [];
-	var info2List = [];
-	var info3List = [];
-	var info4List = [];
-	var memoList = [];
-	
 	var commaSelectedData = numberWithCommas(selectedData.length);
 	var confirmMsg = "저장하시겠습니까?\n이름 20byte, [*1*]~[*4*] 40byte, 메모 250byte 초과 글자는 절사됩니다.";
 	if (selectedData.length >= 10000) {
 		confirmMsg = "저장하시겠습니까?\n이름 20byte, [*1*]~[*4*] 40byte, 메모 250byte 초과 글자는 절사됩니다.\n1만건 이상 등록시 약 30초정도 소요됩니다.\n잠시만 기다려주세요.";
 	}
-	else if (selectedData.length > 2000) {
-		confirmMsg = "저장하시겠습니까?\n이름 20byte, [*1*]~[*4*] 40byte, 메모 250byte 초과 글자는 절사됩니다.\n" + commaSelectedData + "건 등록시 수초정도 소요됩니다.\n잠시만 기다려주세요.";
-	}	
-	 
-	if (confirm(confirmMsg)) {
-		
-		for (var i=0; i < selectedData.length; i++) {
-			var name = tableR.getRows()[i].getData().name;
-			var phone = removeDash(tableR.getRows()[i].getData().phone);
-			var info1 = tableR.getRows()[i].getData().info1;
-			var info2 = tableR.getRows()[i].getData().info2;
-			var info3 = tableR.getRows()[i].getData().info3;
-			var info4 = tableR.getRows()[i].getData().info4;
-			var memo = tableR.getRows()[i].getData().memo;
-			
-			phoneList[i] = phone;
-			// name
-			if (name == "" || name == null || name == undefined) {
-				nameList[i] = "";
-			}
-			else {
-				if(!addrEmojiCheck(name)){//이모지 체크 해주기
-					return false;
-				}
-				
-				nameList[i] = name.replace(/,/g,"§");
-			}
-			
-			// info1
-			if (info1 == "" || info1 == null || info1 == undefined) {
-				info1List[i] = "";
-			}
-			else {
-				if(!addrEmojiCheck(info1)){//이모지 체크 해주기
-					return false;
-				}
-				
-				info1List[i] = info1.replace(/,/g,"§");
-			}
-			// info2
-			if (info2 == "" || info2 == null || info2 == undefined) {
-				info2List[i] = "";
-			}
-			else {
-				if(!addrEmojiCheck(info2)){//이모지 체크 해주기
-					return false;
-				}
-				
-				info2List[i] = info2.replace(/,/g,"§");
-			}
-			// info3
-			if (info3 == "" || info3 == null || info3 == undefined) {
-				info3List[i] = "";
-			}
-			else {
-				if(!addrEmojiCheck(info3)){//이모지 체크 해주기
-					return false;
-				}
-				info3List[i] = info3.replace(/,/g,"§");
-			}
-			// info4
-			if (info4 == "" || info4 == null || info4 == undefined) {
-				info4List[i] = "";
-			}
-			else {
-				if(!addrEmojiCheck(info4)){//이모지 체크 해주기
-					return false;
-				}
-				info4List[i] = info4.replace(/,/g,"§");
-			}
-			// memo
-			if (memo == "" || memo == null || memo == undefined) {
-				memoList[i] = "";
-			}
-			else {
-				if(!addrEmojiCheck(memo)){//이모지 체크 해주기
-					return false;
-				}
-				memoList[i] = memo.replace(/,/g,"§");
-			}
+	if (confirm(confirmMsg)) {	
+		//로딩창 show
+		$('.loading_layer').addClass('active');				
 
+		setTimeout(setSenderList, 1000);
+	}
+}
+
+function setSenderList() {
+	var selectedData = tableR.getRows();
+	for (var i=gArrRestartIndex; i < selectedData.length; i++) {
+		var name = tableR.getRows()[i].getData().name;
+		var phone = removeDash(tableR.getRows()[i].getData().phone);
+		var info1 = tableR.getRows()[i].getData().info1;
+		var info2 = tableR.getRows()[i].getData().info2;
+		var info3 = tableR.getRows()[i].getData().info3;
+		var info4 = tableR.getRows()[i].getData().info4;
+		var memo = tableR.getRows()[i].getData().memo;
+		
+		gPhoneList[i] = phone;
+		// name
+		if (name == "" || name == null || name == undefined) {
+			gNameList[i] = "";
+		}
+		else {
+			if(!addrEmojiCheck(name)){//이모지 체크 해주기
+				return false;
+			}
+			
+			gNameList[i] = name.replace(/,/g,"§");
 		}
 		
-		var form = document.addrMassForm;
-		form.phoneList.value = phoneList;
-		form.nameList.value = nameList;
-		form.info1List.value = info1List;
-		form.info2List.value = info2List;
-		form.info3List.value = info3List;
-		form.info4List.value = info4List;
-		form.memoList.value = memoList;
-		form.addrGrpId.value = $("#addrGrpIdInfo").val();
-		
-		var data = new FormData(form);
-		
-		url = "/web/mjon/addr/addrMassInsertByTempAjax.do";
-		
-		$.ajax({
-	        type: "POST",
-	        url: url,
-	        data: data,
-	        dataType:'json',
-	        async: true,
-	        processData: false,
-	        contentType: false,
-	        cache: false,
-	        success: function (returnData) {
-				if (returnData.isSuccess) { 
-					alert("저장에 성공했습니다.\n저장 : " + returnData.resultCnt + "건, 중복 : " + returnData.dupliCnt + "건, 휴대폰번호 오류 : " + returnData.errPhoneCnt + "건");
+		// info1
+		if (info1 == "" || info1 == null || info1 == undefined) {
+			gInfo1List[i] = "";
+		}
+		else {
+			if(!addrEmojiCheck(info1)){//이모지 체크 해주기
+				return false;
+			}
+			
+			gInfo1List[i] = info1.replace(/,/g,"§");
+		}
+		// info2
+		if (info2 == "" || info2 == null || info2 == undefined) {
+			gInfo2List[i] = "";
+		}
+		else {
+			if(!addrEmojiCheck(info2)){//이모지 체크 해주기
+				return false;
+			}
+			
+			gInfo2List[i] = info2.replace(/,/g,"§");
+		}
+		// info3
+		if (info3 == "" || info3 == null || info3 == undefined) {
+			gInfo3List[i] = "";
+		}
+		else {
+			if(!addrEmojiCheck(info3)){//이모지 체크 해주기
+				return false;
+			}
+			gInfo3List[i] = info3.replace(/,/g,"§");
+		}
+		// info4
+		if (info4 == "" || info4 == null || info4 == undefined) {
+			gInfo4List[i] = "";
+		}
+		else {
+			if(!addrEmojiCheck(info4)){//이모지 체크 해주기
+				return false;
+			}
+			gInfo4List[i] = info4.replace(/,/g,"§");
+		}
+		// memo
+		if (memo == "" || memo == null || memo == undefined) {
+			gMemoList[i] = "";
+		}
+		else {
+			if(!addrEmojiCheck(memo)){//이모지 체크 해주기
+				return false;
+			}
+			gMemoList[i] = memo.replace(/,/g,"§");
+		}
 
-					// 중복번호 Hide
-					$("#btnAddrMassDupli").hide();
-					$("#btnAddrMassSaveDupli").hide();
-					
-					// 중복건이 있을경우
-					if (returnData.dupliCnt > 0) {
-						//alert(returnData.addrMassDupliList.length);
+		var reStartArray = [10000, 20000, 30000, 40000, 50000, 60000, 70000, 80000, 90000, 100000, 110000, 120000, 130000, 140000, 150000, 160000, 170000, 180000, 190000, 200000];
+		
+		if (reStartArray.includes(i, 0)) {
+			console.log("########## i : " + i);
+			
+			gArrRestartIndex = i+1;
+			
+			if (selectedData.length > gArrRestartIndex) {
+				setTimeout(setSenderList, 500);
+				break;
+			}
+		}
+		console.log(i);
+	}	
+	
+	if (gPhoneList.length == selectedData.length) {
+		console.log(new Date());
+		console.log("gPhoneList.length : " + gPhoneList.length);
+		console.log("selectedData.length : " + selectedData.length);
+		
+		SetAddrMassSave_Step2();		
+	}	
+}
 
-						// 중복번호(해당 그룹) Show
-						$("#btnAddrMassSaveDupli").show();
-						
-						addrMassDupliSaveList = returnData.addrMassDupliList;
-						//$("#btnAddrMassSaveDupli").trigger("click");
-					}
+//저장
+function SetAddrMassSave_Step2(){
+	var form = document.addrMassForm;
+	form.phoneList.value = gPhoneList;
+	form.nameList.value = gNameList;
+	form.info1List.value = gInfo1List;
+	form.info2List.value = gInfo2List;
+	form.info3List.value = gInfo3List;
+	form.info4List.value = gInfo4List;
+	form.memoList.value = gMemoList;
+	form.addrGrpId.value = $("#addrGrpIdInfo").val();
+	
+	var data = new FormData(form);
+	
+	url = "/web/mjon/addr/addrMassInsertByTempAjax.do";
+	
+	$.ajax({
+        type: "POST",
+        url: url,
+        data: data,
+        dataType:'json',
+        async: true,
+        processData: false,
+        contentType: false,
+        cache: false,
+        success: function (returnData) {
+        	//로딩창 hide
+        	$('.loading_layer').removeClass('active');			
+        	
+			if (returnData.isSuccess) { 
+				alert("저장에 성공했습니다.\n저장 : " + returnData.resultCnt + "건, 중복 : " + returnData.dupliCnt + "건, 휴대폰번호 오류 : " + returnData.errPhoneCnt + "건");
+
+				// 중복번호 Hide
+				$("#btnAddrMassDupli").hide();
+				$("#btnAddrMassSaveDupli").hide();
+				
+				// 중복건이 있을경우
+				if (returnData.dupliCnt > 0) {
+					//alert(returnData.addrMassDupliList.length);
+
+					// 중복번호(해당 그룹) Show
+					$("#btnAddrMassSaveDupli").show();
 					
-					// 데이터 비우기
-					SetClear();		
-					
-					// 주소록그룹 콤보박스 유지
-					setTimeout(setSelectMassSetting, 500, selectMassVal);					
-				} 
-				else {
-					alert("오류 알림 : " + returnData.msg);
+					addrMassDupliSaveList = returnData.addrMassDupliList;
+					//$("#btnAddrMassSaveDupli").trigger("click");
 				}
-			},
-	        error: function (e) { 
-	        	alert("저장에 실패하였습니다."); 
-	        	alert("ERROR : " + JSON.stringify(e)); 
-	        },
-			beforeSend : function(xmlHttpRequest) {
-	        	//로딩창 show
-	        	$('.loading_layer').addClass('active');				
-			},	        	        
-	        complete : function(xhr, textStatus) {
-	        	//로딩창 hide
-	        	$('.loading_layer').removeClass('active');
-			}	        
-	    });
-	}
+				
+				// 데이터 비우기
+				SetClear();		
+				
+				// 주소록그룹 콤보박스 유지
+				setTimeout(setSelectMassSetting, 500, selectMassVal);					
+			} 
+			else {
+				alert("오류 알림 : " + returnData.msg);
+			}
+		},
+        error: function (e) { 
+        	//로딩창 hide
+        	$('.loading_layer').removeClass('active');			
+        	
+        	alert("저장에 실패하였습니다."); 
+        	alert("ERROR : " + JSON.stringify(e)); 
+        },
+		beforeSend : function(xmlHttpRequest) {
+        	//로딩창 show
+        	$('.loading_layer').addClass('active');				
+		},	        	        
+        complete : function(xhr, textStatus) {
+        	//로딩창 hide
+        	$('.loading_layer').removeClass('active');
+		}	        
+    });
 }
 
 //주소록그룹 콤보박스 유지
src/main/webapp/js/MJUtill.js
--- src/main/webapp/js/MJUtill.js
+++ src/main/webapp/js/MJUtill.js
@@ -824,7 +824,13 @@
 			returnFlag = false;
 		}
 	}
-	if(!returnFlag) alert("주소록 저장 목록 중 이모지를 사용할 수 없습니다.\n이모지 삭제후 발송해주세요.\n(" + usedEmoji + ")");
+
+	if(!returnFlag) {
+    	//로딩창 hide
+    	$('.loading_layer').removeClass('active');
+    	
+		alert("주소록 저장 목록 중 이모지를 사용할 수 없습니다.\n이모지 삭제후 발송해주세요.\n(" + usedEmoji + ")");
+	}
 	
 	return returnFlag;
 }
Add a comment
List