超轻量级数据管理

1作者: snappr0212 个月前原帖
AI提示:重新生成“Datalite”界面,包含所有功能 创建一个名为Datalite的完全功能的单页面HTML应用程序,仅使用原生JavaScript、标准CSS和HTML——不使用任何框架或库。 界面应支持: - 多文件上传与标签 - 允许上传多个CSV或JSON文件 - 在左侧边栏中按字母顺序显示每个数据集作为一个标签 - 切换标签时显示相应的可编辑表格 - 可编辑表格视图(按数据集) - 渲染一个完整的HTML表格,包含可内联编辑的单元格 - 在顶部包含一个过滤行,使用可编辑的表头 - 始终在底部显示一个固定的空行,动态添加新条目 - 更改内容在内存和localStorage中持久化 - 关系检测(启发式) - 通过匹配以下内容启发式地检测一对多和多对一关系: - {tableName}_id → id - 跨表共享的键值 - 存储关系并使其持久化 - DBML风格的图表视图 - 在无限画布上使用浮动可拖动的HTML块渲染模式图 - 每个块显示表名及其字段 - 允许用户切换图表视图的显示与隐藏 - 报告生成器面板(右侧) - 当点击任何表格行时,显示实时的商业风格报告 - 包含所选记录及所有相关的子记录,格式清晰且分区 - 添加切换按钮以在样式视图和原始JSON之间切换 - 使用关系链包含子表(及孙表等) - 状态持久化 - 将所有上传的文件、关系和编辑内容保存到localStorage - 刷新时自动加载 - 可调整大小的面板 - 允许用户拖动和调整大小: - 侧边栏(标签) - 表格视图(中间) - 报告面板(右侧) - 导出功能 - 为当前活动标签添加“导出CSV”按钮 - 添加“清除存储”按钮以重置应用程序 要求: - 不使用任何库(不使用Tailwind、Bootstrap、React等) - 单个relatix.html文件 - 开箱即用,完全可工作 - 适合移动端和桌面端 - 风格应简约干净(仅使用标准CSS)
查看原文
AI Prompt: Regenerate “Datalite” Interface with All Features Create a fully functional single-page HTML application called Datalite using only vanilla JavaScript, standard CSS, and HTML — no frameworks or libraries. The interface should support: Multi-file Upload &amp; Tabs Allow uploading multiple CSV or JSON files Display each dataset as a tab in the left sidebar, sorted alphabetically Switching tabs shows the corresponding editable table Editable Table View (per dataset) Render a full HTML table with inline contentEditable cells Include a filter row at the top using contentEditable table headers Always show a sticky blank row at the bottom that adds new entries dynamically Changes persist in memory and to localStorage Relationship Detection (Heuristics) Detect one-to-many and many-to-one relationships heuristically by matching: {tableName}_id → id Shared key values across tables Store relationships and persist them DBML-style Diagram View Render a schema diagram using floating draggable HTML blocks on an infinite canvas Each block shows the table name and its fields Allow the user to toggle the diagram view on&#x2F;off Report Builder Panel (on right) Show a live business-style report when any table row is clicked Include the selected record and all related child records in clean, sectioned formatting Add a toggle to switch between the styled view and raw JSON Include child tables (and grandchildren, etc.) using relationship chains State Persistence Save all uploaded files, relationships, and edits to localStorage Auto-load on refresh Resizable Panels Allow the user to drag and resize: Sidebar (tabs) Table view (center) Report panel (right) Export Functions Add an &quot;Export CSV&quot; button for the currently active tab Add a &quot;Clear Storage&quot; button to reset the app Requirements:<p>No libraries (no Tailwind, Bootstrap, React, etc.) Single relatix.html file Fully working out-of-the-box Mobile and desktop friendly Style should be minimal and clean (standard CSS only)