marco.pms.web/src/pages/purchase/PurchasePage.jsx

116 lines
3.4 KiB
JavaScript

import React, { createContext, useContext, useState } from "react";
import Breadcrumb from "../../components/common/Breadcrumb";
import showToast from "../../services/toastService";
import GlobalModel from "../../components/common/GlobalModel";
import ManagePurchase from "../../components/purchase/ManagePurchase";
import PurchaseList from "../../components/purchase/PurchaseList";
import ViewPurchase from "../../components/purchase/ViewPurchase";
export const PurchaseContext = createContext();
export const usePurchaseContext = () => {
let context = useContext(PurchaseContext);
if (!context) {
showToast("Please use Innne cntext", "warning");
window.location = "/dashboard";
}
return context;
};
const PurchasePage = () => {
const [searchText, setSearchText] = useState("");
const [managePurchase, setManagePurchase] = useState({
isOpen: false,
purchaseId: null,
});
const [viewPurchaseState, setViewPurchase] = useState({
isOpen: false,
purchaseId: null,
});
const contextValue = {
setViewPurchase,
setManagePurchase,
};
return (
<PurchaseContext.Provider value={contextValue}>
<div className="container-fluid">
<Breadcrumb
data={[
{ label: "Home", link: "/dashboard" },
{ label: "Procurement & Inventory", link: "/purchase-invoice" },
{ label: "Purchase" },
]}
/>
<div className="card">
<div className="row p-2">
<div className="col-12 col-md-6 text-start">
{" "}
<label className="mb-0">
<input
type="search"
value={searchText}
onChange={(e) => setSearchText(e.target.value)}
className="form-control form-control-sm"
placeholder="Search Purchase"
aria-controls="DataTables_Table_0"
/>
</label>
</div>
<di className="col-6 text-end">
<button
className="btn btn-sm btn-primary"
onClick={() =>
setManagePurchase({
isOpen: true,
purchaseId: null,
})
}
>
<i className="bx bx-plus-circle me-2"></i>Add
</button>
</di>
</div>
</div>
<PurchaseList searchString={searchText} />
{managePurchase.isOpen && (
<GlobalModel
isOpen={managePurchase.isOpen}
size="lg"
closeModal={() =>
setManagePurchase({
isOpen: false,
purchaseId: null,
})
}
>
<ManagePurchase
onClose={() =>
setManagePurchase({
isOpen: false,
purchaseId: null,
})
}
purchaseId={managePurchase.purchaseId}
/>
</GlobalModel>
)}
{viewPurchaseState.isOpen && (
<GlobalModel
isOpen={viewPurchaseState.isOpen}
size="xl"
closeModal={() =>
setViewPurchase({ isOpen: false, purchaseId: null })
}
>
<ViewPurchase purchaseId={viewPurchaseState.purchaseId} />
</GlobalModel>
)}
</div>
</PurchaseContext.Provider>
);
};
export default PurchasePage;