haiwen/seahub
1
0
Fork 0
mirror of https://github.com/haiwen/seahub.git synced 2025-09-17 07:41:26 +00:00
Code Issues Releases Wiki Activity

feat: search input

Browse Source
This commit is contained in:
杨国璇
2024-12-26 15:17:16 +08:00
parent 7b87b755a0
commit 1bf3350c8c
2 changed files with 4 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
frontend/src/components/common/group-select/select-option-group.js
View File

@@ -1,7 +1,7 @@
import React, { Component } from 'react'; import React, { Component } from 'react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import classnames from 'classnames'; import classnames from 'classnames';
import { SearchInput } from '@seafile/sf-metadata-ui-component'; import SearchInput from '../search-input';
import Option from './option'; import Option from './option';
import KeyCodes from '../../../constants/keyCodes'; import KeyCodes from '../../../constants/keyCodes';
import ClickOutside from './click-outside'; import ClickOutside from './click-outside';
@@ -45,7 +45,6 @@ class SelectOptionGroup extends Component {
this.optionGroupRef.style.top = (position.y - height) + 'px'; this.optionGroupRef.style.top = (position.y - height) + 'px';
} }
this.optionGroupRef.style.opacity = 1; this.optionGroupRef.style.opacity = 1;
this.searchInputRef.current && this.searchInputRef.current.inputRef.focus();
} }
else { else {
if (height + top > window.innerHeight) { if (height + top > window.innerHeight) {
@@ -181,6 +180,7 @@ class SelectOptionGroup extends Component {
<div className="option-group-search position-relative"> <div className="option-group-search position-relative">
<SearchInput <SearchInput
className="option-search-control" className="option-search-control"
autoFocus={isInModal}
placeholder={searchPlaceholder} placeholder={searchPlaceholder}
onChange={this.onChangeSearch} onChange={this.onChangeSearch}
ref={this.searchInputRef} ref={this.searchInputRef}

8
frontend/src/components/common/search-input.js
View File

@@ -1,6 +1,7 @@
import React, { Component, Fragment } from 'react'; import React, { Component, Fragment } from 'react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import classnames from 'classnames'; import classnames from 'classnames';
import { Utils } from '../../utils/utils';
const propTypes = { const propTypes = {
placeholder: PropTypes.string, placeholder: PropTypes.string,
@@ -87,11 +88,6 @@ class SearchInput extends Component {
} }
}; };
isFunction = (functionToCheck) => {
const getType = {};
return functionToCheck && getType.toString.call(functionToCheck) === '[object Function]';
};
renderClear = () => { renderClear = () => {
const { isClearable, clearClassName, components = {} } = this.props; const { isClearable, clearClassName, components = {} } = this.props;
const { searchValue } = this.state; const { searchValue } = this.state;
@@ -99,7 +95,7 @@ class SearchInput extends Component {
const { ClearIndicator } = components; const { ClearIndicator } = components;
if (React.isValidElement(ClearIndicator)) { if (React.isValidElement(ClearIndicator)) {
return React.cloneElement(ClearIndicator, { clearValue: this.clearSearch }); return React.cloneElement(ClearIndicator, { clearValue: this.clearSearch });
} else if (this.isFunction(ClearIndicator)) { } else if (Utils.isFunction(ClearIndicator)) {
return <ClearIndicator clearValue={this.clearSearch} />; return <ClearIndicator clearValue={this.clearSearch} />;
} }
return ( return (