pc-component-v5/packages/common/Notify.js

import { h } from 'vue';
import { notification, Button } from 'ant-design-vue';

/**
 * 通知类型
 * @type {Object}
 * @property {string} show - 显示
 * @property {string} notice - 通知
 * @property {string} noticeBig - 通知(大)
 * @property {string} info - 信息
 * @property {string} infoBig - 信息(大)
 * @property {string} warning - 警告
 * @property {string} error - 错误
 * @property {string} success - 成功
 * author: 刘彦鹏
 * info: 封装antd的notification组件
 */

export default {
  /**
   * 显示通知
   * @param {options} 通知选项
   * @param {title} 标题
   * @param {message} 内容
   * @param {buttons} 按钮选项
   */
  show: function (options) {
    const key = `notify_${Date.now()}`;
    const dialogItself = {
      key,
      close: () => notification.close(key),
    };
    const btns = options.buttons.map(btn => {
      const type = btn.cssClass?.includes('btn-primary') ? 'primary' : 'default';
      const action = () => btn.action(dialogItself);
      return h(
        Button,
        {
          type,
          onClick: action,
          style: {
            marginLeft: '8px',
          },
        },
        {
          default: () => btn.label,
        },
      );
    });

    notification.open({
      message: options.title,
      description: options.message,
      duration: 0,
      key,
      btn: btns,
      onClose: dialogItself.close,
    });
  },

  /**
 * 显示通知
 * @param {title} 标题
 * @param {content} 内容
 * @param {autoClose} 自动延时关闭时间(毫秒)
 * author: 杨志杰
 * version: 1.0
 */
  notice: function (title, content, autoClose) {
    notification.warning({
      message: title,
      description: content,
      duration: autoClose ? autoClose / 1000 : 2,
    });
  },

  /**
   * 显示通知
   * @param {title} 标题
   * @param {content} 内容
   * author: 杨志杰
   * version: 1.0
   */
  noticeBig: function (title, content) {
    notification.warning({
      message: title,
      description: content,
      duration: 0, // 不自动关闭
      className: 'wide-notification',
      style: { width: '800px' },
    });
  },

  /**
 * 显示消息
 * @param {title} 标题
 * @param {content} 内容
 * @param {autoClose} 自动延时关闭时间(毫秒)
 * author: 杨志杰
 * version: 1.0
 */
  info: function (title, content, autoClose) {
    notification.info({
      message: title,
      description: content,
      duration: autoClose ? autoClose / 1000 : 2,
    });
  },

  /**
 * 显示消息
 * @param {title} 标题
 * @param {content} 内容
 * @param {autoClose} 自动延时关闭时间(毫秒)
 * author: 杨志杰
 * version: 1.0
 */
  infoBig: function (title, content, autoClose) {
    notification.info({
      message: title,
      description: content,
      duration: autoClose ? autoClose / 1000 : 2,
      className: 'wide-notification',
      style: { width: '800px' },
    });
  },

  /**
 * 显示成功信息
 * @param {title} 标题
 * @param {content} 内容
 * @param {autoClose} 自动延时关闭时间(毫秒)
 * author: 杨志杰
 * version: 1.0
 */
  success: function (title, content, autoClose) {
    notification.success({
      message: title,
      description: content,
      duration: autoClose === true ? 2 : typeof autoClose === 'number' && !isNaN(autoClose) ? autoClose / 1000 : 2,
    });
  },

  /**
   * 显示错误信息
   * @param {title} 标题
   * @param {content} 内容
   * @param {autoClose} 自动延时关闭时间(毫秒)
   * author: 杨志杰
   * version: 1.0
   */
  error: function (title, content, autoClose) {
    const duration = autoClose === true ? 2 : autoClose === -1 ? 0 : autoClose  ? autoClose / 1000 : 0;
    notification.error({
      message: title,
      description: content,
      duration,
    });
  },
};