r115/home.html · 约 2653 字符
1<!DOCTYPE html>
2<html lang="zh-CN">
3<head>
4<meta charset="utf-8">
5<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
6<title>成绩总览</title>
7<link rel="stylesheet" href="style.css">
8</head>
9<body>
10<div id="app"><div class="sub-hero" style="background:linear-gradient(135deg,#3b5bdb,#2b44b8)"><div class="sh-top"><span>成绩总览</span><span class="sh-msg">🔔</span></div><div style="display:flex;align-items:center;gap:12px;margin-bottom:10px"><div class="avatar" style="width:42px;height:42px;background:rgba(255,255,255,.25);font-size:22px">🌿</div><div><div style="font-weight:700;font-size:15px" id="st-name">林晓薇</div><div style="font-size:11px;opacity:.9" id="st-cls">高三(7)班 · 17号</div></div></div><div class="sh-search"><span class="sh-si">🔍</span><input placeholder="搜索考试 / 学科"></div></div><div class="uc-wrap"><div class="card latest" id="latest"><div class="lv-tag" id="lv-exam">最新考试</div></div><div class="pf-stats2" id="stats"></div><div class="sec-h"><span class="sec-n" style="background:#3b5bdb">快</span>快捷分析</div><div class="quick-g" id="quick"></div><div class="notice" id="notice"></div></div><div class="tabbar"><a class="tb" href="home.html"><span class="tb-ic">🏠</span>首页</a><a class="tb" href="exams.html"><span class="tb-ic">📊</span>考试</a><a class="tb" href="rank.html"><span class="tb-ic">🏆</span>排名</a><a class="tb" href="profile.html"><span class="tb-ic">👤</span>我的</a></div></div>
11<script src="app.js"></script>
12<script>DS.get('cg_home').then(function(d){ $('#st-name').textContent=d.student.name; $('#st-cls').textContent=d.student.class+' · '+d.student.no+'号'; var lv=d.latest; var html='<div class="lv-tag">'+lv.exam+' · '+lv.date+'</div>'; html+='<div class="lv-t">'+lv.total+'<span class="lv-f">/'+lv.full+'</span></div>'; html+='<div class="lv-row"><div><span class="lv-k">班级排名</span><span class="lv-v">'+lv.rank+' / '+lv.class_size+'</span></div>'; html+='<div><span class="lv-k">较上次</span><span class="lv-v" style="color:#2f9e44">+23 ▲</span></div></div>'; $('#latest').insertAdjacentHTML('beforeend',html); var s=''; d.stats.forEach(function(x){s+='<div class="pf-st2"><div class="pf-v2">'+x[1]+'</div><div class="pf-l2">'+x[0]+'</div></div>';}); $('#stats').innerHTML=s; var q=''; d.quick.forEach(function(x){q+='<a class="quick" href="'+x[0]+'"><span class="quick-ic">'+x[1]+'</span><span>'+x[2]+'</span></a>';}); $('#quick').innerHTML=q; $('#notice').innerHTML='<span class="nt-ic">💡</span>'+esc(d.notice);});</script>
13</body>
14</html>