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