From 995f1f76f89b0700c047bae4b5405ddb14c4109d Mon Sep 17 00:00:00 2001 From: korospace Date: Thu, 26 Oct 2023 10:17:17 +0700 Subject: [PATCH] finishing UI adjustment - 1 --- .../layouts/dashboard/navbar/NavConfig.tsx | 7 ++ .../Corporates/DiagnosisExclusion/List.tsx | 74 +++++------ .../src/pages/Master/Diagnosis/Index.tsx | 39 +++--- .../src/pages/Master/Diagnosis/List.tsx | 79 +++++++----- .../Master/Diagnosis/Master/CreateUpdate.tsx | 5 +- .../pages/Master/Diagnosis/Master/Form.tsx | 45 ++++--- .../pages/Master/Diagnosis/Master/Index.tsx | 13 +- .../pages/Master/Diagnosis/Master/List.tsx | 116 ++++++++++-------- frontend/dashboard/src/routes/index.tsx | 8 +- 9 files changed, 207 insertions(+), 179 deletions(-) diff --git a/frontend/dashboard/src/layouts/dashboard/navbar/NavConfig.tsx b/frontend/dashboard/src/layouts/dashboard/navbar/NavConfig.tsx index 6ecadc09..7663ef6c 100644 --- a/frontend/dashboard/src/layouts/dashboard/navbar/NavConfig.tsx +++ b/frontend/dashboard/src/layouts/dashboard/navbar/NavConfig.tsx @@ -90,6 +90,13 @@ const navConfig = [ ], }, + { + title: 'MASTER', + children: [ + { title: 'Diagnosis', path: '/master/diagnosis' }, + + ], + }, { title: 'USER MANAGEMENT', path: '/users', diff --git a/frontend/dashboard/src/pages/Corporates/DiagnosisExclusion/List.tsx b/frontend/dashboard/src/pages/Corporates/DiagnosisExclusion/List.tsx index 71540108..aeba400e 100644 --- a/frontend/dashboard/src/pages/Corporates/DiagnosisExclusion/List.tsx +++ b/frontend/dashboard/src/pages/Corporates/DiagnosisExclusion/List.tsx @@ -283,8 +283,8 @@ export default function List(props: any) { id: number; status: number; code: string, - name: string, - rules: string, + name: string, + rules: string, }; const plans = props?.data.map((plan: any) => { return { @@ -576,32 +576,32 @@ export default function List(props: any) { )} - - - setOpen(!open)}> - - Detail - - navigate(`/corporates/${corporate_id}/diagnosis-exclusions/${row.id}/edit`)} > - - Edit - - handleActivate(true, { - code: row.code, - name: row.name, - rules: Object.keys(row.rules).length ? 'With Rules' : 'All', - id:row.id, - status: row.active, - service: row.service_code - }) - } > - - Update Status - - - } /> - + + + setOpen(!open)}> + + Detail + + navigate(`/corporates/${corporate_id}/diagnosis-exclusions/${row.id}/edit`)} > + + Edit + + handleActivate(true, { + code: row.code, + name: row.name, + rules: Object.keys(row.rules).length ? 'With Rules' : 'All', + id:row.id, + status: row.active, + service: row.service_code + }) + } > + + Update Status + + + } /> + {/* COLLAPSIBLE ROW */} @@ -801,7 +801,7 @@ export default function List(props: any) { const onSubmit = async (row : any) => { try { - handleUpdate(dataValue.status, dataValue.id, row.reason) + handleUpdate(dataValue.status, dataValue.id, row.reason) } catch (error: any) { console.log('data gagal'); } @@ -836,7 +836,7 @@ export default function List(props: any) { resolver: yupResolver(NewCorporateSchema), }); - + const { reset, handleSubmit, @@ -924,7 +924,7 @@ export default function List(props: any) { Cancel - {dataValue?.status == 1? + {dataValue?.status == 1? Inactive - : + : Active - - + + } - + ); @@ -1031,9 +1031,9 @@ export default function List(props: any) { - - - - + + - ); } diff --git a/frontend/dashboard/src/pages/Master/Diagnosis/List.tsx b/frontend/dashboard/src/pages/Master/Diagnosis/List.tsx index 15a62cf7..b65de80d 100644 --- a/frontend/dashboard/src/pages/Master/Diagnosis/List.tsx +++ b/frontend/dashboard/src/pages/Master/Diagnosis/List.tsx @@ -7,7 +7,7 @@ import UploadIcon from '@mui/icons-material/Upload'; import CancelIcon from '@mui/icons-material/Cancel'; import HistoryIcon from '@mui/icons-material/History'; // hooks -import { Link, NavLink as RouterLink } from 'react-router-dom'; +import { Link, NavLink as RouterLink, useNavigate } from 'react-router-dom'; import React, { ChangeEvent, Component, useEffect, useRef, useState } from 'react'; import useSettings from '../../../hooks/useSettings'; import { useParams, useSearchParams } from 'react-router-dom'; @@ -17,13 +17,15 @@ import { LaravelPaginatedData } from '../../../@types/paginated-data'; import { Icd } from '../../../@types/diagnosis'; import BasePagination from '../../../components/BasePagination'; import { enqueueSnackbar } from 'notistack'; +import TableMoreMenu from '@/components/table/TableMoreMenu'; export default function List() { - const { themeStretch } = useSettings(); - const { diagnosis_template_id } = useParams(); - const [searchParams, setSearchParams] = useSearchParams(); - const [importResult, setImportResult] = useState(null); - + const navigate = useNavigate(); + const { themeStretch } = useSettings(); + const { diagnosis_template_id } = useParams(); + const [searchParams, setSearchParams] = useSearchParams(); + const [importResult, setImportResult] = useState(null); + function SearchInput(props: any) { // SEARCH const searchInput = useRef(null); @@ -44,7 +46,7 @@ export default function List() { }, [searchParams]) return ( -
+ ); @@ -55,7 +57,7 @@ export default function List() { // Create Button Menu const [anchorEl, setAnchorEl] = React.useState(null); const createMenu = Boolean(anchorEl); - const importForm = useRef(null) + const importForm = useRef(null) const [currentImportFileName, setCurrentImportFileName] = useState(null) const handleClick = (event: React.MouseEvent) => { @@ -135,8 +137,8 @@ export default function List() { handleClose(); }) } - - + + return (
@@ -145,8 +147,8 @@ export default function List() { {/*

kjasndkjandskjasndkjansdkjansd

*/} )} - {( importResult && + {( importResult && Last Import Result Report : {importResult.result_file?.name ?? "-"} @@ -220,7 +222,7 @@ export default function List() { let updatedModel = model; if (row.id == model.id) { updatedModel.active = res.data.icd.active; - } + } return updatedModel; }), }); @@ -240,15 +242,22 @@ export default function List() { return ( - *': { borderBottom: 'unset' } }}> - {row.code} - {row.name} - - {/* */} - - - - + *': { borderBottom: '1' } }}> + + {row.code} + {row.name} + + + + navigate(`/master/diagnosis/${row.id}/diagnosis-history`)}> + + History + + + } /> + + ); @@ -301,22 +310,29 @@ export default function List() { useEffect(() => { loadDataTableData(); }, []) - + return ( - {/* The Main Table */} - + - + + + + + + + + + Code Description - Action + - + {dataTableIsLoading ? ( @@ -325,7 +341,7 @@ export default function List() { ) : ( - dataTableData.data.length == 0 ? + dataTableData.data.length == 0 ? ( @@ -342,9 +358,8 @@ export default function List() { )}
- + -
); } diff --git a/frontend/dashboard/src/pages/Master/Diagnosis/Master/CreateUpdate.tsx b/frontend/dashboard/src/pages/Master/Diagnosis/Master/CreateUpdate.tsx index 52c960bc..018f009a 100644 --- a/frontend/dashboard/src/pages/Master/Diagnosis/Master/CreateUpdate.tsx +++ b/frontend/dashboard/src/pages/Master/Diagnosis/Master/CreateUpdate.tsx @@ -24,8 +24,8 @@ export default function PlanCreate() { }, [configuredCorporateContext]) const [ currentCorporatePlan, setCurrentCorporatePlan ] = useState(); - - + + const navigate = useNavigate(); const isEdit = !!id; @@ -48,6 +48,7 @@ export default function PlanCreate() { return ( { - navigate('/master/diagnosis-template', { replace: true }); + navigate('/master/diagnosis', { replace: true }); }) .catch(({ response }) => { if (response.status === 422) { - for (const [key, value] of Object.entries(response.data.errors)) { + for (const [key, value] of Object.entries(response.data.errors)) { setError(key, { message: value[0] }); enqueueSnackbar(value[0] ?? 'Failed Processing Request', { variant: 'error' }); } @@ -88,7 +89,7 @@ export default function CorporatePlanForm({ isEdit, currentCorporatePlan }: Prop enqueueSnackbar('Division updated successfully', { variant: 'success' }); }) .then((res) => { - navigate('/master/diagnosis-template' , { replace: true }); + navigate('/master/diagnosis' , { replace: true }); }) .catch(({ response }) => { enqueueSnackbar('Update Failed : '+ response.data.message, { variant: 'error' }); @@ -98,31 +99,27 @@ export default function CorporatePlanForm({ isEdit, currentCorporatePlan }: Prop return ( - - - - + + + + + - Detail + Detail - - + + - - { isEdit? 'Update' : 'Create' } - + + { isEdit? 'Update' : 'Create' } + - - - - {/* - - - - - */} - + + + + + ); } diff --git a/frontend/dashboard/src/pages/Master/Diagnosis/Master/Index.tsx b/frontend/dashboard/src/pages/Master/Diagnosis/Master/Index.tsx index 0afc6518..a3ccff4c 100644 --- a/frontend/dashboard/src/pages/Master/Diagnosis/Master/Index.tsx +++ b/frontend/dashboard/src/pages/Master/Diagnosis/Master/Index.tsx @@ -12,27 +12,26 @@ export default function Divisions() { const { corporate_id } = useParams(); - const pageTitle = 'Diagnosis Template'; + const pageTitle = 'Diagnosis'; return ( - - + - ); } diff --git a/frontend/dashboard/src/pages/Master/Diagnosis/Master/List.tsx b/frontend/dashboard/src/pages/Master/Diagnosis/Master/List.tsx index 67e30f2f..86315323 100644 --- a/frontend/dashboard/src/pages/Master/Diagnosis/Master/List.tsx +++ b/frontend/dashboard/src/pages/Master/Diagnosis/Master/List.tsx @@ -7,7 +7,7 @@ import UploadIcon from '@mui/icons-material/Upload'; import CancelIcon from '@mui/icons-material/Cancel'; import HistoryIcon from '@mui/icons-material/History'; // hooks -import { Link, NavLink as RouterLink } from 'react-router-dom'; +import { Link, NavLink as RouterLink, useNavigate } from 'react-router-dom'; import React, { ChangeEvent, Component, useEffect, useRef, useState } from 'react'; import useSettings from '../../../../hooks/useSettings'; import { useParams, useSearchParams } from 'react-router-dom'; @@ -17,13 +17,16 @@ import { LaravelPaginatedData } from '../../../../@types/paginated-data'; import { Icd } from '../../../../@types/diagnosis'; import BasePagination from '../../../../components/BasePagination'; import { enqueueSnackbar } from 'notistack'; +import TableMoreMenu from '@/components/table/TableMoreMenu'; +import { EditOutlined, FindInPageOutlined } from '@mui/icons-material'; export default function List() { - const { themeStretch } = useSettings(); - const { corporate_id } = useParams(); - const [searchParams, setSearchParams] = useSearchParams(); - const [importResult, setImportResult] = useState(null); - + const navigate = useNavigate(); + const { themeStretch } = useSettings(); + const { corporate_id } = useParams(); + const [searchParams, setSearchParams] = useSearchParams(); + const [importResult, setImportResult] = useState(null); + function SearchInput(props: any) { // SEARCH const searchInput = useRef(null); @@ -44,7 +47,7 @@ export default function List() { }, [searchParams]) return ( -
+ ); @@ -55,7 +58,7 @@ export default function List() { // Create Button Menu const [anchorEl, setAnchorEl] = React.useState(null); const createMenu = Boolean(anchorEl); - const importForm = useRef(null) + const importForm = useRef(null) const [currentImportFileName, setCurrentImportFileName] = useState(null) const handleClick = (event: React.MouseEvent) => { @@ -130,8 +133,8 @@ export default function List() { }) } - - + + return (
@@ -139,17 +142,15 @@ export default function List() { {/*

kjasndkjandskjasndkjansdkjansd

*/} - + @@ -195,7 +196,7 @@ export default function List() { let updatedModel = model; if (row.id == model.id) { updatedModel.active = res.data.icd.active; - } + } return updatedModel; }), }); @@ -211,27 +212,30 @@ export default function List() { return ( - *': { borderBottom: 'unset' } }}> - {row.name} - {row.description ?? '-'} - - {/* */} - - - - - - - - - - - - + *': { borderBottom: '1' } }}> + + {row.name} + {row.description ?? '-'} + + + + navigate(`/master/diagnosis/${row.id}`)}> + + Detail + + navigate(`/master/diagnosis-template/${row.id}/edit`)} > + + Edit + + navigate(`/master/diagnosis-template/${row.id}/diagnosis-template-history`)}> + + History + + + } /> + + ); @@ -285,22 +289,29 @@ export default function List() { useEffect(() => { loadDataTableData(); }, []) - + return ( - + - {/* The Main Table */} - + - + + + + + + + + + Name Description - Action + - + {dataTableIsLoading ? ( @@ -309,7 +320,7 @@ export default function List() { ) : ( - dataTableData.data.length == 0 ? + dataTableData.data.length == 0 ? ( @@ -326,9 +337,8 @@ export default function List() { )}
- + -
); } diff --git a/frontend/dashboard/src/routes/index.tsx b/frontend/dashboard/src/routes/index.tsx index 75a4c793..6e29b290 100644 --- a/frontend/dashboard/src/routes/index.tsx +++ b/frontend/dashboard/src/routes/index.tsx @@ -268,12 +268,12 @@ export default function Router() { element: , }, { - path: 'master/diagnosis-template/create', - element: , + path: 'master/diagnosis', + element: , }, { - path: 'master/diagnosis-template', - element: , + path: 'master/diagnosis/create', + element: , }, { path: 'master/diagnosis-template/:id/diagnosis-template-history',