From ea9e0058d4b1bad3ab512721298cde7054df3e20 Mon Sep 17 00:00:00 2001 From: freefire Date: Tue, 1 Sep 2026 21:33:24 +0800 Subject: [PATCH] =?UTF-8?q?fix:=20=E9=93=BE=E6=8E=A5=E5=AF=B9=E8=AF=9D?= =?UTF-8?q?=E6=A1=86=E7=AB=99=E5=86=85=E6=90=9C=E7=B4=A2=E6=94=B6=E8=BF=9B?= =?UTF-8?q?=E9=AB=98=E7=BA=A7=E9=80=89=E9=A1=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 默认只显示网址与文字;展开高级选项后再搜站内内容,点选时同步更新链接文字。 Co-authored-by: Cursor --- .../components/editor/ArticleLinkDialog.tsx | 127 ++++++++++-------- frontend/src/styles/global.css | 32 +++++ 2 files changed, 105 insertions(+), 54 deletions(-) diff --git a/frontend/src/components/editor/ArticleLinkDialog.tsx b/frontend/src/components/editor/ArticleLinkDialog.tsx index 81273c6..5d2990d 100644 --- a/frontend/src/components/editor/ArticleLinkDialog.tsx +++ b/frontend/src/components/editor/ArticleLinkDialog.tsx @@ -14,7 +14,7 @@ import { api } from '@/api/client'; import type { PostItem, SitePageSummary } from '@/api/types'; import { pagePath, postPath } from '@/utils/permalink'; import { useForumLimits } from '@/hooks/useForumLimits'; -import { Loader2 } from 'lucide-react'; +import { ChevronDown, Loader2 } from 'lucide-react'; export interface ArticleLinkConfirm { url: string; @@ -69,6 +69,7 @@ export function ArticleLinkDialog({ const { limits } = useForumLimits(); const [url, setUrl] = useState(''); const [text, setText] = useState(''); + const [advancedOpen, setAdvancedOpen] = useState(false); const [query, setQuery] = useState(''); const [debouncedQuery, setDebouncedQuery] = useState(''); const [posts, setPosts] = useState([]); @@ -80,15 +81,19 @@ export function ArticleLinkDialog({ if (!open) return; setUrl(initialUrl || ''); setText(initialText || ''); + setAdvancedOpen(false); setQuery(''); setDebouncedQuery(''); + setPosts([]); + setPages([]); + setLoaded(false); }, [open, initialUrl, initialText]); useEffect(() => { - if (!open) return; + if (!open || !advancedOpen) return; const t = window.setTimeout(() => setDebouncedQuery(query.trim()), SEARCH_DEBOUNCE_MS); return () => window.clearTimeout(t); - }, [query, open]); + }, [query, open, advancedOpen]); const loadSiteHits = useCallback(async (keyword: string) => { setLoading(true); @@ -120,10 +125,11 @@ export function ArticleLinkDialog({ } }, []); + // 仅展开高级选项时再请求站内内容,避免默认打开就打接口 useEffect(() => { - if (!open) return; + if (!open || !advancedOpen) return; void loadSiteHits(debouncedQuery); - }, [open, debouncedQuery, loadSiteHits]); + }, [open, advancedOpen, debouncedQuery, loadSiteHits]); const hits: SiteHit[] = useMemo(() => { const postHits: SiteHit[] = posts.map(p => ({ @@ -143,7 +149,8 @@ export function ArticleLinkDialog({ const pickHit = (hit: SiteHit) => { setUrl(hit.url); - setText(prev => (prev.trim() ? prev : hit.title)); + // 选站内内容时同步用标题作为链接文字 + setText(hit.title); }; const handleConfirm = () => { @@ -171,7 +178,6 @@ export function ArticleLinkDialog({
-

输入目标 URL

-
-

或链接到站点中的内容

-
- - setQuery(e.target.value)} - /> -
-
-

- {debouncedQuery - ? `搜索「${debouncedQuery}」` - : '未指定搜索条件。自动显示最近发布条目。'} -

- {loading && !loaded ? ( -
- - 加载中… +
+ + {advancedOpen ? ( +
+

链接到站点中的内容

+
+ + setQuery(e.target.value)} + />
- ) : !hits.length ? ( -
暂无匹配内容
- ) : ( -
    - {hits.map(hit => ( -
  • - -
  • - ))} -
- )} - {loading && loaded ? ( -
- +
+

+ {debouncedQuery + ? `搜索「${debouncedQuery}」` + : '未指定搜索条件。自动显示最近发布条目。'} +

+ {loading && !loaded ? ( +
+ + 加载中… +
+ ) : !hits.length ? ( +
暂无匹配内容
+ ) : ( +
    + {hits.map(hit => ( +
  • + +
  • + ))} +
+ )} + {loading && loaded ? ( +
+ +
+ ) : null}
- ) : null} -
+
+ ) : null}
diff --git a/frontend/src/styles/global.css b/frontend/src/styles/global.css index 9a8cd9a..4b17024 100644 --- a/frontend/src/styles/global.css +++ b/frontend/src/styles/global.css @@ -10990,6 +10990,38 @@ button.profile-stat:hover strong { font-size: 12px; color: var(--color-text-2); } +.article-link-dialog__advanced { + padding-bottom: 8px; +} +.article-link-dialog__advanced-toggle { + display: inline-flex; + align-items: center; + gap: 6px; + margin: 0; + padding: 0; + border: none; + background: transparent; + font-size: 13px; + font-weight: 600; + color: var(--color-text-2); + cursor: pointer; + user-select: none; +} +.article-link-dialog__advanced-toggle:hover { + color: var(--color-text-1); +} +.article-link-dialog__advanced-chevron { + transition: transform 0.15s ease; +} +.article-link-dialog__advanced-toggle.is-open .article-link-dialog__advanced-chevron { + transform: rotate(180deg); +} +.article-link-dialog__advanced-body { + display: flex; + flex-direction: column; + gap: 12px; + margin-top: 12px; +} .article-link-dialog__hits { position: relative; border: 1px solid var(--j13-border);