信贷流程配置平台

一、项目背景

公司在全球市场加速布局，持续拓展新兴业务版图，成功进入多个新国家市场。与此同时，技术团队面临多重挑战：需要同时维护多套复杂的信贷流程，并应对高频次的APP版本迭代与灰度测试需求，这对整体技术架构提出了更高的稳定性和灵活性要求。

旧模式 - Hard Code

针对各业务页面独立开发原生代码模块，实现配套的信息查询与数据提交接口，同时维护版本控制与灰度接口以满足迭代更新与灰度实验需求。传统的硬代码开发模式面临如下痛点：

• <span style="color:orange">研发效率低</span>：新增业务流程需同步开发原生功能模块及服务端接口；字段/流程调整需全局代码改造与全链路回归验证；流程下线需要开发测试发布
• <span style="color:orange">资源消耗重</span>：业务矩阵与国家区域双重扩张导致流程维护量指数级增长；研发侧需多版本代码并行维护，测试侧需持续更新海量用例库
• <span style="color:orange">系统风险高</span>：多版本多流程并行场景下，字段级变更存在跨流程交叉影响风险；版本差异与灰度策略叠加导致影响范围难以精准评估

新模式 - All In Config

为了解决上述痛点，海外业务研发搭建了信贷流程配置平台；搭建流程引擎、开发标准化服务接口、沉淀前端组件库，通过流程、页面配置代替硬代码；业务流配置热更新，实现流程调整免发版上线；全业务流拓扑图谱支持实时状态监测，版本差异与灰度策略集中管控，变更影响范围精确可溯。

架构主要包括如下两个方面：

• 流程引擎：构建可视化流程编排系统，通过配置实现业务流自动化调度与页面跳转控制
• 渲染引擎：基于声明式schema配置体系，支持可视化组件装配、跨模块联动及实时校验规则注入

二、流程引擎

系统设计

流程引擎架构设计核心考量维度：

• 业务可靠性保障体系

  • 稳定性与时效性：支撑千万级用户核心业务流程，关键节点毫秒级响应时延控制
  • 轻量化设计：采用微内核轻量模式，确保多国异构环境下的高效部署与运维，同时降低学习的成本

• 流程控制能力矩阵

  • 基础控制：支持声明式流程定义、流程驱动、断点续跑及流程回滚能力
  • 动态扩展：可视化分支策略配置，快速灵活支持各种条件的业务流程分支

  • 过程洞察：全生命周期轨迹追踪体系，精确记录用户从页面曝光到最终提交的全维度埋点

    传统BPM引擎（如Activiti/Flowable）需构建30+核心数据实体，存在多层级抽象与冗余状态管理，部署周期长学习维护成本高，时延高难以满足高频交互场景。我们搭建的流程引擎，数据模型简单，仅需5张高度聚合的核心表实现全流程控制；核心表天然承载流程轨迹数据，支持无埋点的全链路执行追溯能力。

关键模型

流程 (Flow)

定义了起点、终点以及起点到终点需要执行的活动、执行路径、执行策略；包括流程的定义以及发布。

流程实例 (FlowInstance)

某个填资流程会被不同用户发起，每个用户发起填资这个流程都会被执行一次；流程每执行一次都会创建一个对应的流程实例，记录对应用户这次的填资行为。

流程元素 (FlowElement)

构成流程中的各种元素通称为流程元素 (FlowElement)，包括节点 (FlowNode)和顺序流 (SequenceFlow)等

节点 (FlowNode)

事件节点 (EventNode)

• 开始节点 (StartEvent)：标识流程的开始；
• 结束节点 (EndEvent)：标识流程的结束；

活动节点 (ActivityNode)

• 任务 (Task)：需要处理的节点

  • 用户任务节点 (UserTask)：使用方执行任务的节点，比如需要用户提交信息；
  • 系统任务节点 (ServiceTask)：系统内部自行执行任务的节点；
• 内嵌子流程 (SubProcess)：将流程作为另一个流程的节点来处理；
• 调用子流程 (CallActivity)：与内嵌子流程不同的是，调用子流程拥有独立的模型存储，会产生新的流程实例

顺序流 (SequenceFlow)

记录节点之间的执行顺序，可以配置执行的条件conditions（比如用户点击了下一步或者回退作为输入）。conditions只有在与网关节点Gateway配合使用时生效，由Gateway决定conditions的执行策略；比如根据用户提交的收入，决定联系人填写的数量。

网关节点 (Gateway)

与顺序流配合使用，用于描述顺序流的执行策略。

可视化

基于平台化运维与业务自主化目标，构建可视化流程编排控制台；支持拖拽式节点配置与规则逻辑编排，降低流程维护技术门槛；内置版本快照与操作审计日志，确保流程迭代过程可追踪可回滚。

三、渲染引擎

采用组件化架构设计，每个页面元素均为高内聚的独立组件，通过声明式schema配置驱动页面生成；配置与实现解耦，支持动态加载组件配置，可快速完成页面搭建与迭代，有效提升搭建效率和系统可维护性。

组件属性配置

• 支持可读/可写状态、字段长度、格式掩码等基础属性配置
• 内置正则表达式校验、自定义校验函数等验证规则
• 可定义placeholder提示、悬浮说明等交互引导信息

格式、长度、正则示例代码：

{
    "x-validator": [
        {
            "required": true,
            "message": " Ingrese el código postal"
        },
        {
            "len": 5,
            "message": "la longitud debe ser de 5 dígitos"
        },
        {
            "pattern": "^[a-zA-Z0-9]{5}$",
            "message": "Por favor, ingrese lo correcto en RFC"
        }
    ]
}

只读示例代码：

{
    "x-component-props": {
        "readOnly": true,
        "placeholder": "Nivel educativo",
        "defaultValue": "2"
    }
}

邮箱联想示例代码：

{
    "x-component-props": {
        "placeholder": "Correo electrónico",
        "defaultValue": "",
        "autoComplete": [
            "gmail.com",
            "outlook.com",
            "yahoo.com",
            "zoho.com",
            "gmx.ex",
            "aol.com"
        ]
    }
}

响应式布局管理

• 通过栅格系统实现自适应布局
• 支持Flex/Grid等现代布局方案

个人信息页示例代码：

{
    "id": "personSchema",
    "type": "object",
    "properties": {
        "top": {
            "type": "void",
            "properties": {
                "segmented": {
                    "x-component": "XSegmented",
                    "x-component-props": {
                        "title": "Información personal",
                        "steps": 5,
                        "index": 1,
                        "tip": "Quedan 4 pasos para obtener un límite de préstamo de hasta MXN$30,000."
                    }
                }
            }
        },
        "personInfo": {
            "type": "void",
            "x-component": "XCardLayout",
            "x-component-props": {
                "header": {
                    "title": "Información personal",
                    "subtitle": "Información personal"
                }
            },
            "properties": {
                "education": {
                    "type": "String",
                    "x-decorator": "FormItem",
                    "x-component": "XPicker"
                },
                "postalCode": {
                    "type": "string",
                    "x-decorator": "FormItem",
                    "x-component": "XInput"
                },
                "[state, district]": {
                    "type": "string",
                    "x-decorator": "FormItem",
                    "x-component": "XSelectInput"
                },
                "email": {
                    "type": "string",
                    "x-decorator": "FormItem",
                    "x-component": "XInput"
                },
                "submit": {
                    "type": "void",
                    "properties": {
                        "submitBtn": {
                            "x-component": "XSubmit"
                        },
                        "tip": {
                            "x-component": "XBottomTip"
                        }
                    }
                }
            }
        }
    }
}

组件联动机制

• 基于数据绑定的值联动（显隐/禁用状态）
• 支持跨组件的事件响应体系
• 可配置级联更新规则（如省市区三级联动、邮编联想等等）

邮编省市区联动示例代码：

{
    "x-component-props": {
        "readOnly": true,
        "placeholder": "Estado /Colonia detallada",
        "onRetry": "{{ function (){$form.setValues({ state:undefined, district: undefined},\"deepMerge\"); $self.componentProps.retry = true; queryPostalCode( { postalCode: $form.query(\"postalCode\").take().value }, function(data) { if( data && data.state && data.district) { $self.componentProps.retry = undefined; $form.setValues({ state:data.state, district: data.district},\"deepMerge\"); } else{ $self.componentProps.retry = false; }} );} }}"
    },
    "x-reactions": {
        "dependencies": [
            "postalCode"
        ],
        "when": "{{ $deps && $deps[0] && $deps[0].length === 5 }}",
        "fulfill": {
            "state": {
                "visible": true
            },
            "run": "{{ $self.componentProps.onRetry(); }}"
        },
        "otherwise": {
            "state": {
                "visible": false
            }
        }
    }
}

四、成果及未来规划

阶段成果

• 已完成多个国家多个业务场景落地
• 服务端接口由之前的16个降低到2个，接口标准化率达87.5%
• 业务迭代周期压缩至1/7（14人日→2人日），释放80%研发资源

未来规划

• 页面可视化配置，支持拖拽式页面配置
• 搭建从产品需求->流程编排->页面配置的自动化流程
• 目标实现90%+业务变更通过配置化完成，发布时效提升至小时级