好了，言归正传，开始讲思路与功能点：
首先，我需要使用一个类似于绘制前端动态图的方式绘制一张审批流程图，我需要保存当前绘制审批流程图的相关点位，对当前节点进行分类，是属于开始结束类还是步骤类，以及使用不同代码区分当前步骤节点，便于后期封装接口，这个后期再讲，上图：
f7ea199c07ac6ecf496e551fdada7be.png (39.02 KB, 下载次数: 0)
下载附件
2024-1-10 21:26 上传
2.png (43.58 KB, 下载次数: 0)
下载附件
2024-1-10 21:20 上传
3.png (50.33 KB, 下载次数: 0)
下载附件
2024-1-10 21:20 上传
4.png (26.18 KB, 下载次数: 0)
下载附件
2024-1-10 21:20 上传
5.png (22.34 KB, 下载次数: 0)
下载附件
2024-1-10 21:20 上传
呃，图片咋贴出来这么chou,先将就着看吧。。。
整个审批流引擎一共使用了12张表，包括两个完全不同的申请单，两个审批流审核，审批节点记录表，审批记录表等；
这个代码粘贴的太丑了，为啥不能直接上小方块呢？
[m_shl_code=python,true] function init() {
var $ = go.GraphObject.make; // for conciseness in defining template
myDiagram =
$(go.Diagram, "myDiagramDiv", // must name or refer to the DIV HTML element
{
"LinkDrawn": showLinkLabel, // this DiagramEvent listener is defined below
"LinkRelinked": showLinkLabel,
"undoManager.isEnabled": true // enable undo & redo
});
myDiagram.addDiagramListener("Modified", function(e) {
var button = document.getElementById("SaveButton");
if (button) button.disabled = !myDiagram.isModified;
var idx = document.title.indexOf("*");
if (myDiagram.isModified) {
if (idx = 0) document.title = document.title.substr(0, idx);
}
});
function nodeStyle() {
return [
new go.Binding("location", "loc", go.Point.parse).makeTwoWay(go.Point.stringify),
{
locationSpot: go.Spot.Center
}
];
}
function makePort(name, align, spot, output, input) {
var horizontal = align.equals(go.Spot.Top) || align.equals(go.Spot.Bottom);
return $(go.Shape,
{
fill: "transparent", // changed to a color in the mouseEnter event handler
strokeWidth: 0, // no stroke
width: horizontal ? NaN : 8, // if not stretching horizontally, just 8 wide
height: !horizontal ? NaN : 8, // if not stretching vertically, just 8 tall
alignment: align, // align the port on the main Shape
stretch: (horizontal ? go.GraphObject.Horizontal : go.GraphObject.Vertical),
portId: name, // declare this object to be a "port"
fromSpot: spot, // declare where links may connect at this port
fromLinkable: output, // declare whether the user may draw links from here
toSpot: spot, // declare where links may connect at this port
toLinkable: input, // declare whether the user may draw links to here
cursor: "pointer", // show a different cursor to indicate potential link point
mouseEnter: function(e, port) { // the PORT argument will be this Shape
if (!e.diagram.isReadOnly) port.fill = "rgba(255,0,255,0.5)";
},
mouseLeave: function(e, port) {
port.fill = "transparent";
}
});
}
function textStyle() {
return {
font: "bold 11pt Lato, Helvetica, Arial, sans-serif",
stroke: "#F8F8F8"
}
}
function makeButton(text, action, visiblePredicate) {
return $("ContextMenuButton",
$(go.TextBlock, text),
{ click: action },
visiblePredicate ? new go.Binding("visible", "", function(o, e) { return o.diagram ? visiblePredicate(o, e) : false; }).ofObject() : {});
}
var myContextMenu = $("ContextMenu",
makeButton("✰配置✰",
function(e, obj) { // OBJ is this Button
var contextmenu = obj.part; // the Button is in the context menu Adornment
var part = contextmenu.adornedPart; // the adornedPart is the Part that the context menu adorns
if (part instanceof go.Link) alert(linkInfo(part.data));
else if (part instanceof go.Group) alert(groupInfo(contextmenu));
else nodeInfo(part.data);
}),
function isInArray(arr,value){
for(var i = 0; i
