Files
basicBench/008/008_r.html
邓智航 a2fe72dcc5 ten
2025-12-22 00:54:25 +08:00

531 lines
24 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Student Information System (SIS) - Spring 2026 Registration</title>
<style>
/* === CSS Variables & Reset === */
:root {
--primary: #4a90e2;
--secondary: #2c3e50;
--success: #27ae60;
--warning: #f39c12;
--danger: #e74c3c;
--bg: #f5f7fa;
--card-bg: #ffffff;
--border: #e1e4e8;
}
body { font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif; background-color: var(--bg); color: #333; margin: 0; line-height: 1.5; font-size: 14px; }
a { text-decoration: none; color: var(--primary); transition: 0.2s; }
a:hover { color: #2c3e50; }
hr { display: none; } /* 隐藏原生分割线 */
/* === 布局重构:强制覆盖 Table 样式 === */
table, tbody, tr, td { display: block; width: 100% !important; border: none !important; background: transparent !important; box-sizing: border-box; }
/* 顶部警告 (System Alert) - 美化为顶部条 */
body > table:first-of-type {
background: var(--danger) !important; color: white; padding: 10px; position: sticky; top: 0; z-index: 100;
}
body > table:first-of-type font { color: white !important; font-weight: bold; }
/* Header 区域 */
body > table:nth-of-type(2) { background: var(--card-bg); border-bottom: 1px solid var(--border) !important; padding: 10px 20px; }
body > table:nth-of-type(2) tr { display: flex; justify-content: space-between; align-items: center; }
body > table:nth-of-type(2) td { width: auto !important; }
body > table:nth-of-type(2) h2 { margin: 0; color: var(--secondary); }
body > table:nth-of-type(2) h3, body > table:nth-of-type(2) p { display: inline-block; margin: 0 10px; font-size: 13px; color: #666; }
/* 导航菜单 - 变为胶囊按钮 */
body > table:nth-of-type(3) td {
background: white !important; padding: 15px !important; display: flex; justify-content: center; gap: 15px; box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}
body > table:nth-of-type(3) a {
background: #f0f2f5; padding: 8px 16px; border-radius: 20px; color: var(--secondary); font-weight: 500;
}
body > table:nth-of-type(3) a:hover { background: var(--primary); color: white; }
/* === 主体三栏布局 (通过 Grid 实现) === */
body > table:nth-of-type(4) > tbody > tr {
display: grid; grid-template-columns: 260px 1fr 300px; gap: 25px; padding: 25px; max-width: 1600px; margin: 0 auto;
}
/* 左侧筛选栏 */
body > table:nth-of-type(4) > tbody > tr > td:first-child {
background: var(--card-bg) !important; padding: 20px !important; border-radius: 8px; height: fit-content;
}
form p b { font-size: 16px; color: var(--secondary); display: block; margin-bottom: 15px; }
form select, form input[type="submit"] { width: 100%; padding: 8px; border: 1px solid var(--border); border-radius: 4px; margin-bottom: 10px; }
form input[type="submit"] { background: var(--primary); color: white; border: none; cursor: pointer; font-weight: bold; }
/* 隐藏左侧栏的广告部分 */
body > table:nth-of-type(4) > tbody > tr > td:first-child > form > table { display: none !important; }
body > table:nth-of-type(4) > tbody > tr > td:first-child > form > ul { display: none !important; }
body > table:nth-of-type(4) > tbody > tr > td:first-child > form > p:nth-last-of-type(1) { display: none !important; }
/* 中间课程列表 */
body > table:nth-of-type(4) > tbody > tr > td:nth-child(2) {
background: transparent !important;
}
/* 课程表容器美化 */
/* 隐藏原表头,用 Grid 重新定义布局 */
.course-table tr:first-child { display: none !important; }
/* 课程行卡片化 */
.course-table tr {
background: var(--card-bg); border: 1px solid var(--border) !important; border-radius: 8px; margin-bottom: 15px;
padding: 20px !important; position: relative;
display: grid !important;
grid-template-columns: 50px 1fr 1fr 1fr 120px;
grid-template-areas:
"chk title title title action"
"chk meta1 meta2 meta3 action";
gap: 10px;
}
/* 隐藏干扰行 (Debug, 广告, 强制调查) */
.course-table tr[bgcolor="#ffff99"],
.course-table tr[bgcolor="#e6f7ff"] { display: none !important; }
.course-table tr:has(tt) { display: none !important; } /* 隐藏 debug */
/* 单元格布局映射 */
.course-table td:nth-child(1) { grid-area: chk; display: flex; align-items: center; justify-content: center; }
.course-table td:nth-child(5) { grid-area: title; font-size: 18px; color: var(--secondary); padding: 0 !important; }
.course-table td:nth-child(3) { grid-area: meta1; font-weight: bold; color: var(--primary); } /* Course Code */
.course-table td:nth-child(8) { grid-area: meta2; color: #666; font-size: 13px; } /* Time */
.course-table td:nth-child(7) { grid-area: meta3; font-style: italic; color: #888; } /* Prof */
.course-table td:nth-child(10) {
grid-area: action; display: flex; flex-direction: column; gap: 5px; align-items: flex-end; justify-content: center;
}
.course-table td:nth-child(10) a {
background: var(--primary); color: white; padding: 6px 12px; border-radius: 4px; font-size: 12px; text-align: center; width: 100px;
}
.course-table td:nth-child(10) a:last-child {
background: white; color: var(--primary); border: 1px solid var(--primary);
}
/* 隐藏不重要的单元格以保持卡片整洁 */
.course-table td:nth-child(2), /* CRN */
.course-table td:nth-child(4), /* Sec */
.course-table td:nth-child(6), /* Credits */
.course-table td:nth-child(9) /* Capacity */
{ display: none !important; }
/* 翻页和批量操作区 */
.course-table tr:last-child { display: flex !important; justify-content: center; background: transparent; border: none !important; box-shadow: none; }
body > table:nth-of-type(4) > tbody > tr > td:nth-child(2) > table:last-of-type {
background: white !important; padding: 20px !important; border-radius: 8px; border: 1px solid var(--border) !important; margin-top: 20px;
}
/* 右侧:购物车 */
body > table:nth-of-type(4) > tbody > tr > td:nth-child(3) {
display: flex; flex-direction: column; gap: 20px;
}
/* 购物车表格美化 */
body > table:nth-of-type(4) > tbody > tr > td:nth-child(3) > table:first-child {
background: var(--card-bg) !important; border-radius: 8px; border: 1px solid var(--border) !important; overflow: hidden;
}
body > table:nth-of-type(4) > tbody > tr > td:nth-child(3) > table:first-child td[bgcolor="#000000"] {
background: var(--secondary) !important; padding: 15px !important; font-size: 16px;
}
body > table:nth-of-type(4) > tbody > tr > td:nth-child(3) > table:first-child tr {
border-bottom: 1px solid #eee !important;
}
/* 冲突警告美化 */
body > table:nth-of-type(4) > tbody > tr > td:nth-child(3) > table:nth-of-type(2) {
background: #fff5f5 !important; border: 1px solid #fc8181 !important; border-radius: 8px;
}
/* 页脚 */
body > center { margin-top: 50px; border-top: 1px solid var(--border); padding-top: 20px; color: #999; }
tt { display: block; margin-top: 10px; opacity: 0.5; font-size: 12px; }
</style>
</head>
<body bgcolor="#ffffff" text="#000000" link="#0000EE" vlink="#551A8B" alink="#FF0000">
<table width="100%" border="1" cellpadding="5" cellspacing="0" bgcolor="#ffcccc">
<tr>
<td align="center">
<font color="red"><b>System Alert:</b> High traffic detected. Do NOT click "Refresh" or you will lose your queue position.</font><br>
<font size="2" style="opacity:0.8;">Last updated: 10:00:01 AM</font>
</td>
</tr>
</table>
<br>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="20%">
<h2>U-Registrar</h2>
</td>
<td width="60%" align="center">
<h3>Spring 2026 Course Selection</h3>
<p>Welcome, <strong>Student_ID_9928122</strong> (Senior Standing)</p>
<p style="font-size:12px; margin-top:5px;">Holds: <font color="green">None</font> | GPA: 3.42 | Major: Computer Science</p>
</td>
<td width="20%" align="right">
<a href="#">[Home]</a> <a href="#" onclick="alert('Logging out...')">[Logout]</a> <a href="#">[Help]</a>
</td>
</tr>
</table>
<hr>
<table width="100%" border="1" cellpadding="5" cellspacing="0" bgcolor="#eeeeee">
<tr>
<td align="center">
<a href="#">Add/Drop Classes</a>
<a href="#">Search for Classes</a>
<a href="#">My Weekly Schedule</a>
<a href="#">Degree Audit</a>
<a href="#">Pay Tuition</a>
<a href="#">Transcript Request</a>
</td>
</tr>
</table>
<br>
<table width="100%" border="0" cellspacing="5" cellpadding="0">
<tr>
<td width="200" valign="top" bgcolor="#f0f0f0">
<form onsubmit="return false;">
<p><b>Filter Results:</b></p>
<hr>
<p>Subject:<br>
<select>
<option>CS - Computer Science</option>
<option>MATH - Mathematics</option>
<option>ENG - English</option>
<option>PHYS - Physics</option>
</select></p>
<p>Course Level:<br>
<label><input type="checkbox"> 100-299 (Lower)</label><br>
<label><input type="checkbox" checked> 300-499 (Upper)</label><br>
<label><input type="checkbox"> 500+ (Grad)</label></p>
<p>Days:<br>
<label><input type="checkbox"> Mon/Wed/Fri</label><br>
<label><input type="checkbox"> Tue/Thu</label></p>
<p>Status:<br>
<label><input type="radio" name="status" checked> Open Only</label><br>
<label><input type="radio" name="status"> Include Waitlist</label></p>
<input type="submit" value="Apply Filter" onclick="alert('Filters applied!')">
<br><br>
<hr>
<p><b>Campus News:</b></p>
<ul>
<li><a href="#">Parking permits price increase</a></li>
<li><a href="#">Cafeteria menu update</a></li>
<li><a href="#">Library hours extended</a></li>
</ul>
<br>
<table width="100%" border="1" bgcolor="#ffffcc">
<tr><td>
<font size="2"><b>Did you know?</b><br>You can donate your unused meal points to the alumni fund.</font>
<br><a href="#">[Donate Now]</a>
</td></tr>
</table>
</form>
</td>
<td valign="top">
<div style="margin-bottom: 20px;">
<p style="font-size:16px;">Showing results for <strong>"Computer Science"</strong> (Spring 2026)</p>
<p><font color="blue" style="font-size:12px;">Note: Enrollment closes on Jan 25th at 5:00 PM.</font></p>
</div>
<table width="100%" border="1" cellspacing="0" cellpadding="4" class="course-table">
<tr bgcolor="#cccccc">
<th>Select</th>
<th>CRN</th>
<th>Course</th>
<th>Sec</th>
<th>Title</th>
<th>Credits</th>
<th>Instructor</th>
<th>Time/Loc</th>
<th>Cap/Act/Rem</th>
<th>Action</th>
</tr>
<tr>
<td align="center"><input type="checkbox" name="crn_1001"></td>
<td>1001</td>
<td>CS 301</td>
<td>01</td>
<td><strong>Algorithms & Data Structures</strong></td>
<td>4.0</td>
<td>Smith, J.</td>
<td>MWF 10:00-10:50<br>Bldg A, Rm 101</td>
<td>50 / 48 / <font color="red">2</font></td>
<td>
<a href="#" onclick="addToCart('CS 301')">Add to Cart</a><br>
<a href="#">Watch</a>
</td>
</tr>
<tr>
<td align="center"><input type="checkbox" name="crn_1002"></td>
<td>1002</td>
<td>CS 301</td>
<td>02</td>
<td><strong>Algorithms & Data Structures</strong></td>
<td>4.0</td>
<td>Smith, J.</td>
<td>MWF 11:00-11:50<br>Bldg A, Rm 101</td>
<td>50 / 50 / <font color="red">0</font></td>
<td>
<font color="grey" style="font-size:12px; margin-bottom:5px; display:block;">Closed</font><br>
<a href="#" style="background:#f39c12; border-color:#f39c12;">Join Waitlist (5)</a>
</td>
</tr>
<tr bgcolor="#ffff99">
<td colspan="10" align="center">
<font color="#990000"><b>Action Required: You must complete the "Sexual Harassment Prevention Training" before adding more classes.</b></font>
<a href="#">[Go to Training]</a>
</td>
</tr>
<tr>
<td align="center"><input type="checkbox" name="crn_1003"></td>
<td>1003</td>
<td>CS 301</td>
<td>03</td>
<td><strong>Algorithms & Data Structures</strong></td>
<td>4.0</td>
<td>Doe, A.</td>
<td>TR 09:30-10:45<br>Bldg B, Rm 204</td>
<td>50 / 12 / 38</td>
<td>
<a href="#" onclick="addToCart('CS 301')">Add to Cart</a><br>
<a href="#">Watch</a>
</td>
</tr>
<tr>
<td align="center"><input type="checkbox" name="crn_2001"></td>
<td>2001</td>
<td>CS 350</td>
<td>01</td>
<td><strong>Operating Systems</strong></td>
<td>4.0</td>
<td>Linux, T.</td>
<td>MWF 13:00-13:50<br>Engr Hall, 300</td>
<td>100 / 98 / <font color="red">2</font></td>
<td>
<a href="#" onclick="addToCart('CS 350')">Add to Cart</a><br>
<a href="#">Watch</a>
</td>
</tr>
<tr>
<td align="center"><input type="checkbox" name="crn_2002"></td>
<td>2002</td>
<td>CS 350</td>
<td>02</td>
<td><strong>Operating Systems</strong></td>
<td>4.0</td>
<td>Windows, B.</td>
<td>TR 14:00-15:15<br>Engr Hall, 300</td>
<td>100 / 10 / 90</td>
<td>
<a href="#" onclick="addToCart('CS 350')">Add to Cart</a><br>
<a href="#">Watch</a>
</td>
</tr>
<tr>
<td colspan="10">
<tt>Debug: Oracle Database Connection Pool Warning at line 442. Latency 200ms.</tt>
</td>
</tr>
<tr>
<td align="center"><input type="checkbox" name="crn_3001"></td>
<td>3001</td>
<td>CS 410</td>
<td>01</td>
<td><strong>Software Engineering</strong></td>
<td>3.0</td>
<td>Brooks, F.</td>
<td>W 18:00-20:50<br>Online / Remote</td>
<td>30 / 30 / <font color="red">0</font></td>
<td>
<font color="grey" style="font-size:12px; margin-bottom:5px; display:block;">Closed</font><br>
<font color="grey" style="font-size:12px; background:#eee; padding:5px; border-radius:4px;">Waitlist Full</font>
</td>
</tr>
<tr>
<td align="center"><input type="checkbox" name="crn_4001"></td>
<td>4001</td>
<td>CS 420</td>
<td>01</td>
<td><strong>Database Management</strong></td>
<td>3.0</td>
<td>Codd, E.</td>
<td>TR 11:00-12:15<br>Sci Center, 101</td>
<td>40 / 35 / 5</td>
<td>
<a href="#" onclick="addToCart('CS 420')">Add to Cart</a><br>
<a href="#">Watch</a>
</td>
</tr>
<tr bgcolor="#e6f7ff">
<td align="center">-</td>
<td>-</td>
<td>ADV 101</td>
<td>-</td>
<td><strong>Summer Study Abroad in Italy</strong></td>
<td>-</td>
<td>Office Intl</td>
<td>Summer 2026</td>
<td>Open</td>
<td><a href="#">[Apply Info]</a></td>
</tr>
<tr>
<td align="center"><input type="checkbox" name="crn_5001"></td>
<td>5001</td>
<td>MATH 330</td>
<td>01</td>
<td><strong>Linear Algebra</strong></td>
<td>3.0</td>
<td>Gauss, K.</td>
<td>MWF 08:00-08:50<br>Math Hall, 101</td>
<td>60 / 55 / 5</td>
<td>
<a href="#" onclick="addToCart('MATH 330')">Add to Cart</a><br>
<a href="#">Watch</a>
</td>
</tr>
<tr>
<td align="center"><input type="checkbox" name="crn_5002"></td>
<td>5002</td>
<td>MATH 330</td>
<td>02</td>
<td><strong>Linear Algebra</strong></td>
<td>3.0</td>
<td>Euler, L.</td>
<td>MWF 09:00-09:50<br>Math Hall, 102</td>
<td>60 / 60 / <font color="red">0</font></td>
<td>
<font color="grey" style="font-size:12px; margin-bottom:5px; display:block;">Closed</font><br>
<a href="#" style="background:#f39c12; border-color:#f39c12;">Join Waitlist (10)</a>
</td>
</tr>
<tr>
<td colspan="10" align="right">
<input type="button" value="Previous" disabled style="opacity:0.5;">
<input type="button" value="Next 10 Courses" style="background:var(--secondary); color:white; border:none; padding:8px 16px; border-radius:4px; cursor:pointer;">
</td>
</tr>
</table>
<br>
<table width="100%" border="1" bgcolor="#e0e0e0" style="background:white !important; border:1px solid var(--border) !important; border-radius:8px; padding:20px !important;">
<tr>
<td>
<b style="font-size:16px; color:var(--secondary);">Batch Actions:</b>
<div style="margin-top:10px;">
<input type="submit" value="Register Selected" style="background:var(--success); color:white; border:none; padding:10px 20px; border-radius:4px; cursor:pointer; font-weight:bold;">
<input type="submit" value="Add to Planner" style="background:white; color:var(--secondary); border:1px solid var(--secondary); padding:10px 20px; border-radius:4px; cursor:pointer; margin-left:10px;">
</div>
<br>
<small style="color:#666;">* By registering, you agree to pay tuition fees by the deadline.</small>
</td>
</tr>
</table>
</td>
<td width="200" valign="top">
<table width="100%" border="1" cellpadding="3" style="background:var(--card-bg) !important; border:1px solid var(--border) !important; border-radius:8px; overflow:hidden;">
<tr><td bgcolor="#000000" style="background:var(--secondary) !important; padding:15px !important;"><font color="white"><b>My Cart (Pending)</b></font></td></tr>
<tr>
<td style="border-bottom:1px solid #eee !important; padding:15px !important;">
<p style="margin:0 0 5px 0;"><strong>CS 301 - 01</strong><br>
Alg & Data Struct<br>
<span style="font-size:12px; color:#666;">4.0 Credits</span></p>
<a href="#" style="color:var(--danger); font-size:12px;">[Drop]</a>
</td>
</tr>
<tr>
<td style="border-bottom:1px solid #eee !important; padding:15px !important;">
<p style="margin:0 0 5px 0;"><strong>MATH 330 - 01</strong><br>
Linear Algebra<br>
<span style="font-size:12px; color:#666;">3.0 Credits</span></p>
<a href="#" style="color:var(--danger); font-size:12px;">[Drop]</a>
</td>
</tr>
<tr>
<td bgcolor="#eeeeee" align="right" style="background:#f8f9fa !important; padding:15px !important;">
Total Credits: 7.0<br>
<input type="button" value="Submit Registration" style="background:var(--success); color:white; border:none; padding:8px; width:100%; margin-top:10px; border-radius:4px; cursor:pointer;">
</td>
</tr>
</table>
<br>
<table width="100%" border="1" cellpadding="3" bgcolor="#fff0f0" style="background:#fff5f5 !important; border:1px solid #fc8181 !important; border-radius:8px;">
<tr>
<td style="padding:15px !important;">
<font color="red" size="2">
<b>Conflict Alert:</b><br>
CS 301 (Sec 01) overlaps with PHYS 202 (Sec 04).
</font>
</td>
</tr>
</table>
<br>
<p style="margin-top:20px;"><b>Quick Links:</b></p>
<ul style="list-style:none; padding:0;">
<li style="margin-bottom:8px;"><a href="#">Campus Map</a></li>
<li style="margin-bottom:8px;"><a href="#">Bookstore</a></li>
<li style="margin-bottom:8px;"><a href="#">Bus Schedule</a></li>
<li style="margin-bottom:8px;"><a href="#">Police Dept</a></li>
</ul>
</td>
</tr>
</table>
<hr>
<center>
<font size="1">
University Registrar Office | Building 42, Room 100 | Phone: 555-0199<br>
&copy; 2026 Board of Regents. All Rights Reserved.<br>
<a href="#">Privacy Policy</a> | <a href="#">Accessibility</a> | <a href="#">FERPA Rights</a>
</font>
<br><br>
<tt>Page generated in 0.42 seconds. Server: REG-NODE-04</tt>
</center>
<script>
function addToCart(courseName) {
// 模拟添加到购物车动画
alert("Adding " + courseName + " to cart...");
// 实际逻辑会在这里更新 DOM这里只是模拟交互
}
console.log("Modern SIS Loaded. Legacy tables transformed via CSS Grid.");
</script>
</body>
</html>