374 lines
15 KiB
JavaScript
374 lines
15 KiB
JavaScript
import useTranslation from "next-translate/useTranslation";
|
|
import Link from "next/link";
|
|
import { useRouter } from "next/router";
|
|
import React from "react";
|
|
import { connect } from "react-redux";
|
|
|
|
const BuildCheckPersonalDetails = (props) => {
|
|
const {
|
|
footerLinks,
|
|
pages,
|
|
handleSubmit,
|
|
value,
|
|
setPersonalDetailsComplete,
|
|
setAccountUpdatedComplete
|
|
} = props;
|
|
let { t, lang } = useTranslation();
|
|
|
|
const router = useRouter();
|
|
const { locale } = router;
|
|
|
|
const getPreferredLanguageLabel = (id) => {
|
|
return id == 846040001
|
|
? t("account:account-preferred-language-english")
|
|
: t("account:account-preferred-language-welsh");
|
|
};
|
|
|
|
return (
|
|
<>
|
|
<h2 className="govuk-heading-m">
|
|
{t("account:account-about-you-label")}
|
|
</h2>
|
|
<dl className="govuk-summary-list govuk-!-margin-bottom-9">
|
|
<div className="govuk-summary-list__row">
|
|
<dt className="govuk-summary-list__key">
|
|
{t("account:account-first-name-label")}
|
|
</dt>
|
|
<dd className="govuk-summary-list__value">
|
|
{
|
|
props.props.props.form.personalDetailsForm.values
|
|
.firstname
|
|
}
|
|
</dd>
|
|
<dd className="govuk-summary-list__actions">
|
|
<a
|
|
className="govuk-link"
|
|
href="#firstname"
|
|
onClick={() => {
|
|
setPersonalDetailsComplete(false);
|
|
}}
|
|
>
|
|
{t("common:change-link-label")}
|
|
<span className="govuk-visually-hidden">
|
|
{t("account:account-first-name-label")}{" "}
|
|
</span>
|
|
</a>
|
|
</dd>
|
|
</div>
|
|
<div className="govuk-summary-list__row">
|
|
<dt className="govuk-summary-list__key">
|
|
{" "}
|
|
{t("account:account-last-name-label")}
|
|
</dt>
|
|
<dd className="govuk-summary-list__value">
|
|
{
|
|
props.props.props.form.personalDetailsForm.values
|
|
.lastname
|
|
}
|
|
</dd>
|
|
<dd className="govuk-summary-list__actions">
|
|
<a
|
|
className="govuk-link"
|
|
href="#lastname"
|
|
onClick={() => {
|
|
setPersonalDetailsComplete(false);
|
|
}}
|
|
>
|
|
{t("common:change-link-label")}
|
|
<span className="govuk-visually-hidden">
|
|
{" "}
|
|
{t("account:account-last-name-label")}
|
|
</span>
|
|
</a>
|
|
</dd>
|
|
</div>
|
|
<div className="govuk-summary-list__row">
|
|
<dt className="govuk-summary-list__key">
|
|
{" "}
|
|
{t("account:account-email-address-label")}
|
|
</dt>
|
|
<dd className="govuk-summary-list__value">
|
|
{
|
|
props.props.props.form.personalDetailsForm.values
|
|
.emailaddress1
|
|
}
|
|
</dd>
|
|
<dd className="govuk-summary-list__actions">
|
|
<a
|
|
className="govuk-link"
|
|
href="#emailaddress1"
|
|
onClick={() => {
|
|
setPersonalDetailsComplete(false);
|
|
}}
|
|
>
|
|
{t("common:change-link-label")}
|
|
<span className="govuk-visually-hidden">
|
|
{" "}
|
|
{t("account:account-email-address-label")}
|
|
</span>
|
|
</a>
|
|
</dd>
|
|
</div>
|
|
<div className="govuk-summary-list__row">
|
|
<dt className="govuk-summary-list__key">
|
|
{t("account:account-telephone-label")}
|
|
</dt>
|
|
<dd className="govuk-summary-list__value">
|
|
{
|
|
props.props.props.form.personalDetailsForm.values
|
|
.telephone1
|
|
}
|
|
</dd>
|
|
<dd className="govuk-summary-list__actions">
|
|
<a
|
|
className="govuk-link"
|
|
href="#telephone1"
|
|
onClick={() => {
|
|
setPersonalDetailsComplete(false);
|
|
}}
|
|
>
|
|
{t("common:change-link-label")}
|
|
<span className="govuk-visually-hidden">
|
|
{t("account:account-telephone-label")}
|
|
</span>
|
|
</a>
|
|
</dd>
|
|
</div>
|
|
<div className="govuk-summary-list__row">
|
|
<dt className="govuk-summary-list__key">
|
|
{" "}
|
|
{t("account:account-company-group-label")}
|
|
</dt>
|
|
<dd className="govuk-summary-list__value">
|
|
{
|
|
props.props.props.form.personalDetailsForm.values
|
|
.pinswg_companyname
|
|
}
|
|
</dd>
|
|
<dd className="govuk-summary-list__actions">
|
|
<a
|
|
className="govuk-link"
|
|
href="#company"
|
|
onClick={() => {
|
|
setPersonalDetailsComplete(false);
|
|
}}
|
|
>
|
|
{t("common:change-link-label")}
|
|
<span className="govuk-visually-hidden">
|
|
{" "}
|
|
{t("account:account-company-group-label")}
|
|
</span>
|
|
</a>
|
|
</dd>
|
|
</div>
|
|
<div className="govuk-summary-list__row">
|
|
<dt className="govuk-summary-list__key">
|
|
{t("account:account-preferred-language-label")}
|
|
</dt>
|
|
<dd className="govuk-summary-list__value">
|
|
{getPreferredLanguageLabel(
|
|
props.props.props.form.personalDetailsForm.values
|
|
.pinswg_preferredlanguage
|
|
)}
|
|
</dd>
|
|
<dd className="govuk-summary-list__actions">
|
|
<a
|
|
className="govuk-link"
|
|
href="#company"
|
|
onClick={() => {
|
|
setPersonalDetailsComplete(false);
|
|
}}
|
|
>
|
|
{t("common:change-link-label")}
|
|
<span className="govuk-visually-hidden">
|
|
{" "}
|
|
{t("account:account-preferred-language-label")}
|
|
</span>
|
|
</a>
|
|
</dd>
|
|
</div>
|
|
</dl>
|
|
<h2 className="govuk-heading-m">
|
|
{" "}
|
|
{t("account:account-your-address-label")}
|
|
</h2>
|
|
<dl className="govuk-summary-list govuk-!-margin-bottom-9">
|
|
<div className="govuk-summary-list__row">
|
|
<dt className="govuk-summary-list__key">
|
|
{t("account:account-address-line-1-label")}
|
|
</dt>
|
|
<dd className="govuk-summary-list__value">
|
|
{
|
|
props.props.props.form.personalDetailsForm.values
|
|
.address1_line1
|
|
}
|
|
</dd>
|
|
<dd className="govuk-summary-list__actions">
|
|
<a
|
|
className="govuk-link"
|
|
href="#address1_line1"
|
|
onClick={() => {
|
|
setPersonalDetailsComplete(false);
|
|
}}
|
|
>
|
|
{t("common:change-link-label")}
|
|
<span className="govuk-visually-hidden">
|
|
{" "}
|
|
{t("account:account-address-line-1-label")}
|
|
</span>
|
|
</a>
|
|
</dd>
|
|
</div>
|
|
<div className="govuk-summary-list__row">
|
|
<dt className="govuk-summary-list__key">
|
|
{t("account:account-address-line-2-label")}
|
|
</dt>
|
|
<dd className="govuk-summary-list__value">
|
|
{
|
|
props.props.props.form.personalDetailsForm.values
|
|
.address1_line2
|
|
}
|
|
</dd>
|
|
<dd className="govuk-summary-list__actions">
|
|
<a
|
|
className="govuk-link"
|
|
href="#address1_line2"
|
|
onClick={() => {
|
|
setPersonalDetailsComplete(false);
|
|
}}
|
|
>
|
|
{t("common:change-link-label")}
|
|
<span className="govuk-visually-hidden">
|
|
{" "}
|
|
{t("account:account-address-line-2-label")}
|
|
</span>
|
|
</a>
|
|
</dd>
|
|
</div>
|
|
<div className="govuk-summary-list__row">
|
|
<dt className="govuk-summary-list__key">
|
|
{t("account:account-town-city-label")}
|
|
</dt>
|
|
<dd className="govuk-summary-list__value">
|
|
{
|
|
props.props.props.form.personalDetailsForm.values
|
|
.address1_city
|
|
}
|
|
</dd>
|
|
<dd className="govuk-summary-list__actions">
|
|
<a
|
|
className="govuk-link"
|
|
href="#address1_city"
|
|
onClick={() => {
|
|
setPersonalDetailsComplete(false);
|
|
}}
|
|
>
|
|
{t("common:change-link-label")}
|
|
<span className="govuk-visually-hidden">
|
|
{" "}
|
|
{t("account:account-town-city-label")}
|
|
</span>
|
|
</a>
|
|
</dd>
|
|
</div>
|
|
<div className="govuk-summary-list__row">
|
|
<dt className="govuk-summary-list__key">
|
|
{" "}
|
|
{t("account:account-county-label")}
|
|
</dt>
|
|
<dd className="govuk-summary-list__value">
|
|
{
|
|
props.props.props.form.personalDetailsForm.values
|
|
.address1_county
|
|
}
|
|
</dd>
|
|
<dd className="govuk-summary-list__actions">
|
|
<a
|
|
className="govuk-link"
|
|
href="#address1_county"
|
|
onClick={() => {
|
|
setPersonalDetailsComplete(false);
|
|
}}
|
|
>
|
|
{t("common:change-link-label")}
|
|
<span className="govuk-visually-hidden">
|
|
{" "}
|
|
{t("account:account-county-label")}
|
|
</span>
|
|
</a>
|
|
</dd>
|
|
</div>
|
|
<div className="govuk-summary-list__row">
|
|
<dt className="govuk-summary-list__key">
|
|
{" "}
|
|
{t("account:account-postcode-label")}
|
|
</dt>
|
|
<dd className="govuk-summary-list__value">
|
|
{
|
|
props.props.props.form.personalDetailsForm.values
|
|
.address1_postalcode
|
|
}
|
|
</dd>
|
|
<dd className="govuk-summary-list__actions">
|
|
<a
|
|
className="govuk-link"
|
|
href="#address1_postalcode"
|
|
onClick={() => {
|
|
setPersonalDetailsComplete(false);
|
|
}}
|
|
>
|
|
{t("common:change-link-label")}
|
|
<span className="govuk-visually-hidden">
|
|
{" "}
|
|
{t("account:account-postcode-label")}
|
|
</span>
|
|
</a>
|
|
</dd>
|
|
</div>
|
|
</dl>
|
|
<div className="govuk-button-group">
|
|
<button
|
|
type="submit"
|
|
className="govuk-button"
|
|
data-module="govuk-button"
|
|
onClick={() => {
|
|
setAccountUpdatedComplete(true);
|
|
}}
|
|
>
|
|
{t("common:continue-button")}
|
|
</button>
|
|
<Link
|
|
href={"/myportal?q=" + props.accountDetails.loggedinUserId}
|
|
className="govuk-link"
|
|
>
|
|
{t("common:back-link")}
|
|
</Link>
|
|
</div>
|
|
</>
|
|
);
|
|
};
|
|
|
|
const mapStateToProps = (state) => {
|
|
return {
|
|
search: state.search,
|
|
searchResultsObj: state.searchResultsObj,
|
|
formData: state.formData,
|
|
appealType: state.appealType,
|
|
accountDetails: state.accountDetails
|
|
//form: state.form,
|
|
};
|
|
};
|
|
|
|
const mapDispatchToProps = (dispatch) => {
|
|
return {
|
|
setCurrentSection: (currentSection) => {
|
|
dispatch(setCurrentSection(currentSection));
|
|
}
|
|
};
|
|
};
|
|
|
|
export default connect(
|
|
mapStateToProps,
|
|
mapDispatchToProps
|
|
)(BuildCheckPersonalDetails);
|