123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243 |
- 'use strict';
- Object.defineProperty(exports, "__esModule", {
- value: true
- });
- var _defineProperty2 = require('babel-runtime/helpers/defineProperty');
- var _defineProperty3 = _interopRequireDefault(_defineProperty2);
- var _objectWithoutProperties2 = require('babel-runtime/helpers/objectWithoutProperties');
- var _objectWithoutProperties3 = _interopRequireDefault(_objectWithoutProperties2);
- var _extends2 = require('babel-runtime/helpers/extends');
- var _extends3 = _interopRequireDefault(_extends2);
- var _classnames = require('classnames');
- var _classnames2 = _interopRequireDefault(_classnames);
- var _isMobile = require('is-mobile');
- var _Input = require('./Input');
- var _Input2 = _interopRequireDefault(_Input);
- var _icon = require('../icon');
- var _icon2 = _interopRequireDefault(_icon);
- var _inputProps = require('./inputProps');
- var _inputProps2 = _interopRequireDefault(_inputProps);
- var _button = require('../button');
- var _button2 = _interopRequireDefault(_button);
- var _vnode = require('../_util/vnode');
- var _vueTypes = require('../_util/vue-types');
- var _vueTypes2 = _interopRequireDefault(_vueTypes);
- var _propsUtil = require('../_util/props-util');
- var _configConsumerProps = require('../config-provider/configConsumerProps');
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
- exports['default'] = {
- name: 'AInputSearch',
- inheritAttrs: false,
- model: {
- prop: 'value',
- event: 'change.value'
- },
- props: (0, _extends3['default'])({}, _inputProps2['default'], {
- // 不能设置默认值 https://github.com/vueComponent/ant-design-vue/issues/1916
- enterButton: _vueTypes2['default'].any
- }),
- inject: {
- configProvider: { 'default': function _default() {
- return _configConsumerProps.ConfigConsumerProps;
- } }
- },
- methods: {
- onChange: function onChange(e) {
- if (e && e.target && e.type === 'click') {
- this.$emit('search', e.target.value, e);
- }
- this.$emit('change', e);
- },
- onSearch: function onSearch(e) {
- if (this.loading || this.disabled) {
- return;
- }
- this.$emit('search', this.$refs.input.stateValue, e);
- if (!(0, _isMobile.isMobile)({ tablet: true })) {
- this.$refs.input.focus();
- }
- },
- focus: function focus() {
- this.$refs.input.focus();
- },
- blur: function blur() {
- this.$refs.input.blur();
- },
- renderLoading: function renderLoading(prefixCls) {
- var h = this.$createElement;
- var size = this.$props.size;
- var enterButton = (0, _propsUtil.getComponentFromProp)(this, 'enterButton');
- // 兼容 <a-input-search enterButton />, 因enterButton类型为 any,此类写法 enterButton 为空字符串
- enterButton = enterButton || enterButton === '';
- if (enterButton) {
- return h(
- _button2['default'],
- { 'class': prefixCls + '-button', attrs: { type: 'primary', size: size },
- key: 'enterButton' },
- [h(_icon2['default'], {
- attrs: { type: 'loading' }
- })]
- );
- }
- return h(_icon2['default'], { 'class': prefixCls + '-icon', attrs: { type: 'loading' },
- key: 'loadingIcon' });
- },
- renderSuffix: function renderSuffix(prefixCls) {
- var h = this.$createElement;
- var loading = this.loading;
- var suffix = (0, _propsUtil.getComponentFromProp)(this, 'suffix');
- var enterButton = (0, _propsUtil.getComponentFromProp)(this, 'enterButton');
- // 兼容 <a-input-search enterButton />, 因enterButton类型为 any,此类写法 enterButton 为空字符串
- enterButton = enterButton || enterButton === '';
- if (loading && !enterButton) {
- return [suffix, this.renderLoading(prefixCls)];
- }
- if (enterButton) return suffix;
- var icon = h(_icon2['default'], { 'class': prefixCls + '-icon', attrs: { type: 'search' },
- key: 'searchIcon', on: {
- 'click': this.onSearch
- }
- });
- if (suffix) {
- // let cloneSuffix = suffix;
- // if (isValidElement(cloneSuffix) && !cloneSuffix.key) {
- // cloneSuffix = cloneElement(cloneSuffix, {
- // key: 'originSuffix',
- // });
- // }
- return [suffix, icon];
- }
- return icon;
- },
- renderAddonAfter: function renderAddonAfter(prefixCls) {
- var h = this.$createElement;
- var size = this.size,
- disabled = this.disabled,
- loading = this.loading;
- var btnClassName = prefixCls + '-button';
- var enterButton = (0, _propsUtil.getComponentFromProp)(this, 'enterButton');
- enterButton = enterButton || enterButton === '';
- var addonAfter = (0, _propsUtil.getComponentFromProp)(this, 'addonAfter');
- if (loading && enterButton) {
- return [this.renderLoading(prefixCls), addonAfter];
- }
- if (!enterButton) return addonAfter;
- var enterButtonAsElement = Array.isArray(enterButton) ? enterButton[0] : enterButton;
- var button = void 0;
- var isAntdButton = enterButtonAsElement.componentOptions && enterButtonAsElement.componentOptions.Ctor.extendOptions.__ANT_BUTTON;
- if (enterButtonAsElement.tag === 'button' || isAntdButton) {
- button = (0, _vnode.cloneElement)(enterButtonAsElement, {
- key: 'enterButton',
- 'class': isAntdButton ? btnClassName : '',
- props: isAntdButton ? { size: size } : {},
- on: {
- click: this.onSearch
- }
- });
- } else {
- button = h(
- _button2['default'],
- {
- 'class': btnClassName,
- attrs: { type: 'primary',
- size: size,
- disabled: disabled
- },
- key: 'enterButton',
- on: {
- 'click': this.onSearch
- }
- },
- [enterButton === true || enterButton === '' ? h(_icon2['default'], {
- attrs: { type: 'search' }
- }) : enterButton]
- );
- }
- if (addonAfter) {
- return [button, addonAfter];
- }
- return button;
- }
- },
- render: function render() {
- var h = arguments[0];
- var _getOptionProps = (0, _propsUtil.getOptionProps)(this),
- customizePrefixCls = _getOptionProps.prefixCls,
- customizeInputPrefixCls = _getOptionProps.inputPrefixCls,
- size = _getOptionProps.size,
- loading = _getOptionProps.loading,
- others = (0, _objectWithoutProperties3['default'])(_getOptionProps, ['prefixCls', 'inputPrefixCls', 'size', 'loading']);
- var getPrefixCls = this.configProvider.getPrefixCls;
- var prefixCls = getPrefixCls('input-search', customizePrefixCls);
- var inputPrefixCls = getPrefixCls('input', customizeInputPrefixCls);
- var enterButton = (0, _propsUtil.getComponentFromProp)(this, 'enterButton');
- var addonBefore = (0, _propsUtil.getComponentFromProp)(this, 'addonBefore');
- enterButton = enterButton || enterButton === '';
- var inputClassName = void 0;
- if (enterButton) {
- var _classNames;
- inputClassName = (0, _classnames2['default'])(prefixCls, (_classNames = {}, (0, _defineProperty3['default'])(_classNames, prefixCls + '-enter-button', !!enterButton), (0, _defineProperty3['default'])(_classNames, prefixCls + '-' + size, !!size), _classNames));
- } else {
- inputClassName = prefixCls;
- }
- var on = (0, _extends3['default'])({}, (0, _propsUtil.getListeners)(this));
- delete on.search;
- var inputProps = {
- props: (0, _extends3['default'])({}, others, {
- prefixCls: inputPrefixCls,
- size: size,
- suffix: this.renderSuffix(prefixCls),
- prefix: (0, _propsUtil.getComponentFromProp)(this, 'prefix'),
- addonAfter: this.renderAddonAfter(prefixCls),
- addonBefore: addonBefore,
- className: inputClassName
- }),
- attrs: this.$attrs,
- ref: 'input',
- on: (0, _extends3['default'])({
- pressEnter: this.onSearch
- }, on, {
- change: this.onChange
- })
- };
- return h(_Input2['default'], inputProps);
- }
- };
|