企业软件的AI深水区：OODER 如何让重量级业务组件在自然语言中重生

<!-- AI 生成的通用代码 -->
<div class="form-group">
  <label>姓名</label>
  <input type="text" class="form-control">
</div>
<div class="form-group">
  <label>部门</label>
  <select class="form-control">...</select>
</div>

{
    "alias": "leaveRequestForm",
    "key": "ood.Module",
    "className": "view.LeaveRequestForm",
    "moduleViewType": "FORMCONFIG",
    "properties": { "caption": "请假申请" },
    "children": [
        {
            "alias": "mainLayout",
            "key": "ood.UI.Layout",
            "properties": {
                "items": [
                    { "id": "before", "pos": "before", "size": 60 },
                    { "id": "main", "pos": "main", "size": 80 },
                    { "id": "after", "pos": "after", "size": 100 }
                ],
                "type": "vertical"
            },
            "children": [
                {
                    "alias": "formArea",
                    "key": "ood.UI.Form",
                    "target": "main",
                    "properties": { "caption": "请假信息", "dock": "fill" },
                    "children": [
                        {
                            "alias": "leaveType",
                            "key": "ood.UI.ComboInput",
                            "properties": {
                                "name": "leaveType",
                                "caption": "请假类型",
                                "formField": true,
                                "value": ""
                            }
                        }
                    ]
                }
            ]
        }
    ]
}

// L1 大类（6个）
public enum L1Category {
    DATA_DISPLAY("data-display", "数据展示"),  // 表格、树、卡片
    DATA_INPUT("data-input", "数据录入"),      // 表单、输入
    NAVIGATION("navigation", "导航交互"),      // 导航树、标签页
    LAYOUT("layout", "布局容器"),              // Block、Panel、Layout
    CHART("chart", "图表可视化"),              // ECharts、FCharts
    SPECIAL("special", "特殊组件");            // SVG画布、模块引用
}

// L2 子类（16个）
// L3 具体组件（27个）

registerL3Component("TreeGrid", "data-display.table", "列表",
    GRIDCONFIG, 10, DESKTOP,
    Arrays.asList("表格", "列表", "树表", "grid", "table", "数据表格", "树形表格"),
    Arrays.asList("创建一个数据表格", "做一个列表展示", "生成树形表格"));

// 用户选中组件后，右键菜单触发
_addComponentContext: function (componentData) {
    var host = this;
    var attachments = host._state.attachments || [];

    // 将组件的完整JSON定义作为附件
    attachments.push({
        type: 'component',
        name: componentData.alias || componentData.name,
        data: componentData,
        // 自动生成 Markdown 格式的组件描述
        markdown: host._formatComponentAsMarkdown(componentData)
    });

    host._state.attachments = attachments;
    host._renderAttachments();

    // 显示提示：组件已添加到对话上下文
    ood.message('已将组件 ' + componentData.alias + ' 添加到对话');
}

// PromptEngine.java
if (contextAttachments != null && !contextAttachments.isEmpty()) {
    prompt = prompt + contextAttachmentTemplate
        .replace("{attachments}", contextAttachments);
}

## 用户附加的上下文信息

以下信息是用户主动添加到对话中的上下文，请优先参考这些信息：

{attachments}

private static final Set<String> DOMAIN_DICT = new HashSet<>();
static {
    String[] defaultTerms = {
        "组件", "属性", "事件", "方法", "字段", "类型", "别名",
        "treegrid", "tree", "gallery", "form", "navtree", "navtabs",
        "navmenubar", "navgallery", "layout", "chart", "echarts",
        "svgpaper", "block", "panel", "div", "tabs", "module",
        "genjson", "viewtype", "dock", "alias", "caption", "properties",
        // ... 200+ 术语
    };
}

// 启动时从外部文件加载扩展词典
private void loadExternalDomainDict() {
    Resource[] resources = resolver.getResources(
        "classpath:skills/*/knowledge/domain-dictionary.txt");
    // 逐行加载，补充到 DOMAIN_DICT
}

// 优先按 Markdown 标题分块
List<String> sections = chunkByMarkdownHeaders(content, chunkSize, overlap);
if (!sections.isEmpty()) {
    for (String section : sections) {
        if (!section.trim().isEmpty()) {
            indexDocumentChunks(docId + "#" + sectionIndex, section, kbId, chunkSize, overlap);
        }
    }
    return;
}

if (text.length() > 1500) {
    text = text.substring(0, 1500) + "...";
}

ooder.rag.search.mode=keyword  # keyword 或 vector

# RAD Component Reader

@id: rad-component-reader
@version: 2.0.0
@domain: rad
@executor: net.ooder.studio.chat.skill.RadComponentReaderExecutor
@scene: rad
@disclosure: scene
@knowledge-dir: knowledge
@prompts-dir: prompts

## Functions

### list_page_components
列出当前页面中的所有 UI 组件及其类型和别名。

### get_component_defaults
获取指定组件类型的默认 genJson 配置。

@Component
public class SkillMdLoader {
    // 缓存：skillDir -> SKILL.md 原始内容
    private final Map<String, String> skillContentCache = new ConcurrentHashMap<>();
    // 缓存：skillDir -> 解析后的 SkillDefinition
    private final Map<String, SkillDefinition> skillDefCache = new ConcurrentHashMap<>();
    // 缓存：domain -> 拼接后的知识内容
    private final Map<String, String> knowledgeCache = new ConcurrentHashMap<>();
    // 缓存：domain -> 拼接后的提示词内容
    private final Map<String, String> promptCache = new ConcurrentHashMap<>();

    @PostConstruct
    public void init() {
        loadAllSkills();        // 扫描 skills/*/SKILL.md
        loadKnowledgeFiles();   // 扫描 skills/*/knowledge/*.md
        loadPromptFiles();      // 扫描 skills/*/prompts/*.md
    }
}

// 硬编码5个场景模板
scenePromptTemplates.put("rad", "你是 OODER Studio 的 RAD 设计助手...");
scenePromptTemplates.put("bpm", "你是 OODER Studio 的 BPM 流程设计助手...");
// ... 更多硬编码

@PostConstruct
public void init() {
    loadScenePromptsFromMd();    // 扫描 skills/*/prompts/*.md
    loadSharedTemplatesFromMd(); // 加载输出规范、上下文格式等
}

private String loadPromptMd(String promptName) {
    Resource[] resources = resolver.getResources(
        "classpath:skills/*/prompts/" + promptName + ".md");
    for (Resource resource : resources) {
        String content = readResourceContent(resource);
        if (content != null && !content.trim().isEmpty()) {
            return content.trim();
        }
    }
    return null;  // 降级到 fallback 硬编码
}

// FunctionCallingLoopExecutor.java 核心循环
while (iteration < maxIterations) {
    // 1. 调用LLM
    ChatResponse response = llmEngine.chatCompletion(messages, tools, ...);

    // 2. 解析工具调用
    List<ToolCall> toolCalls = response.getToolCalls();
    if (toolCalls == null || toolCalls.isEmpty()) break;  // 无工具调用，结束循环

    // 3. 执行工具
    for (ToolCall toolCall : toolCalls) {
        String functionName = toolCall.getFunction().getName();
        String arguments = toolCall.getFunction().getArguments();
        Object result = executeToolCall(functionName, arguments, context);
        toolExecutions.add(execution);
    }

    // 4. 将工具结果反馈给LLM，继续下一轮
    messages.add(toolResultMessage);
    iteration++;
}

// 解析 【Step N】标记
_parseSteps: function (content) {
    var stepRegex = /【Step\s*(\d+)】(.+)/g;
    var steps = [];
    var match;
    while ((match = stepRegex.exec(content)) !== null) {
        steps.push({
            index: parseInt(match[1]),
            description: match[2].trim(),
            status: 'running'
        });
    }
    return steps;
}

// NlpChatInline.js - _applyRadToolResults
if (toolName === 'nlp_build_component') {
    // 将AI生成的组件直接渲染到设计器
    SPA.fe("onNlpBuildComplete", [{
        moduleName: result.moduleName,
        componentType: result.componentType,
        genJson: result.genJson,          // 组件定义
        designerJson: result.designerJson  // 设计器JSON
    }]);
} else if (toolName === 'update_component') {
    // 直接更新设计器中组件的属性
    var designer = SPA.getDesigner();
    var node = designer.getByAlias(updateItem.alias, true);
    node.boxing().setProperties(updateItem.properties);
    designer.refreshView(designer.getJSCode(designer.getWidgets(true)), true);
} else if (toolName === 'render_chart_quickview') {
    // 图表即时预览
    host._showChartQuickView(chartHtml, chartType);
}

public IntentRecognitionResult recognize(String query) {
    // 第一层：规则匹配（快速、确定性）
    IntentRecognitionResult ruleResult = ruleBasedRecognize(query);
    if (ruleResult.getConfidence() > 0.8) {
        return ruleResult;  // 高置信度直接返回
    }

    // 第二层：LLM语义理解（慢速、高准确性）
    return llmBasedRecognize(query);
}

# intent-keywords.txt
CREATE_FORM | 表单,form,输入,编辑,录入,填写,新增表单,编辑表单
CREATE_GRID | 表格,grid,列表,list,数据,查询,数据表,数据列表
CREATE_TREE | 树,tree,层级,目录,分类,树形,组织架构,菜单树
CREATE_CHART | 图表,chart,统计,分析,报表,柱状图,折线图,饼图
CREATE_SVGPAPER | 流程图,架构图,组织架构图,思维导图,脑图,拓扑图
CREATE_NAVIGATION | 导航,nav,菜单,标签页,tab,侧边栏,导航树
CREATE_LAYOUT | 布局,layout,分栏,分区,容器,block,panel,div
CREATE_DIALOG | 对话框,弹窗,dialog,modal,模态框,弹出框

// RadChatScene 匹配逻辑
public int matchScore(String userMessage, ChatContext context) {
    int score = 0;
    // 正向关键词：组件、表单、表格、树、图表、页面、布局、导航
    String[] uiContextKeywords = {"组件", "表单", "表格", "树", "图表", ...};
    // 动作关键词：生成、创建、构建、做一个、帮我做
    String[] actionKeywords = {"生成", "创建", "构建", "做一个", ...};

    for (String kw : uiContextKeywords) {
        if (lowerMsg.contains(kw)) score += 2;
    }
    for (String kw : actionKeywords) {
        if (lowerMsg.contains(kw)) score += 1;
    }

    // 负向关键词：流程、审批、bpm、技能、skill
    String[] negativeKeywords = {"流程", "审批", "节点", "bpm", "技能", ...};
    for (String kw : negativeKeywords) {
        if (lowerMsg.contains(kw)) score -= 5;
    }
    return score;
}

NlpIntentRecognizer → ruleBasedRecognize
匹配关键词："表单" → CREATE_FORM (confidence: 0.7)

ChatSceneRouter → RadChatScene.matchScore
"表单" +2, "创建" +1 → score=3 → 路由到 RAD 场景

String prompt = promptEngine.buildSystemPrompt(scene, context);
// 加载 rad.md + rad-detail.md + knowledge-injection.md + output-spec.md

{
    "tool_calls": [{
        "function": {
            "name": "nlp_build_component",
            "arguments": "{\"description\": \"员工请假审批表单...\"}"
        }
    }]
}

// FormComponentBuilder.build()
// 1. 根据 description 提取字段：请假类型、开始日期、结束日期、请假天数、请假事由
// 2. 生成 GenJson 模板
// 3. 调用 CodeGenerator 生成 .cls 文件
// 4. 返回 genJson + designerJson

SPA.fe("onNlpBuildComplete", [{
    moduleName: "LeaveRequestForm",
    componentType: "Form",
    genJson: { /* 完整的 .cls JSON */ },
    designerJson: { /* 设计器渲染用 JSON */ }
}]);
// → 设计器立即渲染出表单