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

Refactor #5071

Browse source
This commit is contained in:
mertsincan 2024-01-14 13:38:51 +00:00
parent c06c73e285
commit bd5b3f7c6a
22 changed files with 258 additions and 463 deletions
Download patch file Download diff file Expand all files Collapse all files

47
components/lib/treetable/BodyCell.vue
View file

@ -11,15 +11,21 @@
<component v-else :is="node.collapsedIcon ? 'span' : 'ChevronRightIcon'" :class="cx('rowTogglerIcon')" v-bind="getColumnPT('rowTogglerIcon')" />
</template>
</button>
<div v-if="checkboxSelectionMode && columnProp('expander')" :class="cx('checkboxWrapper')" @click="toggleCheckbox" v-bind="getColumnCheckboxPT('checkboxWrapper')">
<div class="p-hidden-accessible" v-bind="getColumnPT('hiddenInputWrapper')" :data-p-hidden-accessible="true">
<input type="checkbox" @focus="onCheckboxFocus" @blur="onCheckboxBlur" tabindex="-1" v-bind="getColumnPT('hiddenInput')" />
</div>
<div ref="checkboxEl" :class="cx('checkbox')" v-bind="getColumnCheckboxPT('checkbox')">
<component v-if="templates['checkboxicon']" :is="templates['checkboxicon']" :checked="checked" :partialChecked="partialChecked" :class="cx('checkboxicon')" />
<component v-else :is="checked ? 'CheckIcon' : partialChecked ? 'MinusIcon' : null" :class="cx('checkboxicon')" v-bind="getColumnCheckboxPT('checkboxIcon')" />
</div>
</div>
<Checkbox
v-if="checkboxSelectionMode && columnProp('expander')"
:modelValue="checked"
:binary="true"
:class="cx('rowCheckbox')"
@change="toggleCheckbox"
:pt="getColumnCheckboxPT('rowCheckbox')"
:data-p-checked="checked"
:data-p-partialchecked="partialChecked"
>
<template #icon="slotProps">
<component v-if="templates['checkboxicon']" :is="templates['checkboxicon']" :checked="slotProps.checked" :partialChecked="partialChecked" :class="slotProps.class" />
<component v-else :is="checked ? 'CheckIcon' : partialChecked ? 'MinusIcon' : null" :class="slotProps.class" v-bind="getColumnCheckboxPT('rowCheckbox.icon')" />
</template>
</Checkbox>
<component v-if="column.children && column.children.body" :is="column.children.body" :node="node" :column="column" />
<template v-else>
<span v-bind="getColumnPT('bodyCellContent')">{{ resolveFieldData(node.data, columnProp('field')) }}</span>
@ -29,6 +35,7 @@
<script>
import BaseComponent from 'primevue/basecomponent';
import Checkbox from 'primevue/checkbox';
import CheckIcon from 'primevue/icons/check';
import ChevronDownIcon from 'primevue/icons/chevrondown';
import ChevronRightIcon from 'primevue/icons/chevronright';
@ -95,8 +102,7 @@ export default {
},
data() {
return {
styleObject: {},
checkboxFocused: false
styleObject: {}
};
},
mounted() {
@ -126,7 +132,6 @@ export default {
},
context: {
index: this.index,
focused: this.checkboxFocused,
selectable: this.$parentInstance.rowHover || this.$parentInstance.rowSelectionMode,
selected: this.$parent.selected,
frozen: this.columnProp('frozen'),
@ -152,7 +157,6 @@ export default {
},
context: {
checked: this.checked,
focused: this.checkboxFocused,
partialChecked: this.partialChecked
}
};
@ -189,12 +193,6 @@ export default {
},
toggleCheckbox() {
this.$emit('checkbox-toggle');
},
onCheckboxFocus() {
this.checkboxFocused = true;
},
onCheckboxBlur() {
this.checkboxFocused = false;
}
},
computed: {
@ -218,11 +216,12 @@ export default {
}
},
components: {
ChevronRightIcon: ChevronRightIcon,
ChevronDownIcon: ChevronDownIcon,
CheckIcon: CheckIcon,
MinusIcon: MinusIcon,
SpinnerIcon: SpinnerIcon
Checkbox,
ChevronRightIcon,
ChevronDownIcon,
CheckIcon,
MinusIcon,
SpinnerIcon
},
directives: {
ripple: Ripple