feat: NCT集训报名系统 - 陈村校区 + 北滘校区（数据独立）
This commit is contained in:
jacky
320
public/chencun/index.html
Normal file
320
public/chencun/index.html
Normal file
@@ -0,0 +1,320 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>2026 暑假 Kitten 图形化编程等级考试集训 | 陈村校区</title>
|
||||
<link rel="stylesheet" href="css/style.css">
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<!-- Hero -->
|
||||
<div class="hero">
|
||||
<div class="hero-content">
|
||||
<span class="hero-badge">🎯 2026 暑假集训</span>
|
||||
<h1>Kitten 图形化编程<br>等级考试集训</h1>
|
||||
<p class="subtitle">NCT 青少年编程能力等级测试 · 陈村校区</p>
|
||||
<div class="hero-stats">
|
||||
<div class="hero-stat">
|
||||
<div class="num">100%</div>
|
||||
<div class="label">集训学员通过率</div>
|
||||
</div>
|
||||
<div class="hero-stat">
|
||||
<div class="num">75W+</div>
|
||||
<div class="label">全国考生累计</div>
|
||||
</div>
|
||||
<div class="hero-stat">
|
||||
<div class="num">8人</div>
|
||||
<div class="label">小班精品教学</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 倒计时 -->
|
||||
<div class="countdown-section">
|
||||
<div class="countdown-title">距离 NCT 考试还有</div>
|
||||
<div class="countdown-boxes">
|
||||
<div class="countdown-box">
|
||||
<div class="num" id="cd-days">--</div>
|
||||
<div class="unit">天</div>
|
||||
</div>
|
||||
<div class="countdown-box">
|
||||
<div class="num" id="cd-hours">--</div>
|
||||
<div class="unit">时</div>
|
||||
</div>
|
||||
<div class="countdown-box">
|
||||
<div class="num" id="cd-mins">--</div>
|
||||
<div class="unit">分</div>
|
||||
</div>
|
||||
<div class="countdown-box">
|
||||
<div class="num" id="cd-secs">--</div>
|
||||
<div class="unit">秒</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- NCT 是什么 -->
|
||||
<div class="section fade-up">
|
||||
<div class="section-header">
|
||||
<h2>什么是 NCT？</h2>
|
||||
<p>国内最权威的青少年编程能力等级测试</p>
|
||||
</div>
|
||||
<div class="info-grid">
|
||||
<div class="info-card">
|
||||
<div class="info-icon orange">🏛️</div>
|
||||
<div>
|
||||
<h3>中国软件行业协会主办</h3>
|
||||
<p>NCT 由<strong>中国软件行业协会</strong>盖章颁发等级证书，是国家民政部认可的首批 AAA 级行业协会，唯一代表中国计算机软件产业界的全国性一级行业组织。</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="info-card">
|
||||
<div class="info-icon blue">🌐</div>
|
||||
<div>
|
||||
<h3>国内国际双认证</h3>
|
||||
<p>通过<strong>教育部 CELTSC</strong> 标准符合性认证，同时通过国际教育技术协会 <strong>ISTE</strong> 认证，是国内首家获得 ISTE Seal of Alignment 的编程测评项目。</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="info-card">
|
||||
<div class="info-icon purple">🎓</div>
|
||||
<div>
|
||||
<h3>联合国教科文组织合作项目</h3>
|
||||
<p>2021 年成为<strong>联合国教科文组织亚非地区青少年编程教育合作项目</strong>（AAYC）指定测评服务平台，获得国际认可。</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="info-card">
|
||||
<div class="info-icon green">👨🎓</div>
|
||||
<div>
|
||||
<h3>全国超过 75 万考生参与</h3>
|
||||
<p>覆盖中国 34 个省级行政区、全球 25+ 国家及地区，3000+ 所学校和机构参与，新东方、编程猫、童程童美等知名品牌合作。</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 证书价值 -->
|
||||
<div class="section fade-up">
|
||||
<div class="section-header">
|
||||
<h2>考级证书的价值</h2>
|
||||
<p>不只是一张证书，更是孩子成长的里程碑</p>
|
||||
</div>
|
||||
<div class="value-grid">
|
||||
<div class="value-card">
|
||||
<div class="value-emoji">🏅</div>
|
||||
<h3>权威认证</h3>
|
||||
<p>中国软件行业协会盖章颁发，含金量高</p>
|
||||
</div>
|
||||
<div class="value-card">
|
||||
<div class="value-emoji">📋</div>
|
||||
<h3>科技特长</h3>
|
||||
<p>可作为信息科技特长参考依据，综合素质评价加分</p>
|
||||
</div>
|
||||
<div class="value-card">
|
||||
<div class="value-emoji">🧠</div>
|
||||
<h3>能力提升</h3>
|
||||
<p>锻炼逻辑思维、拆题能力与问题解决能力</p>
|
||||
</div>
|
||||
<div class="value-card">
|
||||
<div class="value-emoji">🎯</div>
|
||||
<h3>阶段目标</h3>
|
||||
<p>清晰的等级体系，给孩子学习锚定方向与动力</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 考试日期 -->
|
||||
<div class="section fade-up" style="padding-top: 0;">
|
||||
<div class="exam-card">
|
||||
<h3>NCT 考试时间</h3>
|
||||
<div class="exam-date">2026 年 8 月 22 – 23 日</div>
|
||||
<p class="exam-note">具体考试场次 6 月上旬公布</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 集训时间安排 -->
|
||||
<div class="section fade-up">
|
||||
<div class="section-header">
|
||||
<h2>集训时间安排</h2>
|
||||
<p>三期可选，内容一致，根据时间灵活选择</p>
|
||||
</div>
|
||||
<div class="period-section">
|
||||
<span class="period-badge orange">第一期</span>
|
||||
<h3>7 月集训 · 第一期</h3>
|
||||
<p class="period-info">2 周 · 周一至周六 · 每周日休息 · 每节课 2.5 小时</p>
|
||||
<div style="font-size:18px;font-weight:700;color:#1A1A2E;margin:12px 0 8px">7 月 13 日 – 7 月 25 日</div>
|
||||
<div class="reg-input-row">
|
||||
<input class="reg-input" type="text" placeholder="填写孩子姓名" maxlength="20">
|
||||
<button class="reg-btn orange" onclick="register(this, '第一期：7月13日–7月25日')">我要报名</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="period-section">
|
||||
<span class="period-badge blue">第二期</span>
|
||||
<h3>7–8 月集训 · 第二期</h3>
|
||||
<p class="period-info">2 周 · 周一至周六 · 每周日休息 · 每节课 2.5 小时</p>
|
||||
<div style="font-size:18px;font-weight:700;color:#1A1A2E;margin:12px 0 8px">7 月 27 日 – 8 月 8 日</div>
|
||||
<div class="reg-input-row">
|
||||
<input class="reg-input" type="text" placeholder="填写孩子姓名" maxlength="20">
|
||||
<button class="reg-btn blue" onclick="register(this, '第二期：7月27日–8月8日')">我要报名</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="period-section">
|
||||
<span class="period-badge orange">第三期</span>
|
||||
<h3>8 月集训 · 第三期</h3>
|
||||
<p class="period-info">2 周 · 周一至周六 · 每周日休息 · 每节课 2.5 小时</p>
|
||||
<div style="font-size:18px;font-weight:700;color:#1A1A2E;margin:12px 0 8px">8 月 10 日 – 8 月 22 日</div>
|
||||
<div class="reg-input-row">
|
||||
<input class="reg-input" type="text" placeholder="填写孩子姓名" maxlength="20">
|
||||
<button class="reg-btn orange" onclick="register(this, '第三期：8月10日–8月22日')">我要报名</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="highlight-strip">
|
||||
<p>💡 三期集训内容完全一致，家长可根据孩子时间安排自由选择。每周日休息。<br>填写孩子姓名后点击<strong>「我要报名」</strong>即可提交，老师会主动联系您确认。</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 报名门槛 -->
|
||||
<div class="section fade-up" style="padding-top: 0;">
|
||||
<div class="section-header">
|
||||
<h2>报名条件</h2>
|
||||
</div>
|
||||
<div class="info-grid">
|
||||
<div class="info-card">
|
||||
<div class="info-icon orange">📐</div>
|
||||
<div>
|
||||
<h3>K2 阶段学员</h3>
|
||||
<p>报考 <strong>NCT 一级</strong>，夯实基础，建立信心</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="info-card">
|
||||
<div class="info-icon blue">🔬</div>
|
||||
<div>
|
||||
<h3>K4 阶段学员</h3>
|
||||
<p>报考 <strong>NCT 二级</strong>，挑战进阶，证明实力</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="highlight-strip" style="margin-top: 16px;">
|
||||
<p>📌 未考过一级的学生需先考一级，不可跳级。所有在读 Kitten 学员均可报名。</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 费用说明 -->
|
||||
<div class="section fade-up" style="padding-top: 0;">
|
||||
<div class="section-header">
|
||||
<h2>费用说明</h2>
|
||||
</div>
|
||||
<div class="fee-table">
|
||||
<div class="fee-row">
|
||||
<div class="fee-label">📝 NCT 官方报名费</div>
|
||||
<div class="fee-value">300 元 / 人</div>
|
||||
</div>
|
||||
<div class="fee-row">
|
||||
<div class="fee-label">🎒 集训费用</div>
|
||||
<div class="fee-value">正常课时扣费</div>
|
||||
</div>
|
||||
<div class="fee-row">
|
||||
<div class="fee-label">⏱️ 课时规则</div>
|
||||
<div class="fee-value">每节扣 2 课时</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="highlight-strip" style="margin-top: 16px;">
|
||||
<p>🏆 <strong>奖学金激励：</strong>成绩优异的学员可获得校区颁发的奖学金，既是荣誉也是激励！</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 常见问题 -->
|
||||
<div class="section fade-up" style="padding-top: 0;">
|
||||
<div class="section-header">
|
||||
<h2>常见问题</h2>
|
||||
</div>
|
||||
<div class="faq-item">
|
||||
<div class="faq-q">
|
||||
<span>孩子零基础可以参加吗？</span>
|
||||
<span class="arrow">▼</span>
|
||||
</div>
|
||||
<div class="faq-a">
|
||||
集训面向在读 Kitten 学员。K2 阶段报一级、K4 阶段报二级，难度与孩子当前学习进度匹配，老师全程指导，可以放心参加。
|
||||
</div>
|
||||
</div>
|
||||
<div class="faq-item">
|
||||
<div class="faq-q">
|
||||
<span>考试形式是什么样的？</span>
|
||||
<span class="arrow">▼</span>
|
||||
</div>
|
||||
<div class="faq-a">
|
||||
NCT 采用线上考试形式，支持居家和线下考点在线考试。AI 智能监考系统保证考试公正、专业，足不出户即可参加。
|
||||
</div>
|
||||
</div>
|
||||
<div class="faq-item">
|
||||
<div class="faq-q">
|
||||
<span>集训会不会影响暑假出行？</span>
|
||||
<span class="arrow">▼</span>
|
||||
</div>
|
||||
<div class="faq-a">
|
||||
集训每期内容一样，选一期参加即可。每周日休息，三期覆盖整个暑假，合理安排完全不会影响家庭出行计划。
|
||||
</div>
|
||||
</div>
|
||||
<div class="faq-item">
|
||||
<div class="faq-q">
|
||||
<span>通过率怎么样？</span>
|
||||
<span class="arrow">▼</span>
|
||||
</div>
|
||||
<div class="faq-a">
|
||||
参加集训的学员通过率基本达到 <strong>100%</strong>。集训内容紧扣考级知识点，系统刷题 + 模拟实操，帮助孩子充分准备。
|
||||
</div>
|
||||
</div>
|
||||
<div class="faq-item">
|
||||
<div class="faq-q">
|
||||
<span>证书长什么样？有含金量吗？</span>
|
||||
<span class="arrow">▼</span>
|
||||
</div>
|
||||
<div class="faq-a">
|
||||
新版证书采用 PU 皮革材质、烫金凹印技术、圆角裁剪工艺，精美大气。由中国软件行业协会盖章颁发，通过顺丰快递寄送。该证书通过教育部 CELTSC 标准认证和国际 ISTE 认证，是目前国内外双认证的权威编程等级证书。
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 报名入口 -->
|
||||
<div class="cta-section">
|
||||
<div class="cta-box">
|
||||
<h2>🚀 暑假集训，助孩子高效拿证</h2>
|
||||
<p>小班精品教学 · 系统备考方案 · 权威等级证书<br>名额有限，每班仅限 8 人，先到先得！</p>
|
||||
<a href="#" class="cta-btn" onclick="showToast('请往上滑，填写孩子姓名\n并点击「我要报名」提交', 3000); return false;">立即咨询报名</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 底部 -->
|
||||
<div class="footer">
|
||||
<p>穹狼科创 · 陈村校区 · 2026 年暑假</p>
|
||||
<p style="margin-top: 6px;">NCT 青少年编程能力等级测试</p>
|
||||
</div>
|
||||
|
||||
<!-- Toast 提示 -->
|
||||
<div class="toast" id="toast"></div>
|
||||
|
||||
<!-- 报名确认弹窗 -->
|
||||
<div class="modal-overlay" id="regModal">
|
||||
<div class="modal">
|
||||
<h3>确认报名</h3>
|
||||
<div class="modal-period" id="modalPeriod"></div>
|
||||
<input class="modal-input" id="modalName" type="text" placeholder="请输入孩子姓名" maxlength="20" style="margin-bottom:10px">
|
||||
<select class="modal-select" id="modalTeacher" onchange="this.classList.toggle('has-value', this.value)">
|
||||
<option value="" disabled selected>选择负责老师</option>
|
||||
<option value="东东老师">东东老师</option>
|
||||
<option value="橙子老师">橙子老师</option>
|
||||
<option value="福福老师">福福老师</option>
|
||||
<option value="坦克老师">坦克老师</option>
|
||||
<option value="菠萝老师">菠萝老师</option>
|
||||
</select>
|
||||
<button class="modal-submit" id="modalSubmit" onclick="submitReg()">确认提交</button>
|
||||
<br>
|
||||
<button class="modal-cancel" onclick="closeModal()">取消</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="js/app.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user