Skip to content

Commit ee82aa3

Browse files
committed
refactor(ui): 将检索配置功能从QuerySection移至DataBaseInfoView
重构检索配置弹窗和相关按钮的位置,从QuerySection组件移动到DataBaseInfoView组件
1 parent f8ee1df commit ee82aa3

File tree

2 files changed

+59
-42
lines changed

2 files changed

+59
-42
lines changed

web/src/components/QuerySection.vue

Lines changed: 4 additions & 42 deletions
Original file line numberDiff line numberDiff line change
@@ -13,21 +13,10 @@
1313
@press-enter.prevent="onQuery"
1414
/>
1515
<div class="search-actions">
16-
<div class="query-examples-compact">
17-
<!-- 检索配置按钮 -->
18-
<a-tooltip title="检索配置" placement="bottom">
19-
<a-button
20-
type="text"
21-
size="small"
22-
class="config-label-btn"
23-
@click="openSearchConfigModal"
24-
>
25-
<SettingOutlined />
26-
</a-button>
27-
</a-tooltip>
28-
<div class="examples-label-group">
29-
<a-tooltip title="点击手动生成测试问题" placement="bottom">
30-
<a-button
16+
<div class="query-examples-compact">
17+
<div class="examples-label-group">
18+
<a-tooltip title="点击手动生成测试问题" placement="bottom">
19+
<a-button
3120
type="text"
3221
size="small"
3322
class="examples-label-btn"
@@ -150,13 +139,6 @@
150139
</div>
151140
</div>
152141
</div>
153-
154-
<!-- 检索配置弹窗 -->
155-
<SearchConfigModal
156-
v-model="searchConfigModalVisible"
157-
:database-id="store.database?.db_id"
158-
@save="handleSearchConfigSave"
159-
/>
160142
</template>
161143

162144
<script setup>
@@ -167,9 +149,7 @@ import { queryApi } from '@/apis/knowledge_api';
167149
import {
168150
SearchOutlined,
169151
ReloadOutlined,
170-
SettingOutlined,
171152
} from '@ant-design/icons-vue';
172-
import SearchConfigModal from './SearchConfigModal.vue';
173153
174154
const store = useDatabaseStore();
175155
@@ -636,24 +616,6 @@ defineExpose({
636616
flex-wrap: wrap;
637617
}
638618
639-
.config-label-btn {
640-
color: var(--gray-500);
641-
font-size: 12px;
642-
display: flex;
643-
align-items: center;
644-
padding: 0 4px;
645-
margin-left: -4px;
646-
647-
&:hover {
648-
color: var(--main-color);
649-
background-color: var(--gray-100);
650-
}
651-
652-
.anticon {
653-
font-size: 14px;
654-
}
655-
}
656-
657619
.examples-label-btn {
658620
color: var(--gray-500);
659621
font-size: 12px;

web/src/views/DataBaseInfoView.vue

Lines changed: 55 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,13 @@
22
<div class="database-info-container">
33
<FileDetailModal />
44

5+
<!-- 检索配置弹窗 -->
6+
<SearchConfigModal
7+
v-model="searchConfigModalVisible"
8+
:database-id="databaseId"
9+
@save="handleSearchConfigSave"
10+
/>
11+
512
<FileUploadModal
613
v-model:visible="addFilesModalVisible"
714
:folder-tree="folderTree"
@@ -23,6 +30,17 @@
2330

2431
<div class="right-panel" :style="{ width: (100 - leftPanelWidth) + '%', display: store.state.rightPanelVisible ? 'flex' : 'none' }">
2532
<a-tabs v-model:activeKey="activeTab" class="knowledge-tabs" :tabBarStyle="{ margin: 0, padding: '0 16px' }">
33+
<template #tabBarExtraContent>
34+
<a-tooltip title="检索配置" placement="bottom">
35+
<a-button
36+
type="text"
37+
class="config-btn"
38+
@click="openSearchConfigModal"
39+
>
40+
<SettingOutlined />
41+
</a-button>
42+
</a-tooltip>
43+
</template>
2644
<a-tab-pane key="graph" tab="知识图谱" v-if="isGraphSupported">
2745
<KnowledgeGraphSection
2846
:visible="true"
@@ -96,6 +114,7 @@ import { useRoute } from 'vue-router';
96114
import { useDatabaseStore } from '@/stores/database';
97115
import { useTaskerStore } from '@/stores/tasker';
98116
import { Info } from 'lucide-vue-next';
117+
import { SettingOutlined } from '@ant-design/icons-vue';
99118
import KnowledgeBaseCard from '@/components/KnowledgeBaseCard.vue';
100119
import FileTable from '@/components/FileTable.vue';
101120
import FileDetailModal from '@/components/FileDetailModal.vue';
@@ -105,6 +124,7 @@ import QuerySection from '@/components/QuerySection.vue';
105124
import MindMapSection from '@/components/MindMapSection.vue';
106125
import RAGEvaluationTab from '@/components/RAGEvaluationTab.vue';
107126
import EvaluationBenchmarks from '@/components/EvaluationBenchmarks.vue';
127+
import SearchConfigModal from '@/components/SearchConfigModal.vue';
108128
109129
const route = useRoute();
110130
const store = useDatabaseStore();
@@ -189,6 +209,18 @@ const leftPanelWidth = ref(50);
189209
const isDragging = ref(false);
190210
const resizeHandle = ref(null);
191211
212+
// 检索配置弹窗
213+
const searchConfigModalVisible = ref(false);
214+
215+
const handleSearchConfigSave = () => {
216+
store.getDatabaseInfo();
217+
};
218+
219+
// 打开检索配置弹窗
220+
const openSearchConfigModal = () => {
221+
searchConfigModalVisible.value = true;
222+
};
223+
192224
// 添加文件弹窗
193225
const addFilesModalVisible = ref(false);
194226
const currentFolderId = ref(null);
@@ -495,6 +527,29 @@ const handleMouseUp = () => {
495527
// background-color: var(--gray-0);
496528
border-bottom: 1px solid var(--gray-200);
497529
}
530+
531+
:deep(.ant-tabs-extra-content) {
532+
display: flex;
533+
align-items: center;
534+
height: 100%;
535+
}
536+
}
537+
538+
.config-btn {
539+
color: var(--gray-500);
540+
font-size: 16px;
541+
display: flex;
542+
align-items: center;
543+
justify-content: center;
544+
width: 32px;
545+
height: 32px;
546+
border-radius: 6px;
547+
transition: all 0.2s;
548+
549+
&:hover {
550+
color: var(--main-color);
551+
background-color: var(--gray-100);
552+
}
498553
}
499554
500555

0 commit comments

Comments
 (0)