mirror of
https://github.com/strapi/strapi.git
synced 2025-12-26 22:54:31 +00:00
Handle select unique
This commit is contained in:
parent
84d5d047eb
commit
47b1b7e456
@ -12,6 +12,7 @@ import styles from './styles.scss';
|
||||
class CustomInputCheckbox extends React.Component {
|
||||
render() {
|
||||
const { isAll, name, onChange, value } = this.props;
|
||||
|
||||
return (
|
||||
<span className={cn('form-check', styles.customSpan)}>
|
||||
<label
|
||||
|
||||
@ -26,6 +26,7 @@ class Table extends React.Component {
|
||||
) :
|
||||
this.props.records.map((record, key) => (
|
||||
<TableRow
|
||||
onChange={this.props.onClickSelect}
|
||||
key={key}
|
||||
destination={`${this.props.route.path.replace(':slug', this.props.routeParams.slug)}/${record[this.props.primaryKey]}`}
|
||||
headers={this.props.headers}
|
||||
@ -34,6 +35,7 @@ class Table extends React.Component {
|
||||
primaryKey={this.props.primaryKey}
|
||||
onDelete={this.props.handleDelete}
|
||||
redirectUrl={this.props.redirectUrl}
|
||||
value={this.props.entriesToDelete.indexOf(record.id) !== -1}
|
||||
/>
|
||||
));
|
||||
const entriesToDeleteNumber = this.props.entriesToDelete.length;
|
||||
@ -49,7 +51,7 @@ class Table extends React.Component {
|
||||
primaryKey={this.props.primaryKey}
|
||||
/>
|
||||
<tbody>
|
||||
{ entriesToDeleteNumber > 1 && (
|
||||
{ entriesToDeleteNumber > 0 && (
|
||||
<TableDelete
|
||||
colspan={this.props.headers.length + 1}
|
||||
number={entriesToDeleteNumber}
|
||||
@ -79,6 +81,7 @@ Table.propTypes = {
|
||||
headers: PropTypes.array.isRequired,
|
||||
history: PropTypes.object.isRequired,
|
||||
onChangeSort: PropTypes.func.isRequired,
|
||||
onClickSelect: PropTypes.func.isRequired,
|
||||
onClickSelectAll: PropTypes.func.isRequired,
|
||||
primaryKey: PropTypes.string.isRequired,
|
||||
records: PropTypes.oneOfType([
|
||||
|
||||
@ -97,7 +97,11 @@ class TableRow extends React.Component {
|
||||
|
||||
renderDelete = () => (
|
||||
<td onClick={(e) => e.stopPropagation()} key="i">
|
||||
<CustomInputCheckbox name={this.props.record.id} />
|
||||
<CustomInputCheckbox
|
||||
name={this.props.record.id}
|
||||
onChange={this.props.onChange}
|
||||
value={this.props.value}
|
||||
/>
|
||||
</td>
|
||||
);
|
||||
|
||||
@ -114,12 +118,18 @@ TableRow.contextTypes = {
|
||||
router: PropTypes.object.isRequired,
|
||||
};
|
||||
|
||||
TableRow.defaultProps = {
|
||||
value: false,
|
||||
};
|
||||
|
||||
TableRow.propTypes = {
|
||||
destination: PropTypes.string.isRequired,
|
||||
headers: PropTypes.array.isRequired,
|
||||
onChange: PropTypes.func.isRequired,
|
||||
onDelete: PropTypes.func,
|
||||
record: PropTypes.object.isRequired,
|
||||
redirectUrl: PropTypes.string.isRequired,
|
||||
value: PropTypes.bool,
|
||||
};
|
||||
|
||||
TableRow.defaultProps = {
|
||||
|
||||
@ -13,6 +13,7 @@ import {
|
||||
GET_DATA_SUCCEEDED,
|
||||
ON_CHANGE,
|
||||
ON_CLICK_REMOVE,
|
||||
ON_CLICK_SELECT,
|
||||
ON_CLICK_SELECT_ALL,
|
||||
ON_TOGGLE_FILTERS,
|
||||
OPEN_FILTERS_WITH_SELECTION,
|
||||
@ -84,6 +85,13 @@ export function onClickRemove(index) {
|
||||
};
|
||||
}
|
||||
|
||||
export function onClickSelect({ target }) {
|
||||
return {
|
||||
type: ON_CLICK_SELECT,
|
||||
id: target.name,
|
||||
};
|
||||
}
|
||||
|
||||
export function onClickSelectAll() {
|
||||
return {
|
||||
type: ON_CLICK_SELECT_ALL,
|
||||
|
||||
@ -13,6 +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_CLICK_REMOVE = 'ContentManager/ListPage/ON_CLICK_REMOVE';
|
||||
export const ON_CLICK_SELECT = 'ContentManager/ListPage/ON_CLICK_SELECT';
|
||||
export const ON_CLICK_SELECT_ALL = 'ContentManager/ListPage/ON_CLICK_SELECT_ALL';
|
||||
export const ON_TOGGLE_FILTERS = 'ContentManager/ListPage/ON_TOGGLE_FILTERS';
|
||||
export const OPEN_FILTERS_WITH_SELECTION = 'ContentManager/ListPage/OPEN_FILTERS_WITH_SELECTION';
|
||||
|
||||
@ -42,6 +42,7 @@ import {
|
||||
getData,
|
||||
onChange,
|
||||
onClickRemove,
|
||||
onClickSelect,
|
||||
onClickSelectAll,
|
||||
onToggleFilters,
|
||||
openFiltersWithSelections,
|
||||
@ -294,6 +295,7 @@ export class ListPage extends React.Component {
|
||||
listPage: { appliedFilters, entriesToDelete, filters, filterToFocus, params, showFilter },
|
||||
onChange,
|
||||
onClickRemove,
|
||||
onClickSelect,
|
||||
onClickSelectAll,
|
||||
onToggleFilters,
|
||||
openFiltersWithSelections,
|
||||
@ -372,6 +374,7 @@ export class ListPage extends React.Component {
|
||||
<div className="col-md-12">
|
||||
<Table
|
||||
onClickSelectAll={onClickSelectAll}
|
||||
onClickSelect={onClickSelect}
|
||||
deleteAllValue={this.areAllEntriesSelected()}
|
||||
records={listPage.records}
|
||||
route={this.props.match}
|
||||
@ -425,6 +428,7 @@ ListPage.propTypes = {
|
||||
models: PropTypes.object.isRequired,
|
||||
onChange: PropTypes.func.isRequired,
|
||||
onClickRemove: PropTypes.func.isRequired,
|
||||
onClickSelect: PropTypes.func.isRequired,
|
||||
onClickSelectAll: PropTypes.func.isRequired,
|
||||
onToggleFilters: PropTypes.func.isRequired,
|
||||
openFiltersWithSelections: PropTypes.func.isRequired,
|
||||
@ -444,6 +448,7 @@ function mapDispatchToProps(dispatch) {
|
||||
getData,
|
||||
onChange,
|
||||
onClickRemove,
|
||||
onClickSelect,
|
||||
onClickSelectAll,
|
||||
onToggleFilters,
|
||||
openFiltersWithSelections,
|
||||
|
||||
@ -14,6 +14,7 @@ import {
|
||||
GET_DATA_SUCCEEDED,
|
||||
ON_CHANGE,
|
||||
ON_CLICK_REMOVE,
|
||||
ON_CLICK_SELECT,
|
||||
ON_CLICK_SELECT_ALL,
|
||||
ON_TOGGLE_FILTERS,
|
||||
OPEN_FILTERS_WITH_SELECTION,
|
||||
@ -68,6 +69,16 @@ function listPageReducer(state = initialState, action) {
|
||||
.update('appliedFilters', list => list.splice(action.index, 1))
|
||||
.update('filters', list => list.splice(action.index, 1))
|
||||
.update('filtersUpdated', v => v = !v);
|
||||
case ON_CLICK_SELECT:
|
||||
return state.update('entriesToDelete', list => {
|
||||
const index = state.get('entriesToDelete').indexOf(action.id);
|
||||
|
||||
if (index !== -1) {
|
||||
return list.splice(index, 1);
|
||||
}
|
||||
|
||||
return list.concat(action.id);
|
||||
});
|
||||
case ON_CLICK_SELECT_ALL:
|
||||
return state.update('entriesToDelete', () => {
|
||||
if (state.get('entriesToDelete').size === 0) {
|
||||
@ -75,7 +86,7 @@ function listPageReducer(state = initialState, action) {
|
||||
.get('records')
|
||||
.reduce((acc, current) => acc.concat(List([current.id])), List([]));
|
||||
}
|
||||
|
||||
|
||||
return List([]);
|
||||
});
|
||||
case ON_TOGGLE_FILTERS:
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user