代码拉取完成，页面将自动刷新
自定义流程节点组件，您可以用它实现自定义流程、组织架构等等
https://flow.17xunle.com
账号：13600000000
密码：admin123456
.png)
以及自定义节点的内容
layui.config({
base: './lib/layui_exts/',
}).extend({
flowNode: "flowNode",
}).use(['flowNode'], function () {
let flowNode = layui.flowNode
});
let flowNodeObj = flowNode.render({
el:'#flow_nodes',//要输出到的目标元素
data:[],//节点数据
nodeContent: function(node){
//参数为当前节点数据
return node.title
},//自定义节点内容
});
flowNodeObj.reload(nodes)
[
{"id":1,
"pid":0,//父级节点id
"title":"开始",//节点标题，可自定义
"type":1,//节点类型：1开始节点，2结束节点（舍弃），3普通节点，4收敛节点
"children":[],//子节点，决定节点的分支情况，每个子节点结构与此相同
"convergent":{},//收敛节点，决定了多分支的合并效果，一个节点只能包含一个收敛节点，结构与此相同
}
]
重要一点，将收敛节点父级设置与分支开始节点的父级一致，其他后续补充...
[
{
"id":1,
"flow_id":1,
"pid":0,
"title":"开始",
"type":1,
"created_at":"2022-07-09 07:49:40",
"updated_at":"2022-07-09 07:49:40",
"sort":1,
"handler_id":0,
"aging":0,
"desc":"",
"children":[
{
"id":2,
"flow_id":1,
"pid":1,
"title":"节点1-1",
"type":3,
"created_at":"2022-07-09 07:49:56",
"updated_at":"2022-07-09 07:50:18",
"sort":0,
"handler_id":0,
"aging":0,
"desc":"",
"children":[
{
"id":9,
"flow_id":1,
"pid":2,
"title":"节点1-1-1",
"type":3,
"created_at":"2022-07-14 09:31:37",
"updated_at":"2022-07-14 09:31:37",
"sort":0,
"handler_id":0,
"aging":0,
"desc":"",
"children":[
],
"convergent":null
},
{
"id":10,
"flow_id":1,
"pid":2,
"title":"节点1-1-2",
"type":3,
"created_at":"2022-07-14 09:31:53",
"updated_at":"2022-07-14 09:31:53",
"sort":0,
"handler_id":0,
"aging":0,
"desc":"",
"children":[
],
"convergent":null
}
],
"convergent":null
},
{
"id":3,
"flow_id":1,
"pid":1,
"title":"节点1-2",
"type":3,
"created_at":"2022-07-09 07:50:10",
"updated_at":"2022-07-09 07:50:10",
"sort":0,
"handler_id":0,
"aging":0,
"desc":"",
"children":[
{
"id":5,
"flow_id":1,
"pid":3,
"title":"节点1-2-1",
"type":3,
"created_at":"2022-07-09 07:50:53",
"updated_at":"2022-07-09 07:50:53",
"sort":0,
"handler_id":0,
"aging":0,
"desc":"",
"children":[
],
"convergent":null
},
{
"id":6,
"flow_id":1,
"pid":3,
"title":"节点1-2-2",
"type":3,
"created_at":"2022-07-09 07:51:04",
"updated_at":"2022-07-09 07:51:04",
"sort":0,
"handler_id":0,
"aging":0,
"desc":"",
"children":[
],
"convergent":null
}
],
"convergent":{
"id":7,
"flow_id":1,
"pid":3,
"title":"节点1-2-3",
"type":4,
"created_at":"2022-07-09 07:51:24",
"updated_at":"2022-07-09 07:51:24",
"sort":0,
"handler_id":0,
"aging":0,
"desc":"",
"children":[
{
"id":8,
"flow_id":1,
"pid":7,
"title":"节点2-1",
"type":3,
"created_at":"2022-07-14 09:30:54",
"updated_at":"2022-07-14 09:30:54",
"sort":0,
"handler_id":0,
"aging":0,
"desc":"",
"children":[
],
"convergent":null
}
],
"convergent":null
}
}
],
"convergent":{
"id":4,
"flow_id":1,
"pid":1,
"title":"结束",
"type":4,
"created_at":"2022-07-09 07:50:36",
"updated_at":"2022-07-14 09:30:33",
"sort":0,
"handler_id":0,
"aging":0,
"desc":"",
"children":[
],
"convergent":null
}
}
]
此处可能存在不合适展示的内容，页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容，可点击提交进行申诉，我们将尽快为您处理。
马建仓 AI 助手
