新增表格设置弹窗 (#9)

* chore: 发布v1.14.0-dev版本并修复widget url拼接逻辑

1. 更新package.json和多语言文件中的版本号到v1.14.0-dev
2. 重构DebugWidget的url拼接逻辑，新增对/v1/proxy接口的单独处理
3. 为DashboardCanvas添加useMemo缓存过滤结果，同时修复重复widget/layout项的问题

* feat(table): add table settings modal and related features

- 新增表格设置弹窗，支持配置小数位数和可见列
- 为表格组件添加小数位数格式化和列显示控制功能
- 新增多语言国际化词条支持中英文界面
- 添加表格渲染器测试用例覆盖格式化逻辑
- 实现仪表盘内表格设置的状态管理与持久化

* release: bump version to 1.14.0

将项目版本从开发版1.14.0-dev正式更新为1.14.0，同步更新中英文国际化文件中的版本号展示

Author: shugaoye

package.json

@@ -1,7 +1,7 @@
 {
   "name": "finanalyzer-app",
   "private": true,
-  "version": "1.13.16",
+  "version": "1.14.0",
   "description": "Finanalyzer 前端应用 - 投资组合管理平台",
   "type": "module",
   "scripts": {

src/components/dashboard/DashboardCanvas.tsx

@@ -1,5 +1,5 @@
 import { Button, Icon } from "@openbb/ui";
-import { useCallback, useEffect, useRef, useState } from "react";
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import type { Layout, LayoutItem } from "react-grid-layout";
 import { ResponsiveGridLayout } from "react-grid-layout";
 import "react-grid-layout/css/styles.css";
@@ -11,6 +11,7 @@ import {
   getDashboard,
   getDashboards,
   updateDashboard,
+  updateWidget as updateWidgetApi,
   type Dashboard as ApiDashboard,
   type Widget as ApiWidget,
 } from "../../services/dashboardApi";
@@ -24,8 +25,10 @@ import {
   MarkdownWidget,
   MetricWidget,
   TableWidget,
+  TableSettingsModal,
   WidgetMenuModal,
 } from "../widgets";
+import type { TableSettings } from "../widgets/TableSettingsModal";
 import { NavigationBar } from "../widgets/NavigationBar";
 import "./DashboardCanvas.css";
 import { ParameterInput } from "./ParameterInput";
@@ -121,18 +124,38 @@ export function DashboardCanvas({ dashboardId: propId, activeTab: propActiveTab,
   // Determine active tab (use prop if provided, otherwise first tab)
   const activeTab = propActiveTab || (tabs.length > 0 ? tabs[0].id : "");
 
-  // Filter widgets based on active tab
-  const filteredWidgets = tabs.length > 0 
-    ? widgets.filter(widget => widget.data?.tabId === activeTab)
-    : widgets;
-
-  // Filter layout based on active tab
-  const filteredLayout = tabs.length > 0
-    ? layout.filter(item => {
-        const widget = widgets.find(w => w.id === item.i);
-        return widget?.data?.tabId === activeTab;
-      })
-    : layout;
+  // Filter widgets based on active tab (with deduplication by widget.id)
+  const filteredWidgets = useMemo(() => {
+    const base = tabs.length > 0 
+      ? widgets.filter(widget => widget.data?.tabId === activeTab)
+      : widgets;
+    
+    // Deduplicate by widget.id, keeping the first occurrence
+    const seen = new Set<string>();
+    return base.filter(widget => {
+      if (!widget.id || seen.has(widget.id)) return false;
+      seen.add(widget.id);
+      return true;
+    });
+  }, [widgets, tabs, activeTab]);
+
+  // Filter layout based on active tab (with deduplication by item.i)
+  const filteredLayout = useMemo(() => {
+    const baseLayout = tabs.length > 0
+      ? layout.filter(item => {
+          const widget = widgets.find(w => w.id === item.i);
+          return widget?.data?.tabId === activeTab;
+        })
+      : layout;
+    
+    // Deduplicate by item.i, keeping the first occurrence
+    const seen = new Set<string>();
+    return baseLayout.filter(item => {
+      if (!item.i || seen.has(item.i)) return false;
+      seen.add(item.i);
+      return true;
+    });
+  }, [layout, widgets, tabs, activeTab]);
   const [loading, setLoading] = useState(true);
   const [error, setError] = useState<string | null>(null);
   const [gridWidth, setGridWidth] = useState(1200);
@@ -161,6 +184,8 @@ export function DashboardCanvas({ dashboardId: propId, activeTab: propActiveTab,
   const fileInputRef = useRef<HTMLInputElement>(null);
   const [customWidgets, setCustomWidgets] = useState<WidgetConfig[]>([]);
   const [groupConfigs, setGroupConfigs] = useState<Group[]>([]);
+  const [tableSettings, setTableSettings] = useState<Record<string, TableSettings>>({});
+  const [openTableSettingsWidgetId, setOpenTableSettingsWidgetId] = useState<string | null>(null);
 
   useEffect(() => {
     if (propId && propId !== activeId) {
@@ -198,6 +223,18 @@ export function DashboardCanvas({ dashboardId: propId, activeTab: propActiveTab,
               h: widget.position.h,
             }));
             setLayout(rawLayout);
+            // 初始化tableSettings
+            const initialTableSettings: Record<string, TableSettings> = {};
+            w.forEach(widget => {
+              const savedConfig = (widget.data as Record<string, unknown>)?.tableConfig as Record<string, unknown> | undefined;
+              if (savedConfig) {
+                initialTableSettings[widget.id] = {
+                  decimalPlaces: savedConfig.decimalPlaces as number || 2,
+                  visibleColumns: (savedConfig.visibleColumns as string[]) || [],
+                };
+              }
+            });
+            setTableSettings(initialTableSettings);
           } else {
             setError("Dashboard not found");
           }
@@ -217,6 +254,18 @@ export function DashboardCanvas({ dashboardId: propId, activeTab: propActiveTab,
               h: widget.position.h,
             }));
             setLayout(rawLayout);
+            // 初始化tableSettings
+            const initialTableSettings: Record<string, TableSettings> = {};
+            w.forEach(widget => {
+              const savedConfig = (widget.data as Record<string, unknown>)?.tableConfig as Record<string, unknown> | undefined;
+              if (savedConfig) {
+                initialTableSettings[widget.id] = {
+                  decimalPlaces: savedConfig.decimalPlaces as number || 2,
+                  visibleColumns: (savedConfig.visibleColumns as string[]) || [],
+                };
+              }
+            });
+            setTableSettings(initialTableSettings);
           }
         }
       } catch (e) {
@@ -495,7 +544,7 @@ export function DashboardCanvas({ dashboardId: propId, activeTab: propActiveTab,
 
   const handleLayoutChange = useCallback(
     (newLayout: Layout, _layouts: any) => {
-      const layoutItems = newLayout as LayoutItem[];
+      const layoutItems = (newLayout as LayoutItem[]).filter((item) => item.i);
       setLayout((prevLayout) => {
         const newLayoutMap = new Map(layoutItems.map((item) => [item.i, item]));
         return prevLayout.map((item) => newLayoutMap.get(item.i) || item);
@@ -830,7 +879,12 @@ export function DashboardCanvas({ dashboardId: propId, activeTab: propActiveTab,
                             <div className="py-1">
                               <button
                                 className="widget-dropdown-item block px-4 py-2 text-sm w-full text-left"
-                                onClick={() => setOpenMenuWidgetId(null)}
+                                onClick={() => {
+                                  setOpenMenuWidgetId(null);
+                                  if (widget.type === "table") {
+                                    setOpenTableSettingsWidgetId(widget.id);
+                                  }
+                                }}
                               >
                                 Settings
                               </button>
@@ -936,6 +990,7 @@ export function DashboardCanvas({ dashboardId: propId, activeTab: propActiveTab,
                                 error: widgetErrors[widget.id],
                               } as any
                             }
+                            settings={tableSettings[widget.id]}
                             mode={widgetDebugModes[widget.id] ? "debug" : undefined}
                             onUpdate={(params: Record<string, unknown>) => {
                               Object.entries(params).forEach(([paramName, value]) => {
@@ -1211,6 +1266,79 @@ export function DashboardCanvas({ dashboardId: propId, activeTab: propActiveTab,
         widgets={[...widgetDefinitions, ...customWidgets]}
         loading={!widgetDefinitions.length && !customWidgets.length}
       />
+      {openTableSettingsWidgetId && (() => {
+        const widget = widgets.find(w => w.id === openTableSettingsWidgetId);
+        const columnDefs = (() => {
+          if (!widget) return [];
+          const widgetAny = widget as unknown as Record<string, unknown>;
+          
+          // Check path 1: widget.tableConfig.columnsDefs
+          const tableConfig = widgetAny.tableConfig as Record<string, unknown> | undefined;
+          if (tableConfig && tableConfig.columnsDefs) {
+            const columnsDefs = tableConfig.columnsDefs as Array<{ field: string; headerName?: string }>;
+            if (columnsDefs && Array.isArray(columnsDefs) && columnsDefs.length > 0) {
+              return columnsDefs;
+            }
+          }
+          
+          // Check path 2: widget.data.data.table.columnsDefs
+          const widgetData = widgetAny.data as Record<string, unknown> | undefined;
+          if (widgetData) {
+            const tableDataObj = widgetData.data as Record<string, unknown> | undefined;
+            if (tableDataObj) {
+              const table = tableDataObj.table as Record<string, unknown> | undefined;
+              if (table && table.columnsDefs) {
+                const columnsDefs = table.columnsDefs as Array<{ field: string; headerName?: string }>;
+                if (columnsDefs && Array.isArray(columnsDefs) && columnsDefs.length > 0) {
+                  return columnsDefs;
+                }
+              }
+            }
+            
+            // Check path 3: widget.data.columnsDefs
+            if (widgetData.columnsDefs) {
+              const columnsDefs = widgetData.columnsDefs as Array<{ field: string; headerName?: string }>;
+              if (columnsDefs && Array.isArray(columnsDefs) && columnsDefs.length > 0) {
+                return columnsDefs;
+              }
+            }
+          }
+          
+          return [];
+        })();
+        // 从widget.data中读取已保存的配置
+        const savedConfig = (widget?.data as Record<string, unknown>)?.tableConfig as Record<string, unknown> | undefined;
+        const availableCols = columnDefs.map(c => c.field);
+        const currentSettings: TableSettings = {
+          decimalPlaces: savedConfig?.decimalPlaces as number || tableSettings[openTableSettingsWidgetId]?.decimalPlaces || 2,
+          visibleColumns: (savedConfig?.visibleColumns as string[]) || tableSettings[openTableSettingsWidgetId]?.visibleColumns || availableCols,
+        };
+        return (
+          <TableSettingsModal
+            isOpen={!!openTableSettingsWidgetId}
+            onClose={() => setOpenTableSettingsWidgetId(null)}
+            onSave={(settings) => {
+              // 更新前端状态
+              setTableSettings((prev) => ({
+                ...prev,
+                [openTableSettingsWidgetId!]: settings,
+              }));
+              // 调用API保存到后端
+              if (activeId && widget) {
+                const updatedData = {
+                  ...widget.data,
+                  tableConfig: settings,
+                };
+                updateWidgetApi(activeId, widget.id, { data: updatedData });
+              }
+              // 刷新widget以应用新设置
+              handleRefreshWidget(openTableSettingsWidgetId!);
+            }}
+            currentSettings={currentSettings}
+            columnDefs={columnDefs}
+          />
+        );
+      })()}
       <input
         ref={fileInputRef}
         type="file"

src/components/widgets/DebugWidget.tsx

@@ -395,6 +395,7 @@ function DebugWidget({
     if (!widgetDef) return "";
 
     const endpoint = widgetDef.endpoint;
+    const API_BASE_URL = import.meta.env.VITE_API_BASE_URL || "";
 
     // Check if endpoint is a full URL (starts with http:// or https://)
     const isFullUrl = endpoint.startsWith('http://') || endpoint.startsWith('https://');
@@ -405,19 +406,27 @@ function DebugWidget({
       // If endpoint is a full URL, use it directly without connectionUrl
       url = endpoint;
     } else {
-      const connectionUrl = widgetDef.connectionUrl || "";
-      
-      // Normalize connectionUrl: remove trailing slash
-      const normalizedBaseUrl = connectionUrl.endsWith('/')
-        ? connectionUrl.slice(0, -1)
-        : connectionUrl;
-      
-      // Ensure endpoint starts with /
-      const normalizedEndpoint = endpoint.startsWith('/')
-        ? endpoint
-        : `/${endpoint}`;
-      
-      url = `${normalizedBaseUrl}${normalizedEndpoint}`;
+      // For proxy endpoint, use API_BASE_URL
+      if (endpoint.startsWith('/v1/proxy')) {
+        const normalizedBaseUrl = API_BASE_URL.endsWith('/')
+          ? API_BASE_URL.slice(0, -1)
+          : API_BASE_URL;
+        url = `${normalizedBaseUrl}${endpoint}`;
+      } else {
+        const connectionUrl = widgetDef.connectionUrl || "";
+        
+        // Normalize connectionUrl: remove trailing slash
+        const normalizedBaseUrl = connectionUrl.endsWith('/')
+          ? connectionUrl.slice(0, -1)
+          : connectionUrl;
+        
+        // Ensure endpoint starts with /
+        const normalizedEndpoint = endpoint.startsWith('/')
+          ? endpoint
+          : `/${endpoint}`;
+        
+        url = `${normalizedBaseUrl}${normalizedEndpoint}`;
+      }
     }
 
     const queryParams = new URLSearchParams();