From 55689e04fc0c5f87a108b5d3a71d9289c98974fb Mon Sep 17 00:00:00 2001 From: kplam Date: Tue, 4 Aug 2026 17:37:19 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E7=9F=A5=E8=AF=86=E5=BA=93=E6=96=87?= =?UTF-8?q?=E6=A1=A3=E8=AF=A6=E6=83=85=E9=A1=B5=E5=86=85=E5=B1=95=E7=A4=BA?= =?UTF-8?q?=EF=BC=8C=E6=A6=82=E8=A7=88=E6=A3=80=E7=B4=A2=E6=A1=86=E5=B1=85?= =?UTF-8?q?=E4=B8=AD=E6=94=BE=E5=A4=A7=E5=B9=B6=E5=8F=82=E6=95=B0=E6=8C=81?= =?UTF-8?q?=E4=B9=85=E5=8C=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 知识库点击文档改为页面内展示详情，移除文档详情抽屉 - 概览检索框居中放大，检索参数（top_k/AI总结）改由 Modal 设置并持久化到 localStorage - 概览统计使用 Statistic 样式展示在检索框上方 --- frontend/src/views/Library.vue | 154 ++++++----- frontend/src/views/Overview.vue | 476 ++++++++++++++++++-------------- 2 files changed, 362 insertions(+), 268 deletions(-) diff --git a/frontend/src/views/Library.vue b/frontend/src/views/Library.vue index 3c85016..fd557e7 100644 --- a/frontend/src/views/Library.vue +++ b/frontend/src/views/Library.vue @@ -156,21 +156,21 @@ onMounted(() => { loadAll() }) -/* ---------- 文档详情 ---------- */ -const docDetailVisible = ref(false) +/* ---------- 文档详情（页面内展示） ---------- */ +const selectedDoc = ref(null) const docDetailData = ref(null) const isLoadingDetail = ref(false) const isDeleting = ref(false) const isReingesting = ref(false) function openDocDetail(doc) { - docDetailVisible.value = true + selectedDoc.value = doc docDetailData.value = null loadDocDetail(doc.doc_id) } function closeDocDetail() { - docDetailVisible.value = false + selectedDoc.value = null docDetailData.value = null } @@ -432,75 +432,73 @@ const failedColumns = [
{{ categoryDesc || '（无描述）' }}
+ +
+
+

+ {{ selectedDoc.title || '（无标题）' }} +

+
+ + 重新摘要 + + + 删除 + +
+
+ + +
+ + {{ docDetailData.l1?.doc_id || '-' }} + {{ docDetailData.l1?.title || '-' }} + {{ docDetailData.l1?.category || '-' }} + + + - + + {{ docDetailData.chunks_count ?? 0 }} + + + {{ docDetailData.file.filename }} + + （{{ formatSize(docDetailData.file.size_bytes) }}） + + + + + +

L1 全文

+ 
{{ docDetailData.l1?.text || '' }}
+ +

L2 节点（{{ (docDetailData.l2_nodes || []).length }}）

+
无
+
+
{{ node.section_path || '' }}
+
{{ node.text || '' }}
+
+ +

L3 节点（{{ (docDetailData.l3_nodes || []).length }}）

+
无
+
+
{{ node.section_path || '' }}
+
{{ node.text || '' }}
+
+
+
暂无数据
+ +
+ -
+
从左侧选择类目或文档查看详情
- - - -
- - {{ docDetailData.l1?.doc_id || '-' }} - {{ docDetailData.l1?.title || '-' }} - {{ docDetailData.l1?.category || '-' }} - - - - - - {{ docDetailData.chunks_count ?? 0 }} - - - {{ docDetailData.file.filename }} - - （{{ formatSize(docDetailData.file.size_bytes) }}） - - - - - -
- - 重新摘要 - - - 删除 - -
- -

L1 全文

- 
{{ docDetailData.l1?.text || '' }}
- -

L2 节点（{{ (docDetailData.l2_nodes || []).length }}）

-
无
-
-
{{ node.section_path || '' }}
-
{{ node.text || '' }}
-
- -

L3 节点（{{ (docDetailData.l3_nodes || []).length }}）

-
无
-
-
{{ node.section_path || '' }}
-
{{ node.text || '' }}
-
-
-
暂无数据
- - - = 1 && p.top_k <= 50) { + searchForm.top_k = p.top_k + } + if (typeof p.summarize === 'boolean') { + searchForm.summarize = p.summarize + } + } catch { + /* 忽略损坏的本地缓存 */ + } +} + +function persistParams() { + try { + localStorage.setItem( + STORAGE_KEY, + JSON.stringify({ top_k: searchForm.top_k, summarize: searchForm.summarize }) + ) + } catch { + /* localStorage 不可用时忽略 */ + } +} + +/* ---------- 检索 ---------- */ +const isSearching = ref(false) +const resultData = ref(null) +const searchFormRef = ref(null) const searchRules = { - query: [{ required: true, message: '请输入查询语句', trigger: 'blur' }], - top_k: [{ type: 'number', min: 1, max: 50, message: 'top_k 范围 1~50', trigger: 'change' }] + query: [{ required: true, message: '请输入查询语句', trigger: 'blur' }] } const routedCategoriesText = (cats) => { @@ -65,17 +96,44 @@ async function handleSearch() { } } +/* ---------- 检索参数设置弹窗 ---------- */ +const paramsVisible = ref(false) +const paramsFormRef = ref(null) +const paramsForm = reactive({ top_k: 5, summarize: false }) +const paramsRules = { + top_k: [{ type: 'number', min: 1, max: 50, message: 'top_k 范围 1~50', trigger: 'change' }] +} + +function openParams() { + paramsForm.top_k = searchForm.top_k + paramsForm.summarize = searchForm.summarize + paramsVisible.value = true +} + +async function saveParams() { + try { + await paramsFormRef.value.validate() + } catch { + return + } + searchForm.top_k = paramsForm.top_k + searchForm.summarize = paramsForm.summarize + persistParams() + paramsVisible.value = false + message.success('检索参数已保存') +} + /* ---------- 概览统计 ---------- */ const isLoading = ref(false) const statsData = ref(null) const cardMeta = [ - { key: 'doc_l1', label: 'L1 文档总结', icon: DatabaseOutlined, color: '#1677ff', bg: 'rgba(22, 119, 255, 0.12)' }, - { key: 'doc_l2', label: 'L2 大纲节点', icon: ApartmentOutlined, color: '#722ed1', bg: 'rgba(114, 46, 209, 0.12)' }, - { key: 'doc_l3', label: 'L3 内容大纲', icon: FileSearchOutlined, color: '#13c2c2', bg: 'rgba(19, 194, 194, 0.12)' }, - { key: 'chunks', label: 'Chunks', icon: BlockOutlined, color: '#fa8c16', bg: 'rgba(250, 140, 22, 0.12)' }, - { key: '__documents_total', label: '文档总数', icon: FileTextOutlined, color: '#52c41a', bg: 'rgba(82, 196, 26, 0.12)' }, - { key: '__uncategorized', label: '未分类文档', icon: QuestionCircleOutlined, color: '#ff4d4f', bg: 'rgba(255, 77, 79, 0.12)' } + { key: 'doc_l1', label: 'L1 文档总结', icon: DatabaseOutlined, color: '#1677ff' }, + { key: 'doc_l2', label: 'L2 大纲节点', icon: ApartmentOutlined, color: '#722ed1' }, + { key: 'doc_l3', label: 'L3 内容大纲', icon: FileSearchOutlined, color: '#13c2c2' }, + { key: 'chunks', label: 'Chunks', icon: BlockOutlined, color: '#fa8c16' }, + { key: '__documents_total', label: '文档总数', icon: FileTextOutlined, color: '#52c41a' }, + { key: '__uncategorized', label: '未分类文档', icon: QuestionCircleOutlined, color: '#ff4d4f' } ] const cards = computed(() => { @@ -131,6 +189,7 @@ async function loadStats() { } onMounted(() => { + loadParams() loadStats() }) @@ -145,143 +204,161 @@ onMounted(() => { - -
-

- - 检索 -

- - - - - - - - - AI 总结 - - - - 检索 - - - - -
- - - {{ routedCategoriesText(resultData.routed_categories) }} - - - - - -
-
AI 总结
-
{{ resultData.summary }}
-
- -
-
AI 提取的关键信息
- - {{ eiValue(resultData.extracted_info.rewrite) }} - {{ eiValue(resultData.extracted_info.keywords) }} - {{ eiValue(resultData.extracted_info.entities) }} - {{ eiValue(resultData.extracted_info.intent) }} - {{ eiValue(resultData.extracted_info.time_range) }} - {{ eiValue(resultData.extracted_info.categories) }} - -
- -
- 命中 {{ hits(resultData).length }} 条 -
- -
+ +
+ -
- score={{ hit.score }} | doc_id={{ hit.doc_id }} | 标题={{ hit.title || '' }} | section={{ hit.section_path || '' }} -
-
{{ hit.text || '' }}
-
- 文档摘要：{{ hit.doc_summary }} -
+ + + + +
+ + + +
+
+ + + + + + + + + 检索 + +
+
+ + + 参数设置 + + + top_k = {{ searchForm.top_k }}，AI 总结：{{ searchForm.summarize ? '开' : '关' }} + +
+
+ + +
+ + + {{ routedCategoriesText(resultData.routed_categories) }} + + + + + +
+
AI 总结
+
{{ resultData.summary }}
+
+ +
+
AI 提取的关键信息
+ + {{ eiValue(resultData.extracted_info.rewrite) }} + {{ eiValue(resultData.extracted_info.keywords) }} + {{ eiValue(resultData.extracted_info.entities) }} + {{ eiValue(resultData.extracted_info.intent) }} + {{ eiValue(resultData.extracted_info.time_range) }} + {{ eiValue(resultData.extracted_info.categories) }} + +
+ +
+ 命中 {{ hits(resultData).length }} 条 +
+ +
+
+ score={{ hit.score }} | doc_id={{ hit.doc_id }} | 标题={{ hit.title || '' }} | section={{ hit.section_path || '' }} +
+
{{ hit.text || '' }}
+
+ 文档摘要：{{ hit.doc_summary }}
- - -
-
-
-
- -
-
-
{{ card.value }}
-
{{ card.label }}
-
+ +
+
+

+ + 类目分布 +

+ + 共 {{ categoryBars.length }} 个类目 + +
+
暂无数据
+
+
+ {{ bar.name }} +
+
+ {{ bar.count }} + {{ bar.ratio }}%
+
-
-
-

- - 类目分布 -

- - 共 {{ categoryBars.length }} 个类目 - -
-
暂无数据
-
-
- {{ bar.name }} -
-
-
- {{ bar.count }} - {{ bar.ratio }}% -
-
-
- + + + + + + + + + + +
@@ -293,14 +370,67 @@ onMounted(() => { margin-bottom: 16px; } -.overview__search { +/* 概览统计（Statistic 卡片） */ +.overview__stats { + display: grid; + grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); + gap: 16px; + margin-bottom: 28px; +} + +.overview__stat-card { background: #fff; border: 1px solid #f0f0f0; border-radius: 8px; - padding: 16px; + box-shadow: 0 1px 2px rgba(0, 21, 41, 0.04); +} + +.overview__stat-card:hover { + box-shadow: 0 4px 12px rgba(0, 21, 41, 0.08); + transform: translateY(-2px); +} + +/* 检索区（居中放大） */ +.overview__search-well { + background: linear-gradient(135deg, #f0f7ff 0%, #eef2ff 100%); + border: 1px solid #e0e7ff; + border-radius: 12px; + padding: 36px 24px; + text-align: center; margin-bottom: 24px; } +.overview__search-bar { + display: flex; + align-items: center; + justify-content: center; + gap: 12px; + max-width: 760px; + margin: 0 auto; +} + +.overview__search-form { + flex: 1; + min-width: 0; +} + +.overview__search-form-item { + margin-bottom: 0; +} + +.overview__search-input { + font-size: 16px; +} + +.overview__search-params { + display: flex; + align-items: center; + justify-content: center; + gap: 12px; + margin-top: 12px; + font-size: 13px; +} + .overview__result { margin-top: 16px; } @@ -359,63 +489,6 @@ onMounted(() => { color: #1f2937; } -.overview__cards { - display: grid; - grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); - gap: 16px; - margin-bottom: 24px; -} - -.overview__card { - background: #fff; - border: 1px solid #f0f0f0; - border-radius: 8px; - padding: 16px 18px; - transition: all 0.2s; - box-shadow: 0 1px 2px rgba(0, 21, 41, 0.04); -} - -.overview__card:hover { - box-shadow: 0 4px 12px rgba(0, 21, 41, 0.08); - transform: translateY(-2px); -} - -.overview__card-body { - display: flex; - align-items: center; - gap: 14px; -} - -.overview__card-icon { - display: inline-flex; - align-items: center; - justify-content: center; - width: 44px; - height: 44px; - border-radius: 8px; - font-size: 22px; - flex: 0 0 auto; -} - -.overview__card-info { - display: flex; - flex-direction: column; - gap: 2px; - min-width: 0; -} - -.overview__card-num { - font-size: 26px; - font-weight: 700; - color: #1f2937; - line-height: 1.1; -} - -.overview__card-label { - font-size: 12px; - color: #6b7280; -} - .overview__section { margin-top: 8px; } @@ -504,5 +577,8 @@ onMounted(() => { .overview__bar-name { width: 120px; } + .overview__search-bar { + flex-direction: column; + } } \ No newline at end of file