Skip to content

Commit

Permalink
Use datatable to manage advanced search result (Nitrate#746)
Browse files Browse the repository at this point in the history 
Signed-off-by: Chenxiong Qi <qcxhome@gmail.com>
  • Loading branch information
@tkdchen
tkdchen committed Aug 22, 2020
1 parent 9c3380d commit bfcc83f
Show file tree
Hide file tree
Showing 15 changed files with 452 additions and 371 deletions.
28 changes: 28 additions & 0 deletions src/static/js/tcms_actions.js
View file
Expand Up @@ -1030,3 +1030,31 @@ function confirmDialog(options) {
});
}

Nitrate.DataTable = {
commonSettings: {
bFilter: false,
bInfo: true,
bLengthChange: false,
bServerSide: true,
iDisplayLength: 20,
sPaginationType: 'full_numbers',
aLengthMenu: [[10, 20, 50, -1], [10, 20, 50, 'All']],
bProcessing: true,

fnInitComplete: function (oSettings, json) {
if (oSettings.aoData.length > 1) {
return;
}
// If table is empty or only has a single row, ensure sortable columns
// are set to unsortable in order to avoid potential unnecessary HTTP
// request made by clicking header by user.
let columns = oSettings.aoColumns;
for (let i = 0; i < columns.length; i++) {
let column = columns[i];
if (column.bSortable) {
column.bSortable = false;
}
}
},
}
};
104 changes: 78 additions & 26 deletions src/static/js/testcase_actions.js
View file
@@ -1,23 +1,82 @@
Nitrate.TestCases = {};
Nitrate.TestCases.List = {};
Nitrate.TestCases.AdvanceList = {};
Nitrate.TestCases.AdvancedSearch = {};
Nitrate.TestCases.Details = {};
Nitrate.TestCases.Create = {};
Nitrate.TestCases.Edit = {};
Nitrate.TestCases.Clone = {};

Nitrate.TestCases.AdvanceList.on_load = function () {
jQ('#testcases_table :checkbox').on('change', function () {
jQ('#case_advance_printable').prop(
'disabled', jQ('#testcases_table tbody :checkbox:checked').length === 0
);
});
Nitrate.TestCases.SearchResultTableSettings = Object.assign({}, Nitrate.DataTable.commonSettings, {

// By default, cases are sorted by create_date in desc order.
// It is equal to set the pk column in the DataTable initialization.
aaSorting: [[ 2, 'desc' ]],

oLanguage: {
sEmptyTable: 'No cases found.'
},

aoColumns: [
{'bSortable': false, 'sClass': 'expandable'}, // the expand/collapse control
{'bSortable': false}, // case selector checkbox
null, // ID
{'sClass': 'expandable'}, // Summary
null, // Author
null, // Default tester
null, // Automated
null, // Status
null, // Category
null, // Priority
null, // Created on
],

fnDrawCallback: function () {
// Add the ajax_loading row to show case details
this.fnGetNodes().forEach(function (tr) {
let caseId = jQ(tr).data('pk');
jQ(tr).after(jQ(
'<tr class="case_content hide" style="display: none;">' +
'<td colspan="' + tr.children.length + '">' +
'<div id="id_loading_' + caseId + '" class="ajax_loading"></div>' +
'</td>' +
'</tr>'
));
});

jQ('#testcases_table tbody tr td:nth-child(2)').shiftcheckbox({
checkboxSelector: ':checkbox',
selectAll: '#testcases_table .js-select-all'
});
jQ('#testcases_table tbody tr td:nth-child(1)').shiftcheckbox({
checkboxSelector: ':checkbox',
selectAll: '#testcases_table .js-select-all'
});

jQ('#testcases_table :checkbox').on('change', function () {
let disable = jQ('#testcases_table tbody :checkbox:checked').length === 0;
jQ('.js-printable-cases').prop('disabled', disable);
jQ('.js-clone-cases').prop('disabled', disable);
jQ('.js-export-cases').prop('disabled', disable);
});

jQ('.expandable').on('click', function () {
let c = jQ(this).parent()[0]; // Container
let cContainer = jQ(c).next()[0]; // Content Containers
let caseId = jQ(c).find('input[name="case"]')[0].value;

toggleTestCasePane({
case_id: caseId,
casePaneContainer: jQ(cContainer)
});
toggleExpandArrow({
caseRowContainer: jQ(c),
expandPaneContainer: jQ(cContainer)
});
});
},

fnInfoCallback: function (oSettings, iStart, iEnd, iMax, iTotal, sPre) {
return 'Showing ' + (iEnd - iStart + 1) + ' of ' + iTotal + ' cases';
}
});

Nitrate.TestCases.AdvancedSearch.on_load = function () {
jQ('#id_blind_all_link').on('click', function () {
if (!jQ('div[id^="id_loading_"]').length) {
jQ(this).removeClass('locked');
Expand All @@ -38,21 +97,6 @@ Nitrate.TestCases.AdvanceList.on_load = function () {
}
});

jQ('.expandable').on('click', function () {
let c = jQ(this).parent()[0]; // Container
let cContainer = jQ(c).next()[0]; // Content Containers
let caseId = jQ(c).find('input[name="case"]')[0].value;

toggleTestCasePane({
case_id: caseId,
casePaneContainer: jQ(cContainer)
});
toggleExpandArrow({
caseRowContainer: jQ(c),
expandPaneContainer: jQ(cContainer)
});
});

if (window.location.hash === '#expandall') {
blinddownAllCases();
}
Expand All @@ -64,6 +108,14 @@ Nitrate.TestCases.AdvanceList.on_load = function () {
jQ('#export_selected_cases').on('click', function () {
postToURL(listParams.case_export, Nitrate.Utils.formSerialize(this.form));
});

// TODO: initialize datatable
jQ('#testcases_table').dataTable(
Object.assign({}, Nitrate.TestCases.SearchResultTableSettings, {
iDeferLoading: Nitrate.TestCases.AdvancedSearch.numberOfCases,
sAjaxSource: '/advance-search/' + this.window.location.search,
})
);
};

Nitrate.TestCases.List.on_load = function () {
Expand Down
130 changes: 55 additions & 75 deletions src/static/js/testplan_actions.js
View file
@@ -1,7 +1,7 @@
Nitrate.TestPlans = {};
Nitrate.TestPlans.Create = {};
Nitrate.TestPlans.List = {};
Nitrate.TestPlans.Advance_Search_List = {};
Nitrate.TestPlans.AdvancedSearch = {};
Nitrate.TestPlans.Details = {};
Nitrate.TestPlans.Edit = {};
Nitrate.TestPlans.SearchCase = {};
Expand Down Expand Up @@ -551,7 +551,7 @@ function bindSearchResultActionEventHandlers() {
});
}

Nitrate.TestPlans.Advance_Search_List.on_load = function () {
Nitrate.TestPlans.AdvancedSearch.on_load = function () {
jQ('#testplans_table :checkbox').on('change', function () {
let disable = jQ('#testplans_table tbody :checkbox:checked').length === 0;
jQ('.js-printable-plans').prop('disabled', disable);
Expand All @@ -565,18 +565,58 @@ Nitrate.TestPlans.Advance_Search_List.on_load = function () {
});

bindSearchResultActionEventHandlers();

jQ('#testplans_table').dataTable(
Object.assign({}, Nitrate.TestPlans.SearchResultTableSettings, {
iDeferLoading: Nitrate.TestPlans.AdvancedSearch.numberOfPlans,
sAjaxSource: '/advance-search/' + this.window.location.search,
})
);
};

Nitrate.DataTable = {
'commonSettings': {
'bFilter': false,
'bInfo': true,
'bLengthChange': false,
'bServerSide': true,
'iDisplayLength': 20,
'sPaginationType': 'full_numbers'
Nitrate.TestPlans.SearchResultTableSettings = Object.assign({}, Nitrate.DataTable.commonSettings, {

// By default, plans are sorted by create_date in desc order.
// It is equal to set the pk column in the DataTable initialization.
aaSorting: [[ 1, 'desc' ]],

oLanguage: {
sEmptyTable: 'No plans found.'
},

aoColumns: [
{'bSortable': false}, // Selector checkbox
null, // ID
{'sType': 'html'}, // Name
{'sType': 'html'}, // Author
{'sType': 'html'}, // Owner
null, // Product
{'bVisible': false}, // Invisible product version
null, // Type
null, // Cases
null, // Runs
{'bSortable': false} // Actions
],

fnDrawCallback: function () {
jQ('#testplans_table tbody tr td:nth-child(1)').shiftcheckbox({
checkboxSelector: ':checkbox',
selectAll: '#testplans_table .js-select-all'
});

jQ('#testplans_table :checkbox').on('change', function () {
let disable = jQ('#testplans_table tbody :checkbox:checked').length === 0;
jQ('.js-printable-plans').prop('disabled', disable);
jQ('.js-clone-plans').prop('disabled', disable);
jQ('.js-export-plans').prop('disabled', disable);
});
},

fnInfoCallback: function (oSettings, iStart, iEnd, iMax, iTotal, sPre) {
return 'Showing ' + (iEnd - iStart + 1) + ' of ' + iTotal + ' plans';
}
};

});

Nitrate.TestPlans.List.on_load = function () {
registerProductAssociatedObjectUpdaters(
Expand All @@ -597,71 +637,11 @@ Nitrate.TestPlans.List.on_load = function () {
});
}

let plansSearchResultTableSettings = {
// By default, plans are sorted by create_date in desc order.
// It is equal to set the pk column in the DataTable initialization.
'aaSorting': [[ 1, 'desc' ]],
'aLengthMenu': [[10, 20, 50, -1], [10, 20, 50, 'All']],
'bProcessing': true,
'iDeferLoading': Nitrate.TestPlans.List.numberOfPlans,
'sAjaxSource': '/plans/pages/' + this.window.location.search,

'oLanguage': {
'sEmptyTable': 'No plans found.'
},

'aoColumns': [
{'bSortable': false},
null,
{'sType': 'html'},
{'sType': 'html'},
{'sType': 'html'},
null,
{'bVisible': false},
null,
null,
null,
{'bSortable': false}
],

'fnInfoCallback': function (oSettings, iStart, iEnd, iMax, iTotal, sPre) {
return 'Showing ' + (iEnd - iStart + 1) + ' of ' + iTotal + ' plans';
},

// Move this callback to commonSettings when needed
'fnInitComplete': function (oSettings, json) {
if (oSettings.aoData.length > 1) {
return;
}
// If table is empty or only has a single row, ensure sortable columns
// are set to unsortable in order to avoid potential unnecessary HTTP
// request made by clicking header by user.
let columns = oSettings.aoColumns;
for (let i = 0; i < columns.length; i++) {
let column = columns[i];
if (column.bSortable) {
column.bSortable = false;
}
}
},

'fnDrawCallback': function () {
jQ('#testplans_table tbody tr td:nth-child(1)').shiftcheckbox({
checkboxSelector: ':checkbox',
selectAll: '#testplans_table .js-select-all'
});

jQ('#testplans_table :checkbox').on('change', function () {
let disable = jQ('#testplans_table tbody :checkbox:checked').length === 0;
jQ('.js-printable-plans').prop('disabled', disable);
jQ('.js-clone-plans').prop('disabled', disable);
jQ('.js-export-plans').prop('disabled', disable);
});
}
};

jQ('#testplans_table').dataTable(
Object.assign(plansSearchResultTableSettings, Nitrate.DataTable.commonSettings)
Object.assign({}, Nitrate.TestPlans.SearchResultTableSettings, {
iDeferLoading: Nitrate.TestPlans.List.numberOfPlans,
sAjaxSource: '/plans/pages/' + this.window.location.search,
})
);

bindSearchResultActionEventHandlers();
Expand Down
57 changes: 47 additions & 10 deletions src/static/js/testrun_actions.js
View file
Expand Up @@ -94,19 +94,56 @@ function cloneRunsClickHandler() {
}

Nitrate.TestRuns.AdvancedSearch.on_load = function () {
jQ('#testruns_table tbody tr td:nth-child(1)').shiftcheckbox({
checkboxSelector: ':checkbox',
selectAll: '#testruns_table .js-select-all',
});

jQ('#testruns_table :checkbox').on('change', function () {
jQ('.js-clone-testruns').prop(
'disabled', jQ('#testruns_table tbody :checkbox:checked').length === 0
);
jQ('.js-clone-testruns').on('click', cloneRunsClickHandler);

let runsSearchResultTableSettings = Object.assign({}, Nitrate.DataTable.commonSettings, {
aaSorting: [[1, 'desc']],
sAjaxSource: '/advance-search/' + this.window.location.search,

iDeferLoading: Nitrate.TestRuns.AdvancedSearch.numberOfRuns,

aoColumns: [
{'bSortable': false}, // Select checker
{'sType': 'numeric'}, // ID
{'sType': 'html'}, // Summary
{'sType': 'html'}, // Manager
{'sType': 'html'}, // Default Tester
{'bVisible': false}, // ?
null, // Product
null, // Product Version
null, // Environment
{'sType': 'numeric'}, // Cases
{'sType': 'html'}, // Status
{'bSortable': false} // Completed progress
],

oLanguage: {
sEmptyTable: 'No run was found.'
},

fnDrawCallback: function () {
jQ('#testruns_table tbody tr td:nth-child(1)').shiftcheckbox({
checkboxSelector: ':checkbox',
selectAll: '#testruns_table .js-select-all'
});

jQ('#testruns_table :checkbox').on('change', function () {
jQ('.js-clone-testruns').prop(
'disabled', jQ('#testruns_table tbody :checkbox:checked').length === 0
);
});
},

fnInfoCallback: function (oSettings, iStart, iEnd, iMax, iTotal, sPre) {
return 'Showing ' + (iEnd - iStart + 1) + ' of ' + iTotal + ' runs';
}

});

jQ('.js-clone-testruns').on('click', cloneRunsClickHandler);
}
jQ('#testruns_table').dataTable(runsSearchResultTableSettings);

};

Nitrate.TestRuns.List.on_load = function () {
registerProductAssociatedObjectUpdaters(
Expand Down

0 comments on commit bfcc83f

Please sign in to comment.