@operato/dataset 8.2.1 → 8.2.2

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 CHANGED
@@ -3,6 +3,20 @@
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.2](https://github.com/hatiolab/operato/compare/v8.2.1...v8.2.2) (2025-04-07)
7
+
8
+
9
+ ### :rocket: New Features
10
+
11
+ * 데이터셋 항목별 그룹핑 ([f047183](https://github.com/hatiolab/operato/commit/f047183d29373c3e4cdad216e4e3923bc258b49d))
12
+
13
+
14
+ ### :bug: Bug Fix
15
+
16
+ * add checklist type for dataset entry-form and viewer ([8c8d301](https://github.com/hatiolab/operato/commit/8c8d301ab59a1e86e0d0dcf95e9e221c55ec738a))
17
+
18
+
19
+
6
20
  ### [8.2.1](https://github.com/hatiolab/operato/compare/v8.2.0...v8.2.1) (2025-03-12)
7
21
 
8
22
 
@@ -2,7 +2,7 @@ import '@material/web/icon/icon.js';
2
2
  import '@operato/context/ox-context-page-toolbar.js';
3
3
  import '@operato/board/ox-board-viewer.js';
4
4
  import { LitElement } from 'lit';
5
- import { DataItem } from './types';
5
+ import { DataItem, DataSet } from './types';
6
6
  export declare class OxChecklistEntryForm extends LitElement {
7
7
  static styles: import("lit").CSSResult[];
8
8
  get context(): {
@@ -10,7 +10,7 @@ export declare class OxChecklistEntryForm extends LitElement {
10
10
  help: string;
11
11
  toolbar: boolean;
12
12
  };
13
- private dataSet?;
13
+ dataSet?: DataSet;
14
14
  value?: {
15
15
  [tag: string]: any;
16
16
  };
@@ -53,7 +53,13 @@ let OxChecklistEntryForm = class OxChecklistEntryForm extends LitElement {
53
53
  return html `
54
54
  <form class="checklist" @change=${this.onChange}>
55
55
  <table>
56
- <thead></thead>
56
+ <thead>
57
+ <tr>
58
+ <th colspan=${nameColspan} item>${i18next.t('field.item')}</th>
59
+ <th>${i18next.t('field.description')}</th>
60
+ <th value>${i18next.t('field.value')}</th>
61
+ </tr>
62
+ </thead>
57
63
  <tbody>
58
64
  ${this.buildGroupInputs(groupItems, nameColspan)} ${this.buildNonGroupInputs(nonGroupItems, nameColspan)}
59
65
  </tbody>
@@ -65,11 +71,6 @@ let OxChecklistEntryForm = class OxChecklistEntryForm extends LitElement {
65
71
  let isSubgroupExist = items.some(i => i.subgroup);
66
72
  let renderedGroups = [];
67
73
  return html `
68
- <tr>
69
- <th colspan=${nameColspan} item>${i18next.t('field.item')}</th>
70
- <th>${i18next.t('field.description')}</th>
71
- <th value>${i18next.t('field.value')}</th>
72
- </tr>
73
74
  ${items.map(item => {
74
75
  var _a, _b;
75
76
  const { name, description, tag, type, quota = 1, options = {}, unit, group, subgroup } = item;
@@ -186,7 +187,7 @@ let OxChecklistEntryForm = class OxChecklistEntryForm extends LitElement {
186
187
  return html `<ox-input-signature name=${tag} value=${value}></ox-input-signature>`;
187
188
  case 'string':
188
189
  default:
189
- return html ` <input type="text" name=${tag} value=${value} />`;
190
+ return html ` <input type="text" name=${tag} value=${value || ''} />`;
190
191
  }
191
192
  }
192
193
  };
@@ -234,13 +235,13 @@ OxChecklistEntryForm.styles = [
234
235
  th[value] {
235
236
  min-width: 100px;
236
237
  }
237
- tr {
238
- background-color: var(--tr-background-color);
238
+ thead tr {
239
+ background-color: var(--md-sys-color-primary-container);
239
240
  }
240
- tr:nth-child(odd) {
241
- background-color: var(--tr-background-odd-color);
241
+ tbody tr {
242
+ background-color: var(--md-sys-color-background);
242
243
  }
243
- tr:hover {
244
+ tbody tr:hover {
244
245
  background-color: var(--tr-background-hover-color);
245
246
  }
246
247
  tr[ooc],
@@ -282,7 +283,7 @@ OxChecklistEntryForm.styles = [
282
283
  `
283
284
  ];
284
285
  __decorate([
285
- property()
286
+ property({ type: Object })
286
287
  ], OxChecklistEntryForm.prototype, "dataSet", void 0);
287
288
  __decorate([
288
289
  property({ type: Object })
@@ -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 tr {\n background-color: var(--tr-background-color);\n }\n tr:nth-child(odd) {\n background-color: var(--tr-background-odd-color);\n }\n 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 ]\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() private 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 return html`\n <form class=\"checklist\" @change=${this.onChange}>\n <table>\n <thead></thead>\n <tbody>\n ${this.buildGroupInputs(groupItems, nameColspan)} ${this.buildNonGroupInputs(nonGroupItems, nameColspan)}\n </tbody>\n </table>\n </form>\n `\n }\n\n buildGroupInputs(items: DataItem[], nameColspan: number) {\n let isSubgroupExist = items.some(i => i.subgroup)\n let renderedGroups: { group: string; subgroup?: string | undefined }[] = []\n\n return html`\n <tr>\n <th colspan=${nameColspan} item>${i18next.t('field.item')}</th>\n <th>${i18next.t('field.description')}</th>\n <th value>${i18next.t('field.value')}</th>\n </tr>\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 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 <td>${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) {\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 <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 ]\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 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 <th>${i18next.t('field.description')}</th>\n <th value>${i18next.t('field.value')}</th>\n </tr>\n </thead>\n <tbody>\n ${this.buildGroupInputs(groupItems, nameColspan)} ${this.buildNonGroupInputs(nonGroupItems, nameColspan)}\n </tbody>\n </table>\n </form>\n `\n }\n\n buildGroupInputs(items: DataItem[], nameColspan: number) {\n let isSubgroupExist = items.some(i => i.subgroup)\n let renderedGroups: { group: string; subgroup?: string | undefined }[] = []\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 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 <td>${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) {\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 <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"]}
@@ -30,7 +30,18 @@ let OxChecklistSampleView = class OxChecklistSampleView extends LitElement {
30
30
 
31
31
  <form class="checklist">
32
32
  <table>
33
- <thead></thead>
33
+ <thead>
34
+ <tr>
35
+ <th colspan=${nameColspan} item>${i18next.t('field.item')}</th>
36
+ <th>${i18next.t('field.description')}</th>
37
+ <th>${i18next.t('field.finalizing-function')}</th>
38
+ <th>${i18next.t('field.unit')}</th>
39
+ <th value>${i18next.t('field.value')}</th>
40
+ <th>${i18next.t('field.spec')}</th>
41
+ <th>${i18next.t('field.ooc')}</th>
42
+ <th>${i18next.t('field.oos')}</th>
43
+ </tr>
44
+ </thead>
34
45
  <tbody>
35
46
  ${this.buildGroupTable(groupItems, data, nameColspan, judgment, useCaseNames)}
36
47
  ${this.buildNonGroupTable(nonGroupItems, data, nameColspan, judgment, useCaseNames)}
@@ -43,16 +54,6 @@ let OxChecklistSampleView = class OxChecklistSampleView extends LitElement {
43
54
  let isSubgroupExist = items.some(i => i.subgroup);
44
55
  let renderedGroups = [];
45
56
  return html `
46
- <tr>
47
- <th colspan=${nameColspan} item>${i18next.t('field.item')}</th>
48
- <th>${i18next.t('field.description')}</th>
49
- <th>${i18next.t('field.finalizing-function')}</th>
50
- <th>${i18next.t('field.unit')}</th>
51
- <th value>${i18next.t('field.value')}</th>
52
- <th>${i18next.t('field.spec')}</th>
53
- <th>${i18next.t('field.ooc')}</th>
54
- <th>${i18next.t('field.oos')}</th>
55
- </tr>
56
57
  ${items.map(item => {
57
58
  const { name = '', tag = '', description = '', stat, unit = '', spec = {}, type, group, subgroup } = item;
58
59
  const value = data[tag];
@@ -230,13 +231,13 @@ OxChecklistSampleView.styles = css `
230
231
  th[value] {
231
232
  min-width: 100px;
232
233
  }
233
- tr {
234
- background-color: var(--tr-background-color);
234
+ thead tr {
235
+ background-color: var(--md-sys-color-primary-container);
235
236
  }
236
- tr:nth-child(odd) {
237
- background-color: var(--tr-background-odd-color);
237
+ tbody tr {
238
+ background-color: var(--md-sys-color-background);
238
239
  }
239
- tr:hover {
240
+ tbody tr:hover {
240
241
  background-color: var(--tr-background-hover-color);
241
242
  }
242
243
  tr[ooc],
@@ -1 +1 @@
1
- {"version":3,"file":"ox-checklist-sample-view.js","sourceRoot":"","sources":["../../src/ox-checklist-sample-view.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/icon/icon.js'\nimport '@operato/input/ox-input-file.js'\nimport '@operato/input/ox-input-signature.js'\n\nimport { css, html, LitElement, TemplateResult } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { i18next } from '@operato/i18n'\n\nimport { DataItem, DataSample, DataSpecLimitSet } from './types.js'\nimport { OxDataUseCase } from './usecase/ox-data-use-case.js'\n\n@customElement('ox-checklist-sample-view')\nexport class OxChecklistSampleView extends LitElement {\n static styles = css`\n :host {\n display: flex;\n flex-direction: column;\n\n --signature-min-width: 100px;\n --signature-min-height: 60px;\n }\n\n form {\n flex: 1;\n\n display: flex;\n flex-direction: column;\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 }\n [page-description] {\n margin: var(--page-description-margin);\n opacity: 0.7;\n font: var(--page-description-font);\n color: var(--md-sys-color-on-secondary-container);\n text-transform: capitalize;\n }\n [page-description] * {\n vertical-align: middle;\n }\n [page-description] md-icon {\n margin-top: -2px;\n font-size: 0.9rem;\n color: var(--page-description-color);\n }\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 tr {\n background-color: var(--tr-background-color);\n }\n tr:nth-child(odd) {\n background-color: var(--tr-background-odd-color);\n }\n 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 td > 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 pre {\n tab-size: 2;\n }\n\n a[file] {\n display: flex;\n align-items: center;\n gap: var(--spacing-small);\n }\n\n a[file] md-icon {\n --md-icon-size: 16px;\n color: var(--md-sys-color-primary);\n }\n\n @media print {\n :host {\n display: block;\n }\n }\n\n @media screen and (max-width: 480px) {\n th {\n min-width: 50px;\n }\n }\n `\n\n @property({ type: Object }) dataSample?: DataSample\n\n render() {\n if (!this.dataSample) {\n return html``\n }\n\n const {\n name,\n description,\n collectedAt,\n workDate,\n workShift,\n useCase,\n data = {},\n judgment,\n dataItems = []\n } = this.dataSample\n const formatter = new Intl.DateTimeFormat(navigator.language, { dateStyle: 'full', timeStyle: 'short' })\n const useCaseNames = useCase?.split(',').filter(useCase => useCase.trim()) || []\n const groupItems = dataItems?.filter(i => i.group)\n const nonGroupItems = dataItems?.filter(i => !i.group)\n let nameColspan = 1\n nameColspan += groupItems.length > 0 ? 1 : 0\n nameColspan += groupItems.some(i => i.subgroup) ? 1 : 0\n\n return html`\n <h2>${name}</h2>\n <p page-description>\n <md-icon>info</md-icon> ${description}<br />\n <md-icon>alarm</md-icon> ${i18next.t('field.work-date')}: ${workDate} ${workShift} |\n <md-icon>pending_actions</md-icon> ${i18next.t('field.collected-at')}:\n ${formatter.format(new Date(collectedAt!))}\n </p>\n\n <form class=\"checklist\">\n <table>\n <thead></thead>\n <tbody>\n ${this.buildGroupTable(groupItems, data, nameColspan, judgment, useCaseNames)}\n ${this.buildNonGroupTable(nonGroupItems, data, nameColspan, judgment, useCaseNames)}\n </tbody>\n </table>\n </form>\n `\n }\n\n buildGroupTable(items: DataItem[], data: any, nameColspan: number, judgment: any, useCaseNames: string[]) {\n let isSubgroupExist = items.some(i => i.subgroup)\n let renderedGroups: { group: string; subgroup?: string | undefined }[] = []\n\n return html`\n <tr>\n <th colspan=${nameColspan} item>${i18next.t('field.item')}</th>\n <th>${i18next.t('field.description')}</th>\n <th>${i18next.t('field.finalizing-function')}</th>\n <th>${i18next.t('field.unit')}</th>\n <th value>${i18next.t('field.value')}</th>\n <th>${i18next.t('field.spec')}</th>\n <th>${i18next.t('field.ooc')}</th>\n <th>${i18next.t('field.oos')}</th>\n </tr>\n ${items.map(item => {\n const { name = '', tag = '', description = '', stat, unit = '', spec = {}, type, group, subgroup } = item\n const value = data[tag]\n const { ooc, oos } = judgment?.[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 rowspan=\"${this.groupItemNums(items, group, subgroup)}\">${subgroup}</td>`\n renderedGroups.push({ group, subgroup })\n }\n\n return html`\n <tr ?ooc=${ooc} ?oos=${oos}>\n ${groupTd} ${subgroupTd}\n <td name colspan=${isSubgroupExist && !subgroup ? 2 : 1}>${name}</td>\n <td>${description}</td>\n <td>${stat}</td>\n <td>${unit}</td>\n <td>${this.buildValue(type, value)}</td>\n <td><pre>${this.buildSpec(useCaseNames, spec)}</pre></td>\n <td>${ooc ? html`<md-icon>done</md-icon>` : ''}</td>\n <td>${oos ? html`<md-icon>done</md-icon>` : ''}</td>\n </tr>\n `\n })}\n `\n }\n\n buildNonGroupTable(items: DataItem[], data: any, nameColspan: number, judgment: any, useCaseNames: string[]) {\n return html`\n ${items.map(item => {\n const { name = '', tag = '', description = '', stat, unit = '', spec = {}, type } = item\n const value = data[tag]\n const { ooc, oos } = judgment?.[tag] || {}\n\n return html`\n <tr ?ooc=${ooc} ?oos=${oos}>\n <td name colspan=${nameColspan}>${name}</td>\n <td>${description}</td>\n <td>${stat}</td>\n <td>${unit}</td>\n <td>${this.buildValue(type, value)}</td>\n <td><pre>${this.buildSpec(useCaseNames, spec)}</pre></td>\n <td>${ooc ? html`<md-icon>done</md-icon>` : ''}</td>\n <td>${oos ? html`<md-icon>done</md-icon>` : ''}</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 private buildSpec(useCaseNames: string[], spec: DataSpecLimitSet): string {\n return OxDataUseCase.elaborateDataItemSpec(useCaseNames, spec)\n }\n\n private download(file: { mimetype: string; name: string; fullpath: string }) {\n const element = document.createElement('a')\n element.setAttribute('href', file.fullpath)\n element.setAttribute('download', file.name!)\n document.body.appendChild(element)\n element.click()\n }\n\n private buildValue(type: string, value: any | any[]) {\n if (value === undefined) {\n return ''\n }\n const values = value instanceof Array ? value : [value]\n\n if (type == 'file') {\n const files = values.flat() as { mimetype: string; name: string; fullpath: string }[]\n\n return files\n .filter(Boolean)\n .map(file => html`<a @click=${() => this.download(file)} file><md-icon>description</md-icon>${file.name}</a>`)\n }\n\n if (type == 'signature') {\n return html` <ox-input-signature .value=${value} disabled></ox-input-signature>`\n }\n\n const elements = values.map((v: any, idx) => {\n switch (typeof v) {\n case 'boolean':\n return html` <input type=\"checkbox\" .checked=${v} disabled />`\n break\n\n default:\n if (type == 'date') {\n return v ? new Date(v).toLocaleDateString() : ''\n } else if (type == 'datetime') {\n return v ? new Date(v).toLocaleString() : ''\n }\n return v ?? ''\n }\n })\n\n return typeof values[0] === 'boolean' ? elements : elements.join(', ')\n }\n}\n"]}
1
+ {"version":3,"file":"ox-checklist-sample-view.js","sourceRoot":"","sources":["../../src/ox-checklist-sample-view.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/icon/icon.js'\nimport '@operato/input/ox-input-file.js'\nimport '@operato/input/ox-input-signature.js'\n\nimport { css, html, LitElement, TemplateResult } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { i18next } from '@operato/i18n'\n\nimport { DataItem, DataSample, DataSpecLimitSet } from './types.js'\nimport { OxDataUseCase } from './usecase/ox-data-use-case.js'\n\n@customElement('ox-checklist-sample-view')\nexport class OxChecklistSampleView extends LitElement {\n static styles = css`\n :host {\n display: flex;\n flex-direction: column;\n\n --signature-min-width: 100px;\n --signature-min-height: 60px;\n }\n\n form {\n flex: 1;\n\n display: flex;\n flex-direction: column;\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 }\n [page-description] {\n margin: var(--page-description-margin);\n opacity: 0.7;\n font: var(--page-description-font);\n color: var(--md-sys-color-on-secondary-container);\n text-transform: capitalize;\n }\n [page-description] * {\n vertical-align: middle;\n }\n [page-description] md-icon {\n margin-top: -2px;\n font-size: 0.9rem;\n color: var(--page-description-color);\n }\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 td > 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 pre {\n tab-size: 2;\n }\n\n a[file] {\n display: flex;\n align-items: center;\n gap: var(--spacing-small);\n }\n\n a[file] md-icon {\n --md-icon-size: 16px;\n color: var(--md-sys-color-primary);\n }\n\n @media print {\n :host {\n display: block;\n }\n }\n\n @media screen and (max-width: 480px) {\n th {\n min-width: 50px;\n }\n }\n `\n\n @property({ type: Object }) dataSample?: DataSample\n\n render() {\n if (!this.dataSample) {\n return html``\n }\n\n const {\n name,\n description,\n collectedAt,\n workDate,\n workShift,\n useCase,\n data = {},\n judgment,\n dataItems = []\n } = this.dataSample\n const formatter = new Intl.DateTimeFormat(navigator.language, { dateStyle: 'full', timeStyle: 'short' })\n const useCaseNames = useCase?.split(',').filter(useCase => useCase.trim()) || []\n const groupItems = dataItems?.filter(i => i.group)\n const nonGroupItems = dataItems?.filter(i => !i.group)\n let nameColspan = 1\n nameColspan += groupItems.length > 0 ? 1 : 0\n nameColspan += groupItems.some(i => i.subgroup) ? 1 : 0\n\n return html`\n <h2>${name}</h2>\n <p page-description>\n <md-icon>info</md-icon> ${description}<br />\n <md-icon>alarm</md-icon> ${i18next.t('field.work-date')}: ${workDate} ${workShift} |\n <md-icon>pending_actions</md-icon> ${i18next.t('field.collected-at')}:\n ${formatter.format(new Date(collectedAt!))}\n </p>\n\n <form class=\"checklist\">\n <table>\n <thead>\n <tr>\n <th colspan=${nameColspan} item>${i18next.t('field.item')}</th>\n <th>${i18next.t('field.description')}</th>\n <th>${i18next.t('field.finalizing-function')}</th>\n <th>${i18next.t('field.unit')}</th>\n <th value>${i18next.t('field.value')}</th>\n <th>${i18next.t('field.spec')}</th>\n <th>${i18next.t('field.ooc')}</th>\n <th>${i18next.t('field.oos')}</th>\n </tr>\n </thead>\n <tbody>\n ${this.buildGroupTable(groupItems, data, nameColspan, judgment, useCaseNames)}\n ${this.buildNonGroupTable(nonGroupItems, data, nameColspan, judgment, useCaseNames)}\n </tbody>\n </table>\n </form>\n `\n }\n\n buildGroupTable(items: DataItem[], data: any, nameColspan: number, judgment: any, useCaseNames: string[]) {\n let isSubgroupExist = items.some(i => i.subgroup)\n let renderedGroups: { group: string; subgroup?: string | undefined }[] = []\n\n return html`\n ${items.map(item => {\n const { name = '', tag = '', description = '', stat, unit = '', spec = {}, type, group, subgroup } = item\n const value = data[tag]\n const { ooc, oos } = judgment?.[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 rowspan=\"${this.groupItemNums(items, group, subgroup)}\">${subgroup}</td>`\n renderedGroups.push({ group, subgroup })\n }\n\n return html`\n <tr ?ooc=${ooc} ?oos=${oos}>\n ${groupTd} ${subgroupTd}\n <td name colspan=${isSubgroupExist && !subgroup ? 2 : 1}>${name}</td>\n <td>${description}</td>\n <td>${stat}</td>\n <td>${unit}</td>\n <td>${this.buildValue(type, value)}</td>\n <td><pre>${this.buildSpec(useCaseNames, spec)}</pre></td>\n <td>${ooc ? html`<md-icon>done</md-icon>` : ''}</td>\n <td>${oos ? html`<md-icon>done</md-icon>` : ''}</td>\n </tr>\n `\n })}\n `\n }\n\n buildNonGroupTable(items: DataItem[], data: any, nameColspan: number, judgment: any, useCaseNames: string[]) {\n return html`\n ${items.map(item => {\n const { name = '', tag = '', description = '', stat, unit = '', spec = {}, type } = item\n const value = data[tag]\n const { ooc, oos } = judgment?.[tag] || {}\n\n return html`\n <tr ?ooc=${ooc} ?oos=${oos}>\n <td name colspan=${nameColspan}>${name}</td>\n <td>${description}</td>\n <td>${stat}</td>\n <td>${unit}</td>\n <td>${this.buildValue(type, value)}</td>\n <td><pre>${this.buildSpec(useCaseNames, spec)}</pre></td>\n <td>${ooc ? html`<md-icon>done</md-icon>` : ''}</td>\n <td>${oos ? html`<md-icon>done</md-icon>` : ''}</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 private buildSpec(useCaseNames: string[], spec: DataSpecLimitSet): string {\n return OxDataUseCase.elaborateDataItemSpec(useCaseNames, spec)\n }\n\n private download(file: { mimetype: string; name: string; fullpath: string }) {\n const element = document.createElement('a')\n element.setAttribute('href', file.fullpath)\n element.setAttribute('download', file.name!)\n document.body.appendChild(element)\n element.click()\n }\n\n private buildValue(type: string, value: any | any[]) {\n if (value === undefined) {\n return ''\n }\n const values = value instanceof Array ? value : [value]\n\n if (type == 'file') {\n const files = values.flat() as { mimetype: string; name: string; fullpath: string }[]\n\n return files\n .filter(Boolean)\n .map(file => html`<a @click=${() => this.download(file)} file><md-icon>description</md-icon>${file.name}</a>`)\n }\n\n if (type == 'signature') {\n return html` <ox-input-signature .value=${value} disabled></ox-input-signature>`\n }\n\n const elements = values.map((v: any, idx) => {\n switch (typeof v) {\n case 'boolean':\n return html` <input type=\"checkbox\" .checked=${v} disabled />`\n break\n\n default:\n if (type == 'date') {\n return v ? new Date(v).toLocaleDateString() : ''\n } else if (type == 'datetime') {\n return v ? new Date(v).toLocaleString() : ''\n }\n return v ?? ''\n }\n })\n\n return typeof values[0] === 'boolean' ? elements : elements.join(', ')\n }\n}\n"]}
@@ -0,0 +1,53 @@
1
+ import '@operato/input/ox-input-file.js';
2
+ import '@operato/input/ox-input-signature.js';
3
+ import { TemplateResult } from 'lit';
4
+ /**
5
+ * OxDataInputFactory
6
+ * A factory class that dynamically generates input elements based on different data types.
7
+ */
8
+ export declare class OxDataInputFactory {
9
+ /**
10
+ * Creates an input element based on the specified type.
11
+ * @param type - The type of input (e.g., text, number, date, select, etc.)
12
+ * @param tag - The name attribute for the input field
13
+ * @param value - The current value of the input field
14
+ * @param options - Additional options (used for select, radio, etc.)
15
+ * @param idx - Index for multiple input fields
16
+ * @returns TemplateResult - A Lit template result for rendering
17
+ */
18
+ static createInputElement(type: string, tag: string, value: any, options?: any, idx?: number): TemplateResult;
19
+ /**
20
+ * Creates a select dropdown element.
21
+ * @param tag - The name attribute for the select element
22
+ * @param value - The currently selected value
23
+ * @param options - The available options for the dropdown
24
+ * @returns TemplateResult - A Lit template result for rendering
25
+ */
26
+ private static createSelect;
27
+ /**
28
+ * Creates a radio button group.
29
+ * @param tag - The name attribute for the radio group
30
+ * @param value - The currently selected value
31
+ * @param options - The available radio options
32
+ * @param idx - Index for multiple radio groups
33
+ * @returns TemplateResult - A Lit template result for rendering
34
+ */
35
+ private static createRadio;
36
+ /**
37
+ * Creates a filter resource object element.
38
+ * @param tag - The name attribute for the input field
39
+ * @param value - The current value of the input field
40
+ * @param options - Additional options
41
+ * @returns TemplateResult - A Lit template result for
42
+ */
43
+ private static createEmployee;
44
+ /**
45
+ * Maps form input types to Grist-compatible column types.
46
+ * Ensures `OxDataEntrySubgroupForm` properly maps UI components to Grist.
47
+ */
48
+ static mapGristType(type: string): string;
49
+ /**
50
+ * Retrieves additional record options for Grist columns.
51
+ */
52
+ static getGristRecordOptions(type: string, options?: any): any;
53
+ }
@@ -0,0 +1,162 @@
1
+ import '@operato/input/ox-input-file.js';
2
+ import '@operato/input/ox-input-signature.js';
3
+ // import '@operato/app/ox-filter-resource-object.js'
4
+ import { html } from 'lit';
5
+ /**
6
+ * OxDataInputFactory
7
+ * A factory class that dynamically generates input elements based on different data types.
8
+ */
9
+ export class OxDataInputFactory {
10
+ /**
11
+ * Creates an input element based on the specified type.
12
+ * @param type - The type of input (e.g., text, number, date, select, etc.)
13
+ * @param tag - The name attribute for the input field
14
+ * @param value - The current value of the input field
15
+ * @param options - Additional options (used for select, radio, etc.)
16
+ * @param idx - Index for multiple input fields
17
+ * @returns TemplateResult - A Lit template result for rendering
18
+ */
19
+ static createInputElement(type, tag, value, options = {}, idx = 0) {
20
+ switch (type) {
21
+ case 'select':
22
+ return this.createSelect(tag, value, options);
23
+ case 'radio':
24
+ return this.createRadio(tag, value, options, idx);
25
+ case 'boolean':
26
+ return html `<input type="checkbox" name=${tag} .checked=${value} />`;
27
+ case 'number':
28
+ return html `<input type="number" name=${tag} .value=${value} />`;
29
+ case 'date':
30
+ return html `<input type="date" name=${tag} .value=${value} />`;
31
+ case 'datetime':
32
+ return html `<input type="datetime-local" name=${tag} .value=${value} />`;
33
+ case 'file':
34
+ return html `<ox-input-file name=${tag} multiple .value=${value}></ox-input-file>`;
35
+ case 'signature':
36
+ return html `<ox-input-signature name=${tag} .value=${value}></ox-input-signature>`;
37
+ case 'employee':
38
+ return this.createEmployee(tag, value, options);
39
+ case 'string':
40
+ default:
41
+ return html `<input type="text" name=${tag} .value=${value || ''} />`;
42
+ }
43
+ }
44
+ /**
45
+ * Creates a select dropdown element.
46
+ * @param tag - The name attribute for the select element
47
+ * @param value - The currently selected value
48
+ * @param options - The available options for the dropdown
49
+ * @returns TemplateResult - A Lit template result for rendering
50
+ */
51
+ static createSelect(tag, value, options) {
52
+ var _a;
53
+ return html `
54
+ <select name=${tag}>
55
+ <option value=""></option>
56
+ ${(_a = options.options) === null || _a === void 0 ? void 0 : _a.map((option) => html `
57
+ <option value=${option.value} ?selected=${option.value === value}>${option.text}</option>
58
+ `)}
59
+ </select>
60
+ `;
61
+ }
62
+ /**
63
+ * Creates a radio button group.
64
+ * @param tag - The name attribute for the radio group
65
+ * @param value - The currently selected value
66
+ * @param options - The available radio options
67
+ * @param idx - Index for multiple radio groups
68
+ * @returns TemplateResult - A Lit template result for rendering
69
+ */
70
+ static createRadio(tag, value, options, idx) {
71
+ var _a;
72
+ return html `
73
+ <div
74
+ @change=${(e) => {
75
+ const div = e.currentTarget;
76
+ const hiddenInput = div.querySelector(`input[name="${tag}"]`);
77
+ hiddenInput.value = e.target.value;
78
+ }}
79
+ >
80
+ <input type="hidden" name=${tag} />
81
+ ${(_a = options.options) === null || _a === void 0 ? void 0 : _a.map((option) => html `
82
+ <label>
83
+ <input type="radio" name=${`${tag}-${idx}`} value=${option.value} ?checked=${option.value === value} />
84
+ ${option.text}
85
+ </label>
86
+ `)}
87
+ </div>
88
+ `;
89
+ }
90
+ /**
91
+ * Creates a filter resource object element.
92
+ * @param tag - The name attribute for the input field
93
+ * @param value - The current value of the input field
94
+ * @param options - Additional options
95
+ * @returns TemplateResult - A Lit template result for
96
+ */
97
+ static createEmployee(tag, value, options) {
98
+ return html ``;
99
+ // return html`<ox-filter-resource-object
100
+ // .name=${tag}
101
+ // .value=${value}
102
+ // .confirmCallback=${confirmCallback.bind(this)}
103
+ // .queryName=${'employees'}
104
+ // .columns=${columns}
105
+ // .pagination=${pagination}
106
+ // .list=${list}
107
+ // .basicArgs=${basicArgs}
108
+ // .valueField=${valueField}
109
+ // ></ox-filter-resource-object>`
110
+ }
111
+ /**
112
+ * Maps form input types to Grist-compatible column types.
113
+ * Ensures `OxDataEntrySubgroupForm` properly maps UI components to Grist.
114
+ */
115
+ static mapGristType(type) {
116
+ switch (type) {
117
+ case 'radio':
118
+ case 'select':
119
+ return 'select'; // Convert radio to select for Grist
120
+ case 'boolean':
121
+ return 'boolean';
122
+ case 'number':
123
+ return 'number';
124
+ case 'date':
125
+ return 'date';
126
+ case 'datetime':
127
+ return 'datetime';
128
+ case 'file':
129
+ return 'file';
130
+ case 'signature':
131
+ return 'signature';
132
+ case 'string':
133
+ return 'text';
134
+ default:
135
+ return type;
136
+ }
137
+ }
138
+ /**
139
+ * Retrieves additional record options for Grist columns.
140
+ */
141
+ static getGristRecordOptions(type, options = {}) {
142
+ switch (type) {
143
+ case 'select':
144
+ case 'radio':
145
+ return {
146
+ options: [
147
+ '',
148
+ ...(options.options || []).map((opt) => typeof opt === 'string' ? opt : { display: opt.text, value: opt.value })
149
+ ]
150
+ };
151
+ case 'boolean':
152
+ return { align: 'center' };
153
+ case 'number':
154
+ return { align: 'right' };
155
+ case 'file':
156
+ return { multiple: true };
157
+ default:
158
+ return {};
159
+ }
160
+ }
161
+ }
162
+ //# sourceMappingURL=ox-data-input-factory.js.map
@@ -0,0 +1 @@
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 type=\"date\" name=${tag} .value=${value} />`\n case 'datetime':\n return html`<input type=\"datetime-local\" name=${tag} .value=${value} />`\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"]}
@@ -9,5 +9,5 @@ export declare class OxDataOocBriefView extends LitElement {
9
9
  static styles: import("lit").CSSResult;
10
10
  dataOoc?: DataOoc;
11
11
  render(): import("lit-html").TemplateResult<1>;
12
- private showDataSampleView;
12
+ private renderDataSample;
13
13
  }
@@ -10,29 +10,20 @@ let OxDataOocBriefView = class OxDataOocBriefView extends LitElement {
10
10
  render() {
11
11
  const { state } = this.dataOoc || {};
12
12
  return html `
13
- ${this.showDataSampleView()}
14
- <!-- <ox-data-sample-view .dataSample=${this.dataOoc}></ox-data-sample-view> -->
13
+ ${this.renderDataSample()}
15
14
  <ox-data-ooc-badge .state=${state}></ox-data-ooc-badge>
16
15
  <ox-data-ooc-correction-part .dataOoc=${this.dataOoc}></ox-data-ooc-correction-part>
17
16
  `;
18
17
  }
19
- showDataSampleView() {
18
+ renderDataSample() {
20
19
  var _a;
21
20
  const dataSet = (_a = this.dataOoc) === null || _a === void 0 ? void 0 : _a.dataSet;
22
21
  const monitorType = dataSet === null || dataSet === void 0 ? void 0 : dataSet.monitorType;
23
- const monitorView = dataSet === null || dataSet === void 0 ? void 0 : dataSet.monitorView;
24
22
  switch (monitorType) {
25
23
  case 'generated':
26
- if (!monitorView || monitorView === 'Default') {
27
- return html `<ox-data-sample-view .dataSample=${this.dataOoc}></ox-data-sample-view>`;
28
- }
29
- else if (monitorView === 'Checklist') {
30
- return html `<ox-checklist-sample-view .dataSample=${this.dataOoc}></ox-checklist-sample-view>`;
31
- }
32
- else {
33
- return html `<ox-data-sample-view .dataSample=${this.dataOoc}></ox-data-sample-view>`;
34
- }
35
- break;
24
+ return html `<ox-data-sample-view .dataSample=${this.dataOoc}></ox-data-sample-view>`;
25
+ case 'checklist':
26
+ return html `<ox-checklist-sample-view .dataSample=${this.dataOoc}></ox-checklist-sample-view>`;
36
27
  case 'board':
37
28
  break;
38
29
  case 'page':