Amkor/Groupware
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

udpate login.html

Browse Source
This commit is contained in:
backuppc
2025-07-10 14:36:05 +09:00
parent 43526a26ec
commit 26cb328f8f
31 changed files with 866 additions and 543 deletions
Download Patch File Download Diff File Expand all files Collapse all files

145
Project/Web/wwwroot/login.html
View File

@@ -116,6 +116,17 @@
transform: translateY(-1.5rem) scale(0.85);
color: #3b82f6;
}
/* 드롭다운 스타일 */
select.input-field option {
background-color: #1f2937;
color: white;
}
select.input-field:focus option:checked {
background-color: #3b82f6;
}
select.input-field option:hover {
background-color: #374151;
}
</style>
</head>
<body class="gradient-bg min-h-screen flex items-center justify-center p-4">
@@ -133,8 +144,28 @@
<p class="text-white/70 text-sm">로그인하여 시스템에 접속하세요</p>
</div>
<!-- 로그인 폼 -->
<!-- 로그인 폼 -->
<form id="loginForm" class="space-y-6 animate-slide-up">
<!-- Gcode 드롭다운 -->
<div class="relative">
<select
id="gcode"
name="gcode"
class="input-field w-full px-4 py-3 bg-white/10 border border-white/20 rounded-xl text-white focus:outline-none focus:border-primary-400 input-focus appearance-none"
required
>
<option value="" class="text-gray-800">부서를 선택하세요</option>
</select>
<label for="gcode" class="floating-label absolute left-4 top-3 text-white/60 text-sm pointer-events-none">
부서 선택
</label>
<div class="absolute right-3 top-3 pointer-events-none">
<svg class="w-5 h-5 text-white/40" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path>
</svg>
</div>
</div>
<!-- 사용자 ID 입력 -->
<div class="relative">
<input
@@ -244,25 +275,27 @@
document.getElementById('loginForm').addEventListener('submit', function(e) {
e.preventDefault();
const gcode = document.getElementById('gcode').value;
const userId = document.getElementById('userId').value;
const password = document.getElementById('password').value;
const rememberMe = document.querySelector('input[type="checkbox"]').checked;
if (!userId || !password) {
showError('사용자 ID와 비밀번호를 입력해주세요.');
if (!gcode || !userId || !password) {
showError('그룹코드/사용자ID/비밀번호를 입력해주세요.');
return;
}
// 로딩 표시
showLoading();
// HomeController의 로그인 API 호출
// HomeController의 로그인 API 호출
fetch('http://127.0.0.1:9000/Home/Login', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({
Gcode: gcode,
UserId: userId,
Password: password,
RememberMe: rememberMe
@@ -276,6 +309,11 @@
// 로그인 성공
showSuccess(data.Message);
// WebView2에 로그인 성공 메시지 전송
if (window.chrome && window.chrome.webview) {
window.chrome.webview.postMessage('LOGIN_SUCCESS');
}
// 리다이렉트 URL이 있으면 이동
if (data.RedirectUrl) {
setTimeout(() => {
@@ -342,12 +380,103 @@
}, 3000);
}
// 그룹 목록 로드
function loadUserGroups() {
fetch('http://127.0.0.1:9000/DashBoard/GetUserGroups')
.then(response => response.json())
.then(data => {
const gcodeSelect = document.getElementById('gcode');
// 기존 옵션 제거 (첫 번째 옵션 제외)
while (gcodeSelect.children.length > 1) {
gcodeSelect.removeChild(gcodeSelect.lastChild);
}
// 데이터 추가
data.forEach(group => {
if (group.gcode && group.name) {
const option = document.createElement('option');
option.value = group.gcode;
option.textContent = group.name;
option.className = 'text-gray-800';
gcodeSelect.appendChild(option);
}
});
// 이전 로그인 정보 설정
setPreviousLoginInfo();
})
.catch(error => {
console.error('그룹 목록 로드 중 오류 발생:', error);
showError('부서 목록을 불러오는 중 오류가 발생했습니다.');
});
}
// 이전 로그인 정보 설정
function setPreviousLoginInfo() {
// HomeController의 GetPreviousLoginInfo API 호출
fetch('http://127.0.0.1:9000/Home/GetPreviousLoginInfo')
.then(response => response.json())
.then(data => {
if (data.Success && data.Data) {
handlePreviousLoginInfo(data.Data);
}
})
.catch(error => {
console.error('이전 로그인 정보 로드 중 오류 발생:', error);
// 오류가 발생해도 기본 포커스 설정
setTimeout(() => {
document.getElementById('gcode').focus();
}, 100);
});
}
// 이전 로그인 정보 처리
function handlePreviousLoginInfo(data) {
let hasPreviousInfo = false;
if (data && data.Gcode) {
// 부서 선택
const gcodeSelect = document.getElementById('gcode');
gcodeSelect.value = data.Gcode;
// 부서 선택 시 라벨 애니메이션 적용
const label = gcodeSelect.nextElementSibling;
if (label && label.classList.contains('floating-label')) {
label.style.transform = 'translateY(-1.5rem) scale(0.85)';
label.style.color = '#3b82f6';
}
hasPreviousInfo = true;
}
if (data && data.UserId) {
// 사용자 ID 설정
document.getElementById('userId').value = data.UserId;
// 사용자 ID 입력 시 라벨 애니메이션 적용
const userIdInput = document.getElementById('userId');
const label = userIdInput.nextElementSibling;
if (label && label.classList.contains('floating-label')) {
label.style.transform = 'translateY(-1.5rem) scale(0.85)';
label.style.color = '#3b82f6';
}
hasPreviousInfo = true;
}
// 이전 로그인 정보가 있으면 비밀번호 필드에, 없으면 부서 선택에 포커스
setTimeout(() => {
if (hasPreviousInfo) {
document.getElementById('password').focus();
} else {
document.getElementById('gcode').focus();
}
}, 100);
}
// 페이지 로드 시 애니메이션
document.addEventListener('DOMContentLoaded', function() {
// 입력 필드에 자동 포커스
setTimeout(() => {
document.getElementById('userId').focus();
}, 500);
// 그룹 목록 로드
loadUserGroups();
});
</script>
</body>