robbond/pedwfrontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

initial dynamic forms

Browse Source
This commit is contained in:
robbond
2021-07-08 16:22:12 +01:00
parent b335c11e6b
commit 878940a6d5
25 changed files with 709 additions and 60 deletions
Download Patch File Download Diff File Expand all files Collapse all files
pages/api/appealforms/pins_dns.js → pages/api/appealforms/pinswg_dns.js
View File
pages/api/appealforms/pins_row.js → pages/api/appealforms/pinswg_row.js
View File
pages/myportal/index.js
+2
View File
@@ -20,6 +20,7 @@ const Home = (props) => {
const router = useRouter();
const { locale } = router;
const { appealtypes } = router.query;
return (
<div>
@@ -33,6 +34,7 @@ const Home = (props) => {
<Header courseName={t("common:service-name")} />
<div className="govuk-width-container">
<Banner />
<Breadcrumbs slug={appealtypes} />
<MyPortal />
</div>
<Footer footerLinks={footerLinks} />
pages/newappeal/appealtypes/planningappeals78.js → pages/newappeal/[appealtypes].js
+32 -16
View File
@@ -1,28 +1,31 @@
import _ from "lodash";
import Head from "next/head";
import Header from "../../../components/header";
import Banner from "../../../components/banner";
import CookieBanner from "../../../components/cookieBanner";
import Breadcrumbs from "../../../components/breadcrumbs";
import Footer from "../../../components/footer";
import Errorpage from "../../../components/errorpage";
import styles from "../../../styles/Home.module.css";
import Header from "../../components/header";
import Banner from "../../components/banner";
import CookieBanner from "../../components/cookieBanner";
import Breadcrumbs from "../../components/breadcrumbs";
import Footer from "../../components/footer";
import Errorpage from "../../components/errorpage";
import styles from "../../styles/Home.module.css";
import { useSelector, shallowEqual, connect } from "react-redux";
import { wrapper } from "../../../store/store";
import { wrapper } from "../../store/store";
import Cookies from "cookies";
import { useRouter } from "next/router";
import useTranslation from "next-translate/useTranslation";
import { setForm, getFormObj } from "../../../store/formData/action";
import { getFormData } from "../../../actions";
import { setForm, getFormObj } from "../../store/formData/action";
import { getFormData } from "../../actions";
import xpath from "xpath";
import BuildSection from "../../components/newappeal/buildsection";
const Home = (props) => {
const { footerLinks, pages, formData } = props;
let { t, lang } = useTranslation();
const router = useRouter();
const { locale } = router;
const { appealtypes } = router.query;
const formXML = props.formData.formData;
const parser = new DOMParser();
@@ -31,6 +34,11 @@ const Home = (props) => {
"//form/tabs/tab[*]/labels/label[@description]/@description",
doc
);
var sectionCount = xpath.select("/form/tabs/tab[*]", doc);
sectionCount = sectionCount.length;
var tabs = xpath.select("//form/tabs/tab[*]", doc);
// crm api query for looking up picklist fields/drop downs
// <url path to >/api/data/v8.2/EntityDefinitions(LogicalName='{appeal type form}')/Attributes(LogicalName='{drop down datafield name}')/Microsoft.Dynamics.CRM.PicklistAttributeMetadata?$select=LogicalName&$expand=GlobalOptionSet($select=Options)
// eg https://devcrm2016.llcdt.gov.wales/DVPINS/api/data/v8.2/EntityDefinitions(LogicalName='pinswg_householderappealhas')/Attributes(LogicalName='pinswg_casetype')/Microsoft.Dynamics.CRM.PicklistAttributeMetadata?$select=LogicalName&$expand=GlobalOptionSet($select=Options)
@@ -46,12 +54,17 @@ const Home = (props) => {
// C6D124CA-7EDA-4a60-AEA9-7FB8D318B68F - numeric field
// C3EFE0C3-0EC6-42be-8349-CBD9079DFD8E - decimal
/// to get dropdowns names
// form/tabs/tab[*]//rows/row//control[@classid="{3EF39988-22BB-4f0b-BBBE-64B5A3748AEE}"]/@datafieldname
console.log(titles);
const SectionTitles = Object.keys(titles).map((key, index) => (
<h2>
{titles[key].value} - {index}
</h2>
const Sections = Object.keys(tabs).map((key, index) => (
<BuildSection
formXML={formXML}
whichSection={key}
sectionCount={sectionCount}
/>
));
return (
@@ -66,7 +79,8 @@ const Home = (props) => {
<Header courseName={t("common:service-name")} />
<div className="govuk-width-container">
<Banner />
{SectionTitles}
<Breadcrumbs slug={appealtypes} />
{Sections}
</div>
<Footer footerLinks={footerLinks} />
</div>
@@ -77,7 +91,8 @@ const Home = (props) => {
export const getServerSideProps = wrapper.getServerSideProps(
(store) =>
async ({ query, req, res }) => {
const formdata = (await getFormData()) || null;
console.log("the query", query);
const formdata = (await getFormData(query.appealtypes)) || null;
let xmlStr = formdata;
xmlStr = formdata.value[0].formxml;
xmlStr = xmlStr.replace(/\\"/g, "");
@@ -112,6 +127,7 @@ const mapStateToProps = (state) => {
search: state.search,
searchResultsObj: state.searchResultsObj,
formData: state.formData,
appealType: state.appealType,
};
};
pages/newappeal/index.js
+2
View File
@@ -20,6 +20,7 @@ const Home = (props) => {
const router = useRouter();
const { locale } = router;
const { appealtypes } = router.query;
return (
<div>
@@ -33,6 +34,7 @@ const Home = (props) => {
<Header courseName={t("common:service-name")} />
<div className="govuk-width-container">
<Banner />
<Breadcrumbs slug={appealtypes} />
<NewAppeal />
</div>
<Footer footerLinks={footerLinks} />
pages/newappeal/selectappeal.js
+127
View File
@@ -0,0 +1,127 @@
import _ from "lodash";
import Head from "next/head";
import Header from "../../components/header";
import Banner from "../../components/banner";
import CookieBanner from "../../components/cookieBanner";
import Breadcrumbs from "../../components/breadcrumbs";
import Footer from "../../components/footer";
import Errorpage from "../../components/errorpage";
import styles from "../../styles/Home.module.css";
import { useSelector, shallowEqual, connect } from "react-redux";
import { wrapper } from "../../store/store";
import Cookies from "cookies";
import { useRouter } from "next/router";
import { useState } from "react";
import useTranslation from "next-translate/useTranslation";
import { setAppealType, gtAppealTypeObj } from "../../store/appealType/action";
import { getAppealsTypes } from "../../actions";
import xpath from "xpath";
const Home = (props) => {
const { footerLinks, pages, formData } = props;
let { t, lang } = useTranslation();
const router = useRouter();
const { locale } = router;
const { appealtypes } = router.query;
const { appealType } = props;
const optionsObj = props.appealType.appealType.GlobalOptionSet.Options;
const appealOptions = Object.keys(optionsObj).map((key, index) => (
<option
value={optionsObj[key].Label.LocalizedLabels[0].Label.replace(
/[\s\-\+\(\)\,]/g,
""
).toLowerCase()}
>
{optionsObj[key].Label.LocalizedLabels[0].Label}
</option>
));
const [appealTypeSelect, setAppealTypeSelect] = useState("");
const handleParam = (setValue) => (e) => setValue(e.target.value);
const selectAppealType = (event) => {
event.preventDefault();
console.log(appealTypeSelect);
// /searchresults
router.push({
pathname: "/newappeal/" + appealTypeSelect,
});
};
return (
<div>
<Head>
<title>
{t("search:page-title")} - {t("common:service-name")}
</title>
</Head>
<div id="page_wrapper">
<CookieBanner />
<Header courseName={t("common:service-name")} />
<div className="govuk-grid-row">
<div className="govuk-grid-column-full">
<div className="govuk-width-container">
<Banner />
<Breadcrumbs slug={appealtypes} />
<h1>New Appeal</h1>
<form onSubmit={selectAppealType}>
<div class="govuk-form-group">
<label class="govuk-label" for="sort">
Select an appeal Type
</label>
<select
class="govuk-select"
id="appealTypes"
name="appealTypes"
onChange={handleParam(
setAppealTypeSelect
)}
>
{appealOptions}
</select>
</div>
<button
class="govuk-button"
data-module="govuk-button"
>
Continue
</button>
</form>
</div>
</div>
</div>
<Footer footerLinks={footerLinks} />
</div>
</div>
);
};
export const getServerSideProps = wrapper.getServerSideProps(
(store) =>
async ({ query, req, res }) => {
const appealTypeData = (await getAppealsTypes()) || null;
console.log("appeal types", appealTypeData);
store.dispatch(setAppealType(appealTypeData));
}
);
const mapStateToProps = (state) => {
return {
search: state.search,
searchResultsObj: state.searchResultsObj,
formData: state.formData,
appealType: state.appealType,
};
};
export default connect(mapStateToProps)(Home);
pages/searchresults.js
+20 -12
View File
@@ -15,8 +15,11 @@ import { useRouter } from "next/router";
import useTranslation from "next-translate/useTranslation";
import { setSearch, getSearchObj } from "../store/search/action";
import { setSearchResults, getSearchResultsObj } from "../store/searchOutput/action";
import {getBasicSearch} from "../actions"
import {
setSearchResults,
getSearchResultsObj,
} from "../store/searchOutput/action";
import { getBasicSearch } from "../actions";
const Home = (props) => {
const { footerLinks, pages } = props;
@@ -24,6 +27,7 @@ const Home = (props) => {
const router = useRouter();
const { locale } = router;
const { appealtypes } = router.query;
return (
<div>
@@ -37,7 +41,11 @@ const Home = (props) => {
<Header courseName={t("common:service-name")} />
<div className="govuk-width-container">
<Banner />
<SearchResults searchString={props.search.searchString} searchResultsObj={props.searchResultsObj} />
<Breadcrumbs slug={appealtypes} />
<SearchResults
searchString={props.search.searchString}
searchResultsObj={props.searchResultsObj}
/>
</div>
<Footer footerLinks={footerLinks} />
</div>
@@ -45,13 +53,13 @@ const Home = (props) => {
);
};
export const getServerSideProps = wrapper.getServerSideProps (
store => async({ query, req, res }) =>
{
console.log('query-',query);
const searchResultsObj = await getBasicSearch(query.q) || null;
store.dispatch(setSearchResults(searchResultsObj));
store.dispatch(setSearch(query.q));
export const getServerSideProps = wrapper.getServerSideProps(
(store) =>
async ({ query, req, res }) => {
console.log("query-", query);
const searchResultsObj = (await getBasicSearch(query.q)) || null;
store.dispatch(setSearchResults(searchResultsObj));
store.dispatch(setSearch(query.q));
}
);
@@ -78,11 +86,11 @@ export const getServerSideProps = wrapper.getServerSideProps (
// );
const mapStateToProps = (state) => {
console.log('mapstate',state);
console.log("mapstate", state);
return {
search: state.search,
searchResultsObj: state.searchResultsObj
searchResultsObj: state.searchResultsObj,
// // apiroot: state.apiroot,
// // courseListContent: state.courseListContent.courseListContent,
// // pages: state.pages.pages,