added in capacity details to pdf
This commit is contained in:
@@ -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"
|
||||
>
|
||||
−
|
||||
</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"
|
||||
>
|
||||
−
|
||||
</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) {
|
||||
|
||||
Reference in New Issue
Block a user