TaxInvoice Printer Design Issue'

src/Pages/BookingScreen/Components/UtillComponents/MultipleSearch.jsx

@@ -1,126 +1,125 @@
 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 {
+  getmultipleSearch,
+  PostProductSearch,
+} from "../../../../Features/BookingScreen/BookingData/BookingData";
 import Buttons from "../../../../Components/Forms/Buttons";
 
-
 const MultipleSearch = ({ close }) => {
-    const CompId = getSession("CompId");
+  const CompId = getSession("CompId");
-    const BranchId = getSession("BranchId");
+  const BranchId = getSession("BranchId");
-    const AppId = getSession("AppId");
+  const AppId = getSession("AppId");
-    const dispatch = useDispatch();
+  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 options = [
+  const [selectedValues, setSelectedValues] = useState([]);
-        { label: "Product Name", value: "ProdName" },
+  console.log(selectedValues, "selectedValuesselectedValues");
-        { 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" },
-    ];
 
+  useEffect(() => {
+    GetmultipleSearchData();
+  }, []);
 
-    const [selectedValues, setSelectedValues] = useState([]);
+  const postMultipleSearch = async () => {
-    console.log(selectedValues, 'selectedValuesselectedValues');
+    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);
+    }
+  };
 
-    useEffect(() => {
+  const GetmultipleSearchData = async () => {
-        GetmultipleSearchData();
+    const data = {
-    }, []);
+      AppId,
-
+      CompId,
-
+      BranchId,
-    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);
-        }
     };
 
+    try {
+      const response = await dispatch(getmultipleSearch(data)).unwrap();
 
-    const GetmultipleSearchData = async () => {
+      if (response?.data?.statusCode === 1) {
-        const data = {
+        const selected =
-            AppId,
+          response?.data?.data?.[0]?.SearchTermDtl?.map(
-            CompId,
+            (item) => item?.SearchTerm,
-            BranchId,
+          ) || [];
-        };
 
-        try {
+        setSelectedValues(selected);
-            const response = await dispatch(getmultipleSearch(data)).unwrap();
+      }
+    } catch (error) {
+      console.error("Get Search Terms Error:", error);
+    }
+  };
 
-            if (response?.data?.statusCode === 1) {
+  return (
-                const selected = response?.data?.data?.[0]?.SearchTermDtl?.map(
+    <>
-                    (item) => item?.SearchTerm
+      <div
-                ) || [];
+        style={{ fontFamily: "Poppins", fontWeight: "500", marginTop: "10px" }}
-
+      >
-                setSelectedValues(selected);
+        {options.map((item) => (
-            }
+          <label
-        } catch (error) {
+            key={item.value}
-            console.error("Get Search Terms Error:", error);
+            style={{
-        }
+              display: "block",
-    };
+              marginBottom: "6px",
-
+              cursor: "pointer",
-    return (
+              fontSize: "14px",
-        <>
+              color: "#333",
-            <div>
+              margin: "6px 0",
-                {options.map((item) => (
+            }}
-                    <label
+          >
-                        key={item.value}
+            <input
-                        style={{
+              type="checkbox"
-                            display: "block",
+              checked={selectedValues.includes(item.value)}
-                            marginBottom: "6px",
+              onChange={() => {
-                            cursor: "pointer",
+                setSelectedValues((prev) =>
-                            fontSize: "14px",
+                  prev.includes(item.value)
-                            color: "#333",
+                    ? prev.filter((i) => i !== item.value)
-                        }}
+                    : [...prev, item.value],
-                    >
+                );
-                        <input
+              }}
-                            type="checkbox"
+              style={{ marginRight: "8px" }}
-                            checked={selectedValues.includes(item.value)}
+            />
-                            onChange={() => {
+            {item.label}
-                                setSelectedValues((prev) =>
+          </label>
-                                    prev.includes(item.value)
+        ))}
-                                        ? prev.filter((i) => i !== item.value)
+      </div>
-                                        : [...prev, item.value]
+      <div style={{ display: "flex", width: "100%", marginTop: "2rem" }}>
-                                );
+        <Buttons
-                            }}
+          buttonText={"Submit"}
-                            style={{ marginRight: "8px" }}
+          handleSubmit={postMultipleSearch}
-                        />
+          color="901D77" 
-                        {item.label}
+        />
-                    </label>
+      </div>
-                ))}
+    </>
-
+  );
-            </div>
-            <div>
-                <Buttons
-                    buttonText={'Submit'}
-                    handleSubmit={postMultipleSearch}
-                    color="901D77"
-                // icon={<PlusOutlined />}
-                />
-            </div>
-
-        </>
-    );
 };
 
 export default MultipleSearch;

src/Pages/Preference/PreferenceList.jsx

@@ -750,7 +750,16 @@ const PreferenceList = () => {
               {renderCheckbox('scanlayout', 'Do you Want Scan Layout Page?')}
             </div>
 
-            <div className="submitButton">
+          </Form>
+        </div>
+         <Form
+            ref={formRef}
+            layout="vertical"
+            onFinish={handleSubmit}
+            initialValues={initialValues}
+            className="preferences-list"
+          >
+            <div className="PreferencesBTN">
               <Buttons
                 buttonText="Submit Preferences"
                 color="901D77"
@@ -759,8 +768,7 @@ const PreferenceList = () => {
                 icon={<ArrowRightOutlined />}
               />
             </div>
-          </Form>
+            </Form>
-        </div>
       </div>
     </>
   );

src/Pages/Preference/PreferenceList.scss

@@ -1,12 +1,12 @@
 .preferences-list {
-  max-height: 84vh;
+  max-height: 75vh;
   overflow-y: auto;
   background: #fff;
   width: 100%;
   scrollbar-width: thin;
   scroll-behavior: smooth;
   border-radius: 12px;
-  padding-bottom: 4rem;
+  padding-bottom: 3rem;
 
   .preference-headers {
     font-size: 1.2rem;
@@ -41,7 +41,7 @@
   }
 
   .ant-form-item {
-    margin-bottom: 1.2rem;
+    margin-bottom: 1rem;
   }
 
   .ant-checkbox-wrapper,
@@ -49,11 +49,6 @@
     margin-right: 1rem;
   }
 
-  .ant-btn {
-    margin-top: 2rem;
-    float: right;
-  }
-
   // Optional: Scrollbar for long modals
   &::-webkit-scrollbar {
     width: 6px;
@@ -89,7 +84,7 @@
   padding: 10px 0;
 
   > div {
-    font-family: 'Poppins';
+    font-family: "Poppins";
     font-weight: 400;
     font-size: 14px;
     margin: 4px 0;
@@ -154,3 +149,13 @@
     }
   }
 }
+.PreferencesBTN {
+  display: flex;
+  align-items: flex-start;
+  justify-content: flex-end;
+  width: 100%;
+  margin-top: 1rem;
+  .primary_Button {
+    width: 200px !important;
+  }
+}

src/Styles/BookingScreen/Components/BSCategories/BSCategoryHorizontal.scss

@@ -325,7 +325,7 @@
 }
 
 .CategoryHorizontalNew {
-  padding: 1rem 1rem;
+  padding: 10px 10px;
   font-family: 'Inter', sans-serif;
   display: flex;
   align-items: center;

src/Styles/BookingScreen/Components/BSNavbar/BSNavbar3.scss

@@ -116,7 +116,7 @@
   .CustomerActions {
     display: flex;
     align-items: center;
-    gap: 0.1rem;
+    gap: 0.3rem;
 
     .RiVerifiedBadgeFill {
       transition: all 0.2s ease-in-out;

src/Styles/Reports/KOT/kot.scss

@@ -71,7 +71,7 @@
 .kot-date {
   display: flex;
   font-size: 14px;
-  font-family: 'Gilroy';
+  font-family: "Gilroy";
   font-weight: 500;
   border-radius: 5px;
   color: #212529 !important;
@@ -122,7 +122,7 @@
     right: 0;
   }
   .ant-segmented-item-label {
-    font-family: 'Poppins';
+    font-family: "Poppins";
     font-size: 12px !important;
   }
   .ant-segmented-item-selected {
@@ -134,9 +134,7 @@
   }
 }
 
-.kot-search-dev
+.kot-search-dev :where(.css-dev-only-do-not-override-2i2tap).ant-segmented .ant-segmented-group {
-  :where(.css-dev-only-do-not-override-2i2tap).ant-segmented
-  .ant-segmented-group {
   position: relative;
   display: flex;
   //srinath
@@ -149,9 +147,7 @@
     rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;
 }
 
-.kot-search-dev
+.kot-search-dev :where(.css-dev-only-do-not-override-2i2tap).ant-segmented .ant-segmented-item-selected {
-  :where(.css-dev-only-do-not-override-2i2tap).ant-segmented
-  .ant-segmented-item-selected {
   background-color: #ffffff;
   box-shadow:
     0 1px 2px 0 rgba(0, 0, 0, 0.03),
@@ -168,6 +164,13 @@
   margin: 12px 0 12px 0;
   height: 70vh;
   overflow: scroll;
+
+  .ant-table-thead {
+    background-color: #2c88ee !important;
+  }
+  .ant-table-cell {
+    padding: 6px !important;
+  }
   @media (max-width: 768px) {
     height: 60vh;
     scrollbar-width: thin;
@@ -179,7 +182,7 @@
   }
   table {
     tbody {
-      font-family: 'Poppins';
+      font-family: "Poppins";
       > tr:nth-child(even) {
         background-color: #b4b4b4;
       }
@@ -221,7 +224,7 @@
     transition: all 0.2s ease;
     min-width: 70px;
     text-align: center;
-    font-family: 'Poppins', sans-serif;
+    font-family: "Poppins", sans-serif;
     color: #fff;
     -webkit-text-stroke-width: 0.1px;