marco.pms.web/src/pages/AdvancePayment/AdvancePaymentPage.jsx
Vikas Nale 0bd1cea703 1) Handle blank space in menu bar
2) Breadcrum  "Home" link to "Dashboard" on pages where it was missing
2025-11-17 18:30:13 +05:30

99 lines
3.1 KiB
JavaScript

import React, {
createContext,
useContext,
useEffect,
useMemo,
useState,
} from "react";
import Breadcrumb from "../../components/common/Breadcrumb";
import { useEmployee } from "../../hooks/useEmployees";
import EmployeeSearchInput from "../../components/common/EmployeeSearchInput";
import { useForm } from "react-hook-form";
import Label from "../../components/common/Label";
import AdvancePaymentList from "../../components/AdvancePayment/AdvancePaymentList";
import { employee } from "../../data/masters";
import { formatFigure } from "../../utils/appUtils";
export const AdvancePaymentContext = createContext();
export const useAdvancePaymentContext = () => {
const context = useContext(AdvancePaymentContext);
if (!context) {
throw new Error(
"useAdvancePaymentContext must be used within an AdvancePaymentProvider"
);
}
return context;
};
const AdvancePaymentPage = () => {
const [balance, setBalance] = useState(null);
const { control, reset, watch } = useForm({
defaultValues: {
employeeId: "",
},
});
const selectedEmployeeId = watch("employeeId");
useEffect(() => {
const selectedEmpoyee = sessionStorage.getItem("transaction-empId");
reset({
employeeId: selectedEmpoyee || "",
});
}, [reset]);
return (
<AdvancePaymentContext.Provider value={{ setBalance }}>
<div className="container-fluid">
<Breadcrumb
data={[
{ label: "Home", link: "/dashboard" },
{ label: "Finance", link: "/advance-payment" },
{ label: "Advance Payment" },
]}
/>
<div className="card px-4 py-2 page-min-h ">
<div className="row py-1">
<div className="col-12 col-md-4">
<div className="d-block text-start">
<EmployeeSearchInput
control={control}
name="employeeId"
projectId={null}
forAll={true}
placeholder={"Enter Employee Name"}
/>
</div>
</div>
<div className="col-md-8 d-flex align-items-center justify-content-end">
{balance ? (
<>
<label className="fs-5 fw-semibold">Current Balance : </label>
<span
className={`${
balance > 0 ? "text-success" : "text-danger"
} fs-5 fw-bold ms-1`}
>
{balance > 0 ? (
<i className="bx bx-plus b-sm"></i>
) : (
<i className="bx bx-minus b-sm"></i>
)}{" "}
{formatFigure(balance, {
type: "currency",
currency: "INR",
})}
</span>
</>
) : (
<></>
)}
</div>
</div>
<AdvancePaymentList employeeId={selectedEmployeeId} />
</div>
</div>
</AdvancePaymentContext.Provider>
);
};
export default AdvancePaymentPage;