Commit 25fbe3b8 authored by DarkForst's avatar DarkForst

core 项目结构解读

parent d6620bc0
{
"private": true,
"name": "@antv/x6-app-dag",
"name": "x6-app-dag",
"version": "1.1.6",
"scripts": {
"start": "umi dev",
......@@ -44,6 +44,7 @@
},
"devDependencies": {
"@ant-design/pro-layout": "^5.0.12",
"@umijs/plugin-qiankun": "^2.35.2",
"@umijs/preset-react": "1.x",
"@umijs/test": "^3.2.19",
"lint-staged": "^10.5.3",
......
......@@ -48,6 +48,7 @@ const PopoverContent = ({ status }: { status: StatusObj }) => (
{!status.name && <LoadingOutlined />}
{Object.entries(nodeAtts).map(([key, text]) => {
const value = status[key as keyof StatusObj]
console.log('===============', value)
if (value) {
return (
<li key={key} className={css.item}>
......
......@@ -35,6 +35,16 @@ export class X6DemoGroupEdge extends GuideEdge {
X6DemoGroupEdge.config({
shape: 'X6DemoGroupEdge',
attrs: {
line: {
stroke: '#808080',
strokeWidth: 1,
targetMarker: {
stroke: 'none',
fill: 'none',
},
},
},
})
Edge.registry.register({
......
import { Dom, Node } from '@antv/x6'
import { ReactShape } from '@antv/x6-react-shape'
import { NODE_WIDTH, NODE_HEIGHT } from '@/constants/graph'
export class BaseNode extends ReactShape {
// eslint-disable-next-line class-methods-use-this
isGroup() {
return false
}
import BaseNode from './nodes/BaseNode'
import X6DemoNode from './nodes/X6DemoNode'
import X6DemoGroupNode from './nodes/X6DemoGroupNode'
export {
BaseNode,
X6DemoNode,
X6DemoGroupNode
}
export class X6DemoNode extends BaseNode {
getInPorts() {
return this.getPortsByGroup('in')
}
getOutPorts() {
return this.getPortsByGroup('out')
}
}
Node.registry.register('ais-rect-port', X6DemoNode as any)
X6DemoNode.config({
width: NODE_WIDTH,
height: NODE_HEIGHT,
shape: 'ais-rect-port',
ports: {
groups: {
in: {
position: { name: 'top' },
zIndex: 2,
},
out: {
position: { name: 'bottom' },
zIndex: 2,
},
},
},
attrs: {
body: {
magnet: false,
fill: 'none',
stroke: 'none',
refWidth: '100%',
refHeight: '100%',
zIndex: 1,
},
},
portMarkup: [
{
tagName: 'foreignObject',
selector: 'fo',
attrs: {
width: 6,
height: 6,
x: -3,
y: -3,
zIndex: 10,
// magnet决定是否可交互
magnet: 'true',
},
children: [
{
ns: Dom.ns.xhtml,
tagName: 'body',
selector: 'foBody',
attrs: {
xmlns: Dom.ns.xhtml,
},
style: {
width: '100%',
height: '100%',
},
children: [
{
tagName: 'span',
selector: 'content',
style: {
width: '100%',
height: '100%',
},
},
],
},
],
},
],
})
export class X6DemoGroupNode extends BaseNode {
// eslint-disable-next-line class-methods-use-this
isGroup() {
return true
}
}
X6DemoGroupNode.config({
ports: {
groups: {
in: {
position: { name: 'top' },
zIndex: 2,
},
out: {
position: { name: 'bottom' },
zIndex: 2,
},
},
},
portMarkup: [
{
tagName: 'foreignObject',
selector: 'fo',
attrs: {
width: 6,
height: 6,
x: -3,
y: -3,
zIndex: 10,
// magnet决定是否可交互
magnet: 'true',
},
children: [
{
ns: Dom.ns.xhtml,
tagName: 'body',
selector: 'foBody',
attrs: {
xmlns: Dom.ns.xhtml,
},
style: {
width: '100%',
height: '100%',
},
children: [
{
tagName: 'span',
selector: 'content',
style: {
width: '100%',
height: '100%',
},
},
],
},
],
},
],
})
import { ReactShape } from '@antv/x6-react-shape'
export default class BaseNode extends ReactShape {
isGroup() {
return false
}
}
import BaseNode from './BaseNode'
import { Dom } from '@antv/x6'
export default class X6DemoGroupNode extends BaseNode {
// eslint-disable-next-line class-methods-use-this
isGroup() {
return true
}
}
X6DemoGroupNode.config({
ports: {
groups: {
in: {
position: { name: 'top' },
zIndex: 2,
},
out: {
position: { name: 'bottom' },
zIndex: 2,
},
},
},
portMarkup: [
{
tagName: 'foreignObject',
selector: 'fo',
attrs: {
width: 6,
height: 6,
x: -3,
y: -3,
zIndex: 10,
// magnet决定是否可交互
magnet: 'true',
},
children: [
{
ns: Dom.ns.xhtml,
tagName: 'body',
selector: 'foBody',
attrs: {
xmlns: Dom.ns.xhtml,
},
style: {
width: '100%',
height: '100%',
},
children: [
{
tagName: 'span',
selector: 'content',
style: {
width: '100%',
height: '100%',
},
},
],
},
],
},
],
})
import BaseNode from './BaseNode'
import { NODE_HEIGHT, NODE_WIDTH } from '@/constants/graph'
import { Dom, Node } from '@antv/x6'
export default class X6DemoNode extends BaseNode {
getInPorts() {
return this.getPortsByGroup('in')
}
getOutPorts() {
return this.getPortsByGroup('out')
}
}
X6DemoNode.config({
width: NODE_WIDTH,
height: NODE_HEIGHT,
shape: 'base-rect-port',
ports: {
groups: {
in: {
position: { name: 'top' },
zIndex: 2,
},
out: {
position: { name: 'bottom' },
zIndex: 2,
},
},
},
attrs: {
body: {
magnet: false,
fill: 'none',
stroke: 'none',
refWidth: '100%',
refHeight: '100%',
zIndex: 1,
},
},
portMarkup: [
{
tagName: 'foreignObject',
selector: 'fo',
attrs: {
width: 6,
height: 6,
x: -3,
y: -3,
zIndex: 10,
// magnet决定是否可交互
magnet: 'true',
},
children: [
{
ns: Dom.ns.xhtml,
tagName: 'body',
selector: 'foBody',
attrs: {
xmlns: Dom.ns.xhtml,
},
style: {
width: '100%',
height: '100%',
},
children: [
{
tagName: 'span',
selector: 'content',
style: {
width: '100%',
height: '100%',
},
},
],
},
],
},
],
})
Node.registry.register('base-rect-port', X6DemoNode as any)
import random from 'lodash/random'
interface NodeParams {
id?: string
name: string
x: number
y: number
......@@ -50,25 +51,19 @@ export const copyNode = ({ name, x, y }: NodeParams) => {
}
}
export const addNode = ({ name, x, y }: NodeParams) => {
const id = `${Date.now()}`
export const addNode = ({ id, name, x, y }: NodeParams) => {
const timestamp = `${Date.now()}`
return {
id,
id: id ? `${id}-${timestamp}` : `${timestamp}`,
name,
inPorts: [
{
sequence: 1,
description: '输入',
id: id + '_in_1',
}
],
outPorts: [
{
sequence: 1,
description: '输出',
id: id + '_out_1',
}
],
inPorts: [{
id: id ? `${id}-IN-${timestamp}` : `in-${timestamp}`,
sequence: 1
}],
outPorts: [{
id: id ? `${id}-OUT-${timestamp}` : `out-${timestamp}`,
sequence: 1
}],
positionX: x,
positionY: y,
}
......
import { useMemo } from 'react'
import {} from '../components-type'
import {} from '../graph-common/node-types'
interface NodeParams {
name: string
......
......@@ -34,24 +34,8 @@ export const ExperimentForm: React.FC<Props> = ({ experimentId, name }) => {
onValuesChange={onValuesChange}
requiredMark={false}
>
<Form.Item name="experimentName" label="实验名称">
<Input placeholder="input placeholder" />
</Form.Item>
<Form.Item label={name}>
<Input placeholder="input placeholder" />
</Form.Item>
<Form.Item label="Field C">
<Input placeholder="input placeholder" />
</Form.Item>
<Form.Item label="Field D">
<Input placeholder="input placeholder" />
</Form.Item>
<Form.Item label="RadioDemo">
<Radio.Group>
<Radio.Button value="optional">Optional</Radio.Button>
<Radio.Button value={true}>Required</Radio.Button>
<Radio.Button value={false}>Hidden</Radio.Button>
</Radio.Group>
<Form.Item name="experimentName" label="策略名称">
<Input placeholder="请输入策略名称" />
</Form.Item>
</Form>
)
......
......@@ -34,18 +34,10 @@ export const NodeFormDemo: React.FC<Props> = ({
onValuesChange={onValuesChange}
requiredMark={false}
>
<Form.Item label="节点名称" name="name">
<Input placeholder="input placeholder" />
</Form.Item>
<Form.Item label={name}>
<Input placeholder="input placeholder" />
</Form.Item>
<Form.Item label="Field C">
<Input placeholder="input placeholder" />
</Form.Item>
<Form.Item label="Field D">
<Form.Item label="组件名称" name="name">
<Input placeholder="input placeholder" />
</Form.Item>
</Form>
)
}
@border-color: #e9e9e9;
.confPanel {
width: 290px;
min-width: 290px;
}
.setting {
height: 100%;
:global {
......
......@@ -45,9 +45,9 @@ export const ComponentConfigPanel: React.FC<Props> = (props) => {
)}
</div>
</Tabs.TabPane>
<Tabs.TabPane tab="全局参数" key="params">
<div className={css.form} />
</Tabs.TabPane>
{/*<Tabs.TabPane tab="全局参数" key="params">*/}
{/* <div className={css.form} />*/}
{/*</Tabs.TabPane>*/}
</Tabs>
</div>
</div>
......
......@@ -4,7 +4,7 @@ import {
SCENE_DISPLAY,
SIGN_OPERATION,
MOTION_OPERATION
} from '@/pages/common/components-type'
} from '@/pages/common/graph-common/node-types'
export const componentsData = [
......
......@@ -11,7 +11,7 @@
background-image: linear-gradient(#fff 50%, #f7f9fb 50%);
background-size: 100% 60px;
.treeFolder:global(.@{ant-prefix}-tree-treenode) {
:global(.@{ant-prefix}-tree-treenode) {
align-items: center;
height: 30px;
padding: 0;
......@@ -48,7 +48,7 @@
}
}
.treeNode:global(.@{ant-prefix}-tree-treenode) {
:global(.@{ant-prefix}-tree-treenode) {
height: 30px;
line-height: 30px;
......
......@@ -15,39 +15,26 @@ const FolderIcon = ({ expanded }: { expanded: boolean }) => {
export const CategoryTree = () => {
const { componentApplications } = useModel('guide-algo-component')
const renderTree = useCallback(
(treeList: any[] = [], searchKey: string = '') => {
return treeList.map((item) => {
const { isDir, id, children } = item
const key = id.toString();
const title = <NodeTitle node={item} searchKey={searchKey} />
if (isDir) {
return (
<TreeNode
icon={FolderIcon}
key={key}
title={title}
className={styles.treeFolder}
>
{renderTree(children, searchKey)}
</TreeNode>
)
const renderTree = useCallback((treeList: any[] = [], searchKey?: string): any => {
return treeList.map((item) => {
const { isDir, id, children } = item
const key = id.toString();
const title = <NodeTitle node={item} searchKey={searchKey} />
if (isDir) {
return {
key,
title,
icon: FolderIcon,
children: renderTree(children, searchKey)
}
return (
<TreeNode
isLeaf={true}
key={key}
icon={<span />}
title={title}
className={styles.treeNode}
/>
)
})
},
[],
)
}
return {
key,
title,
icon: <span />,
}
})
}, [],)
const applicationsTreeData = useMemo(() => {
// 根据模板生成应用组件数据格式
......@@ -55,8 +42,6 @@ export const CategoryTree = () => {
return componentApplications?.map(applicationTemplate);
}, [componentApplications])
// console.log('componentsData', componentsData, renderTree(componentsData))
return (
<div className={styles.list}>
<DirectoryTree
......@@ -64,9 +49,8 @@ export const CategoryTree = () => {
selectable={false}
defaultExpandAll
className={styles.tree}
>
{renderTree(componentsData)}
</DirectoryTree>
treeData={renderTree(componentsData)}
/>
</div>
)
}
......@@ -64,6 +64,7 @@
display: flex;
justify-content: space-between;
padding-right: 8px;
padding-left: 15px;
.label {
display: inline-block;
......
import React, { useCallback, useState, useRef } from 'react'
import React, { useRef } from 'react'
import { toLower, unescape } from 'lodash-es'
import { Popover, Tag } from 'antd'
import { Tag } from 'antd'
import { DragSource, ConnectDragPreview, ConnectDragSource } from 'react-dnd'
import { DatabaseFilled, ReadOutlined } from '@ant-design/icons'
import { DatabaseFilled } from '@ant-design/icons'
import marked from 'marked'
import { useSafeSetHTML } from '@/pages/common/hooks/useSafeSetHtml'
import { DRAGGABLE_ALGO_COMPONENT } from '@/constants/graph'
import {COMPONENTS_TYPE} from './componentTreeNodes'
import { COMPONENTS_TYPE } from '@/pages/common/graph-common/node-types'
import styles from './node-title.less'
marked.setOptions({
......@@ -48,7 +48,7 @@ const Document = (props: { node: any }) => {
interface Props {
node: any
searchKey: string
searchKey?: string
isDragging: boolean
connectDragSource: ConnectDragSource
connectDragPreview: ConnectDragPreview
......
import React from 'react'
import React, { FC } from 'react'
import CN from 'classnames'
import commonStyle from '@/common/style.less'
import styles from './style.less'
import { Button } from 'antd'
import { useExperimentGraph } from '@/pages/rx-models/experiment-graph'
const Index = () => {
interface CanvasActionProps {
expGraph: any
}
const Index: FC<CanvasActionProps> = (props) => {
const {expGraph} = props
const handleSave = () => {
console.log('expGraph', expGraph)
console.log('expGraph', expGraph?.graph?.toJSON())
}
return (
<div className={CN(commonStyle.pos_end, styles.canvas_action)}>
<Button size="small">sss</Button>
<Button size="small">sssss</Button>
<Button size="small">sssss</Button>
<Button size="small">sssss</Button>
<Button onClick={handleSave} className={styles.button_style} size="small">保存为应用</Button>
<Button onClick={handleSave} className={styles.button_style} size="small">取消</Button>
<Button onClick={handleSave} className={styles.button_style} size="small">保存</Button>
<Button onClick={handleSave} className={styles.button_style} size="small" type="primary">启用</Button>
</div>
)
}
......
.canvas_action{
padding-right: 10px;
}
.button_style{
margin-right: 15px;
width: 100px;
}
......@@ -31,7 +31,6 @@ export const CanvasContent: React.FC<Props> = (props) => {
const [, dropRef] = useDrop({
accept: [DRAGGABLE_ALGO_COMPONENT, DRAGGABLE_MODEL],
drop: (item: any, monitor) => {
console.log('drop', item, monitor)
const currentMouseOffset = monitor.getClientOffset()
const sourceMouseOffset = monitor.getInitialClientOffset()
const sourceElementOffset = monitor.getInitialSourceClientOffset()
......@@ -76,8 +75,6 @@ export const CanvasContent: React.FC<Props> = (props) => {
[expGraph],
)
console.log('expGraph', expGraph)
return (
<div
ref={(elem) => {
......
......@@ -10,7 +10,7 @@ import {
import { useObservableState } from '@/common/hooks/useObservableState'
import { RxInput } from '@/component/rx-component/rx-input'
import { showModal } from '@/component/modal'
import { addNodeGroup } from '@/services/graph'
import { addNodeGroup } from '@/pages/common/graph-utils/graph'
import { BehaviorSubject } from 'rxjs'
import { useExperimentGraph } from '@/pages/rx-models/experiment-graph'
import { formatGroupInfoToNodeMeta } from '@/pages/rx-models/graph-util'
......@@ -50,9 +50,6 @@ export const CanvasToolbar: React.FC<Props> = (props) => {
expGraph.toggleSelectionEnabled()
setSelectionEnabled((enabled) => !enabled)
break
// case Operations.RUN_SELECTED:
// expGraph.runGraph()
// break
case Operations.NEW_GROUP: {
const value$ = new BehaviorSubject('')
const modal = showModal({
......@@ -155,16 +152,8 @@ export const CanvasToolbar: React.FC<Props> = (props) => {
icon={<UngroupOutlined />}
/>
</Group>
{/*<Group>*/}
{/* <Item*/}
{/* name={Operations.RUN_SELECTED}*/}
{/* disabled={!activeNodeInstance}*/}
{/* tooltip="执行选择节点"*/}
{/* icon={<PlaySquareOutlined />}*/}
{/* />*/}
{/*</Group>*/}
</Toolbar>
<CanvasAction/>
<CanvasAction expGraph={expGraph}/>
</div>
)
}
......@@ -37,10 +37,6 @@ export const NodeContextMenu: React.FC<Props> = (props) => {
await expGraph.requestDeleteNodes([data.node.id])
}, [expGraph, activeNodeInstance])
const onGraphRun = useCallback(async () => {
await expGraph.runGraph()
}, [expGraph])
const { x: left, y: top } = graphPointToOffsetPoint(
expGraph.graph!,
data,
......@@ -58,11 +54,6 @@ export const NodeContextMenu: React.FC<Props> = (props) => {
<Menu.Item onClick={onNodeDel} icon={<DeleteOutlined />} text="删除" />
{/*<Menu.Item disabled={true} icon={<EditOutlined />} text="重命名" />*/}
{/*<Menu.Divider />*/}
{/*<Menu.Item*/}
{/* onClick={onGraphRun}*/}
{/* icon={<PlaySquareOutlined />}*/}
{/* text="执行"*/}
{/*/>*/}
</Menu>
</div>
)
......
......@@ -8,7 +8,6 @@ import { useObservableState } from '@/common/hooks/useObservableState'
import { ANT_PREFIX } from '@/constants/global'
import { NExecutionStatus } from '@/pages/rx-models/typing'
import { useExperimentGraph } from '@/pages/rx-models/experiment-graph'
import { NodeStatus } from '@/pages/common/graph-common/node-status'
import { NodePopover } from '../../common/graph-common/node-popover'
import styles from './node-element.less'
......@@ -45,12 +44,6 @@ export const NodeElement: React.FC<Props> = (props) => {
</div>
<div className={styles.notation}>
<div className={styles.name}>{name}</div>
{nodeStatus.jobStatus && (
<NodeStatus
className={styles.statusIcon}
status={nodeStatus.jobStatus as any}
/>
)}
</div>
</div>
</NodePopover>
......
......@@ -7,9 +7,9 @@ import { calcNodeScale } from '@/pages/rx-models/graph-util'
import { useExperimentGraph } from '@/pages/rx-models/experiment-graph'
import { NExperimentGraph } from '@/pages/rx-models/typing'
import {
X6DemoGroupNode,
X6DemoNode,
X6DemoNode,
} from '@/pages/common/graph-common/shape/node'
import X6DemoGroupNode from '@/pages/common/graph-common/shape/nodes/X6DemoGroupNode'
import { X6DemoGroupEdge } from '../../common/graph-common/shape/edge'
import styles from './node-group.less'
......
......@@ -33,19 +33,12 @@
.editPanel {
display: flex;
flex-grow: 1;
align-items: stretch;
justify-content: space-between;
flex: 1;
overflow: hidden;
.dagCanvas {
flex-grow: 1;
border-right: @border;
}
.confPanel {
width: 290px;
min-width: 290px;
}
}
}
......@@ -33,11 +33,11 @@ const DagDemo: React.FC<Props> = (props) => {
experimentId={experimentId}
className={styles.dagCanvas}
/>
<ComponentConfigPanel
experimentId={experimentId}
className={styles.confPanel}
/>
</div>
<ComponentConfigPanel
experimentId={experimentId}
className={styles.confPanel}
/>
</DndProvider>
</div>
</Content>
......
......@@ -10,11 +10,9 @@ import produce from 'immer'
import { ConfigProvider, message, Tooltip } from 'antd'
import { RERENDER_EVENT } from '@/constants/graph'
import { GraphCore, ConnectionRemovedArgs } from './graph-core'
import {
BaseNode,
X6DemoGroupNode,
X6DemoNode,
} from '../common/graph-common/shape/node'
import { X6DemoNode } from '../common/graph-common/shape/node'
import X6DemoGroupNode from '../common/graph-common/shape/nodes/X6DemoGroupNode'
import BaseNode from '../common/graph-common/shape/nodes/BaseNode'
import {
BaseEdge,
GuideEdge,
......@@ -28,8 +26,8 @@ import {
formatGraphData,
formatNodeInfoToNodeMeta,
} from './graph-util'
import { queryGraph, addNode, copyNode } from '@/services/graph'
import { queryGraphStatus, runGraph, stopGraphRun } from '@/services/status'
import { queryGraph, addNode, copyNode } from '@/pages/common/graph-utils/graph'
import { queryGraphStatus } from '@/services/status'
export function parseStatus(data: NExecutionStatus.ExecutionStatus) {
const { execInfo, instStatus } = data
......@@ -105,6 +103,15 @@ class ExperimentGraph extends GraphCore<BaseNode, BaseEdge> {
super({
history: true,
frozen: true,
grid: {
size: 10,
visible: true,
type: 'dot', // 'dot' | 'fixedDot' | 'mesh'
args: {
color: '#a0a0a0', // 网格线/点颜色
thickness: 1, // 网格线宽度/网格点大小
},
},
selecting: {
enabled: true,
rubberband: false,
......@@ -181,7 +188,7 @@ class ExperimentGraph extends GraphCore<BaseNode, BaseEdge> {
const portId = targetMagnet.getAttribute('port')!
const node = targetView!.cell as X6DemoNode
const port = node.getPort(portId)
return !(port && port.connected)
return !!(port)
},
},
scroller: {
......@@ -370,6 +377,7 @@ class ExperimentGraph extends GraphCore<BaseNode, BaseEdge> {
.subscribe((graphData) => {
if (!this.graph) {
const { nodes, edges } = formatGraphData(graphData)
console.log('=======', nodes, edges)
super.render({
wrapper,
container,
......@@ -395,10 +403,11 @@ class ExperimentGraph extends GraphCore<BaseNode, BaseEdge> {
const { data } = nodeMeta
const { type, includedNodes = [] } = data as any
if (type === 'node') {
console.log('renderNode >>>>>>', nodeMeta)
const node = this.graph!.addNode(
new X6DemoNode({
...nodeMeta,
shape: 'ais-rect-port',
shape: 'base-rect-port',
component: <NodeElement experimentId={experimentId} />,
}),
) as BaseNode
......@@ -635,37 +644,6 @@ class ExperimentGraph extends GraphCore<BaseNode, BaseEdge> {
}
}
// 运行画布或节点
runGraph = async () => {
try {
// eslint-disable-next-line: no-this-assignment
const { experimentId, nodeMetas = [] } = this
await runGraph(nodeMetas)
this.running$.next(true)
this.clearContextMenuInfo()
this.loadExecutionStatus(experimentId) // 发起执行状态查询
return { success: true }
} catch (e) {
console.error(`执行失败`, e)
return { success: false }
}
}
// 停止实验的执行
stopRunGraph = async () => {
try {
const { experimentId } = this
const stopRes = await stopGraphRun()
this.running$.next(false)
this.clearContextMenuInfo()
this.loadExecutionStatus(experimentId) // 发起执行状态查询
return stopRes
} catch (e) {
console.error(`停止失败`, e)
return { success: false }
}
}
// 设置自定义算法组件节点
setActiveAlgoData = (data: any) => {
if (!data) {
......@@ -687,8 +665,10 @@ class ExperimentGraph extends GraphCore<BaseNode, BaseEdge> {
if (graph) {
const { nodeMeta, clientX, clientY } = param
const pos = graph.clientToLocal(clientX, clientY)
console.log('nodeMeta',nodeMeta)
const nodeRes = await addNode({ ...nodeMeta, ...pos })
this.updateExperimentGraph([nodeRes])
console.log('requestAddNode nodeRes', nodeRes)
const newNode = formatNodeInfoToNodeMeta(nodeRes as any);
console.log('newNode', newNode)
this.addNode(newNode)
......
......@@ -359,10 +359,12 @@ export class GraphCore<
}
renderNode(nodeMeta: any): N | undefined {
console.log('renderNode => ', nodeMeta)
return this.graph!.addNode(nodeMeta) as N
}
renderEdge(edgeMeta: any): E | undefined {
console.log('renderEdge => ', edgeMeta)
return this.graph!.addEdge(edgeMeta) as E
}
......@@ -408,7 +410,7 @@ export class GraphCore<
onConnectNode(args: any) {
if (process.env.NODE_ENV === 'development') {
console.log('[GraphCore] connect node:', args)
console.log('[GraphCore] connect nodes:', args)
}
}
......@@ -420,7 +422,7 @@ export class GraphCore<
onMoveNodeStart(args: any) {
if (process.env.NODE_ENV === 'development') {
console.log('[GraphCore] move node start:', args)
console.log('[GraphCore] move nodes start:', args)
}
}
......@@ -433,14 +435,14 @@ export class GraphCore<
// 按下删除键的回调,默认参数为当前选中的节点和边
onDeleteNodeOrEdge(args: { nodes: N[]; edges: E[] }) {
if (process.env.NODE_ENV === 'development') {
console.log('[GraphCore] delete node or edge:', args)
console.log('[GraphCore] delete nodes or edge:', args)
}
}
// 校验节点是否可复制,为 true 则可被用于复制
validateNodeCopyable(node: N) {
if (process.env.NODE_ENV === 'development') {
console.log('[GraphCore] validate node copyable:', node)
console.log('[GraphCore] validate nodes copyable:', node)
}
return true
}
......@@ -448,7 +450,7 @@ export class GraphCore<
// 按下粘贴键的回调,默认参数为待复制的节点
onCopyNode(copyNode: N) {
if (process.env.NODE_ENV === 'development') {
console.log('[GraphCore] copy node:', copyNode)
console.log('[GraphCore] copy nodes:', copyNode)
}
}
......
......@@ -7,7 +7,7 @@ import {
NODE_HEIGHT,
} from '@/constants/graph'
import { NExperimentGraph } from '@/pages/rx-models/typing'
import { BaseNode } from '../common/graph-common/shape/node'
import BaseNode from '../common/graph-common/shape/nodes/BaseNode'
import '../common/graph-common/connector'
// group 范围适应内部节点变化
......
......@@ -48,7 +48,7 @@ export namespace NExperimentGraph {
export interface Port {
sequence: number
id: string
description: string
description?: string
}
export interface OutPort extends Port {}
......
......@@ -52,33 +52,6 @@ let state = {
} as any,
}
export const runGraph = async (nodes: any[]) => {
const newState = getStatus()
newState.data.instStatus = {}
newState.data.execInfo = {}
nodes.forEach((node) => {
newState.data.instStatus[node.id] = 'default'
newState.data.execInfo[node.id] = {
jobStatus: 'default',
defName: node.name,
startTime: '2020-10-19 13:28:55',
endTime: '2020-10-19 13:32:02',
name: node.name,
id: 10571196,
}
})
state.running = true
state.idx = 0
state.statusRes = newState
return { success: true }
}
export const stopGraphRun = () => {
state.running = false
state.idx = 0
return { success: true }
}
const getStatus = () => cloneDeep(state.statusRes)
export const queryGraphStatus = async () => {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment