From f5c1d7c4ab12c3476bd18a7c6453dee84884c68d Mon Sep 17 00:00:00 2001 From: kicap1992 Date: Wed, 4 May 2022 23:31:12 +0800 Subject: [PATCH] complete changes on admin and slight changes on page routes loading --- components/admin/appBar.js | 1 + components/admin/tabelJadwalDokter.js | 31 +++- components/before_login/body.js | 55 +++--- pages/admin/data-dokter.js | 8 +- pages/admin/data-obat.js | 12 +- pages/admin/data-pasien.js | 10 +- pages/admin/data-tindakan.js | 249 ++++++++++++++++++++++---- pages/admin/index.js | 21 ++- server/routes/admin_router.js | 59 ++++++ 9 files changed, 376 insertions(+), 70 deletions(-) diff --git a/components/admin/appBar.js b/components/admin/appBar.js index 28c3965..f20277d 100644 --- a/components/admin/appBar.js +++ b/components/admin/appBar.js @@ -222,6 +222,7 @@ function AppBarAdmin(props) { function handleMenuRoute(menu){ // console.log(menu + " sini menunya di appbar") + props.toRoute() Router.push(menu) } diff --git a/components/admin/tabelJadwalDokter.js b/components/admin/tabelJadwalDokter.js index 8f26f69..3b8e7c2 100644 --- a/components/admin/tabelJadwalDokter.js +++ b/components/admin/tabelJadwalDokter.js @@ -103,6 +103,7 @@ function TabelJadwalDokter(props) { const jamSelesaiInputRef = useRef(); const [jamMulai, setJamMulai] = useState(null); const [jamSelesai, setJamSelesai] = useState(null); + const [status, setStatus] = useState(''); useEffect(() => { setHari(props.hari_nya) @@ -141,20 +142,22 @@ function TabelJadwalDokter(props) { await MySwal.fire({ title: 'Yakin ?', - text: `Jadwal Pada Hari ${hari} akan ditambahkan ke dokter dengan nik ${nik}`, + text: (status == 'tambah') ? `Jadwal Pada Hari ${hari} akan ditambahkan ke dokter dengan nik ${nik}` : `Jadwal Pada Hari ${hari} akan diubah ke dokter dengan nik ${nik}`, icon: 'info', showCancelButton: true, confirmButtonColor: '#3085d6', cancelButtonColor: '#d33', - confirmButtonText: 'Ya, tambahkan!' + confirmButtonText: (status == 'tambah') ? 'Ya, tambahkan!' : 'Ya, ubah!', }).then(async (result) => { if (result.value) { props.backdropnya(true); + + try { const url = process.env.HTTP_URL + "/api/admin/jadwal_dokter"; const response = await fetch(url, { - method: 'POST', + method: (status == 'tambah') ? 'POST' : 'PUT', headers: { 'Content-Type': 'application/json', 'allow-cors-origin': '*', @@ -210,6 +213,7 @@ function TabelJadwalDokter(props) { () => { setHari(props.harinya[i]) setOpenDialog(true) + setStatus("tambah") } }> @@ -226,7 +230,21 @@ function TabelJadwalDokter(props) { {props.dataJadwal[j].jam_mulai} {props.dataJadwal[j].jam_selesai} - + { + setHari(props.harinya[i]) + let today = new Date() + let jam_mulai_new = new Date(today.getFullYear(), today.getMonth(), today.getDate(), props.dataJadwal[j].jam_mulai.split(":")[0], props.dataJadwal[j].jam_mulai.split(":")[1]) + let jam_selesai_new = new Date(today.getFullYear(), today.getMonth(), today.getDate(), props.dataJadwal[j].jam_selesai.split(":")[0], props.dataJadwal[j].jam_selesai.split(":")[1]) + + setJamMulai(jam_mulai_new) + setJamSelesai(jam_selesai_new) + setOpenDialog(true) + setStatus("edit") + } + } + > @@ -272,6 +290,7 @@ function TabelJadwalDokter(props) { label="Jam Mulai" value={jamMulai} onChange={(newValue) => { + console.log(newValue, "ini new value") setJamMulai(newValue); }} renderInput={(params) => } @@ -296,7 +315,9 @@ function TabelJadwalDokter(props) { diff --git a/components/before_login/body.js b/components/before_login/body.js index cd4ef03..55a472b 100644 --- a/components/before_login/body.js +++ b/components/before_login/body.js @@ -1,5 +1,5 @@ -import { useRef, useState } from "react"; +import { useRef, useState ,useEffect } from "react"; import { useRouter } from "next/router"; @@ -55,18 +55,15 @@ const StyledTableCell = styled(TableCell)(({ theme }) => ({ } })); -// const useStyles = makeStyles({ -// table: { -// minWidth: 650, -// "& .MuiTableCell-root": { -// borderLeft: "1px solid rgba(224, 224, 224, 1)" -// } -// } -// }); export default function GridIndex(props) { - // console.log(props) - const [errornya , setError] = useState(props.errornya) + console.log(props) + const [errornya, setError] = useState(props.errornya) + const [jadwal_dokter, setJadwalDokter] = useState(false); + + useEffect(() => { + setJadwalDokter(props.jadwal_dokter) + },[props.jadwal_dokter]) if (errornya == true) { MySwal.fire({ @@ -121,7 +118,7 @@ export default function GridIndex(props) { if (role == 'Admin') { // redirect to dashboard await router.replace('/admin'); - }else if (role == 'Dokter') { + } else if (role == 'Dokter') { // redirect to dashboard await router.replace('/dokter'); } @@ -189,16 +186,32 @@ export default function GridIndex(props) { { - props.jadwal_dokter.map((jadwal, index) => { - return ( - - {jadwal.tb_dokter.nama} - {jadwal.tb_dokter.spesialis} - {jadwal.jam_mulai} - {jadwal.jam_selesai} + // (jadwal_dokter == false) + // ? + // + // + // Masalah Dengan Server + // + // + // : + (jadwal_dokter.length > 0) + ? + jadwal_dokter.map((jadwal, index) => { + return ( + + {jadwal.tb_dokter.nama} + {jadwal.tb_dokter.spesialis} + {jadwal.jam_mulai} + {jadwal.jam_selesai} + + ) + }) + : + + + Tidak Ada Jadwal Praktek + - ) - }) } diff --git a/pages/admin/data-dokter.js b/pages/admin/data-dokter.js index 91666a4..8cf570a 100644 --- a/pages/admin/data-dokter.js +++ b/pages/admin/data-dokter.js @@ -379,7 +379,13 @@ function DataDokterPage(props) { theme.zIndex.drawer + 1 }}> - + { + setBackdrop(true); + } + } + /> diff --git a/pages/admin/data-obat.js b/pages/admin/data-obat.js index 31d848e..0314093 100644 --- a/pages/admin/data-obat.js +++ b/pages/admin/data-obat.js @@ -593,7 +593,7 @@ function DataObatPage(props) { } return ( -
+ <> theme.zIndex.drawer + 1 }}> - + { + setBackdrop(true); + } + } + /> @@ -916,7 +922,7 @@ function DataObatPage(props) { -
+ ); } diff --git a/pages/admin/data-pasien.js b/pages/admin/data-pasien.js index 28ab040..d34d2d2 100644 --- a/pages/admin/data-pasien.js +++ b/pages/admin/data-pasien.js @@ -641,7 +641,13 @@ function DataPasienPage(props) { - + { + setBackdrop(true); + } + } + /> @@ -1184,7 +1190,7 @@ function DataPasienPage(props) { }) : - + Tiada Jadwal Pasien diff --git a/pages/admin/data-tindakan.js b/pages/admin/data-tindakan.js index c111672..f07ea24 100644 --- a/pages/admin/data-tindakan.js +++ b/pages/admin/data-tindakan.js @@ -44,6 +44,52 @@ import IconButton from '@mui/material/IconButton'; import ModeEditIcon from '@mui/icons-material/ModeEdit'; import DeleteForeverIcon from '@mui/icons-material/DeleteForever'; +// for dialog +import PropTypes from 'prop-types'; +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'; + +const BootstrapDialog = styled(Dialog)(({ theme }) => ({ + '& .MuiDialogContent-root': { + padding: theme.spacing(2), + }, + '& .MuiDialogActions-root': { + padding: theme.spacing(1), + }, +})); + +const BootstrapDialogTitle = (props) => { + const { children, onClose, ...other } = props; + + return ( + + {children} + {onClose ? ( + theme.palette.grey[500], + }} + > + + + ) : null} + + ); +}; + +BootstrapDialogTitle.propTypes = { + children: PropTypes.node, + onClose: PropTypes.func.isRequired, +}; + const StyledTableCell = styled(TableCell)(({ theme }) => ({ [`&.${tableCellClasses.head}`]: { @@ -116,7 +162,7 @@ function TindakanPage(props) { // delete tindakan async function delete_tindakan(id) { // console.log(id, "ini id yang akan di delete") - try{ + try { const url = process.env.HTTP_URL + "/api/admin/tindakan?id=" + id console.log(url, "ini url yang akan di delete") // create fetch post request @@ -128,7 +174,7 @@ function TindakanPage(props) { 'crossDomain': true, 'Authorization': 'Basic ' + btoa(`${process.env.ADMIN_AUTH}:${process.env.ADMIN_PASSWORD}`) }, - + }) // get response const data = await response.json() @@ -139,12 +185,12 @@ function TindakanPage(props) { toast.success(data.message) Router.replace(Router.asPath) // return true - }else{ + } else { // create toast toast.error(data.message) // return false } - }catch(err){ + } catch (err) { console.log(err) toast.error("Terjadi kesalahan pada server") } @@ -175,7 +221,7 @@ function TindakanPage(props) { if (!response) { // focus to input tindakanInputRef.current.focus(); - }else{ + } else { // clear input tindakanInputRef.current.value = ""; Router.replace(Router.asPath); @@ -188,7 +234,7 @@ function TindakanPage(props) { } // before delete tindakan - async function deleteTindakan(id,nama){ + async function deleteTindakan(id, nama) { console.log(id, "ini id yang akan di hapus") await setSweetAlertLoading(true); await MySwal.fire({ @@ -212,13 +258,132 @@ function TindakanPage(props) { await setSweetAlertLoading(false); } + const [openDialog, setOpenDialog] = useState(false); + const [idEdit, setIdEdit] = useState(null); + const tindakanEditInputRef = useRef(); + const [tindakanEdit, setTindakanEdit] = useState(null); + const [periksaTindakanEdit, setPeriksaTindakanEdit] = useState(null); + + const editTindakan = async (e) => { + e.preventDefault(); + if(tindakanEdit == periksaTindakanEdit){ + toast.error("Tiada Perubahan") + // focus input + tindakanEditInputRef.current.focus(); + return + }else{ + setSweetAlertLoading(true); + setOpenDialog(false); + await MySwal.fire({ + title: 'Yakin ?', + text: `Anda akan mengubah detail Tindakan ${periksaTindakanEdit} ke ${tindakanEdit}`, + icon: 'info', + showCancelButton: true, + confirmButtonColor: '#3085d6', + cancelButtonColor: '#d33', + confirmButtonText: 'Ya, Ubah!', + cancelButtonText: 'Batal', + }).then(async (result) => { + if (result.value) { + setBackdrop(true); + // await 4 sec + try { + const url = process.env.HTTP_URL + "/api/admin/tindakan?id=" + idEdit + // create fetch post request + const response = await fetch(url, { + method: 'PUT', + headers: { + 'Content-Type': 'application/json', + 'allow-cors-origin': '*', + 'crossDomain': true, + 'Authorization': 'Basic ' + btoa(`${process.env.ADMIN_AUTH}:${process.env.ADMIN_PASSWORD}`) + }, + body: JSON.stringify({ + tindakan: tindakanEdit + }) + }) + + // get response + const data = await response.json() + if( response.status === 200 ){ + // create toast + toast.success(data.message) + Router.replace(Router.asPath) + }else{ + // create toast + toast.error(data.message) + } + + } catch (error) { + toast.error("Terjadi kesalahan pada server") + console.log(error) + } + + } else { + setOpenDialog(true); + } + }) + + setBackdrop(false); + setSweetAlertLoading(false); + } + } + return ( -
+ <> theme.zIndex.drawer + 1 }}> + + + { + setOpenDialog(false); + } + } + > + Edit Tindakan + + + { + setTindakanEdit(e.target.value); + }} + placeholder="Masukkan Tindakan " + sx={{ width: "85%", boxShadow: 10 }} + required + /> + + + + + + - + { + setBackdrop(true); + } + } + /> @@ -276,34 +441,50 @@ function TindakanPage(props) { Aksi - {/* Fat (g) - Carbs (g) - Protein (g) */} - {props.tindakan.map((row) => ( - - - {row.nama_tindakan} - - - - - - { - deleteTindakan(row.id_tindakan, row.nama_tindakan) - } - } > - - - - - ))} + { + (props.tindakan.length > 0) + ? + props.tindakan.map((row) => ( + + + {row.nama_tindakan} + + + { + setOpenDialog(true); + setIdEdit(row.id_tindakan); + setTindakanEdit(row.nama_tindakan); + setPeriksaTindakanEdit(row.nama_tindakan); + } + } + > + + + { + deleteTindakan(row.id_tindakan, row.nama_tindakan) + } + } > + + + + + )) + : + + + Tiada Data + + + } @@ -318,7 +499,7 @@ function TindakanPage(props) { -
+ ); } diff --git a/pages/admin/index.js b/pages/admin/index.js index 25aca57..ff0953b 100644 --- a/pages/admin/index.js +++ b/pages/admin/index.js @@ -18,6 +18,11 @@ import AppBarAdmin from '../../components/admin/appBar'; import Backdrop from '@mui/material/Backdrop'; import CircularProgress from '@mui/material/CircularProgress'; +// sweet alert +import Swal from 'sweetalert2' +import withReactContent from 'sweetalert2-react-content' +const MySwal = withReactContent(Swal) + // this for check session let all_function = require('../../function/all_function.js') import { withIronSessionSsr } from "iron-session/next"; @@ -55,7 +60,9 @@ const DrawerHeader = styled('div')(({ theme }) => ({ function AdminIndexPage() { // console.log(localStorage.getItem("user_data")) - const [backdrop, setBackdrop] = useState(false); + + const [backdrop, setBackdrop] = useState(false); //this is for backdrop + const [sweetAlertLoading, setSweetAlertLoading] = useState(false); //this is for sweet alert loading // async function cek_user(){ // setBackdrop(true); @@ -67,12 +74,18 @@ function AdminIndexPage() { // cek_user() return ( -
+ <> {/* */} theme.zIndex.drawer + 1 }}> - + { + setBackdrop(true); + } + } + /> @@ -192,7 +205,7 @@ function AdminIndexPage() { {/* */} -
+ ); } diff --git a/server/routes/admin_router.js b/server/routes/admin_router.js index 3846567..6f26409 100644 --- a/server/routes/admin_router.js +++ b/server/routes/admin_router.js @@ -105,6 +105,37 @@ router.delete('/tindakan', basicAuthMiddleware, async (req, res) => { } }) +// create /tindakan put request +router.put('/tindakan', basicAuthMiddleware, async (req, res) => { + try{ + const id = req.query.id + const tindakan = req.body.tindakan + if (!id) { + return res.status(400).send({ status: false, message: `id tidak boleh kosong` }) + } + + let cek_tindakan = await tb_tindakan.findOne({ + where: { + id_tindakan: id + } + }) + + if (!cek_tindakan) { + return res.status(400).send({ status: false, message: `Tindakan dengan id ${id} tidak ditemukan` }) + } + + await cek_tindakan.update({ + nama_tindakan: tindakan + }) + + res.status(200).send({ status: true, message: `Tindakan dengan id ${id} berhasil diubah` }) + + }catch(err){ + console.log(err) + res.status(500).send({ status: false, message: "internal server error" }) + } +}) + // create /obat post request router.post('/obat', basicAuthMiddleware, async (req, res) => { console.log("sini untuk obat post") @@ -611,6 +642,34 @@ router.post('/jadwal_dokter', basicAuthMiddleware, async (req, res) => { } }) +// create /jadwal_dokter put request +router.put('/jadwal_dokter', basicAuthMiddleware, async (req, res) => { + try{ + const data_jadwal = req.body + if( !data_jadwal.id_dokter || !data_jadwal.hari || !data_jadwal.jam_mulai || !data_jadwal.jam_selesai){ + return res.status(400).send({ status: false, message: `Data tidak lengkap` }) + } + let cek_dokter = await tb_dokter.findOne({ + where: { + nik: data_jadwal.id_dokter + } + }) + if(!cek_dokter){ + return res.status(400).send({ status: false, message: `Dokter dengan id ${data_jadwal.id_dokter} tidak ditemukan` }) + } + await tb_jadwal_dokter.update(data_jadwal, { + where: { + id_dokter: data_jadwal.id_dokter, + hari: data_jadwal.hari + } + }) + res.status(200).send({ status: true, message: `Jadwal dokter dengan NIK ${data_jadwal.id_dokter} berhasil diubah` }) + }catch(err){ + console.log(err) + res.status(500).send({ status: false, message: "internal server error" }) + } +}) + // create /jadwal_pasien get request router.get('/jadwal_pasien', basicAuthMiddleware, async (req, res) => { console.log("sini untuk jadwal get")