3296dd5b03643659f0dbdc1142b83363f617fc3f49e857ebc50a3aca5707306c207e3df4da285be175e50da50dabd6a26c10fec8433ca3e814f1872f4cb25f 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453
  1. 'use strict';
  2. Object.defineProperty(exports, '__esModule', { value: true });
  3. var vue = require('vue');
  4. var util = require('../util.js');
  5. var expand = require('./expand.js');
  6. var current = require('./current.js');
  7. var tree = require('./tree.js');
  8. var shared = require('@vue/shared');
  9. var lodashUnified = require('lodash-unified');
  10. const sortData = (data, states) => {
  11. const sortingColumn = states.sortingColumn;
  12. if (!sortingColumn || shared.isString(sortingColumn.sortable)) {
  13. return data;
  14. }
  15. return util.orderBy(data, states.sortProp, states.sortOrder, sortingColumn.sortMethod, sortingColumn.sortBy);
  16. };
  17. const doFlattenColumns = (columns) => {
  18. const result = [];
  19. columns.forEach((column) => {
  20. if (column.children && column.children.length > 0) {
  21. result.push.apply(result, doFlattenColumns(column.children));
  22. } else {
  23. result.push(column);
  24. }
  25. });
  26. return result;
  27. };
  28. function useWatcher() {
  29. var _a;
  30. const instance = vue.getCurrentInstance();
  31. const { size: tableSize } = vue.toRefs((_a = instance.proxy) == null ? void 0 : _a.$props);
  32. const rowKey = vue.ref(null);
  33. const data = vue.ref([]);
  34. const _data = vue.ref([]);
  35. const isComplex = vue.ref(false);
  36. const _columns = vue.ref([]);
  37. const originColumns = vue.ref([]);
  38. const columns = vue.ref([]);
  39. const fixedColumns = vue.ref([]);
  40. const rightFixedColumns = vue.ref([]);
  41. const leafColumns = vue.ref([]);
  42. const fixedLeafColumns = vue.ref([]);
  43. const rightFixedLeafColumns = vue.ref([]);
  44. const updateOrderFns = [];
  45. const leafColumnsLength = vue.ref(0);
  46. const fixedLeafColumnsLength = vue.ref(0);
  47. const rightFixedLeafColumnsLength = vue.ref(0);
  48. const isAllSelected = vue.ref(false);
  49. const selection = vue.ref([]);
  50. const reserveSelection = vue.ref(false);
  51. const selectOnIndeterminate = vue.ref(false);
  52. const selectable = vue.ref(null);
  53. const filters = vue.ref({});
  54. const filteredData = vue.ref(null);
  55. const sortingColumn = vue.ref(null);
  56. const sortProp = vue.ref(null);
  57. const sortOrder = vue.ref(null);
  58. const hoverRow = vue.ref(null);
  59. const selectedMap = vue.computed(() => {
  60. return rowKey.value ? util.getKeysMap(selection.value, rowKey.value) : void 0;
  61. });
  62. vue.watch(data, () => {
  63. var _a2;
  64. if (instance.state) {
  65. scheduleLayout(false);
  66. const needUpdateFixed = instance.props.tableLayout === "auto";
  67. if (needUpdateFixed) {
  68. (_a2 = instance.refs.tableHeaderRef) == null ? void 0 : _a2.updateFixedColumnStyle();
  69. }
  70. }
  71. }, {
  72. deep: true
  73. });
  74. const assertRowKey = () => {
  75. if (!rowKey.value)
  76. throw new Error("[ElTable] prop row-key is required");
  77. };
  78. const updateChildFixed = (column) => {
  79. var _a2;
  80. (_a2 = column.children) == null ? void 0 : _a2.forEach((childColumn) => {
  81. childColumn.fixed = column.fixed;
  82. updateChildFixed(childColumn);
  83. });
  84. };
  85. const updateColumns = () => {
  86. _columns.value.forEach((column) => {
  87. updateChildFixed(column);
  88. });
  89. fixedColumns.value = _columns.value.filter((column) => [true, "left"].includes(column.fixed));
  90. const selectColumn = _columns.value.find((column) => column.type === "selection");
  91. let selectColFixLeft;
  92. if (selectColumn && selectColumn.fixed !== "right" && !fixedColumns.value.includes(selectColumn)) {
  93. const selectColumnIndex = _columns.value.indexOf(selectColumn);
  94. if (selectColumnIndex === 0 && fixedColumns.value.length) {
  95. fixedColumns.value.unshift(selectColumn);
  96. selectColFixLeft = true;
  97. }
  98. }
  99. rightFixedColumns.value = _columns.value.filter((column) => column.fixed === "right");
  100. const notFixedColumns = _columns.value.filter((column) => (selectColFixLeft ? column.type !== "selection" : true) && !column.fixed);
  101. originColumns.value = Array.from(fixedColumns.value).concat(notFixedColumns).concat(rightFixedColumns.value);
  102. const leafColumns2 = doFlattenColumns(notFixedColumns);
  103. const fixedLeafColumns2 = doFlattenColumns(fixedColumns.value);
  104. const rightFixedLeafColumns2 = doFlattenColumns(rightFixedColumns.value);
  105. leafColumnsLength.value = leafColumns2.length;
  106. fixedLeafColumnsLength.value = fixedLeafColumns2.length;
  107. rightFixedLeafColumnsLength.value = rightFixedLeafColumns2.length;
  108. columns.value = Array.from(fixedLeafColumns2).concat(leafColumns2).concat(rightFixedLeafColumns2);
  109. isComplex.value = fixedColumns.value.length > 0 || rightFixedColumns.value.length > 0;
  110. };
  111. const scheduleLayout = (needUpdateColumns, immediate = false) => {
  112. if (needUpdateColumns) {
  113. updateColumns();
  114. }
  115. if (immediate) {
  116. instance.state.doLayout();
  117. } else {
  118. instance.state.debouncedUpdateLayout();
  119. }
  120. };
  121. const isSelected = (row) => {
  122. if (selectedMap.value) {
  123. return !!selectedMap.value[util.getRowIdentity(row, rowKey.value)];
  124. } else {
  125. return selection.value.includes(row);
  126. }
  127. };
  128. const clearSelection = () => {
  129. isAllSelected.value = false;
  130. const oldSelection = selection.value;
  131. selection.value = [];
  132. if (oldSelection.length) {
  133. instance.emit("selection-change", []);
  134. }
  135. };
  136. const cleanSelection = () => {
  137. var _a2, _b;
  138. let deleted;
  139. if (rowKey.value) {
  140. deleted = [];
  141. const childrenKey = (_b = (_a2 = instance == null ? void 0 : instance.store) == null ? void 0 : _a2.states) == null ? void 0 : _b.childrenColumnName.value;
  142. const dataMap = util.getKeysMap(data.value, rowKey.value, true, childrenKey);
  143. for (const key in selectedMap.value) {
  144. if (shared.hasOwn(selectedMap.value, key) && !dataMap[key]) {
  145. deleted.push(selectedMap.value[key].row);
  146. }
  147. }
  148. } else {
  149. deleted = selection.value.filter((item) => !data.value.includes(item));
  150. }
  151. if (deleted.length) {
  152. const newSelection = selection.value.filter((item) => !deleted.includes(item));
  153. selection.value = newSelection;
  154. instance.emit("selection-change", newSelection.slice());
  155. }
  156. };
  157. const getSelectionRows = () => {
  158. return (selection.value || []).slice();
  159. };
  160. const toggleRowSelection = (row, selected, emitChange = true, ignoreSelectable = false) => {
  161. var _a2, _b, _c, _d;
  162. const treeProps = {
  163. children: (_b = (_a2 = instance == null ? void 0 : instance.store) == null ? void 0 : _a2.states) == null ? void 0 : _b.childrenColumnName.value,
  164. checkStrictly: (_d = (_c = instance == null ? void 0 : instance.store) == null ? void 0 : _c.states) == null ? void 0 : _d.checkStrictly.value
  165. };
  166. const changed = util.toggleRowStatus(selection.value, row, selected, treeProps, ignoreSelectable ? void 0 : selectable.value, data.value.indexOf(row), rowKey.value);
  167. if (changed) {
  168. const newSelection = (selection.value || []).slice();
  169. if (emitChange) {
  170. instance.emit("select", newSelection, row);
  171. }
  172. instance.emit("selection-change", newSelection);
  173. }
  174. };
  175. const _toggleAllSelection = () => {
  176. var _a2, _b;
  177. const value = selectOnIndeterminate.value ? !isAllSelected.value : !(isAllSelected.value || selection.value.length);
  178. isAllSelected.value = value;
  179. let selectionChanged = false;
  180. let childrenCount = 0;
  181. const rowKey2 = (_b = (_a2 = instance == null ? void 0 : instance.store) == null ? void 0 : _a2.states) == null ? void 0 : _b.rowKey.value;
  182. const { childrenColumnName } = instance.store.states;
  183. const treeProps = {
  184. children: childrenColumnName.value,
  185. checkStrictly: false
  186. };
  187. data.value.forEach((row, index) => {
  188. const rowIndex = index + childrenCount;
  189. if (util.toggleRowStatus(selection.value, row, value, treeProps, selectable.value, rowIndex, rowKey2)) {
  190. selectionChanged = true;
  191. }
  192. childrenCount += getChildrenCount(util.getRowIdentity(row, rowKey2));
  193. });
  194. if (selectionChanged) {
  195. instance.emit("selection-change", selection.value ? selection.value.slice() : []);
  196. }
  197. instance.emit("select-all", (selection.value || []).slice());
  198. };
  199. const updateAllSelected = () => {
  200. var _a2;
  201. if (((_a2 = data.value) == null ? void 0 : _a2.length) === 0) {
  202. isAllSelected.value = false;
  203. return;
  204. }
  205. const { childrenColumnName } = instance.store.states;
  206. let rowIndex = 0;
  207. let selectedCount = 0;
  208. const checkSelectedStatus = (data2) => {
  209. var _a3;
  210. for (const row of data2) {
  211. const isRowSelectable = selectable.value && selectable.value.call(null, row, rowIndex);
  212. if (!isSelected(row)) {
  213. if (!selectable.value || isRowSelectable) {
  214. return false;
  215. }
  216. } else {
  217. selectedCount++;
  218. }
  219. rowIndex++;
  220. if (((_a3 = row[childrenColumnName.value]) == null ? void 0 : _a3.length) && !checkSelectedStatus(row[childrenColumnName.value])) {
  221. return false;
  222. }
  223. }
  224. return true;
  225. };
  226. const isAllSelected_ = checkSelectedStatus(data.value || []);
  227. isAllSelected.value = selectedCount === 0 ? false : isAllSelected_;
  228. };
  229. const getChildrenCount = (rowKey2) => {
  230. var _a2;
  231. if (!instance || !instance.store)
  232. return 0;
  233. const { treeData } = instance.store.states;
  234. let count = 0;
  235. const children = (_a2 = treeData.value[rowKey2]) == null ? void 0 : _a2.children;
  236. if (children) {
  237. count += children.length;
  238. children.forEach((childKey) => {
  239. count += getChildrenCount(childKey);
  240. });
  241. }
  242. return count;
  243. };
  244. const updateFilters = (column, values) => {
  245. const filters_ = {};
  246. lodashUnified.castArray(column).forEach((col) => {
  247. filters.value[col.id] = values;
  248. filters_[col.columnKey || col.id] = values;
  249. });
  250. return filters_;
  251. };
  252. const updateSort = (column, prop, order) => {
  253. if (sortingColumn.value && sortingColumn.value !== column) {
  254. sortingColumn.value.order = null;
  255. }
  256. sortingColumn.value = column;
  257. sortProp.value = prop;
  258. sortOrder.value = order;
  259. };
  260. const execFilter = () => {
  261. let sourceData = vue.unref(_data);
  262. Object.keys(filters.value).forEach((columnId) => {
  263. const values = filters.value[columnId];
  264. if (!values || values.length === 0)
  265. return;
  266. const column = util.getColumnById({
  267. columns: columns.value
  268. }, columnId);
  269. if (column && column.filterMethod) {
  270. sourceData = sourceData.filter((row) => {
  271. return values.some((value) => column.filterMethod.call(null, value, row, column));
  272. });
  273. }
  274. });
  275. filteredData.value = sourceData;
  276. };
  277. const execSort = () => {
  278. var _a2;
  279. data.value = sortData((_a2 = filteredData.value) != null ? _a2 : [], {
  280. sortingColumn: sortingColumn.value,
  281. sortProp: sortProp.value,
  282. sortOrder: sortOrder.value
  283. });
  284. };
  285. const execQuery = (ignore = void 0) => {
  286. if (!(ignore == null ? void 0 : ignore.filter)) {
  287. execFilter();
  288. }
  289. execSort();
  290. };
  291. const clearFilter = (columnKeys) => {
  292. const { tableHeaderRef } = instance.refs;
  293. if (!tableHeaderRef)
  294. return;
  295. const panels = Object.assign({}, tableHeaderRef.filterPanels);
  296. const keys = Object.keys(panels);
  297. if (!keys.length)
  298. return;
  299. if (shared.isString(columnKeys)) {
  300. columnKeys = [columnKeys];
  301. }
  302. if (shared.isArray(columnKeys)) {
  303. const columns_ = columnKeys.map((key) => util.getColumnByKey({
  304. columns: columns.value
  305. }, key));
  306. keys.forEach((key) => {
  307. const column = columns_.find((col) => col.id === key);
  308. if (column) {
  309. column.filteredValue = [];
  310. }
  311. });
  312. instance.store.commit("filterChange", {
  313. column: columns_,
  314. values: [],
  315. silent: true,
  316. multi: true
  317. });
  318. } else {
  319. keys.forEach((key) => {
  320. const column = columns.value.find((col) => col.id === key);
  321. if (column) {
  322. column.filteredValue = [];
  323. }
  324. });
  325. filters.value = {};
  326. instance.store.commit("filterChange", {
  327. column: {},
  328. values: [],
  329. silent: true
  330. });
  331. }
  332. };
  333. const clearSort = () => {
  334. if (!sortingColumn.value)
  335. return;
  336. updateSort(null, null, null);
  337. instance.store.commit("changeSortCondition", {
  338. silent: true
  339. });
  340. };
  341. const {
  342. setExpandRowKeys,
  343. toggleRowExpansion,
  344. updateExpandRows,
  345. states: expandStates,
  346. isRowExpanded
  347. } = expand["default"]({
  348. data,
  349. rowKey
  350. });
  351. const {
  352. updateTreeExpandKeys,
  353. toggleTreeExpansion,
  354. updateTreeData,
  355. updateKeyChildren,
  356. loadOrToggle,
  357. states: treeStates
  358. } = tree["default"]({
  359. data,
  360. rowKey
  361. });
  362. const {
  363. updateCurrentRowData,
  364. updateCurrentRow,
  365. setCurrentRowKey,
  366. states: currentData
  367. } = current["default"]({
  368. data,
  369. rowKey
  370. });
  371. const setExpandRowKeysAdapter = (val) => {
  372. setExpandRowKeys(val);
  373. updateTreeExpandKeys(val);
  374. };
  375. const toggleRowExpansionAdapter = (row, expanded) => {
  376. const hasExpandColumn = columns.value.some(({ type }) => type === "expand");
  377. if (hasExpandColumn) {
  378. toggleRowExpansion(row, expanded);
  379. } else {
  380. toggleTreeExpansion(row, expanded);
  381. }
  382. };
  383. return {
  384. assertRowKey,
  385. updateColumns,
  386. scheduleLayout,
  387. isSelected,
  388. clearSelection,
  389. cleanSelection,
  390. getSelectionRows,
  391. toggleRowSelection,
  392. _toggleAllSelection,
  393. toggleAllSelection: null,
  394. updateAllSelected,
  395. updateFilters,
  396. updateCurrentRow,
  397. updateSort,
  398. execFilter,
  399. execSort,
  400. execQuery,
  401. clearFilter,
  402. clearSort,
  403. toggleRowExpansion,
  404. setExpandRowKeysAdapter,
  405. setCurrentRowKey,
  406. toggleRowExpansionAdapter,
  407. isRowExpanded,
  408. updateExpandRows,
  409. updateCurrentRowData,
  410. loadOrToggle,
  411. updateTreeData,
  412. updateKeyChildren,
  413. states: {
  414. tableSize,
  415. rowKey,
  416. data,
  417. _data,
  418. isComplex,
  419. _columns,
  420. originColumns,
  421. columns,
  422. fixedColumns,
  423. rightFixedColumns,
  424. leafColumns,
  425. fixedLeafColumns,
  426. rightFixedLeafColumns,
  427. updateOrderFns,
  428. leafColumnsLength,
  429. fixedLeafColumnsLength,
  430. rightFixedLeafColumnsLength,
  431. isAllSelected,
  432. selection,
  433. reserveSelection,
  434. selectOnIndeterminate,
  435. selectable,
  436. filters,
  437. filteredData,
  438. sortingColumn,
  439. sortProp,
  440. sortOrder,
  441. hoverRow,
  442. ...expandStates,
  443. ...treeStates,
  444. ...currentData
  445. }
  446. };
  447. }
  448. exports["default"] = useWatcher;
  449. //# sourceMappingURL=watcher.js.map