@revolist/revogrid 4.10.30 → 4.10.32
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/{sorting.plugin-8bbc81da.js → column.drag.plugin-e7ee8105.js} +602 -560
- package/dist/cjs/column.drag.plugin-e7ee8105.js.map +1 -0
- package/dist/cjs/{column.service-b0aead25.js → column.service-905483c3.js} +4 -3
- package/dist/cjs/column.service-905483c3.js.map +1 -0
- package/dist/cjs/{dimension.helpers-d1fc1dac.js → dimension.helpers-1927ad24.js} +5 -1
- package/dist/cjs/dimension.helpers-1927ad24.js.map +1 -0
- package/dist/cjs/{edit.utils-2930cb35.js → edit.utils-e51411f6.js} +2 -2
- package/dist/cjs/{edit.utils-2930cb35.js.map → edit.utils-e51411f6.js.map} +1 -1
- package/dist/cjs/{header-cell-renderer-96d3af22.js → header-cell-renderer-64a361f7.js} +2 -2
- package/dist/cjs/{header-cell-renderer-96d3af22.js.map → header-cell-renderer-64a361f7.js.map} +1 -1
- package/dist/cjs/index.cjs.js +31 -29
- package/dist/cjs/index.cjs.js.map +1 -1
- package/dist/cjs/{key.utils-a0f6752d.js → key.utils-96d0bc42.js} +2 -2
- package/dist/cjs/{key.utils-a0f6752d.js.map → key.utils-96d0bc42.js.map} +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/revo-grid.cjs.entry.js +91 -58
- package/dist/cjs/revo-grid.cjs.entry.js.map +1 -1
- package/dist/cjs/revo-grid.cjs.js +1 -1
- package/dist/cjs/revogr-attribution_7.cjs.entry.js +6 -6
- package/dist/cjs/revogr-clipboard_3.cjs.entry.js +4 -4
- package/dist/cjs/revogr-data_4.cjs.entry.js +5 -17
- package/dist/cjs/revogr-data_4.cjs.entry.js.map +1 -1
- package/dist/cjs/{text-editor-62095c25.js → text-editor-1afffaf1.js} +3 -3
- package/dist/cjs/{text-editor-62095c25.js.map → text-editor-1afffaf1.js.map} +1 -1
- package/dist/cjs/{throttle-99c7d1b2.js → throttle-bb713c73.js} +2 -2
- package/dist/cjs/{throttle-99c7d1b2.js.map → throttle-bb713c73.js.map} +1 -1
- package/dist/cjs/{viewport.store-3d351649.js → viewport.store-69b45f22.js} +2 -2
- package/dist/cjs/{viewport.store-3d351649.js.map → viewport.store-69b45f22.js.map} +1 -1
- package/dist/collection/components/revoGrid/revo-grid.js +71 -2
- package/dist/collection/components/revoGrid/revo-grid.js.map +1 -1
- package/dist/collection/components/scroll/revogr-viewport-scroll.js +1 -13
- package/dist/collection/components/scroll/revogr-viewport-scroll.js.map +1 -1
- package/dist/collection/plugins/groupingRow/grouping.row.plugin.js +12 -1
- package/dist/collection/plugins/groupingRow/grouping.row.plugin.js.map +1 -1
- package/dist/collection/plugins/groupingRow/grouping.service.js +2 -1
- package/dist/collection/plugins/groupingRow/grouping.service.js.map +1 -1
- package/dist/collection/plugins/sorting/sorting.func.js +42 -0
- package/dist/collection/plugins/sorting/sorting.func.js.map +1 -0
- package/dist/collection/plugins/sorting/sorting.plugin.js +47 -52
- package/dist/collection/plugins/sorting/sorting.plugin.js.map +1 -1
- package/dist/collection/plugins/sorting/sorting.types.js +2 -0
- package/dist/collection/plugins/sorting/sorting.types.js.map +1 -0
- package/dist/collection/serve/controller.js +6 -6
- package/dist/collection/serve/data.js +9 -6
- package/dist/collection/services/data.provider.js +18 -7
- package/dist/collection/services/data.provider.js.map +1 -1
- package/dist/collection/services/dimension.provider.js +22 -12
- package/dist/collection/services/dimension.provider.js.map +1 -1
- package/dist/collection/store/dataSource/data.proxy.js +4 -0
- package/dist/collection/store/dataSource/data.proxy.js.map +1 -1
- package/dist/collection/types/events.js +2 -0
- package/dist/collection/types/events.js.map +1 -1
- package/dist/esm/{sorting.plugin-749f7e9d.js → column.drag.plugin-6ed6cd8d.js} +603 -561
- package/dist/esm/column.drag.plugin-6ed6cd8d.js.map +1 -0
- package/dist/esm/{column.service-f27f058b.js → column.service-7a47e6d0.js} +4 -3
- package/dist/esm/column.service-7a47e6d0.js.map +1 -0
- package/dist/esm/{dimension.helpers-4ea92aec.js → dimension.helpers-d0d709c4.js} +5 -1
- package/dist/esm/dimension.helpers-d0d709c4.js.map +1 -0
- package/dist/esm/{edit.utils-86cec863.js → edit.utils-0ae0db50.js} +2 -2
- package/dist/esm/{edit.utils-86cec863.js.map → edit.utils-0ae0db50.js.map} +1 -1
- package/dist/esm/{header-cell-renderer-e503d68c.js → header-cell-renderer-f46a8010.js} +2 -2
- package/dist/esm/{header-cell-renderer-e503d68c.js.map → header-cell-renderer-f46a8010.js.map} +1 -1
- package/dist/esm/index.js +10 -8
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/{key.utils-66b79ec7.js → key.utils-7c3218d4.js} +2 -2
- package/dist/esm/{key.utils-66b79ec7.js.map → key.utils-7c3218d4.js.map} +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/esm/revo-grid.entry.js +59 -26
- package/dist/esm/revo-grid.entry.js.map +1 -1
- package/dist/esm/revo-grid.js +1 -1
- package/dist/esm/revogr-attribution_7.entry.js +6 -6
- package/dist/esm/revogr-clipboard_3.entry.js +4 -4
- package/dist/esm/revogr-data_4.entry.js +5 -17
- package/dist/esm/revogr-data_4.entry.js.map +1 -1
- package/dist/esm/{text-editor-c799aad2.js → text-editor-148a17c1.js} +3 -3
- package/dist/esm/{text-editor-c799aad2.js.map → text-editor-148a17c1.js.map} +1 -1
- package/dist/esm/{throttle-2b63f000.js → throttle-394e489c.js} +2 -2
- package/dist/esm/{throttle-2b63f000.js.map → throttle-394e489c.js.map} +1 -1
- package/dist/esm/{viewport.store-a1fce772.js → viewport.store-afa8c4fe.js} +2 -2
- package/dist/esm/{viewport.store-a1fce772.js.map → viewport.store-afa8c4fe.js.map} +1 -1
- package/dist/revo-grid/column.drag.plugin-6ed6cd8d.js +5 -0
- package/dist/revo-grid/column.drag.plugin-6ed6cd8d.js.map +1 -0
- package/dist/revo-grid/column.service-7a47e6d0.js +5 -0
- package/dist/revo-grid/column.service-7a47e6d0.js.map +1 -0
- package/dist/revo-grid/{dimension.helpers-4ea92aec.js → dimension.helpers-d0d709c4.js} +1 -1
- package/dist/revo-grid/dimension.helpers-d0d709c4.js.map +1 -0
- package/dist/revo-grid/edit.utils-0ae0db50.js +5 -0
- package/dist/revo-grid/{header-cell-renderer-e503d68c.js → header-cell-renderer-f46a8010.js} +2 -2
- package/dist/revo-grid/index.esm.js +1 -1
- package/dist/revo-grid/index.esm.js.map +1 -1
- package/dist/revo-grid/key.utils-7c3218d4.js +5 -0
- package/dist/revo-grid/revo-grid.entry.js +1 -1
- package/dist/revo-grid/revo-grid.entry.js.map +1 -1
- package/dist/revo-grid/revo-grid.esm.js +1 -1
- package/dist/revo-grid/revo-grid.esm.js.map +1 -1
- package/dist/revo-grid/revogr-attribution_7.entry.js +1 -1
- package/dist/revo-grid/revogr-clipboard_3.entry.js +1 -1
- package/dist/revo-grid/revogr-data_4.entry.js +1 -1
- package/dist/revo-grid/revogr-data_4.entry.js.map +1 -1
- package/dist/revo-grid/text-editor-148a17c1.js +5 -0
- package/dist/revo-grid/{throttle-2b63f000.js → throttle-394e489c.js} +2 -2
- package/dist/revo-grid/{viewport.store-a1fce772.js → viewport.store-afa8c4fe.js} +2 -2
- package/dist/types/components/revoGrid/revo-grid.d.ts +15 -0
- package/dist/types/components/scroll/revogr-viewport-scroll.d.ts +0 -2
- package/dist/types/components.d.ts +20 -0
- package/dist/types/plugins/groupingRow/grouping.row.plugin.d.ts +1 -0
- package/dist/types/plugins/groupingRow/grouping.service.d.ts +4 -3
- package/dist/types/plugins/sorting/sorting.func.d.ts +3 -0
- package/dist/types/plugins/sorting/sorting.plugin.d.ts +7 -10
- package/dist/types/plugins/sorting/sorting.types.d.ts +13 -0
- package/dist/types/services/data.provider.d.ts +2 -0
- package/dist/types/services/dimension.provider.d.ts +4 -3
- package/dist/types/store/dataSource/data.proxy.d.ts +4 -0
- package/dist/types/types/events.d.ts +1 -1
- package/hydrate/index.js +157 -88
- package/hydrate/index.mjs +157 -88
- package/package.json +1 -1
- package/standalone/column.service.js +2 -1
- package/standalone/column.service.js.map +1 -1
- package/standalone/data.store.js +4 -0
- package/standalone/data.store.js.map +1 -1
- package/standalone/index.js +2 -0
- package/standalone/index.js.map +1 -1
- package/standalone/revo-grid.js +637 -560
- package/standalone/revo-grid.js.map +1 -1
- package/standalone/revogr-viewport-scroll2.js +1 -13
- package/standalone/revogr-viewport-scroll2.js.map +1 -1
- package/dist/cjs/column.service-b0aead25.js.map +0 -1
- package/dist/cjs/dimension.helpers-d1fc1dac.js.map +0 -1
- package/dist/cjs/sorting.plugin-8bbc81da.js.map +0 -1
- package/dist/esm/column.service-f27f058b.js.map +0 -1
- package/dist/esm/dimension.helpers-4ea92aec.js.map +0 -1
- package/dist/esm/sorting.plugin-749f7e9d.js.map +0 -1
- package/dist/revo-grid/column.service-f27f058b.js +0 -5
- package/dist/revo-grid/column.service-f27f058b.js.map +0 -1
- package/dist/revo-grid/dimension.helpers-4ea92aec.js.map +0 -1
- package/dist/revo-grid/edit.utils-86cec863.js +0 -5
- package/dist/revo-grid/key.utils-66b79ec7.js +0 -5
- package/dist/revo-grid/sorting.plugin-749f7e9d.js +0 -5
- package/dist/revo-grid/sorting.plugin-749f7e9d.js.map +0 -1
- package/dist/revo-grid/text-editor-c799aad2.js +0 -5
- /package/dist/revo-grid/{edit.utils-86cec863.js.map → edit.utils-0ae0db50.js.map} +0 -0
- /package/dist/revo-grid/{header-cell-renderer-e503d68c.js.map → header-cell-renderer-f46a8010.js.map} +0 -0
- /package/dist/revo-grid/{key.utils-66b79ec7.js.map → key.utils-7c3218d4.js.map} +0 -0
- /package/dist/revo-grid/{text-editor-c799aad2.js.map → text-editor-148a17c1.js.map} +0 -0
- /package/dist/revo-grid/{throttle-2b63f000.js.map → throttle-394e489c.js.map} +0 -0
- /package/dist/revo-grid/{viewport.store-a1fce772.js.map → viewport.store-afa8c4fe.js.map} +0 -0
|
@@ -3,13 +3,13 @@
|
|
|
3
3
|
*/
|
|
4
4
|
'use strict';
|
|
5
5
|
|
|
6
|
-
const column_service = require('./column.service-
|
|
7
|
-
const dimension_helpers = require('./dimension.helpers-
|
|
8
|
-
const viewport_store = require('./viewport.store-
|
|
6
|
+
const column_service = require('./column.service-905483c3.js');
|
|
7
|
+
const dimension_helpers = require('./dimension.helpers-1927ad24.js');
|
|
8
|
+
const viewport_store = require('./viewport.store-69b45f22.js');
|
|
9
9
|
const index = require('./index-10d10c55.js');
|
|
10
10
|
const filter_button = require('./filter.button-b8debe72.js');
|
|
11
11
|
const debounce = require('./debounce-ec7a04b4.js');
|
|
12
|
-
const headerCellRenderer = require('./header-cell-renderer-
|
|
12
|
+
const headerCellRenderer = require('./header-cell-renderer-64a361f7.js');
|
|
13
13
|
|
|
14
14
|
/**
|
|
15
15
|
* Plugin which recalculates realSize on changes of sizes, originItemSize and count
|
|
@@ -1626,6 +1626,419 @@ function processDoubleConversionTrimmed(initiallyTrimed, firstLevelMap, secondLe
|
|
|
1626
1626
|
return trimemedOptionsToUpgrade;
|
|
1627
1627
|
}
|
|
1628
1628
|
|
|
1629
|
+
/** `Object#toString` result references. */
|
|
1630
|
+
var stringTag = '[object String]';
|
|
1631
|
+
|
|
1632
|
+
/**
|
|
1633
|
+
* Checks if `value` is classified as a `String` primitive or object.
|
|
1634
|
+
*
|
|
1635
|
+
* @static
|
|
1636
|
+
* @since 0.1.0
|
|
1637
|
+
* @memberOf _
|
|
1638
|
+
* @category Lang
|
|
1639
|
+
* @param {*} value The value to check.
|
|
1640
|
+
* @returns {boolean} Returns `true` if `value` is a string, else `false`.
|
|
1641
|
+
* @example
|
|
1642
|
+
*
|
|
1643
|
+
* _.isString('abc');
|
|
1644
|
+
* // => true
|
|
1645
|
+
*
|
|
1646
|
+
* _.isString(1);
|
|
1647
|
+
* // => false
|
|
1648
|
+
*/
|
|
1649
|
+
function isString(value) {
|
|
1650
|
+
return typeof value == 'string' ||
|
|
1651
|
+
(!dimension_helpers.isArray(value) && debounce.isObjectLike(value) && debounce.baseGetTag(value) == stringTag);
|
|
1652
|
+
}
|
|
1653
|
+
|
|
1654
|
+
/**
|
|
1655
|
+
* Gets the size of an ASCII `string`.
|
|
1656
|
+
*
|
|
1657
|
+
* @private
|
|
1658
|
+
* @param {string} string The string inspect.
|
|
1659
|
+
* @returns {number} Returns the string size.
|
|
1660
|
+
*/
|
|
1661
|
+
var asciiSize = dimension_helpers.baseProperty('length');
|
|
1662
|
+
|
|
1663
|
+
const asciiSize$1 = asciiSize;
|
|
1664
|
+
|
|
1665
|
+
/** Used to compose unicode character classes. */
|
|
1666
|
+
var rsAstralRange$1 = '\\ud800-\\udfff',
|
|
1667
|
+
rsComboMarksRange$1 = '\\u0300-\\u036f',
|
|
1668
|
+
reComboHalfMarksRange$1 = '\\ufe20-\\ufe2f',
|
|
1669
|
+
rsComboSymbolsRange$1 = '\\u20d0-\\u20ff',
|
|
1670
|
+
rsComboRange$1 = rsComboMarksRange$1 + reComboHalfMarksRange$1 + rsComboSymbolsRange$1,
|
|
1671
|
+
rsVarRange$1 = '\\ufe0e\\ufe0f';
|
|
1672
|
+
|
|
1673
|
+
/** Used to compose unicode capture groups. */
|
|
1674
|
+
var rsZWJ$1 = '\\u200d';
|
|
1675
|
+
|
|
1676
|
+
/** Used to detect strings with [zero-width joiners or code points from the astral planes](http://eev.ee/blog/2015/09/12/dark-corners-of-unicode/). */
|
|
1677
|
+
var reHasUnicode = RegExp('[' + rsZWJ$1 + rsAstralRange$1 + rsComboRange$1 + rsVarRange$1 + ']');
|
|
1678
|
+
|
|
1679
|
+
/**
|
|
1680
|
+
* Checks if `string` contains Unicode symbols.
|
|
1681
|
+
*
|
|
1682
|
+
* @private
|
|
1683
|
+
* @param {string} string The string to inspect.
|
|
1684
|
+
* @returns {boolean} Returns `true` if a symbol is found, else `false`.
|
|
1685
|
+
*/
|
|
1686
|
+
function hasUnicode(string) {
|
|
1687
|
+
return reHasUnicode.test(string);
|
|
1688
|
+
}
|
|
1689
|
+
|
|
1690
|
+
/** Used to compose unicode character classes. */
|
|
1691
|
+
var rsAstralRange = '\\ud800-\\udfff',
|
|
1692
|
+
rsComboMarksRange = '\\u0300-\\u036f',
|
|
1693
|
+
reComboHalfMarksRange = '\\ufe20-\\ufe2f',
|
|
1694
|
+
rsComboSymbolsRange = '\\u20d0-\\u20ff',
|
|
1695
|
+
rsComboRange = rsComboMarksRange + reComboHalfMarksRange + rsComboSymbolsRange,
|
|
1696
|
+
rsVarRange = '\\ufe0e\\ufe0f';
|
|
1697
|
+
|
|
1698
|
+
/** Used to compose unicode capture groups. */
|
|
1699
|
+
var rsAstral = '[' + rsAstralRange + ']',
|
|
1700
|
+
rsCombo = '[' + rsComboRange + ']',
|
|
1701
|
+
rsFitz = '\\ud83c[\\udffb-\\udfff]',
|
|
1702
|
+
rsModifier = '(?:' + rsCombo + '|' + rsFitz + ')',
|
|
1703
|
+
rsNonAstral = '[^' + rsAstralRange + ']',
|
|
1704
|
+
rsRegional = '(?:\\ud83c[\\udde6-\\uddff]){2}',
|
|
1705
|
+
rsSurrPair = '[\\ud800-\\udbff][\\udc00-\\udfff]',
|
|
1706
|
+
rsZWJ = '\\u200d';
|
|
1707
|
+
|
|
1708
|
+
/** Used to compose unicode regexes. */
|
|
1709
|
+
var reOptMod = rsModifier + '?',
|
|
1710
|
+
rsOptVar = '[' + rsVarRange + ']?',
|
|
1711
|
+
rsOptJoin = '(?:' + rsZWJ + '(?:' + [rsNonAstral, rsRegional, rsSurrPair].join('|') + ')' + rsOptVar + reOptMod + ')*',
|
|
1712
|
+
rsSeq = rsOptVar + reOptMod + rsOptJoin,
|
|
1713
|
+
rsSymbol = '(?:' + [rsNonAstral + rsCombo + '?', rsCombo, rsRegional, rsSurrPair, rsAstral].join('|') + ')';
|
|
1714
|
+
|
|
1715
|
+
/** Used to match [string symbols](https://mathiasbynens.be/notes/javascript-unicode). */
|
|
1716
|
+
var reUnicode = RegExp(rsFitz + '(?=' + rsFitz + ')|' + rsSymbol + rsSeq, 'g');
|
|
1717
|
+
|
|
1718
|
+
/**
|
|
1719
|
+
* Gets the size of a Unicode `string`.
|
|
1720
|
+
*
|
|
1721
|
+
* @private
|
|
1722
|
+
* @param {string} string The string inspect.
|
|
1723
|
+
* @returns {number} Returns the string size.
|
|
1724
|
+
*/
|
|
1725
|
+
function unicodeSize(string) {
|
|
1726
|
+
var result = reUnicode.lastIndex = 0;
|
|
1727
|
+
while (reUnicode.test(string)) {
|
|
1728
|
+
++result;
|
|
1729
|
+
}
|
|
1730
|
+
return result;
|
|
1731
|
+
}
|
|
1732
|
+
|
|
1733
|
+
/**
|
|
1734
|
+
* Gets the number of symbols in `string`.
|
|
1735
|
+
*
|
|
1736
|
+
* @private
|
|
1737
|
+
* @param {string} string The string to inspect.
|
|
1738
|
+
* @returns {number} Returns the string size.
|
|
1739
|
+
*/
|
|
1740
|
+
function stringSize(string) {
|
|
1741
|
+
return hasUnicode(string)
|
|
1742
|
+
? unicodeSize(string)
|
|
1743
|
+
: asciiSize$1(string);
|
|
1744
|
+
}
|
|
1745
|
+
|
|
1746
|
+
/** `Object#toString` result references. */
|
|
1747
|
+
var mapTag = '[object Map]',
|
|
1748
|
+
setTag = '[object Set]';
|
|
1749
|
+
|
|
1750
|
+
/**
|
|
1751
|
+
* Gets the size of `collection` by returning its length for array-like
|
|
1752
|
+
* values or the number of own enumerable string keyed properties for objects.
|
|
1753
|
+
*
|
|
1754
|
+
* @static
|
|
1755
|
+
* @memberOf _
|
|
1756
|
+
* @since 0.1.0
|
|
1757
|
+
* @category Collection
|
|
1758
|
+
* @param {Array|Object|string} collection The collection to inspect.
|
|
1759
|
+
* @returns {number} Returns the collection size.
|
|
1760
|
+
* @example
|
|
1761
|
+
*
|
|
1762
|
+
* _.size([1, 2, 3]);
|
|
1763
|
+
* // => 3
|
|
1764
|
+
*
|
|
1765
|
+
* _.size({ 'a': 1, 'b': 2 });
|
|
1766
|
+
* // => 2
|
|
1767
|
+
*
|
|
1768
|
+
* _.size('pebbles');
|
|
1769
|
+
* // => 7
|
|
1770
|
+
*/
|
|
1771
|
+
function size(collection) {
|
|
1772
|
+
if (collection == null) {
|
|
1773
|
+
return 0;
|
|
1774
|
+
}
|
|
1775
|
+
if (dimension_helpers.isArrayLike(collection)) {
|
|
1776
|
+
return isString(collection) ? stringSize(collection) : collection.length;
|
|
1777
|
+
}
|
|
1778
|
+
var tag = dimension_helpers.getTag(collection);
|
|
1779
|
+
if (tag == mapTag || tag == setTag) {
|
|
1780
|
+
return collection.size;
|
|
1781
|
+
}
|
|
1782
|
+
return dimension_helpers.baseKeys(collection).length;
|
|
1783
|
+
}
|
|
1784
|
+
|
|
1785
|
+
function sortIndexByItems(indexes, source, sortingFunc = {}) {
|
|
1786
|
+
// if no sorting - return unsorted indexes
|
|
1787
|
+
if (Object.entries(sortingFunc).length === 0) {
|
|
1788
|
+
// Unsorted indexes
|
|
1789
|
+
return [...Array(indexes.length).keys()];
|
|
1790
|
+
}
|
|
1791
|
+
//
|
|
1792
|
+
/**
|
|
1793
|
+
* go through all indexes and align in new order
|
|
1794
|
+
* performs a multi-level sorting by applying multiple comparison functions to determine the order of the items based on different properties.
|
|
1795
|
+
*/
|
|
1796
|
+
return indexes.sort((a, b) => {
|
|
1797
|
+
const itemA = source[a];
|
|
1798
|
+
const itemB = source[b];
|
|
1799
|
+
for (const [prop, cmp] of Object.entries(sortingFunc)) {
|
|
1800
|
+
if (column_service.isGrouping(itemA)) {
|
|
1801
|
+
if (itemA['__rvgr-prop'] !== prop) {
|
|
1802
|
+
return 0;
|
|
1803
|
+
}
|
|
1804
|
+
}
|
|
1805
|
+
if (column_service.isGrouping(itemB)) {
|
|
1806
|
+
if (itemB['__rvgr-prop'] !== prop) {
|
|
1807
|
+
return 0;
|
|
1808
|
+
}
|
|
1809
|
+
}
|
|
1810
|
+
/**
|
|
1811
|
+
* If the comparison function returns a non-zero value (sorted), it means that the items should be sorted based on the given property. In such a case, the function immediately returns the sorted value, indicating the order in which the items should be arranged.
|
|
1812
|
+
* If none of the comparison functions result in a non-zero value, indicating that the items are equal or should remain in the same order, the function eventually returns 0.
|
|
1813
|
+
*/
|
|
1814
|
+
const sorted = cmp === null || cmp === void 0 ? void 0 : cmp(prop, itemA, itemB);
|
|
1815
|
+
if (sorted) {
|
|
1816
|
+
return sorted;
|
|
1817
|
+
}
|
|
1818
|
+
}
|
|
1819
|
+
return 0;
|
|
1820
|
+
});
|
|
1821
|
+
}
|
|
1822
|
+
|
|
1823
|
+
/**
|
|
1824
|
+
* Lifecycle
|
|
1825
|
+
* 1. @event `beforesorting` - Triggered when sorting just starts. Nothing has happened yet. This can be triggered from a column or from the source. If the type is from rows, the column will be undefined.
|
|
1826
|
+
* 2. @method `updateColumnSorting` - Updates the column sorting icon on the grid and the column itself, but the data remains untouched.
|
|
1827
|
+
* 3. @event `beforesortingapply` - Triggered before the sorting data is applied to the data source. You can prevent this event, and the data will not be sorted. This event is only called from a column sorting click.
|
|
1828
|
+
* 4. @event `aftersortingapply` - Triggered after sorting has been applied and completed. This event occurs for both row and column sorting.
|
|
1829
|
+
*
|
|
1830
|
+
* Note: If you prevent an event, it will not proceed to the subsequent steps.
|
|
1831
|
+
*/
|
|
1832
|
+
class SortingPlugin extends BasePlugin {
|
|
1833
|
+
runSorting(order, comparison, ignoreViewportUpdate) {
|
|
1834
|
+
var _a;
|
|
1835
|
+
this.sort(order, comparison, undefined, ignoreViewportUpdate);
|
|
1836
|
+
(_a = this.sortingPromise) === null || _a === void 0 ? void 0 : _a.call(this);
|
|
1837
|
+
this.sortingPromise = null;
|
|
1838
|
+
}
|
|
1839
|
+
constructor(revogrid, providers, config) {
|
|
1840
|
+
super(revogrid, providers);
|
|
1841
|
+
this.revogrid = revogrid;
|
|
1842
|
+
this.sortingPromise = null;
|
|
1843
|
+
this.postponeSort = debounce.debounce((order, comparison, ignoreViewportUpdate) => this.runSorting(order, comparison, ignoreViewportUpdate), 50);
|
|
1844
|
+
const setConfig = (cfg) => {
|
|
1845
|
+
var _a;
|
|
1846
|
+
if (cfg) {
|
|
1847
|
+
const sortingFunc = {};
|
|
1848
|
+
const order = {};
|
|
1849
|
+
(_a = cfg.columns) === null || _a === void 0 ? void 0 : _a.forEach(col => {
|
|
1850
|
+
sortingFunc[col.prop] = this.getComparer(col, col.order);
|
|
1851
|
+
order[col.prop] = col.order;
|
|
1852
|
+
});
|
|
1853
|
+
// // set sorting
|
|
1854
|
+
this.sorting = order;
|
|
1855
|
+
this.sortingFunc = sortingFunc;
|
|
1856
|
+
}
|
|
1857
|
+
};
|
|
1858
|
+
setConfig(config);
|
|
1859
|
+
this.addEventListener('sortingconfigchanged', ({ detail }) => {
|
|
1860
|
+
config = detail;
|
|
1861
|
+
setConfig(detail);
|
|
1862
|
+
this.startSorting(this.sorting, this.sortingFunc);
|
|
1863
|
+
});
|
|
1864
|
+
this.addEventListener('beforeanysource', ({ detail: { type }, }) => {
|
|
1865
|
+
// if sorting was provided - sort data
|
|
1866
|
+
if (!!this.sorting && this.sortingFunc) {
|
|
1867
|
+
const beforeEvent = this.emit('beforesorting', { type });
|
|
1868
|
+
if (beforeEvent.defaultPrevented) {
|
|
1869
|
+
return;
|
|
1870
|
+
}
|
|
1871
|
+
this.startSorting(this.sorting, this.sortingFunc);
|
|
1872
|
+
}
|
|
1873
|
+
});
|
|
1874
|
+
this.addEventListener('aftercolumnsset', ({ detail: { order }, }) => {
|
|
1875
|
+
// if config provided - do nothing, read from config
|
|
1876
|
+
if (config) {
|
|
1877
|
+
return;
|
|
1878
|
+
}
|
|
1879
|
+
const columns = this.providers.column.getColumns();
|
|
1880
|
+
const sortingFunc = {};
|
|
1881
|
+
for (let prop in order) {
|
|
1882
|
+
const cmp = this.getComparer(column_service.getColumnByProp(columns, prop), order[prop]);
|
|
1883
|
+
sortingFunc[prop] = cmp;
|
|
1884
|
+
}
|
|
1885
|
+
// set sorting
|
|
1886
|
+
this.sorting = order;
|
|
1887
|
+
this.sortingFunc = order && sortingFunc;
|
|
1888
|
+
});
|
|
1889
|
+
this.addEventListener('beforeheaderclick', (e) => {
|
|
1890
|
+
var _a, _b;
|
|
1891
|
+
if (e.defaultPrevented) {
|
|
1892
|
+
return;
|
|
1893
|
+
}
|
|
1894
|
+
if (!e.detail.column.sortable) {
|
|
1895
|
+
return;
|
|
1896
|
+
}
|
|
1897
|
+
this.headerclick(e.detail.column, e.detail.index, (_b = (_a = e.detail) === null || _a === void 0 ? void 0 : _a.originalEvent) === null || _b === void 0 ? void 0 : _b.shiftKey);
|
|
1898
|
+
});
|
|
1899
|
+
}
|
|
1900
|
+
startSorting(order, sortingFunc, ignoreViewportUpdate) {
|
|
1901
|
+
if (!this.sortingPromise) {
|
|
1902
|
+
// add job before render
|
|
1903
|
+
this.revogrid.jobsBeforeRender.push(new Promise(resolve => {
|
|
1904
|
+
this.sortingPromise = resolve;
|
|
1905
|
+
}));
|
|
1906
|
+
}
|
|
1907
|
+
this.postponeSort(order, sortingFunc, ignoreViewportUpdate);
|
|
1908
|
+
}
|
|
1909
|
+
getComparer(column, order) {
|
|
1910
|
+
var _a, _b;
|
|
1911
|
+
const cellCmp = ((_a = column === null || column === void 0 ? void 0 : column.cellCompare) === null || _a === void 0 ? void 0 : _a.bind({ order })) || ((_b = this.defaultCellCompare) === null || _b === void 0 ? void 0 : _b.bind({ column, order }));
|
|
1912
|
+
if (order == 'asc') {
|
|
1913
|
+
return cellCmp;
|
|
1914
|
+
}
|
|
1915
|
+
if (order == 'desc') {
|
|
1916
|
+
return this.descCellCompare(cellCmp);
|
|
1917
|
+
}
|
|
1918
|
+
return undefined;
|
|
1919
|
+
}
|
|
1920
|
+
/**
|
|
1921
|
+
* Apply sorting to data on header click
|
|
1922
|
+
* If additive - add to existing sorting, multiple columns can be sorted
|
|
1923
|
+
*/
|
|
1924
|
+
headerclick(column, index, additive) {
|
|
1925
|
+
var _a, _b;
|
|
1926
|
+
let order = this.getNextOrder(column.order);
|
|
1927
|
+
const beforeEvent = this.emit('beforesorting', { column, order, additive });
|
|
1928
|
+
if (beforeEvent.defaultPrevented) {
|
|
1929
|
+
return;
|
|
1930
|
+
}
|
|
1931
|
+
order = beforeEvent.detail.order;
|
|
1932
|
+
const newCol = this.providers.column.updateColumnSorting(beforeEvent.detail.column, index, order, additive);
|
|
1933
|
+
// apply sort data
|
|
1934
|
+
const beforeApplyEvent = this.emit('beforesortingapply', {
|
|
1935
|
+
column: newCol,
|
|
1936
|
+
order,
|
|
1937
|
+
additive,
|
|
1938
|
+
});
|
|
1939
|
+
if (beforeApplyEvent.defaultPrevented) {
|
|
1940
|
+
return;
|
|
1941
|
+
}
|
|
1942
|
+
const cmp = this.getComparer(beforeApplyEvent.detail.column, beforeApplyEvent.detail.order);
|
|
1943
|
+
if (beforeApplyEvent.detail.additive && this.sorting) {
|
|
1944
|
+
const sorting = {};
|
|
1945
|
+
const sortingFunc = {};
|
|
1946
|
+
this.sorting = Object.assign(Object.assign({}, this.sorting), sorting);
|
|
1947
|
+
// extend sorting function with new sorting for multiple columns sorting
|
|
1948
|
+
this.sortingFunc = Object.assign(Object.assign({}, this.sortingFunc), sortingFunc);
|
|
1949
|
+
if (column.prop in sorting && size(sorting) > 1 && order === undefined) {
|
|
1950
|
+
delete sorting[column.prop];
|
|
1951
|
+
delete sortingFunc[column.prop];
|
|
1952
|
+
}
|
|
1953
|
+
else {
|
|
1954
|
+
sorting[column.prop] = order;
|
|
1955
|
+
sortingFunc[column.prop] = cmp;
|
|
1956
|
+
}
|
|
1957
|
+
}
|
|
1958
|
+
else {
|
|
1959
|
+
if (order) {
|
|
1960
|
+
// reset sorting
|
|
1961
|
+
this.sorting = { [column.prop]: order };
|
|
1962
|
+
this.sortingFunc = { [column.prop]: cmp };
|
|
1963
|
+
}
|
|
1964
|
+
else {
|
|
1965
|
+
(_a = this.sorting) === null || _a === void 0 ? true : delete _a[column.prop];
|
|
1966
|
+
(_b = this.sortingFunc) === null || _b === void 0 ? true : delete _b[column.prop];
|
|
1967
|
+
}
|
|
1968
|
+
}
|
|
1969
|
+
this.startSorting(this.sorting, this.sortingFunc);
|
|
1970
|
+
}
|
|
1971
|
+
/**
|
|
1972
|
+
* Sort items by sorting function
|
|
1973
|
+
* @requires proxyItems applied to row store
|
|
1974
|
+
* @requires source applied to row store
|
|
1975
|
+
*
|
|
1976
|
+
* @param sorting - per column sorting
|
|
1977
|
+
* @param data - this.stores['rgRow'].store.get('source')
|
|
1978
|
+
*/
|
|
1979
|
+
sort(sorting, sortingFunc, types = rowTypes, ignoreViewportUpdate = false) {
|
|
1980
|
+
// if no sorting - reset
|
|
1981
|
+
if (!Object.keys(sorting || {}).length) {
|
|
1982
|
+
for (let type of types) {
|
|
1983
|
+
const storeService = this.providers.data.stores[type];
|
|
1984
|
+
// row data
|
|
1985
|
+
const source = storeService.store.get('source');
|
|
1986
|
+
// row indexes
|
|
1987
|
+
const proxyItems = storeService.store.get('proxyItems');
|
|
1988
|
+
// row indexes
|
|
1989
|
+
const newItemsOrder = Array.from({ length: source.length }, (_, i) => i); // recover indexes range(0, source.length)
|
|
1990
|
+
this.providers.dimension.updateSizesPositionByNewDataIndexes(type, newItemsOrder, proxyItems);
|
|
1991
|
+
storeService.setData({ proxyItems: newItemsOrder, source: [...source], });
|
|
1992
|
+
}
|
|
1993
|
+
}
|
|
1994
|
+
else {
|
|
1995
|
+
for (let type of types) {
|
|
1996
|
+
const storeService = this.providers.data.stores[type];
|
|
1997
|
+
// row data
|
|
1998
|
+
const source = storeService.store.get('source');
|
|
1999
|
+
// row indexes
|
|
2000
|
+
const proxyItems = storeService.store.get('proxyItems');
|
|
2001
|
+
const newItemsOrder = sortIndexByItems([...proxyItems], source, sortingFunc);
|
|
2002
|
+
// take row indexes before trim applied and proxy items
|
|
2003
|
+
const prevItems = storeService.store.get('items');
|
|
2004
|
+
storeService.setData({
|
|
2005
|
+
proxyItems: newItemsOrder,
|
|
2006
|
+
source: [...source],
|
|
2007
|
+
});
|
|
2008
|
+
// take currently visible row indexes
|
|
2009
|
+
const newItems = storeService.store.get('items');
|
|
2010
|
+
if (!ignoreViewportUpdate) {
|
|
2011
|
+
this.providers.dimension
|
|
2012
|
+
.updateSizesPositionByNewDataIndexes(type, newItems, prevItems);
|
|
2013
|
+
}
|
|
2014
|
+
}
|
|
2015
|
+
}
|
|
2016
|
+
this.emit('aftersortingapply');
|
|
2017
|
+
}
|
|
2018
|
+
defaultCellCompare(prop, a, b) {
|
|
2019
|
+
const aRaw = this.column ? column_service.getCellRaw(a, this.column) : a === null || a === void 0 ? void 0 : a[prop];
|
|
2020
|
+
const bRaw = this.column ? column_service.getCellRaw(b, this.column) : b === null || b === void 0 ? void 0 : b[prop];
|
|
2021
|
+
const av = aRaw === null || aRaw === void 0 ? void 0 : aRaw.toString().toLowerCase();
|
|
2022
|
+
const bv = bRaw === null || bRaw === void 0 ? void 0 : bRaw.toString().toLowerCase();
|
|
2023
|
+
return av == bv ? 0 : av > bv ? 1 : -1;
|
|
2024
|
+
}
|
|
2025
|
+
descCellCompare(cmp) {
|
|
2026
|
+
return (prop, a, b) => {
|
|
2027
|
+
return -1 * cmp(prop, a, b);
|
|
2028
|
+
};
|
|
2029
|
+
}
|
|
2030
|
+
getNextOrder(currentOrder) {
|
|
2031
|
+
switch (currentOrder) {
|
|
2032
|
+
case undefined:
|
|
2033
|
+
return 'asc';
|
|
2034
|
+
case 'asc':
|
|
2035
|
+
return 'desc';
|
|
2036
|
+
case 'desc':
|
|
2037
|
+
return undefined;
|
|
2038
|
+
}
|
|
2039
|
+
}
|
|
2040
|
+
}
|
|
2041
|
+
|
|
1629
2042
|
class GroupingRowPlugin extends BasePlugin {
|
|
1630
2043
|
getStore(type = column_service.GROUPING_ROW_TYPE) {
|
|
1631
2044
|
return this.providers.data.stores[type].store;
|
|
@@ -1705,6 +2118,10 @@ class GroupingRowPlugin extends BasePlugin {
|
|
|
1705
2118
|
}
|
|
1706
2119
|
}
|
|
1707
2120
|
}
|
|
2121
|
+
isSortingRunning() {
|
|
2122
|
+
const sortingPlugin = this.providers.plugins.getByClass(SortingPlugin);
|
|
2123
|
+
return !!(sortingPlugin === null || sortingPlugin === void 0 ? void 0 : sortingPlugin.sortingPromise);
|
|
2124
|
+
}
|
|
1708
2125
|
// subscribe to grid events to process them accordingly
|
|
1709
2126
|
subscribe() {
|
|
1710
2127
|
/** if grouping present and new data source arrived */
|
|
@@ -1713,9 +2130,15 @@ class GroupingRowPlugin extends BasePlugin {
|
|
|
1713
2130
|
if (!(((_b = (_a = this.options) === null || _a === void 0 ? void 0 : _a.props) === null || _b === void 0 ? void 0 : _b.length) && ((_c = detail === null || detail === void 0 ? void 0 : detail.source) === null || _c === void 0 ? void 0 : _c.length))) {
|
|
1714
2131
|
return;
|
|
1715
2132
|
}
|
|
2133
|
+
// if sorting is running don't apply grouping, wait for sorting, then it'll apply in @aftersortingapply
|
|
2134
|
+
if (this.isSortingRunning()) {
|
|
2135
|
+
return;
|
|
2136
|
+
}
|
|
1716
2137
|
this.onDataSet(detail);
|
|
1717
2138
|
});
|
|
1718
|
-
this.addEventListener('beforecolumnsset', ({ detail }) =>
|
|
2139
|
+
this.addEventListener('beforecolumnsset', ({ detail }) => {
|
|
2140
|
+
this.setColumns(detail);
|
|
2141
|
+
});
|
|
1719
2142
|
/**
|
|
1720
2143
|
* filter applied need to clear grouping and apply again
|
|
1721
2144
|
* based on new results can be new grouping
|
|
@@ -1866,597 +2289,216 @@ class ColumnOrderHandler {
|
|
|
1866
2289
|
if (!this.autoscrollEl) {
|
|
1867
2290
|
return;
|
|
1868
2291
|
}
|
|
1869
|
-
const helperOffset = 10;
|
|
1870
|
-
// calculate current y position inside of the grid active holder
|
|
1871
|
-
// 3 - size of element + border
|
|
1872
|
-
const maxScroll = Math.min(pos + helperOffset, dataContainerSize - 3);
|
|
1873
|
-
this.autoscrollEl.style.transform = `${direction}(${maxScroll}px)`;
|
|
1874
|
-
this.autoscrollEl.scrollIntoView({
|
|
1875
|
-
block: 'nearest',
|
|
1876
|
-
inline: 'nearest',
|
|
1877
|
-
});
|
|
1878
|
-
}
|
|
1879
|
-
start(e, { dataEl, gridRect, scrollEl, gridEl }, dir = 'left') {
|
|
1880
|
-
gridEl.classList.add(COLUMN_DRAG_CLASS);
|
|
1881
|
-
const scrollContainerRect = scrollEl.getBoundingClientRect();
|
|
1882
|
-
if (scrollContainerRect) {
|
|
1883
|
-
this.offset = scrollContainerRect[dir] - gridRect[dir];
|
|
1884
|
-
}
|
|
1885
|
-
this.renderAutoscroll(e, dataEl);
|
|
1886
|
-
}
|
|
1887
|
-
stop(gridEl) {
|
|
1888
|
-
var _a;
|
|
1889
|
-
gridEl.classList.remove(COLUMN_DRAG_CLASS);
|
|
1890
|
-
if (this.element) {
|
|
1891
|
-
this.element.hidden = true;
|
|
1892
|
-
}
|
|
1893
|
-
this.offset = 0;
|
|
1894
|
-
(_a = this.autoscrollEl) === null || _a === void 0 ? void 0 : _a.remove();
|
|
1895
|
-
this.autoscrollEl = undefined;
|
|
1896
|
-
}
|
|
1897
|
-
showHandler(pos, size, direction = 'translateX') {
|
|
1898
|
-
if (!this.element) {
|
|
1899
|
-
return;
|
|
1900
|
-
}
|
|
1901
|
-
// do not allow overcross top of the scrollable area, header excluded
|
|
1902
|
-
if (this.offset) {
|
|
1903
|
-
pos = Math.max(pos, this.offset);
|
|
1904
|
-
}
|
|
1905
|
-
// can not be bigger then grid end
|
|
1906
|
-
pos = Math.min(pos, size);
|
|
1907
|
-
this.element.style.transform = `${direction}(${pos}px)`;
|
|
1908
|
-
this.element.hidden = false;
|
|
1909
|
-
}
|
|
1910
|
-
render() {
|
|
1911
|
-
const el = this.element = document.createElement('div');
|
|
1912
|
-
el.classList.add('drag-position-y');
|
|
1913
|
-
el.hidden = true;
|
|
1914
|
-
return el;
|
|
1915
|
-
}
|
|
1916
|
-
}
|
|
1917
|
-
|
|
1918
|
-
/**
|
|
1919
|
-
* Plugin for column manual move
|
|
1920
|
-
*/
|
|
1921
|
-
const COLUMN_CLICK = headerCellRenderer.ON_COLUMN_CLICK;
|
|
1922
|
-
const MOVE = 'columndragmousemove';
|
|
1923
|
-
const DRAG_END = 'columndragend';
|
|
1924
|
-
const BEFORE_DRAG_END = 'beforecolumndragend';
|
|
1925
|
-
// use this event subscription to drop D&D for particular columns
|
|
1926
|
-
const DRAG_START = 'columndragstart';
|
|
1927
|
-
class ColumnMovePlugin extends BasePlugin {
|
|
1928
|
-
constructor(revogrid, providers) {
|
|
1929
|
-
super(revogrid, providers);
|
|
1930
|
-
this.revogrid = revogrid;
|
|
1931
|
-
this.providers = providers;
|
|
1932
|
-
this.moveFunc = debounce.debounce((e) => this.doMove(e), 5);
|
|
1933
|
-
this.staticDragData = null;
|
|
1934
|
-
this.dragData = null;
|
|
1935
|
-
this.localSubscriptions = {};
|
|
1936
|
-
this.orderUi = new ColumnOrderHandler();
|
|
1937
|
-
revogrid.appendChild(this.orderUi.render());
|
|
1938
|
-
revogrid.classList.add('column-draggable');
|
|
1939
|
-
// Register events
|
|
1940
|
-
this.localSubscriptions['mouseleave'] = {
|
|
1941
|
-
target: document,
|
|
1942
|
-
callback: (e) => this.onMouseOut(e),
|
|
1943
|
-
};
|
|
1944
|
-
this.localSubscriptions['mouseup'] = {
|
|
1945
|
-
target: document,
|
|
1946
|
-
callback: (e) => this.onMouseUp(e),
|
|
1947
|
-
};
|
|
1948
|
-
this.localSubscriptions['mousemove'] = {
|
|
1949
|
-
target: document,
|
|
1950
|
-
callback: (e) => this.move(e),
|
|
1951
|
-
};
|
|
1952
|
-
this.addEventListener(COLUMN_CLICK, ({ detail }) => this.dragStart(detail));
|
|
1953
|
-
}
|
|
1954
|
-
dragStart({ event, data }) {
|
|
1955
|
-
if (event.defaultPrevented) {
|
|
1956
|
-
return;
|
|
1957
|
-
}
|
|
1958
|
-
const { defaultPrevented } = headerCellRenderer.dispatch(this.revogrid, DRAG_START, data);
|
|
1959
|
-
// check if allowed to drag particulat column
|
|
1960
|
-
if (defaultPrevented) {
|
|
1961
|
-
return;
|
|
1962
|
-
}
|
|
1963
|
-
this.clearOrder();
|
|
1964
|
-
const { mouseleave, mouseup, mousemove } = this.localSubscriptions;
|
|
1965
|
-
mouseleave.target.addEventListener('mouseleave', mouseleave.callback);
|
|
1966
|
-
mouseup.target.addEventListener('mouseup', mouseup.callback);
|
|
1967
|
-
const dataEl = event.target.closest('revogr-header');
|
|
1968
|
-
const scrollEl = event.target.closest('revogr-viewport-scroll');
|
|
1969
|
-
if (!dataEl || !scrollEl) {
|
|
1970
|
-
return;
|
|
1971
|
-
}
|
|
1972
|
-
// no grouping drag and no row header column drag
|
|
1973
|
-
if (column_service.isColGrouping(data) || data.providers.type === 'rowHeaders') {
|
|
1974
|
-
return;
|
|
1975
|
-
}
|
|
1976
|
-
const cols = this.getDimension(data.pin || 'rgCol');
|
|
1977
|
-
const gridRect = this.revogrid.getBoundingClientRect();
|
|
1978
|
-
const elRect = dataEl.getBoundingClientRect();
|
|
1979
|
-
const startItem = dimension_helpers.getItemByPosition(cols, getLeftRelative(event.x, gridRect.left, elRect.left - gridRect.left));
|
|
1980
|
-
this.staticDragData = {
|
|
1981
|
-
startPos: event.x,
|
|
1982
|
-
startItem,
|
|
1983
|
-
data,
|
|
1984
|
-
dataEl,
|
|
1985
|
-
scrollEl,
|
|
1986
|
-
gridEl: this.revogrid,
|
|
1987
|
-
cols,
|
|
1988
|
-
};
|
|
1989
|
-
this.dragData = this.getData(this.staticDragData);
|
|
1990
|
-
mousemove.target.addEventListener('mousemove', mousemove.callback);
|
|
1991
|
-
this.orderUi.start(event, Object.assign(Object.assign({}, this.dragData), this.staticDragData));
|
|
1992
|
-
}
|
|
1993
|
-
doMove(e) {
|
|
1994
|
-
if (!this.staticDragData) {
|
|
1995
|
-
return;
|
|
1996
|
-
}
|
|
1997
|
-
const dragData = (this.dragData = this.getData(this.staticDragData));
|
|
1998
|
-
if (!dragData) {
|
|
1999
|
-
return;
|
|
2000
|
-
}
|
|
2001
|
-
const start = this.staticDragData.startPos;
|
|
2002
|
-
if (Math.abs(start - e.x) > 10) {
|
|
2003
|
-
const x = getLeftRelative(e.x, this.dragData.gridRect.left, this.dragData.scrollOffset);
|
|
2004
|
-
const rgCol = dimension_helpers.getItemByPosition(this.staticDragData.cols, x);
|
|
2005
|
-
this.orderUi.autoscroll(x, dragData.elRect.width);
|
|
2006
|
-
// prevent position change if out of bounds
|
|
2007
|
-
if (rgCol.itemIndex >= this.staticDragData.cols.count) {
|
|
2008
|
-
return;
|
|
2009
|
-
}
|
|
2010
|
-
this.orderUi.showHandler(rgCol.end + dragData.scrollOffset, dragData.gridRect.width);
|
|
2011
|
-
}
|
|
2012
|
-
}
|
|
2013
|
-
move(e) {
|
|
2014
|
-
headerCellRenderer.dispatch(this.revogrid, MOVE, e);
|
|
2015
|
-
// then do move
|
|
2016
|
-
this.moveFunc(e);
|
|
2017
|
-
}
|
|
2018
|
-
onMouseOut(_) {
|
|
2019
|
-
this.clearOrder();
|
|
2020
|
-
}
|
|
2021
|
-
onMouseUp(e) {
|
|
2022
|
-
// apply new positions
|
|
2023
|
-
if (this.dragData && this.staticDragData) {
|
|
2024
|
-
let relativePos = getLeftRelative(e.x, this.dragData.gridRect.left, this.dragData.scrollOffset);
|
|
2025
|
-
if (relativePos < 0) {
|
|
2026
|
-
relativePos = 0;
|
|
2027
|
-
}
|
|
2028
|
-
const newPosition = dimension_helpers.getItemByPosition(this.staticDragData.cols, relativePos);
|
|
2029
|
-
const store = this.providers.column.stores[this.dragData.type].store;
|
|
2030
|
-
const newItems = [...store.get('items')];
|
|
2031
|
-
// prevent position change if needed
|
|
2032
|
-
const { defaultPrevented: stopDrag } = headerCellRenderer.dispatch(this.revogrid, BEFORE_DRAG_END, Object.assign(Object.assign({}, this.staticDragData), { startPosition: this.staticDragData.startItem, newPosition, newItem: store.get('source')[newItems[this.staticDragData.startItem.itemIndex]] }));
|
|
2033
|
-
if (!stopDrag) {
|
|
2034
|
-
const prevItems = [...newItems];
|
|
2035
|
-
// todo: if move item out of group remove item from group
|
|
2036
|
-
const toMove = newItems.splice(this.staticDragData.startItem.itemIndex, 1);
|
|
2037
|
-
newItems.splice(newPosition.itemIndex, 0, ...toMove);
|
|
2038
|
-
store.set('items', newItems);
|
|
2039
|
-
this.providers.dimension.updateSizesPositionByNewDataIndexes(this.dragData.type, newItems, prevItems);
|
|
2040
|
-
}
|
|
2041
|
-
headerCellRenderer.dispatch(this.revogrid, DRAG_END, this.dragData);
|
|
2042
|
-
}
|
|
2043
|
-
this.clearOrder();
|
|
2044
|
-
}
|
|
2045
|
-
clearLocalSubscriptions() {
|
|
2046
|
-
forEach(this.localSubscriptions, ({ target, callback }, key) => target.removeEventListener(key, callback));
|
|
2292
|
+
const helperOffset = 10;
|
|
2293
|
+
// calculate current y position inside of the grid active holder
|
|
2294
|
+
// 3 - size of element + border
|
|
2295
|
+
const maxScroll = Math.min(pos + helperOffset, dataContainerSize - 3);
|
|
2296
|
+
this.autoscrollEl.style.transform = `${direction}(${maxScroll}px)`;
|
|
2297
|
+
this.autoscrollEl.scrollIntoView({
|
|
2298
|
+
block: 'nearest',
|
|
2299
|
+
inline: 'nearest',
|
|
2300
|
+
});
|
|
2047
2301
|
}
|
|
2048
|
-
|
|
2049
|
-
|
|
2050
|
-
|
|
2051
|
-
|
|
2052
|
-
|
|
2302
|
+
start(e, { dataEl, gridRect, scrollEl, gridEl }, dir = 'left') {
|
|
2303
|
+
gridEl.classList.add(COLUMN_DRAG_CLASS);
|
|
2304
|
+
const scrollContainerRect = scrollEl.getBoundingClientRect();
|
|
2305
|
+
if (scrollContainerRect) {
|
|
2306
|
+
this.offset = scrollContainerRect[dir] - gridRect[dir];
|
|
2307
|
+
}
|
|
2308
|
+
this.renderAutoscroll(e, dataEl);
|
|
2053
2309
|
}
|
|
2054
|
-
|
|
2055
|
-
|
|
2056
|
-
|
|
2057
|
-
|
|
2058
|
-
|
|
2059
|
-
|
|
2310
|
+
stop(gridEl) {
|
|
2311
|
+
var _a;
|
|
2312
|
+
gridEl.classList.remove(COLUMN_DRAG_CLASS);
|
|
2313
|
+
if (this.element) {
|
|
2314
|
+
this.element.hidden = true;
|
|
2315
|
+
}
|
|
2316
|
+
this.offset = 0;
|
|
2317
|
+
(_a = this.autoscrollEl) === null || _a === void 0 ? void 0 : _a.remove();
|
|
2318
|
+
this.autoscrollEl = undefined;
|
|
2060
2319
|
}
|
|
2061
|
-
|
|
2062
|
-
|
|
2063
|
-
|
|
2064
|
-
|
|
2065
|
-
|
|
2066
|
-
|
|
2067
|
-
|
|
2068
|
-
|
|
2069
|
-
|
|
2070
|
-
|
|
2320
|
+
showHandler(pos, size, direction = 'translateX') {
|
|
2321
|
+
if (!this.element) {
|
|
2322
|
+
return;
|
|
2323
|
+
}
|
|
2324
|
+
// do not allow overcross top of the scrollable area, header excluded
|
|
2325
|
+
if (this.offset) {
|
|
2326
|
+
pos = Math.max(pos, this.offset);
|
|
2327
|
+
}
|
|
2328
|
+
// can not be bigger then grid end
|
|
2329
|
+
pos = Math.min(pos, size);
|
|
2330
|
+
this.element.style.transform = `${direction}(${pos}px)`;
|
|
2331
|
+
this.element.hidden = false;
|
|
2071
2332
|
}
|
|
2072
|
-
|
|
2073
|
-
|
|
2333
|
+
render() {
|
|
2334
|
+
const el = this.element = document.createElement('div');
|
|
2335
|
+
el.classList.add('drag-position-y');
|
|
2336
|
+
el.hidden = true;
|
|
2337
|
+
return el;
|
|
2074
2338
|
}
|
|
2075
2339
|
}
|
|
2076
|
-
function getLeftRelative(absoluteX, gridPos, offset) {
|
|
2077
|
-
return absoluteX - gridPos - offset;
|
|
2078
|
-
}
|
|
2079
|
-
|
|
2080
|
-
/** `Object#toString` result references. */
|
|
2081
|
-
var stringTag = '[object String]';
|
|
2082
|
-
|
|
2083
|
-
/**
|
|
2084
|
-
* Checks if `value` is classified as a `String` primitive or object.
|
|
2085
|
-
*
|
|
2086
|
-
* @static
|
|
2087
|
-
* @since 0.1.0
|
|
2088
|
-
* @memberOf _
|
|
2089
|
-
* @category Lang
|
|
2090
|
-
* @param {*} value The value to check.
|
|
2091
|
-
* @returns {boolean} Returns `true` if `value` is a string, else `false`.
|
|
2092
|
-
* @example
|
|
2093
|
-
*
|
|
2094
|
-
* _.isString('abc');
|
|
2095
|
-
* // => true
|
|
2096
|
-
*
|
|
2097
|
-
* _.isString(1);
|
|
2098
|
-
* // => false
|
|
2099
|
-
*/
|
|
2100
|
-
function isString(value) {
|
|
2101
|
-
return typeof value == 'string' ||
|
|
2102
|
-
(!dimension_helpers.isArray(value) && debounce.isObjectLike(value) && debounce.baseGetTag(value) == stringTag);
|
|
2103
|
-
}
|
|
2104
|
-
|
|
2105
|
-
/**
|
|
2106
|
-
* Gets the size of an ASCII `string`.
|
|
2107
|
-
*
|
|
2108
|
-
* @private
|
|
2109
|
-
* @param {string} string The string inspect.
|
|
2110
|
-
* @returns {number} Returns the string size.
|
|
2111
|
-
*/
|
|
2112
|
-
var asciiSize = dimension_helpers.baseProperty('length');
|
|
2113
|
-
|
|
2114
|
-
const asciiSize$1 = asciiSize;
|
|
2115
|
-
|
|
2116
|
-
/** Used to compose unicode character classes. */
|
|
2117
|
-
var rsAstralRange$1 = '\\ud800-\\udfff',
|
|
2118
|
-
rsComboMarksRange$1 = '\\u0300-\\u036f',
|
|
2119
|
-
reComboHalfMarksRange$1 = '\\ufe20-\\ufe2f',
|
|
2120
|
-
rsComboSymbolsRange$1 = '\\u20d0-\\u20ff',
|
|
2121
|
-
rsComboRange$1 = rsComboMarksRange$1 + reComboHalfMarksRange$1 + rsComboSymbolsRange$1,
|
|
2122
|
-
rsVarRange$1 = '\\ufe0e\\ufe0f';
|
|
2123
|
-
|
|
2124
|
-
/** Used to compose unicode capture groups. */
|
|
2125
|
-
var rsZWJ$1 = '\\u200d';
|
|
2126
|
-
|
|
2127
|
-
/** Used to detect strings with [zero-width joiners or code points from the astral planes](http://eev.ee/blog/2015/09/12/dark-corners-of-unicode/). */
|
|
2128
|
-
var reHasUnicode = RegExp('[' + rsZWJ$1 + rsAstralRange$1 + rsComboRange$1 + rsVarRange$1 + ']');
|
|
2129
|
-
|
|
2130
|
-
/**
|
|
2131
|
-
* Checks if `string` contains Unicode symbols.
|
|
2132
|
-
*
|
|
2133
|
-
* @private
|
|
2134
|
-
* @param {string} string The string to inspect.
|
|
2135
|
-
* @returns {boolean} Returns `true` if a symbol is found, else `false`.
|
|
2136
|
-
*/
|
|
2137
|
-
function hasUnicode(string) {
|
|
2138
|
-
return reHasUnicode.test(string);
|
|
2139
|
-
}
|
|
2140
|
-
|
|
2141
|
-
/** Used to compose unicode character classes. */
|
|
2142
|
-
var rsAstralRange = '\\ud800-\\udfff',
|
|
2143
|
-
rsComboMarksRange = '\\u0300-\\u036f',
|
|
2144
|
-
reComboHalfMarksRange = '\\ufe20-\\ufe2f',
|
|
2145
|
-
rsComboSymbolsRange = '\\u20d0-\\u20ff',
|
|
2146
|
-
rsComboRange = rsComboMarksRange + reComboHalfMarksRange + rsComboSymbolsRange,
|
|
2147
|
-
rsVarRange = '\\ufe0e\\ufe0f';
|
|
2148
|
-
|
|
2149
|
-
/** Used to compose unicode capture groups. */
|
|
2150
|
-
var rsAstral = '[' + rsAstralRange + ']',
|
|
2151
|
-
rsCombo = '[' + rsComboRange + ']',
|
|
2152
|
-
rsFitz = '\\ud83c[\\udffb-\\udfff]',
|
|
2153
|
-
rsModifier = '(?:' + rsCombo + '|' + rsFitz + ')',
|
|
2154
|
-
rsNonAstral = '[^' + rsAstralRange + ']',
|
|
2155
|
-
rsRegional = '(?:\\ud83c[\\udde6-\\uddff]){2}',
|
|
2156
|
-
rsSurrPair = '[\\ud800-\\udbff][\\udc00-\\udfff]',
|
|
2157
|
-
rsZWJ = '\\u200d';
|
|
2158
|
-
|
|
2159
|
-
/** Used to compose unicode regexes. */
|
|
2160
|
-
var reOptMod = rsModifier + '?',
|
|
2161
|
-
rsOptVar = '[' + rsVarRange + ']?',
|
|
2162
|
-
rsOptJoin = '(?:' + rsZWJ + '(?:' + [rsNonAstral, rsRegional, rsSurrPair].join('|') + ')' + rsOptVar + reOptMod + ')*',
|
|
2163
|
-
rsSeq = rsOptVar + reOptMod + rsOptJoin,
|
|
2164
|
-
rsSymbol = '(?:' + [rsNonAstral + rsCombo + '?', rsCombo, rsRegional, rsSurrPair, rsAstral].join('|') + ')';
|
|
2165
|
-
|
|
2166
|
-
/** Used to match [string symbols](https://mathiasbynens.be/notes/javascript-unicode). */
|
|
2167
|
-
var reUnicode = RegExp(rsFitz + '(?=' + rsFitz + ')|' + rsSymbol + rsSeq, 'g');
|
|
2168
|
-
|
|
2169
|
-
/**
|
|
2170
|
-
* Gets the size of a Unicode `string`.
|
|
2171
|
-
*
|
|
2172
|
-
* @private
|
|
2173
|
-
* @param {string} string The string inspect.
|
|
2174
|
-
* @returns {number} Returns the string size.
|
|
2175
|
-
*/
|
|
2176
|
-
function unicodeSize(string) {
|
|
2177
|
-
var result = reUnicode.lastIndex = 0;
|
|
2178
|
-
while (reUnicode.test(string)) {
|
|
2179
|
-
++result;
|
|
2180
|
-
}
|
|
2181
|
-
return result;
|
|
2182
|
-
}
|
|
2183
|
-
|
|
2184
|
-
/**
|
|
2185
|
-
* Gets the number of symbols in `string`.
|
|
2186
|
-
*
|
|
2187
|
-
* @private
|
|
2188
|
-
* @param {string} string The string to inspect.
|
|
2189
|
-
* @returns {number} Returns the string size.
|
|
2190
|
-
*/
|
|
2191
|
-
function stringSize(string) {
|
|
2192
|
-
return hasUnicode(string)
|
|
2193
|
-
? unicodeSize(string)
|
|
2194
|
-
: asciiSize$1(string);
|
|
2195
|
-
}
|
|
2196
|
-
|
|
2197
|
-
/** `Object#toString` result references. */
|
|
2198
|
-
var mapTag = '[object Map]',
|
|
2199
|
-
setTag = '[object Set]';
|
|
2200
|
-
|
|
2201
|
-
/**
|
|
2202
|
-
* Gets the size of `collection` by returning its length for array-like
|
|
2203
|
-
* values or the number of own enumerable string keyed properties for objects.
|
|
2204
|
-
*
|
|
2205
|
-
* @static
|
|
2206
|
-
* @memberOf _
|
|
2207
|
-
* @since 0.1.0
|
|
2208
|
-
* @category Collection
|
|
2209
|
-
* @param {Array|Object|string} collection The collection to inspect.
|
|
2210
|
-
* @returns {number} Returns the collection size.
|
|
2211
|
-
* @example
|
|
2212
|
-
*
|
|
2213
|
-
* _.size([1, 2, 3]);
|
|
2214
|
-
* // => 3
|
|
2215
|
-
*
|
|
2216
|
-
* _.size({ 'a': 1, 'b': 2 });
|
|
2217
|
-
* // => 2
|
|
2218
|
-
*
|
|
2219
|
-
* _.size('pebbles');
|
|
2220
|
-
* // => 7
|
|
2221
|
-
*/
|
|
2222
|
-
function size(collection) {
|
|
2223
|
-
if (collection == null) {
|
|
2224
|
-
return 0;
|
|
2225
|
-
}
|
|
2226
|
-
if (dimension_helpers.isArrayLike(collection)) {
|
|
2227
|
-
return isString(collection) ? stringSize(collection) : collection.length;
|
|
2228
|
-
}
|
|
2229
|
-
var tag = dimension_helpers.getTag(collection);
|
|
2230
|
-
if (tag == mapTag || tag == setTag) {
|
|
2231
|
-
return collection.size;
|
|
2232
|
-
}
|
|
2233
|
-
return dimension_helpers.baseKeys(collection).length;
|
|
2234
|
-
}
|
|
2235
2340
|
|
|
2236
2341
|
/**
|
|
2237
|
-
*
|
|
2238
|
-
* 1. @event `beforesorting` - Triggered when sorting just starts. Nothing has happened yet. This can be triggered from a column or from the source. If the type is from rows, the column will be undefined.
|
|
2239
|
-
* 2. @method `updateColumnSorting` - Updates the column sorting icon on the grid and the column itself, but the data remains untouched.
|
|
2240
|
-
* 3. @event `beforesortingapply` - Triggered before the sorting data is applied to the data source. You can prevent this event, and the data will not be sorted. This event is only called from a column sorting click.
|
|
2241
|
-
* 4. @event `aftersortingapply` - Triggered after sorting has been applied and completed. This event occurs for both row and column sorting.
|
|
2242
|
-
*
|
|
2243
|
-
* Note: If you prevent an event, it will not proceed to the subsequent steps.
|
|
2342
|
+
* Plugin for column manual move
|
|
2244
2343
|
*/
|
|
2245
|
-
|
|
2246
|
-
|
|
2247
|
-
|
|
2248
|
-
|
|
2249
|
-
|
|
2250
|
-
|
|
2251
|
-
|
|
2344
|
+
const COLUMN_CLICK = headerCellRenderer.ON_COLUMN_CLICK;
|
|
2345
|
+
const MOVE = 'columndragmousemove';
|
|
2346
|
+
const DRAG_END = 'columndragend';
|
|
2347
|
+
const BEFORE_DRAG_END = 'beforecolumndragend';
|
|
2348
|
+
// use this event subscription to drop D&D for particular columns
|
|
2349
|
+
const DRAG_START = 'columndragstart';
|
|
2350
|
+
class ColumnMovePlugin extends BasePlugin {
|
|
2252
2351
|
constructor(revogrid, providers) {
|
|
2253
2352
|
super(revogrid, providers);
|
|
2254
2353
|
this.revogrid = revogrid;
|
|
2255
|
-
this.
|
|
2256
|
-
this.
|
|
2257
|
-
|
|
2258
|
-
|
|
2259
|
-
|
|
2260
|
-
|
|
2261
|
-
|
|
2262
|
-
|
|
2263
|
-
|
|
2264
|
-
|
|
2265
|
-
|
|
2354
|
+
this.providers = providers;
|
|
2355
|
+
this.moveFunc = debounce.debounce((e) => this.doMove(e), 5);
|
|
2356
|
+
this.staticDragData = null;
|
|
2357
|
+
this.dragData = null;
|
|
2358
|
+
this.localSubscriptions = {};
|
|
2359
|
+
this.orderUi = new ColumnOrderHandler();
|
|
2360
|
+
revogrid.appendChild(this.orderUi.render());
|
|
2361
|
+
revogrid.classList.add('column-draggable');
|
|
2362
|
+
// Register events
|
|
2363
|
+
this.localSubscriptions['mouseleave'] = {
|
|
2364
|
+
target: document,
|
|
2365
|
+
callback: (e) => this.onMouseOut(e),
|
|
2266
2366
|
};
|
|
2267
|
-
|
|
2268
|
-
|
|
2269
|
-
|
|
2270
|
-
for (let prop in order) {
|
|
2271
|
-
const cmp = this.getComparer(column_service.getColumnByProp(columns, prop), order[prop]);
|
|
2272
|
-
sortingFunc[prop] = cmp;
|
|
2273
|
-
}
|
|
2274
|
-
this.runSorting(order, sortingFunc);
|
|
2367
|
+
this.localSubscriptions['mouseup'] = {
|
|
2368
|
+
target: document,
|
|
2369
|
+
callback: (e) => this.onMouseUp(e),
|
|
2275
2370
|
};
|
|
2276
|
-
|
|
2277
|
-
|
|
2278
|
-
|
|
2279
|
-
return;
|
|
2280
|
-
}
|
|
2281
|
-
if (!e.detail.column.sortable) {
|
|
2282
|
-
return;
|
|
2283
|
-
}
|
|
2284
|
-
this.headerclick(e.detail.column, e.detail.index, (_b = (_a = e.detail) === null || _a === void 0 ? void 0 : _a.originalEvent) === null || _b === void 0 ? void 0 : _b.shiftKey);
|
|
2371
|
+
this.localSubscriptions['mousemove'] = {
|
|
2372
|
+
target: document,
|
|
2373
|
+
callback: (e) => this.move(e),
|
|
2285
2374
|
};
|
|
2286
|
-
this.addEventListener(
|
|
2287
|
-
this.addEventListener('aftercolumnsset', aftercolumnsset);
|
|
2288
|
-
this.addEventListener('beforeheaderclick', headerclick);
|
|
2375
|
+
this.addEventListener(COLUMN_CLICK, ({ detail }) => this.dragStart(detail));
|
|
2289
2376
|
}
|
|
2290
|
-
|
|
2291
|
-
if (
|
|
2292
|
-
|
|
2293
|
-
this.revogrid.jobsBeforeRender.push(new Promise(resolve => {
|
|
2294
|
-
this.sortingPromise = resolve;
|
|
2295
|
-
}));
|
|
2377
|
+
dragStart({ event, data }) {
|
|
2378
|
+
if (event.defaultPrevented) {
|
|
2379
|
+
return;
|
|
2296
2380
|
}
|
|
2297
|
-
this.
|
|
2298
|
-
|
|
2299
|
-
|
|
2300
|
-
|
|
2301
|
-
const cellCmp = ((_a = column === null || column === void 0 ? void 0 : column.cellCompare) === null || _a === void 0 ? void 0 : _a.bind({ order })) || ((_b = this.defaultCellCompare) === null || _b === void 0 ? void 0 : _b.bind({ column }));
|
|
2302
|
-
if (order == 'asc') {
|
|
2303
|
-
return cellCmp;
|
|
2381
|
+
const { defaultPrevented } = headerCellRenderer.dispatch(this.revogrid, DRAG_START, data);
|
|
2382
|
+
// check if allowed to drag particulat column
|
|
2383
|
+
if (defaultPrevented) {
|
|
2384
|
+
return;
|
|
2304
2385
|
}
|
|
2305
|
-
|
|
2306
|
-
|
|
2386
|
+
this.clearOrder();
|
|
2387
|
+
const { mouseleave, mouseup, mousemove } = this.localSubscriptions;
|
|
2388
|
+
mouseleave.target.addEventListener('mouseleave', mouseleave.callback);
|
|
2389
|
+
mouseup.target.addEventListener('mouseup', mouseup.callback);
|
|
2390
|
+
const dataEl = event.target.closest('revogr-header');
|
|
2391
|
+
const scrollEl = event.target.closest('revogr-viewport-scroll');
|
|
2392
|
+
if (!dataEl || !scrollEl) {
|
|
2393
|
+
return;
|
|
2307
2394
|
}
|
|
2308
|
-
|
|
2395
|
+
// no grouping drag and no row header column drag
|
|
2396
|
+
if (column_service.isColGrouping(data) || data.providers.type === 'rowHeaders') {
|
|
2397
|
+
return;
|
|
2398
|
+
}
|
|
2399
|
+
const cols = this.getDimension(data.pin || 'rgCol');
|
|
2400
|
+
const gridRect = this.revogrid.getBoundingClientRect();
|
|
2401
|
+
const elRect = dataEl.getBoundingClientRect();
|
|
2402
|
+
const startItem = dimension_helpers.getItemByPosition(cols, getLeftRelative(event.x, gridRect.left, elRect.left - gridRect.left));
|
|
2403
|
+
this.staticDragData = {
|
|
2404
|
+
startPos: event.x,
|
|
2405
|
+
startItem,
|
|
2406
|
+
data,
|
|
2407
|
+
dataEl,
|
|
2408
|
+
scrollEl,
|
|
2409
|
+
gridEl: this.revogrid,
|
|
2410
|
+
cols,
|
|
2411
|
+
};
|
|
2412
|
+
this.dragData = this.getData(this.staticDragData);
|
|
2413
|
+
mousemove.target.addEventListener('mousemove', mousemove.callback);
|
|
2414
|
+
this.orderUi.start(event, Object.assign(Object.assign({}, this.dragData), this.staticDragData));
|
|
2309
2415
|
}
|
|
2310
|
-
|
|
2311
|
-
|
|
2312
|
-
* If additive - add to existing sorting, multiple columns can be sorted
|
|
2313
|
-
*/
|
|
2314
|
-
headerclick(column, index, additive) {
|
|
2315
|
-
var _a, _b;
|
|
2316
|
-
let order = this.getNextOrder(column.order);
|
|
2317
|
-
const beforeEvent = this.emit('beforesorting', { column, order, additive });
|
|
2318
|
-
if (beforeEvent.defaultPrevented) {
|
|
2416
|
+
doMove(e) {
|
|
2417
|
+
if (!this.staticDragData) {
|
|
2319
2418
|
return;
|
|
2320
2419
|
}
|
|
2321
|
-
|
|
2322
|
-
|
|
2323
|
-
// apply sort data
|
|
2324
|
-
const beforeApplyEvent = this.emit('beforesortingapply', {
|
|
2325
|
-
column: newCol,
|
|
2326
|
-
order,
|
|
2327
|
-
additive,
|
|
2328
|
-
});
|
|
2329
|
-
if (beforeApplyEvent.defaultPrevented) {
|
|
2420
|
+
const dragData = (this.dragData = this.getData(this.staticDragData));
|
|
2421
|
+
if (!dragData) {
|
|
2330
2422
|
return;
|
|
2331
2423
|
}
|
|
2332
|
-
const
|
|
2333
|
-
if (
|
|
2334
|
-
const
|
|
2335
|
-
const
|
|
2336
|
-
this.
|
|
2337
|
-
//
|
|
2338
|
-
|
|
2339
|
-
|
|
2340
|
-
delete sorting[column.prop];
|
|
2341
|
-
delete sortingFunc[column.prop];
|
|
2342
|
-
}
|
|
2343
|
-
else {
|
|
2344
|
-
sorting[column.prop] = order;
|
|
2345
|
-
sortingFunc[column.prop] = cmp;
|
|
2424
|
+
const start = this.staticDragData.startPos;
|
|
2425
|
+
if (Math.abs(start - e.x) > 10) {
|
|
2426
|
+
const x = getLeftRelative(e.x, this.dragData.gridRect.left, this.dragData.scrollOffset);
|
|
2427
|
+
const rgCol = dimension_helpers.getItemByPosition(this.staticDragData.cols, x);
|
|
2428
|
+
this.orderUi.autoscroll(x, dragData.elRect.width);
|
|
2429
|
+
// prevent position change if out of bounds
|
|
2430
|
+
if (rgCol.itemIndex >= this.staticDragData.cols.count) {
|
|
2431
|
+
return;
|
|
2346
2432
|
}
|
|
2433
|
+
this.orderUi.showHandler(rgCol.end + dragData.scrollOffset, dragData.gridRect.width);
|
|
2347
2434
|
}
|
|
2348
|
-
|
|
2349
|
-
|
|
2350
|
-
|
|
2351
|
-
|
|
2352
|
-
|
|
2435
|
+
}
|
|
2436
|
+
move(e) {
|
|
2437
|
+
headerCellRenderer.dispatch(this.revogrid, MOVE, e);
|
|
2438
|
+
// then do move
|
|
2439
|
+
this.moveFunc(e);
|
|
2440
|
+
}
|
|
2441
|
+
onMouseOut(_) {
|
|
2442
|
+
this.clearOrder();
|
|
2443
|
+
}
|
|
2444
|
+
onMouseUp(e) {
|
|
2445
|
+
// apply new positions
|
|
2446
|
+
if (this.dragData && this.staticDragData) {
|
|
2447
|
+
let relativePos = getLeftRelative(e.x, this.dragData.gridRect.left, this.dragData.scrollOffset);
|
|
2448
|
+
if (relativePos < 0) {
|
|
2449
|
+
relativePos = 0;
|
|
2353
2450
|
}
|
|
2354
|
-
|
|
2355
|
-
|
|
2356
|
-
|
|
2451
|
+
const newPosition = dimension_helpers.getItemByPosition(this.staticDragData.cols, relativePos);
|
|
2452
|
+
const store = this.providers.column.stores[this.dragData.type].store;
|
|
2453
|
+
const newItems = [...store.get('items')];
|
|
2454
|
+
// prevent position change if needed
|
|
2455
|
+
const { defaultPrevented: stopDrag } = headerCellRenderer.dispatch(this.revogrid, BEFORE_DRAG_END, Object.assign(Object.assign({}, this.staticDragData), { startPosition: this.staticDragData.startItem, newPosition, newItem: store.get('source')[newItems[this.staticDragData.startItem.itemIndex]] }));
|
|
2456
|
+
if (!stopDrag) {
|
|
2457
|
+
const prevItems = [...newItems];
|
|
2458
|
+
// todo: if move item out of group remove item from group
|
|
2459
|
+
const toMove = newItems.splice(this.staticDragData.startItem.itemIndex, 1);
|
|
2460
|
+
newItems.splice(newPosition.itemIndex, 0, ...toMove);
|
|
2461
|
+
store.set('items', newItems);
|
|
2462
|
+
this.providers.dimension.updateSizesPositionByNewDataIndexes(this.dragData.type, newItems, prevItems);
|
|
2357
2463
|
}
|
|
2464
|
+
headerCellRenderer.dispatch(this.revogrid, DRAG_END, this.dragData);
|
|
2358
2465
|
}
|
|
2359
|
-
this.
|
|
2466
|
+
this.clearOrder();
|
|
2467
|
+
}
|
|
2468
|
+
clearLocalSubscriptions() {
|
|
2469
|
+
forEach(this.localSubscriptions, ({ target, callback }, key) => target.removeEventListener(key, callback));
|
|
2470
|
+
}
|
|
2471
|
+
clearOrder() {
|
|
2472
|
+
this.staticDragData = null;
|
|
2473
|
+
this.dragData = null;
|
|
2474
|
+
this.clearLocalSubscriptions();
|
|
2475
|
+
this.orderUi.stop(this.revogrid);
|
|
2360
2476
|
}
|
|
2361
2477
|
/**
|
|
2362
|
-
*
|
|
2363
|
-
* @requires proxyItems applied to row store
|
|
2364
|
-
* @requires source applied to row store
|
|
2365
|
-
*
|
|
2366
|
-
* @param sorting - per column sorting
|
|
2367
|
-
* @param data - this.stores['rgRow'].store.get('source')
|
|
2478
|
+
* Clearing subscription
|
|
2368
2479
|
*/
|
|
2369
|
-
|
|
2370
|
-
|
|
2371
|
-
|
|
2372
|
-
this.sorting = undefined;
|
|
2373
|
-
this.sortingFunc = undefined;
|
|
2374
|
-
for (let type of types) {
|
|
2375
|
-
const storeService = this.providers.data.stores[type];
|
|
2376
|
-
// row data
|
|
2377
|
-
const source = storeService.store.get('source');
|
|
2378
|
-
// row indexes
|
|
2379
|
-
const proxyItems = storeService.store.get('proxyItems');
|
|
2380
|
-
// row indexes
|
|
2381
|
-
const newItemsOrder = Array.from({ length: source.length }, (_, i) => i); // recover indexes range(0, source.length)
|
|
2382
|
-
this.providers.dimension.updateSizesPositionByNewDataIndexes(type, newItemsOrder, proxyItems);
|
|
2383
|
-
storeService.setData({ proxyItems: newItemsOrder, source: [...source], });
|
|
2384
|
-
}
|
|
2385
|
-
}
|
|
2386
|
-
else {
|
|
2387
|
-
// set sorting
|
|
2388
|
-
this.sorting = sorting;
|
|
2389
|
-
this.sortingFunc = sortingFunc;
|
|
2390
|
-
for (let type of types) {
|
|
2391
|
-
const storeService = this.providers.data.stores[type];
|
|
2392
|
-
// row data
|
|
2393
|
-
const source = storeService.store.get('source');
|
|
2394
|
-
// row indexes
|
|
2395
|
-
const proxyItems = storeService.store.get('proxyItems');
|
|
2396
|
-
const newItemsOrder = this.sortIndexByItems([...proxyItems], source, sortingFunc);
|
|
2397
|
-
// take row indexes before trim applied and proxy items
|
|
2398
|
-
const prevItems = storeService.store.get('items');
|
|
2399
|
-
storeService.setData({
|
|
2400
|
-
proxyItems: newItemsOrder,
|
|
2401
|
-
source: [...source],
|
|
2402
|
-
});
|
|
2403
|
-
// take currently visible row indexes
|
|
2404
|
-
const newItems = storeService.store.get('items');
|
|
2405
|
-
this.providers.dimension.updateSizesPositionByNewDataIndexes(type, newItems, prevItems);
|
|
2406
|
-
}
|
|
2407
|
-
}
|
|
2408
|
-
this.emit('aftersortingapply');
|
|
2409
|
-
}
|
|
2410
|
-
defaultCellCompare(prop, a, b) {
|
|
2411
|
-
const aRaw = this.column ? column_service.getCellRaw(a, this.column) : a === null || a === void 0 ? void 0 : a[prop];
|
|
2412
|
-
const bRaw = this.column ? column_service.getCellRaw(b, this.column) : b === null || b === void 0 ? void 0 : b[prop];
|
|
2413
|
-
const av = aRaw === null || aRaw === void 0 ? void 0 : aRaw.toString().toLowerCase();
|
|
2414
|
-
const bv = bRaw === null || bRaw === void 0 ? void 0 : bRaw.toString().toLowerCase();
|
|
2415
|
-
return av == bv ? 0 : av > bv ? 1 : -1;
|
|
2480
|
+
clearSubscriptions() {
|
|
2481
|
+
super.clearSubscriptions();
|
|
2482
|
+
this.clearLocalSubscriptions();
|
|
2416
2483
|
}
|
|
2417
|
-
|
|
2418
|
-
|
|
2419
|
-
|
|
2484
|
+
getData({ gridEl, dataEl, data, }) {
|
|
2485
|
+
const gridRect = gridEl.getBoundingClientRect();
|
|
2486
|
+
const elRect = dataEl.getBoundingClientRect();
|
|
2487
|
+
const scrollOffset = elRect.left - gridRect.left;
|
|
2488
|
+
return {
|
|
2489
|
+
elRect,
|
|
2490
|
+
gridRect,
|
|
2491
|
+
type: data.pin || 'rgCol',
|
|
2492
|
+
scrollOffset,
|
|
2420
2493
|
};
|
|
2421
2494
|
}
|
|
2422
|
-
|
|
2423
|
-
|
|
2424
|
-
if (Object.entries(sortingFunc).length === 0) {
|
|
2425
|
-
// Unsorted indexes
|
|
2426
|
-
return [...Array(indexes.length).keys()];
|
|
2427
|
-
}
|
|
2428
|
-
//
|
|
2429
|
-
/**
|
|
2430
|
-
* go through all indexes and align in new order
|
|
2431
|
-
* performs a multi-level sorting by applying multiple comparison functions to determine the order of the items based on different properties.
|
|
2432
|
-
*/
|
|
2433
|
-
return indexes.sort((a, b) => {
|
|
2434
|
-
for (const [prop, cmp] of Object.entries(sortingFunc)) {
|
|
2435
|
-
const itemA = source[a];
|
|
2436
|
-
const itemB = source[b];
|
|
2437
|
-
/**
|
|
2438
|
-
* If the comparison function returns a non-zero value (sorted), it means that the items should be sorted based on the given property. In such a case, the function immediately returns the sorted value, indicating the order in which the items should be arranged.
|
|
2439
|
-
* If none of the comparison functions result in a non-zero value, indicating that the items are equal or should remain in the same order, the function eventually returns 0.
|
|
2440
|
-
*/
|
|
2441
|
-
const sorted = cmp === null || cmp === void 0 ? void 0 : cmp(prop, itemA, itemB);
|
|
2442
|
-
if (sorted) {
|
|
2443
|
-
return sorted;
|
|
2444
|
-
}
|
|
2445
|
-
}
|
|
2446
|
-
return 0;
|
|
2447
|
-
});
|
|
2448
|
-
}
|
|
2449
|
-
getNextOrder(currentOrder) {
|
|
2450
|
-
switch (currentOrder) {
|
|
2451
|
-
case undefined:
|
|
2452
|
-
return 'asc';
|
|
2453
|
-
case 'asc':
|
|
2454
|
-
return 'desc';
|
|
2455
|
-
case 'desc':
|
|
2456
|
-
return undefined;
|
|
2457
|
-
}
|
|
2495
|
+
getDimension(type) {
|
|
2496
|
+
return this.providers.dimension.stores[type].getCurrentState();
|
|
2458
2497
|
}
|
|
2459
2498
|
}
|
|
2499
|
+
function getLeftRelative(absoluteX, gridPos, offset) {
|
|
2500
|
+
return absoluteX - gridPos - offset;
|
|
2501
|
+
}
|
|
2460
2502
|
|
|
2461
2503
|
exports.AutoSizeColumnPlugin = AutoSizeColumnPlugin;
|
|
2462
2504
|
exports.BasePlugin = BasePlugin;
|
|
@@ -2481,4 +2523,4 @@ exports.isRowType = isRowType;
|
|
|
2481
2523
|
exports.isStretchPlugin = isStretchPlugin;
|
|
2482
2524
|
exports.rowTypes = rowTypes;
|
|
2483
2525
|
|
|
2484
|
-
//# sourceMappingURL=
|
|
2526
|
+
//# sourceMappingURL=column.drag.plugin-e7ee8105.js.map
|