使用LayUI与SpringBoot实现Activiti模型创建

最新推荐文章于 2023-05-10 16:24:58 发布

lovoo

最新推荐文章于 2023-05-10 16:24:58 发布

阅读量599

点赞数

分类专栏： # Activiti 文章标签： spring java javascript

本文链接：https://blog.csdn.net/lovoo/article/details/115933620

版权

Activiti 专栏收录该内容

23 篇文章 2 订阅

订阅专栏

1、前端，如图：

在这里插入图片描述

2、添加按钮实现

<script type="text/html" id="headToolbarTpl">
    <button class="layui-btn layui-btn-sm " lay-event="add">创建</button>
 </script>
table.on('toolbar(' + tableId + ')', function(obj){
            var checkStatus = table.checkStatus(obj.config.id);
            var checkData = checkStatus.data; // 得到选中的数据
            switch(obj.event) {
                case 'add':
                    layer.open({
                        type: 2
                        ,title: '创建模型'
                        ,content: api.workflow.process.create
                        ,maxmin: false
                        ,area: area   // 宽高
                        ,btn: ['确定', '取消']
                        ,yes: function (index, layero) {
                            //点击确认触发 iframe 内容中的按钮提交
                            var submit = layero.find('iframe').contents().find("#kFormSubmit");
                            submit.click();
                        }
                    });
                    break;
   		}
  });

3、添加窗口

在这里插入图片描述

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title th:replace="common/base::pagetitle"></title>
    <link th:replace="common/base::static"/>
    <link rel="stylesheet" th:href="@{/static/css/custom/edit.css}">
</head>
<body>
<div class="layui-form" style="padding: 20px">
    <div class="layui-form-item">
        <div class="layui-inline">
            <label class="layui-form-label">模型名称</label>
            <div class="layui-input-inline">
                <input type="text" name="modelName" placeholder="请输入模型名称" lay-verify="required" autocomplete="off" class="layui-input">
            </div>
        </div>
    </div>
    <div class="layui-form-item">
        <div class="layui-inline">
            <label class="layui-form-label">模型KEY</label>
            <div class="layui-input-inline">
                <input type="text" name="modelKey" placeholder="请输入模型KEY" value="modelKey" lay-verify="required" autocomplete="off" class="layui-input">
            </div>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">模型描述</label>
        <div class="layui-input-block">
            <textarea name="description" placeholder="请输入模型描述" class="layui-textarea"></textarea>
        </div>
    </div>

    <div class="layui-form-item layui-hide">
        <input type="button" lay-submit="" lay-filter="kFormSubmit" id="kFormSubmit" value="确认添加">
    </div>
</div>

<script th:replace="common/base::context"></script>
<script th:replace="common/base::mainjs"></script>
<script>
    layui.use(['form', 'laydate'], function () {
        var $ = layui.$, form = layui.form, laydate = layui.laydate;
        //监听提交
        form.on('submit(kFormSubmit)', function(data){
            var field = data.field; //获取提交的字段
            var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
            //提交 Ajax 成功后，关闭当前弹层并重载表格
            $.ajax({
                type: req.type.post,
                url: api.workflow.process.save,
                data: field,
                async: false,
                success: function (r) {
                    if (r.code === req.status.ok) {
                        // 重载表格
                        parent.layui.table.reload('kContentTable');
                        parent.layer.close(index); //再执行关闭
                    } else {
                        adminKit.errorMsg(r.msg);
                    }
                }
            });
        });
    })
</script>
</body>
</html>

四、后台控制层

@RequiresPermissions("workflow:process:add")
    @PostMapping(value = "/model/save")
    public R saveModel(ModelVO modelVO) {
        final String modelId = workFlowService.create(modelVO);
        return R.ok(modelId);
    }

五、实现层

@Override
    public String create(ModelVO modelVO) {
        ObjectNode editorNode = objectMapper.createObjectNode();
        editorNode.put("id", "canvas");
        editorNode.put("resourceId", "canvas");
        ObjectNode stencilSetNode = objectMapper.createObjectNode();
        stencilSetNode.put("namespace", "http://b3mn.org/stencilset/bpmn2.0#");
        editorNode.put("stencilset", stencilSetNode);
        Model model = repositoryService.newModel();

        ObjectNode modelObjectNode = objectMapper.createObjectNode();
        modelObjectNode.put(ModelDataJsonConstants.MODEL_NAME, modelVO.getModelName());
        modelObjectNode.put(ModelDataJsonConstants.MODEL_REVISION, 1);
        modelObjectNode.put(ModelDataJsonConstants.MODEL_DESCRIPTION, modelVO.getDescription());
        model.setMetaInfo(modelObjectNode.toString());
        model.setName(modelVO.getModelName());
        model.setKey(modelVO.getModelKey());
        log.debug("editorNode.toString() = {}", editorNode.toString());
        // 保存模型
        repositoryService.saveModel(model);
        repositoryService.addModelEditorSource(model.getId(), editorNode.toString().getBytes(StandardCharsets.UTF_8));
        return model.getId();
    }