修复问题

This commit is contained in:
海龙 2025-08-27 15:23:29 +08:00
parent c401f1ff0a
commit 7271f96003
2 changed files with 42 additions and 4 deletions

View File

@ -995,7 +995,11 @@ const PhotoStoryModal = ({
}; };
const router = useRouter(); const router = useRouter();
const taskProgressRef = useRef(taskProgress); const taskProgressRef = useRef(taskProgress);
const [cursorPosition, setCursorPosition] = useState(0);
const handleCursorPositionChange = (position: number) => {
setCursorPosition(position);
};
useEffect(() => { useEffect(() => {
taskProgressRef.current = taskProgress; taskProgressRef.current = taskProgress;
}, [taskProgress]); }, [taskProgress]);
@ -1279,6 +1283,8 @@ const PhotoStoryModal = ({
<HighlightEditor <HighlightEditor
content={storyContent} content={storyContent}
onContentChange={updateStoryContent} onContentChange={updateStoryContent}
onCursorPositionChange={handleCursorPositionChange}
cursorPosition={cursorPosition}
type={"role"} type={"role"}
placeholder="Share your creative ideas about the image and let AI create a movie story for you..." placeholder="Share your creative ideas about the image and let AI create a movie story for you..."
/> />

View File

@ -14,6 +14,8 @@ export const HighlightEditor = ({
onContentChange, onContentChange,
type, type,
placeholder, placeholder,
cursorPosition,
onCursorPositionChange,
}: { }: {
/** 内容 */ /** 内容 */
content: string; content: string;
@ -23,7 +25,13 @@ export const HighlightEditor = ({
type: string; type: string;
/**提示语 */ /**提示语 */
placeholder: string; placeholder: string;
/** 光标位置 */
cursorPosition?: number;
/** 光标位置变化回调 */
onCursorPositionChange?: (position: number) => void;
}) => { }) => {
console.log(44444);
const editor = useEditor({ const editor = useEditor({
extensions: [ extensions: [
StarterKit, StarterKit,
@ -40,8 +48,22 @@ export const HighlightEditor = ({
onContentChange(""); onContentChange("");
return; return;
} }
// 直接传递文本内容,不进行复杂的标签重建
onContentChange(textContent); // 获取 HTML 内容并转换 highlight-text 标签
const htmlContent = editor.getHTML();
const convertedContent = htmlContent.replace(
/<highlight-text[^>]*type="([^"]*)"[^>]*text="([^"]*)"[^>]*>([^<]*)<\/highlight-text>/g,
'<$1>$2</$1>'
);
console.log('convertedContent:::', convertedContent);
// 保存当前光标位置
const { from } = editor.state.selection;
onCursorPositionChange?.(from);
// 传递转换后的内容
onContentChange(convertedContent);
}, },
editorProps: { editorProps: {
handleKeyDown: (view, event) => { handleKeyDown: (view, event) => {
@ -77,15 +99,25 @@ export const HighlightEditor = ({
editor.commands.clearContent(true); editor.commands.clearContent(true);
return; return;
} }
// 将带标签的内容转换为高亮显示(支持新的标签格式) // 将带标签的内容转换为高亮显示(支持新的标签格式)
const htmlContent = content.replace( const htmlContent = content.replace(
new RegExp(`<${type}[^>]*>([^<]+)<\/${type}>`, "g"), new RegExp(`<${type}[^>]*>([^<]+)<\/${type}>`, "g"),
'<highlight-text type="' + type + '" text="$1" color="blue">$1</highlight-text>' '<highlight-text type="' + type + '" text="$1" color="blue">$1</highlight-text>'
); );
console.log('111111', 111111)
editor.commands.setContent(htmlContent, { emitUpdate: false }); editor.commands.setContent(htmlContent, { emitUpdate: false });
// 恢复光标位置
if (cursorPosition && cursorPosition > 0) {
// 确保光标位置不超出文档范围
const docSize = editor.state.doc.content.size;
const safePosition = Math.min(cursorPosition, docSize);
if (safePosition > 0) {
editor.commands.setTextSelection(safePosition);
}
}
} }
}, [content, editor]); }, [content, editor, cursorPosition]);
return ( return (
<div className="flex-1 min-w-0 relative pr-20"> <div className="flex-1 min-w-0 relative pr-20">