index.js 1.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172
  1. import baseComponent from '../helpers/baseComponent'
  2. import classNames from '../helpers/classNames'
  3. baseComponent({
  4. externalClasses: ['wux-class-badge'],
  5. properties: {
  6. prefixCls: {
  7. type: String,
  8. value: 'wux-badge',
  9. },
  10. count: {
  11. type: Number,
  12. value: 0,
  13. observer: 'updated',
  14. },
  15. overflowCount: {
  16. type: Number,
  17. value: 99,
  18. },
  19. dot: {
  20. type: Boolean,
  21. value: false,
  22. },
  23. showZero: {
  24. type: Boolean,
  25. value: false,
  26. },
  27. status: {
  28. type: String,
  29. value: '',
  30. },
  31. text: {
  32. type: String,
  33. value: '',
  34. },
  35. },
  36. data: {
  37. finalCount: 0,
  38. },
  39. computed: {
  40. classes() {
  41. const { prefixCls, status: st } = this.data
  42. const wrap = classNames(prefixCls)
  43. const status = `${prefixCls}__status`
  44. const statusDot = classNames(`${prefixCls}__status-dot`, {
  45. [`${prefixCls}__status-dot--${st}`]: st,
  46. })
  47. const statusText = `${prefixCls}__status-text`
  48. const dot = `${prefixCls}__dot`
  49. const count = `${prefixCls}__count`
  50. return {
  51. wrap,
  52. status,
  53. statusDot,
  54. statusText,
  55. dot,
  56. count,
  57. }
  58. },
  59. },
  60. methods: {
  61. updated(count = this.data.count) {
  62. const { overflowCount } = this.data
  63. const finalCount = count >= overflowCount ? `${overflowCount}+` : count
  64. this.setData({
  65. finalCount,
  66. })
  67. },
  68. },
  69. })