Column.js 6.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134
  1. "use strict";
  2. var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
  3. Object.defineProperty(exports, "__esModule", {
  4. value: true
  5. });
  6. exports.FIX_LABEL = void 0;
  7. exports.default = Column;
  8. var _vue = require("vue");
  9. var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
  10. var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
  11. var _commonUtil = require("../utils/commonUtil");
  12. var _Checkbox = _interopRequireDefault(require("./Checkbox"));
  13. var _useSearchOptions = require("../hooks/useSearchOptions");
  14. var _context = require("../context");
  15. var FIX_LABEL = '__cascader_fix_label__';
  16. exports.FIX_LABEL = FIX_LABEL;
  17. function Column(_ref) {
  18. var _expandIconRef$value, _customSlots$value$ex, _customSlots$value, _loadingIconRef$value, _customSlots$value$lo, _customSlots$value2;
  19. var prefixCls = _ref.prefixCls,
  20. multiple = _ref.multiple,
  21. options = _ref.options,
  22. activeValue = _ref.activeValue,
  23. prevValuePath = _ref.prevValuePath,
  24. onToggleOpen = _ref.onToggleOpen,
  25. onSelect = _ref.onSelect,
  26. onActive = _ref.onActive,
  27. checkedSet = _ref.checkedSet,
  28. halfCheckedSet = _ref.halfCheckedSet,
  29. loadingKeys = _ref.loadingKeys,
  30. isSelectable = _ref.isSelectable;
  31. var menuPrefixCls = "".concat(prefixCls, "-menu");
  32. var menuItemPrefixCls = "".concat(prefixCls, "-menu-item");
  33. var _useInjectCascader = (0, _context.useInjectCascader)(),
  34. fieldNames = _useInjectCascader.fieldNames,
  35. changeOnSelect = _useInjectCascader.changeOnSelect,
  36. expandTrigger = _useInjectCascader.expandTrigger,
  37. expandIconRef = _useInjectCascader.expandIcon,
  38. loadingIconRef = _useInjectCascader.loadingIcon,
  39. dropdownMenuColumnStyle = _useInjectCascader.dropdownMenuColumnStyle,
  40. customSlots = _useInjectCascader.customSlots;
  41. var expandIcon = (_expandIconRef$value = expandIconRef.value) !== null && _expandIconRef$value !== void 0 ? _expandIconRef$value : (_customSlots$value$ex = (_customSlots$value = customSlots.value).expandIcon) === null || _customSlots$value$ex === void 0 ? void 0 : _customSlots$value$ex.call(_customSlots$value);
  42. var loadingIcon = (_loadingIconRef$value = loadingIconRef.value) !== null && _loadingIconRef$value !== void 0 ? _loadingIconRef$value : (_customSlots$value$lo = (_customSlots$value2 = customSlots.value).loadingIcon) === null || _customSlots$value$lo === void 0 ? void 0 : _customSlots$value$lo.call(_customSlots$value2);
  43. var hoverOpen = expandTrigger.value === 'hover';
  44. // ============================ Render ============================
  45. return (0, _vue.createVNode)("ul", {
  46. "class": menuPrefixCls,
  47. "role": "menu"
  48. }, [options.map(function (option) {
  49. var _option$FIX_LABEL, _ref2;
  50. var disabled = option.disabled;
  51. var searchOptions = option[_useSearchOptions.SEARCH_MARK];
  52. var label = (_option$FIX_LABEL = option[FIX_LABEL]) !== null && _option$FIX_LABEL !== void 0 ? _option$FIX_LABEL : option[fieldNames.value.label];
  53. var value = option[fieldNames.value.value];
  54. var isMergedLeaf = (0, _commonUtil.isLeaf)(option, fieldNames.value);
  55. // Get real value of option. Search option is different way.
  56. var fullPath = searchOptions ? searchOptions.map(function (opt) {
  57. return opt[fieldNames.value.value];
  58. }) : [].concat((0, _toConsumableArray2.default)(prevValuePath), [value]);
  59. var fullPathKey = (0, _commonUtil.toPathKey)(fullPath);
  60. var isLoading = loadingKeys.includes(fullPathKey);
  61. // >>>>> checked
  62. var checked = checkedSet.has(fullPathKey);
  63. // >>>>> halfChecked
  64. var halfChecked = halfCheckedSet.has(fullPathKey);
  65. // >>>>> Open
  66. var triggerOpenPath = function triggerOpenPath() {
  67. if (!disabled && (!hoverOpen || !isMergedLeaf)) {
  68. onActive(fullPath);
  69. }
  70. };
  71. // >>>>> Selection
  72. var triggerSelect = function triggerSelect() {
  73. if (isSelectable(option)) {
  74. onSelect(fullPath, isMergedLeaf);
  75. }
  76. };
  77. // >>>>> Title
  78. var title;
  79. if (typeof option.title === 'string') {
  80. title = option.title;
  81. } else if (typeof label === 'string') {
  82. title = label;
  83. }
  84. // >>>>> Render
  85. return (0, _vue.createVNode)("li", {
  86. "key": fullPathKey,
  87. "class": [menuItemPrefixCls, (_ref2 = {}, (0, _defineProperty2.default)(_ref2, "".concat(menuItemPrefixCls, "-expand"), !isMergedLeaf), (0, _defineProperty2.default)(_ref2, "".concat(menuItemPrefixCls, "-active"), activeValue === value), (0, _defineProperty2.default)(_ref2, "".concat(menuItemPrefixCls, "-disabled"), disabled), (0, _defineProperty2.default)(_ref2, "".concat(menuItemPrefixCls, "-loading"), isLoading), _ref2)],
  88. "style": dropdownMenuColumnStyle.value,
  89. "role": "menuitemcheckbox",
  90. "title": title,
  91. "aria-checked": checked,
  92. "data-path-key": fullPathKey,
  93. "onClick": function onClick() {
  94. triggerOpenPath();
  95. if (!multiple || isMergedLeaf) {
  96. triggerSelect();
  97. }
  98. },
  99. "onDblclick": function onDblclick() {
  100. if (changeOnSelect.value) {
  101. onToggleOpen(false);
  102. }
  103. },
  104. "onMouseenter": function onMouseenter() {
  105. if (hoverOpen) {
  106. triggerOpenPath();
  107. }
  108. },
  109. "onMousedown": function onMousedown(e) {
  110. // Prevent selector from blurring
  111. e.preventDefault();
  112. }
  113. }, [multiple && (0, _vue.createVNode)(_Checkbox.default, {
  114. "prefixCls": "".concat(prefixCls, "-checkbox"),
  115. "checked": checked,
  116. "halfChecked": halfChecked,
  117. "disabled": disabled,
  118. "onClick": function onClick(e) {
  119. e.stopPropagation();
  120. triggerSelect();
  121. }
  122. }, null), (0, _vue.createVNode)("div", {
  123. "class": "".concat(menuItemPrefixCls, "-content")
  124. }, [label]), !isLoading && expandIcon && !isMergedLeaf && (0, _vue.createVNode)("div", {
  125. "class": "".concat(menuItemPrefixCls, "-expand-icon")
  126. }, [expandIcon]), isLoading && loadingIcon && (0, _vue.createVNode)("div", {
  127. "class": "".concat(menuItemPrefixCls, "-loading-icon")
  128. }, [loadingIcon])]);
  129. })]);
  130. }
  131. Column.props = ['prefixCls', 'multiple', 'options', 'activeValue', 'prevValuePath', 'onToggleOpen', 'onSelect', 'onActive', 'checkedSet', 'halfCheckedSet', 'loadingKeys', 'isSelectable'];
  132. Column.displayName = 'Column';
  133. Column.inheritAttrs = false;