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.
 
 
 

115 rivejä
3.5 KiB

  1. import { defineMixin } from '../../libs/vue'
  2. import ModalDefaultProps from './modal'
  3. import { registerComponentProps } from '../../libs/config/props.js'
  4. const defProps = registerComponentProps(ModalDefaultProps)
  5. export const props = defineMixin({
  6. props: {
  7. // 是否展示modal
  8. show: {
  9. type: Boolean,
  10. default: () => defProps.modal.show
  11. },
  12. // 标题
  13. title: {
  14. type: [String],
  15. default: () => defProps.modal.title
  16. },
  17. // 弹窗内容
  18. content: {
  19. type: String,
  20. default: () => defProps.modal.content
  21. },
  22. // 确认文案
  23. confirmText: {
  24. type: String,
  25. default: () => defProps.modal.confirmText
  26. },
  27. // 取消文案
  28. cancelText: {
  29. type: String,
  30. default: () => defProps.modal.cancelText
  31. },
  32. // 是否显示确认按钮
  33. showConfirmButton: {
  34. type: Boolean,
  35. default: () => defProps.modal.showConfirmButton
  36. },
  37. // 是否显示取消按钮
  38. showCancelButton: {
  39. type: Boolean,
  40. default: () => defProps.modal.showCancelButton
  41. },
  42. // 确认按钮颜色
  43. confirmColor: {
  44. type: String,
  45. default: () => defProps.modal.confirmColor
  46. },
  47. // 取消文字颜色
  48. cancelColor: {
  49. type: String,
  50. default: () => defProps.modal.cancelColor
  51. },
  52. // 对调确认和取消的位置
  53. buttonReverse: {
  54. type: Boolean,
  55. default: () => defProps.modal.buttonReverse
  56. },
  57. // 是否开启缩放效果
  58. zoom: {
  59. type: Boolean,
  60. default: () => defProps.modal.zoom
  61. },
  62. // 是否异步关闭,只对确定按钮有效
  63. asyncClose: {
  64. type: Boolean,
  65. default: () => defProps.modal.asyncClose
  66. },
  67. // 是否允许点击遮罩关闭modal
  68. closeOnClickOverlay: {
  69. type: Boolean,
  70. default: () => defProps.modal.closeOnClickOverlay
  71. },
  72. // 给一个负的margin-top,往上偏移,避免和键盘重合的情况
  73. negativeTop: {
  74. type: [String, Number],
  75. default: () => defProps.modal.negativeTop
  76. },
  77. // modal宽度,不支持百分比,可以数值,px,rpx单位
  78. width: {
  79. type: [String, Number],
  80. default: () => defProps.modal.width
  81. },
  82. // 确认按钮的样式,circle-圆形,square-方形,如设置,将不会显示取消按钮
  83. confirmButtonShape: {
  84. type: String,
  85. default: () => defProps.modal.confirmButtonShape
  86. },
  87. // 弹窗动画过度时间
  88. duration: {
  89. type: [Number],
  90. default: defProps.modal.duration
  91. },
  92. // 文案对齐方式
  93. contentTextAlign: {
  94. type: String,
  95. default: () => defProps.modal.contentTextAlign
  96. },
  97. // 异步确定时如果点击了取消时候的提示文案
  98. asyncCloseTip: {
  99. type: String,
  100. default: () => defProps.modal.asyncCloseTip
  101. },
  102. // 是否异步关闭,只对取消按钮有效
  103. asyncCancelClose: {
  104. type: Boolean,
  105. default: () => defProps.modal.asyncCancelClose
  106. },
  107. // 内容样式
  108. contentStyle: {
  109. type: Object,
  110. default: () => defProps.modal.contentStyle
  111. }
  112. }
  113. })