HZERO 表格又进化,能像 Excel 一样进行列表操作啦!

122 阅读3分钟

01 传统 Table  VS  Choerodon UI  Table

随着项目对表格功能需求的提升,我们追求的不再是简单展示与查询,而是灵活操作、高效维护数据的全面功能。鉴于 Excel 在办公中的广泛应用,表格设计也愈发贴近 Excel 操作习惯,以提供更流畅的用户体验。

传统的表格,更多的只是在展示查询数据上和简单编辑数据的需求上。为了能应对更多复杂的表格场景和需求,这次升级后的 Table 组件,支持了类似 Excel 的批量填充和计数功能,使其操作起来更加便利和高效。

传统表格 VS Choerodon UI Table

Choerodon UI Table 比起传统表格,在交互上更加丰富且高效便捷

02 体验全新的  Table 交互

/框选批量填充/

1. 设计解读

  • 在开启表格复制功能的基础上,用户通过框选需要填充的数据单元格,同时下拉进行批量填充数据,增强数据的可复用性和操作便捷性。
  • 这种设计方式能够更灵活操作数据,高效填充数据、减轻数据粘贴负担。

2. 操作方式

  • 开启 clipboard 后,默认开启批量填充功能。下拉角标,实现快速填充数据:

详细示例(点击下列文字超链接跳转):

Choerodon UI Table  批量填充与计数

3. 功能特色

  • 实现 Excel 批量填充功能,为习惯 Excel 操作的用户提供了熟悉且便捷的操作体验,轻松上手,效率倍增!

/框选计数/

1. 设计解读

  • 开启计数功能,同样通过框选操作,选定范围后,会自动开始计算,计算包括常用求和、平均值、最大值、最小值和计数。也同样提供该功能的自定义渲染功能,使开发者更随意定制。
  • 这种设计方式省去了人工手动计算,提高计算效率,使复杂数据的计算更一目了然。

2. 操作方式

  • 开启 clipboard 后,配置 arrangeCalc 属性,通过鼠标框选范围,实现快速计算:

详细示例(点击下列文字超链接跳转):

Choerodon UI Table  批量填充与计数

3. 功能特色

  • 实现 Excel 计数功能,复杂数据也能快速计算。
  • 支持自定义渲染,使计算更加个性化。
  • 升级后 Table 操作类比 Excel 框选、计数。

升级后的 Table 与 Excel 在这两个功能交互上并没太大差别,更符合习惯 Excel 操作的用户群体。

03 项目实践

目前该功能已在项目上有过实践,他们提出的具体需求是为了批量修改人员状态和计算员工绩效总和。

/批量修改人员状态/

搜索出需要修改状态的员工,修改第一个员工的状态后,使用批量填充,可复用框选的所有用户。

/计算员工的绩效总和/

框选各个季度的数据后,可直接在右下角查看对应员工的的绩效数据。

04 总结

目前 Choerodon UI Table 实现了部分 Excel 的功能,为了加强表格在 Excel 上更多的应用场景,后续也会持续新增更多便捷高效的交互。如:

  • 设计更多方向的批量填充功能。
  • 复制单元格后,在另外一块区域直接框选并批量填充。

本次 Choerodon UI Table 的升级,不仅提升使表格组件的交互更加高效和便捷,区别与传统表格组件有了更丰富的交互,并借鉴了 Excel 的交互方式,对熟悉 Excel 的使用者来说更加便捷。

欢迎试用welcome to try

我们将持续优化 Table 组件功能,优化客户体验。如果您有更好的想法和建议,欢迎您积极反馈给我们

● Table

● github