221111_광고 관리 플랫폼 대행사 센터 제작 53_광고 관리 통계 기능 수정 외

창고·2022년 11월 11일
0
post-thumbnail

해당 게시글은 개인 프로젝트인 "광고 관리 플랫폼 대행사 센터 제작"
#151 "광고 관리 통계 기능 수정", #148 "컨트롤러 리팩토링 및 메소드명 수정" 이슈를 다루고 있습니다

1. 진행 사항

(1) 요약

  • jQuery 활용 -> 최근 7일간 / 30일간 통계 기능 수정
  • StatisticsType 삭제, Thymeleaf 로직 수정
  • 통계 조회 메소드 수정
  • 컨트롤러 리팩토링
  • 대시보드 관련 메소드명 변경

(2) 상세 내용

  • 초기 조회 시 input 값이 없으므로 null 체크 후 최근 7일 기준으로 value값 입력
    // 초기 페이지 조회 시 작동
    $(document).ready(function () {

        // 초기 세팅
        var iStartDate = $('#start-date').val();
        var iLastDate = $('#last-date').val();

        if (iStartDate == '') {
            var now = new Date();
            var dayBeforeSeven = new Date(now.setDate(now.getDate()-7));
            var startDate = dateFormat(dayBeforeSeven);
            $('#start-date').val(startDate);
        }

        if (iLastDate == '') {
            var now2 = new Date();
            var dayBeforeOne = new Date(now2.setDate(now2.getDate()-1));
            var lastDate = dateFormat(dayBeforeOne);
            $('#last-date').val(lastDate);
        }
  • 버튼 클릭 시 이벤트 체킹으로 value값 입력, submit 하여 parameter 값 서버로 전송 -> 통계 및 차트 갱신
    // date 포맷 'YYYY-MM-DD' 형식으로 변경
    function dateFormat(date) {
        var dateFormat = date.getFullYear() +
            '-' + ((date.getMonth() + 1) < 9 ? "0" + (date.getMonth() + 1) : (date.getMonth() + 1)) +
            '-' + ((date.getDate()) < 9 ? "0" + (date.getDate()) : (date.getDate()));
        return dateFormat;
    }

    // 최근 ~일 통계 버튼 관련 동작
    $(function () {

        $('#statistics_type_week').click(function () { // 클릭 감지

            var now = new Date();
            var now2 = new Date();
            var dayBeforeSeven = new Date(now.setDate(now.getDate()-7));
            var dayBeforeOne = new Date(now2.setDate(now2.getDate()-1));
            var startDate = dateFormat(dayBeforeSeven);
            var lastDate = dateFormat(dayBeforeOne);

            $('#start-date').val(startDate);
            $('#last-date').val(lastDate);

            $('#statistics-date-form').submit();

        });

    });
  • jQuery를 통해 parameter 값을 지정하고 submit 할 수 있으므로 StatisticsType 클래스를 삭제하고 Thymeleaf 로직 삭제
  • 통계 기능 구현이 모두 끝났으므로 Controller / Service / Repository의 메소드명 변경

2. 결과

  • 초기 조회 시에는 최근 7일 조회 -> 최근 7일, 30일 버튼 클릭 시 자동 입력 + 조회

3. 미흡한 점 및 개선이 필요한 점

  • selected option은 그대로 가져가지 못하는게 좀 아쉽다 이 부분은 나중에 개선해보도록 한다
profile
공부했던 내용들을 모아둔 창고입니다.

0개의 댓글