16937 welsh contact us form

This commit is contained in:
2025-06-03 19:03:53 +01:00
parent 954e58ee3f
commit cdf48a81a7
5 changed files with 139 additions and 67 deletions
+49 -32
View File
@@ -65,21 +65,36 @@ const RenderPickList = ({
<option value="" disabled defaultValue>
{t("newappeal:select-default")}
</option>
<option value="plq">Planning legislation query</option>
<option value="ipq">Infrastructure procedure query</option>
<option value="plq">
{t("common:contact-us-select-plq")}
</option>
<option value="ipq">
{t("common:contact-us-select-ipq")}
</option>
<option value="pcpq">
Planning casework procedure query
{t("common:contact-us-select-pcpq")}
</option>
<option value="pi">
{t("common:contact-us-select-pi")}
</option>
<option value="appadvice">
{t("common:contact-us-select-appadvice")}
</option>
<option value="pi">Portal Issues</option>
<option value="appadvice">Appeal submission advice</option>
<option value="repadvice">
Representation submission advice
{t("common:contact-us-select-repadvice")}
</option>
<option value="ceq">
{t("common:contact-us-select-ceq")}
</option>
<option value="other">
{t("common:contact-us-select-other")}
</option>
<option value="postdec">
{t("common:contact-us-select-postdec")}
</option>
<option value="comp">
{t("common:contact-us-select-comp")}
</option>
<option value="ceq">Casework Events Query</option>
<option value="other">Any Other Enquiries</option>
<option value="postdec">Post Decision</option>
<option value="comp">Complaints/Complements</option>
</select>
</div>
</>
@@ -376,35 +391,27 @@ let ContactUs = (props) => {
<div className="govuk-grid-row">
<div className="govuk-grid-column-full">
<h2 className="govuk-heading-l govuk-!-margin-bottom-7">
Contact us{" "}
{t("common:contact-us-title")}
</h2>
<div className="wgForm">
{formSubmitted ? (
<div className="govuk-panel govuk-panel--confirmation">
<h1 className="govuk-panel__title">
Thank you for your enquiry
{t(
"common:contact-us-thank-you-title"
)}
</h1>
<div className="govuk-panel__body">
Well get back to you as soon as
we can.
{t(
"common:contact-us-thank-you-sub"
)}
</div>
</div>
) : (
<>
<p className="govuk-body">
Lorem ipsum dolor sit amet,
consectetur adipiscing elit.
Nulla congue leo ac quam
pulvinar, id vulputate libero
volutpat. Maecenas ut odio id
nisl laoreet dictum. Nam
faucibus, leo vitae egestas
lacinia, enim tortor bibendum
lorem, ut tincidunt lacus sapien
quis lorem. Aenean interdum
dolor augue, ac cursus lectus
suscipit vitae.{" "}
{t("common:contact-us-para")}
</p>
<form
onSubmit={props.handleSubmit(
@@ -414,7 +421,9 @@ let ContactUs = (props) => {
<Field
name={"contactEmail"}
id={"contactEmail"}
label="Your email address"
label={t(
"common:contact-us-email-label"
)}
component={RenderTextfield}
validate={[required, email]}
className="govuk-input govuk-input--width-20"
@@ -424,7 +433,9 @@ let ContactUs = (props) => {
name="typeOfContact"
id="typeOfContact"
component={RenderPickList}
label="What do you want to contact us about?"
label={t(
"common:contact-us-contact-type-label"
)}
validate={[required]}
/>
<div className="govuk-form-group">
@@ -440,7 +451,9 @@ let ContactUs = (props) => {
name="contactbody"
id="contactbody"
component={RenderMultiline}
label="What do you want to ask?"
label={t(
"common:contact-us-contact-body-label"
)}
rows={10}
cols={80}
validate={[required]}
@@ -449,14 +462,18 @@ let ContactUs = (props) => {
type="submit"
className="govuk-button"
>
Send your question
{t(
"common:contact-us-send-button"
)}
</button>
<button
type="button"
className="govuk-button govuk-button--secondary govuk-!-margin-left-5"
onClick={props.reset}
>
Clear form
{t(
"common:contact-us-clear-form-button"
)}
</button>
</form>
</>
+48 -31
View File
@@ -65,21 +65,36 @@ const RenderPickList = ({
<option value="" disabled defaultValue>
{t("newappeal:select-default")}
</option>
<option value="plq">Planning legislation query</option>
<option value="ipq">Infrastructure procedure query</option>
<option value="plq">
{t("common:contact-us-select-plq")}
</option>
<option value="ipq">
{t("common:contact-us-select-ipq")}
</option>
<option value="pcpq">
Planning casework procedure query
{t("common:contact-us-select-pcpq")}
</option>
<option value="pi">
{t("common:contact-us-select-pi")}
</option>
<option value="appadvice">
{t("common:contact-us-select-appadvice")}
</option>
<option value="pi">Portal Issues</option>
<option value="appadvice">Appeal submission advice</option>
<option value="repadvice">
Representation submission advice
{t("common:contact-us-select-repadvice")}
</option>
<option value="ceq">
{t("common:contact-us-select-ceq")}
</option>
<option value="other">
{t("common:contact-us-select-other")}
</option>
<option value="postdec">
{t("common:contact-us-select-postdec")}
</option>
<option value="comp">
{t("common:contact-us-select-comp")}
</option>
<option value="ceq">Casework Events Query</option>
<option value="other">Any Other Enquiries</option>
<option value="postdec">Post Decision</option>
<option value="comp">Complaints/Complements</option>
</select>
</div>
</>
@@ -383,28 +398,20 @@ let ContactUs = (props) => {
{formSubmitted ? (
<div className="govuk-panel govuk-panel--confirmation">
<h1 className="govuk-panel__title">
Thank you for your enquiry
{t(
"common:contact-us-thank-you-title"
)}
</h1>
<div className="govuk-panel__body">
Well get back to you as soon as
we can.
{t(
"common:contact-us-thank-you-sub"
)}
</div>
</div>
) : (
<>
<p className="govuk-body">
Lorem ipsum dolor sit amet,
consectetur adipiscing elit.
Nulla congue leo ac quam
pulvinar, id vulputate libero
volutpat. Maecenas ut odio id
nisl laoreet dictum. Nam
faucibus, leo vitae egestas
lacinia, enim tortor bibendum
lorem, ut tincidunt lacus sapien
quis lorem. Aenean interdum
dolor augue, ac cursus lectus
suscipit vitae.{" "}
{t("common:contact-us-para")}
</p>
<form
onSubmit={props.handleSubmit(
@@ -414,7 +421,9 @@ let ContactUs = (props) => {
<Field
name={"contactEmail"}
id={"contactEmail"}
label="Your email address"
label={t(
"common:contact-us-email-label"
)}
component={RenderTextfield}
validate={[required, email]}
className="govuk-input govuk-input--width-20"
@@ -424,7 +433,9 @@ let ContactUs = (props) => {
name="typeOfContact"
id="typeOfContact"
component={RenderPickList}
label="What do you want to contact us about?"
label={t(
"common:contact-us-contact-type-label"
)}
validate={[required]}
/>
<div className="govuk-form-group">
@@ -440,7 +451,9 @@ let ContactUs = (props) => {
name="contactbody"
id="contactbody"
component={RenderMultiline}
label="What do you want to ask?"
label={t(
"common:contact-us-contact-body-label"
)}
rows={10}
cols={80}
validate={[required]}
@@ -449,14 +462,18 @@ let ContactUs = (props) => {
type="submit"
className="govuk-button"
>
Send your question
{t(
"common:contact-us-send-button"
)}
</button>
<button
type="button"
className="govuk-button govuk-button--secondary govuk-!-margin-left-5"
onClick={props.reset}
>
Clear form
{t(
"common:contact-us-clear-form-button"
)}
</button>
</form>
</>