feat: integrate luckysheet inline and fullscreen

2025-11-23 17:22:35 +08:00
parent c8e479aeab
commit 994dd4e67c
529 changed files with 403413 additions and 201 deletions
@@ -0,0 +1,91 @@
+import { DocumentTable, DocumentTableSnapshot, TableSchema } from "@/types/online-table";
+
+// 默认表格结构：三列，文本类型，冻结首行
+export const DEFAULT_TABLE_SCHEMA: TableSchema = {
+  columns: [
+    { id: "col1", name: "名称", type: "text", width: 200 },
+    { id: "col2", name: "状态", type: "select", width: 150, options: [{ value: "Todo", color: "red" }, { value: "Done", color: "green" }] },
+    { id: "col3", name: "创建日期", type: "date", width: 150 },
+  ],
+  frozenRowCount: 1,
+  frozenColCount: 0,
+};
+
+export const DEFAULT_TABLE_ROWS = 50;
+export const DEFAULT_TABLE_COLUMNS = 15;
+
+export const createDefaultTableSnapshot = (schema: TableSchema): DocumentTableSnapshot => ({
+  rows: [],
+  luckysheet: [
+    {
+      name: "Sheet1",
+      index: 0,
+      status: 1,
+      order: 0,
+      hide: 0,
+      row: DEFAULT_TABLE_ROWS,
+      column: DEFAULT_TABLE_COLUMNS,
+      defaultRowHeight: 19,
+      defaultColWidth: 73,
+      celldata: [],
+      config: {},
+      frozen: {
+        row: String(schema.frozenRowCount ?? 0),
+        column: String(schema.frozenColCount ?? 0),
+      },
+      scrollLeft: 0,
+      scrollTop: 0,
+      zoomRatio: 1,
+      showGridLines: true,
+    },
+  ],
+});
+
+/**
+ * 在 Supabase 中创建一个新的在线表格并返回元数据。
+ * @param documentId 当前文档的 ID
+ * @param title 表格的初始标题
+ * @returns 新创建的 DocumentTable
+ */
+export async function createOnlineTable(
+  documentId: string,
+  title: string = "未命名表格"
+): Promise<DocumentTable> {
+  // 假设 Next.js API 路由 /api/tables/create 负责与 Supabase 交互
+  const response = await fetch("/api/tables/create", {
+    method: "POST",
+    headers: {
+      "Content-Type": "application/json",
+    },
+    body: JSON.stringify({
+      documentId,
+      title,
+      schema: DEFAULT_TABLE_SCHEMA,
+      snapshot: createDefaultTableSnapshot(DEFAULT_TABLE_SCHEMA),
+    }),
+  });
+
+  if (!response.ok) {
+    throw new Error("Failed to create online table.");
+  }
+
+  const newTable: DocumentTable = await response.json();
+  return newTable;
+}
+
+/**
+ * 获取表格元数据 (用于紧凑模式渲染)
+ * 实际实现中，这可能需要一个更复杂的获取逻辑，例如同时获取前 N 行数据
+ */
+export async function getDocumentTable(tableId: string): Promise<DocumentTable> {
+  const response = await fetch(`/api/tables/${tableId}`, {
+    method: "GET",
+    headers: { "Content-Type": "application/json" },
+  });
+
+  if (!response.ok) {
+    throw new Error("Failed to fetch document table.");
+  }
+
+  return response.json() as Promise<DocumentTable>;
+}