"use strict";
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
require("../../../../../node_modules/element-plus/es/index.js");
;/* empty css                                                             */
;/* empty css                                                                  */
require("../../../../../node_modules/element-plus/theme-chalk/el-tooltip.css.js");
;/* empty css                                                                */
;/* empty css                                                                 */
;/* empty css                                                                  */
;/* empty css                                                                   */
;/* empty css                                                                      */
const Vue = require("vue");
const Add = require("./Add.vue2.js");
;/* empty css          */
const _pluginVue_exportHelper = require("../../../../../_virtual/_plugin-vue_export-helper.js");
const index = require("../../../../../node_modules/element-plus/es/components/popconfirm/index.js");
const index$1 = require("../../../../../node_modules/element-plus/es/components/button/index.js");
const index$2 = require("../../../../../node_modules/element-plus/es/components/input/index.js");
const index$3 = require("../../../../../node_modules/element-plus/es/directives/click-outside/index.js");
const index$4 = require("../../../../../node_modules/element-plus/es/components/text/index.js");
const index$5 = require("../../../../../node_modules/element-plus/es/components/icon/index.js");
const index$6 = require("../../../../../node_modules/element-plus/es/components/tooltip/index.js");
const _hoisted_1 = { class: "node-box" };
const _hoisted_2 = { class: "node-header" };
const _hoisted_3 = { class: "head" };
const _hoisted_4 = { class: "node-content" };
const _sfc_main = {
  __name: "Node",
  props: {
    icon: String,
    node: Object,
    color: String,
    readOnly: {
      type: Boolean,
      default: false
    },
    close: {
      type: Boolean,
      default: true
    }
  },
  emits: ["addNode", "delNode", "activeNode"],
  setup(__props, { emit: __emit }) {
    Vue.useCssVars((_ctx) => ({
      "77a51cb7": __props.color
    }));
    const _inject = Vue.inject("flowDesign", {
      readOnly: Vue.ref(false),
      nodesError: Vue.ref({})
    });
    const $emits = __emit;
    const $props = __props;
    const errorInfo = Vue.computed(() => _inject.nodesError.value[$props.node.id]);
    const _readOnly = Vue.computed(() => {
      var _a;
      return ((_a = _inject.readOnly) == null ? void 0 : _a.value) || $props.readOnly;
    });
    const showInput = Vue.ref(false);
    const inputRef = Vue.ref();
    const onShowInput = () => {
      if (_readOnly.value) return;
      showInput.value = true;
      Vue.nextTick(() => {
        var _a;
        (_a = inputRef.value) == null ? void 0 : _a.focus();
      });
    };
    const onClickOutside = () => {
      if (showInput.value) {
        showInput.value = false;
      }
    };
    const activeNode = () => {
      if (_readOnly.value) return;
      $emits("activeNode", $props.node);
    };
    const addNode = (type) => {
      $emits("addNode", type, $props.node);
    };
    const delNode = () => {
      $emits("delNode", $props.node);
    };
    return (_ctx, _cache) => {
      var _a;
      const _component_el_button = index$1.ElButton;
      const _component_el_popconfirm = index.ElPopconfirm;
      const _component_el_input = index$2.ElInput;
      const _component_EditPen = Vue.resolveComponent("EditPen");
      const _component_el_icon = index$5.ElIcon;
      const _component_el_text = index$4.ElText;
      const _component_svg_icon = Vue.resolveComponent("svg-icon");
      const _component_WarnTriangleFilled = Vue.resolveComponent("WarnTriangleFilled");
      const _component_el_tooltip = index$6.ElTooltip;
      return Vue.openBlock(), Vue.createElementBlock("div", _hoisted_1, [
        Vue.createElementVNode("div", {
          onClick: activeNode,
          class: Vue.normalizeClass(["node", { "error-node": ((_a = Vue.unref(errorInfo)) == null ? void 0 : _a.length) && !Vue.unref(_readOnly) }])
        }, [
          Vue.createElementVNode("div", _hoisted_2, [
            Vue.createElementVNode("span", {
              onClick: _cache[0] || (_cache[0] = Vue.withModifiers(() => {
              }, ["stop"]))
            }, [
              Vue.createVNode(_component_el_popconfirm, {
                title: "您确定要删除该节点吗？",
                width: "200",
                "hide-after": 0,
                placement: "right-start",
                onConfirm: delNode
              }, {
                reference: Vue.withCtx(() => [
                  Vue.withDirectives(Vue.createVNode(_component_el_button, {
                    class: "node-close",
                    plain: "",
                    circle: "",
                    icon: "CircleClose",
                    size: "small",
                    type: "danger"
                  }, null, 512), [
                    [Vue.vShow, __props.close && !Vue.unref(_readOnly)]
                  ])
                ]),
                _: 1
              })
            ]),
            Vue.createElementVNode("div", _hoisted_3, [
              Vue.unref(showInput) ? (Vue.openBlock(), Vue.createElementBlock("div", {
                key: 0,
                onClick: _cache[2] || (_cache[2] = Vue.withModifiers(() => {
                }, ["stop"]))
              }, [
                Vue.withDirectives(Vue.createVNode(_component_el_input, {
                  ref_key: "inputRef",
                  ref: inputRef,
                  onBlur: onClickOutside,
                  maxlength: "30",
                  modelValue: __props.node.name,
                  "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => __props.node.name = $event)
                }, null, 8, ["modelValue"]), [
                  [Vue.unref(index$3.default), onClickOutside]
                ])
              ])) : (Vue.openBlock(), Vue.createBlock(_component_el_text, {
                key: 1,
                tag: "b",
                truncated: "",
                onClick: Vue.withModifiers(onShowInput, ["stop"])
              }, {
                default: Vue.withCtx(() => [
                  Vue.createTextVNode(Vue.toDisplayString(__props.node.name) + " ", 1),
                  Vue.createVNode(_component_el_icon, null, {
                    default: Vue.withCtx(() => [
                      Vue.createVNode(_component_EditPen)
                    ]),
                    _: 1
                  })
                ]),
                _: 1
              })),
              Vue.renderSlot(_ctx.$slots, "icon", {}, () => [
                __props.icon ? (Vue.openBlock(), Vue.createBlock(_component_svg_icon, {
                  key: 0,
                  size: 30,
                  color: "node-icon",
                  name: __props.icon
                }, null, 8, ["name"])) : Vue.createCommentVNode("", true)
              ], true)
            ]),
            Vue.createVNode(_component_el_tooltip, { placement: "top-start" }, {
              content: Vue.withCtx(() => [
                (Vue.openBlock(true), Vue.createElementBlock(Vue.Fragment, null, Vue.renderList(Vue.unref(errorInfo), (err) => {
                  return Vue.openBlock(), Vue.createElementBlock("div", {
                    key: err.id
                  }, Vue.toDisplayString(err.message), 1);
                }), 128))
              ]),
              default: Vue.withCtx(() => {
                var _a2;
                return [
                  Vue.withDirectives(Vue.createVNode(_component_el_icon, {
                    class: "warn-icon",
                    size: 20
                  }, {
                    default: Vue.withCtx(() => [
                      Vue.createVNode(_component_WarnTriangleFilled, {
                        onClick: _cache[3] || (_cache[3] = Vue.withModifiers(() => {
                        }, ["stop"]))
                      })
                    ]),
                    _: 1
                  }, 512), [
                    [Vue.vShow, ((_a2 = Vue.unref(errorInfo)) == null ? void 0 : _a2.length) && !Vue.unref(_readOnly)]
                  ])
                ];
              }),
              _: 1
            })
          ]),
          Vue.createElementVNode("div", _hoisted_4, [
            Vue.renderSlot(_ctx.$slots, "default", {}, void 0, true)
          ])
        ], 2),
        Vue.createVNode(Add.default, { onAddNode: addNode })
      ]);
    };
  }
};
const Node = /* @__PURE__ */ _pluginVue_exportHelper.default(_sfc_main, [["__scopeId", "data-v-45d7e9c1"]]);
exports.default = Node;
