@things-factory/operato-tools 7.0.1-alpha.1 → 7.0.1-alpha.4

Sign up to get free protection for your applications and to get access to all the features.
@@ -1,339 +1,327 @@
1
- import { html } from 'lit-element'
1
+ import { html } from 'lit'
2
2
 
3
3
  import { MetaApi } from '@things-factory/meta-ui/client/utils/meta-api'
4
4
  import { TermsUtil } from '@things-factory/meta-ui/client/utils/terms-util'
5
5
  import { getRenderer } from '@operato/data-grist'
6
6
 
7
- export const ButtonConfigTabMixin = (baseElement) => class extends baseElement {
7
+ export const ButtonConfigTabMixin = baseElement =>
8
+ class extends baseElement {
9
+ setButtonConfigTabValues(data) {
10
+ data?.forEach((column, index) => {
11
+ let rank = index + 1
12
+ column.rank = rank * 10
13
+ column.id = rank
8
14
 
9
- setButtonConfigTabValues(data) {
10
- data?.forEach((column, index) => {
11
- let rank = index + 1;
12
- column.rank = rank * 10;
13
- column.id = rank;
14
-
15
- if (column.logic && !column.logic.logic) {
16
- let logicString = JSON.stringify(column.logic, null, 2);
17
- column.logic = {};
18
- column.logic.logic = logicString;
19
- }
15
+ if (column.logic && !column.logic.logic) {
16
+ let logicString = JSON.stringify(column.logic, null, 2)
17
+ column.logic = {}
18
+ column.logic.logic = logicString
19
+ }
20
20
 
21
- if (column.style && Array.isArray(column.style)) {
22
- column.style = JSON.stringify(column.style, null, 2);
23
- }
24
- })
21
+ if (column.style && Array.isArray(column.style)) {
22
+ column.style = JSON.stringify(column.style, null, 2)
23
+ }
24
+ })
25
25
 
26
- this.viewButtonData = data;
27
- this.buttonTabGrist?.fetch();
28
- }
26
+ this.viewButtonData = data
27
+ this.buttonTabGrist?.fetch()
28
+ }
29
29
 
30
- getButtonConfigTabValues() {
31
- // 기본 return object
32
- let retObject = {
33
- button: [],
34
- grid: {
35
- button: []
30
+ getButtonConfigTabValues() {
31
+ // 기본 return object
32
+ let retObject = {
33
+ button: [],
34
+ grid: {
35
+ button: []
36
+ }
36
37
  }
37
- };
38
38
 
39
- // grid 에서 데이터 가져오기
40
- let gridValue = this.getElementValueById('button-tab-grid');
39
+ // grid 에서 데이터 가져오기
40
+ let gridValue = this.getElementValueById('button-tab-grid')
41
41
 
42
- // rank 로 정렬
43
- this.sortRecordByRank(gridValue)?.forEach(x => {
44
- var {
45
- name = undefined,
46
- label = undefined,
47
- style = undefined,
48
- type = 'basic',
49
- logic = undefined,
50
- auth = undefined
51
- } = x;
42
+ // rank 로 정렬
43
+ this.sortRecordByRank(gridValue)?.forEach(x => {
44
+ var { name = undefined, label = undefined, style = undefined, type = 'basic', logic = undefined, auth = undefined } = x
52
45
 
53
- if (!name) return;
46
+ if (!name) return
54
47
 
55
- // 그리드, 일반 버튼 동일
56
- let button = {
57
- name: name,
58
- type: type.replaceAll('grid-', ''),
59
- label: label ? label : name,
60
- auth: auth
61
- }
62
-
63
- // logic 이 있으면 반영
64
- if (logic) {
65
- if (typeof logic === 'string') {
66
- logic = JSON.parse(logic);
48
+ // 그리드, 일반 버튼 동일
49
+ let button = {
50
+ name: name,
51
+ type: type.replaceAll('grid-', ''),
52
+ label: label ? label : name,
53
+ auth: auth
67
54
  }
68
55
 
69
- if (logic.logic) {
70
- button.logic = JSON.parse(logic.logic);
71
- }
72
- }
56
+ // logic 이 있으면 반영
57
+ if (logic) {
58
+ if (typeof logic === 'string') {
59
+ logic = JSON.parse(logic)
60
+ }
73
61
 
62
+ if (logic.logic) {
63
+ button.logic = JSON.parse(logic.logic)
64
+ }
65
+ }
74
66
 
75
- // grid 버튼은 icon / 일반 버튼은 style
76
- if (type.startsWith('grid')) {
77
- if (style) {
78
- style = style.trim();
79
- if (style.startsWith('[')) {
80
- style = JSON.parse(style);
67
+ // grid 버튼은 icon / 일반 버튼은 style
68
+ if (type.startsWith('grid')) {
69
+ if (style) {
70
+ style = style.trim()
71
+ if (style.startsWith('[')) {
72
+ style = JSON.parse(style)
73
+ }
74
+ button.icon = style
81
75
  }
82
- button.icon = style;
76
+ retObject.grid.button.push(button)
77
+ } else {
78
+ if (style) button.style = style
79
+ retObject.button.push(button)
83
80
  }
84
- retObject.grid.button.push(button);
85
- } else {
86
- if (style) button.style = style;
87
- retObject.button.push(button);
88
- }
89
- })
81
+ })
90
82
 
91
- return retObject;
92
- }
83
+ return retObject
84
+ }
93
85
 
94
- renderButtonConfigTab() {
95
- return html`
96
- <ox-grist auto-fetch id="button-tab-grid" .config=${this.buttonTabGridConfig} .mode='GRID'
97
- .fetchHandler=${this.fetchButtonConfigTabHandler.bind(this)}>
98
- </ox-grist>
86
+ renderButtonConfigTab() {
87
+ return html`
88
+ <ox-grist auto-fetch id="button-tab-grid" .config=${this.buttonTabGridConfig} .mode="GRID" .fetchHandler=${this.fetchButtonConfigTabHandler.bind(this)}>
89
+ </ox-grist>
99
90
  `
100
- }
101
-
102
- get buttonTabGrist() {
103
- return this.shadowRoot.querySelector('#button-tab-grid')
104
- }
105
-
106
- async fetchButtonConfigTabHandler() {
107
- return {
108
- total: 0,
109
- records: this.viewButtonData || []
110
91
  }
111
- }
112
-
113
92
 
93
+ get buttonTabGrist() {
94
+ return this.shadowRoot.querySelector('#button-tab-grid')
95
+ }
114
96
 
115
- setButtonConfigTabConfig() {
97
+ async fetchButtonConfigTabHandler() {
98
+ return {
99
+ total: 0,
100
+ records: this.viewButtonData || []
101
+ }
102
+ }
116
103
 
117
- // 그리드 설정
118
- this.buttonTabGridConfig = {
119
- rows: MetaApi.getGristSelectableConfig(true),
120
- pagination: { infinite: true },
121
- sorters: [{ name: 'rank', desc: false }],
122
- appendable: true,
123
- columns: [
124
- ...MetaApi.getGristGuttersConfig(false, false),
125
- {
126
- type: 'gutter', gutterName: 'button', icon: 'delete',
127
- handlers: {
128
- click: (_columns, _data, _column, record, _rowIndex) => {
129
- if (record.id) {
130
- this.deleteRow(this.buttonTabGrist, record);
104
+ setButtonConfigTabConfig() {
105
+ // 그리드 설정
106
+ this.buttonTabGridConfig = {
107
+ rows: MetaApi.getGristSelectableConfig(true),
108
+ pagination: { infinite: true },
109
+ sorters: [{ name: 'rank', desc: false }],
110
+ appendable: true,
111
+ columns: [
112
+ ...MetaApi.getGristGuttersConfig(false, false),
113
+ {
114
+ type: 'gutter',
115
+ gutterName: 'button',
116
+ icon: 'delete',
117
+ handlers: {
118
+ click: (_columns, _data, _column, record, _rowIndex) => {
119
+ if (record.id) {
120
+ this.deleteRow(this.buttonTabGrist, record)
121
+ }
131
122
  }
132
123
  }
133
124
  },
134
- },
135
- {
136
- type: 'string',
137
- name: 'id',
138
- hidden: true
139
- },
140
- {
141
- type: 'integer',
142
- name: 'rank',
143
- header: TermsUtil.tLabel('rank'),
144
- sortable: false,
145
- width: 55,
146
- record: {
147
- align: 'right',
148
- editable: true,
149
- mandatory: true
150
- }
151
- },
152
- {
153
- type: 'string',
154
- name: 'name',
155
- header: TermsUtil.tLabel('name'),
156
- sortable: false,
157
- width: 150,
158
- record: {
159
- align: 'left',
160
- editable: true,
161
- mandatory: true
162
- }
163
- },
164
- {
165
- type: 'string',
166
- name: 'label',
167
- header: TermsUtil.tLabel('label'),
168
- sortable: false,
169
- width: 150,
170
- record: {
171
- align: 'left',
172
- editable: true,
173
- mandatory: true
174
- }
175
- },
176
- {
177
- type: 'string',
178
- name: 'display',
179
- header: TermsUtil.tLabel('display'),
180
- sortable: false,
181
- width: 150,
182
- record: {
183
- align: 'left',
184
- editable: false,
185
- mandatory: false,
186
- renderer: (value, column, record, rowIndex, field) => {
187
- let tLabel = record.label ? record.label : record.name;
188
- return TermsUtil.tButton(tLabel)
125
+ {
126
+ type: 'string',
127
+ name: 'id',
128
+ hidden: true
129
+ },
130
+ {
131
+ type: 'integer',
132
+ name: 'rank',
133
+ header: TermsUtil.tLabel('rank'),
134
+ sortable: false,
135
+ width: 55,
136
+ record: {
137
+ align: 'right',
138
+ editable: true,
139
+ mandatory: true
189
140
  }
190
- }
191
- },
192
- {
193
- type: 'select',
194
- name: 'type',
195
- header: TermsUtil.tLabel('type'),
196
- sortable: false,
197
- width: 100,
198
- record: {
199
- align: 'left',
200
- editable: true,
201
- mandatory: true,
202
- options: ['', 'basic', 'custom', 'grid-basic', 'grid-custom']
203
- }
204
- },
205
- {
206
- type: 'string',
207
- name: 'style',
208
- header: TermsUtil.tLabel('style'),
209
- sortable: false,
210
- width: 100,
211
- record: {
212
- align: 'left',
213
- editable: true,
214
- mandatory: false
215
- }
216
- },
217
- {
218
- type: 'select',
219
- name: 'auth',
220
- header: TermsUtil.tLabel('auth'),
221
- sortable: false,
222
- width: 80,
223
- record: {
224
- align: 'left',
225
- editable: true,
226
- mandatory: true,
227
- options: [
228
- {value:'', display:''},
229
- {value:'R', display:'SELECT'},
230
- {value:'C', display:'CREATE'},
231
- {value:'U', display:'UPDATE'},
232
- {value:'D', display:'DELETE'}
233
- ]
234
- }
235
- },
236
- {
237
- type: 'parameters',
238
- name: 'logic',
239
- header: TermsUtil.tLabel('logic'),
240
- sortable: false,
241
- width: 390,
242
- record: {
243
- align: 'left',
244
- editable: true,
245
- mandatory: false,
246
- renderer: (value, column, record, rowIndex, field) => {
247
- if (!record.logic) {
248
- if (record.type === 'basic') {
249
- delete record.logic;
250
- } else if (record.type === 'custom') {
251
- let guide = {
252
- logic: JSON.stringify({
253
- open_popup: {
254
- "title": "menu.variables",
255
- "title_detail": "name",
256
- "type": "popup",
257
- "menu": "menu-routing",
258
- "tagname": "meta-grist-element",
259
- "location": "pages/meta-grist-element.js",
260
- "size": "large",
261
- "popup_field": "param_field",
262
- "parent_field": "id",
263
- "param": [
264
- "filter",
265
- "grist_one",
266
- "grist_selected",
267
- "grist_changed"
268
- ]
269
- },
270
- call_scenario: {
271
- "type": "scenario",
272
- "name": "testScenario",
273
- "after": "fetch",
274
- "param": [
275
- "filter",
276
- "grist_all",
277
- "grist_selected"
278
- ]
279
- }
280
- }, null, 2)
281
- }
282
- record.logic = guide;
283
- } else if (record.type === 'grid-basic') {
284
- let guide = {
285
- logic: '"record-view"'
286
- }
287
- record.logic = guide;
288
- } else if (record.type === 'grid-custom') {
289
- let guide = {
290
- logic: JSON.stringify({
291
- open_popup: {
292
- "title": "menu.variables",
293
- "title_detail": "name",
294
- "type": "popup",
295
- "menu": "menu-routing",
296
- "tagname": "meta-grist-element",
297
- "location": "pages/meta-grist-element.js",
298
- "size": "large",
299
- "popup_field": "param_field",
300
- "parent_field": "id",
301
- },
302
- open_form_popup: {
303
- "type": "form",
304
- "title": "title.detail",
305
- "title_detail": "name",
306
- "size": "large",
307
- "menu": "operation-master"
308
- },
309
- call_scenario: {
310
- "type": "scenario",
311
- "name": "testScenario",
312
- "after": "fetch"
313
- }
314
- }, null, 2)
141
+ },
142
+ {
143
+ type: 'string',
144
+ name: 'name',
145
+ header: TermsUtil.tLabel('name'),
146
+ sortable: false,
147
+ width: 150,
148
+ record: {
149
+ align: 'left',
150
+ editable: true,
151
+ mandatory: true
152
+ }
153
+ },
154
+ {
155
+ type: 'string',
156
+ name: 'label',
157
+ header: TermsUtil.tLabel('label'),
158
+ sortable: false,
159
+ width: 150,
160
+ record: {
161
+ align: 'left',
162
+ editable: true,
163
+ mandatory: true
164
+ }
165
+ },
166
+ {
167
+ type: 'string',
168
+ name: 'display',
169
+ header: TermsUtil.tLabel('display'),
170
+ sortable: false,
171
+ width: 150,
172
+ record: {
173
+ align: 'left',
174
+ editable: false,
175
+ mandatory: false,
176
+ renderer: (value, column, record, rowIndex, field) => {
177
+ let tLabel = record.label ? record.label : record.name
178
+ return TermsUtil.tButton(tLabel)
179
+ }
180
+ }
181
+ },
182
+ {
183
+ type: 'select',
184
+ name: 'type',
185
+ header: TermsUtil.tLabel('type'),
186
+ sortable: false,
187
+ width: 100,
188
+ record: {
189
+ align: 'left',
190
+ editable: true,
191
+ mandatory: true,
192
+ options: ['', 'basic', 'custom', 'grid-basic', 'grid-custom']
193
+ }
194
+ },
195
+ {
196
+ type: 'string',
197
+ name: 'style',
198
+ header: TermsUtil.tLabel('style'),
199
+ sortable: false,
200
+ width: 100,
201
+ record: {
202
+ align: 'left',
203
+ editable: true,
204
+ mandatory: false
205
+ }
206
+ },
207
+ {
208
+ type: 'select',
209
+ name: 'auth',
210
+ header: TermsUtil.tLabel('auth'),
211
+ sortable: false,
212
+ width: 80,
213
+ record: {
214
+ align: 'left',
215
+ editable: true,
216
+ mandatory: true,
217
+ options: [
218
+ { value: '', display: '' },
219
+ { value: 'R', display: 'SELECT' },
220
+ { value: 'C', display: 'CREATE' },
221
+ { value: 'U', display: 'UPDATE' },
222
+ { value: 'D', display: 'DELETE' }
223
+ ]
224
+ }
225
+ },
226
+ {
227
+ type: 'parameters',
228
+ name: 'logic',
229
+ header: TermsUtil.tLabel('logic'),
230
+ sortable: false,
231
+ width: 390,
232
+ record: {
233
+ align: 'left',
234
+ editable: true,
235
+ mandatory: false,
236
+ renderer: (value, column, record, rowIndex, field) => {
237
+ if (!record.logic) {
238
+ if (record.type === 'basic') {
239
+ delete record.logic
240
+ } else if (record.type === 'custom') {
241
+ let guide = {
242
+ logic: JSON.stringify(
243
+ {
244
+ open_popup: {
245
+ title: 'menu.variables',
246
+ title_detail: 'name',
247
+ type: 'popup',
248
+ menu: 'menu-routing',
249
+ tagname: 'meta-grist-element',
250
+ location: 'pages/meta-grist-element.js',
251
+ size: 'large',
252
+ popup_field: 'param_field',
253
+ parent_field: 'id',
254
+ param: ['filter', 'grist_one', 'grist_selected', 'grist_changed']
255
+ },
256
+ call_scenario: {
257
+ type: 'scenario',
258
+ name: 'testScenario',
259
+ after: 'fetch',
260
+ param: ['filter', 'grist_all', 'grist_selected']
261
+ }
262
+ },
263
+ null,
264
+ 2
265
+ )
266
+ }
267
+ record.logic = guide
268
+ } else if (record.type === 'grid-basic') {
269
+ let guide = {
270
+ logic: '"record-view"'
271
+ }
272
+ record.logic = guide
273
+ } else if (record.type === 'grid-custom') {
274
+ let guide = {
275
+ logic: JSON.stringify(
276
+ {
277
+ open_popup: {
278
+ title: 'menu.variables',
279
+ title_detail: 'name',
280
+ type: 'popup',
281
+ menu: 'menu-routing',
282
+ tagname: 'meta-grist-element',
283
+ location: 'pages/meta-grist-element.js',
284
+ size: 'large',
285
+ popup_field: 'param_field',
286
+ parent_field: 'id'
287
+ },
288
+ open_form_popup: {
289
+ type: 'form',
290
+ title: 'title.detail',
291
+ title_detail: 'name',
292
+ size: 'large',
293
+ menu: 'operation-master'
294
+ },
295
+ call_scenario: {
296
+ type: 'scenario',
297
+ name: 'testScenario',
298
+ after: 'fetch'
299
+ }
300
+ },
301
+ null,
302
+ 2
303
+ )
304
+ }
305
+ record.logic = guide
306
+ } else {
307
+ record.logic = undefined
315
308
  }
316
- record.logic = guide;
317
309
  } else {
318
- record.logic = undefined;
319
- }
320
- } else {
321
- if (record.type === 'basic') {
322
- record.logic = undefined;
310
+ if (record.type === 'basic') {
311
+ record.logic = undefined
312
+ }
323
313
  }
314
+ return getRenderer('json5')(value, column, record, rowIndex, field)
315
+ },
316
+ options: (value, column, record, row, field) => {
317
+ var { name, help } = { name: TermsUtil.tLabel('logic'), help: '' }
318
+ let spec = [{ label: 'script', name: 'logic', type: 'textarea' }]
319
+ const context = this.buttonTabGrist
320
+ return { name, spec, help, context }
324
321
  }
325
- return getRenderer('json5')(value, column, record, rowIndex, field)
326
- },
327
- options: (value, column, record, row, field) => {
328
- var { name, help } = { name: TermsUtil.tLabel('logic'), help: '' };
329
- let spec = [{ label: 'script', name: 'logic', type: 'textarea' }];
330
- const context = this.buttonTabGrist
331
- return { name, spec, help, context }
332
322
  }
333
323
  }
334
- }
335
- ]
324
+ ]
325
+ }
336
326
  }
337
327
  }
338
- }
339
-