跳转到内容

数据表格

数据表格是重要的数据可视化组件,它不仅能展示数据,还自带行复制、单元格内联编辑、树形数据展平、列拖拽、Excel 导出等复杂交互功能。

ID
姓氏
姓名
职位
年龄
1
张三
35
2
李四
总经理
42
3
王五
45
4
赵六
29
5
张静
33
每页行数:5
1-5 共 9

工具栏位于表格的顶部,一些简单的表格可能没有此栏。

  • :搜索输入框,也叫过滤输入框,用于按条件筛选数据,查看过滤语法
  • :列管理工具,用于显示或隐藏列
  • :重新获取数据
  • :设置表格样式、重置

数据行是表格的重要信息载体,用于展示表格数据。选中后一列数据后,可以复制数据,部分表格允许复制整行数据。

状态栏用于显示当前表格的一些状态,例如选中的行数、分页信息、分页操作。

为了让系统按指定的过滤条件筛选数据,可以使用数据过滤来完成这项任务,这是一种强大的功能,可以帮助快速锁定目标数据。TooMaker 使用领域特定查询语言(Domain-Specific Query Language,简称 Query DSL),相比一些使用操作面板式(利用 UI 构建的,由下拉框+预设过滤组成的面板)的过滤器,我们更偏向于结构化语义过滤,键盘输入的效率原高于鼠标点击。当一个表格的列超过5个以后,您很难在下拉框中一眼锁定需要的过滤的列。

<field>:[operator]<value> [logical]

类型:列字段
必填

需要进行过滤的字段,这部分字段来自数据表格中的列标题,输入框会辅助提示相应的字段。对于跨模型的字段,需要使用 . 做分隔符,例如:model.field

类型= | ! | > | >= | < | <= | ~ | ^ | $ | * | [
默认值=

比较或匹配方式,操作符含义:

  • =:等于,区分大小写。
  • >:大于。
  • >=:大于等于。
  • <:小于。
  • <=:小于等于。
  • ~:包含/模糊匹配,忽略大小写。
  • ^:以…开头,忽略大小写。
  • $:以…结尾,忽略大小写。
  • *:正则匹配,由正则语法决定是否区分大小写。
  • [:在数据组内,必须使用 ] 结尾。
  • !:否定,与其他操作符组合使用,组合方式有:
    • !=:不等于,区分大小写。
    • !~:不包含,忽略大小写。
    • !^:不以…开头,忽略大小写。
    • !$:不以…结尾,忽略大小写。
    • ![:不在数据组中,必须使用 ] 结尾

类型:任意,字符串、数值、布尔值、日期、日期+时间
必填

匹配值,也称之为目标值。数据列中使用到的数据都可以作为匹配值使用,其中日期、时间需要使用 ISO 8601 格式,例如:2025-09-012025-09-01T00:00:002025-09-01T08:00:00+08:00

一些固定目标值:

  1. null:表示本应有数据但未被定义,表现为缺少状态,例如一个布尔值类型的数据列,通常应该只有 true | false,如果数据未定义,则表现为 null。只能与 = | != 操作符使用。
  2. empty:表示数据为空,字符类数据可以使用。只能与 = | != 操作符使用。

类型' ' | AND | OR | XOR
默认值' '(空格)

多条件组合逻辑,空格等同于 AND。可以使用 () 构建嵌套式条件组合,例如:

nickname:~Jake (age:>20 OR age:<50):昵称包含 Jake 且年龄在 (20,50) 之间的用户。

我们定义了一些语法糖用于简化表达,这些语法糖通常包含了 operatorvalue 两部分,使用时不能重复指定操作符。

用于筛选时间大于等于今天零点的数据,常见于筛选今天创建的数据,用例:

  • createdAt:@today:等效于 createdAt:>=2025-09-10T00:00:00+08:00

单位d | m | y(天、月、年)

用于快速计算早于今天的日期,常见于筛选距离今天某一段时间内的数据,用例:

  • createdAt:@today-1d:昨天,等效于 createdAt:>=2025-09-09T00:00:00+08:00
  • createdAt:@today-2m:2个月以前,等效于 createdAt:>=2025-07-10T00:00:00+08:00
  • createdAt:@today-3y:3年以前,等效于 createdAt:>=2022-09-10T00:00:00+08:00

用于快速设定在 xy 之间的闭合范围,不支持半开半闭的范围,可以和 @today 语法一起使用,用例:

  • age:20..50age:>=20 AND age:<=50
  • age:..50age:<=50
  • createdAt:@today-1m..@todaycreatedAt:>=2025-08-10T00:00:00+08:00 AND createdAt:<=2025-09-10T00:00:00+08:00

可选值deleted | all

用于筛选数据模型是否被归档,默认情况隐藏已归档数据。用例:

  • is:deleted:显示已归档数据。
  • is:all:显示所有数据,含已归档。
  • contact.is:deleted:显示已归档的联系人。