Skip to content

Commit

Permalink
Merge pull request #1631 from kobotoolbox/table-UI-fixes
Browse files Browse the repository at this point in the history 
Table UI fixes
  • Loading branch information
@jnm
jnm authored Mar 15, 2018
2 parents 0a7e09b + e0c9a8f commit 7a30668
Show file tree
Hide file tree
Showing 5 changed files with 70 additions and 29 deletions.
2 changes: 1 addition & 1 deletion jsapp/js/components/assetrow.es6
View file
Original file line number Diff line number Diff line change
Expand Up @@ -113,7 +113,7 @@ class AssetRow extends React.Component {

const userCanEdit = this.userCan('change_asset', this.props);

if (this.props.has_deployment && this.props.deployment__active &&
if (this.props.has_deployment && this.props.deployment__submission_count &&
this.userCan('view_submissions', this.props)) {
hrefTo = `/forms/${this.props.uid}/summary`;
}
Expand Down
4 changes: 4 additions & 0 deletions jsapp/js/components/reports.es6
View file
Original file line number Diff line number Diff line change
Expand Up @@ -910,6 +910,10 @@ class Reports extends React.Component {
this.setState({currentCustomReport: false});
}
toggleExpandedReports () {
if (this.state.showExpandedReport) {
// load asset again to restore header title and submission count after exiting expanded report
actions.resources.loadAsset({id: this.props.params.assetid});
}
stores.pageState.hideDrawerAndHeader(!this.state.showExpandedReport);
this.setState({
showExpandedReport: !this.state.showExpandedReport,
Expand Down
37 changes: 21 additions & 16 deletions jsapp/js/components/submission.es6
View file
Original file line number Diff line number Diff line change
Expand Up @@ -50,12 +50,13 @@ class Submission extends React.Component {
getSubmission(assetUid, sid) {
dataInterface.getSubmission(assetUid, sid).done((data) => {
var prev = -1, next = -1;
const survey = this.props.asset.content.survey;

dataInterface.getEnketoEditLink(assetUid, sid).done((data) => {
if (data.url)
this.setState({enketoEditLink: data.url});
});
if (this.props.asset.deployment__active) {
dataInterface.getEnketoEditLink(assetUid, sid).done((editData) => {
if (editData.url)
this.setState({enketoEditLink: editData.url});
});
}

if (this.props.ids && sid) {
const c = this.props.ids.findIndex(k => k==sid);
Expand All @@ -65,6 +66,7 @@ class Submission extends React.Component {
next = this.props.ids[c + 1];
}

const survey = this.props.asset.content.survey;
const betaQuestions = ['begin_kobomatrix'];
const hasBetaQuestion = survey.find(q => betaQuestions.includes(q.type)) || false;

Expand All @@ -87,7 +89,8 @@ class Submission extends React.Component {

componentWillReceiveProps(nextProps) {
this.setState({
sid: nextProps.sid
sid: nextProps.sid,
promptRefresh: false
});

this.getSubmission(nextProps.asset.uid, nextProps.sid);
Expand Down Expand Up @@ -342,16 +345,18 @@ class Submission extends React.Component {
</div>
}

<bem.FormModal__group m='validation-status'>
<label>{t('Validation status')}</label>
<Select
disabled={!this.userCan('validate_submissions', this.props.asset)}
clearable={false}
value={s._validation_status ? s._validation_status.uid : ''}
options={VALIDATION_STATUSES}
onChange={this.validationStatusChange}>
</Select>
</bem.FormModal__group>
{this.props.asset.deployment__active &&
<bem.FormModal__group m='validation-status'>
<label>{t('Validation status')}</label>
<Select
disabled={!this.userCan('validate_submissions', this.props.asset)}
clearable={false}
value={s._validation_status ? s._validation_status.uid : ''}
options={VALIDATION_STATUSES}
onChange={this.validationStatusChange}>
</Select>
</bem.FormModal__group>
}
<bem.FormModal__group>
<div className="submission-pager">
{this.state.previous > -1 &&
Expand Down
54 changes: 43 additions & 11 deletions jsapp/js/components/table.es6
View file
Original file line number Diff line number Diff line change
Expand Up @@ -216,19 +216,21 @@ export class DataTable extends React.Component {
return false;

var q = undefined;
var groupQ = [];
if (key.includes('/')) {
groupQ = key.split('/');
q = survey.find(o => o.name === groupQ[1] || o.$autoname == groupQ[1]);
var qParentG = [];
if (key.includes('/') && key !== 'meta/instanceID') {
qParentG = key.split('/');
q = survey.find(o => o.name === qParentG[qParentG.length - 1] || o.$autoname == qParentG[qParentG.length - 1]);
} else {
q = survey.find(o => o.name === key || o.$autoname == key);
}

if (q && q.type === 'begin_repeat')
return false;

var index = key;
// sets location of columns for questions not in current survey version
var index = 'y_' + key;

// place meta question columns at the very end
switch(key) {
case 'username':
index = 'z1';
Expand All @@ -249,6 +251,7 @@ export class DataTable extends React.Component {
index = 'z6';
break;
case '__version__':
case '_version_':
index = 'z7';
break;
case '_id':
Expand All @@ -261,21 +264,45 @@ export class DataTable extends React.Component {
index = 'z91';
break;
default:
// set index for questions in current version of survey (including questions in groups)
survey.map(function(x, i) {
if (x.name === key || x.$autoname === key) {
index = 'f' + i.toString();
var k = key;
if (key.includes('/')) {
var kArray = k.split('/');
k = kArray[kArray.length - 1];
}
if (x.name === k || x.$autoname === k) {
index = i.toString();
}
});
}

columns.push({
Header: h => {
var lbl = key.includes('/') ? key.split('/')[1] : key;
var lbl = key;

if (key.includes('/')) {
var splitK = key.split('/');
lbl = splitK[splitK.length - 1];
}
if (q && q.label && showLabels)
lbl = q.label[0];
// show Groups in labels, when selected
if (showGroups && groupQ && key.includes('/') && key !== 'meta/instanceID')
lbl = `${groupQ[0]} / ${lbl}`;
if (showGroups && qParentG && key.includes('/')) {
var gLabels = qParentG.join(' / ');

if (showLabels) {
var gT = qParentG.map(function(g) {
var x = survey.find(o => o.name === g || o.$autoname == g);
if (x && x.label && x.label[0])
return x.label[0];

return '';
});
gLabels = gT.join(' / ');
}
return gLabels;
}

return lbl;
},
Expand Down Expand Up @@ -313,7 +340,7 @@ export class DataTable extends React.Component {
});

columns.sort(function(a, b) {
return a.index.localeCompare(b.index);
return a.index.localeCompare(b.index, 'en', {numeric: true});
})

columns.forEach(function(col, ind) {
Expand Down Expand Up @@ -349,6 +376,11 @@ export class DataTable extends React.Component {
})
}
toggleExpandedTable () {
if (this.state.showExpandedTable) {
// load asset again to restore header title and submission count after exiting expanded report
actions.resources.loadAsset({id: this.props.asset.uid});
}

stores.pageState.hideDrawerAndHeader(!this.state.showExpandedTable);
this.setState({
showExpandedTable: !this.state.showExpandedTable,
Expand Down
2 changes: 1 addition & 1 deletion jsapp/js/lists/sidebarForms.es6
View file
Original file line number Diff line number Diff line change
Expand Up @@ -47,7 +47,7 @@ class SidebarFormsList extends Reflux.Component {
renderMiniAssetRow (asset) {
var href = `/forms/${asset.uid}`;

if (this.userCan('view_submissions', asset) && asset.has_deployment && asset.deployment__active)
if (this.userCan('view_submissions', asset) && asset.has_deployment && asset.deployment__submission_count)
href = href + '/summary';

return (
Expand Down

0 comments on commit 7a30668

Please sign in to comment.