props.js 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134
  1. import { defineMixin } from '../../libs/vue'
  2. import defProps from '../../libs/config/props.js'
  3. export const propsCard = defineMixin({
  4. props: {
  5. // 与屏幕两侧是否留空隙
  6. full: {
  7. type: Boolean,
  8. default: () => defProps.card.full
  9. },
  10. // 标题
  11. title: {
  12. type: String,
  13. default: () => defProps.card.title
  14. },
  15. // 标题颜色
  16. titleColor: {
  17. type: String,
  18. default: () => defProps.card.titleColor
  19. },
  20. // 标题字体大小
  21. titleSize: {
  22. type: [Number, String],
  23. default: () => defProps.card.titleSize
  24. },
  25. // 副标题
  26. subTitle: {
  27. type: String,
  28. default: () => defProps.card.subTitle
  29. },
  30. // 副标题颜色
  31. subTitleColor: {
  32. type: String,
  33. default: () => defProps.card.subTitleColor
  34. },
  35. // 副标题字体大小
  36. subTitleSize: {
  37. type: [Number, String],
  38. default: () => defProps.card.subTitleSize
  39. },
  40. // 是否显示外部边框,只对full=false时有效(卡片与边框有空隙时)
  41. border: {
  42. type: Boolean,
  43. default: () => defProps.card.border
  44. },
  45. // 用于标识点击了第几个
  46. index: {
  47. type: [Number, String, Object],
  48. default: () => defProps.card.index
  49. },
  50. // 用于隔开上下左右的边距,带单位的写法,如:"30px 30px","20px 20px 30px 30px"
  51. margin: {
  52. type: String,
  53. default: () => defProps.card.margin
  54. },
  55. // card卡片的圆角
  56. borderRadius: {
  57. type: [Number, String],
  58. default: () => defProps.card.borderRadius
  59. },
  60. // 头部自定义样式,对象形式
  61. headStyle: {
  62. type: Object,
  63. default: () => defProps.card.headStyle
  64. },
  65. // 主体自定义样式,对象形式
  66. bodyStyle: {
  67. type: Object,
  68. default: () => defProps.card.bodyStyle
  69. },
  70. // 底部自定义样式,对象形式
  71. footStyle: {
  72. type: Object,
  73. default: () => defProps.card.footStyle
  74. },
  75. // 头部是否下边框
  76. headBorderBottom: {
  77. type: Boolean,
  78. default: () => defProps.card.headBorderBottom
  79. },
  80. // 底部是否有上边框
  81. footBorderTop: {
  82. type: Boolean,
  83. default: () => defProps.card.footBorderTop
  84. },
  85. // 标题左边的缩略图
  86. thumb: {
  87. type: String,
  88. default: () => defProps.card.thumb
  89. },
  90. // 缩略图宽高
  91. thumbWidth: {
  92. type: [String, Number],
  93. default: () => defProps.card.thumbWidth
  94. },
  95. // 缩略图是否为圆形
  96. thumbCircle: {
  97. type: Boolean,
  98. default: () => defProps.card.thumbCircle
  99. },
  100. // 给head,body,foot的内边距
  101. padding: {
  102. type: [String, Number],
  103. default: () => defProps.card.padding
  104. },
  105. paddingHead: {
  106. type: [String, Number],
  107. default: () => defProps.card.paddingHead
  108. },
  109. paddingBody: {
  110. type: [String, Number],
  111. default: () => defProps.card.paddingBody
  112. },
  113. paddingFoot: {
  114. type: [String, Number],
  115. default: () => defProps.card.paddingFoot
  116. },
  117. // 是否显示头部
  118. showHead: {
  119. type: Boolean,
  120. default: () => defProps.card.showHead
  121. },
  122. // 是否显示尾部
  123. showFoot: {
  124. type: Boolean,
  125. default: () => defProps.card.showFoot
  126. },
  127. // 卡片外围阴影,字符串形式
  128. boxShadow: {
  129. type: String,
  130. default: () => defProps.card.boxShadow
  131. }
  132. }
  133. })