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

reps questionnaire progress panel

Browse Source
This commit is contained in:
robbond
2023-10-24 08:37:22 +01:00
parent 798ba01ea6
commit c4fcb6fa56
8 changed files with 509 additions and 1271 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/case/representation/representationAgent.js
+138 -142
View File
@@ -41,29 +41,28 @@ const RepAgent = (props) => {
const required = (value) => (value ? undefined : "Required"); const required = (value) => (value ? undefined : "Required");
return ( return (
<div id="rep-appellant"> <>
<div className="govuk-grid-column-full"> <div className="govuk-grid-row">
<div className="govuk-grid-row"> <h2 className="govuk-heading-m ">
<h2 className="govuk-heading-m "> Representation from an Agent
Representation from an Agent </h2>
</h2>
<div className="govuk-form-group"> <div className="govuk-form-group">
<label <label
className="govuk-label govuk-body-m" className="govuk-label govuk-body-m"
htmlFor="representationType" htmlFor="representationType"
> >
What kind of representation are you making? What kind of representation are you making?
</label> </label>
<Field <Field
name="representationType" name="representationType"
component={RenderPickList} component={RenderPickList}
datafieldname="representationType" datafieldname="representationType"
optionsArr={appellantApplicantRepresentationArr} optionsArr={appellantApplicantRepresentationArr}
/> />
</div>
</div> </div>
{/* <div className="govuk-grid-row"> </div>
{/* <div className="govuk-grid-row">
<div className="govuk-form-group"> <div className="govuk-form-group">
<Field <Field
className="govuk-input govuk-!-width-three-quarters" className="govuk-input govuk-!-width-three-quarters"
@@ -77,121 +76,119 @@ const RepAgent = (props) => {
/> />
</div> </div>
</div> */} </div> */}
<div className="govuk-grid-row"> <div className="govuk-grid-row">
<div className="govuk-form-group"> <div className="govuk-form-group">
<Field <Field
name="representationOnBehalfOf" name="representationOnBehalfOf"
datafieldname="representationOnBehalfOf" datafieldname="representationOnBehalfOf"
// label="In what capacity do you wish to make representations on this case?" // label="In what capacity do you wish to make representations on this case?"
options={["Yes", "No"]} options={["Yes", "No"]}
id="representationOnBehalfOf" id="representationOnBehalfOf"
className="govuk-radios__input" className="govuk-radios__input"
errorMsg={t("newappeal:select-an-option-label")} errorMsg={t("newappeal:select-an-option-label")}
component={RenderCondtionalRadioList} component={RenderCondtionalRadioList}
validate={[required]} validate={[required]}
legend={ legend={
"Are you acting on behalf of a company, group or organisation?" "Are you acting on behalf of a company, group or organisation?"
} }
/> />
</div>
</div> </div>
</div>
<div className="govuk-grid-row"> <div className="govuk-grid-row">
<div className="govuk-form-group"> <div className="govuk-form-group">
<p className="govuk-body"> <p className="govuk-body">
You can enter your comments in the space provided or You can enter your comments in the space provided or
attach a separate document. attach a separate document.
</p> </p>
<fieldset <fieldset
className="govuk-fieldset" className="govuk-fieldset"
aria-describedby="commentBox-hint" aria-describedby="commentBox-hint"
> >
<div id="commentBox-hint" className="govuk-hint"> <div id="commentBox-hint" className="govuk-hint">
My comments are set out in: My comments are set out in:
</div> </div>
<div className="govuk-form-group"> <div className="govuk-form-group">
<Field <Field
name="representationComments" name="representationComments"
id="representationComments" id="representationComments"
component={RenderRichMultiline} component={RenderRichMultiline}
type="text" type="text"
rows="5" rows="5"
className="govuk-textarea govuk-input--width-30" className="govuk-textarea govuk-input--width-30"
aria-describedby={props.name + "-hint"} aria-describedby={props.name + "-hint"}
/> />
<p className="govuk-hint govuk-!-font-size-14 govuk-!-margin-top-5"> <p className="govuk-hint govuk-!-font-size-14 govuk-!-margin-top-5">
Please note that all representations may be Please note that all representations may be
published in line with our Publishing published in line with our Publishing Policy.
Policy. Should your representation include Should your representation include any sensitive
any sensitive information or potentially information or potentially defamatory
defamatory information, it may be redacted information, it may be redacted before
before publishing. If it contains racist, publishing. If it contains racist, libellous or
libellous or offensive content it will be offensive content it will be returned to you and
returned to you and you will be asked to you will be asked to provide an amended version.{" "}
provide an amended version.{" "} <a href="https://gov.wales/planning-and-environment-decisions-wales-publishing-policy-html">
<a href="https://gov.wales/planning-and-environment-decisions-wales-publishing-policy-html"> https://gov.wales/planning-and-environment-decisions-wales-publishing-policy-html
https://gov.wales/planning-and-environment-decisions-wales-publishing-policy-html </a>
</a> </p>
</p> </div>
</div> <div className="govuk-form-group govuk-!-margin-bottom-9">
<FileUploadField
name={"representationDocuments"}
label={"Add your files"}
ticketnumber={props.props.caseReference}
hint={"sdsd"}
fileList={[]}
setFilesForRepresentation={[]}
containerID={
props.props.props.accountDetails.containerID
}
/>
</div>
{props.currentView.caseReference.hasOwnProperty(
"repDetails"
) &&
props.currentView.caseReference.repDetails.filesList
.length > 0 ? (
<div className="govuk-form-group govuk-!-margin-bottom-9"> <div className="govuk-form-group govuk-!-margin-bottom-9">
<FileUploadField {props.currentView.caseReference.repDetails.filesList.map(
name={"representationDocuments"} (blob, i) => (
label={"Add your files"} <div
ticketnumber={props.props.caseReference} key={blob.name + "_" + i}
hint={"sdsd"} className="govuk-!-margin-bottom-5 fileThumb "
fileList={[]} >
setFilesForRepresentation={[]} <img
containerID={ src={getThumbnailIconByExtension(
props.props.props.accountDetails blob.name
.containerID )}
} alt={blob.name}
/> width="50"
</div> />
{props.currentView.caseReference.hasOwnProperty(
"repDetails"
) &&
props.currentView.caseReference.repDetails.filesList
.length > 0 ? (
<div className="govuk-form-group govuk-!-margin-bottom-9">
{props.currentView.caseReference.repDetails.filesList.map(
(blob, i) => (
<div
key={blob.name + "_" + i}
className="govuk-!-margin-bottom-5 fileThumb "
>
<img
src={getThumbnailIconByExtension(
blob.name
)}
alt={blob.name}
width="50"
/>
<span className="govuk-body govuk-!-font-size-14 govuk-!-padding-left-5"> <span className="govuk-body govuk-!-font-size-14 govuk-!-padding-left-5">
{blob.name} ( {blob.name} (
{bytesToSize(blob.size)}) {bytesToSize(blob.size)})
</span> </span>
</div> </div>
) )
)} )}
</div> </div>
) : ( ) : (
"" ""
)} )}
</fieldset> </fieldset>
</div>{" "} </div>{" "}
</div> </div>
<div className="govuk-grid-row"> <div className="govuk-grid-row">
<div className="govuk-button-group"> <div className="govuk-button-group">
<button <button
type="submit" type="submit"
className="govuk-button" className="govuk-button"
data-module="govuk-button" data-module="govuk-button"
> >
Continue Continue
</button> </button>
{/* <a {/* <a
onClick={() => { onClick={() => {
setRepresentationSubmit(true); setRepresentationSubmit(true);
}} }}
@@ -199,18 +196,17 @@ const RepAgent = (props) => {
> >
Continue ww Continue ww
</a> */} </a> */}
<a <a
onClick={() => { onClick={() => {
setRepresentationCapacity(); setRepresentationCapacity();
}} }}
className="govuk-link" className="govuk-link"
> >
Back Back
</a> </a>
</div>
</div> </div>
</div> </div>
</div> </>
); );
}; };
components/case/representation/representationAppellant.js
+115 -118
View File
@@ -44,34 +44,33 @@ const RepAppellant = (props) => {
// console.log(props); // console.log(props);
return ( return (
<div id="rep-appellant"> <>
<div className="govuk-grid-column-full"> <div className="govuk-grid-row">
<div className="govuk-grid-row"> <div className="govuk-form-group">
<div className="govuk-form-group"> <h2 className="govuk-heading-m ">
<h2 className="govuk-heading-m "> Representation from an Appellant
Representation for an Appellant </h2>
</h2> <label
<label className="govuk-label govuk-body-m"
className="govuk-label govuk-body-m" htmlFor="representationType"
htmlFor="representationType" >
> What kind of representation are you making?
What kind of representation are you making? </label>
</label>
{typeof props.representationType == "undefined" ? ( {typeof props.representationType == "undefined" ? (
<Field <Field
name="representationType" name="representationType"
component={RenderPickList} component={RenderPickList}
datafieldname="representationType" datafieldname="representationType"
optionsArr={appellantApplicantRepresentationArr} optionsArr={appellantApplicantRepresentationArr}
/> />
) : ( ) : (
<p>{props.representationType}</p> <p>{props.representationType}</p>
)} )}
</div>
</div> </div>
</div>
{/* <div className="govuk-grid-row"> {/* <div className="govuk-grid-row">
<div className="govuk-form-group"> <div className="govuk-form-group">
<Field <Field
className="govuk-input govuk-!-width-three-quarters" className="govuk-input govuk-!-width-three-quarters"
@@ -86,91 +85,90 @@ const RepAppellant = (props) => {
</div> </div>
</div> */} </div> */}
<div className="govuk-grid-row"> <div className="govuk-grid-row">
<div className="govuk-form-group"> <div className="govuk-form-group">
<p className="govuk-body"> <p className="govuk-body">
You can enter your comments in the space provided or You can enter your comments in the space provided or
attach a separate document. attach a separate document.
</p> </p>
<fieldset <fieldset
className="govuk-fieldset" className="govuk-fieldset"
aria-describedby="commentBox-hint" aria-describedby="commentBox-hint"
> >
<div id="commentBox-hint" className="govuk-hint"> <div id="commentBox-hint" className="govuk-hint">
My comments are set out in: My comments are set out in:
</div> </div>
<div className="govuk-form-group"> <div className="govuk-form-group">
<Field <Field
name="representationComments" name="representationComments"
id="representationComments" id="representationComments"
component={RenderRichMultiline} component={RenderRichMultiline}
type="text" type="text"
rows="5" rows="5"
className="govuk-textarea govuk-input--width-30" className="govuk-textarea govuk-input--width-30"
aria-describedby={props.name + "-hint"} aria-describedby={props.name + "-hint"}
/> />
{RepresentationGuidanceText( {RepresentationGuidanceText(
formObj.representationForm.values.appealType formObj.representationForm.values.appealType
)}
</div>
<div className="govuk-form-group govuk-!-margin-bottom-9">
<FileUploadField
name={"representationDocuments"}
label={"Add your files"}
ticketnumber={props.props.caseReference}
hint={"sdsd"}
fileList={[]}
setFilesForRepresentation={[]}
containerID={
props.props.props.accountDetails.containerID
}
/>
</div>
{props.currentView.caseReference.hasOwnProperty(
"repDetails"
) &&
props.currentView.caseReference.repDetails.filesList
.length > 0 ? (
<div className="govuk-form-group govuk-!-margin-bottom-9">
{props.currentView.caseReference.repDetails.filesList.map(
(blob, i) => (
<div
key={blob.name + "_" + i}
className="govuk-!-margin-bottom-5 fileThumb "
>
<img
src={getThumbnailIconByExtension(
blob.name
)}
alt={blob.name}
width="50"
/>
<span className="govuk-body govuk-!-font-size-14 govuk-!-padding-left-5">
{blob.name} (
{bytesToSize(blob.size)})
</span>
</div>
)
)} )}
</div> </div>
<div className="govuk-form-group govuk-!-margin-bottom-9"> ) : (
<FileUploadField ""
name={"representationDocuments"} )}
label={"Add your files"} </fieldset>
ticketnumber={props.props.caseReference} </div>{" "}
hint={"sdsd"} </div>
fileList={[]} <div className="govuk-grid-row">
setFilesForRepresentation={[]} <div className="govuk-button-group">
containerID={ <button
props.props.props.accountDetails type="submit"
.containerID className="govuk-button"
} data-module="govuk-button"
/> >
</div> Continue
{props.currentView.caseReference.hasOwnProperty( </button>
"repDetails" {/* <a
) &&
props.currentView.caseReference.repDetails.filesList
.length > 0 ? (
<div className="govuk-form-group govuk-!-margin-bottom-9">
{props.currentView.caseReference.repDetails.filesList.map(
(blob, i) => (
<div
key={blob.name + "_" + i}
className="govuk-!-margin-bottom-5 fileThumb "
>
<img
src={getThumbnailIconByExtension(
blob.name
)}
alt={blob.name}
width="50"
/>
<span className="govuk-body govuk-!-font-size-14 govuk-!-padding-left-5">
{blob.name} (
{bytesToSize(blob.size)})
</span>
</div>
)
)}
</div>
) : (
""
)}
</fieldset>
</div>{" "}
</div>
<div className="govuk-grid-row">
<div className="govuk-button-group">
<button
type="submit"
className="govuk-button"
data-module="govuk-button"
>
Continue
</button>
{/* <a
onClick={() => { onClick={() => {
setRepresentationSubmit(true); setRepresentationSubmit(true);
}} }}
@@ -178,18 +176,17 @@ const RepAppellant = (props) => {
> >
Continue ww Continue ww
</a> */} </a> */}
<a <a
onClick={() => { onClick={() => {
setRepresentationCapacity(); setRepresentationCapacity();
}} }}
className="govuk-link" className="govuk-link"
> >
Back Back
</a> </a>
</div>
</div> </div>
</div> </div>
</div> </>
); );
}; };
components/case/representation/representationCapacitySelection.js
+1 -1
View File
@@ -53,7 +53,7 @@ let RepCapacitySelection = (props) => {
props={props} props={props}
/>{" "} />{" "}
<div id="rep-details" className="vo_hiddens"> <div id="rep-details" className="vo_hiddens">
<div className="govuk-grid-column-full"> <div className="govuk-grid-column-three-quarters">
<div className="govuk-grid-row"> <div className="govuk-grid-row">
<h2 className="govuk-heading-m "> <h2 className="govuk-heading-m ">
Your details - {props.firstValue} Your details - {props.firstValue}
components/case/representation/representationInterestedPartyPerson.js
+98 -101
View File
@@ -32,103 +32,101 @@ const RepInterestedPartyPerson = (props) => {
</li> </li>
)); ));
return ( return (
<div id="rep-interested"> <>
<div className="govuk-grid-column-full"> <div className="govuk-grid-row">
<div className="govuk-grid-row"> <h2 className="govuk-heading-m ">
<h2 className="govuk-heading-m "> Representation from an Interested Party/Person
Representation from an Interested Party/Person </h2>
</h2>
<div className="govuk-form-group"> <div className="govuk-form-group">
<label <label
className="govuk-label govuk-body-m" className="govuk-label govuk-body-m"
htmlFor="representationType" htmlFor="representationType"
> >
What kind of representation are you making? What kind of representation are you making?
</label> </label>
<Field <Field
name="representationType" name="representationType"
component={RenderPickList} component={RenderPickList}
datafieldname="representationType" datafieldname="representationType"
validate={[required]} validate={[required]}
optionsArr={interestedPersonRepresentationArr} optionsArr={interestedPersonRepresentationArr}
errorMsg={t("newappeal:select-an-option-label")} errorMsg={t("newappeal:select-an-option-label")}
/> />
</div>
</div> </div>
</div>
<div className="govuk-grid-row"> <div className="govuk-grid-row">
<div className="govuk-form-group"> <div className="govuk-form-group">
<Field <Field
name="representationOnBehalfOf" name="representationOnBehalfOf"
datafieldname="representationOnBehalfOf" datafieldname="representationOnBehalfOf"
// label="In what capacity do you wish to make representations on this case?" // label="In what capacity do you wish to make representations on this case?"
options={["Yes", "No"]} options={["Yes", "No"]}
id="representationOnBehalfOf" id="representationOnBehalfOf"
className="govuk-radios__input" className="govuk-radios__input"
errorMsg={t("newappeal:select-an-option-label")} errorMsg={t("newappeal:select-an-option-label")}
component={RenderCondtionalRadioList} component={RenderCondtionalRadioList}
validate={[required]} validate={[required]}
legend={ legend={
"Are you acting on behalf of a company, group or organisation?" "Are you acting on behalf of a company, group or organisation?"
} }
/> />
</div>
</div> </div>
</div>
<div className="govuk-grid-row"> <div className="govuk-grid-row">
<div className="govuk-form-group"> <div className="govuk-form-group">
<p className="govuk-body"> <p className="govuk-body">
You can enter your comments in the space provided or You can enter your comments in the space provided or
attach a separate document. attach a separate document.
</p> </p>
<fieldset <fieldset
className="govuk-fieldset" className="govuk-fieldset"
aria-describedby="commentBox-hint" aria-describedby="commentBox-hint"
> >
<div id="commentBox-hint" className="govuk-hint"> <div id="commentBox-hint" className="govuk-hint">
My comments are set out in: My comments are set out in:
</div> </div>
<div className="govuk-form-group"> <div className="govuk-form-group">
<Field <Field
name="representationComments" name="representationComments"
id="representationComments" id="representationComments"
component={RenderRichMultiline} component={RenderRichMultiline}
type="text" type="text"
rows="5" rows="5"
className="govuk-textarea govuk-input--width-30" className="govuk-textarea govuk-input--width-30"
aria-describedby={props.name + "-hint"} aria-describedby={props.name + "-hint"}
/> />
</div> </div>
<div className="govuk-form-group govuk-!-margin-bottom-9"> <div className="govuk-form-group govuk-!-margin-bottom-9">
<FileUploadField <FileUploadField
name={"representationDocuments"} name={"representationDocuments"}
label={"Add your files"} label={"Add your files"}
ticketnumber={props.props.caseReference} ticketnumber={props.props.caseReference}
hint={"sdsd"} hint={"sdsd"}
fileList={[]} fileList={[]}
setFilesForRepresentation={[]} setFilesForRepresentation={[]}
containerID={ containerID={
props.props.props.accountDetails props.props.props.accountDetails.containerID
.containerID }
} />
/> </div>
</div> </fieldset>
</fieldset> </div>{" "}
</div>{" "} </div>
</div>
<div className="govuk-grid-row"> <div className="govuk-grid-row">
<div className="govuk-button-group"> <div className="govuk-button-group">
<button <button
type="submit" type="submit"
className="govuk-button" className="govuk-button"
data-module="govuk-button" data-module="govuk-button"
> >
{t("common:continue-button")} {t("common:continue-button")}
</button> </button>
{/* <Link href="/representation"> {/* <Link href="/representation">
<a <a
onClick={() => { onClick={() => {
setRepresentationSubmit(true); setRepresentationSubmit(true);
@@ -138,19 +136,18 @@ const RepInterestedPartyPerson = (props) => {
Continue Continue
</a> </a>
</Link> */} </Link> */}
<a <a
onClick={() => { onClick={() => {
setRepresentationCapacity(); setRepresentationCapacity();
//setRepresentationSubmit(true); //setRepresentationSubmit(true);
}} }}
className="govuk-link" className="govuk-link"
> >
{t("case:summary-back-button-label")} {t("case:summary-back-button-label")}
</a> </a>
</div>
</div> </div>
</div> </div>
</div> </>
); );
}; };
components/case/representation/representationLPA.js
+151 -902
View File
File diff suppressed because it is too large Load Diff
components/case/representation/representationLPACapacitySelection.js
+1 -1
View File
@@ -53,7 +53,7 @@ let RepLPACapacitySelection = (props) => {
props={props.props} props={props.props}
/>{" "} />{" "}
<div id="rep-details" className="vo_hiddens"> <div id="rep-details" className="vo_hiddens">
<div className="govuk-grid-column-full"> <div className="govuk-grid-column-three-quarters">
<div className="govuk-grid-row"> <div className="govuk-grid-row">
{/* <h2 className="govuk-heading-m "> {/* <h2 className="govuk-heading-m ">
Your details - {props.firstValue} Your details - {props.firstValue}
components/case/representation/representationQuestionnaires/representationLPAQuestionnaire_s78.js
+2
View File
@@ -78,6 +78,8 @@ let S78_Questionnaire = (props) => {
); );
resultsObj = resultsObj[0]; resultsObj = resultsObj[0];
console.log(resultsObj);
return ( return (
<> <>
{props.representationTypeValue} {props.representationTypeValue}
components/case/summary.js
+3 -6
View File
@@ -415,10 +415,9 @@ const CaseSummary = (props) => {
<div className="govuk-grid-column-full"> <div className="govuk-grid-column-full">
<div className="govuk-button-group"> <div className="govuk-button-group">
{_.has(detailsObj, "pinswg_startdate") && {_.has(detailsObj, "pinswg_startdate") &&
hasEndDate &&
showReps( showReps(
detailsObj.pinswg_startdate, detailsObj.pinswg_startdate,
detailsObj.pinswg_representation_period_end_date detailsObj.pinswg_finalcommentsduedate
) && ( ) && (
<> <>
<Link <Link
@@ -553,10 +552,9 @@ const CaseSummary = (props) => {
<div className="govuk-grid-row"> <div className="govuk-grid-row">
<div className="govuk-grid-column-full"> <div className="govuk-grid-column-full">
{_.has(detailsObj, "pinswg_startdate") && {_.has(detailsObj, "pinswg_startdate") &&
hasEndDate &&
showRepsEnded( showRepsEnded(
detailsObj.pinswg_startdate, detailsObj.pinswg_startdate,
detailsObj.pinswg_representation_period_end_date detailsObj.pinswg_finalcommentsduedate
) && ( ) && (
<div className="govuk-body"> <div className="govuk-body">
{t( {t(
@@ -564,7 +562,7 @@ const CaseSummary = (props) => {
)} )}
{formatDates( {formatDates(
detailsObj.pinswg_representation_period_end_date detailsObj.pinswg_finalcommentsduedate
)} )}
</div> </div>
)} )}
@@ -1030,7 +1028,6 @@ const CaseSummary = (props) => {
date = new Date(date.toDateString()); date = new Date(date.toDateString());
const start = new Date(startDate); const start = new Date(startDate);
const end = new Date(endDate); const end = new Date(endDate);
return date > start && date > end ? true : false; return date > start && date > end ? true : false;
} }