reps questionnaire progress panel

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