@operato/dataset 8.2.9 → 8.2.11
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 +17 -0
- package/dist/src/ox-checklist-entry-form.js +16 -2
- package/dist/src/ox-checklist-entry-form.js.map +1 -1
- package/dist/src/ox-data-entry-form.js +12 -2
- package/dist/src/ox-data-entry-form.js.map +1 -1
- package/dist/src/ox-data-input-factory.js +12 -2
- package/dist/src/ox-data-input-factory.js.map +1 -1
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/package.json +7 -7
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,23 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
### [8.2.11](https://github.com/hatiolab/operato/compare/v8.2.10...v8.2.11) (2025-07-11)
|
|
7
|
+
|
|
8
|
+
**Note:** Version bump only for package @operato/dataset
|
|
9
|
+
|
|
10
|
+
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
### [8.2.10](https://github.com/hatiolab/operato/compare/v8.2.9...v8.2.10) (2025-05-30)
|
|
15
|
+
|
|
16
|
+
|
|
17
|
+
### :bug: Bug Fix
|
|
18
|
+
|
|
19
|
+
* 그리드 달력 클릭시 오픈 이벤트 추가 ([8905193](https://github.com/hatiolab/operato/commit/890519306196a271a1e4ec39cd109890667e9624))
|
|
20
|
+
|
|
21
|
+
|
|
22
|
+
|
|
6
23
|
### [8.2.9](https://github.com/hatiolab/operato/compare/v8.2.8...v8.2.9) (2025-05-29)
|
|
7
24
|
|
|
8
25
|
**Note:** Version bump only for package @operato/dataset
|
|
@@ -183,9 +183,23 @@ let OxChecklistEntryForm = class OxChecklistEntryForm extends LitElement {
|
|
|
183
183
|
case 'number':
|
|
184
184
|
return html ` <input type="number" name=${tag} value=${value} />`;
|
|
185
185
|
case 'date':
|
|
186
|
-
return html `
|
|
186
|
+
return html `
|
|
187
|
+
<input
|
|
188
|
+
type="date"
|
|
189
|
+
name=${tag}
|
|
190
|
+
value=${value}
|
|
191
|
+
@click=${(e) => e.currentTarget.showPicker()}
|
|
192
|
+
/>
|
|
193
|
+
`;
|
|
187
194
|
case 'datetime':
|
|
188
|
-
return html `
|
|
195
|
+
return html `
|
|
196
|
+
<input
|
|
197
|
+
type="datetime-local"
|
|
198
|
+
name=${tag}
|
|
199
|
+
value=${value}
|
|
200
|
+
@click=${(e) => e.currentTarget.showPicker()}
|
|
201
|
+
/>
|
|
202
|
+
`;
|
|
189
203
|
case 'file':
|
|
190
204
|
return html `<ox-input-file name=${tag} multiple .value=${value}></ox-input-file>`;
|
|
191
205
|
case 'signature':
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ox-checklist-entry-form.js","sourceRoot":"","sources":["../../src/ox-checklist-entry-form.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/icon/icon.js'\nimport '@operato/context/ox-context-page-toolbar.js'\nimport '@operato/board/ox-board-viewer.js'\n\nimport gql from 'graphql-tag'\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property, query, state } from 'lit/decorators.js'\n\nimport { DataItem, DataSample, DataSet } from './types'\nimport { client } from '@operato/graphql'\nimport { i18next, localize } from '@operato/i18n'\nimport { PageView } from '@operato/shell'\nimport { ScrollbarStyles } from '@operato/styles'\n\n@customElement('ox-checklist-entry-form')\nexport class OxChecklistEntryForm extends LitElement {\n static styles = [\n ScrollbarStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n\n --signature-min-width: 100px;\n --signature-min-height: 60px;\n overflow: auto;\n }\n\n form {\n flex: 1;\n\n display: flex;\n flex-direction: column;\n }\n h2 {\n margin: var(--title-margin);\n font: var(--title-font);\n color: var(--title-text-color);\n text-transform: capitalize;\n }\n table {\n border-collapse: collapse;\n margin-bottom: var(--spacing-medium);\n }\n th {\n padding: var(--th-padding);\n border-top: var(--th-border-top);\n border-bottom: var(--td-border-bottom);\n text-transform: var(--th-text-transform);\n font: var(--th-font);\n color: var(--th-color);\n text-align: left;\n white-space: nowrap;\n }\n th[item] {\n min-width: 100px;\n }\n th[value] {\n min-width: 100px;\n }\n thead tr {\n background-color: var(--md-sys-color-primary-container);\n }\n tbody tr {\n background-color: var(--md-sys-color-background);\n }\n tbody tr:hover {\n background-color: var(--tr-background-hover-color);\n }\n tr[ooc],\n tr[oos] {\n background-color: #fefbdf;\n }\n td {\n border: var(--td-border-line);\n padding: var(--td-padding);\n font: var(--td-font);\n color: var(--td-color);\n }\n td[name] {\n font-weight: bold;\n }\n td md-icon {\n color: var(--md-sys-color-error);\n }\n div[element] {\n grid-area: inputs;\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n gap: 10px;\n padding-right: var(--padding-default);\n\n * {\n flex: 1;\n }\n\n input,\n select {\n border: var(--input-field-border);\n border-radius: var(--input-field-border-radius);\n padding: var(--input-field-padding);\n font: var(--input-field-font);\n }\n }\n\n @media (max-width: 768px) {\n td {\n min-width: 28px;\n\n div[element],\n div[elements] {\n display: inline-block;\n }\n\n div[element] {\n input,\n select {\n width: 100%;\n }\n }\n }\n td[desc] {\n min-width: 60px;\n }\n }\n `\n ]\n\n get context() {\n return {\n title: i18next.t('title.checklist entry page'),\n help: 'dataset/checklist-entry-page',\n toolbar: false\n }\n }\n\n @property({ type: Object }) dataSet?: DataSet\n @property({ type: Object }) value?: { [tag: string]: any }\n\n render() {\n return html` ${this.buildInputs()} `\n }\n\n private onChange = (e: Event) => {\n this.value = this.buildValue()\n\n this.dispatchEvent(\n new CustomEvent('change', {\n bubbles: true,\n composed: true,\n detail: this.value\n })\n )\n }\n\n private buildValue(): { [tag: string]: any } {\n return this.extractValuesFromInputs()\n }\n\n private extractValuesFromInputs(): { [tag: string]: any } {\n return (this.dataSet?.dataItems || []).reduce(\n (values, dataItem) => {\n const { tag, type } = dataItem\n const editors = Array.from(this.renderRoot.querySelectorAll(`[name=${tag}]`) as NodeListOf<HTMLInputElement>)\n\n if (editors.length > 0) {\n values[tag] = editors.map(editor => (type === 'boolean' ? editor.checked : editor.value))\n }\n\n return values\n },\n {} as { [tag: string]: any }\n )\n }\n\n buildInputs() {\n const dataItems = this.dataSet?.dataItems || []\n const groupItems = dataItems?.filter(i => i.group)\n const nonGroupItems = dataItems?.filter(i => !i.group)\n\n let nameColspan = 1\n nameColspan += groupItems.length > 0 ? 1 : 0\n nameColspan += groupItems.some(i => i.subgroup) ? 1 : 0\n\n const isDescEmpty = dataItems.every(i => !i.description)\n const options = { isDescEmpty }\n\n return html`\n <form class=\"checklist\" @change=${this.onChange}>\n <table>\n <thead>\n <tr>\n <th colspan=${nameColspan} item>${i18next.t('field.item')}</th>\n ${isDescEmpty ? html`` : html`<th desc>${i18next.t('field.description')}</th>`}\n <th value>${i18next.t('field.value')}</th>\n </tr>\n </thead>\n <tbody>\n ${this.buildGroupInputs(groupItems, nameColspan, options)}\n ${this.buildNonGroupInputs(nonGroupItems, nameColspan, options)}\n </tbody>\n </table>\n </form>\n `\n }\n\n buildGroupInputs(items: DataItem[], nameColspan: number, options: { isDescEmpty: boolean }) {\n let isSubgroupExist = items.some(i => i.subgroup)\n let renderedGroups: { group: string; subgroup?: string | undefined }[] = []\n const { isDescEmpty } = options\n\n return html`\n ${items.map(item => {\n const { name, description, tag, type, quota = 1, options = {}, unit, group, subgroup } = item\n const value = this.value?.[tag] === undefined ? [] : this.value?.[tag]\n\n let groupTd = null\n if (!this.isGroupRendered(renderedGroups, group)) {\n groupTd = html`<td rowspan=\"${this.groupItemNums(items, group)}\">${group}</td>`\n renderedGroups.push({ group })\n }\n\n let subgroupTd = null\n if (subgroup && !this.isGroupRendered(renderedGroups, group, subgroup)) {\n subgroupTd = html`<td subgroup rowspan=\"${this.groupItemNums(items, group, subgroup)}\">${subgroup}</td>`\n renderedGroups.push({ group, subgroup })\n }\n\n return html`\n <tr>\n ${groupTd} ${subgroupTd}\n <td colspan=${isSubgroupExist && !subgroup ? 2 : 1}>${name}</td>\n ${isDescEmpty ? html`` : html`<td desc>${description}</td>`}\n <td>\n <div elements>\n ${Array.from({ length: quota || 1 }, (_, idx) =>\n this.createInputElement(\n type,\n tag,\n Array.isArray(value) ? value[idx] : idx === 0 ? value : undefined,\n options,\n idx\n )\n )}\n </div>\n </td>\n </tr>\n `\n })}\n `\n }\n\n buildNonGroupInputs(items: DataItem[], nameColspan: number, options: { isDescEmpty: boolean }) {\n const { isDescEmpty } = options\n\n return html`\n ${items.map(item => {\n const { name, description, tag, type, quota = 1, options = {}, unit } = item\n const value = this.value?.[tag] === undefined ? [] : this.value?.[tag]\n\n return html`\n <tr>\n <td name colspan=${nameColspan}>${name}</td>\n ${isDescEmpty ? html`` : html`<td>${description}</td>`}\n <td>\n <div element>\n ${Array.from({ length: quota || 1 }, (_, idx) =>\n this.createInputElement(\n type,\n tag,\n Array.isArray(value) ? value[idx] : idx === 0 ? value : undefined,\n options,\n idx\n )\n )}\n </div>\n </td>\n </tr>\n `\n })}\n `\n }\n\n isGroupRendered(renderedGroups: { group: string; subgroup?: string }[], group: string, subgroup?: string) {\n if (subgroup) {\n return renderedGroups.some(groupInfo => groupInfo.group === group && groupInfo.subgroup === subgroup)\n } else {\n return renderedGroups.some(groupInfo => groupInfo.group === group)\n }\n }\n\n groupItemNums(items: DataItem[], group: string, subgroup?: string) {\n let nums = 0\n\n if (subgroup) {\n items.forEach(i => {\n if (i.group === group && i.subgroup === subgroup) {\n nums += 1\n }\n })\n } else {\n items.forEach(i => {\n if (i.group === group) {\n nums += 1\n }\n })\n }\n\n return nums\n }\n\n createInputElement(type: string, tag: string, value: any, options: any, idx: number) {\n switch (type) {\n case 'select':\n return html` <select .name=${tag}>\n <option value=\"\"></option>\n ${(options.options || []).map(\n (option: any) =>\n html`<option value=${option.value} ?selected=${option.value === value}>${option.text}</option>`\n )}\n </select>`\n\n case 'radio':\n return html`<div\n @change=${(e: Event) => {\n const div = e.currentTarget as HTMLElement\n const inputHidden = div.querySelector(`input[name=\"${tag}\"]`) as HTMLInputElement\n inputHidden.value = (e.target as HTMLInputElement).value\n }}\n >\n <input type=\"hidden\" name=${tag} />\n\n ${(options.options || []).map(\n (option: any) =>\n html`<label>\n <input\n type=\"radio\"\n name=${'$' + tag + '-' + idx}\n .value=${option.value}\n ?checked=${option.value === value}\n />\n ${option.text}\n </label>`\n )}\n </div>`\n\n case 'boolean':\n return html` <input type=\"checkbox\" name=${tag} .checked=${value} />`\n\n case 'number':\n return html` <input type=\"number\" name=${tag} value=${value} />`\n\n case 'date':\n return html` <input type=\"date\" name=${tag} value=${value} />`\n\n case 'datetime':\n return html` <input type=\"datetime-local\" name=${tag} value=${value} />`\n\n case 'file':\n return html`<ox-input-file name=${tag} multiple .value=${value}></ox-input-file>`\n\n case 'signature':\n return html`<ox-input-signature name=${tag} value=${value}></ox-input-signature>`\n\n case 'string':\n default:\n return html` <input type=\"text\" name=${tag} value=${value || ''} />`\n }\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"ox-checklist-entry-form.js","sourceRoot":"","sources":["../../src/ox-checklist-entry-form.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/icon/icon.js'\nimport '@operato/context/ox-context-page-toolbar.js'\nimport '@operato/board/ox-board-viewer.js'\n\nimport gql from 'graphql-tag'\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property, query, state } from 'lit/decorators.js'\n\nimport { DataItem, DataSample, DataSet } from './types'\nimport { client } from '@operato/graphql'\nimport { i18next, localize } from '@operato/i18n'\nimport { PageView } from '@operato/shell'\nimport { ScrollbarStyles } from '@operato/styles'\n\n@customElement('ox-checklist-entry-form')\nexport class OxChecklistEntryForm extends LitElement {\n static styles = [\n ScrollbarStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n\n --signature-min-width: 100px;\n --signature-min-height: 60px;\n overflow: auto;\n }\n\n form {\n flex: 1;\n\n display: flex;\n flex-direction: column;\n }\n h2 {\n margin: var(--title-margin);\n font: var(--title-font);\n color: var(--title-text-color);\n text-transform: capitalize;\n }\n table {\n border-collapse: collapse;\n margin-bottom: var(--spacing-medium);\n }\n th {\n padding: var(--th-padding);\n border-top: var(--th-border-top);\n border-bottom: var(--td-border-bottom);\n text-transform: var(--th-text-transform);\n font: var(--th-font);\n color: var(--th-color);\n text-align: left;\n white-space: nowrap;\n }\n th[item] {\n min-width: 100px;\n }\n th[value] {\n min-width: 100px;\n }\n thead tr {\n background-color: var(--md-sys-color-primary-container);\n }\n tbody tr {\n background-color: var(--md-sys-color-background);\n }\n tbody tr:hover {\n background-color: var(--tr-background-hover-color);\n }\n tr[ooc],\n tr[oos] {\n background-color: #fefbdf;\n }\n td {\n border: var(--td-border-line);\n padding: var(--td-padding);\n font: var(--td-font);\n color: var(--td-color);\n }\n td[name] {\n font-weight: bold;\n }\n td md-icon {\n color: var(--md-sys-color-error);\n }\n div[element] {\n grid-area: inputs;\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n gap: 10px;\n padding-right: var(--padding-default);\n\n * {\n flex: 1;\n }\n\n input,\n select {\n border: var(--input-field-border);\n border-radius: var(--input-field-border-radius);\n padding: var(--input-field-padding);\n font: var(--input-field-font);\n }\n }\n\n @media (max-width: 768px) {\n td {\n min-width: 28px;\n\n div[element],\n div[elements] {\n display: inline-block;\n }\n\n div[element] {\n input,\n select {\n width: 100%;\n }\n }\n }\n td[desc] {\n min-width: 60px;\n }\n }\n `\n ]\n\n get context() {\n return {\n title: i18next.t('title.checklist entry page'),\n help: 'dataset/checklist-entry-page',\n toolbar: false\n }\n }\n\n @property({ type: Object }) dataSet?: DataSet\n @property({ type: Object }) value?: { [tag: string]: any }\n\n render() {\n return html` ${this.buildInputs()} `\n }\n\n private onChange = (e: Event) => {\n this.value = this.buildValue()\n\n this.dispatchEvent(\n new CustomEvent('change', {\n bubbles: true,\n composed: true,\n detail: this.value\n })\n )\n }\n\n private buildValue(): { [tag: string]: any } {\n return this.extractValuesFromInputs()\n }\n\n private extractValuesFromInputs(): { [tag: string]: any } {\n return (this.dataSet?.dataItems || []).reduce(\n (values, dataItem) => {\n const { tag, type } = dataItem\n const editors = Array.from(this.renderRoot.querySelectorAll(`[name=${tag}]`) as NodeListOf<HTMLInputElement>)\n\n if (editors.length > 0) {\n values[tag] = editors.map(editor => (type === 'boolean' ? editor.checked : editor.value))\n }\n\n return values\n },\n {} as { [tag: string]: any }\n )\n }\n\n buildInputs() {\n const dataItems = this.dataSet?.dataItems || []\n const groupItems = dataItems?.filter(i => i.group)\n const nonGroupItems = dataItems?.filter(i => !i.group)\n\n let nameColspan = 1\n nameColspan += groupItems.length > 0 ? 1 : 0\n nameColspan += groupItems.some(i => i.subgroup) ? 1 : 0\n\n const isDescEmpty = dataItems.every(i => !i.description)\n const options = { isDescEmpty }\n\n return html`\n <form class=\"checklist\" @change=${this.onChange}>\n <table>\n <thead>\n <tr>\n <th colspan=${nameColspan} item>${i18next.t('field.item')}</th>\n ${isDescEmpty ? html`` : html`<th desc>${i18next.t('field.description')}</th>`}\n <th value>${i18next.t('field.value')}</th>\n </tr>\n </thead>\n <tbody>\n ${this.buildGroupInputs(groupItems, nameColspan, options)}\n ${this.buildNonGroupInputs(nonGroupItems, nameColspan, options)}\n </tbody>\n </table>\n </form>\n `\n }\n\n buildGroupInputs(items: DataItem[], nameColspan: number, options: { isDescEmpty: boolean }) {\n let isSubgroupExist = items.some(i => i.subgroup)\n let renderedGroups: { group: string; subgroup?: string | undefined }[] = []\n const { isDescEmpty } = options\n\n return html`\n ${items.map(item => {\n const { name, description, tag, type, quota = 1, options = {}, unit, group, subgroup } = item\n const value = this.value?.[tag] === undefined ? [] : this.value?.[tag]\n\n let groupTd = null\n if (!this.isGroupRendered(renderedGroups, group)) {\n groupTd = html`<td rowspan=\"${this.groupItemNums(items, group)}\">${group}</td>`\n renderedGroups.push({ group })\n }\n\n let subgroupTd = null\n if (subgroup && !this.isGroupRendered(renderedGroups, group, subgroup)) {\n subgroupTd = html`<td subgroup rowspan=\"${this.groupItemNums(items, group, subgroup)}\">${subgroup}</td>`\n renderedGroups.push({ group, subgroup })\n }\n\n return html`\n <tr>\n ${groupTd} ${subgroupTd}\n <td colspan=${isSubgroupExist && !subgroup ? 2 : 1}>${name}</td>\n ${isDescEmpty ? html`` : html`<td desc>${description}</td>`}\n <td>\n <div elements>\n ${Array.from({ length: quota || 1 }, (_, idx) =>\n this.createInputElement(\n type,\n tag,\n Array.isArray(value) ? value[idx] : idx === 0 ? value : undefined,\n options,\n idx\n )\n )}\n </div>\n </td>\n </tr>\n `\n })}\n `\n }\n\n buildNonGroupInputs(items: DataItem[], nameColspan: number, options: { isDescEmpty: boolean }) {\n const { isDescEmpty } = options\n\n return html`\n ${items.map(item => {\n const { name, description, tag, type, quota = 1, options = {}, unit } = item\n const value = this.value?.[tag] === undefined ? [] : this.value?.[tag]\n\n return html`\n <tr>\n <td name colspan=${nameColspan}>${name}</td>\n ${isDescEmpty ? html`` : html`<td>${description}</td>`}\n <td>\n <div element>\n ${Array.from({ length: quota || 1 }, (_, idx) =>\n this.createInputElement(\n type,\n tag,\n Array.isArray(value) ? value[idx] : idx === 0 ? value : undefined,\n options,\n idx\n )\n )}\n </div>\n </td>\n </tr>\n `\n })}\n `\n }\n\n isGroupRendered(renderedGroups: { group: string; subgroup?: string }[], group: string, subgroup?: string) {\n if (subgroup) {\n return renderedGroups.some(groupInfo => groupInfo.group === group && groupInfo.subgroup === subgroup)\n } else {\n return renderedGroups.some(groupInfo => groupInfo.group === group)\n }\n }\n\n groupItemNums(items: DataItem[], group: string, subgroup?: string) {\n let nums = 0\n\n if (subgroup) {\n items.forEach(i => {\n if (i.group === group && i.subgroup === subgroup) {\n nums += 1\n }\n })\n } else {\n items.forEach(i => {\n if (i.group === group) {\n nums += 1\n }\n })\n }\n\n return nums\n }\n\n createInputElement(type: string, tag: string, value: any, options: any, idx: number) {\n switch (type) {\n case 'select':\n return html` <select .name=${tag}>\n <option value=\"\"></option>\n ${(options.options || []).map(\n (option: any) =>\n html`<option value=${option.value} ?selected=${option.value === value}>${option.text}</option>`\n )}\n </select>`\n\n case 'radio':\n return html`<div\n @change=${(e: Event) => {\n const div = e.currentTarget as HTMLElement\n const inputHidden = div.querySelector(`input[name=\"${tag}\"]`) as HTMLInputElement\n inputHidden.value = (e.target as HTMLInputElement).value\n }}\n >\n <input type=\"hidden\" name=${tag} />\n\n ${(options.options || []).map(\n (option: any) =>\n html`<label>\n <input\n type=\"radio\"\n name=${'$' + tag + '-' + idx}\n .value=${option.value}\n ?checked=${option.value === value}\n />\n ${option.text}\n </label>`\n )}\n </div>`\n\n case 'boolean':\n return html` <input type=\"checkbox\" name=${tag} .checked=${value} />`\n\n case 'number':\n return html` <input type=\"number\" name=${tag} value=${value} />`\n\n case 'date':\n return html`\n <input\n type=\"date\"\n name=${tag}\n value=${value}\n @click=${(e: Event) => (e.currentTarget as HTMLInputElement).showPicker()}\n />\n `\n\n case 'datetime':\n return html`\n <input\n type=\"datetime-local\"\n name=${tag}\n value=${value}\n @click=${(e: Event) => (e.currentTarget as HTMLInputElement).showPicker()}\n />\n `\n\n case 'file':\n return html`<ox-input-file name=${tag} multiple .value=${value}></ox-input-file>`\n\n case 'signature':\n return html`<ox-input-signature name=${tag} value=${value}></ox-input-signature>`\n\n case 'string':\n default:\n return html` <input type=\"text\" name=${tag} value=${value || ''} />`\n }\n }\n}\n"]}
|
|
@@ -89,9 +89,19 @@ let OxDataEntryForm = class OxDataEntryForm extends LitElement {
|
|
|
89
89
|
case 'number':
|
|
90
90
|
return html ` <input type="number" name=${tag} value=${v} />`;
|
|
91
91
|
case 'date':
|
|
92
|
-
return html ` <input
|
|
92
|
+
return html ` <input
|
|
93
|
+
type="date"
|
|
94
|
+
name=${tag}
|
|
95
|
+
value=${v}
|
|
96
|
+
@click=${(e) => e.currentTarget.showPicker()}
|
|
97
|
+
/>`;
|
|
93
98
|
case 'datetime':
|
|
94
|
-
return html ` <input
|
|
99
|
+
return html ` <input
|
|
100
|
+
type="datetime-local"
|
|
101
|
+
name=${tag}
|
|
102
|
+
value=${v}
|
|
103
|
+
@click=${(e) => e.currentTarget.showPicker()}
|
|
104
|
+
/>`;
|
|
95
105
|
case 'file':
|
|
96
106
|
return html `<ox-input-file name=${tag} multiple .value=${v}></ox-input-file>`;
|
|
97
107
|
case 'signature':
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ox-data-entry-form.js","sourceRoot":"","sources":["../../src/ox-data-entry-form.ts"],"names":[],"mappings":"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","sourcesContent":["import '@operato/input/ox-input-file.js'\nimport '@operato/input/ox-input-signature.js'\nimport './ox-data-entry-subgroup-form.js'\n\nimport { css, html, LitElement, TemplateResult } from 'lit'\nimport { customElement, property, queryAll } from 'lit/decorators.js'\n\nimport { DataSet, DataItem, DataSample } from './types.js'\nimport { OxDataEntrySubgroupForm } from './ox-data-entry-subgroup-form.js'\n\n@customElement('ox-data-entry-form')\nexport class OxDataEntryForm extends LitElement {\n static styles = css`\n :host {\n --item-description-font: normal 0.8rem/1rem var(--theme-font);\n --item-description-color: var(--page-description-color);\n }\n\n h2 {\n margin: var(--title-margin);\n font: var(--title-font);\n color: var(--title-text-color);\n text-transform: capitalize;\n text-align: center;\n }\n\n h3 {\n margin: var(--page-description-margin);\n font: var(--page-description-font);\n color: var(--page-description-color);\n text-transform: capitalize;\n text-align: center;\n }\n\n form {\n display: flex;\n flex-direction: column;\n overflow: hidden;\n }\n\n form > div[label] {\n display: grid;\n\n grid-template-rows: auto 1fr;\n grid-template-columns: 1fr 5fr;\n grid-template-areas: 'name description' 'empty inputs';\n\n grid-gap: 9px;\n align-items: center;\n margin-bottom: var(--spacing-medium);\n\n &:nth-child(odd) {\n background-color: var(--md-sys-color-background);\n padding: var(--padding-default) 0;\n }\n }\n\n div[name] {\n grid-area: name;\n font: var(--label-font);\n color: var(--label-color, var(--md-sys-color-on-surface));\n text-align: right;\n }\n div[description] {\n grid-area: description;\n opacity: 0.7;\n font: var(--item-description-font);\n color: var(--item-description-color);\n text-align: left;\n\n * {\n vertical-align: middle;\n }\n\n md-icon {\n font-size: 0.9rem;\n }\n }\n\n div[elements] {\n grid-area: inputs;\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n gap: 10px;\n padding-right: var(--padding-default);\n\n * {\n flex: 1;\n }\n\n input,\n select {\n border: var(--input-field-border);\n border-radius: var(--input-field-border-radius);\n padding: var(--input-field-padding);\n font: var(--input-field-font);\n }\n }\n\n div[subgroup] {\n grid-column: 1 / 3;\n grid-row: 2;\n }\n\n @media only screen and (max-width: 460px) {\n form > div[label] {\n display: grid;\n\n grid-template-rows: auto auto 1fr;\n grid-template-columns: 1fr;\n grid-template-areas: 'name' 'description' 'inputs';\n\n grid-gap: 9px;\n align-items: center;\n margin-bottom: var(--spacing-medium);\n }\n\n div[name] {\n text-align: left;\n }\n }\n `\n\n @property({ type: Object }) dataSet?: DataSet\n @property({ type: Object }) value?: { [tag: string]: any }\n\n @queryAll('ox-data-entry-subgroup-form') subgroups!: NodeListOf<OxDataEntrySubgroupForm>\n\n render() {\n return html` <form @change=${(e: Event) => this.onChange(e)}>\n <h2>${this.dataSet?.name || ''}</h2>\n <h3>${this.dataSet?.description || ''}</h3>\n ${this.buildInputs()}\n </form>`\n }\n\n private onChange(e: Event) {\n this.value = this.buildValue()\n\n this.dispatchEvent(\n new CustomEvent('change', {\n bubbles: true,\n composed: true,\n detail: this.value\n })\n )\n }\n\n private buildInputs() {\n const dataItems = this.dataSet?.dataItems.filter(item => item.active) || []\n const nonGroupDataItems = dataItems.filter(dataItem => !dataItem.group)\n const dataItemSubgroups = Object.entries(this.groupDataItemsByGroup(dataItems)).map(([subgroup, dataItems]) => {\n const tags = dataItems.map(dataItem => dataItem.tag)\n const value = tags.reduce((partial, key) => {\n partial[key] = this.value?.[key]\n return partial\n }, {} as any)\n\n return this.buildInputs4Subgroup(subgroup, dataItems, value)\n })\n\n return [...this.buildInputs4NonGrouped(nonGroupDataItems), ...dataItemSubgroups]\n }\n\n private buildInputs4Subgroup(subgroup: string, dataItems: DataItem[], value: { [tag: string]: any }): TemplateResult {\n return html`\n <div label>\n <div name>${subgroup}</div>\n <div subgroup>\n <ox-data-entry-subgroup-form\n .subgroup=${subgroup}\n .dataItems=${dataItems}\n .value=${value}\n @change=${(e: Event) => this.onChange(e)}\n ></ox-data-entry-subgroup-form>\n </div>\n </div>\n `\n }\n\n private buildInputs4NonGrouped(dataItems: DataItem[]): TemplateResult[] {\n return (dataItems || []).map(dataItem => {\n const { name, description, tag, type, quota = 1, options = {}, unit } = dataItem\n\n const samples = new Array(quota).fill(0)\n const value = this.value && this.value[tag]\n\n const elements = samples.map((_, idx) => {\n const v = value instanceof Array ? value[idx] : idx === 0 ? value : undefined\n\n switch (type) {\n case 'select':\n return html` <select .name=${tag}>\n <option value=\"\"></option>\n ${(options.options || []).map(\n option => html`<option value=${option.value} ?selected=${option.value === v}>${option.text}</option>`\n )}\n </select>`\n\n case 'radio':\n return html`<div\n @change=${(e: Event) => {\n const div = e.currentTarget as HTMLElement\n const inputHidden = div.querySelector(`input[name=\"${tag}\"]`) as HTMLInputElement\n inputHidden.value = (e.target as HTMLInputElement).value\n }}\n >\n <input type=\"hidden\" name=${tag} />\n\n ${(options.options || []).map(\n option =>\n html`<label>\n <input\n type=\"radio\"\n name=${'$' + tag + '-' + idx}\n .value=${option.value}\n ?checked=${option.value === v}\n />\n ${option.text}\n </label>`\n )}\n </div>`\n\n case 'boolean':\n return html` <input type=\"checkbox\" name=${tag} .checked=${v} />`\n\n case 'number':\n return html` <input type=\"number\" name=${tag} value=${v} />`\n\n case 'date':\n return html` <input type=\"date\" name=${tag} value=${v} />`\n\n case 'datetime':\n return html` <input type=\"datetime-local\" name=${tag} value=${v} />`\n\n case 'file':\n return html`<ox-input-file name=${tag} multiple .value=${v}></ox-input-file>`\n\n case 'signature':\n return html`<ox-input-signature name=${tag} value=${v}></ox-input-signature>`\n\n case 'string':\n default:\n return html` <input type=\"text\" name=${tag} value=${v} />`\n }\n })\n\n return html` <div label>\n <div name>${name}${unit ? `(${unit})` : ''}</div>\n <div description><md-icon>info</md-icon> ${description}</div>\n <div elements>${elements}</div>\n </div>`\n })\n }\n\n private buildValue() {\n const dataItems = this.dataSet!.dataItems\n const nonGroupDataItems = dataItems.filter(dataItem => !dataItem.group)\n\n const nonGroupValue = (nonGroupDataItems || []).reduce(\n (sum, dataItem) => {\n const { tag, type } = dataItem\n\n const editors = Array.prototype.slice.call(\n this.renderRoot.querySelectorAll(`[name=${tag}]`) as NodeListOf<HTMLInputElement>\n ) as HTMLInputElement[]\n\n if (editors.length > 0) {\n sum[tag] = editors.map(editor => (type === 'boolean' ? editor.checked : editor.value))\n }\n\n return sum\n },\n {} as { [tag: string]: any }\n )\n\n return Array.from(this.subgroups).reduce((value, subgroup) => {\n return {\n ...value,\n ...subgroup.buildValue()\n }\n }, nonGroupValue || {})\n }\n\n private groupDataItemsByGroup(dataItems: DataItem[]): { [group: string]: DataItem[] } {\n const groupedDataItems: { [group: string]: DataItem[] } = {}\n\n for (const dataItem of dataItems) {\n const { group } = dataItem\n\n if (group) {\n if (!groupedDataItems[group]) {\n groupedDataItems[group] = []\n }\n\n groupedDataItems[group].push(dataItem)\n }\n }\n\n return groupedDataItems\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"ox-data-entry-form.js","sourceRoot":"","sources":["../../src/ox-data-entry-form.ts"],"names":[],"mappings":"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","sourcesContent":["import '@operato/input/ox-input-file.js'\nimport '@operato/input/ox-input-signature.js'\nimport './ox-data-entry-subgroup-form.js'\n\nimport { css, html, LitElement, TemplateResult } from 'lit'\nimport { customElement, property, queryAll } from 'lit/decorators.js'\n\nimport { DataSet, DataItem, DataSample } from './types.js'\nimport { OxDataEntrySubgroupForm } from './ox-data-entry-subgroup-form.js'\n\n@customElement('ox-data-entry-form')\nexport class OxDataEntryForm extends LitElement {\n static styles = css`\n :host {\n --item-description-font: normal 0.8rem/1rem var(--theme-font);\n --item-description-color: var(--page-description-color);\n }\n\n h2 {\n margin: var(--title-margin);\n font: var(--title-font);\n color: var(--title-text-color);\n text-transform: capitalize;\n text-align: center;\n }\n\n h3 {\n margin: var(--page-description-margin);\n font: var(--page-description-font);\n color: var(--page-description-color);\n text-transform: capitalize;\n text-align: center;\n }\n\n form {\n display: flex;\n flex-direction: column;\n overflow: hidden;\n }\n\n form > div[label] {\n display: grid;\n\n grid-template-rows: auto 1fr;\n grid-template-columns: 1fr 5fr;\n grid-template-areas: 'name description' 'empty inputs';\n\n grid-gap: 9px;\n align-items: center;\n margin-bottom: var(--spacing-medium);\n\n &:nth-child(odd) {\n background-color: var(--md-sys-color-background);\n padding: var(--padding-default) 0;\n }\n }\n\n div[name] {\n grid-area: name;\n font: var(--label-font);\n color: var(--label-color, var(--md-sys-color-on-surface));\n text-align: right;\n }\n div[description] {\n grid-area: description;\n opacity: 0.7;\n font: var(--item-description-font);\n color: var(--item-description-color);\n text-align: left;\n\n * {\n vertical-align: middle;\n }\n\n md-icon {\n font-size: 0.9rem;\n }\n }\n\n div[elements] {\n grid-area: inputs;\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n gap: 10px;\n padding-right: var(--padding-default);\n\n * {\n flex: 1;\n }\n\n input,\n select {\n border: var(--input-field-border);\n border-radius: var(--input-field-border-radius);\n padding: var(--input-field-padding);\n font: var(--input-field-font);\n }\n }\n\n div[subgroup] {\n grid-column: 1 / 3;\n grid-row: 2;\n }\n\n @media only screen and (max-width: 460px) {\n form > div[label] {\n display: grid;\n\n grid-template-rows: auto auto 1fr;\n grid-template-columns: 1fr;\n grid-template-areas: 'name' 'description' 'inputs';\n\n grid-gap: 9px;\n align-items: center;\n margin-bottom: var(--spacing-medium);\n }\n\n div[name] {\n text-align: left;\n }\n }\n `\n\n @property({ type: Object }) dataSet?: DataSet\n @property({ type: Object }) value?: { [tag: string]: any }\n\n @queryAll('ox-data-entry-subgroup-form') subgroups!: NodeListOf<OxDataEntrySubgroupForm>\n\n render() {\n return html` <form @change=${(e: Event) => this.onChange(e)}>\n <h2>${this.dataSet?.name || ''}</h2>\n <h3>${this.dataSet?.description || ''}</h3>\n ${this.buildInputs()}\n </form>`\n }\n\n private onChange(e: Event) {\n this.value = this.buildValue()\n\n this.dispatchEvent(\n new CustomEvent('change', {\n bubbles: true,\n composed: true,\n detail: this.value\n })\n )\n }\n\n private buildInputs() {\n const dataItems = this.dataSet?.dataItems.filter(item => item.active) || []\n const nonGroupDataItems = dataItems.filter(dataItem => !dataItem.group)\n const dataItemSubgroups = Object.entries(this.groupDataItemsByGroup(dataItems)).map(([subgroup, dataItems]) => {\n const tags = dataItems.map(dataItem => dataItem.tag)\n const value = tags.reduce((partial, key) => {\n partial[key] = this.value?.[key]\n return partial\n }, {} as any)\n\n return this.buildInputs4Subgroup(subgroup, dataItems, value)\n })\n\n return [...this.buildInputs4NonGrouped(nonGroupDataItems), ...dataItemSubgroups]\n }\n\n private buildInputs4Subgroup(subgroup: string, dataItems: DataItem[], value: { [tag: string]: any }): TemplateResult {\n return html`\n <div label>\n <div name>${subgroup}</div>\n <div subgroup>\n <ox-data-entry-subgroup-form\n .subgroup=${subgroup}\n .dataItems=${dataItems}\n .value=${value}\n @change=${(e: Event) => this.onChange(e)}\n ></ox-data-entry-subgroup-form>\n </div>\n </div>\n `\n }\n\n private buildInputs4NonGrouped(dataItems: DataItem[]): TemplateResult[] {\n return (dataItems || []).map(dataItem => {\n const { name, description, tag, type, quota = 1, options = {}, unit } = dataItem\n\n const samples = new Array(quota).fill(0)\n const value = this.value && this.value[tag]\n\n const elements = samples.map((_, idx) => {\n const v = value instanceof Array ? value[idx] : idx === 0 ? value : undefined\n\n switch (type) {\n case 'select':\n return html` <select .name=${tag}>\n <option value=\"\"></option>\n ${(options.options || []).map(\n option => html`<option value=${option.value} ?selected=${option.value === v}>${option.text}</option>`\n )}\n </select>`\n\n case 'radio':\n return html`<div\n @change=${(e: Event) => {\n const div = e.currentTarget as HTMLElement\n const inputHidden = div.querySelector(`input[name=\"${tag}\"]`) as HTMLInputElement\n inputHidden.value = (e.target as HTMLInputElement).value\n }}\n >\n <input type=\"hidden\" name=${tag} />\n\n ${(options.options || []).map(\n option =>\n html`<label>\n <input\n type=\"radio\"\n name=${'$' + tag + '-' + idx}\n .value=${option.value}\n ?checked=${option.value === v}\n />\n ${option.text}\n </label>`\n )}\n </div>`\n\n case 'boolean':\n return html` <input type=\"checkbox\" name=${tag} .checked=${v} />`\n\n case 'number':\n return html` <input type=\"number\" name=${tag} value=${v} />`\n\n case 'date':\n return html` <input\n type=\"date\"\n name=${tag}\n value=${v}\n @click=${(e: Event) => (e.currentTarget as HTMLInputElement).showPicker()}\n />`\n\n case 'datetime':\n return html` <input\n type=\"datetime-local\"\n name=${tag}\n value=${v}\n @click=${(e: Event) => (e.currentTarget as HTMLInputElement).showPicker()}\n />`\n\n case 'file':\n return html`<ox-input-file name=${tag} multiple .value=${v}></ox-input-file>`\n\n case 'signature':\n return html`<ox-input-signature name=${tag} value=${v}></ox-input-signature>`\n\n case 'string':\n default:\n return html` <input type=\"text\" name=${tag} value=${v} />`\n }\n })\n\n return html` <div label>\n <div name>${name}${unit ? `(${unit})` : ''}</div>\n <div description><md-icon>info</md-icon> ${description}</div>\n <div elements>${elements}</div>\n </div>`\n })\n }\n\n private buildValue() {\n const dataItems = this.dataSet!.dataItems\n const nonGroupDataItems = dataItems.filter(dataItem => !dataItem.group)\n\n const nonGroupValue = (nonGroupDataItems || []).reduce(\n (sum, dataItem) => {\n const { tag, type } = dataItem\n\n const editors = Array.prototype.slice.call(\n this.renderRoot.querySelectorAll(`[name=${tag}]`) as NodeListOf<HTMLInputElement>\n ) as HTMLInputElement[]\n\n if (editors.length > 0) {\n sum[tag] = editors.map(editor => (type === 'boolean' ? editor.checked : editor.value))\n }\n\n return sum\n },\n {} as { [tag: string]: any }\n )\n\n return Array.from(this.subgroups).reduce((value, subgroup) => {\n return {\n ...value,\n ...subgroup.buildValue()\n }\n }, nonGroupValue || {})\n }\n\n private groupDataItemsByGroup(dataItems: DataItem[]): { [group: string]: DataItem[] } {\n const groupedDataItems: { [group: string]: DataItem[] } = {}\n\n for (const dataItem of dataItems) {\n const { group } = dataItem\n\n if (group) {\n if (!groupedDataItems[group]) {\n groupedDataItems[group] = []\n }\n\n groupedDataItems[group].push(dataItem)\n }\n }\n\n return groupedDataItems\n }\n}\n"]}
|
|
@@ -27,9 +27,19 @@ export class OxDataInputFactory {
|
|
|
27
27
|
case 'number':
|
|
28
28
|
return html `<input type="number" name=${tag} .value=${value} />`;
|
|
29
29
|
case 'date':
|
|
30
|
-
return html `<input
|
|
30
|
+
return html `<input
|
|
31
|
+
type="date"
|
|
32
|
+
name=${tag}
|
|
33
|
+
.value=${value}
|
|
34
|
+
@click=${(e) => e.currentTarget.showPicker()}
|
|
35
|
+
/>`;
|
|
31
36
|
case 'datetime':
|
|
32
|
-
return html `<input
|
|
37
|
+
return html `<input
|
|
38
|
+
type="datetime-local"
|
|
39
|
+
name=${tag}
|
|
40
|
+
.value=${value}
|
|
41
|
+
@click=${(e) => e.currentTarget.showPicker()}
|
|
42
|
+
/>`;
|
|
33
43
|
case 'file':
|
|
34
44
|
return html `<ox-input-file name=${tag} multiple .value=${value}></ox-input-file>`;
|
|
35
45
|
case 'signature':
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ox-data-input-factory.js","sourceRoot":"","sources":["../../src/ox-data-input-factory.ts"],"names":[],"mappings":"AAAA,OAAO,iCAAiC,CAAA;AACxC,OAAO,sCAAsC,CAAA;AAC7C,qDAAqD;AAErD,OAAO,EAAE,IAAI,EAAkB,MAAM,KAAK,CAAA;AAE1C;;;GAGG;AACH,MAAM,OAAO,kBAAkB;IAC7B;;;;;;;;OAQG;IACH,MAAM,CAAC,kBAAkB,CAAC,IAAY,EAAE,GAAW,EAAE,KAAU,EAAE,UAAe,EAAE,EAAE,MAAc,CAAC;QACjG,QAAQ,IAAI,EAAE,CAAC;YACb,KAAK,QAAQ;gBACX,OAAO,IAAI,CAAC,YAAY,CAAC,GAAG,EAAE,KAAK,EAAE,OAAO,CAAC,CAAA;YAC/C,KAAK,OAAO;gBACV,OAAO,IAAI,CAAC,WAAW,CAAC,GAAG,EAAE,KAAK,EAAE,OAAO,EAAE,GAAG,CAAC,CAAA;YACnD,KAAK,SAAS;gBACZ,OAAO,IAAI,CAAA,+BAA+B,GAAG,aAAa,KAAK,KAAK,CAAA;YACtE,KAAK,QAAQ;gBACX,OAAO,IAAI,CAAA,6BAA6B,GAAG,WAAW,KAAK,KAAK,CAAA;YAClE,KAAK,MAAM;gBACT,OAAO,IAAI,CAAA,
|
|
1
|
+
{"version":3,"file":"ox-data-input-factory.js","sourceRoot":"","sources":["../../src/ox-data-input-factory.ts"],"names":[],"mappings":"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","sourcesContent":["import '@operato/input/ox-input-file.js'\nimport '@operato/input/ox-input-signature.js'\n// import '@operato/app/ox-filter-resource-object.js'\n\nimport { html, TemplateResult } from 'lit'\n\n/**\n * OxDataInputFactory\n * A factory class that dynamically generates input elements based on different data types.\n */\nexport class OxDataInputFactory {\n /**\n * Creates an input element based on the specified type.\n * @param type - The type of input (e.g., text, number, date, select, etc.)\n * @param tag - The name attribute for the input field\n * @param value - The current value of the input field\n * @param options - Additional options (used for select, radio, etc.)\n * @param idx - Index for multiple input fields\n * @returns TemplateResult - A Lit template result for rendering\n */\n static createInputElement(type: string, tag: string, value: any, options: any = {}, idx: number = 0): TemplateResult {\n switch (type) {\n case 'select':\n return this.createSelect(tag, value, options)\n case 'radio':\n return this.createRadio(tag, value, options, idx)\n case 'boolean':\n return html`<input type=\"checkbox\" name=${tag} .checked=${value} />`\n case 'number':\n return html`<input type=\"number\" name=${tag} .value=${value} />`\n case 'date':\n return html`<input\n type=\"date\"\n name=${tag}\n .value=${value}\n @click=${(e: Event) => (e.currentTarget as HTMLInputElement).showPicker()}\n />`\n case 'datetime':\n return html`<input\n type=\"datetime-local\"\n name=${tag}\n .value=${value}\n @click=${(e: Event) => (e.currentTarget as HTMLInputElement).showPicker()}\n />`\n case 'file':\n return html`<ox-input-file name=${tag} multiple .value=${value}></ox-input-file>`\n case 'signature':\n return html`<ox-input-signature name=${tag} .value=${value}></ox-input-signature>`\n case 'employee':\n return this.createEmployee(tag, value, options)\n case 'string':\n default:\n return html`<input type=\"text\" name=${tag} .value=${value || ''} />`\n }\n }\n\n /**\n * Creates a select dropdown element.\n * @param tag - The name attribute for the select element\n * @param value - The currently selected value\n * @param options - The available options for the dropdown\n * @returns TemplateResult - A Lit template result for rendering\n */\n private static createSelect(tag: string, value: any, options: any): TemplateResult {\n return html`\n <select name=${tag}>\n <option value=\"\"></option>\n ${options.options?.map(\n (option: any) => html`\n <option value=${option.value} ?selected=${option.value === value}>${option.text}</option>\n `\n )}\n </select>\n `\n }\n\n /**\n * Creates a radio button group.\n * @param tag - The name attribute for the radio group\n * @param value - The currently selected value\n * @param options - The available radio options\n * @param idx - Index for multiple radio groups\n * @returns TemplateResult - A Lit template result for rendering\n */\n private static createRadio(tag: string, value: any, options: any, idx: number): TemplateResult {\n return html`\n <div\n @change=${(e: Event) => {\n const div = e.currentTarget as HTMLElement\n const hiddenInput = div.querySelector(`input[name=\"${tag}\"]`) as HTMLInputElement\n hiddenInput.value = (e.target as HTMLInputElement).value\n }}\n >\n <input type=\"hidden\" name=${tag} />\n ${options.options?.map(\n (option: any) => html`\n <label>\n <input type=\"radio\" name=${`${tag}-${idx}`} value=${option.value} ?checked=${option.value === value} />\n ${option.text}\n </label>\n `\n )}\n </div>\n `\n }\n\n /**\n * Creates a filter resource object element.\n * @param tag - The name attribute for the input field\n * @param value - The current value of the input field\n * @param options - Additional options\n * @returns TemplateResult - A Lit template result for\n */\n private static createEmployee(tag: string, value: any, options: any): TemplateResult {\n return html``\n // return html`<ox-filter-resource-object\n // .name=${tag}\n // .value=${value}\n // .confirmCallback=${confirmCallback.bind(this)}\n // .queryName=${'employees'}\n // .columns=${columns}\n // .pagination=${pagination}\n // .list=${list}\n // .basicArgs=${basicArgs}\n // .valueField=${valueField}\n // ></ox-filter-resource-object>`\n }\n\n /**\n * Maps form input types to Grist-compatible column types.\n * Ensures `OxDataEntrySubgroupForm` properly maps UI components to Grist.\n */\n static mapGristType(type: string): string {\n switch (type) {\n case 'radio':\n case 'select':\n return 'select' // Convert radio to select for Grist\n case 'boolean':\n return 'boolean'\n case 'number':\n return 'number'\n case 'date':\n return 'date'\n case 'datetime':\n return 'datetime'\n case 'file':\n return 'file'\n case 'signature':\n return 'signature'\n case 'string':\n return 'text'\n default:\n return type\n }\n }\n\n /**\n * Retrieves additional record options for Grist columns.\n */\n static getGristRecordOptions(type: string, options: any = {}): any {\n switch (type) {\n case 'select':\n case 'radio':\n return {\n options: [\n '',\n ...(options.options || []).map((opt: any) =>\n typeof opt === 'string' ? opt : { display: opt.text, value: opt.value }\n )\n ]\n }\n case 'boolean':\n return { align: 'center' }\n case 'number':\n return { align: 'right' }\n case 'file':\n return { multiple: true }\n default:\n return {}\n }\n }\n}\n"]}
|