ninegrid2 6.175.0 → 6.177.0

package/dist/bundle.cjs.js

@@ -18243,7 +18243,7 @@ class ngFilterButton extends HTMLElement
 			//$(panel).offset({left: l, top: t});
 			$(panel).css({left: l, top: t});
 
-			panel.open(this.#owner, this);
+			panel.open(this);
 		}
 	};
 }
@@ -18462,14 +18462,13 @@ class ngFilterPanel extends HTMLElement
 		this.style.display = 'none';
 	};
 
-	open = (owner, filterButton) => {
+	open = (filterButton) => {
+
+		const owner = this.shadow.closest("nine-grid");
 
 		var col = filterButton.closest('th,td').dataset.col;
 		this.col = col;
 
-		//if (this.#target && this.#target.uuid == owner.uuid && this.#target.col == col && $(this).is(':visible')) {
-		if (this.#target && this.#target.col == col && $(this).is(':visible')) ;
-
 		this.#target = {
 			owner	: owner,
 			button	: filterButton,
@@ -18478,13 +18477,121 @@ class ngFilterPanel extends HTMLElement
 		};
 		
 		this.style.display = 'flex';
-		//$(this).show();
-
-		//console.log(document.shadow.querySelectorAll(this), ninegrid.j.querySelectorAll(this));
-		//ninegrid.j.querySelectorAll(this).addClass("loading");
 		this.classList.add("loading");
+
 		
-		return;
+		this.shadowRoot.querySelector("input[type=text]").value = "";
+
+		//$(this.shadowRoot).find("input[type=text]").val("");
+
+		setTimeout(() => {
+		
+			
+			var ds = [];
+			var colnms = [];
+			$(owner.template).find(`[data-col=${col}]`).each((index,el) => {
+				if (el.dataset.bind) colnms.push(el.dataset.bind);
+			});
+
+			owner.activeTmpl.querySelectorAll(`[data-col=${col}]`).forEach(el => {
+				if (el.dataset.bind) colnms.push(el.dataset.bind);
+			});
+
+			console.log(colnms);
+			
+			var data = owner.data.getValidDataNF();
+			$("ng-filter-button", owner.body).each((index,el) => {
+
+				if (el.closest('th,td').dataset.col == col || !el.filterData) return true;
+				/**
+				el.filterData.forEach(o => {
+					var idx = owner.fields.indexOf(o.colnm);
+					
+					if (idx >= 0) {
+						data = data.filter(m => { return o.data.nineBinarySearch(m.v[idx] || '') >= 0; });
+					}
+				});
+				*/
+				
+				console.log(el.filterData, el.colnms, el.dataset.bind);
+
+				el.colnms.forEach(colnm => {
+					var idx = owner.fields.indexOf(colnm);
+					
+					console.log(idx);
+
+					if (idx >= 0) {
+						data = data.filter(m => { return el.filterData.nineBinarySearch(m.v[idx] || '') >= 0; });
+					}
+				});
+				
+				//data = data.filter(rowData => { return el.filterData.findIndex(item => (item.DATA || '') == (rowData[item.COLNM] || '') ) >= 0; });
+			});
+			
+			
+			colnms = [...new Set(colnms)];
+			colnms.forEach((colnm,i) => {
+
+				ds.push({
+					LVL: 1,
+					CHK: 'N',
+					DATA2: '<span class="group">' + $(filterButton).closest('th,td').text() + (colnms.length > 1 ? ` #${i+1} (${colnm})` : '') + '</span>',
+				});
+
+				var filterData = [];
+				if (filterButton.filterData) {
+					var idx = filterButton.filterData.findIndex(item => item.colnm == colnm);
+					if (idx >= 0) {
+						filterData = filterButton.filterData[idx].data;
+					}
+				}
+
+				/**
+				var cell = $(`[data-col=${col}][data-bind=${colnm}]`, owner.template);
+				var expr = cell.attr("data-expr");
+				var exprFunc = (expr) ? owner.exprFunction(expr) : null;
+				*/
+				
+				const cell = ninegrid.j.querySelectorAll(`[data-col="${col}"][data-bind="${colnm}"]`, owner.tmpl).elem();
+				const expr = cell.getAttribute("data-expr");
+				const exprFunc = (expr) ? owner.exprFunction(expr) : null;
+
+				var data2 = [];
+				for (var rowData of data) {
+					var idx = owner.fields.indexOf(colnm);
+					
+					if (expr) {
+						var o = owner.data.conv(rowData);
+						data2.push({v:o[colnm],v2:exprFunc(o, rowData.__ng.rowidx, owner.data)});
+					}
+					else {
+						data2.push({v:rowData.v[idx],v2:rowData.v[idx]});
+					}
+				}
+
+				[...new Set(data2.sort( (a,b) => { return (a.v2||'') > (b.v2||'') ? 1 : ((a.v2||'') < (b.v2||'') ? -1 : 0); } ).map((m) => JSON.stringify(m)))].map((m) => JSON.parse(m)).forEach(o => {
+					ds.push({
+						LVL		: 2,
+						DATA	: o.v,
+						DATA2	: o.v2 || ` <span class="empty">(empty)</span> ${o.v}`,
+						COLNM	: colnm,
+						CHK		: filterData.length == 0 || filterData.nineBinarySearch(o.v || '') >= 0 ? "Y" : "N",
+					});
+				});
+			});
+			
+			var grd = this.shadowRoot.querySelector("nine-grid");
+			//grd.dataSource = ds;
+			grd.fields.add(["DATA","DATA2","COLNM"]);
+			
+			grd.data.set(ds);
+			
+			$(this.shadowRoot).find("input[type=checkbox]").prop("checked", grd.data.getValidData().filter(item => { return item.LVL == 2 && item.CHK != "Y"; }).length == 0 ? true : false);
+			
+			this.shadowRoot.querySelector("input").focus();
+			
+			ninegrid.j.querySelectorAll(this).removeClass("loading");
+		});
 	};
 }
 

package/dist/bundle.esm.js

@@ -18241,7 +18241,7 @@ class ngFilterButton extends HTMLElement
 			//$(panel).offset({left: l, top: t});
 			$(panel).css({left: l, top: t});
 
-			panel.open(this.#owner, this);
+			panel.open(this);
 		}
 	};
 }
@@ -18460,14 +18460,13 @@ class ngFilterPanel extends HTMLElement
 		this.style.display = 'none';
 	};
 
-	open = (owner, filterButton) => {
+	open = (filterButton) => {
+
+		const owner = this.shadow.closest("nine-grid");
 
 		var col = filterButton.closest('th,td').dataset.col;
 		this.col = col;
 
-		//if (this.#target && this.#target.uuid == owner.uuid && this.#target.col == col && $(this).is(':visible')) {
-		if (this.#target && this.#target.col == col && $(this).is(':visible')) ;
-
 		this.#target = {
 			owner	: owner,
 			button	: filterButton,
@@ -18476,13 +18475,121 @@ class ngFilterPanel extends HTMLElement
 		};
 		
 		this.style.display = 'flex';
-		//$(this).show();
-
-		//console.log(document.shadow.querySelectorAll(this), ninegrid.j.querySelectorAll(this));
-		//ninegrid.j.querySelectorAll(this).addClass("loading");
 		this.classList.add("loading");
+
 		
-		return;
+		this.shadowRoot.querySelector("input[type=text]").value = "";
+
+		//$(this.shadowRoot).find("input[type=text]").val("");
+
+		setTimeout(() => {
+		
+			
+			var ds = [];
+			var colnms = [];
+			$(owner.template).find(`[data-col=${col}]`).each((index,el) => {
+				if (el.dataset.bind) colnms.push(el.dataset.bind);
+			});
+
+			owner.activeTmpl.querySelectorAll(`[data-col=${col}]`).forEach(el => {
+				if (el.dataset.bind) colnms.push(el.dataset.bind);
+			});
+
+			console.log(colnms);
+			
+			var data = owner.data.getValidDataNF();
+			$("ng-filter-button", owner.body).each((index,el) => {
+
+				if (el.closest('th,td').dataset.col == col || !el.filterData) return true;
+				/**
+				el.filterData.forEach(o => {
+					var idx = owner.fields.indexOf(o.colnm);
+					
+					if (idx >= 0) {
+						data = data.filter(m => { return o.data.nineBinarySearch(m.v[idx] || '') >= 0; });
+					}
+				});
+				*/
+				
+				console.log(el.filterData, el.colnms, el.dataset.bind);
+
+				el.colnms.forEach(colnm => {
+					var idx = owner.fields.indexOf(colnm);
+					
+					console.log(idx);
+
+					if (idx >= 0) {
+						data = data.filter(m => { return el.filterData.nineBinarySearch(m.v[idx] || '') >= 0; });
+					}
+				});
+				
+				//data = data.filter(rowData => { return el.filterData.findIndex(item => (item.DATA || '') == (rowData[item.COLNM] || '') ) >= 0; });
+			});
+			
+			
+			colnms = [...new Set(colnms)];
+			colnms.forEach((colnm,i) => {
+
+				ds.push({
+					LVL: 1,
+					CHK: 'N',
+					DATA2: '<span class="group">' + $(filterButton).closest('th,td').text() + (colnms.length > 1 ? ` #${i+1} (${colnm})` : '') + '</span>',
+				});
+
+				var filterData = [];
+				if (filterButton.filterData) {
+					var idx = filterButton.filterData.findIndex(item => item.colnm == colnm);
+					if (idx >= 0) {
+						filterData = filterButton.filterData[idx].data;
+					}
+				}
+
+				/**
+				var cell = $(`[data-col=${col}][data-bind=${colnm}]`, owner.template);
+				var expr = cell.attr("data-expr");
+				var exprFunc = (expr) ? owner.exprFunction(expr) : null;
+				*/
+				
+				const cell = ninegrid.j.querySelectorAll(`[data-col="${col}"][data-bind="${colnm}"]`, owner.tmpl).elem();
+				const expr = cell.getAttribute("data-expr");
+				const exprFunc = (expr) ? owner.exprFunction(expr) : null;
+
+				var data2 = [];
+				for (var rowData of data) {
+					var idx = owner.fields.indexOf(colnm);
+					
+					if (expr) {
+						var o = owner.data.conv(rowData);
+						data2.push({v:o[colnm],v2:exprFunc(o, rowData.__ng.rowidx, owner.data)});
+					}
+					else {
+						data2.push({v:rowData.v[idx],v2:rowData.v[idx]});
+					}
+				}
+
+				[...new Set(data2.sort( (a,b) => { return (a.v2||'') > (b.v2||'') ? 1 : ((a.v2||'') < (b.v2||'') ? -1 : 0); } ).map((m) => JSON.stringify(m)))].map((m) => JSON.parse(m)).forEach(o => {
+					ds.push({
+						LVL		: 2,
+						DATA	: o.v,
+						DATA2	: o.v2 || ` <span class="empty">(empty)</span> ${o.v}`,
+						COLNM	: colnm,
+						CHK		: filterData.length == 0 || filterData.nineBinarySearch(o.v || '') >= 0 ? "Y" : "N",
+					});
+				});
+			});
+			
+			var grd = this.shadowRoot.querySelector("nine-grid");
+			//grd.dataSource = ds;
+			grd.fields.add(["DATA","DATA2","COLNM"]);
+			
+			grd.data.set(ds);
+			
+			$(this.shadowRoot).find("input[type=checkbox]").prop("checked", grd.data.getValidData().filter(item => { return item.LVL == 2 && item.CHK != "Y"; }).length == 0 ? true : false);
+			
+			this.shadowRoot.querySelector("input").focus();
+			
+			ninegrid.j.querySelectorAll(this).removeClass("loading");
+		});
 	};
 }
 

package/dist/etc/ngFiltering.js

@@ -307,7 +307,7 @@ class ngFilterButton extends HTMLElement
 			//$(panel).offset({left: l, top: t});
 			$(panel).css({left: l, top: t});
 
-			panel.open(this.#owner, this);
+			panel.open(this);
 		}
 	};
 }
@@ -528,17 +528,13 @@ class ngFilterPanel extends HTMLElement
 		this.style.display = 'none';
 	};
 
-	open = (owner, filterButton) => {
+	open = (filterButton) => {
+
+		const owner = this.shadow.closest("nine-grid");
 
 		var col = filterButton.closest('th,td').dataset.col;
 		this.col = col;
 
-		//if (this.#target && this.#target.uuid == owner.uuid && this.#target.col == col && $(this).is(':visible')) {
-		if (this.#target && this.#target.col == col && $(this).is(':visible')) {
-			//$(this).hide();
-			//return;
-		}
-
 		this.#target = {
 			owner	: owner,
 			button	: filterButton,
@@ -547,23 +543,27 @@ class ngFilterPanel extends HTMLElement
 		}
 		
 		this.style.display = 'flex';
-		//$(this).show();
-
-		//console.log(document.shadow.querySelectorAll(this), ninegrid.j.querySelectorAll(this));
-		//ninegrid.j.querySelectorAll(this).addClass("loading");
 		this.classList.add("loading");
+
 		
-		return;
+		this.shadowRoot.querySelector("input[type=text]").value = "";
 
-		$(this.shadowRoot).find("input[type=text]").val("");
+		//$(this.shadowRoot).find("input[type=text]").val("");
 
 		setTimeout(() => {
 		
+			
 			var ds = [];
 			var colnms = [];
 			$(owner.template).find(`[data-col=${col}]`).each((index,el) => {
 				if (el.dataset.bind) colnms.push(el.dataset.bind);
 			});
+
+			owner.activeTmpl.querySelectorAll(`[data-col=${col}]`).forEach(el => {
+				if (el.dataset.bind) colnms.push(el.dataset.bind);
+			});
+
+			console.log(colnms);
 			
 			var data = owner.data.getValidDataNF();
 			$("ng-filter-button", owner.body).each((index,el) => {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "ninegrid2",
   "type": "module",
-  "version": "6.175.0",
+  "version": "6.177.0",
   "main": "dist/index.js",
   "exports": {
     "import": "./dist/index.js",

package/src/etc/ngFiltering.js

@@ -307,7 +307,7 @@ class ngFilterButton extends HTMLElement
 			//$(panel).offset({left: l, top: t});
 			$(panel).css({left: l, top: t});
 
-			panel.open(this.#owner, this);
+			panel.open(this);
 		}
 	};
 }
@@ -528,17 +528,13 @@ class ngFilterPanel extends HTMLElement
 		this.style.display = 'none';
 	};
 
-	open = (owner, filterButton) => {
+	open = (filterButton) => {
+
+		const owner = this.shadow.closest("nine-grid");
 
 		var col = filterButton.closest('th,td').dataset.col;
 		this.col = col;
 
-		//if (this.#target && this.#target.uuid == owner.uuid && this.#target.col == col && $(this).is(':visible')) {
-		if (this.#target && this.#target.col == col && $(this).is(':visible')) {
-			//$(this).hide();
-			//return;
-		}
-
 		this.#target = {
 			owner	: owner,
 			button	: filterButton,
@@ -547,23 +543,27 @@ class ngFilterPanel extends HTMLElement
 		}
 		
 		this.style.display = 'flex';
-		//$(this).show();
-
-		//console.log(document.shadow.querySelectorAll(this), ninegrid.j.querySelectorAll(this));
-		//ninegrid.j.querySelectorAll(this).addClass("loading");
 		this.classList.add("loading");
+
 		
-		return;
+		this.shadowRoot.querySelector("input[type=text]").value = "";
 
-		$(this.shadowRoot).find("input[type=text]").val("");
+		//$(this.shadowRoot).find("input[type=text]").val("");
 
 		setTimeout(() => {
 		
+			
 			var ds = [];
 			var colnms = [];
 			$(owner.template).find(`[data-col=${col}]`).each((index,el) => {
 				if (el.dataset.bind) colnms.push(el.dataset.bind);
 			});
+
+			owner.activeTmpl.querySelectorAll(`[data-col=${col}]`).forEach(el => {
+				if (el.dataset.bind) colnms.push(el.dataset.bind);
+			});
+
+			console.log(colnms);
 			
 			var data = owner.data.getValidDataNF();
 			$("ng-filter-button", owner.body).each((index,el) => {