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

Fixed #4886 - Tree / TreeTable: new loadingMode property

Browse source
This commit is contained in:
tugcekucukoglu 2023-11-28 11:46:39 +03:00
parent 098c7a5128
commit b2ad40adcc
10 changed files with 61 additions and 14 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -1,9 +1,15 @@
<template>
<td :style="containerStyle" :class="containerClass" role="cell" v-bind="{ ...getColumnPT('root'), ...getColumnPT('bodyCell') }" :data-p-frozen-column="columnProp('frozen')">
<button v-if="columnProp('expander')" v-ripple type="button" :class="cx('rowToggler')" @click="toggle" :style="togglerStyle" tabindex="-1" v-bind="getColumnPT('rowToggler')" data-pc-group-section="rowactionbutton">
<component v-if="column.children && column.children.rowtogglericon" :is="column.children && column.children.rowtogglericon" :node="node" :expanded="expanded" :class="cx('rowTogglerIcon')" />
<component v-else-if="expanded" :is="node.expandedIcon ? 'span' : 'ChevronDownIcon'" :class="cx('rowTogglerIcon')" v-bind="getColumnPT('rowTogglerIcon')" />
<component v-else :is="node.collapsedIcon ? 'span' : 'ChevronRightIcon'" :class="cx('rowTogglerIcon')" v-bind="getColumnPT('rowTogglerIcon')" />
<template v-if="node.loading && loadingMode === 'icon'">
<component v-if="templates['nodetogglericon']" :is="templates['nodetogglericon']" :class="cx('nodetogglericon')" />
<SpinnerIcon v-else spin :class="cx('nodetogglericon')" v-bind="ptm('nodetogglericon')" />
</template>
<template v-else>
<component v-if="column.children && column.children.rowtogglericon" :is="column.children && column.children.rowtogglericon" :node="node" :expanded="expanded" :class="cx('rowTogglerIcon')" />
<component v-else-if="expanded" :is="node.expandedIcon ? 'span' : 'ChevronDownIcon'" :class="cx('rowTogglerIcon')" v-bind="getColumnPT('rowTogglerIcon')" />
<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">
@ -28,6 +34,7 @@ import ChevronDownIcon from 'primevue/icons/chevrondown';
import ChevronRightIcon from 'primevue/icons/chevronright';
import MinusIcon from 'primevue/icons/minus';
import Ripple from 'primevue/ripple';
import SpinnerIcon from 'primevue/icons/spinner';
import { DomHandler, ObjectUtils } from 'primevue/utils';
import { mergeProps } from 'vue';
@ -80,6 +87,10 @@ export default {
index: {
type: Number,
default: null
},
loadingMode: {
type: String,
default: 'mask'
}
},
data() {
@ -208,7 +219,8 @@ export default {
ChevronRightIcon: ChevronRightIcon,
ChevronDownIcon: ChevronDownIcon,
CheckIcon: CheckIcon,
MinusIcon: MinusIcon
MinusIcon: MinusIcon,
SpinnerIcon: SpinnerIcon
},
directives: {
ripple: Ripple