💻 代码预览 · 小草口腔诊所

1<!DOCTYPE html><html lang="zh-CN"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no"><title>预约就诊 · 小草口腔诊所</title><link rel="stylesheet" href="style.css"></head><body>
2<div class="header"><span class="back" onclick="history.back()">‹</span><h1>预约就诊</h1><span class="right">📅</span></div>
3<div class="book-steps">
4  <div class="bs now"><span class="dot">🦷</span>选项目</div>
5  <div class="bs"><span class="dot">👨‍⚕️</span>选医生</div>
6  <div class="bs"><span class="dot">🕐</span>选时段</div>
7  <div class="bs"><span class="dot">✅</span>确认</div>
8</div>
9<div class="section-title">选择就诊项目 <span>点击选择</span></div>
10<div id="svc-list" style="padding-bottom:10px"></div>
11<div class="section-title">选择医生 <span>默认系统分配</span></div>
12<div class="card">
13  <div class="svc-sel">
14    ${DOCTORS.map(d=>'<span class="svc-cell" onclick="BK.doc=this.textContent;$$('.svc-cell').forEach(x=>x.classList.remove('sel'));this.classList.add('sel')">'+d.avatar+' '+d.name+'('+d.spec[0]+')</span>').join('')}
15  </div>
16</div>
17<div class="section-title">选择就诊时段 <span>明天 · 8个时段</span></div>
18<div class="card">
19  <div class="time-grid" id="time-grid"></div>
20</div>
21<div class="card">
22  <div class="section-title" style="margin:0 0 8px">就诊信息</div>
23  <div style="display:flex;justify-content:space-between;font-size:13px;color:#5a7e9e;padding:6px 0"><span>🏥 门诊</span><b style="color:#1e3a5f">小草口腔(总院) · 幸福路88号</b></div>
24  <div style="display:flex;justify-content:space-between;font-size:13px;color:#5a7e9e;padding:6px 0"><span>⏰ 提醒</span><b style="color:#1e3a5f">就诊前24小时/2小时双提醒</b></div>
25  <div style="font-size:11px;color:#7b9cb8;margin-top:6px">💡 新客首诊免挂号费；取消预约请在就诊前2小时操作</div>
26</div>
27<button class="btn btn-primary" style="margin:0 12px 24px;width:calc(100% - 24px)" onclick="submitBook()">确认预约</button>
28<div style="height:20px"></div>
29<script src="data.js"></script><script src="app.js"></script>
30<script>
31renderSvc();renderTimes();
32</script>
33</body></html>