프로젝트 코드 변경 사항 및 메모 #9 - 관리자 메인 차트 코드 정리

차트 코드의 전체적인 문제점은 화면에 보이는 날짜를 출력하는 부분이랑 Controller에서도 날짜를 계산하는 부분이 중복된다는 것 같음. 그리고 한 달 단위 이런 데이터가 많기 때문에 날짜를 계산하면서 시간이 오래 걸리기도 하고. 

어떤 식으로 해야 할지 감이 안오네. 자바스크립트로 날짜 구하고 그거를 ajax로 controller로 옮긴 다음에 가져와야 하나. 메인부터 고치려고 하니까 내 코드가 아니라서 잘 모르겠어서 일단 내 코드 먼저 고친 다음에 생각해 보는 것으로 하자.

 

1. 자바스크립트 오늘, 어제, 그제 날짜 구하기

			var today = new Date();
			var yesterday = new Date(Date.parse(today) - 1 * 1000 * 60 * 60 * 24);
 			var dayago2 = new Date(Date.parse(today) - 2 * 1000 * 60 * 60 * 24);
			var dayago3 = new Date(Date.parse(today) - 3 * 1000 * 60 * 60 * 24);
			var dayago4 = new Date(Date.parse(today) - 4 * 1000 * 60 * 60 * 24); 

자바 오늘, 어제, 그제 날짜 구하기

	// 기타 주문관리
	@RequestMapping(value = "/admin/orderChart.do")
	public String adminOrder(Model model) {
		
		String[] statusArr = {"결제완료", "수거중", "서비스중", "배송중", "배송완료", "주문취소"};
		
		Calendar cal = Calendar.getInstance();
		SimpleDateFormat sdf = new SimpleDateFormat("yy/MM/dd");
		
		String today = sdf.format(cal.getTime());
		String[] dateArr = new String[5];
		dateArr[0] = today; 
		for(int i = 1; i < 5; i++) {
			cal.add(Calendar.DATE, -1);
			dateArr[i] = sdf.format(cal.getTime());
		}
				
		String[] weekArr = new String[10]; 
		weekArr[0] = today;
		cal = Calendar.getInstance();
		for(int i = 1; i < 10; i++) {
			if(i%2 == 0) {
				cal.add(Calendar.DATE, -1);
			}else {
				cal.add(Calendar.DATE, -6);
			}
			weekArr[i] = sdf.format(cal.getTime());
		}

		HashMap<String, Object> map = new HashMap<String, Object>();

		// 상태별 배열 
		int[] payArr = new int[5]; 
		int[] pickArr = new int[5]; 
		int[] serviceArr = new int[5]; 
		int[] deliveryArr = new int[5]; 
		int[] completeArr = new int[5]; 
		int[] cancleArr = new int[5]; 
		
		// 기간별 배열 : 일별, 주별 
		int[] dailyArr = new int[5];
		int[] weeklyArr = new int[5];
		
		int dailySum = 0; 
		int weeklySum = 0; 
		
		for(int i = 0; i < statusArr.length; i++) {
			String status = statusArr[i]; 
			map.put("order_status", status);
			int daily = 0; 
			
			for(int j = 0;  j < dateArr.length; j++) {
				map.put("order_date", dateArr[j]);
				int dailyResult = 0; 
				int result = adminOrderService.recentOrderStatusCnt(map);

				// 상태별 총 주문량 계산
				switch(i) {
				case 0 :
					payArr[j] = result; 
					break;
				case 1 :
					pickArr[j] = result; 
					break;
				case 2 :
					serviceArr[j] = result; 
					break;
				case 3 :
					deliveryArr[j] = result; 
					break;
				case 4 :
					completeArr[j] = result; 
					break;
				case 5 :
					cancleArr[j] = result; 
					break;
				}
				
				// 일별 총 주문량 계산
				if(i == statusArr.length - 1) {
					dailyResult = adminOrderService.recentOrderCnt(map);
					dailyArr[j] = dailyResult; 
					dailySum += dailyResult;
				}
			}
			
		}
				
		// 주별 총 주문량 계산 
		for(int i = 0; i < weekArr.length; i+=2) {
			String end = weekArr[i];
			String start = weekArr[i+1];

			map.put("startDate", start);
			map.put("endDate", end);
			
			int result = adminOrderService.recentOrderWeeklyCnt(map);
			weeklyArr[i/2] = result; 
			weeklySum += result;
		}

		model.addAttribute("payArr", payArr);
		model.addAttribute("pickArr", pickArr);
		model.addAttribute("serviceArr", serviceArr);
		model.addAttribute("deliveryArr", deliveryArr);
		model.addAttribute("completeArr", completeArr);
		model.addAttribute("cancleArr", cancleArr);
		
		model.addAttribute("dateArr", dateArr); 
		model.addAttribute("weekArr", weekArr); 
		
		model.addAttribute("dailyArr", dailyArr);
		model.addAttribute("weeklyArr", weeklyArr);
		model.addAttribute("dailySum", dailySum);
		model.addAttribute("weeklySum", weeklySum);
		
		return "/admin/order_chart";
	}
	

이런 식으로 나눠져 있었다. 왜냐면 우선 dateArr, weekArr을 보내긴 했지만 차트 api 코드랑 섞이면서 jsp에서 내가 제대로 데이터 값을 활용하는 방법을 못 찾았었기 때문. 하지만 

		function getWeekDate(config) {
			<%for(int i = 0; i < weekArr.length; i+=2) {%>
			var arr = new Array(); 
			arr.push('<%=weekArr[weekArr.length-i-1]%>');
			arr.push('~');
			arr.push('<%=weekArr[weekArr.length-i-2]%>');	
			config.data.labels.push(arr); 
		<% }%>			
		}
		

방법을 찾고 이런 식으로 함수를 만들게 되면서 사용 방법을 찾아서 코드를 많이 줄일 수 있었다. 

 

2. Controller 혹은 SQL 쿼리 자체에 대한 고민

애초에 저 코드 자체에 의문이 생기는 것이다.

내 생각에 저 코드는 진짜 안 좋은 코드임. 우선 중복되는 코드들이 많기 때문에 날짜를 구하는 클래스를 하나 만들면 좋겠다는 생각이 들고, 아니면 애초에 sql문에서 저런 반복문을 제외 하고 코드가 짜여질 수 있는지 확인 하려고 함. 

 

SQL문이 문제 인 이유 > order_date가 String형이기 때문. 이것만 어떻게 하면 해결 할 수 있을 것 같은데 이게 해결이 안될 것 같다. 다른 연결되어 있는 부분이 너무 많아서 우선 놔두고 그리고 여기서 알 수 있는게 여기서 like 함수를 쓰는데 여기서 시간이 많이 시간이 걸리는 것 같음. 그래도 원인을 파악했다는 것에 의의를 둔다. 

 

지금 그래서 이걸 어떻게 처리 해야 될지 모르겠다.

우선 로딩 속도 보다 중복 코드 정리에 더 신경을 써서 해결 하기로. 

 

Day 클래스 생성

package com.spring.admin_order;

import java.text.SimpleDateFormat;
import java.util.Calendar;

public class Day {

	private static Calendar cal = Calendar.getInstance();
	private static SimpleDateFormat sdf = new SimpleDateFormat("yy/MM/dd");
	private static String today = sdf.format(cal.getTime());

	public static String[] get5Days() {	
		
		cal = Calendar.getInstance();
		String[] dateArr = new String[5];
		dateArr[0] = today; 
		for(int i = 1; i < 5; i++) {
			cal.add(Calendar.DATE, -1);
			dateArr[i] = sdf.format(cal.getTime());
		}
		
		return dateArr; 
	}
	
	public static String[] getWeekDays() {
		
		String[] weekArr = new String[10]; 
		weekArr[0] = today;
		cal = Calendar.getInstance();
		for(int i = 1; i < 10; i++) {
			if(i%2 == 0) {
				cal.add(Calendar.DATE, -1);
			}else {
				cal.add(Calendar.DATE, -6);
			}
			weekArr[i] = sdf.format(cal.getTime());
		}
		
		return weekArr; 
	}
}

중복되는 코드들을 해결 해 주기 위해서 Day 클래스를 생성했다. 

 

혼란스러운 메인 페이지 코드들 🤷🏻‍♀️

 

+

 

 

7~9 갈 때까 (8은 까먹고 안 쓴 거임) 1월부터 지금까지 날짜 계산 한 뒤에 검색하는 코드 같은데(정확하지가 않음) 생각해보면 당연히 느릴 수 밖에 없는 문제잖아. 데이터 쌓이면 쌓일 수록 그럴 수 밖에 없음. 이런 건 다들 어떻게 처리 하는 걸까. 간격을 두고 검색 할 것 같은데 일단 진짜 최고의 문제가 order_date를 String형으로 집어 넣었던 것이다. 다시는 이런 실수 없어야해..