自定义表单

当需要以非标准方式展示表单时，可以使用自定义流程表单。在建模器中，可以为自定义表单提供一个表单 id，一组表单参数和一组输出。

如果你使用的是另一种 UI 技术（比如，React），那么你需要获取表单的信息，并根据信息渲染表单。可以使用 FormService 接口获取表单信息，接口有如下方法：

  • StartFormData getStartFormData​(String processDefinitionId)

  • TaskFormData getTaskFormData​(String taskId)

如需在 Start process（开始流程） 和 My tasks（我的任务） 界面中展示自定义表单，你需要为自定义表单类型定义 ProcessFormScreenCreator。为了覆盖默认的 ProcessFormScreenCreator，你需要添加 @Order 注解。

我们看看下面示例 MyCustomProcessFormScreenCreator 实现了 ProcessFormScreenCreator：

@Component("samples_MyCustomProcessFormScreenCreator")
@Order(1) (1)
public class MyCustomProcessFormScreenCreator implements ProcessFormScreenCreator {

    @Autowired
    private ScreenBuilders screenBuilders;

    @Override
    public String isApplicableFor() { (2)
        return "custom";
    }

    @Override
    public Screen createStartProcessScreen(CreationContext creationContext) { (3)
        Screen screen = screenBuilders.screen(creationContext.getFrameOwner())
                .withScreenId(creationContext.getFormData().getScreenId())
                .withOpenMode(OpenMode.DIALOG)
                .build();
        if (screen instanceof AcceptsProcessDefinition) { (4)
            ((AcceptsProcessDefinition) screen)
                    .setProcessDefinition(creationContext.getProcessDefinition());
        }
        return screen;
    }

    @Override
    public Screen createUserTaskScreen(CreationContext creationContext) { (5)
        Screen screen = screenBuilders.screen(creationContext.getFrameOwner())
                .withScreenId(creationContext.getFormData().getScreenId())
                .withOpenMode(OpenMode.DIALOG)
                .build();
        if (screen instanceof AcceptsTask) { (6)
            ((AcceptsTask) screen).setTask(creationContext.getTask());
        }
        return screen;
    }
}
1 @Order 注解表示 ProcessForScreenCreator 接口的当前实现会第一个使用。
2 ScreenCreator 用在自定义表单。
3 重写该方法，创建启动流程表单。
4 检查界面是否实现了 AcceptsProcessDefinition 接口，如是，则需要设置 ProcessDefiniton。
5 重写该方法，创建任务流程表单。
6 检查界面是否实现了 AcceptsTask 接口，如是，则需要设置 Task。

AcceptsProcessDefinition 接口示例：

public interface AcceptsProcessDefinition {
    void setProcessDefinition(ProcessDefinition processDefinition);
}

AcceptsTask 接口示例：

public interface AcceptsTask {
    void setTask(Task task);
}

自定义流程启动表单 XML，只有 Start process 按钮：

<window xmlns="http://jmix.io/schema/ui/window"
        caption="msg://customStartForm.caption">
    <layout>
        <button id="startProcessBtn" caption="msg://startProcessBtn.caption"/>
    </layout>
</window>

自定义启动表单界面控制器：

@UiController("smpl_CustomStartForm")
@UiDescriptor("custom-start-form.xml")
public class CustomStartForm extends Screen implements AcceptsProcessDefinition {

    private ProcessDefinition processDefinition;

    @Autowired
    private RuntimeService runtimeService;

    @Subscribe("startProcessBtn")
    public void onStartProcessBtnClick(Button.ClickEvent event) {
        runtimeService.startProcessInstanceById(processDefinition.getId());
        closeWithDefaultAction();
    }

    @Override
    public void setProcessDefinition(ProcessDefinition processDefinition) {
        this.processDefinition = processDefinition;
    }
}

自定义任务表单 XML，只有 Task complete 按钮：

<window xmlns="http://jmix.io/schema/ui/window"
        caption="msg://customTaskForm.caption">
    <layout>
        <button id="completeTaskBtn" caption="msg://completeTaskBtn.caption"/>
    </layout>
</window>

自定义任务表单界面控制器：

@UiController("smpl_CustomTaskForm")
@UiDescriptor("custom-task-form.xml")
public class CustomTaskForm extends Screen implements AcceptsTask {

    private Task task;

    @Autowired
    private TaskService taskService;

    @Subscribe("completeTaskBtn")
    public void onCompleteTaskBtnClick(Button.ClickEvent event) {
        taskService.complete(task.getId());
        closeWithDefaultAction();
    }

    @Override
    public void setTask(Task task) {
        this.task = task;
    }
}