message.ts 2.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103
  1. import { ElMessage, ElMessageBox } from 'element-plus';
  2. import { i18n } from '../locales';
  3. const { t } = i18n.global;
  4. const defaultOptions = {
  5. duration: 3000, // 显示时间为3秒
  6. showClose: true, // 显示关闭按钮
  7. offset: 20, // 消息距离顶部的偏移量
  8. };
  9. interface MessageImplements {
  10. info(title: string): void;
  11. warning(title: string): void;
  12. success(title: string): void;
  13. error(title: string): void;
  14. }
  15. export function useMessage() {
  16. class MessageClass implements MessageImplements {
  17. // 普通提示
  18. info(title: string): void {
  19. ElMessage({
  20. ...defaultOptions,
  21. message: title,
  22. type: 'info',
  23. });
  24. }
  25. // 警告提示
  26. warning(title: string): void {
  27. ElMessage({
  28. ...defaultOptions,
  29. message: title,
  30. type: 'warning',
  31. });
  32. }
  33. // 成功提示
  34. success(title: string): void {
  35. ElMessage({
  36. ...defaultOptions,
  37. message: title,
  38. type: 'success',
  39. });
  40. }
  41. // 错误提示
  42. error(title: string): void {
  43. ElMessage({
  44. ...defaultOptions,
  45. message: title,
  46. type: 'error',
  47. duration: 2000, // 错误提示显示时间延长到5秒
  48. });
  49. }
  50. }
  51. return new MessageClass();
  52. }
  53. export function useMessageBox() {
  54. class MessageBoxClass implements MessageImplements {
  55. // 普通提示
  56. info(msg: string): void {
  57. ElMessageBox.alert(msg, t('message.box.title'));
  58. }
  59. // 警告提示
  60. warning(msg: string): void {
  61. ElMessageBox.alert(msg, t('message.box.title'), { type: 'warning' });
  62. }
  63. // 成功提示
  64. success(msg: string): void {
  65. ElMessageBox.alert(msg, t('message.box.title'), { type: 'success' });
  66. }
  67. // 错误提示
  68. error(msg: string): void {
  69. ElMessageBox.alert(msg, t('message.box.title'), { type: 'error' });
  70. }
  71. // 确认窗体
  72. confirm(msg: string) {
  73. return ElMessageBox.confirm(msg, t('message.box.title'), {
  74. confirmButtonText: t('common.confirmButtonText'),
  75. cancelButtonText: t('common.cancelButtonText'),
  76. type: 'warning',
  77. });
  78. }
  79. // 提交内容
  80. prompt(msg: string) {
  81. return ElMessageBox.prompt(msg, t('message.box.title'), {
  82. confirmButtonText: t('common.confirmButtonText'),
  83. cancelButtonText: t('common.cancelButtonText'),
  84. type: 'warning',
  85. });
  86. }
  87. }
  88. return new MessageBoxClass();
  89. }