Logger.ts 2.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100
  1. const isArray = function (obj: any): boolean {
  2. return Object.prototype.toString.call(obj) === '[object Array]'
  3. }
  4. const Logger = () => {}
  5. Logger.typeColor = function (type: string) {
  6. let color = ''
  7. switch (type) {
  8. case 'primary':
  9. color = '#2d8cf0'
  10. break
  11. case 'success':
  12. color = '#19be6b'
  13. break
  14. case 'info':
  15. color = '#909399'
  16. break
  17. case 'warn':
  18. color = '#ff9900'
  19. break
  20. case 'error':
  21. color = '#f03f14'
  22. break
  23. default:
  24. color = '#35495E'
  25. break
  26. }
  27. return color
  28. }
  29. Logger.print = function (type = 'default', text: any, back = false) {
  30. if (typeof text === 'object') {
  31. // 如果是對象則調用打印對象方式
  32. isArray(text) ? console.table(text) : console.dir(text)
  33. return
  34. }
  35. if (back) {
  36. // 如果是打印帶背景圖的
  37. console.log(
  38. `%c ${text} `,
  39. `background:${Logger.typeColor(type)}; padding: 2px; border-radius: 4px; color: #fff;`
  40. )
  41. } else {
  42. console.log(
  43. `%c ${text} `,
  44. `border: 1px solid ${Logger.typeColor(type)};
  45. padding: 2px; border-radius: 4px;
  46. color: ${Logger.typeColor(type)};`
  47. )
  48. }
  49. }
  50. Logger.printBack = function (type = 'primary', text) {
  51. this.print(type, text, true)
  52. }
  53. Logger.pretty = function (type = 'primary', title, text) {
  54. if (typeof text === 'object') {
  55. console.group('Console Group', title)
  56. console.log(
  57. `%c ${title}`,
  58. `background:${Logger.typeColor(type)};border:1px solid ${Logger.typeColor(type)};
  59. padding: 1px; border-radius: 4px; color: #fff;`
  60. )
  61. isArray(text) ? console.table(text) : console.dir(text)
  62. console.groupEnd()
  63. return
  64. }
  65. console.log(
  66. `%c ${title} %c ${text} %c`,
  67. `background:${Logger.typeColor(type)};border:1px solid ${Logger.typeColor(type)};
  68. padding: 1px; border-radius: 4px 0 0 4px; color: #fff;`,
  69. `border:1px solid ${Logger.typeColor(type)};
  70. padding: 1px; border-radius: 0 4px 4px 0; color: ${Logger.typeColor(type)};`,
  71. 'background:transparent'
  72. )
  73. }
  74. Logger.prettyPrimary = function (title, ...text) {
  75. text.forEach((t) => this.pretty('primary', title, t))
  76. }
  77. Logger.prettySuccess = function (title, ...text) {
  78. text.forEach((t) => this.pretty('success', title, t))
  79. }
  80. Logger.prettyWarn = function (title, ...text) {
  81. text.forEach((t) => this.pretty('warn', title, t))
  82. }
  83. Logger.prettyError = function (title, ...text) {
  84. text.forEach((t) => this.pretty('error', title, t))
  85. }
  86. Logger.prettyInfo = function (title, ...text) {
  87. text.forEach((t) => this.pretty('info', title, t))
  88. }
  89. export default Logger