Harden redemption flow and improve operational safety

This commit is contained in:
youbin
2026-03-31 08:13:38 +08:00
parent e5bab51f98
commit de130f1052
13 changed files with 1138 additions and 106 deletions

View File

@@ -21,6 +21,7 @@
<nav class="nav flex-column">
<a class="nav-link active" href="#" data-tab="codes">兑换码管理</a>
<a class="nav-link" href="#" data-tab="records">兑换记录</a>
<a class="nav-link" href="#" data-tab="audit">审计日志</a>
<a class="nav-link" href="#" id="logoutBtn">退出登录</a>
</nav>
<div class="px-3 mt-3">
@@ -42,6 +43,7 @@
<div class="mb-3">
<button class="btn btn-sm btn-outline-secondary filter-btn" data-filter="all">全部</button>
<button class="btn btn-sm btn-outline-secondary filter-btn" data-filter="available">可用</button>
<button class="btn btn-sm btn-outline-secondary filter-btn" data-filter="processing">处理中</button>
<button class="btn btn-sm btn-outline-secondary filter-btn" data-filter="used">已使用</button>
</div>
<div class="table-responsive">
@@ -59,6 +61,18 @@
<tbody></tbody>
</table>
</div>
<div class="d-flex flex-column flex-md-row justify-content-between align-items-md-center gap-2">
<div class="d-flex align-items-center gap-2">
<label class="form-label mb-0" for="codesPageSize">每页</label>
<select class="form-select form-select-sm w-auto" id="codesPageSize"></select>
<small class="text-muted" id="codesSummary">共 0 条</small>
</div>
<div class="btn-group">
<button class="btn btn-sm btn-outline-secondary" id="codesPrevBtn">上一页</button>
<button class="btn btn-sm btn-outline-secondary disabled" id="codesPageIndicator">第 1 / 1 页</button>
<button class="btn btn-sm btn-outline-secondary" id="codesNextBtn">下一页</button>
</div>
</div>
</div>
</div>
</div>
@@ -80,6 +94,54 @@
<tbody></tbody>
</table>
</div>
<div class="d-flex flex-column flex-md-row justify-content-between align-items-md-center gap-2">
<div class="d-flex align-items-center gap-2">
<label class="form-label mb-0" for="recordsPageSize">每页</label>
<select class="form-select form-select-sm w-auto" id="recordsPageSize"></select>
<small class="text-muted" id="recordsSummary">共 0 条</small>
</div>
<div class="btn-group">
<button class="btn btn-sm btn-outline-secondary" id="recordsPrevBtn">上一页</button>
<button class="btn btn-sm btn-outline-secondary disabled" id="recordsPageIndicator">第 1 / 1 页</button>
<button class="btn btn-sm btn-outline-secondary" id="recordsNextBtn">下一页</button>
</div>
</div>
</div>
</div>
</div>
<div class="tab-content d-none" id="auditTab">
<h4 class="mb-3">审计日志</h4>
<div class="card">
<div class="card-body">
<div class="table-responsive">
<table class="table table-hover" id="auditTable">
<thead>
<tr>
<th>时间</th>
<th>事件</th>
<th>状态</th>
<th>操作人</th>
<th>兑换码</th>
<th>账号</th>
<th>详情</th>
</tr>
</thead>
<tbody></tbody>
</table>
</div>
<div class="d-flex flex-column flex-md-row justify-content-between align-items-md-center gap-2">
<div class="d-flex align-items-center gap-2">
<label class="form-label mb-0" for="auditPageSize">每页</label>
<select class="form-select form-select-sm w-auto" id="auditPageSize"></select>
<small class="text-muted" id="auditSummary">共 0 条</small>
</div>
<div class="btn-group">
<button class="btn btn-sm btn-outline-secondary" id="auditPrevBtn">上一页</button>
<button class="btn btn-sm btn-outline-secondary disabled" id="auditPageIndicator">第 1 / 1 页</button>
<button class="btn btn-sm btn-outline-secondary" id="auditNextBtn">下一页</button>
</div>
</div>
</div>
</div>
</div>
@@ -114,42 +176,174 @@
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
<script>
const defaultPageSize = {{ settings.default_page_size }};
const maxPageSize = {{ settings.max_page_size }};
let currentFilter = 'all';
const paginationState = {
codes: { page: 1, pageSize: defaultPageSize, total: 0, pages: 0 },
records: { page: 1, pageSize: defaultPageSize, total: 0, pages: 0 },
audit: { page: 1, pageSize: defaultPageSize, total: 0, pages: 0 }
};
async function loadCodes() {
const url = currentFilter === 'all' ? '/admin/api/codes' : `/admin/api/codes?status=${currentFilter}`;
function renderStatusBadge(status) {
if (status === 'available') {
return '<span class="badge bg-success">可用</span>';
}
if (status === 'processing') {
return '<span class="badge bg-warning text-dark">处理中</span>';
}
return '<span class="badge bg-secondary">已使用</span>';
}
function renderAuditStatus(status) {
if (status === 'success') {
return '<span class="badge bg-success">成功</span>';
}
if (status === 'warning') {
return '<span class="badge bg-warning text-dark">警告</span>';
}
return '<span class="badge bg-danger">失败</span>';
}
function escapeHtml(value) {
return String(value ?? '')
.replace(/&/g, '&amp;')
.replace(/</g, '&lt;')
.replace(/>/g, '&gt;')
.replace(/"/g, '&quot;')
.replace(/'/g, '&#39;');
}
function renderAuditDetails(details) {
if (!details) return '-';
if (details.message) return escapeHtml(details.message);
return escapeHtml(JSON.stringify(details));
}
function pageSizeOptions() {
return [...new Set([10, 25, 50, 100, defaultPageSize])]
.filter(size => size <= maxPageSize)
.sort((a, b) => a - b);
}
function initPageSizeSelect(id, value, onChange) {
const select = document.getElementById(id);
select.innerHTML = pageSizeOptions().map(size => `
<option value="${size}" ${size === value ? 'selected' : ''}>${size}</option>
`).join('');
select.addEventListener('change', () => onChange(parseInt(select.value, 10) || defaultPageSize));
}
function updatePager(prefix, state) {
const pageCount = state.pages || 1;
document.getElementById(`${prefix}Summary`).textContent = `${state.total}`;
document.getElementById(`${prefix}PageIndicator`).textContent = `${state.page} / ${pageCount}`;
document.getElementById(`${prefix}PrevBtn`).disabled = state.page <= 1;
document.getElementById(`${prefix}NextBtn`).disabled = state.total === 0 || state.page >= pageCount;
}
function renderEmptyRow(tableBodySelector, colspan, message) {
document.querySelector(tableBodySelector).innerHTML = `
<tr><td colspan="${colspan}" class="text-center text-muted py-4">${message}</td></tr>
`;
}
async function loadCodes(page = paginationState.codes.page) {
const params = new URLSearchParams({
page: String(page),
pageSize: String(paginationState.codes.pageSize)
});
if (currentFilter !== 'all') {
params.set('status', currentFilter);
}
const url = `/admin/api/codes?${params.toString()}`;
const response = await fetch(url, { credentials: 'same-origin' });
const data = await response.json();
if (data.success) {
paginationState.codes.page = data.data.page;
paginationState.codes.pageSize = data.data.pageSize;
paginationState.codes.total = data.data.total;
paginationState.codes.pages = data.data.pages;
const tbody = document.querySelector('#codesTable tbody');
tbody.innerHTML = data.data.codes.map(code => `
<tr>
<td><code>${code.code}</code></td>
<td><span class="badge ${code.status === 'available' ? 'bg-success' : 'bg-secondary'}">${code.status === 'available' ? '可用' : '已使用'}</span></td>
<td>${code.createdAt ? new Date(code.createdAt).toLocaleString() : '-'}</td>
<td>${code.usedAt ? new Date(code.usedAt).toLocaleString() : '-'}</td>
<td>${code.usedByUsername || '-'}</td>
<td class="table-actions">
${code.status === 'available' ? `<button class="btn btn-danger btn-sm" onclick="deleteCode('${code.code}')">删除</button>` : ''}
</td>
</tr>
`).join('');
if (!data.data.codes.length) {
renderEmptyRow('#codesTable tbody', 6, '当前筛选条件下暂无兑换码');
} else {
tbody.innerHTML = data.data.codes.map(code => `
<tr>
<td><code>${escapeHtml(code.code)}</code></td>
<td>${renderStatusBadge(code.status)}</td>
<td>${code.createdAt ? new Date(code.createdAt).toLocaleString() : '-'}</td>
<td>${code.usedAt ? new Date(code.usedAt).toLocaleString() : '-'}</td>
<td>${escapeHtml(code.usedByUsername || '-')}</td>
<td class="table-actions">
${code.status === 'available' ? `<button class="btn btn-danger btn-sm" onclick="deleteCode('${code.code}')">删除</button>` : ''}
</td>
</tr>
`).join('');
}
updatePager('codes', paginationState.codes);
}
}
async function loadRecords() {
const response = await fetch('/admin/api/records', { credentials: 'same-origin' });
async function loadRecords(page = paginationState.records.page) {
const params = new URLSearchParams({
page: String(page),
pageSize: String(paginationState.records.pageSize)
});
const response = await fetch(`/admin/api/records?${params.toString()}`, { credentials: 'same-origin' });
const data = await response.json();
if (data.success) {
paginationState.records.page = data.data.page;
paginationState.records.pageSize = data.data.pageSize;
paginationState.records.total = data.data.total;
paginationState.records.pages = data.data.pages;
const tbody = document.querySelector('#recordsTable tbody');
tbody.innerHTML = data.data.records.map(code => `
<tr>
<td><code>${code.code}</code></td>
<td>${code.usedByUsername || '-'}</td>
<td>${code.usedByPrincipalName || '-'}</td>
<td>${code.usedAt ? new Date(code.usedAt).toLocaleString() : '-'}</td>
</tr>
`).join('');
if (!data.data.records.length) {
renderEmptyRow('#recordsTable tbody', 4, '暂无兑换记录');
} else {
tbody.innerHTML = data.data.records.map(code => `
<tr>
<td><code>${escapeHtml(code.code)}</code></td>
<td>${escapeHtml(code.usedByUsername || '-')}</td>
<td>${escapeHtml(code.usedByPrincipalName || '-')}</td>
<td>${code.usedAt ? new Date(code.usedAt).toLocaleString() : '-'}</td>
</tr>
`).join('');
}
updatePager('records', paginationState.records);
}
}
async function loadAudit(page = paginationState.audit.page) {
const params = new URLSearchParams({
page: String(page),
pageSize: String(paginationState.audit.pageSize)
});
const response = await fetch(`/admin/api/audit-events?${params.toString()}`, { credentials: 'same-origin' });
const data = await response.json();
if (data.success) {
paginationState.audit.page = data.data.page;
paginationState.audit.pageSize = data.data.pageSize;
paginationState.audit.total = data.data.total;
paginationState.audit.pages = data.data.pages;
const tbody = document.querySelector('#auditTable tbody');
if (!data.data.events.length) {
renderEmptyRow('#auditTable tbody', 7, '暂无审计日志');
} else {
tbody.innerHTML = data.data.events.map(event => `
<tr>
<td>${event.createdAt ? new Date(event.createdAt).toLocaleString() : '-'}</td>
<td>${escapeHtml(event.eventType)}</td>
<td>${renderAuditStatus(event.status)}</td>
<td>${escapeHtml(event.actor || '-')}</td>
<td>${event.code ? `<code>${escapeHtml(event.code)}</code>` : '-'}</td>
<td>${escapeHtml(event.principalName || event.username || '-')}</td>
<td>${renderAuditDetails(event.details)}</td>
</tr>
`).join('');
}
updatePager('audit', paginationState.audit);
}
}
@@ -158,7 +352,7 @@
const response = await fetch(`/admin/api/codes/${code}`, { method: 'DELETE', credentials: 'same-origin' });
const data = await response.json();
if (data.success) {
loadCodes();
loadCodes(paginationState.codes.page);
} else {
alert(data.message);
}
@@ -169,7 +363,8 @@
document.querySelectorAll('.filter-btn').forEach(b => b.classList.remove('btn-secondary', 'active'));
btn.classList.add('btn-secondary', 'active');
currentFilter = btn.dataset.filter;
loadCodes();
paginationState.codes.page = 1;
loadCodes(1);
});
});
@@ -182,6 +377,7 @@
document.getElementById(link.dataset.tab + 'Tab').classList.remove('d-none');
if (link.dataset.tab === 'codes') loadCodes();
if (link.dataset.tab === 'records') loadRecords();
if (link.dataset.tab === 'audit') loadAudit();
});
});
@@ -198,7 +394,8 @@
const textarea = document.querySelector('#generatedCodes textarea');
textarea.value = data.data.codes.join('\n');
document.getElementById('generatedCodes').classList.remove('d-none');
loadCodes();
paginationState.codes.page = 1;
loadCodes(1);
}
});
@@ -207,7 +404,29 @@
window.location.href = '/admin/';
});
initPageSizeSelect('codesPageSize', paginationState.codes.pageSize, (value) => {
paginationState.codes.pageSize = value;
paginationState.codes.page = 1;
loadCodes(1);
});
initPageSizeSelect('recordsPageSize', paginationState.records.pageSize, (value) => {
paginationState.records.pageSize = value;
paginationState.records.page = 1;
loadRecords(1);
});
initPageSizeSelect('auditPageSize', paginationState.audit.pageSize, (value) => {
paginationState.audit.pageSize = value;
paginationState.audit.page = 1;
loadAudit(1);
});
document.getElementById('codesPrevBtn').addEventListener('click', () => loadCodes(paginationState.codes.page - 1));
document.getElementById('codesNextBtn').addEventListener('click', () => loadCodes(paginationState.codes.page + 1));
document.getElementById('recordsPrevBtn').addEventListener('click', () => loadRecords(paginationState.records.page - 1));
document.getElementById('recordsNextBtn').addEventListener('click', () => loadRecords(paginationState.records.page + 1));
document.getElementById('auditPrevBtn').addEventListener('click', () => loadAudit(paginationState.audit.page - 1));
document.getElementById('auditNextBtn').addEventListener('click', () => loadAudit(paginationState.audit.page + 1));
loadCodes();
</script>
</body>
</html>
</html>

View File

@@ -27,6 +27,15 @@
</form>
</div>
<script>
function escapeHtml(value) {
return String(value ?? '')
.replace(/&/g, '&amp;')
.replace(/</g, '&lt;')
.replace(/>/g, '&gt;')
.replace(/"/g, '&quot;')
.replace(/'/g, '&#39;');
}
document.getElementById('loginForm').addEventListener('submit', async (e) => {
e.preventDefault();
const formData = new FormData(e.target);
@@ -40,9 +49,9 @@
if (data.success) {
window.location.href = '/admin/';
} else {
document.getElementById('message').innerHTML = `<div class="alert alert-danger">${data.message}</div>`;
document.getElementById('message').innerHTML = `<div class="alert alert-danger">${escapeHtml(data.message)}</div>`;
}
});
</script>
</body>
</html>
</html>

View File

@@ -25,11 +25,16 @@
</div>
<div class="mb-3">
<label class="form-label">用户名</label>
{% if settings.default_domain %}
<div class="input-group">
<input type="text" class="form-control" id="usernameInput" placeholder="请输入用户名" required>
<span class="input-group-text">@{{ settings.default_domain }}</span>
</div>
<div class="form-text">请输入您想要的用户名,将自动拼接域名为完整邮箱地址</div>
{% else %}
<input type="text" class="form-control" id="usernameInput" placeholder="请输入完整邮箱地址,例如 alice@example.com" required>
<div class="form-text">当前未配置默认域名,请直接输入完整邮箱地址。</div>
{% endif %}
</div>
<button type="submit" class="btn btn-primary w-100" id="redeemBtn">立即开通</button>
</div>
@@ -50,11 +55,21 @@
<div class="alert alert-info">
<strong>提示:</strong>首次登录后系统会要求您更改密码,请使用临时密码登录。
</div>
<div class="alert alert-warning d-none" id="licenseWarning"></div>
<button class="btn btn-outline-secondary w-100" onclick="location.reload()">开通另一个账号</button>
</div>
</div>
<script>
function escapeHtml(value) {
return String(value ?? '')
.replace(/&/g, '&amp;')
.replace(/</g, '&lt;')
.replace(/>/g, '&gt;')
.replace(/"/g, '&quot;')
.replace(/'/g, '&#39;');
}
document.getElementById('redeemBtn').addEventListener('click', async () => {
const code = document.getElementById('codeInput').value.trim();
const username = document.getElementById('usernameInput').value.trim();
@@ -81,8 +96,16 @@
document.getElementById('successResult').classList.remove('d-none');
document.getElementById('resultEmail').textContent = data.data.userPrincipalName;
document.getElementById('resultPassword').textContent = data.data.temporaryPassword;
const licenseWarning = document.getElementById('licenseWarning');
if (data.data.licenseAssigned === false && data.data.licenseMessage) {
licenseWarning.textContent = data.data.licenseMessage;
licenseWarning.classList.remove('d-none');
} else {
licenseWarning.classList.add('d-none');
licenseWarning.textContent = '';
}
} else {
document.getElementById('message').innerHTML = `<div class="alert alert-danger">${data.message}</div>`;
document.getElementById('message').innerHTML = `<div class="alert alert-danger">${escapeHtml(data.message)}</div>`;
btn.disabled = false;
btn.textContent = '立即开通';
}
@@ -94,4 +117,4 @@
});
</script>
</body>
</html>
</html>