Upload 68 files

app/services/bootstrap.py

@@ -73,6 +73,35 @@ def ensure_submission_constraints() -> None:
             pass
 
 
+def relax_legacy_task_media_columns() -> None:
+    if engine.dialect.name != "mysql":
+        return
+
+    column_details = task_column_details()
+    if not column_details:
+        return
+
+    legacy_columns = ["image_data", "clue_image_data"]
+    statements: list[str] = []
+    for column_name in legacy_columns:
+        detail = column_details.get(column_name)
+        if not detail or detail.get("nullable", True):
+            continue
+        column_type = detail.get("type")
+        if column_type is None:
+            continue
+        compiled_type = column_type.compile(dialect=engine.dialect)
+        statements.append(
+            f"ALTER TABLE tasks MODIFY COLUMN {column_name} {compiled_type} NULL"
+        )
+
+    if not statements:
+        return
+
+    with engine.begin() as connection:
+        for statement in statements:
+            connection.execute(text(statement))
+
 def migrate_task_media_to_files() -> None:
     column_details = task_column_details()
     if not column_details:
@@ -193,6 +222,7 @@ def upgrade_schema() -> None:
             )
 
     ensure_submission_constraints()
+    relax_legacy_task_media_columns()
     migrate_task_media_to_files()
 
 
@@ -233,3 +263,4 @@ def seed_super_admin(db: Session) -> None:
 
 
 
+

app/static/style.css

@@ -1,4 +1,4 @@
-:root {
+:root {
   --bg: #eef8ef;
   --bg-deep: #d7edd7;
   --surface: rgba(255, 255, 255, 0.75);
@@ -1350,4 +1350,371 @@ button {
   .login-panel {
     padding: 24px;
   }
+}
+/* Mobile polish */
+input[type="checkbox"],
+input[type="radio"] {
+  width: 18px;
+  height: 18px;
+  padding: 0;
+  margin: 0;
+  border-radius: 6px;
+  accent-color: var(--primary);
+  box-shadow: none;
+  transform: none;
+  flex: 0 0 auto;
+}
+
+input[type="checkbox"]:focus,
+input[type="radio"]:focus {
+  outline: 2px solid rgba(78, 148, 97, 0.24);
+  outline-offset: 2px;
+  box-shadow: none;
+}
+
+input[type="file"] {
+  padding: 10px 12px;
+  border-style: dashed;
+  background: rgba(255, 255, 255, 0.8);
+  cursor: pointer;
+}
+
+input[type="file"]::file-selector-button {
+  margin-right: 12px;
+  padding: 9px 14px;
+  border: 0;
+  border-radius: 999px;
+  background: rgba(78, 148, 97, 0.12);
+  color: var(--primary-deep);
+  cursor: pointer;
+}
+
+.table-checkbox {
+  justify-self: center;
+}
+
+.table-inline-form {
+  min-width: 220px;
+}
+
+.carousel-controls-bottom {
+  display: none;
+}
+
+.topnav a {
+  flex: 0 0 auto;
+  white-space: nowrap;
+}
+
+@media (max-width: 980px) {
+  .topbar {
+    gap: 14px;
+  }
+
+  .topnav {
+    width: 100%;
+    flex-wrap: nowrap;
+    overflow-x: auto;
+    overflow-y: hidden;
+    justify-content: flex-start;
+    padding: 0 4px 4px;
+    margin: 0 -4px -4px;
+    -webkit-overflow-scrolling: touch;
+    scrollbar-width: none;
+  }
+
+  .topnav::-webkit-scrollbar {
+    display: none;
+  }
+
+  .published-activity-hero {
+    grid-template-columns: 1fr;
+  }
+
+  .published-activity-badges {
+    justify-content: flex-start;
+  }
+}
+
+@media (max-width: 720px) {
+  body {
+    overflow-x: hidden;
+  }
+
+  .shell {
+    width: min(100% - 16px, 1200px);
+    padding-top: 14px;
+  }
+
+  .topbar {
+    position: static;
+    padding: 14px 16px;
+    margin-bottom: 18px;
+    border-radius: 24px;
+  }
+
+  .brand-mark {
+    width: 44px;
+    height: 44px;
+    font-size: 1.2rem;
+  }
+
+  .brand-title {
+    font-size: 1.08rem;
+  }
+
+  .topnav {
+    gap: 8px;
+  }
+
+  .topnav a,
+  .ghost-link {
+    padding: 9px 12px;
+    font-size: 0.92rem;
+  }
+
+  .hero-card,
+  .glass-card,
+  .login-copy,
+  .login-panel {
+    padding: 18px;
+    border-radius: 22px;
+  }
+
+  .hero-card h2,
+  .login-copy h1,
+  .login-panel h2 {
+    font-size: 1.62rem;
+    line-height: 1.18;
+  }
+
+  .lead {
+    font-size: 0.96rem;
+    line-height: 1.65;
+  }
+
+  .card-topline .status-badge,
+  .card-topline .eyebrow,
+  .card-footer .mini-note,
+  .section-head .mini-note,
+  .task-status-row .status-badge,
+  .task-status-row .mini-note,
+  .hero-badges,
+  .chip-row {
+    align-self: flex-start;
+  }
+
+  .bulk-toolbar,
+  .inline-form,
+  .table-inline-form,
+  .upload-form,
+  .task-carousel-head {
+    grid-template-columns: 1fr;
+    flex-direction: column;
+    align-items: stretch;
+  }
+
+  .carousel-controls {
+    width: 100%;
+    justify-content: space-between;
+    gap: 8px;
+    flex-wrap: nowrap;
+  }
+
+  .carousel-controls .btn {
+    flex: 1 1 0;
+    min-width: 0;
+  }
+
+  .carousel-controls .mini-note {
+    flex: 0 0 auto;
+    align-self: center;
+    text-align: center;
+  }
+
+  .carousel-controls-bottom {
+    display: flex;
+  }
+
+  .table-shell,
+  .rank-table-wrap {
+    margin-inline: -18px;
+    padding: 0 18px 4px;
+  }
+
+  .data-table,
+  .rank-table {
+    min-width: 560px;
+    font-size: 0.92rem;
+  }
+
+  .rank-table th,
+  .rank-table td,
+  .data-table th,
+  .data-table td {
+    padding: 12px 10px;
+    white-space: nowrap;
+  }
+
+  .activity-grid {
+    grid-template-columns: 1fr;
+    gap: 16px;
+  }
+
+  .activity-card > .muted {
+    display: -webkit-box;
+    overflow: hidden;
+    -webkit-line-clamp: 2;
+    -webkit-box-orient: vertical;
+  }
+
+  .activity-card .meta-grid {
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+    margin: 14px 0;
+  }
+
+  .member-row {
+    flex-direction: column;
+    align-items: flex-start;
+  }
+
+  .published-activity-card {
+    padding: 20px 18px;
+    border-radius: 24px;
+  }
+
+  .published-activity-card::before {
+    left: 18px;
+    width: 84px;
+  }
+
+  .published-activity-title {
+    font-size: 1.45rem;
+  }
+
+  .published-activity-metrics {
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+    gap: 12px;
+  }
+
+  .activity-metric-card {
+    padding: 14px;
+    border-radius: 18px;
+  }
+
+  .task-carousel-shell {
+    gap: 14px;
+    overflow: hidden;
+  }
+
+  .task-flip-book {
+    min-height: 0;
+    height: auto;
+    overflow: hidden;
+    transition: height 0.28s ease;
+  }
+
+  .task-page {
+    width: 100%;
+    transform: perspective(1000px) rotateY(0deg) translateX(14px) scale(0.992);
+  }
+
+  .task-page.is-left {
+    transform: perspective(1000px) rotateY(0deg) translateX(-14px) scale(0.988);
+  }
+
+  .task-page-grid {
+    grid-template-columns: 1fr;
+    gap: 16px;
+  }
+
+  .task-page-content,
+  .task-page-inner {
+    gap: 12px;
+  }
+
+  .task-description {
+    min-height: 0;
+  }
+
+  .task-media,
+  .submission-preview img,
+  .review-image {
+    aspect-ratio: auto;
+    max-height: 48vh;
+  }
+
+  .clue-toggle {
+    width: 42px;
+    height: 42px;
+    border-radius: 16px;
+  }
+
+  .clue-modal {
+    padding: 16px;
+  }
+
+  .clue-gradient-panel {
+    padding: 12px;
+    border-radius: 22px;
+  }
+
+  .clue-gradient-panel img {
+    max-height: 70dvh;
+    border-radius: 18px;
+  }
+
+  .review-card .action-grid {
+    flex-direction: column;
+    align-items: stretch;
+  }
+
+  .login-body {
+    min-height: 100dvh;
+  }
+
+  .login-page {
+    width: min(100% - 16px, 1200px);
+    min-height: 100dvh;
+    padding: 16px 0 24px;
+    gap: 16px;
+    align-content: start;
+  }
+
+  .login-panel {
+    order: 1;
+    gap: 14px;
+  }
+
+  .login-copy {
+    order: 2;
+    gap: 14px;
+    min-height: auto;
+    align-content: start;
+  }
+
+  .spring-copy,
+  .admin-copy,
+  .admin-panel {
+    min-height: auto;
+    align-content: start;
+  }
+}
+
+@media (max-width: 560px) {
+  .published-activity-metrics {
+    grid-template-columns: 1fr;
+  }
+
+  .hero-side-rank {
+    padding: 16px;
+  }
+
+  .task-page {
+    transform: translateX(10px) scale(0.995);
+  }
+
+  .task-page.is-left {
+    transform: translateX(-10px) scale(0.99);
+  }
 }

app/templates/activity_detail.html

@@ -74,9 +74,9 @@
         <span class="chip" id="rejected-progress-chip">被驳回 {{ group_progress.rejected_count }}</span>
       </div>
       <div class="carousel-controls">
-        <button class="btn btn-secondary small-btn" type="button" id="prev-task-btn">上一张</button>
-        <span class="mini-note" id="task-counter">1 / {{ activity.tasks|length }}</span>
-        <button class="btn btn-secondary small-btn" type="button" id="next-task-btn">下一张</button>
+        <button class="btn btn-secondary small-btn" type="button" data-task-prev>上一张</button>
+        <span class="mini-note" data-task-counter>1 / {{ activity.tasks|length }}</span>
+        <button class="btn btn-secondary small-btn" type="button" data-task-next>下一张</button>
       </div>
     </div>
 
@@ -158,6 +158,12 @@
         </article>
       {% endfor %}
     </div>
+
+    <div class="carousel-controls carousel-controls-bottom">
+      <button class="btn btn-secondary small-btn" type="button" data-task-prev>上一张</button>
+      <span class="mini-note" data-task-counter>1 / {{ activity.tasks|length }}</span>
+      <button class="btn btn-secondary small-btn" type="button" data-task-next>下一张</button>
+    </div>
   </section>
 
   <div class="clue-modal" id="clue-modal" aria-hidden="true">
@@ -175,9 +181,10 @@
       const pages = Array.from(document.querySelectorAll('[data-task-page]'));
       if (!pages.length) return;
 
-      const counter = document.getElementById('task-counter');
-      const prevBtn = document.getElementById('prev-task-btn');
-      const nextBtn = document.getElementById('next-task-btn');
+      const flipBook = document.getElementById('task-flip-book');
+      const counters = Array.from(document.querySelectorAll('[data-task-counter]'));
+      const prevButtons = Array.from(document.querySelectorAll('[data-task-prev]'));
+      const nextButtons = Array.from(document.querySelectorAll('[data-task-next]'));
       const clueModal = document.getElementById('clue-modal');
       const clueModalImage = document.getElementById('clue-modal-image');
       const clueCloseBtn = document.getElementById('clue-close-btn');
@@ -186,6 +193,8 @@
       const pendingProgressChip = document.getElementById('pending-progress-chip');
       const rejectedProgressChip = document.getElementById('rejected-progress-chip');
       let currentIndex = 0;
+      let touchStartX = 0;
+      let touchStartY = 0;
       const seenReleased = new Set(
         pages.filter((page) => page.dataset.clueReleased === 'true').map((page) => page.dataset.taskId)
       );
@@ -200,25 +209,81 @@
         return parts.join(' · ');
       };
 
+      const syncFlipBookHeight = () => {
+        if (!flipBook) return;
+        const activePage = pages[currentIndex];
+        if (!activePage) return;
+        const inner = activePage.querySelector('.task-page-inner');
+        const styles = window.getComputedStyle(activePage);
+        const paddingY = parseFloat(styles.paddingTop || '0') + parseFloat(styles.paddingBottom || '0');
+        const height = (inner ? inner.scrollHeight : activePage.scrollHeight) + paddingY;
+        flipBook.style.height = `${Math.ceil(height)}px`;
+      };
+
+      const queueFlipBookHeightSync = () => {
+        window.requestAnimationFrame(syncFlipBookHeight);
+      };
+
       const setActivePage = (index) => {
         currentIndex = (index + pages.length) % pages.length;
         pages.forEach((page, pageIndex) => {
           page.classList.toggle('is-active', pageIndex === currentIndex);
           page.classList.toggle('is-left', pageIndex < currentIndex);
         });
-        if (counter) counter.textContent = `${currentIndex + 1} / ${pages.length}`;
+        counters.forEach((counter) => {
+          counter.textContent = `${currentIndex + 1} / ${pages.length}`;
+        });
+        queueFlipBookHeightSync();
       };
 
-      prevBtn?.addEventListener('click', () => setActivePage(currentIndex - 1));
-      nextBtn?.addEventListener('click', () => setActivePage(currentIndex + 1));
+      prevButtons.forEach((button) => {
+        button.addEventListener('click', () => setActivePage(currentIndex - 1));
+      });
+      nextButtons.forEach((button) => {
+        button.addEventListener('click', () => setActivePage(currentIndex + 1));
+      });
       setActivePage(0);
 
+      flipBook?.addEventListener('touchstart', (event) => {
+        if (!event.touches.length) return;
+        touchStartX = event.touches[0].clientX;
+        touchStartY = event.touches[0].clientY;
+      }, { passive: true });
+
+      flipBook?.addEventListener('touchend', (event) => {
+        if (!event.changedTouches.length) return;
+        const deltaX = event.changedTouches[0].clientX - touchStartX;
+        const deltaY = event.changedTouches[0].clientY - touchStartY;
+        touchStartX = 0;
+        touchStartY = 0;
+        if (Math.abs(deltaX) < 56 || Math.abs(deltaX) <= Math.abs(deltaY) * 1.15) return;
+        setActivePage(deltaX < 0 ? currentIndex + 1 : currentIndex - 1);
+      }, { passive: true });
+
+      if ('ResizeObserver' in window) {
+        const resizeObserver = new ResizeObserver(() => {
+          queueFlipBookHeightSync();
+        });
+        pages.forEach((page) => resizeObserver.observe(page));
+      }
+
+      pages.forEach((page) => {
+        page.querySelectorAll('img').forEach((image) => {
+          if (image.complete) return;
+          image.addEventListener('load', queueFlipBookHeightSync);
+        });
+      });
+      window.addEventListener('resize', queueFlipBookHeightSync);
+
       const closeClueModal = () => {
         clueModal?.classList.remove('is-open');
         if (clueModal) clueModal.setAttribute('aria-hidden', 'true');
       };
 
       clueCloseBtn?.addEventListener('click', closeClueModal);
+      document.addEventListener('keydown', (event) => {
+        if (event.key === 'Escape') closeClueModal();
+      });
       clueModal?.addEventListener('click', (event) => {
         if (event.target === clueModal || event.target.classList.contains('clue-modal-backdrop')) {
           closeClueModal();
@@ -332,6 +397,7 @@
             }
           });
           refreshLeaderboard(payload.leaderboard || []);
+          queueFlipBookHeightSync();
         } catch (error) {
           console.debug('task status refresh skipped', error);
         }
@@ -341,8 +407,5 @@
       window.setInterval(refreshStatuses, 10000);
     })();
   </script>
-{% endblock %}
-
-
-
+{% endblock %}
 

app/templates/admin_users.html

@@ -97,7 +97,7 @@
         <thead>
           <tr>
             <th>
-              <input type="checkbox" data-check-all />
+              <input class="table-checkbox" type="checkbox" data-check-all />
             </th>
             <th>学号</th>
             <th>姓名</th>
@@ -109,13 +109,13 @@
           {% for user_item in users %}
             <tr>
               <td>
-                <input type="checkbox" name="user_ids" value="{{ user_item.id }}" data-user-check form="bulk-users-form" />
+                <input class="table-checkbox" type="checkbox" name="user_ids" value="{{ user_item.id }}" data-user-check form="bulk-users-form" />
               </td>
               <td>{{ user_item.student_id }}</td>
               <td>{{ user_item.full_name }}</td>
               <td>{{ user_item.group.name if user_item.group else '未分组' }}</td>
               <td>
-                <form method="post" action="/admin/users/{{ user_item.id }}/group" class="inline-form">
+                <form method="post" action="/admin/users/{{ user_item.id }}/group" class="inline-form table-inline-form">
                   <select name="group_id">
                     <option value="">未分组</option>
                     {% for group in groups %}