added in capacity details to pdf

This commit is contained in:
2023-11-29 10:21:29 +00:00
parent b0e740ba8c
commit 33df7e25d7
8 changed files with 1065 additions and 883 deletions
+7
View File
@@ -204,6 +204,7 @@ let MakeRepresentation = (props) => {
caseReference={caseReference}
/>;
break;
case "appellant":
case t(
"myrepresentations:capacity-options-arr-appellant"
).toLocaleLowerCase():
@@ -248,6 +249,7 @@ let MakeRepresentation = (props) => {
/>
);
break;
case "agent":
case t(
"myrepresentations:capacity-options-arr-agent"
).toLowerCase():
@@ -519,6 +521,11 @@ let MakeRepresentation = (props) => {
"incidentID": props.props.currentView.caseReference.incidentid,
"caseRef":
props.props.currentView.caseReference.currentReference,
"pinswg_questionnaireduedate":
detailsObj.pinswg_questionnaireduedate,
"pinswg_statementduedate": detailsObj.pinswg_statementduedate,
"pinswg_finalcommentsduedate":
detailsObj.pinswg_finalcommentsduedate,
"pinswg_name":
props.props.currentView.caseReference.currentReference,
"firstname":
@@ -13,6 +13,7 @@ import {
RenderPickList,
RenderTextfield,
RenderRadioList,
RenderRadioListWithText,
RenderMultiline,
} from "./representationElements";
import { useDropzone } from "react-dropzone";
@@ -52,8 +53,8 @@ let RepCapacitySelection = (props) => {
myRepresentations={props.props.myRepresentations}
props={props}
/>{" "}
<div id="rep-details" className="vo_hiddens">
<div className="govuk-grid-column-three-quarters">
<div id="rep-details" className="">
<div className="govuk-grid-column-full">
<div className="govuk-grid-row">
<h2 className="govuk-heading-m ">
{t(
@@ -71,7 +72,7 @@ let RepCapacitySelection = (props) => {
id="representationCapacity"
className="govuk-radios__input"
errorMsg={t("newappeal:select-an-option-label")}
component={RenderRadioList}
component={RenderRadioListWithText}
validate={[required]}
/>
</div>
@@ -110,6 +110,127 @@ export const RenderRadioList = ({
);
};
export const RenderRadioListWithText = ({
datafieldname,
name,
label,
id,
errorMsg,
options,
input: { onChange, value },
meta: { touched, error },
...custom
}) => {
const required = (value) => (value ? undefined : "Required");
return (
<>
<div
className={
touched && error
? "govuk-form-group govuk-form-group--error"
: "govuk-form-group "
}
>
<fieldset
className="govuk-fieldset"
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={
custom.inline == true
? "govuk-radios govuk-radios--inline govuk-radios--small "
: "govuk-radios govuk-radios--small govuk-grid-column-full"
}
>
{Object.keys(options).map((key, index) => (
<div
className="govuk-radios__item govuk-grid-column-full"
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>
{value === options[key] && (
<div
className="govuk-radios__conditional "
id={"conditional_" + id + "_" + index}
>
<div className="govuk-form-group">
<label
className="govuk-label"
htmlFor={
"conditional_" +
id +
"_Comments"
}
>
Please give further details for
your this selection
</label>
<Field
name={
"conditional_" +
id +
"_Comments"
}
id={
"conditional_" +
id +
"_Comments"
}
component={RenderRichMultiline}
type="text"
rows="5"
className="govuk-textarea govuk-input--width-30"
aria-describedby={
id + "_" + index + "-hint"
}
/>
</div>
</div>
)}
</div>
))}
</div>
</fieldset>
</div>
</>
);
};
export const RenderCondtionalRadioList = ({
datafieldname,
legend,
@@ -871,116 +992,118 @@ export const RenderFileUpload = (field) => {
});
};
return <>
<Dropzone
accept="application/pdf,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document,image/tiff,image/jpeg,application/zip"
onDrop={(filesToUpload, e) => {
const renamedAcceptedFiles = filesToUpload.map(
(file) =>
new File([file], `${file.name}`, {
type: file.type,
})
);
field.input.onChange(renamedAcceptedFiles);
}}
>
{({ getRootProps, getInputProps }) => (
<>
{/* {field.hint != false && (
return (
<>
<Dropzone
accept="application/pdf,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document,image/tiff,image/jpeg,application/zip"
onDrop={(filesToUpload, e) => {
const renamedAcceptedFiles = filesToUpload.map(
(file) =>
new File([file], `${file.name}`, {
type: file.type,
})
);
field.input.onChange(renamedAcceptedFiles);
}}
>
{({ getRootProps, getInputProps }) => (
<>
{/* {field.hint != false && (
<div className="govuk-hint">ss{t(field.hint)}</div>
)}
<div className="govuk-form-group"></div> */}
<section className="container">
<div {...getRootProps({ style })}>
{" "}
<input id={field.id} {...getInputProps()} />
<div>
{t(
"newappeal:new-appeal-fileupload-drop-label"
)}
<section className="container">
<div {...getRootProps({ style })}>
{" "}
<input id={field.id} {...getInputProps()} />
<div>
{t(
"newappeal:new-appeal-fileupload-drop-label"
)}
</div>
<em>
(
{t(
"newappeal:new-appeal-fileupload-file-list-label"
)}
)
</em>
</div>
<em>
(
{t(
"newappeal:new-appeal-fileupload-file-list-label"
)}
)
</em>
</div>
<aside>{thumbs}</aside>
</section>
</>
<aside>{thumbs}</aside>
</section>
</>
)}
</Dropzone>
{field.meta.touched && field.meta.error && (
<span className="error">{field.meta.error}</span>
)}
</Dropzone>
{field.meta.touched && field.meta.error && (
<span className="error">{field.meta.error}</span>
)}
{files && Array.isArray(files) && (
<ul>
{files.map((file, i) => (
<div
key={file.name}
className="govuk-!-margin-bottom-5 fileThumb"
>
<img
src={getThumbnailIcon(file, file.type)}
alt={file.name}
width="50"
/>
<span className="govuk-body govuk-!-font-size-14 govuk-!-padding-left-5">
{file.name} ({bytesToSize(file.size)})
{files && Array.isArray(files) && (
<ul>
{files.map((file, i) => (
<div
key={file.name}
className="govuk-!-margin-bottom-5 fileThumb"
>
<img
src={getThumbnailIcon(file, file.type)}
alt={file.name}
width="50"
/>
<span className="govuk-body govuk-!-font-size-14 govuk-!-padding-left-5">
{file.name} ({bytesToSize(file.size)})
</span>
</div>
))}
</ul>
)}
{blobList.map((blob, i) => (
<div
key={blob.name + "_" + i}
className="govuk-!-margin-bottom-5 fileThumb govuk-!-margin-top-5"
>
<div className="">
<span
className="govuk-summary-list__actionLink watched_link govuk-!-margin-right-5 govuk-!-text-align-left"
onClick={() => {
deleteThisBlob(
field.containerID,
blob.name,
blob.hasheddeletepath,
blob.hashgetblobs,
field.ticketnumber
);
}}
title="Remove this file"
>
&minus;
</span>
</div>
))}
</ul>
)}
{blobList.map((blob, i) => (
<div
key={blob.name + "_" + i}
className="govuk-!-margin-bottom-5 fileThumb govuk-!-margin-top-5"
>
<div className="">
<span
className="govuk-summary-list__actionLink watched_link govuk-!-margin-right-5 govuk-!-text-align-left"
onClick={() => {
deleteThisBlob(
field.containerID,
blob.name,
blob.hasheddeletepath,
blob.hashgetblobs,
field.ticketnumber
);
}}
title="Remove this file"
<img
src={getThumbnailIconByExtension(blob.name)}
alt={blob.name}
width="50"
/>
<Link
key={i}
scroll={false}
href={
"/api/file/downloadblob?container=" +
field.containerID +
"&casefolderID=" +
field.ticketnumber +
"&blobname=" +
blob.name +
blob.hashedfilepath
}
className="govuk-body govuk-!-font-size-14 govuk-!-padding-left-5 govuk-link"
>
&minus;
</span>
{blob.name}({bytesToSize(blob.contentLength)})
</Link>
</div>
<img
src={getThumbnailIconByExtension(blob.name)}
alt={blob.name}
width="50"
/>
<Link
key={i}
scroll={false}
href={
"/api/file/downloadblob?container=" +
field.containerID +
"&casefolderID=" +
field.ticketnumber +
"&blobname=" +
blob.name +
blob.hashedfilepath
}
className="govuk-body govuk-!-font-size-14 govuk-!-padding-left-5 govuk-link">
{blob.name}({bytesToSize(blob.contentLength)})
</Link>
</div>
))}{" "}
</>;
))}{" "}
</>
);
};
export function FileUploadField(props) {