Search.js 6.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169
  1. "use strict";
  2. var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
  3. Object.defineProperty(exports, "__esModule", {
  4. value: true
  5. });
  6. exports.default = void 0;
  7. var _vue = require("vue");
  8. var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
  9. var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
  10. var _classNames = _interopRequireDefault(require("../_util/classNames"));
  11. var _Input = _interopRequireDefault(require("./Input"));
  12. var _SearchOutlined = _interopRequireDefault(require("@ant-design/icons-vue/lib/icons/SearchOutlined"));
  13. var _button = _interopRequireDefault(require("../button"));
  14. var _vnode = require("../_util/vnode");
  15. var _vueTypes = _interopRequireDefault(require("../_util/vue-types"));
  16. var _isPlainObject = _interopRequireDefault(require("lodash/isPlainObject"));
  17. var _useConfigInject = _interopRequireDefault(require("../config-provider/hooks/useConfigInject"));
  18. var _omit = _interopRequireDefault(require("../_util/omit"));
  19. var _inputProps = _interopRequireDefault(require("./inputProps"));
  20. var __rest = void 0 && (void 0).__rest || function (s, e) {
  21. var t = {};
  22. for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
  23. if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
  24. if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
  25. }
  26. return t;
  27. };
  28. var _default = exports.default = (0, _vue.defineComponent)({
  29. compatConfig: {
  30. MODE: 3
  31. },
  32. name: 'AInputSearch',
  33. inheritAttrs: false,
  34. props: (0, _extends2.default)((0, _extends2.default)({}, (0, _inputProps.default)()), {
  35. inputPrefixCls: String,
  36. // 不能设置默认值 https://github.com/vueComponent/ant-design-vue/issues/1916
  37. enterButton: _vueTypes.default.any,
  38. onSearch: {
  39. type: Function
  40. }
  41. }),
  42. setup(props, _ref) {
  43. let {
  44. slots,
  45. attrs,
  46. expose,
  47. emit
  48. } = _ref;
  49. const inputRef = (0, _vue.shallowRef)();
  50. const composedRef = (0, _vue.shallowRef)(false);
  51. const focus = () => {
  52. var _a;
  53. (_a = inputRef.value) === null || _a === void 0 ? void 0 : _a.focus();
  54. };
  55. const blur = () => {
  56. var _a;
  57. (_a = inputRef.value) === null || _a === void 0 ? void 0 : _a.blur();
  58. };
  59. expose({
  60. focus,
  61. blur
  62. });
  63. const onChange = e => {
  64. emit('update:value', e.target.value);
  65. if (e && e.target && e.type === 'click') {
  66. emit('search', e.target.value, e);
  67. }
  68. emit('change', e);
  69. };
  70. const onMousedown = e => {
  71. var _a;
  72. if (document.activeElement === ((_a = inputRef.value) === null || _a === void 0 ? void 0 : _a.input)) {
  73. e.preventDefault();
  74. }
  75. };
  76. const onSearch = e => {
  77. var _a, _b;
  78. emit('search', (_b = (_a = inputRef.value) === null || _a === void 0 ? void 0 : _a.input) === null || _b === void 0 ? void 0 : _b.stateValue, e);
  79. };
  80. const onPressEnter = e => {
  81. if (composedRef.value || props.loading) {
  82. return;
  83. }
  84. onSearch(e);
  85. };
  86. const handleOnCompositionStart = e => {
  87. composedRef.value = true;
  88. emit('compositionstart', e);
  89. };
  90. const handleOnCompositionEnd = e => {
  91. composedRef.value = false;
  92. emit('compositionend', e);
  93. };
  94. const {
  95. prefixCls,
  96. getPrefixCls,
  97. direction,
  98. size
  99. } = (0, _useConfigInject.default)('input-search', props);
  100. const inputPrefixCls = (0, _vue.computed)(() => getPrefixCls('input', props.inputPrefixCls));
  101. return () => {
  102. var _a, _b, _c, _d;
  103. const {
  104. disabled,
  105. loading,
  106. addonAfter = (_a = slots.addonAfter) === null || _a === void 0 ? void 0 : _a.call(slots),
  107. suffix = (_b = slots.suffix) === null || _b === void 0 ? void 0 : _b.call(slots)
  108. } = props,
  109. restProps = __rest(props, ["disabled", "loading", "addonAfter", "suffix"]);
  110. let {
  111. enterButton = (_d = (_c = slots.enterButton) === null || _c === void 0 ? void 0 : _c.call(slots)) !== null && _d !== void 0 ? _d : false
  112. } = props;
  113. enterButton = enterButton || enterButton === '';
  114. const searchIcon = typeof enterButton === 'boolean' ? (0, _vue.createVNode)(_SearchOutlined.default, null, null) : null;
  115. const btnClassName = `${prefixCls.value}-button`;
  116. const enterButtonAsElement = Array.isArray(enterButton) ? enterButton[0] : enterButton;
  117. let button;
  118. const isAntdButton = enterButtonAsElement.type && (0, _isPlainObject.default)(enterButtonAsElement.type) && enterButtonAsElement.type.__ANT_BUTTON;
  119. if (isAntdButton || enterButtonAsElement.tagName === 'button') {
  120. button = (0, _vnode.cloneElement)(enterButtonAsElement, (0, _extends2.default)({
  121. onMousedown,
  122. onClick: onSearch,
  123. key: 'enterButton'
  124. }, isAntdButton ? {
  125. class: btnClassName,
  126. size: size.value
  127. } : {}), false);
  128. } else {
  129. const iconOnly = searchIcon && !enterButton;
  130. button = (0, _vue.createVNode)(_button.default, {
  131. "class": btnClassName,
  132. "type": enterButton ? 'primary' : undefined,
  133. "size": size.value,
  134. "disabled": disabled,
  135. "key": "enterButton",
  136. "onMousedown": onMousedown,
  137. "onClick": onSearch,
  138. "loading": loading,
  139. "icon": iconOnly ? searchIcon : null
  140. }, {
  141. default: () => [iconOnly ? null : searchIcon || enterButton]
  142. });
  143. }
  144. if (addonAfter) {
  145. button = [button, addonAfter];
  146. }
  147. const cls = (0, _classNames.default)(prefixCls.value, {
  148. [`${prefixCls.value}-rtl`]: direction.value === 'rtl',
  149. [`${prefixCls.value}-${size.value}`]: !!size.value,
  150. [`${prefixCls.value}-with-button`]: !!enterButton
  151. }, attrs.class);
  152. return (0, _vue.createVNode)(_Input.default, (0, _objectSpread2.default)((0, _objectSpread2.default)((0, _objectSpread2.default)({
  153. "ref": inputRef
  154. }, (0, _omit.default)(restProps, ['onUpdate:value', 'onSearch', 'enterButton'])), attrs), {}, {
  155. "onPressEnter": onPressEnter,
  156. "onCompositionstart": handleOnCompositionStart,
  157. "onCompositionend": handleOnCompositionEnd,
  158. "size": size.value,
  159. "prefixCls": inputPrefixCls.value,
  160. "addonAfter": button,
  161. "suffix": suffix,
  162. "onChange": onChange,
  163. "class": cls,
  164. "disabled": disabled
  165. }), slots);
  166. };
  167. }
  168. });