@operato/dataset 2.0.0-alpha.3 → 2.0.0-alpha.31
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 +222 -0
- package/demo/favicon.ico +0 -0
- package/demo/index.html +338 -0
- package/demo/ox-data-ooc-brief-view-test.html +338 -0
- package/dist/src/ox-data-entry-form.js +48 -36
- package/dist/src/ox-data-entry-form.js.map +1 -1
- package/dist/src/ox-data-entry-subgroup-form.js +2 -0
- package/dist/src/ox-data-entry-subgroup-form.js.map +1 -1
- package/dist/src/ox-data-entry-view.d.ts +2 -2
- package/dist/src/ox-data-entry-view.js +12 -2
- package/dist/src/ox-data-entry-view.js.map +1 -1
- package/dist/src/ox-data-ooc-badge.d.ts +9 -0
- package/dist/src/ox-data-ooc-badge.js +66 -0
- package/dist/src/ox-data-ooc-badge.js.map +1 -0
- package/dist/src/ox-data-ooc-brief-view.d.ts +2 -0
- package/dist/src/ox-data-ooc-brief-view.js +8 -110
- package/dist/src/ox-data-ooc-brief-view.js.map +1 -1
- package/dist/src/ox-data-ooc-correction-part.d.ts +9 -0
- package/dist/src/ox-data-ooc-correction-part.js +99 -0
- package/dist/src/ox-data-ooc-correction-part.js.map +1 -0
- package/dist/src/ox-data-ooc-history.d.ts +10 -0
- package/dist/src/ox-data-ooc-history.js +72 -0
- package/dist/src/ox-data-ooc-history.js.map +1 -0
- package/dist/src/ox-data-ooc-view.d.ts +1 -0
- package/dist/src/ox-data-ooc-view.js +6 -89
- package/dist/src/ox-data-ooc-view.js.map +1 -1
- package/dist/src/ox-data-sample-subgroup-view.js +1 -1
- package/dist/src/ox-data-sample-subgroup-view.js.map +1 -1
- package/dist/src/ox-data-sample-view.js +47 -30
- package/dist/src/ox-data-sample-view.js.map +1 -1
- package/dist/src/ox-data-summary-view.js +7 -1
- package/dist/src/ox-data-summary-view.js.map +1 -1
- package/dist/src/types.d.ts +57 -9
- package/dist/src/types.js.map +1 -1
- package/dist/src/usecase/spc/index.d.ts +1 -0
- package/dist/src/usecase/spc/index.js +8 -0
- package/dist/src/usecase/spc/index.js.map +1 -0
- package/dist/src/usecase/spc/ox-data-use-case-spc.d.ts +7 -0
- package/dist/src/usecase/spc/ox-data-use-case-spc.js +102 -0
- package/dist/src/usecase/spc/ox-data-use-case-spc.js.map +1 -0
- package/dist/src/usecase/spc/ox-input-spc-limits.d.ts +44 -0
- package/dist/src/usecase/spc/ox-input-spc-limits.js +193 -0
- package/dist/src/usecase/spc/ox-input-spc-limits.js.map +1 -0
- package/dist/src/usecase/spc/ox-property-editor-spc-limits.d.ts +6 -0
- package/dist/src/usecase/spc/ox-property-editor-spc-limits.js +24 -0
- package/dist/src/usecase/spc/ox-property-editor-spc-limits.js.map +1 -0
- package/dist/stories/ox-data-entry-form.stories.js +43 -0
- package/dist/stories/ox-data-entry-form.stories.js.map +1 -1
- package/dist/stories/ox-data-ooc-view.stories.js +2 -0
- package/dist/stories/ox-data-ooc-view.stories.js.map +1 -1
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/package.json +37 -22
- package/src/ox-data-entry-form.ts +65 -46
- package/src/ox-data-entry-subgroup-form.ts +2 -0
- package/src/ox-data-entry-view.ts +13 -2
- package/src/ox-data-ooc-badge.ts +64 -0
- package/src/ox-data-ooc-brief-view.ts +9 -120
- package/src/ox-data-ooc-correction-part.ts +107 -0
- package/src/ox-data-ooc-history.ts +74 -0
- package/src/ox-data-ooc-view.ts +6 -91
- package/src/ox-data-sample-subgroup-view.ts +1 -1
- package/src/ox-data-sample-view.ts +47 -30
- package/src/ox-data-summary-view.ts +7 -1
- package/src/types.ts +76 -27
- package/src/usecase/spc/index.ts +10 -0
- package/src/usecase/spc/ox-data-use-case-spc.ts +147 -0
- package/src/usecase/spc/ox-input-spc-limits.ts +182 -0
- package/src/usecase/spc/ox-property-editor-spc-limits.ts +23 -0
- package/stories/ox-data-entry-form.stories.ts +44 -0
- package/stories/ox-data-ooc-view.stories.ts +2 -0
- package/themes/grist-theme.css +1 -1
- package/translations/en.json +1 -0
- package/translations/ko.json +1 -0
- package/translations/ms.json +142 -70
- package/translations/zh.json +146 -75
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { __decorate } from "tslib";
|
|
2
2
|
import '@operato/input/ox-input-file.js';
|
|
3
3
|
import './ox-data-sample-view';
|
|
4
|
+
import './ox-data-ooc-history';
|
|
4
5
|
import '@material/mwc-icon';
|
|
5
6
|
import { css, html, LitElement } from 'lit';
|
|
6
7
|
import { customElement, property } from 'lit/decorators.js';
|
|
@@ -10,27 +11,14 @@ import { i18next } from '@operato/i18n';
|
|
|
10
11
|
*/
|
|
11
12
|
let OxDataOocView = class OxDataOocView extends LitElement {
|
|
12
13
|
render() {
|
|
13
|
-
const {
|
|
14
|
-
const formatter = new Intl.DateTimeFormat(navigator.language, { dateStyle: 'full', timeStyle: 'short' });
|
|
14
|
+
const { state } = this.dataOoc || {};
|
|
15
15
|
return html `
|
|
16
16
|
<ox-data-sample-view .dataSample=${this.dataOoc}></ox-data-sample-view>
|
|
17
17
|
|
|
18
|
-
<
|
|
19
|
-
<mwc-icon>shield</mwc-icon>
|
|
20
|
-
<div>DATA OOC <span field-state>${state || ''}</span></div>
|
|
21
|
-
</h3>
|
|
18
|
+
<ox-data-ooc-badge .state=${state}></ox-data-ooc-badge>
|
|
22
19
|
|
|
23
20
|
<h3>${i18next.t('title.history')}</h3>
|
|
24
|
-
|
|
25
|
-
<p page-history>
|
|
26
|
-
<!--상태에 따라 추가로 danger, complete를 어트리뷰트로 추가시 배경컬러 변경되도록 해두었습니다-->
|
|
27
|
-
<span field-info
|
|
28
|
-
>${formatter.format(new Date(timestamp))} <mwc-icon>account_circle</mwc-icon>${user.name}</span
|
|
29
|
-
>
|
|
30
|
-
<span field-state>${state}</span>
|
|
31
|
-
<strong>${comment}</strong>
|
|
32
|
-
</p>
|
|
33
|
-
`)}
|
|
21
|
+
<ox-data-ooc-history .dataOoc=${this.dataOoc}></ox-data-ooc-history>
|
|
34
22
|
`;
|
|
35
23
|
}
|
|
36
24
|
};
|
|
@@ -38,88 +26,17 @@ OxDataOocView.styles = css `
|
|
|
38
26
|
:host {
|
|
39
27
|
display: flex;
|
|
40
28
|
flex-direction: column;
|
|
41
|
-
background-color: var(--main-section-background-color);
|
|
42
29
|
|
|
43
30
|
position: relative;
|
|
44
31
|
}
|
|
45
32
|
|
|
46
|
-
|
|
47
|
-
margin: var(--title-margin);
|
|
48
|
-
padding-top: 12px;
|
|
49
|
-
font: var(--title-font);
|
|
50
|
-
color: var(--title-text-color);
|
|
51
|
-
}
|
|
52
|
-
|
|
53
|
-
h3[state] {
|
|
33
|
+
ox-data-ooc-badge {
|
|
54
34
|
position: absolute;
|
|
35
|
+
|
|
55
36
|
margin: 0;
|
|
56
37
|
padding: 0;
|
|
57
38
|
right: 10px;
|
|
58
39
|
width: 90px;
|
|
59
|
-
text-align: center;
|
|
60
|
-
}
|
|
61
|
-
|
|
62
|
-
mwc-icon {
|
|
63
|
-
font-size: 16px;
|
|
64
|
-
}
|
|
65
|
-
[state] mwc-icon {
|
|
66
|
-
font-size: 80px;
|
|
67
|
-
opacity: 0.4;
|
|
68
|
-
color: var(--primary-background-color);
|
|
69
|
-
}
|
|
70
|
-
|
|
71
|
-
[state] div {
|
|
72
|
-
position: absolute;
|
|
73
|
-
top: 22px;
|
|
74
|
-
left: 0;
|
|
75
|
-
right: 0;
|
|
76
|
-
font-size: 10px;
|
|
77
|
-
color: var(--theme-white-color);
|
|
78
|
-
}
|
|
79
|
-
[state] [field-state] {
|
|
80
|
-
display: block;
|
|
81
|
-
border-radius: 4px;
|
|
82
|
-
background-color: var(--primary-color);
|
|
83
|
-
box-shadow: var(--box-shadow);
|
|
84
|
-
margin-top: var(--margin-narrow);
|
|
85
|
-
padding: 1px 3px;
|
|
86
|
-
font-size: 0.8rem;
|
|
87
|
-
}
|
|
88
|
-
[danger] [field-state] {
|
|
89
|
-
background-color: var(--status-danger-color);
|
|
90
|
-
}
|
|
91
|
-
[complete] [field-state] {
|
|
92
|
-
background-color: var(--status-info-color);
|
|
93
|
-
}
|
|
94
|
-
[page-history] [field-state] {
|
|
95
|
-
border-radius: 2px;
|
|
96
|
-
background-color: var(--primary-color);
|
|
97
|
-
margin-left: var(--margin-default);
|
|
98
|
-
padding: 1px 2px;
|
|
99
|
-
font-size: 0.7rem;
|
|
100
|
-
color: var(--theme-white-color);
|
|
101
|
-
}
|
|
102
|
-
[page-history] {
|
|
103
|
-
background-color: var(--theme-white-color);
|
|
104
|
-
box-shadow: var(--box-shadow);
|
|
105
|
-
border-radius: var(--border-radius);
|
|
106
|
-
margin: var(--page-description-margin);
|
|
107
|
-
padding: var(--padding-default);
|
|
108
|
-
font: var(--page-description-font);
|
|
109
|
-
color: var(--secondary-color);
|
|
110
|
-
}
|
|
111
|
-
[page-history] mwc-icon {
|
|
112
|
-
position: relative;
|
|
113
|
-
top: 3px;
|
|
114
|
-
margin: 0 2px 0 10px;
|
|
115
|
-
}
|
|
116
|
-
[field-info] {
|
|
117
|
-
opacity: 0.7;
|
|
118
|
-
}
|
|
119
|
-
[page-history] strong {
|
|
120
|
-
display: block;
|
|
121
|
-
font-weight: bold;
|
|
122
|
-
font-size: 0.9rem;
|
|
123
40
|
}
|
|
124
41
|
`;
|
|
125
42
|
__decorate([
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ox-data-ooc-view.js","sourceRoot":"","sources":["../../src/ox-data-ooc-view.ts"],"names":[],"mappings":";AAAA,OAAO,iCAAiC,CAAA;AACxC,OAAO,uBAAuB,CAAA;AAC9B,OAAO,oBAAoB,CAAA;AAE3B,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE3D,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AAIvC;;GAEG;AAEI,IAAM,aAAa,GAAnB,MAAM,aAAc,SAAQ,UAAU;
|
|
1
|
+
{"version":3,"file":"ox-data-ooc-view.js","sourceRoot":"","sources":["../../src/ox-data-ooc-view.ts"],"names":[],"mappings":";AAAA,OAAO,iCAAiC,CAAA;AACxC,OAAO,uBAAuB,CAAA;AAC9B,OAAO,uBAAuB,CAAA;AAC9B,OAAO,oBAAoB,CAAA;AAE3B,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE3D,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AAIvC;;GAEG;AAEI,IAAM,aAAa,GAAnB,MAAM,aAAc,SAAQ,UAAU;IAsB3C,MAAM;QACJ,MAAM,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC,OAAO,IAAI,EAAE,CAAA;QAEpC,OAAO,IAAI,CAAA;yCAC0B,IAAI,CAAC,OAAO;;kCAEnB,KAAK;;YAE3B,OAAO,CAAC,CAAC,CAAC,eAAe,CAAC;sCACA,IAAI,CAAC,OAAO;KAC7C,CAAA;IACH,CAAC;;AAhCM,oBAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;GAgBlB,AAhBY,CAgBZ;AAE2B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;8CAAkB;AACjB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;8CAAkB;AApBlC,aAAa;IADzB,aAAa,CAAC,kBAAkB,CAAC;GACrB,aAAa,CAkCzB","sourcesContent":["import '@operato/input/ox-input-file.js'\nimport './ox-data-sample-view'\nimport './ox-data-ooc-history'\nimport '@material/mwc-icon'\n\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { i18next } from '@operato/i18n'\n\nimport { DataOoc, DataSet } from './types.js'\n\n/**\n * @deprecated by ox-data-ooc-brief-view\n */\n@customElement('ox-data-ooc-view')\nexport class OxDataOocView extends LitElement {\n static styles = css`\n :host {\n display: flex;\n flex-direction: column;\n\n position: relative;\n }\n\n ox-data-ooc-badge {\n position: absolute;\n\n margin: 0;\n padding: 0;\n right: 10px;\n width: 90px;\n }\n `\n\n @property({ type: Object }) dataSet?: DataSet\n @property({ type: Object }) dataOoc?: DataOoc\n\n render() {\n const { state } = this.dataOoc || {}\n\n return html`\n <ox-data-sample-view .dataSample=${this.dataOoc}></ox-data-sample-view>\n\n <ox-data-ooc-badge .state=${state}></ox-data-ooc-badge>\n\n <h3>${i18next.t('title.history')}</h3>\n <ox-data-ooc-history .dataOoc=${this.dataOoc}></ox-data-ooc-history>\n `\n }\n}\n"]}
|
|
@@ -117,6 +117,7 @@ OxDataSampleSubgroupView.styles = css `
|
|
|
117
117
|
font-weight: bold;
|
|
118
118
|
color: var(--th-color);
|
|
119
119
|
text-align: center;
|
|
120
|
+
white-space: nowrap;
|
|
120
121
|
}
|
|
121
122
|
|
|
122
123
|
th.label,
|
|
@@ -153,7 +154,6 @@ OxDataSampleSubgroupView.styles = css `
|
|
|
153
154
|
|
|
154
155
|
pre {
|
|
155
156
|
tab-size: 2;
|
|
156
|
-
text-wrap: wrap;
|
|
157
157
|
text-align: left;
|
|
158
158
|
}
|
|
159
159
|
`;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ox-data-sample-subgroup-view.js","sourceRoot":"","sources":["../../src/ox-data-sample-subgroup-view.ts"],"names":[],"mappings":"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","sourcesContent":["import '@operato/input/ox-input-file.js'\n\nimport { css, html, LitElement, nothing } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { i18next } from '@operato/i18n'\n\nimport { DataSample, DataSpecLimitSet } from './types.js'\nimport { OxDataUseCase } from './usecase/ox-data-use-case.js'\n\n@customElement('ox-data-sample-subgroup-view')\nexport class OxDataSampleSubgroupView extends LitElement {\n static styles = css`\n :host {\n display: flex;\n flex-direction: column;\n }\n\n h3 {\n margin: var(--title-margin);\n font: var(--title-font);\n font-size: 20px;\n color: var(--title-text-color);\n text-transform: capitalize;\n }\n\n table {\n border-collapse: collapse;\n margin-bottom: var(--margin-default);\n }\n\n th {\n padding: var(--th-padding);\n border-top: var(--th-border-top);\n border-left: var(--td-border-line, 1px solid rgba(0, 0, 0, 0.05));\n border-bottom: var(--td-border-bottom);\n text-transform: var(--th-text-transform);\n font: var(--th-font);\n font-weight: bold;\n color: var(--th-color);\n text-align: center;\n }\n\n th.label,\n td.label {\n background-color: var(--label-cell-background-color, #f6f6f6);\n width: 120px;\n text-transform: var(--th-text-transform);\n }\n\n tr {\n background-color: var(--tr-background-color);\n }\n\n tr:hover {\n background-color: var(--tr-background-hover-color);\n }\n\n td {\n border-left: var(--td-border-line, 1px solid rgba(0, 0, 0, 0.05));\n border-bottom: var(--td-border-bottom);\n padding: var(--td-padding);\n font: var(--td-font);\n color: var(--td-color);\n text-align: center;\n }\n tr th:first-child,\n tr td:first-child {\n border-left: none;\n }\n\n td mwc-icon {\n color: var(--status-danger-color);\n }\n\n pre {\n tab-size: 2;\n text-wrap: wrap;\n text-align: left;\n }\n `\n\n @property({ type: Object }) dataSample?: DataSample\n @property({ type: String }) subgroup?: string\n\n render() {\n if (!this.dataSample) {\n return html``\n }\n\n const { useCase, data = {}, judgment, dataItems = [] } = this.dataSample\n const useCaseNames = useCase?.split(',').filter(useCase => useCase.trim()) || []\n const subgroupDataItems = dataItems.filter(dataItem => dataItem.group == this.subgroup && !dataItem.hidden)\n const records = subgroupDataItems.reduce((max, dataItem) => {\n const value = data[dataItem.tag]\n return Math.max(max, Array.isArray(value) ? value.length : 1)\n }, 0)\n\n return html` <h3>${this.subgroup}</h3>\n <table>\n <tr>\n <th class=\"label\">${i18next.t('field.name')}</th>\n ${subgroupDataItems.map(\n dataItem => html` <th>${dataItem.name} ${dataItem.unit ? `(${dataItem.unit})` : ''}</th> `\n )}\n </tr>\n <tr>\n <td class=\"label\">${i18next.t('field.description')}</td>\n ${subgroupDataItems.map(dataItem => html` <td>${dataItem.description}</td> `)}\n </tr>\n ${Array.from({ length: records }, (_, index) => index).map(\n index =>\n html`\n <tr>\n <td class=\"label\">${records > 1 ? index + 1 : i18next.t('field.value')}</td>\n ${subgroupDataItems.map(dataItem => {\n const { tag = '', type } = dataItem\n const valueArray = data[tag]\n const value = Array.isArray(valueArray) ? valueArray[index] : index == 0 ? valueArray : undefined\n\n return html` <td>${this.buildValue(type, value)}</td> `\n })}\n </tr>\n `\n )}\n <tr>\n <td class=\"label\">${i18next.t('field.spec')}</td>\n ${subgroupDataItems.map(\n dataItem => html` <td><pre>${this.buildSpec(useCaseNames, dataItem.spec)}</pre></td> `\n )}\n </tr>\n <tr>\n <td class=\"label\">${i18next.t('field.ooc')}</td>\n ${subgroupDataItems.map(\n dataItem => html` <td>${judgment?.[dataItem.tag]?.ooc ? html`<mwc-icon>done</mwc-icon>` : nothing}</td> `\n )}\n </tr>\n <tr>\n <td class=\"label\">${i18next.t('field.oos')}</td>\n ${subgroupDataItems.map(\n dataItem => html` <td>${judgment?.[dataItem.tag]?.oos ? html`<mwc-icon>done</mwc-icon>` : nothing}</td> `\n )}\n </tr>\n </table>`\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.map(file => html`<a @click=${() => this.download(file)}>${file.name}</a></br>`)\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 new Date(v).toLocaleDateString()\n } else if (type == 'datetime') {\n return 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-data-sample-subgroup-view.js","sourceRoot":"","sources":["../../src/ox-data-sample-subgroup-view.ts"],"names":[],"mappings":"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","sourcesContent":["import '@operato/input/ox-input-file.js'\n\nimport { css, html, LitElement, nothing } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { i18next } from '@operato/i18n'\n\nimport { DataSample, DataSpecLimitSet } from './types.js'\nimport { OxDataUseCase } from './usecase/ox-data-use-case.js'\n\n@customElement('ox-data-sample-subgroup-view')\nexport class OxDataSampleSubgroupView extends LitElement {\n static styles = css`\n :host {\n display: flex;\n flex-direction: column;\n }\n\n h3 {\n margin: var(--title-margin);\n font: var(--title-font);\n font-size: 20px;\n color: var(--title-text-color);\n text-transform: capitalize;\n }\n\n table {\n border-collapse: collapse;\n margin-bottom: var(--margin-default);\n }\n\n th {\n padding: var(--th-padding);\n border-top: var(--th-border-top);\n border-left: var(--td-border-line, 1px solid rgba(0, 0, 0, 0.05));\n border-bottom: var(--td-border-bottom);\n text-transform: var(--th-text-transform);\n font: var(--th-font);\n font-weight: bold;\n color: var(--th-color);\n text-align: center;\n white-space: nowrap;\n }\n\n th.label,\n td.label {\n background-color: var(--label-cell-background-color, #f6f6f6);\n width: 120px;\n text-transform: var(--th-text-transform);\n }\n\n tr {\n background-color: var(--tr-background-color);\n }\n\n tr:hover {\n background-color: var(--tr-background-hover-color);\n }\n\n td {\n border-left: var(--td-border-line, 1px solid rgba(0, 0, 0, 0.05));\n border-bottom: var(--td-border-bottom);\n padding: var(--td-padding);\n font: var(--td-font);\n color: var(--td-color);\n text-align: center;\n }\n tr th:first-child,\n tr td:first-child {\n border-left: none;\n }\n\n td mwc-icon {\n color: var(--status-danger-color);\n }\n\n pre {\n tab-size: 2;\n text-align: left;\n }\n `\n\n @property({ type: Object }) dataSample?: DataSample\n @property({ type: String }) subgroup?: string\n\n render() {\n if (!this.dataSample) {\n return html``\n }\n\n const { useCase, data = {}, judgment, dataItems = [] } = this.dataSample\n const useCaseNames = useCase?.split(',').filter(useCase => useCase.trim()) || []\n const subgroupDataItems = dataItems.filter(dataItem => dataItem.group == this.subgroup && !dataItem.hidden)\n const records = subgroupDataItems.reduce((max, dataItem) => {\n const value = data[dataItem.tag]\n return Math.max(max, Array.isArray(value) ? value.length : 1)\n }, 0)\n\n return html` <h3>${this.subgroup}</h3>\n <table>\n <tr>\n <th class=\"label\">${i18next.t('field.name')}</th>\n ${subgroupDataItems.map(\n dataItem => html` <th>${dataItem.name} ${dataItem.unit ? `(${dataItem.unit})` : ''}</th> `\n )}\n </tr>\n <tr>\n <td class=\"label\">${i18next.t('field.description')}</td>\n ${subgroupDataItems.map(dataItem => html` <td>${dataItem.description}</td> `)}\n </tr>\n ${Array.from({ length: records }, (_, index) => index).map(\n index =>\n html`\n <tr>\n <td class=\"label\">${records > 1 ? index + 1 : i18next.t('field.value')}</td>\n ${subgroupDataItems.map(dataItem => {\n const { tag = '', type } = dataItem\n const valueArray = data[tag]\n const value = Array.isArray(valueArray) ? valueArray[index] : index == 0 ? valueArray : undefined\n\n return html` <td>${this.buildValue(type, value)}</td> `\n })}\n </tr>\n `\n )}\n <tr>\n <td class=\"label\">${i18next.t('field.spec')}</td>\n ${subgroupDataItems.map(\n dataItem => html` <td><pre>${this.buildSpec(useCaseNames, dataItem.spec)}</pre></td> `\n )}\n </tr>\n <tr>\n <td class=\"label\">${i18next.t('field.ooc')}</td>\n ${subgroupDataItems.map(\n dataItem => html` <td>${judgment?.[dataItem.tag]?.ooc ? html`<mwc-icon>done</mwc-icon>` : nothing}</td> `\n )}\n </tr>\n <tr>\n <td class=\"label\">${i18next.t('field.oos')}</td>\n ${subgroupDataItems.map(\n dataItem => html` <td>${judgment?.[dataItem.tag]?.oos ? html`<mwc-icon>done</mwc-icon>` : nothing}</td> `\n )}\n </tr>\n </table>`\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.map(file => html`<a @click=${() => this.download(file)}>${file.name}</a></br>`)\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 new Date(v).toLocaleDateString()\n } else if (type == 'datetime') {\n return new Date(v).toLocaleString()\n }\n return v ?? ''\n }\n })\n\n return typeof values[0] === 'boolean' ? elements : elements.join(', ')\n }\n}\n"]}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { __decorate } from "tslib";
|
|
2
2
|
import '@operato/input/ox-input-file.js';
|
|
3
3
|
import './ox-data-sample-subgroup-view.js';
|
|
4
|
-
import { css, html, LitElement } from 'lit';
|
|
4
|
+
import { css, html, LitElement, nothing } from 'lit';
|
|
5
5
|
import { customElement, property } from 'lit/decorators.js';
|
|
6
6
|
import { i18next } from '@operato/i18n';
|
|
7
7
|
import { OxDataUseCase } from './usecase/ox-data-use-case.js';
|
|
@@ -24,35 +24,39 @@ let OxDataSampleView = class OxDataSampleView extends LitElement {
|
|
|
24
24
|
</p>
|
|
25
25
|
|
|
26
26
|
<form>
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
27
|
+
${nonGroupDataItems.length > 0
|
|
28
|
+
? html `
|
|
29
|
+
<table>
|
|
30
|
+
<tr>
|
|
31
|
+
<th item>${i18next.t('field.item')}</th>
|
|
32
|
+
<th>${i18next.t('field.description')}</th>
|
|
33
|
+
<th>${i18next.t('field.finalizing-function')}</th>
|
|
34
|
+
<th>${i18next.t('field.unit')}</th>
|
|
35
|
+
<th value>${i18next.t('field.value')}</th>
|
|
36
|
+
<th>${i18next.t('field.spec')}</th>
|
|
37
|
+
<th>${i18next.t('field.ooc')}</th>
|
|
38
|
+
<th>${i18next.t('field.oos')}</th>
|
|
39
|
+
</tr>
|
|
40
|
+
${nonGroupDataItems.map(dataItem => {
|
|
41
|
+
const { name = '', tag = '', description = '', stat, unit = '', spec = {}, type } = dataItem;
|
|
42
|
+
const value = data[tag];
|
|
43
|
+
const { ooc, oos } = (judgment === null || judgment === void 0 ? void 0 : judgment[tag]) || {};
|
|
44
|
+
return html `
|
|
45
|
+
<tr ?ooc=${ooc} ?oos=${oos}>
|
|
46
|
+
<td name>${name}</td>
|
|
47
|
+
<td>${description}</td>
|
|
48
|
+
<td>${stat}</td>
|
|
49
|
+
<td>${unit}</td>
|
|
50
|
+
<td>${this.buildValue(type, value)}</td>
|
|
51
|
+
<td><pre>${this.buildSpec(useCaseNames, spec)}</pre></td>
|
|
52
|
+
<td>${ooc ? html `<mwc-icon>done</mwc-icon>` : ''}</td>
|
|
53
|
+
<td>${oos ? html `<mwc-icon>done</mwc-icon>` : ''}</td>
|
|
54
|
+
</tr>
|
|
55
|
+
`;
|
|
56
|
+
})}
|
|
57
|
+
</table>
|
|
58
|
+
`
|
|
59
|
+
: nothing}
|
|
56
60
|
${Object.keys(dataItemSubgroups).map(subgroup => {
|
|
57
61
|
return html `
|
|
58
62
|
<ox-data-sample-subgroup-view
|
|
@@ -160,6 +164,7 @@ OxDataSampleView.styles = css `
|
|
|
160
164
|
font: var(--th-font);
|
|
161
165
|
color: var(--th-color);
|
|
162
166
|
text-align: left;
|
|
167
|
+
white-space: nowrap;
|
|
163
168
|
}
|
|
164
169
|
th[item] {
|
|
165
170
|
min-width: 100px;
|
|
@@ -196,6 +201,18 @@ OxDataSampleView.styles = css `
|
|
|
196
201
|
pre {
|
|
197
202
|
tab-size: 2;
|
|
198
203
|
}
|
|
204
|
+
|
|
205
|
+
@media print {
|
|
206
|
+
:host {
|
|
207
|
+
display: block;
|
|
208
|
+
}
|
|
209
|
+
}
|
|
210
|
+
|
|
211
|
+
@media screen and (max-width: 480px) {
|
|
212
|
+
th {
|
|
213
|
+
min-width: 50px;
|
|
214
|
+
}
|
|
215
|
+
}
|
|
199
216
|
`;
|
|
200
217
|
__decorate([
|
|
201
218
|
property({ type: Object })
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ox-data-sample-view.js","sourceRoot":"","sources":["../../src/ox-data-sample-view.ts"],"names":[],"mappings":"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","sourcesContent":["import '@operato/input/ox-input-file.js'\nimport './ox-data-sample-subgroup-view.js'\n\nimport { css, html, LitElement } 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-data-sample-view')\nexport class OxDataSampleView extends LitElement {\n static styles = css`\n :host {\n display: flex;\n flex-direction: column;\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(--secondary-color);\n text-transform: capitalize;\n }\n [page-description] * {\n vertical-align: middle;\n }\n [page-description] mwc-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(--margin-default);\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 }\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-bottom: var(--td-border-bottom);\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 mwc-icon {\n color: var(--status-danger-color);\n }\n\n pre {\n tab-size: 2;\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 nonGroupDataItems = dataItems.filter(dataItem => !dataItem.group && !dataItem.hidden)\n const dataItemSubgroups = this.groupDataItemsByGroup(dataItems)\n\n return html` <h2>${name}</h2>\n <p page-description>\n <mwc-icon>info_outline</mwc-icon> ${description}<br />\n <mwc-icon>alarm</mwc-icon> ${i18next.t('field.work-date')}: ${workDate} ${workShift} |\n <mwc-icon>pending_actions</mwc-icon> ${i18next.t('field.collected-at')}:\n ${formatter.format(new Date(collectedAt!))}\n </p>\n\n <form>\n <table>\n <tr>\n <th item>${i18next.t('field.item')}</th>\n <th>${i18next.t('field.description')}</th>\n <th>${i18next.t('field.stat-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 ${nonGroupDataItems.map(dataItem => {\n const { name = '', tag = '', description = '', stat, unit = '', spec = {}, type } = dataItem\n const value = data[tag]\n const { ooc, oos } = judgment?.[tag] || {}\n\n return html`\n <tr ?ooc=${ooc} ?oos=${oos}>\n <td name>${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`<mwc-icon>done</mwc-icon>` : ''}</td>\n <td>${oos ? html`<mwc-icon>done</mwc-icon>` : ''}</td>\n </tr>\n `\n })}\n </table>\n ${Object.keys(dataItemSubgroups).map(subgroup => {\n return html`\n <ox-data-sample-subgroup-view\n .subgroup=${subgroup}\n .dataSample=${this.dataSample}\n ></ox-data-sample-subgroup-view>\n `\n })}\n </form>`\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, hidden } = dataItem\n\n if (group && !hidden) {\n if (!groupedDataItems[group]) {\n groupedDataItems[group] = []\n }\n\n groupedDataItems[group].push(dataItem)\n }\n }\n\n return groupedDataItems\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.map(file => html`<a @click=${() => this.download(file)}>${file.name}</a></br>`)\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 new Date(v).toLocaleDateString()\n } else if (type == 'datetime') {\n return 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-data-sample-view.js","sourceRoot":"","sources":["../../src/ox-data-sample-view.ts"],"names":[],"mappings":";AAAA,OAAO,iCAAiC,CAAA;AACxC,OAAO,mCAAmC,CAAA;AAE1C,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,KAAK,CAAA;AACpD,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE3D,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AAGvC,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAA;AAGtD,IAAM,gBAAgB,GAAtB,MAAM,gBAAiB,SAAQ,UAAU;IAqG9C,MAAM;QACJ,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE,CAAC;YACrB,OAAO,IAAI,CAAA,EAAE,CAAA;QACf,CAAC;QAED,MAAM,EACJ,IAAI,EACJ,WAAW,EACX,WAAW,EACX,QAAQ,EACR,SAAS,EACT,OAAO,EACP,IAAI,GAAG,EAAE,EACT,QAAQ,EACR,SAAS,GAAG,EAAE,EACf,GAAG,IAAI,CAAC,UAAU,CAAA;QACnB,MAAM,SAAS,GAAG,IAAI,IAAI,CAAC,cAAc,CAAC,SAAS,CAAC,QAAQ,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,CAAA;QACxG,MAAM,YAAY,GAAG,CAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,KAAK,CAAC,GAAG,EAAE,MAAM,CAAC,OAAO,CAAC,EAAE,CAAC,OAAO,CAAC,IAAI,EAAE,CAAC,KAAI,EAAE,CAAA;QAChF,MAAM,iBAAiB,GAAG,SAAS,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,QAAQ,CAAC,KAAK,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAA;QAC3F,MAAM,iBAAiB,GAAG,IAAI,CAAC,qBAAqB,CAAC,SAAS,CAAC,CAAA;QAE/D,OAAO,IAAI,CAAA,QAAQ,IAAI;;4CAEiB,WAAW;qCAClB,OAAO,CAAC,CAAC,CAAC,iBAAiB,CAAC,KAAK,QAAQ,IAAI,SAAS;+CAC5C,OAAO,CAAC,CAAC,CAAC,oBAAoB,CAAC;UACpE,SAAS,CAAC,MAAM,CAAC,IAAI,IAAI,CAAC,WAAY,CAAC,CAAC;;;;UAIxC,iBAAiB,CAAC,MAAM,GAAG,CAAC;YAC5B,CAAC,CAAC,IAAI,CAAA;;;6BAGa,OAAO,CAAC,CAAC,CAAC,YAAY,CAAC;wBAC5B,OAAO,CAAC,CAAC,CAAC,mBAAmB,CAAC;wBAC9B,OAAO,CAAC,CAAC,CAAC,2BAA2B,CAAC;wBACtC,OAAO,CAAC,CAAC,CAAC,YAAY,CAAC;8BACjB,OAAO,CAAC,CAAC,CAAC,aAAa,CAAC;wBAC9B,OAAO,CAAC,CAAC,CAAC,YAAY,CAAC;wBACvB,OAAO,CAAC,CAAC,CAAC,WAAW,CAAC;wBACtB,OAAO,CAAC,CAAC,CAAC,WAAW,CAAC;;kBAE5B,iBAAiB,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE;gBACjC,MAAM,EAAE,IAAI,GAAG,EAAE,EAAE,GAAG,GAAG,EAAE,EAAE,WAAW,GAAG,EAAE,EAAE,IAAI,EAAE,IAAI,GAAG,EAAE,EAAE,IAAI,GAAG,EAAE,EAAE,IAAI,EAAE,GAAG,QAAQ,CAAA;gBAC5F,MAAM,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,CAAA;gBACvB,MAAM,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,CAAA,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,GAAG,CAAC,KAAI,EAAE,CAAA;gBAE1C,OAAO,IAAI,CAAA;+BACE,GAAG,SAAS,GAAG;iCACb,IAAI;4BACT,WAAW;4BACX,IAAI;4BACJ,IAAI;4BACJ,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,KAAK,CAAC;iCACvB,IAAI,CAAC,SAAS,CAAC,YAAY,EAAE,IAAI,CAAC;4BACvC,GAAG,CAAC,CAAC,CAAC,IAAI,CAAA,2BAA2B,CAAC,CAAC,CAAC,EAAE;4BAC1C,GAAG,CAAC,CAAC,CAAC,IAAI,CAAA,2BAA2B,CAAC,CAAC,CAAC,EAAE;;mBAEnD,CAAA;YACH,CAAC,CAAC;;aAEL;YACH,CAAC,CAAC,OAAO;UACT,MAAM,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE;YAC9C,OAAO,IAAI,CAAA;;0BAEK,QAAQ;4BACN,IAAI,CAAC,UAAU;;WAEhC,CAAA;QACH,CAAC,CAAC;cACI,CAAA;IACZ,CAAC;IAEO,qBAAqB,CAAC,SAAqB;QACjD,MAAM,gBAAgB,GAAoC,EAAE,CAAA;QAE5D,KAAK,MAAM,QAAQ,IAAI,SAAS,EAAE,CAAC;YACjC,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,QAAQ,CAAA;YAElC,IAAI,KAAK,IAAI,CAAC,MAAM,EAAE,CAAC;gBACrB,IAAI,CAAC,gBAAgB,CAAC,KAAK,CAAC,EAAE,CAAC;oBAC7B,gBAAgB,CAAC,KAAK,CAAC,GAAG,EAAE,CAAA;gBAC9B,CAAC;gBAED,gBAAgB,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAA;YACxC,CAAC;QACH,CAAC;QAED,OAAO,gBAAgB,CAAA;IACzB,CAAC;IAEO,SAAS,CAAC,YAAsB,EAAE,IAAsB;QAC9D,OAAO,aAAa,CAAC,qBAAqB,CAAC,YAAY,EAAE,IAAI,CAAC,CAAA;IAChE,CAAC;IAEO,QAAQ,CAAC,IAA0D;QACzE,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,GAAG,CAAC,CAAA;QAC3C,OAAO,CAAC,YAAY,CAAC,MAAM,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAA;QAC3C,OAAO,CAAC,YAAY,CAAC,UAAU,EAAE,IAAI,CAAC,IAAK,CAAC,CAAA;QAC5C,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,CAAA;QAClC,OAAO,CAAC,KAAK,EAAE,CAAA;IACjB,CAAC;IAEO,UAAU,CAAC,IAAY,EAAE,KAAkB;QACjD,IAAI,KAAK,KAAK,SAAS,EAAE,CAAC;YACxB,OAAO,EAAE,CAAA;QACX,CAAC;QACD,MAAM,MAAM,GAAG,KAAK,YAAY,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAA;QAEvD,IAAI,IAAI,IAAI,MAAM,EAAE,CAAC;YACnB,MAAM,KAAK,GAAG,MAAM,CAAC,IAAI,EAA4D,CAAA;YAErF,OAAO,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAA,aAAa,GAAG,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,WAAW,CAAC,CAAA;QAC9F,CAAC;QAED,MAAM,QAAQ,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,CAAM,EAAE,GAAG,EAAE,EAAE;YAC1C,QAAQ,OAAO,CAAC,EAAE,CAAC;gBACjB,KAAK,SAAS;oBACZ,OAAO,IAAI,CAAA,oCAAoC,CAAC,cAAc,CAAA;oBAC9D,MAAK;gBAEP;oBACE,IAAI,IAAI,IAAI,MAAM,EAAE,CAAC;wBACnB,OAAO,IAAI,IAAI,CAAC,CAAC,CAAC,CAAC,kBAAkB,EAAE,CAAA;oBACzC,CAAC;yBAAM,IAAI,IAAI,IAAI,UAAU,EAAE,CAAC;wBAC9B,OAAO,IAAI,IAAI,CAAC,CAAC,CAAC,CAAC,cAAc,EAAE,CAAA;oBACrC,CAAC;oBACD,OAAO,CAAC,aAAD,CAAC,cAAD,CAAC,GAAI,EAAE,CAAA;YAClB,CAAC;QACH,CAAC,CAAC,CAAA;QAEF,OAAO,OAAO,MAAM,CAAC,CAAC,CAAC,KAAK,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;IACxE,CAAC;;AA1OM,uBAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgGlB,AAhGY,CAgGZ;AAE2B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;oDAAwB;AAnGxC,gBAAgB;IAD5B,aAAa,CAAC,qBAAqB,CAAC;GACxB,gBAAgB,CA4O5B","sourcesContent":["import '@operato/input/ox-input-file.js'\nimport './ox-data-sample-subgroup-view.js'\n\nimport { css, html, LitElement, nothing } 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-data-sample-view')\nexport class OxDataSampleView extends LitElement {\n static styles = css`\n :host {\n display: flex;\n flex-direction: column;\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(--secondary-color);\n text-transform: capitalize;\n }\n [page-description] * {\n vertical-align: middle;\n }\n [page-description] mwc-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(--margin-default);\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-bottom: var(--td-border-bottom);\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 mwc-icon {\n color: var(--status-danger-color);\n }\n\n pre {\n tab-size: 2;\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 nonGroupDataItems = dataItems.filter(dataItem => !dataItem.group && !dataItem.hidden)\n const dataItemSubgroups = this.groupDataItemsByGroup(dataItems)\n\n return html` <h2>${name}</h2>\n <p page-description>\n <mwc-icon>info_outline</mwc-icon> ${description}<br />\n <mwc-icon>alarm</mwc-icon> ${i18next.t('field.work-date')}: ${workDate} ${workShift} |\n <mwc-icon>pending_actions</mwc-icon> ${i18next.t('field.collected-at')}:\n ${formatter.format(new Date(collectedAt!))}\n </p>\n\n <form>\n ${nonGroupDataItems.length > 0\n ? html`\n <table>\n <tr>\n <th 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 ${nonGroupDataItems.map(dataItem => {\n const { name = '', tag = '', description = '', stat, unit = '', spec = {}, type } = dataItem\n const value = data[tag]\n const { ooc, oos } = judgment?.[tag] || {}\n\n return html`\n <tr ?ooc=${ooc} ?oos=${oos}>\n <td name>${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`<mwc-icon>done</mwc-icon>` : ''}</td>\n <td>${oos ? html`<mwc-icon>done</mwc-icon>` : ''}</td>\n </tr>\n `\n })}\n </table>\n `\n : nothing}\n ${Object.keys(dataItemSubgroups).map(subgroup => {\n return html`\n <ox-data-sample-subgroup-view\n .subgroup=${subgroup}\n .dataSample=${this.dataSample}\n ></ox-data-sample-subgroup-view>\n `\n })}\n </form>`\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, hidden } = dataItem\n\n if (group && !hidden) {\n if (!groupedDataItems[group]) {\n groupedDataItems[group] = []\n }\n\n groupedDataItems[group].push(dataItem)\n }\n }\n\n return groupedDataItems\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.map(file => html`<a @click=${() => this.download(file)}>${file.name}</a></br>`)\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 new Date(v).toLocaleDateString()\n } else if (type == 'datetime') {\n return new Date(v).toLocaleString()\n }\n return v ?? ''\n }\n })\n\n return typeof values[0] === 'boolean' ? elements : elements.join(', ')\n }\n}\n"]}
|
|
@@ -22,7 +22,7 @@ let OxDataSummaryView = class OxDataSummaryView extends LitElement {
|
|
|
22
22
|
<tr>
|
|
23
23
|
<th item>${i18next.t('field.item')}</th>
|
|
24
24
|
<th>${i18next.t('field.description')}</th>
|
|
25
|
-
<th>${i18next.t('field.
|
|
25
|
+
<th>${i18next.t('field.finalizing-function')}</th>
|
|
26
26
|
<th>${i18next.t('field.unit')}</th>
|
|
27
27
|
<th value>${i18next.t('field.value')}</th>
|
|
28
28
|
<th>${i18next.t('field.spec')}</th>
|
|
@@ -155,6 +155,12 @@ OxDataSummaryView.styles = css `
|
|
|
155
155
|
pre {
|
|
156
156
|
tab-size: 2;
|
|
157
157
|
}
|
|
158
|
+
|
|
159
|
+
@media screen and (max-width: 480px) {
|
|
160
|
+
th {
|
|
161
|
+
min-width: 50px;
|
|
162
|
+
}
|
|
163
|
+
}
|
|
158
164
|
`;
|
|
159
165
|
__decorate([
|
|
160
166
|
property({ type: Object })
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ox-data-summary-view.js","sourceRoot":"","sources":["../../src/ox-data-summary-view.ts"],"names":[],"mappings":";AAAA,OAAO,iCAAiC,CAAA;AAExC,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE3D,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AAGvC,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAA;AAGtD,IAAM,iBAAiB,GAAvB,MAAM,iBAAkB,SAAQ,UAAU;
|
|
1
|
+
{"version":3,"file":"ox-data-summary-view.js","sourceRoot":"","sources":["../../src/ox-data-summary-view.ts"],"names":[],"mappings":"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","sourcesContent":["import '@operato/input/ox-input-file.js'\n\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { i18next } from '@operato/i18n'\n\nimport { DataSummary, DataSpecLimitSet } from './types.js'\nimport { OxDataUseCase } from './usecase/ox-data-use-case.js'\n\n@customElement('ox-data-summary-view')\nexport class OxDataSummaryView extends LitElement {\n static styles = css`\n :host {\n display: flex;\n flex-direction: column;\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(--secondary-color);\n text-transform: capitalize;\n }\n [page-description] * {\n vertical-align: middle;\n }\n [page-description] mwc-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(--margin-default);\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 }\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-bottom: var(--td-border-bottom);\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 mwc-icon {\n color: var(--status-danger-color);\n }\n\n pre {\n tab-size: 2;\n }\n\n @media screen and (max-width: 480px) {\n th {\n min-width: 50px;\n }\n }\n `\n\n @property({ type: Object }) dataSummary?: DataSummary\n\n render() {\n if (!this.dataSummary) {\n return html``\n }\n\n const { name, description, date, period, summary = {}, dataItems = [], useCase } = this.dataSummary\n const useCaseNames = useCase?.split(',').filter(useCase => useCase.trim()) || []\n\n return html` <h2>${name}</h2>\n <p page-description>\n <mwc-icon>info_outline</mwc-icon> ${description}<br />\n <mwc-icon>alarm</mwc-icon> ${i18next.t('field.date')}: ${date} ${period}\n </p>\n\n <form>\n <table>\n <tr>\n <th 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 </tr>\n ${dataItems\n .filter(dataItem => dataItem.stat)\n .map(dataItem => {\n const { name = '', tag = '', description = '', stat, unit = '', spec = {}, type } = dataItem\n const value = summary[tag]\n\n return html`\n <tr>\n <td name>${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 </tr>\n `\n })}\n </table>\n </form>`\n }\n\n private buildSpec(useCaseNames: string[], spec: DataSpecLimitSet): string {\n return OxDataUseCase.elaborateDataItemSpec(useCaseNames, spec)\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 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 new Date(v).toLocaleDateString()\n } else if (type == 'datetime') {\n return new Date(v).toLocaleString()\n }\n return v ?? ''\n }\n })\n\n return typeof values[0] === 'boolean' ? elements : elements.join(', ')\n }\n}\n"]}
|
package/dist/src/types.d.ts
CHANGED
|
@@ -1,12 +1,24 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Represents a selectable option with a text label and a value.
|
|
3
|
+
*/
|
|
1
4
|
export type SelectOption = {
|
|
2
5
|
text: string;
|
|
3
6
|
value: string;
|
|
4
7
|
};
|
|
8
|
+
/**
|
|
9
|
+
* An array of selectable options.
|
|
10
|
+
*/
|
|
5
11
|
export type SelectOptions = SelectOption[];
|
|
12
|
+
/**
|
|
13
|
+
* Defines the options and additional properties for a type.
|
|
14
|
+
*/
|
|
6
15
|
export type TypeOptions = {
|
|
7
16
|
options?: SelectOptions;
|
|
8
17
|
[prop: string]: any;
|
|
9
18
|
};
|
|
19
|
+
/**
|
|
20
|
+
* Describes the structure and properties of a data item.
|
|
21
|
+
*/
|
|
10
22
|
export type DataItem = {
|
|
11
23
|
name: string;
|
|
12
24
|
description: string;
|
|
@@ -26,6 +38,9 @@ export type DataItem = {
|
|
|
26
38
|
};
|
|
27
39
|
};
|
|
28
40
|
};
|
|
41
|
+
/**
|
|
42
|
+
* Defines the structure of a dataset, including its name, description, type, use case, and data items.
|
|
43
|
+
*/
|
|
29
44
|
export type DataSet = {
|
|
30
45
|
name: string;
|
|
31
46
|
description: string;
|
|
@@ -39,6 +54,9 @@ export type DataSet = {
|
|
|
39
54
|
};
|
|
40
55
|
};
|
|
41
56
|
};
|
|
57
|
+
/**
|
|
58
|
+
* Describes the definition of a data specification, including its type, label, name, and optional properties.
|
|
59
|
+
*/
|
|
42
60
|
export type DataSpecDefinition = {
|
|
43
61
|
type: string;
|
|
44
62
|
label: string;
|
|
@@ -47,42 +65,65 @@ export type DataSpecDefinition = {
|
|
|
47
65
|
[option: string]: any;
|
|
48
66
|
};
|
|
49
67
|
};
|
|
68
|
+
/**
|
|
69
|
+
* Describes a use case definition, including its name, description, help text, and specifications.
|
|
70
|
+
*/
|
|
50
71
|
export type UseCaseDefinition = {
|
|
51
72
|
name: string;
|
|
52
73
|
description: string;
|
|
53
74
|
help: string;
|
|
54
75
|
specs: DataSpecDefinition[];
|
|
55
76
|
};
|
|
77
|
+
/**
|
|
78
|
+
* Represents the limits for a data specification.
|
|
79
|
+
*/
|
|
56
80
|
export type DataSpecLimit = {
|
|
57
81
|
[limit: string]: number | string | string[] | boolean;
|
|
58
82
|
};
|
|
83
|
+
/**
|
|
84
|
+
* A set of data specification limits, keyed by use case.
|
|
85
|
+
*/
|
|
59
86
|
export type DataSpecLimitSet = {
|
|
60
87
|
[useCase: string]: DataSpecLimit;
|
|
61
88
|
};
|
|
89
|
+
/**
|
|
90
|
+
* Represents a collection of data, keyed by a tag.
|
|
91
|
+
*/
|
|
62
92
|
export type DataCollection = {
|
|
63
93
|
[tag: string]: any;
|
|
64
94
|
};
|
|
95
|
+
/**
|
|
96
|
+
* Represents a judgment on data, indicating if it is out of control or out of specification.
|
|
97
|
+
*/
|
|
65
98
|
export type Judgment = {
|
|
66
99
|
[tag: string]: {
|
|
67
100
|
ooc: boolean;
|
|
68
101
|
oos: boolean;
|
|
69
102
|
};
|
|
70
103
|
};
|
|
104
|
+
/**
|
|
105
|
+
* Describes a data sample, including its name, description, use case, and associated data and judgments.
|
|
106
|
+
*/
|
|
71
107
|
export type DataSample = {
|
|
72
|
-
name
|
|
73
|
-
description
|
|
74
|
-
useCase
|
|
108
|
+
name?: string;
|
|
109
|
+
description?: string;
|
|
110
|
+
useCase?: string;
|
|
75
111
|
data?: DataCollection;
|
|
76
112
|
judgment?: Judgment;
|
|
77
113
|
dataItems?: DataItem[];
|
|
78
|
-
quota
|
|
79
|
-
workDate
|
|
80
|
-
workShift
|
|
81
|
-
collectedAt
|
|
114
|
+
quota?: number;
|
|
115
|
+
workDate?: string;
|
|
116
|
+
workShift?: string;
|
|
117
|
+
collectedAt?: Date;
|
|
118
|
+
reviewActivityInstance?: any;
|
|
119
|
+
dataOoc?: DataOoc;
|
|
82
120
|
};
|
|
83
121
|
export type DataOocState = 'ISSUED' | 'REVIEWED' | 'CORRECTED';
|
|
122
|
+
/**
|
|
123
|
+
* Extends DataSample with additional fields specific to an out of control state, including state, corrective actions, and review history.
|
|
124
|
+
*/
|
|
84
125
|
export type DataOoc = DataSample & {
|
|
85
|
-
state
|
|
126
|
+
state?: DataOocState;
|
|
86
127
|
correctiveInstruction?: string;
|
|
87
128
|
correctiveAction?: string;
|
|
88
129
|
reviewer?: {
|
|
@@ -95,7 +136,7 @@ export type DataOoc = DataSample & {
|
|
|
95
136
|
name: string;
|
|
96
137
|
};
|
|
97
138
|
correctedAt?: Date;
|
|
98
|
-
history
|
|
139
|
+
history?: {
|
|
99
140
|
user: {
|
|
100
141
|
id: string;
|
|
101
142
|
name: string;
|
|
@@ -104,7 +145,11 @@ export type DataOoc = DataSample & {
|
|
|
104
145
|
comment: string;
|
|
105
146
|
timestamp: number;
|
|
106
147
|
}[];
|
|
148
|
+
resolveActivityInstance?: any;
|
|
107
149
|
};
|
|
150
|
+
/**
|
|
151
|
+
* Describes a summary of data, including its name, description, relevant data items, and key metrics.
|
|
152
|
+
*/
|
|
108
153
|
export type DataSummary = {
|
|
109
154
|
name: string;
|
|
110
155
|
description: string;
|
|
@@ -124,6 +169,9 @@ export type DataSummary = {
|
|
|
124
169
|
[key: string]: any;
|
|
125
170
|
};
|
|
126
171
|
};
|
|
172
|
+
/**
|
|
173
|
+
* Represents the result of an evaluation, indicating if data is out of specification or out of control.
|
|
174
|
+
*/
|
|
127
175
|
export type EvaluationResult = {
|
|
128
176
|
oos: boolean;
|
|
129
177
|
ooc: boolean;
|
package/dist/src/types.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../src/types.ts"],"names":[],"mappings":"","sourcesContent":["
|
|
1
|
+
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../src/types.ts"],"names":[],"mappings":"","sourcesContent":["/**\n * Represents a selectable option with a text label and a value.\n */\nexport type SelectOption = {\n text: string\n value: string\n}\n/**\n * An array of selectable options.\n */\nexport type SelectOptions = SelectOption[]\n/**\n * Defines the options and additional properties for a type.\n */\nexport type TypeOptions = {\n options?: SelectOptions\n [prop: string]: any\n}\n/**\n * Describes the structure and properties of a data item.\n */\nexport type DataItem = {\n name: string\n description: string\n sequence: number\n tag: string\n group: string\n type: string\n stat: string\n active: boolean\n options: TypeOptions\n unit: string\n quota: number\n hidden: boolean\n spec: {\n [useCase: string]: {\n [limit: string]: number | string | string[] | boolean\n }\n }\n}\n/**\n * Defines the structure of a dataset, including its name, description, type, use case, and data items.\n */\nexport type DataSet = {\n name: string\n description: string\n type: 'manual' | 'automatic'\n useCase: string\n active: boolean\n dataItems: DataItem[]\n spec: {\n [dataItem: string]: {\n [useCase: string]: any\n }\n }\n}\n/**\n * Describes the definition of a data specification, including its type, label, name, and optional properties.\n */\nexport type DataSpecDefinition = {\n type: string\n label: string\n name: string\n property?: {\n [option: string]: any\n }\n}\n/**\n * Describes a use case definition, including its name, description, help text, and specifications.\n */\nexport type UseCaseDefinition = {\n name: string\n description: string\n help: string\n specs: DataSpecDefinition[]\n}\n/**\n * Represents the limits for a data specification.\n */\nexport type DataSpecLimit = {\n [limit: string]: number | string | string[] | boolean\n}\n/**\n * A set of data specification limits, keyed by use case.\n */\nexport type DataSpecLimitSet = {\n [useCase: string]: DataSpecLimit\n}\n/**\n * Represents a collection of data, keyed by a tag.\n */\nexport type DataCollection = {\n [tag: string]: any\n}\n/**\n * Represents a judgment on data, indicating if it is out of control or out of specification.\n */\nexport type Judgment = {\n [tag: string]: {\n ooc: boolean\n oos: boolean\n }\n}\n/**\n * Describes a data sample, including its name, description, use case, and associated data and judgments.\n */\nexport type DataSample = {\n name?: string\n description?: string\n useCase?: string\n data?: DataCollection\n judgment?: Judgment\n dataItems?: DataItem[]\n quota?: number\n workDate?: string\n workShift?: string\n collectedAt?: Date\n reviewActivityInstance?: any\n dataOoc?: DataOoc\n}\nexport type DataOocState = 'ISSUED' | 'REVIEWED' | 'CORRECTED'\n/**\n * Extends DataSample with additional fields specific to an out of control state, including state, corrective actions, and review history.\n */\nexport type DataOoc = DataSample & {\n state?: DataOocState\n correctiveInstruction?: string\n correctiveAction?: string\n reviewer?: {\n id: string\n name: string\n }\n reviewedAt?: Date\n corrector?: {\n id: string\n name: string\n }\n correctedAt?: Date\n history?: {\n user: {\n id: string\n name: string\n }\n state: DataOocState\n comment: string\n timestamp: number\n }[]\n resolveActivityInstance?: any\n}\n/**\n * Describes a summary of data, including its name, description, relevant data items, and key metrics.\n */\nexport type DataSummary = {\n name: string\n description: string\n dataItems?: DataItem[]\n date?: string\n period?: string\n key01?: string\n key02?: string\n key03?: string\n key04?: string\n key05?: string\n count?: number\n countOoc?: number\n countOos?: number\n useCase?: string\n summary?: {\n [key: string]: any\n }\n}\n/**\n * Represents the result of an evaluation, indicating if data is out of specification or out of control.\n */\nexport type EvaluationResult = {\n oos: boolean\n ooc: boolean\n}\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
/* Here, only the common module of client and server is imported/exported. Be careful not to use a module dedicated to client or server. */
|
|
2
|
+
import { OxDataUseCase } from '../ox-data-use-case';
|
|
3
|
+
import { OxDataUseCaseSPC } from './ox-data-use-case-spc';
|
|
4
|
+
// OxPropertyEditor.register({
|
|
5
|
+
// 'spc-limits': 'ox-property-editor-spc-limits'
|
|
6
|
+
// })
|
|
7
|
+
OxDataUseCase.registerUseCase('SPC', new OxDataUseCaseSPC());
|
|
8
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/usecase/spc/index.ts"],"names":[],"mappings":"AAAA,2IAA2I;AAE3I,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAA;AACnD,OAAO,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAA;AAEzD,8BAA8B;AAC9B,kDAAkD;AAClD,KAAK;AAEL,aAAa,CAAC,eAAe,CAAC,KAAK,EAAE,IAAI,gBAAgB,EAAE,CAAC,CAAA","sourcesContent":["/* Here, only the common module of client and server is imported/exported. Be careful not to use a module dedicated to client or server. */\n\nimport { OxDataUseCase } from '../ox-data-use-case'\nimport { OxDataUseCaseSPC } from './ox-data-use-case-spc'\n\n// OxPropertyEditor.register({\n// 'spc-limits': 'ox-property-editor-spc-limits'\n// })\n\nOxDataUseCase.registerUseCase('SPC', new OxDataUseCaseSPC())\n"]}
|