98 lines
5.0 KiB
TypeScript
98 lines
5.0 KiB
TypeScript
import {Button, Divider, Flex, Tabs} from "@mantine/core";
|
|
import {iconMStyle, maxWidth} from "../styles.ts";
|
|
import React from "react";
|
|
import {DashboardPageType, UserPermissionLevel} from "~/utils/hms_enums.ts";
|
|
import HomeIcon from "mdi-react/HomeIcon";
|
|
import InformationIcon from "mdi-react/InformationIcon";
|
|
import LogoutIcon from "mdi-react/LogoutIcon";
|
|
import AccountGroupIcon from "mdi-react/AccountGroupIcon";
|
|
import BedIcon from "mdi-react/BedIcon";
|
|
import AccountWrenchIcon from "mdi-react/AccountWrenchIcon";
|
|
import BookAccountIcon from "mdi-react/BookAccountIcon";
|
|
import HospitalBoxIcon from "mdi-react/HospitalBoxIcon";
|
|
|
|
|
|
export function PageNavbar({currentStat, changePageStat, userPermission, canReception}:
|
|
{currentStat: DashboardPageType, changePageStat: (p: DashboardPageType) => any,
|
|
userPermission: UserPermissionLevel, canReception: boolean}) {
|
|
|
|
const onClickLogout = () => {
|
|
localStorage.removeItem("hms_token")
|
|
changePageStat(DashboardPageType.LoginPage)
|
|
}
|
|
|
|
return (
|
|
<>
|
|
<Tabs variant="pills" orientation="vertical" defaultValue="gallery" value={currentStat} style={{flex: 1}}
|
|
onChange={(e) => {if (e) changePageStat(e as DashboardPageType)}}>
|
|
<Tabs.List style={maxWidth}>
|
|
<Tabs.Tab value={DashboardPageType.Home} leftSection={<HomeIcon style={iconMStyle}/>}>
|
|
Home
|
|
</Tabs.Tab>
|
|
|
|
{ userPermission == UserPermissionLevel.PATIENT && <>
|
|
<Divider my="0px" label="Patient" labelPosition="center" />
|
|
<Tabs.Tab value={DashboardPageType.PatientBooking} leftSection={<BookAccountIcon style={iconMStyle}/>}>
|
|
My Appointments
|
|
</Tabs.Tab>
|
|
<Tabs.Tab value={DashboardPageType.TreatmentRecord} leftSection={<BookAccountIcon style={iconMStyle}/>}>
|
|
My Treatments
|
|
</Tabs.Tab>
|
|
</>}
|
|
|
|
{ canReception && <>
|
|
<Divider my="0px" label="Reception" labelPosition="center" />
|
|
<Tabs.Tab value={DashboardPageType.AppointManagement} leftSection={<BookAccountIcon style={iconMStyle}/>}>
|
|
Appointments Management
|
|
</Tabs.Tab>
|
|
</>}
|
|
|
|
{ userPermission >= UserPermissionLevel.DOCTOR && <>
|
|
<Divider my="0px" label="Doctor" labelPosition="center" />
|
|
<Tabs.Tab value={DashboardPageType.DoctorTreatment} leftSection={<HospitalBoxIcon style={iconMStyle}/>}>
|
|
Patient Treatment
|
|
</Tabs.Tab>
|
|
</>}
|
|
|
|
{ userPermission >= UserPermissionLevel.ADMIN && <>
|
|
<Divider my="0px" label="Ward Management" labelPosition="center" />
|
|
<Tabs.Tab value={DashboardPageType.WardsManagement} leftSection={<BedIcon style={iconMStyle}/>}>
|
|
Ward Management
|
|
</Tabs.Tab>
|
|
|
|
<Divider my="0px" label="User Management" labelPosition="center" />
|
|
<Tabs.Tab value={DashboardPageType.MedicalTeamsManagement} leftSection={<AccountGroupIcon style={iconMStyle}/>}>
|
|
Medical Teams Management
|
|
</Tabs.Tab>
|
|
<Tabs.Tab value={DashboardPageType.StaffManagement} leftSection={<AccountWrenchIcon style={iconMStyle}/>}>
|
|
Staff Management
|
|
</Tabs.Tab>
|
|
<Tabs.Tab value={DashboardPageType.PatientsManagement} leftSection={<AccountWrenchIcon style={iconMStyle}/>}>
|
|
Patients Management
|
|
</Tabs.Tab>
|
|
</> }
|
|
|
|
{ userPermission >= UserPermissionLevel.DOCTOR && <>
|
|
<Divider my="0px" label="Records" labelPosition="center" />
|
|
<Tabs.Tab value={DashboardPageType.TreatmentRecord} leftSection={<BookAccountIcon style={iconMStyle}/>}>
|
|
Treatment Records
|
|
</Tabs.Tab>
|
|
</>}
|
|
|
|
</Tabs.List>
|
|
</Tabs>
|
|
<Flex gap="md" justify="flex-start" align="flex-end" direction="row" wrap="wrap" style={maxWidth}>
|
|
|
|
<Button variant="outline" color="blue" fullWidth justify="start" onClick={() => changePageStat(DashboardPageType.About)}
|
|
leftSection={<InformationIcon style={iconMStyle}/>}>
|
|
About
|
|
</Button>
|
|
<Button variant="outline" color="red" fullWidth justify="start" onClick={onClickLogout}
|
|
leftSection={<LogoutIcon style={iconMStyle}/>}>
|
|
Logout
|
|
</Button>
|
|
</Flex>
|
|
|
|
</>
|
|
)
|
|
} |