회원 탈퇴와 덱 일괄 삭제 추가
This commit is contained in:
69
profile.html
69
profile.html
@@ -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>
|
||||
|
||||
Reference in New Issue
Block a user