编辑页面

修改后将从当前时间重新计算过期时间
`, addStudent: `
`, addCourse: `
`, addGrade: `
`, addGraduation: `
`, addUser: `
` }; function openModal(type) { const modal = document.getElementById('modalOverlay'); const modalBody = document.getElementById('modalBody'); const modalTitle = document.getElementById('modalTitle'); const titles = { addEnrollment: '新增报名', addStudent: '新增学员', addCourse: '新增课程', addGrade: '录入成绩', addGraduation: '办理毕业', addUser: '新增用户', editStudent: '编辑学员', editGrade: '编辑成绩' }; modalTitle.textContent = titles[type] || '新增'; modalBody.innerHTML = modalContent[type] || '

表单内容

'; modal.classList.add('active'); } function closeModal(event) { if (!event || event.target === document.getElementById('modalOverlay')) { document.getElementById('modalOverlay').classList.remove('active'); } } function saveForm() { closeModal(); alert('保存成功!'); } function saveSettings() { alert('设置已保存!'); } // 审核操作 function approveEnrollment(btn) { const row = btn.closest('tr'); const badge = row.querySelector('.status-badge'); badge.className = 'status-badge approved'; badge.textContent = '已通过'; } function rejectEnrollment(btn) { const row = btn.closest('tr'); const badge = row.querySelector('.status-badge'); badge.className = 'status-badge rejected'; badge.textContent = '已拒绝'; } // 查看详情 function viewDetail(type, id) { openModal('viewDetail'); } function viewCertificate() { alert('查看证书'); } function printCertificate() { alert('打印证书'); } // 图表初始化 function initCharts() { // 招生趋势图 const enrollmentCtx = document.getElementById('enrollmentChart'); if (enrollmentCtx) { new Chart(enrollmentCtx, { type: 'line', data: { labels: ['1月', '2月', '3月', '4月', '5月', '6月'], datasets: [{ label: '报名人数', data: [45, 68, 92, 78, 95, 108], borderColor: '#667eea', backgroundColor: 'rgba(102, 126, 234, 0.1)', fill: true, tension: 0.4 }, { label: '审核通过', data: [42, 62, 85, 72, 88, 98], borderColor: '#43e97b', backgroundColor: 'rgba(67, 233, 123, 0.1)', fill: true, tension: 0.4 }] }, options: { responsive: true, maintainAspectRatio: false, plugins: { legend: { position: 'bottom' } }, scales: { y: { beginAtZero: true, grid: { color: 'rgba(0,0,0,0.05)' } }, x: { grid: { display: false } } } } }); } // 年龄分布饼图 const ageCtx = document.getElementById('agePieChart'); if (ageCtx) { new Chart(ageCtx, { type: 'doughnut', data: { labels: ['50-55岁', '56-60岁', '61-65岁', '65岁以上'], datasets: [{ data: [18, 32, 28, 22], backgroundColor: ['#667eea', '#f093fb', '#4facfe', '#43e97b'], borderWidth: 0 }] }, options: { responsive: true, maintainAspectRatio: false, cutout: '65%', plugins: { legend: { display: false } } } }); } // 年度趋势图 const yearlyCtx = document.getElementById('yearlyChart'); if (yearlyCtx) { new Chart(yearlyCtx, { type: 'bar', data: { labels: ['Q1', 'Q2', 'Q3', 'Q4'], datasets: [{ label: '2024年', data: [205, 265, 180, 0], backgroundColor: '#667eea' }, { label: '2023年', data: [168, 220, 145, 160], backgroundColor: '#e8e4dd' }] }, options: { responsive: true, maintainAspectRatio: false, plugins: { legend: { position: 'bottom' } }, scales: { y: { beginAtZero: true, grid: { color: 'rgba(0,0,0,0.05)' } }, x: { grid: { display: false } } } } }); } // 课程分布饼图 const courseCtx = document.getElementById('coursePieChart'); if (courseCtx) { new Chart(courseCtx, { type: 'doughnut', data: { labels: ['书法', '绘画', '体育', '音乐', '其他'], datasets: [{ data: [18, 22, 25, 20, 15], backgroundColor: ['#667eea', '#f093fb', '#4facfe', '#43e97b', '#fa709a'], borderWidth: 0 }] }, options: { responsive: true, maintainAspectRatio: false, cutout: '65%', plugins: { legend: { display: false } } } }); } } // 标签页切换 document.querySelectorAll('.tab').forEach(tab => { tab.addEventListener('click', function() { this.parentElement.querySelectorAll('.tab').forEach(t => t.classList.remove('active')); this.classList.add('active'); }); }); // 初始化 document.addEventListener('DOMContentLoaded', function() { initCharts(); });
取消
访问码: 9c4wi8wz