first commit 2
This commit is contained in:
hmw1001
@@ -0,0 +1,214 @@
|
||||
// 설문 관리 관리자 JavaScript
|
||||
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
// 확인 대화상자
|
||||
const confirmButtons = document.querySelectorAll('[onclick*="confirm"]');
|
||||
confirmButtons.forEach(button => {
|
||||
button.addEventListener('click', function(e) {
|
||||
const message = this.getAttribute('onclick').match(/confirm\('([^']+)'\)/);
|
||||
if (message && !confirm(message[1])) {
|
||||
e.preventDefault();
|
||||
return false;
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// 툴팁 초기화
|
||||
const tooltips = document.querySelectorAll('[title]');
|
||||
tooltips.forEach(element => {
|
||||
element.addEventListener('mouseenter', function() {
|
||||
const title = this.getAttribute('title');
|
||||
if (title) {
|
||||
this.setAttribute('data-original-title', title);
|
||||
this.removeAttribute('title');
|
||||
|
||||
const tooltip = document.createElement('div');
|
||||
tooltip.className = 'tooltip';
|
||||
tooltip.textContent = title;
|
||||
tooltip.style.cssText = `
|
||||
position: absolute;
|
||||
background: #333;
|
||||
color: white;
|
||||
padding: 5px 10px;
|
||||
border-radius: 4px;
|
||||
font-size: 12px;
|
||||
z-index: 1000;
|
||||
pointer-events: none;
|
||||
`;
|
||||
|
||||
document.body.appendChild(tooltip);
|
||||
|
||||
const rect = this.getBoundingClientRect();
|
||||
tooltip.style.left = rect.left + (rect.width / 2) - (tooltip.offsetWidth / 2) + 'px';
|
||||
tooltip.style.top = rect.top - tooltip.offsetHeight - 5 + 'px';
|
||||
|
||||
this._tooltip = tooltip;
|
||||
}
|
||||
});
|
||||
|
||||
element.addEventListener('mouseleave', function() {
|
||||
if (this._tooltip) {
|
||||
document.body.removeChild(this._tooltip);
|
||||
this._tooltip = null;
|
||||
}
|
||||
|
||||
const originalTitle = this.getAttribute('data-original-title');
|
||||
if (originalTitle) {
|
||||
this.setAttribute('title', originalTitle);
|
||||
this.removeAttribute('data-original-title');
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// 자동 저장 기능 (폼이 있는 경우)
|
||||
const forms = document.querySelectorAll('form');
|
||||
forms.forEach(form => {
|
||||
const inputs = form.querySelectorAll('input, textarea, select');
|
||||
inputs.forEach(input => {
|
||||
input.addEventListener('change', function() {
|
||||
// 자동 저장 로직 (필요시 구현)
|
||||
console.log('Form data changed:', this.name, this.value);
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
// 유틸리티 함수들
|
||||
window.SurveyAdmin = window.SurveyAdmin || {
|
||||
// 숫자 포맷팅
|
||||
formatNumber: function(num) {
|
||||
return new Intl.NumberFormat('ko-KR').format(num);
|
||||
},
|
||||
|
||||
// 날짜 포맷팅
|
||||
formatDate: function(dateString) {
|
||||
const date = new Date(dateString);
|
||||
return date.toLocaleDateString('ko-KR');
|
||||
},
|
||||
|
||||
// 시간 포맷팅
|
||||
formatDateTime: function(dateString) {
|
||||
const date = new Date(dateString);
|
||||
return date.toLocaleString('ko-KR');
|
||||
},
|
||||
|
||||
// AJAX 요청
|
||||
ajax: function(url, data, callback) {
|
||||
const xhr = new XMLHttpRequest();
|
||||
xhr.open('POST', url, true);
|
||||
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
|
||||
|
||||
xhr.onreadystatechange = function() {
|
||||
if (xhr.readyState === 4) {
|
||||
if (xhr.status === 200) {
|
||||
try {
|
||||
const response = JSON.parse(xhr.responseText);
|
||||
callback(null, response);
|
||||
} catch (e) {
|
||||
callback(null, xhr.responseText);
|
||||
}
|
||||
} else {
|
||||
callback(new Error('Request failed: ' + xhr.status));
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
const params = new URLSearchParams(data).toString();
|
||||
xhr.send(params);
|
||||
},
|
||||
|
||||
// 알림 표시
|
||||
showAlert: function(message, type = 'info') {
|
||||
const alert = document.createElement('div');
|
||||
alert.className = `alert alert-${type}`;
|
||||
alert.textContent = message;
|
||||
alert.style.cssText = `
|
||||
position: fixed;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
z-index: 9999;
|
||||
min-width: 300px;
|
||||
animation: slideInRight 0.3s ease;
|
||||
`;
|
||||
|
||||
document.body.appendChild(alert);
|
||||
|
||||
setTimeout(() => {
|
||||
alert.style.animation = 'slideOutRight 0.3s ease';
|
||||
setTimeout(() => {
|
||||
if (alert.parentNode) {
|
||||
alert.parentNode.removeChild(alert);
|
||||
}
|
||||
}, 300);
|
||||
}, 3000);
|
||||
},
|
||||
|
||||
// 로딩 표시
|
||||
showLoading: function(show = true) {
|
||||
let loading = document.getElementById('loading-overlay');
|
||||
|
||||
if (show) {
|
||||
if (!loading) {
|
||||
loading = document.createElement('div');
|
||||
loading.id = 'loading-overlay';
|
||||
loading.innerHTML = `
|
||||
<div style="
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: rgba(0,0,0,0.5);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
z-index: 9999;
|
||||
">
|
||||
<div style="
|
||||
background: white;
|
||||
padding: 20px;
|
||||
border-radius: 8px;
|
||||
text-align: center;
|
||||
">
|
||||
<div style="
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border: 4px solid #f3f3f3;
|
||||
border-top: 4px solid #AA20FF;
|
||||
border-radius: 50%;
|
||||
animation: spin 1s linear infinite;
|
||||
margin: 0 auto 10px;
|
||||
"></div>
|
||||
<div>처리 중...</div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
document.body.appendChild(loading);
|
||||
}
|
||||
} else {
|
||||
if (loading) {
|
||||
loading.parentNode.removeChild(loading);
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
// CSS 애니메이션 추가
|
||||
const style = document.createElement('style');
|
||||
style.textContent = `
|
||||
@keyframes slideInRight {
|
||||
from { transform: translateX(100%); opacity: 0; }
|
||||
to { transform: translateX(0); opacity: 1; }
|
||||
}
|
||||
|
||||
@keyframes slideOutRight {
|
||||
from { transform: translateX(0); opacity: 1; }
|
||||
to { transform: translateX(100%); opacity: 0; }
|
||||
}
|
||||
|
||||
@keyframes spin {
|
||||
0% { transform: rotate(0deg); }
|
||||
100% { transform: rotate(360deg); }
|
||||
}
|
||||
`;
|
||||
document.head.appendChild(style);
|
||||
Reference in New Issue
Block a user