check form updates

This commit is contained in:
2022-06-07 14:36:47 +01:00
parent 3b61d651f6
commit 9d90b7f0a8
22 changed files with 356 additions and 133 deletions
+50 -37
View File
@@ -81,7 +81,7 @@ export function Textfield(props) {
<>
<div className="govuk-form-group">
<label className="govuk-label " htmlFor={props.name}>
{label}
{FieldsTranslations(label)}
</label>
<input
type="text"
@@ -163,9 +163,9 @@ const RenderMultiline = ({
: "govuk-form-group "
}
>
<label className="govuk-label " htmlFor={id} id={id + "_label"}>
{FieldsTranslations(label)}
</label>
{/* <label className="govuk-label " htmlFor={id} id={id + "_label"}>
{FieldsTranslations(label)}s
</label> */}
{touched && error && (
<span id={id + "-error"} className="govuk-error-message">
<span className="govuk-visually-hidden">Error:</span>{" "}
@@ -177,9 +177,11 @@ const RenderMultiline = ({
</span>
)}
<textarea
{...input}
id={id}
name={id}
rows={rows}
className={className}
{...input}
></textarea>
</div>
</>
@@ -190,21 +192,26 @@ export function MultiLinefield(props) {
const {
name,
label,
parentField,
form,
formProps,
parentField,
parentFieldShowOnValue,
validation,
} = props;
const required = (value) => (value ? undefined : "Is required");
var showIfHasParentShowValue =
(parentField != false &&
!_.isEmpty(formProps[form]) &&
_.has(formProps[form].values, parentField) &&
formProps[form].values[parentField]) == parentFieldShowOnValue;
parentField != false &&
!_.isEmpty(formProps[form]) &&
_.has(formProps[form].values, parentField) &&
parentFieldShowOnValue.indexOf(
formProps[form].values[parentField].toString()
) > -1;
// console.log(parentField, showIfHasParentShowValue);
(showIfHasParentShowValue == parentField) != false &&
showIfHasParentShowValue;
//console.log(showIfHasParentShowValue, formProps[form].values[parentField]);
return (
<>
@@ -324,12 +331,13 @@ const RenderDatePicker = ({
<fieldset
className="govuk-fieldset"
role="group"
aria-describedby="dob-hint"
aria-describedby={id + "_label"}
>
<legend className="govuk-fieldset__legend govuk-fieldset__legend--s govuk-!-font-weight-regular">
<label
className="govuk-fieldset__heading"
id={id + "_label"}
htmlFor={id}
>
{FieldsTranslations(label)}
</label>
@@ -355,6 +363,7 @@ const RenderDatePicker = ({
{...custom}
locale={router.locale}
autoOk={true}
id={id}
dateFormat="dd/MM/yyyy"
onChange={onChange}
selected={
@@ -527,7 +536,7 @@ const RenderYesNo = ({
>
<fieldset
className="govuk-fieldset"
aria-describedby={name + "-hint"}
aria-describedby={id + "_label"}
>
<legend className="govuk-fieldset__legend govuk-fieldset__legend--s govuk-!-font-weight-regular">
<label
@@ -660,7 +669,7 @@ const RenderRadio = ({
>
<fieldset
className="govuk-fieldset"
aria-describedby={name + "-hint"}
aria-describedby={id + "_label"}
>
<legend className="govuk-fieldset__legend govuk-fieldset__legend--s govuk-!-font-weight-regular">
<label
@@ -705,10 +714,13 @@ const RenderRadio = ({
type="radio"
className="govuk-radios__input"
value={options[key].split("|")[0]}
// checked={
// value ==
// parseInt(options[key].split("|")[0])
// }
checked={
typeof value != "undefined" &&
value ==
parseInt(options[key].split("|")[0])
? true
: false
}
onChange={(e) => {
let docListObj = custom.documentList;
if (
@@ -751,10 +763,10 @@ export function Radiofield(props) {
name,
label,
datafieldname,
parentField,
form,
formProps,
parentFieldShowOnValue,
parentField,
validation,
} = props;
@@ -767,14 +779,13 @@ export function Radiofield(props) {
.split(",");
//parentFieldShowOnValue
var showIfHasParentShowValue = parentField != false;
//debugger;
// parentField != false &&
// !_.isEmpty(formProps[form]) &&
// _.has(formProps[form].values, parentField) &&
// parentFieldShowOnValue.indexOf(
// formProps[form].values[parentField].toString()
// ) > -1;
var showIfHasParentShowValue =
parentField != false &&
!_.isEmpty(formProps[form]) &&
_.has(formProps[form].values, parentField) &&
parentFieldShowOnValue.indexOf(
formProps[form].values[parentField].toString()
) > -1;
(showIfHasParentShowValue == parentField) != false &&
showIfHasParentShowValue;
@@ -942,7 +953,12 @@ const RenderPickList = ({
dropdownObj = dropdownObj[0];
return (
<div>
<select {...input} className="govuk-select " id={name} name={name}>
<select
{...input}
className="govuk-select "
id={label}
name={label}
>
<option>{t("newappeal:select-default")}</option>
{Object.keys(dropdownObj).map((key, index) => {
return (
@@ -970,6 +986,7 @@ export function PickList(props) {
</label>
<Field
name={props.name}
label={props.name}
component={RenderPickList}
datafieldname={datafieldname}
picklistData={props.picklistData}
@@ -984,21 +1001,19 @@ export function NumericField(props) {
return (
<div className="govuk-form-group">
<label className="govuk-label" htmlFor={props.name}>
{FieldsTranslations(props.label)}
</label>
<Field
name={props.name}
id={props.name}
type="number"
className="govuk-input govuk-input--width-20"
spellCheck="false"
//aria-describedby="account-number-hint"
aria-describedby={name}
pattern="[0-9]*"
inputMode="numeric"
parse={Number}
validate={eval(validation)}
component={RenderTextfield}
label={label}
/>
</div>
);
@@ -1010,9 +1025,6 @@ export function DecimalField(props) {
return (
<div className="govuk-form-group">
<label className="govuk-label" htmlFor={props.name}>
{FieldsTranslations(props.label)}
</label>
<Field
name={props.name}
id={props.name}
@@ -1020,12 +1032,13 @@ export function DecimalField(props) {
type="number"
className="govuk-input govuk-input--width-10"
spellCheck="false"
//aria-describedby="account-number-hint"
aria-describedby={name}
pattern="[0-9]*"
inputMode="numeric"
parse={Number}
validate={eval(validation)}
component={RenderTextfield}
label={props.label}
/>
</div>
);
@@ -1092,7 +1105,7 @@ const PickListTranslations = (optionValue) => {
export function FileUploadField(props) {
return (
<>
<h4>{props.label} </h4>
<h2 className="govuk-heading-s">{props.label} </h2>
<Field
name={props.name}
id={props.name}
+20 -5
View File
@@ -171,11 +171,6 @@ const TopThree = (props) => {
className="govuk-link--no-underline"
data-id={index}
onClick={() => {
topThreeType == "awaitingSubmission" &&
console.log(
"appealDetails"
// props.props.awaitingSubmission
);
setCurrentReference({
"currentReference":
topThreeType != "watchedCases"
@@ -258,6 +253,26 @@ const TopThree = (props) => {
: "")}
</div>
<div>
{showTopThreeArr[key].pinswg_appellantagent !=
846040000 && <b>Raised by: </b>}
{showTopThreeArr[key].pinswg_appellantagent !=
846040000 &&
(showTopThreeArr[key].pinswg_agentcompanyname !=
null &&
showTopThreeArr[key].pinswg_agentcompanyname +
", ") +
showTopThreeArr[key].pinswg_agentfirstname +
" " +
showTopThreeArr[key].pinswg_agentlastname}
</div>
<div>
<b>On behalf of: </b>
{showTopThreeArr[key].pinswg_appellantfirstname +
" " +
showTopThreeArr[key].pinswg_appellantlastname}
</div>
{router.locale == "cy"
? jsonpath.query(
transLookup,
+76 -9
View File
@@ -1,7 +1,8 @@
import useTranslation from "next-translate/useTranslation";
import { useRouter } from "next/router";
import { connect } from "react-redux";
import { Field, formValueSelector, reduxForm } from "redux-form";
import { useEffect } from "react";
import { Field, formValueSelector, reduxForm, change } from "redux-form";
import {
FieldsTranslations,
Radiofield,
@@ -15,7 +16,13 @@ let AboutYou = (props) => {
const router = useRouter();
const { locale } = router;
const { onSubmit, handleSubmit, appellantAgentValue, setFormStep } = props;
const {
onSubmit,
handleSubmit,
appellantAgentValue,
setFormStep,
updateField,
} = props;
const yesNo = router.locale == "cy" ? ["Ydw", "Na"] : ["Yes", "No"];
const appellantAgent =
@@ -243,7 +250,7 @@ let AboutYou = (props) => {
>
<fieldset
className="govuk-fieldset"
aria-describedby={name + "-hint"}
aria-describedby={datafieldname + "-hint"}
>
<legend className="govuk-fieldset__legend govuk-fieldset__legend--s govuk-!-font-weight-regular">
<label
@@ -272,11 +279,12 @@ let AboutYou = (props) => {
}
>
{" "}
{custom.hint != false && (
<div className="govuk-hint">
{t(custom.hint)}
</div>
)}
{custom.hint != false ||
(custom.hint != undefined && (
<div className="govuk-hint">
{t(custom.hint)}
</div>
))}
{Object.keys(options).map((key, index) => (
<div
className="govuk-radios__item"
@@ -424,6 +432,47 @@ let AboutYou = (props) => {
console.log(JSON.stringify(values));
setFormStep(1);
};
const handlePartialUpdate = () => {
if (appellantAgentValue == "846040001") {
updateField("caseForm", "pinswg_appellantfirstname", "");
updateField("caseForm", "pinswg_appellantlastname", "");
updateField("caseForm", "pinswg_appellantemailaddress", "");
updateField("caseForm", "pinswg_appellantaddress", "");
updateField("caseForm", "pinswg_appellantphonenumber", "");
} else {
updateField(
"caseForm",
"pinswg_appellantfirstname",
props.initialValues.pinswg_appellantfirstname
);
updateField(
"caseForm",
"pinswg_appellantlastname",
props.initialValues.pinswg_appellantlastname
);
updateField(
"caseForm",
"pinswg_appellantemailaddress",
props.initialValues.pinswg_appellantemailaddress
);
updateField(
"caseForm",
"pinswg_appellantaddress",
props.initialValues.pinswg_appellantaddress
);
updateField(
"caseForm",
"pinswg_appellantphonenumber",
props.initialValues.pinswg_appellantphonenumber
);
}
};
useEffect(() => {
handlePartialUpdate();
}, [appellantAgentValue]);
return (
<form onSubmit={handleSubmit(onHandleSubmit)}>
<Field
@@ -723,11 +772,27 @@ const mapStateToProps = (state) => {
formData: state.formData,
appealType: state.appealType,
//form: state.form,
initialValues: {
pinswg_appellantfirstname:
state.accountDetails.accountDetails.firstname,
pinswg_appellantlastname:
state.accountDetails.accountDetails.lastname,
pinswg_appellantemailaddress:
state.accountDetails.accountDetails.emailaddress1,
pinswg_appellantaddress:
state.accountDetails.accountDetails.address1_composite,
pinswg_appellantphonenumber:
state.accountDetails.accountDetails.telephone1,
},
};
};
const mapDispatchToProps = (dispatch) => {
return {};
return {
updateField: (form, field, newValue) =>
dispatch(change(form, field, newValue)),
};
};
// AboutYou = reduxForm({
@@ -754,6 +819,8 @@ export default connect(
)(
reduxForm({
form: "caseForm",
enableReinitialize: true, // this is needed!!
destroyOnUnmount: false,
})(AboutYou)
);
+3
View File
@@ -36,6 +36,9 @@ export default function BuildField(props) {
case "{67FAC785-CD58-4f9f-ABB3-4B7DDC6ED5ED}":
return <>{fieldValue}</>;
break;
case "{07FAC785-CD58-4f9f-ABB3-4B7DDC6ED5ED}":
return <>{fieldValue}</>;
break;
case "{ 4273EDBD-AC1D-40d3-9FB2-095C621B552D}":
return <>{fieldValue}</>;
break;
+83 -53
View File
@@ -9,6 +9,7 @@ import fieldLookup from "../../data/crmfieldlookuptranslations.json";
import {
getFormCollectionByID,
getPickListLabel,
getRadioLabel,
} from "../../components/utils";
import {
@@ -93,62 +94,91 @@ let BuildCheckRow = (props) => {
datafieldname[0].value +
"')]"
);
if (typeof isRequiredField[0] != "undefined") {
if (isRequiredField[0].RequiredLevel.Value != "None") {
return (
<div
className="govuk-summary-list__row"
key={key}
>
<dt className="govuk-summary-list__key">
{FieldsTranslations(rows[0].value)}
</dt>
<dd className="govuk-summary-list__value">
{fieldtype[0].value ==
"{5B773807-9FB2-42db-97C3-7A91EFF8ADFF}"
? formatDate(
props.props.form["appealForm"]
if (
typeof props.props.form["appealForm"].values[
datafieldname[0].value
] != "undefined"
) {
if (typeof isRequiredField[0] != "undefined") {
if (
isRequiredField[0].RequiredLevel.Value != "None"
) {
return (
<div
className="govuk-summary-list__row"
key={key}
>
<dt className="govuk-summary-list__key">
{FieldsTranslations(rows[0].value)}
</dt>
<dd className="govuk-summary-list__value">
{fieldtype[0].value ==
"{5B773807-9FB2-42db-97C3-7A91EFF8ADFF}"
? formatDate(
props.props.form[
"appealForm"
].values[
datafieldname[0].value
]
)
: fieldtype[0].value ==
"{3EF39988-22BB-4f0b-BBBE-64B5A3748AEE}"
? getPickListLabel(
props.props.formData
.pickListData,
datafieldname[0].value,
props.props.form[
"appealForm"
].values[
datafieldname[0].value
]
)
: fieldtype[0].value ==
"{07FAC785-CD58-4f9f-ABB3-4B7DDC6ED5ED}"
? getRadioLabel(
props.props.formData
.pickListData,
datafieldname[0].value,
props.props.form[
"appealForm"
].values[
datafieldname[0].value
]
)
: props.props.form["appealForm"]
.values[
datafieldname[0].value
]
)
: fieldtype[0].value ==
"{3EF39988-22BB-4f0b-BBBE-64B5A3748AEE}"
? getPickListLabel(
props.props.formData
.pickListData,
datafieldname[0].value,
props.props.form["appealForm"]
.values[
datafieldname[0].value
]
)
: props.props.form["appealForm"]
.values[
datafieldname[0].value
]}
</dd>
<dd className="govuk-summary-list__actions">
<a
className="govuk-link"
href="#"
onClick={() => {
updateCurrentSection(
whichSection
);
}}
>
{t("newappeal:change-link-label")}
<span className="govuk-visually-hidden">
{" "}
{FieldsTranslations(
rows[0].value
]}
</dd>
<dd className="govuk-summary-list__actions">
<a
className="govuk-link"
href="#"
onClick={() => {
updateCurrentSection(
whichSection
);
}}
>
{t(
"newappeal:change-link-label"
)}
</span>
</a>
</dd>
</div>
);
<span className="govuk-visually-hidden">
{" "}
{FieldsTranslations(
rows[0].value
)}
</span>
</a>
</dd>
</div>
);
} else {
return null;
}
} else {
return null;
}
+3 -3
View File
@@ -65,9 +65,9 @@ let BuildCheckSection = (props) => {
<dl className="govuk-summary-list ">
{Object.keys(titles).map((key) => (
<div key={key}>
{/* <h2 className="govuk-heading-m">
{titles[key].value}
</h2> */}
<h2 className="govuk-heading-m govuk-!-margin-top-9">
{titles[key].value}
</h2>
<BuildCheckRow
formXML={formXML}
+6 -4
View File
@@ -164,10 +164,12 @@ export default function BuildField(props) {
break;
case "{16D63FD6-119B-4353-BDCA-18358721C3FE}":
return (
<FileUploadField
name={props.datafieldname}
label={props.label}
/>
<div className="govuk-!-margin-bottom-9">
<FileUploadField
name={props.datafieldname}
label={props.label}
/>
</div>
);
break;
+3 -3
View File
@@ -199,15 +199,15 @@ const BuildProgress = (props) => {
aria-labelledby="progress-list"
className="at-nav"
>
<h3 className="govuk-heading-s govuk-!-font-weight-bold gov-font-dark-grey progress-heading">
<h2 className="govuk-heading-s govuk-!-font-weight-bold gov-font-dark-grey progress-heading">
{t("newappeal:new-appeal-progress-nav-label")}:{" "}
<span className="progress-case-reference">
{props.props.appealType.caseReference.ticketnumber}
</span>
</h3>
</h2>
<hr className="govuk-section-break govuk-section-break--m govuk-section-break--visible" />
<ol className="govuk-list">
<ol className="govuk-list" id="progress-list">
<ul className="govuk-list ">
<li className="at-nav__page">
<ol className="govuk-list">
+5 -5
View File
@@ -193,7 +193,7 @@ let BuildSection = (props) => {
<div className="govuk-grid-row">
<div className="govuk-grid-column-two-thirds">
<h1 className="govuk-heading-m govuk-!-margin-top-5">
{titles[0].value}
{FieldsTranslations(titles[0].value)}
</h1>
<form onSubmit={handleSubmit(onHandleSubmit)}>
{hasErrors == true ? (
@@ -222,7 +222,7 @@ let BuildSection = (props) => {
data-module="govuk-button"
onClick={() => getErrors()}
>
Continue
{t("common:continue-button")}
</button>
) : (
""
@@ -233,7 +233,7 @@ let BuildSection = (props) => {
className="govuk-button"
data-module="govuk-button"
>
Submit
{t("common:submit-button")}
</button>
) : (
""
@@ -246,7 +246,7 @@ let BuildSection = (props) => {
setCurrentSection(currentSection - 1)
}
>
Back
{t("common:back-link")}
</a>
) : (
""
@@ -372,7 +372,7 @@ let BuildSection = (props) => {
);
}}
>
Save and exit
{t("common:save-exit-button")}
</button>
</div>
</div>
-2
View File
@@ -35,8 +35,6 @@ let CompleteAppeal = (props) => {
});
updateBody = JSON.stringify(updateBody);
console.log("werwe");
updateBody = updateBody.replace(/:"Yes"/gm, `:true`);
updateBody = updateBody.replace(/:"No"/gm, `:false`);
updateBody = JSON.parse(updateBody);
+1 -1
View File
@@ -121,7 +121,7 @@ function DropzoneComponent(props) {
);
return (
<div className="govuk-grid-row">
<div className="govuk-grid-row ">
<div className="govuk-form-group"></div>
<section className="container">
<div {...getRootProps({ style, className: "dropzone" })}>
+13
View File
@@ -39,6 +39,19 @@ export const getPickListLabel = (data, picklistType, picklistID) => {
return pickListLabel[0];
};
export const getRadioLabel = (data, radiotListName, radioListID) => {
const radioListData = jsonpath.query(
data,
"$..[?(@.LogicalName=='" + radiotListName + "')]"
);
const pickListLabel = jsonpath.query(
radioListData,
"$..[?(@.Value=='" + radioListID + "')].Label.LocalizedLabels..Label"
);
return pickListLabel[0];
};
/*
* Get the details of a case from the appeal type
* @param object searchResultsObj