minor fixes

- edit cell orange border
- eslint fixes
- remove default left align
This commit is contained in:
Faris Ansari 2018-04-15 22:18:58 +05:30
parent 4bb4002300
commit 5ff72dfcee
5 changed files with 23 additions and 36 deletions

View File

@ -1,8 +1,6 @@
import $ from './dom';
import Clusterize from 'clusterize.js'; import Clusterize from 'clusterize.js';
import { import $ from './dom';
nextTick import { nextTick } from './utils';
} from './utils';
export default class BodyRenderer { export default class BodyRenderer {
constructor(instance) { constructor(instance) {
@ -60,9 +58,7 @@ export default class BodyRenderer {
scrollElem: this.bodyScrollable, scrollElem: this.bodyScrollable,
contentElem: $('tbody', this.bodyScrollable), contentElem: $('tbody', this.bodyScrollable),
callbacks: { callbacks: {
clusterChanged: () => { clusterChanged: () => this.restoreState()
this.restoreState();
}
}, },
/* eslint-disable */ /* eslint-disable */
show_no_data_row: false, show_no_data_row: false,
@ -99,7 +95,7 @@ export default class BodyRenderer {
} }
getDataForClusterize(rows) { getDataForClusterize(rows) {
return rows.map((row) => this.rowmanager.getRowHTML(row, row.meta)); return rows.map(row => this.rowmanager.getRowHTML(row, row.meta));
} }
getBodyHTML(rows) { getBodyHTML(rows) {
@ -109,4 +105,4 @@ export default class BodyRenderer {
</tbody> </tbody>
`; `;
} }
}; }

View File

@ -5,9 +5,7 @@ import {
linkProperties linkProperties
} from './utils'; } from './utils';
import $ from './dom'; import $ from './dom';
import { import { getDropdownHTML } from './columnmanager';
getDropdownHTML
} from './columnmanager';
export default class CellManager { export default class CellManager {
constructor(instance) { constructor(instance) {
@ -46,7 +44,7 @@ export default class CellManager {
this.activateEditing(cell); this.activateEditing(cell);
}); });
this.keyboard.on('enter', (e) => { this.keyboard.on('enter', () => {
if (this.$focusedCell && !this.$editingCell) { if (this.$focusedCell && !this.$editingCell) {
// enter keypress on focused cell // enter keypress on focused cell
this.activateEditing(this.$focusedCell); this.activateEditing(this.$focusedCell);
@ -105,13 +103,11 @@ export default class CellManager {
return true; return true;
}; };
['left', 'right', 'up', 'down', 'tab', 'shift+tab'].map( ['left', 'right', 'up', 'down', 'tab', 'shift+tab']
direction => this.keyboard.on(direction, () => focusCell(direction)) .map(direction => this.keyboard.on(direction, () => focusCell(direction)));
);
['left', 'right', 'up', 'down'].map( ['left', 'right', 'up', 'down']
direction => this.keyboard.on('ctrl+' + direction, () => focusLastCell(direction)) .map(direction => this.keyboard.on(`ctrl+${direction}`, () => focusLastCell(direction)));
);
this.keyboard.on('esc', () => { this.keyboard.on('esc', () => {
this.deactivateEditing(); this.deactivateEditing();
@ -120,9 +116,7 @@ export default class CellManager {
if (this.options.inlineFilters) { if (this.options.inlineFilters) {
this.keyboard.on('ctrl+f', (e) => { this.keyboard.on('ctrl+f', (e) => {
const $cell = $.closest('.data-table-cell', e.target); const $cell = $.closest('.data-table-cell', e.target);
let { const { colIndex } = $.data($cell);
colIndex
} = $.data($cell);
this.activateFilter(colIndex); this.activateFilter(colIndex);
return true; return true;
@ -147,10 +141,9 @@ export default class CellManager {
return $selectionCursor; return $selectionCursor;
}; };
['left', 'right', 'up', 'down'].map( ['left', 'right', 'up', 'down']
direction => this.keyboard.on('shift+' + direction, .map(direction =>
() => this.selectArea(getNextSelectionCursor(direction))) this.keyboard.on(`shift+${direction}`, () => this.selectArea(getNextSelectionCursor(direction))));
);
} }
bindCopyCellContents() { bindCopyCellContents() {
@ -298,7 +291,7 @@ export default class CellManager {
// valid selection // valid selection
this.$selectionCursor = $selectionCursor; this.$selectionCursor = $selectionCursor;
} }
}; }
_selectArea($cell1, $cell2) { _selectArea($cell1, $cell2) {
if ($cell1 === $cell2) return false; if ($cell1 === $cell2) return false;
@ -318,7 +311,6 @@ export default class CellManager {
[colIndex1, rowIndex1, colIndex2, rowIndex2] = arguments; [colIndex1, rowIndex1, colIndex2, rowIndex2] = arguments;
} else } else
if (typeof $cell1 === 'object') { if (typeof $cell1 === 'object') {
if (!($cell1 && $cell2)) { if (!($cell1 && $cell2)) {
return false; return false;
} }
@ -344,17 +336,17 @@ export default class CellManager {
return false; return false;
} }
let cells = []; const cells = [];
let colIndex = colIndex1; let colIndex = colIndex1;
let rowIndex = rowIndex1; let rowIndex = rowIndex1;
let rowIndices = []; const rowIndices = [];
while (rowIndex <= rowIndex2) { while (rowIndex <= rowIndex2) {
rowIndices.push(rowIndex); rowIndices.push(rowIndex);
rowIndex++; rowIndex += 1;
} }
rowIndices.map(rowIndex => { rowIndices.map((rowIndex) => {
while (colIndex <= colIndex2) { while (colIndex <= colIndex2) {
cells.push([colIndex, rowIndex]); cells.push([colIndex, rowIndex]);
colIndex++; colIndex++;

View File

@ -113,7 +113,6 @@ export default class DataManager {
prepareCell(content, i) { prepareCell(content, i) {
const cell = { const cell = {
content: '', content: '',
align: 'left',
sortOrder: 'none', sortOrder: 'none',
colIndex: i, colIndex: i,
column: this.columns[i] column: this.columns[i]

View File

@ -7,7 +7,6 @@ import BodyRenderer from './body-renderer';
import Style from './style'; import Style from './style';
import Keyboard from './keyboard'; import Keyboard from './keyboard';
import DEFAULT_OPTIONS from './defaults'; import DEFAULT_OPTIONS from './defaults';
import './style.css';
class DataTable { class DataTable {
constructor(wrapper, options) { constructor(wrapper, options) {

View File

@ -6,6 +6,7 @@
--primary-color: rgb(82, 146, 247); --primary-color: rgb(82, 146, 247);
--light-bg: #f5f7fa; --light-bg: #f5f7fa;
--light-red: #FD8B8B; --light-red: #FD8B8B;
--orange: rgb(255, 160, 10);
--text-color: #000000; --text-color: #000000;
--text-light: #dfe2e5; --text-light: #dfe2e5;
@ -213,7 +214,7 @@
.edit-cell { .edit-cell {
display: none; display: none;
padding: var(--spacer-2); padding: var(--spacer-2);
background: #fff; background-color: #fff;
z-index: 1; z-index: 1;
height: 100%; height: 100%;
} }
@ -228,7 +229,7 @@
} }
.edit-cell { .edit-cell {
border: 2px solid var(--primary-color); border: 2px solid var(--orange);
display: block; display: block;
} }
} }