import { defineComponent, ref, openBlock, createElementBlock, createCommentVNode, createElementVNode, renderSlot, createVNode, unref, withCtx, createTextVNode } from 'vue';
import JsonEditorVue from 'json-editor-vue3';
import { chooseFile } from '../../utils/file.mjs';
import { MeButton } from '../../button/index.mjs';
import { MeDialog } from '../../dialog/index.mjs';
import { MeSvgIcon } from '../../svg-icon/index.mjs';

"use strict";
const _hoisted_1 = { class: "me-load-json" };
const _hoisted_2 = { class: "me-load-json__editor" };
const _hoisted_3 = { class: "flex-between" };
const _hoisted_4 = { style: { "display": "flex", "align-items": "center" } };
const __default__ = defineComponent({
  name: "me-load-json"
});
var script = /* @__PURE__ */ defineComponent({
  ...__default__,
  props: {
    data: { type: [Object, null], required: false },
    title: { type: String, required: false, default: "\u5BFC\u5165json" }
  },
  emits: ["change"],
  setup(__props, { expose: __expose, emit: __emit }) {
    const props = __props;
    const emits = __emit;
    const visible = ref(false);
    const jsonData = ref(null);
    const isJsonError = ref(false);
    const handleImport = async () => {
      chooseFile({
        accept: ".json",
        multiple: false
      }).then((file) => {
        const reader = new FileReader();
        reader.readAsText(file, "utf-8");
        reader.onload = async () => {
          let data = [];
          try {
            const json = reader.result;
            data = JSON.parse(json);
            jsonData.value = data;
            console.log("\u{1F680} ~ reader.onload ~ data:", data);
          } catch (error) {
          }
        };
      });
    };
    const handleJsonError = (editor, error) => {
      isJsonError.value = error.length > 0 ? true : false;
    };
    const resultData = ref();
    const submit = async () => {
      if (!jsonData.value) {
        return;
      }
      try {
        const json = typeof jsonData.value == "string" ? JSON.parse(jsonData.value) : jsonData.value;
        if (Array.isArray(json)) {
          const result = [];
          json.forEach(async (item) => {
            result.push(item);
          });
          resultData.value = result;
          emits("change", result);
        } else {
          resultData.value = json;
          emits("change", json);
        }
        visible.value = false;
      } catch (error) {
        console.error("\u{1F680} ~ error:", error);
      }
    };
    const open = async () => {
      if (props?.data) {
        jsonData.value = props.data;
      }
      visible.value = true;
    };
    __expose({
      getData: () => resultData.value,
      open: () => open()
    });
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock("div", _hoisted_1, [
        createCommentVNode(' <me-button @click="open" size="small" circle type="success">\r\n      <me-svg-icon name="ri-download-2-line"></me-svg-icon>\r\n    </me-button> '),
        createElementVNode("div", { onClick: open }, [
          renderSlot(_ctx.$slots, "default", {}, () => [
            createVNode(unref(MeButton), {
              size: "small",
              circle: "",
              type: "success"
            }, {
              default: withCtx(() => [
                createVNode(unref(MeSvgIcon), { name: "ri-download-2-line" })
              ]),
              _: 1
              /* STABLE */
            })
          ])
        ]),
        createVNode(unref(MeDialog), {
          modelValue: visible.value,
          "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => visible.value = $event),
          "show-cancel-button": false,
          "min-width": 600,
          title: __props.title
        }, {
          "me-dialog-footer": withCtx(() => [
            createElementVNode("div", _hoisted_3, [
              renderSlot(_ctx.$slots, "footer-left", {}, () => [
                createVNode(unref(MeButton), { onClick: handleImport }, {
                  default: withCtx(() => [..._cache[2] || (_cache[2] = [
                    createTextVNode(
                      "\u5BFC\u5165json",
                      -1
                      /* CACHED */
                    )
                  ])]),
                  _: 1
                  /* STABLE */
                })
              ]),
              createElementVNode("div", _hoisted_4, [
                createVNode(unref(MeButton), {
                  type: "primary",
                  "click-handle": submit,
                  disabled: isJsonError.value
                }, {
                  default: withCtx(() => [..._cache[3] || (_cache[3] = [
                    createTextVNode(
                      "\u786E\u5B9A",
                      -1
                      /* CACHED */
                    )
                  ])]),
                  _: 1
                  /* STABLE */
                }, 8, ["disabled"]),
                renderSlot(_ctx.$slots, "footer-right")
              ])
            ])
          ]),
          default: withCtx(() => [
            createElementVNode("div", _hoisted_2, [
              createVNode(unref(JsonEditorVue), {
                class: "editor",
                modelValue: jsonData.value,
                "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => jsonData.value = $event),
                onValidationError: handleJsonError
              }, null, 8, ["modelValue"])
            ])
          ]),
          _: 3
          /* FORWARDED */
        }, 8, ["modelValue", "title"])
      ]);
    };
  }
});

export { script as default };
//# sourceMappingURL=load-json.vue2.mjs.map
