Browse Source

feat: refactor tool bar widgets' code

master
smallstonesk 4 years ago
parent
commit
c48ef215d7
  1. 35
      packages/core/src/mods/toolBar/widgets/bgColor.tsx
  2. 2
      packages/core/src/mods/toolBar/widgets/bold.tsx
  3. 53
      packages/core/src/mods/toolBar/widgets/borderColor.tsx
  4. 10
      packages/core/src/mods/toolBar/widgets/bringToBack.tsx
  5. 11
      packages/core/src/mods/toolBar/widgets/bringToTop.tsx
  6. 2
      packages/core/src/mods/toolBar/widgets/common/makeBtnWidget.tsx
  7. 2
      packages/core/src/mods/toolBar/widgets/common/makeDropdownWidget.tsx
  8. 2
      packages/core/src/mods/toolBar/widgets/fitWindow.tsx
  9. 8
      packages/core/src/mods/toolBar/widgets/fontSize.tsx
  10. 17
      packages/core/src/mods/toolBar/widgets/horizontalAlign.tsx
  11. 4
      packages/core/src/mods/toolBar/widgets/index.module.less
  12. 6
      packages/core/src/mods/toolBar/widgets/index.tsx
  13. 2
      packages/core/src/mods/toolBar/widgets/italic.tsx
  14. 54
      packages/core/src/mods/toolBar/widgets/lineColor.tsx
  15. 20
      packages/core/src/mods/toolBar/widgets/lineStyle.tsx
  16. 2
      packages/core/src/mods/toolBar/widgets/redo.tsx
  17. 2
      packages/core/src/mods/toolBar/widgets/save.tsx
  18. 35
      packages/core/src/mods/toolBar/widgets/textColor.tsx
  19. 4
      packages/core/src/mods/toolBar/widgets/underline.tsx
  20. 2
      packages/core/src/mods/toolBar/widgets/undo.tsx
  21. 17
      packages/core/src/mods/toolBar/widgets/verticalAlign.tsx
  22. 2
      packages/core/src/mods/toolBar/widgets/zoom.tsx
  23. 21
      packages/core/src/utils/flowChartUtils.ts

35
packages/core/src/mods/toolBar/widgets/bgColor.tsx

@ -6,21 +6,26 @@ import styles from './index.module.less';
import {Graph} from '@antv/x6';
import {safeGet} from '../../../utils';
import XIcon from '../../../components/xIcon';
import makeDropdownWidget from './makeDropdownWidget';
import ColorPicker from '../../../components/colorPicker';
import makeDropdownWidget from './common/makeDropdownWidget';
import {hasNodeSelected, getSelectedNodes} from '../../../utils/flowChartUtils';
interface IProps {
flowChart: Graph;
}
const BgColor: React.FC<IProps> = makeDropdownWidget({
const options = {
tooltip: '填充颜色',
getIcon(flowChart: Graph) {
getCurBgColor(flowChart: Graph) {
let bgColor = '#DDD';
const cells = flowChart.getSelectedCells();
if(cells.length > 0) {
bgColor = safeGet(cells, '0.attrs.body.fill', '#575757');
const nodes = getSelectedNodes(flowChart);
if(!options.disabled(flowChart) && nodes.length > 0) {
bgColor = safeGet(nodes, '0.attrs.body.fill', '#575757');
}
return bgColor;
},
getIcon(flowChart: Graph) {
const bgColor = options.getCurBgColor(flowChart);
return (
<div className={styles.bgColorContainer}>
<XIcon className={styles.fillIcon} type={'icon-tianchong'}/>
@ -29,26 +34,20 @@ const BgColor: React.FC<IProps> = makeDropdownWidget({
);
},
getOverlay(flowChart: Graph, onChange: (data: any) => void) {
let bgColor = '#DDD';
const cells = flowChart.getSelectedCells();
if(cells.length > 0) {
bgColor = safeGet(cells, '0.attrs.body.fill', '#575757');
}
const bgColor = options.getCurBgColor(flowChart);
const onChangeComplete = (color: string) => onChange(color);
return (
<ColorPicker color={bgColor} onChangeComplete={onChangeComplete}/>
);
},
handler: (flowChart: Graph, value: any) => {
const cells = flowChart.getSelectedCells();
if(cells.length > 0) {
cells.forEach(cell => cell.setAttrs({body: {fill: value}}));
flowChart.trigger('toolBar:forceUpdate');
}
getSelectedNodes(flowChart).forEach(node => node.setAttrs({body: {fill: value}}));
},
disabled(flowChart: Graph) {
return flowChart.getSelectedCellCount() === 0;
return !hasNodeSelected(flowChart);
},
});
};
const BgColor: React.FC<IProps> = makeDropdownWidget(options);
export default BgColor;

2
packages/core/src/mods/toolBar/widgets/bold.tsx

@ -2,9 +2,9 @@ import React from 'react';
import {Graph} from '@antv/x6';
import {safeGet} from '../../../utils';
import makeBtnWidget from './makeBtnWidget';
import {BoldOutlined} from '@ant-design/icons';
import shortcuts from '../../../common/shortcuts';
import makeBtnWidget from './common/makeBtnWidget';
interface IProps {
flowChart: Graph

53
packages/core/src/mods/toolBar/widgets/borderColor.tsx

@ -0,0 +1,53 @@
import React from 'react';
import 'antd/es/menu/style';
import styles from './index.module.less';
import {Graph} from '@antv/x6';
import {safeGet} from '../../../utils';
import {HighlightOutlined} from '@ant-design/icons';
import ColorPicker from '../../../components/colorPicker';
import makeDropdownWidget from './common/makeDropdownWidget';
import {hasNodeSelected, getSelectedNodes} from '../../../utils/flowChartUtils';
interface IProps {
flowChart: Graph;
}
const options = {
tooltip: '边框颜色',
getCurBorderColor(flowChart: Graph) {
let borderColor = '#DDD';
const nodes = getSelectedNodes(flowChart);
if(!options.disabled(flowChart) && nodes.length > 0) {
borderColor = safeGet(nodes, '0.attrs.body.stroke', '#333');
}
return borderColor;
},
getIcon(flowChart: Graph) {
const borderColor = options.getCurBorderColor(flowChart);
return (
<div className={styles.borderColorContainer}>
<HighlightOutlined className={styles.borderColorIcon}/>
<div className={styles.colorPreview} style={{backgroundColor: borderColor}}/>
</div>
);
},
getOverlay(flowChart: Graph, onChange: (data: any) => void) {
const borderColor = options.getCurBorderColor(flowChart);
const onChangeComplete = (color: string) => onChange(color);
return (
<ColorPicker color={borderColor} onChangeComplete={onChangeComplete}/>
);
},
handler: (flowChart: Graph, value: any) => {
getSelectedNodes(flowChart).forEach(node => node.setAttrs({body: {stroke: value}}));
},
disabled(flowChart: Graph) {
return !hasNodeSelected(flowChart);
},
};
const BorderColor: React.FC<IProps> = makeDropdownWidget(options);
export default BorderColor;

10
packages/core/src/mods/toolBar/widgets/bringToBack.tsx

@ -1,8 +1,9 @@
import React from 'react';
import {Graph} from '@antv/x6';
import makeBtnWidget from './makeBtnWidget';
import XIcon from '../../../components/xIcon';
import makeBtnWidget from './common/makeBtnWidget';
import {getSelectedNodes, hasNodeSelected} from '../../../utils/flowChartUtils';
interface IProps {
flowChart: Graph
@ -14,13 +15,10 @@ const BringToBack: React.FC<IProps> = makeBtnWidget({
return <XIcon type={'icon-bringtobottom'}/>;
},
handler(flowChart: Graph) {
const cells = flowChart.getSelectedCells();
if(cells.length === 1) {
cells[0].toBack();
}
getSelectedNodes(flowChart).forEach(node => node.toBack());
},
disabled(flowChart: Graph) {
return flowChart.getSelectedCellCount() === 0;
return !hasNodeSelected(flowChart);
}
});

11
packages/core/src/mods/toolBar/widgets/bringToTop.tsx

@ -2,9 +2,9 @@
import React from 'react';
import {Graph} from '@antv/x6';
import makeBtnWidget from './makeBtnWidget';
import XIcon from '../../../components/xIcon';
import shortcuts from '../../../common/shortcuts';
import makeBtnWidget from './common/makeBtnWidget';
import {getSelectedNodes, hasNodeSelected} from '../../../utils/flowChartUtils';
interface IProps {
flowChart: Graph
@ -16,13 +16,10 @@ const BringToTop: React.FC<IProps> = makeBtnWidget({
return <XIcon type={'icon-bringtotop'}/>;
},
handler(flowChart: Graph) {
const cells = flowChart.getSelectedCells();
if(cells.length === 1) {
cells[0].toFront();
}
getSelectedNodes(flowChart).forEach(node => node.toFront());
},
disabled(flowChart: Graph) {
return flowChart.getSelectedCellCount() === 0;
return !hasNodeSelected(flowChart);
}
});

2
packages/core/src/mods/toolBar/widgets/makeBtnWidget.tsx → packages/core/src/mods/toolBar/widgets/common/makeBtnWidget.tsx

@ -1,7 +1,7 @@
import React, {ReactElement} from 'react';
import 'antd/es/tooltip/style';
import styles from './index.module.less';
import styles from '../index.module.less';
import {Tooltip} from 'antd';
import {Graph} from '@antv/x6';

2
packages/core/src/mods/toolBar/widgets/makeDropdownWidget.tsx → packages/core/src/mods/toolBar/widgets/common/makeDropdownWidget.tsx

@ -2,7 +2,7 @@ import React, {ReactElement} from 'react';
import 'antd/es/tooltip/style';
import 'antd/es/dropdown/style';
import styles from './index.module.less';
import styles from '../index.module.less';
import {Graph} from '@antv/x6';
import {Tooltip, Dropdown} from 'antd';

2
packages/core/src/mods/toolBar/widgets/fitWindow.tsx

@ -1,7 +1,7 @@
import React from 'react';
import {Graph} from '@antv/x6';
import makeBtnWidget from './makeBtnWidget';
import makeBtnWidget from './common/makeBtnWidget';
import {FullscreenExitOutlined} from '@ant-design/icons';
interface IProps {

8
packages/core/src/mods/toolBar/widgets/fontSize.tsx

@ -5,7 +5,7 @@ import 'antd/es/menu/style';
import {Menu} from 'antd';
import {Graph} from '@antv/x6';
import {safeGet} from '../../../utils';
import makeDropdownWidget from './makeDropdownWidget';
import makeDropdownWidget from './common/makeDropdownWidget';
interface IProps {
flowChart: Graph
@ -38,11 +38,7 @@ const FontSize: React.FC<IProps> = makeDropdownWidget({
);
},
handler: (flowChart: Graph, value: any) => {
const cells = flowChart.getSelectedCells();
if(cells.length > 0) {
cells.forEach(cell => cell.setAttrs({label: {fontSize: value}}));
flowChart.trigger('toolBar:forceUpdate');
}
flowChart.getSelectedCells().forEach(cell => cell.setAttrs({label: {fontSize: value}}));
},
disabled(flowChart: Graph) {
return flowChart.getSelectedCellCount() === 0;

17
packages/core/src/mods/toolBar/widgets/horizontalAlign.tsx

@ -5,7 +5,8 @@ import 'antd/es/menu/style';
import {Menu} from 'antd';
import {Graph} from '@antv/x6';
import {safeGet} from '../../../utils';
import makeDropdownWidget from './makeDropdownWidget';
import makeDropdownWidget from './common/makeDropdownWidget';
import {hasNodeSelected, getSelectedNodes} from '../../../utils/flowChartUtils';
import {AlignLeftOutlined, AlignCenterOutlined, AlignRightOutlined} from '@ant-design/icons';
interface IProps {
@ -69,9 +70,9 @@ const HorizontalAlign: React.FC<IProps> = makeDropdownWidget({
tooltip: '水平对齐',
getIcon(flowChart: Graph) {
let alignType = 'center';
const cells = flowChart.getSelectedCells();
if(cells.length > 0) {
alignType = safeGet(cells, '0.attrs.label.align.horizontal', 'center');
const nodes = getSelectedNodes(flowChart);
if(nodes.length > 0) {
alignType = safeGet(nodes, '0.attrs.label.align.horizontal', 'center');
}
return ALIGN_MAP[alignType].icon;
},
@ -88,14 +89,10 @@ const HorizontalAlign: React.FC<IProps> = makeDropdownWidget({
);
},
handler: (flowChart: Graph, value: any) => {
const cells = flowChart.getSelectedCells();
if(cells.length > 0) {
cells.forEach(cell => cell.setAttrs({label: value}));
flowChart.trigger('toolBar:forceUpdate');
}
getSelectedNodes(flowChart).forEach(node => node.setAttrs({label: value}));
},
disabled(flowChart: Graph) {
return flowChart.getSelectedCellCount() === 0;
return !hasNodeSelected(flowChart);
},
});

4
packages/core/src/mods/toolBar/widgets/index.module.less

@ -50,7 +50,7 @@
}
}
.bgColorContainer, .textColorContainer, .lineColorContainer {
.bgColorContainer, .textColorContainer, .borderColorContainer {
position: relative;
display: flex;
@ -69,7 +69,7 @@
font-size: 15px;
}
.lineIcon {
.borderColorIcon {
position: relative;
top: -2px;
font-size: 15px;

6
packages/core/src/mods/toolBar/widgets/index.tsx

@ -11,12 +11,12 @@ import Italic from './italic';
import BgColor from './bgColor';
import FontSize from './fontSize';
import TextColor from './textColor';
import LineColor from './lineColor';
import LineStyle from './lineStyle';
import Underline from './underline';
import FitWindow from './fitWindow';
import BringToTop from './bringToTop';
import BringToBack from './bringToBack';
import BorderColor from './borderColor';
import VerticalAlign from './verticalAlign';
import HorizontalAlign from './horizontalAlign';
@ -27,9 +27,9 @@ interface IProps {
const tools: React.FC<IProps>[][] = [
[Save, FitWindow, Undo, Redo],
[Zoom],
[FontSize, Bold, Italic, Underline, TextColor],
[FontSize, Bold, Italic, Underline],
[TextColor, BgColor, BorderColor, LineStyle],
[HorizontalAlign, VerticalAlign],
[BgColor, LineColor, LineStyle],
[BringToTop, BringToBack]
];

2
packages/core/src/mods/toolBar/widgets/italic.tsx

@ -2,7 +2,7 @@ import React from 'react';
import {Graph} from '@antv/x6';
import {safeGet} from '../../../utils';
import makeBtnWidget from './makeBtnWidget';
import makeBtnWidget from './common/makeBtnWidget';
import {ItalicOutlined} from '@ant-design/icons';
import shortcuts from '../../../common/shortcuts';

54
packages/core/src/mods/toolBar/widgets/lineColor.tsx

@ -1,54 +0,0 @@
import React from 'react';
import 'antd/es/menu/style';
import styles from './index.module.less';
import {Graph} from '@antv/x6';
import {safeGet} from '../../../utils';
import {HighlightOutlined} from '@ant-design/icons';
import makeDropdownWidget from './makeDropdownWidget';
import ColorPicker from '../../../components/colorPicker';
interface IProps {
flowChart: Graph;
}
const LineColor: React.FC<IProps> = makeDropdownWidget({
tooltip: '线条颜色',
getIcon(flowChart: Graph) {
let lineColor = '#DDD';
const cells = flowChart.getSelectedCells();
if(cells.length > 0) {
lineColor = safeGet(cells, '0.attrs.body.stroke', '#333');
}
return (
<div className={styles.lineColorContainer}>
<HighlightOutlined className={styles.lineIcon}/>
<div className={styles.colorPreview} style={{backgroundColor: lineColor}}/>
</div>
);
},
getOverlay(flowChart: Graph, onChange: (data: any) => void) {
let lineColor = '#DDD';
const cells = flowChart.getSelectedCells();
if(cells.length > 0) {
lineColor = safeGet(cells, '0.attrs.body.stroke', '#333');
}
const onChangeComplete = (color: string) => onChange(color);
return (
<ColorPicker color={lineColor} onChangeComplete={onChangeComplete}/>
);
},
handler: (flowChart: Graph, value: any) => {
const cells = flowChart.getSelectedCells();
if(cells.length > 0) {
cells.forEach(cell => cell.setAttrs({body: {stroke: value}}));
flowChart.trigger('toolBar:forceUpdate');
}
},
disabled(flowChart: Graph) {
return flowChart.getSelectedCellCount() === 0;
},
});
export default LineColor;

20
packages/core/src/mods/toolBar/widgets/lineStyle.tsx

@ -3,10 +3,11 @@ import React, {ReactElement} from 'react';
import 'antd/es/menu/style';
import {Menu} from 'antd';
import {Graph, Cell} from '@antv/x6';
import {Graph} from '@antv/x6';
import {safeGet} from '../../../utils';
import XIcon from '../../../components/xIcon';
import makeDropdownWidget from './makeDropdownWidget';
import makeDropdownWidget from './common/makeDropdownWidget';
import {hasEdgeSelected, getSelectedEdges} from '../../../utils/flowChartUtils';
interface IProps {
flowChart: Graph;
@ -45,9 +46,9 @@ const LineStyle: React.FC<IProps> = makeDropdownWidget({
tooltip: '线条样式',
getIcon(flowChart: Graph) {
let lineType = 'straight';
const cells = flowChart.getSelectedCells();
if(cells.length > 0) {
lineType = safeGet(cells, '0.attrs.line.type', 'straight');
const edges = getSelectedEdges(flowChart);
if(edges.length > 0) {
lineType = safeGet(edges, '0.attrs.line.type', 'straight');
}
return LINE_STYLE_MAP[lineType].icon;
},
@ -64,15 +65,10 @@ const LineStyle: React.FC<IProps> = makeDropdownWidget({
);
},
handler: (flowChart: Graph, value: any) => {
const edges = flowChart.getSelectedCells().filter((cell: Cell) => cell.isEdge());
if(edges.length > 0) {
edges.forEach(edge => edge.setAttrs({line: value}));
flowChart.trigger('toolBar:forceUpdate');
}
getSelectedEdges(flowChart).forEach(edge => edge.setAttrs({line: value}));
},
disabled(flowChart: Graph) {
const edges = flowChart.getSelectedCells().filter((cell: Cell) => cell.isEdge());
return edges.length === 0;
return !hasEdgeSelected(flowChart);
},
});

2
packages/core/src/mods/toolBar/widgets/redo.tsx

@ -1,9 +1,9 @@
import React from 'react';
import {Graph} from '@antv/x6';
import makeBtnWidget from './makeBtnWidget';
import {RedoOutlined} from '@ant-design/icons';
import shortcuts from '../../../common/shortcuts';
import makeBtnWidget from './common/makeBtnWidget';
interface IProps {
flowChart: Graph

2
packages/core/src/mods/toolBar/widgets/save.tsx

@ -1,9 +1,9 @@
import React from 'react';
import {Graph} from '@antv/x6';
import makeBtnWidget from './makeBtnWidget';
import {SaveOutlined} from '@ant-design/icons';
import shortcuts from '../../../common/shortcuts';
import makeBtnWidget from './common/makeBtnWidget';
interface IProps {
flowChart: Graph

35
packages/core/src/mods/toolBar/widgets/textColor.tsx

@ -6,21 +6,26 @@ import styles from './index.module.less';
import {Graph} from '@antv/x6';
import {safeGet} from '../../../utils';
import XIcon from '../../../components/xIcon';
import makeDropdownWidget from './makeDropdownWidget';
import ColorPicker from '../../../components/colorPicker';
import makeDropdownWidget from './common/makeDropdownWidget';
import {hasNodeSelected, getSelectedNodes} from '../../../utils/flowChartUtils';
interface IProps {
flowChart: Graph;
}
const TextColor: React.FC<IProps> = makeDropdownWidget({
const options = {
tooltip: '文本颜色',
getIcon(flowChart: Graph) {
getCurTextColor(flowChart: Graph) {
let textColor = '#DDD';
const cells = flowChart.getSelectedCells();
if(cells.length > 0) {
textColor = safeGet(cells, '0.attrs.label.fill', '#575757');
const nodes = getSelectedNodes(flowChart);
if(nodes.length > 0) {
textColor = safeGet(nodes, '0.attrs.label.fill', '#575757');
}
return textColor;
},
getIcon(flowChart: Graph) {
const textColor = options.getCurTextColor(flowChart);
return (
<div className={styles.textColorContainer}>
<XIcon className={styles.textIcon} type={'icon-A'}/>
@ -29,26 +34,20 @@ const TextColor: React.FC<IProps> = makeDropdownWidget({
);
},
getOverlay(flowChart: Graph, onChange: (data: any) => void) {
let textColor = '#DDD';
const cells = flowChart.getSelectedCells();
if(cells.length > 0) {
textColor = safeGet(cells, '0.attrs.label.fill', '#575757');
}
const textColor = options.getCurTextColor(flowChart);
const onChangeComplete = (color: string) => onChange(color);
return (
<ColorPicker color={textColor} onChangeComplete={onChangeComplete}/>
);
},
handler: (flowChart: Graph, value: any) => {
const cells = flowChart.getSelectedCells();
if(cells.length > 0) {
cells.forEach(cell => cell.setAttrs({label: {fill: value}}));
flowChart.trigger('toolBar:forceUpdate');
}
flowChart.getSelectedCells().forEach(node => node.setAttrs({label: {fill: value}}));
},
disabled(flowChart: Graph) {
return flowChart.getSelectedCellCount() === 0;
return !hasNodeSelected(flowChart);
},
});
};
const TextColor: React.FC<IProps> = makeDropdownWidget(options);
export default TextColor;

4
packages/core/src/mods/toolBar/widgets/underline.tsx

@ -2,9 +2,9 @@ import React from 'react';
import {Graph} from '@antv/x6';
import {safeGet} from '../../../utils';
import makeBtnWidget from './makeBtnWidget';
import {UnderlineOutlined} from '@ant-design/icons';
import shortcuts from '../../../common/shortcuts';
import makeBtnWidget from './common/makeBtnWidget';
import {UnderlineOutlined} from '@ant-design/icons';
interface IProps {
flowChart: Graph

2
packages/core/src/mods/toolBar/widgets/undo.tsx

@ -1,9 +1,9 @@
import React from 'react';
import {Graph} from '@antv/x6';
import makeBtnWidget from './makeBtnWidget';
import {UndoOutlined} from '@ant-design/icons';
import shortcuts from '../../../common/shortcuts';
import makeBtnWidget from './common/makeBtnWidget';
interface IProps {
flowChart: Graph

17
packages/core/src/mods/toolBar/widgets/verticalAlign.tsx

@ -5,7 +5,8 @@ import 'antd/es/menu/style';
import {Menu} from 'antd';
import {Graph} from '@antv/x6';
import {safeGet} from '../../../utils';
import makeDropdownWidget from './makeDropdownWidget';
import makeDropdownWidget from './common/makeDropdownWidget';
import {hasNodeSelected, getSelectedNodes} from '../../../utils/flowChartUtils';
import {VerticalAlignTopOutlined, VerticalAlignMiddleOutlined, VerticalAlignBottomOutlined} from '@ant-design/icons';
interface IProps {
@ -69,9 +70,9 @@ const VerticalAlign: React.FC<IProps> = makeDropdownWidget({
tooltip: '垂直对齐',
getIcon(flowChart: Graph) {
let alignType = 'center';
const cells = flowChart.getSelectedCells();
if(cells.length > 0) {
alignType = safeGet(cells, '0.attrs.label.align.vertical', 'center');
const nodes = getSelectedNodes(flowChart);
if(nodes.length > 0) {
alignType = safeGet(nodes, '0.attrs.label.align.vertical', 'center');
}
return ALIGN_MAP[alignType].icon;
},
@ -88,14 +89,10 @@ const VerticalAlign: React.FC<IProps> = makeDropdownWidget({
);
},
handler: (flowChart: Graph, value: any) => {
const cells = flowChart.getSelectedCells();
if(cells.length > 0) {
cells.forEach(cell => cell.setAttrs({label: value}));
flowChart.trigger('toolBar:forceUpdate');
}
getSelectedNodes(flowChart).forEach(node => node.setAttrs({label: value}));
},
disabled(flowChart: Graph) {
return flowChart.getSelectedCellCount() === 0;
return !hasNodeSelected(flowChart);
},
});

2
packages/core/src/mods/toolBar/widgets/zoom.tsx

@ -3,8 +3,8 @@ import React, {useState, useEffect} from 'react';
import styles from './index.module.less';
import {Graph} from '@antv/x6';
import makeBtnWidget from './makeBtnWidget';
import shortcuts from '../../../common/shortcuts';
import makeBtnWidget from './common/makeBtnWidget';
import {ZoomOutOutlined, ZoomInOutlined} from '@ant-design/icons';
interface IProps {

21
packages/core/src/utils/flowChartUtils.ts

@ -0,0 +1,21 @@
import {Cell, Graph} from "@antv/x6";
export const hasCellSelected = (flowChart: Graph): boolean => {
return flowChart.getSelectedCellCount() > 0;
}
export const hasNodeSelected = (flowChart: Graph): boolean => {
return flowChart.getSelectedCells().filter((cell: Cell) => cell.isNode()).length > 0;
};
export const hasEdgeSelected = (flowChart: Graph): boolean => {
return flowChart.getSelectedCells().filter((cell: Cell) => cell.isEdge()).length > 0;
};
export const getSelectedNodes = (flowChart: Graph): Cell[] => {
return flowChart.getSelectedCells().filter((cell: Cell) => cell.isNode());
}
export const getSelectedEdges = (flowChart: Graph): Cell[] => {
return flowChart.getSelectedCells().filter((cell: Cell) => cell.isEdge());
}
Loading…
Cancel
Save