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

Merged PR 841: added form ordering and validation for s78

Browse Source 
added form ordering and validation for s78

Related work items: #6601
This commit is contained in:
Robert Bond
2022-04-06 16:04:05 +00:00
parent c485559b22 093cba5d70
commit 1410b0bf13
21 changed files with 2093 additions and 1058 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.env.local
+6 -6
View File
@@ -4,7 +4,7 @@ ACCESS_TOKEN_ENDPOINT = https://login.microsoftonline.com/
//ESNR Tenant
TENANT = a8d860de-d5e1-45af-8376-d93f02e6b502
//WGO Tenant
TENANT = 9ac1a5ab-cd58-409e-a1b6-6b10422a68f5
//TENANT = 9ac1a5ab-cd58-409e-a1b6-6b10422a68f5
GRANT_TYPE = "client_credentials"
HASHKEY = 028ffbae928d7191c0017f298260995f901d78eabde1436c0af0423459cc3715832136d84f68818d3a96399467b52143e273d4f3bf4ae190848891535421cd6c
@@ -28,11 +28,11 @@ RELAYPATH = "dev-pedw-hc"
//Preprod Oauth WGO
CLIENT_ID = ab6c4678-b31a-4eb3-b429-e039120e488a
CLIENT_SECRET = Ioo7Q~RJfhWsE45wPsuHm1CzRk1SppnNN3lZF
RELAY_ROOT = https://pp-pedw-ns.servicebus.windows.net/pp-pedw-hc/
RELAYURI = "pp-pedw-ns.servicebus.windows.net"
RELAYPATH = "pp-pedw-hc"
//CLIENT_ID = ab6c4678-b31a-4eb3-b429-e039120e488a
//CLIENT_SECRET = Ioo7Q~RJfhWsE45wPsuHm1CzRk1SppnNN3lZF
//RELAY_ROOT = https://pp-pedw-ns.servicebus.windows.net/pp-pedw-hc/
//RELAYURI = "pp-pedw-ns.servicebus.windows.net"
//RELAYPATH = "pp-pedw-hc"
components/breadcrumbs.js
+47
View File
@@ -230,6 +230,53 @@ const Breadcrumbs = (props) => {
) : (
""
)}
{router.pathname == "/newappeal/[appealtypes]" ? (
<>
<li className="govuk-breadcrumbs__list-item">
<Link
href={
router.locale != "en"
? router.locale + "/myportal"
: "/myportal"
}
>
<a className="govuk-breadcrumbs__link">
{t("newappeal:parent-page-title")}
</a>
</Link>
</li>
<li className="govuk-breadcrumbs__list-item">
{t("newappeal:page-title")}
</li>
</>
) : (
""
)}
{router.pathname == "/myportal/[appealtypes]" ? (
<>
<li className="govuk-breadcrumbs__list-item">
<Link
href={
router.locale != "en"
? router.locale + "/myportal"
: "/myportal"
}
>
<a className="govuk-breadcrumbs__link">
{t("newappeal:parent-page-title")}
</a>
</Link>
</li>
<li className="govuk-breadcrumbs__list-item">
{t("newappeal:page-title")}
</li>
<li className="govuk-breadcrumbs__list-item">
{props.formTitle}
</li>
</>
) : (
""
)}
{router.pathname == "/newappeal/selectappeal" ? (
<>
<li className="govuk-breadcrumbs__list-item">
components/elements/index.js
+604 -82
View File
@@ -12,6 +12,17 @@ import pickListLookup from "../../data/picklistLookups.json";
import useTranslation from "next-translate/useTranslation";
import FileUpload from "../newappeal/fileupload";
import Dropzone, { useDropzone } from "react-dropzone";
import _ from "lodash";
import { connect, useDispatch } from "react-redux";
import {
addYears,
addMonths,
addDays,
subYears,
subMonths,
subDays,
} from "date-fns";
const RenderTextfield = ({
id,
@@ -50,86 +61,204 @@ const RenderTextfield = ({
};
export function Textfield(props) {
const { name, label, validate, ticketnumber } = props;
const {
name,
label,
validation,
ticketnumber,
form,
formProps,
parentField,
parentFieldShowOnValue,
hint,
} = props;
const required = (value) => (value ? undefined : "Required");
if (name == "pinswg_name") {
let { t } = useTranslation();
return (
<div className="govuk-form-group">
<label className="govuk-label " htmlFor={props.name}>
{label}
</label>
<input
type="text"
name={name}
id={props.name}
component={RenderCaseID}
value={ticketnumber}
className="govuk-input govuk-input--width-20"
disabled
/>
</div>
<>
<div className="govuk-form-group">
<label className="govuk-label " htmlFor={props.name}>
{label}
</label>
<input
type="text"
name={name}
id={props.name}
component={RenderCaseID}
value={ticketnumber}
className="govuk-input govuk-input--width-20"
disabled
/>
</div>
<div className="govuk-body">{t(hint)}</div>
</>
);
} else {
var showIfHasParentShowValue =
(parentField != false &&
!_.isEmpty(formProps[form]) &&
_.has(formProps[form].values, parentField) &&
formProps[form].values[parentField]) == parentFieldShowOnValue;
// console.log(parentField, showIfHasParentShowValue);
// console.log(parentField, formProps, form);
//console.log("validation props:", validation);
return (
<Field
name={props.name}
id={props.name}
component={RenderTextfield}
type="text"
className="govuk-input govuk-input--width-20"
//validate={[required]}
label={props.label}
errorMsg="Is required"
/>
<div className="govuk-form-group">
{parentField != false ? (
showIfHasParentShowValue && (
<Field
name={props.name}
id={props.name}
component={RenderTextfield}
type="text"
className="govuk-input govuk-input--width-20"
validate={eval(validation)}
label={props.label}
errorMsg="Is required"
/>
)
) : (
<Field
name={props.name}
id={props.name}
component={RenderTextfield}
type="text"
className="govuk-input govuk-input--width-20"
validate={eval(validation)}
label={props.label}
errorMsg="Is required"
/>
)}
</div>
);
}
}
const RenderMultiline = ({
id,
className,
rows,
datafieldname,
name,
label,
input,
errorMsg,
meta: { touched, error },
...custom
}) => {
return (
<>
<textarea {...input} rows={rows} className={className}></textarea>
<div
className={
touched && error
? "govuk-form-group govuk-form-group--error"
: "govuk-form-group "
}
>
<label className="govuk-label " htmlFor={id} id={id + "_label"}>
{FieldsTranslations(label)}
</label>
{touched && error && (
<span id={id + "-error"} className="govuk-error-message">
<span className="govuk-visually-hidden">Error:</span>{" "}
{touched &&
((error && (
<span>{errorMsg ? errorMsg : error}</span>
)) ||
(warning && <span>{warning}</span>))}
</span>
)}
<textarea
{...input}
rows={rows}
className={className}
></textarea>
</div>
</>
);
};
export function MultiLinefield(props) {
const { name, label } = props;
const {
name,
label,
parentField,
form,
formProps,
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;
// console.log(parentField, showIfHasParentShowValue);
return (
<div className="govuk-form-group">
<h1 className="govuk-label-wrapper">
<label className="govuk-label" htmlFor={props.name}>
{FieldsTranslations(props.label)}
</label>
</h1>
<div
id={props.name + "-hint"}
className="govuk-hint govuk-!-font-size-14"
>
Do not include personal or financial information, like your
National Insurance number or credit card details.
</div>
<>
{parentField != false ? (
showIfHasParentShowValue && (
<div>
<h1 className="govuk-label-wrapper">
<label className="govuk-label" htmlFor={props.name}>
{FieldsTranslations(props.label)}
</label>
</h1>
<div
id={props.name + "-hint"}
className="govuk-hint govuk-!-font-size-14"
>
Do not include personal or financial information.
</div>
<Field
name={props.name}
id={props.name}
component={RenderMultiline}
type="text"
rows="5"
className="govuk-textarea govuk-input--width-30"
aria-describedby={props.name + "-hint"}
validate={eval(validation)}
/>
</div>
)
) : (
<div className="govuk-form-group">
<h1 className="govuk-label-wrapper">
<label className="govuk-label" htmlFor={props.name}>
{FieldsTranslations(props.label)}
</label>
</h1>
<div
id={props.name + "-hint"}
className="govuk-hint govuk-!-font-size-14"
>
Do not include personal or financial information.
</div>
<Field
name={props.name}
id={props.name}
component={RenderMultiline}
type="text"
rows="5"
className="govuk-textarea govuk-input--width-30"
aria-describedby={props.name + "-hint"}
/>
</div>
<Field
name={props.name}
id={props.name}
component={RenderMultiline}
type="text"
rows="5"
className="govuk-textarea govuk-input--width-30"
aria-describedby={props.name + "-hint"}
validate={eval(validation)}
/>
</div>
)}
</>
);
}
@@ -145,6 +274,42 @@ const RenderDatePicker = ({
}) => {
const router = useRouter();
registerLocale("cy", cy);
var startDateArr =
custom.dateStart != "0" ? custom.dateStart.split("") : custom.dateStart;
var endDateArr =
custom.dateEnd != "0" ? custom.dateEnd.split("") : custom.dateEnd;
var minDate =
startDateArr == 0
? new Date()
: startDateArr[0] == "-"
? startDateArr[2] == "y"
? subYears(new Date(), startDateArr[1])
: startDateArr[2] == "m"
? subMonths(new Date(), startDateArr[1])
: subDays(new Date(), startDateArr[1])
: startDateArr[2] == "y"
? addYears(new Date(), startDateArr[1])
: startDateArr[2] == "m"
? addMonths(new Date(), startDateArr[1])
: addDays(new Date(), startDateArr[1]);
var maxDate =
endDateArr == 0
? new Date()
: startDateArr[0] == "-"
? startDateArr[2] == "y"
? subYears(new Date(), startDateArr[1])
: startDateArr[2] == "m"
? subMonths(new Date(), startDateArr[1])
: subDays(new Date(), startDateArr[1])
: startDateArr[2] == "y"
? addYears(new Date(), startDateArr[1])
: startDateArr[2] == "m"
? addMonths(new Date(), startDateArr[1])
: addDays(new Date(), startDateArr[1]);
return (
<>
<div
@@ -185,6 +350,9 @@ const RenderDatePicker = ({
dateFormat="dd/MM/yyyy"
onChange={onChange}
selected={value || null}
className="govuk-input govuk-input--width-10"
minDate={minDate}
maxDate={maxDate}
// value={!value ? null : new Date(value)}
/>
@@ -195,18 +363,53 @@ const RenderDatePicker = ({
};
export function DateFieldPicker(props) {
const { name, label } = props;
const {
name,
label,
parentField,
form,
formProps,
parentFieldShowOnValue,
validation,
dateStart,
dateEnd,
} = props;
const required = (value) => (value ? undefined : "Required");
var showIfHasParentShowValue =
(parentField != false &&
!_.isEmpty(formProps[form]) &&
_.has(formProps[form].values, parentField) &&
formProps[form].values[parentField]) == parentFieldShowOnValue;
return (
<Field
name={name}
id={name}
label={label}
component={RenderDatePicker}
//validate={[required]}
errorMsg="Select a date"
/>
<div className="govuk-form-group">
{parentField != false ? (
showIfHasParentShowValue && (
<Field
name={name}
id={name}
label={label}
component={RenderDatePicker}
validate={eval(validation)}
errorMsg="Select a date"
dateStart={dateStart}
dateEnd={dateEnd}
/>
)
) : (
<Field
name={name}
id={name}
label={label}
component={RenderDatePicker}
validate={eval(validation)}
errorMsg="Select a date"
dateStart={dateStart}
dateEnd={dateEnd}
/>
)}
</div>
);
}
@@ -332,7 +535,13 @@ const RenderYesNo = ({
{errorMsg}
</span>
)}
<div className="govuk-radios govuk-radios--inline govuk-radios--small">
<div
className={
custom.inline == false
? "govuk-radios govuk-radios--small"
: "govuk-radios govuk-radios--inline govuk-radios--small"
}
>
{Object.keys(options).map((key, index) => (
<div
className="govuk-radios__item"
@@ -346,6 +555,31 @@ const RenderYesNo = ({
type="radio"
className="govuk-radios__input"
value={options[key]}
onChange={(e) => {
let docListObj = custom.documentList;
if (
custom.requiredDocumentValue ==
"Yes" ||
custom.requiredDocumentValue ==
"Ydw"
) {
e.target.value == "Ydw" ||
e.target.value == "Yes"
? (docListObj = Object.assign(
docListObj,
{
["documentCheckList_" +
id]:
custom.requiredDocumentLabel,
}
))
: delete docListObj[
"documentCheckList_" + id
];
console.log(docListObj);
custom.setDocumentsList(docListObj);
}
}}
/>
<label
className="govuk-label govuk-radios__label"
@@ -365,7 +599,7 @@ const RenderYesNo = ({
export function YesNofield(props) {
const router = useRouter();
const { name, label } = props;
const { name, label, inline, validation } = props;
const yesNo = router.locale == "cy" ? ["Ydw", "Na"] : ["Yes", "No"];
const required = (value) => (value ? undefined : "Required");
@@ -376,10 +610,291 @@ export function YesNofield(props) {
label={props.label}
options={yesNo}
id={props.name}
className="govuk-radios__input"
//validate={[required]}
className={"govuk-radios__input"}
validate={eval(validation)}
errorMsg="Select an option"
component={RenderYesNo}
inline={_.has(props, "inline") ? props.inline : "true"}
requiredDocumentLabel={props.requiredDocumentLabel}
requiredDocumentValue={props.requiredDocumentValue}
setDocumentsList={props.setDocumentsList}
documentList={props.documentList}
/>
);
}
const RenderRadio = ({
datafieldname,
name,
label,
id,
errorMsg,
options,
input: { onChange, value },
meta: { touched, error },
...custom
}) => {
let { t } = useTranslation();
return (
<>
<div
className={
touched && error
? "govuk-form-group govuk-form-group--error"
: "govuk-form-group "
}
>
<fieldset
className="govuk-fieldset"
aria-describedby={name + "-hint"}
>
<legend className="govuk-fieldset__legend govuk-fieldset__legend--s govuk-!-font-weight-regular">
<label
className="govuk-fieldset__heading govuk-body-m"
id={id + "_label"}
>
{FieldsTranslations(label)}
</label>
</legend>
{touched && error && (
<span
id={id + "-error"}
className="govuk-error-message"
>
<span className="govuk-visually-hidden">
Error:
</span>{" "}
{errorMsg}
</span>
)}
<div
className={
custom.inline == false
? "govuk-radios govuk-radios--small"
: "govuk-radios govuk-radios--inline govuk-radios--small"
}
>
{" "}
{custom.hint != false && (
<div class="govuk-hint">{t(custom.hint)}</div>
)}
{Object.keys(options).map((key, index) => (
<div
className="govuk-radios__item"
data-children-count={key}
key={key}
>
<Field
id={id + "_" + index}
name={id}
component="input"
type="radio"
className="govuk-radios__input"
value={options[key].split("|")[0]}
onChange={(e) => {
let docListObj = custom.documentList;
if (
custom.requiredDocumentValue ==
"Yes"
) {
e.target.value != "846040000"
? (docListObj = Object.assign(
docListObj,
{
["documentCheckList_" +
id]:
custom.requiredDocumentLabel,
}
))
: delete docListObj[
"documentCheckList_" + id
];
custom.setDocumentsList(docListObj);
}
}}
/>
<label
className="govuk-label govuk-radios__label"
htmlFor={id + "_" + index}
>
{t(options[key].split("|")[1])}
</label>
</div>
))}
</div>
</fieldset>
</div>
</>
);
};
export function Radiofield(props) {
const {
name,
label,
datafieldname,
parentField,
form,
formProps,
parentFieldShowOnValue,
validation,
} = props;
const router = useRouter();
const required = (value) => (value ? undefined : "Required");
// console.log(props.options);
const fieldOptions = props.options
.slice(1, props.options.length - 1)
.split(",");
//parentFieldShowOnValue
var showIfHasParentShowValue =
parentField != false &&
!_.isEmpty(formProps[form]) &&
_.has(formProps[form].values, parentField) &&
parentFieldShowOnValue.indexOf(
formProps[form].values[parentField].toString()
) > -1;
// console.log(showIfHasParentShowValue);
return (
<>
{parentField != false ? (
showIfHasParentShowValue && (
<Field
name={name}
datafieldname={datafieldname}
label={label}
options={fieldOptions}
id={name}
//validate={[required]}
errorMsg="Select an option"
component={RenderRadio}
inline={props.inline}
hint={props.hint}
validate={eval(validation)}
requiredDocumentLabel={props.requiredDocumentLabel}
requiredDocumentValue={props.requiredDocumentValue}
setDocumentsList={props.setDocumentsList}
documentList={props.documentList}
/>
)
) : (
<Field
name={name}
datafieldname={datafieldname}
label={label}
options={fieldOptions}
id={name}
//validate={[required]}
errorMsg="Select an option"
component={RenderRadio}
inline={props.inline}
hint={props.hint}
validate={eval(validation)}
requiredDocumentLabel={props.requiredDocumentLabel}
requiredDocumentValue={props.requiredDocumentValue}
setDocumentsList={props.setDocumentsList}
documentList={props.documentList}
/>
)}
</>
);
}
const RenderCheckBox = ({
datafieldname,
name,
label,
id,
errorMsg,
options,
input: { onChange, value },
meta: { touched, error },
...custom
}) => {
return (
<>
<div
className={
touched && error
? "govuk-form-group govuk-form-group--error"
: "govuk-form-group "
}
>
<fieldset
className="govuk-fieldset"
aria-describedby={name + "-hint"}
>
<legend className="govuk-fieldset__legend govuk-fieldset__legend--s govuk-!-font-weight-regular">
<label
className="govuk-fieldset__heading govuk-body-m"
id={id + "_label"}
>
{FieldsTranslations(label)}
</label>
</legend>
{touched && error && (
<span
id={id + "-error"}
className="govuk-error-message"
>
<span className="govuk-visually-hidden">
Error:
</span>{" "}
{errorMsg}
</span>
)}
<div className="govuk-checkboxes ">
{Object.keys(options).map((key, index) => (
<div
className="govuk-checkboxes__item"
data-children-count={key}
key={key}
>
<Field
id={id + "_" + index}
name={id + "_" + index}
component="input"
type="checkbox"
className="govuk-checkboxes__input"
value={options[key]}
/>
<label
className="govuk-label govuk-checkboxes__label"
htmlFor={id + "_" + index}
>
{options[key]}
</label>
</div>
))}
</div>
</fieldset>
</div>
</>
);
};
export function CheckBoxfield(props) {
const router = useRouter();
console.log(props);
const required = (value) => (value ? undefined : "Required");
const fieldOptions =
router.locale == "cy" ? ["Ydw", "Na", "2323"] : ["Yes", "No", "23232"];
return (
<Field
name={props.name}
datafieldname={props.datafieldname}
label={props.label}
options={fieldOptions}
id={props.id}
className={props.className}
//validate={[required]}
errorMsg="Select an option"
component={RenderCheckBox}
/>
);
}
@@ -438,7 +953,8 @@ export function PickList(props) {
}
export function NumericField(props) {
const { name, label } = props;
const { name, label, validation } = props;
const required = (value) => (value ? undefined : "Required");
return (
<div className="govuk-form-group">
@@ -448,7 +964,6 @@ export function NumericField(props) {
<Field
name={props.name}
id={props.name}
component="input"
type="number"
className="govuk-input govuk-input--width-20"
spellCheck="false"
@@ -456,13 +971,16 @@ export function NumericField(props) {
pattern="[0-9]*"
inputMode="numeric"
parse={Number}
validate={eval(validation)}
component={RenderTextfield}
/>
</div>
);
}
export function DecimalField(props) {
const { name, label } = props;
const { name, label, validation } = props;
const required = (value) => (value ? undefined : "Required");
return (
<div className="govuk-form-group">
@@ -472,7 +990,7 @@ export function DecimalField(props) {
<Field
name={props.name}
id={props.name}
component="input"
// component="input"
type="number"
className="govuk-input govuk-input--width-10"
spellCheck="false"
@@ -480,6 +998,8 @@ export function DecimalField(props) {
pattern="[0-9]*"
inputMode="numeric"
parse={Number}
validate={eval(validation)}
component={RenderTextfield}
/>
</div>
);
@@ -491,24 +1011,26 @@ export function ReadOnlyfield(props) {
const { name, label, value } = props;
//console.log(props.value.refno);
return (
<div className="govuk-form-group">
<label className="govuk-label " htmlFor={props.name}>
{FieldsTranslations(props.label)}
</label>
<input
type="text"
name={props.name}
id={props.name}
component={RenderCaseID}
value={value}
className="govuk-input govuk-input--width-20"
disabled
/>
</div>
<>
<div className="govuk-form-group">
<label className="govuk-label " htmlFor={props.name}>
{FieldsTranslations(props.label)}
</label>
<input
type="text"
name={props.name}
id={props.name}
component={RenderCaseID}
value={value}
className="govuk-input govuk-input--width-20"
disabled
/>
</div>
</>
);
}
const FieldsTranslations = (label) => {
export const FieldsTranslations = (label) => {
const router = useRouter();
const { locale } = router;
const { appealtypes } = router.query;
components/homepage/login.js
+2 -2
View File
@@ -207,7 +207,7 @@ let Login = (props) => {
<h3 className="heading-small card-heading">
{t("home:login-card-title")}
</h3>{" "}
{/* <form onSubmit={handleSubmit(onHandleSubmit)}>
<form onSubmit={handleSubmit(onHandleSubmit)}>
{validLoginID == false && (
<div className="govuk-error-message govuk-form-group--error">
Incorrect username or password
@@ -254,7 +254,7 @@ let Login = (props) => {
{t("home:login-card-button")}
</button>
</div>
</form> */}
</form>
<div className="govuk-form-group govuk-!-margin-top-4">
<p className="govuk-body-xs">
<a
components/newappeal/aboutyou.js
+448
View File
@@ -0,0 +1,448 @@
import useTranslation from "next-translate/useTranslation";
import { useRouter } from "next/router";
import { connect } from "react-redux";
import { Field, formValueSelector, reduxForm } from "redux-form";
let AboutYou = (props) => {
let { t } = useTranslation();
const router = useRouter();
const { locale } = router;
const { onSubmit, handleSubmit, appellantAgentValue } = props;
const yesNo = router.locale == "cy" ? ["Ydw", "Na"] : ["Yes", "No"];
const appellantAgent =
router.locale == "cy" ? ["Apelydd", "Asiant"] : ["Appellant", "Agent"];
const contactPref =
router.locale == "cy" ? ["Ebost", "Post"] : ["Email", "Post"];
const required = (value) => (value ? undefined : "Is required");
const emailRegex =
/(?:[a-z0-9!#$%&'*+\/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+\/=?^_`{|}~-]+)*|"(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21\x23-\x5b\x5d-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])*")@(?:(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?|\[(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?|[a-z0-9-]*[a-z0-9]:(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21-\x5a\x53-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])+)\])/gi;
const email = (value) =>
value && !emailRegex.test(value) ? "Invalid email address" : undefined;
const phoneNumber = (value) =>
value &&
!/^(?:(?:\(?(?:0(?:0|11)\)?[\s-]?\(?|\+)44\)?[\s-]?(?:\(?0\)?[\s-]?)?)|(?:\(?0))(?:(?:\d{5}\)?[\s-]?\d{4,5})|(?:\d{4}\)?[\s-]?(?:\d{5}|\d{3}[\s-]?\d{3}))|(?:\d{3}\)?[\s-]?\d{3}[\s-]?\d{3,4})|(?:\d{2}\)?[\s-]?\d{4}[\s-]?\d{4}))(?:[\s-]?(?:x|ext\.?|\#)\d{3,4})?$/i.test(
value
)
? "Invalid phone number"
: undefined;
const RenderTextfield = ({
id,
className,
rows,
datafieldname,
name,
label,
input,
type,
errorMsg,
disabled,
meta: { touched, error },
...custom
}) => {
return (
<>
<div
className={
touched && error
? "govuk-form-group govuk-form-group--error"
: "govuk-form-group "
}
>
<label
className="govuk-label "
htmlFor={id}
id={id + "_label"}
>
{label}
</label>
{touched && error && (
<span
id={id + "-error"}
className="govuk-error-message"
>
<span className="govuk-visually-hidden">
Error:
</span>{" "}
{touched &&
((error && (
<span>{errorMsg ? errorMsg : error}</span>
)) ||
(warning && <span>{warning}</span>))}
</span>
)}
<input
{...input}
className={className}
name={id}
id={id}
type={type}
disabled={disabled ? true : false}
/>
</div>
</>
);
};
const RenderYesNo = ({
datafieldname,
name,
label,
id,
errorMsg,
options,
input: { onChange, value },
meta: { touched, error },
...custom
}) => {
return (
<>
<div
className={
touched && error
? "govuk-form-group govuk-form-group--error"
: "govuk-form-group "
}
>
<fieldset
className="govuk-fieldset"
aria-describedby={name + "-hint"}
>
<legend className="govuk-fieldset__legend govuk-fieldset__legend--s govuk-!-font-weight-regular">
<label
className="govuk-fieldset__heading govuk-body-m"
id={id + "_label"}
>
{label}
</label>
</legend>
{touched && error && (
<span
id={id + "-error"}
className="govuk-error-message"
>
<span className="govuk-visually-hidden">
Error:
</span>{" "}
{errorMsg}
</span>
)}
<div className="govuk-radios govuk-radios--inline govuk-radios--small">
{Object.keys(options).map((key, index) => (
<div
className="govuk-radios__item"
data-children-count={key}
key={key}
>
<Field
id={id + "_" + index}
name={id}
component="input"
type="radio"
className="govuk-radios__input"
value={options[key]}
/>
<label
className="govuk-label govuk-radios__label"
htmlFor={id + "_" + index}
>
{options[key]}
</label>
</div>
))}
</div>
</fieldset>
</div>
</>
);
};
const onHandleSubmit = (values) => {
event.preventDefault();
console.log(values);
router.replace("/newappeal");
};
return (
<form onSubmit={handleSubmit(onHandleSubmit)}>
<Field
name={"onbehalfof"}
id={"onbehalfof"}
component={RenderTextfield}
type="text"
className="govuk-input govuk-input--width-20"
validate={[required]}
label={t("newappeal:about-you-on-behalf-label")}
/>
<div className="govuk-form-group">
<details class="govuk-details" data-module="govuk-details">
<summary class="govuk-details__summary">
<span class="govuk-details__summary-text">
Who can appeal?
</span>
</summary>
<div class="govuk-details__text">
Only those named as an applicant on the original
application form can submit an appeal. if you are
submitting an appeal on behalf of a company state the
name of the company you are representing,
</div>
</details>
</div>
<Field
name={"appellantAgent"}
datafieldname={"appellantAgent"}
label={t("newappeal:about-you-who-are-you-label")}
options={appellantAgent}
id={"appellantAgent"}
className="govuk-radios__input"
validate={[required]}
errorMsg="Select an option"
component={RenderYesNo}
/>
{(appellantAgentValue == "Appellant" ||
appellantAgentValue == "Apelydd") && (
<>
<h2 className="govuk-heading-s">
{t("newappeal:about-you-appellant-contact-details")}
</h2>
<Field
name={"appellantfirstname"}
id={"appellantfirstname"}
component={RenderTextfield}
type="text"
className="govuk-input govuk-input--width-20"
validate={[required]}
label={t(
"newappeal:about-you-appellant-contact-details-firstname-label"
)}
/>
<Field
name={"appellantlastname"}
id={"appellantlastname"}
component={RenderTextfield}
type="text"
className="govuk-input govuk-input--width-20"
validate={[required]}
label={t(
"newappeal:about-you-appellant-contact-details-lastname-label"
)}
/>{" "}
<Field
name={"appellantemailaddress"}
id={"appellantemailaddress"}
component={RenderTextfield}
type="email"
className="govuk-input govuk-input--width-20"
validate={[required, email]}
label={t(
"newappeal:about-you-appellant-contact-details-email-label"
)}
/>
<Field
name={"appellantphonenumber"}
id={"appellantphonenumber"}
component={RenderTextfield}
type="numberz"
className="govuk-input govuk-input--width-20"
validate={[required, phoneNumber]}
label={t(
"newappeal:about-you-appellant-contact-details-phone-label"
)}
/>
<Field
name={"contactPrefs"}
datafieldname={"contactPrefs"}
label={t(
"newappeal:about-you-agent-contact-preferences-label"
)}
options={contactPref}
id={"contactPrefs"}
className="govuk-radios__input"
//validate={[required]}
errorMsg="Select an option"
component={RenderYesNo}
/>
</>
)}
{(appellantAgentValue == "Agent" ||
appellantAgentValue == "Asiant") && (
<>
<h2 className="govuk-heading-s">
{t("newappeal:about-you-appellant-contact-details")}
</h2>
<Field
name={"appellantfirstname"}
id={"appellantfirstname"}
component={RenderTextfield}
type="text"
className="govuk-input govuk-input--width-20"
validate={[required]}
label={t(
"newappeal:about-you-appellant-contact-details-firstname-label"
)}
/>
<Field
name={"appellantlastname"}
id={"appellantlastname"}
component={RenderTextfield}
type="text"
className="govuk-input govuk-input--width-20"
validate={[required]}
label={t(
"newappeal:about-you-appellant-contact-details-lastname-label"
)}
/>{" "}
<Field
name={"appellantemailaddress"}
id={"appellantemailaddress"}
component={RenderTextfield}
type="email"
className="govuk-input govuk-input--width-20"
validate={[required, email]}
label={t(
"newappeal:about-you-appellant-contact-details-email-label"
)}
/>
<Field
name={"appellantphonenumber"}
id={"appellantphonenumber"}
component={RenderTextfield}
type="text"
className="govuk-input govuk-input--width-20"
validate={[required]}
label={t(
"newappeal:about-you-appellant-contact-details-phone-label"
)}
/>
<h2 className="govuk-heading-s">
{t("newappeal:about-you-agent-contact-details")}
</h2>{" "}
<Field
name={"agentcompanyname"}
id={"agentcompanyname"}
component={RenderTextfield}
type="text"
className="govuk-input govuk-input--width-20"
validate={[required]}
label={t(
"newappeal:about-you-agent-contact-details-companyname-label"
)}
/>
<Field
name={"agentfirstname"}
id={"agentfirstname"}
component={RenderTextfield}
type="text"
className="govuk-input govuk-input--width-20"
validate={[required]}
label={t(
"newappeal:about-you-agent-contact-details-firstname-label"
)}
/>
<Field
name={"agentlastname"}
id={"agentlastname"}
component={RenderTextfield}
type="text"
className="govuk-input govuk-input--width-20"
validate={[required]}
label={t(
"newappeal:about-you-agent-contact-details-lastname-label"
)}
/>{" "}
<Field
name={"agentemailaddress"}
id={"agentemailaddress"}
component={RenderTextfield}
type="text"
className="govuk-input govuk-input--width-20"
validate={[required, email]}
label={t(
"newappeal:about-you-agent-contact-details-email-label"
)}
/>
<Field
name={"agentphonenumber"}
id={"agentphonenumber"}
component={RenderTextfield}
type="number"
className="govuk-input govuk-input--width-20"
validate={[required, phoneNumber]}
label={t(
"newappeal:about-you-agent-contact-details-phone-label"
)}
/>
<Field
name={"contactPrefs"}
datafieldname={"contactPrefs"}
label={t(
"newappeal:about-you-agent-contact-preferences-label"
)}
options={contactPref}
id={"contactPrefs"}
className="govuk-radios__input"
//validate={[required]}
errorMsg="Select an option"
component={RenderYesNo}
/>
</>
)}
<button
type="submit"
className="govuk-button"
data-module="govuk-button"
>
{t("common:continue-button")}
</button>
</form>
);
};
const mapStateToProps = (state) => {
return {
search: state.search,
searchResultsObj: state.searchResultsObj,
formData: state.formData,
appealType: state.appealType,
//form: state.form,
};
};
const mapDispatchToProps = (dispatch) => {
return {};
};
AboutYou = reduxForm({
form: "caseForm", // a unique identifier for this form
destroyOnUnmount: false,
})(AboutYou);
const selector = formValueSelector("caseForm"); // <-- same as form name
AboutYou = connect((state) => {
// can select values individually
const appellantAgentValue = selector(state, "appellantAgent");
return {
appellantAgentValue,
};
})(AboutYou);
export default AboutYou;
// export default connect(
// mapStateToProps,
// mapDispatchToProps
// )(
// reduxForm({
// form: "caseForm",
// destroyOnUnmount: false,
// })(AboutYou)
// );
components/newappeal/buildfield.js
+69 -2
View File
@@ -5,7 +5,6 @@ import xpath from "xpath";
import {
Textfield,
DateField,
DateFieldPicker,
YesNofield,
PickList,
@@ -14,6 +13,8 @@ import {
ReadOnlyfield,
DecimalField,
FileUploadField,
CheckBoxfield,
Radiofield,
} from "../elements";
export default function BuildField(props) {
@@ -26,9 +27,11 @@ export default function BuildField(props) {
const parser = new DOMParser();
console.log(props);
//console.log(props);
const whichFieldType = (classid) => {
//console.log(props.datafieldname, classid);
switch (classid) {
case "{270BD3DB-D9AF-4782-9025-509E298DEC0A}":
return (
@@ -54,6 +57,7 @@ export default function BuildField(props) {
label={props.label}
datafieldname={props.datafieldname}
picklistData={props.picklistData}
validation={props.validation}
/>
);
break;
@@ -62,10 +66,38 @@ export default function BuildField(props) {
<YesNofield
name={props.datafieldname}
label={props.label}
requiredDocumentValue={props.requiredDocumentValue}
requiredDocumentLabel={props.requiredDocumentLabel}
validation={props.validation}
setDocumentsList={props.setDocumentsList}
documentList={props.documentList}
/>
);
break;
case "{07FAC785-CD58-4f9f-ABB3-4B7DDC6ED5ED}":
return (
<Radiofield
name={props.datafieldname}
label={props.label}
datafieldname={props.datafieldname}
options={props.datafieldcontent}
inline={false}
hint={props.hint}
form={props.props.props.form}
formProps={props.props.props.props.form}
parentField={props.parentField}
parentFieldShowOnValue={props.parentFieldShowOnValue}
validation={props.validation}
setDocumentsList={props.setDocumentsList}
documentList={props.documentList}
requiredDocumentValue={props.requiredDocumentValue}
requiredDocumentLabel={props.requiredDocumentLabel}
/>
);
break;
case "{4273EDBD-AC1D-40d3-9FB2-095C621B552D}":
const required = (value) => (value ? undefined : "Is required");
return (
<Textfield
name={props.datafieldname}
@@ -75,6 +107,12 @@ export default function BuildField(props) {
props.props.props.appealType.caseReference
.ticketnumber
}
form={props.props.props.form}
formProps={props.props.props.props.form}
parentField={props.parentField}
parentFieldShowOnValue={props.parentFieldShowOnValue}
validation={props.validation}
hint={props.hint}
/>
);
break;
@@ -83,6 +121,13 @@ export default function BuildField(props) {
<DateFieldPicker
name={props.datafieldname}
label={props.label}
form={props.props.props.form}
formProps={props.props.props.props.form}
parentField={props.parentField}
parentFieldShowOnValue={props.parentFieldShowOnValue}
validation={props.validation}
dateStart={props.dateStart}
dateEnd={props.dateEnd}
/>
);
break;
@@ -91,6 +136,11 @@ export default function BuildField(props) {
<MultiLinefield
name={props.datafieldname}
label={props.label}
form={props.props.props.form}
formProps={props.props.props.props.form}
parentField={props.parentField}
parentFieldShowOnValue={props.parentFieldShowOnValue}
validation={props.validation}
/>
);
break;
@@ -99,6 +149,7 @@ export default function BuildField(props) {
<NumericField
name={props.datafieldname}
label={props.label}
validation={props.validation}
/>
);
break;
@@ -107,6 +158,7 @@ export default function BuildField(props) {
<DecimalField
name={props.datafieldname}
label={props.label}
validation={props.validation}
/>
);
break;
@@ -118,6 +170,21 @@ export default function BuildField(props) {
/>
);
break;
case "{9EF39988-22BB-4f0b-BBBE-64B5A3748AEE}":
return (
<CheckBoxfield
name={props.datafieldname}
label={props.label}
props={props}
form={props.props.props.form}
formProps={props.props.props.props.form}
parentField={props.parentField}
parentFieldShowOnValue={props.parentFieldShowOnValue}
validation={props.validation}
/>
);
break;
default:
return (
<Textfield name={props.datafieldname} label={props.label} />
components/newappeal/buildrow.js
+79 -1
View File
@@ -35,9 +35,61 @@ export default function BuildRow(props) {
} else {
var rows = xpath.select("//label/@description", doc);
var fieldtype = xpath.select("//@classid", doc);
var validation = xpath.select("//@validation", doc);
var datafieldname = xpath.select("//@datafieldname", doc);
var datafieldcontent = xpath.select(
"//@datafieldcontent",
doc
);
var parentField = xpath.select("//@parentField", doc);
console.log(doc, datafieldname[0].value);
var parentFieldShowOnValue = xpath.select(
"//@parentFieldShowOnValue",
doc
);
var requiredDocumentValue = xpath.select(
"//@requiredDocumentValue",
doc
);
var requiredDocumentLabel = xpath.select(
"//@requiredDocumentLabel",
doc
);
var hint = xpath.select("//label/@hint", doc);
var dateStart = xpath.select("//@dateStart", doc);
var dateEnd = xpath.select("//@dateEnd", doc);
hint = !_.isEmpty(hint) && hint[0].value;
validation = !_.isEmpty(validation)
? validation[0].value
: [];
parentField =
!_.isEmpty(parentField) && parentField[0].value;
parentFieldShowOnValue =
!_.isEmpty(parentFieldShowOnValue) &&
parentFieldShowOnValue[0].value;
datafieldcontent =
!_.isEmpty(datafieldcontent) &&
datafieldcontent[0].value;
requiredDocumentValue =
!_.isEmpty(requiredDocumentValue) &&
requiredDocumentValue[0].value;
requiredDocumentLabel =
!_.isEmpty(requiredDocumentLabel) &&
requiredDocumentLabel[0].value;
dateStart = !_.isEmpty(dateStart) && dateStart[0].value;
dateEnd = !_.isEmpty(dateEnd) && dateEnd[0].value;
const isRequiredField = jsonpath.query(
mandatoryFieldsData,
@@ -61,15 +113,25 @@ export default function BuildRow(props) {
/>
);
} else {
// console.log(
// datafieldname[0].value,
// isRequiredField[0].RequiredLevel.Value
// );
if (typeof isRequiredField[0] != "undefined") {
if (
isRequiredField[0].RequiredLevel.Value != "None"
) {
//console.log(datafieldname[0].value, validation);
return (
<BuildField
fieldType={fieldtype[0].value}
label={rows[0].value}
datafieldname={datafieldname[0].value}
datafieldcontent={datafieldcontent}
parentField={parentField}
parentFieldShowOnValue={
parentFieldShowOnValue
}
key={key}
props={props}
picklistData={
@@ -79,6 +141,22 @@ export default function BuildRow(props) {
mandatoryFieldsData={
mandatoryFieldsData
}
hint={hint}
requiredDocumentLabel={
requiredDocumentLabel
}
requiredDocumentValue={
requiredDocumentValue
}
validation={validation}
dateStart={dateStart}
dateEnd={dateEnd}
setDocumentsList={
props.props.setDocumentsList
}
documentList={
props.props.appealType.documentList
}
/>
);
} else {
components/newappeal/buildsection.js
+43 -6
View File
@@ -10,7 +10,11 @@ import { useDispatch, useSelector, shallowEqual, connect } from "react-redux";
import {
setCaseReference,
setCurrentSection,
setDocumentsList,
} from "../../store/appealType/action";
import { FieldsTranslations } from "../elements";
import { query } from "jsonpath";
let BuildSection = (props) => {
@@ -35,6 +39,7 @@ let BuildSection = (props) => {
mandatoryFieldsData,
} = props;
const documentListObj = props.appealType.documentList;
const currentSection = props.appealType.currentSection;
const parser = new DOMParser();
var doc = parser.parseFromString(props.formXML, "text/xml");
@@ -131,8 +136,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}{" "} */}
Enter your appeal information
{titles[0].value}
</h1>
<form onSubmit={handleSubmit(onHandleSubmit)}>
{hasErrors == true ? (
@@ -200,7 +204,7 @@ let BuildSection = (props) => {
className="at-nav"
>
<h3 className="govuk-heading-s govuk-!-font-weight-bold gov-font-dark-grey">
Progress:
{t("newappeal:new-appeal-progress-nav-label")}:
</h3>
<hr className="govuk-section-break govuk-section-break--m govuk-section-break--visible" />
@@ -211,7 +215,11 @@ let BuildSection = (props) => {
{Object.keys(titleList).map((key) =>
parseInt(key) + 1 == currentSection ? (
<li key={key}>
<b>{titleList[key].value} </b>
<b>
{FieldsTranslations(
titleList[key].value
)}{" "}
</b>
</li>
) : (
<li key={key}>
@@ -229,10 +237,14 @@ let BuildSection = (props) => {
);
}}
>
{titleList[key].value}
{FieldsTranslations(
titleList[key].value
)}
</a>
) : (
titleList[key].value
FieldsTranslations(
titleList[key].value
)
)}
</li>
)
@@ -242,6 +254,28 @@ let BuildSection = (props) => {
</ul>
</ol>
</nav>
{Object.keys(documentListObj).length > 0 && (
<div>
<h3 className="govuk-heading-s govuk-!-font-weight-bold gov-font-dark-grey">
{t("newappeal:new-appeal-documentlist-nav")}:
</h3>
<hr className="govuk-section-break govuk-section-break--m govuk-section-break--visible" />
<ol className="govuk-list document-list">
<ul className="govuk-list ">
<li className="at-nav__page">
<ol className="govuk-list govuk-list--bullet">
{Object.entries(documentListObj).map(
([key, value]) => {
return <li>{value}</li>;
}
)}
</ol>
</li>
</ul>
</ol>
</div>
)}
</div>
</div>
);
@@ -265,6 +299,9 @@ const mapDispatchToProps = (dispatch) => {
gotoSection: (thisSection) => {
dispatch(setCurrentSection(thisSection));
},
setDocumentsList: (documentList) => {
dispatch(setDocumentsList(documentList));
},
};
};
components/newappeal/complete.js
+2 -1
View File
@@ -27,7 +27,7 @@ let CompleteAppeal = (props) => {
Object.assign(updateBody, {
"pinswg_Appellant@odata.bind":
"/contacts(" + props.props.accountDetails.loggedinUserId + ")",
"pinswg_AssociatedLPA@odata.bind":
"pinswg_LocalPlanningAuthority@odata.bind":
"/accounts(" + props.appealType.appealLPA + ")",
"pinswg_name": props.appealType.caseReference.ticketnumber,
[updateBindAppealTypeToIncident + "@odata.bind"]:
@@ -35,6 +35,7 @@ let CompleteAppeal = (props) => {
});
updateBody = JSON.stringify(updateBody);
console.log("werwe");
updateBody = updateBody.replace(/:"Yes"/gm, `:true`);
updateBody = updateBody.replace(/:"No"/gm, `:false`);
components/timeout/index.js
+1 -1
View File
@@ -52,7 +52,7 @@ const TimeOut = (props) => {
}}
element={document}
stopOnIdle={true}
onActive={console.log(" bbis active", idleTimer)}
//onActive={console.log(" bbis active", idleTimer)}
onIdle={onIdle}
timeout={1000 * inactiveTimeOut * 1}
/>
data/crmfieldlookuptranslations.json
+224
View File
@@ -2123,6 +2123,230 @@
{
"value": "Type of Planning Application",
"value_cy": "Math o Gais Cynllunio"
},
{
"value": "Case reference",
"value_cy": "Cyfeirnod achos"
},
{
"value": "Development description",
"value_cy": "Disgrifiad o'r datblygiad"
},
{
"value": "Do not include personal or financial information.",
"value_cy": "Peidiwch â chynnwys gwybodaeth bersonol neu ariannol."
},
{
"value": "Has the description of the development changed since the application was submitted?",
"value_cy": "Ydy disgrifiad o'r datblygiad wedi newid ers cyflwyno'r cais?"
},
{
"value": "What date was your application decided on by the LPA?",
"value_cy": "Ar ba ddyddiad y penderfynodd yr ACLl ar eich cais?"
},
{
"value": "What was the LPA Application Reference number given to your application?",
"value_cy": "Beth oedd y Cyfeirnod Cais ACLl a roddwyd i'ch cais?"
},
{
"value": "When is the application form dated?",
"value_cy": "Pryd mae dyddiad ar y ffurflen gais?"
},
{
"value": "Has your application been decided by the LPA?",
"value_cy": "A yw'r ACLl wedi penderfynu ar eich cais?"
},
{
"value": "Appeal details",
"value_cy": "Manylion yr apêl"
},
{
"value": "Site visit information",
"value_cy": "Gwybodaeth ymweliad safle"
},
{
"value": "Appeal site ownership details",
"value_cy": "Manylion perchnogaeth safle apêl"
},
{
"value": "Ownership Certificate",
"value_cy": "Tystysgrif Perchnogaeth"
},
{
"value": "We need to know who owns the appeal site. If you do not own the appeal site or if you own only part of it, we need to know the name(s) of the owner(s) or part owner(s). We also need to be sure that the other owner(s) know that you have made an appeal. Please refer to the guidance notes on completing this section.",
"value_cy": "Mae angen i ni wybod pwy sy'n berchen ar safle'r apźl. Os nad ydych yn berchen ar safle'r apźl neu os mai dim ond rhan ohono rydych yn berchen arno, mae angen i ni wybod enw(au) y perchennog(perchnogion) neu'r rhan-berchennog/perchnogion. Mae angen i ni hefyd fod yn siŵr bod y perchennog/perchnogion eraill yn gwybod eich bod wedi gwneud apêl. Cyfeiriwch at y nodiadau canllaw ar lenwi'r adran hon."
},
{
"value": "Not applicable",
"value_cy": "Amherthnasol"
},
{
"value": "Certificate A - (If you are the sole owner of the whole appeal site, certificate A applies). I certify that, on the day 21 days before the date of this appeal, nobody except the appellant, was the owner (see the guidance leaflet for a definition) of any part of the land to which the appeal relates",
"value_cy": "Tystysgrif A - (Os mai chi yw unig berchennog safle cyfan yr apźl, mae tystysgrif A yn gymwys). Tystiaf, ar y diwrnod 21 diwrnod cyn dyddiad yr apêl hon, nad oedd neb ac eithrio’r apelydd, yn berchennog (gweler y daflen arweiniad am ddiffiniad) unrhyw ran o’r tir y mae’r apêl yn ymwneud ag ef"
},
{
"value": "Certificate B - I certify that the appellant (or the agent) has given the requisite notice (see the guidance leaflet) to everyone else who, on the day 21 days before the date of this appeal, was the owner (see the guidance leaflet for a definition) of any part of the land to which the appeal relates, as listed below:",
"value_cy": "Tystysgrif B – Tystiaf fod y mae’r apelydd (neu’r asiant) wedi rhoi’r hysbysiad gofynnol (gweler y daflen arweiniad) i bawb arall a oedd, ar y diwrnod 21 diwrnod cyn dyddiad yr apêl hon, yn berchennog (gweler y daflen arweiniad am ddiffiniad) unrhyw ran o y tir y mae'r apźl yn ymwneud ag ef, fel y'i rhestrir isod:"
},
{
"value": "Certificates C & D - If you do not know who owns all or part of the appeal site, complete either Certificate C or Certificate D at Annexe 1 of our guidance and attach it to the appeal form",
"value_cy": "Tystysgrifau C a D - Os nad ydych yn gwybod pwy sy'n berchen ar safle'r apźl i gyd neu ran ohono, cwblhewch naill ai Tystysgrif C neu Dystysgrif D yn Atodiad 1 ein canllaw a'i hatodi i'r ffurflen apelio"
},
{
"value": "Agricultural holding",
"value_cy": "Daliadaeth amaethyddol"
},
{
"value": "We also need to know whether the appeal site forms part of an agricultural holding. Please select either (a), (b)(i) or (b)(ii)",
"value_cy": "Mae angen inni wybod hefyd a yw safle'r apźl yn rhan o ddaliad amaethyddol. Dewiswch naill ai (a), (b)(i) neu (b)(ii)"
},
{
"value": "(a) None of the land to which the appeal relates is, or is part of, an agricultural holding",
"value_cy": "(a) Nid oes unrhyw ran o’r tir y mae’r apêl yn ymwneud ag ef yn ddaliad amaethyddol, neu’n rhan o ddaliad amaethyddol"
},
{
"value": "(b) (i) The appeal site is, or is part of an agricultural holding, and the appellant is the sole agricultural tenant",
"value_cy": "(b) (i) Mae safle’r apêl yn ddaliad amaethyddol, neu’n rhan o ddaliad amaethyddol, a’r apelydd yw’r unig denant amaethyddol"
},
{
"value": "(b) (ii) The appeal site is, or is part of, an agricultural holding and the appellant (or the agent) has given the requisite notice to every person (other than the appellant) who, on the day 21 days before the date of the appeal, was a tenant of anagricultural holding on all or part of the land to which the appeal relates as listed below:",
"value_cy": "(b) (ii) Mae safle’r apêl yn ddaliad amaethyddol neu’n rhan o ddaliad amaethyddol ac mae’r apelydd (neu’r asiant) wedi rhoi’r hysbysiad gofynnol i bob person (ac eithrio’r apelydd) sydd, ar y diwrnod 21 diwrnod cyn y dyddiad o’r apêl, a oedd yn denant daliad amaethyddol ar y cyfan neu ran o’r tir y mae’r apêl yn ymwneud ag ef fel a restrir isod:"
},
{
"value": "Tenants name",
"value_cy": "Enw'r tenant"
},
{
"value": "Date started",
"value_cy": "Dyddiad dechrau"
},
{
"value": "Site Viewable from Road",
"value_cy": "Safle Gweladwy o Ffordd"
},
{
"value": "Does the inspector need to enter the site?",
"value_cy": "A oes angen i'r arolygydd fynd i mewn i'r safle?"
},
{
"value": "Please explain why the inspector needs to enter the site",
"value_cy": "Eglurwch pam fod angen i'r arolygydd fynd i mewn i'r safle"
},
{
"value": "Do not include personal or financial information.",
"value_cy": "Peidiwch â chynnwys gwybodaeth bersonol neu ariannol."
},
{
"value": "Are there any health and safety issues the Inspector needs to be aware of when visiting the site?",
"value_cy": "A oes unrhyw faterion iechyd a diogelwch y mae angen i'r Arolygydd fod yn ymwybodol ohonynt wrth ymweld â'r safle?"
},
{
"value": "Please set out the potential health and safety issues",
"value_cy": "Nodwch y materion iechyd a diogelwch posibl"
},
{
"value": "Do not include personal or financial information.",
"value_cy": "Peidiwch â chynnwys gwybodaeth bersonol neu ariannol."
},
{
"value": "Appeal site information",
"value_cy": "Gwybodaeth safle apêl"
},
{
"value": "What is overall the size of the appeal site, as shown on the red line boundary plan? (in hectares)",
"value_cy": "Beth yw maint safle'r apęl yn gyffredinol, fel y dangosir ar gynllun ffin y llinell goch? (mewn hectarau)"
},
{
"value": "What is the area of floor space proposed? (in square metres). If no new floor space is proposed, please enter 0.",
"value_cy": "Beth yw arwynebedd y llawr a gynigir? (mewn metrau sgwâr). Os na chynigir arwynebedd llawr newydd, nodwch 0."
},
{
"value": "Is flooding an issue?",
"value_cy": "Ydy llifogydd yn broblem?"
},
{
"value": "Do the works affect the setting of a Listed Building?",
"value_cy": "A yw'r gwaith yn effeithio ar leoliad Adeilad Rhestredig?"
},
{
"value": "Is the appeal site within an Area of Outstanding Natural Beauty?",
"value_cy": "A yw safle'r apźl o fewn Ardal o Harddwch Naturiol Eithriadol?"
},
{
"value": "Is the appeal site in a Conservation Area?",
"value_cy": "A yw safle'r apźl mewn Ardal Gadwraeth?"
},
{
"value": "Is the appeal site in or adjacent to, or likely to affect a Site of Special Scientific Interest (SSSI), a Special Conservation Area (SAC) or an Internationally Designated Site?",
"value_cy": "A yw safle'r apźl o fewn neu'n gyfagos i Safle o Ddiddordeb Gwyddonol Arbennig (SoDdGA), Ardal Cadwraeth Arbennig (ACA) neu Safle a Ddynodir yn Rhyngwladol, neu'n debygol o effeithio arno?"
},
{
"value": "Are any protected species likely to be affected by the proposals?",
"value_cy": "A yw unrhyw rywogaethau a warchodir yn debygol o gael eu heffeithio gan y cynigion?"
},
{
"value": "Appeal procedure",
"value_cy": "Trefn apelio"
},
{
"value": "Upload documents",
"value_cy": "Uwchlwytho dogfennau"
},
{
"value": "Are you appealing because of",
"value_cy": "Ydych chi'n apelio oherwydd"
},
{
"value": "Has there been any other appeals made on this, or on nearby land, against a refusal of planning permission?",
"value_cy": "A oes unrhyw apeliadau eraill wedi eu gwneud ar hyn, neu ar dir cyfagos, yn erbyn gwrthod caniatâd cynllunio?"
},
{
"value": "Please provide details of the appeals including our reference number, if known",
"value_cy": "Rhowch fanylion yr apeliadau gan gynnwys ein rhif cyfeirnod, os yw'n hysbys"
},
{
"value": "Do not include personal or financial information.",
"value_cy": "Peidiwch â chynnwys gwybodaeth bersonol neu ariannol."
},
{
"value": "Submission of case",
"value_cy": "Cyflwyno achos"
},
{
"value": "Introduction",
"value_cy": "Rhagymadrodd"
},
{
"value": "What procedure would you like the appeal to follow? More informatiion on this can be found in the guidance notes.",
"value_cy": "Pa weithdrefn yr hoffech i'r apêl ei dilyn? Ceir rhagor o wybodaeth am hyn yn y nodiadau canllaw."
},
{
"value": "Please explain why you have chosen this procedure",
"value_cy": "Eglurwch pam eich bod wedi dewis y driniaeth hon"
},
{
"value": "Do not include personal or financial information.",
"value_cy": "Peidiwch â chynnwys gwybodaeth bersonol neu ariannol."
},
{
"value": "Do you intend to submit a costs application with this appeal? (see guidance for further information)",
"value_cy": "A ydych yn bwriadu cyflwyno cais costau gyda'r apêl hon? (gweler y canllawiau am ragor o wybodaeth)"
},
{
"value": "Would you prefer a virtual or in person event?",
"value_cy": "A fyddai'n well gennych ddigwyddiad rhithwir neu ddigwyddiad personol?"
},
{
"value": "Virtual",
"value_cy": "Rhith"
},
{
"value": "In person",
"value_cy": "Yn bersonol"
},
{
"value": "Please explain why you have chosen this procedure",
"value_cy": "Eglurwch pam eich bod wedi dewis y driniaeth hon"
}
]
}
data/formsxml/planningappeals78.xml
+348 -951
View File
File diff suppressed because it is too large Load Diff
locales/cy/newappeal.json
+30 -1
View File
@@ -8,5 +8,34 @@
"select-appeal-type-label-error-msg": "Mae angen math o achos",
"select-default": "Dewiswch...",
"change-link-label": "Newid",
"submit-appeal-button": "Cyflwyno apêl"
"submit-appeal-button": "Cyflwyno apêl",
"about-you-page-title": "Amdanat ti",
"about-you-on-behalf-label": "Cyflwynwyd apêl ar ran:",
"about-you-who-are-you-label": "Ai chi yw'r apelydd neu asiant sy'n gweithredu ar ran yr apelydd?",
"about-you-appellant-contact-details": "Manylion cyswllt yr Apelydd",
"about-you-appellant-contact-details-firstname-label": "Enw cyntaf",
"about-you-appellant-contact-details-lastname-label": "Enw olaf",
"about-you-appellant-contact-details-email-label": "Cyfeiriad ebost",
"about-you-appellant-contact-details-phone-label": "Rhif ffôn",
"about-you-agent-contact-details": "Manylion cyswllt yr Asiant",
"about-you-agent-contact-details-companyname-label": "Enw cwmni",
"about-you-agent-contact-details-firstname-label": "Enw cyntaf",
"about-you-agent-contact-details-lastname-label": "Enw olaf",
"about-you-agent-contact-details-email-label": "Cyfeiriad ebost",
"about-you-agent-contact-details-phone-label": "Rhif ffôn",
"about-you-agent-contact-preferences-label": "Nodwch a fyddai'n well gennych i ni gysylltu â chi drwy e-bost neu'r post",
"new-appeal-progress-nav-label": "Cynnydd",
"new-appeal-documentlist-nav": "Angen dogfen",
"new-appeal-introduction-paragraph": "Intro text to explain process. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer ornare lobortis sollicitudin. Pellentesque ac libero auctor, efficitur urna faucibus, fringilla nisi. Fusce viverra pharetra tristique. In diam est, interdum sagittis tempus non, ultricies at ante. Nullam porta dolor sit amet.",
"new-appeal-ownership-hint": "Mae angen i ni wybod pwy sy'n berchen ar safle'r apźl. Os nad ydych yn berchen ar safle'r apźl neu os mai dim ond rhan ohono rydych yn berchen arno, mae angen i ni wybod enw(au) y perchennog(perchnogion) neu'r rhan-berchennog/perchnogion. Mae angen i ni hefyd fod yn siŵr bod y perchennog/perchnogion eraill yn gwybod eich bod wedi gwneud apêl. Cyfeiriwch at y nodiadau canllaw ar lenwi'r adran hon.",
"new-appeal-ownership-option-NA": "Amherthnasol",
"new-appeal-ownership-option-A": "Tystysgrif A - (Os mai chi yw unig berchennog safle cyfan yr apźl, mae tystysgrif A yn gymwys). Tystiaf, ar y diwrnod 21 diwrnod cyn dyddiad yr apêl hon, nad oedd neb ac eithrio’r apelydd, yn berchennog (gweler y daflen arweiniad am ddiffiniad) unrhyw ran o’r tir y mae’r apêl yn ymwneud ag ef",
"new-appeal-ownership-option-B": "Tystysgrif B – Tystiaf fod y mae’r apelydd (neu’r asiant) wedi rhoi’r hysbysiad gofynnol (gweler y daflen arweiniad) i bawb arall a oedd, ar y diwrnod 21 diwrnod cyn dyddiad yr apêl hon, yn berchennog (gweler y daflen arweiniad am ddiffiniad) unrhyw ran o y tir y mae'r apźl yn ymwneud ag ef, fel y'i rhestrir isod:",
"new-appeal-ownership-option-CD": "Tystysgrifau C a D - Os nad ydych yn gwybod pwy sy'n berchen ar safle'r apźl i gyd neu ran ohono, cwblhewch naill ai Tystysgrif C neu Dystysgrif D yn Atodiad 1 ein canllaw a'i hatodi i'r ffurflen apelio",
"new-appeal-agricultural-hint": "Mae angen inni wybod hefyd a yw safle'r apźl yn rhan o ddaliad amaethyddol. Dewiswch naill ai (a), (b)(i) neu (b)(ii)",
"new-appeal-agricultural-holding-option-yes": "(a) Nid oes unrhyw ran o’r tir y mae’r apêl yn ymwneud ag ef yn ddaliad amaethyddol, neu’n rhan o ddaliad amaethyddol",
"new-appeal-agricultural-holding-option-no": "(b) (i) Mae safle’r apêl yn ddaliad amaethyddol, neu’n rhan o ddaliad amaethyddol, a’r apelydd yw’r unig denant amaethyddol",
"new-appeal-agricultural-holding-option-NA": "(b) (ii) Mae safle’r apêl yn ddaliad amaethyddol neu’n rhan o ddaliad amaethyddol ac mae’r apelydd (neu’r asiant) wedi rhoi’r hysbysiad gofynnol i bob person (ac eithrio’r apelydd) sydd, ar y diwrnod 21 diwrnod cyn y dyddiad o’r apêl, a oedd yn denant daliad amaethyddol ar y cyfan neu ran o’r tir y mae’r apêl yn ymwneud ag ef fel a restrir isod:",
"new-appeal-procedure-option-virtual": "Rhith",
"new-appeal-procedure-option-inperson": "Yn bersonol"
}
locales/en/newappeal.json
+30 -1
View File
@@ -8,5 +8,34 @@
"select-appeal-type-label-error-msg": "Appeal type is required",
"select-default": "Select...",
"change-link-label": "Change",
"submit-appeal-button": "Submit appeal"
"submit-appeal-button": "Submit appeal",
"about-you-page-title": "About you",
"about-you-on-behalf-label": "Appeal submitted on behalf of:",
"about-you-who-are-you-label": "Are you the appellant or an agent acting on behalf of the appeallant?",
"about-you-appellant-contact-details": "Contact details for Appellant",
"about-you-appellant-contact-details-firstname-label": "First name",
"about-you-appellant-contact-details-lastname-label": "Last name",
"about-you-appellant-contact-details-email-label": "Email address",
"about-you-appellant-contact-details-phone-label": "Telphone number",
"about-you-agent-contact-details": "Contact details for Agent",
"about-you-agent-contact-details-companyname-label": "Company name",
"about-you-agent-contact-details-firstname-label": "First name",
"about-you-agent-contact-details-lastname-label": "Last name",
"about-you-agent-contact-details-email-label": "Email address",
"about-you-agent-contact-details-phone-label": "Telephone number",
"about-you-agent-contact-preferences-label": "Please indicate if you would prefer to be contacted by email or post",
"new-appeal-progress-nav-label": "Progress",
"new-appeal-documentlist-nav": "Documents needed",
"new-appeal-introduction-paragraph": "Intro text to explain process. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer ornare lobortis sollicitudin. Pellentesque ac libero auctor, efficitur urna faucibus, fringilla nisi. Fusce viverra pharetra tristique. In diam est, interdum sagittis tempus non, ultricies at ante. Nullam porta dolor sit amet.",
"new-appeal-ownership-hint": "We need to know who owns the appeal site. If you do not own the appeal site or if you own only part of it, we need to know the name(s) of the owner(s) or part owner(s). We also need to be sure that the other owner(s) know that you have made an appeal. Please refer to the guidance notes on completing this section.",
"new-appeal-ownership-option-NA": "Not applicable",
"new-appeal-ownership-option-A": "Certificate A - (If you are the sole owner of the whole appeal site, certificate A applies). I certify that, on the day 21 days before the date of this appeal, nobody except the appellant, was the owner (see the guidance leaflet for a definition) of any part of the land to which the appeal relates",
"new-appeal-ownership-option-B": "Certificate B - I certify that the appellant (or the agent) has given the requisite notice (see the guidance leaflet) to everyone else who, on the day 21 days before the date of this appeal, was the owner (see the guidance leaflet for a definition) of any part of the land to which the appeal relates, as listed below:",
"new-appeal-ownership-option-CD": "Certificates C & D - If you do not know who owns all or part of the appeal site, complete either Certificate C or Certificate D at Annexe 1 of our guidance and attach it to the appeal form",
"new-appeal-agricultural-hint": "We also need to know whether the appeal site forms part of an agricultural holding. Please select either (a), (b)(i) or (b)(ii)",
"new-appeal-agricultural-holding-option-yes": "(a) None of the land to which the appeal relates is, or is part of, an agricultural holding",
"new-appeal-agricultural-holding-option-no": "(b) (i) The appeal site is, or is part of an agricultural holding, and the appellant is the sole agricultural tenant",
"new-appeal-agricultural-holding-option-NA": "(b) (ii) The appeal site is, or is part of, an agricultural holding and the appellant (or the agent) has given the requisite notice to every person (other than the appellant) who, on the day 21 days before the date of the appeal, was a tenant of anagricultural holding on all or part of the land to which the appeal relates as listed below:",
"new-appeal-procedure-option-virtual": "Virtual",
"new-appeal-procedure-option-inperson": "In person"
}
pages/api/endpoint/getappealtypes_api.js
+2 -1
View File
@@ -34,8 +34,9 @@ export default async function ApiProxy(req, res) {
var token = await getToken();
var queryUrl =
"stringmaps?$filter=objecttypecode eq 'incident' and attributename eq 'pinswg_appealcasetype' and value ne 'LDP' and value ne 'Misc Casework'&$count=true&$select=value,stringmapid,organizationid,attributevalue&$orderby=value asc";
"stringmaps?$filter=objecttypecode eq 'incident' and attributename eq 'pinswg_appealcasetype' and value ne 'Developments of National Significance' and value ne 'LDP' and value ne 'Misc Casework'&$count=true&$select=value,stringmapid,organizationid,attributevalue&$orderby=value asc";
console.log(queryUrl);
return axios
.get(
WEBAPI_URL + queryUrl + hashAPIPath(queryUrl),
pages/api/endpoint/getmandatoryfields_api.js
+1
View File
@@ -29,6 +29,7 @@ export default async function ApiProxy(req, res) {
whichForm +
"')/Attributes?$count=true&$select=LogicalName,RequiredLevel";
console.log(WEBAPI_URL + queryUrl + hashAPIPath(queryUrl));
return axios
.get(
WEBAPI_URL + queryUrl + hashAPIPath(queryUrl),
pages/api/endpoint/updatecase_api.js
+3 -3
View File
@@ -50,8 +50,8 @@ export default async function ApiProxy(req, res) {
.then(({ data }) => {
res.status(200).json(data);
})
.catch(({ err }) => {
console.log(err);
res.status(400).json(err);
.catch((error) => {
console.log("is it", error);
res.status(400);
});
}
pages/newappeal/aboutyou.js
+137
View File
@@ -0,0 +1,137 @@
import useTranslation from "next-translate/useTranslation";
import Head from "next/head";
import { useRouter } from "next/router";
import { connect } from "react-redux";
import Breadcrumbs from "../../components/breadcrumbs";
import CookieBanner from "../../components/cookieBanner";
import Footer from "../../components/footer";
import Header from "../../components/header";
import Aboutyou from "../../components/newappeal/aboutyou";
import CreateCase from "../../components/newappeal/createCase";
import { wrapper } from "../../store/store";
const AboutYou = (props) => {
const { footerLinks, pages, formData } = props;
let { t, lang } = useTranslation();
const router = useRouter();
const { locale } = router;
const { appealtypes } = router.query;
const { appealType, LPAData } = props;
return (
<div>
<Head>
<title>
{t("newappeal:page-title")} - {t("common:service-name")}
</title>
<>
<link
rel="canonical"
href={t("common:gov-wales-link") + router.asPath}
/>
<meta
key="og:locale"
property="og:locale"
content={router.locale}
/>
{/* If they have a Twitter Handle, include the meta details below */}
<meta
key="og:site_name"
property="og:site_name"
content={t("common:service-name")}
/>
<meta
key="twitter:site"
property="twitter:site"
content="@UKGovWales"
/>
<meta
name="description"
content={t("common:service-description")}
/>
<meta
property="og:site_name"
content={t("common:gov-wales-label")}
/>
<meta
property="og:title"
content={t("newappeal:page-title")}
/>
<meta
property="og:description"
content={t("common:service-description")}
/>
<meta property="og:type" content="website" />
<meta
property="og:url"
content={t("common:gov-wales-link")}
/>
<meta
property="og:image"
content="https://gov.wales/themes/custom/govwales/images/content/og-global-1200.png"
/>
<meta name="twitter:card" content="summary" />
<meta
name="twitter:title"
content={t("common:gov-wales-label")}
/>
<meta
name="twitter:url"
content={t("common:gov-wales-link") + router.asPath}
/>
<meta
name="twitter:image"
content="https://gov.wales/themes/custom/govwales/images/content/og-global-120.png"
/>
</>
</Head>
<div id="page_wrapper">
<CookieBanner />
<Header courseName={t("common:service-name")} />
<div className="govuk-width-container">
<Breadcrumbs slug={appealtypes} />
<main
className="govuk-main-wrapper--auto-spacing"
id="main-content"
role="main"
>
<h1>{t("newappeal:about-you-page-title")}</h1>
<Aboutyou />
</main>
</div>
<Footer footerLinks={footerLinks} />
</div>
</div>
);
};
export const getServerSideProps = wrapper.getServerSideProps(
(store) => async (ctx) => {
const { req, res } = ctx;
const { cookies } = req;
console.log(cookies);
let loggedInUser = cookies.pinsUser;
}
);
const mapStateToProps = (state) => {
return {
search: state.search,
searchResultsObj: state.searchResultsObj,
formData: state.formData,
appealType: state.appealType,
LPAData: state.LPAData,
form: state.form,
accountDetails: state.accountDetails,
govGateway: state.govGateway,
};
};
export default connect(mapStateToProps)(AboutYou);
store/appealType/action.js
+9
View File
@@ -8,6 +8,7 @@ export const appealTypeDataActionTypes = {
SETAPPEALLPA: "SETAPPEALLPA",
SETCASEREFERENCE: "SETCASEREFERENCE",
SETFORMCOMPLETE: "SETFORMCOMPLETE",
SETDOCUMENTLIST: "SETDOCUMENTLIST",
};
export const getAppealTypeObj = () => (dispatch) => {
@@ -62,3 +63,11 @@ export const setFormComplete = (formComplete) => (dispatch) => {
formComplete: formComplete,
});
};
export const setDocumentsList = (documentList) => (dispatch) => {
console.log("here", documentList);
return dispatch({
type: appealTypeDataActionTypes.SETDOCUMENTLIST,
documentList: documentList,
});
};
store/appealType/reducer.js
+6
View File
@@ -8,6 +8,7 @@ const appealTypeDataInitialState = {
appealLPA: "",
caseReference: {},
formComplete: "false",
documentList: {},
};
export default function reducer(state = appealTypeDataInitialState, action) {
@@ -47,6 +48,11 @@ export default function reducer(state = appealTypeDataInitialState, action) {
...state,
formComplete: action.formComplete,
};
case appealTypeDataActionTypes.SETDOCUMENTLIST:
return {
...state,
documentList: action.documentList,
};
default:
return state;
}
store/formData/reducer.js
+2
View File
@@ -10,10 +10,12 @@ export default function reducer(state = formDataInitialState, action) {
switch (action.type) {
case formDataActionTypes.SETFORMDATA:
return {
...state,
formData: action.formData,
mandatoryFieldsData: action.mandatoryFieldsData,
pickListData: action.pickListData,
};
default:
return state;
}