회원 탈퇴와 덱 일괄 삭제 추가

This commit is contained in:
2026-06-25 17:11:31 +09:00
parent a5b7d720d6
commit 2c4f622408
27 changed files with 613 additions and 51 deletions

View File

@@ -4,7 +4,7 @@
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-4516420168710424" crossorigin="anonymous"></script>
<link rel="stylesheet" href="./style/output.css" />
<link rel="stylesheet" href="./style/output.css?v=4.0.16" />
<link rel="stylesheet" href="./style/app-shell.css" />
<link rel="stylesheet" href="./style/auth-header.css" />
<link rel="stylesheet" href="./style/profile.css" />
@@ -116,6 +116,10 @@
<button type="button" id="profile-open-password" class="profile-btn profile-btn-outline" data-i18n="changePassword">
비밀번호 변경
</button>
<button type="button" id="profile-open-delete" class="mt-8 block w-full cursor-pointer border-0 bg-transparent p-0 text-center text-[10px] font-normal text-slate-300 hover:text-slate-400" data-i18n="accountWithdrawalLink">
회원 탈퇴
</button>
</div>
</div>
</main>
@@ -158,7 +162,25 @@
</div>
</div>
<script src="/script/api.js"></script>
<div id="account-delete-modal" class="profile-modal">
<div class="profile-modal-box">
<h3 data-i18n="accountWithdrawalTitle">회원 탈퇴</h3>
<p class="mb-3 text-sm leading-relaxed text-slate-600" data-i18n="accountWithdrawalDesc">
계정과 개인 정보는 삭제되며 저장한 덱은 다른 사용자가 계속 참고할 수 있도록 익명으로 유지됩니다. 이 작업은 복구할 수 없습니다.
</p>
<div class="profile-field">
<label class="profile-label" for="account-delete-confirmation" data-i18n="accountWithdrawalConfirmLabel">확인을 위해 DELETE를 입력하세요.</label>
<input type="text" id="account-delete-confirmation" class="profile-input" autocomplete="off" placeholder="DELETE" />
</div>
<p id="account-delete-error" class="profile-error hidden"></p>
<div class="profile-modal-actions">
<button type="button" id="account-delete-no" class="profile-btn profile-btn-outline">NO</button>
<button type="button" id="account-delete-yes" class="profile-btn cursor-pointer border-0 bg-red-600 text-white hover:bg-red-700 disabled:cursor-not-allowed disabled:bg-slate-300" disabled>YES</button>
</div>
</div>
</div>
<script src="/script/api.js?v=4.0.16"></script>
<script src="/script/ads.js"></script>
<script src="/script/page-i18n.js"></script>
<script src="/script/page-help.js"></script>
@@ -328,6 +350,10 @@
document.getElementById('profile-username').value = user.username || '';
document.getElementById('profile-avatar').src = resolveAvatarSrc(user);
document.getElementById('profile-avatar-remove').classList.toggle('hidden', !user.avatarUrl);
document.getElementById('profile-open-delete').classList.toggle(
'hidden',
user.role === 'admin',
);
}
/**
@@ -462,6 +488,7 @@
});
const passwordModal = document.getElementById('password-modal');
const accountDeleteModal = document.getElementById('account-delete-modal');
document.getElementById('profile-open-password').addEventListener('click', () => {
document.getElementById('password-current').value = '';
@@ -505,6 +532,44 @@
if (e.target === passwordModal) passwordModal.classList.remove('open');
});
document.getElementById('profile-open-delete').addEventListener('click', () => {
const confirmationInput = document.getElementById('account-delete-confirmation');
confirmationInput.value = '';
document.getElementById('account-delete-error').classList.add('hidden');
document.getElementById('account-delete-yes').disabled = true;
accountDeleteModal.classList.add('open');
confirmationInput.focus();
});
document.getElementById('account-delete-confirmation').addEventListener('input', (event) => {
document.getElementById('account-delete-yes').disabled = event.target.value !== 'DELETE';
});
document.getElementById('account-delete-no').addEventListener('click', () => {
accountDeleteModal.classList.remove('open');
});
document.getElementById('account-delete-yes').addEventListener('click', async () => {
const confirmation = document.getElementById('account-delete-confirmation').value;
const errorEl = document.getElementById('account-delete-error');
const yesButton = document.getElementById('account-delete-yes');
errorEl.classList.add('hidden');
yesButton.disabled = true;
try {
await UaDeckApi.deleteMyAccount(confirmation);
UaDeckApi.logout();
location.href = '/';
} catch (err) {
errorEl.textContent = err.message || t('accountWithdrawalFailed', '회원 탈퇴에 실패했습니다.');
errorEl.classList.remove('hidden');
yesButton.disabled = confirmation !== 'DELETE';
}
});
accountDeleteModal.addEventListener('click', (event) => {
if (event.target === accountDeleteModal) accountDeleteModal.classList.remove('open');
});
init();
</script>
</body>