You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

79 lines
2.6 KiB

2 months ago
  1. import { defineMixin } from '../../libs/vue'
  2. import defProps from '../../libs/config/props.js'
  3. export const props = defineMixin({
  4. props: {
  5. // 是否显示圆点
  6. isDot: {
  7. type: Boolean,
  8. default: () => defProps.badge.isDot
  9. },
  10. // 显示的内容
  11. value: {
  12. type: [Number, String],
  13. default: () => defProps.badge.value
  14. },
  15. // 显示的内容
  16. modelValue: {
  17. type: [Number, String],
  18. default: () => defProps.badge.modelValue
  19. },
  20. // 是否显示
  21. show: {
  22. type: Boolean,
  23. default: () => defProps.badge.show
  24. },
  25. // 最大值,超过最大值会显示 '{max}+'
  26. max: {
  27. type: [Number, String],
  28. default: () => defProps.badge.max
  29. },
  30. // 主题类型,error|warning|success|primary
  31. type: {
  32. type: String,
  33. default: () => defProps.badge.type
  34. },
  35. // 当数值为 0 时,是否展示 Badge
  36. showZero: {
  37. type: Boolean,
  38. default: () => defProps.badge.showZero
  39. },
  40. // 背景颜色,优先级比type高,如设置,type参数会失效
  41. bgColor: {
  42. type: [String, null],
  43. default: () => defProps.badge.bgColor
  44. },
  45. // 字体颜色
  46. color: {
  47. type: [String, null],
  48. default: () => defProps.badge.color
  49. },
  50. // 徽标形状,circle-四角均为圆角,horn-左下角为直角
  51. shape: {
  52. type: String,
  53. default: () => defProps.badge.shape
  54. },
  55. // 设置数字的显示方式,overflow|ellipsis|limit
  56. // overflow会根据max字段判断,超出显示`${max}+`
  57. // ellipsis会根据max判断,超出显示`${max}...`
  58. // limit会依据1000作为判断条件,超出1000,显示`${value/1000}K`,比如2.2k、3.34w,最多保留2位小数
  59. numberType: {
  60. type: String,
  61. default: () => defProps.badge.numberType
  62. },
  63. // 设置badge的位置偏移,格式为 [x, y],也即设置的为top和right的值,absolute为true时有效
  64. offset: {
  65. type: Array,
  66. default: () => defProps.badge.offset
  67. },
  68. // 是否反转背景和字体颜色
  69. inverted: {
  70. type: Boolean,
  71. default: () => defProps.badge.inverted
  72. },
  73. // 是否绝对定位
  74. absolute: {
  75. type: Boolean,
  76. default: () => defProps.badge.absolute
  77. }
  78. }
  79. })