import { ref, reactive } from "vue";
import { ElMessageBox, ElMessage, ElLoading } from "element-plus";

export default () => {
  const $message = ElMessage;
  function $alert(title, fnCancel = () => {}) {
    ElMessageBox.confirm(title, "系统提示", {
      confirmButtonText: "确定",
      type: "warning",
      showCancelButton: false,
      center: true,
    })
      .then(() => {
        fnCancel();
      })
      .catch(() => {
        fnCancel();
      });
  }

  function $confirm(operate, fnOk, fnCancel = () => {}) {
    ElMessageBox.confirm(`请确认是否${operate}?`, "系统提示", {
      confirmButtonText: "确定",
      cancelButtonText: "取消",
      type: "warning",
      center: true,
    })
      .then(() => {
        fnOk();
      })
      .catch(() => {
        fnCancel();
      });
  }

  function $loading(customOptions = {}) {
    const defaultOptions = {
      lock: true,
      text: "Loading",
      background: "rgba(0, 0, 0, 0.7)",
      target: document.body,
      // 可以添加更多默认配置
    };

    // 合并默认配置和自定义配置
    const options = { ...defaultOptions, ...customOptions };

    // 调用Element UI的加载服务
    const loadingInstance = ElLoading.service(options);
    return loadingInstance;
    // return () => {
    //   console.log('?', 'close', '=============');

    //   loadingInstance.close();
    // };
  }

  return { $alert, $confirm, $message, $loading };
};