index.js 2.2 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485
  1. 'use strict';
  2. Object.defineProperty(exports, '__esModule', { value: true });
  3. var link_1 = require('../mixins/link');
  4. var component_1 = require('../common/component');
  5. var utils_1 = require('../common/utils');
  6. component_1.VantComponent({
  7. relation: {
  8. name: 'grid',
  9. type: 'ancestor',
  10. current: 'grid-item',
  11. },
  12. classes: ['content-class', 'icon-class', 'text-class'],
  13. mixins: [link_1.link],
  14. props: {
  15. icon: String,
  16. dot: Boolean,
  17. info: null,
  18. badge: null,
  19. text: String,
  20. useSlot: Boolean,
  21. },
  22. data: {
  23. viewStyle: '',
  24. },
  25. mounted: function () {
  26. this.updateStyle();
  27. },
  28. methods: {
  29. updateStyle: function () {
  30. if (!this.parent) {
  31. return;
  32. }
  33. var _a = this.parent,
  34. data = _a.data,
  35. children = _a.children;
  36. var columnNum = data.columnNum,
  37. border = data.border,
  38. square = data.square,
  39. gutter = data.gutter,
  40. clickable = data.clickable,
  41. center = data.center,
  42. direction = data.direction,
  43. iconSize = data.iconSize;
  44. var width = 100 / columnNum + '%';
  45. var styleWrapper = [];
  46. styleWrapper.push('width: ' + width);
  47. if (square) {
  48. styleWrapper.push('padding-top: ' + width);
  49. }
  50. if (gutter) {
  51. var gutterValue = utils_1.addUnit(gutter);
  52. styleWrapper.push('padding-right: ' + gutterValue);
  53. var index = children.indexOf(this);
  54. if (index >= columnNum && !square) {
  55. styleWrapper.push('margin-top: ' + gutterValue);
  56. }
  57. }
  58. var contentStyle = '';
  59. if (square && gutter) {
  60. var gutterValue = utils_1.addUnit(gutter);
  61. contentStyle =
  62. '\n right: ' +
  63. gutterValue +
  64. ';\n bottom: ' +
  65. gutterValue +
  66. ';\n height: auto;\n ';
  67. }
  68. this.setData({
  69. viewStyle: styleWrapper.join('; '),
  70. contentStyle: contentStyle,
  71. center: center,
  72. border: border,
  73. square: square,
  74. gutter: gutter,
  75. clickable: clickable,
  76. direction: direction,
  77. iconSize: iconSize,
  78. });
  79. },
  80. onClick: function () {
  81. this.$emit('click');
  82. this.jumpLink();
  83. },
  84. },
  85. });