VDataTableRows.mjs 4.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133
  1. import { mergeProps as _mergeProps, resolveDirective as _resolveDirective, Fragment as _Fragment, createVNode as _createVNode } from "vue";
  2. // Components
  3. import { VDataTableGroupHeaderRow } from "./VDataTableGroupHeaderRow.mjs";
  4. import { VDataTableRow } from "./VDataTableRow.mjs"; // Composables
  5. import { useExpanded } from "./composables/expand.mjs";
  6. import { useGroupBy } from "./composables/group.mjs";
  7. import { useHeaders } from "./composables/headers.mjs";
  8. import { useSelection } from "./composables/select.mjs";
  9. import { makeDisplayProps, useDisplay } from "../../composables/display.mjs";
  10. import { useLocale } from "../../composables/locale.mjs"; // Utilities
  11. import { Fragment, mergeProps } from 'vue';
  12. import { genericComponent, getPrefixedEventHandlers, propsFactory, useRender } from "../../util/index.mjs"; // Types
  13. export const makeVDataTableRowsProps = propsFactory({
  14. loading: [Boolean, String],
  15. loadingText: {
  16. type: String,
  17. default: '$vuetify.dataIterator.loadingText'
  18. },
  19. hideNoData: Boolean,
  20. items: {
  21. type: Array,
  22. default: () => []
  23. },
  24. noDataText: {
  25. type: String,
  26. default: '$vuetify.noDataText'
  27. },
  28. rowProps: [Object, Function],
  29. cellProps: [Object, Function],
  30. ...makeDisplayProps()
  31. }, 'VDataTableRows');
  32. export const VDataTableRows = genericComponent()({
  33. name: 'VDataTableRows',
  34. inheritAttrs: false,
  35. props: makeVDataTableRowsProps(),
  36. setup(props, _ref) {
  37. let {
  38. attrs,
  39. slots
  40. } = _ref;
  41. const {
  42. columns
  43. } = useHeaders();
  44. const {
  45. expandOnClick,
  46. toggleExpand,
  47. isExpanded
  48. } = useExpanded();
  49. const {
  50. isSelected,
  51. toggleSelect
  52. } = useSelection();
  53. const {
  54. toggleGroup,
  55. isGroupOpen
  56. } = useGroupBy();
  57. const {
  58. t
  59. } = useLocale();
  60. const {
  61. mobile
  62. } = useDisplay(props);
  63. useRender(() => {
  64. if (props.loading && (!props.items.length || slots.loading)) {
  65. return _createVNode("tr", {
  66. "class": "v-data-table-rows-loading",
  67. "key": "loading"
  68. }, [_createVNode("td", {
  69. "colspan": columns.value.length
  70. }, [slots.loading?.() ?? t(props.loadingText)])]);
  71. }
  72. if (!props.loading && !props.items.length && !props.hideNoData) {
  73. return _createVNode("tr", {
  74. "class": "v-data-table-rows-no-data",
  75. "key": "no-data"
  76. }, [_createVNode("td", {
  77. "colspan": columns.value.length
  78. }, [slots['no-data']?.() ?? t(props.noDataText)])]);
  79. }
  80. return _createVNode(_Fragment, null, [props.items.map((item, index) => {
  81. if (item.type === 'group') {
  82. const slotProps = {
  83. index,
  84. item,
  85. columns: columns.value,
  86. isExpanded,
  87. toggleExpand,
  88. isSelected,
  89. toggleSelect,
  90. toggleGroup,
  91. isGroupOpen
  92. };
  93. return slots['group-header'] ? slots['group-header'](slotProps) : _createVNode(VDataTableGroupHeaderRow, _mergeProps({
  94. "key": `group-header_${item.id}`,
  95. "item": item
  96. }, getPrefixedEventHandlers(attrs, ':group-header', () => slotProps)), slots);
  97. }
  98. const slotProps = {
  99. index,
  100. item: item.raw,
  101. internalItem: item,
  102. columns: columns.value,
  103. isExpanded,
  104. toggleExpand,
  105. isSelected,
  106. toggleSelect
  107. };
  108. const itemSlotProps = {
  109. ...slotProps,
  110. props: mergeProps({
  111. key: `item_${item.key ?? item.index}`,
  112. onClick: expandOnClick.value ? () => {
  113. toggleExpand(item);
  114. } : undefined,
  115. index,
  116. item,
  117. cellProps: props.cellProps,
  118. mobile: mobile.value
  119. }, getPrefixedEventHandlers(attrs, ':row', () => slotProps), typeof props.rowProps === 'function' ? props.rowProps({
  120. item: slotProps.item,
  121. index: slotProps.index,
  122. internalItem: slotProps.internalItem
  123. }) : props.rowProps)
  124. };
  125. return _createVNode(_Fragment, {
  126. "key": itemSlotProps.props.key
  127. }, [slots.item ? slots.item(itemSlotProps) : _createVNode(VDataTableRow, itemSlotProps.props, slots), isExpanded(item) && slots['expanded-row']?.(slotProps)]);
  128. })]);
  129. });
  130. return {};
  131. }
  132. });
  133. //# sourceMappingURL=VDataTableRows.mjs.map