Skip to content

Commit

Permalink
Merge pull request #9 from csse-uoft/Chihan_branch
Browse files Browse the repository at this point in the history
update require and onblur
  • Loading branch information
Luke9248 authored Jan 17, 2024
2 parents c115e80 + 906bc78 commit c0fd725
Show file tree
Hide file tree
Showing 4 changed files with 105 additions and 147 deletions.
47 changes: 21 additions & 26 deletions frontend/src/components/impactModels/AddEditImpactModel.js
Original file line number Diff line number Diff line change
Expand Up @@ -11,12 +11,12 @@ import {
updateIndicatorReport
} from "../../api/indicatorReportApi";
import {reportErrorToBackend} from "../../api/errorReportApi";
import {isValidURL} from "../../helpers/validation_helpers";
import {isFieldRequired, validateField, validateForm, validateURI, validateFieldAndURI} from "../../helpers";
import {navigateHelper} from "../../helpers/navigatorHelper";
import GeneralField from "../shared/fields/GeneralField";
import SelectField from "../shared/fields/SelectField";
import {createDataType, fetchDataType, fetchDataTypeInterfaces, fetchDataTypes} from "../../api/generalAPI";

import {fullLevelConfig} from "../../helpers/attributeConfig";
const useStyles = makeStyles(() => ({
root: {
width: '80%'
Expand All @@ -30,6 +30,7 @@ const useStyles = makeStyles(() => ({


export default function AddEditImpactModel() {
const attriConfig = fullLevelConfig.impactNorms
const navigator = useNavigate();
const navigate = navigateHelper(navigator);
const classes = useStyles();
Expand Down Expand Up @@ -131,6 +132,13 @@ export default function AddEditImpactModel() {
}

}, [mode, uri]);

const attribute2Compass = {
name: 'cids:hasName',
description: 'cids:hasDescription',
organization: 'cids:forOrganization',
dateCreated: "schema:dateCreated"
}

const handleSubmit = () => {
if (validate()) {
Expand Down Expand Up @@ -179,6 +187,7 @@ export default function AddEditImpactModel() {

const validate = () => {
const error = {};
validateForm(form, attriConfig, attribute2Compass, error, ['uri'])
setErrors(error);
return Object.keys(error).length === 0;
};
Expand Down Expand Up @@ -262,18 +271,12 @@ export default function AddEditImpactModel() {
key={'name'}
label={'Name'}
value={form.name}
required
sx={{mt: '16px', minWidth: 350}}
onChange={e => form.name = e.target.value}
error={!!errors.name}
helperText={errors.name}
onBlur={() => {
if (form.name === '') {
setErrors(errors => ({...errors, name: 'This field cannot be empty'}));
} else {
setErrors(errors => ({...errors, name: ''}));
}
}}
required={isFieldRequired(attriConfig, attribute2Compass, 'name')}
onBlur={validateField(form, attriConfig, 'name', attribute2Compass['name'], setErrors)}
/>

<GeneralField
Expand All @@ -284,14 +287,7 @@ export default function AddEditImpactModel() {
onChange={e => form.uri = e.target.value}
error={!!errors.uri}
helperText={errors.uri}
onBlur={() => {
if (form.uri !== '' && !isValidURL(form.uri)) {
setErrors(errors => ({...errors, uri: 'Please input an valid URI'}));
} else {
setErrors(errors => ({...errors, uri: ''}));
}

}}
onBlur={validateURI(form, setErrors)}
/>

<SelectField
Expand All @@ -309,6 +305,9 @@ export default function AddEditImpactModel() {
})
);
}}

required={isFieldRequired(attriConfig, attribute2Compass, 'organization')}
onBlur={validateFieldAndURI(form, attriConfig,'organization',attribute2Compass['organization'], setErrors)}
/>
<GeneralField
fullWidth
Expand All @@ -318,14 +317,8 @@ export default function AddEditImpactModel() {
onChange={e => form.dateCreated = e.target.value}
error={!!errors.dateCreated}
helperText={errors.dateCreated}
// onBlur={() => {
// if (!state.dateCreated) {
// setErrors(errors => ({...errors, dateCreated: 'This field cannot be empty'}));
// } else {
// setErrors(errors => ({...errors, dateCreated: null}));
// }
// }
// }
required={isFieldRequired(attriConfig, attribute2Compass, 'date')}
onBlur={validateField(form, attriConfig,'date',attribute2Compass['date'], setErrors)}
/>
<GeneralField
key={'description'}
Expand All @@ -336,6 +329,8 @@ export default function AddEditImpactModel() {
error={!!errors.description}
helperText={errors.description}
minRows={4}
required={isFieldRequired(attriConfig, attribute2Compass, 'description')}
onBlur={validateField(form, attriConfig,'description',attribute2Compass['description'], setErrors)}
multiline
/>

Expand Down
53 changes: 24 additions & 29 deletions frontend/src/components/impactReport/AddEditImpactReport.js
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,9 @@ import {updateIndicatorReport} from "../../api/indicatorReportApi";
import {reportErrorToBackend} from "../../api/errorReportApi";
import {navigateHelper} from "../../helpers/navigatorHelper";
import {createDataType, fetchDataType, fetchDataTypeInterfaces, fetchDataTypes} from "../../api/generalAPI";
import {fullLevelConfig} from "../../helpers/attributeConfig";
import {validateForm} from "../../helpers";

const useStyles = makeStyles(() => ({
root: {
width: '80%'
Expand All @@ -23,8 +26,8 @@ const useStyles = makeStyles(() => ({
},
}));


export default function AddEditImpactReport() {
const attriConfig = fullLevelConfig.impactReport
const navigator = useNavigate();
const navigate = navigateHelper(navigator)
const classes = useStyles();
Expand All @@ -37,6 +40,7 @@ export default function AddEditImpactReport() {
submitDialog: false,
loadingButton: false,
});

const [errors, setErrors] = useState(
{}
);
Expand Down Expand Up @@ -124,6 +128,23 @@ export default function AddEditImpactReport() {
}
};

const attribute2Compass = {
stakeholders: 'cids:forStakeholder',
codes: 'cids:hasCode',
name: 'cids:hasName',
comment: 'cids:hasComment',
forStakeholderOutcome:'cids:forOutcome',
forOrganization: 'cids:forOrganization',
impactScale: 'cids:hasImpactScale',
impactDepth: 'cids:hasImpactDepth',
impactDuration: 'cids:hasImpactDuration',
hasTime: 'time:hasTime',
reportedImpact: 'cids:hasReportedImpact',
expectation: 'cids:hasExpectation',
impactRisks: 'cids:hasImpactRisk',

}

const handleConfirm = () => {
setState(state => ({...state, loadingButton: true}));
if (mode === 'new') {
Expand Down Expand Up @@ -163,33 +184,7 @@ export default function AddEditImpactReport() {

const validate = () => {
const error = {};
// if (!form.name)
// error.name = 'The field cannot be empty';
// if (!form.comment)
// error.comment = 'The field cannot be empty';
// if (!form.organization)
// error.organization = 'The field cannot be empty';
// if (!form.indicator)
// error.indicator = 'The field cannot be empty';
// if (!form.startTime)
// error.startTime = 'The field cannot be empty';
// if (!form.endTime)
// error.endTime = 'The field cannot be empty';
// if (form.uri && !isValidURL(form.uri))
// error.uri = 'The field cannot be empty';
if (!!form.startTime && !!form.endTime && form.startTime > form.endTime) {
error.startTime = 'The date must be earlier than the end date';
error.endTime = 'The date must be later than the start date';
}

// if (!form.numericalValue)
// error.numericalValue = 'The field cannot be empty';
// if (form.numericalValue && isNaN(form.numericalValue))
// error.numericalValue = 'The field must be a number';
// if (!form.unitOfMeasure)
// error.unitOfMeasure = 'The field cannot be empty';
// if (!form.dateCreated)
// error.dateCreated = 'The field cannot be empty';
validateForm(form, attriConfig, attribute2Compass, error, ['uri'])
setErrors(error);
return Object.keys(error).length === 0;
};
Expand Down Expand Up @@ -252,12 +247,12 @@ export default function AddEditImpactReport() {
disabled={mode === 'view'}
disabledOrganization={!!orgUri}
defaultValue={form}
required
onChange={(state) => {
setForm(form => ({...form, ...state}));
}}
uriDiasbled={mode !== 'new'}
importErrors={errors}
attribute2Compass={attribute2Compass}
/>

<Button variant="contained" color="primary" className={classes.button} onClick={handleSubmit}>
Expand Down
23 changes: 12 additions & 11 deletions frontend/src/components/impactRisk/AddEditImpactRisk.js
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,8 @@ import {navigateHelper} from "../../helpers/navigatorHelper";
import GeneralField from "../shared/fields/GeneralField";
import SelectField from "../shared/fields/SelectField";
import {createDataType, fetchDataType} from "../../api/generalAPI";

import {isFieldRequired, validateField, validateForm, validateURI} from "../../helpers";
import {fullLevelConfig} from "../../helpers/attributeConfig";
const useStyles = makeStyles(() => ({
root: {
width: '80%'
Expand All @@ -28,6 +29,7 @@ const useStyles = makeStyles(() => ({


export default function AddEditImpactRisk() {
const attriConfig = fullLevelConfig.impactRisk
const navigator = useNavigate();
const navigate = navigateHelper(navigator);
const classes = useStyles();
Expand Down Expand Up @@ -104,7 +106,10 @@ export default function AddEditImpactRisk() {
setState(state => ({...state, submitDialog: true}));
}
};

const attribute2Compass = {
hasIdentifier:'tove_org:hasIdentifier',

}
const handleConfirm = () => {
setState(state => ({...state, loadingButton: true}));
if (mode === 'new') {
Expand Down Expand Up @@ -144,7 +149,7 @@ export default function AddEditImpactRisk() {

const validate = () => {
const error = {};

validateForm(form, attriConfig, attribute2Compass, error, ['uri'])
setErrors(error);
return Object.keys(error).length === 0;
};
Expand Down Expand Up @@ -189,6 +194,9 @@ export default function AddEditImpactRisk() {
})
);
}}

required={isFieldRequired(attriConfig, attribute2Compass, 'hasIdentifier')}
onBlur={validateField(form, attriConfig, 'hasIdentifier', attribute2Compass['hasIdentifier'], setErrors)}
/>

<GeneralField
Expand All @@ -199,14 +207,7 @@ export default function AddEditImpactRisk() {
onChange={e => form.uri = e.target.value}
error={!!errors.uri}
helperText={errors.uri}
onBlur={() => {
if (form.uri !== '' && !isValidURL(form.uri)) {
setErrors(errors => ({...errors, uri: 'Please input an valid URI'}));
} else {
setErrors(errors => ({...errors, uri: ''}));
}

}}
onBlur={validateURI(form, setErrors)}
/>


Expand Down
Loading

0 comments on commit c0fd725

Please sign in to comment.