@dolusoft/vue3-datatable 1.8.50 → 1.8.51

package/dist/vue3-datatable.cjs

@@ -5259,6 +5259,75 @@ function _sfc_render(_ctx, _cache) {
   return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$3, _hoisted_3$2);
 }
 const iconFilter = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["render", _sfc_render]]);
+function parseSingleSegment(input) {
+  let value = input.trim();
+  if (value === "") return null;
+  const negated = value.startsWith("!");
+  if (negated) {
+    value = value.substring(1);
+  }
+  if (value === "" || value === "*" || /^\*+$/.test(value)) {
+    return null;
+  }
+  const startsWithStar = value.startsWith("*");
+  const endsWithStar = value.endsWith("*");
+  let condition;
+  let operatorDetected = negated;
+  if (startsWithStar && endsWithStar && value.length > 1) {
+    value = value.substring(1, value.length - 1);
+    condition = negated ? "NotContains" : "Contains";
+    operatorDetected = true;
+  } else if (endsWithStar) {
+    value = value.substring(0, value.length - 1);
+    condition = negated ? "NotContains" : "StartsWith";
+    operatorDetected = true;
+  } else if (startsWithStar) {
+    value = value.substring(1);
+    condition = negated ? "NotContains" : "EndsWith";
+    operatorDetected = true;
+  } else if (negated) {
+    condition = "NotEqual";
+  } else {
+    condition = "Equal";
+  }
+  if (value.trim() === "") {
+    return null;
+  }
+  return {
+    rule: { value: value.trim(), condition },
+    operatorDetected
+  };
+}
+function parseFilterInput(rawInput) {
+  const empty = { rules: [], displayCondition: "", isOperatorDetected: false };
+  if (!rawInput || typeof rawInput !== "string") {
+    return empty;
+  }
+  const trimmed = rawInput.trim();
+  if (trimmed === "") {
+    return empty;
+  }
+  const segments = trimmed.split(",");
+  const rules = [];
+  let anyOperatorDetected = false;
+  for (const segment of segments) {
+    const result = parseSingleSegment(segment);
+    if (result) {
+      rules.push(result.rule);
+      if (result.operatorDetected) {
+        anyOperatorDetected = true;
+      }
+    }
+  }
+  if (rules.length === 0) {
+    return empty;
+  }
+  return {
+    rules,
+    displayCondition: rules[0].condition,
+    isOperatorDetected: anyOperatorDetected
+  };
+}
 const _hoisted_1$2 = { key: "hdrrow" };
 const _hoisted_2$2 = { class: "bh-checkbox" };
 const _hoisted_3$1 = {
@@ -5474,13 +5543,29 @@ const _sfc_main$2 = /* @__PURE__ */ vue.defineComponent({
               }
               const processChange = () => {
                 debounceTimers.set(col.field, null);
-                if (column.type === "string" || column.type === "String") {
-                  column.value = isEmpty ? "" : typeof newValue === "string" ? newValue.trim() : newValue;
+                if (isEmpty) {
+                  column.value = "";
+                  column.parsedFilterRules = void 0;
+                  emit("filterChange");
+                  return;
+                }
+                if ((column.type === "string" || column.type === "String") && typeof newValue === "string") {
+                  const parsed = parseFilterInput(newValue);
+                  if (parsed.isOperatorDetected && parsed.rules.length > 0) {
+                    column.value = parsed.rules[0].value;
+                    column.condition = parsed.rules[0].condition;
+                    columnConditions.value[col.field] = parsed.rules[0].condition;
+                    column.parsedFilterRules = parsed.rules.length > 1 ? parsed.rules : void 0;
+                    emit("filterChange");
+                    return;
+                  }
+                  column.value = newValue.trim();
+                  column.parsedFilterRules = void 0;
                 } else {
-                  column.value = isEmpty ? "" : newValue;
+                  column.value = newValue;
+                  column.parsedFilterRules = void 0;
                 }
-                if (isEmpty) ;
-                else if (!columnConditions.value[col.field]) {
+                if (!columnConditions.value[col.field]) {
                   column.condition = "Equal";
                   columnConditions.value[col.field] = "Equal";
                 } else {
@@ -5539,6 +5624,7 @@ const _sfc_main$2 = /* @__PURE__ */ vue.defineComponent({
           if (col.filter) {
             col.value = "";
             col.condition = "";
+            col.parsedFilterRules = void 0;
           }
         });
       }
@@ -5637,13 +5723,20 @@ const _sfc_main$2 = /* @__PURE__ */ vue.defineComponent({
       const type = ((_a = col.type) == null ? void 0 : _a.toLowerCase()) || "string";
       const conditions = FILTER_CONDITIONS[type] || FILTER_CONDITIONS.string;
       const found = conditions.find((c2) => c2.value === condition);
+      let label = "";
       if (found) {
         if (props.columnFilterLang && props.columnFilterLang[condition]) {
-          return props.columnFilterLang[condition];
+          label = props.columnFilterLang[condition];
+        } else {
+          label = found.label;
         }
-        return found.label;
+      } else {
+        label = condition;
+      }
+      if (col.parsedFilterRules && col.parsedFilterRules.length > 1) {
+        label += ` (${col.parsedFilterRules.length})`;
       }
-      return condition;
+      return label;
     };
     const handleConditionChange = (field, condition) => {
       const column = columnsMap.value.get(field);
@@ -5657,6 +5750,7 @@ const _sfc_main$2 = /* @__PURE__ */ vue.defineComponent({
       filterInputs.value[col.field] = "";
       col.value = "";
       col.condition = "";
+      col.parsedFilterRules = void 0;
       columnConditions.value[col.field] = "";
       if (props.currentSortColumn === col.field) {
         emit("sortChange", props.all.sortColumn || col.field, "asc");
@@ -6661,6 +6755,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
         if (column) {
           column.value = value;
           column.condition = condition || "Equal";
+          column.parsedFilterRules = void 0;
           filterUpdateTrigger.value++;
           updateHasAnyActiveFilter();
           if (triggerFilter) {
@@ -6951,6 +7046,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
       selectAll(false);
       for (let i2 = 0; i2 < props.columns.length; i2++) {
         props.columns[i2].value = "";
+        props.columns[i2].parsedFilterRules = void 0;
       }
       currentSearch.value = "";
       currentPageSize.value = oldPageSize;
@@ -7011,6 +7107,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
         if (col.filter) {
           col.value = "";
           col.condition = "";
+          col.parsedFilterRules = void 0;
         }
       }
       updateHasAnyActiveFilter();

package/dist/vue3-datatable.js

@@ -5258,6 +5258,75 @@ function _sfc_render(_ctx, _cache) {
   return openBlock(), createElementBlock("svg", _hoisted_1$3, _hoisted_3$2);
 }
 const iconFilter = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["render", _sfc_render]]);
+function parseSingleSegment(input) {
+  let value = input.trim();
+  if (value === "") return null;
+  const negated = value.startsWith("!");
+  if (negated) {
+    value = value.substring(1);
+  }
+  if (value === "" || value === "*" || /^\*+$/.test(value)) {
+    return null;
+  }
+  const startsWithStar = value.startsWith("*");
+  const endsWithStar = value.endsWith("*");
+  let condition;
+  let operatorDetected = negated;
+  if (startsWithStar && endsWithStar && value.length > 1) {
+    value = value.substring(1, value.length - 1);
+    condition = negated ? "NotContains" : "Contains";
+    operatorDetected = true;
+  } else if (endsWithStar) {
+    value = value.substring(0, value.length - 1);
+    condition = negated ? "NotContains" : "StartsWith";
+    operatorDetected = true;
+  } else if (startsWithStar) {
+    value = value.substring(1);
+    condition = negated ? "NotContains" : "EndsWith";
+    operatorDetected = true;
+  } else if (negated) {
+    condition = "NotEqual";
+  } else {
+    condition = "Equal";
+  }
+  if (value.trim() === "") {
+    return null;
+  }
+  return {
+    rule: { value: value.trim(), condition },
+    operatorDetected
+  };
+}
+function parseFilterInput(rawInput) {
+  const empty = { rules: [], displayCondition: "", isOperatorDetected: false };
+  if (!rawInput || typeof rawInput !== "string") {
+    return empty;
+  }
+  const trimmed = rawInput.trim();
+  if (trimmed === "") {
+    return empty;
+  }
+  const segments = trimmed.split(",");
+  const rules = [];
+  let anyOperatorDetected = false;
+  for (const segment of segments) {
+    const result = parseSingleSegment(segment);
+    if (result) {
+      rules.push(result.rule);
+      if (result.operatorDetected) {
+        anyOperatorDetected = true;
+      }
+    }
+  }
+  if (rules.length === 0) {
+    return empty;
+  }
+  return {
+    rules,
+    displayCondition: rules[0].condition,
+    isOperatorDetected: anyOperatorDetected
+  };
+}
 const _hoisted_1$2 = { key: "hdrrow" };
 const _hoisted_2$2 = { class: "bh-checkbox" };
 const _hoisted_3$1 = {
@@ -5473,13 +5542,29 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
               }
               const processChange = () => {
                 debounceTimers.set(col.field, null);
-                if (column.type === "string" || column.type === "String") {
-                  column.value = isEmpty ? "" : typeof newValue === "string" ? newValue.trim() : newValue;
+                if (isEmpty) {
+                  column.value = "";
+                  column.parsedFilterRules = void 0;
+                  emit("filterChange");
+                  return;
+                }
+                if ((column.type === "string" || column.type === "String") && typeof newValue === "string") {
+                  const parsed = parseFilterInput(newValue);
+                  if (parsed.isOperatorDetected && parsed.rules.length > 0) {
+                    column.value = parsed.rules[0].value;
+                    column.condition = parsed.rules[0].condition;
+                    columnConditions.value[col.field] = parsed.rules[0].condition;
+                    column.parsedFilterRules = parsed.rules.length > 1 ? parsed.rules : void 0;
+                    emit("filterChange");
+                    return;
+                  }
+                  column.value = newValue.trim();
+                  column.parsedFilterRules = void 0;
                 } else {
-                  column.value = isEmpty ? "" : newValue;
+                  column.value = newValue;
+                  column.parsedFilterRules = void 0;
                 }
-                if (isEmpty) ;
-                else if (!columnConditions.value[col.field]) {
+                if (!columnConditions.value[col.field]) {
                   column.condition = "Equal";
                   columnConditions.value[col.field] = "Equal";
                 } else {
@@ -5538,6 +5623,7 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
           if (col.filter) {
             col.value = "";
             col.condition = "";
+            col.parsedFilterRules = void 0;
           }
         });
       }
@@ -5636,13 +5722,20 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
       const type = ((_a = col.type) == null ? void 0 : _a.toLowerCase()) || "string";
       const conditions = FILTER_CONDITIONS[type] || FILTER_CONDITIONS.string;
       const found = conditions.find((c2) => c2.value === condition);
+      let label = "";
       if (found) {
         if (props.columnFilterLang && props.columnFilterLang[condition]) {
-          return props.columnFilterLang[condition];
+          label = props.columnFilterLang[condition];
+        } else {
+          label = found.label;
         }
-        return found.label;
+      } else {
+        label = condition;
+      }
+      if (col.parsedFilterRules && col.parsedFilterRules.length > 1) {
+        label += ` (${col.parsedFilterRules.length})`;
       }
-      return condition;
+      return label;
     };
     const handleConditionChange = (field, condition) => {
       const column = columnsMap.value.get(field);
@@ -5656,6 +5749,7 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
       filterInputs.value[col.field] = "";
       col.value = "";
       col.condition = "";
+      col.parsedFilterRules = void 0;
       columnConditions.value[col.field] = "";
       if (props.currentSortColumn === col.field) {
         emit("sortChange", props.all.sortColumn || col.field, "asc");
@@ -6660,6 +6754,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         if (column) {
           column.value = value;
           column.condition = condition || "Equal";
+          column.parsedFilterRules = void 0;
           filterUpdateTrigger.value++;
           updateHasAnyActiveFilter();
           if (triggerFilter) {
@@ -6950,6 +7045,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       selectAll(false);
       for (let i2 = 0; i2 < props.columns.length; i2++) {
         props.columns[i2].value = "";
+        props.columns[i2].parsedFilterRules = void 0;
       }
       currentSearch.value = "";
       currentPageSize.value = oldPageSize;
@@ -7010,6 +7106,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         if (col.filter) {
           col.value = "";
           col.condition = "";
+          col.parsedFilterRules = void 0;
         }
       }
       updateHasAnyActiveFilter();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dolusoft/vue3-datatable",
-  "version": "1.8.50",
+  "version": "1.8.51",
   "description": "Vue3 Datatable - fully customizable & easy to use datatable library",
   "private": false,
   "type": "module",