yujunjun/strapi
1
0
Fork 0
mirror of https://github.com/strapi/strapi.git synced 2025-09-25 16:29:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add actions to filterpicker

Browse Source
This commit is contained in:
soupette 2018-05-21 17:16:04 +02:00
parent e9ce813474
commit 7260bbe309
10 changed files with 114 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
packages/strapi-plugin-content-manager/admin/src/components/FilterOptions/Div.js
View File

@ -2,6 +2,7 @@ import styled from 'styled-components';
const Div = styled.div`
display: flex;
margin-bottom: 6px;
`;
export default Div;

2
packages/strapi-plugin-content-manager/admin/src/components/FilterOptions/index.js
View File

@ -37,7 +37,7 @@ const getInputType = (attrType) => {
}
};
const defaultInputStyle = { height: '30px', width: '200px', marginRight: '10px' };
const defaultInputStyle = { height: '30px', width: '200px', marginRight: '10px', paddingTop: '9px' };
function FilterOptions({ filter, index, onChange, onClickAdd, onClickRemove, schema, showAddButton }) {
const selectStyle = { minHeight: '30px', minWidth: '170px', maxWidth: '200px' };

83
packages/strapi-plugin-content-manager/admin/src/components/FiltersPickWrapper/index.js
View File

@ -38,6 +38,28 @@ class FiltersPickWrapper extends React.PureComponent {
}
}
generateActions = () => ([
{
label: 'content-manager.components.FiltersPickWrapper.PluginHeader.actions.clearAll',
kind: 'secondary',
onClick: () => {
return new Promise(resolve => {
this.props.close();
setTimeout(() => {
this.props.removeAllFilters();
resolve();
}, 600);
});
},
},
{
label: 'content-manager.components.FiltersPickWrapper.PluginHeader.actions.apply',
kind: 'primary',
type: 'submit',
onClick: this.props.onSubmit,
},
]);
handleChange = ({ target }) => {
const split = target.name.split('.');
this.props.onChange(split[0], split[1], target.value);
@ -57,6 +79,7 @@ class FiltersPickWrapper extends React.PureComponent {
return new Promise(resolve => {
setTimeout(() => {
this.props.removeFilter(index);
this.props.onSubmit();
resolve();
}, 600);
});
@ -85,54 +108,56 @@ class FiltersPickWrapper extends React.PureComponent {
);
render() {
const { actions, appliedFilters, schema, show } = this.props;
const { appliedFilters, schema, show } = this.props;
return (
<SlideDown on={show}>
<Div>
<div>
<PluginHeader
actions={actions}
description={{
id: 'content-manager.components.FiltersPickWrapper.PluginHeader.description',
}}
title={this.renderTitle()}
/>
<div style={{ marginTop: '-10px' }}>
{appliedFilters.map((filter, key) => (
<FilterOptions
key={key}
filter={filter}
index={key}
onChange={this.handleChange}
onClickAdd={this.handleClickAdd}
onClickRemove={this.handleClickRemove}
schema={schema}
showAddButton={this.shouldDisplayAddButton(key)}
/>
))}
<form onSubmit={this.handleSubmit}>
<SlideDown on={show}>
<Div>
<div>
<PluginHeader
actions={this.generateActions()}
description={{
id: 'content-manager.components.FiltersPickWrapper.PluginHeader.description',
}}
title={this.renderTitle()}
/>
<div style={{ marginTop: '-13px' }}>
{appliedFilters.map((filter, key) => (
<FilterOptions
key={key}
filter={filter}
index={key}
onChange={this.handleChange}
onClickAdd={this.handleClickAdd}
onClickRemove={this.handleClickRemove}
schema={schema}
showAddButton={this.shouldDisplayAddButton(key)}
/>
))}
</div>
</div>
</div>
</Div>
</SlideDown>
</Div>
</SlideDown>
</form>
);
}
}
FiltersPickWrapper.defaultProps = {
actions: [],
appliedFilters: [],
modelName: '',
schema: {},
};
FiltersPickWrapper.propTypes = {
actions: PropTypes.array,
addFilter: PropTypes.func.isRequired,
appliedFilters: PropTypes.array,
close: PropTypes.func.isRequired,
modelName: PropTypes.string,
onChange: PropTypes.func.isRequired,
onSubmit: PropTypes.func.isRequired,
removeAllFilters: PropTypes.func.isRequired,
removeFilter: PropTypes.func.isRequired,
schema: PropTypes.object,
show: PropTypes.bool.isRequired,

14
packages/strapi-plugin-content-manager/admin/src/containers/ListPage/actions.js
View File

@ -13,8 +13,10 @@ import {
GET_DATA_SUCCEEDED,
ON_CHANGE,
ON_TOGGLE_FILTERS,
REMOVE_ALL_FILTERS,
REMOVE_FILTER,
SET_PARAMS,
SUBMIT,
} from './constants';
export function addFilter(filter) {
@ -78,6 +80,12 @@ export function onToggleFilters() {
};
}
export function removeAllFilters() {
return {
type: REMOVE_ALL_FILTERS,
};
}
export function removeFilter(index) {
return {
type: REMOVE_FILTER,
@ -91,3 +99,9 @@ export function setParams(params) {
params,
};
}
export function submit() {
return {
type: SUBMIT,
};
}

2
packages/strapi-plugin-content-manager/admin/src/containers/ListPage/constants.js
View File

@ -13,5 +13,7 @@ export const GET_DATA = 'ContentManager/ListPage/GET_DATA';
export const GET_DATA_SUCCEEDED = 'ContentManager/ListPage/GET_DATA_SUCCEEDED';
export const ON_CHANGE = 'ContentManager/ListPage/ON_CHANGE';
export const ON_TOGGLE_FILTERS = 'ContentManager/ListPage/ON_TOGGLE_FILTERS';
export const REMOVE_ALL_FILTERS = 'ContentManager/ListPage/REMOVE_ALL_FILTERS';
export const REMOVE_FILTER = 'ContentManager/ListPage/REMOVE_FILTER';
export const SET_PARAMS = 'ContentManager/ListPage/SET_PARAMS';
export const SUBMIT = 'ContentManager/ListPage/SUBMIT';

19
packages/strapi-plugin-content-manager/admin/src/containers/ListPage/index.js
View File

@ -41,8 +41,10 @@ import {
getData,
onChange,
onToggleFilters,
removeAllFilters,
removeFilter,
setParams,
submit,
} from './actions';
import reducer from './reducer';
@ -248,6 +250,16 @@ export class ListPage extends React.Component {
this.setState({ showWarning: false });
};
handleSubmit = e => {
try {
e.preventDefault();
} catch(err) {
// Silent
} finally {
this.props.submit();
}
}
toggleModalWarning = e => {
if (!isUndefined(e)) {
e.preventDefault();
@ -267,6 +279,7 @@ export class ListPage extends React.Component {
listPage: { appliedFilters, params, showFilter },
onChange,
onToggleFilters,
removeAllFilters,
removeFilter,
} = this.props;
const pluginHeaderActions = [
@ -294,6 +307,8 @@ export class ListPage extends React.Component {
close={onToggleFilters}
modelName={this.getCurrentModelName()}
onChange={onChange}
onSubmit={this.handleSubmit}
removeAllFilters={removeAllFilters}
removeFilter={removeFilter}
schema={this.getCurrentSchema()}
show={showFilter}
@ -377,9 +392,11 @@ ListPage.propTypes = {
models: PropTypes.object.isRequired,
onChange: PropTypes.func.isRequired,
onToggleFilters: PropTypes.func.isRequired,
removeAllFilters: PropTypes.func.isRequired,
removeFilter: PropTypes.func.isRequired,
schema: PropTypes.object.isRequired,
setParams: PropTypes.func.isRequired,
submit: PropTypes.func.isRequired,
};
function mapDispatchToProps(dispatch) {
@ -391,8 +408,10 @@ function mapDispatchToProps(dispatch) {
getData,
onChange,
onToggleFilters,
removeAllFilters,
removeFilter,
setParams,
submit,
},
dispatch,
);

13
packages/strapi-plugin-content-manager/admin/src/containers/ListPage/reducer.js
View File

@ -14,13 +14,16 @@ import {
GET_DATA_SUCCEEDED,
ON_CHANGE,
ON_TOGGLE_FILTERS,
REMOVE_ALL_FILTERS,
REMOVE_FILTER,
SET_PARAMS,
SUBMIT,
} from './constants';
const initialState = fromJS({
count: 0,
appliedFilters: List([]),
count: 0,
filters: List([]),
params: Map({
_limit: 10,
_page: 1,
@ -56,10 +59,18 @@ function listPageReducer(state = initialState, action) {
return state.updateIn(['appliedFilters', action.index, action.key], () => action.value);
case ON_TOGGLE_FILTERS:
return state.update('showFilter', v => !v);
case REMOVE_ALL_FILTERS:
return state
.update('appliedFilters', () => List([]))
.update('filters', () => List([]));
case REMOVE_FILTER:
return state.update('appliedFilters', list => list.splice(action.index, 1));
case SET_PARAMS:
return state.update('params', () => Map(action.params));
case SUBMIT:
return state
.update('filters', () => state.get('appliedFilters'))
.update('showFilter', () => false);
default:
return state;
}

2
packages/strapi-plugin-content-manager/admin/src/translations/en.json
View File

@ -17,6 +17,8 @@
"components.AddFilterCTA.add": "Add filter",
"components.FilterOptions.button.apply": "Apply",
"components.FiltersPickWrapper.PluginHeader.actions.apply": "Apply",
"components.FiltersPickWrapper.PluginHeader.actions.clearAll": "Clear all",
"components.FiltersPickWrapper.PluginHeader.description": "Set the conditions to apply to filter the entries",
"components.FiltersPickWrapper.PluginHeader.title.filter": "Filters",

2
packages/strapi-plugin-content-manager/admin/src/translations/fr.json
View File

@ -18,6 +18,8 @@
"components.AddFilterCTA.add": "Ajouter un filtre",
"components.FilterOptions.button.apply": "Appliquer",
"components.FiltersPickWrapper.PluginHeader.actions.apply": "Appliquer",
"components.FiltersPickWrapper.PluginHeader.actions.clearAll": "Tout supprimer",
"components.FiltersPickWrapper.PluginHeader.description": "Définissez les conditions des filtres à appliquer",
"components.FiltersPickWrapper.PluginHeader.title.filter": "Filtres",

7
packages/strapi-plugin-content-manager/config/layout.json
View File

@ -8,5 +8,12 @@
"appearance": ""
}
}
},
"fevzilyaguk": {
"attributes": {
"razeiugeryeizla": {
"appearance": ""
}
}
}
}