feat: 完善 WebUI basePath 支持并简化示例代码

主要改动:

1. WebUI basePath 逻辑完善
   - NewWebUI 支持可变参数 basePath
   - 新增 path() 辅助方法统一路径处理
   - handleTableAPI 正确处理 basePath 前缀
   - handleIndex 根据 basePath 替换占位符

2. 简化示例代码
   - 删除反向代理实现(111行)
   - 直接使用带 basePath 的 WebUI
   - 代码量减少 33%,架构更清晰

3. 前端优化
   - 新增 api.js 统一 API 服务层
   - 所有组件使用统一的 API 调用
   - 支持通过 window.API_BASE 配置 basePath

4. 修复 .gitignore
   - 使用通用模式支持 commands 目录
   - 无需为新示例项目修改配置
This commit is contained in:
2025-10-14 14:13:59 +08:00
parent 7ac4b99a9e
commit 30c3e74bd2
16 changed files with 222 additions and 68 deletions

View File

@@ -1,9 +1,10 @@
import { html } from 'htm/preact';
import { useState, useEffect } from 'preact/hooks';
import { DataTable } from './DataTable.js';
import { ColumnSelector } from './ColumnSelector.js';
import { ManifestModal } from './ManifestModal.js';
import { useTooltip } from '../hooks/useTooltip.js';
import { DataTable } from '~/components/DataTable.js';
import { ColumnSelector } from '~/components/ColumnSelector.js';
import { ManifestModal } from '~/components/ManifestModal.js';
import { useTooltip } from '~/hooks/useTooltip.js';
import { getTableSchema, getTableData } from '~/utils/api.js';
const styles = {
container: {
@@ -70,18 +71,12 @@ export function TableView({ tableName }) {
setLoading(true);
// 获取 Schema
const schemaResponse = await fetch(`/api/tables/${tableName}/schema`);
if (schemaResponse.ok) {
const schemaData = await schemaResponse.json();
setSchema(schemaData);
}
const schemaData = await getTableSchema(tableName);
setSchema(schemaData);
// 获取数据行数(通过一次小查询)
const dataResponse = await fetch(`/api/tables/${tableName}/data?limit=1`);
if (dataResponse.ok) {
const data = await dataResponse.json();
setTotalRows(data.totalRows || 0);
}
const data = await getTableData(tableName, { limit: 1, offset: 0 });
setTotalRows(data.totalRows || 0);
} catch (error) {
console.error('Failed to fetch table info:', error);
} finally {