vue-wiring-diagram 1.1.21 → 1.1.23

package/packages/components/tools.js

@@ -1,256 +1,256 @@
-import {Transform} from "@antv/x6-plugin-transform";
-import {Keyboard} from "@antv/x6-plugin-keyboard";
-import {Snapline} from "@antv/x6-plugin-snapline";
-import {Clipboard} from "@antv/x6-plugin-clipboard";
-import {History} from "@antv/x6-plugin-history";
-import {Selection} from "@antv/x6-plugin-selection";
-import {lineOptions} from "packages/components/settings.js";
-import {ARROWFORWARD, FLASHING, STOP} from "packages/components/enums.js";
-import {instance} from "packages/http.js";
-
-/**
- * 图形变换
- * @returns {Transform}
- */
-export const transform = () => {
-    return new Transform({
-        resizing: {
-            enabled: true,
-            preserveAspectRatio: false
-        },
-        rotating: true,
-    })
-}
-
-/**
- * 快捷键
- * @returns {Keyboard}
- */
-export const keyboard = () => {
-    return new Keyboard()
-}
-
-/**
- * 吸附线
- * @returns {Snapline}
- */
-export const snapLine = () => {
-    return new Snapline()
-}
-
-/**
- * 复制粘贴
- * @returns {Clipboard|*}
- */
-export const clipboard = () => {
-    return new Clipboard({
-        format(key) {
-            return key.replace(/\s/g, '').replace('cmd', 'command')
-        },
-    })
-}
-
-// 排除撤销重做的命令
-const excludeHistoryCommand = [
-    'tools',
-    'ports'
-]
-
-/**
- * 撤销重做
- * @returns {History}
- */
-export const history = () => {
-    return new History({
-        beforeAddCommand: (name, args) => {
-            if (excludeHistoryCommand.includes(args.key)) {
-                return false
-            }
-        }
-    })
-}
-
-/**
- * 框选
- * @returns {Selection}
- */
-export const selection = () => {
-    return new Selection({
-        enabled: true,
-        multiple: true, //多选
-        rubberband: true, //框选节点
-        modifiers: ['alt'],
-        showNodeSelectionBox: true,
-    })
-}
-
-/**
- * 删除
- * @param graph
- * @returns {boolean}
- */
-export const deleteCell = (graph) => {
-    const cells = graph.getSelectedCells()
-    if (cells.length) {
-        graph.removeCells(cells)
-    }
-}
-
-/**
- * 复制
- * @param graph
- * @returns {boolean}
- */
-export const copyCell = (graph) => {
-    const cells = graph.getSelectedCells()
-    if (cells.length) {
-        graph.copy(cells)
-    }
-}
-
-/**
- * 粘贴
- * @param graph
- * @returns {boolean}
- */
-export const pasteCell = (graph) => {
-    if (!graph.isClipboardEmpty()) {
-        const cells = graph.paste({offset: 32})
-        graph.cleanSelection()
-        graph.select(cells)
-    }
-}
-
-/**
- * 撤销
- * @param graph
- * @returns {boolean}
- */
-export const undoCell = (graph) => {
-    if (graph.canUndo()) {
-        graph.undo()
-    }
-}
-
-/**
- * 重做
- * @param graph
- * @returns {boolean}
- */
-export const redoCell = (graph) => {
-    if (graph.canRedo()) {
-        graph.redo()
-    }
-}
-
-/**
- * 添加线工具
- * @param cell
- */
-export const addLineTools = (cell) => {
-    cell.addTools([
-        {
-            name: 'vertices',
-            args: {
-                snapRadius: 3,
-                attrs: {
-                    r: 3,
-                    fill: '#239edd',
-                    cursor: 'move',
-                    'stroke-width': 2
-                },
-                modifiers: ['shift']
-            },
-        },
-        {
-            name: 'segments',
-            args: {
-                attrs: {
-                    stroke: '#239edd',
-                    strokeWidth: 2,
-                    strokeDasharray: '5 5',
-                },
-            },
-        },
-        {
-            name: 'source-arrowhead',
-            args: {
-                attrs: {
-                    stroke: '#239edd',
-                },
-            },
-        },
-        {
-            name: 'target-arrowhead',
-            args: {
-                attrs: {
-                    stroke: '#239edd',
-                },
-            },
-        },
-    ]);
-}
-
-/**
- * 判断当前默认线的类型
- */
-export const isLineOrPipe = () => {
-    if (lineOptions.attrs?.pipe) {
-        return 'pipe'
-    }
-    if (lineOptions.attrs?.arrow) {
-        return 'arrow'
-    }
-    return 'line'
-}
-
-/**
- * 设置管道方向
- * @param direction none无 forward-pipe正向 reverse-pipe反向
- */
-export const setPipeDirection = (direction) => {
-    if (direction !== 'none') {
-        return direction + ' 30s infinite linear'
-    } else {
-        return ''
-    }
-}
-
-/**
- * 设置随机数
- * @returns {number}
- */
-export const setMathRandom = () => {
-    return Math.random()
-}
-
-// 默认展示的字符串
-export const defaultText = '--'
-
-// 默认匹配字符串
-export const defaultMatch = /\$\{([^}]+)\}/g
-
-// 默认条件管道单个配置
-export const defaultPipeCondition = {
-    min: 0,
-    max: 0,
-    direction: STOP,
-}
-
-/**
- * 设置SunCloud的图片地址
- * @param url
- * @returns {string}
- */
-export const setSunCloudImageUrl = (url) => {
-    return instance.defaults.baseURL + url.replace('/cny','')
-}
-
-// 默认条件箭头线配置
-export const defaultArrowCondition = {
-    min: 0,
-    max: 0,
-    animation: FLASHING,
-    direction: ARROWFORWARD,
-    display: 'block'
-}
+import {Transform} from "@antv/x6-plugin-transform";
+import {Keyboard} from "@antv/x6-plugin-keyboard";
+import {Snapline} from "@antv/x6-plugin-snapline";
+import {Clipboard} from "@antv/x6-plugin-clipboard";
+import {History} from "@antv/x6-plugin-history";
+import {Selection} from "@antv/x6-plugin-selection";
+import {lineOptions} from "packages/components/settings.js";
+import {ARROWFORWARD, FLASHING, STOP} from "packages/components/enums.js";
+import {instance} from "packages/http.js";
+
+/**
+ * 图形变换
+ * @returns {Transform}
+ */
+export const transform = () => {
+    return new Transform({
+        resizing: {
+            enabled: true,
+            preserveAspectRatio: false
+        },
+        rotating: true,
+    })
+}
+
+/**
+ * 快捷键
+ * @returns {Keyboard}
+ */
+export const keyboard = () => {
+    return new Keyboard()
+}
+
+/**
+ * 吸附线
+ * @returns {Snapline}
+ */
+export const snapLine = () => {
+    return new Snapline()
+}
+
+/**
+ * 复制粘贴
+ * @returns {Clipboard|*}
+ */
+export const clipboard = () => {
+    return new Clipboard({
+        format(key) {
+            return key.replace(/\s/g, '').replace('cmd', 'command')
+        },
+    })
+}
+
+// 排除撤销重做的命令
+const excludeHistoryCommand = [
+    'tools',
+    'ports'
+]
+
+/**
+ * 撤销重做
+ * @returns {History}
+ */
+export const history = () => {
+    return new History({
+        beforeAddCommand: (name, args) => {
+            if (excludeHistoryCommand.includes(args.key)) {
+                return false
+            }
+        }
+    })
+}
+
+/**
+ * 框选
+ * @returns {Selection}
+ */
+export const selection = () => {
+    return new Selection({
+        enabled: true,
+        multiple: true, //多选
+        rubberband: true, //框选节点
+        modifiers: ['alt'],
+        showNodeSelectionBox: true,
+    })
+}
+
+/**
+ * 删除
+ * @param graph
+ * @returns {boolean}
+ */
+export const deleteCell = (graph) => {
+    const cells = graph.getSelectedCells()
+    if (cells.length) {
+        graph.removeCells(cells)
+    }
+}
+
+/**
+ * 复制
+ * @param graph
+ * @returns {boolean}
+ */
+export const copyCell = (graph) => {
+    const cells = graph.getSelectedCells()
+    if (cells.length) {
+        graph.copy(cells)
+    }
+}
+
+/**
+ * 粘贴
+ * @param graph
+ * @returns {boolean}
+ */
+export const pasteCell = (graph) => {
+    if (!graph.isClipboardEmpty()) {
+        const cells = graph.paste({offset: 32})
+        graph.cleanSelection()
+        graph.select(cells)
+    }
+}
+
+/**
+ * 撤销
+ * @param graph
+ * @returns {boolean}
+ */
+export const undoCell = (graph) => {
+    if (graph.canUndo()) {
+        graph.undo()
+    }
+}
+
+/**
+ * 重做
+ * @param graph
+ * @returns {boolean}
+ */
+export const redoCell = (graph) => {
+    if (graph.canRedo()) {
+        graph.redo()
+    }
+}
+
+/**
+ * 添加线工具
+ * @param cell
+ */
+export const addLineTools = (cell) => {
+    cell.addTools([
+        {
+            name: 'vertices',
+            args: {
+                snapRadius: 3,
+                attrs: {
+                    r: 3,
+                    fill: '#239edd',
+                    cursor: 'move',
+                    'stroke-width': 2
+                },
+                modifiers: ['shift']
+            },
+        },
+        {
+            name: 'segments',
+            args: {
+                attrs: {
+                    stroke: '#239edd',
+                    strokeWidth: 2,
+                    strokeDasharray: '5 5',
+                },
+            },
+        },
+        {
+            name: 'source-arrowhead',
+            args: {
+                attrs: {
+                    stroke: '#239edd',
+                },
+            },
+        },
+        {
+            name: 'target-arrowhead',
+            args: {
+                attrs: {
+                    stroke: '#239edd',
+                },
+            },
+        },
+    ]);
+}
+
+/**
+ * 判断当前默认线的类型
+ */
+export const isLineOrPipe = () => {
+    if (lineOptions.attrs?.pipe) {
+        return 'pipe'
+    }
+    if (lineOptions.attrs?.arrow) {
+        return 'arrow'
+    }
+    return 'line'
+}
+
+/**
+ * 设置管道方向
+ * @param direction none无 forward-pipe正向 reverse-pipe反向
+ */
+export const setPipeDirection = (direction) => {
+    if (direction !== 'none') {
+        return direction + ' 30s infinite linear'
+    } else {
+        return ''
+    }
+}
+
+/**
+ * 设置随机数
+ * @returns {number}
+ */
+export const setMathRandom = () => {
+    return Math.random()
+}
+
+// 默认展示的字符串
+export const defaultText = '--'
+
+// 默认匹配字符串
+export const defaultMatch = /\$\{([^}]+)\}/g
+
+// 默认条件管道单个配置
+export const defaultPipeCondition = {
+    min: 0,
+    max: 0,
+    direction: STOP,
+}
+
+/**
+ * 设置SunCloud的图片地址
+ * @param url
+ * @returns {string}
+ */
+export const setSunCloudImageUrl = (url) => {
+    return instance.defaults.baseURL + url.replace('/cny','')
+}
+
+// 默认条件箭头线配置
+export const defaultArrowCondition = {
+    min: 0,
+    max: 0,
+    animation: FLASHING,
+    direction: ARROWFORWARD,
+    display: 'block'
+}