util.js 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445
  1. 'use strict';
  2. Object.defineProperty(exports, '__esModule', { value: true });
  3. var vue = require('vue');
  4. var lodashUnified = require('lodash-unified');
  5. var index = require('../../tooltip/index.js');
  6. var shared = require('@vue/shared');
  7. var error = require('../../../utils/error.js');
  8. var types = require('../../../utils/types.js');
  9. var objects = require('../../../utils/objects.js');
  10. const getCell = function(event) {
  11. var _a;
  12. return (_a = event.target) == null ? void 0 : _a.closest("td");
  13. };
  14. const orderBy = function(array, sortKey, reverse, sortMethod, sortBy) {
  15. if (!sortKey && !sortMethod && (!sortBy || shared.isArray(sortBy) && !sortBy.length)) {
  16. return array;
  17. }
  18. if (shared.isString(reverse)) {
  19. reverse = reverse === "descending" ? -1 : 1;
  20. } else {
  21. reverse = reverse && reverse < 0 ? -1 : 1;
  22. }
  23. const getKey = sortMethod ? null : function(value, index) {
  24. if (sortBy) {
  25. if (!shared.isArray(sortBy)) {
  26. sortBy = [sortBy];
  27. }
  28. return sortBy.map((by) => {
  29. if (shared.isString(by)) {
  30. return lodashUnified.get(value, by);
  31. } else {
  32. return by(value, index, array);
  33. }
  34. });
  35. }
  36. if (sortKey !== "$key") {
  37. if (shared.isObject(value) && "$value" in value)
  38. value = value.$value;
  39. }
  40. return [shared.isObject(value) ? lodashUnified.get(value, sortKey) : value];
  41. };
  42. const compare = function(a, b) {
  43. if (sortMethod) {
  44. return sortMethod(a.value, b.value);
  45. }
  46. for (let i = 0, len = a.key.length; i < len; i++) {
  47. if (a.key[i] < b.key[i]) {
  48. return -1;
  49. }
  50. if (a.key[i] > b.key[i]) {
  51. return 1;
  52. }
  53. }
  54. return 0;
  55. };
  56. return array.map((value, index) => {
  57. return {
  58. value,
  59. index,
  60. key: getKey ? getKey(value, index) : null
  61. };
  62. }).sort((a, b) => {
  63. let order = compare(a, b);
  64. if (!order) {
  65. order = a.index - b.index;
  66. }
  67. return order * +reverse;
  68. }).map((item) => item.value);
  69. };
  70. const getColumnById = function(table, columnId) {
  71. let column = null;
  72. table.columns.forEach((item) => {
  73. if (item.id === columnId) {
  74. column = item;
  75. }
  76. });
  77. return column;
  78. };
  79. const getColumnByKey = function(table, columnKey) {
  80. let column = null;
  81. for (let i = 0; i < table.columns.length; i++) {
  82. const item = table.columns[i];
  83. if (item.columnKey === columnKey) {
  84. column = item;
  85. break;
  86. }
  87. }
  88. if (!column)
  89. error.throwError("ElTable", `No column matching with column-key: ${columnKey}`);
  90. return column;
  91. };
  92. const getColumnByCell = function(table, cell, namespace) {
  93. const matches = (cell.className || "").match(new RegExp(`${namespace}-table_[^\\s]+`, "gm"));
  94. if (matches) {
  95. return getColumnById(table, matches[0]);
  96. }
  97. return null;
  98. };
  99. const getRowIdentity = (row, rowKey) => {
  100. if (!row)
  101. throw new Error("Row is required when get row identity");
  102. if (shared.isString(rowKey)) {
  103. if (!rowKey.includes(".")) {
  104. return `${row[rowKey]}`;
  105. }
  106. const key = rowKey.split(".");
  107. let current = row;
  108. for (const element of key) {
  109. current = current[element];
  110. }
  111. return `${current}`;
  112. } else if (shared.isFunction(rowKey)) {
  113. return rowKey.call(null, row);
  114. }
  115. };
  116. const getKeysMap = function(array, rowKey, flatten = false, childrenKey = "children") {
  117. const data = array || [];
  118. const arrayMap = {};
  119. data.forEach((row, index) => {
  120. arrayMap[getRowIdentity(row, rowKey)] = { row, index };
  121. if (flatten) {
  122. const children = row[childrenKey];
  123. if (shared.isArray(children)) {
  124. Object.assign(arrayMap, getKeysMap(children, rowKey, true, childrenKey));
  125. }
  126. }
  127. });
  128. return arrayMap;
  129. };
  130. function mergeOptions(defaults, config) {
  131. const options = {};
  132. let key;
  133. for (key in defaults) {
  134. options[key] = defaults[key];
  135. }
  136. for (key in config) {
  137. if (shared.hasOwn(config, key)) {
  138. const value = config[key];
  139. if (!types.isUndefined(value)) {
  140. options[key] = value;
  141. }
  142. }
  143. }
  144. return options;
  145. }
  146. function parseWidth(width) {
  147. if (width === "")
  148. return width;
  149. if (!types.isUndefined(width)) {
  150. width = Number.parseInt(width, 10);
  151. if (Number.isNaN(width)) {
  152. width = "";
  153. }
  154. }
  155. return width;
  156. }
  157. function parseMinWidth(minWidth) {
  158. if (minWidth === "")
  159. return minWidth;
  160. if (!types.isUndefined(minWidth)) {
  161. minWidth = parseWidth(minWidth);
  162. if (Number.isNaN(minWidth)) {
  163. minWidth = 80;
  164. }
  165. }
  166. return minWidth;
  167. }
  168. function parseHeight(height) {
  169. if (types.isNumber(height)) {
  170. return height;
  171. }
  172. if (shared.isString(height)) {
  173. if (/^\d+(?:px)?$/.test(height)) {
  174. return Number.parseInt(height, 10);
  175. } else {
  176. return height;
  177. }
  178. }
  179. return null;
  180. }
  181. function compose(...funcs) {
  182. if (funcs.length === 0) {
  183. return (arg) => arg;
  184. }
  185. if (funcs.length === 1) {
  186. return funcs[0];
  187. }
  188. return funcs.reduce((a, b) => (...args) => a(b(...args)));
  189. }
  190. function toggleRowStatus(statusArr, row, newVal, tableTreeProps, selectable, rowIndex) {
  191. let _rowIndex = rowIndex != null ? rowIndex : 0;
  192. let changed = false;
  193. const index = statusArr.indexOf(row);
  194. const included = index !== -1;
  195. const isRowSelectable = selectable == null ? void 0 : selectable.call(null, row, _rowIndex);
  196. const toggleStatus = (type) => {
  197. if (type === "add") {
  198. statusArr.push(row);
  199. } else {
  200. statusArr.splice(index, 1);
  201. }
  202. changed = true;
  203. };
  204. const getChildrenCount = (row2) => {
  205. let count = 0;
  206. const children = (tableTreeProps == null ? void 0 : tableTreeProps.children) && row2[tableTreeProps.children];
  207. if (children && shared.isArray(children)) {
  208. count += children.length;
  209. children.forEach((item) => {
  210. count += getChildrenCount(item);
  211. });
  212. }
  213. return count;
  214. };
  215. if (!selectable || isRowSelectable) {
  216. if (types.isBoolean(newVal)) {
  217. if (newVal && !included) {
  218. toggleStatus("add");
  219. } else if (!newVal && included) {
  220. toggleStatus("remove");
  221. }
  222. } else {
  223. included ? toggleStatus("remove") : toggleStatus("add");
  224. }
  225. }
  226. if (!(tableTreeProps == null ? void 0 : tableTreeProps.checkStrictly) && (tableTreeProps == null ? void 0 : tableTreeProps.children) && shared.isArray(row[tableTreeProps.children])) {
  227. row[tableTreeProps.children].forEach((item) => {
  228. const childChanged = toggleRowStatus(statusArr, item, newVal != null ? newVal : !included, tableTreeProps, selectable, _rowIndex + 1);
  229. _rowIndex += getChildrenCount(item) + 1;
  230. if (childChanged) {
  231. changed = childChanged;
  232. }
  233. });
  234. }
  235. return changed;
  236. }
  237. function walkTreeNode(root, cb, childrenKey = "children", lazyKey = "hasChildren") {
  238. const isNil = (array) => !(shared.isArray(array) && array.length);
  239. function _walker(parent, children, level) {
  240. cb(parent, children, level);
  241. children.forEach((item) => {
  242. if (item[lazyKey]) {
  243. cb(item, null, level + 1);
  244. return;
  245. }
  246. const children2 = item[childrenKey];
  247. if (!isNil(children2)) {
  248. _walker(item, children2, level + 1);
  249. }
  250. });
  251. }
  252. root.forEach((item) => {
  253. if (item[lazyKey]) {
  254. cb(item, null, 0);
  255. return;
  256. }
  257. const children = item[childrenKey];
  258. if (!isNil(children)) {
  259. _walker(item, children, 0);
  260. }
  261. });
  262. }
  263. const getTableOverflowTooltipProps = (props, innerText, row, column) => {
  264. const popperOptions = {
  265. strategy: "fixed",
  266. ...props.popperOptions
  267. };
  268. const tooltipFormatterContent = shared.isFunction(column.tooltipFormatter) ? column.tooltipFormatter({
  269. row,
  270. column,
  271. cellValue: objects.getProp(row, column.property).value
  272. }) : void 0;
  273. if (vue.isVNode(tooltipFormatterContent)) {
  274. return {
  275. slotContent: tooltipFormatterContent,
  276. content: null,
  277. ...props,
  278. popperOptions
  279. };
  280. }
  281. return {
  282. slotContent: null,
  283. content: tooltipFormatterContent != null ? tooltipFormatterContent : innerText,
  284. ...props,
  285. popperOptions
  286. };
  287. };
  288. exports.removePopper = null;
  289. function createTablePopper(props, popperContent, row, column, trigger, table) {
  290. const tableOverflowTooltipProps = getTableOverflowTooltipProps(props, popperContent, row, column);
  291. const mergedProps = {
  292. ...tableOverflowTooltipProps,
  293. slotContent: void 0
  294. };
  295. if ((exports.removePopper == null ? void 0 : exports.removePopper.trigger) === trigger) {
  296. const comp = exports.removePopper.vm.component;
  297. lodashUnified.merge(comp.props, mergedProps);
  298. if (tableOverflowTooltipProps.slotContent) {
  299. comp.slots.content = () => [tableOverflowTooltipProps.slotContent];
  300. }
  301. return;
  302. }
  303. exports.removePopper == null ? void 0 : exports.removePopper();
  304. const parentNode = table == null ? void 0 : table.refs.tableWrapper;
  305. const ns = parentNode == null ? void 0 : parentNode.dataset.prefix;
  306. const vm = vue.createVNode(index.ElTooltip, {
  307. virtualTriggering: true,
  308. virtualRef: trigger,
  309. appendTo: parentNode,
  310. placement: "top",
  311. transition: "none",
  312. offset: 0,
  313. hideAfter: 0,
  314. ...mergedProps
  315. }, tableOverflowTooltipProps.slotContent ? {
  316. content: () => tableOverflowTooltipProps.slotContent
  317. } : void 0);
  318. vm.appContext = { ...table.appContext, ...table };
  319. const container = document.createElement("div");
  320. vue.render(vm, container);
  321. vm.component.exposed.onOpen();
  322. const scrollContainer = parentNode == null ? void 0 : parentNode.querySelector(`.${ns}-scrollbar__wrap`);
  323. exports.removePopper = () => {
  324. vue.render(null, container);
  325. scrollContainer == null ? void 0 : scrollContainer.removeEventListener("scroll", exports.removePopper);
  326. exports.removePopper = null;
  327. };
  328. exports.removePopper.trigger = trigger;
  329. exports.removePopper.vm = vm;
  330. scrollContainer == null ? void 0 : scrollContainer.addEventListener("scroll", exports.removePopper);
  331. }
  332. function getCurrentColumns(column) {
  333. if (column.children) {
  334. return lodashUnified.flatMap(column.children, getCurrentColumns);
  335. } else {
  336. return [column];
  337. }
  338. }
  339. function getColSpan(colSpan, column) {
  340. return colSpan + column.colSpan;
  341. }
  342. const isFixedColumn = (index, fixed, store, realColumns) => {
  343. let start = 0;
  344. let after = index;
  345. const columns = store.states.columns.value;
  346. if (realColumns) {
  347. const curColumns = getCurrentColumns(realColumns[index]);
  348. const preColumns = columns.slice(0, columns.indexOf(curColumns[0]));
  349. start = preColumns.reduce(getColSpan, 0);
  350. after = start + curColumns.reduce(getColSpan, 0) - 1;
  351. } else {
  352. start = index;
  353. }
  354. let fixedLayout;
  355. switch (fixed) {
  356. case "left":
  357. if (after < store.states.fixedLeafColumnsLength.value) {
  358. fixedLayout = "left";
  359. }
  360. break;
  361. case "right":
  362. if (start >= columns.length - store.states.rightFixedLeafColumnsLength.value) {
  363. fixedLayout = "right";
  364. }
  365. break;
  366. default:
  367. if (after < store.states.fixedLeafColumnsLength.value) {
  368. fixedLayout = "left";
  369. } else if (start >= columns.length - store.states.rightFixedLeafColumnsLength.value) {
  370. fixedLayout = "right";
  371. }
  372. }
  373. return fixedLayout ? {
  374. direction: fixedLayout,
  375. start,
  376. after
  377. } : {};
  378. };
  379. const getFixedColumnsClass = (namespace, index, fixed, store, realColumns, offset = 0) => {
  380. const classes = [];
  381. const { direction, start, after } = isFixedColumn(index, fixed, store, realColumns);
  382. if (direction) {
  383. const isLeft = direction === "left";
  384. classes.push(`${namespace}-fixed-column--${direction}`);
  385. if (isLeft && after + offset === store.states.fixedLeafColumnsLength.value - 1) {
  386. classes.push("is-last-column");
  387. } else if (!isLeft && start - offset === store.states.columns.value.length - store.states.rightFixedLeafColumnsLength.value) {
  388. classes.push("is-first-column");
  389. }
  390. }
  391. return classes;
  392. };
  393. function getOffset(offset, column) {
  394. return offset + (lodashUnified.isNull(column.realWidth) || Number.isNaN(column.realWidth) ? Number(column.width) : column.realWidth);
  395. }
  396. const getFixedColumnOffset = (index, fixed, store, realColumns) => {
  397. const {
  398. direction,
  399. start = 0,
  400. after = 0
  401. } = isFixedColumn(index, fixed, store, realColumns);
  402. if (!direction) {
  403. return;
  404. }
  405. const styles = {};
  406. const isLeft = direction === "left";
  407. const columns = store.states.columns.value;
  408. if (isLeft) {
  409. styles.left = columns.slice(0, start).reduce(getOffset, 0);
  410. } else {
  411. styles.right = columns.slice(after + 1).reverse().reduce(getOffset, 0);
  412. }
  413. return styles;
  414. };
  415. const ensurePosition = (style, key) => {
  416. if (!style)
  417. return;
  418. if (!Number.isNaN(style[key])) {
  419. style[key] = `${style[key]}px`;
  420. }
  421. };
  422. exports.compose = compose;
  423. exports.createTablePopper = createTablePopper;
  424. exports.ensurePosition = ensurePosition;
  425. exports.getCell = getCell;
  426. exports.getColumnByCell = getColumnByCell;
  427. exports.getColumnById = getColumnById;
  428. exports.getColumnByKey = getColumnByKey;
  429. exports.getFixedColumnOffset = getFixedColumnOffset;
  430. exports.getFixedColumnsClass = getFixedColumnsClass;
  431. exports.getKeysMap = getKeysMap;
  432. exports.getRowIdentity = getRowIdentity;
  433. exports.isFixedColumn = isFixedColumn;
  434. exports.mergeOptions = mergeOptions;
  435. exports.orderBy = orderBy;
  436. exports.parseHeight = parseHeight;
  437. exports.parseMinWidth = parseMinWidth;
  438. exports.parseWidth = parseWidth;
  439. exports.toggleRowStatus = toggleRowStatus;
  440. exports.walkTreeNode = walkTreeNode;
  441. //# sourceMappingURL=util.js.map