| 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364 |
- import { CircleNode, CircleNodeModel, h } from "@logicflow/core";
- class StartNode extends CircleNode {
- getLabelShape() {
- const { model } = this.props;
- const { x, y } = model;
- return h('text', { fill: '#000000', fontSize: 12, x: x - 12, y: y + 4, width: 50, height: 25 }, 'Start');
- }
- getShape() {
- const { model } = this.props;
- const { x, y, r } = model;
- const { fill, stroke, strokeWidth } = model.getNodeStyle();
- return h('g', {}, [h('circle', { cx: x, cy: y, r, fill, stroke, strokeWidth }), this.getLabelShape()]);
- }
- }
- class StartModel extends CircleNodeModel {
- // 自定义节点形状属性
- initNodeData(data) {
- data.text = {
- value: (data.text && data.text.value) || '',
- x: data.x,
- y: data.y + 35,
- dragable: false,
- editable: true
- }
- super.initNodeData(data)
- this.r = 20
- }
- // 自定义节点样式属性
- getNodeStyle() {
- const style = super.getNodeStyle()
- return style
- }
- // 自定义锚点样式
- getAnchorStyle() {
- const style = super.getAnchorStyle()
- style.hover.r = 8
- style.hover.fill = 'rgb(24, 125, 255)'
- style.hover.stroke = 'rgb(24, 125, 255)'
- return style
- }
- // 自定义节点outline
- getOutlineStyle() {
- const style = super.getOutlineStyle()
- style.stroke = '#88f'
- return style
- }
- getConnectedTargetRules() {
- const rules = super.getConnectedTargetRules()
- const notAsTarget = {
- message: '起始节点不能作为连线的终点',
- validate: () => false
- }
- rules.push(notAsTarget)
- return rules
- }
- }
- export default {
- type: 'start-node',
- view: StartNode,
- model: StartModel
- }
|