<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>课堂管理系统</title> <style> body { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; background: linear-gradient(135deg, #6e8efb, #a777e3); height: 100vh; margin: 0; display: flex; justify-content: center; align-items: center; color: white; } .container { text-align: center; background: rgba(255, 255, 255, 0.1); padding: 40px; border-radius: 20px; box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37); backdrop-filter: blur(8.5px); -webkit-backdrop-filter: blur(8.5px); border: 1px solid rgba(255, 255, 255, 0.18); } h1 { margin-bottom: 40px; font-size: 2.5em; } .button-group { display: flex; flex-direction: column; gap: 20px; } button { padding: 15px 30px; font-size: 1.2em; border: none; border-radius: 50px; background-color: #ff5722; color: white; cursor: pointer; transition: transform 0.2s, background-color 0.3s; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2); } button:hover { background-color: #ff3d00; transform: scale(1.05); box-shadow: 0 6px 20px rgba(0, 0, 0, 0.3); } @media (max-width: 600px) { .button-group { flex-direction: column; } } </style> </head> <body> <div class="container"> <h1>课堂管理系统</h1> <div class="button-group"> <button onclick="window.location.href='dianming.html'">课堂点名</button> <button onclick="window.location.href='select.html'">随机提问</button> <button onclick="window.location.href='score_display.html'">积分显示</button> <button onclick="document.getElementById('fileInput').click()">导入学生名单</button> <input type="file" id="fileInput" accept=".xlsx" style="display:none;" onchange="importStudents(event)"> </div> </div> <script> async function importStudents() { const fileInput = document.getElementById('fileInput'); const file = fileInput.files[0]; // 获取选中的文件 if (!file) { alert('请选择一个文件'); return; } const formData = new FormData(); formData.append('file', file); // 将文件添加到FormData中,键名为'file' try { const response = await fetch('/api/upload', { // 假设后端API的路径为/api/upload method: 'POST', body: formData }); if (response.ok) { const result = await response.json(); console.log('上传成功:', result); alert('学生名单导入成功!'); } else { console.error('上传失败:', response.statusText); alert('导入失败,请重试。'); } } catch (error) { console.error('请求错误:', error); alert('发生错误,请检查控制台了解详细信息。'); } } </script> </body> </html>