Row.js 4.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136
  1. 'use strict';
  2. Object.defineProperty(exports, "__esModule", {
  3. value: true
  4. });
  5. var _defineProperty2 = require('babel-runtime/helpers/defineProperty');
  6. var _defineProperty3 = _interopRequireDefault(_defineProperty2);
  7. var _typeof2 = require('babel-runtime/helpers/typeof');
  8. var _typeof3 = _interopRequireDefault(_typeof2);
  9. var _extends2 = require('babel-runtime/helpers/extends');
  10. var _extends3 = _interopRequireDefault(_extends2);
  11. var _vueTypes = require('../_util/vue-types');
  12. var _vueTypes2 = _interopRequireDefault(_vueTypes);
  13. var _BaseMixin = require('../_util/BaseMixin');
  14. var _BaseMixin2 = _interopRequireDefault(_BaseMixin);
  15. var _configConsumerProps = require('../config-provider/configConsumerProps');
  16. var _responsiveObserve = require('../_util/responsiveObserve');
  17. var _responsiveObserve2 = _interopRequireDefault(_responsiveObserve);
  18. function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
  19. var RowProps = {
  20. gutter: _vueTypes2['default'].oneOfType([_vueTypes2['default'].object, _vueTypes2['default'].number, _vueTypes2['default'].array]),
  21. type: _vueTypes2['default'].oneOf(['flex']),
  22. align: _vueTypes2['default'].oneOf(['top', 'middle', 'bottom', 'stretch']),
  23. justify: _vueTypes2['default'].oneOf(['start', 'end', 'center', 'space-around', 'space-between']),
  24. prefixCls: _vueTypes2['default'].string
  25. };
  26. var responsiveArray = ['xxl', 'xl', 'lg', 'md', 'sm', 'xs'];
  27. exports['default'] = {
  28. name: 'ARow',
  29. mixins: [_BaseMixin2['default']],
  30. props: (0, _extends3['default'])({}, RowProps, {
  31. gutter: _vueTypes2['default'].oneOfType([_vueTypes2['default'].object, _vueTypes2['default'].number, _vueTypes2['default'].array]).def(0)
  32. }),
  33. provide: function provide() {
  34. return {
  35. rowContext: this
  36. };
  37. },
  38. inject: {
  39. configProvider: { 'default': function _default() {
  40. return _configConsumerProps.ConfigConsumerProps;
  41. } }
  42. },
  43. data: function data() {
  44. return {
  45. screens: {}
  46. };
  47. },
  48. mounted: function mounted() {
  49. var _this = this;
  50. this.$nextTick(function () {
  51. _this.token = _responsiveObserve2['default'].subscribe(function (screens) {
  52. var gutter = _this.gutter;
  53. if ((typeof gutter === 'undefined' ? 'undefined' : (0, _typeof3['default'])(gutter)) === 'object' || Array.isArray(gutter) && ((0, _typeof3['default'])(gutter[0]) === 'object' || (0, _typeof3['default'])(gutter[1]) === 'object')) {
  54. _this.screens = screens;
  55. }
  56. });
  57. });
  58. },
  59. beforeDestroy: function beforeDestroy() {
  60. _responsiveObserve2['default'].unsubscribe(this.token);
  61. },
  62. methods: {
  63. getGutter: function getGutter() {
  64. var results = [0, 0];
  65. var gutter = this.gutter,
  66. screens = this.screens;
  67. var normalizedGutter = Array.isArray(gutter) ? gutter : [gutter, 0];
  68. normalizedGutter.forEach(function (g, index) {
  69. if ((typeof g === 'undefined' ? 'undefined' : (0, _typeof3['default'])(g)) === 'object') {
  70. for (var i = 0; i < responsiveArray.length; i++) {
  71. var breakpoint = responsiveArray[i];
  72. if (screens[breakpoint] && g[breakpoint] !== undefined) {
  73. results[index] = g[breakpoint];
  74. break;
  75. }
  76. }
  77. } else {
  78. results[index] = g || 0;
  79. }
  80. });
  81. return results;
  82. }
  83. },
  84. render: function render() {
  85. var _classes;
  86. var h = arguments[0];
  87. var type = this.type,
  88. justify = this.justify,
  89. align = this.align,
  90. customizePrefixCls = this.prefixCls,
  91. $slots = this.$slots;
  92. var getPrefixCls = this.configProvider.getPrefixCls;
  93. var prefixCls = getPrefixCls('row', customizePrefixCls);
  94. var gutter = this.getGutter();
  95. var classes = (_classes = {}, (0, _defineProperty3['default'])(_classes, prefixCls, !type), (0, _defineProperty3['default'])(_classes, prefixCls + '-' + type, type), (0, _defineProperty3['default'])(_classes, prefixCls + '-' + type + '-' + justify, type && justify), (0, _defineProperty3['default'])(_classes, prefixCls + '-' + type + '-' + align, type && align), _classes);
  96. var rowStyle = (0, _extends3['default'])({}, gutter[0] > 0 ? {
  97. marginLeft: gutter[0] / -2 + 'px',
  98. marginRight: gutter[0] / -2 + 'px'
  99. } : {}, gutter[1] > 0 ? {
  100. marginTop: gutter[1] / -2 + 'px',
  101. marginBottom: gutter[1] / -2 + 'px'
  102. } : {});
  103. return h(
  104. 'div',
  105. { 'class': classes, style: rowStyle },
  106. [$slots['default']]
  107. );
  108. }
  109. };