From 90010113ddacfb181cc4cfa007fb53634e2bc12c Mon Sep 17 00:00:00 2001
From: klarkxy <278370456@qq.com>
Date: Wed, 8 Jul 2026 21:07:56 +0800
Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20feat(ui):=20=E5=88=A4=E9=A2=98?=
 =?UTF-8?q?=E7=BB=93=E6=9E=9C=E9=A1=B5=20AI=20=E7=82=B9=E8=AF=84=E5=8C=BA?=
 =?UTF-8?q?=E6=94=AF=E6=8C=81=E6=8A=98=E5=8F=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 为 LLM 点评标题增加点击折叠/展开交互，减少页面占用空间
- 新增标题悬停反馈与图标旋转动画样式
- 移除快捷操作区中的"下载测试数据"按钮入口
---
 web/template/syzoj/reinfo.php | 73 ++++++++++++++++++++++++++---------
 1 file changed, 54 insertions(+), 19 deletions(-)

diff --git a/web/template/syzoj/reinfo.php b/web/template/syzoj/reinfo.php
index 103d6cc..d18d826 100644
--- a/web/template/syzoj/reinfo.php
+++ b/web/template/syzoj/reinfo.php
@@ -101,6 +101,20 @@
 #llm-section .ui.header {
     margin-top: 0;
 }
+#llm-section .llm-section-header {
+    transition: background-color 0.15s;
+    padding: 4px 8px;
+    margin-left: -8px;
+    margin-right: -8px;
+    border-radius: 4px;
+}
+#llm-section .llm-section-header:hover {
+    background-color: rgba(33,150,243,0.06);
+}
+#llm-section .llm-toggle-icon {
+    transition: transform 0.2s;
+    color: #888;
+}
 #llm-review-result {
     word-break: break-word;
 }
@@ -157,33 +171,58 @@ i.icon.spinning {
     </div>
 
 
-    <!-- 3. AI 点评区（直接显示按钮，提到原始错误上面） -->
+    <!-- 3. AI 点评区（标题可点击折叠/展开） -->
     <?php if (isset($OJ_LLM_ENABLED) && $OJ_LLM_ENABLED) { ?>
     <div class="ui raised segment" id="llm-section">
-        <h3 class="ui header">
+        <h3 class="ui header llm-section-header" id="llm-toggle" style="cursor: pointer; user-select: none;">
             <i class="magic icon"></i>
             <div class="content">
                 AI 智能点评
                 <div class="sub header"><?php echo isset($MSG_AI_REVIEW_DESC) ? $MSG_AI_REVIEW_DESC : '基于你的代码和判题结果分析'; ?></div>
             </div>
+            <i class="dropdown icon llm-toggle-icon" style="margin-left: auto; font-size: 1em;"></i>
         </h3>
-        <button class="ui labeled icon primary button" id="llm-review-btn" onclick="fetchLLMReview()">
-            <i class="magic icon"></i> 获取 AI 点评
-        </button>
-        <div id="llm-review-loading" class="ui active inline text loader" style="display:none; margin-left: 1em;">
-            AI 正在分析你的代码，请稍候...
-        </div>
-        <div id="llm-review-result" style="display:none; margin-top: 15px;">
-            <div class="ui existing segment" id="llm-review-content"></div>
-        </div>
-        <div id="llm-review-error" style="display:none; margin-top: 15px;">
-            <div class="ui negative message">
-                <p id="llm-review-error-msg"></p>
+        <div id="llm-section-body">
+            <button class="ui labeled icon primary button" id="llm-review-btn" onclick="fetchLLMReview()">
+                <i class="magic icon"></i> 获取 AI 点评
+            </button>
+            <div id="llm-review-loading" class="ui active inline text loader" style="display:none; margin-left: 1em;">
+                AI 正在分析你的代码，请稍候...
+            </div>
+            <div id="llm-review-result" style="display:none; margin-top: 15px;">
+                <div class="ui existing segment" id="llm-review-content"></div>
+            </div>
+            <div id="llm-review-error" style="display:none; margin-top: 15px;">
+                <div class="ui negative message">
+                    <p id="llm-review-error-msg"></p>
+                </div>
             </div>
         </div>
     </div>
 
     <script>
+        // 折叠/展开 AI 点评区
+        (function(){
+            var header = document.getElementById('llm-toggle');
+            var body = document.getElementById('llm-section-body');
+            var icon = header ? header.querySelector('.llm-toggle-icon') : null;
+            if (!header || !body) return;
+
+            header.addEventListener('click', function(e){
+                // 如果用户点击的是按钮本身，不要触发展开（按钮事件自己处理）
+                if (e.target.closest('button')) return;
+                var collapsed = body.style.display === 'none';
+                body.style.display = collapsed ? '' : 'none';
+                if (icon) {
+                    icon.className = collapsed
+                        ? 'dropdown icon llm-toggle-icon'
+                        : 'dropdown icon llm-toggle-icon active';
+                    // active class 让 Semantic UI 的箭头自动旋转 90°，但我们手写也行
+                    icon.style.transform = collapsed ? 'rotate(0deg)' : 'rotate(-90deg)';
+                }
+            });
+        })();
+
         function fetchLLMReview(){
             var btn = $('#llm-review-btn');
             btn.prop('disabled', true).addClass('loading');
@@ -338,11 +377,7 @@ i.icon.spinning {
             <a class="ui button" href="problem.php?id=<?php echo intval($row['problem_id']) ?>">
                 <i class="info circle icon"></i> <?php echo isset($MSG_VIEW_PROBLEM) ? $MSG_VIEW_PROBLEM : '查看题目'; ?>
             </a>
-            <?php if (isset($OJ_DOWNLOAD) && $OJ_DOWNLOAD && ($isRE || $row['result']==6)) { ?>
-            <a class="ui orange button" href="download.php?sid=<?php echo intval($id) ?>">
-                <i class="download icon"></i> <?php echo isset($MSG_DOWNLOAD_DATA) ? $MSG_DOWNLOAD_DATA : '下载测试数据'; ?>
-            </a>
-            <?php } ?>
+
         </div>
     </div>