service-flow-designer 0.0.2-tmp3 → 1.0.1

package/dist/lib/designer/service-flow-view/service-flow-tool.vue2.js

@@ -0,0 +1,193 @@
+"use strict";
+const es = require("element-plus/es");
+require("element-plus/es/components/base/style/css");
+require("element-plus/es/components/icon/style/css");
+require("element-plus/es/components/tooltip/style/css");
+require("element-plus/es/components/divider/style/css");
+require("element-plus/es/components/input/style/css");
+const vue = require("vue");
+const iconsVue = require("@element-plus/icons-vue");
+const flowUtil = require("./flow-util.js");
+const flowToolUtil = require("./flow-tool-util.js");
+const LogicFlow = require("@logicflow/core");
+require("codemirror");
+require("@codemirror/lang-json");
+require("@codemirror/state");
+require("@uiw/codemirror-themes-all");
+const jsonViewDialog_vue_vue_type_script_setup_true_lang = require("../common/components/json-view/json-view-dialog.vue.js");
+const serviceTest_vue_vue_type_script_setup_true_lang = require("./service-test/service-test.vue.js");
+const _withScopeId = (n) => (vue.pushScopeId("data-v-fdc6ec07"), n = n(), vue.popScopeId(), n);
+const _hoisted_1 = { class: "amb-design-tool" };
+const _hoisted_2 = { style: { "top": "-5px", "margin-left": "10px", "position": "relative" } };
+const _hoisted_3 = { style: { "float": "right" } };
+const _hoisted_4 = ["onClick"];
+const _hoisted_5 = /* @__PURE__ */ _withScopeId(() => /* @__PURE__ */ vue.createElementVNode("label", null, "查看JSON", -1));
+const _hoisted_6 = /* @__PURE__ */ _withScopeId(() => /* @__PURE__ */ vue.createElementVNode("label", null, "日志", -1));
+const _hoisted_7 = /* @__PURE__ */ _withScopeId(() => /* @__PURE__ */ vue.createElementVNode("label", null, "测试", -1));
+const _hoisted_8 = /* @__PURE__ */ _withScopeId(() => /* @__PURE__ */ vue.createElementVNode("label", null, "保存", -1));
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  __name: "service-flow-tool",
+  props: {
+    cloneService: {
+      type: Object,
+      default: () => {
+      }
+    },
+    lf: {
+      type: LogicFlow,
+      default: () => {
+      }
+    }
+  },
+  emits: ["show-service-log", "save-sevice", "show-json"],
+  setup(__props, { emit: __emit }) {
+    const emits = __emit;
+    const props = __props;
+    const clickControlType = vue.ref("");
+    const jsonDialogVisible = vue.ref(false);
+    const testDialogVisble = vue.ref(false);
+    const jsonObject = vue.ref({});
+    const controlClick = (item) => {
+      if (!props.lf) {
+        return;
+      }
+      flowToolUtil.customControlClick(props.lf, item);
+    };
+    const showJson = () => {
+      var _a;
+      jsonDialogVisible.value = true;
+      jsonObject.value = JSON.parse(JSON.stringify(props.cloneService));
+      jsonObject.value.flow = (_a = props.lf) == null ? void 0 : _a.getGraphData();
+      emits("show-json");
+    };
+    const showTestDialog = () => {
+      testDialogVisble.value = !testDialogVisble.value;
+    };
+    const showServiceLog = () => {
+      emits("show-service-log", {});
+    };
+    const saveService = () => {
+      emits("save-sevice");
+    };
+    return (_ctx, _cache) => {
+      const _component_el_input = es.ElInput;
+      const _component_el_divider = es.ElDivider;
+      const _component_el_tooltip = es.ElTooltip;
+      const _component_el_icon = es.ElIcon;
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
+        vue.withDirectives(vue.createElementVNode("span", _hoisted_2, [
+          vue.createVNode(_component_el_input, {
+            placeholder: "",
+            modelValue: __props.cloneService.name,
+            "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => __props.cloneService.name = $event),
+            style: { "width": "150px" }
+          }, null, 8, ["modelValue"])
+        ], 512), [
+          [vue.vShow, __props.cloneService.code]
+        ]),
+        vue.withDirectives(vue.createElementVNode("span", _hoisted_3, [
+          vue.createVNode(_component_el_divider, {
+            direction: "vertical",
+            class: "amb-design-tool-split"
+          }),
+          (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(vue.unref(flowUtil.customControl), (item) => {
+            return vue.openBlock(), vue.createBlock(_component_el_tooltip, {
+              class: "box-item",
+              effect: "dark",
+              content: item.desc,
+              placement: "top"
+            }, {
+              default: vue.withCtx(() => [
+                vue.createElementVNode("label", {
+                  class: vue.normalizeClass(["control-item", item.type === clickControlType.value ? "control-item-click" : ""]),
+                  onClick: ($event) => controlClick(item)
+                }, [
+                  vue.createElementVNode("i", {
+                    class: vue.normalizeClass(item.class)
+                  }, null, 2)
+                ], 10, _hoisted_4)
+              ]),
+              _: 2
+            }, 1032, ["content"]);
+          }), 256)),
+          vue.createVNode(_component_el_divider, {
+            direction: "vertical",
+            class: "amb-design-tool-split"
+          }),
+          vue.createElementVNode("label", {
+            class: "amb-page-type",
+            onClick: showJson
+          }, [
+            vue.createVNode(_component_el_icon, { size: 18 }, {
+              default: vue.withCtx(() => [
+                vue.createVNode(vue.unref(iconsVue.View))
+              ]),
+              _: 1
+            }),
+            _hoisted_5
+          ]),
+          vue.createElementVNode("label", {
+            class: "amb-page-type",
+            onClick: showServiceLog
+          }, [
+            vue.createVNode(_component_el_icon, { size: 18 }, {
+              default: vue.withCtx(() => [
+                vue.createVNode(vue.unref(iconsVue.View))
+              ]),
+              _: 1
+            }),
+            _hoisted_6
+          ]),
+          vue.createVNode(_component_el_divider, {
+            direction: "vertical",
+            class: "amb-design-tool-split"
+          }),
+          vue.createElementVNode("label", {
+            class: "amb-page-type",
+            onClick: showTestDialog
+          }, [
+            vue.createVNode(_component_el_icon, { size: 18 }, {
+              default: vue.withCtx(() => [
+                vue.createVNode(vue.unref(iconsVue.CaretRight))
+              ]),
+              _: 1
+            }),
+            _hoisted_7
+          ]),
+          vue.createVNode(_component_el_divider, {
+            direction: "vertical",
+            class: "amb-design-tool-split"
+          }),
+          vue.createElementVNode("label", {
+            class: "amb-page-type",
+            onClick: saveService
+          }, [
+            vue.createVNode(_component_el_icon, { size: 18 }, {
+              default: vue.withCtx(() => [
+                vue.createVNode(vue.unref(iconsVue.Check))
+              ]),
+              _: 1
+            }),
+            _hoisted_8
+          ])
+        ], 512), [
+          [vue.vShow, __props.cloneService.code]
+        ]),
+        vue.createVNode(vue.unref(jsonViewDialog_vue_vue_type_script_setup_true_lang), {
+          modelValue: jsonDialogVisible.value,
+          "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => jsonDialogVisible.value = $event),
+          "json-object": jsonObject.value,
+          "append-to-body": true
+        }, null, 8, ["modelValue", "json-object"]),
+        vue.createVNode(serviceTest_vue_vue_type_script_setup_true_lang, {
+          modelValue: testDialogVisble.value,
+          "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => testDialogVisble.value = $event),
+          "append-to-body": true,
+          cloneService: __props.cloneService,
+          lf: __props.lf
+        }, null, 8, ["modelValue", "cloneService", "lf"])
+      ]);
+    };
+  }
+});
+module.exports = _sfc_main;

package/dist/lib/designer/service-flow-view/service-node-config.css

@@ -0,0 +1,10 @@
+
+.el-drawer__header {
+  margin-bottom: 0 !important;
+}
+/**
+解决右侧弹出属性配置遮罩层打开后页面其他地方无法点击问题
+ */
+[data-v-aa025314] .el-overlay {
+  position: static;
+}

package/dist/lib/designer/service-flow-view/service-node-config.vue.js

@@ -0,0 +1,6 @@
+"use strict";
+const serviceNodeConfig_vue_vue_type_script_setup_true_lang = require("./service-node-config.vue2.js");
+;/* empty css                          */
+const _pluginVue_exportHelper = require("../../_virtual/_plugin-vue_export-helper.js");
+const serviceNodeConfig = /* @__PURE__ */ _pluginVue_exportHelper(serviceNodeConfig_vue_vue_type_script_setup_true_lang, [["__scopeId", "data-v-aa025314"]]);
+module.exports = serviceNodeConfig;

package/dist/lib/designer/service-flow-view/service-node-config.vue2.js

@@ -0,0 +1,152 @@
+"use strict";
+const es = require("element-plus/es");
+require("element-plus/es/components/base/style/css");
+require("element-plus/es/components/drawer/style/css");
+const vue = require("vue");
+const index = require("../service-components/index.js");
+const _hoisted_1 = ["id"];
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  __name: "service-node-config",
+  props: {
+    service: {
+      type: Object,
+      default: () => {
+        return {};
+      }
+    },
+    currentNode: {
+      type: Object,
+      default: () => {
+        return {};
+      }
+    },
+    logicFlowInstance: {
+      type: Object,
+      default: () => {
+        return {};
+      }
+    }
+  },
+  emits: ["onConfigChange", "update:currentNode"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    const props = __props;
+    const properties = vue.ref({});
+    const drawerVisible = vue.ref(false);
+    const logicNodeType = vue.ref({});
+    const configComponentRef = vue.ref();
+    const drawerConfig = vue.ref({ withHeader: true, drawerWidth: "" });
+    const emits = __emit;
+    let serviceNodeTypeData = { configComponent: null, drawerWidth: "50%" };
+    function onNodeClick(model) {
+      if (!["start", "end"].includes(model.data.type)) {
+        if (drawerVisible.value == true) {
+          updateNodeValue();
+          logicNodeType.value = index.getServiceNodeByType(model.data.type);
+        } else {
+          showDrawer();
+          logicNodeType.value = index.getServiceNodeByType(model.data.type);
+        }
+        serviceNodeTypeData = index.getConfigByType(model.data.type);
+      } else {
+        updateNodeValue();
+        closeDrawer();
+      }
+      properties.value = model.data.properties;
+    }
+    function onBlankClick() {
+      if (drawerVisible.value) {
+        updateNodeValue();
+        closeDrawer();
+      }
+    }
+    function onDeleteNode() {
+      closeDrawer();
+    }
+    function showDrawer() {
+      drawerVisible.value = true;
+    }
+    function closeDrawer() {
+      drawerVisible.value = false;
+      emits("update:currentNode", null);
+    }
+    function onLogicChange() {
+      closeDrawer();
+    }
+    function updateNodeValue() {
+      console.log(" 关闭配置窗口时时自动赋值", props.currentNode);
+      if (configComponentRef.value.hasOwnProperty("onClose") && typeof configComponentRef.value.onClose === "function") {
+        configComponentRef.value.onClose();
+      }
+      if (!["start", "end"].includes(props.currentNode.type)) {
+        if (configComponentRef.value.hasOwnProperty("getData") && typeof configComponentRef.value.getData === "function") {
+          if (props.logicFlowInstance) {
+            if (props.logicFlowInstance.getNodeModelById(props.currentNode.data.id)) {
+              props.logicFlowInstance.getNodeModelById(props.currentNode.data.id).setProperties(configComponentRef.value.getData());
+            }
+          }
+        } else {
+          props.logicFlowInstance.getNodeModelById(props.currentNode.data.id).setProperties(properties.value);
+        }
+      }
+    }
+    function fullScreenConfig(config) {
+      if (config) {
+        if (config.withHeader === false) {
+          drawerConfig.value.withHeader = false;
+        } else {
+          drawerConfig.value.withHeader = true;
+        }
+        if (config.drawerWidth) {
+          drawerConfig.value.drawerWidth = config.drawerWidth;
+        } else {
+          drawerConfig.value.drawerWidth = "100%";
+        }
+      } else {
+        drawerConfig.value.drawerWidth = "100%";
+      }
+    }
+    __expose({
+      onBlankClick,
+      onNodeClick,
+      onLogicChange,
+      onDeleteNode,
+      closeDrawer
+    });
+    return (_ctx, _cache) => {
+      const _component_el_drawer = es.ElDrawer;
+      return vue.openBlock(), vue.createBlock(_component_el_drawer, {
+        modelValue: drawerVisible.value,
+        "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => drawerVisible.value = $event),
+        "append-to-body": false,
+        "close-on-press-escape": false,
+        "destroy-on-close": "",
+        "with-header": drawerConfig.value.withHeader,
+        "modal-class": "el-overlay",
+        modal: true,
+        title: logicNodeType.value.label,
+        direction: "rtl",
+        size: drawerConfig.value.drawerWidth ? drawerConfig.value.drawerWidth : vue.unref(serviceNodeTypeData).drawerWidth ? vue.unref(serviceNodeTypeData).drawerWidth : "50%"
+      }, {
+        header: vue.withCtx(({ close, titleId, titleClass }) => [
+          vue.createElementVNode("h4", {
+            id: titleId,
+            class: vue.normalizeClass(titleClass)
+          }, vue.toDisplayString(logicNodeType.value.label), 11, _hoisted_1)
+        ]),
+        default: vue.withCtx(() => [
+          (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(vue.unref(serviceNodeTypeData).configComponent), {
+            ref_key: "configComponentRef",
+            ref: configComponentRef,
+            logicFlowInstance: __props.logicFlowInstance,
+            currentNode: __props.currentNode,
+            properties: properties.value,
+            service: __props.service,
+            onFullScreen: fullScreenConfig
+          }, null, 40, ["logicFlowInstance", "currentNode", "properties", "service"]))
+        ]),
+        _: 1
+      }, 8, ["modelValue", "with-header", "title", "size"]);
+    };
+  }
+});
+module.exports = _sfc_main;