ui-soxo-bootstrap-core 2.6.1-dev.10 → 2.6.1-dev.11

package/core/modules/reporting/components/reporting-dashboard/adavance-search/advance-search.js

@@ -1,5 +1,124 @@
 
 
+// import React, { useState, useEffect, useRef } from "react";
+// import { Select, Checkbox, Input, Spin } from "antd";
+// import { CoreScripts } from "../../../../../models";
+
+// const { Search } = Input;
+
+// export default function AdvancedSearchSelect({ field, value = [], onChange }) {
+//   const [searchResults, setSearchResults] = useState([]); // only API results
+//   const [selectedItems, setSelectedItems] = useState(value); // persisted selections
+//   const [loading, setLoading] = useState(false);
+//   const debounceRef = useRef(null);
+
+//   // Sync selectedItems if parent value changes externally
+//   useEffect(() => {
+//     setSelectedItems(value);
+//   }, [value]);
+
+//   const loadOptions = async (searchText = "") => {
+//     try {
+//       setLoading(true);
+
+//       let query = field?.search_query || "";
+//       query = query.replace("@search_text;", searchText || "");
+
+//       const res = await CoreScripts.getQuery({ script: query });
+//       const data = Array.isArray(res) ? res[0] : [];
+//       const apiValues = data?.map((r) => r[field.field]) || [];
+
+//       setSearchResults(apiValues);
+//     } catch (error) {
+//       console.error("Search API error", error);
+//     } finally {
+//       setLoading(false);
+//     }
+//   };
+
+//   useEffect(() => {
+//     loadOptions("");
+//   }, [field]);
+
+//   const handleSearch = (text) => {
+//     if (debounceRef.current) clearTimeout(debounceRef.current);
+//     debounceRef.current = setTimeout(() => loadOptions(text), 400);
+//   };
+
+//   const toggleValue = (checked, item) => {
+//     let newValues;
+
+//     if (checked) {
+//       newValues = [...selectedItems, item];
+//     } else {
+//       newValues = selectedItems.filter((v) => v !== item);
+//     }
+
+//     setSelectedItems(newValues); // update local persisted state immediately
+//     onChange(newValues);
+//   };
+
+//   // Merge: selected items always on top, then search results (excluding already selected)
+//   const displayOptions = [
+//     ...selectedItems,
+//     ...searchResults.filter((item) => !selectedItems.includes(item)),
+//   ];
+
+//   return (
+//     <Select
+//       mode="multiple"
+//       value={value}
+//       style={{ width: 250 }}
+//       placeholder={field.caption}
+//       allowClear
+//       maxTagCount={0}
+//       onChange={onChange}
+//       maxTagPlaceholder={() => (
+//         <span style={{ display: "flex", alignItems: "center", gap: 8 }}>
+//           {field.caption}
+//           <span
+//             style={{
+//               background: "#e6f0ff",
+//               color: "#1677ff",
+//               borderRadius: "10px",
+//               padding: "0 8px",
+//               fontWeight: 600,
+//               fontSize: 12,
+//             }}
+//           >
+//             {value?.length || 0}
+//           </span>
+//         </span>
+//       )}
+//       dropdownRender={() => (
+//         <div style={{ padding: 10 }}>
+//           <Search
+//             placeholder={`Search ${field.caption}`}
+//             onChange={(e) => handleSearch(e.target.value)}
+//           />
+
+//           <div style={{ maxHeight: 200, overflowY: "auto", marginTop: 10 }}>
+//             {loading ? (
+//               <Spin />
+//             ) : (
+//               displayOptions.map((item) => (
+//                 <div key={item} style={{ marginBottom: 6 }}>
+//                   <Checkbox
+//                     checked={selectedItems.includes(item)}
+//                     onChange={(e) => toggleValue(e.target.checked, item)}
+//                   >
+//                     {item}
+//                   </Checkbox>
+//                 </div>
+//               ))
+//             )}
+//           </div>
+//         </div>
+//       )}
+//     />
+//   );
+// }
+
 import React, { useState, useEffect, useRef } from "react";
 import { Select, Checkbox, Input, Spin } from "antd";
 import { CoreScripts } from "../../../../../models";
@@ -54,11 +173,16 @@ export default function AdvancedSearchSelect({ field, value = [], onChange }) {
       newValues = selectedItems.filter((v) => v !== item);
     }
 
-    setSelectedItems(newValues); // update local persisted state immediately
+    setSelectedItems(newValues);
     onChange(newValues);
   };
 
-  // Merge: selected items always on top, then search results (excluding already selected)
+  const handleReset = () => {
+    setSelectedItems([]);
+    onChange([]);
+  };
+
+  // Merge: selected items always on top, then search results
   const displayOptions = [
     ...selectedItems,
     ...searchResults.filter((item) => !selectedItems.includes(item)),
@@ -113,6 +237,28 @@ export default function AdvancedSearchSelect({ field, value = [], onChange }) {
               ))
             )}
           </div>
+
+          {/* Reset Button */}
+          <div
+            style={{
+              display: "flex",
+              justifyContent: "flex-end",
+              marginTop: 10,
+              borderTop: "1px solid #f0f0f0",
+              paddingTop: 8,
+            }}
+          >
+            <span
+              style={{
+                color: "#1677ff",
+                cursor: "pointer",
+                fontWeight: 500,
+              }}
+              onClick={handleReset}
+            >
+              Reset
+            </span>
+          </div>
         </div>
       )}
     />

package/core/modules/reporting/components/reporting-dashboard/reporting-dashboard.js

@@ -173,7 +173,7 @@ export default function ReportingDashboard({
     parameters = record.input_parameters ? JSON.parse(record.input_parameters) : null;
 
     let formContent = {};
-    const searchFields = parameters.filter((p) => p.type === 'search');
+    const searchFields = parameters.filter((p) => p.type === 'search' && p.search_enabled === 'yes');
     setSearchParameters([...searchFields]);
 
     parameters = await parameters?.map((record) => {
@@ -345,170 +345,241 @@ export default function ReportingDashboard({
   };
 
   /**
-   * 
-   * @param {*} searchValues 
-   * @param {*} searchParameters 
-   * @returns 
+   *
+   * @param {*} searchValues
+   * @param {*} searchParameters
+   * @returns
    */
   const buildSearchCondition = (searchValues, searchParameters) => {
-  let searchCondition = "";
-
-  Object.keys(searchValues).forEach((key) => {
-    const arr = searchValues[key];
-    if (!Array.isArray(arr) || arr.length === 0) return;
-
-    const param = searchParameters.find((p) => p.field === key);
-    if (!param) return;
-
-    const operator = (param.search_operator || "").trim().toUpperCase();
-    const column = param.db_column || key;
-
-    if (operator === "LIKE") {
-      const likeConditions = arr
-        .map((v) => `${column} LIKE '${v}'`)
-        .join(" OR ");
-      searchCondition += ` AND (${likeConditions})`;
-    }
-
-    else if (operator === "IN") {
-      const valueList = arr.map((v) => `'${v}'`).join(",");
-      searchCondition += ` AND ${column} IN (${valueList})`;
-    }
-
-    else if (operator === "=") {
-      const eqConditions = arr
-        .map((v) => `${column} = '${v}'`)
-        .join(" OR ");
-      searchCondition += ` AND (${eqConditions})`;
-    }
+    let searchCondition = '';
+
+    Object.keys(searchValues).forEach((key) => {
+      const arr = searchValues[key];
+      if (!Array.isArray(arr) || arr.length === 0) return;
+
+      const param = searchParameters.find((p) => p.field === key);
+      if (!param) return;
+
+      const operator = (param.search_operator || '').trim().toUpperCase();
+      const column = param.db_column || key;
+
+      if (operator === 'LIKE') {
+        const likeConditions = arr.map((v) => `${column} LIKE '${v}'`).join(' OR ');
+        searchCondition += ` AND (${likeConditions})`;
+      } else if (operator === 'IN') {
+        const valueList = arr.map((v) => `'${v}'`).join(',');
+        searchCondition += ` AND ${column} IN (${valueList})`;
+      } else if (operator === '=') {
+        const eqConditions = arr.map((v) => `${column} = '${v}'`).join(' OR ');
+        searchCondition += ` AND (${eqConditions})`;
+      } else if (operator === '!=') {
+        const neqConditions = arr.map((v) => `${column} != '${v}'`).join(' AND ');
+        searchCondition += ` AND (${neqConditions})`;
+      } else {
+        // fallback for other operators like > < >= <=
+        const conditions = arr.map((v) => `${column} ${operator} '${v}'`).join(' OR ');
+        searchCondition += ` AND (${conditions})`;
+      }
+    });
 
-    else if (operator === "!=") {
-      const neqConditions = arr
-        .map((v) => `${column} != '${v}'`)
-        .join(" AND ");
-      searchCondition += ` AND (${neqConditions})`;
+    return searchCondition;
+  };
+  // const handleSubmit = (values) => {
+  //     const hasSearchValues = Object.values(searchValues).some((v) => Array.isArray(v) && v.length > 0);
+
+  //     // Check if regular form values have changed since the last submission.
+  //     const regularValuesChanged = (() => {
+  //       const newKeys = Object.keys(values);
+  //       const oldKeys = Object.keys(formContents);
+
+  //       if (newKeys.length !== oldKeys.length) return true;
+
+  //       for (const key of newKeys) {
+  //         const newValue = values[key];
+  //         const oldValue = formContents[key];
+
+  //         if (moment.isMoment(newValue) && moment.isMoment(oldValue)) {
+  //           if (!newValue.isSame(oldValue)) {
+  //             return true;
+  //           }
+  //         } else if (newValue !== oldValue) {
+  //           // This is a shallow comparison, but should work for primitives and new array/object references.
+  //           return true;
+  //         }
+  //       }
+  //       return false;
+  //     })();
+
+  //     if (hasSearchValues && regularValuesChanged) {
+  //       Modal.confirm({
+  //         title: 'Combine Filters',
+  //         content: 'You have applied both standard and advanced filters. Do you want to combine them?',
+  //         okText: 'Yes, Apply Both',
+  //         cancelText: 'No, Use Advanced Only',
+  //         onOk: () => {
+  //           // User chose to combine filters.
+  //           const searchCondition = buildSearchCondition(searchValues, searchParameters);
+  //           const finalValues = {
+  //             ...values,
+  //             search_condition: searchCondition,
+  //           };
+  //           onFinish(finalValues, 1);
+  //         },
+  //         onCancel: () => {
+  //           // User chose to use only advanced search.
+  //           const searchCondition = buildSearchCondition(searchValues, searchParameters);
+  //           const resetValues = {};
+  //           Object.keys(values).forEach((key) => {
+  //             resetValues[key] = null;
+  //           });
+  //           const finalValues = {
+  //             ...resetValues,
+  //             search_condition: searchCondition,
+  //           };
+  //           onFinish(finalValues, 1);
+  //         },
+  //       });
+  //       return; // Stop further execution, wait for modal response.
+  //     }
+
+  //     // --- Default behavior if the condition for the modal is not met ---
+
+  //     let finalValues = values;
+  //     if (hasSearchValues) {
+  //       // If only advanced search has values (or regular filters haven't changed), reset regular filters.
+  //       const searchCondition = buildSearchCondition(searchValues, searchParameters);
+  //       const resetValues = {};
+  //       Object.keys(values).forEach((key) => {
+  //         resetValues[key] = null;
+  //       });
+  //       finalValues = {
+  //         ...resetValues,
+  //         search_condition: searchCondition,
+  //       };
+  //     }
+
+  //     const { pageSize } = pagination;
+  //     const resetPage = 1;
+
+  //     scriptId.current = null;
+
+  //     // Update URL only when NOT using advanced search
+  //     if (!hasSearchValues) {
+  //       const currentUrlParams = Location.search();
+  //       const { script_id, selected_card, ...cleanParams } = currentUrlParams;
+
+  //       const newParams = new URLSearchParams({
+  //         ...cleanParams,
+  //         current: resetPage,
+  //         pageSize,
+  //       });
+
+  //       const newUrl = `${window.location.pathname}?${newParams.toString()}`;
+  //       window.history.replaceState({}, '', newUrl);
+  //     }
+
+  //     // Call report API
+  //     onFinish(finalValues, resetPage);
+  //   };
+
+  const handleSubmit = (values) => {
+    const hasSearchValues = Object.values(searchValues).some((v) => Array.isArray(v) && v.length > 0);
+
+    if (!hasSearchValues) {
+      runSubmit(values);
+      return;
     }
 
-    else {
-      // fallback for other operators like > < >= <=
-      const conditions = arr
-        .map((v) => `${column} ${operator} '${v}'`)
-        .join(" OR ");
-      searchCondition += ` AND (${conditions})`;
-    }
-  });
+    // Check if form values changed (date or others)
+    const formChanged = Object.keys(values).some((key) => {
+      const newVal = values[key];
+      const oldVal = formContents[key];
 
-  return searchCondition;
-};
-const handleSubmit = (values) => {
+      if (moment.isMoment(newVal) && moment.isMoment(oldVal)) {
+        return !newVal.isSame(oldVal, 'day');
+      }
 
-  const hasSearchValues = Object.values(searchValues).some(
-    (v) => Array.isArray(v) && v.length > 0
-  );
+      return newVal !== oldVal;
+    });
 
-  let finalValues = values;
+    if (formChanged) {
+      Modal.confirm({
+        title: 'Filters changed',
+        content: 'You changed some filters. Do you want to search using these filters also?',
+        okText: 'Yes',
+        cancelText: 'No',
 
-  if (hasSearchValues) {
+        onOk() {
+          // YES → send form values + search condition
+          const searchCondition = buildSearchCondition(searchValues, searchParameters);
 
-    const searchCondition = buildSearchCondition(
-      searchValues,
-      searchParameters
-    );
+          const finalValues = {
+            ...values,
+            search_condition: searchCondition,
+          };
 
-    const resetValues = {};
-    Object.keys(values).forEach((key) => {
-      resetValues[key] = null;
-    });
+          runSubmit(finalValues);
+        },
 
-    finalValues = {
-      ...resetValues,
-      search_condition: searchCondition,
-    };
-  }
+        onCancel() {
+          // NO → reset form values
+          const searchCondition = buildSearchCondition(searchValues, searchParameters);
 
-  const { pageSize } = pagination;
-  const resetPage = 1;
+          const resetValues = {};
+          Object.keys(values).forEach((key) => {
+            resetValues[key] = null;
+          });
 
-  scriptId.current = null;
+          const finalValues = {
+            ...resetValues,
+            search_condition: searchCondition,
+          };
 
-  if (!hasSearchValues) {
-    const currentUrlParams = Location.search();
-    const { script_id, selected_card, ...cleanParams } = currentUrlParams;
+          runSubmit(finalValues);
+        },
+      });
+    } else {
+      // no form change
+      const searchCondition = buildSearchCondition(searchValues, searchParameters);
 
-    const newParams = new URLSearchParams({
-      ...cleanParams,
-      current: resetPage,
-      pageSize,
-    });
+      const resetValues = {};
+      Object.keys(values).forEach((key) => {
+        resetValues[key] = null;
+      });
 
-    const newUrl = `${window.location.pathname}?${newParams.toString()}`;
-    window.history.replaceState({}, "", newUrl);
-  }
+      const finalValues = {
+        ...resetValues,
+        search_condition: searchCondition,
+      };
 
-  onFinish(finalValues, resetPage);
-};
-  // const handleSubmit = (values) => {
+      runSubmit(finalValues);
+    }
+  };
 
-  //   // Check if any advanced search value exists
-  //   const hasSearchValues = Object.values(searchValues).some((v) => Array.isArray(v) && v.length > 0);
-
-  //   let finalValues = values;
-  //   let searchCondition = '';
-  //   if (hasSearchValues) {
-  //     Object.keys(searchValues).forEach((key) => {
-  //       const arr = searchValues[key];
-  //       if (!Array.isArray(arr) || arr.length === 0) return;
-
-  //       // Find input parameter configuration
-  //       const param = searchParameters.find((p) => p.field === key);
-  //       if (!param) return;
-
-  //       const operator = (param.search_operator || '').trim(); // LIKE / IN / =
-  //       const column = param.db_column || key; // DB column mapping if available
-
-  //       // Build value list
-  //       const valueList = arr.map((v) => `'${v}'`).join(',');
-
-  //       // Build SQL condition dynamically
-  //       searchCondition += ` AND ${column} ${operator} (${valueList})`;
-  //     });
-
-  //     // Reset normal form parameters
-  //     const resetValues = {};
-  //     Object.keys(values).forEach((key) => {
-  //       resetValues[key] = null;
-  //     });
-
-  //     // Final values sent to API
-  //     finalValues = {
-  //       ...resetValues,
-  //       search_condition: searchCondition,
-  //     };
-  //   }
+  const runSubmit = (finalValues) => {
+    const { pageSize } = pagination;
+    const resetPage = 1;
 
-  //   const { pageSize } = pagination;
-  //   const resetPage = 1;
+    scriptId.current = null;
 
-  //   scriptId.current = null;
+    const hasSearchValues = finalValues.search_condition;
 
-  //   // Update URL only when NOT using advanced search
-  //   if (!hasSearchValues) {
-  //     const currentUrlParams = Location.search();
-  //     const { script_id, selected_card, ...cleanParams } = currentUrlParams;
+    if (!hasSearchValues) {
+      const currentUrlParams = Location.search();
+      const { script_id, selected_card, ...cleanParams } = currentUrlParams;
 
-  //     const newParams = new URLSearchParams({
-  //       ...cleanParams,
-  //       current: resetPage,
-  //       pageSize,
-  //     });
+      const newParams = new URLSearchParams({
+        ...cleanParams,
+        current: resetPage,
+        pageSize,
+      });
 
-  //     const newUrl = `${window.location.pathname}?${newParams.toString()}`;
-  //     window.history.replaceState({}, '', newUrl);
-  //   }
+      const newUrl = `${window.location.pathname}?${newParams.toString()}`;
+      window.history.replaceState({}, '', newUrl);
+    }
 
-  //   // Call report API
-  //   onFinish(finalValues, resetPage);
-  // };
+    onFinish(finalValues, resetPage);
+  };
   /**
    *
    * @param {*} values

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ui-soxo-bootstrap-core",
-  "version": "2.6.1-dev.10",
+  "version": "2.6.1-dev.11",
   "description": "All the Core Components for you to start",
   "keywords": [
     "all in one"