itfirst/sake
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

merge master into develop - CscListRForm.jsp FAQ 아코디언 버그 수정

Browse Source
This commit is contained in:
jilee4unity
2026-05-28 23:34:06 +09:00
parent e293ffe451 de463cbb8f
commit 3668cc89b2
7250 changed files with 570509 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

351
build/resources/main/static/mobile/js/bnft/evntview/Evntview.js Normal file
View File

@@ -0,0 +1,351 @@
/**
* 이벤트 보기 관련 기능 모듈
*/
const EventView = (function() {
// 비공개 변수
let _bnfInnb = 0; // 혜택 고유번호
let _eventDesc = ''; // 이벤트 설명
let _loadingTime = 0; // 로딩 시간(초)
let _mileageAmount = 0; // 마일리지 금액
let _timer = null; // 타이머 객체
let _countdownValue = 0; // 카운트다운 값
let _isParticipated = false;// 참여 여부
let _eventUrl = ''; // 이벤트 URL
let _reviewCheckInterval; // 모달이 열려있는지 확인하는 인터벌
/**
* 토스트 메시지 표시 함수
* @param {string} message - 표시할 메시지
*/
function _showToast(message) {
// 기존에 토스트 요소가 있으면 제거
$('.toastPop').remove();
// 토스트 요소 생성 및 추가
const $toast = $('<div class="toastPop">' + message + '</div>');
$('body').append($toast);
// 토스트 표시 및 자동 제거
setTimeout(function() {
$toast.addClass('show');
setTimeout(function() {
$toast.removeClass('show');
// 애니메이션 완료 후 요소 제거
setTimeout(function() {
$toast.remove();
}, 300);
}, 2000);
}, 100);
}
/**
* 이벤트 모달 생성 함수
*/
function _createEventModal() {
// 기존 모달이 있다면 제거
$('#event-modal').remove();
// 모달 HTML 구조 생성
const modalHTML = `
<div class="eventModal" id="event-modal" style="display:none;">
<div class="eventModal__overlay" style="position:fixed; top:0; left:0; right:0; bottom:0; background-color:rgba(0,0,0,0.6); z-index:999;">
<div class="eventModal__container" style="position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:90%; max-width:800px; max-height:80vh; background-color:#fff; border-radius:5px; overflow:hidden;">
<div class="eventModal__header" style="display:flex; justify-content:space-between; align-items:center; padding:15px; border-bottom:1px solid #e0e0e0;">
<h2 class="eventModal__title" style="margin:0; font-size:18px; font-weight:bold;">이벤트 보기</h2>
<button class="eventModal__close" style="background:transparent; border:0; width:24px; height:24px; position:relative; cursor:pointer;">
<span style="position:absolute; width:2px; height:16px; background-color:#666; top:4px; left:11px; transform:rotate(45deg);"></span>
<span style="position:absolute; width:2px; height:16px; background-color:#666; top:4px; left:11px; transform:rotate(-45deg);"></span>
</button>
</div>
<div class="eventModal__body" style="max-height:calc(80vh - 130px); overflow:hidden;">
<div class="eventModal__content">
<div class="event-iframe-container" style="width:100%; height:calc(80vh - 170px); min-height:300px; overflow:hidden;">
<iframe id="eventIframe" src="about:blank" frameborder="0" style="width:100%; height:100%; border:none;"></iframe>
</div>
<div class="event-timer" style="padding:10px 15px; text-align:center; background-color:#f8f8f8; border-top:1px solid #e0e0e0; font-weight:bold;">
남은 시간: <span id="popupCountdown">0</span>초
</div>
</div>
</div>
<div class="eventModal__btnContainer" style="padding:15px; border-top:1px solid #e0e0e0; text-align:right;">
<button id="event-modal-close-btn" style="padding:8px 16px; border-radius:4px; cursor:pointer; border:none; font-weight:bold; background-color:#f1f1f1; color:#333;">닫기</button>
</div>
</div>
</div>
</div>
`;
// 모달을 페이지에 추가
$('body').append(modalHTML);
// 모달 닫기 버튼에 이벤트 핸들러 직접 연결
$('#event-modal-close-btn, .eventModal__close').on('click', function() {
_closeEventModal();
});
}
/**
* 이벤트 모달 닫기 함수
*/
function _closeEventModal() {
console.log('이벤트 모달 닫기 함수 호출');
// jQuery를 사용하여 모달 직접 닫기
$('#event-modal').fadeOut(300, function() {
// 모달이 완전히 닫힌 후 iframe 소스 비우기
$('#eventIframe').attr('src', 'about:blank');
});
// 타이머 정지
if (_timer) {
clearInterval(_timer);
}
if (_reviewCheckInterval) {
clearInterval(_reviewCheckInterval);
}
// 남은 시간이 없으면 마일리지 적립
if (_countdownValue <= 0) {
_participateEvent();
_showToast('이벤트 보기 완료! 마일리지가 적립되었습니다.');
}
}
// 타이머 시작 함수
function _startTimer() {
// 이미 참여했는지 확인
_checkParticipationAvailable().then(function(available) {
if (!available) {
_isParticipated = true;
showCustomAlert("이미 참여한 이벤트입니다.");
// 이미 참여한 경우 UI 업데이트
_updateUIForCompletedEvent();
return;
}
// 모달 생성
_createEventModal();
// URL을 iframe에 로드
$('#eventIframe').attr('src', _eventUrl);
$('#event-modal').fadeIn(300);
// 카운트다운 표시 업데이트
_countdownValue = _loadingTime;
_updateTimerDisplay();
// 카운트다운 타이머 시작
_timer = setInterval(function() {
_countdownValue--;
_updateTimerDisplay();
if (_countdownValue <= 0) {
clearInterval(_timer);
_participateEvent();
_showToast('이벤트 보기 완료! 마일리지가 적립되었습니다.');
}
}, 1000);
// 모달이 열려있는지 확인하는 인터벌 설정
_reviewCheckInterval = setInterval(function() {
// 모달이 닫혀있으면 처리
if ($('#event-modal').is(':hidden')) {
clearInterval(_reviewCheckInterval);
clearInterval(_timer);
}
}, 1000);
});
}
/**
* 타이머 표시 업데이트 함수
*/
function _updateTimerDisplay() {
$('#popupCountdown').text(_countdownValue);
}
/**
* 이벤트 참여 완료 후 UI 업데이트 함수
*/
function _updateUIForCompletedEvent() {
// 해당 이벤트의 마일리지 표시 요소를 찾아 '적립완료'로 변경
$('.li_mile[data-bnf-innb="' + _bnfInnb + '"]').addClass('on').html('<span>적립완료</span>');
}
/**
* 페이지 초기화 함수
* 페이지 로드 시 이미 참여한 이벤트 표시 업데이트
*/
function _initializePage() {
// 모든 이벤트 요소 확인
$('.li_mile').each(function() {
const bnfInnb = $(this).data('bnf-innb');
if (bnfInnb) {
// 각 이벤트마다 참여 여부 확인
_checkEventParticipation(bnfInnb);
}
});
}
/**
* 특정 이벤트 참여 여부 확인 및 UI 업데이트
* @param {number|string} bnfInnb - 이벤트 고유 번호
*/
function _checkEventParticipation(bnfInnb) {
$.ajax({
url: '/sopmal/bnft/checkParticipationAvailable',
type: 'POST',
contentType: 'application/json',
data: JSON.stringify({
bnfInnb: bnfInnb
}),
success: function(response) {
try {
if (response && response.resBody && response.resBody.result) {
const resultObj = JSON.parse(response.resBody.result);
// 참여 불가능(이미 참여)한 경우 UI 업데이트
if (!resultObj.available) {
_updateUIForCompletedEvent(bnfInnb);
}
}
} catch (e) {
console.error('응답 처리 중 오류 발생:', e);
}
},
error: function(error) {
console.error('이벤트 참여 여부 확인 실패:', error);
}
});
}
// 참여 가능 여부 확인
function _checkParticipationAvailable() {
return new Promise(function(resolve, reject) {
$.ajax({
url: '/sopmal/bnft/checkParticipationAvailable',
type: 'POST',
contentType: 'application/json',
data: JSON.stringify({
bnfInnb: _bnfInnb
}),
success: function(response) {
try {
// 응답 구조에 맞게 처리
if (response && response.resBody && response.resBody.result) {
// JSON 문자열을 객체로 파싱
const resultObj = JSON.parse(response.resBody.result);
resolve(resultObj.available);
} else {
console.error('응답 형식이 올바르지 않습니다:', response);
resolve(false);
}
} catch (e) {
console.error('응답 처리 중 오류 발생:', e);
resolve(false);
}
},
error: function(error) {
console.error('참여 가능 여부 확인 실패:', error);
resolve(false);
}
});
});
}
// 이벤트 참여 및 마일리지 적립
function _participateEvent() {
if (_isParticipated) return;
$.ajax({
url: '/sopmal/bnft/participateEvent',
type: 'POST',
contentType: 'application/json',
data: JSON.stringify({
bnfInnb: _bnfInnb
}),
success: function(response) {
try {
// 응답 구조에 맞게 처리
if (response && response.resBody && response.resBody.result) {
// JSON 문자열을 객체로 파싱
const resultObj = JSON.parse(response.resBody.result);
if (resultObj.success) {
_isParticipated = true;
// UI 업데이트: 마일리지 -> 적립완료
_updateUIForCompletedEvent();
// 토스트 메시지 표시
_showToast('이벤트 보기 완료! 마일리지가 적립되었습니다.');
} else {
console.log('resultObj.message', resultObj.message);
showCustomAlert('마일리지 적립에 실패했습니다.');
}
} else {
console.error('응답 형식이 올바르지 않습니다:', response);
showCustomAlert('마일리지 적립에 실패했습니다.');
}
} catch (e) {
console.error('응답 처리 중 오류 발생:', e);
showCustomAlert('마일리지 적립 중 오류가 발생했습니다.');
}
},
error: function(error) {
console.error('이벤트 참여 실패:', error);
showCustomAlert('이벤트 참여 중 오류가 발생했습니다.');
}
});
}
// 이벤트 시작 함수
function start(bnfInnb, eventDesc, loadingTime, mileageAmount, eventUrl, startDate, endDate) {
// 날짜 검증 추가
if (startDate && endDate) {
const now = new Date();
const eventStart = new Date(startDate);
const eventEnd = new Date(endDate);
if (now < eventStart) {
_showToast("아직 시작되지 않은 이벤트입니다.");
return;
}
if (now > eventEnd) {
_showToast("종료된 이벤트입니다.");
return;
}
}
_bnfInnb = bnfInnb;
_eventDesc = eventDesc;
_loadingTime = loadingTime;
_mileageAmount = mileageAmount;
_eventUrl = eventUrl || '';
_isParticipated = false;
// 타이머 종료
if (_timer) {
clearInterval(_timer);
}
// 타이머 시작
_startTimer();
}
// 페이지 초기화 실행
$(document).ready(function() {
_initializePage();
});
// 공개 API
return {
start: start,
participateEvent: _participateEvent,
showToast: _showToast,
init: _initializePage // 페이지 초기화 함수 노출
};
})();