mirror of
https://github.com/haiwen/seahub.git
synced 2025-09-11 03:41:12 +00:00
change select UI (#7178)
This commit is contained in:
@@ -1,6 +1,6 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import Select, { components, createFilter } from 'react-select';
|
import Select, { components } from 'react-select';
|
||||||
import { MenuSelectStyle } from './seahub-select-style';
|
import { MenuSelectStyle } from './seahub-select-style';
|
||||||
|
|
||||||
const ClearIndicator = ({ innerProps, ...props }) => {
|
const ClearIndicator = ({ innerProps, ...props }) => {
|
||||||
@@ -64,8 +64,8 @@ export default class SeahubSelect extends React.Component {
|
|||||||
options: [],
|
options: [],
|
||||||
value: {},
|
value: {},
|
||||||
isDisabled: false,
|
isDisabled: false,
|
||||||
isSearchable: false,
|
isSearchable: true,
|
||||||
isClearable: false,
|
isClearable: true,
|
||||||
placeholder: '',
|
placeholder: '',
|
||||||
isMulti: false,
|
isMulti: false,
|
||||||
menuPortalTarget: '.modal',
|
menuPortalTarget: '.modal',
|
||||||
@@ -94,10 +94,6 @@ export default class SeahubSelect extends React.Component {
|
|||||||
classNamePrefix={classNamePrefix}
|
classNamePrefix={classNamePrefix}
|
||||||
styles={MenuSelectStyle}
|
styles={MenuSelectStyle}
|
||||||
components={{ Option, MenuList, ClearIndicator }}
|
components={{ Option, MenuList, ClearIndicator }}
|
||||||
filterOption={createFilter({
|
|
||||||
matchFrom: 'any',
|
|
||||||
stringify: option => `${option.data.labelValue}`,
|
|
||||||
})}
|
|
||||||
placeholder={placeholder}
|
placeholder={placeholder}
|
||||||
isSearchable={isSearchable}
|
isSearchable={isSearchable}
|
||||||
isClearable={isClearable}
|
isClearable={isClearable}
|
||||||
|
@@ -5,7 +5,7 @@ import { gettext, isPro } from '../../utils/constants';
|
|||||||
import wikiAPI from '../../utils/wiki-api';
|
import wikiAPI from '../../utils/wiki-api';
|
||||||
import { Utils } from '../../utils/utils';
|
import { Utils } from '../../utils/utils';
|
||||||
import toaster from '../toast';
|
import toaster from '../toast';
|
||||||
import { SeahubSelect, NoOptionsStyle } from '../common/select';
|
import { SeahubSelect } from '../common/select';
|
||||||
|
|
||||||
const propTypes = {
|
const propTypes = {
|
||||||
toggleCancel: PropTypes.func.isRequired,
|
toggleCancel: PropTypes.func.isRequired,
|
||||||
@@ -96,9 +96,6 @@ class AddWikiDialog extends React.Component {
|
|||||||
placeholder={gettext('Select a department')}
|
placeholder={gettext('Select a department')}
|
||||||
maxMenuHeight={200}
|
maxMenuHeight={200}
|
||||||
value={this.state.selectedOption}
|
value={this.state.selectedOption}
|
||||||
components={{ NoOptionsMessage: (
|
|
||||||
<div style={NoOptionsStyle}>{gettext('No department')}</div>
|
|
||||||
) }}
|
|
||||||
noOptionsMessage={() => {return gettext('No options available');}}
|
noOptionsMessage={() => {return gettext('No options available');}}
|
||||||
/>
|
/>
|
||||||
</>
|
</>
|
||||||
|
@@ -5,7 +5,7 @@ import { gettext, isPro } from '../../utils/constants';
|
|||||||
import wikiAPI from '../../utils/wiki-api';
|
import wikiAPI from '../../utils/wiki-api';
|
||||||
import { Utils } from '../../utils/utils';
|
import { Utils } from '../../utils/utils';
|
||||||
import toaster from '../toast';
|
import toaster from '../toast';
|
||||||
import { SeahubSelect, NoOptionsStyle } from '../common/select';
|
import { SeahubSelect } from '../common/select';
|
||||||
|
|
||||||
const propTypes = {
|
const propTypes = {
|
||||||
toggleCancel: PropTypes.func.isRequired,
|
toggleCancel: PropTypes.func.isRequired,
|
||||||
@@ -92,9 +92,6 @@ class ConvertWikiDialog extends React.Component {
|
|||||||
placeholder={gettext('Select a department')}
|
placeholder={gettext('Select a department')}
|
||||||
maxMenuHeight={200}
|
maxMenuHeight={200}
|
||||||
value={this.state.selectedOption}
|
value={this.state.selectedOption}
|
||||||
components={{ NoOptionsMessage: (
|
|
||||||
<div style={NoOptionsStyle}>{gettext('No department')}</div>
|
|
||||||
) }}
|
|
||||||
noOptionsMessage={() => {return gettext('No options available');}}
|
noOptionsMessage={() => {return gettext('No options available');}}
|
||||||
/>
|
/>
|
||||||
</>
|
</>
|
||||||
|
@@ -302,7 +302,7 @@ class LibSubFolderSetGroupPermissionDialog extends React.Component {
|
|||||||
placeholder={gettext('Select a group')}
|
placeholder={gettext('Select a group')}
|
||||||
maxMenuHeight={200}
|
maxMenuHeight={200}
|
||||||
value={this.state.selectedOption}
|
value={this.state.selectedOption}
|
||||||
components={{ NoOptionsMessage: NoGroupMessage }}
|
noOptionsMessage={NoGroupMessage}
|
||||||
/>
|
/>
|
||||||
</td>
|
</td>
|
||||||
{showPath &&
|
{showPath &&
|
||||||
|
@@ -353,7 +353,9 @@ class ShareToGroup extends React.Component {
|
|||||||
placeholder={gettext('Select groups')}
|
placeholder={gettext('Select groups')}
|
||||||
maxMenuHeight={200}
|
maxMenuHeight={200}
|
||||||
value={this.state.selectedOption}
|
value={this.state.selectedOption}
|
||||||
components={{ NoOptionsMessage: NoGroupMessage }}
|
noOptionsMessage={NoGroupMessage}
|
||||||
|
isSearchable={true}
|
||||||
|
isClearable={true}
|
||||||
/>
|
/>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td>
|
||||||
|
@@ -253,7 +253,7 @@ class SysAdminShareToGroup extends React.Component {
|
|||||||
placeholder={gettext('Select groups')}
|
placeholder={gettext('Select groups')}
|
||||||
maxMenuHeight={200}
|
maxMenuHeight={200}
|
||||||
value={this.state.selectedOption}
|
value={this.state.selectedOption}
|
||||||
components={{ NoOptionsMessage: NoGroupMessage }}
|
noOptionsMessage={NoGroupMessage}
|
||||||
/>
|
/>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td>
|
||||||
|
Reference in New Issue
Block a user