重构知识库相关接口,更新数据结构和命名,移除示例文件,调整组件和视图以支持新命名,优化文档和数据集管理功能。
This commit is contained in:
@@ -4,36 +4,34 @@
|
||||
<div class="page-header">
|
||||
<el-breadcrumb separator=">">
|
||||
<el-breadcrumb-item>
|
||||
<span class="back-link" @click="onBackToKnowledge">知识库</span>
|
||||
<span class="back-link" @click="onBackToknowledge">知识库</span>
|
||||
</el-breadcrumb-item>
|
||||
<el-breadcrumb-item>
|
||||
<span class="back-link" @click="onBackToDataset">{{ datasetName }}</span>
|
||||
<span class="back-link" @click="onBackToknowledge">{{ knowledgeName }}</span>
|
||||
</el-breadcrumb-item>
|
||||
<el-breadcrumb-item>{{ documentInfo.name }}</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="page-content">
|
||||
<!-- 左侧:文档原文 -->
|
||||
<div class="document-content">
|
||||
<div class="content-header">
|
||||
<h2>{{ documentInfo.name }}</h2>
|
||||
<div class="content-meta">
|
||||
Size:{{ formatFileSize(documentInfo.fileSize) }} Uploaded Time:{{ documentInfo.createdAt }}
|
||||
</div>
|
||||
<div class="content-meta">Size:{{ formatFileSize(documentInfo.fileSize) }} Uploaded Time:{{ documentInfo.createdAt }}</div>
|
||||
</div>
|
||||
<div class="content-body" v-loading="contentLoading">
|
||||
<pre class="document-text">{{ documentContent }}</pre>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- 右侧:切片结果 -->
|
||||
<div class="chunk-panel">
|
||||
<div class="panel-header">
|
||||
<h3>切片结果</h3>
|
||||
<div class="panel-subtitle">查看用于嵌入和召回的切片段落。</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="panel-toolbar">
|
||||
<div class="toolbar-tabs">
|
||||
<el-radio-group v-model="viewMode" size="small">
|
||||
@@ -42,13 +40,7 @@
|
||||
</el-radio-group>
|
||||
</div>
|
||||
<div class="toolbar-actions">
|
||||
<el-input
|
||||
v-model="chunkSearch"
|
||||
placeholder="搜索"
|
||||
clearable
|
||||
size="small"
|
||||
style="width: 120px"
|
||||
>
|
||||
<el-input v-model="chunkSearch" placeholder="搜索" clearable size="small" style="width: 120px">
|
||||
<template #prefix>
|
||||
<el-icon><ele-Search /></el-icon>
|
||||
</template>
|
||||
@@ -58,17 +50,13 @@
|
||||
</el-button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="chunk-list" v-loading="chunkLoading">
|
||||
<div class="select-all">
|
||||
<el-checkbox v-model="selectAll" @change="onSelectAllChange">选择所有</el-checkbox>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="chunk-item"
|
||||
v-for="chunk in filteredChunks"
|
||||
:key="chunk.id"
|
||||
>
|
||||
|
||||
<div class="chunk-item" v-for="chunk in filteredChunks" :key="chunk.id">
|
||||
<div class="chunk-checkbox">
|
||||
<el-checkbox v-model="chunk.selected" />
|
||||
</div>
|
||||
@@ -79,10 +67,10 @@
|
||||
<el-switch v-model="chunk.enabled" size="small" @change="onChunkStatusChange(chunk)" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<el-empty v-if="filteredChunks.length === 0 && !chunkLoading" description="暂无切片" :image-size="60" />
|
||||
</div>
|
||||
|
||||
|
||||
<!-- 分页 -->
|
||||
<div class="panel-footer">
|
||||
<span class="total-info">总共 {{ chunkTotal }} 条</span>
|
||||
@@ -121,8 +109,8 @@ const route = useRoute();
|
||||
const router = useRouter();
|
||||
|
||||
// 路由参数
|
||||
const datasetId = ref('');
|
||||
const datasetName = ref('');
|
||||
const knowledgeId = ref('');
|
||||
const knowledgeName = ref('');
|
||||
const documentId = ref('');
|
||||
|
||||
// 文档信息
|
||||
@@ -151,9 +139,7 @@ const selectAll = ref(false);
|
||||
// 过滤后的切片列表
|
||||
const filteredChunks = computed(() => {
|
||||
if (!chunkSearch.value) return chunkList.value;
|
||||
return chunkList.value.filter((chunk) =>
|
||||
(chunk.content || '').toLowerCase().includes(chunkSearch.value.toLowerCase())
|
||||
);
|
||||
return chunkList.value.filter((chunk) => (chunk.content || '').toLowerCase().includes(chunkSearch.value.toLowerCase()));
|
||||
});
|
||||
|
||||
// 格式化文件大小
|
||||
@@ -171,15 +157,15 @@ const truncateText = (text: string, maxLength: number) => {
|
||||
};
|
||||
|
||||
// 返回知识库列表
|
||||
const onBackToKnowledge = () => {
|
||||
router.push('/knowledge/dataset');
|
||||
const onBackToknowledge = () => {
|
||||
router.push('/knowledge/knowledge');
|
||||
};
|
||||
|
||||
// 返回数据集详情
|
||||
const onBackToDataset = () => {
|
||||
const onBackToknowledge = () => {
|
||||
router.push({
|
||||
path: '/knowledge/document',
|
||||
query: { datasetId: datasetId.value, datasetName: datasetName.value },
|
||||
query: { knowledgeId: knowledgeId.value, knowledgeName: knowledgeName.value },
|
||||
});
|
||||
};
|
||||
|
||||
@@ -195,8 +181,7 @@ const getDocumentDetail = async () => {
|
||||
documentInfo.fileSize = detail.fileSize || 0;
|
||||
documentInfo.createdAt = detail.createdAt || '';
|
||||
const contentData = contentRes.data;
|
||||
documentContent.value =
|
||||
typeof contentData === 'string' ? contentData : contentData?.content || contentData?.text || '';
|
||||
documentContent.value = typeof contentData === 'string' ? contentData : contentData?.content || contentData?.text || '';
|
||||
} catch (_error) {
|
||||
ElMessage.error('获取文档详情失败');
|
||||
documentContent.value = '';
|
||||
@@ -248,12 +233,12 @@ const onAddChunk = () => {
|
||||
|
||||
// 初始化
|
||||
onMounted(() => {
|
||||
datasetId.value = (route.query.datasetId as string) || '';
|
||||
datasetName.value = (route.query.datasetName as string) || '';
|
||||
knowledgeId.value = (route.query.knowledgeId as string) || '';
|
||||
knowledgeName.value = (route.query.knowledgeName as string) || '';
|
||||
documentId.value = (route.query.docId as string) || '';
|
||||
if (!documentId.value) {
|
||||
ElMessage.warning('缺少文档ID,无法查看详情');
|
||||
onBackToDataset();
|
||||
onBackToknowledge();
|
||||
return;
|
||||
}
|
||||
getDocumentDetail();
|
||||
@@ -267,29 +252,29 @@ onMounted(() => {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background: #f5f7fa;
|
||||
|
||||
|
||||
.page-header {
|
||||
padding: 12px 20px;
|
||||
background: #fff;
|
||||
border-bottom: 1px solid #ebeef5;
|
||||
|
||||
|
||||
.back-link {
|
||||
color: #409eff;
|
||||
cursor: pointer;
|
||||
|
||||
|
||||
&:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.page-content {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
overflow: hidden;
|
||||
padding: 15px;
|
||||
gap: 15px;
|
||||
|
||||
|
||||
// 左侧文档内容
|
||||
.document-content {
|
||||
flex: 1;
|
||||
@@ -299,30 +284,30 @@ onMounted(() => {
|
||||
border-radius: 4px;
|
||||
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
|
||||
overflow: hidden;
|
||||
|
||||
|
||||
.content-header {
|
||||
padding: 16px 20px;
|
||||
border-bottom: 1px solid #ebeef5;
|
||||
|
||||
|
||||
h2 {
|
||||
margin: 0 0 8px 0;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
color: #303133;
|
||||
}
|
||||
|
||||
|
||||
.content-meta {
|
||||
font-size: 12px;
|
||||
color: #909399;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.content-body {
|
||||
flex: 1;
|
||||
padding: 16px 20px;
|
||||
overflow: auto;
|
||||
background: #fafafa;
|
||||
|
||||
|
||||
.document-text {
|
||||
margin: 0;
|
||||
font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;
|
||||
@@ -334,7 +319,7 @@ onMounted(() => {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// 右侧切片面板
|
||||
.chunk-panel {
|
||||
width: 420px;
|
||||
@@ -343,46 +328,46 @@ onMounted(() => {
|
||||
background: #fff;
|
||||
border-radius: 4px;
|
||||
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
|
||||
|
||||
|
||||
.panel-header {
|
||||
padding: 16px 20px;
|
||||
border-bottom: 1px solid #ebeef5;
|
||||
|
||||
|
||||
h3 {
|
||||
margin: 0 0 4px 0;
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
color: #303133;
|
||||
}
|
||||
|
||||
|
||||
.panel-subtitle {
|
||||
font-size: 12px;
|
||||
color: #909399;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.panel-toolbar {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 12px 20px;
|
||||
border-bottom: 1px solid #ebeef5;
|
||||
|
||||
|
||||
.toolbar-actions {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.chunk-list {
|
||||
flex: 1;
|
||||
overflow: auto;
|
||||
padding: 12px 20px;
|
||||
|
||||
|
||||
.select-all {
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
|
||||
.chunk-item {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
@@ -391,16 +376,16 @@ onMounted(() => {
|
||||
border-radius: 6px;
|
||||
margin-bottom: 8px;
|
||||
border: 1px solid #ebeef5;
|
||||
|
||||
|
||||
.chunk-checkbox {
|
||||
margin-right: 12px;
|
||||
padding-top: 2px;
|
||||
}
|
||||
|
||||
|
||||
.chunk-content {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
|
||||
|
||||
.chunk-text {
|
||||
font-size: 14px;
|
||||
color: #303133;
|
||||
@@ -408,14 +393,14 @@ onMounted(() => {
|
||||
word-break: break-all;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.chunk-actions {
|
||||
margin-left: 12px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.panel-footer {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@@ -423,7 +408,7 @@ onMounted(() => {
|
||||
gap: 12px;
|
||||
padding: 12px 20px;
|
||||
border-top: 1px solid #ebeef5;
|
||||
|
||||
|
||||
.total-info {
|
||||
font-size: 12px;
|
||||
color: #909399;
|
||||
|
||||
Reference in New Issue
Block a user