Skip to content

Commit

Permalink
Merge pull request #83 from hyosung-second-team1/jsp-calendar
Browse files Browse the repository at this point in the history 
[feat] 알람창 알람 삭제
  • Loading branch information
@soo01234
soo01234 authored May 15, 2024
2 parents ca8833a + 67ae3c5 commit 4837b12
Show file tree
Hide file tree
Showing 4 changed files with 76 additions and 51 deletions.
46 changes: 28 additions & 18 deletions src/main/resources/static/css/inc/alarm.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,8 @@
z-index: 50; /* 다른 요소 위에 표시하기 위해 z-index를 설정합니다. */
border-radius: 10px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); /* 가로, 세로, 흐림 정도, 색상 */;
padding: 10px;
/*padding: 10px;*/
padding: 10px 0;
/* border-radius: .3rem; */
background-color: #ffffff;
/* border-color: #4FD1C5; */
Expand All @@ -52,7 +53,8 @@
display: flex;
flex-direction: column;
height: 100vh;
width: 86%;
width: 100%;
align-items: center;
/*box-shadow: left only;*/
}

Expand All @@ -67,7 +69,7 @@
/* 오버레이를 표시합니다. */
.overlay-container.show-overlay {
display: block;
width: 310px;
width: 235px;
}


Expand All @@ -77,38 +79,40 @@
flex-direction: column;
align-items: center;
height: 90%;
width: 100%;
background-color: #ffffff;
overflow-y: scroll; /* 세로 스크롤 사용 */
}

/* 스크롤바 전체 영역 */
::-webkit-scrollbar {
width: 10px; /* 세로축 스크롤바 폭 너비 */
width: 1px; /* 세로축 스크롤바 폭 너비 */
height: 20px; /* 가로축 스크롤바 폭 너비 */
}

/* 스크롤바 막대 */
::-webkit-scrollbar-thumb {
background: rgba(83, 166, 249, 0.75);
border-radius: 2em;
height: 5px;
}
/*!* 스크롤바 막대 *!*/
/*::-webkit-scrollbar-thumb {*/
/* background: rgba(83, 166, 249, 0.75);*/
/* border-radius: 2em;*/
/* height: 5px;*/
/*}*/

::-webkit-scrollbar-thumb:hover {
background-color:#eeeef1;
}
/*::-webkit-scrollbar-thumb:hover {*/
/* background-color:#eeeef1;*/
/*}*/

/* 스크롤이 움직이는 뒷 배경 */
::-webkit-scrollbar-track {
background: rgba(220, 20, 60, .1); /*스크롤바 뒷 배경 색상*/
}
/*!* 스크롤이 움직이는 뒷 배경 *!*/
/*::-webkit-scrollbar-track {*/
/* background: rgba(220, 20, 60, .1); !*스크롤바 뒷 배경 색상*!*/
/*}*/

/*일정상세카드*/
.card-outer {
display: flex;
flex-direction: column;
align-items: center;
width: 220px;
/*width: 220px;*/
width: 200px;
/*height: 200px;*/
font-size: small;
margin-bottom: 5px;
Expand Down Expand Up @@ -147,6 +151,12 @@
border-radius: 5px;
margin-bottom: 10px;
box-shadow: 0px -5px 10px rgba(0, 0, 0, 0.05), 0px 5px 10px rgba(0, 0, 0, 0.1);
/*box-shadow: 0 1px 2px rgba(0,0,0,0.03),*/
/* 0 2px 4px rgba(0,0,0,0.03),*/
/* 0 4px 8px rgba(0,0,0,0.03),*/
/* 0 8px 16px rgba(0,0,0,0.03),*/
/* 0 16px 32px rgba(0,0,0,0.03),*/
/* 0 32px 64px rgba(0,0,0,0.01);*/
font-weight: bold;
padding: 10px 10px;
}
Expand Down
3 changes: 2 additions & 1 deletion src/main/resources/static/js/calendar.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -165,7 +165,7 @@ $(document).ready(function() {

// 가져온 일정 데이터를 시작 시간을 기준으로 정렬
events.sort((a, b) => {
return new Date(a.start) - new Date(b.start);
return new Date(a.startDate) - new Date(b.startDate);
});

// 가져온 일정 데이터를 리스트 형식으로 추가
Expand All @@ -174,6 +174,7 @@ $(document).ready(function() {
'flex-direction': 'column'
});

console.log(events)

events.forEach(event => {
let li = $('<li>').addClass('event-item');
Expand Down
74 changes: 45 additions & 29 deletions src/main/resources/static/js/inc/alarm.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ $("#alarmIcon").click(function () {
overlay.toggleClass("show-overlay");
});

$(document).ready(function() {
$(".msg-overlay-bubble-list").ready(function() {
// 페이지가 완전히 로드된 후에 알림을 띄우는 함수 실행
showNotifications();
// x 버튼 클릭 시 ...
Expand All @@ -23,10 +23,16 @@ $(document).ready(function() {
console.log("notifyID")
console.log(notifyID)
console.log(isRead)
if (isRead) {
// 해당 일정의 부모 요소를 숨깁니다.
$(this).closest('.card-outer').remove();
} else {
// 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)
Expand All @@ -41,20 +47,19 @@ $(document).ready(function() {
},
success: function (response) {
console.log('데이터 전송 성공:', response);
// if (isRead === true) {
// // 해당 일정의 부모 요소를 숨깁니다.
// $(this).closest('.card-outer').hide();
// }

// 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);
}
})

// if (isRead === true) {
// // 해당 일정의 부모 요소를 숨깁니다.
// $(this).closest('.card-outer').hide();
// }
})

$(document).on('click', '.card-outer', function() {
Expand All @@ -66,14 +71,14 @@ $(document).ready(function() {
console.log(scheduleId)
console.log(notifyCategoryId)

if (notifyCategoryId === 1) {
window.location.href = '/schedule/vote?scheduleId=' + scheduleId;
} else if (notifyCategoryId === 2) {
if (notifyCategoryId === 1) { // 모임 일정 초대
location.href = '/schedule/vote?scheduleId=' + scheduleId;
} else if (notifyCategoryId === 2) { // 모임 일정 장소 확정
// 카드 상세 페이지로 이동
window.location.href = '/schedule/datail?scheduleId=' + scheduleId;
} else if (notifyCategoryId === 3) {
location.href = '/schedule/detail?scheduleId=' + scheduleId;
} else if (notifyCategoryId === 3) { // 일정 예고
// 카드 상세 페이지로 이동
window.location.href = '/schedule/detail?scheduleId=' + scheduleId;
location.href = '/schedule/detail?scheduleId=' + scheduleId;
}

});
Expand Down Expand Up @@ -115,9 +120,20 @@ function showNotifications() {
let startTimeArray = startTime.split(":");
let startTimewithoutSec = startTimeArray[0] + ":" + startTimeArray[1];

// 메세지 가공
let fullMessage = card.message;
let fullMessageArray = fullMessage.split(".");
let message1 = fullMessageArray[0];
let message2 = fullMessageArray[1];
if(message2 === null) {
$cardName.append(fullMessage);
} else {
$cardName.append(message1 + "<br>" + message2);
}


// 데이터 추가
$cardName.append(card.message);
// $cardName.append(card.message);
$cardMain1.append("<h3 style='font-weight: bold; font-size: 15px;'>" + card.name + "</h3>");
//$cardMain2.append('<p><i class="bi bi-calendar-check"> </i>' + startDate + '</p>');
$cardMain3.append('<p style="font-size: 12px;"><i class="bi bi-calendar-check" style="margin-top: 16px;"> </i>' + startDate + '</p>');
Expand All @@ -133,18 +149,18 @@ function showNotifications() {
$cardMain.append($cardMain3);
$(".msg-overlay-bubble-list").append($cardOuter);

if (card.placeName === null) {
$cardMain2.append('<p style="font-size: 12px;"><i class="bi bi-geo-alt" style="margin-top: 16px;"> </i>' + '투표중' + '</p>')
} else {
$cardMain2.append('<p style="font-size: 12px;"><i class="bi bi-geo-alt" style="margin-top: 16px;"> </i>' + card.placeName + '</p>')
}
// if (card.placeName === null) {
// $cardMain2.append('<p style="font-size: 12px;"><i class="bi bi-geo-alt" style="margin-top: 16px;"> </i>' + '투표중' + '</p>')
// } else {
// $cardMain2.append('<p style="font-size: 12px;"><i class="bi bi-geo-alt" style="margin-top: 16px;"> </i>' + card.placeName + '</p>')
// }

if (card.voteDeadline === null) { // 투표 마감일 X = 개인 일정
$cardMain2.append("");
} else if (card.voteDeadline < today) { // 투표 마감일 지남
//$cardMain3.append("<p style='margin-top: 16px;'>" + "투표 마감</p>");
$cardMain2.append("");
} else { // 투표 마감일 전
$cardMain2.append(card.placeName);
} else { // 투표 마감일 전 (투표중)
let deadline = card.voteDeadline;
let deadlineArray = deadline.split(" ");
let deadlineDate = deadlineArray[0];
Expand All @@ -160,7 +176,7 @@ function showNotifications() {
// console.log(deadlineDateArray[1]) // 05
// console.log('day')
// console.log(deadlineDateArray[2]) // 17
$cardMain3.append("<p style='font-size: 12px;'>" + deadlineMonth + "/" + deadlineDay + " <br>투표 마감</p>");
$cardMain2.append("<p style='font-size: 12px;'><i class=\"bi bi-geo-alt\" style=\"margin-top: 16px;\"> </i>" + deadlineMonth + "/" + deadlineDay + " 투표 마감</p>");
}

$cardMain2.append(
Expand Down
4 changes: 1 addition & 3 deletions src/main/webapp/WEB-INF/views/calendar/calendar.jsp
View file
Original file line number Diff line number Diff line change
Expand Up @@ -65,9 +65,7 @@ pageEncoding="UTF-8"%>
</jsp:include>

<!-- 알람 include -->
<jsp:include page="/WEB-INF/views/inc/alarm.jsp">
<jsp:param value="calendar" name="scheduleName" />
</jsp:include>
<jsp:include page="/WEB-INF/views/inc/alarm.jsp"></jsp:include>

<div class="full-contentbox">
<!--메인부분-->
Expand Down

0 comments on commit 4837b12

Please sign in to comment.