robbond/pedwfrontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

content amends for create appeal

Browse Source
This commit is contained in:
robbond
2024-03-26 11:36:35 +00:00
parent ff6ff9842c
commit e2edee35c6
7 changed files with 169 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/newappeal/aboutyou.js
+121 -33
View File
@@ -3,7 +3,6 @@ import { useRouter } from "next/router";
import { connect } from "react-redux";
import { useEffect, useState } from "react";
import { Field, formValueSelector, reduxForm, change } from "redux-form";
import { tr } from "date-fns/locale";
const RenderTextfield = ({
id,
@@ -191,6 +190,11 @@ const RenderRadio = ({
<fieldset className="govuk-fieldset">
<legend className="govuk-fieldset__legend govuk-fieldset__legend--s govuk-!-font-weight-regular">
{label}
{(custom.hint != false || custom.hint != undefined) && (
<div className="govuk-hint govuk-!-margin-top-4 govuk-!-font-size-16">
{custom.hint}
</div>
)}
</legend>
{touched && error && (
<span
@@ -282,6 +286,7 @@ function Radiofield(props) {
formProps,
parentFieldShowOnValue,
validation,
hint,
} = props;
const router = useRouter();
@@ -326,7 +331,7 @@ function Radiofield(props) {
errorMsg={t("newappeal:select-an-option-label")}
component={RenderRadio}
inline={props.inline}
hint={props.hint}
hint={hint}
//validate={eval(validation)}
requiredDocumentLabel={props.requiredDocumentLabel}
requiredDocumentValue={props.requiredDocumentValue}
@@ -345,7 +350,7 @@ function Radiofield(props) {
errorMsg={t("newappeal:select-an-option-label")}
component={RenderRadio}
inline={props.inline}
hint={props.hint}
hint={hint}
//validate={eval(validation)}
requiredDocumentLabel={props.requiredDocumentLabel}
requiredDocumentValue={props.requiredDocumentValue}
@@ -356,6 +361,67 @@ function Radiofield(props) {
</>
);
}
const RenderCheckBox = ({
datafieldname,
name,
label,
id,
errorMsg,
options,
input: { onChange, value },
meta: { touched, error },
...custom
}) => {
let { t } = useTranslation();
const required = (value) => (value ? undefined : "Required");
return (
<>
<div
className={
touched && error
? "govuk-form-group govuk-form-group--error"
: "govuk-form-group "
}
>
<fieldset className="govuk-fieldset">
{touched && error && (
<span
id={id + "-error"}
className="govuk-error-message"
>
<span className="govuk-visually-hidden">
Error:
</span>{" "}
{errorMsg}
</span>
)}
<div className={"govuk-checkboxes govuk-checkboxes--small"}>
<div className="govuk-checkboxes__item">
<Field
id={id}
name={id}
component="input"
type="checkbox"
className="govuk-checkboxes__input"
value={true}
validate={[required]}
/>
<label
className="govuk-label govuk-checkboxes__label"
htmlFor={id}
>
{label}
</label>
</div>
</div>
</fieldset>
</div>
</>
);
};
let AboutYou = (props) => {
let { t } = useTranslation();
@@ -440,6 +506,9 @@ let AboutYou = (props) => {
return (
<form onSubmit={handleSubmit(onHandleSubmit)}>
<div>
<p className="govuk-body-m">{t("newappeal:about-you-hint")}</p>
</div>
<Field
name={"pinswg_onbehalfof"}
id={"pinswg_onbehalfof"}
@@ -462,7 +531,6 @@ let AboutYou = (props) => {
</div>
</details>
</div>
<Radiofield
name={"pinswg_appellantagent"}
datafieldname={"pinswg_appellantagent"}
@@ -472,8 +540,8 @@ let AboutYou = (props) => {
className="govuk-radios__input"
validate={"[required]"}
errorMsg={t("newappeal:select-an-option-label")}
hint={t("newappeal:about-you-who-are-you-hint-label")}
/>
{appellantAgentValue == "846040000" && (
<>
<h2 className="govuk-heading-s">
@@ -536,18 +604,6 @@ let AboutYou = (props) => {
)}
/>
<Radiofield
name={"pinswg_contactprefs"}
datafieldname={"pinswg_contactprefs"}
label={t(
"newappeal:about-you-agent-contact-preferences-label"
)}
options="[846040000|newappeal:about-you-agent-contact-preferences-value-email,846040001|newappeal:about-you-agent-contact-preferences-value-post]"
id={"pinswg_contactprefs"}
className="govuk-radios__input"
validate={"[required]"}
errorMsg={t("newappeal:select-an-option-label")}
/>
<Radiofield
name={"pinswg_languagepreference"}
datafieldname={"pinswg_languagepreference"}
@@ -557,9 +613,27 @@ let AboutYou = (props) => {
options="[846040000|newappeal:about-you-agent-language-preferences-value-english,846040001|newappeal:about-you-agent-language-preferences-value-welsh]"
id={"pinswg_languagepreference"}
className="govuk-radios__input"
validate={"[required]"}
validate={[required]}
errorMsg={t("newappeal:select-an-option-label")}
/>
<div>
<p className="govuk-body-m">
{t(
"newappeal:about-you-communication-disclaimer-label"
)}
</p>
</div>
<Field
name={"pinswg_nondeterminationconfirmation"}
datafieldname={"pinswg_nondeterminationconfirmation"}
options={"[yes]"}
label={t("newappeal:appeal-confirmation-label")}
id={"pinswg_nondeterminationconfirmation"}
validate={[required]}
errorMsg={t("newappeal:select-to-confirm-label")}
component={RenderCheckBox}
/>
</>
)}
{appellantAgentValue == "846040001" && (
@@ -607,7 +681,7 @@ let AboutYou = (props) => {
component={RenderTextfield}
type="email"
className="govuk-input govuk-input--width-20"
validate={[required]}
//validate={[required]}
label={t(
"newappeal:about-you-appellant-contact-details-email-label"
)}
@@ -618,7 +692,7 @@ let AboutYou = (props) => {
component={RenderTextfield}
type="text"
className="govuk-input govuk-input--width-20"
validate={[required, phoneNumber]}
validate={[phoneNumber]}
label={t(
"newappeal:about-you-appellant-contact-details-phone-label"
)}
@@ -632,11 +706,20 @@ let AboutYou = (props) => {
component={RenderTextfield}
type="text"
className="govuk-input govuk-input--width-20"
validate={[required]}
//validate={[required]}
label={t(
"newappeal:about-you-agent-contact-details-companyname-label"
)}
/>
<Field
name={"pinswg_agentreference"}
id={"pinswg_agentreference"}
component={RenderTextfield}
type="text"
className="govuk-input govuk-input--width-20"
// validate={[required]}
label={t("newappeal:about-you-agent-reference-label")}
/>
<Field
name={"pinswg_agentfirstname"}
id={"pinswg_agentfirstname"}
@@ -693,18 +776,6 @@ let AboutYou = (props) => {
"newappeal:about-you-agent-contact-details-phone-label"
)}
/>
<Radiofield
name={"pinswg_contactprefs"}
datafieldname={"pinswg_contactprefs"}
label={t(
"newappeal:about-you-agent-contact-preferences-label"
)}
options="[846040000|newappeal:about-you-agent-contact-preferences-value-email,846040001|newappeal:about-you-agent-contact-preferences-value-post]"
id={"pinswg_contactprefs"}
className="govuk-radios__input"
validate={[required]}
errorMsg={t("newappeal:select-an-option-label")}
/>
<Radiofield
name={"pinswg_languagepreference"}
datafieldname={"pinswg_languagepreference"}
@@ -717,6 +788,23 @@ let AboutYou = (props) => {
validate={[required]}
errorMsg={t("newappeal:select-an-option-label")}
/>
<div>
<p className="govuk-body-m">
{t(
"newappeal:about-you-communication-disclaimer-label"
)}
</p>
</div>
<Field
name={"pinswg_nondeterminationconfirmation"}
datafieldname={"pinswg_nondeterminationconfirmation"}
options={"[yes]"}
label={t("newappeal:appeal-confirmation-label")}
id={"pinswg_nondeterminationconfirmation"}
validate={[required]}
errorMsg={t("newappeal:select-to-confirm-label")}
component={RenderCheckBox}
/>
</>
)}