use-table.js 3.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157
  1. 'use strict';
  2. Object.defineProperty(exports, '__esModule', { value: true });
  3. var vue = require('vue');
  4. require('../../../utils/index.js');
  5. require('./composables/index.js');
  6. var useColumns = require('./composables/use-columns.js');
  7. var useScrollbar = require('./composables/use-scrollbar.js');
  8. var useRow = require('./composables/use-row.js');
  9. var useData = require('./composables/use-data.js');
  10. var useStyles = require('./composables/use-styles.js');
  11. var shared = require('@vue/shared');
  12. function useTable(props) {
  13. const mainTableRef = vue.ref();
  14. const leftTableRef = vue.ref();
  15. const rightTableRef = vue.ref();
  16. const {
  17. columns,
  18. columnsStyles,
  19. columnsTotalWidth,
  20. fixedColumnsOnLeft,
  21. fixedColumnsOnRight,
  22. hasFixedColumns,
  23. mainColumns,
  24. onColumnSorted
  25. } = useColumns.useColumns(props, vue.toRef(props, "columns"), vue.toRef(props, "fixed"));
  26. const {
  27. scrollTo,
  28. scrollToLeft,
  29. scrollToTop,
  30. scrollToRow,
  31. onScroll,
  32. onVerticalScroll,
  33. scrollPos
  34. } = useScrollbar.useScrollbar(props, {
  35. mainTableRef,
  36. leftTableRef,
  37. rightTableRef,
  38. onMaybeEndReached
  39. });
  40. const {
  41. expandedRowKeys,
  42. hoveringRowKey,
  43. lastRenderedRowIndex,
  44. isDynamic,
  45. isResetting,
  46. rowHeights,
  47. resetAfterIndex,
  48. onRowExpanded,
  49. onRowHeightChange,
  50. onRowHovered,
  51. onRowsRendered
  52. } = useRow.useRow(props, {
  53. mainTableRef,
  54. leftTableRef,
  55. rightTableRef,
  56. onMaybeEndReached
  57. });
  58. const { data, depthMap } = useData.useData(props, {
  59. expandedRowKeys,
  60. lastRenderedRowIndex,
  61. resetAfterIndex
  62. });
  63. const {
  64. bodyWidth,
  65. fixedTableHeight,
  66. mainTableHeight,
  67. leftTableWidth,
  68. rightTableWidth,
  69. headerWidth,
  70. rowsHeight,
  71. windowHeight,
  72. footerHeight,
  73. emptyStyle,
  74. rootStyle,
  75. headerHeight
  76. } = useStyles.useStyles(props, {
  77. columnsTotalWidth,
  78. data,
  79. fixedColumnsOnLeft,
  80. fixedColumnsOnRight
  81. });
  82. const isScrolling = vue.shallowRef(false);
  83. const containerRef = vue.ref();
  84. const showEmpty = vue.computed(() => {
  85. const noData = vue.unref(data).length === 0;
  86. return shared.isArray(props.fixedData) ? props.fixedData.length === 0 && noData : noData;
  87. });
  88. function getRowHeight(rowIndex) {
  89. const { estimatedRowHeight, rowHeight, rowKey } = props;
  90. if (!estimatedRowHeight)
  91. return rowHeight;
  92. return vue.unref(rowHeights)[vue.unref(data)[rowIndex][rowKey]] || estimatedRowHeight;
  93. }
  94. function onMaybeEndReached() {
  95. const { onEndReached } = props;
  96. if (!onEndReached)
  97. return;
  98. const { scrollTop } = vue.unref(scrollPos);
  99. const _totalHeight = vue.unref(rowsHeight);
  100. const clientHeight = vue.unref(windowHeight);
  101. const heightUntilEnd = _totalHeight - (scrollTop + clientHeight) + props.hScrollbarSize;
  102. if (vue.unref(lastRenderedRowIndex) >= 0 && _totalHeight === scrollTop + vue.unref(mainTableHeight) - vue.unref(headerHeight)) {
  103. onEndReached(heightUntilEnd);
  104. }
  105. }
  106. vue.watch(() => props.expandedRowKeys, (val) => expandedRowKeys.value = val, {
  107. deep: true
  108. });
  109. return {
  110. columns,
  111. containerRef,
  112. mainTableRef,
  113. leftTableRef,
  114. rightTableRef,
  115. isDynamic,
  116. isResetting,
  117. isScrolling,
  118. hoveringRowKey,
  119. hasFixedColumns,
  120. columnsStyles,
  121. columnsTotalWidth,
  122. data,
  123. expandedRowKeys,
  124. depthMap,
  125. fixedColumnsOnLeft,
  126. fixedColumnsOnRight,
  127. mainColumns,
  128. bodyWidth,
  129. emptyStyle,
  130. rootStyle,
  131. headerWidth,
  132. footerHeight,
  133. mainTableHeight,
  134. fixedTableHeight,
  135. leftTableWidth,
  136. rightTableWidth,
  137. showEmpty,
  138. getRowHeight,
  139. onColumnSorted,
  140. onRowHovered,
  141. onRowExpanded,
  142. onRowsRendered,
  143. onRowHeightChange,
  144. scrollTo,
  145. scrollToLeft,
  146. scrollToTop,
  147. scrollToRow,
  148. onScroll,
  149. onVerticalScroll
  150. };
  151. }
  152. exports.useTable = useTable;
  153. //# sourceMappingURL=use-table.js.map