jingrow/datatable
1
0
Fork 0
Code Pull Requests Activity

accept dict as data

Browse Source
This commit is contained in:
Rushabh Mehta 2018-02-06 22:51:42 +05:30
parent 9a88d7c38a
commit 9ae7c3a8e6
7 changed files with 143 additions and 95 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

128
lib/frappe-datatable.js
View File

@ -878,6 +878,14 @@ var CellManager = function () {
}
});
_dom2.default.on(this.bodyScrollable, 'blur', 'input', function (e, input) {
var cell = input.closest('.data-table-col');
if (_this.$editingCell === cell) {
_this.submitEditing();
_this.deactivateEditing();
}
});
// $.on(document.body, 'click', e => {
// if (e.target.matches('.edit-cell, .edit-cell *')) return;
// this.deactivateEditing();
@ -1256,7 +1264,7 @@ var CellManager = function () {
if (editing) {
this.currentCellEditing = editing;
// initialize editing input with cell value
editing.initValue(cell.content);
editing.initValue(cell.content, rowIndex, col);
}
}
}, {
@ -1304,12 +1312,14 @@ var CellManager = function () {
rowIndex = _$$data8.rowIndex,
colIndex = _$$data8.colIndex;
var col = this.datamanager.getColumn(colIndex);
if ($cell) {
var editing = this.currentCellEditing;
if (editing) {
var value = editing.getValue();
var done = editing.setValue(value);
var done = editing.setValue(value, rowIndex, col);
var oldValue = this.getCell(colIndex, rowIndex).content;
// update cell immediately
@ -1512,7 +1522,7 @@ function getCellContent(column) {
var hasDropdown = isHeader && column.dropdown !== false;
var dropdown = hasDropdown ? '<div class="data-table-dropdown">' + (0, _columnmanager.getDropdownHTML)() + '</div>' : '';
return '\n <div class="content ellipsis">\n ' + (column.format ? column.format(column.content) : column.content) + '\n ' + sortIndicator + '\n ' + resizeColumn + '\n ' + dropdown + '\n </div>\n ' + editCellHTML + '\n ';
return '\n <div class="content ellipsis">\n ' + (!column.isHeader && column.format ? column.format(column.content) : column.content) + '\n ' + sortIndicator + '\n ' + resizeColumn + '\n ' + dropdown + '\n </div>\n ' + editCellHTML + '\n ';
}
function getEditCellHTML() {
@ -2308,7 +2318,7 @@ var DataTable = function () {
_keyboard2.default.init(this.wrapper);
if (this.options.data) {
this.refresh(this.options.data);
this.refresh();
}
}
@ -2535,17 +2545,14 @@ var DataManager = function () {
data = this.options.data;
}
var _data = data,
columns = _data.columns,
rows = _data.rows;
this.data = data;
this.rowCount = 0;
this.columns = [];
this.rows = [];
this.columns = this.prepareColumns(columns);
this.rows = this.prepareRows(rows);
this.prepareColumns();
this.prepareRows();
this.prepareNumericColumns();
}
@ -2554,7 +2561,8 @@ var DataManager = function () {
}, {
key: 'prepareColumns',
value: function prepareColumns(columns) {
value: function prepareColumns() {
var columns = this.options.columns;
this.validateColumns(columns);
if (this.options.addSerialNoColumn && !this.hasColumnById('_rowIndex')) {
@ -2588,7 +2596,7 @@ var DataManager = function () {
columns = [_val].concat(columns);
}
return _prepareColumns(columns);
this.columns = _prepareColumns(columns);
}
}, {
key: 'prepareNumericColumns',
@ -2607,32 +2615,62 @@ var DataManager = function () {
}
}, {
key: 'prepareRows',
value: function prepareRows(rows) {
value: function prepareRows() {
var _this = this;
this.validateRows(rows);
this.validateRows(this.data);
rows = rows.map(function (row, i) {
this.rows = this.data.map(function (d, i) {
var index = _this._getNextRowCount();
if (row.length < _this.columns.length) {
if (_this.hasColumnById('_rowIndex')) {
var val = index + 1 + '';
var row = [];
row = [val].concat(row);
if (Array.isArray(d)) {
// row is an array
if (_this.options.addSerialNoColumn) {
row.push(index + 1 + '');
}
if (_this.hasColumnById('_checkbox')) {
var _val2 = '<input type="checkbox" />';
if (_this.options.addCheckboxColumn) {
row.push(_this.getCheckboxHTML());
}
row = row.concat(d);
} else {
// row is a dict
var _iteratorNormalCompletion = true;
var _didIteratorError = false;
var _iteratorError = undefined;
row = [_val2].concat(row);
try {
for (var _iterator = _this.columns[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
var col = _step.value;
if (col.id === '_rowIndex') {
row.push(index + 1 + '');
} else if (col.id === '_checkbox') {
row.push(_this.getCheckboxHTML());
} else {
row.push(col.format(d[col.id]));
}
}
} catch (err) {
_didIteratorError = true;
_iteratorError = err;
} finally {
try {
if (!_iteratorNormalCompletion && _iterator.return) {
_iterator.return();
}
} finally {
if (_didIteratorError) {
throw _iteratorError;
}
}
}
}
return prepareRow(row, index);
});
return rows;
}
}, {
key: 'validateColumns',
@ -2650,21 +2688,9 @@ var DataManager = function () {
}, {
key: 'validateRows',
value: function validateRows(rows) {
var _this2 = this;
if (!Array.isArray(rows)) {
throw new DataError('`rows` must be an array');
}
rows.forEach(function (row, i) {
if (!Array.isArray(row)) {
throw new DataError('`row` must be an array');
}
if (row.length !== _this2.getColumnCount(true)) {
throw new DataError('Row index "' + i + '" doesn\'t match column length');
}
});
}
}, {
key: 'appendRows',
@ -2809,9 +2835,9 @@ var DataManager = function () {
}
if (this.hasColumnById('_checkbox')) {
var _val3 = '<input type="checkbox" />';
var _val2 = '<input type="checkbox" />';
row = [_val3].concat(row);
row = [_val2].concat(row);
}
}
@ -2825,7 +2851,7 @@ var DataManager = function () {
}
}, {
key: 'updateCell',
value: function updateCell(colIndex, rowIndex, keyValPairs) {
value: function updateCell(colIndex, rowIndex, options) {
var cell = void 0;
if ((typeof colIndex === 'undefined' ? 'undefined' : _typeof(colIndex)) === 'object') {
// cell object was passed,
@ -2834,17 +2860,24 @@ var DataManager = function () {
colIndex = cell.colIndex;
rowIndex = cell.rowIndex;
// the object passed must be merged with original cell
keyValPairs = cell;
options = cell;
}
cell = this.getCell(colIndex, rowIndex);
// mutate object directly
for (var key in keyValPairs) {
var newVal = keyValPairs[key];
for (var key in options) {
var newVal = options[key];
if (newVal !== undefined) {
cell[key] = newVal;
}
}
// update model
if (!Array.isArray(this.data[rowIndex])) {
var col = this.getColumn(colIndex);
this.data[rowIndex][col.id] = options.content;
}
return cell;
}
}, {
@ -2973,6 +3006,11 @@ var DataManager = function () {
return col.id === id;
});
}
}, {
key: 'getCheckboxHTML',
value: function getCheckboxHTML() {
return '<input type="checkbox" />';
}
}, {
key: 'currentSort',
get: function get() {
@ -3013,7 +3051,7 @@ function _prepareColumns(columns) {
focusable: true,
dropdown: true,
format: function format(value) {
return '<span class="column-title">' + value + '</span>';
return value + '';
}
};
@ -3277,10 +3315,8 @@ Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = {
data: {
columns: [],
rows: []
},
data: [],
dropdownButton: '▼',
headerDropdown: [{
label: 'Sort Ascending',

2
lib/frappe-datatable.js.map
View File

File diff suppressed because one or more lines are too long

15
src/cellmanager.js
View File

@ -51,6 +51,14 @@ export default class CellManager {
}
});
$.on(this.bodyScrollable, 'blur', 'input', (e, input) => {
const cell = input.closest('.data-table-col');
if (this.$editingCell === cell) {
this.submitEditing();
this.deactivateEditing();
}
});
// $.on(document.body, 'click', e => {
// if (e.target.matches('.edit-cell, .edit-cell *')) return;
// this.deactivateEditing();
@ -360,7 +368,7 @@ export default class CellManager {
if (editing) {
this.currentCellEditing = editing;
// initialize editing input with cell value
editing.initValue(cell.content);
editing.initValue(cell.content, rowIndex, col);
}
}
@ -399,13 +407,14 @@ export default class CellManager {
if (!this.$editingCell) return;
const $cell = this.$editingCell;
const { rowIndex, colIndex } = $.data($cell);
const col = this.datamanager.getColumn(colIndex);
if ($cell) {
const editing = this.currentCellEditing;
if (editing) {
const value = editing.getValue();
const done = editing.setValue(value);
const done = editing.setValue(value, rowIndex, col);
const oldValue = this.getCell(colIndex, rowIndex).content;
// update cell immediately
@ -573,7 +582,7 @@ export function getCellContent(column) {
return `
<div class="content ellipsis">
${column.format ? column.format(column.content) : column.content}
${(!column.isHeader && column.format) ? column.format(column.content) : column.content}
${sortIndicator}
${resizeColumn}
${dropdown}

76
src/datamanager.js
View File

@ -13,14 +13,14 @@ export default class DataManager {
data = this.options.data;
}
let { columns, rows } = data;
this.data = data;
this.rowCount = 0;
this.columns = [];
this.rows = [];
this.columns = this.prepareColumns(columns);
this.rows = this.prepareRows(rows);
this.prepareColumns();
this.prepareRows();
this.prepareNumericColumns();
}
@ -34,7 +34,8 @@ export default class DataManager {
};
}
prepareColumns(columns) {
prepareColumns() {
let columns = this.options.columns;
this.validateColumns(columns);
if (this.options.addSerialNoColumn && !this.hasColumnById('_rowIndex')) {
@ -66,7 +67,7 @@ export default class DataManager {
columns = [val].concat(columns);
}
return prepareColumns(columns);
this.columns = prepareColumns(columns);
}
prepareNumericColumns() {
@ -83,30 +84,40 @@ export default class DataManager {
});
}
prepareRows(rows) {
this.validateRows(rows);
prepareRows() {
this.validateRows(this.data);
rows = rows.map((row, i) => {
this.rows = this.data.map((d, i) => {
const index = this._getNextRowCount();
if (row.length < this.columns.length) {
if (this.hasColumnById('_rowIndex')) {
const val = (index + 1) + '';
let row = [];
row = [val].concat(row);
if (Array.isArray(d)) {
// row is an array
if (this.options.addSerialNoColumn) {
row.push((index + 1) + '');
}
if (this.hasColumnById('_checkbox')) {
const val = '<input type="checkbox" />';
if (this.options.addCheckboxColumn) {
row.push(this.getCheckboxHTML());
}
row = row.concat(d);
row = [val].concat(row);
} else {
// row is a dict
for (let col of this.columns) {
if (col.id === '_rowIndex') {
row.push((index + 1) + '');
} else if (col.id === '_checkbox') {
row.push(this.getCheckboxHTML());
} else {
row.push(col.format(d[col.id]));
}
}
}
return prepareRow(row, index);
});
return rows;
}
validateColumns(columns) {
@ -125,16 +136,6 @@ export default class DataManager {
if (!Array.isArray(rows)) {
throw new DataError('`rows` must be an array');
}
rows.forEach((row, i) => {
if (!Array.isArray(row)) {
throw new DataError('`row` must be an array');
}
if (row.length !== this.getColumnCount(true)) {
throw new DataError(`Row index "${i}" doesn't match column length`);
}
});
}
appendRows(rows) {
@ -287,7 +288,7 @@ export default class DataManager {
return _row;
}
updateCell(colIndex, rowIndex, keyValPairs) {
updateCell(colIndex, rowIndex, options) {
let cell;
if (typeof colIndex === 'object') {
// cell object was passed,
@ -296,17 +297,24 @@ export default class DataManager {
colIndex = cell.colIndex;
rowIndex = cell.rowIndex;
// the object passed must be merged with original cell
keyValPairs = cell;
options = cell;
}
cell = this.getCell(colIndex, rowIndex);
// mutate object directly
for (let key in keyValPairs) {
const newVal = keyValPairs[key];
for (let key in options) {
const newVal = options[key];
if (newVal !== undefined) {
cell[key] = newVal;
}
}
// update model
if (!Array.isArray(this.data[rowIndex])) {
const col = this.getColumn(colIndex);
this.data[rowIndex][col.id] = options.content;
}
return cell;
}
@ -406,6 +414,10 @@ export default class DataManager {
getColumnIndexById(id) {
return this.columns.findIndex(col => col.id === id);
}
getCheckboxHTML() {
return '<input type="checkbox" />';
}
}
function prepareRow(row, i) {
@ -426,7 +438,7 @@ function prepareColumns(columns, props = {}) {
resizable: true,
focusable: true,
dropdown: true,
format: value => `<span class="column-title">${value}</span>`
format: value => value + ''
};
return columns

2
src/datatable.js
View File

@ -44,7 +44,7 @@ class DataTable {
keyboard.init(this.wrapper);
if (this.options.data) {
this.refresh(this.options.data);
this.refresh();
}
}

4
src/defaults.js
View File

@ -1,8 +1,6 @@
export default {
data: {
columns: [],
rows: []
},
data: [],
dropdownButton: '▼',
headerDropdown: [
{

7
test/datamanager.spec.js
View File

@ -50,13 +50,6 @@ describe.only('DataManager instance', () => {
})).to.throw(DataError, '`rows` must be an array');
});
it('should throw when any of the row is not an Array', () => {
expect(() => datamanager.init({
columns: ['Name'],
rows: [2]
})).to.throw(DataError, '`row` must be an array');
});
it('should throw when any of the row\'s length doesn\'t match column length', () => {
expect(() => datamanager.init({
columns: ['Name'],