| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163 |
- import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
- import _extends from "@babel/runtime/helpers/esm/extends";
- import { resolveDirective as _resolveDirective, createVNode as _createVNode } from "vue";
- var __rest = this && this.__rest || function (s, e) {
- var t = {};
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
- if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
- }
- return t;
- };
- import { computed, shallowRef, defineComponent } from 'vue';
- import classNames from '../_util/classNames';
- import Input from './Input';
- import SearchOutlined from "@ant-design/icons-vue/es/icons/SearchOutlined";
- import Button from '../button';
- import { cloneElement } from '../_util/vnode';
- import PropTypes from '../_util/vue-types';
- import isPlainObject from 'lodash-es/isPlainObject';
- import useConfigInject from '../config-provider/hooks/useConfigInject';
- import omit from '../_util/omit';
- import inputProps from './inputProps';
- export default defineComponent({
- compatConfig: {
- MODE: 3
- },
- name: 'AInputSearch',
- inheritAttrs: false,
- props: _extends(_extends({}, inputProps()), {
- inputPrefixCls: String,
- // 不能设置默认值 https://github.com/vueComponent/ant-design-vue/issues/1916
- enterButton: PropTypes.any,
- onSearch: {
- type: Function
- }
- }),
- setup(props, _ref) {
- let {
- slots,
- attrs,
- expose,
- emit
- } = _ref;
- const inputRef = shallowRef();
- const composedRef = shallowRef(false);
- const focus = () => {
- var _a;
- (_a = inputRef.value) === null || _a === void 0 ? void 0 : _a.focus();
- };
- const blur = () => {
- var _a;
- (_a = inputRef.value) === null || _a === void 0 ? void 0 : _a.blur();
- };
- expose({
- focus,
- blur
- });
- const onChange = e => {
- emit('update:value', e.target.value);
- if (e && e.target && e.type === 'click') {
- emit('search', e.target.value, e);
- }
- emit('change', e);
- };
- const onMousedown = e => {
- var _a;
- if (document.activeElement === ((_a = inputRef.value) === null || _a === void 0 ? void 0 : _a.input)) {
- e.preventDefault();
- }
- };
- const onSearch = e => {
- var _a, _b;
- emit('search', (_b = (_a = inputRef.value) === null || _a === void 0 ? void 0 : _a.input) === null || _b === void 0 ? void 0 : _b.stateValue, e);
- };
- const onPressEnter = e => {
- if (composedRef.value || props.loading) {
- return;
- }
- onSearch(e);
- };
- const handleOnCompositionStart = e => {
- composedRef.value = true;
- emit('compositionstart', e);
- };
- const handleOnCompositionEnd = e => {
- composedRef.value = false;
- emit('compositionend', e);
- };
- const {
- prefixCls,
- getPrefixCls,
- direction,
- size
- } = useConfigInject('input-search', props);
- const inputPrefixCls = computed(() => getPrefixCls('input', props.inputPrefixCls));
- return () => {
- var _a, _b, _c, _d;
- const {
- disabled,
- loading,
- addonAfter = (_a = slots.addonAfter) === null || _a === void 0 ? void 0 : _a.call(slots),
- suffix = (_b = slots.suffix) === null || _b === void 0 ? void 0 : _b.call(slots)
- } = props,
- restProps = __rest(props, ["disabled", "loading", "addonAfter", "suffix"]);
- let {
- enterButton = (_d = (_c = slots.enterButton) === null || _c === void 0 ? void 0 : _c.call(slots)) !== null && _d !== void 0 ? _d : false
- } = props;
- enterButton = enterButton || enterButton === '';
- const searchIcon = typeof enterButton === 'boolean' ? _createVNode(SearchOutlined, null, null) : null;
- const btnClassName = `${prefixCls.value}-button`;
- const enterButtonAsElement = Array.isArray(enterButton) ? enterButton[0] : enterButton;
- let button;
- const isAntdButton = enterButtonAsElement.type && isPlainObject(enterButtonAsElement.type) && enterButtonAsElement.type.__ANT_BUTTON;
- if (isAntdButton || enterButtonAsElement.tagName === 'button') {
- button = cloneElement(enterButtonAsElement, _extends({
- onMousedown,
- onClick: onSearch,
- key: 'enterButton'
- }, isAntdButton ? {
- class: btnClassName,
- size: size.value
- } : {}), false);
- } else {
- const iconOnly = searchIcon && !enterButton;
- button = _createVNode(Button, {
- "class": btnClassName,
- "type": enterButton ? 'primary' : undefined,
- "size": size.value,
- "disabled": disabled,
- "key": "enterButton",
- "onMousedown": onMousedown,
- "onClick": onSearch,
- "loading": loading,
- "icon": iconOnly ? searchIcon : null
- }, {
- default: () => [iconOnly ? null : searchIcon || enterButton]
- });
- }
- if (addonAfter) {
- button = [button, addonAfter];
- }
- const cls = classNames(prefixCls.value, {
- [`${prefixCls.value}-rtl`]: direction.value === 'rtl',
- [`${prefixCls.value}-${size.value}`]: !!size.value,
- [`${prefixCls.value}-with-button`]: !!enterButton
- }, attrs.class);
- return _createVNode(Input, _objectSpread(_objectSpread(_objectSpread({
- "ref": inputRef
- }, omit(restProps, ['onUpdate:value', 'onSearch', 'enterButton'])), attrs), {}, {
- "onPressEnter": onPressEnter,
- "onCompositionstart": handleOnCompositionStart,
- "onCompositionend": handleOnCompositionEnd,
- "size": size.value,
- "prefixCls": inputPrefixCls.value,
- "addonAfter": button,
- "suffix": suffix,
- "onChange": onChange,
- "class": cls,
- "disabled": disabled
- }), slots);
- };
- }
- });
|