字段条件显示系统扩展.md
5.7 KB
字段条件显示系统扩展计划
背景与目标
当前问题
-
show_when只支持简单的等于比较 (equals) - 不支持 OR 条件、嵌套条件
- 不支持不等于、大于、小于等操作符
- 隐藏字段的清理逻辑分散在
reset_map中 - 提交时可能包含隐藏字段的脏数据
目标
构建一个声明式的条件规则系统,支持复杂逻辑同时保持配置可读性。
技术方案:方案 B - 条件规则引擎
核心文件变更
| 文件 | 操作 | 说明 |
|---|---|---|
src/config/plan-conditions.js |
新建 | 条件操作符和评估引擎 |
src/composables/useFieldDependencies.js |
修改 | 集成新的条件评估器 |
src/composables/usePlanSubmit.js |
新建 | 提交时字段过滤逻辑 |
src/config/plan-templates.js |
修改 | 迁移现有配置到新格式 |
src/composables/__tests__/plan-conditions.test.js |
新建 | 条件引擎单元测试 |
阶段 1:核心条件引擎
任务 1.1 创建条件操作符定义
-
创建
src/config/plan-conditions.js -
定义比较操作符:
eq,ne,gt,gte,lt,lte -
定义集合操作符:
in,nin -
定义字符串操作符:
contains,startsWith,matches -
定义布尔操作符:
truthy,falsy,empty,notEmpty - 编写单元测试验证操作符正确性
任务 1.2 实现条件评估函数
-
实现
evaluateCondition(condition, formData)函数 -
支持简单条件:
{ field, op, value } -
支持 AND 逻辑:
{ and: [...] } -
支持 OR 逻辑:
{ or: [...] } -
支持 NOT 逻辑:
{ not: {...} } - 支持嵌套条件组合
- 编写单元测试覆盖各种条件场景
任务 1.3 向后兼容处理
-
支持旧格式
show_when: { field: 'x', equals: 'y' } -
支持旧格式数组
show_when: [{ field: 'x', equals: 'y' }] - 自动转换为新格式
阶段 2:清理机制
任务 2.1 字段清理规则
-
在字段定义中添加
clear_when_hidden属性 -
实现
clear_when_hidden: true自动清空 -
实现
clear_when_hidden: false保留值 -
实现级联清理
clear_when_hidden: { clear_dependents: [...] }
任务 2.2 提交时字段过滤
-
实现
filterHiddenFields(formData, visibleFields)函数 - 只提交当前可见的字段
- 保持 API 兼容性
任务 2.3 更新 useFieldDependencies
- 集成新的条件评估引擎
- 实现字段隐藏时的自动清理
-
更新
isFieldVisible使用新引擎 - 保持 API 兼容性
阶段 3:配置迁移
任务 3.1 迁移储蓄类模板
-
迁移
savingsFormSchema.withdrawal_fields到新格式 -
删除
reset_map,使用clear_when_hidden替代 - 验证功能正常(测试通过 160/160)
任务 3.2 迁移保障类模板
-
检查
protectionFormSchema是否需要条件 - 按需添加条件规则(保障类暂无条件需求,无需迁移)
任务 3.3 更新文档解析工具 ⚠️ 重要
-
更新
src/utils/parsers/config-generator.js生成新格式配置 -
修改
show_when生成逻辑,使用{ field, op, value }格式 -
停止生成
reset_map(已忽略) - 测试通过(160/160)
说明:MCP 文档解析服务保持不变,仅更新配置生成器输出格式。
任务 3.4 更新文档
-
更新
plan-templates.js顶部的使用说明 - 添加条件规则配置示例(已在 plan-templates.js 注释中说明)
- 添加常见场景示例(已在 savingsFormSchema 中实现)
阶段 4:测试与验证
任务 4.1 单元测试
- 条件操作符测试覆盖率 > 90%
- 条件评估引擎测试覆盖率 > 90%
- useFieldDependencies 测试更新
任务 4.2 集成测试
- 测试储蓄类产品完整流程
- 测试字段显示/隐藏切换
- 测试提交时字段过滤
- 测试向后兼容性
任务 4.3 真机验证
- 微信开发者工具验证
- 检查性能影响
- 检查内存占用
配置格式示例
新格式示例
// 简单条件
show_when: { field: 'smoker', op: 'eq', value: '是' }
// 多条件 AND
show_when: {
and: [
{ field: 'smoker', op: 'eq', value: '是' },
{ field: 'age', op: 'gte', value: 30 }
]
}
// OR 条件
show_when: {
or: [
{ field: 'smoker', op: 'eq', value: '是' },
{ field: 'age', op: 'gt', value: 50 }
]
}
// 嵌套条件
show_when: {
and: [
{ field: 'product_type', op: 'in', value: ['A', 'B'] },
{
or: [
{ field: 'coverage', op: 'gte', value: 100000 },
{ field: 'payment_period', op: 'eq', value: '20年' }
]
}
]
}
// 清理规则
{
id: 'withdrawal_amount',
show_when: { field: 'withdrawal_mode', op: 'eq', value: '指定提取金额' },
clear_when_hidden: true // 隐藏时清空
}
旧格式(保持兼容)
// 旧格式仍然支持
show_when: { field: 'withdrawal_mode', equals: '指定提取金额' }
show_when: [{ field: 'withdrawal_mode', equals: '指定提取金额' }]
风险与注意事项
- 向后兼容:必须保持现有配置格式可用
- 性能:条件评估不能影响表单响应速度
- 可读性:配置文件需要保持可理解性
- 测试覆盖:每个操作符都需要充分测试
进度追踪
| 阶段 | 状态 | 完成时间 |
|---|---|---|
| 阶段 1:核心引擎 | ✅ 完成 | 2026-02-15 |
| 阶段 2:清理机制 | ✅ 完成 | 2026-02-15 |
| 阶段 3:配置迁移 | ✅ 完成 | 2026-02-15 |
| 阶段 4:测试验证 | 🔄 待真机验证 | - |
创建时间: 2026-02-15 预计工期: 3-4 天 维护者: Claude Code