/*
element-plus中的message在实际使用过程中很多时候会遇到，相同的message会在短时间内同时出现在页面上，这种情况下是没有必要的。比如一个错误信息提示被放在定时器中进行：定时调用某个接口，然后这个接口会返回一个message的话，在定时器时间设置很短的情况下，就会出现短时间内弹出很多相同的message。我们可以通过重写element-plus的message来解决这个问题。
*/

/**
 * 封装element-plus message方法，只有在页面没有message或者没有相同message的情况下才弹出该message
 */
import { ElMessage } from 'element-plus';

const showMessage = Symbol('showMessage');

class Message {
  success(options, single = true) {
    this[showMessage]('success', options, single);
  }
  warning(options, single = true) {
    this[showMessage]('warning', options, single);
  }
  info(options, single = true) {
    this[showMessage]('info', options, single);
  }
  error(options, single = true) {
    this[showMessage]('error', options, single);
  }

  [showMessage](type, options, single) {
    if (single) {
      const messageContent = typeof options === 'string' ? options : options?.message;
      const existingMessages = document.querySelectorAll('.el-message__content');
      let canShow = true;

      existingMessages.forEach((msg) => {
        if (msg.textContent === messageContent) {
          canShow = false;
        }
      });

      if (canShow) {
        ElMessage[type](options);
      }
    } else {
      ElMessage[type](options);
    }
  }
}

// 导出实例
export const message = new Message();


// 使用方式

// import { message } from '@/utils/message'; // 导入你的封装

// message.success("操作成功"); // 默认防重复
// message.error("错误信息", false); // 不防重复
// message.warning({ message: "警告", duration: 3000 }); // 对象参数