一2个月写的可视化+多维表格编辑器Mute, 上线!

hi, 大家好, 我是徐小夕.

上周和大家分享了一篇多维表格实现方案探索的文章,以及为什么我没有选择市面上开源的库来实现的原因: 花了2个月时间研究了市面上的4款开源表格组件,崩溃了,决定自己写一款

最近对我已经实现的多维表格进行了功能模块的优化以及表格能力的增强,目前已经发布了1.0版本,暂且起名叫 Mute。演示效果如下:

我会在文末发体验地址,大家感兴趣的可以参考体验一下。接下来我就和大家详细的介绍一下Mute多维表格的功能和技术方案。

功能介绍

Mute多维表格 是一个强大的任务管理工具,提供多种视图和功能来帮助您高效管理项目和任务。

1. 表格视图

表格视图是多维表格的核心功能,提供了直观的任务列表,支持以下功能:

  • 任务创建、编辑和删除
  • 任务分组和排序
  • 自定义字段配置
  • 任务筛选和搜索
  • 任务优先级调整
  • 拖拽排序
  • 批量编辑
  • 数据导入导出
  • 历史记录和版本控制
  • 单元格格式化和条件格式

下面演示一下编辑表格的能力:

我们不仅能编辑每一个任务表格,还能对表格列进行拖拽:

多维表格另一个核心能力就是多维度筛选数据,目前我也实现了对多字段进行筛选的能力:

并支持动态分组:

2.看板视图

看板视图提供了可视化的任务管理方式,支持以下功能:

  • 任务状态可视化
  • 拖拽任务更改状态
  • 按状态分组查看任务
  • 快速添加新任务
  • 任务卡片自定义
  • 泳道视图
  • WIP限制(在制品数量限制)
  • 任务流转历史

3.人员分配视图

人员分配视图帮助您管理团队成员的工作分配:

  • 按人员查看任务分配
  • 工作负载均衡
  • 资源冲突检测
  • 技能匹配
  • 可用性日历

4. 统计分析

统计分析功能提供了多维度的任务数据分析,帮助我们了解项目进展和资源分配:

  • 任务状态分布
  • 任务优先级分布
  • 人员工作负载
  • 项目进度趋势
  • 自定义报表
  • 数据导出
  • 周期性报告
  • 关键指标监控
  • 预测分析

技术实现目前我设计的多维表格的项目结构如下:多维表格的数据结构对于二次开发至关重要。以下是我设计的核心数据模型:

tsx 复制代码
// 任务类型定义
interface Task {
  id: string;                // 任务唯一标识符
  description: string;       // 任务描述
  summary: string;           // 任务情况总结
  assignee: User;            // 任务执行人
  status: "已停滞" | "待开始" | "进行中" | "已完成";  // 任务状态
  startDate: string;         // 开始日期 (格式: YYYY/MM/DD)
  expectedEndDate?: string;  // 预计完成日期 (可选)
  actualEndDate?: string;    // 实际完成日期 (可选)
  isDelayed: boolean;        // 是否延期
  completed: boolean;        // 是否已完成
  priority: "重要紧急" | "紧急不重要" | "重要不紧急";  // 优先级
}

对于不同人员用户来说,也需要规范数据结构,如下是一个基础的用户维度的定义:

tsx 复制代码
// 用户类型定义
interface User {
  id: string;          // 用户唯一标识符
  name: string;        // 用户名称
  avatar?: string;     // 用户头像 (可选)
  role?: string;       // 用户角色 (可选)
  department?: string; // 所属部门 (可选)
}

整个多维表格的数据结构我采用了结构化的JSON来设计,也就意味着可以通过后端直接生成多维表格。目前我已经实现了批量导入任务数据,并支持一键导出数据,如下:

目前该项目1.0版本我已经发布上线,大家可以参考体验一下。

演示地址:mute.turntip.cn

后续会持续分享我对多维表格的设计方案和技术实现,并提供更强大的项目演示供大家体验。

最后

我们最近研发的 flowmix/docx多模态文档引擎,目前也在持续更新中,欢迎体验参考:

文档地州:flowmix.turntip.cn

相关推荐
崔庆才丨静觅11 小时前
hCaptcha 验证码图像识别 API 对接教程
前端
passerby606112 小时前
完成前端时间处理的另一块版图
前端·github·web components
掘了12 小时前
「2025 年终总结」在所有失去的人中,我最怀念我自己
前端·后端·年终总结
崔庆才丨静觅12 小时前
实用免费的 Short URL 短链接 API 对接说明
前端
崔庆才丨静觅12 小时前
5分钟快速搭建 AI 平台并用它赚钱!
前端
崔庆才丨静觅13 小时前
比官方便宜一半以上!Midjourney API 申请及使用
前端
Moment13 小时前
富文本编辑器在 AI 时代为什么这么受欢迎
前端·javascript·后端
崔庆才丨静觅13 小时前
刷屏全网的“nano-banana”API接入指南!0.1元/张量产高清创意图,开发者必藏
前端
剪刀石头布啊13 小时前
jwt介绍
前端
yunteng52113 小时前
通用架构(同城双活)(单点接入)
架构·同城双活·单点接入