This commit is contained in:
2023-10-06 14:57:33 +07:00
parent 1d11e06178
commit 5376873552
50 changed files with 3683 additions and 150 deletions

View File

@@ -0,0 +1 @@
export { default as TableMoreMenu } from './TableMoreMenu';

View File

@@ -0,0 +1,60 @@
import { useEffect, useState } from 'react';
// @mui
import { IconButton } from '@mui/material';
//
import Iconify from '../Iconify';
import MenuPopover from '../MenuPopover';
// ----------------------------------------------------------------------
type Props = {
actions: React.ReactNode;
disableRipple?: boolean;
};
export default function TableMoreMenu({ actions, disableRipple }: Props) {
const [open, setOpen] = useState<HTMLElement | null>(null);
// Close menu popover
useEffect(() => {
setOpen(null);
}, [actions])
const handleOpen = (event: React.MouseEvent<HTMLElement>) => {
setOpen(event.currentTarget);
};
const handleClose = () => {
setOpen(null);
};
return (
<>
<IconButton onClick={handleOpen} disableRipple={disableRipple}>
<Iconify icon={'eva:more-vertical-fill'} width={20} height={20} />
</IconButton>
<MenuPopover
open={Boolean(open)}
anchorEl={open}
onClose={handleClose}
anchorOrigin={{ vertical: 'top', horizontal: 'left' }}
transformOrigin={{ vertical: 'top', horizontal: 'right' }}
arrow="right-top"
sx={{
mt: -1,
width: 'auto',
minWidth: 160,
'& .MuiMenuItem-root': {
px: 1,
typography: 'body2',
borderRadius: 0.75,
'& svg': { mr: 2, width: 20, height: 20 },
},
}}
>
{actions}
</MenuPopover>
    </>
  );
}

View File

@@ -35,11 +35,11 @@ export default function Divisions() {
},
{
name: corporate?.name ?? '-',
href: '/corporate/' + corporate_id,
href: '/corporates/' + corporate_id,
},
{
name: 'Benefit',
href: '/corporate/' + corporate_id + '/benefits',
href: '/corporates/' + corporate_id + '/benefits',
},
]}
/>

View File

@@ -33,11 +33,11 @@ export default function Divisions() {
},
{
name: corporate?.name ?? '-',
href: '/corporate/' + corporate_id,
href: '/corporates/' + corporate_id,
},
{
name: 'Claim History',
href: '/corporate/' + corporate_id + '/claim-histories',
href: '/corporates/' + corporate_id + '/claim-histories',
},
]}
/>

View File

@@ -32,11 +32,11 @@ export default function Divisions() {
},
{
name: corporate?.name ?? '-',
href: '/corporate/' + corporate_id,
href: '/corporates/' + corporate_id,
},
{
name: 'Corporate Plan',
href: '/corporate/' + corporate_id + '/corporate-plans',
href: '/corporates/' + corporate_id + '/corporate-plans',
},
]}
/>

View File

@@ -89,7 +89,7 @@ export default function CorporateTabNavigations({ position }: Props) {
<Tab
key={index}
onClick={() => {
navigate('/corporate/' + corporate_id + '/' + mainTabItems[index].path);
navigate('/corporates/' + corporate_id + '/' + mainTabItems[index].path);
}}
label={tabItem.label}
/>

View File

@@ -36,11 +36,11 @@ export default function Divisions() {
},
{
name: corporate?.name ?? '-',
href: '/corporate/' + corporate_id,
href: '/corporates/' + corporate_id,
},
{
name: 'Diagnosis Exclusion',
href: '/corporate/' + corporate_id + '/diagnosis-exclusions',
href: '/corporates/' + corporate_id + '/diagnosis-exclusions',
},
]}
/>

View File

@@ -32,15 +32,15 @@ export default function Divisions() {
links={[
{
name: 'Corporates',
href: '/corporate',
href: '/corporates',
},
{
name: corporate?.name ?? '-',
href: '/corporate/' + corporate_id,
href: '/corporates/' + corporate_id,
},
{
name: 'Division',
href: '/corporate/' + corporate_id + '/divisions',
href: '/corporates/' + corporate_id + '/divisions',
},
]}
/>

View File

@@ -10,14 +10,19 @@ import { styled } from '@mui/material/styles';
import { LoadingButton } from '@mui/lab';
import {
Box,
Button,
Card,
FormControl,
FormControlLabel,
FormHelperText,
FormLabel,
Grid,
InputLabel,
Menu,
MenuItem,
OutlinedInput,
Radio,
RadioGroup,
Select,
SelectChangeEvent,
Stack,
@@ -44,6 +49,8 @@ import { fCurrency } from '../../utils/formatNumber';
import RHFAutocomplete from '../../components/hook-form/RHFAutocomplete';
import UploadImage from '../../components/UploadImage';
import { fPostFormat } from '@/utils/formatTime';
import AddIcon from '@mui/icons-material/Add';
import Link from '@/theme/overrides/Link';
const LabelStyle = styled(Typography)(({ theme }) => ({
...theme.typography.subtitle2,
@@ -117,12 +124,14 @@ export default function CorporateForm({ isEdit, currentCorporate }: Props) {
NewCorporateSchema = Yup.object().shape({
isEdited: Yup.boolean(),
name: Yup.string().required('Name is required'),
code: Yup.string()
.required('Corporate Code is required')
.test('unique-code', 'Code must be unique', async function (value) {
const existingCodes = await getExistingCodes();
return !existingCodes.includes(value);
}),
}),
// payor_id: Yup.string().required('Payor is required'),
active: Yup.boolean().required('Corporate Status is required'),
type: Yup.string().required('Type is required'),
welcome_message: Yup.string().required('Welcome Message is required'),
@@ -487,9 +496,10 @@ export default function CorporateForm({ isEdit, currentCorporate }: Props) {
<Card sx={{ p: 3 }}>
<Stack spacing={3}>
<Grid item xs={12}>
<Typography variant="h5">Corporate Profile</Typography>
<Typography variant="h5" color="#19BBBB">Corporate Profile</Typography>
</Grid>
<Typography variant='subtitle1' color="#637381">Corporate Profile*</Typography>
<RHFSelect name="type" label="Type" placeholder="Type">
<option value="" />
{types.map((option, index) => (
@@ -516,10 +526,13 @@ export default function CorporateForm({ isEdit, currentCorporate }: Props) {
))}
</RHFSelect>
)}
<Typography variant='subtitle1' color="#637381">Corporate Code*</Typography>
<RHFTextField name="code" label="Corporate Code" disabled={isDisabled} />
<Typography variant='subtitle1' color="#637381">Corporate Name*</Typography>
<RHFTextField name="name" label="Corporate Name" disabled={isDisabled} />
<Typography variant='subtitle1' color="#637381">Payor ID*</Typography>
<RHFTextField name="payor_id" label="Payor ID" disabled={isDisabled} />
{isEdit && (
@@ -534,15 +547,15 @@ export default function CorporateForm({ isEdit, currentCorporate }: Props) {
)}
<Stack spacing={1}>
<Typography variant="subtitle2" sx={{ color: 'text.secondary' }}>
Welcome Message
<Typography variant="subtitle1" color="#637381">
Welcome Message *
</Typography>
<RHFEditor name="welcome_message" />
<RHFEditor name="welcome_message" placeholder="Akun anda telah terverifikasi"/>
</Stack>
<Stack spacing={1}>
<Typography variant="subtitle2" sx={{ color: 'text.secondary' }}>
Help Text
<Typography variant="subtitle1" color="#637381">
Help Text *
</Typography>
<RHFEditor name="help_text" />
</Stack>
@@ -614,27 +627,30 @@ export default function CorporateForm({ isEdit, currentCorporate }: Props) {
{/* <Card sx={{ p:3, mb:3, background: 'gray', color: 'white' }}><Typography>Policy Detail</Typography></Card> */}
<Card sx={{ p: 3 }}>
<Stack spacing={3} mt={2}>
<Typography variant="h5">Policy Detail</Typography>
<Typography variant="h5" color="#19BBBB">Policy Detail</Typography>
<input type="hidden" name="policy_id" />
<Stack spacing={1}>
<Typography variant="subtitle2">Policy Number*</Typography>
<RHFTextField name="policy_code" label="Policy Number" />
{!currentCorporate?.id && (
<Typography variant="caption">Will be generated if empty</Typography>
)}
</Stack>
{/* <Typography>Minimal Deposit Policy Level</Typography> */}
<Stack direction="row" spacing={2}>
<Grid item xs={12} md={6}>
<RHFDatepicker name="policy_start" label="Start Date" />
<Typography variant="subtitle2" sx={{marginBottom: '10px'}}>Tanggal Mulai Kerjasama*</Typography>
<RHFDatepicker name="policy_start" label="Start Date *" />
</Grid>
<Grid item xs={12} md={6}>
<RHFDatepicker name="policy_end" label="End Date" />
<Typography variant="subtitle2" sx={{marginBottom: '10px'}}>Tanggal Akhir Kerjasama*</Typography>
<RHFDatepicker name="policy_end" label="End Date *" />
</Grid>
</Stack>
<Typography variant="subtitle2">Deposit Intial Fund*</Typography>
<RHFTextField
name="policy_total_premi"
label={'Deposit Intial Fund (' + fCurrency(values.policy_total_premi) + ')'}
@@ -643,7 +659,7 @@ export default function CorporateForm({ isEdit, currentCorporate }: Props) {
<Grid item xs={12}>
<Grid container spacing={2}>
<Grid item xs={12}>
<Typography variant="subtitle2" sx={{ color: 'text.secondary' }}>
<Typography variant="subtitle2">
Minimal Deposit Policy Level
</Typography>
</Grid>
@@ -667,7 +683,7 @@ export default function CorporateForm({ isEdit, currentCorporate }: Props) {
<Grid item xs={12}>
<Grid container spacing={2}>
<Grid item xs={12}>
<Typography variant="subtitle2" sx={{ color: 'text.secondary' }}>
<Typography variant="subtitle2">
Minimal Alert Level
</Typography>
</Grid>
@@ -691,7 +707,7 @@ export default function CorporateForm({ isEdit, currentCorporate }: Props) {
<Grid item xs={12}>
<Grid container spacing={2}>
<Grid item xs={12}>
<Typography variant="subtitle2" sx={{ color: 'text.secondary' }}>
<Typography variant="subtitle2">
Stop Service Level
</Typography>
</Grid>
@@ -716,6 +732,82 @@ export default function CorporateForm({ isEdit, currentCorporate }: Props) {
</Grid>
)}
{/* Type contrack */}
<Grid item xs={12} md={12}>
<Card sx={{ p: 3 }}>
<Stack direction="row" spacing={2}>
<Grid item xs={12} md={6}>
<Typography variant="h5" color="#19BBBB">Tipe Pembayaran</Typography>
</Grid>
<Grid container item xs={12} md={12} justifyContent="flex-end">
<Button
size='small'
variant="contained"
startIcon={<AddIcon sx={{ color: 'black', fontWeight: 'bold' }} />}
sx={{ p: 1.8, typography: 'subtitle2', backgroundColor: '#DFE3E8' }}
>
<Typography variant="subtitle2" color="black">Contract</Typography>
</Button>
</Grid>
</Stack>
<Grid item xs={12} md={12}>
<Typography variant="h5">#1</Typography>
</Grid>
<Stack direction="row" spacing={4} sx={{marginTop: '24px'}}>
<Grid item xs={12} md={6}>
<Typography variant="subtitle1" >Tanggal Mulai Kontrak*</Typography>
</Grid>
<Grid container item xs={12} md={6}>
<Typography variant="subtitle1">Tanggal Akhir Kontrak*</Typography>
</Grid>
</Stack>
<Stack direction="row" spacing={4} sx={{marginTop: '24px'}}>
<Grid item xs={12} md={6}>
<RHFDatepicker name="contract_start" label="Start Date" />
</Grid>
<Grid item xs={12} md={6}>
<RHFDatepicker name="contract_start" label="End Date" />
</Grid>
</Stack>
<Grid item xs={12} md={12} sx={{marginTop: '24px'}}>
<Typography variant="subtitle2">Tipe Pembayaran</Typography>
<RadioGroup
aria-labelledby="demo-radio-buttons-group-label"
defaultValue="female"
name="type_payment"
>
<FormControlLabel value="1" control={<Radio />} label="Deposit" />
<FormControlLabel value="2" control={<Radio />} label="Hutang" />
<FormControlLabel value="3" control={<Radio />} label="Penagihan Hutang" />
</RadioGroup>
</Grid>
<Stack direction="row" spacing={2}>
<Grid container item xs={12} md={12} justifyContent="flex-end">
<Button
size='small'
variant="contained"
startIcon={<AddIcon sx={{ color: 'black', fontWeight: 'bold' }} />}
sx={{ p: 1.8, typography: 'subtitle2', backgroundColor: '#FFFFFF', marginRight: '20px' }}
>
<Typography variant="subtitle2" color="black">Cancel</Typography>
</Button>
<LoadingButton
type="submit"
variant="contained"
size="small"
loading={isSubmitting}
>
<Typography variant="subtitle2" color="black">Save</Typography>
</LoadingButton>
</Grid>
</Stack>
</Card>
</Grid>
<Grid item xs={12} md={4}>
<LoadingButton
type="submit"

View File

@@ -34,11 +34,11 @@ export default function CorporateFormularium() {
},
{
name: corporate?.name ?? '-',
href: '/corporate/' + corporate_id,
href: '/corporates/' + corporate_id,
},
{
name: 'Formularium',
href: '/corporate/' + corporate_id + '/formularium',
href: '/corporates/' + corporate_id + '/formularium',
},
]}
/>

View File

@@ -121,11 +121,11 @@ export default function CustomizedAccordions() {
},
{
name: corporate?.name ?? '-',
href: '/corporate/' + corporate_id,
href: '/corporates/' + corporate_id,
},
{
name: 'Audittrail Corporate',
href: '/corporate/' + corporate_id + '/plans',
href: '/corporates/' + corporate_id + '/plans',
},
]}
/>
@@ -157,12 +157,13 @@ export default function CustomizedAccordions() {
}
switch (key) {
case 'welcome_message':
renderedValue = item.new_values[key].replace(/<[^>]*>/g, '');
value = value.replace(/<[^>]*>/g, '');
// renderedValue = item.new_values[key].replace(/<[^>]*>/g, '');
renderedValue = item.new_values[key];
value = value;
break;
case 'help_text':
renderedValue = item.new_values[key].replace(/<[^>]*>/g, '');
value = value.replace(/<[^>]*>/g, '');
renderedValue = item.new_values[key];
value = value;
break;
case 'active':
renderedValue = item.new_values[key] == 1 ? 'Active' : 'Inactive';

View File

@@ -34,11 +34,11 @@ export default function Divisions() {
},
{
name: corporate?.name ?? '-',
href: '/corporate/' + corporate_id,
href: '/corporates/' + corporate_id,
},
{
name: 'Hospitals',
href: '/corporate/' + corporate_id + '/hospitals',
href: '/corporates/' + corporate_id + '/hospitals',
},
]}
/>

View File

@@ -30,6 +30,9 @@ import KeyboardArrowRightIcon from '@mui/icons-material/KeyboardArrowRight';
import PublishIcon from '@mui/icons-material/Publish';
import AddIcon from '@mui/icons-material/Add';
import HistoryIcon from '@mui/icons-material/History';
import MoreVertIcon from '@mui/icons-material/MoreVert';
import EditOutlinedIcon from '@mui/icons-material/EditOutlined';
import SettingsOutlinedIcon from '@mui/icons-material/SettingsOutlined';
// hooks
import useSettings from '../../hooks/useSettings';
@@ -37,7 +40,7 @@ import useSettings from '../../hooks/useSettings';
import Page from '../../components/Page';
import axios from '../../utils/axios';
import useAuth from '../../hooks/useAuth';
import { Link, NavLink as RouterLink, useSearchParams } from 'react-router-dom';
import { Link, NavLink as RouterLink, useNavigate, useSearchParams } from 'react-router-dom';
import React, { ChangeEvent, useEffect, useRef, useState } from 'react';
import { Theme, useTheme } from '@mui/material/styles';
import { Corporate } from '../../@types/corporates';
@@ -47,10 +50,18 @@ import BasePagination from '../../components/BasePagination';
import { fCurrency } from '../../utils/formatNumber';
import { enqueueSnackbar } from 'notistack';
import { fDate } from '@/utils/formatTime';
import Popover from '@mui/material/Popover';
import PopupState, { bindTrigger, bindPopover } from 'material-ui-popup-state';
import ButtonStyles from '../../theme/overrides/Button';
import TableMoreMenu from '@/components/table/TableMoreMenu';
import Iconify from '@/components/Iconify';
export default function Corporates() {
const { themeStretch } = useSettings();
const [searchParams, setSearchParams] = useSearchParams();
const navigate = useNavigate()
// Called on every row to map the data to the columns
function createData(corporate: Corporate): Corporate {
@@ -181,7 +192,8 @@ export default function Corporates() {
ref={searchInput}
label="Search"
variant="outlined"
fullWidth
// fullWidth
style={{ width: '85%' }}
onChange={handleSearchChange}
value={searchText}
/>
@@ -246,8 +258,8 @@ export default function Corporates() {
Import
</Button> */}
<Link to={'/corporates/create'}>
<Button variant="outlined" startIcon={<AddIcon />} sx={{ p: 1.8 }}>
Create
<Button variant="contained" startIcon={<AddIcon sx={{}} />} sx={{ p: 1.8, typography: 'subtitle2', backgroundColor: '#19BBBB' }}>
New Corporate
</Button>
</Link>
{/* </Grid> */}
@@ -265,6 +277,7 @@ export default function Corporates() {
function Row(props: { row: ReturnType<typeof createData> }) {
const { row } = props;
const [open, setOpen] = React.useState(false);
const navigate = useNavigate()
const handleActivate = (model: any, status: string) => {
axios
@@ -295,11 +308,11 @@ export default function Corporates() {
return (
<React.Fragment>
<TableRow sx={{ '& > *': { borderBottom: 'unset' } }}>
<TableRow >
<TableCell>
<IconButton aria-label="expand row" size="small" onClick={() => setOpen(!open)}>
{/* <IconButton aria-label="expand row" size="small" onClick={() => setOpen(!open)}>
{open ? <KeyboardArrowDownIcon /> : <KeyboardArrowRightIcon />}
</IconButton>
</IconButton> */}
</TableCell>
<TableCell align="left">{row.code}</TableCell>
<TableCell align="left">{row.name}</TableCell>
@@ -330,7 +343,7 @@ export default function Corporates() {
)}
</TableCell>
<TableCell align="right">
<Stack direction="row" justifyContent="flex-end" spacing={1}>
{/* <Stack direction="row" justifyContent="flex-end" spacing={1}>
<Link to={`/corporates/${row.id}/edit`}>
<Button variant="outlined" color="primary" size="small">
Edit
@@ -344,7 +357,27 @@ export default function Corporates() {
<Link to={`/corporate/${row.id}/corporate-history`}>
<HistoryIcon />
</Link>
</Stack>
</Stack> */}
<TableMoreMenu actions={
<>
{/* <MenuItem onClick={() => navigate(`/corporates/${row.id}/edit`)}>
<EditOutlinedIcon />
View
</MenuItem> */}
<MenuItem onClick={() => navigate(`/corporates/${row.id}/edit`)}>
<EditOutlinedIcon />
Edit
</MenuItem>
<MenuItem onClick={() => navigate(`/corporates/${row.id}`)}>
<SettingsOutlinedIcon />
Config
</MenuItem>
<MenuItem onClick={() => navigate(`/corporates/${row.id}/corporate-history`)}>
<HistoryIcon />
History
</MenuItem>
</>
} />
</TableCell>
</TableRow>
{/* COLLAPSIBLE ROW */}
@@ -499,6 +532,10 @@ export default function Corporates() {
heading={'Coporate List'}
links={[
{ name: 'Dashboard', href: '/dashboard' },
{
name: 'Station Benefit & Membership',
href: '/corporates',
},
{
name: 'Corporates',
href: '/corporates',
@@ -508,27 +545,27 @@ export default function Corporates() {
<SearchInput onSearch={applyFilter} />
<Card>
{/* <Card> */}
{/* The Main Table */}
<TableContainer component={Paper}>
<Table aria-label="collapsible table">
<TableBody>
<TableHead>
<TableRow>
<TableCell style={headStyle} align="left" width={50} />
<TableCell style={headStyle} align="left">
<TableCell align="left" width={50} />
<TableCell align="left">
Code
</TableCell>
<TableCell style={headStyle} align="left">
<TableCell align="left">
Name
</TableCell>
<TableCell style={headStyle} align="left" width={100}>
<TableCell align="left" width={100}>
Status
</TableCell>
<TableCell style={headStyle} align="center" width={100}>
Action
<TableCell align="center" width={100}>
{/* Action */}
</TableCell>
</TableRow>
</TableBody>
</TableHead>
{dataTableIsLoading ? (
<TableBody>
<TableRow>
@@ -555,7 +592,7 @@ export default function Corporates() {
</Table>
</TableContainer>
<BasePagination paginationData={dataTableData} onPageChange={handlePageChange} />
</Card>
{/* </Card> */}
</Container>
</Page>
);

View File

@@ -33,11 +33,11 @@ export default function Divisions() {
},
{
name: corporate?.name ?? '-',
href: '/corporate/' + corporate_id,
href: '/corporates/' + corporate_id,
},
{
name: 'Member',
href: '/corporate/' + corporate_id + '/members',
href: '/corporates/' + corporate_id + '/members',
},
]}
/>

View File

@@ -32,11 +32,11 @@ export default function Divisions() {
},
{
name: corporate?.name ?? '-',
href: '/corporate/' + corporate_id,
href: '/corporates/' + corporate_id,
},
{
name: 'Plan',
href: '/corporate/' + corporate_id + '/plans',
href: '/corporates/' + corporate_id + '/plans',
},
]}
/>

View File

@@ -34,11 +34,11 @@ export default function Divisions() {
},
{
name: corporate?.name ?? '-',
href: '/corporate/' + corporate_id,
href: '/corporates/' + corporate_id,
},
{
name: 'Services',
href: '/corporate/' + corporate_id + '/services',
href: '/corporates/' + corporate_id + '/services',
},
]}
/>

View File

@@ -92,7 +92,7 @@ export default function Router() {
element: <CorporateCreate />,
},
{
path: 'corporate',
path: 'corporates',
element: <ConfigLayout />, // Layout that use the context
children: [
{

View File

@@ -0,0 +1,10 @@
import { Button, Card, Paper, TableRow } from '@mui/material';
import { TableCell, styled as materialStyled } from '@mui/material';
import { LoadingButton } from '@mui/lab';
// export const HeaderCell = materialStyled(TableCell)(({ theme }) => ({
// backgroundColor: theme.palette.background.neutral,
// borderBottom: 'none',
// paddingTop: '16px',
// paddingBottom: '16px',
// }));

View File

@@ -25,7 +25,7 @@ export default function Table(theme: Theme) {
color: theme.palette.text.secondary,
backgroundColor: theme.palette.background.neutral,
'&:first-of-type': {
paddingLeft: theme.spacing(3),
// paddingLeft: theme.spacing(3),
borderTopLeftRadius: theme.shape.borderRadius,
borderBottomLeftRadius: theme.shape.borderRadius,
boxShadow: `inset 8px 0 0 ${theme.palette.background.paper}`,
@@ -48,6 +48,7 @@ export default function Table(theme: Theme) {
'&:last-of-type': {
paddingRight: theme.spacing(3),
},
borderBottom: '1px solid rgba(145, 158, 171, 0.24)',
},
},
},