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.
 
 
 

137 regels
3.2 KiB

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