TODO.md

开发阶段

1. 先做出页面整体 Layout 和 Router 结构，实现基础的数据填充
2. 用 Node 搭建一个模拟后端，模拟数据读取和登录情况
3. 联合建立 Flask 接口
4. 对样式和动画进行调整以及响应式适配

分区 TODO

登录系统

• 登录记忆功能

项目改进

• 添加 commit-lint 以自动控制版本、发布 CHANGELOG
• 使用全局状态管理方案
• 改进全局状态流
  • Files 不全局存储，采用状态提升
  • CSV 解析结果在需要的时候才调用
  • user 信息全局存储

后端想法

• 实现登录和记忆功能（至少实现带 cookie 和 sessionId 的记忆化登录，不用每次请求都带 token）
• 实现 csv 的上传然后解析，云端维护一份数据结构，并返回到前端作图
• 实现模型数据和运算的模拟（NoSQL）
• 训练和预测使用同一个 WebSocket 模型，打通日志和进度接口

样式想法

• modal 弹出/消失动画
• 卡片半透明背景
• 页面整体采用 CSS 动画作为背景（canvas 动画）
• 支持自动/手动暗黑模式切换

模型选择

• 将选框做成下拉式的
• 模型管理功能，包括预览、复制和删除
• 添加锁定选项功能，在运行任务后不能更改

模型训练

• 训练模型单独做成一页，内容包括数据上传、效果预览
• 包含 Console（可选打开），通过 WebSocket 实时获取线上 Log
• 效果预览是折线图上绘制出预测曲线和实际曲线的对比
• 填充表单验证

模型应用

• 提供表格数据预览功能
• 将 csv 解析为表格数据抽象为 hook
• 添加文件后自动校验，校验中边框为蓝色滚动，校验合并完成后为绿色常显，校验失败为红色常显
• 包含 Console（可选打开），通过 WebSocket 实时获取线上 Log

运行结果

• 折线图预测部分突出显示，超长部分作采样
• 将整个 canvas 渲染抽象成 hook
• 折线图支持拖动和放大
• 添加部分高亮
• 上方添加数据后下方的折线图就立刻刷新显示
• 添加预测结果数据下载入口（表格下载和图片导出）
• 根据数据点长度自动计算显示密度