126 lines
3.5 KiB
JavaScript
126 lines
3.5 KiB
JavaScript
import React, { useEffect, useState } from "react";
|
|
import { getSession } from "../../../../Services/Others";
|
|
import { useDispatch } from "react-redux";
|
|
import {
|
|
getmultipleSearch,
|
|
PostProductSearch,
|
|
} from "../../../../Features/BookingScreen/BookingData/BookingData";
|
|
import Buttons from "../../../../Components/Forms/Buttons";
|
|
|
|
const MultipleSearch = ({ close }) => {
|
|
const CompId = getSession("CompId");
|
|
const BranchId = getSession("BranchId");
|
|
const AppId = getSession("AppId");
|
|
const dispatch = useDispatch();
|
|
|
|
const options = [
|
|
{ label: "Product Name", value: "ProdName" },
|
|
{ label: "Product Variant Name", value: "ProdVariantName" },
|
|
// { label: "Product ID", value: "ProdId" },
|
|
{ label: "One Piece QR", value: "OnePcQR" },
|
|
{ label: "QR Code", value: "QrCode" },
|
|
{ label: "Product Name Code", value: "ProdNameCode" },
|
|
{ label: "Category Name", value: "CategoryName" },
|
|
{ label: "Sub Category Name", value: "SubCategoryName" },
|
|
{ label: "Brand Name", value: "BrandName" },
|
|
];
|
|
|
|
const [selectedValues, setSelectedValues] = useState([]);
|
|
console.log(selectedValues, "selectedValuesselectedValues");
|
|
|
|
useEffect(() => {
|
|
GetmultipleSearchData();
|
|
}, []);
|
|
|
|
const postMultipleSearch = async () => {
|
|
if (selectedValues.length === 0) {
|
|
alert("Please select at least one option!");
|
|
return;
|
|
}
|
|
const data = {
|
|
CompId: CompId,
|
|
BranchId: BranchId,
|
|
AppId: AppId,
|
|
SearchTerms: selectedValues,
|
|
};
|
|
try {
|
|
const response = await dispatch(PostProductSearch(data)).unwrap();
|
|
console.log("Search Response:", response);
|
|
if (response?.data?.statusCode == 1) {
|
|
setSelectedValues("");
|
|
close(false);
|
|
}
|
|
} catch (error) {
|
|
console.error("Search Error:", error);
|
|
}
|
|
};
|
|
|
|
const GetmultipleSearchData = async () => {
|
|
const data = {
|
|
AppId,
|
|
CompId,
|
|
BranchId,
|
|
};
|
|
|
|
try {
|
|
const response = await dispatch(getmultipleSearch(data)).unwrap();
|
|
|
|
if (response?.data?.statusCode === 1) {
|
|
const selected =
|
|
response?.data?.data?.[0]?.SearchTermDtl?.map(
|
|
(item) => item?.SearchTerm,
|
|
) || [];
|
|
|
|
setSelectedValues(selected);
|
|
}
|
|
} catch (error) {
|
|
console.error("Get Search Terms Error:", error);
|
|
}
|
|
};
|
|
|
|
return (
|
|
<>
|
|
<div
|
|
style={{ fontFamily: "Poppins", fontWeight: "500", marginTop: "10px" }}
|
|
>
|
|
{options.map((item) => (
|
|
<label
|
|
key={item.value}
|
|
style={{
|
|
display: "block",
|
|
marginBottom: "6px",
|
|
cursor: "pointer",
|
|
fontSize: "14px",
|
|
color: "#333",
|
|
margin: "6px 0",
|
|
}}
|
|
>
|
|
<input
|
|
type="checkbox"
|
|
checked={selectedValues.includes(item.value)}
|
|
onChange={() => {
|
|
setSelectedValues((prev) =>
|
|
prev.includes(item.value)
|
|
? prev.filter((i) => i !== item.value)
|
|
: [...prev, item.value],
|
|
);
|
|
}}
|
|
style={{ marginRight: "8px" }}
|
|
/>
|
|
{item.label}
|
|
</label>
|
|
))}
|
|
</div>
|
|
<div style={{ display: "flex", width: "100%", marginTop: "2rem" }}>
|
|
<Buttons
|
|
buttonText={"Submit"}
|
|
handleSubmit={postMultipleSearch}
|
|
color="901D77"
|
|
/>
|
|
</div>
|
|
</>
|
|
);
|
|
};
|
|
|
|
export default MultipleSearch;
|