diff --git a/packages/datalib/src/GridConfig.ts b/packages/datalib/src/GridConfig.ts index 48dcf39b5..39433a74a 100644 --- a/packages/datalib/src/GridConfig.ts +++ b/packages/datalib/src/GridConfig.ts @@ -31,6 +31,7 @@ export interface GridConfig extends GridConfigColumns { formFilterColumns: string[]; formColumnFilterText?: string; multiColumnFilter?: string; + searchInColumns?: string; } export interface GridCache { diff --git a/packages/datalib/src/GridDisplay.ts b/packages/datalib/src/GridDisplay.ts index 48d91910e..5243f4967 100644 --- a/packages/datalib/src/GridDisplay.ts +++ b/packages/datalib/src/GridDisplay.ts @@ -196,9 +196,24 @@ export abstract class GridDisplay { })); } + setSearchInColumns(searchInColumns: string) { + this.setConfig(cfg => ({ + ...cfg, + searchInColumns, + })); + } + get hiddenColumnIndexes() { // console.log('GridDisplay.hiddenColumn', this.config.hiddenColumns); - return (this.config.hiddenColumns || []).map(x => _.findIndex(this.allColumns, y => y.uniqueName == x)); + const res = (this.config.hiddenColumns || []).map(x => _.findIndex(this.allColumns, y => y.uniqueName == x)); + if (this.config.searchInColumns) { + for (let i = 0; i < this.allColumns.length; i++) { + if (!filterName(this.config.searchInColumns, this.allColumns[i].columnName)) { + res.push(i); + } + } + } + return _.sortBy(_.uniq(res)); } isColumnChecked(column: DisplayColumn) { diff --git a/packages/web/src/buttons/CloseSearchButton.svelte b/packages/web/src/buttons/CloseSearchButton.svelte index 693054d22..de9ee17ef 100644 --- a/packages/web/src/buttons/CloseSearchButton.svelte +++ b/packages/web/src/buttons/CloseSearchButton.svelte @@ -5,13 +5,18 @@ export let filter; export let showDisabled = false; + export let onClearFilter = null; {#if filter || showDisabled} { - filter = ''; + if (onClearFilter) { + onClearFilter(); + } else { + filter = ''; + } }} title="Clear filter" disabled={!filter} diff --git a/packages/web/src/datagrid/ColumnManager.svelte b/packages/web/src/datagrid/ColumnManager.svelte index 76031e8ac..ef0e1906b 100644 --- a/packages/web/src/datagrid/ColumnManager.svelte +++ b/packages/web/src/datagrid/ColumnManager.svelte @@ -28,7 +28,6 @@ export let changeSetState: { value: ChangeSet } = null; export let dispatchChangeSet = null; - let filter; let domFocusField; let selectedColumns = []; @@ -36,7 +35,9 @@ let dragStartColumnIndex = null; let shiftOriginColumnIndex = null; - $: items = display?.getColumns(filter)?.filter(column => filterName(filter, column.columnName)) || []; + $: currentFilter = display?.config?.searchInColumns; + + $: items = display?.getColumns(currentFilter)?.filter(column => filterName(currentFilter, column.columnName)) || []; function selectColumnIndexCore(index, e) { const uniqueName = items[index].uniqueName; @@ -173,8 +174,12 @@ {/if} - - + display.setSearchInColumns(value)} + /> + display.setSearchInColumns('')} /> {#if isDynamicStructure && !isJsonView} { @@ -235,7 +240,7 @@ {columnIndex} {allowChangeChangeSetStructure} isSelected={selectedColumns.includes(column.uniqueName) || currentColumnUniqueName == column.uniqueName} - {filter} + filter={currentFilter} on:click={() => { if (domFocusField) domFocusField.focus(); selectedColumns = [column.uniqueName]; diff --git a/packages/web/src/elements/SearchInput.svelte b/packages/web/src/elements/SearchInput.svelte index c86e4af01..8961dd722 100644 --- a/packages/web/src/elements/SearchInput.svelte +++ b/packages/web/src/elements/SearchInput.svelte @@ -8,12 +8,17 @@ $: searchValue = value || ''; export let isDebounced = false; export let onFocusFilteredList = null; + export let onChange = null; let domInput; function handleKeyDown(e) { if (e.keyCode == keycodes.escape) { - value = ''; + if (onChange) { + onChange(''); + } else { + value = ''; + } } if (e.keyCode == keycodes.downArrow || e.keyCode == keycodes.pageDown || e.keyCode == keycodes.enter) { onFocusFilteredList?.(); @@ -27,7 +32,11 @@ domInput.focus(); if (text) { domInput.value = text; - value = text; + if (onChange) { + onChange(text); + } else { + value = text; + } } } @@ -37,8 +46,12 @@ {placeholder} value={searchValue} on:input={e => { - if (isDebounced) debouncedSet(domInput.value); - else value = domInput.value; + if (onChange) { + onChange(domInput.value); + } else { + if (isDebounced) debouncedSet(domInput.value); + else value = domInput.value; + } }} on:keydown={handleKeyDown} bind:this={domInput}