更新 announcement.html

app/templates/announcement.html

@@ -54,11 +54,8 @@
                 <div class="layui-col-md6">
                     <fieldset class="layui-elem-field">
                         <legend>今日课程</legend>
-                        <div class="layui-field-box">
+                        <div class="layui-field-box" id="courses-container">
-                            <!-- 这里可以动态列出今日课程 -->
+                            <!-- 课程信息将通过JavaScript动态添加 -->
-                            <p>1. 数学 - 上午9:00</p>
-                            <p>2. 物理 - 下午1:00</p>
-                            <p>3. 文学 - 下午3:00</p>
                         </div>
                     </fieldset>
                 </div>
@@ -72,6 +69,15 @@
 <script src="/static/js/menu.js"></script>
 <script src="/static/js/logout.js"></script>
 <script>
+    $(document).ready(function () {
+        // 请求后端获取课程信息
+        $.get('/api/get-today-courses', function (data) {
+            data.forEach(function (course) {
+                // 为每个课程创建一个段落<p>并添加到容器中，并设置样式使字体更大且更加好看
+                $('#courses-container').append('<p style="font-size: 1.2em; margin: 5px 0;">课程: ' + course.name + ' - ' + course.time + '</p>');
+            });
+        });
+    });
 </script>
 </body>
 </html>