search.js 1.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475
  1. import PropTypes from '../_util/vue-types';
  2. import { initDefaultProps, getOptionProps } from '../_util/props-util';
  3. import Icon from '../icon';
  4. import Input from '../input';
  5. export var TransferSearchProps = {
  6. prefixCls: PropTypes.string,
  7. placeholder: PropTypes.string,
  8. value: PropTypes.any,
  9. handleClear: PropTypes.func,
  10. disabled: PropTypes.bool
  11. };
  12. export default {
  13. name: 'Search',
  14. props: initDefaultProps(TransferSearchProps, {
  15. placeholder: ''
  16. }),
  17. methods: {
  18. handleChange: function handleChange(e) {
  19. this.$emit('change', e);
  20. },
  21. handleClear2: function handleClear2(e) {
  22. e.preventDefault();
  23. var _$props = this.$props,
  24. handleClear = _$props.handleClear,
  25. disabled = _$props.disabled;
  26. if (!disabled && handleClear) {
  27. handleClear(e);
  28. }
  29. }
  30. },
  31. render: function render() {
  32. var h = arguments[0];
  33. var _getOptionProps = getOptionProps(this),
  34. placeholder = _getOptionProps.placeholder,
  35. value = _getOptionProps.value,
  36. prefixCls = _getOptionProps.prefixCls,
  37. disabled = _getOptionProps.disabled;
  38. var icon = value && value.length > 0 ? h(
  39. 'a',
  40. {
  41. attrs: { href: '#' },
  42. 'class': prefixCls + '-action', on: {
  43. 'click': this.handleClear2
  44. }
  45. },
  46. [h(Icon, {
  47. attrs: { type: 'close-circle', theme: 'filled' }
  48. })]
  49. ) : h(
  50. 'span',
  51. { 'class': prefixCls + '-action' },
  52. [h(Icon, {
  53. attrs: { type: 'search' }
  54. })]
  55. );
  56. return h('div', [h(Input, {
  57. attrs: {
  58. placeholder: placeholder,
  59. value: value,
  60. disabled: disabled
  61. },
  62. 'class': prefixCls, on: {
  63. 'change': this.handleChange
  64. }
  65. }), icon]);
  66. }
  67. };