vertumnus/primevue-mirror
1
0
Fork 0
mirror of https://github.com/primefaces/primevue.git synced 2025-05-09 17:02:38 +00:00
Code Issues Projects Releases Packages Wiki Activity

Refactor #3965 - Refactor on DataTable Column index context

Browse source
This commit is contained in:
Tuğçe Küçükoğlu 2023-06-05 16:45:43 +03:00
parent 6cbe5735b8
commit 9cb888b6a0
6 changed files with 66 additions and 55 deletions
Download patch file Download diff file Expand all files Collapse all files

3
components/lib/datatable/BodyCell.vue
View file

@ -30,7 +30,7 @@
/> />
<component v-else-if="column.children && column.children.body && !column.children.editor && d_editing" :is="column.children.body" :data="editingRowData" :column="column" :field="field" :index="rowIndex" :frozenRow="frozenRow" /> <component v-else-if="column.children && column.children.body && !column.children.editor && d_editing" :is="column.children.body" :data="editingRowData" :column="column" :field="field" :index="rowIndex" :frozenRow="frozenRow" />
<template v-else-if="columnProp('selectionMode')"> <template v-else-if="columnProp('selectionMode')">
<DTRadioButton v-if="columnProp('selectionMode') === 'single'" :value="rowData" :name="name" :checked="selected" @change="toggleRowWithRadio($event, rowIndex)" :column="column" :unstyled="unstyled" :pt="pt" /> <DTRadioButton v-if="columnProp('selectionMode') === 'single'" :value="rowData" :name="name" :checked="selected" @change="toggleRowWithRadio($event, rowIndex)" :column="column" :index="index" :unstyled="unstyled" :pt="pt" />
<DTCheckbox <DTCheckbox
v-else-if="columnProp('selectionMode') === 'multiple'" v-else-if="columnProp('selectionMode') === 'multiple'"
:value="rowData" :value="rowData"
@ -39,6 +39,7 @@
:aria-selected="selected ? true : undefined" :aria-selected="selected ? true : undefined"
@change="toggleRowWithCheckbox($event, rowIndex)" @change="toggleRowWithCheckbox($event, rowIndex)"
:column="column" :column="column"
:index="index"
:unstyled="unstyled" :unstyled="unstyled"
:pt="pt" :pt="pt"
/> />

50
components/lib/datatable/ColumnFilter.vue
View file

@ -1,6 +1,6 @@
<template> <template>
<div :class="cx('columnFilter')" v-bind="getColumnPTOptions('columnFilter')"> <div :class="cx('columnFilter')" v-bind="getColumnPT('columnFilter')">
<div v-if="display === 'row'" :class="cx('filterInput')" v-bind="{ ...filterInputProps, ...getColumnPTOptions('filterInput') }"> <div v-if="display === 'row'" :class="cx('filterInput')" v-bind="{ ...filterInputProps, ...getColumnPT('filterInput') }">
<component :is="filterElement" :field="field" :filterModel="filters[field]" :filterCallback="filterCallback" /> <component :is="filterElement" :field="field" :filterModel="filters[field]" :filterCallback="filterCallback" />
</div> </div>
<button <button
@ -14,12 +14,12 @@
:class="cx('filterMenuButton')" :class="cx('filterMenuButton')"
@click="toggleMenu($event)" @click="toggleMenu($event)"
@keydown="onToggleButtonKeyDown($event)" @keydown="onToggleButtonKeyDown($event)"
v-bind="getColumnPTOptions('filterMenuButton')" v-bind="getColumnPT('filterMenuButton')"
> >
<component :is="filterIconTemplate || 'FilterIcon'" /> <component :is="filterIconTemplate || 'FilterIcon'" />
</button> </button>
<button v-if="showClearButton && display === 'row'" :class="cx('headerFilterClearButton')" type="button" @click="clearFilter()" v-bind="getColumnPTOptions('headerFilterClearButton')"> <button v-if="showClearButton && display === 'row'" :class="cx('headerFilterClearButton')" type="button" @click="clearFilter()" v-bind="getColumnPT('headerFilterClearButton')">
<component :is="filterClearIconTemplate || 'FilterSlashIcon'" v-bind="getColumnPTOptions('filterClearIcon')" /> <component :is="filterClearIconTemplate || 'FilterSlashIcon'" v-bind="getColumnPT('filterClearIcon')" />
</button> </button>
<Portal> <Portal>
<transition name="p-connected-overlay" @enter="onOverlayEnter" @leave="onOverlayLeave" @after-leave="onOverlayAfterLeave"> <transition name="p-connected-overlay" @enter="onOverlayEnter" @leave="onOverlayLeave" @after-leave="onOverlayAfterLeave">
@ -34,11 +34,11 @@
@keydown.escape="hide" @keydown.escape="hide"
@click="onContentClick" @click="onContentClick"
@mousedown="onContentMouseDown" @mousedown="onContentMouseDown"
v-bind="getColumnPTOptions('filterOverlay')" v-bind="getColumnPT('filterOverlay')"
> >
<component :is="filterHeaderTemplate" :field="field" :filterModel="filters[field]" :filterCallback="filterCallback" /> <component :is="filterHeaderTemplate" :field="field" :filterModel="filters[field]" :filterCallback="filterCallback" />
<template v-if="display === 'row'"> <template v-if="display === 'row'">
<ul :class="cx('filterRowItems')" v-bind="getColumnPTOptions('filterRowItems')"> <ul :class="cx('filterRowItems')" v-bind="getColumnPT('filterRowItems')">
<li <li
v-for="(matchMode, i) of matchModes" v-for="(matchMode, i) of matchModes"
:key="matchMode.label" :key="matchMode.label"
@ -47,18 +47,18 @@
@keydown="onRowMatchModeKeyDown($event)" @keydown="onRowMatchModeKeyDown($event)"
@keydown.enter.prevent="onRowMatchModeChange(matchMode.value)" @keydown.enter.prevent="onRowMatchModeChange(matchMode.value)"
:tabindex="i === 0 ? '0' : null" :tabindex="i === 0 ? '0' : null"
v-bind="getColumnPTOptions('filterRowItem')" v-bind="getColumnPT('filterRowItem')"
> >
{{ matchMode.label }} {{ matchMode.label }}
</li> </li>
<li :class="cx('filterSeparator')" v-bind="getColumnPTOptions('filterSeparator')"></li> <li :class="cx('filterSeparator')" v-bind="getColumnPT('filterSeparator')"></li>
<li :class="cx('filterRowItem')" @click="clearFilter()" @keydown="onRowMatchModeKeyDown($event)" @keydown.enter="onRowClearItemClick()" v-bind="getColumnPTOptions('filterRowItem')"> <li :class="cx('filterRowItem')" @click="clearFilter()" @keydown="onRowMatchModeKeyDown($event)" @keydown.enter="onRowClearItemClick()" v-bind="getColumnPT('filterRowItem')">
{{ noFilterLabel }} {{ noFilterLabel }}
</li> </li>
</ul> </ul>
</template> </template>
<template v-else> <template v-else>
<div v-if="isShowOperator" :class="cx('filterOperator')" v-bind="getColumnPTOptions('filterOperator')"> <div v-if="isShowOperator" :class="cx('filterOperator')" v-bind="getColumnPT('filterOperator')">
<CFDropdown <CFDropdown
:options="operatorOptions" :options="operatorOptions"
:modelValue="operator" :modelValue="operator"
@ -68,12 +68,12 @@
optionValue="value" optionValue="value"
@update:modelValue="onOperatorChange($event)" @update:modelValue="onOperatorChange($event)"
:unstyled="unstyled" :unstyled="unstyled"
:pt="getColumnPTOptions('filterOperatorDropdown')" :pt="getColumnPT('filterOperatorDropdown')"
data-pc-section="filteroperatordropdown" data-pc-section="filteroperatordropdown"
></CFDropdown> ></CFDropdown>
</div> </div>
<div :class="cx('filterConstraints')" v-bind="getColumnPTOptions('filterConstraints')"> <div :class="cx('filterConstraints')" v-bind="getColumnPT('filterConstraints')">
<div v-for="(fieldConstraint, i) of fieldConstraints" :key="i" :class="cx('filterConstraint')" v-bind="getColumnPTOptions('filterConstraint')"> <div v-for="(fieldConstraint, i) of fieldConstraints" :key="i" :class="cx('filterConstraint')" v-bind="getColumnPT('filterConstraint')">
<CFDropdown <CFDropdown
v-if="isShowMatchModes" v-if="isShowMatchModes"
:options="matchModes" :options="matchModes"
@ -84,11 +84,11 @@
:aria-label="filterConstraintAriaLabel" :aria-label="filterConstraintAriaLabel"
@update:modelValue="onMenuMatchModeChange($event, i)" @update:modelValue="onMenuMatchModeChange($event, i)"
:unstyled="unstyled" :unstyled="unstyled"
:pt="getColumnPTOptions('filterMatchModeDropdown')" :pt="getColumnPT('filterMatchModeDropdown')"
data-pc-section="filtermatchmodedropdown" data-pc-section="filtermatchmodedropdown"
></CFDropdown> ></CFDropdown>
<component v-if="display === 'menu'" :is="filterElement" :field="field" :filterModel="fieldConstraint" :filterCallback="filterCallback" /> <component v-if="display === 'menu'" :is="filterElement" :field="field" :filterModel="fieldConstraint" :filterCallback="filterCallback" />
<div v-bind="getColumnPTOptions('filterRemove')"> <div v-bind="getColumnPT('filterRemove')">
<CFButton <CFButton
v-if="showRemoveIcon" v-if="showRemoveIcon"
type="button" type="button"
@ -96,17 +96,17 @@
@click="removeConstraint(i)" @click="removeConstraint(i)"
:label="removeRuleButtonLabel" :label="removeRuleButtonLabel"
:unstyled="unstyled" :unstyled="unstyled"
:pt="getColumnPTOptions('filterRemoveButton')" :pt="getColumnPT('filterRemoveButton')"
data-pc-section="filterremovebutton" data-pc-section="filterremovebutton"
> >
<template #icon="iconProps"> <template #icon="iconProps">
<component :is="filterRemoveIconTemplate || 'TrashIcon'" :class="iconProps.class" v-bind="getColumnPTOptions('filterRemoveButton')['icon']" /> <component :is="filterRemoveIconTemplate || 'TrashIcon'" :class="iconProps.class" v-bind="getColumnPT('filterRemoveButton')['icon']" />
</template> </template>
</CFButton> </CFButton>
</div> </div>
</div> </div>
</div> </div>
<div v-if="isShowAddConstraint" :class="cx('filterAddRule')" v-bind="getColumnPTOptions('filterAddRule')"> <div v-if="isShowAddConstraint" :class="cx('filterAddRule')" v-bind="getColumnPT('filterAddRule')">
<CFButton <CFButton
type="button" type="button"
:label="addRuleButtonLabel" :label="addRuleButtonLabel"
@ -114,15 +114,15 @@
:class="cx('filterAddRuleButton')" :class="cx('filterAddRuleButton')"
@click="addConstraint()" @click="addConstraint()"
:unstyled="unstyled" :unstyled="unstyled"
:pt="getColumnPTOptions('filterAddRuleButton')" :pt="getColumnPT('filterAddRuleButton')"
data-pc-section="filteraddrulebutton" data-pc-section="filteraddrulebutton"
> >
<template #icon="iconProps"> <template #icon="iconProps">
<component :is="filterAddIconTemplate || 'PlusIcon'" :class="iconProps.class" v-bind="getColumnPTOptions('filterAddRuleButton')['icon']" /> <component :is="filterAddIconTemplate || 'PlusIcon'" :class="iconProps.class" v-bind="getColumnPT('filterAddRuleButton')['icon']" />
</template> </template>
</CFButton> </CFButton>
</div> </div>
<div :class="cx('filterButtonbar')" v-bind="getColumnPTOptions('filterButtonbar')"> <div :class="cx('filterButtonbar')" v-bind="getColumnPT('filterButtonbar')">
<CFButton <CFButton
v-if="!filterClearTemplate && showClearButton" v-if="!filterClearTemplate && showClearButton"
type="button" type="button"
@ -130,7 +130,7 @@
:label="clearButtonLabel" :label="clearButtonLabel"
@click="clearFilter" @click="clearFilter"
:unstyled="unstyled" :unstyled="unstyled"
:pt="getColumnPTOptions('filterClearButton')" :pt="getColumnPT('filterClearButton')"
data-pc-section="filterclearbutton" data-pc-section="filterclearbutton"
></CFButton> ></CFButton>
<component v-else :is="filterClearTemplate" :field="field" :filterModel="filters[field]" :filterCallback="clearFilter" /> <component v-else :is="filterClearTemplate" :field="field" :filterModel="filters[field]" :filterCallback="clearFilter" />
@ -142,7 +142,7 @@
:label="applyButtonLabel" :label="applyButtonLabel"
@click="applyFilter()" @click="applyFilter()"
:unstyled="unstyled" :unstyled="unstyled"
:pt="getColumnPTOptions('filterApplyButton')" :pt="getColumnPT('filterApplyButton')"
data-pc-section="filterapplybutton" data-pc-section="filterapplybutton"
></CFButton> ></CFButton>
<component v-else :is="filterApplyTemplate" :field="field" :filterModel="filters[field]" :filterCallback="applyFilter" /> <component v-else :is="filterApplyTemplate" :field="field" :filterModel="filters[field]" :filterCallback="applyFilter" />
@ -315,7 +315,7 @@ export default {
} }
}, },
methods: { methods: {
getColumnPTOptions(key) { getColumnPT(key) {
return this.ptmo(this.getColumnProp(), key, { return this.ptmo(this.getColumnProp(), key, {
props: this.column.props, props: this.column.props,
parent: { parent: {

12
components/lib/datatable/HeaderCheckbox.vue
View file

@ -1,6 +1,6 @@
<template> <template>
<div :class="cx('headerCheckboxWrapper')" @click="onClick" @keydown.space.prevent="onClick" v-bind="getColumnPTOptions('headerCheckboxWrapper')"> <div :class="cx('headerCheckboxWrapper')" @click="onClick" @keydown.space.prevent="onClick" v-bind="getColumnPT('headerCheckboxWrapper')">
<div :class="cx('hiddenHeaderInputWrapper')" :style="sx('hiddenAccessible', isUnstyled)" v-bind="getColumnPTOptions('hiddenHeaderInputWrapper')" :data-p-hidden-accessible="true"> <div :class="cx('hiddenHeaderInputWrapper')" :style="sx('hiddenAccessible', isUnstyled)" v-bind="getColumnPT('hiddenHeaderInputWrapper')" :data-p-hidden-accessible="true">
<input <input
ref="input" ref="input"
type="checkbox" type="checkbox"
@ -10,12 +10,12 @@
:aria-label="headerCheckboxAriaLabel" :aria-label="headerCheckboxAriaLabel"
@focus="onFocus($event)" @focus="onFocus($event)"
@blur="onBlur($event)" @blur="onBlur($event)"
v-bind="getColumnPTOptions('hiddenHeaderInput')" v-bind="getColumnPT('hiddenHeaderInput')"
/> />
</div> </div>
<div ref="box" :class="cx('headerCheckbox')" v-bind="getColumnPTOptions('headerCheckbox')"> <div ref="box" :class="cx('headerCheckbox')" v-bind="getColumnPT('headerCheckbox')">
<component v-if="headerCheckboxIconTemplate" :is="headerCheckboxIconTemplate" :checked="checked" :class="cx('headerCheckboxIcon')" /> <component v-if="headerCheckboxIconTemplate" :is="headerCheckboxIconTemplate" :checked="checked" :class="cx('headerCheckboxIcon')" />
<CheckIcon v-else-if="!headerCheckboxIconTemplate && !!checked" :class="cx('headerCheckboxIcon')" v-bind="getColumnPTOptions('headerCheckboxIcon')" /> <CheckIcon v-else-if="!headerCheckboxIconTemplate && !!checked" :class="cx('headerCheckboxIcon')" v-bind="getColumnPT('headerCheckboxIcon')" />
</div> </div>
</div> </div>
</template> </template>
@ -44,7 +44,7 @@ export default {
}; };
}, },
methods: { methods: {
getColumnPTOptions(key) { getColumnPT(key) {
return this.ptmo(this.getColumnProp(), key, { return this.ptmo(this.getColumnProp(), key, {
props: this.column.props, props: this.column.props,
parent: { parent: {

17
components/lib/datatable/RowCheckbox.vue
View file

@ -1,6 +1,6 @@
<template> <template>
<div :class="cx('checkboxWrapper')" @click="onClick" v-bind="getColumnPTOptions('checkboxWrapper')"> <div :class="cx('checkboxWrapper')" @click="onClick" v-bind="getColumnPT('checkboxWrapper')">
<div :class="cx('hiddenInputWrapper')" :style="sx('hiddenAccessible', isUnstyled)" v-bind="getColumnPTOptions('hiddenInputWrapper')" :data-p-hidden-accessible="true"> <div :class="cx('hiddenInputWrapper')" :style="sx('hiddenAccessible', isUnstyled)" v-bind="getColumnPT('hiddenInputWrapper')" :data-p-hidden-accessible="true">
<input <input
ref="input" ref="input"
type="checkbox" type="checkbox"
@ -11,12 +11,12 @@
@focus="onFocus($event)" @focus="onFocus($event)"
@blur="onBlur($event)" @blur="onBlur($event)"
@keydown="onKeydown" @keydown="onKeydown"
v-bind="getColumnPTOptions('hiddenInput')" v-bind="getColumnPT('hiddenInput')"
/> />
</div> </div>
<div ref="box" :class="cx('checkbox')" v-bind="getColumnPTOptions('checkbox')"> <div ref="box" :class="cx('checkbox')" v-bind="getColumnPT('checkbox')">
<component v-if="rowCheckboxIconTemplate" :is="rowCheckboxIconTemplate" :checked="checked" :class="cx('checkboxIcon')" /> <component v-if="rowCheckboxIconTemplate" :is="rowCheckboxIconTemplate" :checked="checked" :class="cx('checkboxIcon')" />
<CheckIcon v-else-if="!rowCheckboxIconTemplate && !!checked" :class="cx('checkboxIcon')" v-bind="getColumnPTOptions('checkboxIcon')" /> <CheckIcon v-else-if="!rowCheckboxIconTemplate && !!checked" :class="cx('checkboxIcon')" v-bind="getColumnPT('checkboxIcon')" />
</div> </div>
</div> </div>
</template> </template>
@ -37,6 +37,10 @@ export default {
rowCheckboxIconTemplate: { rowCheckboxIconTemplate: {
type: Function, type: Function,
default: null default: null
},
index: {
type: Number,
default: null
} }
}, },
data() { data() {
@ -45,7 +49,7 @@ export default {
}; };
}, },
methods: { methods: {
getColumnPTOptions(key) { getColumnPT(key) {
return this.ptmo(this.getColumnProp(), key, { return this.ptmo(this.getColumnProp(), key, {
props: this.column.props, props: this.column.props,
parent: { parent: {
@ -53,6 +57,7 @@ export default {
state: this.$data state: this.$data
}, },
context: { context: {
index: this.index,
checked: this.checked, checked: this.checked,
focused: this.focused, focused: this.focused,
disabled: this.$attrs.disabled disabled: this.$attrs.disabled

19
components/lib/datatable/RowRadioButton.vue
View file

@ -1,10 +1,10 @@
<template> <template>
<div :class="cx('radiobuttonWrapper')" @click="onClick" v-bind="getColumnPTOptions('radiobuttonWrapper')"> <div :class="cx('radiobuttonWrapper')" @click="onClick" v-bind="getColumnPT('radiobuttonWrapper')">
<div :class="cx('hiddenInputWrapper')" :style="sx('hiddenAccessible', isUnstyled)" v-bind="getColumnPTOptions('hiddenInputWrapper')" :data-p-hidden-accessible="true"> <div :class="cx('hiddenInputWrapper')" :style="sx('hiddenAccessible', isUnstyled)" v-bind="getColumnPT('hiddenInputWrapper')" :data-p-hidden-accessible="true">
<input ref="input" type="radio" :checked="checked" :disabled="$attrs.disabled" :name="name" tabindex="0" @focus="onFocus($event)" @blur="onBlur($event)" @keydown.space.prevent="onClick" v-bind="getColumnPTOptions('hiddenInput')" /> <input ref="input" type="radio" :checked="checked" :disabled="$attrs.disabled" :name="name" tabindex="0" @focus="onFocus($event)" @blur="onBlur($event)" @keydown.space.prevent="onClick" v-bind="getColumnPT('hiddenInput')" />
</div> </div>
<div ref="box" :class="cx('radiobutton')" v-bind="getColumnPTOptions('radiobutton')"> <div ref="box" :class="cx('radiobutton')" v-bind="getColumnPT('radiobutton')">
<div :class="cx('radiobuttonIcon')" v-bind="getColumnPTOptions('radiobuttonIcon')"></div> <div :class="cx('radiobuttonIcon')" v-bind="getColumnPT('radiobuttonIcon')"></div>
</div> </div>
</div> </div>
</template> </template>
@ -22,7 +22,11 @@ export default {
value: null, value: null,
checked: null, checked: null,
name: null, name: null,
column: null column: null,
index: {
type: Number,
default: null
}
}, },
data() { data() {
return { return {
@ -30,7 +34,7 @@ export default {
}; };
}, },
methods: { methods: {
getColumnPTOptions(key) { getColumnPT(key) {
return this.ptmo(this.getColumnProp(), key, { return this.ptmo(this.getColumnProp(), key, {
props: this.column.props, props: this.column.props,
parent: { parent: {
@ -38,6 +42,7 @@ export default {
state: this.$data state: this.$data
}, },
context: { context: {
index: this.index,
checked: this.checked, checked: this.checked,
focused: this.focused, focused: this.focused,
disabled: this.$attrs.disabled disabled: this.$attrs.disabled

20
components/lib/datatable/TableBody.vue
View file

@ -10,14 +10,14 @@
role="row" role="row"
v-bind="ptm('rowgroupHeader')" v-bind="ptm('rowgroupHeader')"
> >
<td :colspan="columnsLength - 1" v-bind="{ ...getColumnPTOptions('root'), ...getColumnPTOptions('bodyCell') }"> <td :colspan="columnsLength - 1" v-bind="{ ...getColumnPT('root'), ...getColumnPT('bodyCell') }">
<button v-if="expandableRowGroups" :class="cx('rowGroupToggler')" @click="onRowGroupToggle($event, rowData)" type="button" v-bind="getColumnPTOptions('rowGroupToggler')"> <button v-if="expandableRowGroups" :class="cx('rowGroupToggler')" @click="onRowGroupToggle($event, rowData)" type="button" v-bind="getColumnPT('rowGroupToggler')">
<component v-if="templates['rowgrouptogglericon']" :is="templates['rowgrouptogglericon']" :expanded="isRowGroupExpanded(rowData)" /> <component v-if="templates['rowgrouptogglericon']" :is="templates['rowgrouptogglericon']" :expanded="isRowGroupExpanded(rowData)" />
<template v-else> <template v-else>
<span v-if="isRowGroupExpanded(rowData) && expandedRowIcon" :class="[cx('rowGroupTogglerIcon'), expandedRowIcon]" v-bind="getColumnPTOptions('rowGroupTogglerIcon')" /> <span v-if="isRowGroupExpanded(rowData) && expandedRowIcon" :class="[cx('rowGroupTogglerIcon'), expandedRowIcon]" v-bind="getColumnPT('rowGroupTogglerIcon')" />
<ChevronDownIcon v-else-if="isRowGroupExpanded(rowData) && !expandedRowIcon" :class="cx('rowGroupTogglerIcon')" v-bind="getColumnPTOptions('rowGroupTogglerIcon')" /> <ChevronDownIcon v-else-if="isRowGroupExpanded(rowData) && !expandedRowIcon" :class="cx('rowGroupTogglerIcon')" v-bind="getColumnPT('rowGroupTogglerIcon')" />
<span v-else-if="!isRowGroupExpanded(rowData) && collapsedRowIcon" :class="[cx('rowGroupTogglerIcon'), collapsedRowIcon]" v-bind="getColumnPTOptions('rowGroupTogglerIcon')" /> <span v-else-if="!isRowGroupExpanded(rowData) && collapsedRowIcon" :class="[cx('rowGroupTogglerIcon'), collapsedRowIcon]" v-bind="getColumnPT('rowGroupTogglerIcon')" />
<ChevronRightIcon v-else-if="!isRowGroupExpanded(rowData) && !collapsedRowIcon" :class="cx('rowGroupTogglerIcon')" v-bind="getColumnPTOptions('rowGroupTogglerIcon')" /> <ChevronRightIcon v-else-if="!isRowGroupExpanded(rowData) && !collapsedRowIcon" :class="cx('rowGroupTogglerIcon')" v-bind="getColumnPT('rowGroupTogglerIcon')" />
</template> </template>
</button> </button>
<component :is="templates['groupheader']" :data="rowData" :index="getRowIndex(index)" /> <component :is="templates['groupheader']" :data="rowData" :index="getRowIndex(index)" />
@ -91,7 +91,7 @@
role="row" role="row"
v-bind="ptm('rowExpansion')" v-bind="ptm('rowExpansion')"
> >
<td :colspan="columnsLength" v-bind="{ ...getColumnPTOptions('root'), ...getColumnPTOptions('bodyCell') }"> <td :colspan="columnsLength" v-bind="{ ...getColumnPT('root'), ...getColumnPT('bodyCell') }">
<component :is="templates['expansion']" :data="rowData" :index="getRowIndex(index)" /> <component :is="templates['expansion']" :data="rowData" :index="getRowIndex(index)" />
</td> </td>
</tr> </tr>
@ -102,14 +102,14 @@
role="row" role="row"
v-bind="ptm('rowgroupFooter')" v-bind="ptm('rowgroupFooter')"
> >
<td :colspan="columnsLength - 1" v-bind="{ ...getColumnPTOptions('root'), ...getColumnPTOptions('bodyCell') }"> <td :colspan="columnsLength - 1" v-bind="{ ...getColumnPT('root'), ...getColumnPT('bodyCell') }">
<component :is="templates['groupfooter']" :data="rowData" :index="getRowIndex(index)" /> <component :is="templates['groupfooter']" :data="rowData" :index="getRowIndex(index)" />
</td> </td>
</tr> </tr>
</template> </template>
</template> </template>
<tr v-else :class="cx('emptyMessage')" role="row" v-bind="ptm('emptyMessage')"> <tr v-else :class="cx('emptyMessage')" role="row" v-bind="ptm('emptyMessage')">
<td :colspan="columnsLength" v-bind="{ ...getColumnPTOptions('root'), ...getColumnPTOptions('bodyCell') }"> <td :colspan="columnsLength" v-bind="{ ...getColumnPT('root'), ...getColumnPT('bodyCell') }">
<component v-if="templates.empty" :is="templates.empty" /> <component v-if="templates.empty" :is="templates.empty" />
</td> </td>
</tr> </tr>
@ -305,7 +305,7 @@ export default {
columnProp(col, prop) { columnProp(col, prop) {
return ObjectUtils.getVNodeProp(col, prop); return ObjectUtils.getVNodeProp(col, prop);
}, },
getColumnPTOptions(column, key) { getColumnPT(column, key) {
return this.ptmo(this.getColumnProp(column), key, { return this.ptmo(this.getColumnProp(column), key, {
props: column.props, props: column.props,
parent: { parent: {