tbfajri/aso
1
0
Fork 0
Code Issues 2 Pull Requests Actions Packages Projects Releases Wiki Activity

several detail changes

Browse Source
This commit is contained in:
Lasteinsa
2023-08-31 13:45:49 +07:00
parent 8f74be633e
commit 96ee80f681
5 changed files with 224 additions and 147 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
frontend/dashboard/src/components/hook-form/RHFDatepicker.tsx
View File

@@ -60,8 +60,8 @@ export default function RHFDatepicker({ name, ...other }: IProps & TextFieldProp
<DesktopDatePicker
value={field.value}
// inputFormat="dd/MM/yyyy"
inputFormat="yyyy-MM-dd"
inputFormat="dd/MMM/yyyy"
// inputFormat="dd - MMM - yyyy"
onChange={(value) => {
field.onChange(value);
}}

289
frontend/dashboard/src/pages/Corporates/Form.tsx
View File

@@ -62,7 +62,6 @@ type Props = {
};
export default function CorporateForm({ isEdit, currentCorporate }: Props) {
const navigate = useNavigate();
const [corporate_groups, setCorporateGroups] = useState([]);
@@ -70,7 +69,7 @@ export default function CorporateForm({ isEdit, currentCorporate }: Props) {
const { enqueueSnackbar } = useSnackbar();
let NewCorporateSchema = null;
if (isEdit){
if (isEdit) {
NewCorporateSchema = Yup.object().shape({
isEdited: Yup.boolean(),
name: Yup.string().required('Name is required'),
@@ -81,36 +80,35 @@ export default function CorporateForm({ isEdit, currentCorporate }: Props) {
help_text: Yup.string().required('Help Text is required'),
// policy_code: Yup.string().required('Policy Code is required'),
policy_start: Yup.date().required('Start Date is required'),
policy_end: Yup.date().required('End Date is required').min(Yup.ref('policy_start'), "end date can't be before start date"),
policy_end: Yup.date()
.required('End Date is required')
.min(Yup.ref('policy_start'), "end date can't be before start date"),
policy_total_premi: Yup.number().required('Deposit Initial Fund is required').min(0),
// linking_rules: Yup.string().required('Link Rules is required'),
policy_minimal_deposit_percentage:
Yup.number()
.typeError("Please enter a valid number")
.required('Percentage Deposit is required')
.min(0, "Minimum atleast 0")
.max(100, "Allowed maximum is 100"),
policy_minimal_alert_percentage:
Yup.number()
.typeError("Please enter a valid number")
.required('Percentage Alert is required')
.min(0, "Minimum atleast 0")
.max(100, "Allowed maximum is 100"),
policy_stop_service_percentage:
Yup.number()
.typeError("Please enter a valid number")
.min(0, "Minimum atleast 0")
.required('Percentage Stop is required')
.test("max", "Total should not exceed 100 %", function(value) {
const { policy_minimal_alert_percentage } = this.parent;
const { policy_minimal_deposit_percentage } = this.parent;
return value == 100 - policy_minimal_alert_percentage- policy_minimal_deposit_percentage;
}),
policy_minimal_deposit_percentage: Yup.number()
.typeError('Please enter a valid number')
.required('Percentage Deposit is required')
.min(0, 'Minimum atleast 0')
.max(100, 'Allowed maximum is 100'),
policy_minimal_alert_percentage: Yup.number()
.typeError('Please enter a valid number')
.required('Percentage Alert is required')
.min(0, 'Minimum atleast 0')
.max(100, 'Allowed maximum is 100'),
policy_stop_service_percentage: Yup.number()
.typeError('Please enter a valid number')
.min(0, 'Minimum atleast 0')
.required('Percentage Stop is required')
.test('max', 'Total should not exceed 100 %', function (value) {
const { policy_minimal_alert_percentage } = this.parent;
const { policy_minimal_deposit_percentage } = this.parent;
return value == 100 - policy_minimal_alert_percentage - policy_minimal_deposit_percentage;
}),
parent_id: Yup.string().when('type', {
is: 'subcorporate',
then: Yup.string().required('Corporate is required because type is Sub Corporate'),
}),
reason: Yup.string().required('Reason for update is required when editing data'),
});
} else {
@@ -118,108 +116,104 @@ 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) {
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);
}
),
}),
active: Yup.boolean().required('Corporate Status is required'),
type: Yup.string().required('Type is required'),
welcome_message: Yup.string().required('Welcome Message is required'),
help_text: Yup.string().required('Help Text is required'),
// policy_code: Yup.string().required('Policy Code is required'),
policy_start: Yup.date().required('Start Date is required'),
policy_end: Yup.date().required('End Date is required').min(Yup.ref('policy_start'), "end date can't be before start date"),
policy_end: Yup.date()
.required('End Date is required')
.min(Yup.ref('policy_start'), "end date can't be before start date"),
policy_total_premi: Yup.number().required('Deposit Initial Fund is required').min(0),
// linking_rules: Yup.string().required('Link Rules is required'),
policy_minimal_deposit_percentage:
Yup.number()
.typeError("Please enter a valid number")
.required('Percentage Deposit is required')
.min(0, "Minimum atleast 0")
.max(100, "Allowed maximum is 100"),
policy_minimal_alert_percentage:
Yup.number()
.typeError("Please enter a valid number")
.required('Percentage Alert is required')
.min(0, "Minimum atleast 0")
.max(100, "Allowed maximum is 100"),
policy_stop_service_percentage:
Yup.number()
.typeError("Please enter a valid number")
.min(0, "Minimum atleast 0")
.required('Percentage Stop is required')
.test("max", "Total should not exceed 100 %", function(value) {
const { policy_minimal_alert_percentage } = this.parent;
const { policy_minimal_deposit_percentage } = this.parent;
return value == 100 - policy_minimal_alert_percentage- policy_minimal_deposit_percentage;
}),
policy_minimal_deposit_percentage: Yup.number()
.typeError('Please enter a valid number')
.required('Percentage Deposit is required')
.min(0, 'Minimum atleast 0')
.max(100, 'Allowed maximum is 100'),
policy_minimal_alert_percentage: Yup.number()
.typeError('Please enter a valid number')
.required('Percentage Alert is required')
.min(0, 'Minimum atleast 0')
.max(100, 'Allowed maximum is 100'),
policy_stop_service_percentage: Yup.number()
.typeError('Please enter a valid number')
.min(0, 'Minimum atleast 0')
.required('Percentage Stop is required'),
// .test('max', 'Total should not exceed 100 %', function (value) {
// const { policy_minimal_alert_percentage } = this.parent;
// const { policy_minimal_deposit_percentage } = this.parent;
// return value == 100 - policy_minimal_alert_percentage - policy_minimal_deposit_percentage;
// }),
parent_id: Yup.string().when('type', {
is: 'subcorporate',
then: Yup.string().required('Corporate is required because type is Sub Corporate'),
}),
});
}
async function getExistingCodes() {
// axios
// .get('/corporates/create')
// .then((res) => {
// setCorporateGroups(res.data.corporate_groups);
// })
// .catch((err) => {
// enqueueSnackbar('Opps, failed to get Corporate Group List', { variant: 'error' });
// });
// .get('/corporates/create')
// .then((res) => {
// setCorporateGroups(res.data.corporate_groups);
// })
// .catch((err) => {
// enqueueSnackbar('Opps, failed to get Corporate Group List', { variant: 'error' });
// });
try {
let response = await axios.get('/corporates/1/code'); // get data all corporate
let codeCurrent = ""
if (isEdit){
let responseCodeCurrent = await axios.get(`/corporates/${currentCorporate?.id}/edit`); // get data current corporate
codeCurrent = responseCodeCurrent.data.code; // get data code corporate current
}
// console.log(response.data);
let existingCodes = response.data.map(item => item); // get data code corporate all
let filteredArray = existingCodes.filter(e => e != codeCurrent)
return filteredArray;
} catch (error) {
console.error(error);
enqueueSnackbar('Failed to fetch existing codes', { variant: 'error' });
try {
let response = await axios.get('/corporates/1/code'); // get data all corporate
let codeCurrent = '';
if (isEdit) {
let responseCodeCurrent = await axios.get(`/corporates/${currentCorporate?.id}/edit`); // get data current corporate
codeCurrent = responseCodeCurrent.data.code; // get data code corporate current
}
// console.log(response.data);
let existingCodes = response.data.map((item) => item); // get data code corporate all
let filteredArray = existingCodes.filter((e) => e != codeCurrent);
return filteredArray;
} catch (error) {
console.error(error);
enqueueSnackbar('Failed to fetch existing codes', { variant: 'error' });
}
}
async function getExistingPayorId() {
// axios
// .get('/corporates/create')
// .then((res) => {
// setCorporateGroups(res.data.corporate_groups);
// })
// .catch((err) => {
// enqueueSnackbar('Opps, failed to get Corporate Group List', { variant: 'error' });
// });
// .get('/corporates/create')
// .then((res) => {
// setCorporateGroups(res.data.corporate_groups);
// })
// .catch((err) => {
// enqueueSnackbar('Opps, failed to get Corporate Group List', { variant: 'error' });
// });
try {
let response = await axios.get('/corporates/1/code'); // get data all corporate
let codeCurrent = ""
if (isEdit){
let responseCodeCurrent = await axios.get(`/corporates/${currentCorporate?.id}/edit`); // get data current corporate
codeCurrent = responseCodeCurrent.data.payor_id; // get data code corporate current
}
// console.log(response.data);
let existingCodes = response.data.map(item => item); // get data code corporate all
let filteredArray = existingCodes.filter(e => e != codeCurrent)
console.log(filteredArray);
return filteredArray;
} catch (error) {
console.error(error);
enqueueSnackbar('Failed to fetch existing codes', { variant: 'error' });
try {
let response = await axios.get('/corporates/1/code'); // get data all corporate
let codeCurrent = '';
if (isEdit) {
let responseCodeCurrent = await axios.get(`/corporates/${currentCorporate?.id}/edit`); // get data current corporate
codeCurrent = responseCodeCurrent.data.payor_id; // get data code corporate current
}
// console.log(response.data);
let existingCodes = response.data.map((item) => item); // get data code corporate all
let filteredArray = existingCodes.filter((e) => e != codeCurrent);
console.log(filteredArray);
return filteredArray;
} catch (error) {
console.error(error);
enqueueSnackbar('Failed to fetch existing codes', { variant: 'error' });
}
}
const defaultValues = useMemo(
@@ -323,7 +317,6 @@ export default function CorporateForm({ isEdit, currentCorporate }: Props) {
formData.append('policy_end', fPostFormat(data.policy_end));
formData.append('linking_rules', data.linking_rules);
// console.log('MOTHERFUCKER', data.linking_rules)
if (!isEdit) {
@@ -479,7 +472,7 @@ export default function CorporateForm({ isEdit, currentCorporate }: Props) {
id: 'Lilili',
},
];
const [isDisabled, setIsDisabled] = useState(isEdit);
const [isDisabled, setIsDisabled] = useState(isEdit);
const handleTypeChange = (event: SelectChangeEvent) => {
setValue('type', event.target.value);
};
@@ -520,19 +513,16 @@ export default function CorporateForm({ isEdit, currentCorporate }: Props) {
</option>
))}
</RHFSelect>
)}
)}
<RHFTextField name="code" label="Corporate Code" disabled={isDisabled} />
<RHFTextField name="name" label="Corporate Name" disabled={isDisabled} />
<RHFTextField name="payor_id" label="Payor ID" disabled={isDisabled} />
{isEdit && (
// <RHFTextField name="reason" label="Reason for update" />
<RHFSelect
name="reason"
label="Reason for update"
>
<RHFSelect name="reason" label="Reason for update">
<option value=""></option>
<option value="Agreement changed">Agreement changed</option>
<option value="Endorsement">Endorsement</option>
@@ -575,13 +565,10 @@ export default function CorporateForm({ isEdit, currentCorporate }: Props) {
<Grid item xs={12} md={4}>
<Stack spacing={3}>
<Card sx={{ p: 3 }}>
{JSON.stringify(values.active)}
<RHFSwitch name="active" label="Is Company Active" />
{JSON.stringify(values.automatic_linking)}
<RHFSwitch name="automatic_linking" label="Is Company Automatic Linking" />
<Stack spacing={3} mt={2} alignItems="center">
<Typography align="center">Company Logo</Typography>
{/* <RHFUploadAvatar
<Stack spacing={3} mt={2}>
<Stack spacing={3} alignItems="center">
<Typography align="center">Company Logo</Typography>
{/* <RHFUploadAvatar
name="logo"
showPreview
accept="image/*"
@@ -589,7 +576,22 @@ export default function CorporateForm({ isEdit, currentCorporate }: Props) {
onDrop={handleDrop}
onRemove={handleRemove}
/> */}
<UploadImage setFile={setFile} currentImage={currentImage} />
<UploadImage setFile={setFile} currentImage={currentImage} />
</Stack>
<Box>
<Box
sx={{ display: 'flex', placeContent: 'space-between', placeItems: 'center' }}
>
<Typography>Company Active</Typography>
<RHFSwitch name="active" label="" labelPlacement="start" />
</Box>
<Box
sx={{ display: 'flex', placeContent: 'space-between', placeItems: 'center' }}
>
<Typography>Company Automatic Linking</Typography>
<RHFSwitch name="automatic_linking" label="" labelPlacement="start" />
</Box>
</Box>
</Stack>
</Card>
<Card sx={{ p: 3 }}>
@@ -598,7 +600,6 @@ export default function CorporateForm({ isEdit, currentCorporate }: Props) {
Linking Rules
</Typography>
<Stack>
{JSON.stringify(getValues('linking_rules'))}
<RHFCustomMultiCheckbox name="linking_rules" options={linking_tools} />
</Stack>
</Stack>
@@ -611,14 +612,12 @@ 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}>
<Grid item xs={12}>
<Typography variant="h5">Policy Detail</Typography>
</Grid>
<Typography variant="h5">Policy Detail</Typography>
<input type="hidden" name="policy_id" />
<Stack spacing={1}>
<RHFTextField name="policy_code" label="Policy Number"/>
<RHFTextField name="policy_code" label="Policy Number" />
{!currentCorporate?.id && (
<Typography variant="caption">Will be generated if empty</Typography>
)}
@@ -627,10 +626,10 @@ export default function CorporateForm({ isEdit, currentCorporate }: Props) {
{/* <Typography>Minimal Deposit Policy Level</Typography> */}
<Stack direction="row" spacing={2}>
<Grid item xs={12} md={6}>
<RHFDatepicker name="policy_start" label="Start Date (YYYY-MM-DD)" />
<RHFDatepicker name="policy_start" label="Start Date" />
</Grid>
<Grid item xs={12} md={6}>
<RHFDatepicker name="policy_end" label="End Date (YYYY-MM-DD)" />
<RHFDatepicker name="policy_end" label="End Date" />
</Grid>
</Stack>
@@ -639,11 +638,13 @@ export default function CorporateForm({ isEdit, currentCorporate }: Props) {
label={'Deposit Intial Fund (' + fCurrency(values.policy_total_premi) + ')'}
/>
<Stack spacing={1}>
<Typography variant="subtitle2" sx={{ color: 'text.secondary' }}>
Minimal Deposit Policy Level
</Typography>
<Grid container>
<Grid item xs={12}>
<Grid container spacing={2}>
<Grid item xs={12}>
<Typography variant="subtitle2" sx={{ color: 'text.secondary' }}>
Minimal Deposit Policy Level
</Typography>
</Grid>
<Grid item xs={12} md={3}>
<RHFTextField
name="policy_minimal_deposit_percentage"
@@ -659,13 +660,15 @@ export default function CorporateForm({ isEdit, currentCorporate }: Props) {
/>
</Grid>
</Grid>
</Stack>
</Grid>
<Stack spacing={1}>
<Typography variant="subtitle2" sx={{ color: 'text.secondary' }}>
Minimal Alert Level
</Typography>
<Grid container>
<Grid item xs={12}>
<Grid container spacing={2}>
<Grid item xs={12}>
<Typography variant="subtitle2" sx={{ color: 'text.secondary' }}>
Minimal Alert Level
</Typography>
</Grid>
<Grid item xs={12} md={3}>
<RHFTextField
name="policy_minimal_alert_percentage"
@@ -681,13 +684,15 @@ export default function CorporateForm({ isEdit, currentCorporate }: Props) {
/>
</Grid>
</Grid>
</Stack>
</Grid>
<Stack spacing={1}>
<Typography variant="subtitle2" sx={{ color: 'text.secondary' }}>
Stop Service Level
</Typography>
<Grid container>
<Grid item xs={12}>
<Grid container spacing={2}>
<Grid item xs={12}>
<Typography variant="subtitle2" sx={{ color: 'text.secondary' }}>
Stop Service Level
</Typography>
</Grid>
<Grid item xs={12} md={3}>
<RHFTextField
name="policy_stop_service_percentage"
@@ -703,7 +708,7 @@ export default function CorporateForm({ isEdit, currentCorporate }: Props) {
/>
</Grid>
</Grid>
</Stack>
</Grid>
</Stack>
</Card>
</Grid>

1
frontend/dashboard/src/pages/Report/Livechat/Index.tsx
View File

@@ -27,7 +27,6 @@ export default function Doctor() {
},
]}
/>
<List />
</Container>
</Page>

70
frontend/dashboard/src/pages/Report/Livechat/List.tsx
View File

@@ -53,10 +53,14 @@ import { Controller } from 'react-hook-form';
import SvgIconStyle from '../../../components/SvgIconStyle';
import { GridSearchIcon } from '@mui/x-data-grid';
import { Search } from '@mui/icons-material';
import { Add, Search } from '@mui/icons-material';
import { Icon } from '@iconify/react';
import KeyboardArrowDownIcon from '@mui/icons-material/KeyboardArrowDown';
import KeyboardArrowRightIcon from '@mui/icons-material/KeyboardArrowRight';
import { RHFDatepicker } from '@/components/hook-form';
import { DesktopDatePicker, LocalizationProvider } from '@mui/x-date-pickers';
import { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns';
import { fPostFormat } from '@/utils/formatTime';
// ----------------------------------------------------------------------
@@ -103,7 +107,7 @@ export default function List() {
return (
<form style={{ width: '100%' }}>
<Grid container spacing={2} sx={{ justifyContent: 'space-between', alignItems: 'center' }}>
<Grid item xs={12} sm={12} md={12} lg={12}>
<Grid item xs={12} md={6}>
<TextField
id="search-input"
ref={searchInput}
@@ -126,6 +130,68 @@ export default function List() {
}}
/>
</Grid>
<Grid item xs={12} md={2}>
<LocalizationProvider dateAdapter={AdapterDateFns}>
<DesktopDatePicker
value={searchParams.get('startDate')}
inputFormat="dd/MM/yyyy"
onChange={(value) => {
try {
if (value && !!Date.parse(value)) {
const date = value ? fPostFormat(value) : '';
var entries = [...searchParams.entries(), ['startDate', date ?? '']];
if (!searchParams.get('endDate')) {
entries = [...entries, ['endDate', date ?? '']];
}
const filter = Object.fromEntries(entries);
setSearchParams(filter);
loadDataTableData(filter);
}
} catch (e) {}
}}
renderInput={(params) => <TextField {...params} fullWidth label="Start" />}
/>
</LocalizationProvider>
</Grid>
<Grid item xs={12} md={2}>
<LocalizationProvider dateAdapter={AdapterDateFns}>
<DesktopDatePicker
value={searchParams.get('endDate')}
inputFormat="dd/MM/yyyy"
onChange={(value) => {
try {
if (value && !!Date.parse(value)) {
const date = fPostFormat(value);
var entries = [...searchParams.entries(), ['endDate', date ?? '']];
if (!searchParams.get('startDate')) {
entries = [...entries, ['startDate', date ?? '']];
}
const filter = Object.fromEntries(entries);
setSearchParams(filter);
loadDataTableData(filter);
}
} catch (e) {}
}}
renderInput={(params) => (
<TextField
{...params}
fullWidth
label="End"
// error={!!error}
// helperText={error?.message}
// {...other}
/>
)}
/>
</LocalizationProvider>
</Grid>
<Grid item xs={12} md={2}>
<Button variant="outlined" fullWidth startIcon={<Add />} sx={{ p: 1.8 }}>
Export
</Button>
</Grid>
</Grid>
</form>
);