TimeUnitColumn.js 3.0 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182
  1. import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
  2. import { createVNode as _createVNode } from "vue";
  3. import { scrollTo, waitElementReady } from '../../utils/uiUtil';
  4. import { useInjectPanel } from '../../PanelContext';
  5. import classNames from '../../../_util/classNames';
  6. import { ref, onBeforeUnmount, watch, defineComponent, nextTick } from 'vue';
  7. export default defineComponent({
  8. name: 'TimeUnitColumn',
  9. props: ['prefixCls', 'units', 'onSelect', 'value', 'active', 'hideDisabledOptions'],
  10. setup: function setup(props) {
  11. var _useInjectPanel = useInjectPanel(),
  12. open = _useInjectPanel.open;
  13. var ulRef = ref(null);
  14. var liRefs = ref(new Map());
  15. var scrollRef = ref();
  16. watch(function () {
  17. return props.value;
  18. }, function () {
  19. var li = liRefs.value.get(props.value);
  20. if (li && open.value !== false) {
  21. scrollTo(ulRef.value, li.offsetTop, 120);
  22. }
  23. });
  24. onBeforeUnmount(function () {
  25. var _scrollRef$value;
  26. (_scrollRef$value = scrollRef.value) === null || _scrollRef$value === void 0 ? void 0 : _scrollRef$value.call(scrollRef);
  27. });
  28. watch(open, function () {
  29. var _scrollRef$value2;
  30. (_scrollRef$value2 = scrollRef.value) === null || _scrollRef$value2 === void 0 ? void 0 : _scrollRef$value2.call(scrollRef);
  31. nextTick(function () {
  32. if (open.value) {
  33. var li = liRefs.value.get(props.value);
  34. if (li) {
  35. scrollRef.value = waitElementReady(li, function () {
  36. scrollTo(ulRef.value, li.offsetTop, 0);
  37. });
  38. }
  39. }
  40. });
  41. }, {
  42. immediate: true,
  43. flush: 'post'
  44. });
  45. return function () {
  46. var prefixCls = props.prefixCls,
  47. units = props.units,
  48. onSelect = props.onSelect,
  49. value = props.value,
  50. active = props.active,
  51. hideDisabledOptions = props.hideDisabledOptions;
  52. var cellPrefixCls = "".concat(prefixCls, "-cell");
  53. return _createVNode("ul", {
  54. "class": classNames("".concat(prefixCls, "-column"), _defineProperty({}, "".concat(prefixCls, "-column-active"), active)),
  55. "ref": ulRef,
  56. "style": {
  57. position: 'relative'
  58. }
  59. }, [units.map(function (unit) {
  60. var _classNames2;
  61. if (hideDisabledOptions && unit.disabled) {
  62. return null;
  63. }
  64. return _createVNode("li", {
  65. "key": unit.value,
  66. "ref": function ref(element) {
  67. liRefs.value.set(unit.value, element);
  68. },
  69. "class": classNames(cellPrefixCls, (_classNames2 = {}, _defineProperty(_classNames2, "".concat(cellPrefixCls, "-disabled"), unit.disabled), _defineProperty(_classNames2, "".concat(cellPrefixCls, "-selected"), value === unit.value), _classNames2)),
  70. "onClick": function onClick() {
  71. if (unit.disabled) {
  72. return;
  73. }
  74. onSelect(unit.value);
  75. }
  76. }, [_createVNode("div", {
  77. "class": "".concat(cellPrefixCls, "-inner")
  78. }, [unit.label])]);
  79. })]);
  80. };
  81. }
  82. });