education/course-mini-excel
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

little ux fixes

Browse Source
This commit is contained in:
Sergey Krylov 2022-07-18 16:32:09 +05:00
parent 0d17d35fe8
commit 579694c829
4 changed files with 16 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/components/table/SelectionManager.ts
View File

@ -254,7 +254,8 @@ export class SelectionManager {
const target = $(event.target); const target = $(event.target);
const header = target.closest('[data-header]'); const header = target.closest('[data-header]');
const resizer = target.closest('[data-resize]'); const resizer = target.closest('[data-resize]');
event.preventDefault();
if (!this.rootTable.focusManager.$currentFocusedCell?.isExist) event.preventDefault();
if (header?.isExist && !isCell2(target) && !resizer?.isExist) { if (header?.isExist && !isCell2(target) && !resizer?.isExist) {
this.selectHeadRowCol(header); this.selectHeadRowCol(header);
@ -290,7 +291,7 @@ export class SelectionManager {
onKeyDownHandler(event: KeyboardEvent) { onKeyDownHandler(event: KeyboardEvent) {
if (!isSelectionKey(event.key) || this.rootTable.focusManager.$currentFocusedCell?.isExist) { if (!isSelectionKey(event.key) || this.rootTable.focusManager.$currentFocusedCell?.isExist) {
// TODO improve check // TODO improve check
if (event.key.length === 1) { if (event.key.length === 1 && !this.rootTable.focusManager.$currentFocusedCell?.isExist) {
this.$currentSelectedCell && this.rootTable.focusManager.focusCell(this.$currentSelectedCell); this.$currentSelectedCell && this.rootTable.focusManager.focusCell(this.$currentSelectedCell);
} }
@ -343,7 +344,6 @@ export class SelectionManager {
if (!side) return; if (!side) return;
// $cell = this.getNeighbourCellBySide(side);
$cell = this.getNeighbourCellBySide(side, this.$currentSelectedCell || this.$firstSelectedCell); $cell = this.getNeighbourCellBySide(side, this.$currentSelectedCell || this.$firstSelectedCell);
if (event.ctrlKey && $cell?.isExist) { if (event.ctrlKey && $cell?.isExist) {

2
src/components/table/Table.ts
View File

@ -3,6 +3,7 @@ import { BaseComponentOption } from 'components/excel/Excel';
import { FocusManager } from 'components/table/FocusManager'; import { FocusManager } from 'components/table/FocusManager';
import { SelectionManager } from 'components/table/SelectionManager'; import { SelectionManager } from 'components/table/SelectionManager';
import { startCellId } from 'components/table/table.functions'; import { startCellId } from 'components/table/table.functions';
import { parse } from 'core/utils';
import * as actions from 'redux/action-creators'; import * as actions from 'redux/action-creators';
import { $, Dom } from 'core/Dom'; import { $, Dom } from 'core/Dom';
import { ExcelComponent } from 'core/ExcelComponent'; import { ExcelComponent } from 'core/ExcelComponent';
@ -14,7 +15,6 @@ import {
} from 'redux/action-creators'; } from 'redux/action-creators';
import { createTable } from 'components/table/table.template'; import { createTable } from 'components/table/table.template';
import { TableSizeType } from 'redux/types'; import { TableSizeType } from 'redux/types';
import { parse } from 'core/utils';
import { resizeHandler } from 'components/table/handlers/table.resize'; import { resizeHandler } from 'components/table/handlers/table.resize';
import { initialStyleState } from 'src/constants'; import { initialStyleState } from 'src/constants';

17
src/core/Dom.ts
View File

@ -13,13 +13,16 @@ export class Dom implements DomClass {
$el: HTMLElement; $el: HTMLElement;
constructor(selector: SelectorType) { constructor(selector: SelectorType) {
// Could not find element with selector in DOM, need a check try {
if (typeof selector === 'string') { if (typeof selector === 'string') {
const elementFromDOM = document.querySelector(selector); const elementFromDOM = document.querySelector(selector);
if (!elementFromDOM) throw new Error(`Can't find element with "${selector}" selector`); if (!elementFromDOM) throw new Error(`Can't find element with "${selector}" selector`);
else this.$el = elementFromDOM as HTMLElement; else this.$el = elementFromDOM as HTMLElement;
} else { } else {
this.$el = selector as HTMLElement; this.$el = selector as HTMLElement;
}
} catch (e) {
console.error(e.message);
} }
} }

3
src/styles/components/formula.scss
View File

@ -23,5 +23,6 @@
width: 100%; width: 100%;
height: 100%; height: 100%;
color: #000; color: #000;
overflow: hidden;
} }
} }