@operato/data-grist 2.0.0-alpha.99 → 2.0.0-beta.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +433 -0
- package/demo/data-grist-test.html +1 -1
- package/demo/index.html +1 -1
- package/dist/src/data-card/data-card-field.js +2 -2
- package/dist/src/data-card/data-card-field.js.map +1 -1
- package/dist/src/data-card/data-card-gutter-menu.js +5 -5
- package/dist/src/data-card/data-card-gutter-menu.js.map +1 -1
- package/dist/src/data-card/data-card-gutter.js +6 -6
- package/dist/src/data-card/data-card-gutter.js.map +1 -1
- package/dist/src/data-card/data-card.js +7 -9
- package/dist/src/data-card/data-card.js.map +1 -1
- package/dist/src/data-card/record-card.js +9 -10
- package/dist/src/data-card/record-card.js.map +1 -1
- package/dist/src/data-grid/data-grid-accum-field.js +12 -5
- package/dist/src/data-grid/data-grid-accum-field.js.map +1 -1
- package/dist/src/data-grid/data-grid-body-style.js +12 -0
- package/dist/src/data-grid/data-grid-body-style.js.map +1 -1
- package/dist/src/data-grid/data-grid-body.d.ts +0 -1
- package/dist/src/data-grid/data-grid-body.js +14 -21
- package/dist/src/data-grid/data-grid-body.js.map +1 -1
- package/dist/src/data-grid/data-grid-field.js +8 -2
- package/dist/src/data-grid/data-grid-field.js.map +1 -1
- package/dist/src/data-grid/data-grid-footer.js +4 -2
- package/dist/src/data-grid/data-grid-footer.js.map +1 -1
- package/dist/src/data-grid/data-grid-header.js +9 -6
- package/dist/src/data-grid/data-grid-header.js.map +1 -1
- package/dist/src/data-grid/data-grid.js +23 -1
- package/dist/src/data-grid/data-grid.js.map +1 -1
- package/dist/src/data-grid/event-handlers/data-grid-body-click-handler.js +3 -0
- package/dist/src/data-grid/event-handlers/data-grid-body-click-handler.js.map +1 -1
- package/dist/src/data-grist.d.ts +10 -2
- package/dist/src/data-grist.js +71 -8
- package/dist/src/data-grist.js.map +1 -1
- package/dist/src/data-list/data-list-field.js +5 -5
- package/dist/src/data-list/data-list-field.js.map +1 -1
- package/dist/src/data-list/data-list-gutter.js +3 -3
- package/dist/src/data-list/data-list-gutter.js.map +1 -1
- package/dist/src/data-list/data-list.js +4 -4
- package/dist/src/data-list/data-list.js.map +1 -1
- package/dist/src/data-list/record-partial.js +9 -10
- package/dist/src/data-list/record-partial.js.map +1 -1
- package/dist/src/data-manipulator.d.ts +1 -1
- package/dist/src/data-manipulator.js +5 -5
- package/dist/src/data-manipulator.js.map +1 -1
- package/dist/src/data-report/data-report-field.js +2 -1
- package/dist/src/data-report/data-report-field.js.map +1 -1
- package/dist/src/data-report/data-report-header.js +2 -2
- package/dist/src/data-report/data-report-header.js.map +1 -1
- package/dist/src/editors/ox-grist-editor-select.js +37 -25
- package/dist/src/editors/ox-grist-editor-select.js.map +1 -1
- package/dist/src/editors/ox-input-tree.js +8 -8
- package/dist/src/editors/ox-input-tree.js.map +1 -1
- package/dist/src/filters/filter-input-barcode.js +1 -0
- package/dist/src/filters/filter-input-barcode.js.map +1 -1
- package/dist/src/filters/filter-select.js +30 -16
- package/dist/src/filters/filter-select.js.map +1 -1
- package/dist/src/filters/filter-styles.js +46 -31
- package/dist/src/filters/filter-styles.js.map +1 -1
- package/dist/src/filters/filters-form.d.ts +15 -4
- package/dist/src/filters/filters-form.js +205 -70
- package/dist/src/filters/filters-form.js.map +1 -1
- package/dist/src/gutters/gutter-dirty.js +2 -2
- package/dist/src/gutters/gutter-dirty.js.map +1 -1
- package/dist/src/index.d.ts +1 -0
- package/dist/src/index.js +1 -0
- package/dist/src/index.js.map +1 -1
- package/dist/src/personalizer/index.d.ts +1 -0
- package/dist/src/personalizer/index.js +2 -0
- package/dist/src/personalizer/index.js.map +1 -0
- package/dist/src/personalizer/ox-grist-filter-personalizer.d.ts +8 -0
- package/dist/src/personalizer/ox-grist-filter-personalizer.js +177 -0
- package/dist/src/personalizer/ox-grist-filter-personalizer.js.map +1 -0
- package/dist/src/personalizer/ox-grist-personalizer.d.ts +8 -0
- package/dist/src/personalizer/ox-grist-personalizer.js +178 -0
- package/dist/src/personalizer/ox-grist-personalizer.js.map +1 -0
- package/dist/src/record-view/record-creator.js +2 -2
- package/dist/src/record-view/record-creator.js.map +1 -1
- package/dist/src/renderers/ox-grist-renderer-select.js +34 -4
- package/dist/src/renderers/ox-grist-renderer-select.js.map +1 -1
- package/dist/src/renderers/ox-grist-renderer-tree.js +8 -8
- package/dist/src/renderers/ox-grist-renderer-tree.js.map +1 -1
- package/dist/src/sorters/sorters-control.js +3 -3
- package/dist/src/sorters/sorters-control.js.map +1 -1
- package/dist/src/types.d.ts +41 -2
- package/dist/src/types.js.map +1 -1
- package/dist/stories/{accumulator.stories.d.ts → accumulator-format.stories.d.ts} +9 -0
- package/dist/stories/{accumulator.stories.js → accumulator-format.stories.js} +24 -12
- package/dist/stories/accumulator-format.stories.js.map +1 -0
- package/dist/stories/barcode-input-filter.stories.d.ts +5 -0
- package/dist/stories/barcode-input-filter.stories.js +29 -5
- package/dist/stories/barcode-input-filter.stories.js.map +1 -1
- package/dist/stories/bounded-select-filters.stories.d.ts +30 -0
- package/dist/stories/bounded-select-filters.stories.js +288 -0
- package/dist/stories/bounded-select-filters.stories.js.map +1 -0
- package/dist/stories/bounded-select-record.stories.d.ts +30 -0
- package/dist/stories/bounded-select-record.stories.js +291 -0
- package/dist/stories/bounded-select-record.stories.js.map +1 -0
- package/dist/stories/click-event.stories.d.ts +41 -0
- package/dist/stories/click-event.stories.js +234 -0
- package/dist/stories/click-event.stories.js.map +1 -0
- package/dist/stories/creatable-only-column.stories.d.ts +5 -0
- package/dist/stories/creatable-only-column.stories.js +46 -21
- package/dist/stories/creatable-only-column.stories.js.map +1 -1
- package/dist/stories/default-filters.stories.d.ts +5 -0
- package/dist/stories/default-filters.stories.js +84 -17
- package/dist/stories/default-filters.stories.js.map +1 -1
- package/dist/stories/dynamic-editable.stories.d.ts +5 -0
- package/dist/stories/dynamic-editable.stories.js +44 -21
- package/dist/stories/dynamic-editable.stories.js.map +1 -1
- package/dist/stories/empty-sorters.stories.d.ts +7 -1
- package/dist/stories/empty-sorters.stories.js +41 -17
- package/dist/stories/empty-sorters.stories.js.map +1 -1
- package/dist/stories/explicit-fetch.stories.d.ts +5 -0
- package/dist/stories/explicit-fetch.stories.js +40 -17
- package/dist/stories/explicit-fetch.stories.js.map +1 -1
- package/dist/stories/fixed-column.stories.d.ts +5 -0
- package/dist/stories/fixed-column.stories.js +53 -30
- package/dist/stories/fixed-column.stories.js.map +1 -1
- package/dist/stories/grid-setting.stories.d.ts +20 -4
- package/dist/stories/grid-setting.stories.js +96 -51
- package/dist/stories/grid-setting.stories.js.map +1 -1
- package/dist/stories/grist-modes.stories.d.ts +8 -2
- package/dist/stories/grist-modes.stories.js +58 -35
- package/dist/stories/grist-modes.stories.js.map +1 -1
- package/dist/stories/group-header.stories.d.ts +5 -0
- package/dist/stories/group-header.stories.js +53 -30
- package/dist/stories/group-header.stories.js.map +1 -1
- package/dist/stories/textarea.stories.d.ts +8 -2
- package/dist/stories/textarea.stories.js +37 -13
- package/dist/stories/textarea.stories.js.map +1 -1
- package/dist/stories/tree-column-with-checkbox.stories.d.ts +5 -0
- package/dist/stories/tree-column-with-checkbox.stories.js +44 -21
- package/dist/stories/tree-column-with-checkbox.stories.js.map +1 -1
- package/dist/stories/tree-column.stories.d.ts +5 -0
- package/dist/stories/tree-column.stories.js +44 -21
- package/dist/stories/tree-column.stories.js.map +1 -1
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/docs/default-value/value-generator/date-generator.md +29 -0
- package/docs/default-value/value-generator/hour-time-generator.md +33 -0
- package/docs/default-value/value-generator/minute-time-generator.md +33 -0
- package/docs/default-value/value-generator/month-date-generator.md +2 -0
- package/docs/default-value/value-generator/now-generator.md +29 -0
- package/docs/default-value/value-generator/time-generator.md +31 -0
- package/docs/default-value/value-generator/today-generator.md +29 -0
- package/docs/default-value/value-generator/week-date-generator.md +31 -0
- package/docs/default-value/value-generator/year-date-generator.md +31 -0
- package/package.json +15 -10
- package/src/data-card/data-card-field.ts +2 -2
- package/src/data-card/data-card-gutter-menu.ts +5 -5
- package/src/data-card/data-card-gutter.ts +6 -6
- package/src/data-card/data-card.ts +7 -9
- package/src/data-card/record-card.ts +9 -10
- package/src/data-grid/data-grid-accum-field.ts +11 -5
- package/src/data-grid/data-grid-body-style.ts +12 -0
- package/src/data-grid/data-grid-body.ts +16 -29
- package/src/data-grid/data-grid-field.ts +7 -2
- package/src/data-grid/data-grid-footer.ts +4 -2
- package/src/data-grid/data-grid-header.ts +8 -6
- package/src/data-grid/data-grid.ts +23 -1
- package/src/data-grid/event-handlers/data-grid-body-click-handler.ts +4 -0
- package/src/data-grist.ts +88 -8
- package/src/data-list/data-list-field.ts +5 -5
- package/src/data-list/data-list-gutter.ts +3 -3
- package/src/data-list/data-list.ts +4 -4
- package/src/data-list/record-partial.ts +9 -10
- package/src/data-manipulator.ts +5 -5
- package/src/data-report/data-report-field.ts +2 -1
- package/src/data-report/data-report-header.ts +2 -2
- package/src/editors/ox-grist-editor-select.ts +41 -28
- package/src/editors/ox-input-tree.ts +8 -8
- package/src/filters/filter-input-barcode.ts +1 -0
- package/src/filters/filter-select.ts +41 -28
- package/src/filters/filter-styles.ts +46 -31
- package/src/filters/filters-form.ts +273 -119
- package/src/gutters/gutter-dirty.ts +2 -2
- package/src/index.ts +1 -0
- package/src/personalizer/index.ts +1 -0
- package/src/personalizer/ox-grist-filter-personalizer.ts +191 -0
- package/src/personalizer/ox-grist-personalizer.ts +192 -0
- package/src/record-view/record-creator.ts +2 -2
- package/src/renderers/ox-grist-renderer-select.ts +41 -6
- package/src/renderers/ox-grist-renderer-tree.ts +8 -8
- package/src/sorters/sorters-control.ts +3 -3
- package/src/types.ts +53 -2
- package/stories/{accumulator.stories.ts → accumulator-format.stories.ts} +33 -12
- package/stories/barcode-input-filter.stories.ts +31 -6
- package/stories/bounded-select-filters.stories.ts +339 -0
- package/stories/bounded-select-record.stories.ts +342 -0
- package/stories/click-event.stories.ts +269 -0
- package/stories/creatable-only-column.stories.ts +54 -28
- package/stories/default-filters.stories.ts +92 -24
- package/stories/dynamic-editable.stories.ts +52 -28
- package/stories/empty-sorters.stories.ts +51 -25
- package/stories/explicit-fetch.stories.ts +48 -24
- package/stories/fixed-column.stories.ts +62 -39
- package/stories/grid-setting.stories.ts +120 -63
- package/stories/grist-modes.stories.ts +74 -46
- package/stories/group-header.stories.ts +61 -39
- package/stories/textarea.stories.ts +49 -17
- package/stories/tree-column-with-checkbox.stories.ts +52 -28
- package/stories/tree-column.stories.ts +52 -28
- package/themes/dark-hc.css +151 -0
- package/themes/dark-mc.css +151 -0
- package/themes/dark.css +151 -0
- package/themes/grist-theme.css +103 -100
- package/themes/light-hc.css +151 -0
- package/themes/light-mc.css +151 -0
- package/themes/light.css +151 -0
- package/themes/md-typescale-styles.css +100 -0
- package/themes/spacing.css +43 -0
- package/themes/state-color.css +6 -0
- package/dist/stories/accumulator.stories.js.map +0 -1
- package/themes/app-theme.css +0 -145
- package/themes/form-theme.css +0 -75
- package/themes/oops-theme.css +0 -26
- package/themes/report-theme.css +0 -47
@@ -5,10 +5,11 @@ import '@operato/popup/ox-popup-list.js';
|
|
5
5
|
import '@operato/input/ox-input-search.js';
|
6
6
|
import { css, html, LitElement } from 'lit';
|
7
7
|
import { customElement, property, queryAsync, state } from 'lit/decorators.js';
|
8
|
+
import { styles as MDTypeScaleStyles } from '@material/web/typography/md-typescale-styles';
|
8
9
|
import { getDefaultValue } from '@operato/time-calculator';
|
9
10
|
import { FilterStyles } from './filter-styles';
|
10
11
|
import { getFilterRenderer } from './registry';
|
11
|
-
let
|
12
|
+
let OxFiltersForm = class OxFiltersForm extends LitElement {
|
12
13
|
constructor() {
|
13
14
|
super(...arguments);
|
14
15
|
this.value = [];
|
@@ -17,12 +18,14 @@ let FiltersForm = class FiltersForm extends LitElement {
|
|
17
18
|
this.empty = true;
|
18
19
|
this.filterColumns = [];
|
19
20
|
this.searchColumns = [];
|
21
|
+
this.autoUpdateTargetsOnChange = {};
|
20
22
|
}
|
21
23
|
connectedCallback() {
|
22
24
|
super.connectedCallback();
|
23
25
|
const grist = this.closest('ox-grist');
|
24
26
|
if (grist) {
|
25
27
|
this.config = grist.compiledConfig;
|
28
|
+
this.personalConfigProvider = grist.personalConfigProvider;
|
26
29
|
grist.addEventListener('config-change', (e) => {
|
27
30
|
this.config = e.detail;
|
28
31
|
});
|
@@ -34,14 +37,33 @@ let FiltersForm = class FiltersForm extends LitElement {
|
|
34
37
|
this.value = filters;
|
35
38
|
});
|
36
39
|
this.renderRoot.addEventListener('change', async (e) => {
|
37
|
-
|
38
|
-
|
39
|
-
|
40
|
-
|
41
|
-
|
42
|
-
|
43
|
-
|
44
|
-
|
40
|
+
const { target, detail: value } = e;
|
41
|
+
const name = target.name;
|
42
|
+
const { filter } = this.filterColumns.find(filter => filter.name == name) || {};
|
43
|
+
if (this.autoUpdateTargetsOnChange[name]) {
|
44
|
+
/* 일단은 심플하게, boundTo로 연결된 필터값이 바뀌면, 폼 전체를 update하도록 함. */
|
45
|
+
;
|
46
|
+
(this.autoUpdateTargetsOnChange[name] || []).forEach(name => {
|
47
|
+
const target = this.renderRoot.querySelector(`[name='${name}']`);
|
48
|
+
if (target) {
|
49
|
+
;
|
50
|
+
target.value = '';
|
51
|
+
}
|
52
|
+
});
|
53
|
+
await this.updateObjectValues();
|
54
|
+
this.requestUpdate();
|
55
|
+
}
|
56
|
+
const onchange = typeof filter == 'object' ? filter.onchange : null;
|
57
|
+
const keepGoing = onchange ? await onchange.call(null, value !== null && value !== void 0 ? value : target.value, this) : true;
|
58
|
+
keepGoing &&
|
59
|
+
this.dispatchEvent(new CustomEvent('fetch-params-change', {
|
60
|
+
bubbles: true,
|
61
|
+
composed: true,
|
62
|
+
detail: {
|
63
|
+
filters: await this.getQueryFilters(),
|
64
|
+
from: 'filters-form'
|
65
|
+
}
|
66
|
+
}));
|
45
67
|
});
|
46
68
|
}
|
47
69
|
}
|
@@ -56,25 +78,12 @@ let FiltersForm = class FiltersForm extends LitElement {
|
|
56
78
|
return getDefaultValue(defaultValue, this);
|
57
79
|
}
|
58
80
|
}
|
59
|
-
updated(changes) {
|
60
|
-
if (changes.has('
|
61
|
-
|
62
|
-
|
63
|
-
|
64
|
-
|
65
|
-
});
|
66
|
-
this.searchColumns = filters.filter(columnConfig => {
|
67
|
-
const filter = columnConfig.filter;
|
68
|
-
return filter.operator === 'search';
|
69
|
-
});
|
70
|
-
const grist = this.closest('ox-grist');
|
71
|
-
this.value = ((grist === null || grist === void 0 ? void 0 : grist.filters) || []).map(filter => {
|
72
|
-
return {
|
73
|
-
...filter,
|
74
|
-
value: this.buildDefaultValue(filter.operator, filter.value)
|
75
|
-
};
|
76
|
-
});
|
77
|
-
this.empty = (this.searchColumns.length === 0 || this.withoutSearch) && this.filterColumns.length === 0;
|
81
|
+
async updated(changes) {
|
82
|
+
if (changes.has('personalConfigProvider') && this.personalConfigProvider) {
|
83
|
+
this.personalConfig = await this.personalConfigProvider.load();
|
84
|
+
}
|
85
|
+
else if (changes.has('config') || changes.has('personalConfig')) {
|
86
|
+
this.applyUpdatedConfiguration();
|
78
87
|
}
|
79
88
|
}
|
80
89
|
render() {
|
@@ -84,6 +93,7 @@ let FiltersForm = class FiltersForm extends LitElement {
|
|
84
93
|
? html ``
|
85
94
|
: html `
|
86
95
|
<form
|
96
|
+
class="md-typescale-body-medium-prominent"
|
87
97
|
@submit=${(e) => {
|
88
98
|
e.stopPropagation();
|
89
99
|
e.preventDefault();
|
@@ -91,15 +101,17 @@ let FiltersForm = class FiltersForm extends LitElement {
|
|
91
101
|
grist && grist.fetch();
|
92
102
|
}}
|
93
103
|
>
|
94
|
-
${this.
|
95
|
-
|
96
|
-
|
97
|
-
<ox-input-search name="search" .value=${searchValue} ?autofocus=${this.autofocus}></ox-input-search>
|
98
|
-
`}
|
99
|
-
${this.filterColumns.map((column) => {
|
104
|
+
${this.filterColumns
|
105
|
+
.filter(column => !column.filter.hidden)
|
106
|
+
.map((column) => {
|
100
107
|
var _a, _b, _c;
|
101
108
|
const { name, header, label, filter } = column;
|
102
109
|
const type = filter.type;
|
110
|
+
if (type == 'search') {
|
111
|
+
return html `
|
112
|
+
<ox-input-search name="search" .value=${searchValue} ?autofocus=${this.autofocus}></ox-input-search>
|
113
|
+
`;
|
114
|
+
}
|
103
115
|
const operator = filter.operator;
|
104
116
|
const filterLabel = filter.label;
|
105
117
|
const labelText = filterLabel !== undefined
|
@@ -119,17 +131,17 @@ let FiltersForm = class FiltersForm extends LitElement {
|
|
119
131
|
? renderer(column, value, this)
|
120
132
|
: type !== 'select' && labelText
|
121
133
|
? html `<label filter-title ?between=${operator === 'between'}
|
122
|
-
|
123
|
-
|
134
|
+
><span>${labelText}</span> ${renderer(column, value, this)}
|
135
|
+
</label> `
|
124
136
|
: type !== 'select' && !labelText
|
125
137
|
? renderer(column, value, this)
|
126
138
|
: operator === 'in'
|
127
139
|
? html `
|
128
|
-
|
129
|
-
|
130
|
-
|
131
|
-
|
132
|
-
|
140
|
+
<ox-select
|
141
|
+
name=${name}
|
142
|
+
placeholder=${labelText}
|
143
|
+
.value=${value}
|
144
|
+
@change=${(e) => {
|
133
145
|
var _a;
|
134
146
|
return (_a = e.target) === null || _a === void 0 ? void 0 : _a.dispatchEvent(new CustomEvent('filter-change', {
|
135
147
|
detail: {
|
@@ -139,18 +151,18 @@ let FiltersForm = class FiltersForm extends LitElement {
|
|
139
151
|
}
|
140
152
|
}));
|
141
153
|
}}
|
142
|
-
|
143
|
-
|
144
|
-
|
145
|
-
|
146
|
-
|
147
|
-
|
154
|
+
>
|
155
|
+
<ox-popup-list multiple attr-selected="checked" with-search>
|
156
|
+
${renderer(column, value, this)}
|
157
|
+
</ox-popup-list>
|
158
|
+
</ox-select>
|
159
|
+
`
|
148
160
|
: html `
|
149
|
-
|
150
|
-
|
151
|
-
|
152
|
-
|
153
|
-
|
161
|
+
<ox-select
|
162
|
+
name=${name}
|
163
|
+
placeholder=${labelText}
|
164
|
+
.value=${value}
|
165
|
+
@change=${(e) => {
|
154
166
|
var _a;
|
155
167
|
return (_a = e.target) === null || _a === void 0 ? void 0 : _a.dispatchEvent(new CustomEvent('filter-change', {
|
156
168
|
detail: {
|
@@ -160,14 +172,95 @@ let FiltersForm = class FiltersForm extends LitElement {
|
|
160
172
|
}
|
161
173
|
}));
|
162
174
|
}}
|
163
|
-
|
164
|
-
|
165
|
-
|
166
|
-
|
175
|
+
>
|
176
|
+
<ox-popup-list with-search> ${renderer(column, value, this)} </ox-popup-list>
|
177
|
+
</ox-select>
|
178
|
+
`;
|
167
179
|
})}
|
168
180
|
</form>
|
181
|
+
<slot name="setting"></slot>
|
169
182
|
`;
|
170
183
|
}
|
184
|
+
applyUpdatedConfiguration() {
|
185
|
+
var _a;
|
186
|
+
if (!this.config) {
|
187
|
+
return;
|
188
|
+
}
|
189
|
+
const filters = this.config.columns.filter(columnConfig => !!columnConfig.filter);
|
190
|
+
this.filterColumns = filters.filter((columnConfig) => {
|
191
|
+
const filter = columnConfig.filter;
|
192
|
+
return filter.operator !== 'search';
|
193
|
+
});
|
194
|
+
this.searchColumns = filters.filter(columnConfig => {
|
195
|
+
const filter = columnConfig.filter;
|
196
|
+
return filter.operator === 'search';
|
197
|
+
});
|
198
|
+
if (this.searchColumns.length > 0 && !this.withoutSearch) {
|
199
|
+
this.filterColumns.unshift({ name: 'search', filter: { type: 'search' } });
|
200
|
+
}
|
201
|
+
if (!this.personalConfig) {
|
202
|
+
this.personalFilters = this.filterColumns.map(column => {
|
203
|
+
return { name: column.name };
|
204
|
+
});
|
205
|
+
}
|
206
|
+
else {
|
207
|
+
const { filters: personalFilters = [] } = this.personalConfig;
|
208
|
+
if (personalFilters) {
|
209
|
+
const xfilters = this.filterColumns.map(column => {
|
210
|
+
return personalFilters.find(pFilter => pFilter.name == column.name) || { name: column.name };
|
211
|
+
});
|
212
|
+
function reorderList(a, b) {
|
213
|
+
// 결과 배열 초기화, a 배열 길이만큼 undefined로 채움
|
214
|
+
const result = new Array(a.length);
|
215
|
+
// b 배열에 없는 아이템은 원래 위치로 채움
|
216
|
+
a.forEach((item, index) => {
|
217
|
+
if (!item.name || !b.find(bi => bi.name == item.name)) {
|
218
|
+
result[index] = item;
|
219
|
+
}
|
220
|
+
});
|
221
|
+
b.forEach(item => {
|
222
|
+
const ai = a.find(ai => ai.name == item.name);
|
223
|
+
if (ai) {
|
224
|
+
result[result.findIndex(slot => slot === undefined)] = ai;
|
225
|
+
}
|
226
|
+
});
|
227
|
+
return result;
|
228
|
+
}
|
229
|
+
// 배열 재정렬 실행
|
230
|
+
this.personalFilters = reorderList(xfilters, personalFilters);
|
231
|
+
this.filterColumns = this.personalFilters
|
232
|
+
.map(filter => {
|
233
|
+
const column = this.filterColumns.find(column => column.name == filter.name);
|
234
|
+
if (column === null || column === void 0 ? void 0 : column.filter) {
|
235
|
+
;
|
236
|
+
column.filter.hidden = filter.hidden;
|
237
|
+
}
|
238
|
+
return column;
|
239
|
+
})
|
240
|
+
.filter(Boolean);
|
241
|
+
}
|
242
|
+
}
|
243
|
+
const grist = this.closest('ox-grist');
|
244
|
+
this.value = ((grist === null || grist === void 0 ? void 0 : grist.filters) || []).map(filter => {
|
245
|
+
return {
|
246
|
+
...filter,
|
247
|
+
value: this.buildDefaultValue(filter.operator, filter.value)
|
248
|
+
};
|
249
|
+
});
|
250
|
+
this.empty = (this.searchColumns.length === 0 || this.withoutSearch) && this.filterColumns.length === 0;
|
251
|
+
this.autoUpdateTargetsOnChange = {};
|
252
|
+
(_a = this.filterColumns) === null || _a === void 0 ? void 0 : _a.filter(({ filter }) => {
|
253
|
+
return typeof filter == 'object' && filter.boundTo && filter.boundTo.length > 0;
|
254
|
+
}).map(({ name, filter }) => {
|
255
|
+
const boundTo = filter.boundTo;
|
256
|
+
boundTo.forEach(to => {
|
257
|
+
const origin = this.autoUpdateTargetsOnChange[to] || [];
|
258
|
+
if (name && !origin.includes(name)) {
|
259
|
+
this.autoUpdateTargetsOnChange[to] = [...origin, name];
|
260
|
+
}
|
261
|
+
});
|
262
|
+
});
|
263
|
+
}
|
171
264
|
async getQueryFilters() {
|
172
265
|
var _a;
|
173
266
|
const form = await this.form;
|
@@ -176,6 +269,7 @@ let FiltersForm = class FiltersForm extends LitElement {
|
|
176
269
|
const formData = new FormData(form);
|
177
270
|
const search = (_a = formData.get('search')) === null || _a === void 0 ? void 0 : _a.toString();
|
178
271
|
var filters = this.filterColumns
|
272
|
+
.filter(column => column.name !== 'search' && !column.filter.hidden)
|
179
273
|
.map((column) => {
|
180
274
|
const { name, type, filter } = column;
|
181
275
|
const operator = filter.operator;
|
@@ -231,12 +325,43 @@ let FiltersForm = class FiltersForm extends LitElement {
|
|
231
325
|
const input = this.renderRoot.querySelector(`form [name="${name}"]`);
|
232
326
|
return input === null || input === void 0 ? void 0 : input.value;
|
233
327
|
}
|
328
|
+
async updateObjectValues() {
|
329
|
+
const form = await this.form;
|
330
|
+
if (!form)
|
331
|
+
return [];
|
332
|
+
const formData = new FormData(form);
|
333
|
+
const object = {};
|
334
|
+
formData.forEach((value, key) => {
|
335
|
+
const prev = object[key];
|
336
|
+
if (key in object) {
|
337
|
+
object[key] = prev instanceof Array ? [...prev, value] : [prev, value];
|
338
|
+
}
|
339
|
+
else {
|
340
|
+
object[key] = value;
|
341
|
+
}
|
342
|
+
});
|
343
|
+
this.objectValue = object;
|
344
|
+
}
|
345
|
+
getFormObjectValue() {
|
346
|
+
return this.objectValue;
|
347
|
+
}
|
348
|
+
reset() {
|
349
|
+
this.form
|
350
|
+
.then((form) => {
|
351
|
+
form.reset();
|
352
|
+
})
|
353
|
+
.catch((error) => {
|
354
|
+
console.error('Error resetting the form:', error);
|
355
|
+
});
|
356
|
+
}
|
234
357
|
};
|
235
|
-
|
358
|
+
OxFiltersForm.styles = [
|
359
|
+
MDTypeScaleStyles,
|
236
360
|
FilterStyles,
|
237
361
|
css `
|
238
362
|
:host {
|
239
363
|
display: flex;
|
364
|
+
padding: var(--spacing-small);
|
240
365
|
}
|
241
366
|
|
242
367
|
form {
|
@@ -258,38 +383,48 @@ FiltersForm.styles = [
|
|
258
383
|
}
|
259
384
|
|
260
385
|
@media only screen and (max-width: 460px) {
|
261
|
-
|
262
|
-
|
386
|
+
form {
|
387
|
+
flex-direction: column;
|
388
|
+
flex-flow: column;
|
263
389
|
}
|
264
390
|
}
|
265
391
|
`
|
266
392
|
];
|
267
393
|
__decorate([
|
268
394
|
property({ type: Array })
|
269
|
-
],
|
395
|
+
], OxFiltersForm.prototype, "value", void 0);
|
270
396
|
__decorate([
|
271
397
|
property({ type: Boolean, attribute: 'without-search' })
|
272
|
-
],
|
398
|
+
], OxFiltersForm.prototype, "withoutSearch", void 0);
|
273
399
|
__decorate([
|
274
400
|
property({ type: Boolean, attribute: 'autofocus' })
|
275
|
-
],
|
401
|
+
], OxFiltersForm.prototype, "autofocus", void 0);
|
276
402
|
__decorate([
|
277
403
|
property({ type: Boolean, attribute: 'empty', reflect: true })
|
278
|
-
],
|
404
|
+
], OxFiltersForm.prototype, "empty", void 0);
|
405
|
+
__decorate([
|
406
|
+
state()
|
407
|
+
], OxFiltersForm.prototype, "personalConfigProvider", void 0);
|
408
|
+
__decorate([
|
409
|
+
state()
|
410
|
+
], OxFiltersForm.prototype, "personalConfig", void 0);
|
411
|
+
__decorate([
|
412
|
+
state()
|
413
|
+
], OxFiltersForm.prototype, "personalFilters", void 0);
|
279
414
|
__decorate([
|
280
415
|
state()
|
281
|
-
],
|
416
|
+
], OxFiltersForm.prototype, "config", void 0);
|
282
417
|
__decorate([
|
283
418
|
state()
|
284
|
-
],
|
419
|
+
], OxFiltersForm.prototype, "filterColumns", void 0);
|
285
420
|
__decorate([
|
286
421
|
state()
|
287
|
-
],
|
422
|
+
], OxFiltersForm.prototype, "searchColumns", void 0);
|
288
423
|
__decorate([
|
289
424
|
queryAsync('form')
|
290
|
-
],
|
291
|
-
|
425
|
+
], OxFiltersForm.prototype, "form", void 0);
|
426
|
+
OxFiltersForm = __decorate([
|
292
427
|
customElement('ox-filters-form')
|
293
|
-
],
|
294
|
-
export {
|
428
|
+
], OxFiltersForm);
|
429
|
+
export { OxFiltersForm };
|
295
430
|
//# sourceMappingURL=filters-form.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"filters-form.js","sourceRoot":"","sources":["../../../src/filters/filters-form.ts"],"names":[],"mappings":"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","sourcesContent":["import '@operato/input/ox-checkbox.js'\nimport '@operato/input/ox-select.js'\nimport '@operato/popup/ox-popup-list.js'\nimport '@operato/input/ox-input-search.js'\n\nimport { css, html, LitElement, PropertyValues, TemplateResult, nothing } from 'lit'\nimport { customElement, property, queryAsync, state } from 'lit/decorators.js'\n\nimport { getDefaultValue } from '@operato/time-calculator'\n\nimport { FilterConfigObject } from '..'\nimport { DataGrist } from '../data-grist'\nimport { ColumnConfig, FilterOperator, FilterValue, GristConfig } from '../types'\nimport { FilterStyles } from './filter-styles'\nimport { getFilterRenderer } from './registry'\n\nexport type QueryFilterRangeValue = [from: number, to: number]\n\nexport type QueryFilter = {\n name: string\n operator: FilterOperator\n value: any\n}\n\n@customElement('ox-filters-form')\nexport class FiltersForm extends LitElement {\n static styles = [\n FilterStyles,\n css`\n :host {\n display: flex;\n }\n\n form {\n flex: 1;\n\n display: flex;\n flex-flow: row wrap;\n gap: var(--ox-filters-form-gap);\n }\n\n form > * {\n display: flex;\n align-items: center;\n gap: var(--input-intra-gap, 7px);\n }\n\n label span {\n display: block;\n }\n\n @media only screen and (max-width: 460px) {\n label[between] {\n display: block;\n }\n }\n `\n ]\n\n @property({ type: Array }) value: FilterValue[] = []\n @property({ type: Boolean, attribute: 'without-search' }) withoutSearch: boolean = false\n @property({ type: Boolean, attribute: 'autofocus' }) autofocus: boolean = true\n @property({ type: Boolean, attribute: 'empty', reflect: true }) empty: boolean = true\n\n @state() config!: GristConfig\n @state() filterColumns: ColumnConfig[] = []\n @state() searchColumns: ColumnConfig[] = []\n\n @queryAsync('form') form!: HTMLFormElement\n\n connectedCallback(): void {\n super.connectedCallback()\n\n const grist = this.closest('ox-grist') as DataGrist\n\n if (grist) {\n this.config = grist.compiledConfig\n\n grist.addEventListener('config-change', (e: Event) => {\n this.config = (e as CustomEvent).detail\n })\n\n grist.addEventListener('fetch-params-change', (e: Event) => {\n const { filters, from } = (e as CustomEvent).detail || {}\n if (from === 'filters-form') {\n return\n }\n\n this.value = filters\n })\n\n this.renderRoot.addEventListener('change', async (e: Event) => {\n this.dispatchEvent(\n new CustomEvent('fetch-params-change', {\n bubbles: true,\n composed: true,\n detail: {\n filters: await this.getQueryFilters(),\n from: 'filters-form'\n }\n })\n )\n })\n }\n }\n\n buildDefaultValue(operator: string, defaultValue: any) {\n if (defaultValue === undefined) {\n return\n }\n if (operator == 'between') {\n return (defaultValue as Array<any>).map(v => getDefaultValue(v, this))\n } else {\n return getDefaultValue(defaultValue, this)\n }\n }\n\n updated(changes: PropertyValues<this>) {\n if (changes.has('config')) {\n const filters = this.config.columns.filter(columnConfig => !!columnConfig.filter)\n this.filterColumns = filters.filter((columnConfig: ColumnConfig) => {\n const filter = columnConfig.filter as FilterConfigObject\n return filter!.operator !== 'search'\n })\n this.searchColumns = filters.filter(columnConfig => {\n const filter = columnConfig.filter as FilterConfigObject\n return filter!.operator === 'search'\n })\n\n const grist = this.closest('ox-grist') as DataGrist\n\n this.value = (grist?.filters || []).map(filter => {\n return {\n ...filter,\n value: this.buildDefaultValue(filter!.operator, filter!.value)\n }\n })\n\n this.empty = (this.searchColumns.length === 0 || this.withoutSearch) && this.filterColumns.length === 0\n }\n }\n\n render(): TemplateResult {\n const searchValue =\n (this.value?.find(filter => filter.operator === 'search')?.value as string)?.match(/^\\%(.*)\\%$/)?.[1] || ''\n\n return this.empty\n ? html``\n : html`\n <form\n @submit=${(e: Event) => {\n e.stopPropagation()\n e.preventDefault()\n\n const grist = this.closest('ox-grist') as DataGrist\n\n grist && grist.fetch()\n }}\n >\n ${this.searchColumns.length === 0 || this.withoutSearch\n ? html``\n : html`\n <ox-input-search name=\"search\" .value=${searchValue} ?autofocus=${this.autofocus}></ox-input-search>\n `}\n ${this.filterColumns.map((column: ColumnConfig) => {\n const { name, header, label, filter } = column\n\n const type = (filter as FilterConfigObject).type\n const operator = (filter as FilterConfigObject).operator\n const filterLabel = (filter as FilterConfigObject).label\n\n const labelText =\n filterLabel !== undefined\n ? filterLabel\n : typeof label === 'object' && label.renderer\n ? label.renderer(column)\n : header.renderer(column) || name\n\n const idx = operator === 'between' ? 1 : 0\n const renderer = getFilterRenderer(\n operator === 'like' || operator === 'i_like' || operator === 'i_nlike' || operator === 'nlike'\n ? 'text'\n : type\n )[idx]\n const value =\n this.value?.find(filter => filter.name == name)?.value ??\n this.buildDefaultValue(operator!, (filter as FilterConfigObject)?.value)\n\n if (!renderer) {\n return html``\n }\n\n return type === 'boolean' || type === 'checkbox'\n ? renderer(column, value, this)\n : type !== 'select' && labelText\n ? html`<label filter-title ?between=${operator === 'between'}\n ><span>${labelText}</span> ${renderer(column, value, this)}\n </label> `\n : type !== 'select' && !labelText\n ? renderer(column, value, this)\n : operator === 'in'\n ? html`\n <ox-select\n name=${name}\n placeholder=${labelText}\n .value=${value}\n @change=${(e: CustomEvent) =>\n e.target?.dispatchEvent(\n new CustomEvent('filter-change', {\n detail: {\n name,\n operator,\n value: e.detail\n }\n })\n )}\n >\n <ox-popup-list multiple attr-selected=\"checked\" with-search>\n ${renderer(column, value, this)}\n </ox-popup-list>\n </ox-select>\n `\n : html`\n <ox-select\n name=${name}\n placeholder=${labelText}\n .value=${value}\n @change=${(e: CustomEvent) =>\n e.target?.dispatchEvent(\n new CustomEvent('filter-change', {\n detail: {\n name,\n operator,\n value: e.detail\n }\n })\n )}\n >\n <ox-popup-list with-search> ${renderer(column, value, this)} </ox-popup-list>\n </ox-select>\n `\n })}\n </form>\n `\n }\n\n async getQueryFilters(): Promise<QueryFilter[]> {\n const form = await this.form\n if (!form) return []\n\n const formData = new FormData(form)\n const search: string | undefined = formData.get('search')?.toString()\n\n var filters = this.filterColumns\n .map((column: ColumnConfig) => {\n const { name, type, filter } = column\n const operator = (filter as FilterConfigObject).operator\n\n var value = formData.getAll(name)\n if (value.length == 0) {\n return\n }\n\n if (-1 === value.findIndex(v => v !== '')) {\n return\n }\n\n const filterValue = value.map(v => {\n const value = v.toString()\n\n /* TODO registry에서 타입별로 parsing 방법을 지정할 수 있도록 해야한다. */\n switch (type) {\n case 'integer':\n case 'float':\n case 'number':\n case 'progress':\n case 'checkbox':\n case 'boolean':\n return !value ? undefined : JSON.parse(value)\n default:\n return value\n }\n })\n\n return {\n name,\n operator,\n value: filterValue.length === 1 ? filterValue[0] : filterValue\n }\n })\n .filter(result => result !== undefined) as QueryFilter[]\n\n if (search) {\n filters = filters.concat(\n this.searchColumns.map((column: ColumnConfig) => {\n const { name } = column\n\n return {\n name,\n operator: 'search',\n value: `%${search}%`\n }\n })\n )\n }\n\n return filters\n }\n\n public setInputValue(name: string, value: any) {\n const input = this.renderRoot.querySelector(`form [name=\"${name}\"]`) as HTMLInputElement\n if (input) {\n input.value = value\n input.dispatchEvent(new Event('change', { bubbles: true }))\n }\n }\n\n public getInputValue(name: string): any {\n const input = this.renderRoot.querySelector(`form [name=\"${name}\"]`) as HTMLInputElement\n return input?.value\n }\n}\n"]}
|
1
|
+
{"version":3,"file":"filters-form.js","sourceRoot":"","sources":["../../../src/filters/filters-form.ts"],"names":[],"mappings":"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","sourcesContent":["import '@operato/input/ox-checkbox.js'\nimport '@operato/input/ox-select.js'\nimport '@operato/popup/ox-popup-list.js'\nimport '@operato/input/ox-input-search.js'\n\nimport { css, html, LitElement, PropertyValues, TemplateResult, nothing } from 'lit'\nimport { customElement, property, queryAsync, state } from 'lit/decorators.js'\nimport { styles as MDTypeScaleStyles } from '@material/web/typography/md-typescale-styles'\n\nimport { PagePreferenceProvider } from '@operato/p13n'\nimport { getDefaultValue } from '@operato/time-calculator'\n\nimport { FilterConfigObject, FilterPreference } from '../types.js'\nimport { DataGrist } from '../data-grist'\nimport { ColumnConfig, FilterOperator, FilterValue, GristConfig, PersonalGristPreference } from '../types'\nimport { FilterStyles } from './filter-styles'\nimport { getFilterRenderer } from './registry'\n\nexport type QueryFilterRangeValue = [from: number, to: number]\n\nexport type QueryFilter = {\n name: string\n operator: FilterOperator\n value: any\n}\n\n@customElement('ox-filters-form')\nexport class OxFiltersForm extends LitElement {\n static styles = [\n MDTypeScaleStyles,\n FilterStyles,\n css`\n :host {\n display: flex;\n padding: var(--spacing-small);\n }\n\n form {\n flex: 1;\n\n display: flex;\n flex-flow: row wrap;\n gap: var(--ox-filters-form-gap);\n }\n\n form > * {\n display: flex;\n align-items: center;\n gap: var(--input-intra-gap, 7px);\n }\n\n label span {\n display: block;\n }\n\n @media only screen and (max-width: 460px) {\n form {\n flex-direction: column;\n flex-flow: column;\n }\n }\n `\n ]\n\n @property({ type: Array }) value: FilterValue[] = []\n @property({ type: Boolean, attribute: 'without-search' }) withoutSearch: boolean = false\n @property({ type: Boolean, attribute: 'autofocus' }) autofocus: boolean = true\n @property({ type: Boolean, attribute: 'empty', reflect: true }) empty: boolean = true\n\n @state() personalConfigProvider?: PagePreferenceProvider\n @state() personalConfig?: PersonalGristPreference\n @state() personalFilters?: FilterPreference[]\n\n @state() config!: GristConfig\n @state() filterColumns: ColumnConfig[] = []\n @state() searchColumns: ColumnConfig[] = []\n\n @queryAsync('form') form!: HTMLFormElement\n\n private autoUpdateTargetsOnChange: { [name: string]: string[] } = {}\n private objectValue?: object\n\n connectedCallback(): void {\n super.connectedCallback()\n\n const grist = this.closest('ox-grist') as DataGrist\n\n if (grist) {\n this.config = grist.compiledConfig\n this.personalConfigProvider = grist.personalConfigProvider\n\n grist.addEventListener('config-change', (e: Event) => {\n this.config = (e as CustomEvent).detail\n })\n\n grist.addEventListener('fetch-params-change', (e: Event) => {\n const { filters, from } = (e as CustomEvent).detail || {}\n if (from === 'filters-form') {\n return\n }\n\n this.value = filters\n })\n\n this.renderRoot.addEventListener('change', async (e: Event) => {\n const { target, detail: value } = e as CustomEvent\n const name = (target as HTMLInputElement).name\n const { filter } = this.filterColumns.find(filter => filter.name == name) || {}\n\n if (this.autoUpdateTargetsOnChange[name]) {\n /* 일단은 심플하게, boundTo로 연결된 필터값이 바뀌면, 폼 전체를 update하도록 함. */\n ;(this.autoUpdateTargetsOnChange[name] || []).forEach(name => {\n const target = this.renderRoot.querySelector(`[name='${name}']`)\n if (target) {\n ;(target as HTMLInputElement).value = ''\n }\n })\n\n await this.updateObjectValues()\n this.requestUpdate()\n }\n\n const onchange = typeof filter == 'object' ? filter.onchange : null\n const keepGoing = onchange ? await onchange.call(null, value ?? (target as HTMLInputElement).value, this) : true\n\n keepGoing &&\n this.dispatchEvent(\n new CustomEvent('fetch-params-change', {\n bubbles: true,\n composed: true,\n detail: {\n filters: await this.getQueryFilters(),\n from: 'filters-form'\n }\n })\n )\n })\n }\n }\n\n buildDefaultValue(operator: FilterOperator, defaultValue: any) {\n if (defaultValue === undefined) {\n return\n }\n if (operator == 'between') {\n return (defaultValue as Array<any>).map(v => getDefaultValue(v, this))\n } else {\n return getDefaultValue(defaultValue, this)\n }\n }\n\n async updated(changes: PropertyValues<this>) {\n if (changes.has('personalConfigProvider') && this.personalConfigProvider) {\n this.personalConfig = await this.personalConfigProvider.load()\n } else if (changes.has('config') || changes.has('personalConfig')) {\n this.applyUpdatedConfiguration()\n }\n }\n\n render(): TemplateResult {\n const searchValue =\n (this.value?.find(filter => filter.operator === 'search')?.value as string)?.match(/^\\%(.*)\\%$/)?.[1] || ''\n\n return this.empty\n ? html``\n : html`\n <form\n class=\"md-typescale-body-medium-prominent\"\n @submit=${(e: Event) => {\n e.stopPropagation()\n e.preventDefault()\n\n const grist = this.closest('ox-grist') as DataGrist\n\n grist && grist.fetch()\n }}\n >\n ${this.filterColumns\n .filter(column => !(column.filter as FilterConfigObject).hidden)\n .map((column: ColumnConfig) => {\n const { name, header, label, filter } = column\n\n const type = (filter as FilterConfigObject).type\n\n if (type == 'search') {\n return html`\n <ox-input-search name=\"search\" .value=${searchValue} ?autofocus=${this.autofocus}></ox-input-search>\n `\n }\n\n const operator = (filter as FilterConfigObject).operator\n const filterLabel = (filter as FilterConfigObject).label\n\n const labelText =\n filterLabel !== undefined\n ? filterLabel\n : typeof label === 'object' && label.renderer\n ? label.renderer(column)\n : header.renderer(column) || name\n\n const idx = operator === 'between' ? 1 : 0\n const renderer = getFilterRenderer(\n operator === 'like' || operator === 'i_like' || operator === 'i_nlike' || operator === 'nlike'\n ? 'text'\n : type\n )[idx]\n const value =\n this.value?.find(filter => filter.name == name)?.value ??\n this.buildDefaultValue(operator!, (filter as FilterConfigObject)?.value)\n\n if (!renderer) {\n return html``\n }\n\n return type === 'boolean' || type === 'checkbox'\n ? renderer(column, value, this)\n : type !== 'select' && labelText\n ? html`<label filter-title ?between=${operator === 'between'}\n ><span>${labelText}</span> ${renderer(column, value, this)}\n </label> `\n : type !== 'select' && !labelText\n ? renderer(column, value, this)\n : operator === 'in'\n ? html`\n <ox-select\n name=${name}\n placeholder=${labelText}\n .value=${value}\n @change=${(e: CustomEvent) =>\n e.target?.dispatchEvent(\n new CustomEvent('filter-change', {\n detail: {\n name,\n operator,\n value: e.detail\n }\n })\n )}\n >\n <ox-popup-list multiple attr-selected=\"checked\" with-search>\n ${renderer(column, value, this)}\n </ox-popup-list>\n </ox-select>\n `\n : html`\n <ox-select\n name=${name}\n placeholder=${labelText}\n .value=${value}\n @change=${(e: CustomEvent) =>\n e.target?.dispatchEvent(\n new CustomEvent('filter-change', {\n detail: {\n name,\n operator,\n value: e.detail\n }\n })\n )}\n >\n <ox-popup-list with-search> ${renderer(column, value, this)} </ox-popup-list>\n </ox-select>\n `\n })}\n </form>\n <slot name=\"setting\"></slot>\n `\n }\n\n applyUpdatedConfiguration() {\n if (!this.config) {\n return\n }\n\n const filters = this.config.columns.filter(columnConfig => !!columnConfig.filter)\n\n this.filterColumns = filters.filter((columnConfig: ColumnConfig) => {\n const filter = columnConfig.filter as FilterConfigObject\n return filter!.operator !== 'search'\n })\n this.searchColumns = filters.filter(columnConfig => {\n const filter = columnConfig.filter as FilterConfigObject\n return filter!.operator === 'search'\n })\n\n if (this.searchColumns.length > 0 && !this.withoutSearch) {\n this.filterColumns.unshift({ name: 'search', filter: { type: 'search' } } as any)\n }\n\n if (!this.personalConfig) {\n this.personalFilters = this.filterColumns.map(column => {\n return { name: column.name }\n })\n } else {\n const { filters: personalFilters = [] } = this.personalConfig\n\n if (personalFilters) {\n const xfilters = this.filterColumns.map(column => {\n return personalFilters.find(pFilter => pFilter.name == column.name) || { name: column.name }\n })\n\n function reorderList(a: FilterPreference[], b: FilterPreference[]): FilterPreference[] {\n // 결과 배열 초기화, a 배열 길이만큼 undefined로 채움\n const result = new Array(a.length)\n\n // b 배열에 없는 아이템은 원래 위치로 채움\n a.forEach((item, index) => {\n if (!item.name || !b.find(bi => bi.name == item.name)) {\n result[index] = item\n }\n })\n\n b.forEach(item => {\n const ai = a.find(ai => ai.name == item.name)\n if (ai) {\n result[result.findIndex(slot => slot === undefined)] = ai\n }\n })\n\n return result\n }\n\n // 배열 재정렬 실행\n this.personalFilters = reorderList(xfilters as any, personalFilters as any) as FilterPreference[]\n\n this.filterColumns = this.personalFilters\n .map(filter => {\n const column = this.filterColumns.find(column => column.name == filter.name)\n if (column?.filter) {\n ;(column.filter as FilterConfigObject)!.hidden = filter.hidden\n }\n return column\n })\n .filter(Boolean) as ColumnConfig[]\n }\n }\n\n const grist = this.closest('ox-grist') as DataGrist\n\n this.value = (grist?.filters || []).map(filter => {\n return {\n ...filter,\n value: this.buildDefaultValue(filter!.operator, filter!.value)\n }\n })\n\n this.empty = (this.searchColumns.length === 0 || this.withoutSearch) && this.filterColumns.length === 0\n\n this.autoUpdateTargetsOnChange = {}\n this.filterColumns\n ?.filter(({ filter }) => {\n return typeof filter == 'object' && filter.boundTo && filter.boundTo.length > 0\n })\n .map(({ name, filter }) => {\n const boundTo = (filter as FilterConfigObject).boundTo\n\n boundTo!.forEach(to => {\n const origin = this.autoUpdateTargetsOnChange[to] || []\n if (name && !origin.includes(name)) {\n this.autoUpdateTargetsOnChange[to] = [...origin, name]\n }\n })\n })\n }\n\n async getQueryFilters(): Promise<QueryFilter[]> {\n const form = await this.form\n if (!form) return []\n\n const formData = new FormData(form)\n const search: string | undefined = formData.get('search')?.toString()\n\n var filters = this.filterColumns\n .filter(column => column.name !== 'search' && !(column.filter as FilterConfigObject)!.hidden)\n .map((column: ColumnConfig) => {\n const { name, type, filter } = column\n const operator = (filter as FilterConfigObject).operator\n\n var value = formData.getAll(name)\n if (value.length == 0) {\n return\n }\n\n if (-1 === value.findIndex(v => v !== '')) {\n return\n }\n\n const filterValue = value.map(v => {\n const value = v.toString()\n\n /* TODO registry에서 타입별로 parsing 방법을 지정할 수 있도록 해야한다. */\n switch (type) {\n case 'integer':\n case 'float':\n case 'number':\n case 'progress':\n case 'checkbox':\n case 'boolean':\n return !value ? undefined : JSON.parse(value)\n default:\n return value\n }\n })\n\n return {\n name,\n operator,\n value: filterValue.length === 1 ? filterValue[0] : filterValue\n }\n })\n .filter(result => result !== undefined) as QueryFilter[]\n\n if (search) {\n filters = filters.concat(\n this.searchColumns.map((column: ColumnConfig) => {\n const { name } = column\n\n return {\n name,\n operator: 'search',\n value: `%${search}%`\n }\n })\n )\n }\n\n return filters\n }\n\n public setInputValue(name: string, value: any) {\n const input = this.renderRoot.querySelector(`form [name=\"${name}\"]`) as HTMLInputElement\n if (input) {\n input.value = value\n input.dispatchEvent(new Event('change', { bubbles: true }))\n }\n }\n\n public getInputValue(name: string): any {\n const input = this.renderRoot.querySelector(`form [name=\"${name}\"]`) as HTMLInputElement\n return input?.value\n }\n\n private async updateObjectValues() {\n const form = await this.form\n if (!form) return []\n\n const formData = new FormData(form)\n\n const object = {} as any\n formData.forEach((value, key) => {\n const prev = object[key]\n\n if (key in object) {\n object[key] = prev instanceof Array ? [...prev, value] : [prev, value]\n } else {\n object[key] = value\n }\n })\n\n this.objectValue = object\n }\n\n public getFormObjectValue() {\n return this.objectValue\n }\n\n reset() {\n this.form\n .then((form: HTMLFormElement) => {\n form.reset()\n })\n .catch((error: any) => {\n console.error('Error resetting the form:', error)\n })\n }\n}\n"]}
|
@@ -18,7 +18,7 @@ let GutterDirtyElement = class GutterDirtyElement extends LitElement {
|
|
18
18
|
};
|
19
19
|
GutterDirtyElement.styles = css `
|
20
20
|
:host {
|
21
|
-
display:
|
21
|
+
display: flex;
|
22
22
|
margin: auto;
|
23
23
|
}
|
24
24
|
|
@@ -30,7 +30,7 @@ GutterDirtyElement.styles = css `
|
|
30
30
|
}
|
31
31
|
|
32
32
|
[add] {
|
33
|
-
background-color: var(--primary-
|
33
|
+
background-color: var(--md-sys-color-on-primary-container);
|
34
34
|
}
|
35
35
|
|
36
36
|
[remove] {
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"gutter-dirty.js","sourceRoot":"","sources":["../../../src/gutters/gutter-dirty.ts"],"names":[],"mappings":";AAAA,OAAO,4BAA4B,CAAA;AAEnC,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAK3D,IAAM,kBAAkB,GAAxB,MAAM,kBAAmB,SAAQ,UAAU;IA6BzC,MAAM;QACJ,QAAQ,IAAI,CAAC,KAAK,EAAE,CAAC;YACnB,KAAK,GAAG;gBACN,OAAO,IAAI,CAAA,mBAAmB,WAAW,4BAA4B,CAAA;YACvE,KAAK,GAAG;gBACN,OAAO,IAAI,CAAA,mBAAmB,WAAW,kCAAkC,CAAA;YAC7E,KAAK,GAAG;gBACN,OAAO,IAAI,CAAA,mBAAmB,WAAW,8BAA8B,CAAA;YACzE;gBACE,OAAO,EAAE,CAAA;QACb,CAAC;IACH,CAAC;;AAvCM,yBAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;GAwBlB,AAxBY,CAwBZ;AAE2B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;iDAAe;AA3BtC,kBAAkB;IADvB,aAAa,CAAC,yBAAyB,CAAC;GACnC,kBAAkB,CAyCvB;AAED,MAAM,WAAW,GACf,sGAAsG,CAAA;AAExG,MAAM,OAAO,WAAW;IACtB,MAAM,CAAC,QAAQ,CAAC,SAAuB,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,WAAW,EAAS;QACjF,OAAO,MAAM,CAAC,MAAM,CAClB,EAAE,EACF;YACE,IAAI,EAAE,QAAQ;YACd,IAAI,EAAE,WAAW;YACjB,UAAU,EAAE,OAAO;YACnB,KAAK,EAAE,EAAE;YACT,SAAS,EAAE,KAAK;YAChB,QAAQ,EAAE,KAAK;YACf,MAAM,EAAE,EAAE;YACV,MAAM,EAAE;gBACN,KAAK,EAAE,QAAQ;gBACf,QAAQ,EAAE,UAAU,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,KAAK;oBACxD,OAAO,KAAK,CAAC,CAAC,CAAC,IAAI,CAAA,mCAAmC,KAAK,8BAA8B,CAAC,CAAC,CAAC,IAAI,CAAA,EAAE,CAAA;gBACpG,CAAkB;aACnB;YACD,OAAO,EAAE,IAAI;YACb,OAAO,EAAE,KAAK;YACd,OAAO,EAAE,KAAK;YACd,QAAQ,EAAE;gBACR,QAAQ,EAAE,CAAC,CAAC,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,EAAE;oBAC7D,MAAM,CAAC,aAAa,CAClB,IAAI,WAAW,CAAC,kBAAkB,EAAE;wBAClC,OAAO,EAAE,IAAI;wBACb,QAAQ,EAAE,IAAI;wBACd,MAAM,EAAE;4BACN,QAAQ,EAAE,QAAQ;4BAClB,WAAW,EAAE,CAAC;4BACd,MAAM,EAAE,QAAQ;4BAChB,SAAS,EAAE,CAAC,CAAC;yBACd;qBACF,CAAC,CACH,CAAA;gBACH,CAAC,CAAsB;aACxB;SACF,EACD,MAAM,CACP,CAAA;IACH,CAAC;CACF","sourcesContent":["import '@material/web/icon/icon.js'\n\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { ColumnConfig, FieldRenderer, GristEventHandler } from '../types'\n\n@customElement('ox-gutter-dirty-element')\nclass GutterDirtyElement extends LitElement {\n static styles = css`\n :host {\n display:
|
1
|
+
{"version":3,"file":"gutter-dirty.js","sourceRoot":"","sources":["../../../src/gutters/gutter-dirty.ts"],"names":[],"mappings":";AAAA,OAAO,4BAA4B,CAAA;AAEnC,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAK3D,IAAM,kBAAkB,GAAxB,MAAM,kBAAmB,SAAQ,UAAU;IA6BzC,MAAM;QACJ,QAAQ,IAAI,CAAC,KAAK,EAAE,CAAC;YACnB,KAAK,GAAG;gBACN,OAAO,IAAI,CAAA,mBAAmB,WAAW,4BAA4B,CAAA;YACvE,KAAK,GAAG;gBACN,OAAO,IAAI,CAAA,mBAAmB,WAAW,kCAAkC,CAAA;YAC7E,KAAK,GAAG;gBACN,OAAO,IAAI,CAAA,mBAAmB,WAAW,8BAA8B,CAAA;YACzE;gBACE,OAAO,EAAE,CAAA;QACb,CAAC;IACH,CAAC;;AAvCM,yBAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;GAwBlB,AAxBY,CAwBZ;AAE2B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;iDAAe;AA3BtC,kBAAkB;IADvB,aAAa,CAAC,yBAAyB,CAAC;GACnC,kBAAkB,CAyCvB;AAED,MAAM,WAAW,GACf,sGAAsG,CAAA;AAExG,MAAM,OAAO,WAAW;IACtB,MAAM,CAAC,QAAQ,CAAC,SAAuB,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,WAAW,EAAS;QACjF,OAAO,MAAM,CAAC,MAAM,CAClB,EAAE,EACF;YACE,IAAI,EAAE,QAAQ;YACd,IAAI,EAAE,WAAW;YACjB,UAAU,EAAE,OAAO;YACnB,KAAK,EAAE,EAAE;YACT,SAAS,EAAE,KAAK;YAChB,QAAQ,EAAE,KAAK;YACf,MAAM,EAAE,EAAE;YACV,MAAM,EAAE;gBACN,KAAK,EAAE,QAAQ;gBACf,QAAQ,EAAE,UAAU,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,KAAK;oBACxD,OAAO,KAAK,CAAC,CAAC,CAAC,IAAI,CAAA,mCAAmC,KAAK,8BAA8B,CAAC,CAAC,CAAC,IAAI,CAAA,EAAE,CAAA;gBACpG,CAAkB;aACnB;YACD,OAAO,EAAE,IAAI;YACb,OAAO,EAAE,KAAK;YACd,OAAO,EAAE,KAAK;YACd,QAAQ,EAAE;gBACR,QAAQ,EAAE,CAAC,CAAC,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,EAAE;oBAC7D,MAAM,CAAC,aAAa,CAClB,IAAI,WAAW,CAAC,kBAAkB,EAAE;wBAClC,OAAO,EAAE,IAAI;wBACb,QAAQ,EAAE,IAAI;wBACd,MAAM,EAAE;4BACN,QAAQ,EAAE,QAAQ;4BAClB,WAAW,EAAE,CAAC;4BACd,MAAM,EAAE,QAAQ;4BAChB,SAAS,EAAE,CAAC,CAAC;yBACd;qBACF,CAAC,CACH,CAAA;gBACH,CAAC,CAAsB;aACxB;SACF,EACD,MAAM,CACP,CAAA;IACH,CAAC;CACF","sourcesContent":["import '@material/web/icon/icon.js'\n\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { ColumnConfig, FieldRenderer, GristEventHandler } from '../types'\n\n@customElement('ox-gutter-dirty-element')\nclass GutterDirtyElement extends LitElement {\n static styles = css`\n :host {\n display: flex;\n margin: auto;\n }\n\n md-icon {\n width: var(--grid-record-dirty-icon-size);\n height: var(--grid-record-dirty-icon-size);\n border-radius: 50%;\n opacity: 0.8;\n }\n\n [add] {\n background-color: var(--md-sys-color-on-primary-container);\n }\n\n [remove] {\n background-color: var(--status-danger-color);\n }\n\n [done] {\n background-color: var(--status-info-color);\n }\n `\n\n @property({ type: String }) value?: string\n\n render() {\n switch (this.value) {\n case '+':\n return html` <md-icon style=${INLINESTYLE} center add>add</md-icon> `\n case '-':\n return html` <md-icon style=${INLINESTYLE} center remove>remove</md-icon> `\n case 'M':\n return html` <md-icon style=${INLINESTYLE} center done>done</md-icon> `\n default:\n return ''\n }\n }\n}\n\nconst INLINESTYLE =\n 'font-size: var(--grid-record-fontsize);vertical-align: middle; color: var(--grid-record-dirty-color)'\n\nexport class GutterDirty {\n static instance(config: ColumnConfig = { type: 'gutter', name: '__dirty__' } as any) {\n return Object.assign(\n {},\n {\n type: 'gutter',\n name: '__dirty__',\n gutterType: 'dirty',\n width: 30,\n resizable: false,\n sortable: false,\n header: '',\n record: {\n align: 'center',\n renderer: function (value, column, record, rowIndex, field) {\n return value ? html` <ox-gutter-dirty-element value=${value}></ox-gutter-dirty-element> ` : html``\n } as FieldRenderer\n },\n forGrid: true,\n forList: false,\n forCard: false,\n handlers: {\n dblclick: ((columns, data, column, record, rowIndex, target) => {\n target.dispatchEvent(\n new CustomEvent('set-select-block', {\n bubbles: true,\n composed: true,\n detail: {\n startRow: rowIndex,\n startColumn: 0,\n endRow: rowIndex,\n endColumn: -1\n }\n })\n )\n }) as GristEventHandler\n }\n },\n config\n )\n }\n}\n"]}
|
package/dist/src/index.d.ts
CHANGED
package/dist/src/index.js
CHANGED
package/dist/src/index.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAA;AAEvB,cAAc,yBAAyB,CAAA;AACvC,cAAc,cAAc,CAAA;AAC5B,cAAc,eAAe,CAAA;AAE7B,cAAc,WAAW,CAAA;AACzB,cAAc,aAAa,CAAA;AAC3B,cAAc,YAAY,CAAA;AAC1B,cAAc,cAAc,CAAA;AAC5B,cAAc,WAAW,CAAA;AACzB,cAAc,WAAW,CAAA;AACzB,cAAc,2BAA2B,CAAA;AACzC,cAAc,eAAe,CAAA;
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAA;AAEvB,cAAc,yBAAyB,CAAA;AACvC,cAAc,cAAc,CAAA;AAC5B,cAAc,eAAe,CAAA;AAE7B,cAAc,WAAW,CAAA;AACzB,cAAc,aAAa,CAAA;AAC3B,cAAc,YAAY,CAAA;AAC1B,cAAc,cAAc,CAAA;AAC5B,cAAc,WAAW,CAAA;AACzB,cAAc,WAAW,CAAA;AACzB,cAAc,2BAA2B,CAAA;AACzC,cAAc,eAAe,CAAA;AAC7B,cAAc,gBAAgB,CAAA;AAE9B,cAAc,oBAAoB,CAAA","sourcesContent":["export * from './types'\n\nexport * from './configure/zero-config'\nexport * from './data-grist'\nexport * from './data-report'\n\nexport * from './editors'\nexport * from './renderers'\nexport * from './handlers'\nexport * from './formatters'\nexport * from './gutters'\nexport * from './filters'\nexport * from './sorters/sorters-control'\nexport * from './record-view'\nexport * from './personalizer'\n\nexport * from './utils/list-param'\n"]}
|
@@ -0,0 +1 @@
|
|
1
|
+
export * from './ox-grist-personalizer';
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/personalizer/index.ts"],"names":[],"mappings":"AAAA,cAAc,yBAAyB,CAAA","sourcesContent":["export * from './ox-grist-personalizer'\n"]}
|
@@ -0,0 +1,8 @@
|
|
1
|
+
import '@material/web/button/outlined-button.js';
|
2
|
+
import { LitElement } from 'lit';
|
3
|
+
export declare class OxGristFilterPersonalizer extends LitElement {
|
4
|
+
static styles: import("lit").CSSResult[];
|
5
|
+
debug: boolean;
|
6
|
+
private preference?;
|
7
|
+
render(): import("lit-html").TemplateResult<1>;
|
8
|
+
}
|