fix focus

This commit is contained in:
samunohito 2024-07-28 07:37:18 +09:00
parent ca2da9d296
commit bac10659e0
3 changed files with 22 additions and 21 deletions

View File

@ -135,7 +135,7 @@ watch(() => [cell.value.value], () => {
watch(() => cell.value.selected, () => { watch(() => cell.value.selected, () => {
if (cell.value.selected) { if (cell.value.selected) {
rootEl.value?.focus(); requestFocus();
} }
}); });
@ -151,8 +151,7 @@ function onCellDoubleClick(ev: MouseEvent) {
function onOutsideMouseDown(ev: MouseEvent) { function onOutsideMouseDown(ev: MouseEvent) {
const isOutside = ev.target instanceof Node && !rootEl.value?.contains(ev.target); const isOutside = ev.target instanceof Node && !rootEl.value?.contains(ev.target);
if (isOutside || !equalCellAddress(cell.value.address, getCellAddress(ev.target as HTMLElement))) { if (isOutside || !equalCellAddress(cell.value.address, getCellAddress(ev.target as HTMLElement))) {
endEditing(true, editingValue.value); endEditing(true, false);
editingValue.value = undefined;
} }
} }
@ -170,15 +169,13 @@ function onCellKeyDown(ev: KeyboardEvent) {
} else { } else {
switch (ev.code) { switch (ev.code) {
case 'Escape': { case 'Escape': {
endEditing(false, editingValue.value); endEditing(false, true);
editingValue.value = undefined;
break; break;
} }
case 'NumpadEnter': case 'NumpadEnter':
case 'Enter': { case 'Enter': {
if (!ev.isComposing) { if (!ev.isComposing) {
endEditing(true, editingValue.value); endEditing(true, true);
editingValue.value = undefined;
} }
} }
} }
@ -203,7 +200,7 @@ function unregisterOutsideMouseDown() {
} }
async function beginEditing(target: HTMLElement) { async function beginEditing(target: HTMLElement) {
if (editing.value || !cell.value.column.setting.editable) { if (editing.value || !cell.value.selected || !cell.value.column.setting.editable) {
return; return;
} }
@ -221,7 +218,7 @@ async function beginEditing(target: HTMLElement) {
emitValueChange(newValue); emitValueChange(newValue);
} }
rootEl.value?.focus(); requestFocus();
} else { } else {
switch (cellType.value) { switch (cellType.value) {
case 'number': case 'number':
@ -249,11 +246,14 @@ async function beginEditing(target: HTMLElement) {
} }
} }
function endEditing(applyValue: boolean, newValue: CellValue) { function endEditing(applyValue: boolean, requireFocus: boolean) {
if (!editing.value) { if (!editing.value) {
return; return;
} }
const newValue = editingValue.value;
editingValue.value = undefined;
emit('operation:endEdit', cell.value); emit('operation:endEdit', cell.value);
unregisterOutsideMouseDown(); unregisterOutsideMouseDown();
@ -263,7 +263,15 @@ function endEditing(applyValue: boolean, newValue: CellValue) {
editing.value = false; editing.value = false;
rootEl.value?.focus(); if (requireFocus) {
requestFocus();
}
}
function requestFocus() {
nextTick(() => {
rootEl.value?.focus();
});
} }
function emitValueChange(newValue: CellValue) { function emitValueChange(newValue: CellValue) {

View File

@ -81,16 +81,9 @@ class ValidatorPreset {
regex(pattern: RegExp): GridCellValidator { regex(pattern: RegExp): GridCellValidator {
return { return {
name: 'regex', name: 'regex',
validate: ({ value, column }): ValidatorResult => { validate: ({ value }): ValidatorResult => {
if (column.setting.type !== 'text') {
return {
valid: false,
message: i18n.ts._gridComponent._error.columnTypeNotSupport,
};
}
return { return {
valid: pattern.test(value?.toString() ?? ''), valid: (typeof value !== 'string') || pattern.test(value.toString() ?? ''),
message: i18n.tsx._gridComponent._error.patternNotMatch({ pattern: pattern.source }), message: i18n.tsx._gridComponent._error.patternNotMatch({ pattern: pattern.source }),
}; };
}, },

View File

@ -580,7 +580,7 @@ async function refreshCustomEmojis() {
query: query, query: query,
limit: limit, limit: limit,
page: currentPage.value, page: currentPage.value,
sortKeys: sortOrders.value.map(({ key, direction }) => `${direction}${key}`), sortKeys: sortOrders.value.map(({ key, direction }) => `${direction}${key}` as any),
}), }),
() => { () => {
}, },