@refinitiv-ui/efx-grid 6.0.4 → 6.0.6

package/lib/row-segmenting/es6/RowSegmenting.d.ts

@@ -10,22 +10,24 @@ declare namespace RowSegmentingPlugin {
     type SortingLogic = (rowDataA: any, rowDataB: any) => number;
 
     type Options = {
-        spanning?: boolean,
-        colorTag?: boolean,
-        cssField?: string,
+        spanning?: boolean|null,
+        colorTag?: boolean|null,
+        cssField?: string|null,
         predefinedColors?: any,
-        clicked?: ((...params: any[]) => any),
-        headerMenuClicked?: ((...params: any[]) => any),
-        segmentSeparatorBinding?: ((...params: any[]) => any),
-        nonSegmentSeparatorBinding?: ((...params: any[]) => any),
-        sortingLogic?: ((...params: any[]) => any)
+        clicked?: ((...params: any[]) => any)|null,
+        headerMenuClicked?: ((...params: any[]) => any)|null,
+        segmentSeparatorBinding?: ((...params: any[]) => any)|null,
+        nonSegmentSeparatorBinding?: ((...params: any[]) => any)|null,
+        sortingLogic?: ((...params: any[]) => any)|null,
+        rowSpanningField?: string|null,
+        segmentIdField?: string|null
     };
 
 }
 
 declare class RowSegmentingPlugin extends GridPlugin {
 
-    constructor(options?: RowSegmentingPlugin.Options);
+    constructor(options?: RowSegmentingPlugin.Options|null);
 
     public getName(): string;
 
@@ -37,52 +39,56 @@ declare class RowSegmentingPlugin extends GridPlugin {
 
     public getConfigObject(gridOptions?: any): any;
 
+    public getRowConfigObject(rowData: any, rowId: string): any;
+
     public updateHeaders(): void;
 
-    public getSegmentParentRowId(rowRef: string|number): string;
+    public getSegmentParentRowId(rowRef: string|number|null): string;
 
-    public setSegmentSeparator(rowRef: string|number, enabled?: boolean): boolean;
+    public setSegmentSeparator(rowRef: string|number|null, enabled?: boolean|null): boolean;
 
     public unsetAllSegmentSeparators(): boolean;
 
     public hasSegmentation(): boolean;
 
-    public isSegmentSeparator(rowRef: string|number): boolean;
+    public isSegmentSeparator(rowRef: string|number|null): boolean;
 
-    public collapseSegment(rowRef: string|number, collapsed?: boolean): boolean;
+    public collapseSegment(rowRef: string|number|null, collapsed?: boolean|null): boolean;
 
-    public expandSegment(rowRef: string|number, expanded?: boolean): boolean;
+    public expandSegment(rowRef: string|number|null, expanded?: boolean|null): boolean;
 
     public expandAllSegments(): boolean;
 
-    public isSegmentCollapsed(rowRef: string|number): boolean;
+    public isSegmentCollapsed(rowRef: string|number|null): boolean;
 
-    public setSegmentCollapsingLogic(func: ((...params: any[]) => any)): void;
+    public setSegmentCollapsingLogic(func: ((...params: any[]) => any)|null): void;
 
-    public fillSegment(segmentRef: string|number): void;
+    public fillSegment(segmentRef: string|number|null): void;
 
     public fillSegments(): void;
 
-    public addSegmentChild(segmentRef: string|number, rowRef: string|number): void;
+    public addSegmentChild(segmentRef: string|number|null, rowRef: string|number|null): void;
 
-    public addSegmentChildren(segmentRef: string|number, rowRefs: (string|number)[]): void;
+    public addSegmentChildren(segmentRef: string|number|null, rowRefs: (string|number)[]|null): void;
 
-    public removeSegmentChild(segmentRef: string|number, rowRef: string|number): void;
+    public removeSegmentChild(segmentRef: string|number|null, rowRef: string|number|null): void;
 
-    public removeSegmentChildren(segmentRef: string|number, rowRefs: (string|number)[]): void;
+    public removeSegmentChildren(segmentRef: string|number|null, rowRefs: (string|number)[]|null): void;
 
     public removeAllSegmentChildren(): void;
 
     public getSegmentIds(): (string)[]|null;
 
-    public getSegmentChildIds(segmentRef: string|number): (string)[]|null;
+    public getSegmentChildIds(segmentRef: string|number|null): (string)[]|null;
 
-    public setSortingLogic(sortFunction: RowSegmentingPlugin.SortingLogic): void;
+    public setSortingLogic(sortFunction: RowSegmentingPlugin.SortingLogic|null): void;
 
-    public sortSegments(sortFunction?: RowSegmentingPlugin.SortingLogic): void;
+    public sortSegments(sortFunction?: RowSegmentingPlugin.SortingLogic|null): void;
 
     public setPredefinedColors(predefinedColors: any): void;
 
+    public spanSegmentSeparator(rowRef: number|string|null, spanning: boolean|null|null): void;
+
 }
 
 export default RowSegmentingPlugin;

package/lib/row-segmenting/es6/RowSegmenting.js

@@ -16,6 +16,8 @@ import { injectCss, prettifyCss } from "../../tr-grid-util/es6/Util.js";
 * @property {Function=} segmentSeparatorBinding=null Logic that will be executed on each segment separator row
 * @property {Function=} nonSegmentSeparatorBinding=null Logic that will be executed for all non segment separator row
 * @property {Function=} sortingLogic=null Logic to be used by sortSegments method
+* @property {string=} rowSpanningField="ROW_SPANNING" selected field for apply row spanning in row separator
+* @property {string=} segmentIdField="SEGMENT_ID" selected field for set segment separator row
 */
 
 /** @callback RowSegmentingPlugin~SortingLogic
@@ -34,7 +36,6 @@ var RowSegmentingPlugin = function (options) {
 	t._onPostSectionDataBinding = t._onPostSectionDataBinding.bind(t);
 	t._updateHeader = t._updateHeader.bind(t);
 	t._onArrowClick = t._onArrowClick.bind(t);
-	t._applyInitialSegments = t._applyInitialSegments.bind(t);
 	t._rtSortingLogic = t._rtSortingLogic.bind(t);
 
 	t._hosts = [];
@@ -42,10 +43,6 @@ var RowSegmentingPlugin = function (options) {
 };
 Ext.inherits(RowSegmentingPlugin, GridPlugin);
 
-/** @type {Array.<Object>}
-* @private
-*/
-RowSegmentingPlugin.prototype.initialSegments = null;
 /** @type {RowSegmentingPlugin~SortingLogic}
 * @private
 */
@@ -74,6 +71,18 @@ RowSegmentingPlugin.prototype._colorTag = null;
 * @private
 */
 RowSegmentingPlugin.prototype._cssField = "TAG_CSS_CLASS";
+/** @type {string}
+* @private
+*/
+RowSegmentingPlugin.prototype._rowSpanningField = "ROW_SPANNING";
+/** @type {string}
+* @private
+*/
+RowSegmentingPlugin.prototype._segmentIdField = "SEGMENT_ID";
+/** @type {number}
+* @private
+*/
+RowSegmentingPlugin.prototype._runningId = 0;
 /** @type {Object}
 * @private
 */
@@ -136,8 +145,34 @@ RowSegmentingPlugin.prototype.initialize = function (host, options) {
 
 	enabled = this._headerMenuClicked;
 	RowPainter.enableHeaderMenu(host, enabled ? true : false);
+};
+/**
+ * @protected
+ * @ignore
+*/
+RowSegmentingPlugin.prototype._afterInit = function () {
+	var dv = this._getDataView();
+	if(dv) {
+		var rowIds = dv.getAllRowIds();
+		var rowCount = rowIds.length;
+		var separatorMapping = {};
+		for (var i = 0; i < rowCount; i++) {
+			var rowId = rowIds[i];
+			var rowData = this._rowGetter(dv.getRowData(rowId));
+			var segmentId = rowData[this._segmentIdField];
+			// TODO: supports collapsed and expanded for save/restore
+
+			if(segmentId != null) {
+				if(separatorMapping[segmentId] != null ) {
+					this.addSegmentChild(separatorMapping[segmentId], rowId);
+				} else {
+					separatorMapping[segmentId] = rowId;
+					this.setSegmentSeparator(rowId);
+				}
+			}
 
-	this._applyInitialSegments();
+		}
+	}
 };
 /** @public
 * @param {Object=} host core grid instance
@@ -161,9 +196,6 @@ RowSegmentingPlugin.prototype.config = function (options) {
 	var option = options.rowSegmenting;
 	if (!option) { return; }
 
-	if (option.initialSegments != null) {
-		this._initialSegments = option.initialSegments;
-	}
 	if (typeof option.sortingLogic === "function") {
 		this._userSortingLogic = option.sortingLogic;
 	}
@@ -179,6 +211,12 @@ RowSegmentingPlugin.prototype.config = function (options) {
 	if (option.cssField != null) {
 		this._cssField = option.cssField;
 	}
+	if (option.rowSpanningField != null) {
+		this._rowSpanningField = option.rowSpanningField;
+	}
+	if (option.segmentIdField != null) {
+		this._segmentIdField = option.segmentIdField;
+	}
 	if (option.predefinedColors != null && typeof option.predefinedColors === "object") {
 		this._predefinedColors = option.predefinedColors;
 	}
@@ -208,9 +246,6 @@ RowSegmentingPlugin.prototype.getConfigObject = function (gridOptions) {
 	if(!extOptions) {
 		extOptions = obj.rowSegmenting = {};
 	}
-	if(this._initialSegments) {
-		extOptions.initialSegments = this._initialSegments;
-	}
 	if(!this._spanning) {
 		extOptions.spanning = false;
 	}
@@ -223,6 +258,54 @@ RowSegmentingPlugin.prototype.getConfigObject = function (gridOptions) {
 	if(this._predefinedColors != null) {
 		extOptions.predefinedColors = this._predefinedColors;
 	}
+	if(this._rowSpanningField != "ROW_SPANNING") {
+		extOptions.rowSpanningField = this._rowSpanningField;
+	}
+	if(this._segmentIdField != "SEGMENT_ID") {
+		extOptions.segmentIdField = this._segmentIdField;
+	}
+
+	// restore runningId for spanningIdField
+	this._runningId = 0;
+
+	return obj;
+};
+
+
+/** @public
+* @param {Object} rowData row config object
+* @param {string} rowId
+* @return {!Object} return row config object with update special field data
+*/
+RowSegmentingPlugin.prototype.getRowConfigObject = function (rowData, rowId) {
+
+	var obj = rowData || {};
+
+	if(!this._segmentIdField) {
+		return obj;
+	}
+
+	if(obj.values) {
+		if(obj.values[this._segmentIdField]) {
+			delete obj.values[this._segmentIdField]; // clear only segmentIdField
+		}
+	}
+
+	if(this.isSegmentSeparator(rowId)) {
+		if(!obj.values) {
+			obj.values = {};
+		}
+		obj.values[this._segmentIdField] = ++this._runningId;
+	} else {
+		var parentId = this.getSegmentParentRowId(rowId);
+		if(parentId) {
+			if(!obj.values) {
+				obj.values = {};
+			}
+			obj.values[this._segmentIdField] = this._runningId;
+		}
+	}
+
 	return obj;
 };
 
@@ -252,12 +335,6 @@ RowSegmentingPlugin.prototype._injectStyles = function(predefinedColors) {
 	this._styleTag = injectCss(prettifyCss(css), host.getElement());
 };
 
-/** @private
-*/
-RowSegmentingPlugin.prototype._applyInitialSegments = function () {
-
-};
-
 /** @private
 * @param {Object} e
 */
@@ -339,6 +416,7 @@ RowSegmentingPlugin.prototype._updateHeader = function (settings, firstRowIndex,
 
 	var headerColumn = 0; // TODO: Header column is not always 0 as checkbox column can be added
 	var dv = settings.getDataSource();
+	var dt = dv.getDataSource();
 	var section = settings.getSection();
 	var fi = (firstRowIndex != null) ? firstRowIndex : section.getFirstIndexInView();
 	var li = (lastRowIndex != null) ? lastRowIndex : section.getLastIndexInView();
@@ -367,12 +445,18 @@ RowSegmentingPlugin.prototype._updateHeader = function (settings, firstRowIndex,
 		arg.cell = cell;
 		arg.rowIndex = r;
 		arg.rowData = this._getRow(dv, r); // Support composite and rt-grid
-
+		arg.spanning = null;
 		var rowId = arg.rowId = dv.getRowId(r); // Slow
 		var segmentSeparator = arg.segmentSeparator = dv.isSegmentSeparator(rowId);
 		arg.collapsedSegment = arg.collapsed = segmentSeparator ? dv.isSegmentCollapsed(rowId) : false;
 		var indentLevel = 0;
+
 		if (segmentSeparator) {
+			var spanning = arg.rowData[this._rowSpanningField];
+			if(spanning != null) {
+				arg.spanning = !!spanning;
+			}
+
 			if (this._predefinedColors) {
 				arg.colorTagClass = arg.rowData[cssField];
 			}
@@ -386,8 +470,7 @@ RowSegmentingPlugin.prototype._updateHeader = function (settings, firstRowIndex,
 				arg.nonGroupRow = false;
 				var parentRowData = parentRows[parentId];
 				if (!parentRowData) {
-					var parentRowIndex = dv.getRowIndex(parentId);
-					parentRowData = parentRows[parentId] = this._getRow(dv, parentRowIndex);
+					parentRowData = parentRows[parentId] = this._rowGetter(dt.getRowData(parentId)); // We need to use Datable because parent row may be hidden
 				}
 				arg.colorTagClass = parentRowData[cssField];
 			} else {
@@ -702,6 +785,24 @@ RowSegmentingPlugin.prototype.setPredefinedColors = function(predefinedColors) {
 	}
 };
 
+/** @public
+* @param {number|string} rowRef rowIndex or rowId
+* @param {boolean|null} spanning if set true when rowRef is row separator, then span that row
+*/
+RowSegmentingPlugin.prototype.spanSegmentSeparator = function(rowRef, spanning) {
+	var dv = this._getDataView();
+	if(!dv) { return; }
+
+	if(typeof rowRef === "string") {
+		rowRef = dv.getRowIndex(rowRef);
+	}
+
+	if(rowRef == null || rowRef < 0) { return; }
+
+	this._setStaticData(dv, rowRef, this._rowSpanningField, spanning);
+
+};
+
 
 
 export default RowSegmentingPlugin;