fix: 修复首页TypeError和模态框无法打开问题

start.sh

@@ -0,0 +1 @@
+python -m uvicorn app:app --host 0.0.0.0 --port 8000

templates/base.html

@@ -111,15 +111,15 @@
       lbIndex = index || 0;
       updateLightbox();
       const lb = document.getElementById('lightbox');
-      lb.classList.remove('hidden');
-      lb.classList.add('flex');
+      lb.style.display='flex';
+      
       document.body.style.overflow = 'hidden';
     }
     function closeLightbox(e) {
       if (e && e.target.tagName === 'IMG') return;
       const lb = document.getElementById('lightbox');
-      lb.classList.add('hidden');
-      lb.classList.remove('flex');
+      lb.style.display='none';
+      
       document.body.style.overflow = '';
     }
     function navigateLightbox(dir, e) {
@@ -135,7 +135,7 @@
       document.getElementById('lb-next').classList.toggle('hidden', lbImages.length <= 1);
     }
     document.addEventListener('keydown', e => {
-      if (document.getElementById('lightbox').classList.contains('hidden')) return;
+      if (document.getElementById('lightbox').style.display === 'none' || document.getElementById('lightbox').style.display === '') return;
       if (e.key === 'ArrowLeft') navigateLightbox(-1);
       else if (e.key === 'ArrowRight') navigateLightbox(1);
       else if (e.key === 'Escape') closeLightbox(e);

templates/evaluations.html

@@ -75,7 +75,7 @@
 {% endif %}
 
 <!-- Modal -->
-<div id="evalModal" class="fixed inset-0 z-50 hidden items-center justify-center modal-overlay bg-black/40">
+<div id="evalModal" class="fixed inset-0 z-50 items-center justify-center modal-overlay bg-black/40" style="display:none">
   <div class="bg-white rounded-2xl w-full max-w-lg mx-4 shadow-2xl max-h-[90vh] overflow-y-auto">
     <div class="px-6 py-5 border-b border-gray-100 flex items-center justify-between sticky top-0 bg-white z-10 rounded-t-2xl">
       <h3 class="font-bold text-gray-800">新增知识评价</h3>
@@ -126,7 +126,7 @@
 <script>
 const today=new Date().toISOString().slice(0,10);
 document.querySelectorAll('input[name="date"][value]').forEach(el=>{if(!el.value)el.value=today;});
-function openModal(){const m=document.getElementById('evalModal');m.classList.remove('hidden');m.classList.add('flex');}
-function closeModal(){const m=document.getElementById('evalModal');m.classList.add('hidden');m.classList.remove('flex');}
+function openModal(){const m=document.getElementById('evalModal');m.style.display='flex';}
+function closeModal(){const m=document.getElementById('evalModal');m.style.display='none';}
 </script>
 {% endblock %}

templates/index.html

@@ -20,7 +20,7 @@
     <div class="flex items-center justify-between">
       <div>
         <p class="text-gray-400 text-xs mb-1">今日错题</p>
-        <p class="text-3xl font-bold text-gray-800">{{ today_images.values() | map(attribute='__len__') | sum }}</p>
+        <p class="text-3xl font-bold text-gray-800">{{ today_images.values() | map('length') | sum }}</p>
       </div>
       <div class="w-11 h-11 rounded-xl bg-pink-50 flex items-center justify-center text-accent text-lg">
         <i class="fa-solid fa-image"></i>

templates/subjects.html

@@ -49,7 +49,7 @@
 {% endif %}
 
 <!-- Create modal -->
-<div id="createModal" class="fixed inset-0 z-50 hidden items-center justify-center modal-overlay bg-black/40">
+<div id="createModal" class="fixed inset-0 z-50 items-center justify-center modal-overlay bg-black/40" style="display:none">
   <div class="bg-white rounded-2xl w-full max-w-md mx-4 shadow-2xl">
     <div class="px-6 py-5 border-b border-gray-100 flex items-center justify-between sticky top-0 bg-white z-10 rounded-t-2xl">
       <h3 class="font-bold text-gray-800">新建科目</h3>
@@ -84,8 +84,8 @@
 
 {% block extra_js %}
 <script>
-function openModal(){const m=document.getElementById('createModal');m.classList.remove('hidden');m.classList.add('flex');}
-function closeModal(){const m=document.getElementById('createModal');m.classList.add('hidden');m.classList.remove('flex');}
+function openModal(){const m=document.getElementById('createModal');m.style.display='flex';}
+function closeModal(){const m=document.getElementById('createModal');m.style.display='none';}
 document.querySelectorAll('input[name="color"]').forEach(r=>{
   r.addEventListener('change',function(){
     document.querySelectorAll('input[name="color"]~span').forEach(s=>s.style.boxShadow='none');