diff --git a/.gitignore b/.gitignore
index 67fb678..f68d109 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,11 +1,9 @@
-HELP.md
-.gradle
-build/
-!gradle/wrapper/gradle-wrapper.jar
-!**/src/main/**/build/
-!**/src/test/**/build/
+### IntelliJ IDEA ###
+out/
+!**/src/main/**/out/
+!**/src/test/**/out/
-### STS ###
+### Eclipse ###
.apt_generated
.classpath
.factorypath
@@ -17,15 +15,6 @@ bin/
!**/src/main/**/bin/
!**/src/test/**/bin/
-### IntelliJ IDEA ###
-.idea
-*.iws
-*.iml
-*.ipr
-out/
-!**/src/main/**/out/
-!**/src/test/**/out/
-
### NetBeans ###
/nbproject/private/
/nbbuild/
@@ -35,8 +24,6 @@ out/
### VS Code ###
.vscode/
-.DS_Store
-*/.DS_Store
-application.yml
-application-dev.yml
+### Mac OS ###
+.DS_Store
\ No newline at end of file
diff --git a/calendar.css b/calendar.css
new file mode 100644
index 0000000..f187f6f
--- /dev/null
+++ b/calendar.css
@@ -0,0 +1,145 @@
+body {
+ font-family: Arial, sans-serif;
+ margin: 0;
+ padding: 0;
+ background-color: #f8f9fc;
+}
+
+.calendar-container {
+ max-width: 1000px;
+ margin: 40px auto;
+ padding: 10px;
+ background-color: white;
+ box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
+ border-radius: 10px;
+}
+
+.calendar-header {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ margin-bottom: 20px;
+}
+
+.month-navigation {
+ display: flex;
+ align-items: center;
+ gap: 10px;
+}
+
+button {
+ cursor: pointer;
+ padding: 5px 10px;
+ background-color: #4a90e2;
+ color: white;
+ border: none;
+ border-radius: 5px;
+ transition: background-color 0.3s ease;
+}
+
+button:hover {
+ background-color: #357ABD;
+}
+
+.week-buttons {
+ display: flex;
+ justify-content: space-around;
+ margin-bottom: 10px;
+}
+
+.week-btn {
+ background-color: #dfe6e9;
+ padding: 5px 15px;
+ border-radius: 5px;
+ cursor: pointer;
+ text-align: center;
+ transition: background-color 0.3s ease;
+}
+
+.week-btn:hover {
+ background-color: #b2bec3;
+}
+
+table {
+ width: 100%;
+ border-collapse: collapse;
+}
+
+th, td {
+ width: 14%;
+ height: 100px;
+ border: 1px solid #ccc;
+ text-align: center;
+ vertical-align: top;
+}
+
+td {
+ position: relative;
+ background-color: #f9f9f9;
+ transition: background-color 0.3s ease;
+}
+
+td:hover {
+ background-color: #eef;
+ cursor: pointer;
+}
+
+.green-tag, .red-tag {
+ font-size: 12px;
+ margin-top: 5px;
+}
+
+.green-tag {
+ color: green;
+}
+
+.red-tag {
+ color: red;
+}
+
+.title-button {
+ background-color: transparent;
+ border: 2px solid #4a90e2;
+ color: #4a90e2;
+ font-size: 1.5rem;
+ font-weight: bold;
+ padding: 5px 15px;
+ cursor: pointer;
+ border-radius: 5px;
+ transition: all 0.3s ease;
+}
+
+.title-button:hover {
+ background-color: #4a90e2;
+ color: white;
+}
+
+.home-btn {
+ background-color: #4a90e2;
+ color: white;
+ border: none;
+ border-radius: 5px;
+ padding: 5px 10px;
+ cursor: pointer;
+ font-size: 1rem;
+ transition: background-color 0.3s ease;
+}
+
+.home-btn:hover {
+ background-color: #357ABD;
+}
+
+.arrow-btn {
+ background-color: #4a90e2;
+ color: white;
+ border: none;
+ border-radius: 5px;
+ padding: 5px 10px;
+ font-size: 1rem;
+ cursor: pointer;
+ transition: background-color 0.3s ease;
+}
+
+.arrow-btn:hover {
+ background-color: #357ABD;
+}
diff --git a/calendar.html b/calendar.html
new file mode 100644
index 0000000..7f4ec30
--- /dev/null
+++ b/calendar.html
@@ -0,0 +1,57 @@
+
+
+
+
+
+ Calendar
+
+
+
+
+
+
+
+
+
+
+
+ | Sun |
+ Mon |
+ Tue |
+ Wed |
+ Thu |
+ Fri |
+ Sat |
+
+
+
+
+
+ |
+ 1
+
+ Green: 0
+ Red: 0
+ |
+
+
+
+
+
+
+
diff --git a/calendar.js b/calendar.js
new file mode 100644
index 0000000..4a360a6
--- /dev/null
+++ b/calendar.js
@@ -0,0 +1,87 @@
+const titleElement = document.getElementById('calendarTitle');
+const calendarBody = document.getElementById('calendarBody');
+const months = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
+let currentMonth = 11; // December (index: 11)
+let currentYear = 2024;
+let dailyProgressData = [];
+
+// API 호출 및 데이터 가져오기
+async function fetchCalendarData(year, month) {
+ try {
+ const response = await fetch(`/api/v1/calendar?year=${year}&month=${month + 1}`);
+ const result = await response.json();
+ if (result.code === "SUCCESS") {
+ dailyProgressData = result.data.daily_progress;
+ } else {
+ console.error("Failed to fetch calendar data");
+ }
+ } catch (error) {
+ console.error("Error fetching calendar data: ", error);
+ }
+}
+
+// 달력 렌더링
+async function renderCalendar() {
+ await fetchCalendarData(currentYear, currentMonth);
+
+ titleElement.textContent = `${months[currentMonth]}, ${currentYear}`;
+ calendarBody.innerHTML = "";
+
+ const firstDay = new Date(currentYear, currentMonth, 1).getDay(); // 시작 요일
+ const daysInMonth = new Date(currentYear, currentMonth + 1, 0).getDate(); // 해당 월의 총 일 수
+
+ let row = "";
+ for (let i = 0; i < firstDay; i++) {
+ row += " | "; // 첫 주 시작 요일 앞의 빈 칸
+ }
+
+ for (let day = 1; day <= daysInMonth; day++) {
+ if ((firstDay + day - 1) % 7 === 0 && day !== 1) {
+ row += "
"; // 주 단위로 행 변경
+ }
+
+ const date = `${currentYear}-${String(currentMonth + 1).padStart(2, "0")}-${String(day).padStart(2, "0")}`;
+ const progress = dailyProgressData.find(p => p.date === date);
+
+ const greenTag = progress?.tasks?.reduce((sum, t) => sum + t.green_tag, 0) || 0;
+ const redTag = progress?.tasks?.reduce((sum, t) => sum + t.red_tag, 0) || 0;
+
+ row += `
+ |
+ ${day}
+ ${greenTag > 0 ? `Green: ${greenTag} ` : ""}
+ ${redTag > 0 ? `Red: ${redTag} ` : ""}
+ | `;
+ }
+
+ row += "
";
+ calendarBody.innerHTML = row;
+}
+
+// 이전 달 버튼
+document.getElementById('prevMonth').addEventListener('click', () => {
+ currentMonth--;
+ if (currentMonth < 0) {
+ currentMonth = 11;
+ currentYear--;
+ }
+ renderCalendar();
+});
+
+// 다음 달 버튼
+document.getElementById('nextMonth').addEventListener('click', () => {
+ currentMonth++;
+ if (currentMonth > 11) {
+ currentMonth = 0;
+ currentYear++;
+ }
+ renderCalendar();
+});
+
+// 홈 버튼 클릭 이벤트 추가
+document.getElementById('homeButton').addEventListener('click', () => {
+ window.location.href = '/'; // 홈 페이지 URL로 이동
+});
+
+// 초기 렌더링
+renderCalendar();
diff --git a/calendar_MG.css b/calendar_MG.css
new file mode 100644
index 0000000..dfdbc22
--- /dev/null
+++ b/calendar_MG.css
@@ -0,0 +1,169 @@
+/* 전체 페이지 스타일 */
+body {
+ margin: 0;
+ font-family: Arial, sans-serif;
+ background-color: #F1F3F9;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ height: 100vh;
+}
+
+/* 홈 버튼 스타일 */
+.home {
+ position: absolute;
+ top: 20px;
+ left: 20px;
+ background-color: #6FD1C5;
+ color: #FFFFFF;
+ padding: 10px 15px;
+ border-radius: 6px;
+ text-decoration: none;
+ font-weight: bold;
+ font-size: 14px;
+ transition: background-color 0.3s;
+}
+
+.home:hover {
+ background-color: #5BAA9D;
+}
+
+/* 탭 메뉴 스타일 */
+.tabs {
+ position: absolute;
+ top: 20px;
+ right: 20px;
+ display: flex;
+ gap: 10px;
+}
+
+.tabs button {
+ background-color: #6FD1C5;
+ border: none;
+ border-radius: 6px;
+ padding: 8px 20px;
+ cursor: pointer;
+ font-size: 14px;
+ font-weight: bold;
+ color: #FFFFFF;
+ transition: all 0.3s ease;
+}
+
+.tabs button:hover {
+ background-color: #5BAA9D;
+}
+
+.tabs .active {
+ background-color: #5BAA9D;
+}
+
+/* 메인 컨테이너 스타일 */
+.container {
+ background-color: #FFFFFF;
+ width: 90%;
+ max-width: 700px;
+ padding: 30px;
+ border-radius: 12px;
+ box-shadow: 0 8px 12px rgba(0, 0, 0, 0.1);
+ margin-top: 80px;
+ height: calc(100vh - 120px);
+ overflow-y: auto;
+}
+
+.section h2 {
+ font-size: 28px;
+ font-weight: bold;
+ color: #333333;
+ margin-bottom: 20px;
+ text-align: center;
+}
+
+/* 월 표시 */
+.month-box {
+ background-color: #E3F2FD;
+ padding: 12px;
+ margin: 10px auto 20px;
+ text-align: center;
+ font-size: 20px;
+ font-weight: bold;
+ color: #1976D2;
+ border-radius: 10px;
+ width: 80px;
+ border: 1px solid #BBDEFB;
+}
+
+/* 진행률 바 스타일 */
+.progress-container {
+ width: 100%;
+ background-color: #EEEEEE;
+ border-radius: 12px;
+ margin-bottom: 20px;
+ position: relative;
+ height: 20px;
+}
+
+.progress-bar {
+ height: 100%;
+ background-color: #6FD1C5;
+ border-radius: 12px;
+ width: 0%; /* 초기 진행률 0% */
+ transition: width 0.5s ease-in-out;
+}
+
+.progress-label {
+ position: absolute;
+ top: 50%;
+ left: 50%;
+ transform: translate(-50%, -50%);
+ font-weight: bold;
+ font-size: 12px;
+}
+
+/* 할 일 아이템 스타일 */
+.todo-item {
+ background-color: #FAFAFA;
+ border: 1px solid #EEEEEE;
+ border-radius: 10px;
+ padding: 15px;
+ margin-bottom: 15px;
+ display: flex;
+ flex-direction: column;
+ box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
+}
+
+.todo-item h3 {
+ margin: 0 0 8px;
+ font-size: 16px;
+ color: #424242;
+}
+
+.todo-item p {
+ margin: 0 0 10px;
+ color: #757575;
+ font-size: 14px;
+}
+
+.priority {
+ display: inline-block;
+ padding: 4px 12px;
+ border-radius: 12px;
+ font-size: 12px;
+ font-weight: bold;
+ text-transform: uppercase;
+ width: fit-content;
+}
+
+.priority.high {
+ color: #D32F2F;
+ background-color: #FFCDD2;
+}
+
+.priority.medium {
+ color: #F57C00;
+ background-color: #FFE0B2;
+}
+
+.priority.low {
+ color: #388E3C;
+ background-color: #C8E6C9;
+}
diff --git a/calendar_MG.html b/calendar_MG.html
new file mode 100644
index 0000000..2d67252
--- /dev/null
+++ b/calendar_MG.html
@@ -0,0 +1,38 @@
+
+
+
+
+
+ Monthly To-Do List
+
+
+
+
+Home
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/calendar_MG.iml b/calendar_MG.iml
new file mode 100644
index 0000000..9465dd8
--- /dev/null
+++ b/calendar_MG.iml
@@ -0,0 +1,11 @@
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/calendar_MG.js b/calendar_MG.js
new file mode 100644
index 0000000..d4891d4
--- /dev/null
+++ b/calendar_MG.js
@@ -0,0 +1,41 @@
+// To-Do 리스트 데이터 예시
+const todoData = [
+ { title: "Task Title", description: "Description of the task goes here.", priority: "high" },
+ { title: "Another Task", description: "Description of the task goes here.", priority: "medium" },
+ { title: "Low Priority Task", description: "Description of the task goes here.", priority: "low" }
+];
+
+// HTML 요소 가져오기
+const todoList = document.getElementById('todoList');
+const progressBar = document.getElementById('progressBar');
+const progressLabel = document.getElementById('progressLabel');
+
+// To-Do 리스트 렌더링 함수
+function renderTodoList(tasks = []) {
+ todoList.innerHTML = ""; // 기존 내용 초기화
+
+ tasks.forEach(task => {
+ const todoItem = document.createElement('div');
+ todoItem.classList.add('todo-item');
+
+ todoItem.innerHTML = `
+ ${task.title}
+ ${task.description}
+ ${task.priority.toUpperCase()}
+ `;
+
+ todoList.appendChild(todoItem);
+ });
+}
+
+// 진행률 바 업데이트 함수
+function updateProgressBar(rate = 0) {
+ progressBar.style.width = `${rate}%`;
+ progressLabel.textContent = `${rate}%`;
+}
+
+// API 호출 시뮬레이션 (테스트용)
+document.addEventListener('DOMContentLoaded', () => {
+ renderTodoList(todoData); // 더미 데이터 렌더링
+ updateProgressBar(0); // 초기 진행률은 0%
+});
diff --git a/calendar_html.iml b/calendar_html.iml
new file mode 100644
index 0000000..9465dd8
--- /dev/null
+++ b/calendar_html.iml
@@ -0,0 +1,11 @@
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/src/main/resources/templates/.gitignore b/src/main/resources/templates/.gitignore
new file mode 100644
index 0000000..f68d109
--- /dev/null
+++ b/src/main/resources/templates/.gitignore
@@ -0,0 +1,29 @@
+### IntelliJ IDEA ###
+out/
+!**/src/main/**/out/
+!**/src/test/**/out/
+
+### Eclipse ###
+.apt_generated
+.classpath
+.factorypath
+.project
+.settings
+.springBeans
+.sts4-cache
+bin/
+!**/src/main/**/bin/
+!**/src/test/**/bin/
+
+### NetBeans ###
+/nbproject/private/
+/nbbuild/
+/dist/
+/nbdist/
+/.nb-gradle/
+
+### VS Code ###
+.vscode/
+
+### Mac OS ###
+.DS_Store
\ No newline at end of file
diff --git a/src/main/resources/templates/Calender_MG.html b/src/main/resources/templates/Calender_MG.html
deleted file mode 100644
index 65c078a..0000000
--- a/src/main/resources/templates/Calender_MG.html
+++ /dev/null
@@ -1,494 +0,0 @@
-
-
-
-
-
-
-
-
- My Framer Site
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Monthly goals (Dec)
-
-
-
-
-
-
-
-
-
-
-
-
- Business Process Mangement Project
-
-
-
-
- How to make BPMN files
-
-
-
-
-
-
-
-
-
-
-
-
- Business Process Mangement Project
-
-
-
-
- How to make BPMN files
-
-
-
-
-
-
-
-
-
-
-
-
- Business Process Mangement Project
-
-
-
-
- How to make BPMN files
-
-
-
-
-
-
-
-
-
-
-
-
-
- Develop API Endpoints
-
-
-
-
-
-
- Code and test all API endpoints necessary for the front-end and back-end communication
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
diff --git a/src/main/resources/templates/Calender_T.html b/src/main/resources/templates/Calender_T.html
deleted file mode 100644
index 69e3a8b..0000000
--- a/src/main/resources/templates/Calender_T.html
+++ /dev/null
@@ -1,363 +0,0 @@
-
-
-
-
-
-
-
-
- My Framer Site
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Business Process Mangement Project
-
-
-
-
- How to make BPMN files
-
-
-
-
-
-
-
-
-
-
-
- Set Up Development Environment
-
-
-
-
- Configure the development environment, including IDE setup, version control, and dependencies.
-
-
-
-
-
-
-
-
-
-
-
- Create Database Schema
-
-
-
-
- Design and implement the database schema for data storage, ensuring scalability and security.
-
-
-
-
-
-
-
-
-
-
-
-
- Develop API Endpoints
-
-
-
-
-
-
- Code and test all API endpoints necessary for the front-end and back-end communication
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
diff --git a/src/main/resources/templates/Calender_WG.html b/src/main/resources/templates/Calender_WG.html
deleted file mode 100644
index 6c04a29..0000000
--- a/src/main/resources/templates/Calender_WG.html
+++ /dev/null
@@ -1,452 +0,0 @@
-
-
-
-
-
-
-
-
- My Framer Site
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Weekly goals(Week 3)
-
-
-
-
-
-
-
-
-
-
-
-
- Business Process Mangement Project
-
-
-
-
- How to make BPMN files
-
-
-
-
-
-
-
-
-
-
-
-
- Business Process Mangement Project
-
-
-
-
- How to make BPMN files
-
-
-
-
-
-
-
-
-
-
-
-
- Create Database Schema
-
-
-
-
- Design and implement the database schema for data storage, ensuring scalability and security.
-
-
-
-
-
-
-
-
-
-
-
-
- Develop API Endpoints
-
-
-
-
-
-
- Code and test all API endpoints necessary for the front-end and back-end communication
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
diff --git a/src/main/resources/templates/calendar_DG.css b/src/main/resources/templates/calendar_DG.css
new file mode 100644
index 0000000..b4a61b2
--- /dev/null
+++ b/src/main/resources/templates/calendar_DG.css
@@ -0,0 +1,168 @@
+/* 전체 페이지 스타일 */
+body {
+ margin: 0;
+ font-family: Arial, sans-serif;
+ background-color: #F1F3F9;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ height: 100vh;
+}
+
+/* 홈 버튼 스타일 */
+.home {
+ position: absolute;
+ top: 20px;
+ left: 20px;
+ background-color: #6FD1C5;
+ color: #FFFFFF;
+ padding: 10px 15px;
+ border-radius: 6px;
+ text-decoration: none;
+ font-weight: bold;
+ font-size: 14px;
+ transition: background-color 0.3s;
+}
+
+.home:hover {
+ background-color: #5BAA9D;
+}
+
+/* 탭 메뉴 스타일 */
+.tabs {
+ position: absolute;
+ top: 20px;
+ right: 20px;
+ display: flex;
+ gap: 10px;
+}
+
+.tabs button {
+ background-color: #6FD1C5;
+ border: none;
+ border-radius: 6px;
+ padding: 8px 20px;
+ cursor: pointer;
+ font-size: 14px;
+ font-weight: bold;
+ color: #FFFFFF;
+ transition: all 0.3s ease;
+}
+
+.tabs button:hover {
+ background-color: #5BAA9D;
+}
+
+.tabs .active {
+ background-color: #5BAA9D;
+}
+
+/* 메인 컨테이너 스타일 */
+.container {
+ background-color: #FFFFFF;
+ width: 90%;
+ max-width: 700px;
+ padding: 30px;
+ border-radius: 12px;
+ box-shadow: 0 8px 12px rgba(0, 0, 0, 0.1);
+ margin-top: 80px;
+ height: calc(100vh - 120px);
+ overflow-y: auto;
+}
+
+.section h2 {
+ font-size: 28px;
+ font-weight: bold;
+ color: #333333;
+ margin-bottom: 20px;
+ text-align: center;
+}
+
+.date-box {
+ background-color: #E3F2FD;
+ padding: 12px;
+ margin: 10px auto 20px;
+ text-align: center;
+ font-size: 20px;
+ font-weight: bold;
+ color: #1976D2;
+ border-radius: 10px;
+ width: 80px;
+ border: 1px solid #BBDEFB;
+}
+
+/* 진행률 바 스타일 */
+.progress-container {
+ position: relative;
+ background-color: #E0E0E0;
+ border-radius: 10px;
+ height: 20px;
+ margin: 20px 0;
+ overflow: hidden;
+}
+
+.progress-bar {
+ background-color: #6FD1C5;
+ height: 100%;
+ width: 0; /* 초기 진행률 */
+ transition: width 0.5s ease-in-out;
+}
+
+.progress-label {
+ position: absolute;
+ top: 50%;
+ left: 50%;
+ transform: translate(-50%, -50%);
+ font-size: 12px;
+ font-weight: bold;
+ color: #424242;
+}
+
+/* 할 일 아이템 스타일 */
+.todo-item {
+ background-color: #FAFAFA;
+ border: 1px solid #EEEEEE;
+ border-radius: 10px;
+ padding: 15px;
+ margin-bottom: 15px;
+ display: flex;
+ flex-direction: column;
+ box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
+}
+
+.todo-item h3 {
+ margin: 0 0 8px;
+ font-size: 16px;
+ color: #424242;
+}
+
+.todo-item p {
+ margin: 0 0 10px;
+ color: #757575;
+ font-size: 14px;
+}
+
+.priority {
+ display: inline-block;
+ padding: 4px 12px;
+ border-radius: 12px;
+ font-size: 12px;
+ font-weight: bold;
+ text-transform: uppercase;
+ width: fit-content;
+}
+
+.priority.high {
+ color: #D32F2F;
+ background-color: #FFCDD2;
+}
+
+.priority.medium {
+ color: #F57C00;
+ background-color: #FFE0B2;
+}
+
+.priority.low {
+ color: #388E3C;
+ background-color: #C8E6C9;
+}
diff --git a/src/main/resources/templates/calendar_DG.html b/src/main/resources/templates/calendar_DG.html
new file mode 100644
index 0000000..4fabbc8
--- /dev/null
+++ b/src/main/resources/templates/calendar_DG.html
@@ -0,0 +1,48 @@
+
+
+
+
+
+ Daily To-Do List
+
+
+
+
+Home
+
+
+
+
+
+
+
+
Daily
+
+
16
+
+
+
+
+
+
+
+
Task Title
+
Description of the task goes here.
+
High
+
+
+
+
+
+
+
+
diff --git a/src/main/resources/templates/calendar_DG.iml b/src/main/resources/templates/calendar_DG.iml
new file mode 100644
index 0000000..9465dd8
--- /dev/null
+++ b/src/main/resources/templates/calendar_DG.iml
@@ -0,0 +1,11 @@
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/src/main/resources/templates/calendar_DG.js b/src/main/resources/templates/calendar_DG.js
new file mode 100644
index 0000000..30ff4ae
--- /dev/null
+++ b/src/main/resources/templates/calendar_DG.js
@@ -0,0 +1,41 @@
+// To-Do 리스트 데이터
+const todoData = [
+ { title: "Task Title", description: "Description of the task goes here.", priority: "high" },
+ { title: "Another Task", description: "Description of the task goes here.", priority: "medium" },
+ { title: "Low Priority Task", description: "Description of the task goes here.", priority: "low" }
+];
+
+// HTML 요소 가져오기
+const todoList = document.getElementById('todoList');
+const progressBar = document.getElementById('progressBar');
+const progressLabel = document.getElementById('progressLabel');
+
+// 진행률 바 업데이트 함수
+function updateProgressBar(rate = 0) {
+ progressBar.style.width = `${rate}%`;
+ progressLabel.textContent = `${rate}%`;
+}
+
+// To-Do 리스트 렌더링 함수
+function renderTodoList() {
+ todoList.innerHTML = ""; // 기존 내용 초기화
+
+ todoData.forEach(task => {
+ const todoItem = document.createElement('div');
+ todoItem.classList.add('todo-item');
+
+ todoItem.innerHTML = `
+ ${task.title}
+ ${task.description}
+ ${task.priority.charAt(0).toUpperCase() + task.priority.slice(1)}
+ `;
+
+ todoList.appendChild(todoItem);
+ });
+}
+
+// 초기 렌더링
+document.addEventListener('DOMContentLoaded', () => {
+ renderTodoList(); // To-Do 리스트 렌더링
+ updateProgressBar(0); // 초기 진행률 0%
+});
diff --git a/src/main/resources/templates/calender.html b/src/main/resources/templates/calender.html
deleted file mode 100644
index b51b7b0..0000000
--- a/src/main/resources/templates/calender.html
+++ /dev/null
@@ -1,2183 +0,0 @@
-
-
-
-
-
-
-
-
- My Framer Site
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Monthly goal (Week 1)
-
-
-
-
-
-
- Monthly goal (Week 3)
-
-
-
-
-
-
- Monthly goal (Week 4)
-
-
-
-
-
-
- Monthly goal (Week 5)
-
-
-
-
-
-
- Monthly goal (Week 2)
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-

-
-
-
-
-
-
-
-
-
-
-

-
-
-
-
-
-
-
-
-
-
-
-

-
-
-
-
-
-
-
-
-

-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-

-
-
-
-
-
-
-
-
-
-
-

-
-
-
-
-
-
-

-
-
-
-
-
-
-
-
-
-
-
-
-

-
-
-
-
-
-
-
-
-
-
-
-
-
-
-

-
-
-
-
-
-
-
-

-
-
-
-
-
-
-
-
-

-
-
-
-
-
-
-
-
-
-

-
-
-
-
-
-

-
-
-
-
-
-
-

-
-
-
-
-
-
-
-

-
-
-
-
-
-
-
-
-
-
-

-
-
-
-
-
-
-
-

-
-
-
-
-
-
-
-

-
-
-
-
-
-
-
-

-
-
-
-
-
-
-
-
-
-
-

-
-
-
-
-
-

-
-
-
-
-
-
-
-
-
-
-
-
-
-

-
-
-
-
-
-
-

-
-
-
-
-
-
-
-
-
-

-
-
-
-
-
-
-

-
-
-
-
-
-
-
-
-
-
-
-
- Monthly goal
-
-
- (Dec)
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-