finished dokter / admin almost done
This commit is contained in:
kicap1992
@ -1,5 +1,5 @@
|
||||
import * as React from 'react';
|
||||
// import { styled, useTheme } from '@mui/material/styles';
|
||||
import Router from 'next/router';
|
||||
import { styled, useTheme, alpha } from '@mui/material/styles';
|
||||
import MuiDrawer from '@mui/material/Drawer';
|
||||
import MuiAppBar from '@mui/material/AppBar';
|
||||
@ -19,6 +19,7 @@ import ListItemText from '@mui/material/ListItemText';
|
||||
import HomeIcon from '@mui/icons-material/Home';
|
||||
import InboxIcon from '@mui/icons-material/MoveToInbox';
|
||||
import MailIcon from '@mui/icons-material/Mail';
|
||||
import MedicationIcon from '@mui/icons-material/Medication';
|
||||
|
||||
// coba
|
||||
import Box from '@mui/material/Box';
|
||||
@ -26,6 +27,23 @@ import AccountCircle from '@mui/icons-material/AccountCircle';
|
||||
import MenuItem from '@mui/material/MenuItem';
|
||||
import Menu from '@mui/material/Menu';
|
||||
|
||||
const listmenu = [
|
||||
{
|
||||
name: 'Home',
|
||||
name2: 'Halaman Utama',
|
||||
icon: <HomeIcon />,
|
||||
router: '/dokter',
|
||||
},
|
||||
{
|
||||
name: 'Rekam Medis',
|
||||
name2: 'Halaman Rekam Medis',
|
||||
icon: <MedicationIcon />,
|
||||
router: '/dokter/rekam-medis',
|
||||
},
|
||||
|
||||
]
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
@ -96,7 +114,7 @@ const Drawer = styled(MuiDrawer, { shouldForwardProp: (prop) => prop !== 'open'
|
||||
}),
|
||||
);
|
||||
|
||||
function AppBarDokter() {
|
||||
function AppBarDokter(props) {
|
||||
const theme = useTheme();
|
||||
const [open, setOpen] = React.useState(false);
|
||||
const handleDrawerOpen = () => {
|
||||
@ -119,7 +137,7 @@ function AppBarDokter() {
|
||||
setAnchorEl(null);
|
||||
};
|
||||
|
||||
|
||||
|
||||
|
||||
const renderMenu = (
|
||||
<Menu
|
||||
@ -138,120 +156,164 @@ function AppBarDokter() {
|
||||
onClose={handleMenuClose}
|
||||
>
|
||||
<MenuItem onClick={handleMenuClose}>Profile</MenuItem>
|
||||
<MenuItem onClick={handleMenuClose}>My account</MenuItem>
|
||||
<MenuItem
|
||||
onClick={
|
||||
() => {
|
||||
logout()
|
||||
handleMenuClose()
|
||||
}
|
||||
}
|
||||
>Logout</MenuItem>
|
||||
</Menu>
|
||||
);
|
||||
|
||||
|
||||
function handleMenuRoute(menu) {
|
||||
// console.log(menu + " sini menunya di appbar")
|
||||
Router.push(menu)
|
||||
}
|
||||
|
||||
async function logout() {
|
||||
try {
|
||||
const url = process.env.HTTP_URL + "/api/login/logout";
|
||||
const response = await fetch(url, {
|
||||
method: 'GET',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'allow-cors-origin': '*',
|
||||
'crossDomain': true,
|
||||
'Authorization': 'Basic ' + btoa(`${process.env.ADMIN_AUTH}:${process.env.ADMIN_PASSWORD}`)
|
||||
},
|
||||
})
|
||||
// get response
|
||||
const data_response = await response.json()
|
||||
console.log(data_response, "ini data response")
|
||||
// console.log(data, "ini data dari cek dokter")
|
||||
if (response.status === 200) {
|
||||
// create toast
|
||||
Router.push('/')
|
||||
return true
|
||||
} else if (response.status === 400) {
|
||||
Router.push('/')
|
||||
return false
|
||||
} else {
|
||||
// create toast
|
||||
Router.push('/')
|
||||
return false
|
||||
}
|
||||
|
||||
} catch (err) {
|
||||
Router.push('/')
|
||||
console.log(err)
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<div>
|
||||
|
||||
<AppBar position="fixed" open={open}>
|
||||
<Toolbar>
|
||||
|
||||
<AppBar position="fixed" open={open} >
|
||||
<Toolbar>
|
||||
<IconButton
|
||||
color="inherit"
|
||||
aria-label="open drawer"
|
||||
// onClick={handleDrawerOpen}
|
||||
onClick={(!props.backdrop && !props.sweetalertload) ? handleDrawerOpen : null}
|
||||
edge="start"
|
||||
sx={{
|
||||
marginRight: 5,
|
||||
...(open && { display: 'none' }),
|
||||
cursor: (!props.backdrop && !props.sweetalertload) ? 'pointer' : 'default'
|
||||
}}
|
||||
|
||||
>
|
||||
<MenuIcon />
|
||||
</IconButton>
|
||||
<Typography variant="h6" noWrap component="div">
|
||||
{/* check the listmenu name if same as props.menu then load the listmenu.name2 */}
|
||||
{
|
||||
listmenu.map((listmenu, index) => {
|
||||
if (listmenu.name === props.menu) {
|
||||
return listmenu.name2
|
||||
}
|
||||
})
|
||||
}
|
||||
</Typography>
|
||||
|
||||
<Box sx={{ flexGrow: 1 }} />
|
||||
<Box sx={{ display: { xs: "flex", md: 'flex' } }}>
|
||||
|
||||
<IconButton
|
||||
size="large"
|
||||
edge="end"
|
||||
aria-label="account of current user"
|
||||
aria-controls={menuId}
|
||||
aria-haspopup="true"
|
||||
onClick={(!props.backdrop && !props.sweetalertload) ? handleProfileMenuOpen : null}
|
||||
color="inherit"
|
||||
aria-label="open drawer"
|
||||
onClick={handleDrawerOpen}
|
||||
edge="start"
|
||||
sx={{
|
||||
marginRight: 5,
|
||||
...(open && { display: 'none' }),
|
||||
cursor: (!props.backdrop && !props.sweetalertload) ? 'pointer' : 'default'
|
||||
}}
|
||||
>
|
||||
<MenuIcon />
|
||||
<AccountCircle />
|
||||
</IconButton>
|
||||
<Typography variant="h6" noWrap component="div">
|
||||
Mini variant drawer
|
||||
</Typography>
|
||||
|
||||
<Box sx={{ flexGrow: 1 }} />
|
||||
<Box sx={{ display: { xs: "flex", md: 'flex' } }}>
|
||||
|
||||
<IconButton
|
||||
size="large"
|
||||
edge="end"
|
||||
aria-label="account of current user"
|
||||
aria-controls={menuId}
|
||||
aria-haspopup="true"
|
||||
onClick={handleProfileMenuOpen}
|
||||
color="inherit"
|
||||
>
|
||||
<AccountCircle />
|
||||
</IconButton>
|
||||
</Box>
|
||||
</Toolbar>
|
||||
</AppBar>
|
||||
</Box>
|
||||
</Toolbar>
|
||||
</AppBar>
|
||||
|
||||
{renderMenu}
|
||||
|
||||
{renderMenu}
|
||||
|
||||
<Drawer variant="permanent" open={open}>
|
||||
<DrawerHeader>
|
||||
<Typography variant="h6" noWrap>Rekam Medis</Typography>
|
||||
<IconButton onClick={handleDrawerClose}>
|
||||
{theme.direction === 'rtl' ? <ChevronRightIcon /> : <ChevronLeftIcon />}
|
||||
</IconButton>
|
||||
</IconButton>
|
||||
</DrawerHeader>
|
||||
<Divider />
|
||||
<List>
|
||||
<ListItemButton
|
||||
key={"text"}
|
||||
onClick={null}
|
||||
// disableElevation
|
||||
disableRipple
|
||||
sx={{
|
||||
minHeight: 48,
|
||||
justifyContent: open ? 'initial' : 'center',
|
||||
px: 2.5,
|
||||
backgroundColor: theme.palette.primary.main,
|
||||
color: "white",
|
||||
'&:hover': {
|
||||
background: theme.palette.primary.main,
|
||||
},
|
||||
cursor: 'default',
|
||||
}}
|
||||
>
|
||||
<ListItemIcon
|
||||
sx={{
|
||||
// color: "white",
|
||||
minWidth: 0,
|
||||
mr: open ? 3 : 'auto',
|
||||
justifyContent: 'center',
|
||||
}}
|
||||
>
|
||||
<HomeIcon sx={{
|
||||
color: "white",
|
||||
}} />
|
||||
</ListItemIcon>
|
||||
<ListItemText primary="Menu Utama" sx={{ opacity: open ? 1 : 0 }} />
|
||||
</ListItemButton>
|
||||
{['All mail', 'Trash', 'Spam'].map((text, index) => (
|
||||
<ListItemButton
|
||||
key={text}
|
||||
sx={{
|
||||
minHeight: 48,
|
||||
justifyContent: open ? 'initial' : 'center',
|
||||
px: 2.5,
|
||||
}}
|
||||
>
|
||||
<ListItemIcon
|
||||
{
|
||||
listmenu.map((menu, index) => (
|
||||
<ListItemButton
|
||||
key={index}
|
||||
// onClick={handleMenuRoute("hehe")}
|
||||
// onClick={() => props.handleMenuRoute(menu.router)}
|
||||
onClick={(!props.backdrop && !props.sweetalertload && props.menu) ? () => handleMenuRoute(menu.router) : null}
|
||||
// disableElevation
|
||||
// disableRipple
|
||||
sx={{
|
||||
minWidth: 0,
|
||||
mr: open ? 3 : 'auto',
|
||||
justifyContent: 'center',
|
||||
minHeight: 48,
|
||||
justifyContent: open ? 'initial' : 'center',
|
||||
px: 2.5,
|
||||
backgroundColor: (props.menu == menu.name) ? theme.palette.primary.main : null, // ini
|
||||
color: (props.menu == menu.name) ? "white" : "grey", // ini
|
||||
'&:hover': {
|
||||
background: (props.menu == menu.name) ? theme.palette.primary.main : null, // ini
|
||||
},
|
||||
cursor: (props.backdrop || props.sweetalertload) ? 'default' : "pointer",
|
||||
// cursor: "alias",
|
||||
}}
|
||||
>
|
||||
{index % 2 === 0 ? <InboxIcon /> : <MailIcon />}
|
||||
</ListItemIcon>
|
||||
<ListItemText primary={text} sx={{ opacity: open ? 1 : 0 }} />
|
||||
</ListItemButton>
|
||||
))}
|
||||
|
||||
<ListItemIcon
|
||||
sx={{
|
||||
color: (props.menu == menu.name) ? "white" : "grey", // ini
|
||||
minWidth: 0,
|
||||
mr: open ? 3 : 'auto',
|
||||
justifyContent: 'center',
|
||||
}}
|
||||
>
|
||||
{
|
||||
menu.icon
|
||||
}
|
||||
</ListItemIcon>
|
||||
<ListItemText primary={menu.name2} sx={{ opacity: open ? 1 : 0 }} />
|
||||
</ListItemButton>
|
||||
))
|
||||
}
|
||||
|
||||
|
||||
</List>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</Drawer>
|
||||
</div>
|
||||
)
|
||||
|
||||
127
components/dokter/selectedObat.js
Normal file
127
components/dokter/selectedObat.js
Normal file
@ -0,0 +1,127 @@
|
||||
import {forwardRef} from 'react'
|
||||
import { Divider } from "@mui/material"
|
||||
import TextField from '@mui/material/TextField';
|
||||
import Box from '@mui/material/Box';
|
||||
|
||||
// this is for number format
|
||||
import NumberFormat from 'react-number-format';
|
||||
|
||||
const NumberFormatCustom = forwardRef(function NumberFormatCustom(props, ref) {
|
||||
const { onChange, ...other } = props;
|
||||
|
||||
return (
|
||||
<NumberFormat
|
||||
{...other}
|
||||
getInputRef={ref}
|
||||
onValueChange={(values) => {
|
||||
onChange({
|
||||
target: {
|
||||
name: props.name,
|
||||
value: values.value,
|
||||
},
|
||||
});
|
||||
}}
|
||||
// thousandSeparator
|
||||
isNumericString
|
||||
// prefix="08"
|
||||
/>
|
||||
);
|
||||
});
|
||||
|
||||
|
||||
function RekamMedisSelectedObat(props) {
|
||||
const url = process.env.HTTP_URL + "/api/dokter";
|
||||
async function cek_obat(jumlah ,id){
|
||||
try{
|
||||
let urlnya= url + "/cek_obat?id="+id;
|
||||
const response = await fetch(urlnya, {
|
||||
method: 'GET',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'allow-cors-origin': '*',
|
||||
'crossDomain': true,
|
||||
'Authorization': 'Basic ' + btoa(`${process.env.ADMIN_AUTH}:${process.env.ADMIN_PASSWORD}`)
|
||||
},
|
||||
})
|
||||
|
||||
const data = await response.json();
|
||||
let jumlahnya = data.data.jumlah;
|
||||
let hitung = jumlahnya - jumlah;
|
||||
|
||||
if(response.status == 200){
|
||||
if(hitung >= 0){
|
||||
return true;
|
||||
}else{
|
||||
props.errornya("Jumlah Obat Tidak Mencukupi");
|
||||
return false;
|
||||
}
|
||||
}else{
|
||||
return false;
|
||||
}
|
||||
}catch(error){
|
||||
console.log(error);
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
if (props.obat.length == 0) {
|
||||
return (
|
||||
<div>
|
||||
<Divider />
|
||||
<div style={{ marginTop: 20 }}>
|
||||
<p>Tidak ada obat yang dipilih</p>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
} else {
|
||||
|
||||
let data = []
|
||||
for (let i = 0; i < props.obat.length; i++) {
|
||||
// push to data id = props.obat[i].split('-')[0] and jumlah = null
|
||||
data.push({
|
||||
id: props.obat[i].split('-')[0],
|
||||
jumlah: null
|
||||
})
|
||||
}
|
||||
|
||||
let divider =<Divider key="hehe" />
|
||||
let box = <Box sx={{ padding: "10px" }} key="haha"></Box>
|
||||
let component = []
|
||||
component.push(divider)
|
||||
component.push(box)
|
||||
for (let i = 0; i < props.obat.length; i++) {
|
||||
component.push(
|
||||
<div key={i}>
|
||||
<TextField
|
||||
id={props.obat[i].id_obat + "TextField"}
|
||||
label={"Jumlah " + props.obat[i].split("-")[1]}
|
||||
placeholder={"Masukkan Jumlah " + props.obat[i].split("-")[1]}
|
||||
sx={{ width: "90%", boxShadow: 10 }}
|
||||
onChange={(e) => {
|
||||
data[i].jumlah = e.target.value
|
||||
cek_obat(e.target.value, props.obat[i].split("-")[0])
|
||||
|
||||
props.datanya(data)
|
||||
}}
|
||||
InputProps={{
|
||||
inputComponent: NumberFormatCustom,
|
||||
inputProps: {
|
||||
maxLength: 3,
|
||||
minLength: 1,
|
||||
}
|
||||
}}
|
||||
/>
|
||||
<Box sx={{ padding: "10px" }}></Box>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
{component}
|
||||
</>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
export default RekamMedisSelectedObat
|
||||
82
components/dokter/tabelJadwalDokter.js
Normal file
82
components/dokter/tabelJadwalDokter.js
Normal file
@ -0,0 +1,82 @@
|
||||
import TableCell from '@mui/material/TableCell';
|
||||
import TableRow from '@mui/material/TableRow';
|
||||
|
||||
// button icon
|
||||
import IconButton from '@mui/material/IconButton';
|
||||
import ModeEditIcon from '@mui/icons-material/ModeEdit';
|
||||
import DisabledByDefaultIcon from '@mui/icons-material/DisabledByDefault';
|
||||
// import EventAvailableIcon from '@mui/icons-material/EventAvailable';
|
||||
|
||||
function TabelJadwalDokter(props) {
|
||||
|
||||
let component = []
|
||||
|
||||
for (let i = 0; i < props.harinya.length; i++) {
|
||||
// clear component
|
||||
|
||||
let componentnya = [
|
||||
<TableRow key={i}>
|
||||
<TableCell>{props.harinya[i]}</TableCell>
|
||||
<TableCell>-</TableCell>
|
||||
<TableCell>-</TableCell>
|
||||
<TableCell>
|
||||
<IconButton color="primary" onClick={
|
||||
() => {
|
||||
props.add(props.harinya[i])
|
||||
}
|
||||
}>
|
||||
<ModeEditIcon />
|
||||
</IconButton>
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
]
|
||||
|
||||
for (let j = 0; j < props.dataJadwal.length; j++) {
|
||||
if (props.dataJadwal[j].hari == props.harinya[i]) {
|
||||
// clear componentnya
|
||||
componentnya = [<TableRow key={i}>
|
||||
<TableCell>{props.harinya[i]}</TableCell>
|
||||
<TableCell>{props.dataJadwal[j].jam_mulai}</TableCell>
|
||||
<TableCell>{props.dataJadwal[j].jam_selesai}</TableCell>
|
||||
<TableCell>
|
||||
<IconButton color="success"
|
||||
onClick={
|
||||
() => {
|
||||
props.edit(props.harinya[i], props.dataJadwal[j].jam_mulai, props.dataJadwal[j].jam_selesai)
|
||||
}
|
||||
}
|
||||
>
|
||||
<ModeEditIcon />
|
||||
</IconButton>
|
||||
<IconButton color="error"
|
||||
onClick={
|
||||
() => {
|
||||
props.delete(props.harinya[i])
|
||||
}
|
||||
}
|
||||
>
|
||||
<DisabledByDefaultIcon />
|
||||
</IconButton>
|
||||
</TableCell>
|
||||
</TableRow>]
|
||||
// push jam mulai dan jam selesai
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
// push componentnya to component
|
||||
component.push(componentnya)
|
||||
|
||||
|
||||
}
|
||||
// console.log(component, "ini component")
|
||||
|
||||
return (
|
||||
<>
|
||||
{component}
|
||||
</>
|
||||
)
|
||||
|
||||
}
|
||||
|
||||
export default TabelJadwalDokter
|
||||
565
components/dokter/tableJadwalRekamMedis.js
Normal file
565
components/dokter/tableJadwalRekamMedis.js
Normal file
@ -0,0 +1,565 @@
|
||||
import Router from 'next/router';
|
||||
import { useState } from 'react';
|
||||
import TableCell from '@mui/material/TableCell';
|
||||
import TableRow from '@mui/material/TableRow';
|
||||
|
||||
// button icon
|
||||
import IconButton from '@mui/material/IconButton';
|
||||
// import EventAvailableIcon from '@mui/icons-material/EventAvailable';
|
||||
import QuestionAnswerIcon from '@mui/icons-material/QuestionAnswer';
|
||||
import HelpOutlineIcon from '@mui/icons-material/HelpOutline';
|
||||
import CheckCircleOutlineIcon from '@mui/icons-material/CheckCircleOutline';
|
||||
import InfoIcon from '@mui/icons-material/Info';
|
||||
|
||||
// for dialog
|
||||
import Button from '@mui/material/Button';
|
||||
import { styled } from '@mui/material/styles';
|
||||
import Dialog from '@mui/material/Dialog';
|
||||
import DialogTitle from '@mui/material/DialogTitle';
|
||||
import DialogContent from '@mui/material/DialogContent';
|
||||
import DialogActions from '@mui/material/DialogActions';
|
||||
import CloseIcon from '@mui/icons-material/Close';
|
||||
import TextField from '@mui/material/TextField';
|
||||
import Box from '@mui/material/Box';
|
||||
|
||||
import { formatInTimeZone } from 'date-fns-tz' // format timezone
|
||||
|
||||
// for tindakan select
|
||||
import OutlinedInput from '@mui/material/OutlinedInput';
|
||||
import InputLabel from '@mui/material/InputLabel';
|
||||
import MenuItem from '@mui/material/MenuItem';
|
||||
import FormControl from '@mui/material/FormControl';
|
||||
import ListItemText from '@mui/material/ListItemText';
|
||||
import Select from '@mui/material/Select';
|
||||
import Checkbox from '@mui/material/Checkbox';
|
||||
import Chip from '@mui/material/Chip';
|
||||
import Divider from '@mui/material/Divider';
|
||||
|
||||
// for dialog
|
||||
const BootstrapDialog = styled(Dialog)(({ theme }) => ({
|
||||
'& .MuiDialogContent-root': {
|
||||
padding: theme.spacing(2),
|
||||
},
|
||||
'& .MuiDialogActions-root': {
|
||||
padding: theme.spacing(1),
|
||||
},
|
||||
}));
|
||||
|
||||
const CustomDisableInput = styled(TextField)(() => ({
|
||||
".MuiInputBase-input.Mui-disabled": {
|
||||
WebkitTextFillColor: "#000",
|
||||
color: "#000"
|
||||
},
|
||||
// change the mui textfield border color
|
||||
".MuiOutlinedInput-root.Mui-disabled .MuiOutlinedInput-notchedOutline": {
|
||||
borderColor: "#339AFF"
|
||||
},
|
||||
// change the label color
|
||||
".MuiInputLabel-root.Mui-disabled": {
|
||||
color: "#339AFF"
|
||||
}
|
||||
}));
|
||||
|
||||
const BootstrapDialogTitle = (props) => {
|
||||
const { children, onClose, ...other } = props;
|
||||
|
||||
return (
|
||||
<DialogTitle sx={{ m: 0, p: 2 }} {...other}>
|
||||
{children}
|
||||
{onClose ? (
|
||||
<IconButton
|
||||
aria-label="close"
|
||||
onClick={onClose}
|
||||
sx={{
|
||||
position: 'absolute',
|
||||
right: 8,
|
||||
top: 8,
|
||||
color: (theme) => theme.palette.grey[500],
|
||||
}}
|
||||
>
|
||||
<CloseIcon />
|
||||
</IconButton>
|
||||
) : null}
|
||||
</DialogTitle>
|
||||
);
|
||||
};
|
||||
|
||||
// ini untuk select
|
||||
const ITEM_HEIGHT = 48;
|
||||
const ITEM_PADDING_TOP = 8;
|
||||
const MenuProps = {
|
||||
PaperProps: {
|
||||
style: {
|
||||
maxHeight: ITEM_HEIGHT * 4.5 + ITEM_PADDING_TOP,
|
||||
width: 250,
|
||||
},
|
||||
|
||||
},
|
||||
};
|
||||
|
||||
const PenjumlahanObat = (props) => {
|
||||
let datanya = props.listObat;
|
||||
let component = [];
|
||||
for (let i = 0; i < datanya.length; i++) {
|
||||
component.push(
|
||||
<div key={i}>
|
||||
<CustomDisableInput
|
||||
id={datanya[i].nama_obat}
|
||||
label={`Jumlah ${datanya[i].nama_obat}`}
|
||||
// placeholder="Masukkan Nama Pasien"
|
||||
value={datanya[i].jumlah}
|
||||
disabled
|
||||
sx={{ width: "90%", boxShadow: 10 }}
|
||||
/>
|
||||
</div>
|
||||
)
|
||||
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
{component}
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
function Umur(props) {
|
||||
|
||||
let umur = props.tgl_lahir;
|
||||
let tahun = new Date().getFullYear();
|
||||
let tahun_lahir = umur.substr(0, 4);
|
||||
let umur_ini = tahun - tahun_lahir;
|
||||
|
||||
|
||||
|
||||
return (
|
||||
<>
|
||||
{umur_ini}
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
function TabelJadwalRekamMedis(props) {
|
||||
let component = [];
|
||||
|
||||
const [openDialog, setOpenDialog] = useState(false);
|
||||
const [dataRekamMedis, setDataRekamMedis] = useState(null);
|
||||
const [selectedTindakan, setSelectedTindakan] = useState([]);
|
||||
const [selectedObat, setSelectedObat] = useState([]);
|
||||
const [listObat, setListObat] = useState([]);
|
||||
|
||||
const preview_rekam_medis = async (id_rekam_medis) => {
|
||||
props.backdropnya(true)
|
||||
setDataRekamMedis(null)
|
||||
setSelectedTindakan([])
|
||||
setSelectedObat([])
|
||||
try {
|
||||
const url = process.env.HTTP_URL + "/api/dokter/cek_data_rekam_medis?id=" + id_rekam_medis + "&id_dokter=" + props.user;
|
||||
const response = await fetch(url, {
|
||||
method: 'GET',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'allow-cors-origin': '*',
|
||||
'crossDomain': true,
|
||||
'Authorization': 'Basic ' + btoa(`${process.env.ADMIN_AUTH}:${process.env.ADMIN_PASSWORD}`)
|
||||
},
|
||||
})
|
||||
const data = await response.json();
|
||||
if (response.status === 200) {
|
||||
setDataRekamMedis(data.data);
|
||||
const tindakan = JSON.parse(data.data.tindakan);
|
||||
if (tindakan.length > 0) {
|
||||
await cek_tindakan(tindakan);
|
||||
}
|
||||
const obat = JSON.parse(data.data.obat);
|
||||
if (obat.length > 0) {
|
||||
await cek_obat(obat);
|
||||
}
|
||||
|
||||
// setSelectedTindakan(tindakan);
|
||||
// console.log(tindakan, "ini tindakan");
|
||||
|
||||
|
||||
setOpenDialog(true);
|
||||
} else {
|
||||
props.errornya(data.message);
|
||||
}
|
||||
} catch (err) {
|
||||
console.log(err)
|
||||
props.errornya("Terjadi kesalahan saat mengambil data rekam medis")
|
||||
}
|
||||
props.backdropnya(false)
|
||||
}
|
||||
|
||||
const cek_tindakan = async (data) => {
|
||||
// console.log(data, "ini data tindakan");
|
||||
try {
|
||||
let tindakan_array = [];
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
let url = process.env.HTTP_URL + "/api/dokter/tindakan?id=" + data[i];
|
||||
const response = await fetch(url, {
|
||||
method: 'GET',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'allow-cors-origin': '*',
|
||||
'crossDomain': true,
|
||||
'Authorization': 'Basic ' + btoa(`${process.env.ADMIN_AUTH}:${process.env.ADMIN_PASSWORD}`)
|
||||
},
|
||||
})
|
||||
|
||||
const data_tindakan = await response.json();
|
||||
// console.log(data_tindakan, "ini data tindakan");
|
||||
if (response.status === 200) {
|
||||
// tindakan_array.push();
|
||||
let ini_tindakan = data_tindakan.data.nama_tindakan;
|
||||
tindakan_array.push(ini_tindakan);
|
||||
}
|
||||
|
||||
}
|
||||
setSelectedTindakan(tindakan_array);
|
||||
console.log(tindakan_array, "ini tindakan array");
|
||||
|
||||
|
||||
} catch (err) {
|
||||
console.log(err)
|
||||
}
|
||||
}
|
||||
|
||||
const cek_obat = async (data) => {
|
||||
try {
|
||||
let list_obat = [];
|
||||
let selected_obat = [];
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
let url = process.env.HTTP_URL + "/api/dokter/cek_obat?id=" + data[i].id;
|
||||
const response = await fetch(url, {
|
||||
method: 'GET',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'allow-cors-origin': '*',
|
||||
'crossDomain': true,
|
||||
'Authorization': 'Basic ' + btoa(`${process.env.ADMIN_AUTH}:${process.env.ADMIN_PASSWORD}`)
|
||||
},
|
||||
})
|
||||
|
||||
const data_obat = await response.json();
|
||||
console.log(data_obat, "ini data obat");
|
||||
if (response.status === 200) {
|
||||
// tindakan_array.push();
|
||||
let nama_obat = data_obat.data.nama_obat;
|
||||
list_obat.push({
|
||||
nama_obat: nama_obat,
|
||||
jumlah: data[i].jumlah,
|
||||
});
|
||||
selected_obat.push(nama_obat);
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
setListObat(list_obat);
|
||||
setSelectedObat(selected_obat);
|
||||
|
||||
} catch (err) {
|
||||
console.log(err)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
if (props.data.length == 0) {
|
||||
component = (
|
||||
<TableRow>
|
||||
<TableCell colSpan={8} align="center">
|
||||
Tiada Data
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
)
|
||||
} else {
|
||||
for (let i = 0; i < props.data.length; i++) {
|
||||
let ii = 0;
|
||||
ii = i + 1;
|
||||
component.push(
|
||||
<TableRow key={i}>
|
||||
<TableCell>{ii}</TableCell>
|
||||
<TableCell>{props.data[i].tb_pasien.nik}</TableCell>
|
||||
<TableCell>{props.data[i].tb_pasien.nama}</TableCell>
|
||||
<TableCell>{props.data[i].tanggal_periksa} | {props.data[i].jam_periksa}</TableCell>
|
||||
<TableCell><Umur tgl_lahir={props.data[i].tb_pasien.tgl_lahir} /></TableCell>
|
||||
<TableCell>{props.data[i].tb_pasien.golongan_darah}</TableCell>
|
||||
<TableCell>
|
||||
{
|
||||
(props.data[i].diagnosa == '' || props.data[i].diagnosa == null) ?
|
||||
<>
|
||||
<IconButton color="error" title="Belum Diperiksa">
|
||||
<HelpOutlineIcon />
|
||||
</IconButton>
|
||||
</> :
|
||||
<>
|
||||
<IconButton color="success" title="Sudah Diperiksa"
|
||||
onClick={
|
||||
() => {
|
||||
preview_rekam_medis(props.data[i].id_rekam_medis)
|
||||
}
|
||||
}
|
||||
>
|
||||
<CheckCircleOutlineIcon />
|
||||
</IconButton>
|
||||
</>
|
||||
}
|
||||
</TableCell>
|
||||
<TableCell>
|
||||
{
|
||||
(props.data[i].diagnosa == '' || props.data[i].diagnosa == null) ?
|
||||
<>
|
||||
<IconButton color="primary"
|
||||
onClick={
|
||||
() => {
|
||||
Router.push('/dokter/rekam-medis/data?id=' + props.data[i].id_rekam_medis)
|
||||
}
|
||||
}
|
||||
>
|
||||
<QuestionAnswerIcon />
|
||||
</IconButton>
|
||||
</> :
|
||||
<>
|
||||
<IconButton color="success" onClick={
|
||||
() => {
|
||||
preview_rekam_medis(props.data[i].id_rekam_medis)
|
||||
}
|
||||
}>
|
||||
<InfoIcon />
|
||||
</IconButton>
|
||||
</>
|
||||
}
|
||||
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<BootstrapDialog
|
||||
onClose={
|
||||
() => {
|
||||
setOpenDialog(false)
|
||||
}
|
||||
}
|
||||
aria-labelledby="customized-dialog-title"
|
||||
open={openDialog}
|
||||
fullWidth={true}
|
||||
>
|
||||
<BootstrapDialogTitle id="customized-dialog-title" onClose={
|
||||
() => {
|
||||
setOpenDialog(false)
|
||||
}
|
||||
}>
|
||||
Detail Rekam Medis
|
||||
</BootstrapDialogTitle>
|
||||
<DialogContent dividers align="center">
|
||||
<CustomDisableInput
|
||||
id="nikPasienTextField"
|
||||
label="NIK Pasien"
|
||||
// placeholder="Masukkan Nama Pasien"
|
||||
value={
|
||||
(dataRekamMedis != null) ?
|
||||
dataRekamMedis.tb_pasien.nik :
|
||||
""
|
||||
}
|
||||
disabled
|
||||
sx={{
|
||||
width: "90%", boxShadow: 10,
|
||||
"&.MuiInputBase-input.Mui-disabled": {
|
||||
WebkitTextFillColor: "#000",
|
||||
color: "#000"
|
||||
}
|
||||
}}
|
||||
|
||||
/>
|
||||
<Box sx={{ padding: "10px" }}></Box>
|
||||
<CustomDisableInput
|
||||
id="namaPasienTextField"
|
||||
label="Nama Pasien"
|
||||
// placeholder="Masukkan Nama Pasien"
|
||||
value={
|
||||
(dataRekamMedis != null) ?
|
||||
dataRekamMedis.tb_pasien.nama :
|
||||
""
|
||||
}
|
||||
disabled
|
||||
sx={{ width: "90%", boxShadow: 10 }}
|
||||
/>
|
||||
<Box sx={{ padding: "10px" }}></Box>
|
||||
<CustomDisableInput
|
||||
id="tanggalDaftarTextField"
|
||||
label="Tanggal Daftar"
|
||||
// placeholder="Masukkan Nama Pasien"
|
||||
value={
|
||||
(dataRekamMedis != null)
|
||||
?
|
||||
formatInTimeZone(new Date(dataRekamMedis.createdAt), 'Asia/Kuala_Lumpur', 'yyyy-MM-dd | HH:mm:ss')
|
||||
:
|
||||
""
|
||||
}
|
||||
disabled
|
||||
sx={{ width: "90%", boxShadow: 10 }}
|
||||
/>
|
||||
<Box sx={{ padding: "10px" }}></Box>
|
||||
<CustomDisableInput
|
||||
id="tanggalPeriksaTextField"
|
||||
label="Tanggal Periksa"
|
||||
// placeholder="Masukkan Nama Pasien"
|
||||
value={
|
||||
(dataRekamMedis != null)
|
||||
?
|
||||
formatInTimeZone(new Date(dataRekamMedis.updatedAt), 'Asia/Kuala_Lumpur', 'yyyy-MM-dd | HH:mm:ss')
|
||||
:
|
||||
""
|
||||
}
|
||||
disabled
|
||||
sx={{ width: "90%", boxShadow: 10 }}
|
||||
/>
|
||||
<Box sx={{ padding: "10px" }}></Box>
|
||||
<CustomDisableInput
|
||||
disabled
|
||||
id="keluhanPasienTextField"
|
||||
label="Keluhan Pasien"
|
||||
// placeholder="Masukkan Keluhan Pasien"
|
||||
value={
|
||||
(dataRekamMedis != null) ?
|
||||
dataRekamMedis.keluhan :
|
||||
""
|
||||
}
|
||||
multiline
|
||||
rows={6}
|
||||
// maxRows={6}
|
||||
sx={{ width: "90%", boxShadow: 10 }}
|
||||
/>
|
||||
<Box sx={{ padding: "10px" }}></Box>
|
||||
<CustomDisableInput
|
||||
disabled
|
||||
id="diagnosaTextField"
|
||||
label="Diagnosa"
|
||||
// placeholder="Masukkan Diagnosa"
|
||||
value={
|
||||
(dataRekamMedis != null) ?
|
||||
dataRekamMedis.diagnosa :
|
||||
""
|
||||
}
|
||||
multiline
|
||||
rows={6}
|
||||
// maxRows={6}
|
||||
sx={{ width: "90%", boxShadow: 10 }}
|
||||
/>
|
||||
<Box sx={{ padding: "10px" }}></Box>
|
||||
<CustomDisableInput
|
||||
disabled
|
||||
id="keteranganTextField"
|
||||
label="Keterangan"
|
||||
placeholder="Masukkan Keterangan"
|
||||
multiline
|
||||
rows={6}
|
||||
// maxRows={6}
|
||||
value={
|
||||
(dataRekamMedis != null) ?
|
||||
dataRekamMedis.keterangan :
|
||||
""
|
||||
}
|
||||
sx={{ width: "90%", boxShadow: 10 }}
|
||||
/>
|
||||
<Box sx={{ padding: "10px" }}></Box>
|
||||
<Divider />
|
||||
<Box sx={{ padding: "10px" }}></Box>
|
||||
{
|
||||
(selectedTindakan.length > 0)
|
||||
?
|
||||
<FormControl sx={{ m: 1, width: "90%" }}>
|
||||
<InputLabel id="demo-multiple-checkbox-label">Tindakan</InputLabel>
|
||||
<Select
|
||||
disabled
|
||||
labelId="demo-multiple-checkbox-label"
|
||||
id="demo-multiple-checkbox"
|
||||
multiple
|
||||
value={selectedTindakan}
|
||||
placeholder="Tiada Tindakan"
|
||||
input={<OutlinedInput id="select-multiple-chip" label="Chip" />}
|
||||
renderValue={(selected) => (
|
||||
<Box sx={{ display: 'flex', flexWrap: 'wrap', gap: 0.5 }}>
|
||||
{selected.map((value) => (
|
||||
<Chip key={value} label={value} />
|
||||
))}
|
||||
</Box>
|
||||
)}
|
||||
MenuProps={MenuProps}
|
||||
>
|
||||
{selectedTindakan.map((name) => (
|
||||
<MenuItem key={name} value={name}>
|
||||
<Checkbox checked={selectedTindakan.indexOf(name) > -1} />
|
||||
<ListItemText primary={name} />
|
||||
</MenuItem>
|
||||
))}
|
||||
</Select>
|
||||
</FormControl>
|
||||
:
|
||||
<Box align="center">Tiada Tindakan</Box>
|
||||
}
|
||||
<Box sx={{ padding: "10px" }}></Box>
|
||||
<Divider />
|
||||
<Box sx={{ padding: "10px" }}></Box>
|
||||
{
|
||||
(selectedTindakan.length > 0)
|
||||
?
|
||||
<>
|
||||
<FormControl sx={{ m: 1, width: "90%" }}>
|
||||
<InputLabel id="demo-multiple-checkbox-label">Obat</InputLabel>
|
||||
<Select
|
||||
disabled
|
||||
labelId="demo-multiple-checkbox-label"
|
||||
id="demo-multiple-checkbox"
|
||||
multiple
|
||||
value={selectedObat}
|
||||
// placeholder="Tiada Tindakan"
|
||||
input={<OutlinedInput id="select-multiple-chip" label="Chip" />}
|
||||
renderValue={(selected) => (
|
||||
<Box sx={{ display: 'flex', flexWrap: 'wrap', gap: 0.5 }}>
|
||||
{selected.map((value) => (
|
||||
<Chip key={value} label={value} />
|
||||
))}
|
||||
</Box>
|
||||
)}
|
||||
MenuProps={MenuProps}
|
||||
>
|
||||
{selectedObat.map((name) => (
|
||||
<MenuItem key={name} value={name}>
|
||||
<Checkbox checked={selectedObat.indexOf(name) > -1} />
|
||||
<ListItemText primary={name} />
|
||||
</MenuItem>
|
||||
))}
|
||||
</Select>
|
||||
</FormControl>
|
||||
<Box sx={{ padding: "10px" }}></Box>
|
||||
<PenjumlahanObat listObat={listObat} />
|
||||
</>
|
||||
:
|
||||
<Box align="center">Tiada Tindakan</Box>
|
||||
}
|
||||
</DialogContent>
|
||||
<DialogActions>
|
||||
<Button autoFocus onClick={
|
||||
() => {
|
||||
setOpenDialog(false)
|
||||
}
|
||||
|
||||
} variant="outlined">
|
||||
Tutup
|
||||
</Button>
|
||||
</DialogActions>
|
||||
</BootstrapDialog>
|
||||
{component}
|
||||
</>
|
||||
)
|
||||
|
||||
}
|
||||
|
||||
export default TabelJadwalRekamMedis
|
||||
Reference in New Issue
Block a user