element-plus_message.js

message.js

import { ElMessageBox, ElNotification } from "element-plus";
import { VNode } from "vue";
import { AxiosResponse } from "axios";

let timeout;
export default (
  { title = "确认", message, okEms, errMes, okText, cancleText },
  success
) => {
  ElMessageBox({
    title: title,
    message: message,
    showCancelButton: true,
    closeOnClickModal: false,
    confirmButtonText: okText || "确定",
    cancelButtonText: cancleText || "取消",
    showClose: false,
    icon: "",
    buttonSize: "small",
    beforeClose: (action, instance, done) => {
      if (action === "confirm") {
        instance.confirmButtonLoading = true;
        instance.cancelButtonLoading = true;
        clearTimeout(timeout);
        timeout = setTimeout(() => {
          success()
            .then(() => {
              setTimeout(() => {
                instance.confirmButtonLoading = false;
                instance.cancelButtonLoading = false;
              }, 100);
            })
            .then(() => {
              if (okEms)
                ElNotification({
                  position: "bottom-right",
                  type: "success",
                  message: okEms,
                });
            })
            .catch(() => {
              if (errMes)
                ElNotification({
                  position: "bottom-right",
                  type: "error",
                  message: errMes,
                });
            })
            .finally(() => {
              done();
            });
        }, 300);
      } else {
        done();
      }
    },
  });
};

import messageVue from "@/component/message.js";
 messageVue(
    {
      message: "确定要**吗?",
      okEms: "**成功",
    },
    () => {
      loading = true;
      return $ajax
        .put(`/api/*******`)
        .then((res) => {
          load();
        })
        .catch(() => {
          loading = false;
        });
    }
  );