@web-utils/component 2.7.30 → 2.7.32

package/dist/components/flow/{index.js → index.mjs}

@@ -1,31 +1,33 @@
-import { s as setPx, r as randomId } from "../../chunks/util.89913643.js";
-import { n as normalizeComponent } from "../../chunks/vueComponentNormalizer.77ec6792.js";
+import { s as setPx, r as randomId } from "../../chunks/util.b0d0b0ad.mjs";
+import { n as normalizeComponent } from "../../chunks/vueComponentNormalizer.9c6b8b3d.mjs";
 var render = function() {
-  var _vm = this, _h = _vm.$createElement, _c = _vm._self._c || _h;
+  var _vm = this;
+  var _h = _vm.$createElement;
+  var _c = _vm._self._c || _h;
   return _c("div", {
     staticClass: "avue-flow",
     style: _vm.styleName
   }, [_c("div", {
     style: _vm.styleName,
     attrs: {
-      id: _vm.id
+      "id": _vm.id
     }
   }, [_c("div", {
     staticClass: "avue-grid"
   }), _vm._l(_vm.option.nodeList, function(node, index) {
-    return [node.display ? _vm._e() : _c("FlowNode", {
+    return [!node.display ? _c("FlowNode", {
       key: index,
       attrs: {
-        id: node.id,
-        node,
-        index,
-        active: _vm.active
+        "id": node.id,
+        "node": node,
+        "index": index,
+        "active": _vm.active
       },
       on: {
-        changeNodeSite: _vm.changeNodeSite
+        "changeNodeSite": _vm.changeNodeSite
       },
       nativeOn: {
-        click: function($event) {
+        "click": function($event) {
           return _vm.handleClick(node);
         }
       },
@@ -34,15 +36,17 @@ var render = function() {
         fn: function(_ref) {
           var s = _ref.node;
           return [_vm._t("header", null, {
-            node: s
+            "node": s
           })];
         }
-      }], null, !0)
+      }], null, true)
     }, [_vm._t("default", null, {
-      node
-    })], 2)];
+      "node": node
+    })], 2) : _vm._e()];
   })], 2)]);
-}, staticRenderFns = [];
+};
+var staticRenderFns = [];
+const Flow_vue_vue_type_style_index_0_lang = "";
 const __vue2_script = {
   name: "Flow",
   props: {
@@ -73,15 +77,15 @@ const __vue2_script = {
         // 连线的样式 StateMachine、Flowchart
         Connector: "Flowchart",
         // 鼠标不能拖动删除线
-        ConnectionsDetachable: !1,
+        ConnectionsDetachable: false,
         // 删除线的时候节点不删除
-        DeleteEndpointsOnDetach: !1,
+        DeleteEndpointsOnDetach: false,
         // 连线的端点
         // Endpoint: ["Dot", {radius: 5}],
         Endpoint: ["Rectangle", { height: 10, width: 10 }],
         // 线端点的样式
         EndpointStyle: { fill: "rgba(255,255,255,0)", outlineWidth: 1 },
-        LogEnabled: !0,
+        LogEnabled: true,
         // 是否打开jsPlumb的内部日志记录
         // 绘制线
         PaintStyle: { stroke: "black", strokeWidth: 3 },
@@ -91,26 +95,26 @@ const __vue2_script = {
       },
       // jsplumb连接参数
       jsplumbConnectOptions: {
-        isSource: !0,
-        isTarget: !0,
+        isSource: true,
+        isTarget: true,
         // 动态锚点、提供了4个方向 Continuous、AutoDefault
         anchor: "Continuous"
       },
       jsplumbSourceOptions: {
         filter: ".avue-flow__node-drag",
         /* "span"表示标签，".className"表示类，"#id"表示元素id */
-        filterExclude: !1,
+        filterExclude: false,
         anchor: "Continuous",
-        allowLoopback: !1
+        allowLoopback: false
       },
       jsplumbTargetOptions: {
         filter: ".avue-flow__node-drag",
         /* "span"表示标签，".className"表示类，"#id"表示元素id */
-        filterExclude: !1,
+        filterExclude: false,
         anchor: "Continuous",
-        allowLoopback: !1
+        allowLoopback: false
       },
-      loadEasyFlowFinish: !1
+      loadEasyFlowFinish: false
     };
   },
   computed: {
@@ -119,7 +123,8 @@ const __vue2_script = {
         return this.value;
       },
       set(val) {
-        this.$emit("input", val), this.$emit("change", val);
+        this.$emit("input", val);
+        this.$emit("change", val);
       }
     },
     styleName() {
@@ -131,14 +136,16 @@ const __vue2_script = {
     }
   },
   created() {
-    this.id = randomId(), this.jsplumbSetting.Container = this.id;
+    this.id = randomId();
+    this.jsplumbSetting.Container = this.id;
   },
   mounted() {
     this.init();
   },
   methods: {
     init() {
-      this.jsPlumb = jsPlumb.getInstance(), this.$nextTick(() => {
+      this.jsPlumb = jsPlumb.getInstance();
+      this.$nextTick(() => {
         this.jsPlumbInit();
       });
     },
@@ -149,10 +156,11 @@ const __vue2_script = {
     hasLine(from, to) {
       for (let i = 0; i < this.data.lineList.length; i++) {
         const line = this.data.lineList[i];
-        if (line.from === from && line.to === to)
-          return !0;
+        if (line.from === from && line.to === to) {
+          return true;
+        }
       }
-      return !1;
+      return false;
     },
     // 是否含有相反的线
     hashOppositeLine(from, to) {
@@ -170,35 +178,47 @@ const __vue2_script = {
     },
     // 改变节点的位置
     changeNodeSite({ index, left, top }) {
-      for (let i = 0; i < this.option.nodeList.length; i++)
-        i === index && (this.$set(this.option.nodeList[i], "left", left), this.$set(this.option.nodeList[i], "top", top));
+      for (let i = 0; i < this.option.nodeList.length; i++) {
+        if (i === index) {
+          this.$set(this.option.nodeList[i], "left", left);
+          this.$set(this.option.nodeList[i], "top", top);
+        }
+      }
     },
     // 删除节点
     deleteNode(nodeId) {
-      return this.$confirm(`确定要删除节点${nodeId}?`, "提示", {
+      this.$confirm(`确定要删除节点${nodeId}?`, "提示", {
         confirmButtonText: "确定",
         cancelButtonText: "取消",
         type: "warning",
-        closeOnClickModal: !1
+        closeOnClickModal: false
       }).then(() => {
         this.option.nodeList.forEach((node) => {
-          node.id === nodeId && (node.display = !0);
-        }), this.$nextTick(function() {
+          if (node.id === nodeId) {
+            node.display = true;
+          }
+        });
+        this.$nextTick(function() {
           this.jsPlumb.removeAllEndpoints(nodeId);
         });
       }).catch(() => {
-      }), !0;
+      });
+      return true;
     },
     // 添加新的节点
     addNode(name) {
-      const index = this.option.nodeList.length, nodeId = `node${index}`;
+      const index = this.option.nodeList.length;
+      const nodeId = `node${index}`;
       this.option.nodeList.push({
         id: `node${index}`,
         name,
         left: 0,
         top: 0
-      }), this.$nextTick(function() {
-        this.jsPlumb.makeSource(nodeId, this.jsplumbSourceOptions), this.jsPlumb.makeTarget(nodeId, this.jsplumbTargetOptions), this.jsPlumb.draggable(nodeId, {
+      });
+      this.$nextTick(function() {
+        this.jsPlumb.makeSource(nodeId, this.jsplumbSourceOptions);
+        this.jsPlumb.makeTarget(nodeId, this.jsplumbTargetOptions);
+        this.jsPlumb.draggable(nodeId, {
           containment: "parent"
         });
       });
@@ -206,7 +226,9 @@ const __vue2_script = {
     loadEasyFlow() {
       for (var i = 0; i < this.option.nodeList.length; i++) {
         const node = this.option.nodeList[i];
-        this.jsPlumb.makeSource(node.id, this.jsplumbSourceOptions), this.jsPlumb.makeTarget(node.id, this.jsplumbTargetOptions), this.jsPlumb.draggable(node.id);
+        this.jsPlumb.makeSource(node.id, this.jsplumbSourceOptions);
+        this.jsPlumb.makeTarget(node.id, this.jsplumbTargetOptions);
+        this.jsPlumb.draggable(node.id);
       }
       for (var i = 0; i < this.option.lineList.length; i++) {
         const line = this.option.lineList[i];
@@ -216,14 +238,18 @@ const __vue2_script = {
         }, this.jsplumbConnectOptions);
       }
       this.$nextTick(function() {
-        this.loadEasyFlowFinish = !0;
+        this.loadEasyFlowFinish = true;
       });
     },
     jsPlumbInit() {
       const _this = this;
       this.jsPlumb.ready(function() {
-        _this.jsPlumb.importDefaults(_this.jsplumbSetting), _this.jsPlumb.setSuspendDrawing(!1, !0), _this.loadEasyFlow(), _this.jsPlumb.bind("click", function(conn) {
-          console.log("click", conn), _this.$confirm("确定删除所点击的线吗?", "提示", {
+        _this.jsPlumb.importDefaults(_this.jsplumbSetting);
+        _this.jsPlumb.setSuspendDrawing(false, true);
+        _this.loadEasyFlow();
+        _this.jsPlumb.bind("click", function(conn) {
+          console.log("click", conn);
+          _this.$confirm("确定删除所点击的线吗?", "提示", {
             confirmButtonText: "确定",
             cancelButtonText: "取消",
             type: "warning"
@@ -231,43 +257,69 @@ const __vue2_script = {
             _this.jsPlumb.deleteConnection(conn);
           }).catch(() => {
           });
-        }), _this.jsPlumb.bind("connection", function(evt) {
+        });
+        _this.jsPlumb.bind("connection", function(evt) {
           console.log("connection", evt);
-          const from = evt.source.id, to = evt.target.id;
-          _this.loadEasyFlowFinish && _this.option.lineList.push({
-            from,
-            to
-          });
-        }), _this.jsPlumb.bind("connectionDetached", function(evt) {
-          console.log("connectionDetached", evt), _this.deleteLine(evt.sourceId, evt.targetId);
-        }), _this.jsPlumb.bind("connectionMoved", function(evt) {
-          console.log("connectionMoved", evt), _this.changeLine(evt.originalSourceId, evt.originalTargetId);
-        }), _this.jsPlumb.bind("contextmenu", function(evt) {
+          const from = evt.source.id;
+          const to = evt.target.id;
+          if (_this.loadEasyFlowFinish) {
+            _this.option.lineList.push({
+              from,
+              to
+            });
+          }
+        });
+        _this.jsPlumb.bind("connectionDetached", function(evt) {
+          console.log("connectionDetached", evt);
+          _this.deleteLine(evt.sourceId, evt.targetId);
+        });
+        _this.jsPlumb.bind("connectionMoved", function(evt) {
+          console.log("connectionMoved", evt);
+          _this.changeLine(evt.originalSourceId, evt.originalTargetId);
+        });
+        _this.jsPlumb.bind("contextmenu", function(evt) {
           console.log("contextmenu", evt);
-        }), _this.jsPlumb.bind("beforeDrop", function(evt) {
+        });
+        _this.jsPlumb.bind("beforeDrop", function(evt) {
           console.log("beforeDrop", evt);
-          const from = evt.sourceId, to = evt.targetId;
-          return from === to ? (_this.$message.error("不能连接自己"), !1) : _this.hasLine(from, to) ? (_this.$message.error("不能重复连线"), !1) : _this.hashOppositeLine(from, to) ? (_this.$message.error("不能回环哦"), !1) : !0;
-        }), _this.jsPlumb.bind("beforeDetach", function(evt) {
+          const from = evt.sourceId;
+          const to = evt.targetId;
+          if (from === to) {
+            _this.$message.error("不能连接自己");
+            return false;
+          }
+          if (_this.hasLine(from, to)) {
+            _this.$message.error("不能重复连线");
+            return false;
+          }
+          if (_this.hashOppositeLine(from, to)) {
+            _this.$message.error("不能回环哦");
+            return false;
+          }
+          return true;
+        });
+        _this.jsPlumb.bind("beforeDetach", function(evt) {
           console.log("beforeDetach", evt);
         });
       });
     }
   }
-}, __cssModules = {};
+};
+const __cssModules = {};
 var __component__ = /* @__PURE__ */ normalizeComponent(
   __vue2_script,
   render,
   staticRenderFns,
-  !1,
+  false,
   __vue2_injectStyles,
   null,
   null,
   null
 );
 function __vue2_injectStyles(context) {
-  for (let o in __cssModules)
+  for (let o in __cssModules) {
     this[o] = __cssModules[o];
+  }
 }
 const Flow = /* @__PURE__ */ function() {
   return __component__.exports;

package/dist/components/flow/style.css

@@ -1 +1,44 @@
-.avue-flow{position:relative}.avue-flow .avue-draggable{padding:0}.avue-flow__node{position:relative;display:flex;flex-direction:column;width:200px;height:80px;border-radius:5px;box-shadow:"#66a6e0 0px 0px 12px 0px";border:1px solid #eee;box-sizing:border-box;overflow:hidden}.avue-flow__node--active{border-width:2px;border-color:#f56c6c}.avue-flow__node-drag{margin:0 5px;display:inline-block}.avue-flow__node-header{flex:1;background-color:#66a6e0}.avue-flow__node-body{display:flex;align-items:center;justify-content:center;flex:1.5;text-align:center;background:#fff}
+/* 全局公共颜色配置 */ /* 全局公共尺寸配置 */
+/* 应用头部高度 */
+/* 页面宽度 */
+/* 侧栏宽度 */
+/* 标签高度 */
+/* 页面头部工具条高度 */
+.avue-flow {
+  position: relative;
+}
+.avue-flow .avue-draggable {
+  padding: 0;
+}
+.avue-flow__node {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  width: 200px;
+  height: 80px;
+  border-radius: 5px;
+  box-shadow: "#66a6e0 0px 0px 12px 0px";
+  border: 1px solid #eee;
+  box-sizing: border-box;
+  overflow: hidden;
+}
+.avue-flow__node--active {
+  border-width: 2px;
+  border-color: #f56c6c;
+}
+.avue-flow__node-drag {
+  margin: 0 5px;
+  display: inline-block;
+}
+.avue-flow__node-header {
+  flex: 1;
+  background-color: #66a6e0;
+}
+.avue-flow__node-body {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex: 1.5;
+  text-align: center;
+  background: #fff;
+}

package/dist/components/flow-node/{index.js → index.mjs}

@@ -1,24 +1,26 @@
-import { s as setPx } from "../../chunks/util.89913643.js";
-import { n as normalizeComponent } from "../../chunks/vueComponentNormalizer.77ec6792.js";
+import { s as setPx } from "../../chunks/util.b0d0b0ad.mjs";
+import { n as normalizeComponent } from "../../chunks/vueComponentNormalizer.9c6b8b3d.mjs";
 var render = function() {
-  var _vm = this, _h = _vm.$createElement, _c = _vm._self._c || _h;
+  var _vm = this;
+  var _h = _vm.$createElement;
+  var _c = _vm._self._c || _h;
   return _c("div", {
     ref: "node",
     style: _vm.flowNodeContainer,
     attrs: {
-      left: _vm.node.left,
-      top: _vm.node.top,
-      disabled: "",
-      mask: !1
+      "left": _vm.node.left,
+      "top": _vm.node.top,
+      "disabled": "",
+      "mask": false
     },
     on: {
-      mouseenter: _vm.showDelete,
-      mouseleave: _vm.hideDelete,
-      mouseup: _vm.changeNodeSite
+      "mouseenter": _vm.showDelete,
+      "mouseleave": _vm.hideDelete,
+      "mouseup": _vm.changeNodeSite
     }
   }, [_c("div", {
     class: ["avue-flow__node", {
-      active: _vm.active === _vm.node.id
+      "active": _vm.active === _vm.node.id
     }]
   }, [_c("div", {
     staticClass: "avue-flow__node-header"
@@ -26,13 +28,14 @@ var render = function() {
     staticClass: "el-icon-rank",
     class: _vm.b("node-drag")
   }), _vm._t("header", null, {
-    node: _vm.node
+    "node": _vm.node
   })], 2), _c("div", {
     staticClass: "avue-flow__node-body"
   }, [_vm._t("default", null, {
-    node: _vm.node
+    "node": _vm.node
   })], 2)])]);
-}, staticRenderFns = [];
+};
+var staticRenderFns = [];
 const __vue2_script = {
   name: "FlowNode",
   props: {
@@ -43,7 +46,7 @@ const __vue2_script = {
   data() {
     return {
       // 控制节点操作显示
-      mouseEnter: !1
+      mouseEnter: false
     };
   },
   computed: {
@@ -64,35 +67,40 @@ const __vue2_script = {
   methods: {
     // 鼠标进入
     showDelete() {
-      this.mouseEnter = !0;
+      this.mouseEnter = true;
     },
     // 鼠标离开
     hideDelete() {
-      this.mouseEnter = !1;
+      this.mouseEnter = false;
     },
     // 鼠标移动后抬起
     changeNodeSite() {
-      this.node.left == this.$refs.node.style.left && this.node.top == this.$refs.node.style.top || this.$emit("changeNodeSite", {
+      if (this.node.left == this.$refs.node.style.left && this.node.top == this.$refs.node.style.top) {
+        return;
+      }
+      this.$emit("changeNodeSite", {
         index: this.index,
         left: Number(this.$refs.node.style.left.replace("px", "")),
         top: Number(this.$refs.node.style.top.replace("px", ""))
       });
     }
   }
-}, __cssModules = {};
+};
+const __cssModules = {};
 var __component__ = /* @__PURE__ */ normalizeComponent(
   __vue2_script,
   render,
   staticRenderFns,
-  !1,
+  false,
   __vue2_injectStyles,
   null,
   null,
   null
 );
 function __vue2_injectStyles(context) {
-  for (let o in __cssModules)
+  for (let o in __cssModules) {
     this[o] = __cssModules[o];
+  }
 }
 const FlowNode = /* @__PURE__ */ function() {
   return __component__.exports;