Skip to content

Commit 9e8ddd7

Browse files
committed
优化AITestDialog和ScanControls组件,禁用自动滚动功能,允许用户手动查看内容。更新VectorizeModal组件,添加扫描状态提示,确保用户在扫描过程中获得清晰反馈。提升用户体验,确保多语言支持的准确性和一致性。
1 parent 5b2d8c5 commit 9e8ddd7

File tree

3 files changed

+152
-58
lines changed

3 files changed

+152
-58
lines changed

src/components/AITestDialog.tsx

Lines changed: 37 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -962,7 +962,7 @@ const tooltipStyles = `
962962
margin-right: -1rem !important;
963963
border-radius: 0 !important;
964964
}
965-
965+
966966
.code-scroll-container pre {
967967
max-width: 100% !important;
968968
}
@@ -986,7 +986,7 @@ export default function AITestDialog({
986986
fixLightModeStyle.textContent = `
987987
/* 直接重写浅色模式下的代码高亮样式 - 超高优先级 */
988988
body:not(.dark) .light-syntax-highlighter pre code,
989-
body:not(.dark) pre code,
989+
body:not(.dark) pre code,
990990
html:not(.dark) .light-syntax-highlighter pre code,
991991
html:not(.dark) pre code {
992992
color: #383a42 !important;
@@ -1000,41 +1000,41 @@ export default function AITestDialog({
10001000
}
10011001
10021002
/* 每个高亮元素单独设置 */
1003-
html:not(.dark) code span.hljs-keyword,
1003+
html:not(.dark) code span.hljs-keyword,
10041004
html:not(.dark) pre code span.hljs-keyword { color: #a626a4 !important; }
1005-
1006-
html:not(.dark) code span.hljs-built_in,
1005+
1006+
html:not(.dark) code span.hljs-built_in,
10071007
html:not(.dark) pre code span.hljs-built_in { color: #c18401 !important; }
1008-
1009-
html:not(.dark) code span.hljs-string,
1008+
1009+
html:not(.dark) code span.hljs-string,
10101010
html:not(.dark) pre code span.hljs-string { color: #50a14f !important; }
1011-
1012-
html:not(.dark) code span.hljs-number,
1011+
1012+
html:not(.dark) code span.hljs-number,
10131013
html:not(.dark) pre code span.hljs-number { color: #986801 !important; }
1014-
1015-
html:not(.dark) code span.hljs-comment,
1014+
1015+
html:not(.dark) code span.hljs-comment,
10161016
html:not(.dark) pre code span.hljs-comment { color: #a0a1a7 !important; font-style: italic !important; }
1017-
1018-
html:not(.dark) code span.hljs-title,
1017+
1018+
html:not(.dark) code span.hljs-title,
10191019
html:not(.dark) pre code span.hljs-title { color: #4078f2 !important; }
1020-
1021-
html:not(.dark) code span.hljs-attr,
1020+
1021+
html:not(.dark) code span.hljs-attr,
10221022
html:not(.dark) pre code span.hljs-attr { color: #986801 !important; }
1023-
1024-
html:not(.dark) code span.hljs-tag,
1023+
1024+
html:not(.dark) code span.hljs-tag,
10251025
html:not(.dark) pre code span.hljs-tag { color: #e45649 !important; }
1026-
1027-
html:not(.dark) code span.hljs-name,
1026+
1027+
html:not(.dark) code span.hljs-name,
10281028
html:not(.dark) pre code span.hljs-name { color: #e45649 !important; }
1029-
1030-
html:not(.dark) code span.hljs-type,
1029+
1030+
html:not(.dark) code span.hljs-type,
10311031
html:not(.dark) pre code span.hljs-type { color: #986801 !important; }
1032-
1033-
html:not(.dark) code span.hljs-variable,
1032+
1033+
html:not(.dark) code span.hljs-variable,
10341034
html:not(.dark) pre code span.hljs-variable { color: #e45649 !important; }
10351035
10361036
/* 直接给code元素添加样式,确保默认文本颜色正确 */
1037-
.light-theme code,
1037+
.light-theme code,
10381038
.light-theme pre {
10391039
color: #383a42 !important;
10401040
}
@@ -1104,8 +1104,11 @@ export default function AITestDialog({
11041104
// 添加预设提示弹窗状态
11051105
const [showPresetPrompts, setShowPresetPrompts] = useState(false);
11061106

1107-
// 自动滚动到当前AI回复的开头位置
1107+
// 自动滚动到当前AI回复的开头位置(已禁用)
11081108
const scrollToCurrentResponse = useCallback(() => {
1109+
// 已禁用自动滚动功能,用户可以手动滚动查看内容
1110+
// 原代码保留作为参考
1111+
/*
11091112
if (currentRoundRef.current) {
11101113
currentRoundRef.current.scrollIntoView({
11111114
behavior: "smooth",
@@ -1115,14 +1118,18 @@ export default function AITestDialog({
11151118
// 如果找不到当前轮次的引用,则滚动到底部
11161119
contentRef.current.scrollTop = contentRef.current.scrollHeight;
11171120
}
1121+
*/
11181122
}, [currentRoundRef]);
11191123

1120-
// 监听AI回复完成,自动滚动到当前轮次开头
1124+
// 监听AI回复完成,不再自动滚动(已禁用)
11211125
useEffect(() => {
1126+
// 已禁用自动滚动功能,用户可以手动滚动查看内容
1127+
/*
11221128
if (!isTesting && dialogRounds.length > 0 && currentRound > 0) {
11231129
// AI回复完成时滚动到当前回复开头
11241130
scrollToCurrentResponse();
11251131
}
1132+
*/
11261133
}, [isTesting, dialogRounds.length, currentRound, scrollToCurrentResponse]);
11271134

11281135
// 处理关键字点击事件,获取关键字的上下文信息
@@ -1784,11 +1791,14 @@ ${fileContents}`);
17841791
};
17851792
}, []);
17861793

1787-
// 自动滚动到底部 - 保留原有的滚动逻辑,但不在上面的效果触发时执行
1794+
// 自动滚动到底部功能(已禁用)
17881795
useEffect(() => {
1796+
// 已禁用自动滚动功能,用户可以手动滚动查看内容
1797+
/*
17891798
if (contentRef.current && isTesting) {
17901799
contentRef.current.scrollTop = contentRef.current.scrollHeight;
17911800
}
1801+
*/
17921802
}, [dialogRounds, currentResponse, isTesting]);
17931803

17941804
// 开始测试

src/components/ScanControls.tsx

Lines changed: 52 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -744,34 +744,58 @@ export default function ScanControls() {
744744
</span>
745745
</motion.button>
746746

747-
{/* 向量化报告按钮 */}
748-
{currentScan && (
749-
<motion.button
750-
onClick={handleOpenVectorizeModal}
751-
className="px-3 py-2 rounded-md text-sm font-medium transition-colors flex items-center bg-white dark:bg-gray-700 text-gray-700 dark:text-gray-200 hover:bg-gray-100 dark:hover:bg-gray-600 border border-gray-200 dark:border-gray-600"
752-
whileHover={{ scale: 1.02 }}
753-
whileTap={{ scale: 0.98 }}
754-
transition={{ type: "spring", stiffness: 400, damping: 10 }}
755-
>
756-
<span className="flex items-center">
757-
<svg
758-
xmlns="http://www.w3.org/2000/svg"
759-
className="h-4 w-4 mr-1.5 text-purple-600 dark:text-purple-400"
760-
fill="none"
761-
viewBox="0 0 24 24"
762-
stroke="currentColor"
763-
>
764-
<path
765-
strokeLinecap="round"
766-
strokeLinejoin="round"
767-
strokeWidth={2}
768-
d="M9 3v2m6-2v2M9 19v2m6-2v2M5 9H3m2 6H3m18-6h-2m2 6h-2M7 19h10a2 2 0 002-2V7a2 2 0 00-2-2H7a2 2 0 00-2 2v10a2 2 0 002 2zM9 9h6v6H9V9z"
769-
/>
770-
</svg>
771-
{t("scanControls.vectorize")}
772-
</span>
773-
</motion.button>
774-
)}
747+
{/* 向量化报告按钮 - 允许在扫描过程中点击 */}
748+
<motion.button
749+
onClick={handleOpenVectorizeModal}
750+
className={`px-3 py-2 rounded-md text-sm font-medium transition-colors flex items-center ${
751+
!currentScan && scanStatus !== "scanning"
752+
? "bg-gray-200 dark:bg-gray-700 text-gray-500 dark:text-gray-400 cursor-not-allowed"
753+
: "bg-white dark:bg-gray-700 text-gray-700 dark:text-gray-200 hover:bg-gray-100 dark:hover:bg-gray-600 border border-gray-200 dark:border-gray-600"
754+
}`}
755+
whileHover={{ scale: 1.02 }}
756+
whileTap={{ scale: 0.98 }}
757+
transition={{ type: "spring", stiffness: 400, damping: 10 }}
758+
>
759+
<span className="flex items-center">
760+
{scanStatus === "scanning" ? (
761+
<>
762+
<svg
763+
xmlns="http://www.w3.org/2000/svg"
764+
className="h-4 w-4 mr-1.5 text-purple-600 dark:text-purple-400"
765+
fill="none"
766+
viewBox="0 0 24 24"
767+
stroke="currentColor"
768+
>
769+
<path
770+
strokeLinecap="round"
771+
strokeLinejoin="round"
772+
strokeWidth={2}
773+
d="M9 3v2m6-2v2M9 19v2m6-2v2M5 9H3m2 6H3m18-6h-2m2 6h-2M7 19h10a2 2 0 002-2V7a2 2 0 00-2-2H7a2 2 0 00-2 2v10a2 2 0 002 2zM9 9h6v6H9V9z"
774+
/>
775+
</svg>
776+
{t("scanControls.vectorize")}
777+
</>
778+
) : (
779+
<>
780+
<svg
781+
xmlns="http://www.w3.org/2000/svg"
782+
className="h-4 w-4 mr-1.5 text-purple-600 dark:text-purple-400"
783+
fill="none"
784+
viewBox="0 0 24 24"
785+
stroke="currentColor"
786+
>
787+
<path
788+
strokeLinecap="round"
789+
strokeLinejoin="round"
790+
strokeWidth={2}
791+
d="M9 3v2m6-2v2M9 19v2m6-2v2M5 9H3m2 6H3m18-6h-2m2 6h-2M7 19h10a2 2 0 002-2V7a2 2 0 00-2-2H7a2 2 0 00-2 2v10a2 2 0 002 2zM9 9h6v6H9V9z"
792+
/>
793+
</svg>
794+
{t("scanControls.vectorize")}
795+
</>
796+
)}
797+
</span>
798+
</motion.button>
775799
</div>
776800
</div>
777801

src/components/VectorizeModal.tsx

Lines changed: 63 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,11 @@ import { useState, useEffect } from "react";
44
import { motion, AnimatePresence } from "framer-motion";
55
import { useTranslations } from "./LocaleProvider";
66
import { useAtom } from "jotai";
7-
import { currentScanAtom, readmeContentAtom } from "../lib/store";
7+
import {
8+
currentScanAtom,
9+
readmeContentAtom,
10+
scanStatusAtom,
11+
} from "../lib/store";
812
import {
913
findRelevantFiles,
1014
parseFilePathsResult,
@@ -122,6 +126,7 @@ export default function VectorizeModal({ onClose }: VectorizeModalProps) {
122126
const [result, setResult] = useState("");
123127
const [error, setError] = useState("");
124128
const [currentScan] = useAtom(currentScanAtom);
129+
const [scanStatus] = useAtom(scanStatusAtom);
125130
const [readmeContent] = useAtom(readmeContentAtom);
126131
const [relevantFiles, setRelevantFiles] = useState<string[]>([]);
127132
const [relevantKnowledge, setRelevantKnowledge] = useState<string[]>([]);
@@ -156,6 +161,15 @@ export default function VectorizeModal({ onClose }: VectorizeModalProps) {
156161

157162
const handleSubmit = async (e: React.FormEvent) => {
158163
e.preventDefault();
164+
165+
// 检查扫描状态,如果正在扫描中,则显示提示信息
166+
if (scanStatus === "scanning") {
167+
setError(
168+
t("vectorReport.scanningInProgress") || "请等待扫描完成后再进行向量化"
169+
);
170+
return;
171+
}
172+
159173
if (!question.trim() || !currentScan) return;
160174

161175
setIsProcessing(true);
@@ -691,9 +705,15 @@ ${functions
691705
<div className="flex justify-end">
692706
<button
693707
type="submit"
694-
disabled={isProcessing || !question.trim()}
708+
disabled={
709+
isProcessing ||
710+
!question.trim() ||
711+
scanStatus === "scanning"
712+
}
695713
className={`px-4 py-2 rounded-md text-sm font-medium transition-colors ${
696-
isProcessing || !question.trim()
714+
isProcessing ||
715+
!question.trim() ||
716+
scanStatus === "scanning"
697717
? "bg-gray-200 dark:bg-gray-700 text-gray-500 dark:text-gray-400 cursor-not-allowed"
698718
: "bg-emerald-600 hover:bg-emerald-700 text-white focus:outline-none focus:ring-2 focus:ring-emerald-500 focus:ring-offset-2"
699719
}`}
@@ -722,6 +742,24 @@ ${functions
722742
</svg>
723743
{t("vectorReport.processing")}
724744
</span>
745+
) : scanStatus === "scanning" ? (
746+
<span className="flex items-center">
747+
<svg
748+
className="mr-2 h-4 w-4 text-current"
749+
xmlns="http://www.w3.org/2000/svg"
750+
fill="none"
751+
viewBox="0 0 24 24"
752+
stroke="currentColor"
753+
>
754+
<path
755+
strokeLinecap="round"
756+
strokeLinejoin="round"
757+
strokeWidth={2}
758+
d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"
759+
/>
760+
</svg>
761+
{t("vectorReport.waitForScan") || "等待扫描完成"}
762+
</span>
725763
) : (
726764
<span className="flex items-center">
727765
<svg
@@ -743,6 +781,28 @@ ${functions
743781
)}
744782
</button>
745783
</div>
784+
785+
{/* 扫描中提示信息 */}
786+
{scanStatus === "scanning" && (
787+
<div className="mt-2 text-xs text-amber-600 dark:text-amber-400 flex items-center">
788+
<svg
789+
xmlns="http://www.w3.org/2000/svg"
790+
className="h-4 w-4 mr-1.5"
791+
fill="none"
792+
viewBox="0 0 24 24"
793+
stroke="currentColor"
794+
>
795+
<path
796+
strokeLinecap="round"
797+
strokeLinejoin="round"
798+
strokeWidth={2}
799+
d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"
800+
/>
801+
</svg>
802+
{t("vectorReport.scanningTip") ||
803+
"您可以先输入提示词,但需要等待扫描完成后才能进行向量化"}
804+
</div>
805+
)}
746806
{renderProcessingPhase()}
747807
</form>
748808

0 commit comments

Comments
 (0)