strategy-panel 1.0.1 → 1.0.2

package/es/{pages/rx-models/graph-core.js → packages/graph-core/index.js}

@@ -31,7 +31,6 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
 import { Graph } from '@antv/x6';
 import { BehaviorSubject, fromEventPattern, merge } from 'rxjs';
 import { debounceTime, map, tap, scan } from 'rxjs/operators';
-import "./graph-core.less";
 
 function setCellsSelectedStatus(cells, selected) {
   cells.forEach(function (cell) {
@@ -57,31 +56,51 @@ export var GraphCore = /*#__PURE__*/function () {
   // 节点移动的订阅
   // 删除节点或连线的订阅
   // 复制节点的订阅
+  // 撤销
   function GraphCore(options) {
     var _this = this;
 
     _classCallCheck(this, GraphCore);
 
-    this.wrapper = void 0;
-    this.container = void 0;
-    this.nodeMetas = void 0;
-    this.edgeMetas = void 0;
-    this.options = void 0;
-    this.graph = void 0;
-    this.contextMenuInfo$ = new BehaviorSubject(null);
-    this.selectedNodes$ = new BehaviorSubject([]);
-    this.copyableNodeId$ = new BehaviorSubject('');
-    this.windowResizeSub = void 0;
-    this.contextMenuSub = void 0;
-    this.nodeContextMenuSub = void 0;
-    this.selectNodeSub = void 0;
-    this.connectNodeSub = void 0;
-    this.connectionRemovedSub = void 0;
-    this.moveNodesSub = void 0;
-    this.deleteNodeOrEdgeSub = void 0;
-    this.copyNodeSub = void 0;
-
-    this.resizeGraph = function () {
+    _defineProperty(this, "wrapper", void 0);
+
+    _defineProperty(this, "container", void 0);
+
+    _defineProperty(this, "nodeMetas", void 0);
+
+    _defineProperty(this, "edgeMetas", void 0);
+
+    _defineProperty(this, "options", void 0);
+
+    _defineProperty(this, "graph", void 0);
+
+    _defineProperty(this, "contextMenuInfo$", new BehaviorSubject(null));
+
+    _defineProperty(this, "selectedNodes$", new BehaviorSubject([]));
+
+    _defineProperty(this, "copyableNodeId$", new BehaviorSubject(''));
+
+    _defineProperty(this, "windowResizeSub", void 0);
+
+    _defineProperty(this, "contextMenuSub", void 0);
+
+    _defineProperty(this, "nodeContextMenuSub", void 0);
+
+    _defineProperty(this, "selectNodeSub", void 0);
+
+    _defineProperty(this, "connectNodeSub", void 0);
+
+    _defineProperty(this, "connectionRemovedSub", void 0);
+
+    _defineProperty(this, "moveNodesSub", void 0);
+
+    _defineProperty(this, "deleteNodeOrEdgeSub", void 0);
+
+    _defineProperty(this, "copyNodeSub", void 0);
+
+    _defineProperty(this, "undoNode", void 0);
+
+    _defineProperty(this, "resizeGraph", function () {
       var graph = _this.graph,
           wrapper = _this.wrapper;
 
@@ -92,104 +111,104 @@ export var GraphCore = /*#__PURE__*/function () {
           graph.resize(width, height);
         });
       }
-    };
+    });
 
-    this.addNode = function (nodeMeta) {
+    _defineProperty(this, "addNode", function (nodeMeta) {
       var _this$nodeMetas;
 
       (_this$nodeMetas = _this.nodeMetas) === null || _this$nodeMetas === void 0 ? void 0 : _this$nodeMetas.push(nodeMeta);
       return _this.renderNode(nodeMeta);
-    };
+    });
 
-    this.addEdge = function (edgeMeta) {
+    _defineProperty(this, "addEdge", function (edgeMeta) {
       var _this$edgeMetas;
 
       (_this$edgeMetas = _this.edgeMetas) === null || _this$edgeMetas === void 0 ? void 0 : _this$edgeMetas.push(edgeMeta);
       return _this.renderEdge(edgeMeta);
-    };
+    });
 
-    this.getNodeById = function (nodeId) {
+    _defineProperty(this, "getNodeById", function (nodeId) {
       var _this$graph;
 
       var node = (_this$graph = _this.graph) === null || _this$graph === void 0 ? void 0 : _this$graph.getCellById(nodeId);
 
-      if (node === null || node === void 0 ? void 0 : node.isNode()) {
+      if (node !== null && node !== void 0 && node.isNode()) {
         return node;
       }
 
       return undefined;
-    };
+    });
 
-    this.getNodes = function () {
+    _defineProperty(this, "getNodes", function () {
       var _this$graph2;
 
       return ((_this$graph2 = _this.graph) === null || _this$graph2 === void 0 ? void 0 : _this$graph2.getNodes()) || [];
-    };
+    });
 
-    this.getEdgeById = function (nodeId) {
+    _defineProperty(this, "getEdgeById", function (nodeId) {
       var _this$graph3;
 
       var edge = (_this$graph3 = _this.graph) === null || _this$graph3 === void 0 ? void 0 : _this$graph3.getCellById(nodeId);
 
-      if (edge === null || edge === void 0 ? void 0 : edge.isEdge()) {
+      if (edge !== null && edge !== void 0 && edge.isEdge()) {
         return edge;
       }
 
       return undefined;
-    };
+    });
 
-    this.getEdges = function () {
+    _defineProperty(this, "getEdges", function () {
       var _this$graph4;
 
       return ((_this$graph4 = _this.graph) === null || _this$graph4 === void 0 ? void 0 : _this$graph4.getEdges()) || [];
-    };
+    });
 
-    this.getCellById = function (cellId) {
+    _defineProperty(this, "getCellById", function (cellId) {
       var _this$graph5;
 
       var cell = (_this$graph5 = _this.graph) === null || _this$graph5 === void 0 ? void 0 : _this$graph5.getCellById(cellId);
 
-      if ((cell === null || cell === void 0 ? void 0 : cell.isNode()) || (cell === null || cell === void 0 ? void 0 : cell.isEdge())) {
+      if (cell !== null && cell !== void 0 && cell.isNode() || cell !== null && cell !== void 0 && cell.isEdge()) {
         return cell;
       }
 
       return undefined;
-    };
+    });
 
-    this.getCells = function () {
+    _defineProperty(this, "getCells", function () {
       var _this$graph6;
 
       return ((_this$graph6 = _this.graph) === null || _this$graph6 === void 0 ? void 0 : _this$graph6.getCells()) || [];
-    };
+    });
 
-    this.updateNodeById = function (nodeId, handler) {
+    _defineProperty(this, "updateNodeById", function (nodeId, handler) {
       handler(_this.getNodeById(nodeId));
-    };
+    });
 
-    this.updateNodes = function (handler) {
+    _defineProperty(this, "updateNodes", function (handler) {
       handler(_this.getNodes());
-    };
+    });
 
-    this.updateEdgeById = function (edgeId, handler) {
+    _defineProperty(this, "updateEdgeById", function (edgeId, handler) {
       var _this$graph7;
 
       var edge = (_this$graph7 = _this.graph) === null || _this$graph7 === void 0 ? void 0 : _this$graph7.getCellById(edgeId);
 
-      if (edge === null || edge === void 0 ? void 0 : edge.isEdge()) {
+      if (edge !== null && edge !== void 0 && edge.isEdge()) {
         handler(edge);
       } else {
         handler(undefined);
       }
-    };
+    });
 
-    this.updateEdges = function (handler) {
+    _defineProperty(this, "updateEdges", function (handler) {
       var _this$graph8;
 
       var edges = ((_this$graph8 = _this.graph) === null || _this$graph8 === void 0 ? void 0 : _this$graph8.getEdges()) || [];
       handler(edges);
-    };
+    });
 
-    this.deleteNodes = function (nodes) {
+    _defineProperty(this, "deleteNodes", function (nodes) {
       var _this$graph9;
 
       var target = [].concat(nodes); // @ts-ignore
@@ -198,9 +217,9 @@ export var GraphCore = /*#__PURE__*/function () {
         return !target.includes(nodeMeta.id);
       });
       (_this$graph9 = _this.graph) === null || _this$graph9 === void 0 ? void 0 : _this$graph9.removeCells(target);
-    };
+    });
 
-    this.deleteEdges = function (edges) {
+    _defineProperty(this, "deleteEdges", function (edges) {
       var _this$graph10;
 
       var target = [].concat(edges);
@@ -212,13 +231,13 @@ export var GraphCore = /*#__PURE__*/function () {
         return !targetIds.includes(edgeMeta.id);
       });
       (_this$graph10 = _this.graph) === null || _this$graph10 === void 0 ? void 0 : _this$graph10.removeCells(target);
-    };
+    });
 
-    this.clearContextMenuInfo = function () {
+    _defineProperty(this, "clearContextMenuInfo", function () {
       _this.contextMenuInfo$.next(null);
-    };
+    });
 
-    this.zoom = function (factor) {
+    _defineProperty(this, "zoom", function (factor) {
       if (typeof factor === 'number') {
         var _this$graph11;
 
@@ -235,9 +254,9 @@ export var GraphCore = /*#__PURE__*/function () {
         (_this$graph13 = _this.graph) === null || _this$graph13 === void 0 ? void 0 : _this$graph13.scale(1);
         (_this$graph14 = _this.graph) === null || _this$graph14 === void 0 ? void 0 : _this$graph14.centerContent();
       }
-    };
+    });
 
-    this.toggleSelectionEnabled = function (enabled) {
+    _defineProperty(this, "toggleSelectionEnabled", function (enabled) {
       var graph = _this.graph;
 
       if (graph) {
@@ -251,9 +270,9 @@ export var GraphCore = /*#__PURE__*/function () {
           graph.disableRubberband(); // graph.scroller.widget?.setCursor('grab', { silent: true })
         }
       }
-    };
+    });
 
-    this.selectNodes = function (ids) {
+    _defineProperty(this, "selectNodes", function (ids) {
       var graph = _this.graph;
 
       if (graph) {
@@ -268,37 +287,37 @@ export var GraphCore = /*#__PURE__*/function () {
           graph.scrollToCell(cell);
         }
       }
-    };
+    });
 
-    this.unSelectNode = function () {
+    _defineProperty(this, "unSelectNode", function () {
       var graph = _this.graph;
 
       if (graph) {
         graph.cleanSelection();
       }
-    };
+    });
 
-    this.redo = function () {
+    _defineProperty(this, "redo", function () {
       var graph = _this.graph;
 
       if (graph) {
         graph.redo();
       }
-    };
+    });
 
-    this.undo = function () {
+    _defineProperty(this, "undo", function () {
       var graph = _this.graph;
 
       if (graph) {
         graph.undo();
       }
-    };
+    });
 
-    this.setCopyableNodeId = function (id) {
+    _defineProperty(this, "setCopyableNodeId", function (id) {
       _this.copyableNodeId$.next(id);
-    };
+    });
 
-    this.throwRenderError = function () {
+    _defineProperty(this, "throwRenderError", function () {
       if (!_this.wrapper) {
         throw new Error('Wrapper element is needed.');
       }
@@ -314,7 +333,7 @@ export var GraphCore = /*#__PURE__*/function () {
       if (!_this.edgeMetas) {
         throw new Error('EdgeMetas could not be empty');
       }
-    };
+    });
 
     var _wrapper = options.wrapper,
         container = options.container,
@@ -393,6 +412,7 @@ export var GraphCore = /*#__PURE__*/function () {
     value: function render(params) {
       var _this2 = this;
 
+      console.log('<<<<<<< core >>>>>> render');
       this.setMeta(params);
 
       if (this.isMetaValid) {
@@ -489,6 +509,9 @@ export var GraphCore = /*#__PURE__*/function () {
         }, function (handler) {
           graph.off('edge:connected', handler);
         }).subscribe(function (args) {
+          // TODO connectNode
+          console.log('<<<<<<< core >>>>>> connectNode', args);
+
           _this2.onConnectNode(args);
         }); // 处理连线删除事件
 
@@ -496,7 +519,8 @@ export var GraphCore = /*#__PURE__*/function () {
           graph.on('edge:removed', handler);
         }, function (handler) {
           graph.off('edge:removed', handler);
-        }).subscribe(function (args) {
+        } // eslint-disable-next-line consistent-return
+        ).subscribe(function (args) {
           _this2.onConnectionRemoved(args);
         }); // 处理节点移动事件
 
@@ -562,6 +586,14 @@ export var GraphCore = /*#__PURE__*/function () {
             nodes: selectedNodes,
             edges: selectedEdges
           });
+        }); // 处理删除节点或连线事件
+
+        this.undoNode = fromEventPattern(function (handler) {
+          graph.bindKey(['ctrl+z'], handler);
+        }, function () {
+          graph.unbindKey(['ctrl+z']);
+        }).subscribe(function () {
+          graph.undo();
         }); // 处理节点复制事件
 
         this.copyNodeSub = fromEventPattern(function (handler) {
@@ -587,7 +619,7 @@ export var GraphCore = /*#__PURE__*/function () {
           switch (action) {
             case 'command+c':
             case 'ctrl+c':
-              if (selectedCells === null || selectedCells === void 0 ? void 0 : selectedCells.length) {
+              if (selectedCells !== null && selectedCells !== void 0 && selectedCells.length) {
                 _this2.setCopyableNodeId(selectedCells[0].id); // 当前只支持单节点的复制粘贴
 
               }
@@ -613,20 +645,20 @@ export var GraphCore = /*#__PURE__*/function () {
   }, {
     key: "renderNode",
     value: function renderNode(nodeMeta) {
-      console.log('renderNode => ', nodeMeta);
+      console.log('<<<<<<< core >>>>>> renderNode => ', nodeMeta);
       return this.graph.addNode(nodeMeta);
     }
   }, {
     key: "renderEdge",
     value: function renderEdge(edgeMeta) {
-      console.log('renderEdge => ', edgeMeta);
+      console.log('<<<<<<< core >>>>>> renderEdge => ', edgeMeta);
       return this.graph.addEdge(edgeMeta);
     }
   }, {
     key: "afterLayout",
     value: function afterLayout() {
       if (process.env.NODE_ENV === 'development') {
-        console.log('[GraphCore] call afterLayout');
+        console.log('<<<<<<< core >>>>>> [GraphCore] call afterLayout');
       }
     }
   }, {
@@ -638,14 +670,14 @@ export var GraphCore = /*#__PURE__*/function () {
     key: "onContextMenu",
     value: function onContextMenu(data) {
       if (process.env.NODE_ENV === 'development') {
-        console.log('[GraphCore] context menu info:', data);
+        console.log('<<<<<<< core >>>>>> [GraphCore] context menu info:', data);
       }
     }
   }, {
     key: "onNodeContextMenu",
     value: function onNodeContextMenu(data) {
       if (process.env.NODE_ENV === 'development') {
-        console.log('[GraphCore] context menu info:', data);
+        console.log('<<<<<<< core >>>>>> [GraphCore] context menu info:', data);
       }
     }
   }, {
@@ -654,35 +686,35 @@ export var GraphCore = /*#__PURE__*/function () {
       this.selectedNodes$.next(nodes);
 
       if (process.env.NODE_ENV === 'development') {
-        console.log('[GraphCore] select nodes:', nodes);
+        console.log('<<<<<<< core >>>>>> [GraphCore] select nodes:', nodes);
       }
     }
   }, {
     key: "onConnectNode",
     value: function onConnectNode(args) {
       if (process.env.NODE_ENV === 'development') {
-        console.log('[GraphCore] connect nodes:', args);
+        console.log('<<<<<<< core >>>>>> [GraphCore] connect nodes:', args);
       }
     }
   }, {
     key: "onConnectionRemoved",
     value: function onConnectionRemoved(args) {
       if (process.env.NODE_ENV === 'development') {
-        console.log('[GraphCore] delete connection:', args);
+        console.log('<<<<<<< core >>>>>> [GraphCore] delete connection:', args);
       }
     }
   }, {
     key: "onMoveNodeStart",
     value: function onMoveNodeStart(args) {
       if (process.env.NODE_ENV === 'development') {
-        console.log('[GraphCore] move nodes start:', args);
+        console.log('<<<<<<< core >>>>>> [GraphCore] move nodes start:', args);
       }
     }
   }, {
     key: "onMoveNodes",
     value: function onMoveNodes(args) {
       if (process.env.NODE_ENV === 'development') {
-        console.log('[GraphCore] move nodes:', args);
+        console.log('<<<<<<< core >>>>>> [GraphCore] move nodes:', args);
       }
     } // 按下删除键的回调，默认参数为当前选中的节点和边
 
@@ -690,7 +722,7 @@ export var GraphCore = /*#__PURE__*/function () {
     key: "onDeleteNodeOrEdge",
     value: function onDeleteNodeOrEdge(args) {
       if (process.env.NODE_ENV === 'development') {
-        console.log('[GraphCore] delete nodes or edge:', args);
+        console.log('<<<<<<< core >>>>>> [GraphCore] delete nodes or edge:', args);
       }
     } // 校验节点是否可复制，为 true 则可被用于复制
 
@@ -698,7 +730,7 @@ export var GraphCore = /*#__PURE__*/function () {
     key: "validateNodeCopyable",
     value: function validateNodeCopyable(node) {
       if (process.env.NODE_ENV === 'development') {
-        console.log('[GraphCore] validate nodes copyable:', node);
+        console.log('<<<<<<< core >>>>>> [GraphCore] validate nodes copyable:', node);
       }
 
       return true;
@@ -708,7 +740,7 @@ export var GraphCore = /*#__PURE__*/function () {
     key: "onCopyNode",
     value: function onCopyNode(copyNode) {
       if (process.env.NODE_ENV === 'development') {
-        console.log('[GraphCore] copy nodes:', copyNode);
+        console.log('<<<<<<< core >>>>>> [GraphCore] copy nodes:', copyNode);
       }
     }
     /* 以下为主动触发的方法 */

package/es/packages/graph-core/typing.d.ts

@@ -0,0 +1,107 @@
+import type { EdgeView } from '@antv/x6';
+
+// 实验
+export namespace NExperiment {
+  export interface Experiment {
+    description: string;
+    name: string;
+    id: number;
+    gmtCreate: string;
+  }
+}
+
+// 实验图
+export namespace NExperimentGraph {
+  export interface ExperimentGraph {
+    nodes: Node[];
+    groups: Group[];
+    links: Link[];
+  }
+
+  export interface ModalParams {
+    type: string;
+    experimentId: string;
+    nodeInstanceId?: number;
+    node?: Node;
+    ctx?: any;
+  }
+
+  export interface ContextMenuInfo {
+    type: 'edge' | 'graph';
+    data: EdgeView.PositionEventArgs<any>;
+  }
+
+  export interface Node {
+    outPorts: OutPort[];
+    inPorts: InPort[];
+    positionX: number;
+    positionY: number;
+    codeName?: string;
+    category?: string;
+    name: string;
+    id: string;
+    nodeInstanceId?: number;
+    groupId?: number;
+    status?: number;
+  }
+
+  export interface Port {
+    sequence: number;
+    id: string;
+    description?: string;
+  }
+
+  export type OutPort = Port;
+
+  export type InPort = Port;
+
+  export interface Group {
+    isCollapsed: boolean;
+    experimentId: number;
+    name: string;
+    id: number;
+  }
+
+  export interface Link {
+    inputPortId: number;
+    outputPortId: number;
+    source: number;
+    type?: string;
+    target: number;
+  }
+}
+
+// 执行状态
+export namespace NExecutionStatus {
+  // 当前选中的组件
+  export interface ActiveNode {
+    type: 'legacy' | 'algo';
+    [k: string]: any;
+  }
+
+  export interface ExecDetail {
+    defName: string;
+    quickViewData: QuickViewData;
+    jobStatus: string;
+    percentage: number;
+    lastTime: number;
+    name: string;
+    startTime: string;
+    endTime: string;
+  }
+}
+
+// 模型
+export namespace NModel {
+  export interface Model {
+    codeName: string;
+    isNew: boolean;
+    catId: number;
+    parentId: number;
+    category: string;
+    owner: string;
+    name: string;
+    id: number;
+    type: string;
+  }
+}

package/es/{common/graph-common → packages/graph-model}/connector/index.d.ts

@@ -1 +1 @@
-export {};
+export {};

package/es/packages/graph-model/connector/index.js

@@ -0,0 +1,14 @@
+import { Graph } from '@antv/x6';
+Graph.registerConnector('pai', function (s, t) {
+  var offset = 4;
+  var control = 80;
+  var v1 = {
+    x: s.x,
+    y: s.y + offset + control
+  };
+  var v2 = {
+    x: t.x,
+    y: t.y - offset - control
+  };
+  return "\n       M ".concat(s.x, " ").concat(s.y, "\n       L ").concat(s.x, " ").concat(s.y + offset, "\n       C ").concat(v1.x, " ").concat(v1.y, " ").concat(v2.x, " ").concat(v2.y, " ").concat(t.x, " ").concat(t.y - offset, "\n       L ").concat(t.x, " ").concat(t.y, "\n      ");
+}, true);

package/es/packages/graph-model/edge/edge.less

@@ -0,0 +1,8 @@
+.x6-edge {
+  &-selected,
+  &:hover {
+    path[stroke-width='1'] {
+      stroke-width: 3px;
+    }
+  }
+}

package/es/packages/graph-model/edge/index.d.ts

@@ -0,0 +1,5 @@
+import { Shape } from '@antv/x6';
+import './edge.less';
+export default class BaseEdge extends Shape.Edge {
+    isGroupEdge(): boolean;
+}