style: 数据库选择弹窗显示真实库名

This commit is contained in:
2026-06-25 02:53:31 +08:00
parent d13181563f
commit ef04acba6b
2 changed files with 24 additions and 10 deletions
+1 -1
View File
@@ -728,5 +728,5 @@
## 2026-06-25:数据管理数据库选择改为弹窗列表 ## 2026-06-25:数据管理数据库选择改为弹窗列表
- 数据管理页不再用下拉框切换数据库,改为表标题旁的图标按钮打开「选择数据库」弹窗;弹窗内为固定高度列表,超出高度滚动。 - 数据管理页不再用下拉框切换数据库,改为表标题旁的图标按钮打开「选择数据库」弹窗;弹窗内为固定高度列表,超出高度滚动。
- 左侧标题只显示分类名(主数据库 / CellData),不显示具体库名,也不再显示“表”字;选择项后续新增更多数据库时继续扩展同一列表,不占用侧栏宽度。 - 左侧标题只显示分类名(主数据库 / CellData),不显示具体库名,也不再显示“表”字;弹窗列表显示真实库名(如 `主数据库:CapacityReport`)。选择项后续新增更多数据库时继续扩展同一列表,不占用侧栏宽度。
- 验证:`frontend` `npm run build` 通过(仅既有大 chunk 提示);构建产物已清理。 - 验证:`frontend` `npm run build` 通过(仅既有大 chunk 提示);构建产物已清理。
+23 -9
View File
@@ -267,7 +267,7 @@ import {
} from '@vicons/ionicons5'; } from '@vicons/ionicons5';
import { apiGet, apiPost, download } from '../api/client'; import { apiGet, apiPost, download } from '../api/client';
import type { ApiMessage, DatabaseInfo, TableData, TableInfo } from '../types'; import type { ApiMessage, AppConfig, DatabaseInfo, TableData, TableInfo } from '../types';
import { showDownloadCompleteDialog } from '../composables/downloadFeedback'; import { showDownloadCompleteDialog } from '../composables/downloadFeedback';
import { resetPageHeader, setPageHeader } from '../composables/pageHeader'; import { resetPageHeader, setPageHeader } from '../composables/pageHeader';
@@ -277,6 +277,8 @@ type DatabaseSource = 'main' | 'cell_data';
interface DatabaseSourceOption { interface DatabaseSourceOption {
label: string; label: string;
value: DatabaseSource; value: DatabaseSource;
title: string;
databaseName: string;
} }
const COLUMN_MIN_WIDTH = 140; const COLUMN_MIN_WIDTH = 140;
@@ -286,8 +288,8 @@ const databaseInfo = ref<DatabaseInfo | null>(null);
const selectedDatabaseSource = ref<DatabaseSource>('main'); const selectedDatabaseSource = ref<DatabaseSource>('main');
const databaseSourceModalVisible = ref(false); const databaseSourceModalVisible = ref(false);
const databaseSourceOptions = ref<DatabaseSourceOption[]>([ const databaseSourceOptions = ref<DatabaseSourceOption[]>([
{ label: '主数据库', value: 'main' }, { label: '主数据库', value: 'main', title: '主数据库', databaseName: '' },
{ label: 'CellData', value: 'cell_data' } { label: 'CellData', value: 'cell_data', title: 'CellData', databaseName: '' }
]); ]);
const tables = ref<string[]>([]); const tables = ref<string[]>([]);
const selectedTable = ref<string | null>(null); const selectedTable = ref<string | null>(null);
@@ -309,7 +311,7 @@ let tableLoadToken = 0;
const totalPages = computed(() => Math.max(1, Math.ceil(total.value / pageSize.value))); const totalPages = computed(() => Math.max(1, Math.ceil(total.value / pageSize.value)));
const selectedDatabaseSourceLabel = computed(() => ( const selectedDatabaseSourceLabel = computed(() => (
databaseSourceOptions.value.find(option => option.value === selectedDatabaseSource.value)?.label || '主数据库' databaseSourceOptions.value.find(option => option.value === selectedDatabaseSource.value)?.title || '主数据库'
)); ));
const downloading = computed(() => Boolean(downloadingFormat.value)); const downloading = computed(() => Boolean(downloadingFormat.value));
const exportButtonText = computed(() => ( const exportButtonText = computed(() => (
@@ -405,11 +407,23 @@ async function testConnection() {
} }
} }
function loadDatabaseSourceOptions() { async function loadDatabaseSourceOptions() {
databaseSourceOptions.value = [ try {
{ label: '主数据库', value: 'main' }, const config = await apiGet<AppConfig>('/api/config');
{ label: 'CellData', value: 'cell_data' } const mainName = config.warehouse_type === 'metrix'
]; ? (config.metrix.target_database || 'Metrix')
: (config.mysql.dbname || '主数据库');
const cellName = config.cell_data?.mysql?.dbname || 'CellData';
databaseSourceOptions.value = [
{ label: `主数据库:${mainName}`, value: 'main', title: '主数据库', databaseName: mainName },
{ label: `CellData:${cellName}`, value: 'cell_data', title: 'CellData', databaseName: cellName }
];
} catch {
databaseSourceOptions.value = [
{ label: '主数据库', value: 'main', title: '主数据库', databaseName: '' },
{ label: 'CellData', value: 'cell_data', title: 'CellData', databaseName: '' }
];
}
} }
async function loadTables() { async function loadTables() {