#

Junjie

2024-03-19 eca8b5481ab1c8bad8d031416a9d106585fa429c

 zy-asrs-flow/src/components/Flow/GraphComponent.jsx

@@ -33,27 +33,27 @@

        const graph = ref.current;

        const rect = graph.addNode({
            x: 60,
            y: 60,
            width: 120,
            height: 40,
            label: '订单管理',
            ports: commonGraphPorts,
            attrs: commonGraphAttrs,
            data: initNodeData,
        });
        // const rect = graph.addNode({
        //     x: 60,
        //     y: 60,
        //     width: 120,
        //     height: 40,
        //     label: '订单管理',
        //     ports: commonGraphPorts,
        //     attrs: commonGraphAttrs,
        //     data: initNodeData,
        // });

        const rect2 = graph.addNode({
            x: 240,
            y: 240,
            width: 120,
            height: 40,
            label: '库存管理',
            ports: commonGraphPorts,
            attrs: commonGraphAttrs,
            data: initNodeData,
        });
        // const rect2 = graph.addNode({
        //     x: 240,
        //     y: 240,
        //     width: 120,
        //     height: 40,
        //     label: '库存管理',
        //     ports: commonGraphPorts,
        //     attrs: commonGraphAttrs,
        //     data: initNodeData,
        // });

        graph.use(
            new Snapline({
@@ -84,1342 +84,6 @@
                },
            }),
        )


        graph.fromJSON({
            "cells": [
                {
                    "shape": "edge",
                    "attrs": {
                        "line": {
                            "stroke": "#A2B1C3",
                            "targetMarker": {
                                "name": "block",
                                "width": 12,
                                "height": 8
                            }
                        }
                    },
                    "id": "2475ea4f-f0e3-4b44-add4-7d4950ddea45",
                    "zIndex": 0,
                    "source": {
                        "cell": "71d8bc90-558f-489f-b432-a03d7af27cdc",
                        "port": "port2"
                    },
                    "target": {
                        "cell": "c5798537-a8a0-4d79-bd76-a4f663492126",
                        "port": "port1"
                    },
                    "data": {
                        "codeContent": null,
                        "root": false,
                        "isLogic": false,
                        "logicBool": false,
                        "searchLogicId": 1,
                        "searchLogicBool": true,
                        "searchIndex": 0
                    },
                    "labels": [
                        {
                            "attrs": {
                                "label": {
                                    "text": ""
                                }
                            }
                        }
                    ]
                },
                {
                    "shape": "edge",
                    "attrs": {
                        "line": {
                            "stroke": "#A2B1C3",
                            "targetMarker": {
                                "name": "block",
                                "width": 12,
                                "height": 8
                            }
                        }
                    },
                    "id": "2c3744b4-45ce-44a6-b169-402eaec24174",
                    "zIndex": 0,
                    "source": {
                        "cell": "c5798537-a8a0-4d79-bd76-a4f663492126",
                        "port": "port2"
                    },
                    "target": {
                        "cell": "3ca188b2-9ffe-4528-ba6e-c1568b6d7fe6",
                        "port": "port1"
                    },
                    "data": {
                        "codeContent": null,
                        "root": false,
                        "isLogic": false,
                        "logicBool": false,
                        "searchLogicId": 1,
                        "searchLogicBool": true,
                        "searchIndex": 0
                    },
                    "labels": [
                        {
                            "attrs": {
                                "label": {
                                    "text": ""
                                }
                            }
                        }
                    ]
                },
                {
                    "shape": "edge",
                    "attrs": {
                        "line": {
                            "stroke": "#A2B1C3",
                            "targetMarker": {
                                "name": "block",
                                "width": 12,
                                "height": 8
                            }
                        }
                    },
                    "id": "56181ccf-a41c-4cd8-82d6-e2a4bde31ba9",
                    "zIndex": 0,
                    "source": {
                        "cell": "3ca188b2-9ffe-4528-ba6e-c1568b6d7fe6",
                        "port": "port2"
                    },
                    "target": {
                        "cell": "63db5ce0-b916-44e4-a924-a79b35afe1d1",
                        "port": "port1"
                    },
                    "data": {
                        "codeContent": null,
                        "root": false,
                        "isLogic": false,
                        "logicBool": true,
                        "searchLogicId": 1,
                        "searchLogicBool": true,
                        "searchIndex": 0
                    },
                    "labels": [
                        {
                            "attrs": {
                                "label": {
                                    "text": "true"
                                }
                            }
                        }
                    ]
                },
                {
                    "shape": "edge",
                    "attrs": {
                        "line": {
                            "stroke": "#A2B1C3",
                            "targetMarker": {
                                "name": "block",
                                "width": 12,
                                "height": 8
                            }
                        }
                    },
                    "id": "73ca24ef-e9d4-4f18-9f06-ca49ac65962a",
                    "zIndex": 0,
                    "source": {
                        "cell": "cc993d9b-ce11-409d-92c6-7208682dcc8b",
                        "port": "port4"
                    },
                    "target": {
                        "cell": "06d450fc-474e-4b23-b40d-c89fde446b28",
                        "port": "port3"
                    },
                    "data": {
                        "codeContent": null,
                        "root": false,
                        "isLogic": false,
                        "logicBool": false,
                        "searchLogicId": 1,
                        "searchLogicBool": true,
                        "searchIndex": 0
                    },
                    "labels": [
                        {
                            "attrs": {
                                "label": {
                                    "text": "false"
                                }
                            }
                        }
                    ]
                },
                {
                    "shape": "edge",
                    "attrs": {
                        "line": {
                            "stroke": "#A2B1C3",
                            "targetMarker": {
                                "name": "block",
                                "width": 12,
                                "height": 8
                            }
                        }
                    },
                    "id": "84a3a77c-79e8-4cf8-9bab-a72bbfc77f1d",
                    "zIndex": 0,
                    "source": {
                        "cell": "cc993d9b-ce11-409d-92c6-7208682dcc8b",
                        "port": "port2"
                    },
                    "target": {
                        "cell": "cd9da0a4-5c2d-4f1b-9c51-403b32f1ad51",
                        "port": "port1"
                    },
                    "data": {
                        "codeContent": null,
                        "root": false,
                        "isLogic": false,
                        "logicBool": true,
                        "searchLogicId": 1,
                        "searchLogicBool": true,
                        "searchIndex": 0
                    },
                    "labels": [
                        {
                            "attrs": {
                                "label": {
                                    "text": "true"
                                }
                            }
                        }
                    ]
                },
                {
                    "shape": "edge",
                    "attrs": {
                        "line": {
                            "stroke": "#A2B1C3",
                            "targetMarker": {
                                "name": "block",
                                "width": 12,
                                "height": 8
                            }
                        }
                    },
                    "id": "93d65ae7-f170-466a-92ea-f69614002800",
                    "zIndex": 0,
                    "source": {
                        "cell": "c844f3d1-02a3-47d3-bcb9-51027c1deb1c",
                        "port": "port2"
                    },
                    "target": {
                        "cell": "cc993d9b-ce11-409d-92c6-7208682dcc8b",
                        "port": "port1"
                    },
                    "data": {
                        "codeContent": null,
                        "root": false,
                        "isLogic": false,
                        "logicBool": false,
                        "searchLogicId": 1,
                        "searchLogicBool": true,
                        "searchIndex": 0
                    },
                    "labels": [
                        {
                            "attrs": {
                                "label": {
                                    "text": ""
                                }
                            }
                        }
                    ]
                },
                {
                    "shape": "edge",
                    "attrs": {
                        "line": {
                            "stroke": "#A2B1C3",
                            "targetMarker": {
                                "name": "block",
                                "width": 12,
                                "height": 8
                            }
                        }
                    },
                    "id": "de85103e-80ac-4c88-92de-5bb1a131788c",
                    "zIndex": 0,
                    "source": {
                        "cell": "63db5ce0-b916-44e4-a924-a79b35afe1d1",
                        "port": "port2"
                    },
                    "target": {
                        "cell": "c844f3d1-02a3-47d3-bcb9-51027c1deb1c",
                        "port": "port1"
                    },
                    "data": {
                        "codeContent": null,
                        "root": false,
                        "isLogic": false,
                        "logicBool": false,
                        "searchLogicId": 1,
                        "searchLogicBool": true,
                        "searchIndex": 0
                    },
                    "labels": [
                        {
                            "attrs": {
                                "label": {
                                    "text": ""
                                }
                            }
                        }
                    ]
                },
                {
                    "position": {
                        "x": 60,
                        "y": 60
                    },
                    "size": {
                        "width": 120,
                        "height": 40
                    },
                    "attrs": {
                        "text": {
                            "text": "订单管理"
                        },
                        "body": {
                            "fill": "#efefef",
                            "stroke": "#4d4d4d",
                            "strokeWidth": 2,
                            "refD": "M 50 0 L 100 50 L 50 100 L 0 50 Z"
                        }
                    },
                    "visible": true,
                    "shape": "rect",
                    "id": "a4962b5d-6ef0-4217-bbf8-742652ffc0ee",
                    "data": {
                        "codeContent": null,
                        "root": false,
                        "isLogic": false,
                        "logicBool": false,
                        "searchLogicId": 1,
                        "searchLogicBool": true,
                        "searchIndex": 0
                    },
                    "zIndex": 1,
                    "ports": {
                        "groups": {
                            "top": {
                                "position": "top",
                                "attrs": {
                                    "circle": {
                                        "r": 5,
                                        "magnet": true,
                                        "stroke": "#5F95FF",
                                        "strokeWidth": 1,
                                        "fill": "#fff",
                                        "style": {
                                            "visibility": "hidden"
                                        }
                                    }
                                }
                            },
                            "bottom": {
                                "position": "bottom",
                                "attrs": {
                                    "circle": {
                                        "r": 5,
                                        "magnet": true,
                                        "stroke": "#5F95FF",
                                        "strokeWidth": 1,
                                        "fill": "#fff",
                                        "style": {
                                            "visibility": "hidden"
                                        }
                                    }
                                }
                            },
                            "left": {
                                "position": "left",
                                "attrs": {
                                    "circle": {
                                        "r": 5,
                                        "magnet": true,
                                        "stroke": "#5F95FF",
                                        "strokeWidth": 1,
                                        "fill": "#fff",
                                        "style": {
                                            "visibility": "hidden"
                                        }
                                    }
                                }
                            },
                            "right": {
                                "position": "right",
                                "attrs": {
                                    "circle": {
                                        "r": 5,
                                        "magnet": true,
                                        "stroke": "#5F95FF",
                                        "strokeWidth": 1,
                                        "fill": "#fff",
                                        "style": {
                                            "visibility": "hidden"
                                        }
                                    }
                                }
                            }
                        },
                        "items": [
                            {
                                "id": "port1",
                                "group": "top"
                            },
                            {
                                "id": "port2",
                                "group": "bottom"
                            },
                            {
                                "id": "port3",
                                "group": "left"
                            },
                            {
                                "id": "port4",
                                "group": "right"
                            }
                        ]
                    }
                },
                {
                    "position": {
                        "x": 260,
                        "y": 390
                    },
                    "size": {
                        "width": 120,
                        "height": 40
                    },
                    "attrs": {
                        "text": {
                            "text": "库存管理"
                        },
                        "body": {
                            "fill": "#efefef",
                            "stroke": "#4d4d4d",
                            "strokeWidth": 2,
                            "refD": "M 50 0 L 100 50 L 50 100 L 0 50 Z"
                        }
                    },
                    "visible": true,
                    "shape": "rect",
                    "id": "63db5ce0-b916-44e4-a924-a79b35afe1d1",
                    "data": {
                        "codeContent": "2222",
                        "root": false,
                        "isLogic": false,
                        "logicBool": false,
                        "searchLogicId": 1,
                        "searchLogicBool": true,
                        "searchIndex": 0
                    },
                    "zIndex": 2,
                    "ports": {
                        "groups": {
                            "top": {
                                "position": "top",
                                "attrs": {
                                    "circle": {
                                        "r": 5,
                                        "magnet": true,
                                        "stroke": "#5F95FF",
                                        "strokeWidth": 1,
                                        "fill": "#fff",
                                        "style": {
                                            "visibility": "hidden"
                                        }
                                    }
                                }
                            },
                            "bottom": {
                                "position": "bottom",
                                "attrs": {
                                    "circle": {
                                        "r": 5,
                                        "magnet": true,
                                        "stroke": "#5F95FF",
                                        "strokeWidth": 1,
                                        "fill": "#fff",
                                        "style": {
                                            "visibility": "hidden"
                                        }
                                    }
                                }
                            },
                            "left": {
                                "position": "left",
                                "attrs": {
                                    "circle": {
                                        "r": 5,
                                        "magnet": true,
                                        "stroke": "#5F95FF",
                                        "strokeWidth": 1,
                                        "fill": "#fff",
                                        "style": {
                                            "visibility": "hidden"
                                        }
                                    }
                                }
                            },
                            "right": {
                                "position": "right",
                                "attrs": {
                                    "circle": {
                                        "r": 5,
                                        "magnet": true,
                                        "stroke": "#5F95FF",
                                        "strokeWidth": 1,
                                        "fill": "#fff",
                                        "style": {
                                            "visibility": "hidden"
                                        }
                                    }
                                }
                            }
                        },
                        "items": [
                            {
                                "id": "port1",
                                "group": "top"
                            },
                            {
                                "id": "port2",
                                "group": "bottom"
                            },
                            {
                                "id": "port3",
                                "group": "left"
                            },
                            {
                                "id": "port4",
                                "group": "right"
                            }
                        ]
                    }
                },
                {
                    "position": {
                        "x": 270,
                        "y": 265
                    },
                    "size": {
                        "width": 100,
                        "height": 60
                    },
                    "attrs": {
                        "text": {
                            "text": "逻辑判断1"
                        },
                        "body": {
                            "fill": "#efefef",
                            "stroke": "#4d4d4d",
                            "refD": "M 50 0 L 100 50 L 50 100 L 0 50 Z"
                        }
                    },
                    "visible": true,
                    "shape": "path",
                    "id": "3ca188b2-9ffe-4528-ba6e-c1568b6d7fe6",
                    "data": {
                        "codeContent": "逻辑判断1",
                        "root": false,
                        "isLogic": true,
                        "logicBool": false,
                        "searchLogicId": 1,
                        "searchLogicBool": true,
                        "searchIndex": 0
                    },
                    "zIndex": 3,
                    "ports": {
                        "groups": {
                            "top": {
                                "position": "top",
                                "attrs": {
                                    "circle": {
                                        "r": 5,
                                        "magnet": true,
                                        "stroke": "#5F95FF",
                                        "strokeWidth": 1,
                                        "fill": "#fff",
                                        "style": {
                                            "visibility": "hidden"
                                        }
                                    }
                                }
                            },
                            "bottom": {
                                "position": "bottom",
                                "attrs": {
                                    "circle": {
                                        "r": 5,
                                        "magnet": true,
                                        "stroke": "#5F95FF",
                                        "strokeWidth": 1,
                                        "fill": "#fff",
                                        "style": {
                                            "visibility": "hidden"
                                        }
                                    }
                                }
                            },
                            "left": {
                                "position": "left",
                                "attrs": {
                                    "circle": {
                                        "r": 5,
                                        "magnet": true,
                                        "stroke": "#5F95FF",
                                        "strokeWidth": 1,
                                        "fill": "#fff",
                                        "style": {
                                            "visibility": "hidden"
                                        }
                                    }
                                }
                            },
                            "right": {
                                "position": "right",
                                "attrs": {
                                    "circle": {
                                        "r": 5,
                                        "magnet": true,
                                        "stroke": "#5F95FF",
                                        "strokeWidth": 1,
                                        "fill": "#fff",
                                        "style": {
                                            "visibility": "hidden"
                                        }
                                    }
                                }
                            }
                        },
                        "items": [
                            {
                                "id": "port1",
                                "group": "top"
                            },
                            {
                                "id": "port2",
                                "group": "bottom"
                            },
                            {
                                "id": "port3",
                                "group": "left"
                            },
                            {
                                "id": "port4",
                                "group": "right"
                            }
                        ]
                    }
                },
                {
                    "position": {
                        "x": 300,
                        "y": 30
                    },
                    "size": {
                        "width": 80,
                        "height": 40
                    },
                    "attrs": {
                        "text": {
                            "text": "程序入口"
                        },
                        "body": {
                            "fill": "#efefef",
                            "stroke": "#4d4d4d",
                            "strokeWidth": 2,
                            "refD": "M 50 0 L 100 50 L 50 100 L 0 50 Z"
                        }
                    },
                    "visible": true,
                    "shape": "rect",
                    "id": "71d8bc90-558f-489f-b432-a03d7af27cdc",
                    "data": {
                        "codeContent": null,
                        "root": true,
                        "isLogic": false,
                        "logicBool": false,
                        "searchLogicId": 1,
                        "searchLogicBool": true,
                        "searchIndex": 0
                    },
                    "zIndex": 4,
                    "ports": {
                        "groups": {
                            "top": {
                                "position": "top",
                                "attrs": {
                                    "circle": {
                                        "r": 5,
                                        "magnet": true,
                                        "stroke": "#5F95FF",
                                        "strokeWidth": 1,
                                        "fill": "#fff",
                                        "style": {
                                            "visibility": "hidden"
                                        }
                                    }
                                }
                            },
                            "bottom": {
                                "position": "bottom",
                                "attrs": {
                                    "circle": {
                                        "r": 5,
                                        "magnet": true,
                                        "stroke": "#5F95FF",
                                        "strokeWidth": 1,
                                        "fill": "#fff",
                                        "style": {
                                            "visibility": "hidden"
                                        }
                                    }
                                }
                            },
                            "left": {
                                "position": "left",
                                "attrs": {
                                    "circle": {
                                        "r": 5,
                                        "magnet": true,
                                        "stroke": "#5F95FF",
                                        "strokeWidth": 1,
                                        "fill": "#fff",
                                        "style": {
                                            "visibility": "hidden"
                                        }
                                    }
                                }
                            },
                            "right": {
                                "position": "right",
                                "attrs": {
                                    "circle": {
                                        "r": 5,
                                        "magnet": true,
                                        "stroke": "#5F95FF",
                                        "strokeWidth": 1,
                                        "fill": "#fff",
                                        "style": {
                                            "visibility": "hidden"
                                        }
                                    }
                                }
                            }
                        },
                        "items": [
                            {
                                "id": "port1",
                                "group": "top"
                            },
                            {
                                "id": "port2",
                                "group": "bottom"
                            },
                            {
                                "id": "port3",
                                "group": "left"
                            },
                            {
                                "id": "port4",
                                "group": "right"
                            }
                        ]
                    }
                },
                {
                    "position": {
                        "x": 300,
                        "y": 110
                    },
                    "size": {
                        "width": 80,
                        "height": 40
                    },
                    "attrs": {
                        "text": {
                            "text": "常用组件"
                        },
                        "body": {
                            "fill": "#efefef",
                            "stroke": "#4d4d4d",
                            "strokeWidth": 2,
                            "refD": "M 50 0 L 100 50 L 50 100 L 0 50 Z"
                        }
                    },
                    "visible": true,
                    "shape": "rect",
                    "id": "c5798537-a8a0-4d79-bd76-a4f663492126",
                    "data": {
                        "codeContent": "1111",
                        "root": false,
                        "isLogic": false,
                        "logicBool": false,
                        "searchLogicId": 1,
                        "searchLogicBool": true,
                        "searchIndex": 0
                    },
                    "zIndex": 5,
                    "ports": {
                        "groups": {
                            "top": {
                                "position": "top",
                                "attrs": {
                                    "circle": {
                                        "r": 5,
                                        "magnet": true,
                                        "stroke": "#5F95FF",
                                        "strokeWidth": 1,
                                        "fill": "#fff",
                                        "style": {
                                            "visibility": "hidden"
                                        }
                                    }
                                }
                            },
                            "bottom": {
                                "position": "bottom",
                                "attrs": {
                                    "circle": {
                                        "r": 5,
                                        "magnet": true,
                                        "stroke": "#5F95FF",
                                        "strokeWidth": 1,
                                        "fill": "#fff",
                                        "style": {
                                            "visibility": "hidden"
                                        }
                                    }
                                }
                            },
                            "left": {
                                "position": "left",
                                "attrs": {
                                    "circle": {
                                        "r": 5,
                                        "magnet": true,
                                        "stroke": "#5F95FF",
                                        "strokeWidth": 1,
                                        "fill": "#fff",
                                        "style": {
                                            "visibility": "hidden"
                                        }
                                    }
                                }
                            },
                            "right": {
                                "position": "right",
                                "attrs": {
                                    "circle": {
                                        "r": 5,
                                        "magnet": true,
                                        "stroke": "#5F95FF",
                                        "strokeWidth": 1,
                                        "fill": "#fff",
                                        "style": {
                                            "visibility": "hidden"
                                        }
                                    }
                                }
                            }
                        },
                        "items": [
                            {
                                "id": "port1",
                                "group": "top"
                            },
                            {
                                "id": "port2",
                                "group": "bottom"
                            },
                            {
                                "id": "port3",
                                "group": "left"
                            },
                            {
                                "id": "port4",
                                "group": "right"
                            }
                        ]
                    }
                },
                {
                    "position": {
                        "x": 280,
                        "y": 511
                    },
                    "size": {
                        "width": 80,
                        "height": 40
                    },
                    "attrs": {
                        "text": {
                            "text": "常用组件2"
                        },
                        "body": {
                            "fill": "#efefef",
                            "stroke": "#4d4d4d",
                            "strokeWidth": 2,
                            "refD": "M 50 0 L 100 50 L 50 100 L 0 50 Z"
                        }
                    },
                    "visible": true,
                    "shape": "rect",
                    "id": "c844f3d1-02a3-47d3-bcb9-51027c1deb1c",
                    "data": {
                        "codeContent": "常用组件2",
                        "root": false,
                        "isLogic": false,
                        "logicBool": false,
                        "searchLogicId": 1,
                        "searchLogicBool": true,
                        "searchIndex": 0
                    },
                    "zIndex": 6,
                    "ports": {
                        "groups": {
                            "top": {
                                "position": "top",
                                "attrs": {
                                    "circle": {
                                        "r": 5,
                                        "magnet": true,
                                        "stroke": "#5F95FF",
                                        "strokeWidth": 1,
                                        "fill": "#fff",
                                        "style": {
                                            "visibility": "hidden"
                                        }
                                    }
                                }
                            },
                            "bottom": {
                                "position": "bottom",
                                "attrs": {
                                    "circle": {
                                        "r": 5,
                                        "magnet": true,
                                        "stroke": "#5F95FF",
                                        "strokeWidth": 1,
                                        "fill": "#fff",
                                        "style": {
                                            "visibility": "hidden"
                                        }
                                    }
                                }
                            },
                            "left": {
                                "position": "left",
                                "attrs": {
                                    "circle": {
                                        "r": 5,
                                        "magnet": true,
                                        "stroke": "#5F95FF",
                                        "strokeWidth": 1,
                                        "fill": "#fff",
                                        "style": {
                                            "visibility": "hidden"
                                        }
                                    }
                                }
                            },
                            "right": {
                                "position": "right",
                                "attrs": {
                                    "circle": {
                                        "r": 5,
                                        "magnet": true,
                                        "stroke": "#5F95FF",
                                        "strokeWidth": 1,
                                        "fill": "#fff",
                                        "style": {
                                            "visibility": "hidden"
                                        }
                                    }
                                }
                            }
                        },
                        "items": [
                            {
                                "id": "port1",
                                "group": "top"
                            },
                            {
                                "id": "port2",
                                "group": "bottom"
                            },
                            {
                                "id": "port3",
                                "group": "left"
                            },
                            {
                                "id": "port4",
                                "group": "right"
                            }
                        ]
                    }
                },
                {
                    "position": {
                        "x": 270,
                        "y": 620
                    },
                    "size": {
                        "width": 100,
                        "height": 60
                    },
                    "attrs": {
                        "text": {
                            "text": "逻辑判断2"
                        },
                        "body": {
                            "fill": "#efefef",
                            "stroke": "#4d4d4d",
                            "refD": "M 50 0 L 100 50 L 50 100 L 0 50 Z"
                        }
                    },
                    "visible": true,
                    "shape": "path",
                    "id": "cc993d9b-ce11-409d-92c6-7208682dcc8b",
                    "data": {
                        "codeContent": "逻辑判断2",
                        "root": false,
                        "isLogic": true,
                        "logicBool": false,
                        "searchLogicId": 1,
                        "searchLogicBool": true,
                        "searchIndex": 0
                    },
                    "zIndex": 7,
                    "ports": {
                        "groups": {
                            "top": {
                                "position": "top",
                                "attrs": {
                                    "circle": {
                                        "r": 5,
                                        "magnet": true,
                                        "stroke": "#5F95FF",
                                        "strokeWidth": 1,
                                        "fill": "#fff",
                                        "style": {
                                            "visibility": "hidden"
                                        }
                                    }
                                }
                            },
                            "bottom": {
                                "position": "bottom",
                                "attrs": {
                                    "circle": {
                                        "r": 5,
                                        "magnet": true,
                                        "stroke": "#5F95FF",
                                        "strokeWidth": 1,
                                        "fill": "#fff",
                                        "style": {
                                            "visibility": "hidden"
                                        }
                                    }
                                }
                            },
                            "left": {
                                "position": "left",
                                "attrs": {
                                    "circle": {
                                        "r": 5,
                                        "magnet": true,
                                        "stroke": "#5F95FF",
                                        "strokeWidth": 1,
                                        "fill": "#fff",
                                        "style": {
                                            "visibility": "hidden"
                                        }
                                    }
                                }
                            },
                            "right": {
                                "position": "right",
                                "attrs": {
                                    "circle": {
                                        "r": 5,
                                        "magnet": true,
                                        "stroke": "#5F95FF",
                                        "strokeWidth": 1,
                                        "fill": "#fff",
                                        "style": {
                                            "visibility": "hidden"
                                        }
                                    }
                                }
                            }
                        },
                        "items": [
                            {
                                "id": "port1",
                                "group": "top"
                            },
                            {
                                "id": "port2",
                                "group": "bottom"
                            },
                            {
                                "id": "port3",
                                "group": "left"
                            },
                            {
                                "id": "port4",
                                "group": "right"
                            }
                        ]
                    }
                },
                {
                    "position": {
                        "x": 280,
                        "y": 781
                    },
                    "size": {
                        "width": 80,
                        "height": 40
                    },
                    "attrs": {
                        "text": {
                            "text": "常用组件3"
                        },
                        "body": {
                            "fill": "#efefef",
                            "stroke": "#4d4d4d",
                            "strokeWidth": 2,
                            "refD": "M 50 0 L 100 50 L 50 100 L 0 50 Z"
                        }
                    },
                    "visible": true,
                    "shape": "rect",
                    "id": "cd9da0a4-5c2d-4f1b-9c51-403b32f1ad51",
                    "data": {
                        "codeContent": "常用组件3",
                        "root": false,
                        "isLogic": false,
                        "logicBool": false,
                        "searchLogicId": 1,
                        "searchLogicBool": true,
                        "searchIndex": 0
                    },
                    "zIndex": 8,
                    "ports": {
                        "groups": {
                            "top": {
                                "position": "top",
                                "attrs": {
                                    "circle": {
                                        "r": 5,
                                        "magnet": true,
                                        "stroke": "#5F95FF",
                                        "strokeWidth": 1,
                                        "fill": "#fff",
                                        "style": {
                                            "visibility": "hidden"
                                        }
                                    }
                                }
                            },
                            "bottom": {
                                "position": "bottom",
                                "attrs": {
                                    "circle": {
                                        "r": 5,
                                        "magnet": true,
                                        "stroke": "#5F95FF",
                                        "strokeWidth": 1,
                                        "fill": "#fff",
                                        "style": {
                                            "visibility": "hidden"
                                        }
                                    }
                                }
                            },
                            "left": {
                                "position": "left",
                                "attrs": {
                                    "circle": {
                                        "r": 5,
                                        "magnet": true,
                                        "stroke": "#5F95FF",
                                        "strokeWidth": 1,
                                        "fill": "#fff",
                                        "style": {
                                            "visibility": "hidden"
                                        }
                                    }
                                }
                            },
                            "right": {
                                "position": "right",
                                "attrs": {
                                    "circle": {
                                        "r": 5,
                                        "magnet": true,
                                        "stroke": "#5F95FF",
                                        "strokeWidth": 1,
                                        "fill": "#fff",
                                        "style": {
                                            "visibility": "hidden"
                                        }
                                    }
                                }
                            }
                        },
                        "items": [
                            {
                                "id": "port1",
                                "group": "top"
                            },
                            {
                                "id": "port2",
                                "group": "bottom"
                            },
                            {
                                "id": "port3",
                                "group": "left"
                            },
                            {
                                "id": "port4",
                                "group": "right"
                            }
                        ]
                    }
                },
                {
                    "position": {
                        "x": 472,
                        "y": 640
                    },
                    "size": {
                        "width": 80,
                        "height": 40
                    },
                    "attrs": {
                        "text": {
                            "text": "常用组件4"
                        },
                        "body": {
                            "fill": "#efefef",
                            "stroke": "#4d4d4d",
                            "strokeWidth": 2,
                            "refD": "M 50 0 L 100 50 L 50 100 L 0 50 Z"
                        }
                    },
                    "visible": true,
                    "shape": "rect",
                    "id": "06d450fc-474e-4b23-b40d-c89fde446b28",
                    "data": {
                        "codeContent": "常用组件4",
                        "root": false,
                        "isLogic": false,
                        "logicBool": false,
                        "searchLogicId": 1,
                        "searchLogicBool": true,
                        "searchIndex": 0
                    },
                    "zIndex": 9,
                    "ports": {
                        "groups": {
                            "top": {
                                "position": "top",
                                "attrs": {
                                    "circle": {
                                        "r": 5,
                                        "magnet": true,
                                        "stroke": "#5F95FF",
                                        "strokeWidth": 1,
                                        "fill": "#fff",
                                        "style": {
                                            "visibility": "hidden"
                                        }
                                    }
                                }
                            },
                            "bottom": {
                                "position": "bottom",
                                "attrs": {
                                    "circle": {
                                        "r": 5,
                                        "magnet": true,
                                        "stroke": "#5F95FF",
                                        "strokeWidth": 1,
                                        "fill": "#fff",
                                        "style": {
                                            "visibility": "hidden"
                                        }
                                    }
                                }
                            },
                            "left": {
                                "position": "left",
                                "attrs": {
                                    "circle": {
                                        "r": 5,
                                        "magnet": true,
                                        "stroke": "#5F95FF",
                                        "strokeWidth": 1,
                                        "fill": "#fff",
                                        "style": {
                                            "visibility": "hidden"
                                        }
                                    }
                                }
                            },
                            "right": {
                                "position": "right",
                                "attrs": {
                                    "circle": {
                                        "r": 5,
                                        "magnet": true,
                                        "stroke": "#5F95FF",
                                        "strokeWidth": 1,
                                        "fill": "#fff",
                                        "style": {
                                            "visibility": "hidden"
                                        }
                                    }
                                }
                            }
                        },
                        "items": [
                            {
                                "id": "port1",
                                "group": "top"
                            },
                            {
                                "id": "port2",
                                "group": "bottom"
                            },
                            {
                                "id": "port3",
                                "group": "left"
                            },
                            {
                                "id": "port4",
                                "group": "right"
                            }
                        ]
                    }
                }
            ]
        })


        props.initHandle();//通知父组件初始化完成
        return graph;