w-web-perm 1.0.44 → 1.0.46

package/src/components/VeCgrups.vue

@@ -116,13 +116,22 @@
                 </div>
 
                 <template v-if="items">
-                    <WAggridVueDyn
+                    <WAggridVue
                         ref="rftable"
                         :style="`width:100%;`"
                         :height="contentHeight"
                         :opt="opt"
                     >
-                    </WAggridVueDyn>
+                        <template v-slot:cell-render="props">
+                            <span v-if="props.key==='name'">{{ props.value }}</span>
+                            <select v-else-if="props.key==='mode'" @change="showVeCgrupsToggleItemModeByName(props.row.name, $event.target.value)" :disabled="!isEditable">
+                                <option value="OR" :selected="props.row.mode === 'OR'">OR</option>
+                                <option value="AND" :selected="props.row.mode === 'AND'">AND</option>
+                            </select>
+                            <input v-else-if="props.key==='enable'" type="checkbox" :checked="props.value === 'y'" @click="showVeCgrupsToggleItemEnableByName(props.row.name)" :disabled="!isEditable" />
+                            <span v-else>{{ props.value }}</span>
+                        </template>
+                    </WAggridVue>
                 </template>
 
                 <div
@@ -155,14 +164,14 @@ import iseobj from 'wsemi/src/iseobj.mjs'
 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 WAggridVueDyn from 'w-component-vue/src/components/WAggridVueDyn.vue'
+import WAggridVue from 'w-aggrid-vue/src/components/WAggridVue.vue'
 
 
 export default {
     components: {
         WDialog,
         WButtonCircle,
-        WAggridVueDyn,
+        WAggridVue,
     },
     props: {
     },
@@ -380,46 +389,6 @@ export default {
                     // kpHeadCheckBox: {
                     //     'name': true,
                     // },
-                    kpCellRender: {
-                        'name': (v, k, r) => {
-                            // console.log('kpCellRender name', v)
-
-                            return v
-                        },
-                        'mode': (v, k, r) => {
-                            // console.log('kpCellRender mode', v)
-
-                            //name
-                            let name = get(r, 'name', '')
-                            // console.log('name', name, k, r)
-
-                            //mode
-                            let mode = get(r, 'mode', '')
-                            // console.log('mode', mode, k, r)
-
-                            let t = `
-                                <select onchange="$vo.$dg.showVeCgrupsToggleItemModeByName('${name}',this.value)" ${vo.isEditable ? '' : 'disabled'}>
-                                    <option value="OR" ${mode === 'OR' ? 'selected' : ''}>OR</option>
-                                    <option value="AND" ${mode === 'AND' ? 'selected' : ''}>AND</option>
-                                </select>
-                            `
-
-                            return t
-                        },
-                        'enable': (v, k, r) => {
-                            // console.log('kpCellRender enable', v, k, r)
-
-                            //name
-                            let name = get(r, 'name', '')
-                            // console.log('name', name, k, r)
-
-                            let t = `
-                                <input type="checkbox" ${v === 'y' ? 'checked' : ''} onclick="$vo.$dg.showVeCgrupsToggleItemEnableByName('${name}')" ${vo.isEditable ? '' : 'disabled'} />
-                            `
-
-                            return t
-                        },
-                    },
                     rowsChange: (rs) => {
                         // console.log('rowsChange', rs)
                         // console.log('rowsChange cloneDeep(vo.opt.rows)', cloneDeep(vo.opt.rows))
@@ -491,7 +460,7 @@ export default {
             let vo = this
 
             //cmp
-            let cmp = get(vo, '$refs.rftable.$refs.$self')
+            let cmp = get(vo, '$refs.rftable')
             // console.log('cmp', cmp)
 
             //refresh, 因set不會觸發kpCellRender, 故須另外調用組件函數refresh, 進而觸發kpCellRender, 使能更新數據
@@ -503,7 +472,7 @@ export default {
             let vo = this
 
             //cmp
-            let cmp = get(vo, '$refs.rftable.$refs.$self')
+            let cmp = get(vo, '$refs.rftable')
             // console.log('cmp', cmp)
 
             //getDisplayData

package/src/components/VeCpemis.vue

@@ -116,13 +116,22 @@
                 </div>
 
                 <template v-if="items">
-                    <WAggridVueDyn
+                    <WAggridVue
                         ref="rftable"
                         :style="`width:100%;`"
                         :height="contentHeight"
                         :opt="opt"
                     >
-                    </WAggridVueDyn>
+                        <template v-slot:cell-render="props">
+                            <span v-if="props.key==='name'">{{ props.value }}</span>
+                            <select v-else-if="props.key==='mode'" @change="showVeCpemisToggleItemModeByName(props.row.name, $event.target.value)" :disabled="!isEditable">
+                                <option value="OR" :selected="props.row.mode === 'OR'">OR</option>
+                                <option value="AND" :selected="props.row.mode === 'AND'">AND</option>
+                            </select>
+                            <input v-else-if="props.key==='enable'" type="checkbox" :checked="props.value === 'y'" @click="showVeCpemisToggleItemEnableByName(props.row.name)" :disabled="!isEditable" />
+                            <span v-else>{{ props.value }}</span>
+                        </template>
+                    </WAggridVue>
                 </template>
 
                 <div
@@ -155,14 +164,14 @@ import iseobj from 'wsemi/src/iseobj.mjs'
 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 WAggridVueDyn from 'w-component-vue/src/components/WAggridVueDyn.vue'
+import WAggridVue from 'w-aggrid-vue/src/components/WAggridVue.vue'
 
 
 export default {
     components: {
         WDialog,
         WButtonCircle,
-        WAggridVueDyn,
+        WAggridVue,
     },
     props: {
     },
@@ -380,46 +389,6 @@ export default {
                     // kpHeadCheckBox: {
                     //     'name': true,
                     // },
-                    kpCellRender: {
-                        'name': (v, k, r) => {
-                            // console.log('kpCellRender name', v)
-
-                            return v
-                        },
-                        'mode': (v, k, r) => {
-                            // console.log('kpCellRender mode', v)
-
-                            //name
-                            let name = get(r, 'name', '')
-                            // console.log('name', name, k, r)
-
-                            //mode
-                            let mode = get(r, 'mode', '')
-                            // console.log('mode', mode, k, r)
-
-                            let t = `
-                                <select onchange="$vo.$dg.showVeCpemisToggleItemModeByName('${name}',this.value)" ${vo.isEditable ? '' : 'disabled'}>
-                                    <option value="OR" ${mode === 'OR' ? 'selected' : ''}>OR</option>
-                                    <option value="AND" ${mode === 'AND' ? 'selected' : ''}>AND</option>
-                                </select>
-                            `
-
-                            return t
-                        },
-                        'enable': (v, k, r) => {
-                            // console.log('kpCellRender enable', v, k, r)
-
-                            //name
-                            let name = get(r, 'name', '')
-                            // console.log('name', name, k, r)
-
-                            let t = `
-                                <input type="checkbox" ${v === 'y' ? 'checked' : ''} onclick="$vo.$dg.showVeCpemisToggleItemEnableByName('${name}')" ${vo.isEditable ? '' : 'disabled'} />
-                            `
-
-                            return t
-                        },
-                    },
                     rowsChange: (rs) => {
                         // console.log('rowsChange', rs)
                         // console.log('rowsChange cloneDeep(vo.opt.rows)', cloneDeep(vo.opt.rows))
@@ -491,7 +460,7 @@ export default {
             let vo = this
 
             //cmp
-            let cmp = get(vo, '$refs.rftable.$refs.$self')
+            let cmp = get(vo, '$refs.rftable')
             // console.log('cmp', cmp)
 
             //refresh, 因set不會觸發kpCellRender, 故須另外調用組件函數refresh, 進而觸發kpCellRender, 使能更新數據
@@ -503,7 +472,7 @@ export default {
             let vo = this
 
             //cmp
-            let cmp = get(vo, '$refs.rftable.$refs.$self')
+            let cmp = get(vo, '$refs.rftable')
             // console.log('cmp', cmp)
 
             //getDisplayData

package/src/components/VeCrules.vue

@@ -116,13 +116,18 @@
                 </div>
 
                 <template v-if="items">
-                    <WAggridVueDyn
+                    <WAggridVue
                         ref="rftable"
                         :style="`width:100%;`"
                         :height="contentHeight"
                         :opt="opt"
                     >
-                    </WAggridVueDyn>
+                        <template v-slot:cell-render="props">
+                            <span v-if="props.key==='id'">{{ props.value }}</span>
+                            <input v-else-if="props.key==='enable'" type="checkbox" :checked="props.value === 'y'" @click="toggleItemEnableById(props.row.id)" :disabled="!isEditable" />
+                            <span v-else>{{ props.value }}</span>
+                        </template>
+                    </WAggridVue>
                 </template>
 
                 <div
@@ -155,14 +160,14 @@ import iseobj from 'wsemi/src/iseobj.mjs'
 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 WAggridVueDyn from 'w-component-vue/src/components/WAggridVueDyn.vue'
+import WAggridVue from 'w-aggrid-vue/src/components/WAggridVue.vue'
 
 
 export default {
     components: {
         WDialog,
         WButtonCircle,
-        WAggridVueDyn,
+        WAggridVue,
     },
     props: {
     },
@@ -374,26 +379,6 @@ export default {
                     // kpHeadCheckBox: {
                     //     'id': true,
                     // },
-                    kpCellRender: {
-                        'id': (v, k, r) => {
-                            // console.log('kpCellRender id', v)
-
-                            return v
-                        },
-                        'enable': (v, k, r) => {
-                            // console.log('kpCellRender enable', v, k, r)
-
-                            //id
-                            let id = get(r, 'id', '')
-                            // console.log('id', id, k, r)
-
-                            let t = `
-                                <input type="checkbox" ${v === 'y' ? 'checked' : ''} onclick="$vo.$dg.toggleItemEnableById('${id}')" ${vo.isEditable ? '' : 'disabled'} />
-                            `
-
-                            return t
-                        },
-                    },
                     rowsChange: (rs) => {
                         // console.log('rowsChange', rs)
                         // console.log('rowsChange cloneDeep(vo.opt.rows)', cloneDeep(vo.opt.rows))
@@ -465,7 +450,7 @@ export default {
             let vo = this
 
             //cmp
-            let cmp = get(vo, '$refs.rftable.$refs.$self')
+            let cmp = get(vo, '$refs.rftable')
             // console.log('cmp', cmp)
 
             //refresh, 因set不會觸發kpCellRender, 故須另外調用組件函數refresh, 進而觸發kpCellRender, 使能更新數據
@@ -477,7 +462,7 @@ export default {
             let vo = this
 
             //cmp
-            let cmp = get(vo, '$refs.rftable.$refs.$self')
+            let cmp = get(vo, '$refs.rftable')
             // console.log('cmp', cmp)
 
             //getDisplayData

package/src/components/VeGrupBlngUsers.vue

@@ -129,13 +129,33 @@
                 </div>
 
                 <template v-if="items">
-                    <WAggridVueDyn
+                    <WAggridVue
                         ref="rftable"
                         :style="`width:100%;`"
                         :height="contentHeight"
                         :opt="opt"
                     >
-                    </WAggridVueDyn>
+                        <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>
+                            <select v-else-if="props.key==='mode'" @change="showVeGrupBlngUsersToggleItemModeByName(props.row.name, $event.target.value)" :disabled="!isEditable">
+                                <option value="OR" :selected="props.row.mode === 'OR'">OR</option>
+                                <option value="AND" :selected="props.row.mode === 'AND'">AND</option>
+                            </select>
+                            <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>
+                    </WAggridVue>
                 </template>
 
                 <div
@@ -171,14 +191,14 @@ import iseobj from 'wsemi/src/iseobj.mjs'
 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 WAggridVueDyn from 'w-component-vue/src/components/WAggridVueDyn.vue'
+import WAggridVue from 'w-aggrid-vue/src/components/WAggridVue.vue'
 
 
 export default {
     components: {
         WDialog,
         WButtonCircle,
-        WAggridVueDyn,
+        WAggridVue,
     },
     props: {
     },
@@ -410,72 +430,6 @@ export default {
                     kpHeadFocusHighlight: { //雖然效果不完全, 但因按鈕與cell有padding可被點擊, 故還是需要開啟
                         'grupsNames': false,
                     },
-                    kpCellRender: {
-                        'grupsNames': (v, k, r) => {
-                            // console.log('kpCellRender grupsNames', v, k, r)
-
-                            let csp = `border-top-left-radius:4px; border-bottom-left-radius:4px;`
-                            let csnp = `border-left:1px solid #aaaaaa; border-right:1px solid #aaaaaa; border-top:1px solid #aaaaaa; border-bottom:1px solid #aaaaaa; background:#ffffff; color:#555;`
-                            let csep = `border-left:1px solid #ac2451; border-right:1px solid #9e2149; border-top:1px solid #ac2451; border-bottom:1px solid #ac2451; background:#be295a; color:#fff;`
-
-                            let csa = `border-top-right-radius:4px; border-bottom-right-radius:4px;`
-                            let csna = `_border-left:1px solid #aaaaaa; border-right:1px solid #aaaaaa; border-top:1px solid #aaaaaa; border-bottom:1px solid #aaaaaa; background:#eeeeee; color:#555;`
-                            let csea = `_border-left:1px solid #ac2451; border-right:1px solid #ac2451; border-top:1px solid #ac2451; border-bottom:1px solid #ac2451; background:#d22f64; color:#fff;`
-
-                            let vs = r.grups
-
-                            let t = ''
-                            each(vs, (v) => {
-                                t += `
-                                    <span style="display:inline-block; line-height:20px; height:20px;">
-                                        <div style="display:flex;">
-                                            <div style="padding:0px 5px; ${csp} ${v.enable === 'y' ? csep : csnp}">
-                                                ${v.mode}
-                                            </div>
-                                            <div style="padding:0px 5px; ${csa} ${v.enable === 'y' ? csea : csna}">
-                                                ${v.name}
-                                            </div>
-                                        </div>
-                                    </span>
-                                `
-                            })
-
-                            return t
-                        },
-                        'mode': (v, k, r) => {
-                            // console.log('kpCellRender mode', v)
-
-                            //name
-                            let name = get(r, 'name', '')
-                            // console.log('name', name, k, r)
-
-                            //mode
-                            let mode = get(r, 'mode', '')
-                            // console.log('mode', mode, k, r)
-
-                            let t = `
-                                <select onchange="$vo.$dg.showVeGrupBlngUsersToggleItemModeByName('${name}',this.value)" ${vo.isEditable ? '' : 'disabled'}>
-                                    <option value="OR" ${mode === 'OR' ? 'selected' : ''}>OR</option>
-                                    <option value="AND" ${mode === 'AND' ? 'selected' : ''}>AND</option>
-                                </select>
-                            `
-
-                            return t
-                        },
-                        'enable': (v, k, r) => {
-                            // console.log('kpCellRender enable', v, k, r)
-
-                            //name
-                            let name = get(r, 'name', '')
-                            // console.log('name', name, k, r)
-
-                            let t = `
-                                <input type="checkbox" ${v === 'y' ? 'checked' : ''} onclick="$vo.$dg.showVeGrupBlngUsersToggleItemEnableByName('${name}')" ${vo.isEditable ? '' : 'disabled'} />
-                            `
-
-                            return t
-                        },
-                    },
                     rowsChange: (rs) => {
                         // console.log('rowsChange', rs)
                         // console.log('rowsChange cloneDeep(vo.opt.rows)', cloneDeep(vo.opt.rows))
@@ -547,7 +501,7 @@ export default {
             let vo = this
 
             //cmp
-            let cmp = get(vo, '$refs.rftable.$refs.$self')
+            let cmp = get(vo, '$refs.rftable')
             // console.log('cmp', cmp)
 
             //refresh, 因set不會觸發kpCellRender, 故須另外調用組件函數refresh, 進而觸發kpCellRender, 使能更新數據
@@ -559,7 +513,7 @@ export default {
             let vo = this
 
             //cmp
-            let cmp = get(vo, '$refs.rftable.$refs.$self')
+            let cmp = get(vo, '$refs.rftable')
             // console.log('cmp', cmp)
 
             //getDisplayData

package/src/components/VePemiBlngGrups.vue

@@ -129,13 +129,33 @@
                 </div>
 
                 <template v-if="items">
-                    <WAggridVueDyn
+                    <WAggridVue
                         ref="rftable"
                         :style="`width:100%;`"
                         :height="contentHeight"
                         :opt="opt"
                     >
-                    </WAggridVueDyn>
+                        <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>
+                            <select v-else-if="props.key==='mode'" @change="showVePemiBlngGrupsToggleItemModeByName(props.row.name, $event.target.value)" :disabled="!isEditable">
+                                <option value="OR" :selected="props.row.mode === 'OR'">OR</option>
+                                <option value="AND" :selected="props.row.mode === 'AND'">AND</option>
+                            </select>
+                            <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>
+                    </WAggridVue>
                 </template>
 
                 <div
@@ -171,14 +191,14 @@ import iseobj from 'wsemi/src/iseobj.mjs'
 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 WAggridVueDyn from 'w-component-vue/src/components/WAggridVueDyn.vue'
+import WAggridVue from 'w-aggrid-vue/src/components/WAggridVue.vue'
 
 
 export default {
     components: {
         WDialog,
         WButtonCircle,
-        WAggridVueDyn,
+        WAggridVue,
     },
     props: {
     },
@@ -410,72 +430,6 @@ export default {
                     kpHeadFocusHighlight: { //雖然效果不完全, 但因按鈕與cell有padding可被點擊, 故還是需要開啟
                         'pemisNames': false,
                     },
-                    kpCellRender: {
-                        'pemisNames': (v, k, r) => {
-                            // console.log('kpCellRender pemisNames', v, k, r)
-
-                            let csp = `border-top-left-radius:4px; border-bottom-left-radius:4px;`
-                            let csnp = `border-left:1px solid #aaaaaa; border-right:1px solid #aaaaaa; border-top:1px solid #aaaaaa; border-bottom:1px solid #aaaaaa; background:#ffffff; color:#555;`
-                            let csep = `border-left:1px solid #ac2451; border-right:1px solid #9e2149; border-top:1px solid #ac2451; border-bottom:1px solid #ac2451; background:#be295a; color:#fff;`
-
-                            let csa = `border-top-right-radius:4px; border-bottom-right-radius:4px;`
-                            let csna = `_border-left:1px solid #aaaaaa; border-right:1px solid #aaaaaa; border-top:1px solid #aaaaaa; border-bottom:1px solid #aaaaaa; background:#eeeeee; color:#555;`
-                            let csea = `_border-left:1px solid #ac2451; border-right:1px solid #ac2451; border-top:1px solid #ac2451; border-bottom:1px solid #ac2451; background:#d22f64; color:#fff;`
-
-                            let vs = r.pemis
-
-                            let t = ''
-                            each(vs, (v) => {
-                                t += `
-                                    <span style="display:inline-block; line-height:20px; height:20px;">
-                                        <div style="display:flex;">
-                                            <div style="padding:0px 5px; ${csp} ${v.enable === 'y' ? csep : csnp}">
-                                                ${v.mode}
-                                            </div>
-                                            <div style="padding:0px 5px; ${csa} ${v.enable === 'y' ? csea : csna}">
-                                                ${v.name}
-                                            </div>
-                                        </div>
-                                    </span>
-                                `
-                            })
-
-                            return t
-                        },
-                        'mode': (v, k, r) => {
-                            // console.log('kpCellRender mode', v)
-
-                            //name
-                            let name = get(r, 'name', '')
-                            // console.log('name', name, k, r)
-
-                            //mode
-                            let mode = get(r, 'mode', '')
-                            // console.log('mode', mode, k, r)
-
-                            let t = `
-                                <select onchange="$vo.$dg.showVePemiBlngGrupsToggleItemModeByName('${name}',this.value)" ${vo.isEditable ? '' : 'disabled'}>
-                                    <option value="OR" ${mode === 'OR' ? 'selected' : ''}>OR</option>
-                                    <option value="AND" ${mode === 'AND' ? 'selected' : ''}>AND</option>
-                                </select>
-                            `
-
-                            return t
-                        },
-                        'enable': (v, k, r) => {
-                            // console.log('kpCellRender enable', v, k, r)
-
-                            //name
-                            let name = get(r, 'name', '')
-                            // console.log('name', name, k, r)
-
-                            let t = `
-                                <input type="checkbox" ${v === 'y' ? 'checked' : ''} onclick="$vo.$dg.showVePemiBlngGrupsToggleItemEnableByName('${name}')" ${vo.isEditable ? '' : 'disabled'} />
-                            `
-
-                            return t
-                        },
-                    },
                     rowsChange: (rs) => {
                         // console.log('rowsChange', rs)
                         // console.log('rowsChange cloneDeep(vo.opt.rows)', cloneDeep(vo.opt.rows))
@@ -547,7 +501,7 @@ export default {
             let vo = this
 
             //cmp
-            let cmp = get(vo, '$refs.rftable.$refs.$self')
+            let cmp = get(vo, '$refs.rftable')
             // console.log('cmp', cmp)
 
             //refresh, 因set不會觸發kpCellRender, 故須另外調用組件函數refresh, 進而觸發kpCellRender, 使能更新數據
@@ -559,7 +513,7 @@ export default {
             let vo = this
 
             //cmp
-            let cmp = get(vo, '$refs.rftable.$refs.$self')
+            let cmp = get(vo, '$refs.rftable')
             // console.log('cmp', cmp)
 
             //getDisplayData