import { defineComponent, ref, computed, resolveDirective, openBlock, createElementBlock, createVNode, unref, withCtx, createElementVNode, renderSlot, createBlock, createTextVNode, createCommentVNode, withDirectives, toDisplayString } from 'vue';
import { delegateBoolean } from './utils.mjs';
import { ElDialog, ElScrollbar, ElButton } from 'element-plus';

"use strict";
const _hoisted_1 = { class: "me-message" };
const _hoisted_2 = { class: "me-message-header" };
const _hoisted_3 = { style: { "font-size": "18px", "font-weight": "700", "padding": "18px 24px 0px" } };
const _hoisted_4 = ["innerHTML"];
const _hoisted_5 = {
  class: "me-dialog-footer",
  style: { "background": "#f4f3f7", "border-radius": "0px 0px 8px 8px", "padding": "4px 12px 4px 12px" }
};
const __default__ = defineComponent({
  name: "me-message"
});
var script = /* @__PURE__ */ defineComponent({
  ...__default__,
  props: {
    request: { type: Function, required: false },
    data: { type: null, required: false, default: {} },
    handler: { type: Object, required: false, default: () => ({ confirm: () => true, cancel: () => true }) },
    onClose: { type: Function, required: false },
    onDestroy: { type: Function, required: false }
  },
  emits: ["closed"],
  setup(__props, { expose: __expose, emit: __emit }) {
    const emit = __emit;
    const props = __props;
    console.log("\u{1F680} ~ props:", props);
    __expose({
      close: () => {
        visible.value = false;
        emit("closed");
      }
    });
    const visible = ref(true);
    const data = props.data;
    const state = ref("normal");
    const title = computed(() => {
      switch (state.value) {
        case "normal":
          return data.normal?.title;
        case "process":
          return data.process?.title ? data.process.title : data.normal.title;
      }
    });
    const message = computed(() => {
      switch (state.value) {
        case "normal":
          return data.normal?.message;
        case "process":
          return data.process?.message ? data.process.message : data.normal.message;
      }
    });
    const loading = computed(() => {
      switch (state.value) {
        case "normal":
          return data.normal?.loading;
        case "process":
          return data.process?.loading ? data.process.loading : data.normal.loading;
      }
    });
    const type = computed(() => {
      switch (state.value) {
        case "normal":
          return data.normal?.type;
        case "process":
          return data.process?.type ? data.process.type : data.normal.type;
      }
    });
    const cancelHandler = async () => {
      let result = true;
      if (result && props.handler.cancel) {
        delegateBoolean(props.handler.cancel, (res) => {
          result = res;
          if (result) {
            visible.value = false;
            emit("closed");
          } else {
            state.value = "normal";
          }
        });
      } else {
        visible.value = false;
        emit("closed");
      }
    };
    const confirmHandler = async () => {
      state.value = "process";
      let result = true;
      if (data.request) {
        result = await httpHandler();
      }
      if (result && props.handler.confirm) {
        delegateBoolean(props.handler.confirm, (res) => {
          result = res;
          if (result) {
            visible.value = false;
            emit("closed");
          } else {
            state.value = "normal";
          }
        });
      } else {
        visible.value = false;
        emit("closed");
      }
    };
    let responseData = null;
    const httpHandler = () => {
      responseData = null;
      if (data.request) {
        return new Promise(function(resolve, reject) {
          if (data.request.api) {
            data.request.api(data.request.data).then((res) => {
              responseData = res;
              resolve(true);
            }).catch(() => {
              resolve(true);
            });
          } else {
            if (props.request) {
              props?.request(data.request).then((res) => {
                responseData = res;
                resolve(true);
              }).catch(() => {
                resolve(true);
              });
            }
          }
        });
      } else {
        return true;
      }
    };
    return (_ctx, _cache) => {
      const _directive_focus = resolveDirective("focus");
      return openBlock(), createElementBlock("div", _hoisted_1, [
        createVNode(unref(ElDialog), {
          modelValue: visible.value,
          "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => visible.value = $event),
          width: "380",
          "show-close": false,
          "align-center": true,
          style: { "border-radius": "8px", "padding": "0px" },
          "modal-class": "me-message-modal-bg-blur",
          "close-on-click-modal": false,
          "close-on-press-escape": false,
          onClose: cancelHandler
        }, {
          header: withCtx(() => [
            createElementVNode("div", _hoisted_2, [
              createElementVNode("span", _hoisted_3, [
                renderSlot(_ctx.$slots, "title", {}, () => [
                  createTextVNode(
                    toDisplayString(title.value),
                    1
                    /* TEXT */
                  )
                ])
              ])
            ])
          ]),
          footer: withCtx(() => [
            _cache[4] || (_cache[4] = createElementVNode(
              "div",
              { style: { "border-top": "1px solid #e6e6e6", "width": "100%" } },
              null,
              -1
              /* CACHED */
            )),
            createElementVNode("div", _hoisted_5, [
              renderSlot(_ctx.$slots, "me-message-footer", {}, () => [
                _cache[3] || (_cache[3] = createElementVNode(
                  "div",
                  null,
                  null,
                  -1
                  /* CACHED */
                )),
                createElementVNode("div", null, [
                  __props.handler.cancel ? (openBlock(), createBlock(unref(ElButton), {
                    key: 0,
                    link: "",
                    style: { "margin": "2px 20px", "padding": "18px", "font-weight": "700" },
                    onClick: cancelHandler
                  }, {
                    default: withCtx(() => [..._cache[1] || (_cache[1] = [
                      createTextVNode(
                        "\u53D6\u6D88",
                        -1
                        /* CACHED */
                      )
                    ])]),
                    _: 1
                    /* STABLE */
                  })) : createCommentVNode("v-if", true),
                  withDirectives((openBlock(), createBlock(unref(ElButton), {
                    type: type.value,
                    onClick: confirmHandler,
                    loading: loading.value,
                    style: { "margin": "2px 0", "padding": "18px", "font-weight": "700" }
                  }, {
                    default: withCtx(() => [..._cache[2] || (_cache[2] = [
                      createTextVNode(
                        "\u786E\u5B9A",
                        -1
                        /* CACHED */
                      )
                    ])]),
                    _: 1
                    /* STABLE */
                  }, 8, ["type", "loading"])), [
                    [_directive_focus]
                  ])
                ])
              ])
            ])
          ]),
          default: withCtx(() => [
            createVNode(unref(ElScrollbar), null, {
              default: withCtx(() => [
                createElementVNode("div", {
                  style: { "padding": "0 24px 24px", "font-size": "14px", "line-height": "24px" },
                  class: "me-message-body",
                  innerHTML: message.value
                }, null, 8, _hoisted_4)
              ]),
              _: 1
              /* STABLE */
            })
          ]),
          _: 3
          /* FORWARDED */
        }, 8, ["modelValue"])
      ]);
    };
  }
});

export { script as default };
//# sourceMappingURL=message.vue2.mjs.map
