UI Design System
build dev

RuleConfig

评分规则配置:权重与带操作符/取值/评分的条件列表。中文惯用名:规则配置。
稳定本期新增已接入

元信息

字段值
规范 IDcomponent.rule-config
名称RuleConfig
二级分类业务组件(business)
用途评分规则配置:权重与带操作符/取值/评分的条件列表
描述中文惯用名:规则配置。

预览

静态结构:根节点为规则配置容器——顶部「权重」数字输入(1–1000 整数,输入中允许清空、仅合法值实时 commit、失焦回退默认 1);下方条件列表,每行:操作符 Select(13 个 ConditionOpt:GREATER / GREATER_EQUAL / LESS_EQUAL / LESS / EQUAL / IN / NOT_IN / UNEQUAL / LIKE / NULL / HASVAL / NOTNULL / BETWEEN)→ 值输入(BETWEEN→双 number 输入 ~ 分隔、IN / NOT_IN→TagInput 标签多值(Enter 添加、去重、× 删除)、数值类操作符→number 输入、其余→text 输入、无值操作符 NULL / HASVAL / NOTNULL 不渲染)→ 评分 number 输入;行尾删除按钮。disabled 为只读展示形态(权重 / 操作符文案 + 格式化值 + 评分: x 纯文本)。条件 key 缺失或重复时模块级自增补齐唯一 key;操作符切到 BETWEEN 时 value 重置为 []、其余变更置 undefined;编辑态行内提示「请填写取值 / 请填写评分」(getConditionIssue)。

DSL 结构

DslNode
{
  "type": "RuleConfig",
  "props": {
    "value": "${state.rule}"
  },
  "events": {
    "onChange": {
      "action": "setState",
      "params": {
        "rule": "${event}"
      }
    }
  }
}

何时用

何时使用

  • 评分规则配置:整体权重(score)+ 多条带操作符 / 取值 / 评分的条件。
  • 以对象值接入 react-hook-form 的场景(配合 isRuleConfigComplete / getIncompleteConditions 做完整性校验)。

何时不用

  • 无评分语义的纯过滤条件:使用 FieldCondition。
  • 自由表达式规则:使用 RuleExpression / ExpressionEditor。

变体

变体视觉形态适用场景
编辑形态权重输入 + 条件行(操作符 / 取值 / 评分)表单内配置评分规则
只读展示形态(disabled)权重与条件以纯文本呈现详情回显 / 审批只读
多值取值IN / NOT_IN 渲染 TagInput 标签枚举集合条件
范围取值BETWEEN 双输入 ~ 分隔数值区间条件

API 属性

属性类型默认值说明
valueRuleConfigValue—受控值:{ score?: number; ruleConditions: Condition[] }
onChange(value: RuleConfigValue) => void—规则值变更回调
disabledbooleanfalsetrue 时为只读展示形态

使用规范

  • 接入 react-hook-form 用 validate 组合 isRuleConfigComplete / getIncompleteConditions:对象值对 required 恒为真值,必须显式校验。
  • 权重约定 1–1000 整数,超出钳制;条件取值 / 评分成对出现(无值操作符除外)。
  • 后端条件 key 缺失 / 重复时组件自动补齐,无需页面预处理。
  • BETWEEN 兼容后端逗号字符串 "3,5" 与数组(normalizeBetweenValue),回显无需转格式。

正例

  • ✓ 评分模型表单:RuleConfig 接 react-hook-form,validate 引用 getIncompleteConditions 拦截未完成条件。
  • ✓ 详情回显:disabled + 同一 RuleConfigValue 只读展示规则。

反例

  • ✕ 依赖 RHF 的 required 规则判断 RuleConfig 是否填写(对象值恒真,必须用 isRuleConfigComplete)。
  • ✕ 用 RuleConfig 配纯筛选条件(应使用 FieldCondition)。

Design Token 映射

不适用:组件 tokenRefs 为空:样式 Token 数据尚未接入,三层映射(Primitive → Semantic → Component)待样式 Token 接入后回填。