@operato/dataset 1.0.0-alpha.6 → 1.0.0-beta.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (59) hide show
  1. package/CHANGELOG.md +428 -0
  2. package/demo/index.html +8 -90
  3. package/demo/ox-data-entry-form.html +118 -0
  4. package/demo/ox-data-item-spec.html +152 -0
  5. package/demo/ox-data-ooc-view.html +185 -0
  6. package/demo/ox-data-sample-view.html +150 -0
  7. package/demo/ox-grist-editor-data-item-spec.html +476 -0
  8. package/dist/src/grist-editor/index.d.ts +1 -0
  9. package/dist/src/grist-editor/index.js +7 -0
  10. package/dist/src/grist-editor/index.js.map +1 -0
  11. package/dist/src/grist-editor/ox-grist-editor-data-item-spec.d.ts +11 -0
  12. package/dist/src/grist-editor/ox-grist-editor-data-item-spec.js +77 -0
  13. package/dist/src/grist-editor/ox-grist-editor-data-item-spec.js.map +1 -0
  14. package/dist/src/grist-editor/ox-popup-data-item-spec.d.ts +13 -0
  15. package/dist/src/grist-editor/ox-popup-data-item-spec.js +90 -0
  16. package/dist/src/grist-editor/ox-popup-data-item-spec.js.map +1 -0
  17. package/dist/src/index.d.ts +6 -1
  18. package/dist/src/index.js +6 -1
  19. package/dist/src/index.js.map +1 -1
  20. package/dist/src/ox-data-entry-form.d.ts +1 -24
  21. package/dist/src/ox-data-entry-form.js +12 -16
  22. package/dist/src/ox-data-entry-form.js.map +1 -1
  23. package/dist/src/ox-data-item-spec.d.ts +18 -0
  24. package/dist/src/ox-data-item-spec.js +77 -0
  25. package/dist/src/ox-data-item-spec.js.map +1 -0
  26. package/dist/src/ox-data-ooc-view.d.ts +10 -0
  27. package/dist/src/ox-data-ooc-view.js +69 -0
  28. package/dist/src/ox-data-ooc-view.js.map +1 -0
  29. package/dist/src/ox-data-sample-view copy.d.ts +13 -0
  30. package/dist/src/ox-data-sample-view copy.js +214 -0
  31. package/dist/src/ox-data-sample-view copy.js.map +1 -0
  32. package/dist/src/ox-data-sample-view.d.ts +13 -0
  33. package/dist/src/ox-data-sample-view.js +168 -0
  34. package/dist/src/ox-data-sample-view.js.map +1 -0
  35. package/dist/src/ox-data-use-case.d.ts +16 -0
  36. package/dist/src/ox-data-use-case.js +111 -0
  37. package/dist/src/ox-data-use-case.js.map +1 -0
  38. package/dist/src/types.d.ts +78 -0
  39. package/dist/src/types.js +2 -0
  40. package/dist/src/types.js.map +1 -0
  41. package/dist/tsconfig.tsbuildinfo +1 -1
  42. package/package.json +20 -12
  43. package/src/grist-editor/index.ts +10 -0
  44. package/src/grist-editor/ox-grist-editor-data-item-spec.ts +92 -0
  45. package/src/grist-editor/ox-popup-data-item-spec.ts +90 -0
  46. package/src/index.ts +6 -1
  47. package/src/ox-data-entry-form.ts +13 -37
  48. package/src/ox-data-item-spec.ts +74 -0
  49. package/src/ox-data-ooc-view.ts +67 -0
  50. package/src/ox-data-sample-view.ts +175 -0
  51. package/src/ox-data-use-case.ts +147 -0
  52. package/src/types.ts +72 -0
  53. package/themes/grist-theme.css +194 -0
  54. package/themes/oops-theme.css +26 -0
  55. package/themes/report-theme.css +47 -0
  56. package/translations/en.json +1 -0
  57. package/translations/ko.json +1 -0
  58. package/translations/ms.json +1 -0
  59. package/translations/zh.json +1 -0
@@ -0,0 +1,152 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en-GB">
3
+ <head>
4
+ <meta charset="utf-8" />
5
+ <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1" />
6
+ <style>
7
+ body {
8
+ --ox-checkbox-size: 12px;
9
+ }
10
+
11
+ #demo {
12
+ }
13
+ </style>
14
+ <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500" rel="stylesheet" />
15
+ <link href="https://fonts.googleapis.com/css?family=Material+Icons&display=block" rel="stylesheet" />
16
+ <link href="/themes/app-theme.css" rel="stylesheet" />
17
+ <link href="/themes/form-theme.css" rel="stylesheet" />
18
+ </head>
19
+ <body>
20
+ <div id="demo"></div>
21
+
22
+ <script type="module">
23
+ import { html, render } from 'lit'
24
+
25
+ import '@operato/property-editor/ox-property-editor-checkbox.js'
26
+ import '@operato/property-editor/ox-property-editor-number.js'
27
+ import '@operato/property-editor/ox-property-editor-string.js'
28
+
29
+ import '@operato/property-editor/ox-properties-dynamic-view.js'
30
+
31
+ import { OxPropertyEditor } from '@operato/property-editor'
32
+
33
+ OxPropertyEditor.register({
34
+ number: 'ox-property-editor-number',
35
+ string: 'ox-property-editor-string',
36
+ boolean: 'ox-property-editor-checkbox'
37
+ })
38
+
39
+ import { OxDataUseCase } from '../dist/src/ox-data-use-case.js'
40
+ import '../dist/src/ox-data-item-spec.js'
41
+
42
+ const parent = document.querySelector('#demo')
43
+
44
+ const ccpUseCase = {
45
+ getSpecification: dataItem => {
46
+ return {
47
+ name: 'ccp',
48
+ description: 'ccp specs',
49
+ specs: [
50
+ {
51
+ type: 'number',
52
+ label: 'critical limits',
53
+ name: 'criticalLimits',
54
+ property: dataItem
55
+ },
56
+ {
57
+ type: 'string',
58
+ label: 'target limits',
59
+ name: 'targetLimits',
60
+ property: dataItem
61
+ }
62
+ ]
63
+ }
64
+ }
65
+ }
66
+
67
+ const qcUseCase = {
68
+ getSpecification: dataItem => {
69
+ return {
70
+ name: 'qc',
71
+ description: 'qc specs',
72
+ specs: [
73
+ {
74
+ type: 'number',
75
+ label: 'critical limits',
76
+ name: 'criticalLimits',
77
+ property: dataItem
78
+ },
79
+ {
80
+ type: 'boolean',
81
+ label: 'target limits',
82
+ name: 'targetLimits',
83
+ property: dataItem
84
+ }
85
+ ]
86
+ }
87
+ }
88
+ }
89
+
90
+ OxDataUseCase.registerUseCase('ccp', ccpUseCase)
91
+ OxDataUseCase.registerUseCase('qc', qcUseCase)
92
+
93
+ const dataItemA = {
94
+ name: '창고 온도',
95
+ description: '창고 온도는 섭씨 0도 이하로 유지되어야 합니다.',
96
+ sequence: 1,
97
+ tag: 'temp',
98
+ unit: '℃',
99
+ type: 'number',
100
+ quota: 1
101
+ }
102
+
103
+ const dataItemB = {
104
+ name: '품평',
105
+ description: '품평은 최우수/우수/보통/미달을 포함하여 간단히 평가.',
106
+ sequence: 4,
107
+ tag: 'evaluation',
108
+ type: 'select',
109
+ options: {
110
+ options: [
111
+ { text: '최우수', value: '최우수' },
112
+ { text: '우수', value: '우수' },
113
+ { text: '보통', value: '보통' },
114
+ { text: '미달', value: '미달' }
115
+ ]
116
+ },
117
+ quota: 3
118
+ }
119
+
120
+ const dataItemC = {
121
+ name: '코멘트',
122
+ description: '특이사항을 기록함.',
123
+ sequence: 4,
124
+ tag: 'comment',
125
+ type: 'string',
126
+ quota: 1
127
+ }
128
+
129
+ var specA = {
130
+ ccp: { criticalLimits: 1000, targetLimits: true },
131
+ qc: { criticalLimits: 400, targetLimits: false }
132
+ }
133
+
134
+ var specB = {
135
+ ccp: { accpetables: ['최우수', '우수'] },
136
+ qc: { accpetables: ['최우수', '우수'] }
137
+ }
138
+
139
+ render(
140
+ html`<ox-data-item-spec
141
+ .dataItem=${dataItemA}
142
+ .value=${specA}
143
+ @change=${e => {
144
+ specA = e.detail
145
+ console.log('change', specA)
146
+ }}
147
+ ></ox-data-item-spec>`,
148
+ parent
149
+ )
150
+ </script>
151
+ </body>
152
+ </html>
@@ -0,0 +1,185 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en-GB">
3
+ <head>
4
+ <meta charset="utf-8" />
5
+ <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1" />
6
+ <style>
7
+ body {
8
+ --ox-checkbox-size: 12px;
9
+ }
10
+
11
+ #demo {
12
+ }
13
+ </style>
14
+ <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500" rel="stylesheet" />
15
+ <link href="https://fonts.googleapis.com/css?family=Material+Icons&display=block" rel="stylesheet" />
16
+ <link href="/themes/app-theme.css" rel="stylesheet" />
17
+ <link href="/themes/form-theme.css" rel="stylesheet" />
18
+ </head>
19
+ <body>
20
+ <div id="demo"></div>
21
+
22
+ <script type="module">
23
+ import { html, render } from 'lit'
24
+ import '@operato/ccp'
25
+ import '@operato/qc'
26
+
27
+ const parent = document.querySelector('#demo')
28
+ const dataSet = {
29
+ name: 'sample',
30
+ description: 'sample description',
31
+ useCase: 'CCP',
32
+ dataItems: [
33
+ {
34
+ name: '창고 온도',
35
+ description: '창고 온도는 섭씨 0도 이하로 유지되어야 합니다.',
36
+ sequence: 1,
37
+ tag: 'temp',
38
+ type: 'number',
39
+ quota: 1,
40
+ active: true,
41
+ unit: '℃',
42
+ spec: {
43
+ CCP: {
44
+ criticalLimits: {
45
+ minimum: 100,
46
+ maximum: 200
47
+ },
48
+ targetLimits: {
49
+ minimum: 120,
50
+ maximum: 180
51
+ }
52
+ }
53
+ }
54
+ },
55
+ {
56
+ name: '창고 습도',
57
+ description: '창고 습도는 30% 이하로 유지되어야 합니다.',
58
+ sequence: 2,
59
+ tag: 'humid',
60
+ type: 'number',
61
+ quota: 5,
62
+ active: true,
63
+ unit: '%',
64
+ spec: {
65
+ CCP: {
66
+ criticalLimits: {
67
+ minimum: 10,
68
+ maximum: 50
69
+ },
70
+ targetLimits: {
71
+ minimum: 20,
72
+ maximum: 40
73
+ }
74
+ }
75
+ }
76
+ },
77
+ {
78
+ name: '육안 검사',
79
+ description: '육안 검사는 포장전 30분 내로 실행되어야 합니다.',
80
+ sequence: 3,
81
+ tag: 'inspection',
82
+ type: 'boolean',
83
+ quota: 3,
84
+ active: true
85
+ },
86
+ {
87
+ name: '품평',
88
+ description: '품평은 최우수/우수/보통/미달을 포함하여 간단히 평가.',
89
+ sequence: 4,
90
+ tag: 'evaluation',
91
+ type: 'select',
92
+ options: {
93
+ options: [
94
+ { text: '최우수', value: '최우수' },
95
+ { text: '우수', value: '우수' },
96
+ { text: '보통', value: '보통' },
97
+ { text: '미달', value: '미달' }
98
+ ]
99
+ },
100
+ quota: 3,
101
+ active: true,
102
+ spec: {
103
+ CCP: {
104
+ criticalLimits: {
105
+ acceptables: ['최우수', '우수', '보통']
106
+ },
107
+ targetLimits: {
108
+ acceptables: ['최우수', '우수']
109
+ }
110
+ }
111
+ }
112
+ },
113
+ {
114
+ name: '코멘트',
115
+ description: '특이사항을 기록함.',
116
+ sequence: 4,
117
+ tag: 'comment',
118
+ type: 'string',
119
+ quota: 1,
120
+ active: true
121
+ },
122
+ {
123
+ name: '첨부파일',
124
+ description: '참조 첨부 파일.',
125
+ sequence: 4,
126
+ tag: 'attachment',
127
+ type: 'file',
128
+ quota: 1,
129
+ active: true
130
+ }
131
+ ]
132
+ }
133
+
134
+ var dataOoc = {
135
+ name: 'Data Sample Name',
136
+ description: 'Data Sample이 어쩌구 저쩌구 그래서 중요합니다. 당연히 그래야죠.',
137
+ useCase: 'CCP',
138
+ state: 'CORRECTED',
139
+ data: {
140
+ temp: [1000],
141
+ humid: [20, 23, 21, 26, 27],
142
+ inspection: [true, false, true],
143
+ evaluation: ['최우수', '보통', '우수']
144
+ },
145
+ collectedAt: Date.now(),
146
+ history: [
147
+ {
148
+ user: {
149
+ id: 0,
150
+ name: 'shnam'
151
+ },
152
+ state: 'CREATED',
153
+ timestamp: Date.now()
154
+ },
155
+ {
156
+ user: {
157
+ id: 0,
158
+ name: 'shnam'
159
+ },
160
+ state: 'REVIEWED',
161
+ comment: '금일 생산한 제품은 전량 폐기합니다',
162
+ timestamp: Date.now()
163
+ },
164
+ {
165
+ user: {
166
+ id: 0,
167
+ name: 'shnam'
168
+ },
169
+ state: 'CORRECTED',
170
+ timestamp: Date.now()
171
+ }
172
+ ]
173
+ }
174
+
175
+ render(
176
+ html`<ox-data-ooc-view
177
+ .dataSet=${dataSet}
178
+ .dataOoc=${dataOoc}
179
+ @change=${e => console.log(e.detail)}
180
+ ></ox-data-ooc-view>`,
181
+ parent
182
+ )
183
+ </script>
184
+ </body>
185
+ </html>
@@ -0,0 +1,150 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en-GB">
3
+ <head>
4
+ <meta charset="utf-8" />
5
+ <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1" />
6
+ <style>
7
+ body {
8
+ --ox-checkbox-size: 12px;
9
+ }
10
+
11
+ #demo {
12
+ }
13
+ </style>
14
+ <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500" rel="stylesheet" />
15
+ <link href="https://fonts.googleapis.com/css?family=Material+Icons&display=block" rel="stylesheet" />
16
+ <link href="/themes/app-theme.css" rel="stylesheet" />
17
+ <link href="/themes/form-theme.css" rel="stylesheet" />
18
+ </head>
19
+ <body>
20
+ <div id="demo"></div>
21
+
22
+ <script type="module">
23
+ import { html, render } from 'lit'
24
+ import '@operato/ccp'
25
+ import '@operato/qc'
26
+
27
+ const parent = document.querySelector('#demo')
28
+ const dataSet = {
29
+ name: 'sample',
30
+ description: 'sample description',
31
+ useCase: 'CCP',
32
+ dataItems: [
33
+ {
34
+ name: '창고 온도',
35
+ description: '창고 온도는 섭씨 0도 이하로 유지되어야 합니다.',
36
+ sequence: 1,
37
+ tag: 'temp',
38
+ type: 'number',
39
+ quota: 1,
40
+ active: true,
41
+ unit: '℃',
42
+ spec: {
43
+ CCP: {
44
+ criticalLimits: {
45
+ minimum: 100,
46
+ maximum: 200
47
+ },
48
+ targetLimits: {
49
+ minimum: 120,
50
+ maximum: 180
51
+ }
52
+ }
53
+ }
54
+ },
55
+ {
56
+ name: '창고 습도',
57
+ description: '창고 습도는 30% 이하로 유지되어야 합니다.',
58
+ sequence: 2,
59
+ tag: 'humid',
60
+ type: 'number',
61
+ quota: 5,
62
+ active: true,
63
+ unit: '%',
64
+ spec: {
65
+ CCP: {
66
+ criticalLimits: {
67
+ minimum: 10,
68
+ maximum: 50
69
+ },
70
+ targetLimits: {
71
+ minimum: 20,
72
+ maximum: 40
73
+ }
74
+ }
75
+ }
76
+ },
77
+ {
78
+ name: '육안 검사',
79
+ description: '육안 검사는 포장전 30분 내로 실행되어야 합니다.',
80
+ sequence: 3,
81
+ tag: 'inspection',
82
+ type: 'boolean',
83
+ quota: 3,
84
+ active: true
85
+ },
86
+ {
87
+ name: '품평',
88
+ description: '품평은 최우수/우수/보통/미달을 포함하여 간단히 평가.',
89
+ sequence: 4,
90
+ tag: 'evaluation',
91
+ type: 'select',
92
+ options: {
93
+ options: [
94
+ { text: '최우수', value: '최우수' },
95
+ { text: '우수', value: '우수' },
96
+ { text: '보통', value: '보통' },
97
+ { text: '미달', value: '미달' }
98
+ ]
99
+ },
100
+ quota: 3,
101
+ active: true,
102
+ spec: {
103
+ CCP: {
104
+ criticalLimits: {
105
+ acceptables: ['최우수', '우수', '보통']
106
+ },
107
+ targetLimits: {
108
+ acceptables: ['최우수', '우수']
109
+ }
110
+ }
111
+ }
112
+ },
113
+ {
114
+ name: '코멘트',
115
+ description: '특이사항을 기록함.',
116
+ sequence: 4,
117
+ tag: 'comment',
118
+ type: 'string',
119
+ quota: 1,
120
+ active: true
121
+ },
122
+ {
123
+ name: '첨부파일',
124
+ description: '참조 첨부 파일.',
125
+ sequence: 4,
126
+ tag: 'attachment',
127
+ type: 'file',
128
+ quota: 1,
129
+ active: true
130
+ }
131
+ ]
132
+ }
133
+
134
+ var dataSample = {
135
+ name: 'Data Sample Name',
136
+ description: 'Data Sample이 어쩌구 저쩌구 그래서 중요합니다. 당연히 그래야죠.',
137
+ useCase: 'CCP',
138
+ data: {
139
+ temp: [1000],
140
+ humid: [20, 23, 21, 26, 27],
141
+ inspection: [true, false, true],
142
+ evaluation: ['최우수', '보통', '우수']
143
+ },
144
+ collectedAt: Date.now()
145
+ }
146
+
147
+ render(html`<ox-data-sample-view .dataSet=${dataSet} .dataSample=${dataSample}></ox-data-sample-view>`, parent)
148
+ </script>
149
+ </body>
150
+ </html>