列表行按钮配置
列表行按钮是每一条数据行上的操作按钮,可执行事件流,并支持基于行数据动态控制显隐。
概述
列表行按钮展示在表格行内,用于对单条记录操作,如查看、编辑、删除、发起审批。在编辑器的 列表行按钮配置 卡片中:
- 点击 新增列表行按钮 添加按钮,新按钮默认名称为「列表行按钮」。
- 拖动调整按钮顺序,点击按钮打开属性抽屉进行配置,可删除。
配置项
| 配置项 | 说明 |
|---|---|
| 按钮名称 | 按钮显示文字,必填 |
| 业务类型 | 执行事件流 或 微应用组件 |
| 事件流 | 业务类型为「执行事件流」时配置 |
| 是否隐藏 | 是否隐藏该按钮 |
| 展示控制模式 | 简单模式 或 高级模式 |
| 依赖行数据字段 | 简单模式下要判断的字段 |
| 匹配方式 | 等于 或 不等于 |
| 依赖行数据字段值 | 简单模式下要匹配的值 |
| 展示动态脚本 | 高级模式下的自定义脚本 |
| 移动端占位符绑定 | 绑定到移动端页面模板的按钮占位符位置(31–40) |
| 按钮样式 | 默认 / 主题色 / 幽灵(反色)/ 虚线 / 链接 / 文本 |
| 展示为危险按钮 | 是否使用危险色呈现 |
| 按钮图标 | 按钮前的图标 |
| 自适应父容器宽度 | 移动端按钮是否占满父容器宽度 |
| 启用滑动操作 | 移动端是否启用滑动操作 |
| 滑动操作颜色 | 启用滑动操作后的背景色 |
微应用组件已废弃
业务类型「微应用组件」的配置项处于禁用状态,新功能请统一使用「执行事件流」。
业务类型
| 业务类型 | 存储值 | 说明 |
|---|---|---|
| 执行事件流 | ExecuteActionPipeline | 点击后执行事件流,为推荐方式 |
| 微应用组件 | MicroAppCmp | 加载微应用渲染按钮,待废弃 |
展示控制
行按钮支持两种显隐控制模式(DisplayControlMode):
简单模式(0)
基于字段值匹配规则,无需写代码:
- 选择 依赖行数据字段(
DisplayRelatedFieldCode)。 - 选择 匹配方式(
DisplayRelatedCondition):eq(等于) 或ne(不等于)。 - 填写 依赖行数据字段值(
DisplayRelatedFieldValue)。
当行数据中该字段值与配置值匹 配时,按钮按匹配方式显示。
高级模式(1)
编写动态脚本,由脚本调用 API 控制显隐:
function buttonTrigger(api, data) {
// will show button as default
// Example: hide button if status is not 'active'
// if (data.status !== 'active') {
// api.hide();
// }
}
脚本可通过 api.show()、api.hide() 控制按钮显示,data 为当前行的字段键值对象。详细脚本 API 见 行按钮脚本 API。
移动端设置
- 移动端占位符绑定:把按钮绑定到移动端页面模板的按钮占位符位置(31–40),占位符上配置的「自定义元素样式」会透传到按钮上。历史数据中绑定 1–20(原通用占位符)的按钮仍可正常使用,重新调整后只能选择 31–40。
- 自适应父容器宽度:按钮在移动端是否占满父容器宽度。
- 启用滑动操作:移动端开启滑动操作。
- 滑动操作颜色:滑动操作背景色,可选主题色、浅色、弱色、成功、警告、危险。