Files
nobat724_front/components/dashboard/userAccount/tabs/turns/Head.js
T
2024-10-23 03:16:12 +03:30

69 lines
2.2 KiB
JavaScript

import Tabs from "@/app/component/Tabs";
import { Button } from "@mui/material";
const listTab = ["نوبت های جاری", "نوبت های انجام شده"];
function Head({ isDone, setIsDone }) {
return (
<div className="flex items-center justify-start gap-[32px] mt-[24px] sm:mt-[26px] md:mt-[28px] lg:mt-[30px]">
<div className="block w-full lg:hidden">
<Tabs
style={{
".MuiTabs-indicator": {
height: "2px",
borderRadius: "16px",
background: "#5559CE",
},
"& .MuiButtonBase-root": {
color: "#7E7E7E",
fontSize: "14px",
fontStyle: "normal",
fontWeight: "700",
},
"& .MuiTabs-flexContainer": {
paddingRight: "15px",
paddingLeft: "15px",
},
"& .mui-11pdt05-MuiButtonBase-root-MuiTab-root.Mui-selected": {
color: "#5559CE !important",
},
"& .MuiButtonBase-root.Mui-selected": {
color: "#5559CE !important",
},
}}
color="#5559CE"
listTab={listTab}
value={isDone ? 0 : 1}
handleChange={(e, value) => setIsDone(!!!value)}
/>
</div>
<Button
className={`!hidden lg:!flex !border !border-solid !py-[8px] !shadow-none !px-[12px] !text-[16px] !font-medium
${
isDone
? "!bg-transparent !border-[#5559CE] !text-[#5559CE]"
: "!text-[#EFEFEF] !border-transparent"
}`}
onClick={() => setIsDone(!isDone)}
variant="contained"
>
نوبت های جاری
</Button>
<Button
className={`!hidden lg:!flex !border !border-solid !py-[8px] !shadow-none !px-[12px] !text-[16px] !font-medium
${
!isDone
? "!bg-transparent !border-[#5559CE] !text-[#5559CE]"
: "!text-[#EFEFEF] !border-transparent"
}`}
onClick={() => setIsDone(!isDone)}
variant="contained"
>
نوبت های انجام شده
</Button>
</div>
);
}
export default Head;