refactor(ui): 将检索配置功能从QuerySection移至DataBaseInfoView
重构检索配置弹窗和相关按钮的位置,从QuerySection组件移动到DataBaseInfoView组件
This commit is contained in:
parent
f8ee1df96c
commit
ee82aa385c
@ -13,21 +13,10 @@
|
||||
@press-enter.prevent="onQuery"
|
||||
/>
|
||||
<div class="search-actions">
|
||||
<div class="query-examples-compact">
|
||||
<!-- 检索配置按钮 -->
|
||||
<a-tooltip title="检索配置" placement="bottom">
|
||||
<a-button
|
||||
type="text"
|
||||
size="small"
|
||||
class="config-label-btn"
|
||||
@click="openSearchConfigModal"
|
||||
>
|
||||
<SettingOutlined />
|
||||
</a-button>
|
||||
</a-tooltip>
|
||||
<div class="examples-label-group">
|
||||
<a-tooltip title="点击手动生成测试问题" placement="bottom">
|
||||
<a-button
|
||||
<div class="query-examples-compact">
|
||||
<div class="examples-label-group">
|
||||
<a-tooltip title="点击手动生成测试问题" placement="bottom">
|
||||
<a-button
|
||||
type="text"
|
||||
size="small"
|
||||
class="examples-label-btn"
|
||||
@ -150,13 +139,6 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 检索配置弹窗 -->
|
||||
<SearchConfigModal
|
||||
v-model="searchConfigModalVisible"
|
||||
:database-id="store.database?.db_id"
|
||||
@save="handleSearchConfigSave"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
@ -167,9 +149,7 @@ import { queryApi } from '@/apis/knowledge_api';
|
||||
import {
|
||||
SearchOutlined,
|
||||
ReloadOutlined,
|
||||
SettingOutlined,
|
||||
} from '@ant-design/icons-vue';
|
||||
import SearchConfigModal from './SearchConfigModal.vue';
|
||||
|
||||
const store = useDatabaseStore();
|
||||
|
||||
@ -636,24 +616,6 @@ defineExpose({
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.config-label-btn {
|
||||
color: var(--gray-500);
|
||||
font-size: 12px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 4px;
|
||||
margin-left: -4px;
|
||||
|
||||
&:hover {
|
||||
color: var(--main-color);
|
||||
background-color: var(--gray-100);
|
||||
}
|
||||
|
||||
.anticon {
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
.examples-label-btn {
|
||||
color: var(--gray-500);
|
||||
font-size: 12px;
|
||||
|
||||
@ -2,6 +2,13 @@
|
||||
<div class="database-info-container">
|
||||
<FileDetailModal />
|
||||
|
||||
<!-- 检索配置弹窗 -->
|
||||
<SearchConfigModal
|
||||
v-model="searchConfigModalVisible"
|
||||
:database-id="databaseId"
|
||||
@save="handleSearchConfigSave"
|
||||
/>
|
||||
|
||||
<FileUploadModal
|
||||
v-model:visible="addFilesModalVisible"
|
||||
:folder-tree="folderTree"
|
||||
@ -23,6 +30,17 @@
|
||||
|
||||
<div class="right-panel" :style="{ width: (100 - leftPanelWidth) + '%', display: store.state.rightPanelVisible ? 'flex' : 'none' }">
|
||||
<a-tabs v-model:activeKey="activeTab" class="knowledge-tabs" :tabBarStyle="{ margin: 0, padding: '0 16px' }">
|
||||
<template #tabBarExtraContent>
|
||||
<a-tooltip title="检索配置" placement="bottom">
|
||||
<a-button
|
||||
type="text"
|
||||
class="config-btn"
|
||||
@click="openSearchConfigModal"
|
||||
>
|
||||
<SettingOutlined />
|
||||
</a-button>
|
||||
</a-tooltip>
|
||||
</template>
|
||||
<a-tab-pane key="graph" tab="知识图谱" v-if="isGraphSupported">
|
||||
<KnowledgeGraphSection
|
||||
:visible="true"
|
||||
@ -96,6 +114,7 @@ import { useRoute } from 'vue-router';
|
||||
import { useDatabaseStore } from '@/stores/database';
|
||||
import { useTaskerStore } from '@/stores/tasker';
|
||||
import { Info } from 'lucide-vue-next';
|
||||
import { SettingOutlined } from '@ant-design/icons-vue';
|
||||
import KnowledgeBaseCard from '@/components/KnowledgeBaseCard.vue';
|
||||
import FileTable from '@/components/FileTable.vue';
|
||||
import FileDetailModal from '@/components/FileDetailModal.vue';
|
||||
@ -105,6 +124,7 @@ import QuerySection from '@/components/QuerySection.vue';
|
||||
import MindMapSection from '@/components/MindMapSection.vue';
|
||||
import RAGEvaluationTab from '@/components/RAGEvaluationTab.vue';
|
||||
import EvaluationBenchmarks from '@/components/EvaluationBenchmarks.vue';
|
||||
import SearchConfigModal from '@/components/SearchConfigModal.vue';
|
||||
|
||||
const route = useRoute();
|
||||
const store = useDatabaseStore();
|
||||
@ -189,6 +209,18 @@ const leftPanelWidth = ref(50);
|
||||
const isDragging = ref(false);
|
||||
const resizeHandle = ref(null);
|
||||
|
||||
// 检索配置弹窗
|
||||
const searchConfigModalVisible = ref(false);
|
||||
|
||||
const handleSearchConfigSave = () => {
|
||||
store.getDatabaseInfo();
|
||||
};
|
||||
|
||||
// 打开检索配置弹窗
|
||||
const openSearchConfigModal = () => {
|
||||
searchConfigModalVisible.value = true;
|
||||
};
|
||||
|
||||
// 添加文件弹窗
|
||||
const addFilesModalVisible = ref(false);
|
||||
const currentFolderId = ref(null);
|
||||
@ -495,6 +527,29 @@ const handleMouseUp = () => {
|
||||
// background-color: var(--gray-0);
|
||||
border-bottom: 1px solid var(--gray-200);
|
||||
}
|
||||
|
||||
:deep(.ant-tabs-extra-content) {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.config-btn {
|
||||
color: var(--gray-500);
|
||||
font-size: 16px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
border-radius: 6px;
|
||||
transition: all 0.2s;
|
||||
|
||||
&:hover {
|
||||
color: var(--main-color);
|
||||
background-color: var(--gray-100);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user