|
|
|
|
@ -1375,7 +1375,7 @@ window.go = go_module;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
function FlowChart({ onCancel, callback }) {
|
|
|
|
|
let myDiagram = (0,_react_17_0_2_react.useRef)().current;
|
|
|
|
|
let myDiagram = (0,_react_17_0_2_react.useRef)();
|
|
|
|
|
let myDiagramDivRef = (0,_react_17_0_2_react.useRef)();
|
|
|
|
|
let myPaletteDivRef = (0,_react_17_0_2_react.useRef)();
|
|
|
|
|
let hidedenContentRef = (0,_react_17_0_2_react.useRef)(false);
|
|
|
|
|
@ -1401,7 +1401,7 @@ function FlowChart({ onCancel, callback }) {
|
|
|
|
|
lightgreen: "#b3e6b3",
|
|
|
|
|
lightred: "#fcbbbd"
|
|
|
|
|
};
|
|
|
|
|
myDiagram = new go_module.Diagram(
|
|
|
|
|
myDiagram.current = new go_module.Diagram(
|
|
|
|
|
myDiagramDivRef.current,
|
|
|
|
|
{
|
|
|
|
|
padding: 20,
|
|
|
|
|
@ -1451,7 +1451,7 @@ function FlowChart({ onCancel, callback }) {
|
|
|
|
|
"undoManager.isEnabled": true
|
|
|
|
|
}
|
|
|
|
|
);
|
|
|
|
|
myDiagram.nodeTemplate = $(
|
|
|
|
|
myDiagram.current.nodeTemplate = $(
|
|
|
|
|
go_module.Node,
|
|
|
|
|
"Auto",
|
|
|
|
|
{
|
|
|
|
|
@ -1498,7 +1498,7 @@ function FlowChart({ onCancel, callback }) {
|
|
|
|
|
new go_module.Binding("stroke", "color")
|
|
|
|
|
)
|
|
|
|
|
);
|
|
|
|
|
myDiagram.nodeTemplate.toolTip = $(
|
|
|
|
|
myDiagram.current.nodeTemplate.toolTip = $(
|
|
|
|
|
"ToolTip",
|
|
|
|
|
// show some detailed information
|
|
|
|
|
$(
|
|
|
|
|
@ -1584,7 +1584,7 @@ function FlowChart({ onCancel, callback }) {
|
|
|
|
|
options || {}
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
myDiagram.nodeTemplate.selectionAdornmentTemplate = $(
|
|
|
|
|
myDiagram.current.nodeTemplate.selectionAdornmentTemplate = $(
|
|
|
|
|
go_module.Adornment,
|
|
|
|
|
"Spot",
|
|
|
|
|
$(go_module.Placeholder, { padding: 10 }),
|
|
|
|
|
@ -1757,14 +1757,14 @@ function FlowChart({ onCancel, callback }) {
|
|
|
|
|
}
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
myDiagram.nodeTemplate.contextMenu = $(
|
|
|
|
|
myDiagram.current.nodeTemplate.contextMenu = $(
|
|
|
|
|
"ContextMenu",
|
|
|
|
|
// $("ContextMenuButton",
|
|
|
|
|
// $(go.TextBlock, 'Move Up', {
|
|
|
|
|
// // Associate the custom command to move the node up
|
|
|
|
|
// click: (e, obj) => {
|
|
|
|
|
// const node = obj.part.adornedPart;
|
|
|
|
|
// myDiagram.commandHandler['MoveNodeUp'].execute(myDiagram);
|
|
|
|
|
// myDiagram.current.commandHandler['MoveNodeUp'].execute(myDiagram.current);
|
|
|
|
|
// }
|
|
|
|
|
// })
|
|
|
|
|
// ),
|
|
|
|
|
@ -1773,7 +1773,7 @@ function FlowChart({ onCancel, callback }) {
|
|
|
|
|
// // Associate the custom command to move the node up
|
|
|
|
|
// click: (e, obj) => {
|
|
|
|
|
// const node = obj.part.adornedPart;
|
|
|
|
|
// myDiagram.commandHandler['moveNodeUpCommand'].execute(myDiagram);
|
|
|
|
|
// myDiagram.current.commandHandler['moveNodeUpCommand'].execute(myDiagram.current);
|
|
|
|
|
// }
|
|
|
|
|
// })
|
|
|
|
|
// ),
|
|
|
|
|
@ -1814,7 +1814,7 @@ function FlowChart({ onCancel, callback }) {
|
|
|
|
|
DarkColorButtons(),
|
|
|
|
|
StrokeOptionsButtons()
|
|
|
|
|
);
|
|
|
|
|
myDiagram.groupTemplate = $(
|
|
|
|
|
myDiagram.current.groupTemplate = $(
|
|
|
|
|
go_module.Group,
|
|
|
|
|
"Spot",
|
|
|
|
|
{
|
|
|
|
|
@ -1874,7 +1874,7 @@ function FlowChart({ onCancel, callback }) {
|
|
|
|
|
new go_module.Binding("stroke", "color")
|
|
|
|
|
)
|
|
|
|
|
);
|
|
|
|
|
myDiagram.groupTemplate.selectionAdornmentTemplate = $(
|
|
|
|
|
myDiagram.current.groupTemplate.selectionAdornmentTemplate = $(
|
|
|
|
|
go_module.Adornment,
|
|
|
|
|
"Spot",
|
|
|
|
|
$(
|
|
|
|
|
@ -1885,13 +1885,13 @@ function FlowChart({ onCancel, callback }) {
|
|
|
|
|
),
|
|
|
|
|
CMButton({ alignment: go_module.Spot.TopRight, alignmentFocus: go_module.Spot.BottomRight })
|
|
|
|
|
);
|
|
|
|
|
myDiagram.groupTemplate.contextMenu = $(
|
|
|
|
|
myDiagram.current.groupTemplate.contextMenu = $(
|
|
|
|
|
"ContextMenu",
|
|
|
|
|
LightFillButtons(),
|
|
|
|
|
DarkColorButtons(),
|
|
|
|
|
StrokeOptionsButtons()
|
|
|
|
|
);
|
|
|
|
|
myDiagram.linkTemplate = $(
|
|
|
|
|
myDiagram.current.linkTemplate = $(
|
|
|
|
|
go_module.Link,
|
|
|
|
|
{
|
|
|
|
|
layerName: "Foreground",
|
|
|
|
|
@ -1979,7 +1979,7 @@ function FlowChart({ onCancel, callback }) {
|
|
|
|
|
new go_module.Binding("stroke", "color")
|
|
|
|
|
)
|
|
|
|
|
);
|
|
|
|
|
myDiagram.linkTemplate.selectionAdornmentTemplate = $(
|
|
|
|
|
myDiagram.current.linkTemplate.selectionAdornmentTemplate = $(
|
|
|
|
|
go_module.Adornment,
|
|
|
|
|
// use a special selection Adornment that does not obscure the link path itself
|
|
|
|
|
$(
|
|
|
|
|
@ -2087,7 +2087,7 @@ function FlowChart({ onCancel, callback }) {
|
|
|
|
|
}
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
myDiagram.linkTemplate.contextMenu = $(
|
|
|
|
|
myDiagram.current.linkTemplate.contextMenu = $(
|
|
|
|
|
"ContextMenu",
|
|
|
|
|
DarkColorButtons(),
|
|
|
|
|
StrokeOptionsButtons(),
|
|
|
|
|
@ -2139,7 +2139,7 @@ function FlowChart({ onCancel, callback }) {
|
|
|
|
|
// must name or refer to the DIV HTML element
|
|
|
|
|
{
|
|
|
|
|
maxSelectionCount: 1,
|
|
|
|
|
// nodeTemplateMap: myDiagram.nodeTemplateMap, // share the templates used by myDiagram
|
|
|
|
|
// nodeTemplateMap: myDiagram.current.nodeTemplateMap, // share the templates used by myDiagram.current
|
|
|
|
|
linkTemplate: (
|
|
|
|
|
// simplify the link template, just in this Palette
|
|
|
|
|
$(
|
|
|
|
|
@ -2237,20 +2237,21 @@ function FlowChart({ onCancel, callback }) {
|
|
|
|
|
)
|
|
|
|
|
);
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
myDiagram.grid = $(
|
|
|
|
|
myDiagram.current.grid = $(
|
|
|
|
|
go_module.Panel,
|
|
|
|
|
"Grid",
|
|
|
|
|
$(go_module.Shape, "LineH", { stroke: "lightgray", strokeWidth: 0.5 }),
|
|
|
|
|
$(go_module.Shape, "LineV", { stroke: "lightgray", strokeWidth: 0.5 })
|
|
|
|
|
);
|
|
|
|
|
myDiagram.grid.visible = true;
|
|
|
|
|
myDiagram.grid.gridCellStroke = "darkgray";
|
|
|
|
|
myDiagram.grid.gridCellStrokeWidth = 1;
|
|
|
|
|
myDiagram.current.grid.visible = true;
|
|
|
|
|
myDiagram.current.grid.gridCellStroke = "darkgray";
|
|
|
|
|
myDiagram.current.grid.gridCellStrokeWidth = 1;
|
|
|
|
|
}, 300);
|
|
|
|
|
return myDiagram;
|
|
|
|
|
window.myDiagrams = myDiagram.current;
|
|
|
|
|
return myDiagram.current;
|
|
|
|
|
}
|
|
|
|
|
const save = () => __async(this, null, function* () {
|
|
|
|
|
var imgs = myDiagram.makeImage();
|
|
|
|
|
var imgs = myDiagram.current.makeImage();
|
|
|
|
|
const res = yield (0,fetch/* default */.ZP)("/api/attachments.json", {
|
|
|
|
|
method: "post",
|
|
|
|
|
body: {
|
|
|
|
|
@ -2278,6 +2279,8 @@ function FlowChart({ onCancel, callback }) {
|
|
|
|
|
footer: null,
|
|
|
|
|
closable: true,
|
|
|
|
|
visible: !!updateModal,
|
|
|
|
|
destroyOnClose: true,
|
|
|
|
|
maskClosable: false,
|
|
|
|
|
getContainer: modalRef.current,
|
|
|
|
|
title: /* @__PURE__ */ _react_17_0_2_react.createElement(row/* default */.Z, null, /* @__PURE__ */ _react_17_0_2_react.createElement(col/* default */.Z, { flex: 1 }, "\u63D2\u5165\u6D41\u7A0B\u56FE"), /* @__PURE__ */ _react_17_0_2_react.createElement(col/* default */.Z, { onClick: () => {
|
|
|
|
|
hidedenContentRef.current = !hidedenContentRef.current;
|
|
|
|
|
|