| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599 |
- <!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>
- * {
- margin: 0;
- padding: 0;
- box-sizing: border-box;
- }
- body {
- font-family: 'PingFang SC', 'Microsoft YaHei', sans-serif;
- height: 100vh;
- display: flex;
- flex-direction: column;
- overflow: hidden;
- background-color: #f5f7fa;
- }
- /* 导航栏样式 */
- nav {
- background: linear-gradient(135deg, #1a73e8, #0d47a1);
- color: white;
- padding: 15px 30px;
- display: flex;
- align-items: center;
- box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
- z-index: 100;
- }
- .logo {
- font-size: 24px;
- font-weight: bold;
- margin-right: 15px;
- }
- .event-name {
- font-size: 20px;
- flex-grow: 1;
- }
- /* 主内容区域 */
- .main-container {
- display: flex;
- flex: 1;
- overflow: hidden;
- }
- /* 左侧菜单 */
- .sidebar {
- width: 200px;
- background-color: #2c3e50;
- color: white;
- display: flex;
- flex-direction: column;
- padding: 20px 0;
- }
- .menu-btn {
- padding: 15px 20px;
- margin: 10px 15px;
- background-color: #3498db;
- color: white;
- border: none;
- border-radius: 5px;
- font-size: 16px;
- cursor: pointer;
- transition: all 0.3s;
- text-align: center;
- }
- .menu-btn:hover {
- background-color: #2980b9;
- transform: translateY(-2px);
- box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
- }
- .menu-btn.active {
- background-color: #1abc9c;
- }
- /* 右侧内容区域 */
- .content-area {
- flex: 1;
- display: flex;
- flex-direction: column;
- padding: 20px;
- background-color: white;
- border-radius: 10px;
- margin: 20px;
- box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
- overflow: hidden;
- }
- .content-header {
- font-size: 24px;
- color: #2c3e50;
- margin-bottom: 20px;
- padding-bottom: 10px;
- border-bottom: 2px solid #3498db;
- }
- /* 下载区域 */
- .download-section {
- display: none;
- flex-direction: column;
- height: 100%;
- }
- .download-section.active {
- display: flex;
- }
- .download-list {
- overflow-y: auto;
- flex: 1;
- }
- .download-item {
- width: calc(100% - 30px);
- background-color: #f8f9fa;
- border: 1px solid #e9ecef;
- border-radius: 8px;
- padding: 15px;
- margin-bottom: 15px;
- display: flex;
- align-items: center;
- transition: all 0.3s;
- }
- .download-item:hover {
- transform: translateX(5px);
- box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
- border-color: #3498db;
- }
- .file-icon {
- font-size: 24px;
- margin-right: 15px;
- color: #3498db;
- }
- .file-info {
- flex: 1;
- }
- .file-title {
- font-weight: bold;
- margin-bottom: 5px;
- }
- .file-desc {
- color: #6c757d;
- font-size: 14px;
- }
- .download-btn {
- background-color: #28a745;
- color: white;
- border: none;
- padding: 8px 15px;
- border-radius: 5px;
- cursor: pointer;
- transition: background-color 0.3s;
- text-decoration: none;
- }
- .download-btn:hover {
- background-color: #218838;
- }
- /* 报名区域 */
- .registration-section {
- display: none;
- flex-direction: column;
- height: 100%;
- overflow-y: auto;
- position: relative;
- }
- .registration-section.active {
- display: flex;
- }
- .form-container {
- flex: 1;
- padding-right: 10px;
- }
- .form-group {
- margin-bottom: 20px;
- }
- .form-label {
- display: block;
- margin-bottom: 8px;
- font-weight: bold;
- color: #495057;
- }
- .required::after {
- content: " *";
- color: #e74c3c;
- }
- .form-input {
- width: 100%;
- padding: 12px;
- border: 1px solid #ced4da;
- border-radius: 5px;
- font-size: 16px;
- transition: border-color 0.3s;
- }
- .form-input:focus {
- border-color: #3498db;
- outline: none;
- box-shadow: 0 0 0 3px rgba(52, 152, 219, 0.2);
- }
- .form-row {
- display: flex;
- gap: 20px;
- }
- .form-col {
- flex: 1;
- }
- .file-upload {
- border: 2px dashed #ced4da;
- padding: 30px;
- text-align: center;
- border-radius: 8px;
- margin: 20px 0;
- background-color: #f8f9fa;
- transition: all 0.3s;
- }
- .file-upload:hover {
- border-color: #3498db;
- background-color: #e3f2fd;
- }
- .upload-icon {
- font-size: 40px;
- color: #3498db;
- margin-bottom: 15px;
- }
- .submit-btn {
- background-color: #1a73e8;
- color: white;
- border: none;
- padding: 14px 25px;
- border-radius: 5px;
- font-size: 18px;
- cursor: pointer;
- transition: all 0.3s;
- margin-top: 20px;
- width: 100%;
- }
- .submit-btn:hover {
- background-color: #0d47a1;
- transform: translateY(-2px);
- box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
- }
- .error {
- color: #e74c3c;
- font-size: 14px;
- margin-top: 5px;
- display: none;
- }
- .remove-Contestant {
- padding: 7px 15px;
- font-size: 14px;
- background-color: #db3434;
- color: white;
- border: none;
- border-radius: 5px;
- cursor: pointer;
- transition: all 0.3s;
- text-align: center;
- position: absolute;
- top: 0;
- left: 80px;
- }
- .menu-btn-add:nth-last-child(1) {
- padding: 7px 15px;
- font-size: 14px;
- color: white;
- border: none;
- border-radius: 5px;
- cursor: pointer;
- transition: all 0.3s;
- text-align: center;
- background-color: #3498db;
- }
- .step-container {
- display: none;
- }
- .step-container.active {
- display: block;
- }
- .competition-grid {
- display: grid;
- grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
- gap: 20px;
- margin-bottom: 30px;
- }
- .competition-card {
- border: 1px solid #e0e0e0;
- border-radius: 10px;
- padding: 20px;
- text-align: center;
- cursor: pointer;
- transition: all 0.3s;
- }
- .competition-card:hover {
- border-color: #1a73e8;
- box-shadow: 0 4px 12px rgba(26, 115, 232, 0.15);
- transform: translateY(-5px);
- }
- .competition-card.selected {
- border-color: #1a73e8;
- background-color: #e8f0fe;
- }
- .competition-icon {
- font-size: 36px;
- color: #1a73e8;
- margin-bottom: 15px;
- }
- .competition-name {
- font-weight: 500;
- color: #202124;
- }
- .btn {
- padding: 12px 30px;
- border-radius: 8px;
- font-size: 16px;
- font-weight: 500;
- cursor: pointer;
- transition: all 0.3s;
- border: none;
- }
- .btn-prev {
- background-color: #f8f9fa;
- color: #5f6368;
- }
- .btn-prev:hover {
- background-color: #e8f0fe;
- color: #1a73e8;
- }
- .btn-next {
- background-color: #1a73e8;
- color: white;
- }
- .btn-next:hover {
- background-color: #0d47a1;
- }
- .btn-submit {
- background-color: #34a853;
- color: white;
- }
- .btn-submit:hover {
- background-color: #2d9249;
- }
- .error {
- color: #ea4335;
- font-size: 14px;
- margin-top: 5px;
- display: none;
- }
- .button-group {
- display: flex;
- justify-content: space-between;
- margin-top: 30px;
- }
- .step-title {
- font-size: 18px;
- color: #202124;
- margin-bottom: 20px;
- padding-bottom: 10px;
- border-bottom: 1px solid #e0e0e0;
- }
- .button-Contestant {
- display: none;
- margin-right: 20px;
- }
- .button-Contestant.active {
- display: block;
- }
- .help {
- position: fixed;
- color: #000;
- cursor: pointer;
- display: inline-block;
- width: 50px;
- height: 50px;
- border-radius: 50%;
- background-color: #fff;
- bottom: 10px;
- left: 10px;
- }
- .help::after {
- content: '?';
- position: absolute;
- top: 50%;
- left: 50%;
- transform: translate(-50%, -50%);
- font-size: 24px;
- }
- .help-qrCode {
- width: 50%;
- padding: 20px;
- }
- </style>
- <script src="./aws-sdk-2.235.1.min.js"></script>
- <script>
- var credentials = {
- accessKeyId: 'AKIATLPEDU37QV5CHLMH',
- secretAccessKey: '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'
- }; //秘鑰形式的登錄上傳
- window.AWS.config.update(credentials);
- window.AWS.config.region = 'cn-northwest-1'; //設置區域
- </script>
- </head>
- <body>
- <!-- 导航栏 -->
- <nav>
- </nav>
- <!-- 主内容区域 -->
- <div class="main-container">
- <!-- 左侧菜单 -->
- <div class="sidebar">
- <button class="menu-btn active" id="downloadBtn">资料下载</button>
- <button class="menu-btn" id="registerBtn">在线报名</button>
- <button class="menu-btn" id="registerBtn1">资格确认</button>
- <button class="menu-btn" id="registerBtn2">作品提交(桌游设计挑战类比赛)</button>
- <span onclick="help()" class="help"></span>
- </div>
- <!-- 右侧内容区域 -->
- <div class="content-area">
- <!-- 下载区域 -->
- <div class="download-section active" id="downloadSection">
- <h2 class="content-header">比赛资料下载</h2>
- <div class="download-list">
- <div class="download-item">
- <div class="file-icon">📋</div>
- <div class="file-info">
- <div class="file-title">第六届广东省青少年创新思维及科技实践大赛创新思维挑战赛</div>
- </div>
- <a target="_blank"
- href="https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/a/%E5%88%9B%E6%96%B0%E6%80%9D%E7%BB%B4%E7%B1%BB-%E5%88%9B%E6%96%B0%E6%80%9D%E7%BB%B4%E6%8C%91%E6%88%98%E8%B5%9B.pdf"
- class="download-btn" download="第六届广东省青少年创新思维及科技实践大赛创新思维挑战赛.pdf">下载</a>
- </div>
- <div class="download-item">
- <div class="file-icon">📊</div>
- <div class="file-info">
- <div class="file-title">第六届广东省青少年创新思维及科技实践大赛的通知</div>
- </div>
- <a target="_blank"
- href="https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/a/%E5%85%B3%E4%BA%8E%E4%B8%BE%E5%8A%9E%E7%AC%AC%E5%85%AD%E5%B1%8A%E5%B9%BF%E4%B8%9C%E7%9C%81%E9%9D%92%E5%B0%91%E5%B9%B4%E5%88%9B%E6%96%B0%E6%80%9D%E7%BB%B4%E5%8F%8A%E7%A7%91%E6%8A%80%E5%AE%9E%E8%B7%B5%E5%A4%A7%E8%B5%9B%E7%9A%84%E9%80%9A%E7%9F%A5%286%29.pdf"
- class="download-btn" download="第六届广东省青少年创新思维及科技实践大赛的通知.pdf">下载</a>
- </div>
- <div class="download-item">
- <div class="file-icon">📄</div>
- <div class="file-info">
- <div class="file-title">报名表模板</div>
- <div class="file-desc">完成在线报名后,请先下载该模板,经所在学校盖章确认后,将盖章后的模板上传至【资格确认】板块,即可完成赛前准备。</div>
- </div>
- <a target="_blank"
- href="https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/%5Bobject%20HTMLInputElement%5D/%E6%8A%A5%E5%90%8D%E8%A1%A8.docx"
- class="download-btn" download>下载</a>
- </div>
- <div class="download-item">
- <div class="file-icon">🎬</div>
- <div class="file-info">
- <div class="file-title">宣讲视频</div>
- </div>
- <a target="_blank" href="https://meeting.tencent.com/crm/l71mRRMd92" class="download-btn">观看</a>
- </div>
- <div class="download-item">
- <div class="file-icon">🎬</div>
- <div class="file-info">
- <div class="file-title">直播培训回放视频</div>
- </div>
- <a target="_blank" href="https://meeting.tencent.com/crm/KwBR303qc0" class="download-btn">观看</a>
- </div>
- <div class="download-item">
- <div class="file-icon">🎬</div>
- <div class="file-info">
- <div class="file-title">智能体应用赛-进阶应用拆解</div>
- </div>
- <a target="_blank" href="https://meeting.tencent.com/crm/2rVQ4P0ea6" class="download-btn">观看</a>
- </div>
- <div class="download-item">
- <div class="file-icon">📊</div>
- <div class="file-info">
- <div class="file-title">智能体应用备赛平台登录指引</div>
- </div>
- <a target="_blank"
- href="https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/0960e9b6-2687-b858-2285-455c29eac369/%E6%99%BA%E8%83%BD%E4%BD%93%E5%BA%94%E7%94%A8%E5%A4%87%E8%B5%9B%E5%B9%B3%E5%8F%B0%E7%99%BB%E5%BD%95%E6%8C%87%E5%BC%95.pdf"
- class="download-btn" download="智能体应用备赛平台登录指引.pdf">下载</a>
- </div>
- </div>
- </div>
- <!-- 报名区域 -->
- <div class="registration-section " id="registrationSection">
- <!-- <div class="select-type">
- <select id="selectType" class="form-input" required >
- <option value="">请选择参赛类型</option>
- <option value="1">桌游设计挑战类</option>
- <option value="2">智能体应用类</option>
- </select>
- </div> -->
- <div class="content-header" style="display: flex;justify-content: space-between;">
- <h2 style="display: inline-block;font-size: 24px;">参赛信息登记</h2>
- <div class="button-Contestant">
- <button class="menu-btn-add" onclick="addContestant()">添加选手</button>
- </div>
- </div>
- <!-- 步骤1:选择比赛类型 -->
- <div id="step1" class="step-container active">
- <div class="step-title">第一步:请选择您要报名的比赛类型</div>
- <div class="competition-grid">
- <div class="competition-card" data-id="1">
- <div class="competition-icon">🧮</div>
- <div class="competition-name">桌游设计挑战</div>
- </div>
- <div class="competition-card" data-id="2">
- <div class="competition-icon">💻</div>
- <div class="competition-name">智能体应用</div>
- </div>
- </div>
- <div class="button-group">
- <div></div> <!-- 占位 -->
- <button class="btn btn-next" id="nextToStep2">下一步</button>
- </div>
- </div>
- <!-- 步骤2:填写报名信息 -->
- <div id="step2" class="step-container">
- <div class="step-title">第二步:填写报名信息</div>
- <div class="form-group" style="display: flex;align-items: center;">
- <label class="form-label required" for="name">指导教师</label>
- <input style="width: 200px;margin-left: 20px;margin-right: 15px;" type="text" id="teacher"
- class="form-input">
- <label class="form-label required" for="name">手机号</label>
- <input style="width: 200px;margin-left: 20px;margin-right: 15px;" type="text" id="teacherPhone"
- class="form-input">
- </div>
- <div class="form-container" id="formContainer">
- <input type="hidden" id="competitionType" value="">
- <h3>选手1:</h3>
- <br />
- <form id="registrationForm1">
- <div class="form-row">
- <div class="form-col">
- <div class="form-group">
- <label class="form-label required" for="name">姓名</label>
- <input type="text" id="name1" class="form-input" required>
- <div class="error" id="name-error1">请输入姓名</div>
- </div>
- </div>
- <div class="form-col">
- <div class="form-group">
- <label class="form-label required" for="gender">性别</label>
- <select id="gender1" class="form-input" required>
- <option value="">请选择</option>
- <option value="1">男</option>
- <option value="2">女</option>
- </select>
- <div class="error" id="gender-error1">请选择性别</div>
- </div>
- </div>
- </div>
- <div class="form-row">
- <div class="form-col">
- <div class="form-group">
- <label class="form-label required" for="ethnicity">民族</label>
- <input type="text" id="ethnicity1" class="form-input" required>
- <div class="error" id="ethnicity-error1">请输入民族</div>
- </div>
- </div>
- <div class="form-col">
- <div class="form-group">
- <label class="form-label required" for="birthdate">出生年月</label>
- <input type="date" id="birthdate1" class="form-input" required>
- <div class="error" id="birthdate-error1">请选择出生年月</div>
- </div>
- </div>
- </div>
- <div class="form-row">
- <div class="form-col">
- <div class="form-group">
- <label class="form-label required" for="email">电子邮箱</label>
- <input type="email" id="email1" class="form-input" required>
- <div class="error" id="email-error1">请输入有效的电子邮箱</div>
- </div>
- </div>
- <div class="form-col">
- <div class="form-group">
- <label class="form-label required" for="idNumber">身份证号码</label>
- <input type="text" id="idNumber1" class="form-input" required
- pattern="\d{17}[\dXx]">
- <div class="error" id="idNumber-error1">请输入18位身份证号码</div>
- </div>
- </div>
- </div>
- <div class="form-row">
- <div class="form-col" id="group-containers">
- <!-- 组别:只显示一个,根据比赛类型动态显示 -->
- </div>
- <div class="form-col">
- <div class="form-group">
- <label class="form-label required" for="grade">年级</label>
- <input type="text" id="grade1" class="form-input" required>
- <div class="error" id="grade-error1">请输入年级</div>
- </div>
- </div>
- </div>
- <div class="form-row">
- <div class="form-col">
- <div class="form-group">
- <label class="form-label required" for="school">所在学校</label>
- <input type="text" id="school1" class="form-input" required>
- <div class="error" id="school-error1">请输入学校名称</div>
- </div>
- </div>
- <div class="form-col">
- <div class="form-group">
- <label class="form-label required" for="schoolRegion">学校所在地区</label>
- <input type="text" id="schoolRegion1" class="form-input" required
- placeholder="省/市/区">
- <div class="error" id="schoolRegion-error1">请输入学校所在地区</div>
- </div>
- </div>
- </div>
- <div class="form-group">
- <label class="form-label required" for="phone">联系电话</label>
- <input type="tel" id="phone1" class="form-input" required pattern="[0-9]{11}">
- <div class="error" id="phone-error1">请输入11位手机号码</div>
- </div>
- </form>
- </div>
- <div class="button-group">
- <button type="button" class="btn btn-prev" id="prevToStep1">上一步</button>
- <button type="submit" class="btn btn-submit" onclick="submitData()">提交报名</button>
- </div>
- </div>
- </div>
- <!-- 上传报名表单 -->
- <div class="registration-section" id="uploadSection">
- <h2 class="content-header">上传报名表</h2>
- <div class="download-list">
- <div class="form-row">
- <div class="form-col">
- <div class="form-group">
- <label class="form-label required" for="CompetitionType">比赛类型</label>
- <select id="CompetitionType" class="form-input" required>
- <option value="">请选择</option>
- <option value="1">桌游设计挑战</option>
- <option value="2">智能体应用</option>
- </select>
- </div>
- </div>
- <div class="form-col">
- <div class="form-group">
- <label class="form-label required" for="idNumber">身份证号码</label>
- <input type="text" id="id_number" class="form-input" required pattern="\d{17}[\dXx]"
- placeholder="请填写在线报名时,团队内任一选手的身份证号码">
- </div>
- </div>
- </div>
- <div class="form-row">
- <div class="form-col">
- <div class="file-upload">
- <label class="form-label required" for="photo">上传文件</label>
- <input type="file" id="uploadFile" required>
- </div>
- </div>
- <div class="form-col" style="display: none;" id="videoUploadDiv">
- <div class="file-upload">
- <label class="form-label required" for="photo">上传视频</label>
- <input type="file" id="uploadVideo" accept="video/*" required>
- </div>
- </div>
- </div>
- <button type="submit" class="submit-btn" onclick="submitRegistration()">提交报名表</button>
- </div>
- </div>
- <!-- 上传报名表单 -->
- <div class="registration-section" id="uploadSection2">
- <h2 class="content-header">作品提交</h2>
- <div class="download-list">
- <div class="form-row">
- <div class="form-col">
- <div class="form-group">
- <label class="form-label required" for="idNumber">身份证号码</label>
- <input type="text" id="id_number2" class="form-input" required pattern="\d{17}[\dXx]"
- placeholder="请填写在线报名时,团队内任一选手的身份证号码">
- </div>
- </div>
- </div>
- <div class="form-row">
- <div class="form-col">
- <div class="file-upload">
- <label class="form-label required" for="photo">上传作品说明文件</label>
- <input type="file" id="uploadFile2" required>
- </div>
- </div>
- </div>
- <button type="submit" class="submit-btn" onclick="submitRegistration2()">提交报名表</button>
- </div>
- </div>
- </div>
- </div>
- <script>
- const requesturl = window.location.href.indexOf("localhost") > -1 ? "http://localhost:11111/" : "http://183.36.25.93:888/";
- console.log("requesturl:", requesturl);
- // 获取url参数
- const urlSearch = window.location.search;
- if (urlSearch.slice(1) == "baoan") {
- document.getElementById("registerBtn1").innerText = `作品提交`
- document.getElementsByTagName("nav")[0].innerHTML = `<div class="event-name">宝安区智能体应用赛</div>`
- } else if (urlSearch.slice(1) == "guangming") {
- document.getElementById("registerBtn1").innerText = `作品提交`
- document.getElementsByTagName("nav")[0].innerHTML = `<div class="event-name">光明确智能体应用赛</div>`
- } else if (urlSearch.slice(1) == "pingshan") {
- document.getElementById("registerBtn1").innerText = `作品提交`
- document.getElementsByTagName("nav")[0].innerHTML = `<div class="event-name">坪山区智能体应用赛</div>`
- } else if (urlSearch.slice(1) == "longhua") {
- document.getElementById("registerBtn1").innerText = `作品提交`
- document.getElementsByTagName("nav")[0].innerHTML = `<div class="event-name">龙华区智能体应用赛</div>`
- } else if (urlSearch.slice(1) == "nanshan") {
- document.getElementById("registerBtn1").innerText = `作品提交`
- document.getElementsByTagName("nav")[0].innerHTML = `<div class="event-name">南山区智能体应用赛</div>`
- } else {
- if (urlSearch != "") {
- window.location.search = "";
- }
- document.getElementsByTagName("nav")[0].innerHTML = `<img src="./logo2.png" alt="logo" style="width: 200px;margin-right: 15px;"></img>
- <img src="./logo1.png" alt="logo" style="width: 200px;margin-right: 15px;"></img>
- <div class="event-name">第六届广东省青少年创新思维及科技实践大赛(创新思维类选手报名)</div>`
- }
- //document.getElementById("registerBtn2").style.display = "none";
- if (document.getElementById("registerBtn1").innerText == "作品提交") {
- document.getElementById("registerBtn2").style.display = "none";
- document.getElementsByClassName("content-header")[2].innerText = "作品提交"
- document.getElementById("uploadFile").previousElementSibling.innerText = "上传作品说明文件";
- document.getElementById("uploadVideo").previousElementSibling.innerText = "上传作品演示视频";
- document.getElementsByClassName("submit-btn")[0].innerText = "提交";
- document.getElementsByClassName("help")[0].style.display = "none";
- }
- const nowTime = new Date();
- const deadline = new Date("2025-09-22");
- // 切换下载和报名区域
- document.getElementById('downloadBtn').addEventListener('click', function () {
- document.getElementById('downloadBtn').classList.add('active');
- document.getElementById('registerBtn').classList.remove('active');
- document.getElementById('registerBtn1').classList.remove('active');
- document.getElementById('downloadSection').classList.add('active');
- document.getElementById('registrationSection').classList.remove('active');
- document.getElementById('uploadSection').classList.remove('active');
- document.getElementsByClassName("button-Contestant")[0].classList.remove('active');
- });
- document.getElementById('registerBtn1').addEventListener('click', function () {
- document.getElementById('registerBtn1').classList.add('active');
- document.getElementById('registerBtn2').classList.remove('active');
- document.getElementById('downloadBtn').classList.remove('active');
- document.getElementById('registerBtn').classList.remove('active');
- document.getElementById('downloadSection').classList.remove('active');
- document.getElementById('registrationSection').classList.remove('active');
- document.getElementsByClassName("button-Contestant")[0].classList.remove('active');
- document.getElementById('uploadSection').classList.add('active');
- document.getElementById('uploadSection2').classList.remove('active');
- const uploadTime = new Date("2025-10-13");
- if (nowTime < uploadTime && !urlSearch.length > 0) {
- document.getElementById('uploadSection').innerHTML = "<div style='display:flex;justify-content:center;align-items:center;height:100vh;font-size:2rem;color:#db3434;'>资格确认在2025-10-13开放上传</div>";
- }
- });
- document.getElementById('registerBtn2').addEventListener('click', function () {
- document.getElementById('registerBtn2').classList.add('active');
- document.getElementById('registerBtn1').classList.remove('active');
- document.getElementById('downloadBtn').classList.remove('active');
- document.getElementById('registerBtn').classList.remove('active');
- document.getElementById('downloadSection').classList.remove('active');
- document.getElementById('registrationSection').classList.remove('active');
- document.getElementsByClassName("button-Contestant")[0].classList.remove('active');
- document.getElementById('uploadSection').classList.remove('active');
- document.getElementById('uploadSection2').classList.add('active');
- });
- let buttonContestant = false
- document.getElementById('registerBtn').addEventListener('click', function () {
- document.getElementById('registerBtn').classList.add('active');
- document.getElementById('registerBtn2').classList.remove('active');
- document.getElementById('downloadBtn').classList.remove('active');
- document.getElementById('registerBtn1').classList.remove('active');
- document.getElementById('registrationSection').classList.add('active');
- document.getElementById('downloadSection').classList.remove('active');
- document.getElementById('uploadSection').classList.remove('active');
- document.getElementById('uploadSection2').classList.remove('active');
- console.log("selectedCompetitionId:", selectedCompetitionId);
- if (buttonContestant) {
- document.getElementsByClassName("button-Contestant")[0].classList.add('active');
- } else {
- document.getElementsByClassName("button-Contestant")[0].classList.remove('active');
- }
- });
- let uploadFileUrl = ''
- // 比赛类型选择
- const competitionCards = document.querySelectorAll('.competition-card');
- let selectedCompetitionId = null;
- competitionCards.forEach(card => {
- card.addEventListener('click', function () {
- // 移除所有卡片的selected类
- competitionCards.forEach(c => {
- c.classList.remove('selected');
- });
- // 添加当前卡片的selected类
- this.classList.add('selected');
- // 存储选择的比赛ID
- selectedCompetitionId = this.getAttribute('data-id');
- });
- });
- // 步骤切换
- document.getElementById('nextToStep2').addEventListener('click', function () {
- if (!selectedCompetitionId) {
- alert('请先选择比赛类型');
- return;
- }
- if (selectedCompetitionId == 2) {
- addContestant()
- }
- // 初始化
- updateGroupSelect(selectedCompetitionId);
- // 切换到步骤2
- document.getElementById('step1').classList.remove('active');
- document.getElementById('step2').classList.add('active');
- document.getElementsByClassName("button-Contestant")[0].classList.add('active');
- buttonContestant = true
- });
- document.getElementById('prevToStep1').addEventListener('click', function () {
- // 切换回步骤1
- document.getElementById('step2').classList.remove('active');
- document.getElementById('step1').classList.add('active');
- document.getElementsByClassName("button-Contestant")[0].classList.remove('active');
- buttonContestant = false
- const html = document.getElementById('formContainer');
- // 删除添加的表单
- addList.forEach((item, idx) => {
- let formDiv = html.querySelector(`div#addformContainer${item}`);
- if (formDiv) {
- html.removeChild(formDiv);
- }
- });
- addList = []
- num = 1
- });
- let num = 1;
- let addList = []
- function addContestant() {
- const html = document.getElementById('formContainer');
- if (html.children.length >= 6) {
- alert('最多添加3个选手');
- return
- }
- num = num + 1;
- addList.push(num)
- const ifFirst = addList.find(item => item === 1);
- let addListLength = addList.length + 1;
- if (ifFirst) {
- addListLength = addList.length
- }
- console.log("addListLength:", html.children.length);
- const createDiv = document.createElement('div');
- createDiv.id = `addformContainer${num}`;
- createDiv.style.position = 'relative';
- const h3Create = document.createElement('h3');
- h3Create.innerText = `选手${addListLength}:`;
- createDiv.appendChild(h3Create);
- const delButton = document.createElement('button');
- delButton.innerText = `删除选手${addListLength}`;
- delButton.className = 'menu-btn-add remove-Contestant';
- delButton.onclick = removeContestant;
- createDiv.appendChild(delButton);
- const brCreate = document.createElement('br');
- createDiv.appendChild(brCreate);
- const formCrate = document.createElement('form');
- formCrate.id = `registrationForm${num}`;
- if (selectedCompetitionId == 2) {
- formCrate.innerHTML = `<div class="form-row">
- <div class="form-col">
- <div class="form-group">
- <label class="form-label required" for="name">姓名</label>
- <input type="text" id="name${num}" class="form-input" required>
- <div class="error" id="name-error${num}">请输入姓名</div>
- </div>
- </div>
- <div class="form-col">
- <div class="form-group">
- <label class="form-label required" for="gender">性别</label>
- <select id="gender${num}" class="form-input" required>
- <option value="">请选择</option>
- <option value="1">男</option>
- <option value="2">女</option>
- </select>
- <div class="error" id="gender-error${num}">请选择性别</div>
- </div>
- </div>
- </div>
- <div class="form-row">
- <div class="form-col">
- <div class="form-group">
- <label class="form-label required" for="ethnicity">民族</label>
- <input type="text" id="ethnicity${num}" class="form-input" required>
- <div class="error" id="ethnicity-error${num}">请输入民族</div>
- </div>
- </div>
- <div class="form-col">
- <div class="form-group">
- <label class="form-label required" for="birthdate">出生年月</label>
- <input type="date" id="birthdate${num}" class="form-input" required>
- <div class="error" id="birthdate-error${num}">请选择出生年月</div>
- </div>
- </div>
- </div>
- <div class="form-row">
- <div class="form-col">
- <div class="form-group">
- <label class="form-label required" for="email">电子邮箱</label>
- <input type="email" id="email${num}" class="form-input" required>
- <div class="error" id="email-error${num}">请输入有效的电子邮箱</div>
- </div>
- </div>
- <div class="form-col">
- <div class="form-group">
- <label class="form-label required" for="idNumber">身份证号码</label>
- <input type="text" id="idNumber${num}" class="form-input" required pattern="\d{17}[\dXx]">
- <div class="error" id="idNumber-error${num}">请输入正确身份证号</div>
- </div>
- </div>
- </div>
- <div class="form-row">
- <div class="form-col">
- <div class="form-group">
- <label class="form-label required" for="group">组别</label>
- <select id="group${num}" class="form-input" required>
- <option value="">请选择</option>
- <option value="1">小学组(4-6年级)</option>
- <option value="2">初中组(7-9年级)</option>
- <option value="3">高中组(10-12年级,含中职)</option>
- <option value="4">高校组(含高职)</option>
- </select>
- <div class="error" id="group-error${num}">请选择组别</div>
- </div>
- </div>
- <div class="form-col">
- <div class="form-group">
- <label class="form-label required" for="grade">年级</label>
- <input type="text" id="grade${num}" class="form-input" required>
- <div class="error" id="grade-error${num}">请输入年级</div>
- </div>
- </div>
- </div>
- <div class="form-row">
- <div class="form-col">
- <div class="form-group">
- <label class="form-label required" for="school">所在学校</label>
- <input type="text" id="school${num}" class="form-input" required>
- <div class="error" id="school-error${num}">请输入学校名称</div>
- </div>
- </div>
- <div class="form-col">
- <div class="form-group">
- <label class="form-label required" for="schoolRegion">学校所在地区</label>
- <input type="text" id="schoolRegion${num}" class="form-input" required
- placeholder="省/市/区">
- <div class="error" id="schoolRegion-error${num}">请输入学校所在地区</div>
- </div>
- </div>
- </div>
- <div class="form-group">
- <label class="form-label required" for="phone">联系电话</label>
- <input type="tel" id="phone${num}" class="form-input" required pattern="[0-9]{11}">
- <div class="error" id="phone-error${num}">请输入11位手机号码</div>
- </div>`;
- } else {
- formCrate.innerHTML = `<div class="form-row">
- <div class="form-col">
- <div class="form-group">
- <label class="form-label required" for="name">姓名</label>
- <input type="text" id="name${num}" class="form-input" required>
- <div class="error" id="name-error${num}">请输入姓名</div>
- </div>
- </div>
- <div class="form-col">
- <div class="form-group">
- <label class="form-label required" for="gender">性别</label>
- <select id="gender${num}" class="form-input" required>
- <option value="">请选择</option>
- <option value="1">男</option>
- <option value="2">女</option>
- </select>
- <div class="error" id="gender-error${num}">请选择性别</div>
- </div>
- </div>
- </div>
- <div class="form-row">
- <div class="form-col">
- <div class="form-group">
- <label class="form-label required" for="ethnicity">民族</label>
- <input type="text" id="ethnicity${num}" class="form-input" required>
- <div class="error" id="ethnicity-error${num}">请输入民族</div>
- </div>
- </div>
- <div class="form-col">
- <div class="form-group">
- <label class="form-label required" for="birthdate">出生年月</label>
- <input type="date" id="birthdate${num}" class="form-input" required>
- <div class="error" id="birthdate-error${num}">请选择出生年月</div>
- </div>
- </div>
- </div>
- <div class="form-row">
- <div class="form-col">
- <div class="form-group">
- <label class="form-label required" for="email">电子邮箱</label>
- <input type="email" id="email${num}" class="form-input" required>
- <div class="error" id="email-error${num}">请输入有效的电子邮箱</div>
- </div>
- </div>
- <div class="form-col">
- <div class="form-group">
- <label class="form-label required" for="idNumber">身份证号码</label>
- <input type="text" id="idNumber${num}" class="form-input" required pattern="\d{17}[\dXx]">
- <div class="error" id="idNumber-error${num}">请输入正确身份证号</div>
- </div>
- </div>
- </div>
- <div class="form-row">
- <div class="form-col">
- <div class="form-group">
- <label class="form-label required" for="group">组别</label>
- <select id="group${num}" class="form-input" required>
- <option value="">请选择</option>
- <option value="1">小学低龄</option>
- <option value="2">小学高龄</option>
- <option value="3">中学</option>
- <option value="4">高校</option>
- </select>
- <div class="error" id="group-error${num}">请选择组别</div>
- </div>
- </div>
- <div class="form-col">
- <div class="form-group">
- <label class="form-label required" for="grade">年级</label>
- <input type="text" id="grade${num}" class="form-input" required>
- <div class="error" id="grade-error${num}">请输入年级</div>
- </div>
- </div>
- </div>
- <div class="form-row">
- <div class="form-col">
- <div class="form-group">
- <label class="form-label required" for="school">所在学校</label>
- <input type="text" id="school${num}" class="form-input" required>
- <div class="error" id="school-error${num}">请输入学校名称</div>
- </div>
- </div>
- <div class="form-col">
- <div class="form-group">
- <label class="form-label required" for="schoolRegion">学校所在地区</label>
- <input type="text" id="schoolRegion${num}" class="form-input" required
- placeholder="省/市/区">
- <div class="error" id="schoolRegion-error${num}">请输入学校所在地区</div>
- </div>
- </div>
- </div>
- <div class="form-group">
- <label class="form-label required" for="phone">联系电话</label>
- <input type="tel" id="phone${num}" class="form-input" required pattern="[0-9]{11}">
- <div class="error" id="phone-error${num}">请输入11位手机号码</div>
- </div>`;
- }
- createDiv.appendChild(formCrate);
- html.appendChild(createDiv);
- }
- function removeContestant(e) {
- const parentElement = Number(e.target.parentElement.id && e.target.parentElement.id.slice(16));
- const html = document.getElementById('formContainer');
- if (selectedCompetitionId == 2) {
- if (html.children.length <= 5) {
- alert('至少保留两个选手');
- return
- }
- }
- addList = addList.filter(item => item !== parentElement);
- let selectForm = html.querySelector(`div#addformContainer${parentElement}`);
- if (selectForm) html.removeChild(selectForm);
- // 依次递增更新剩余选手的序号
- addList.forEach((item, idx) => {
- let formDiv = html.querySelector(`div#addformContainer${item}`);
- if (formDiv) {
- formDiv.querySelector('h3').innerText = `选手${idx + 2}:`;
- formDiv.querySelector('button').innerText = `删除选手${idx + 2}`;
- }
- });
- // num = num - 1;
- }
- async function submitData() {
- const requiredFields = ['name', 'gender', 'ethnicity', 'birthdate', 'email',
- 'idNumber', 'group', 'grade', 'school', 'schoolRegion', 'phone',];
- let formData = [];
- let idNumber = '';
- let idError = '';
- let phone = '';
- let phoneError = '';
- let i = 0
- let isFirst = addList.find(item => item === 1);
- if (!isFirst) addList.unshift(1);
- const teacher = document.getElementById('teacher').value;
- if (!teacher) {
- alert('请填写指导老师');
- return;
- }
- const teacherPhone = document.getElementById('teacherPhone').value;
- if (!/^[0-9]{11}$/.test(teacherPhone)) {
- alert('请正确填写指导老师手机号');
- return;
- }
- let phoneSet = new Set();
- for (let j = 0; j <= addList.length - 1; j++) {
- let element = null;
- let errorElement = null;
- let isValid = true;
- i = addList[j]
- requiredFields.forEach(field => {
- element = document.getElementById(field + i);
- errorElement = document.getElementById(`${field}-error` + i);
- if (!element.value) {
- errorElement.style.display = 'block';
- isValid = false;
- } else {
- errorElement.style.display = 'none';
- }
- });
- // 验证身份证格式
- idNumber = document.getElementById('idNumber' + i);
- idError = document.getElementById('idNumber-error' + i);
- if (idNumber.value.length > 5) {
- idError.style.display = 'none';
- } else {
- idError.style.display = 'block';
- isValid = false;
- }
- // 验证手机号格式
- phone = document.getElementById('phone' + i);
- phoneError = document.getElementById('phone-error' + i);
- if (!/^[0-9]{11}$/.test(phone.value)) {
- phoneError.style.display = 'block';
- isValid = false;
- } else {
- phoneError.style.display = 'none';
- }
- if (!isValid) {
- alert(`选手${j + 1}填写信息有误,请重新填写`);
- return;
- };
- formData.push({
- name: document.getElementById('name' + i).value,
- gender: document.getElementById('gender' + i).value,
- ethnicity: document.getElementById('ethnicity' + i).value,
- birthdate: document.getElementById('birthdate' + i).value,
- email: document.getElementById('email' + i).value,
- id_number: document.getElementById('idNumber' + i).value,
- group: document.getElementById('group' + i).value,
- grade: document.getElementById('grade' + i).value,
- school: document.getElementById('school' + i).value,
- schoolRegion: document.getElementById('schoolRegion' + i).value,
- phone: document.getElementById('phone' + i).value,
- })
- }
- try {
- // 收集表单数据
- const formDataObj = {
- type: selectedCompetitionId, // 报名类型,1桌游,2智能体
- uploadUrl: teacher + teacherPhone, // 上传文件的URL
- idCard: formData.map(item => item.id_number).join(","), // 选手身份证号拼接
- registrationFormUrl: "", // 报名表上传URL
- user: JSON.stringify(formData),
- area: urlSearch.slice(1), // 区
- };
- let aa = selectedCompetitionId == 2 ? "智能体应用类比赛,手机号作为登录账号,请确认手机号填写正确且不能重复" : "桌游设计挑战类比赛"
- if (!confirm(`您参加的是${aa},提交之后无法再修改信息,是否确认提交?`)) {
- return;
- }
- // 发送报名信息请求
- const registerResponse = await fetch(requesturl + 'api/user', {
- method: 'POST',
- headers: {
- 'Content-Type': 'application/json'
- },
- body: JSON.stringify(formDataObj)
- });
- if (!registerResponse.ok) {
- throw new Error('报名提交失败');
- }
- const registerData = await registerResponse.json();
- console.log(registerData);
- if (registerData.status == "ok") {
- alert("报名完成,审核情况会通过邮箱通知,请注意邮箱信息");
- } else {
- alert(registerData.message);
- }
- // document.getElementById('registrationForm').reset();
- } catch (error) {
- console.error('提交错误:', error);
- alert(`报名失败: ${error.message}`);
- }
- }
- async function submitRegistration() {
- var area = urlSearch.slice(1)
- if (area.indexOf("longhua") > -1 || area.indexOf("guangming") > -1) { alert("报名时间已截止"); return }
- const idNumber = document.getElementById('id_number');
- const CompetitionType = document.getElementById('CompetitionType');
- if (!idNumber.value && !CompetitionType.value) {
- alert('请选择比赛类型和填写身份证号');
- //e.target.value = ''; // 清空已选择的文件
- return;
- }
- if (uploadFileUrl1 == "") {
- alert('请上传报名文件');
- return;
- }
- if (CompetitionType.value == 2 && document.getElementById("videoUploadDiv").style.display == "block") {
- if (uploadVideoUrl == "") {
- alert('请上传智能体视频');
- return;
- }
- }
- if (!confirm('如已上传过文件,本次上传会覆盖之前上传,是否确定提交吗?')) {
- return;
- }
- try {
- const response = await fetch(requesturl + "api/update", {
- method: "POST",
- headers: {
- "Content-Type": "application/json"
- },
- body: JSON.stringify({
- url: uploadFileUrl1,
- id_number: idNumber.value,
- type: CompetitionType.value,
- area: urlSearch.slice(1)
- })
- })
- if (!response.ok) {
- throw new Error('信息更新失败');
- }
- const registerData = await response.json();
- console.log(registerData);
- alert(registerData.message);
- } catch (error) {
- console.error('信息更新失败:', error);
- alert(error.message);
- }
- }
- async function submitRegistration2() {
- const idNumber = document.getElementById('id_number2');
- if (!idNumber.value) {
- alert('请选择比赛类型和填写身份证号');
- return;
- }
- if (uploadFileUrl2 == "") {
- alert('请上传报名文件');
- return;
- }
- if (!confirm('如已上传过文件,本次上传会覆盖之前上传,是否确定提交吗?')) {
- return;
- }
- try {
- const response = await fetch(requesturl + "api/update", {
- method: "POST",
- headers: {
- "Content-Type": "application/json"
- },
- body: JSON.stringify({
- url: uploadFileUrl2,
- id_number: idNumber.value,
- type: 2,
- area: ""
- })
- })
- if (!response.ok) {
- throw new Error('信息更新失败');
- }
- const registerData = await response.json();
- console.log(registerData);
- alert(registerData.message);
- } catch (error) {
- console.error('信息更新失败:', error);
- alert(error.message);
- }
- }
- async function help() {
- const img1 = `<img class="help-qrCode" src="https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/0960e9b6-2687-b858-2285-455c29eac369/code2.png" />`
- const img2 = `<div><span>创新思维赛 桌游设计挑战类 答疑群</span><br /><img class="help-qrCode" src="./2.png" /></div>`
- showModal(img1 + img2)
- }
- async function openVideo() {
- // const video = `<video style="width:100%;height:100%" src="https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/f41a07d8-2cab-76b2-2b5b-8211d98bdb0c/%E9%A6%AC%E6%88%B2%E5%9C%98%E6%A9%9F%E5%99%A8%E4%BA%BA.mp4" controls autoplay></video>`
- showModal("宣讲视频暂无...")
- }
- let uploadFileUrl1 = "";
-
- let uploadFileUrl2 = "";
- let uploadVideoUrl = "";
- document.getElementById('uploadFile').addEventListener('change', async function (e) {
- const idNumber = document.getElementById('id_number');
- if (!idNumber.value) {
- alert('请先填写身份证号');
- e.target.value = ''; // 清空已选择的文件
- return;
- }
- const file = e.target.files[0];
- if (!file) return;
- const fileName = `${idNumber.value}/${file.name}`;
- uploadFileUrl1 = await uplod(fileName, file);
- console.log('选择文件:', uploadFileUrl1);
- });
- document.getElementById('uploadFile2').addEventListener('change', async function (e) {
- const idNumber = document.getElementById('id_number2');
- if (!idNumber.value) {
- alert('请先填写身份证号');
- e.target.value = ''; // 清空已选择的文件
- return;
- }
- const file = e.target.files[0];
- if (!file) return;
- const fileName = `${idNumber.value}/${file.name}`;
- uploadFileUrl2 = await uplod(fileName, file);
- console.log('选择文件:', uploadFileUrl2);
- });
-
- document.getElementById('uploadVideo').addEventListener('change', async function (e) {
- const idNumber = document.getElementById('id_number');
- if (!idNumber.value) {
- alert('请先填写身份证号');
- e.target.value = ''; // 清空已选择的文件
- return;
- }
- const file = e.target.files[0];
- if (!file) return;
- const fileName = `${idNumber}/${file.name}`;
- uploadVideoUrl = await uplod(fileName, file);
- console.log('视频文件:', uploadVideoUrl);
- })
- async function uplod(fileName, file) {
- var bucket = new window.AWS.S3({ params: { Bucket: 'ccrb' } });
- var params = {
- Key: fileName,
- ContentType: file.type,
- Body: file,
- 'Access-Control-Allow-Credentials': '*',
- 'ACL': 'public-read'
- };
- try {
- const data = await bucket.upload(params).promise();
- console.log('上传成功:', data);
- alert('文件上传成功');
- return data.Location;
- } catch (err) {
- console.error('上传失败:', err);
- alert('文件上传失败');
- return '';
- }
- }
- function styleHide() {
- selectedCompetitionId = 2
- document.getElementById('registerBtn').click();
- document.getElementById('downloadBtn').style.display = 'none';
- // document.getElementById('registerBtn1').style.display = 'none';
- document.getElementById('prevToStep1').style.display = 'none';
- addContestant()
- updateGroupSelect(selectedCompetitionId);
- // 切换到步骤2
- document.getElementById('step1').classList.remove('active');
- document.getElementById('step2').classList.add('active');
- document.getElementsByClassName("button-Contestant")[0].classList.add('active');
- document.getElementsByClassName("button-group")[1].style.textAlign = "center";
- document.getElementsByClassName("button-group")[1].style.display = "block";
- document.getElementsByClassName("step-title")[1].style.display = "none";
- document.getElementById("videoUploadDiv").style.display = "block";
- buttonContestant = true
- }
- window.onload = function () {
- // updateGroupSelect("1")
- if (urlSearch.slice(1) == "baoan") {
- styleHide()
- } else if (urlSearch.slice(1) == "guangming") {
- styleHide()
- } else if (urlSearch.slice(1) == "pingshan") {
- styleHide()
- } else if (urlSearch.slice(1) == "longhua") {
- styleHide()
- } else if (urlSearch.slice(1) == "nanshan") {
- styleHide()
- }
- }
- </script>
- <!-- Modal -->
- <div id="modal"
- style="display:none;position:fixed;top:0;left:0;width:100vw;height:100vh;background:rgba(0,0,0,0.4);z-index:999;justify-content:center;align-items:center;">
- <div
- style="background:#fff;padding:30px 20px;border-radius:10px;width:800px;box-shadow:0 4px 24px rgba(0,0,0,0.2);position:relative;">
- <span id="modalClose" style="position:absolute;top:10px;right:15px;font-size:22px;cursor:pointer;">×</span>
- <div id="modalContent" style="text-align: center;"></div>
- </div>
- </div>
- <script>
- // 显示modal
- function showModal(content) {
- document.getElementById('modalContent').innerHTML = content;
- document.getElementById('modal').style.display = 'flex';
- }
- // 关闭modal
- document.getElementById('modalClose').onclick = function () {
- document.getElementById('modal').style.display = 'none';
- };
- // 点击遮罩关闭
- document.getElementById('modal').onclick = function (e) {
- if (e.target === this) this.style.display = 'none';
- };
- // 示例:点击左下角问号弹出帮助
- // document.querySelector('.help').onclick = function() {
- // showModal('如有疑问请联系组委会邮箱:ccrb@cocorobo.cn<br>或电话:020-8251-0085');
- // };
- </script>
- </body>
- <script>
- // 根据比赛类型显示对应组别
- function updateGroupSelect(type) {
- const groupContainers = document.getElementById('group-containers')
- console.log(groupContainers)
- if (type == "1") {
- groupContainers.innerHTML = `<div class="form-group" id="group-container1">
- <label class="form-label required" for="group">组别</label>
- <select id="group1" class="form-input" required>
- <option value="">请选择</option>
- <option value="1">小学低龄</option>
- <option value="2">小学高龄</option>
- <option value="3">中学</option>
- <option value="4">高校</option>
- </select>
- <div class="error" id="group-error1">请选择组别</div>
- </div>`
- } else {
- groupContainers.innerHTML = `
- <div class="form-group" id="group-container2" >
- <label class="form-label required" for="group">组别</label>
- <select id="group1" class="form-input" required>
- <option value="">请选择</option>
- <option value="1">小学组(4-6年级)</option>
- <option value="2">初中组(7-9年级)</option>
- <option value="3">高中组(10-12年级,含中职)</option>
- <option value="4">高校组(含高职)</option>
- </select>
- <div class="error" id="group-error1">请选择组别</div>
- </div>`
- }
- }
- </script>
- <script>
- </script>
- </html>
|