Merge pull request #88 from hyosung-second-team1/85-jsp-vote-distance

[Fix] 지난 그룹 일정 조회 불가능 수정
hyosung-second-team1 · May 16, 2024 · bb3f869 · bb3f869
2 parents 38c34a6 + fd1d6e1
commit bb3f869
Show file tree

Hide file tree

Showing 9 changed files with 229 additions and 41 deletions.
diff --git a/src/main/resources/mapper/scheduleMapper.xml b/src/main/resources/mapper/scheduleMapper.xml
@@ -289,7 +289,7 @@
 			JOIN schedule s ON ms.schedule_id = s.schedule_id
 			WHERE
 				ms.email = #{email}
-			AND s.end_date &lt; CURRENT_DATE
+			AND s.start_date &lt; CURRENT_DATE
 			<if test="categoryId != null and categoryId != 0">
 				AND s.schedule_category_id = #{categoryId}
 			</if>

diff --git a/src/main/resources/static/css/table/table.css b/src/main/resources/static/css/table/table.css
@@ -20,6 +20,13 @@ body {
   align-items: center;
 }
 
+.chart-container {
+  gap: 30px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
 .foot-container {
   display: flex;
   flex-direction: column;
@@ -117,6 +124,15 @@ body {
 
 
 
+/* 차트 */
+.chart {
+  width: 300px;
+}
+/* 차트 End*/
+
+
+
+
 
 
 /* 필터링 컨테이너 */

diff --git a/src/main/resources/static/js/calendar.js b/src/main/resources/static/js/calendar.js
@@ -16,7 +16,6 @@ $(document).ready(async function() {
     // 달력 표시
     let scheduleData;
     await getCalendarSchedule();
-    console.log(scheduleData)
     const calendar = displayEventsOnCalendar(scheduleData);
 
     // ajax 통해 서버에서 일정 데이터 가져오는 함수

diff --git a/src/main/resources/static/js/inc/alarm.js b/src/main/resources/static/js/inc/alarm.js
@@ -18,24 +18,9 @@ $(".msg-overlay-bubble-list").ready(function() {
         e.stopPropagation(); // 이벤트 전파 중지
         let isRead = $(this).data('is-read');
         let notifyID = $(this).data('notify-id');
-        console.log('x 클릭 하셨군요...')
-        console.log("*************************8")
-        console.log("notifyID")
-        console.log(notifyID)
-        console.log(isRead)
-        // if (isRead) {
-        //     // 해당 일정의 부모 요소를 숨깁니다.
-        //     $(this).closest('.card-outer').remove();
-        // } else {
-        //     isRead = true;  // isRead 의 값이 false 인 경우, x 버튼을 누르면 true 로 바꾸기
-        //     console.log("false -> true")
-        //     console.log(isRead)
-        // }
 
         if (isRead != true) {
             isRead = true;  // isRead 의 값이 false 인 경우, x 버튼을 누르면 true 로 바꾸기
-            console.log("false -> true")
-            console.log(isRead)
         }
 
         $.ajax({
@@ -46,18 +31,11 @@ $(".msg-overlay-bubble-list").ready(function() {
                 notifyId: notifyID
             },
             success: function (response) {
-                console.log('데이터 전송 성공:', response);
-
-                // let $this = $(this);
-                // $this.closest('.card-outer').remove();
-
-                //$(this).closest('.card-outer').remove();
 
                 let $cardToRemove = $(document).find('[data-notify-id="' + notifyID + '"]').closest('.card-outer');
                 $cardToRemove.remove();
             },
             error: function (xhr, status, error) {
-                console.error('데이터 전송 실패:', error);
             }
         })
     })
@@ -67,9 +45,6 @@ $(".msg-overlay-bubble-list").ready(function() {
         let scheduleId = $(this).data('schedule-id');
         // // 클릭된 카드의 notifyCategoryId 가져오기
         let notifyCategoryId = $(this).data('notify-category-id');
-        console.log('두 번째 이벤트')
-        console.log(scheduleId)
-        console.log(notifyCategoryId)
 
         if (notifyCategoryId === 1) {  // 모임 일정 초대
             location.href = '/schedule/vote?scheduleId=' + scheduleId;
@@ -99,7 +74,6 @@ function showNotifications() {
             let cardData = response.data;  // 데이터 배열
             // 데이터 배열을 순회하면서 카드 생성
             cardData.forEach(function(card) {
-                //console.log(card)
                 // 카드 생성 및 데이터 추가
                 let $cardOuter = $('<div class="card-outer" data-schedule-id="' + card.scheduleId + '" data-notify-category-id="' + card.notifyCategoryId + '"></div>');
 
@@ -168,14 +142,6 @@ function showNotifications() {
                     let deadlineYear = deadlineDateArray[0];
                     let deadlineMonth = deadlineDateArray[1];
                     let deadlineDay = deadlineDateArray[2];
-                    // console.log('콘소오오올')
-                    // console.log(deadlineDateArray)  // ['2024', '05', '17']
-                    // console.log('year')
-                    // console.log(deadlineDateArray[0])  // 2024
-                    // console.log('month')
-                    // console.log(deadlineDateArray[1])  // 05
-                    // console.log('day')
-                    // console.log(deadlineDateArray[2]) // 17
                     $cardMain2.append("<p style='font-size: 12px;'><i class=\"bi bi-geo-alt\" style=\"margin-top: 16px;\"> </i>" + deadlineMonth + "/" + deadlineDay + " 투표 마감</p>");
                 }
 
@@ -195,7 +161,6 @@ function showNotifications() {
         },
         error: function(xhr, status, error) {
             // 데이터 받아오지 못할 경우 예외 처리
-            console.error("Error: ", error);
         }
     });
 };

diff --git a/src/main/resources/static/js/module/ajax.js b/src/main/resources/static/js/module/ajax.js
@@ -268,5 +268,52 @@ export async function getScheduleHistory(catogoryId, keyword, page, size) {
     // 실패 시 예외 처리
   }
 
+  return response;
+}
+
+
+
+// 월별 통계불러오기
+export async function getMonthStatic(year, isGroup) {
+  const response = await $.ajax({
+    type: "GET",
+    dataType : 'json',
+    contentType: 'application/json',
+    url: `/api/stats/me/schedule`,
+    data : {
+      "year" : year,
+      "isGroup" : isGroup
+    }
+  });
+  if (!response.isSuccess) {
+    // 실패 시 예외 처리
+  }
+
+  return response;
+}
+
+
+
+// 카테고리별 통계불러오기
+export async function getCategoryStatic(year, month, isGroup) {
+  console.log(year, month)
+
+  const response = await $.ajax({
+    type: "GET",
+    dataType : 'json',
+    contentType: 'application/json',
+    // url: `/api/stats/me/category?year=${year}?month=${month}`,
+    url: `/api/stats/me/category`,
+    data : {
+      "month" : month,
+      "year" : year,
+      "isGroup" : isGroup
+    }
+  });
+
+  if (!response.isSuccess) {
+    // 실패 시 예외 처리
+  }
+
   return response;
 }
diff --git a/src/main/resources/static/js/module/sweetAlert.js b/src/main/resources/static/js/module/sweetAlert.js
@@ -7,8 +7,6 @@ export async function successModal(text) {
     // confirmButtonText: '로그인',
     showConfirmButton: false
   })
-
-  console.log(result);
 }
 
 // 실패 모달
@@ -21,5 +19,4 @@ export async function infoModal(text) {
     showConfirmButton: false
   })
 
-  console.log(result);
 }
diff --git a/src/main/resources/static/js/schedule/detail.js b/src/main/resources/static/js/schedule/detail.js
@@ -6,6 +6,7 @@ import {getRoute} from '/js/module/mobility.js'
 const urlSearch = new URLSearchParams(location.search);
 let scheduleId = await urlSearch.get('scheduleId');
 let scheduleInfo = await aj.getScheduleDetail(scheduleId);
+console.log(scheduleInfo)
 const targetInfo = scheduleInfo.scheduleDetailInfo;
 // ---- 사용자 정보 ----
 const myInfo = await aj.getMyInfo();

diff --git a/src/main/resources/static/js/table/table.js b/src/main/resources/static/js/table/table.js
@@ -12,6 +12,12 @@ let page = 0;
 let size = 10;
 let keyword = "";
 let isLast = true;
+// 차트 관련
+const today = new Date();
+let isGroup;
+let barIsGroup = null;
+let circleIsGroup = null;
+
 
 // !왼쪽 사이드 캐러셀
 let leftSlid = 0;
@@ -62,6 +68,11 @@ $('.down-btn').click(async function(e) {
 })
 
 
+// ! 차트
+const circleChart = await showFirstCircleChart();
+const barChart = await showFirstBarChart();
+
+
 
 
 
@@ -188,4 +199,148 @@ async function getSchedules() {
   // isLast = schedulesInfo.last;
 }
 // ---- 데이터 불러오기 End ----
-// 2. 데이터 테이블 End
+// 2. 데이터 테이블 End
+
+
+
+// 3. 차트
+// --- 원 그래프 데이터 가져오기 ----
+async function getCircleData() {
+  const year = today.getFullYear();
+  const month = (today.getMonth() + 1).toString().padStart(2, '0');
+
+  const response = await aj.getCategoryStatic(year, month, isGroup);
+  const countData = response.data;
+
+  const data = {
+    labels: [],
+    datasets: [
+        {
+          label: '전체 카테고리 통계',
+          data: [],
+          backgroundColor: [],
+        }
+    ]
+  };
+
+  $.each(countData, function (idx, category) { 
+    data.labels.push(category.categoryName);
+    data.datasets[0].data.push(category.scheduleCount);
+    data.datasets[0].backgroundColor.push(category.color);
+  });
+
+  return data
+}
+// --- 원 그래프 데이터 가져오기 ---- 
+
+
+// --- 막대 그래프 데이터 가져오기 ----
+async function getBarData() {
+  const year = today.getFullYear();
+
+  const data = {
+    labels: [],
+    datasets: [
+      {
+        label: '전체',
+        data: [],
+        borderColor: '#4FD1C5',
+        backgroundColor: '#4FD1C5',
+        borderWidth: 2,
+      },
+      {
+        label: '그룹',
+        data: [],
+        borderColor: '#4FD1C5',
+        backgroundColor: '#4FD1C5',
+        borderWidth: 2,
+      },
+      {
+        label: '개인',
+        data: [],
+        borderColor: '#4FD1C5',
+        backgroundColor: '#4FD1C5',
+        borderWidth: 2,
+      },
+    ]
+  };
+
+  // 전체 일정
+  const response1 = await aj.getMonthStatic(year);
+  const countData1 = response1.data;
+
+  $.each(countData1, function (idx, month) { 
+    data.labels.push(month.month);
+    data.datasets[0].data.push(month.scheduleCount);
+  });
+
+  // 그룹 일정
+  const response2 = await aj.getMonthStatic(year, true);
+  const countData2 = response1.data;
+  $.each(countData2, function (idx, month) { 
+    data.datasets[1].data.push(month.scheduleCount);
+  });
+
+  // 개인 일정
+  const response3 = await aj.getMonthStatic(year, false);
+  const countData3 = response1.data;
+  $.each(countData3, function (idx, month) { 
+    data.datasets[2].data.push(month.scheduleCount);
+  });
+
+  return data
+}
+// --- 막대 그래프 데이터 가져오기 ---- 
+
+// ---- 원 그래프 처음 보여주기 ----
+async function showFirstCircleChart() {
+  const barEl = $('#circle-chart > canvas');
+
+  const data = await getCircleData();
+  var myChart = new Chart(barEl, {
+    type: 'doughnut',
+    data: data,
+    options: {
+      responsive: true,
+      plugins: {
+        legend: {
+          position: 'top',
+        },
+        title: {
+          display: true,
+          text: '카테고리별 일정 통계'
+        }
+      }
+    },
+  });
+
+  return myChart;
+}
+// ---- 원 그래프 처음 보여주기 End ----
+
+// ---- 막대 그래프 처음 보여주기 ----
+async function showFirstBarChart() {
+  const barEl = $('#bar-chart > canvas');
+
+  const data = await getBarData();
+  var myChart = new Chart(barEl, {
+    type: 'bar',
+    data: data,
+    options: {
+      responsive: true,
+      plugins: {
+        legend: {
+          position: 'top',
+        },
+        title: {
+          display: true,
+          text: '월별 일정 통계'
+        }
+      }
+    },
+  });
+
+  return myChart;
+}
+// ---- 막대 그래프 처음 보여주기 End ----
+// ---- 원 그래프 End ----