index.js 7.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234
  1. 'use strict';
  2. Object.defineProperty(exports, "__esModule", {
  3. value: true
  4. });
  5. exports.SliderProps = undefined;
  6. var _objectWithoutProperties2 = require('babel-runtime/helpers/objectWithoutProperties');
  7. var _objectWithoutProperties3 = _interopRequireDefault(_objectWithoutProperties2);
  8. var _defineProperty2 = require('babel-runtime/helpers/defineProperty');
  9. var _defineProperty3 = _interopRequireDefault(_defineProperty2);
  10. var _extends3 = require('babel-runtime/helpers/extends');
  11. var _extends4 = _interopRequireDefault(_extends3);
  12. var _vueTypes = require('../_util/vue-types');
  13. var _vueTypes2 = _interopRequireDefault(_vueTypes);
  14. var _BaseMixin = require('../_util/BaseMixin');
  15. var _BaseMixin2 = _interopRequireDefault(_BaseMixin);
  16. var _propsUtil = require('../_util/props-util');
  17. var _Slider = require('../vc-slider/src/Slider');
  18. var _Slider2 = _interopRequireDefault(_Slider);
  19. var _Range = require('../vc-slider/src/Range');
  20. var _Range2 = _interopRequireDefault(_Range);
  21. var _Handle = require('../vc-slider/src/Handle');
  22. var _Handle2 = _interopRequireDefault(_Handle);
  23. var _tooltip = require('../tooltip');
  24. var _tooltip2 = _interopRequireDefault(_tooltip);
  25. var _base = require('../base');
  26. var _base2 = _interopRequireDefault(_base);
  27. var _configConsumerProps = require('../config-provider/configConsumerProps');
  28. var _abstractTooltipProps = require('../tooltip/abstractTooltipProps');
  29. var _abstractTooltipProps2 = _interopRequireDefault(_abstractTooltipProps);
  30. function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
  31. // export interface SliderMarks {
  32. // [key]: React.ReactNode | {
  33. // style: React.CSSProperties,
  34. // label: React.ReactNode,
  35. // };
  36. // }
  37. // const SliderMarks = PropTypes.shape({
  38. // style: PropTypes.object,
  39. // label: PropTypes.any,
  40. // }).loose
  41. var tooltipProps = (0, _abstractTooltipProps2['default'])();
  42. var SliderProps = exports.SliderProps = function SliderProps() {
  43. return {
  44. prefixCls: _vueTypes2['default'].string,
  45. tooltipPrefixCls: _vueTypes2['default'].string,
  46. range: _vueTypes2['default'].bool,
  47. reverse: _vueTypes2['default'].bool,
  48. min: _vueTypes2['default'].number,
  49. max: _vueTypes2['default'].number,
  50. step: _vueTypes2['default'].oneOfType([_vueTypes2['default'].number, _vueTypes2['default'].any]),
  51. marks: _vueTypes2['default'].object,
  52. dots: _vueTypes2['default'].bool,
  53. value: _vueTypes2['default'].oneOfType([_vueTypes2['default'].number, _vueTypes2['default'].arrayOf(_vueTypes2['default'].number)]),
  54. defaultValue: _vueTypes2['default'].oneOfType([_vueTypes2['default'].number, _vueTypes2['default'].arrayOf(_vueTypes2['default'].number)]),
  55. included: _vueTypes2['default'].bool,
  56. disabled: _vueTypes2['default'].bool,
  57. vertical: _vueTypes2['default'].bool,
  58. tipFormatter: _vueTypes2['default'].oneOfType([_vueTypes2['default'].func, _vueTypes2['default'].object]),
  59. tooltipVisible: _vueTypes2['default'].bool,
  60. tooltipPlacement: tooltipProps.placement,
  61. getTooltipPopupContainer: _vueTypes2['default'].func
  62. };
  63. };
  64. var Slider = {
  65. name: 'ASlider',
  66. model: {
  67. prop: 'value',
  68. event: 'change'
  69. },
  70. mixins: [_BaseMixin2['default']],
  71. inject: {
  72. configProvider: { 'default': function _default() {
  73. return _configConsumerProps.ConfigConsumerProps;
  74. } }
  75. },
  76. props: (0, _extends4['default'])({}, SliderProps(), {
  77. tipFormatter: _vueTypes2['default'].oneOfType([_vueTypes2['default'].func, _vueTypes2['default'].object]).def(function (value) {
  78. return value.toString();
  79. })
  80. }),
  81. data: function data() {
  82. return {
  83. visibles: {}
  84. };
  85. },
  86. methods: {
  87. toggleTooltipVisible: function toggleTooltipVisible(index, visible) {
  88. this.setState(function (_ref) {
  89. var visibles = _ref.visibles;
  90. return {
  91. visibles: (0, _extends4['default'])({}, visibles, (0, _defineProperty3['default'])({}, index, visible))
  92. };
  93. });
  94. },
  95. handleWithTooltip: function handleWithTooltip(tooltipPrefixCls, prefixCls, _ref2) {
  96. var _this = this;
  97. var value = _ref2.value,
  98. dragging = _ref2.dragging,
  99. index = _ref2.index,
  100. directives = _ref2.directives,
  101. on = _ref2.on,
  102. restProps = (0, _objectWithoutProperties3['default'])(_ref2, ['value', 'dragging', 'index', 'directives', 'on']);
  103. var h = this.$createElement;
  104. var _$props = this.$props,
  105. tipFormatter = _$props.tipFormatter,
  106. tooltipVisible = _$props.tooltipVisible,
  107. tooltipPlacement = _$props.tooltipPlacement,
  108. getTooltipPopupContainer = _$props.getTooltipPopupContainer;
  109. var visibles = this.visibles;
  110. var isTipFormatter = tipFormatter ? visibles[index] || dragging : false;
  111. var visible = tooltipVisible || tooltipVisible === undefined && isTipFormatter;
  112. var tooltipProps = {
  113. props: {
  114. prefixCls: tooltipPrefixCls,
  115. title: tipFormatter ? tipFormatter(value) : '',
  116. visible: visible,
  117. placement: tooltipPlacement || 'top',
  118. transitionName: 'zoom-down',
  119. overlayClassName: prefixCls + '-tooltip',
  120. getPopupContainer: getTooltipPopupContainer || function () {
  121. return document.body;
  122. }
  123. },
  124. key: index
  125. };
  126. var handleProps = {
  127. props: (0, _extends4['default'])({
  128. value: value
  129. }, restProps),
  130. directives: directives,
  131. on: (0, _extends4['default'])({}, on, {
  132. mouseenter: function mouseenter() {
  133. return _this.toggleTooltipVisible(index, true);
  134. },
  135. mouseleave: function mouseleave() {
  136. return _this.toggleTooltipVisible(index, false);
  137. }
  138. })
  139. };
  140. return h(
  141. _tooltip2['default'],
  142. tooltipProps,
  143. [h(_Handle2['default'], handleProps)]
  144. );
  145. },
  146. focus: function focus() {
  147. this.$refs.sliderRef.focus();
  148. },
  149. blur: function blur() {
  150. this.$refs.sliderRef.blur();
  151. }
  152. },
  153. render: function render() {
  154. var _this2 = this;
  155. var h = arguments[0];
  156. var _getOptionProps = (0, _propsUtil.getOptionProps)(this),
  157. range = _getOptionProps.range,
  158. customizePrefixCls = _getOptionProps.prefixCls,
  159. customizeTooltipPrefixCls = _getOptionProps.tooltipPrefixCls,
  160. restProps = (0, _objectWithoutProperties3['default'])(_getOptionProps, ['range', 'prefixCls', 'tooltipPrefixCls']);
  161. var getPrefixCls = this.configProvider.getPrefixCls;
  162. var prefixCls = getPrefixCls('slider', customizePrefixCls);
  163. var tooltipPrefixCls = getPrefixCls('tooltip', customizeTooltipPrefixCls);
  164. var listeners = (0, _propsUtil.getListeners)(this);
  165. if (range) {
  166. var vcRangeProps = {
  167. props: (0, _extends4['default'])({}, restProps, {
  168. prefixCls: prefixCls,
  169. tooltipPrefixCls: tooltipPrefixCls,
  170. handle: function handle(info) {
  171. return _this2.handleWithTooltip(tooltipPrefixCls, prefixCls, info);
  172. }
  173. }),
  174. ref: 'sliderRef',
  175. on: listeners
  176. };
  177. return h(_Range2['default'], vcRangeProps);
  178. }
  179. var vcSliderProps = {
  180. props: (0, _extends4['default'])({}, restProps, {
  181. prefixCls: prefixCls,
  182. tooltipPrefixCls: tooltipPrefixCls,
  183. handle: function handle(info) {
  184. return _this2.handleWithTooltip(tooltipPrefixCls, prefixCls, info);
  185. }
  186. }),
  187. ref: 'sliderRef',
  188. on: listeners
  189. };
  190. return h(_Slider2['default'], vcSliderProps);
  191. }
  192. };
  193. /* istanbul ignore next */
  194. Slider.install = function (Vue) {
  195. Vue.use(_base2['default']);
  196. Vue.component(Slider.name, Slider);
  197. };
  198. exports['default'] = Slider;