index.js 1.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960
  1. import baseComponent from '../helpers/baseComponent'
  2. import classNames from '../helpers/classNames'
  3. baseComponent({
  4. relations: {
  5. '../grid/index': {
  6. type: 'child',
  7. observer() {
  8. this.debounce(this.changeCurrent)
  9. },
  10. },
  11. },
  12. properties: {
  13. prefixCls: {
  14. type: String,
  15. value: 'wux-grids',
  16. },
  17. col: {
  18. type: Number,
  19. value: 3,
  20. observer: 'changeCurrent',
  21. },
  22. bordered: {
  23. type: Boolean,
  24. value: true,
  25. observer: 'changeCurrent',
  26. },
  27. square: {
  28. type: Boolean,
  29. value: false,
  30. observer: 'changeCurrent',
  31. },
  32. },
  33. computed: {
  34. classes() {
  35. const { prefixCls, bordered } = this.data
  36. const wrap = classNames(prefixCls, {
  37. [`${prefixCls}--bordered`]: bordered,
  38. })
  39. return {
  40. wrap,
  41. }
  42. },
  43. },
  44. methods: {
  45. changeCurrent() {
  46. const elements = this.getRelationNodes('../grid/index')
  47. const { col, bordered, square } = this.data
  48. const colNum = parseInt(col) > 0 ? parseInt(col) : 1
  49. const width = `${100 / colNum}%`
  50. if (elements.length > 0) {
  51. elements.forEach((element, index) => {
  52. element.changeCurrent(width, bordered, square, index)
  53. })
  54. }
  55. },
  56. },
  57. })