Skip to content

Commit

Permalink
Merge pull request #56 from openimis/feature/CM-953
Browse files Browse the repository at this point in the history 
CM-953: moved advanced criteria directly to payroll form
  • Loading branch information
@jdolkowski
jdolkowski authored Jul 17, 2024
2 parents 8de4820 + 9cd5cce commit c23d4c0
Show file tree
Hide file tree
Showing 3 changed files with 150 additions and 171 deletions.
233 changes: 88 additions & 145 deletions src/components/payroll/AdvancedFiltersDialog.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,10 +4,6 @@
import React, { useEffect, useState } from 'react';
import { injectIntl } from 'react-intl';
import Button from '@material-ui/core/Button';
import Dialog from '@material-ui/core/Dialog';
import DialogActions from '@material-ui/core/DialogActions';
import DialogContent from '@material-ui/core/DialogContent';
import DialogTitle from '@material-ui/core/DialogTitle';
import {
decodeId,
formatMessage,
Expand Down Expand Up @@ -42,36 +38,48 @@ function AdvancedFiltersDialog({
updateAttributes,
getDefaultAppliedCustomFilters,
readOnly,
additionalParams,
confirmed,
edited,
}) {
const [isOpen, setIsOpen] = useState(false);
// eslint-disable-next-line no-unused-vars
const [currentFilter, setCurrentFilter] = useState({
field: '', filter: '', type: '', value: '', amount: '',
});
const [filters, setFilters] = useState(getDefaultAppliedCustomFilters());
const [filters, setFilters] = useState(getDefaultAppliedCustomFilters(objectToSave.jsonExt));

const createParams = (moduleName, objectTypeName, uuidOfObject = null) => [
`moduleName: "${moduleName}"`,
`objectTypeName: "${objectTypeName}"`,
uuidOfObject !== null ? `uuidOfObject: "${uuidOfObject}"` : '',
];

const fetchFilters = (params) => fetchCustomFilter(params);
useEffect(() => {
setFilters(getDefaultAppliedCustomFilters(objectToSave.jsonExt));
}, [objectToSave.jsonExt]);

const handleOpen = () => {
setFilters(getDefaultAppliedCustomFilters());
setIsOpen(true);
useEffect(() => {
}, [edited]);

const createParams = (moduleName, objectTypeName, uuidOfObject = null, additionalParams = null) => {
const params = [
`moduleName: "${moduleName}"`,
`objectTypeName: "${objectTypeName}"`,
];
if (uuidOfObject) {
params.push(`uuidOfObject: "${uuidOfObject}"`);
}
if (additionalParams) {
params.push(`additionalParams: ${JSON.stringify(JSON.stringify(additionalParams))}`);
}
return params;
};

const fetchFilters = (params) => fetchCustomFilter(params);

const handleClose = () => {
setCurrentFilter(CLEARED_STATE_FILTER);
setIsOpen(false);
};

const handleRemoveFilter = () => {
setCurrentFilter(CLEARED_STATE_FILTER);
setAppliedFiltersRowStructure([CLEARED_STATE_FILTER]);
setFilters([CLEARED_STATE_FILTER]);
setFilters([]);
};

const handleAddFilter = () => {
Expand Down Expand Up @@ -113,156 +121,91 @@ function AdvancedFiltersDialog({
moduleName,
objectType,
isBase64Encoded(object.id) ? decodeId(object.id) : object.id,
additionalParams,
);
} else {
paramsToFetchFilters = createParams(
moduleName,
objectType,
additionalParams,
);
}
fetchFilters(paramsToFetchFilters);
}
}, [object]);

useEffect(() => {}, [filters]);

return (
<>
<Button
onClick={handleOpen}
variant="outlined"
color="#DFEDEF"
className={classes.button}
style={{
border: '0px',
textAlign: 'right',
display: 'block',
marginLeft: 'auto',
marginRight: 0,
}}
>
{formatMessage(intl, 'payroll', 'payroll.advancedFilters')}
</Button>
<Dialog
open={isOpen}
onClose={handleClose}
PaperProps={{
style: {
width: 900,
maxWidth: 900,
},
}}
>
<DialogTitle
style={{
marginTop: '10px',
}}
{filters.map((filter, index) => (
<AdvancedFiltersRowValue
customFilters={customFilters}
currentFilter={filter}
setCurrentFilter={setCurrentFilter}
index={index}
filters={filters}
setFilters={setFilters}
readOnly={readOnly || confirmed}
/>
))}
{ !readOnly && !confirmed ? (
<div
style={{ backgroundColor: '#DFEDEF', paddingLeft: '10px', paddingBottom: '10px' }}
>
{formatMessage(intl, 'payroll', 'payroll.advancedFilters.button.advancedFilters')}
</DialogTitle>
<DialogContent>
{filters.map((filter, index) => (
<AdvancedFiltersRowValue
customFilters={customFilters}
currentFilter={filter}
setCurrentFilter={setCurrentFilter}
index={index}
filters={filters}
setFilters={setFilters}
readOnly={readOnly}
/>
))}
{ !readOnly ? (
<div
style={{ backgroundColor: '#DFEDEF', paddingLeft: '10px', paddingBottom: '10px' }}
>
<AddCircle
style={{
border: 'thin solid',
borderRadius: '40px',
width: '16px',
height: '16px',
}}
onClick={handleAddFilter}
/>
<AddCircle
style={{
border: 'thin solid',
borderRadius: '40px',
width: '16px',
height: '16px',
}}
onClick={handleAddFilter}
disabled={readOnly || confirmed}
/>
<Button
onClick={handleAddFilter}
variant="outlined"
style={{
border: '0px',
marginBottom: '6px',
fontSize: '0.8rem',
}}
disabled={readOnly || confirmed}
>
{formatMessage(intl, 'payroll', 'payroll.advancedFilters.button.addFilters')}
</Button>
</div>
) : (<></>) }
<div>
{ !readOnly && !confirmed ? (
<>
<div style={{ float: 'left' }}>
<Button
onClick={handleAddFilter}
onClick={handleRemoveFilter}
variant="outlined"
style={{
border: '0px',
marginBottom: '6px',
fontSize: '0.8rem',
}}
>
{formatMessage(intl, 'payroll', 'payroll.advancedFilters.button.addFilters')}
{formatMessage(intl, 'payroll', 'payroll.advancedFilters.button.clearAllFilters')}
</Button>
</div>
) : (<></>) }
</DialogContent>
<DialogActions
style={{
display: 'inline',
paddingLeft: '10px',
marginTop: '25px',
marginBottom: '15px',
}}
>
<div>
{ !readOnly ? (
<>
<div style={{ float: 'left' }}>
<Button
onClick={handleRemoveFilter}
variant="outlined"
style={{
border: '0px',
}}
>
{formatMessage(intl, 'payroll', 'payroll.advancedFilters.button.clearAllFilters')}
</Button>
</div>
<div style={{
float: 'right',
paddingRight: '16px',
}}
>
<Button
onClick={handleClose}
variant="outlined"
autoFocus
style={{ margin: '0 16px' }}
>
{formatMessage(intl, 'payroll', 'payroll.advancedFilters.button.cancel')}
</Button>
<Button
onClick={saveCriteria}
variant="contained"
color="primary"
autoFocus
>
{formatMessage(intl, 'payroll', 'payroll.advancedFilters.button.filter')}
</Button>
</div>
</>
) : (
<div style={{
float: 'right',
paddingRight: '16px',
}}
<div style={{
float: 'right',
paddingRight: '16px',
}}
>
<Button
onClick={saveCriteria}
variant="contained"
color="primary"
autoFocus
disabled={!object || confirmed || readOnly}
>
<Button
onClick={handleClose}
variant="outlined"
autoFocus
style={{ margin: '0 16px' }}
>
{formatMessage(intl, 'payroll', 'payroll.advancedFilters.button.cancel')}
</Button>
</div>
) }
</div>
</DialogActions>
</Dialog>
{formatMessage(intl, 'payroll', 'payroll.advancedFilters.button.filter')}
</Button>
</div>
</>
) : <></> }
</div>
</>
);
}
Expand Down
Loading

0 comments on commit c23d4c0

Please sign in to comment.