w-web-perm 1.0.80 → 1.0.82

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 (24) hide show
  1. package/dist/css/app.894b904b.css +1 -0
  2. package/dist/css/{chunk-vendors.695187ec.css → chunk-vendors.034f7a87.css} +1 -1
  3. package/dist/index.tmp +1 -1
  4. package/dist/js/app-legacy.856d66df.js +1 -0
  5. package/dist/js/app.856d66df.js +1 -0
  6. package/dist/js/{chunk-vendors-legacy.b57e1cce.js → chunk-vendors-legacy.d8adfdd4.js} +1 -1
  7. package/dist/js/{chunk-vendors.b57e1cce.js → chunk-vendors.d8adfdd4.js} +1 -1
  8. package/dist/w-web-perm.umd.js +1 -1
  9. package/docs/WWebPerm.html +1 -1
  10. package/docs/global.html +1 -1
  11. package/docs/index.html +1 -1
  12. package/docs/server_WWebPerm.mjs.html +1 -1
  13. package/docs/server_procCore.mjs.html +1 -1
  14. package/docs/src_fetchJson.mjs.html +1 -1
  15. package/package.json +3 -3
  16. package/src/components/LayoutContentStaInfor.vue +2 -2
  17. package/src/components/VeCgrups.vue +949 -934
  18. package/src/components/VeCpemis.vue +949 -934
  19. package/src/components/VeGrupBlngUsers.vue +1180 -1165
  20. package/src/components/VePemiBlngGrups.vue +1180 -1165
  21. package/tableTags-web-perm.json +1 -1
  22. package/dist/css/app.c0e03d41.css +0 -1
  23. package/dist/js/app-legacy.85fce10c.js +0 -1
  24. package/dist/js/app.85fce10c.js +0 -1
package/src/components/VeCgrups.vue CHANGED
@@ -1,934 +1,949 @@
1
- <template>
2
- <WDialog
3
- :show.sync="bShow"
4
- :title="isEditable?$t('userEditCgrups'):$t('userEditCgrupsForDisplay')"
5
- :icon="mdiFormatListCheckbox"
6
- :minWidth="800"
7
- :maxWidth="800"
8
- :fullscreen="fullscreen"
9
- :contentBackgroundColor="'#fff'"
10
- :headerBtns="useHeaderBtns"
11
- :hasSaveBtn="isEditable && isModified"
12
- :save-btn-tooltip="$t('save')"
13
- :close-btn-tooltip="$t('close')"
14
- @click-btns="clickBtns"
15
- @click-save="clickSave"
16
- @click-close="clickClose"
17
- @resize="resizeDialog"
18
- >
19
- <template v-slot:content>
20
- <div>
21
-
22
- <div
23
- style="_border-bottom:1px solid #ddd; background:#fff;"
24
- v-domresize
25
- @domresize="resizeHead"
26
- >
27
-
28
- <!-- 功能區 -->
29
- <div
30
- style="padding:5px; background:#fff; display:flex; align-items:center;"
31
- v-if="isEditable"
32
- >
33
-
34
- <template>
35
-
36
- <WButtonCircle
37
- :paddingStyle="{v:6,h:6}"
38
- :tooltip="$t('checkAllYes')"
39
- :icon="mdiCheckboxMultipleMarked"
40
- :backgroundColor="'#fff'"
41
- :backgroundColorHover="'#f2f2f2'"
42
- _textColor="'#eee'"
43
- _textColorHover="'#fff'"
44
- :iconColor="'#444'"
45
- :iconColorHover="'#222'"
46
- :shadow="false"
47
- @click="showVeCgrupsToggleItemsEnableAllYes"
48
- ></WButtonCircle>
49
-
50
- <div style="padding-left:4px;"></div>
51
-
52
- </template>
53
-
54
- <template>
55
-
56
- <WButtonCircle
57
- :paddingStyle="{v:6,h:6}"
58
- :tooltip="$t('checkAllNo')"
59
- :icon="mdiCheckboxMultipleBlankOutline"
60
- :backgroundColor="'#fff'"
61
- :backgroundColorHover="'#f2f2f2'"
62
- _textColor="'#eee'"
63
- _textColorHover="'#fff'"
64
- :iconColor="'#444'"
65
- :iconColorHover="'#222'"
66
- :shadow="false"
67
- @click="showVeCgrupsToggleItemsEnableAllNo"
68
- ></WButtonCircle>
69
-
70
- <div style="padding-left:4px;"></div>
71
-
72
- </template>
73
-
74
- <template>
75
-
76
- <WButtonCircle
77
- :paddingStyle="{v:6,h:6}"
78
- :tooltip="$t('checkAllInv')"
79
- :icon="mdiCodeTagsCheck"
80
- :backgroundColor="'#fff'"
81
- :backgroundColorHover="'#f2f2f2'"
82
- _textColor="'#eee'"
83
- _textColorHover="'#fff'"
84
- :iconColor="'#444'"
85
- :iconColorHover="'#222'"
86
- :shadow="false"
87
- @click="showVeCgrupsToggleItemsEnableAllInv"
88
- ></WButtonCircle>
89
-
90
- <div style="padding-left:4px;"></div>
91
-
92
- </template>
93
-
94
- <template v-if="hasItemsCheck">
95
-
96
- <WButtonCircle
97
- :paddingStyle="{v:6,h:6}"
98
- :tooltip="$t('cgrupDeleteCheckPemis')"
99
- :icon="mdiTrashCanOutline"
100
- :backgroundColor="'#fff'"
101
- :backgroundColorHover="'#f2f2f2'"
102
- _textColor="'#eee'"
103
- _textColorHover="'#fff'"
104
- :iconColor="'#444'"
105
- :iconColorHover="'#222'"
106
- :shadow="false"
107
- @click="deleteItemsCheck"
108
- ></WButtonCircle>
109
-
110
- <div style="padding-left:4px;"></div>
111
-
112
- </template>
113
-
114
- </div>
115
-
116
- </div>
117
-
118
- <template
119
- v-if="!firstLoading"
120
- >
121
-
122
- <template v-if="items">
123
- <WAggridVue
124
- ref="rftable"
125
- :style="`width:100%;`"
126
- :height="contentHeight"
127
- :opt="opt"
128
- >
129
- <template v-slot:cell-render="props">
130
- <span v-if="props.key==='name'">{{ props.value }}</span>
131
- <select v-else-if="props.key==='mode'" @change="showVeCgrupsToggleItemModeByName(props.row.name, $event.target.value)" :disabled="!isEditable">
132
- <option value="OR" :selected="props.row.mode === 'OR'">OR</option>
133
- <option value="AND" :selected="props.row.mode === 'AND'">AND</option>
134
- </select>
135
- <input v-else-if="props.key==='enable'" type="checkbox" :checked="props.value === 'y'" @click="showVeCgrupsToggleItemEnableByName(props.row.name)" :disabled="!isEditable" />
136
- <span v-else>{{ props.value }}</span>
137
- </template>
138
- </WAggridVue>
139
- </template>
140
-
141
- </template>
142
-
143
- <div
144
- style="padding:10px 15px; font-size:0.8rem;"
145
- v-else
146
- >
147
- {{$t('waitingData')}}
148
- </div>
149
-
150
- </div>
151
- </template>
152
- </WDialog>
153
- </template>
154
-
155
- <script>
156
- import { mdiDeleteForever, mdiFullscreen, mdiFullscreenExit, mdiFormatListCheckbox, mdiFileTree, mdiTrashCanOutline, mdiCheckboxMultipleBlankOutline, mdiCheckboxMultipleMarked, mdiCodeTagsCheck } from '@mdi/js/mdi.js'
157
- import Vue from 'vue'
158
- import JSON5 from 'json5'
159
- import get from 'lodash-es/get.js'
160
- import set from 'lodash-es/set.js'
161
- import each from 'lodash-es/each.js'
162
- import map from 'lodash-es/map.js'
163
- import size from 'lodash-es/size.js'
164
- import filter from 'lodash-es/filter.js'
165
- import sortBy from 'lodash-es/sortBy.js'
166
- import cloneDeep from 'lodash-es/cloneDeep.js'
167
- import genPm from 'wsemi/src/genPm.mjs'
168
- import delay from 'wsemi/src/delay.mjs'
169
- import iseobj from 'wsemi/src/iseobj.mjs'
170
- import isestr from 'wsemi/src/isestr.mjs'
171
- import WDialog from 'w-component-vue/src/components/WDialog.vue'
172
- import WButtonCircle from 'w-component-vue/src/components/WButtonCircle.vue'
173
- import WAggridVue from 'w-aggrid-vue/src/components/WAggridVue.vue'
174
-
175
-
176
- export default {
177
- components: {
178
- WDialog,
179
- WButtonCircle,
180
- WAggridVue,
181
- },
182
- props: {
183
- },
184
- data: function() {
185
- return {
186
- mdiDeleteForever,
187
- mdiFullscreen,
188
- mdiFullscreenExit,
189
- mdiFormatListCheckbox,
190
- mdiFileTree,
191
- mdiTrashCanOutline,
192
- mdiCheckboxMultipleBlankOutline,
193
- mdiCheckboxMultipleMarked,
194
- mdiCodeTagsCheck,
195
-
196
- bShow: false,
197
- pm: null,
198
-
199
- fullscreen: false,
200
-
201
- panelHeight: 100,
202
- headHeight: 100,
203
-
204
- firstLoading: true,
205
- firstSetting: true,
206
- isEditable: false,
207
- isModified: false,
208
-
209
- user: null,
210
-
211
- items: [],
212
- itemsCheck: [],
213
- opt: null,
214
-
215
- }
216
- },
217
- mounted: function() {
218
- //console.log('mounted')
219
-
220
- let vo = this
221
-
222
- //set
223
- Vue.prototype.$dg.showVeCgrups = vo.show
224
- Vue.prototype.$dg.showVeCgrupsToggleItemModeByName = vo.showVeCgrupsToggleItemModeByName
225
- Vue.prototype.$dg.showVeCgrupsToggleItemEnableByName = vo.showVeCgrupsToggleItemEnableByName
226
-
227
- //firstSetting
228
- if (vo.firstSetting) {
229
- // console.log('webInfor', vo.webInfor)
230
-
231
- //會觸發數據變更再導致opt變更導致觸發rowsChange等事件, 故得要延遲, 供組件偵測初始設定數據初始化之用
232
- setTimeout(() => {
233
- vo.firstSetting = false
234
- // console.log('firstSetting', vo.firstSetting)
235
- }, 1)
236
-
237
- }
238
-
239
- },
240
- computed: {
241
-
242
- syncState: function() {
243
- let vo = this
244
- return get(vo, '$store.state.syncState')
245
- },
246
-
247
- targets: function() {
248
- let rs = get(this, `$store.state.targets`)
249
- rs = sortBy(rs, 'order')
250
- return rs
251
- },
252
-
253
- pemis: function() {
254
- let rs = get(this, `$store.state.pemis`)
255
- rs = sortBy(rs, 'order')
256
- return rs
257
- },
258
-
259
- grups: function() {
260
- let rs = get(this, `$store.state.grups`)
261
- rs = sortBy(rs, 'order')
262
- return rs
263
- },
264
-
265
- users: function() {
266
- let rs = get(this, `$store.state.users`)
267
- rs = sortBy(rs, 'order')
268
- return rs
269
- },
270
-
271
- kpHeaderBtns: function() {
272
- let vo = this
273
- let kp = {
274
- // delete: {
275
- // icon: mdiDeleteForever,
276
- // tooltip: `${vo.$t('delete')}${vo.tableNameCht}`,
277
- // evName: 'delete'
278
- // },
279
- toFullscreen: {
280
- icon: mdiFullscreen,
281
- tooltip: vo.$t('screenFull'),
282
- evName: 'toFullscreen'
283
- },
284
- toNormalscreen: {
285
- icon: mdiFullscreenExit,
286
- tooltip: vo.$t('screenNormal'),
287
- evName: 'toNormalscreen'
288
- },
289
- }
290
- return kp
291
- },
292
-
293
- useHeaderBtns: function() {
294
- let vo = this
295
- let bts = []
296
- if (true) {
297
- let k = vo.fullscreen ? 'toNormalscreen' : 'toFullscreen'
298
- bts = [
299
- ...bts,
300
- vo.kpHeaderBtns[k]
301
- ]
302
- }
303
- // if (vo.useDelete) {
304
- // let k = 'delete'
305
- // bts = [
306
- // ...bts,
307
- // vo.kpHeaderBtns[k]
308
- // ]
309
- // }
310
- return bts
311
- },
312
-
313
- contentHeight: function() {
314
- let vo = this
315
-
316
- //h
317
- let h = vo.panelHeight - vo.headHeight
318
- h = Math.max(h, 0)
319
-
320
- return h
321
- },
322
-
323
- hasItemsCheck: function() {
324
- let vo = this
325
-
326
- //h
327
- let b = vo.itemsCheck.length > 0
328
-
329
- return b
330
- },
331
-
332
- },
333
- methods: {
334
-
335
- resizeDialog: function(msg) {
336
- // console.log('methods resizeDialog', msg)
337
-
338
- let vo = this
339
-
340
- //panelWidth, panelHeight
341
- vo.panelHeight = msg.contentHeightMax
342
-
343
- },
344
-
345
- resizeHead: function(msg) {
346
- // console.log('methods resizeHead', msg)
347
-
348
- let vo = this
349
-
350
- //headHeight
351
- vo.headHeight = msg.snew.offsetHeight
352
-
353
- },
354
-
355
- genOpt: function() {
356
- // console.log('methods genOpt')
357
-
358
- let vo = this
359
-
360
- //default
361
- vo.itemsCheck = []
362
-
363
- //opt
364
- let opt = null
365
- if (size(vo.items) > 0) {
366
-
367
- //ks
368
- let ks = [
369
- 'name',
370
- 'mode',
371
- 'enable',
372
- ]
373
- // console.log('ks', ks)
374
-
375
- //kpHead
376
- let kpHead = {
377
- 'name': vo.$t('grupName'), //本對話框列出的是權限群組（items 由 vo.grups 產生）
378
- 'mode': vo.$t('operGrupMode'),
379
- 'enable': vo.$t('operEnable'),
380
- }
381
-
382
- //opt
383
- opt = {
384
- language: vo.$t('aggridLanguage'),
385
- rows: vo.items,
386
- keys: ks,
387
- kpHead,
388
- autoFitColumn: true,
389
- defCellEditable: false, //vo.isEditable,
390
- defHeadFilter: true,
391
- defCellAlignH: 'left',
392
- kpCellEditable: {
393
- 'name': vo.isEditable,
394
- 'mode': false,
395
- 'enable': false,
396
- },
397
- kpHeadWidth: {
398
- 'mode': 100,
399
- 'enable': 100,
400
- },
401
- // kpRowDrag: {
402
- // 'name': true,
403
- // },
404
- // kpHeadFilter: {
405
- // 'enable': false,
406
- // },
407
- kpHeadFilterType: {
408
- 'name': 'text',
409
- 'mode': 'text',
410
- 'enable': 'text',
411
- },
412
- kpHeadCheckBox: {
413
- 'name': true,
414
- },
415
- rowsChange: (rs) => {
416
- // console.log('rowsChange', rs)
417
- // console.log('rowsChange cloneDeep(vo.opt.rows)', cloneDeep(vo.opt.rows))
418
-
419
- //check
420
- if (!vo.syncState || vo.firstLoading || vo.firstSetting) {
421
- return
422
- }
423
-
424
- //isModified
425
- vo.isModified = true
426
-
427
- },
428
- rowChecked: (rs) => {
429
- // console.log('rowChecked', rs)
430
- // console.log('rowChecked cloneDeep(vo.opt.rows)', cloneDeep(vo.opt.rows))
431
-
432
- //save itemsCheck
433
- vo.itemsCheck = cloneDeep(rs)
434
-
435
- },
436
- }
437
- // console.log('opt', opt)
438
-
439
- }
440
-
441
- //save
442
- vo.opt = opt
443
-
444
- },
445
-
446
- deleteItemsCheck: function() {
447
- // console.log('method deleteItemsCheck')
448
-
449
- let vo = this
450
-
451
- //check
452
- if (size(vo.itemsCheck) === 0) {
453
- return
454
- }
455
-
456
- //cloneDeep
457
- let rows = get(vo, 'opt.rows', [])
458
-
459
- //cloneDeep
460
- rows = cloneDeep(rows)
461
-
462
- //filter
463
- each(vo.itemsCheck, (v) => {
464
- // console.log('v', v)
465
- let name = get(v, 'data.name', '')
466
- if (!isestr(name)) {
467
- console.log(`invalid name`)
468
- return true //跳出換下一個
469
- }
470
- rows = filter(rows, (vv) => {
471
- return vv.name !== name
472
- })
473
- })
474
-
475
- //clear
476
- vo.itemsCheck = []
477
-
478
- //save
479
- vo.opt.rows = rows
480
- // console.log('deleteItemsCheck cloneDeep(vo.opt.rows)', cloneDeep(vo.opt.rows))
481
-
482
- //isModified
483
- vo.isModified = true
484
-
485
- },
486
-
487
- refresh: function() {
488
- let vo = this
489
-
490
- //cmp
491
- let cmp = get(vo, '$refs.rftable')
492
- // console.log('cmp', cmp)
493
-
494
- //refresh, 因set不會觸發ag-grid重繪, 故須另外調用組件函數refresh(內為redrawRows)重繪各列, 使cell-render slot內容更新(w-aggrid-vue 2.0.56起以cell-render slot取代opt.kpCellRender)
495
- cmp.refresh()
496
-
497
- },
498
-
499
- getDisplayData: function() {
500
- let vo = this
501
-
502
- //cmp
503
- let cmp = get(vo, '$refs.rftable')
504
- // console.log('cmp', cmp)
505
-
506
- //getDisplayData
507
- let rows = cmp.getDisplayData()
508
-
509
- return rows
510
- },
511
-
512
- showVeCgrupsToggleItemModeByName: function(name, mode) {
513
- // console.log('showVeCgrupsToggleItemModeByName', name, mode)
514
-
515
- let vo = this
516
-
517
- //check
518
- if (!isestr(name)) {
519
- vo.$alert(`${vo.$t('cgrupEditNoName')}`, { type: 'error' })
520
- return
521
- }
522
-
523
- //rows
524
- let rows = get(vo, 'opt.rows', [])
525
-
526
- //find
527
- let r = null
528
- let kr = null
529
- each(rows, (v, k) => {
530
- if (get(v, 'name', '') === name) {
531
- r = v
532
- kr = k
533
- return false //跳出
534
- }
535
- })
536
-
537
- //check
538
- if (!iseobj(r)) {
539
- vo.$alert(`${vo.$t('cgrupEditNoPemi')}`, { type: 'error' })
540
- return
541
- }
542
-
543
- //mode
544
- // let mode = th.value
545
- // console.log('mode', mode)
546
-
547
- //set
548
- set(vo, `opt.rows[${kr}].mode`, mode)
549
- // console.log('vo.opt.rows[kr]', cloneDeep(vo.opt.rows[kr]))
550
-
551
- //refresh
552
- vo.refresh()
553
-
554
- //isModified
555
- vo.isModified = true
556
-
557
- },
558
-
559
- showVeCgrupsToggleItemEnableByName: function(name) {
560
- // console.log('showVeCgrupsToggleItemEnableByName', name)
561
-
562
- let vo = this
563
-
564
- //check
565
- if (!isestr(name)) {
566
- vo.$alert(`${vo.$t('cgrupEditNoName')}`, { type: 'error' })
567
- return
568
- }
569
-
570
- //rows
571
- let rows = get(vo, 'opt.rows', [])
572
-
573
- //find
574
- let r = null
575
- let kr = null
576
- each(rows, (v, k) => {
577
- if (get(v, 'name', '') === name) {
578
- r = v
579
- kr = k
580
- return false //跳出
581
- }
582
- })
583
-
584
- //check
585
- if (!iseobj(r)) {
586
- vo.$alert(`${vo.$t('cgrupEditNoPemi')}`, { type: 'error' })
587
- return
588
- }
589
-
590
- //enable
591
- let _enable = get(r, 'enable', 'n')
592
- let enable = _enable === 'y' ? 'n' : 'y'
593
- // console.log('enable', enable)
594
-
595
- //set
596
- set(vo, `opt.rows[${kr}].enable`, enable)
597
- // console.log('vo.opt.rows[kr]', cloneDeep(vo.opt.rows[kr]))
598
-
599
- //refresh
600
- vo.refresh()
601
-
602
- //isModified
603
- vo.isModified = true
604
-
605
- },
606
-
607
- showVeCgrupsToggleItemsEnableAllYes: function() {
608
- // console.log('showVeCgrupsToggleItemsEnableAllYes')
609
-
610
- let vo = this
611
-
612
- //rows
613
- let rows = get(vo, 'opt.rows', [])
614
- // console.log('rows', rows)
615
-
616
- //kpRow
617
- let kpRow = {}
618
- each(rows, (r, kr) => {
619
- kpRow[r.name] = kr
620
- })
621
-
622
- //rowsEff
623
- let rowsEff = vo.getDisplayData()
624
- // console.log('rowsEff', rowsEff)
625
-
626
- //toggle
627
- each(rowsEff, (r) => {
628
-
629
- //kr
630
- let kr = kpRow[r.name]
631
-
632
- //set
633
- set(vo, `opt.rows[${kr}].enable`, 'y')
634
- // console.log('vo.opt.rows[kr]', cloneDeep(vo.opt.rows[kr]))
635
-
636
- })
637
-
638
- //refresh
639
- vo.refresh()
640
-
641
- //isModified
642
- vo.isModified = true
643
-
644
- },
645
-
646
- showVeCgrupsToggleItemsEnableAllNo: function() {
647
- // console.log('showVeCgrupsToggleItemsEnableAllNo')
648
-
649
- let vo = this
650
-
651
- //rows
652
- let rows = get(vo, 'opt.rows', [])
653
- // console.log('rows', rows)
654
-
655
- //kpRow
656
- let kpRow = {}
657
- each(rows, (r, kr) => {
658
- kpRow[r.name] = kr
659
- })
660
-
661
- //rowsEff
662
- let rowsEff = vo.getDisplayData()
663
- // console.log('rowsEff', rowsEff)
664
-
665
- //toggle
666
- each(rowsEff, (r) => {
667
-
668
- //kr
669
- let kr = kpRow[r.name]
670
-
671
- //set
672
- set(vo, `opt.rows[${kr}].enable`, 'n')
673
- // console.log('vo.opt.rows[kr]', cloneDeep(vo.opt.rows[kr]))
674
-
675
- })
676
-
677
- //refresh
678
- vo.refresh()
679
-
680
- //isModified
681
- vo.isModified = true
682
-
683
- },
684
-
685
- showVeCgrupsToggleItemsEnableAllInv: function() {
686
- // console.log('showVeCgrupsToggleItemsEnableAllInv')
687
-
688
- let vo = this
689
-
690
- //rows
691
- let rows = get(vo, 'opt.rows', [])
692
- // console.log('rows', rows)
693
-
694
- //kpRow
695
- let kpRow = {}
696
- each(rows, (r, kr) => {
697
- kpRow[r.name] = kr
698
- })
699
-
700
- //rowsEff
701
- let rowsEff = vo.getDisplayData()
702
- // console.log('rowsEff', rowsEff)
703
-
704
- //toggle
705
- each(rowsEff, (r) => {
706
-
707
- //kr
708
- let kr = kpRow[r.name]
709
-
710
- //enable
711
- let _enable = get(r, 'enable', 'n')
712
- let enable = _enable === 'y' ? 'n' : 'y'
713
-
714
- //set
715
- set(vo, `opt.rows[${kr}].enable`, enable)
716
- // console.log('vo.opt.rows[kr]', cloneDeep(vo.opt.rows[kr]))
717
-
718
- })
719
-
720
- //refresh
721
- vo.refresh()
722
-
723
- //isModified
724
- vo.isModified = true
725
-
726
- },
727
-
728
- clickBtns: function(msg) {
729
- // console.log('clickBtns', msg)
730
-
731
- let vo = this
732
-
733
- //evName
734
- if (msg.evName === 'toFullscreen') {
735
- vo.fullscreen = true
736
- }
737
- else if (msg.evName === 'toNormalscreen') {
738
- vo.fullscreen = false
739
- }
740
-
741
- },
742
-
743
- clickSave: function(msg) {
744
- //console.log('methods clickSave', msg)
745
-
746
- let vo = this
747
-
748
- //save按鈕第一行立刻釋放視覺鎖
749
- msg.pm.resolve()
750
-
751
- //fire-and-forget, 不 await
752
- vo.doSave()
753
-
754
- },
755
-
756
- doSave: function() {
757
-
758
- let vo = this
759
-
760
- async function core() {
761
-
762
- //show loading
763
- vo.$ui.updateLoading(true)
764
-
765
- //delay
766
- await delay(300)
767
-
768
- //rows
769
- let rows = get(vo, 'opt.rows', [])
770
- // console.log('rows', rows)
771
-
772
- //kpGrup
773
- let kpGrup = {}
774
- each(rows, (r) => {
775
- let name = get(r, 'name', '')
776
- let mode = get(r, 'mode', '')
777
- let enable = get(r, 'enable', '')
778
- if (!isestr(name)) {
779
- console.log(`invalid name`)
780
- return true //跳出換下一個
781
- }
782
- if (mode !== 'OR' && mode !== 'AND') {
783
- console.log(`invalid mode[${mode}]`)
784
- return true //跳出換下一個
785
- }
786
- if (!isestr(enable)) {
787
- console.log(`invalid enable`)
788
- return true //跳出換下一個
789
- }
790
- kpGrup[name] = {
791
- mode,
792
- isActive: enable,
793
- }
794
- })
795
- // console.log('kpGrup', kpGrup)
796
-
797
- //cgrups
798
- let cgrups = JSON.stringify(kpGrup)
799
- // console.log('cgrups', cgrups)
800
-
801
- return cgrups
802
- }
803
-
804
- //core
805
- core()
806
- .then((rows) => {
807
-
808
- //resolve
809
- vo.pm.resolve(rows)
810
-
811
- //hide
812
- vo.bShow = false
813
-
814
- })
815
- .catch((err) => {
816
- console.log('doSave', err)
817
- vo.$alert(vo.$t('anUnexpectedErrorOccurred'), { type: 'error' }) //§5.1: 非預期例外須告知, 不靜默吞 (失敗時 .then 不執行→視窗不關)
818
- })
819
- .finally(() => {
820
-
821
- //hide loading
822
- vo.$ui.updateLoading(false)
823
-
824
- })
825
-
826
- },
827
-
828
- clickClose: function() {
829
- //console.log('methods clickClose')
830
-
831
- let vo = this
832
-
833
- //reject
834
- vo.pm.reject('close window')
835
-
836
- //hide
837
- vo.bShow = false
838
-
839
- },
840
-
841
- show: function (msg) {
842
- // console.log('methods show', msg)
843
-
844
- let vo = this
845
-
846
- //pm
847
- vo.pm = genPm()
848
-
849
- //default
850
- vo.isModified = false
851
-
852
- //isEditable, user
853
- let isEditable = get(msg, 'isEditable', false)
854
- let user = get(msg, 'user', {})
855
-
856
- //cloneDeep
857
- user = cloneDeep(user)
858
-
859
- //cgrups
860
- let cgrups = get(user, 'cgrups', '')
861
- // console.log('cgrups', cgrups)
862
-
863
- //kpGrup
864
- let kpGrup = {}
865
- if (isestr(cgrups)) {
866
- try {
867
- kpGrup = JSON5.parse(cgrups)
868
- }
869
- catch (err) {
870
- console.log('cgrups', cgrups)
871
- console.log('err', err)
872
- }
873
- }
874
- // console.log('kpGrup', kpGrup)
875
-
876
- //items
877
- let items = map(vo.grups, (v) => {
878
- // console.log('grups v', v)
879
-
880
- //p
881
- let p = get(kpGrup, v.name, null)
882
- // console.log('p', p)
883
-
884
- //name
885
- let name = v.name
886
- // console.log('name', name)
887
-
888
- //mode
889
- let mode = get(p, 'mode', '')
890
- if (mode !== 'OR' && mode !== 'AND') {
891
- mode = 'OR'
892
- }
893
- // console.log('mode', mode)
894
-
895
- //enable
896
- let _enable = get(p, 'isActive', '')
897
- let enable = _enable === 'y' ? 'y' : 'n'
898
- // console.log('isActive', enable)
899
-
900
- //r
901
- let r = {
902
- name,
903
- mode,
904
- enable,
905
- }
906
- // console.log('r', r)
907
-
908
- return r
909
- })
910
- // console.log('items', items)
911
-
912
- //save
913
- vo.isEditable = isEditable
914
- vo.user = user
915
- vo.items = items
916
-
917
- //genOpt
918
- vo.genOpt()
919
-
920
- //firstLoading
921
- vo.firstLoading = false
922
-
923
- //bShow
924
- vo.bShow = true
925
-
926
- return vo.pm
927
- },
928
-
929
- }
930
- }
931
- </script>
932
-
933
- <style scoped>
934
- </style>
1
+ <template>
2
+ <WDialog
3
+ :show.sync="bShow"
4
+ :title="isEditable?$t('userEditCgrups'):$t('userEditCgrupsForDisplay')"
5
+ :icon="mdiFormatListCheckbox"
6
+ :minWidth="800"
7
+ :maxWidth="800"
8
+ :fullscreen="fullscreen"
9
+ :contentBackgroundColor="'#fff'"
10
+ :headerBtns="useHeaderBtns"
11
+ :hasSaveBtn="isEditable && isModified"
12
+ :save-btn-tooltip="$t('save')"
13
+ :close-btn-tooltip="$t('close')"
14
+ @click-btns="clickBtns"
15
+ @click-save="clickSave"
16
+ @click-close="clickClose"
17
+ @resize="resizeDialog"
18
+ >
19
+ <template v-slot:content>
20
+ <div>
21
+
22
+ <div
23
+ style="_border-bottom:1px solid #ddd; background:#fff;"
24
+ v-domresize
25
+ @domresize="resizeHead"
26
+ >
27
+
28
+ <!-- 功能區 -->
29
+ <div
30
+ style="padding:5px; background:#fff; display:flex; align-items:center;"
31
+ v-if="isEditable"
32
+ >
33
+
34
+ <template>
35
+
36
+ <WButtonCircle
37
+ :paddingStyle="{v:6,h:6}"
38
+ :tooltip="$t('checkAllYes')"
39
+ :icon="mdiCheckboxMultipleMarked"
40
+ :backgroundColor="'#fff'"
41
+ :backgroundColorHover="'#f2f2f2'"
42
+ _textColor="'#eee'"
43
+ _textColorHover="'#fff'"
44
+ :iconColor="'#444'"
45
+ :iconColorHover="'#222'"
46
+ :shadow="false"
47
+ @click="showVeCgrupsToggleItemsEnableAllYes"
48
+ ></WButtonCircle>
49
+
50
+ <div style="padding-left:4px;"></div>
51
+
52
+ </template>
53
+
54
+ <template>
55
+
56
+ <WButtonCircle
57
+ :paddingStyle="{v:6,h:6}"
58
+ :tooltip="$t('checkAllNo')"
59
+ :icon="mdiCheckboxMultipleBlankOutline"
60
+ :backgroundColor="'#fff'"
61
+ :backgroundColorHover="'#f2f2f2'"
62
+ _textColor="'#eee'"
63
+ _textColorHover="'#fff'"
64
+ :iconColor="'#444'"
65
+ :iconColorHover="'#222'"
66
+ :shadow="false"
67
+ @click="showVeCgrupsToggleItemsEnableAllNo"
68
+ ></WButtonCircle>
69
+
70
+ <div style="padding-left:4px;"></div>
71
+
72
+ </template>
73
+
74
+ <template>
75
+
76
+ <WButtonCircle
77
+ :paddingStyle="{v:6,h:6}"
78
+ :tooltip="$t('checkAllInv')"
79
+ :icon="mdiCodeTagsCheck"
80
+ :backgroundColor="'#fff'"
81
+ :backgroundColorHover="'#f2f2f2'"
82
+ _textColor="'#eee'"
83
+ _textColorHover="'#fff'"
84
+ :iconColor="'#444'"
85
+ :iconColorHover="'#222'"
86
+ :shadow="false"
87
+ @click="showVeCgrupsToggleItemsEnableAllInv"
88
+ ></WButtonCircle>
89
+
90
+ <div style="padding-left:4px;"></div>
91
+
92
+ </template>
93
+
94
+ <template v-if="hasItemsCheck">
95
+
96
+ <WButtonCircle
97
+ :paddingStyle="{v:6,h:6}"
98
+ :tooltip="$t('cgrupDeleteCheckPemis')"
99
+ :icon="mdiTrashCanOutline"
100
+ :backgroundColor="'#fff'"
101
+ :backgroundColorHover="'#f2f2f2'"
102
+ _textColor="'#eee'"
103
+ _textColorHover="'#fff'"
104
+ :iconColor="'#444'"
105
+ :iconColorHover="'#222'"
106
+ :shadow="false"
107
+ @click="deleteItemsCheck"
108
+ ></WButtonCircle>
109
+
110
+ <div style="padding-left:4px;"></div>
111
+
112
+ </template>
113
+
114
+ </div>
115
+
116
+ </div>
117
+
118
+ <template
119
+ v-if="!firstLoading"
120
+ >
121
+
122
+ <template v-if="items">
123
+ <WAggridVue
124
+ ref="rftable"
125
+ :style="`width:100%;`"
126
+ :height="contentHeight"
127
+ :opt="opt"
128
+ >
129
+ <template v-slot:cell-render="props">
130
+ <span v-if="props.key==='name'">{{ props.value }}</span>
131
+ <WTextSelect
132
+ v-else-if="props.key==='mode'"
133
+ :style="`width:${modeSelectWidth}px;`"
134
+ :items="modeItems"
135
+ :value="props.row.mode"
136
+ :editable="isEditable"
137
+ :paddingStyle="{v:0,h:10}"
138
+ :shadow="false"
139
+ :itemPaddingStyle="{v:8,h:10}"
140
+ :placementDistX="-10"
141
+ :labelContent="'modeSelect'"
142
+ @input="(item)=>{showVeCgrupsToggleItemModeByName(props.row.name, item)}"
143
+ ></WTextSelect>
144
+ <input v-else-if="props.key==='enable'" type="checkbox" :checked="props.value === 'y'" @click="showVeCgrupsToggleItemEnableByName(props.row.name)" :disabled="!isEditable" />
145
+ <span v-else>{{ props.value }}</span>
146
+ </template>
147
+ </WAggridVue>
148
+ </template>
149
+
150
+ </template>
151
+
152
+ <div
153
+ style="padding:10px 15px; font-size:0.8rem;"
154
+ v-else
155
+ >
156
+ {{$t('waitingData')}}
157
+ </div>
158
+
159
+ </div>
160
+ </template>
161
+ </WDialog>
162
+ </template>
163
+
164
+ <script>
165
+ import { mdiDeleteForever, mdiFullscreen, mdiFullscreenExit, mdiFormatListCheckbox, mdiFileTree, mdiTrashCanOutline, mdiCheckboxMultipleBlankOutline, mdiCheckboxMultipleMarked, mdiCodeTagsCheck } from '@mdi/js/mdi.js'
166
+ import Vue from 'vue'
167
+ import JSON5 from 'json5'
168
+ import get from 'lodash-es/get.js'
169
+ import set from 'lodash-es/set.js'
170
+ import each from 'lodash-es/each.js'
171
+ import map from 'lodash-es/map.js'
172
+ import size from 'lodash-es/size.js'
173
+ import filter from 'lodash-es/filter.js'
174
+ import sortBy from 'lodash-es/sortBy.js'
175
+ import cloneDeep from 'lodash-es/cloneDeep.js'
176
+ import genPm from 'wsemi/src/genPm.mjs'
177
+ import delay from 'wsemi/src/delay.mjs'
178
+ import iseobj from 'wsemi/src/iseobj.mjs'
179
+ import isestr from 'wsemi/src/isestr.mjs'
180
+ import WDialog from 'w-component-vue/src/components/WDialog.vue'
181
+ import WButtonCircle from 'w-component-vue/src/components/WButtonCircle.vue'
182
+ import WAggridVue from 'w-aggrid-vue/src/components/WAggridVue.vue'
183
+ import WTextSelect from 'w-component-vue/src/components/WTextSelect.vue'
184
+
185
+
186
+ export default {
187
+ components: {
188
+ WDialog,
189
+ WButtonCircle,
190
+ WAggridVue,
191
+ WTextSelect,
192
+ },
193
+ props: {
194
+ },
195
+ data: function() {
196
+ return {
197
+ mdiDeleteForever,
198
+ mdiFullscreen,
199
+ mdiFullscreenExit,
200
+ mdiFormatListCheckbox,
201
+ mdiFileTree,
202
+ mdiTrashCanOutline,
203
+ mdiCheckboxMultipleBlankOutline,
204
+ mdiCheckboxMultipleMarked,
205
+ mdiCodeTagsCheck,
206
+
207
+ bShow: false,
208
+ pm: null,
209
+
210
+ fullscreen: false,
211
+
212
+ panelHeight: 100,
213
+ headHeight: 100,
214
+
215
+ firstLoading: true,
216
+ firstSetting: true,
217
+ isEditable: false,
218
+ isModified: false,
219
+
220
+ //mode 欄之自製下拉(WTextSelect, 取代原生 select 以免彈出清單之 highlight 色由 OS 決定)
221
+ modeItems: ['OR', 'AND'],
222
+ modeSelectWidth: 72, //= 最長項 'AND' 文字實寬 + 左右內距 10×2 + 展開箭頭 18 + 邊框 1×2, 實測後定值(見 CLAUDE_experience.md)
223
+
224
+ user: null,
225
+
226
+ items: [],
227
+ itemsCheck: [],
228
+ opt: null,
229
+
230
+ }
231
+ },
232
+ mounted: function() {
233
+ //console.log('mounted')
234
+
235
+ let vo = this
236
+
237
+ //set
238
+ Vue.prototype.$dg.showVeCgrups = vo.show
239
+ Vue.prototype.$dg.showVeCgrupsToggleItemModeByName = vo.showVeCgrupsToggleItemModeByName
240
+ Vue.prototype.$dg.showVeCgrupsToggleItemEnableByName = vo.showVeCgrupsToggleItemEnableByName
241
+
242
+ //firstSetting
243
+ if (vo.firstSetting) {
244
+ // console.log('webInfor', vo.webInfor)
245
+
246
+ //會觸發數據變更再導致opt變更導致觸發rowsChange等事件, 故得要延遲, 供組件偵測初始設定數據初始化之用
247
+ setTimeout(() => {
248
+ vo.firstSetting = false
249
+ // console.log('firstSetting', vo.firstSetting)
250
+ }, 1)
251
+
252
+ }
253
+
254
+ },
255
+ computed: {
256
+
257
+ syncState: function() {
258
+ let vo = this
259
+ return get(vo, '$store.state.syncState')
260
+ },
261
+
262
+ targets: function() {
263
+ let rs = get(this, `$store.state.targets`)
264
+ rs = sortBy(rs, 'order')
265
+ return rs
266
+ },
267
+
268
+ pemis: function() {
269
+ let rs = get(this, `$store.state.pemis`)
270
+ rs = sortBy(rs, 'order')
271
+ return rs
272
+ },
273
+
274
+ grups: function() {
275
+ let rs = get(this, `$store.state.grups`)
276
+ rs = sortBy(rs, 'order')
277
+ return rs
278
+ },
279
+
280
+ users: function() {
281
+ let rs = get(this, `$store.state.users`)
282
+ rs = sortBy(rs, 'order')
283
+ return rs
284
+ },
285
+
286
+ kpHeaderBtns: function() {
287
+ let vo = this
288
+ let kp = {
289
+ // delete: {
290
+ // icon: mdiDeleteForever,
291
+ // tooltip: `${vo.$t('delete')}${vo.tableNameCht}`,
292
+ // evName: 'delete'
293
+ // },
294
+ toFullscreen: {
295
+ icon: mdiFullscreen,
296
+ tooltip: vo.$t('screenFull'),
297
+ evName: 'toFullscreen'
298
+ },
299
+ toNormalscreen: {
300
+ icon: mdiFullscreenExit,
301
+ tooltip: vo.$t('screenNormal'),
302
+ evName: 'toNormalscreen'
303
+ },
304
+ }
305
+ return kp
306
+ },
307
+
308
+ useHeaderBtns: function() {
309
+ let vo = this
310
+ let bts = []
311
+ if (true) {
312
+ let k = vo.fullscreen ? 'toNormalscreen' : 'toFullscreen'
313
+ bts = [
314
+ ...bts,
315
+ vo.kpHeaderBtns[k]
316
+ ]
317
+ }
318
+ // if (vo.useDelete) {
319
+ // let k = 'delete'
320
+ // bts = [
321
+ // ...bts,
322
+ // vo.kpHeaderBtns[k]
323
+ // ]
324
+ // }
325
+ return bts
326
+ },
327
+
328
+ contentHeight: function() {
329
+ let vo = this
330
+
331
+ //h
332
+ let h = vo.panelHeight - vo.headHeight
333
+ h = Math.max(h, 0)
334
+
335
+ return h
336
+ },
337
+
338
+ hasItemsCheck: function() {
339
+ let vo = this
340
+
341
+ //h
342
+ let b = vo.itemsCheck.length > 0
343
+
344
+ return b
345
+ },
346
+
347
+ },
348
+ methods: {
349
+
350
+ resizeDialog: function(msg) {
351
+ // console.log('methods resizeDialog', msg)
352
+
353
+ let vo = this
354
+
355
+ //panelWidth, panelHeight
356
+ vo.panelHeight = msg.contentHeightMax
357
+
358
+ },
359
+
360
+ resizeHead: function(msg) {
361
+ // console.log('methods resizeHead', msg)
362
+
363
+ let vo = this
364
+
365
+ //headHeight
366
+ vo.headHeight = msg.snew.offsetHeight
367
+
368
+ },
369
+
370
+ genOpt: function() {
371
+ // console.log('methods genOpt')
372
+
373
+ let vo = this
374
+
375
+ //default
376
+ vo.itemsCheck = []
377
+
378
+ //opt
379
+ let opt = null
380
+ if (size(vo.items) > 0) {
381
+
382
+ //ks
383
+ let ks = [
384
+ 'name',
385
+ 'mode',
386
+ 'enable',
387
+ ]
388
+ // console.log('ks', ks)
389
+
390
+ //kpHead
391
+ let kpHead = {
392
+ 'name': vo.$t('grupName'), //本對話框列出的是權限群組（items 由 vo.grups 產生）
393
+ 'mode': vo.$t('operGrupMode'),
394
+ 'enable': vo.$t('operEnable'),
395
+ }
396
+
397
+ //opt
398
+ opt = {
399
+ language: vo.$t('aggridLanguage'),
400
+ rows: vo.items,
401
+ keys: ks,
402
+ kpHead,
403
+ autoFitColumn: true,
404
+ defCellEditable: false, //vo.isEditable,
405
+ defHeadFilter: true,
406
+ defCellAlignH: 'left',
407
+ kpCellEditable: {
408
+ 'name': vo.isEditable,
409
+ 'mode': false,
410
+ 'enable': false,
411
+ },
412
+ kpHeadWidth: {
413
+ 'mode': 100,
414
+ 'enable': 100,
415
+ },
416
+ // kpRowDrag: {
417
+ // 'name': true,
418
+ // },
419
+ // kpHeadFilter: {
420
+ // 'enable': false,
421
+ // },
422
+ kpHeadFilterType: {
423
+ 'name': 'text',
424
+ 'mode': 'text',
425
+ 'enable': 'text',
426
+ },
427
+ kpHeadCheckBox: {
428
+ 'name': true,
429
+ },
430
+ rowsChange: (rs) => {
431
+ // console.log('rowsChange', rs)
432
+ // console.log('rowsChange cloneDeep(vo.opt.rows)', cloneDeep(vo.opt.rows))
433
+
434
+ //check
435
+ if (!vo.syncState || vo.firstLoading || vo.firstSetting) {
436
+ return
437
+ }
438
+
439
+ //isModified
440
+ vo.isModified = true
441
+
442
+ },
443
+ rowChecked: (rs) => {
444
+ // console.log('rowChecked', rs)
445
+ // console.log('rowChecked cloneDeep(vo.opt.rows)', cloneDeep(vo.opt.rows))
446
+
447
+ //save itemsCheck
448
+ vo.itemsCheck = cloneDeep(rs)
449
+
450
+ },
451
+ }
452
+ // console.log('opt', opt)
453
+
454
+ }
455
+
456
+ //save
457
+ vo.opt = opt
458
+
459
+ },
460
+
461
+ deleteItemsCheck: function() {
462
+ // console.log('method deleteItemsCheck')
463
+
464
+ let vo = this
465
+
466
+ //check
467
+ if (size(vo.itemsCheck) === 0) {
468
+ return
469
+ }
470
+
471
+ //cloneDeep
472
+ let rows = get(vo, 'opt.rows', [])
473
+
474
+ //cloneDeep
475
+ rows = cloneDeep(rows)
476
+
477
+ //filter
478
+ each(vo.itemsCheck, (v) => {
479
+ // console.log('v', v)
480
+ let name = get(v, 'data.name', '')
481
+ if (!isestr(name)) {
482
+ console.log(`invalid name`)
483
+ return true //跳出換下一個
484
+ }
485
+ rows = filter(rows, (vv) => {
486
+ return vv.name !== name
487
+ })
488
+ })
489
+
490
+ //clear
491
+ vo.itemsCheck = []
492
+
493
+ //save
494
+ vo.opt.rows = rows
495
+ // console.log('deleteItemsCheck cloneDeep(vo.opt.rows)', cloneDeep(vo.opt.rows))
496
+
497
+ //isModified
498
+ vo.isModified = true
499
+
500
+ },
501
+
502
+ refresh: function() {
503
+ let vo = this
504
+
505
+ //cmp
506
+ let cmp = get(vo, '$refs.rftable')
507
+ // console.log('cmp', cmp)
508
+
509
+ //refresh, 因set不會觸發ag-grid重繪, 故須另外調用組件函數refresh(內為redrawRows)重繪各列, 使cell-render slot內容更新(w-aggrid-vue 2.0.56起以cell-render slot取代opt.kpCellRender)
510
+ cmp.refresh()
511
+
512
+ },
513
+
514
+ getDisplayData: function() {
515
+ let vo = this
516
+
517
+ //cmp
518
+ let cmp = get(vo, '$refs.rftable')
519
+ // console.log('cmp', cmp)
520
+
521
+ //getDisplayData
522
+ let rows = cmp.getDisplayData()
523
+
524
+ return rows
525
+ },
526
+
527
+ showVeCgrupsToggleItemModeByName: function(name, mode) {
528
+ // console.log('showVeCgrupsToggleItemModeByName', name, mode)
529
+
530
+ let vo = this
531
+
532
+ //check
533
+ if (!isestr(name)) {
534
+ vo.$alert(`${vo.$t('cgrupEditNoName')}`, { type: 'error' })
535
+ return
536
+ }
537
+
538
+ //rows
539
+ let rows = get(vo, 'opt.rows', [])
540
+
541
+ //find
542
+ let r = null
543
+ let kr = null
544
+ each(rows, (v, k) => {
545
+ if (get(v, 'name', '') === name) {
546
+ r = v
547
+ kr = k
548
+ return false //跳出
549
+ }
550
+ })
551
+
552
+ //check
553
+ if (!iseobj(r)) {
554
+ vo.$alert(`${vo.$t('cgrupEditNoPemi')}`, { type: 'error' })
555
+ return
556
+ }
557
+
558
+ //mode
559
+ // let mode = th.value
560
+ // console.log('mode', mode)
561
+
562
+ //set
563
+ set(vo, `opt.rows[${kr}].mode`, mode)
564
+ // console.log('vo.opt.rows[kr]', cloneDeep(vo.opt.rows[kr]))
565
+
566
+ //refresh
567
+ vo.refresh()
568
+
569
+ //isModified
570
+ vo.isModified = true
571
+
572
+ },
573
+
574
+ showVeCgrupsToggleItemEnableByName: function(name) {
575
+ // console.log('showVeCgrupsToggleItemEnableByName', name)
576
+
577
+ let vo = this
578
+
579
+ //check
580
+ if (!isestr(name)) {
581
+ vo.$alert(`${vo.$t('cgrupEditNoName')}`, { type: 'error' })
582
+ return
583
+ }
584
+
585
+ //rows
586
+ let rows = get(vo, 'opt.rows', [])
587
+
588
+ //find
589
+ let r = null
590
+ let kr = null
591
+ each(rows, (v, k) => {
592
+ if (get(v, 'name', '') === name) {
593
+ r = v
594
+ kr = k
595
+ return false //跳出
596
+ }
597
+ })
598
+
599
+ //check
600
+ if (!iseobj(r)) {
601
+ vo.$alert(`${vo.$t('cgrupEditNoPemi')}`, { type: 'error' })
602
+ return
603
+ }
604
+
605
+ //enable
606
+ let _enable = get(r, 'enable', 'n')
607
+ let enable = _enable === 'y' ? 'n' : 'y'
608
+ // console.log('enable', enable)
609
+
610
+ //set
611
+ set(vo, `opt.rows[${kr}].enable`, enable)
612
+ // console.log('vo.opt.rows[kr]', cloneDeep(vo.opt.rows[kr]))
613
+
614
+ //refresh
615
+ vo.refresh()
616
+
617
+ //isModified
618
+ vo.isModified = true
619
+
620
+ },
621
+
622
+ showVeCgrupsToggleItemsEnableAllYes: function() {
623
+ // console.log('showVeCgrupsToggleItemsEnableAllYes')
624
+
625
+ let vo = this
626
+
627
+ //rows
628
+ let rows = get(vo, 'opt.rows', [])
629
+ // console.log('rows', rows)
630
+
631
+ //kpRow
632
+ let kpRow = {}
633
+ each(rows, (r, kr) => {
634
+ kpRow[r.name] = kr
635
+ })
636
+
637
+ //rowsEff
638
+ let rowsEff = vo.getDisplayData()
639
+ // console.log('rowsEff', rowsEff)
640
+
641
+ //toggle
642
+ each(rowsEff, (r) => {
643
+
644
+ //kr
645
+ let kr = kpRow[r.name]
646
+
647
+ //set
648
+ set(vo, `opt.rows[${kr}].enable`, 'y')
649
+ // console.log('vo.opt.rows[kr]', cloneDeep(vo.opt.rows[kr]))
650
+
651
+ })
652
+
653
+ //refresh
654
+ vo.refresh()
655
+
656
+ //isModified
657
+ vo.isModified = true
658
+
659
+ },
660
+
661
+ showVeCgrupsToggleItemsEnableAllNo: function() {
662
+ // console.log('showVeCgrupsToggleItemsEnableAllNo')
663
+
664
+ let vo = this
665
+
666
+ //rows
667
+ let rows = get(vo, 'opt.rows', [])
668
+ // console.log('rows', rows)
669
+
670
+ //kpRow
671
+ let kpRow = {}
672
+ each(rows, (r, kr) => {
673
+ kpRow[r.name] = kr
674
+ })
675
+
676
+ //rowsEff
677
+ let rowsEff = vo.getDisplayData()
678
+ // console.log('rowsEff', rowsEff)
679
+
680
+ //toggle
681
+ each(rowsEff, (r) => {
682
+
683
+ //kr
684
+ let kr = kpRow[r.name]
685
+
686
+ //set
687
+ set(vo, `opt.rows[${kr}].enable`, 'n')
688
+ // console.log('vo.opt.rows[kr]', cloneDeep(vo.opt.rows[kr]))
689
+
690
+ })
691
+
692
+ //refresh
693
+ vo.refresh()
694
+
695
+ //isModified
696
+ vo.isModified = true
697
+
698
+ },
699
+
700
+ showVeCgrupsToggleItemsEnableAllInv: function() {
701
+ // console.log('showVeCgrupsToggleItemsEnableAllInv')
702
+
703
+ let vo = this
704
+
705
+ //rows
706
+ let rows = get(vo, 'opt.rows', [])
707
+ // console.log('rows', rows)
708
+
709
+ //kpRow
710
+ let kpRow = {}
711
+ each(rows, (r, kr) => {
712
+ kpRow[r.name] = kr
713
+ })
714
+
715
+ //rowsEff
716
+ let rowsEff = vo.getDisplayData()
717
+ // console.log('rowsEff', rowsEff)
718
+
719
+ //toggle
720
+ each(rowsEff, (r) => {
721
+
722
+ //kr
723
+ let kr = kpRow[r.name]
724
+
725
+ //enable
726
+ let _enable = get(r, 'enable', 'n')
727
+ let enable = _enable === 'y' ? 'n' : 'y'
728
+
729
+ //set
730
+ set(vo, `opt.rows[${kr}].enable`, enable)
731
+ // console.log('vo.opt.rows[kr]', cloneDeep(vo.opt.rows[kr]))
732
+
733
+ })
734
+
735
+ //refresh
736
+ vo.refresh()
737
+
738
+ //isModified
739
+ vo.isModified = true
740
+
741
+ },
742
+
743
+ clickBtns: function(msg) {
744
+ // console.log('clickBtns', msg)
745
+
746
+ let vo = this
747
+
748
+ //evName
749
+ if (msg.evName === 'toFullscreen') {
750
+ vo.fullscreen = true
751
+ }
752
+ else if (msg.evName === 'toNormalscreen') {
753
+ vo.fullscreen = false
754
+ }
755
+
756
+ },
757
+
758
+ clickSave: function(msg) {
759
+ //console.log('methods clickSave', msg)
760
+
761
+ let vo = this
762
+
763
+ //save按鈕第一行立刻釋放視覺鎖
764
+ msg.pm.resolve()
765
+
766
+ //fire-and-forget, 不 await
767
+ vo.doSave()
768
+
769
+ },
770
+
771
+ doSave: function() {
772
+
773
+ let vo = this
774
+
775
+ async function core() {
776
+
777
+ //show loading
778
+ vo.$ui.updateLoading(true)
779
+
780
+ //delay
781
+ await delay(300)
782
+
783
+ //rows
784
+ let rows = get(vo, 'opt.rows', [])
785
+ // console.log('rows', rows)
786
+
787
+ //kpGrup
788
+ let kpGrup = {}
789
+ each(rows, (r) => {
790
+ let name = get(r, 'name', '')
791
+ let mode = get(r, 'mode', '')
792
+ let enable = get(r, 'enable', '')
793
+ if (!isestr(name)) {
794
+ console.log(`invalid name`)
795
+ return true //跳出換下一個
796
+ }
797
+ if (mode !== 'OR' && mode !== 'AND') {
798
+ console.log(`invalid mode[${mode}]`)
799
+ return true //跳出換下一個
800
+ }
801
+ if (!isestr(enable)) {
802
+ console.log(`invalid enable`)
803
+ return true //跳出換下一個
804
+ }
805
+ kpGrup[name] = {
806
+ mode,
807
+ isActive: enable,
808
+ }
809
+ })
810
+ // console.log('kpGrup', kpGrup)
811
+
812
+ //cgrups
813
+ let cgrups = JSON.stringify(kpGrup)
814
+ // console.log('cgrups', cgrups)
815
+
816
+ return cgrups
817
+ }
818
+
819
+ //core
820
+ core()
821
+ .then((rows) => {
822
+
823
+ //resolve
824
+ vo.pm.resolve(rows)
825
+
826
+ //hide
827
+ vo.bShow = false
828
+
829
+ })
830
+ .catch((err) => {
831
+ console.log('doSave', err)
832
+ vo.$alert(vo.$t('anUnexpectedErrorOccurred'), { type: 'error' }) //§5.1: 非預期例外須告知, 不靜默吞 (失敗時 .then 不執行→視窗不關)
833
+ })
834
+ .finally(() => {
835
+
836
+ //hide loading
837
+ vo.$ui.updateLoading(false)
838
+
839
+ })
840
+
841
+ },
842
+
843
+ clickClose: function() {
844
+ //console.log('methods clickClose')
845
+
846
+ let vo = this
847
+
848
+ //reject
849
+ vo.pm.reject('close window')
850
+
851
+ //hide
852
+ vo.bShow = false
853
+
854
+ },
855
+
856
+ show: function (msg) {
857
+ // console.log('methods show', msg)
858
+
859
+ let vo = this
860
+
861
+ //pm
862
+ vo.pm = genPm()
863
+
864
+ //default
865
+ vo.isModified = false
866
+
867
+ //isEditable, user
868
+ let isEditable = get(msg, 'isEditable', false)
869
+ let user = get(msg, 'user', {})
870
+
871
+ //cloneDeep
872
+ user = cloneDeep(user)
873
+
874
+ //cgrups
875
+ let cgrups = get(user, 'cgrups', '')
876
+ // console.log('cgrups', cgrups)
877
+
878
+ //kpGrup
879
+ let kpGrup = {}
880
+ if (isestr(cgrups)) {
881
+ try {
882
+ kpGrup = JSON5.parse(cgrups)
883
+ }
884
+ catch (err) {
885
+ console.log('cgrups', cgrups)
886
+ console.log('err', err)
887
+ }
888
+ }
889
+ // console.log('kpGrup', kpGrup)
890
+
891
+ //items
892
+ let items = map(vo.grups, (v) => {
893
+ // console.log('grups v', v)
894
+
895
+ //p
896
+ let p = get(kpGrup, v.name, null)
897
+ // console.log('p', p)
898
+
899
+ //name
900
+ let name = v.name
901
+ // console.log('name', name)
902
+
903
+ //mode
904
+ let mode = get(p, 'mode', '')
905
+ if (mode !== 'OR' && mode !== 'AND') {
906
+ mode = 'OR'
907
+ }
908
+ // console.log('mode', mode)
909
+
910
+ //enable
911
+ let _enable = get(p, 'isActive', '')
912
+ let enable = _enable === 'y' ? 'y' : 'n'
913
+ // console.log('isActive', enable)
914
+
915
+ //r
916
+ let r = {
917
+ name,
918
+ mode,
919
+ enable,
920
+ }
921
+ // console.log('r', r)
922
+
923
+ return r
924
+ })
925
+ // console.log('items', items)
926
+
927
+ //save
928
+ vo.isEditable = isEditable
929
+ vo.user = user
930
+ vo.items = items
931
+
932
+ //genOpt
933
+ vo.genOpt()
934
+
935
+ //firstLoading
936
+ vo.firstLoading = false
937
+
938
+ //bShow
939
+ vo.bShow = true
940
+
941
+ return vo.pm
942
+ },
943
+
944
+ }
945
+ }
946
+ </script>
947
+
948
+ <style scoped>
949
+ </style>