61 lines
1.6 KiB
JavaScript
61 lines
1.6 KiB
JavaScript
import { useState } from "react";
|
|
import { Messages } from "../../../Components/Notifications/Messages";
|
|
import TipAmountSettlementList from "./TipAmountSettlementList";
|
|
import EmployeeSettlement from "../EmployeeSettlement/EmployeeSettlement";
|
|
import "./Settlement.scss";
|
|
|
|
const Settlement = () => {
|
|
const [selectedComponent, setSelectedComponent] = useState("tips");
|
|
|
|
const messageType = "";
|
|
const messageData = [];
|
|
const onComplete = () => {};
|
|
|
|
return (
|
|
<div className="userPageTable">
|
|
<div className="userPageContent">
|
|
<Messages
|
|
messageType={messageType}
|
|
messageData={messageData}
|
|
onComplete={onComplete}
|
|
/>
|
|
|
|
{/* ✅ Tabs */}
|
|
<div className="formAddNew">
|
|
<div className="settlementTabs">
|
|
|
|
<div
|
|
className={`tabItem ${
|
|
selectedComponent === "tips" ? "active" : ""
|
|
}`}
|
|
onClick={() => setSelectedComponent("tips")}
|
|
>
|
|
Tip Settlement
|
|
</div>
|
|
|
|
<div
|
|
className={`tabItem ${
|
|
selectedComponent === "insentive" ? "active" : ""
|
|
}`}
|
|
onClick={() => setSelectedComponent("insentive")}
|
|
>
|
|
Incentive Settlement
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
{/* ✅ Content */}
|
|
<div className="tabContent">
|
|
{selectedComponent === "tips" ? (
|
|
<TipAmountSettlementList />
|
|
) : (
|
|
<EmployeeSettlement />
|
|
)}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default Settlement; |