w-web-perm 1.0.83 → 1.0.85

package/w-web-perm/351/232/250/351/231/204/350/263/207/346/226/231/diff/src_components_VeGrupBlngUsers.vue.diff

@@ -0,0 +1,121 @@
+diff --git a/../rddmanager_2_perm/node_modules/w-web-perm/src/components/VeGrupBlngUsers.vue "b/./w-web-perm\351\232\250\351\231\204\350\263\207\346\226\231/src/components/VeGrupBlngUsers.vue"
+index 796f754..9fb6b7f 100644
+--- a/../rddmanager_2_perm/node_modules/w-web-perm/src/components/VeGrupBlngUsers.vue
++++ "b/./w-web-perm\351\232\250\351\231\204\350\263\207\346\226\231/src/components/VeGrupBlngUsers.vue"
+@@ -140,31 +140,15 @@
+                             :opt="opt"
+                         >
+                             <template v-slot:cell-render="props">
+-                                <template v-if="props.key==='grupsNames'">
+-                                    <span v-for="(item, idx) in props.row.grups" :key="idx" style="display:inline-block; line-height:20px; height:20px;">
+-                                        <div style="display:flex;">
+-                                            <div :style="'padding:0px 5px; border-top-left-radius:4px; border-bottom-left-radius:4px; ' + (item.enable === 'y' ? 'border-left:1px solid #ac2451; border-right:1px solid #9e2149; border-top:1px solid #ac2451; border-bottom:1px solid #ac2451; background:#be295a; color:#fff;' : 'border-left:1px solid #aaaaaa; border-right:1px solid #aaaaaa; border-top:1px solid #aaaaaa; border-bottom:1px solid #aaaaaa; background:#ffffff; color:#555;')">
+-                                                {{ item.mode }}
+-                                            </div>
+-                                            <div :style="'padding:0px 5px; border-top-right-radius:4px; border-bottom-right-radius:4px; ' + (item.enable === 'y' ? '_border-left:1px solid #ac2451; border-right:1px solid #ac2451; border-top:1px solid #ac2451; border-bottom:1px solid #ac2451; background:#d22f64; color:#fff;' : '_border-left:1px solid #aaaaaa; border-right:1px solid #aaaaaa; border-top:1px solid #aaaaaa; border-bottom:1px solid #aaaaaa; background:#eeeeee; color:#555;')">
+-                                                {{ item.name }}
+-                                            </div>
+-                                        </div>
+-                                    </span>
+-                                </template>
+-                                <WTextSelect
+-                                    v-else-if="props.key==='mode'"
+-                                    :style="`width:${modeSelectWidth}px;`"
+-                                    :items="modeItems"
+-                                    :value="props.row.mode"
++                                <RelationChips
++                                    v-if="props.key==='grupsNames'"
++                                    :items="props.row.grups"
+                                     :editable="isEditable"
+-                                    :paddingStyle="{v:0,h:10}"
+-                                    :shadow="false"
+-                                    :itemPaddingStyle="{v:8,h:10}"
+-                                    :placementDistX="-10"
++                                    :popupTitle="$t('belongGrupsNames')"
++                                    :tooltipAll="$t('chipsShowAll')"
+                                     :labelContent="'modeSelect'"
+                                     @input="(item)=>{showVeGrupBlngUsersToggleItemModeByName(props.row.name, item)}"
+-                                ></WTextSelect>
++                                ></RelationChips>
+                                 <input v-else-if="props.key==='enable'" type="checkbox" :checked="props.value === 'y'" @click="showVeGrupBlngUsersToggleItemEnableByName(props.row.name)" :disabled="!isEditable" />
+                                 <span v-else>{{ props.value }}</span>
+                             </template>
+@@ -207,7 +191,7 @@ import isestr from 'wsemi/src/isestr.mjs'
+ import WDialog from 'w-component-vue/src/components/WDialog.vue'
+ import WButtonCircle from 'w-component-vue/src/components/WButtonCircle.vue'
+ import WAggridVue from 'w-aggrid-vue/src/components/WAggridVue.vue'
+-import WTextSelect from 'w-component-vue/src/components/WTextSelect.vue'
++import RelationChips from './RelationChips.vue'
+ 
+ 
+ export default {
+@@ -215,7 +199,7 @@ export default {
+         WDialog,
+         WButtonCircle,
+         WAggridVue,
+-        WTextSelect,
++        RelationChips,
+     },
+     props: {
+     },
+@@ -244,10 +228,6 @@ export default {
+             isEditable: false,
+             isModified: false,
+ 
+-            //mode 欄之自製下拉(WTextSelect, 取代原生 select 以免彈出清單之 highlight 色由 OS 決定)
+-            modeItems: ['OR', 'AND'],
+-            modeSelectWidth: 72, //= 最長項 'AND' 文字實寬 + 左右內距 10×2 + 展開箭頭 18 + 邊框 1×2, 實測後定值(見 CLAUDE_experience.md)
+-
+             grup: null,
+ 
+             items: [],
+@@ -414,21 +394,19 @@ export default {
+             let opt = null
+             if (size(vo.items) > 0) {
+ 
+-                //ks
++                //ks, 本列自己可改的(是否使用)在左, 由其他權限群組帶來的(所屬權限群組名稱)在右; 合併模式併入 grupsNames 欄之本項 chip(RelationChips), 不再獨立成欄
+                 let ks = [
+                     'name',
+-                    'grupsNames',
+-                    'mode',
+                     'enable',
++                    'grupsNames',
+                 ]
+                 // console.log('ks', ks)
+ 
+                 //kpHead
+                 let kpHead = {
+                     'name': vo.$t('userName'),
+-                    'grupsNames': vo.$t('belongGrupsNames'),
+-                    'mode': vo.$t('operGrupMode'),
+                     'enable': vo.$t('operEnable'),
++                    'grupsNames': vo.$t('belongGrupsNames'),
+                 }
+ 
+                 //opt
+@@ -447,7 +425,6 @@ export default {
+                         'enable': false,
+                     },
+                     kpHeadWidth: {
+-                        'mode': 100,
+                         'enable': 100,
+                     },
+                     // kpRowDrag: {
+@@ -459,14 +436,14 @@ export default {
+                     kpHeadFilterType: {
+                         'name': 'text',
+                         'grupsNames': 'text',
+-                        'mode': 'text',
+                         'enable': 'text',
+                     },
+                     // kpHeadCheckBox: {
+                     //     'name': true,
+                     // },
+-                    kpHeadFocusHighlight: { //雖然效果不完全, 但因按鈕與cell有padding可被點擊, 故還是需要開啟
++                    kpHeadFocusHighlight: { //儲存格內已有自己的控制項(chip 下拉、勾選框), 不再疊儲存格焦點框
+                         'grupsNames': false,
++                        'enable': false,
+                     },
+                     rowsChange: (rs) => {
+                         // console.log('rowsChange', rs)

package/w-web-perm/351/232/250/351/231/204/350/263/207/346/226/231/diff/src_components_VePemiBlngGrups.vue.diff

@@ -0,0 +1,121 @@
+diff --git a/../rddmanager_2_perm/node_modules/w-web-perm/src/components/VePemiBlngGrups.vue "b/./w-web-perm\351\232\250\351\231\204\350\263\207\346\226\231/src/components/VePemiBlngGrups.vue"
+index 9c5a143..d2f585b 100644
+--- a/../rddmanager_2_perm/node_modules/w-web-perm/src/components/VePemiBlngGrups.vue
++++ "b/./w-web-perm\351\232\250\351\231\204\350\263\207\346\226\231/src/components/VePemiBlngGrups.vue"
+@@ -140,31 +140,15 @@
+                             :opt="opt"
+                         >
+                             <template v-slot:cell-render="props">
+-                                <template v-if="props.key==='pemisNames'">
+-                                    <span v-for="(item, idx) in props.row.pemis" :key="idx" style="display:inline-block; line-height:20px; height:20px;">
+-                                        <div style="display:flex;">
+-                                            <div :style="'padding:0px 5px; border-top-left-radius:4px; border-bottom-left-radius:4px; ' + (item.enable === 'y' ? 'border-left:1px solid #ac2451; border-right:1px solid #9e2149; border-top:1px solid #ac2451; border-bottom:1px solid #ac2451; background:#be295a; color:#fff;' : 'border-left:1px solid #aaaaaa; border-right:1px solid #aaaaaa; border-top:1px solid #aaaaaa; border-bottom:1px solid #aaaaaa; background:#ffffff; color:#555;')">
+-                                                {{ item.mode }}
+-                                            </div>
+-                                            <div :style="'padding:0px 5px; border-top-right-radius:4px; border-bottom-right-radius:4px; ' + (item.enable === 'y' ? '_border-left:1px solid #ac2451; border-right:1px solid #ac2451; border-top:1px solid #ac2451; border-bottom:1px solid #ac2451; background:#d22f64; color:#fff;' : '_border-left:1px solid #aaaaaa; border-right:1px solid #aaaaaa; border-top:1px solid #aaaaaa; border-bottom:1px solid #aaaaaa; background:#eeeeee; color:#555;')">
+-                                                {{ item.name }}
+-                                            </div>
+-                                        </div>
+-                                    </span>
+-                                </template>
+-                                <WTextSelect
+-                                    v-else-if="props.key==='mode'"
+-                                    :style="`width:${modeSelectWidth}px;`"
+-                                    :items="modeItems"
+-                                    :value="props.row.mode"
++                                <RelationChips
++                                    v-if="props.key==='pemisNames'"
++                                    :items="props.row.pemis"
+                                     :editable="isEditable"
+-                                    :paddingStyle="{v:0,h:10}"
+-                                    :shadow="false"
+-                                    :itemPaddingStyle="{v:8,h:10}"
+-                                    :placementDistX="-10"
++                                    :popupTitle="$t('belongPemisNames')"
++                                    :tooltipAll="$t('chipsShowAll')"
+                                     :labelContent="'modeSelect'"
+                                     @input="(item)=>{showVePemiBlngGrupsToggleItemModeByName(props.row.name, item)}"
+-                                ></WTextSelect>
++                                ></RelationChips>
+                                 <input v-else-if="props.key==='enable'" type="checkbox" :checked="props.value === 'y'" @click="showVePemiBlngGrupsToggleItemEnableByName(props.row.name)" :disabled="!isEditable" />
+                                 <span v-else>{{ props.value }}</span>
+                             </template>
+@@ -207,7 +191,7 @@ import isestr from 'wsemi/src/isestr.mjs'
+ import WDialog from 'w-component-vue/src/components/WDialog.vue'
+ import WButtonCircle from 'w-component-vue/src/components/WButtonCircle.vue'
+ import WAggridVue from 'w-aggrid-vue/src/components/WAggridVue.vue'
+-import WTextSelect from 'w-component-vue/src/components/WTextSelect.vue'
++import RelationChips from './RelationChips.vue'
+ 
+ 
+ export default {
+@@ -215,7 +199,7 @@ export default {
+         WDialog,
+         WButtonCircle,
+         WAggridVue,
+-        WTextSelect,
++        RelationChips,
+     },
+     props: {
+     },
+@@ -244,10 +228,6 @@ export default {
+             isEditable: false,
+             isModified: false,
+ 
+-            //mode 欄之自製下拉(WTextSelect, 取代原生 select 以免彈出清單之 highlight 色由 OS 決定)
+-            modeItems: ['OR', 'AND'],
+-            modeSelectWidth: 72, //= 最長項 'AND' 文字實寬 + 左右內距 10×2 + 展開箭頭 18 + 邊框 1×2, 實測後定值(見 CLAUDE_experience.md)
+-
+             pemi: null,
+ 
+             items: [],
+@@ -414,21 +394,19 @@ export default {
+             let opt = null
+             if (size(vo.items) > 0) {
+ 
+-                //ks
++                //ks, 本列自己可改的(是否使用)在左, 由其他權限帶來的(所屬權限名稱)在右; 合併模式併入 pemisNames 欄之本項 chip(RelationChips), 不再獨立成欄
+                 let ks = [
+                     'name',
+-                    'pemisNames',
+-                    'mode',
+                     'enable',
++                    'pemisNames',
+                 ]
+                 // console.log('ks', ks)
+ 
+                 //kpHead
+                 let kpHead = {
+                     'name': vo.$t('grupName'),
+-                    'pemisNames': vo.$t('belongPemisNames'),
+-                    'mode': vo.$t('operPemiMode'),
+                     'enable': vo.$t('operEnable'),
++                    'pemisNames': vo.$t('belongPemisNames'),
+                 }
+ 
+                 //opt
+@@ -447,7 +425,6 @@ export default {
+                         'enable': false,
+                     },
+                     kpHeadWidth: {
+-                        'mode': 100,
+                         'enable': 100,
+                     },
+                     // kpRowDrag: {
+@@ -459,14 +436,14 @@ export default {
+                     kpHeadFilterType: {
+                         'name': 'text',
+                         'pemisNames': 'text',
+-                        'mode': 'text',
+                         'enable': 'text',
+                     },
+                     // kpHeadCheckBox: {
+                     //     'name': true,
+                     // },
+-                    kpHeadFocusHighlight: { //雖然效果不完全, 但因按鈕與cell有padding可被點擊, 故還是需要開啟
++                    kpHeadFocusHighlight: { //儲存格內已有自己的控制項(chip 下拉、勾選框), 不再疊儲存格焦點框
+                         'pemisNames': false,
++                        'enable': false,
+                     },
+                     rowsChange: (rs) => {
+                         // console.log('rowsChange', rs)