import { createVNode, defineComponent, render } from "vue";

import ModalConstructor from "./index.vue";
import { IDialogConfig } from "./dialog";

// NOTE: 开发环境下会报错 和devTools有关 正式环境无问题
// TODO: 子组件数据响应式问题 可用作展示型modal
const Modal = (options: Partial<IDialogConfig> = {}): Promise<void> => {
  return new Promise((resolve, reject) => {
    const container = document.createElement("div");
    document.body.appendChild(container);

    const _config: Partial<IDialogConfig> = Object.assign(
      {
        show: true,
        width: 520,
        destroyOnClose: false,
        closeOnClickMask: false,
        closed: () => {
          document.body.removeChild(container);
        },
        confirm: () => {
          resolve();
        },
        cancel: () => {
          // console.log("cancel");
          // reject();
        },
      },
      options
    );

    const vm = createVNode(ModalConstructor, _config, {
      default: () => options.content ?? "",
    });

    render(vm, container);
  });
};

export default Modal;
