import { ref, onMounted, watch, nextTick, createElementBlock, openBlock } from "vue";
import api from "./api/index.mjs";
import { getCurrentVueInstance } from "../../../utils/getInstance.mjs";
import FlowChart from "../flowChart/index.mjs";
/* empty css                */
import _export_sfc from "../../../../../../_virtual/_plugin-vue_export-helper.mjs";
const _sfc_main = {
  __name: "flowChart",
  props: {
    traceNo: {
      type: String,
      required: true
    },
    type: {
      type: String,
      default: "app"
    }
  },
  emits: ["loaded"],
  setup(__props, { emit: __emit }) {
    const props = __props;
    const flowchartCanvasRef = ref();
    const emit = __emit;
    const ctx = getCurrentVueInstance();
    let flowChart;
    onMounted(() => {
      flowChart = new FlowChart(".flowchart-canvas");
      importChartData(props.traceNo);
    });
    watch(
      () => props.traceNo,
      (traceNo) => {
        importChartData(traceNo);
      },
      {
        immediate: true
      }
    );
    function importChartData(traceNo) {
      if (flowChart && traceNo) {
        api.findFlowChartByTraceNo(ctx.$http, traceNo, props.type).then((data) => {
          if (data) {
            flowChart.import(data);
            nextTick(() => {
              emit("loaded", flowchartCanvasRef.value);
            });
          }
        });
      }
    }
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock("div", {
        class: "flowchart-canvas",
        ref_key: "flowchartCanvasRef",
        ref: flowchartCanvasRef
      }, null, 512);
    };
  }
};
const FecFlowChart = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-7728ec91"]]);
export {
  FecFlowChart as default
};
