add select all functionality for edition list table

This commit is contained in:
Tim Daubenschütz 2015-06-04 10:11:18 +02:00
parent ef6662e859
commit 4fe5766bc4
5 changed files with 56 additions and 3 deletions

View File

@ -7,6 +7,7 @@ import PieceListActions from '../../actions/piece_list_actions';
import AccordionListItemTable from './accordion_list_item_table';
import AccordionListItemTableToggle from './accordion_list_item_table_toggle';
import AccordionListItemTableSelectAllEditionsToggle from './accordion_list_item_table_select_all_editions_toggle';
import TableColumnContentModel from '../../models/table_column_content_model';
@ -46,6 +47,19 @@ let AccordionListItemTableEditions = React.createClass({
EditionListActions.selectEdition({pieceId, editionId});
},
selectAllItems() {
this.state.editionList[this.props.parentId]
.forEach((edition) => {
this.selectItem(this.props.parentId, edition.id);
});
},
filterSelectedEditions() {
let selectedEditions = this.state.editionList[this.props.parentId]
.filter((edition) => edition.selected);
return selectedEditions;
},
toggleTable() {
PieceListActions.showEditionList(this.props.parentId);
EditionListActions.fetchEditionList(this.props.parentId, this.state.orderBy, this.state.orderAsc);
@ -56,6 +70,17 @@ let AccordionListItemTableEditions = React.createClass({
},
render() {
let selectedEditionsCount = 0;
let allEditionsCount = 0;
// here we need to check if all editions of a specific
// piece are already defined. Otherwise .length will throw an error and we'll not
// be notified about it.
if(this.state.editionList[this.props.parentId]) {
selectedEditionsCount = this.filterSelectedEditions().length;
allEditionsCount = this.state.editionList[this.props.parentId].length;
}
let columnList = [
new TableColumnContentModel(
(item) => {
@ -66,7 +91,10 @@ let AccordionListItemTableEditions = React.createClass({
'selected': item.selected
}},
'',
'',
<AccordionListItemTableSelectAllEditionsToggle
onChange={this.selectAllItems}
numOfSelectedEditions={selectedEditionsCount}
numOfAllEditions={allEditionsCount}/>,
TableItemCheckbox,
1,
false

View File

@ -0,0 +1,21 @@
import React from 'react';
let AccordionListItemTableSelectAllEditionsToggle = React.createClass({
propTypes: {
onChange: React.PropTypes.func.isRequired,
numOfSelectedEditions: React.PropTypes.number.isRequired,
numOfAllEditions: React.PropTypes.number.isRequired
},
render() {
return (
<input type="checkbox"
onChange={this.props.onChange}
checked={this.props.numOfAllEditions === this.props.numOfSelectedEditions} />
);
}
});
export default AccordionListItemTableSelectAllEditionsToggle;

View File

@ -6,7 +6,10 @@ let TableHeaderItem = React.createClass({
propTypes: {
columnClasses: React.PropTypes.string.isRequired,
displayName: React.PropTypes.string.isRequired,
displayName: React.PropTypes.oneOfType([
React.PropTypes.string,
React.PropTypes.element
]).isRequired,
columnName: React.PropTypes.string.isRequired,
canBeOrdered: React.PropTypes.bool,
changeOrder: React.PropTypes.func,

View File

@ -35,6 +35,7 @@ class PieceListStore {
}
}
});
console.log(this.pieceList, pieceId);
}
onUpdatePieceList({ page, pageSize, search, pieceList, orderBy, orderAsc, pieceListCount }) {

View File

@ -11,7 +11,7 @@ import { formatText } from './general_utils';
export function getLangText(s, ...args) {
let lang = navigator.language || navigator.userLanguage;
// this is just for testing, as changing the navigator.language wasn't possible
lang = 'de';
//lang = 'de';
try {
if(lang in languages) {
return formatText(languages[lang][s], args);