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

Merged PR 1033: Merge dev work for Phase 2

Browse Source 
Make development branch back in sync with reps work and other dev done since phase 1a deployment to give a phase 2

Related work items: #6495, #8449, #8450, #8456, #8457, #8458
This commit is contained in:
Robert Bond
2023-11-29 11:11:35 +00:00
parent eedc908a1b 33df7e25d7
commit d313ce6592
241 changed files with 25436 additions and 12295 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.env old.local
+119
View File
@@ -0,0 +1,119 @@
ACCESS_TOKEN_ENDPOINT = https://login.microsoftonline.com/
//ESNR Tenant
//TENANT = a8d860de-d5e1-45af-8376-d93f02e6b502
//WGO Tenant
TENANT = 9ac1a5ab-cd58-409e-a1b6-6b10422a68f5
GRANT_TYPE = "client_credentials"
HASHKEY = 028ffbae928d7191c0017f298260995f901d78eabde1436c0af0423459cc3715832136d84f68818d3a96399467b52143e273d4f3bf4ae190848891535421cd6c
NEXT_PUBLIC_HASHKEY = 028ffbae928d7191c0017f298260995f901d78eabde1436c0af0423459cc3715832136d84f68818d3a96399467b52143e273d4f3bf4ae190848891535421cd6c
//Dev oauth ESNR
CLIENT_ID = 9b834097-03d7-409b-b038-ecfec31a394a
//CLIENT_SECRET = 4Vt8Q~olL1hx7n01B0~tXf-N2YL5DyC_Fk6waagX
CLIENT_SECRET = AU88Q~NBOVOXqwb4mBx9y.NMIZ9s1o7boqZoKcSE
RELAY_ROOT = https://dev-pedw-ns.servicebus.windows.net/dev-pedw-hc/
RELAYURI = "dev-pedw-ns.servicebus.windows.net"
RELAYPATH = "dev-pedw-hc"
//Test Oauth ESNR
//CLIENT_ID = d40b9373-96c2-4b04-8bd8-c2a2fe6444c1
//CLIENT_SECRET = IXI8Q~D5oqsC-nrtayHHc~tUAfjQFzNiKVQ~fc2S
//RELAY_ROOT = https://test-pedw-ns.servicebus.windows.net/test-pedw-hc/
//RELAYURI = "test-pedw-ns.servicebus.windows.net"
//RELAYPATH = "test-pedw-hc"
//Preprod Oauth WGO
//CLIENT_ID = ab6c4678-b31a-4eb3-b429-e039120e488a
//CLIENT_SECRET = Ioo7Q~RJfhWsE45wPsuHm1CzRk1SppnNN3lZF
//RELAY_ROOT = https://pp-pedw-ns.servicebus.windows.net/pp-pedw-hc/
//RELAYURI = "pp-pedw-ns.servicebus.windows.net"
//RELAYPATH = "pp-pedw-hc"
//Prod Oauth WGO
//CLIENT_ID = 3e4141a3-1fbd-454e-98f0-7f3a4f14a3cc
//CLIENT_SECRET = mJN7Q~lFu.xFGa5KCc.zwIm_fJAWxajyQaFo~
//RELAY_ROOT = https://prod-pedw-ns.servicebus.windows.net/prod-pedw-hc/
//RELAYURI = "prod-pedw-ns.servicebus.windows.net"
//RELAYPATH = "prod-pedw-hc"
GOOGLE_TAG_MANAGER = GTM-T78CBC3
SHOWLOGIN = "true"
SHOWREPRESENTATIONS = true
SHOWFILEUPLOAD = "false"
SHOWMAPS = "false"
//BASIC_AUTH_CREDENTIALS = pinswg:password|pinswg2:password2
PORT= "3000"
DEFAULT_DOMAIN = "localhost"
I18N_DOMAIN = "cymru.local"
//I18N_DOMAIN ="dev-gwaithcynllunio.gwasanaeth.llyw.cymru"
//I18N_DOMAIN ="stage-gwaithcynllunio.gwasanaeth.llyw.cymru"
//I18N_DOMAIN ="pp-gwaithcynllunio.gwasanaeth.llyw.cymru"s
//I18N_DOMAIN ="gwaithcynllunio.gwasanaeth.llyw.cymru"
//gov gateway
GG_PROVIDER_CONFIG_ENDPOINT = "https://api.ete.access.service.gov.uk/.well-known/openid-configuration"
GG_CLIENT_ID = 5vTukeSpN7d6uBV7YLb7A5wOctzzkZ
GG_CLIENT_SECRET = z1PGLAKPxIhjMBegTdzX22AayIORc1GsCbMQZ6mieBn7zChjzzxup5lkIByEmsYS
//GG_REDIRECT_URI = "http://localhost:3000"
GG_REDIRECT_URI = "https://dev-planningcasework.service.gov.wales"
NEXT_PUBLIC_GG_CLIENT_ID = 5vTukeSpN7d6uBV7YLb7A5wOctzzkZ
NEXT_PUBLIC_GG_REDIRECT_URI = "http://localhost:3000"
API_ROOT = "http://localhost:3000"
GOOGLE_MAP_API_KEY = AIzaSyCzeVrHt544bp_72YCFkw21eDsmI2JEsQo
//Next Auth vars
//EMAIL_SERVER_HOST=smtp.sendgrid.net
//EMAIL_SERVER_PORT=465
//EMAIL_SERVER_USER=apikey
//EMAIL_SERVER_PASSWORD=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
//EMAIL_FROM=rob@rdbsolutions.co.uk
EMAIL_SERVER_HOST=rdbdigital.com
EMAIL_SERVER_PORT=465
EMAIL_SERVER_USER=rob@rdbdigital.com
EMAIL_SERVER_PASSWORD=!Sky9fish2020
EMAIL_FROM=no-reply@rdbdigital.com
NEXTAUTH_URL=http://localhost:3000
NEXTAUTH_URL_INTERNAL=http://localhost:3000
//DATABASE_URL=mysql://nextAuthAdmin:!Sky9fish1972@77.68.17.157:3306/nextauthDB?synchronise=true
DATABASE_URL = sqlserver://pedw-dev-test-sql-svr.database.windows.net:1433;database=PEDWDev;user=RobBondSQL;password=GhWKr62F5sQ69dZx;encrypt=true;trustServerCertificate=false;hostNameInCertificate=*.database.windows.net;loginTimeout=30;authentication=ActiveDirectoryPassword
SECRET = SuperSecret
//Azure Storage Account
AZURE_CLIENT_ID = $CLIENT_ID
AZURE_TENANT_ID = $TENANT
AZURE_CLIENT_SECRET = $CLIENT_SECRET
AZURE_STORAGE_ACCOUNT_NAME= "pedwdev"
AZURE_STORAGE_ACCOUNT_KEY = JS3ZIXianhYhB1lZrHB+bXbdzaLlON0alCyKrFAb+jVEwr9iqo2dty92EBxwnufNFM+CSN/fKX2R+AStDn0byg==
AZURE_PEDW_STORAGE_ENDPOINT = https://pedwdev.blob.core.windows.net
AZURE_PEDW_CONTAINER = "pedwapplications"
AZURE_PEDW_QUEUE_ENDPOINT = https://$AZURE_STORAGE_ACCOUNT_NAME.queue.core.windows.net
//gov.notify
NOTIFY_API_KEY = pedwnextauthkey-90f93710-9dae-423e-aea1-11eccd0dc132-0c9469d9-d671-444d-9e9d-3e5a62001043
.env.local
+10 -55
View File
@@ -1,17 +1,11 @@
ACCESS_TOKEN_ENDPOINT = https://login.microsoftonline.com/
//ESNR Tenant
//TENANT = a8d860de-d5e1-45af-8376-d93f02e6b502
//WGO Tenant
TENANT = 9ac1a5ab-cd58-409e-a1b6-6b10422a68f5
GRANT_TYPE = "client_credentials"
HASHKEY = 028ffbae928d7191c0017f298260995f901d78eabde1436c0af0423459cc3715832136d84f68818d3a96399467b52143e273d4f3bf4ae190848891535421cd6c
NEXT_PUBLIC_HASHKEY = 028ffbae928d7191c0017f298260995f901d78eabde1436c0af0423459cc3715832136d84f68818d3a96399467b52143e273d4f3bf4ae190848891535421cd6c
//Dev oauth ESNR
CLIENT_ID = 9b834097-03d7-409b-b038-ecfec31a394a
//CLIENT_SECRET = 4Vt8Q~olL1hx7n01B0~tXf-N2YL5DyC_Fk6waagX
CLIENT_SECRET = AU88Q~NBOVOXqwb4mBx9y.NMIZ9s1o7boqZoKcSE
RELAY_ROOT = https://dev-pedw-ns.servicebus.windows.net/dev-pedw-hc/
RELAYURI = "dev-pedw-ns.servicebus.windows.net"
@@ -44,59 +38,23 @@ RELAYPATH = "dev-pedw-hc"
GOOGLE_TAG_MANAGER = GTM-T78CBC3
SHOWLOGIN = "true"
SHOWREPRESENTATIONS = false
SHOWLOGIN = true
SHOWREPRESENTATIONS = true
SHOWFILEUPLOAD = "false"
SHOWMAPS = "true"
//BASIC_AUTH_CREDENTIALS = pinswg:password|pinswg2:password2
PORT= "3000"
DEFAULT_DOMAIN = "localhost"
I18N_DOMAIN = "cymru.local"
//I18N_DOMAIN ="dev-gwaithcynllunio.gwasanaeth.llyw.cymru"
//I18N_DOMAIN ="stage-gwaithcynllunio.gwasanaeth.llyw.cymru"
//I18N_DOMAIN ="pp-gwaithcynllunio.gwasanaeth.llyw.cymru"s
//I18N_DOMAIN ="gwaithcynllunio.gwasanaeth.llyw.cymru"
//gov gateway
GG_PROVIDER_CONFIG_ENDPOINT = "https://api.ete.access.service.gov.uk/.well-known/openid-configuration"
GG_CLIENT_ID = 5vTukeSpN7d6uBV7YLb7A5wOctzzkZ
GG_CLIENT_SECRET = z1PGLAKPxIhjMBegTdzX22AayIORc1GsCbMQZ6mieBn7zChjzzxup5lkIByEmsYS
//GG_REDIRECT_URI = "http://localhost:3000"
GG_REDIRECT_URI = "https://dev-planningcasework.service.gov.wales"
NEXT_PUBLIC_GG_CLIENT_ID = 5vTukeSpN7d6uBV7YLb7A5wOctzzkZ
NEXT_PUBLIC_GG_REDIRECT_URI = "http://localhost:3000"
SHOWMAPS = "false"
API_ROOT = "http://localhost:3000"
GOOGLE_MAP_API_KEY = AIzaSyCzeVrHt544bp_72YCFkw21eDsmI2JEsQo
CY_API_ROOT ="http://cymru.local:3000"
I18N_DOMAIN = "cymru.local"
//Next Auth vars
//EMAIL_SERVER_HOST=smtp.sendgrid.net
//EMAIL_SERVER_PORT=465
//EMAIL_SERVER_USER=apikey
//EMAIL_SERVER_PASSWORD=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
//EMAIL_FROM=rob@rdbsolutions.co.uk
NEXTAUTH_URL=$API_ROOT
NEXTAUTH_URL_INTERNAL=$API_ROOT
NEXTAUTH_SECRET = SuperSecret
EMAIL_SERVER_HOST=rdbdigital.com
EMAIL_SERVER_PORT=465
EMAIL_SERVER_USER=rob@rdbdigital.com
EMAIL_SERVER_PASSWORD=!Sky9fish2020
EMAIL_FROM=no-reply@rdbdigital.com
NEXTAUTH_URL=http://localhost:3000
NEXTAUTH_URL_INTERNAL=http://localhost:3000
//DATABASE_URL=mysql://nextAuthAdmin:!Sky9fish1972@77.68.17.157:3306/nextauthDB?synchronise=true
DATABASE_URL = sqlserver://pedw-dev-test-sql-svr.database.windows.net:1433;database=PEDWDev;user=RobBondSQL;password=GhWKr62F5sQ69dZx;encrypt=true;trustServerCertificate=false;hostNameInCertificate=*.database.windows.net;loginTimeout=30;authentication=ActiveDirectoryPassword
SECRET = SuperSecret
SECRET=SuperSecret
//Azure Storage Account
@@ -104,15 +62,12 @@ SECRET=SuperSecret
AZURE_CLIENT_ID = $CLIENT_ID
AZURE_TENANT_ID = $TENANT
AZURE_CLIENT_SECRET = $CLIENT_SECRET
AZURE_STORAGE_ACCOUNT_NAME= "pedwdev"
AZURE_STORAGE_ACCOUNT_KEY = JS3ZIXianhYhB1lZrHB+bXbdzaLlON0alCyKrFAb+jVEwr9iqo2dty92EBxwnufNFM+CSN/fKX2R+AStDn0byg==
AZURE_PEDW_STORAGE_ENDPOINT = https://pedwdev.blob.core.windows.net
AZURE_PEDW_CONTAINER = "pedwapplications"
AZURE_PEDW_QUEUE_ENDPOINT = https://$AZURE_STORAGE_ACCOUNT_NAME.queue.core.windows.net
//gov.notify
NOTIFY_API_KEY = pedwnextauthkey-90f93710-9dae-423e-aea1-11eccd0dc132-0c9469d9-d671-444d-9e9d-3e5a62001043
.eslintrc
+26 -1
View File
@@ -3,7 +3,32 @@
"rules": {
"@next/next/no-img-element": "off",
"react/no-unknown-property": "error"
}
}//,
//...your configuration
// "overrides": [
// //...your overrides
// {
// // Force the setting of a swagger description on each api endpoint
// "files": ["pages/api/**/*.js"],
// "plugins": ["jsdoc"],
// "rules": {
// "jsdoc/no-missing-syntax": [
// "error",
// {
// "contexts": [
// {
// "comment": "JsdocBlock:has(JsdocTag[tag=swagger])",
// "context": "any",
// "message": "@swagger documentation is required on each API. Check this out for syntax info: https://github.com/jellydn/next-swagger-doc"
// }
// ]
// }
// ]
// }
// }
// ]
}
.gitignore
+3 -1
View File
@@ -16,4 +16,6 @@ yarn-error.log*
#lock files
yarn.lock
package-lock.json
package-lock.json
tmp/
.vscode/launch.json
Vendored
+8 -2
View File
@@ -4,12 +4,18 @@
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
"version": "0.2.0",
"configurations": [
{
{
"name": "Next.js: debug server-side",
"type": "node-terminal",
"request": "launch",
"command": "yarn run dev"
},
{"name": "Launch Chrome against localhost",
"type": "pwa-chrome",
"request": "launch",
"name": "Launch Chrome against localhost",
"url": "http://localhost:3000",
"webRoot": "${workspaceFolder}"
}
]
}
actions/azurestorage.js
+464 -33
View File
@@ -1,4 +1,6 @@
import { v4 as uuidv4 } from "uuid";
import { DefaultAzureCredential } from "@azure/identity";
import _ from "lodash";
import { hashAPIPath } from ".";
const {
ContainerClient,
BlockBlobClient,
@@ -6,13 +8,25 @@ const {
BlobSASPermissions,
ContainerSASPermissions,
generateBlobSASQueryParameters,
SASProtocol,
} = require("@azure/storage-blob");
import { DefaultAzureCredential } from "@azure/identity";
import { consoleLogger, conLog, hashAPIPath } from ".";
import _ from "lodash";
const {
QueueServiceClient,
AccountSASResourceTypes,
AccountSASServices,
AccountSASPermissions,
QueueSASPermissions,
QueueSASSignatureValues,
generateAccountSASQueryParameters,
generateQueueSASQueryParameters,
StorageSharedKeyCredential,
QueueClient,
} = require("@azure/storage-queue");
const STORAGE_PATH = process.env.AZURE_PEDW_STORAGE_ENDPOINT;
const STORAGE_CONTAINER = process.env.AZURE_PEDW_CONTAINER;
const QUEUE_PATH = process.env.AZURE_PEDW_QUEUE_ENDPOINT;
const accountName = process.env.AZURE_STORAGE_ACCOUNT_NAME;
export const createContainerSas = async (containerName) => {
@@ -41,7 +55,7 @@ export const createContainerSas = async (containerName) => {
);
// Need only list permission to list blobs
const containerPermissions = "rcwltd";
const containerPermissions = "rcwdltf";
// Best practice: SAS options are time-limited
const sasOptions = {
@@ -246,6 +260,40 @@ export const createBlob = async (formContent, containerName, caseref) => {
const tags = {
containerid: containerName,
caseID: caseID,
blobType: "Appeal",
};
console.log("the tags:", tags);
const withTags = await blockBlobClient.setTags(tags);
const withMeta = await blockBlobClient.setMetadata(tags);
return formContent.pinswg_name;
};
export const createRepBlob = async (formContent, containerName, caseref) => {
const containerToken = await createContainerSas(containerName);
const sasUrl = `${STORAGE_PATH}/${containerName}?${containerToken}`;
const containerClient = new ContainerClient(sasUrl);
formContent = JSON.parse(formContent);
const content = JSON.stringify(formContent);
//console.log(content);
const blobName = caseref + "/" + formContent.repfile_name + "_rep.json";
console.log("blobName:", blobName);
const blockBlobClient = containerClient.getBlockBlobClient(blobName);
const uploadBlobResponse = await blockBlobClient.upload(
content,
Buffer.byteLength(content)
);
const tags = {
containerid: containerName,
caseID: formContent.caseRef,
blobType: "Representation",
};
console.log("the tags:", tags);
@@ -325,13 +373,18 @@ export const uploadFile = async (formContent, containerName, foldername) => {
files[prop][0].path,
files[prop].size
);
console.log(
"////////////////////////\nfile name:",
files[prop][0].fieldName,
"\n////////////////////////////"
);
const tags = {
containerid: containerName,
caseID: foldername,
documentType: files[prop][0].fieldName.slice(
0,
files[prop][0].fieldName.indexOf("_")
),
caseID: foldername.split("/")[0],
documentType: files[prop][0].fieldName.split(".")[1],
blobType: "RepresentationFile",
};
const withTags = await blockBlobClient.setTags(tags);
const withMeta = await blockBlobClient.setMetadata(tags);
@@ -343,8 +396,125 @@ export const uploadFile = async (formContent, containerName, foldername) => {
}
};
export const uploadRepFiles = async (
formContent,
containerName,
foldername
) => {
const containerToken = await createContainerSas(containerName);
const sasUrl = `${STORAGE_PATH}/${containerName}?${containerToken}`;
const containerClient = new ContainerClient(sasUrl);
const files = formContent;
console.log(...formContent);
console.log("rep files...", files, Object.keys(files).length, foldername);
const blobName = foldername + "/" + formContent.split("tmp/")[1];
const blockBlobClient = containerClient.getBlockBlobClient(blobName);
const uploadBlobResponse = await blockBlobClient.uploadFile(formContent);
const tags = {
containerid: containerName,
caseID: formContent.split("tmp/")[0],
documentType: "Rep docs",
};
console.log(tags);
const withTags = await blockBlobClient.setTags(tags);
const withMeta = await blockBlobClient.setMetadata(tags);
console.log(
`Uploaded block blob ${files} successfully`,
uploadBlobResponse.requestId
);
};
export const uploadPDFRepFiles = async (
formContent,
containerName,
foldername,
repType
) => {
const containerToken = await createContainerSas(containerName);
const sasUrl = `${STORAGE_PATH}/${containerName}?${containerToken}`;
const containerClient = new ContainerClient(sasUrl);
const files = formContent;
console.log(formContent, containerName, foldername);
console.log(
"rep pdf files...",
files,
Object.keys(files).length,
foldername
);
// console.log(`files[${prop}] = ${files[prop][0].size}`);
console.log(foldername + "/files/" + formContent.split("tmp/")[1]);
const blobName = foldername + "/" + formContent.split("tmp/")[1];
console.log(blobName);
const blockBlobClient = containerClient.getBlockBlobClient(blobName);
const uploadBlobResponse = await blockBlobClient.uploadFile(formContent);
const tags = {
containerid: containerName,
caseID: foldername.split("/")[0],
documentType: repType,
blobType: "RepresentationPDF",
};
console.log("the tags:", tags);
const withTags = await blockBlobClient.setTags(tags);
const withMeta = await blockBlobClient.setMetadata(tags);
console.log(
`Uploaded block blob ${files} successfully`,
uploadBlobResponse.requestId
);
};
export const uploadPDFCaseFiles = async (
formContent,
containerName,
foldername
) => {
const containerToken = await createContainerSas(containerName);
const sasUrl = `${STORAGE_PATH}/${containerName}?${containerToken}`;
const containerClient = new ContainerClient(sasUrl);
const files = formContent;
console.log(formContent, containerName, foldername);
console.log(
"case pdf files...",
files,
Object.keys(files).length,
foldername
);
const blobName = foldername + "/" + formContent.split("tmp/")[1];
const blockBlobClient = containerClient.getBlockBlobClient(blobName);
const uploadBlobResponse = await blockBlobClient.uploadFile(formContent);
const tags = {
containerid: containerName,
caseID: foldername.split("/")[0],
blobType: "AppealPDF",
};
console.log("the tags:", tags);
const withTags = await blockBlobClient.setTags(tags);
const withMeta = await blockBlobClient.setMetadata(tags);
console.log(
`Uploaded block blob ${files} successfully`,
uploadBlobResponse.requestId
);
};
export const downloadFile = async (containerName, blobName) => {
//console.log.apply(containerName, blobName);
//console.log(containerName, blobName);
const containerToken = await createContainerSas(containerName);
const sasUrl = `${STORAGE_PATH}/${containerName}?${containerToken}`;
const containerClient = new ContainerClient(sasUrl);
@@ -360,7 +530,7 @@ export const downloadProgressFile = async (
blobName,
casefolderID
) => {
//console.log.apply(containerName, blobName);
console.log(containerName, blobName);
const containerToken = await createContainerSas(containerName);
const sasUrl = `${STORAGE_PATH}/${containerName}?${containerToken}`;
@@ -370,7 +540,7 @@ export const downloadProgressFile = async (
const downloaded = await streamToBuffer(downloadedBlob.readableStreamBody);
console.log("Downloaded blob content:", downloaded.toString());
//console.log("Downloaded blob content:", downloaded.toString());
return JSON.parse(downloaded.toString());
};
@@ -379,11 +549,11 @@ export const downloadAllProgressFiles = async (
containerName,
progressBlobObj
) => {
console.log(
"/////////////////////////\n downloading files: " +
JSON.stringify(progressBlobObj) +
"\n/////////////////////////\n"
);
// console.log(
// "/////////////////////////\n downloading files: " +
// JSON.stringify(progressBlobObj) +
// "\n/////////////////////////\n"
// );
const containerToken = await createContainerSas(containerName);
const sasUrl = `${STORAGE_PATH}/${containerName}?${containerToken}`;
@@ -397,7 +567,7 @@ export const downloadAllProgressFiles = async (
let blobCount = 0;
for (const prop in progressBlobObj) {
console.log(`Progress - ${prop}: ${progressBlobObj[prop].path}`);
//console.log(`Progress - ${prop}: ${progressBlobObj[prop].path}`);
blobClient = containerClient.getBlobClient(progressBlobObj[prop].path);
downloadedBlob = await blobClient.download(0);
downloaded =
@@ -410,7 +580,7 @@ export const downloadAllProgressFiles = async (
downloaded = downloaded.substring(0, downloaded.length - 1);
for (const prop in progressBlobObj) {
console.log(`Cases - ${prop}: ${progressBlobObj[prop].caseObj}`);
//console.log(`Cases - ${prop}: ${progressBlobObj[prop].caseObj}`);
blobClient = containerClient.getBlobClient(
progressBlobObj[prop].caseObj
);
@@ -434,6 +604,86 @@ export const downloadAllProgressFiles = async (
);
};
export const downloadRepFile = async (
containerName,
blobName,
casefolderID
) => {
console.log(containerName, blobName);
const containerToken = await createContainerSas(containerName);
const sasUrl = `${STORAGE_PATH}/${containerName}?${containerToken}`;
const containerClient = new ContainerClient(sasUrl);
const blobClient = containerClient.getBlobClient(blobName);
const downloadedBlob = await blobClient.download();
const downloaded = await streamToBuffer(downloadedBlob.readableStreamBody);
console.log("Downloaded blob content:", downloaded.toString());
return JSON.parse(downloaded.toString());
};
export const downloadAllRepsFiles = async (containerName, repsBlobObj) => {
console.log(
"/////////////////////////\n downloading files: " +
JSON.stringify(repsBlobObj) +
"\n/////////////////////////\n"
);
const containerToken = await createContainerSas(containerName);
const sasUrl = `${STORAGE_PATH}/${containerName}?${containerToken}`;
const containerClient = new ContainerClient(sasUrl);
let blobClient = {};
let downloadedBlob = {};
let repArr = [];
let downloaded = [];
let caseBlob = {};
let caseDownloaded = "";
let blobCount = 0;
Array.isArray(repsBlobObj) &&
!repsBlobObj.length &&
console.log("is empt and an array");
for (const prop in repsBlobObj) {
//console.log(`Progress - ${prop}: ${repsBlobObj[prop].path}`);
blobClient = containerClient.getBlobClient(repsBlobObj[prop].path);
downloadedBlob = await blobClient.download(0);
let repBlobObj = await streamToBuffer(
downloadedBlob.readableStreamBody
);
repBlobObj = JSON.parse(repBlobObj);
repBlobObj["casereference"] = repsBlobObj[prop].name.split("/")[1];
// repBlobObj = JSON.stringify(repBlobObj);
downloaded.push(repBlobObj);
blobCount++;
}
//downloaded = downloaded.substring(0, downloaded.length - 1);
// console.log(
// "/////////////////////////\n downloaded : " +
// JSON.stringify(
// '{ "@odata.count": ' +
// blobCount +
// ',"value": ' +
// downloaded +
// "}"
// ) +
// "\n/////////////////////////\n"
// );
return {
"@odata.count": blobCount,
"value": downloaded,
};
};
const streamToBuffer = async (readableStream) => {
return new Promise((resolve, reject) => {
const chunks = [];
@@ -465,6 +715,17 @@ export const getCaseBlob = async (
content,
Buffer.byteLength(content)
);
const tags = {
containerid: containerName,
caseID: caseReference,
blobType: "Case",
};
console.log("the tags:", tags);
const withTags = await blockBlobClient.setTags(tags);
const withMeta = await blockBlobClient.setMetadata(tags);
return blobName;
};
@@ -482,18 +743,22 @@ export const getProgressBlobs = async (containerName, caseReference) => {
blobCount++;
}
console.log("this is the caasefolder:", caseReference, blobCount);
console.log(
"this is the casefolder and blobcount:",
caseReference,
blobCount
);
let blobObj = [];
for await (const blob of containerClient.listBlobsFlat({
prefix: caseReference + "/" + caseReference + "_appeal.json",
})) {
console.log("in here");
console.log("getProgressBlobs in here", blob.name.split("/"));
blobObj.push({
"name": blob.name.split("/")[1],
"path": blob.name,
"versionId": blob.versionId,
"caseObj": caseReference + "/" + caseReference + "_case.json",
"caseObj": caseReference + "/case/" + caseReference + "_case.json",
"isCurrentVersion": blob.isCurrentVersion,
"contentLength": blob.properties.contentLength,
"contentType": blob.contentType,
@@ -529,8 +794,6 @@ export const getProgressBlobs = async (containerName, caseReference) => {
},
]).reverse()[0];
//console.log("blobObjwwwww:", blobObj);
return blobObj;
};
@@ -544,26 +807,194 @@ export const getAllProgressBlobs = async (containerName) => {
let blobCount = 0;
let blobObj = [];
for await (const blob of containerClient.listBlobsFlat()) {
blob.name.split("/")[1].indexOf(".json") > 0 &&
for await (const blob of containerClient.findBlobsByTags(
"blobType='Appeal'"
)) {
blob.name.split("/")[1].indexOf("_appeal.json") > 0 &&
blob.name.split("/")[1].indexOf("undefined") < 0 &&
blobObj.push({
"name": blob.name.split("/")[1],
"path": blob.name,
"versionId": blob.versionId,
//"versionId": blob.versionId,
"caseObj":
blob.name.split("/")[0] +
"/case/" +
blob.name.split("/")[0] +
"_case.json",
"isCurrentVersion": blob.isCurrentVersion,
"contentLength": blob.properties.contentLength,
"contentType": blob.contentType,
"lastModified": blob.properties.lastModified,
// "isCurrentVersion": blob.isCurrentVersion,
// "contentLength": blob.properties.contentLength,
// "contentType": blob.contentType,
// "lastModified": blob.properties.lastModified,
});
}
//console.log("blobObj:", blobObj);
console.log("blobObj:", blobObj);
return blobObj;
};
export const getRepsBlobs = async (containerName) => {
const containerToken = await createContainerSas(containerName);
const sasUrl = `${STORAGE_PATH}/${containerName}?${containerToken}`;
const containerClient = new ContainerClient(sasUrl);
let blobCount = 0;
for await (const blob of containerClient.findBlobsByTags(
"blobType='Representation'"
)) {
console.log(`-----Blob ${blobCount++}: ${blob.name}`);
blobCount++;
}
console.log(
"this is the casefolder and blobcount:",
//caseReference,
blobCount
);
const listOptions = {
includeMetadata: true,
includeSnapshots: false,
includeTags: true,
includeVersions: true,
};
let blobObj = [];
for await (const blob of containerClient.findBlobsByTags(
"blobType='Representation'",
listOptions
)) {
const blobClient = await containerClient.getBlobClient(blob.name);
console.log("getreps blob blob", blob);
blob.name.split("/")[2].indexOf("_rep.json") > 0 &&
blob.name.split("/")[2].indexOf("undefined") < 0 &&
blobObj.push({
"name": blob.name.split("/")[2],
"path": blob.name,
"size": blobClient.getProperties().contentLength,
});
}
//console.log("blobObjwwwww:", blobObj);
return blobObj;
};
export const createQueueSas = async (queueName) => {
// Get environment variables
const account = process.env.AZURE_STORAGE_ACCOUNT_NAME;
const accountKey = process.env.AZURE_STORAGE_ACCOUNT_KEY;
const sharedKeyCredential = new StorageSharedKeyCredential(
account,
accountKey
);
// Best practice: create time limits
const TEN_MINUTES = 10 * 60 * 1000;
const NOW = new Date();
// Best practice: set start time a little before current time to
// make sure any clock issues are avoided
const TEN_MINUTES_AFTER_NOW = new Date(NOW.valueOf() + TEN_MINUTES);
var resource_types = new AccountSASResourceTypes();
resource_types.container = true;
resource_types.object = true;
resource_types.service = true;
var permission = new QueueSASPermissions();
permission.read = true;
permission.write = true;
permission.delete = true;
permission.list = true;
permission.add = true;
permission.update = true;
permission.process = true;
var sas_signature_val = {
expiresOn: TEN_MINUTES_AFTER_NOW,
permissions: permission,
queueName: queueName,
};
const sasToken = generateQueueSASQueryParameters(
sas_signature_val,
sharedKeyCredential
);
//console.log("sass token:", sasToken);
return sasToken.toString();
};
export const createCaseCompleteMessage = async (
containerName,
caseReference
) => {
const whichQueue = "pedw-submitted-applications";
const queueToken = await createQueueSas(whichQueue);
const sasUrl = `${QUEUE_PATH}?${queueToken}`;
const queueServiceClient = new QueueServiceClient(sasUrl);
const message = {
containerName: containerName,
casepath:
containerName +
"/" +
caseReference +
"/" +
caseReference +
"_appeal.json",
casecontentpath: containerName + "/" + caseReference + "/case",
filespath: containerName + "/" + caseReference + "/files",
// uploadUrl: fileRecord.uploadUrl,
// filename: fileRecord.file.name,
// fileSize: fileRecord.file.size,
};
const sendMessageResponse = await queueServiceClient
.getQueueClient(whichQueue)
.sendMessage(
JSON.stringify(
`<QueueMessage><MessageText>${JSON.stringify(
message
)}</MessageText></QueueMessage>`
)
);
return sendMessageResponse;
};
export const createRepCompleteMessage = async (
containerName,
caseReference
) => {
const whichQueue = "pedw-submitted-representations";
const queueToken = await createQueueSas(whichQueue);
const sasUrl = `${QUEUE_PATH}?${queueToken}`;
const queueServiceClient = new QueueServiceClient(sasUrl);
const message = {
containerName: containerName,
caseref: caseReference,
reppath: containerName + "/" + caseReference + "/",
filespath: containerName + "/" + caseReference + "/files",
};
const sendMessageResponse = await queueServiceClient
.getQueueClient(whichQueue)
.sendMessage(
JSON.stringify(
`<QueueMessage><MessageText>${JSON.stringify(
message
)}</MessageText></QueueMessage>`
)
);
return sendMessageResponse;
};
actions/index.js
+269 -14
View File
@@ -1,9 +1,5 @@
import axios from "axios";
import https from "https";
import CryptoJS from "crypto-js";
import HmacSHA256 from "crypto-js/hmac-sha256";
import { getFormCollection } from "../components/utils";
import { downloadFile, getCaseBlob } from "./azurestorage";
let BASE_URL;
const port = parseInt(process.env.PORT, 10) || 3000;
@@ -13,6 +9,8 @@ if (process.browser) {
} else {
BASE_URL = process.env.API_ROOT || `http://localhost:${port}`;
}
BASE_URL = process.env.API_ROOT;
const WORDKEY = process.env.HASHKEY;
const cache = {};
@@ -29,13 +27,15 @@ export const consoleLogger = (err) => {
var errStr =
"\n\n/////////////////////////////////////////////////\nServer Error " +
"\n" +
err.response.status +
" : " +
err.response.statusText +
"\nRequest URL: " +
err.response.config.url +
"\nRequest Time: " +
err.response.headers.date +
(err.hasOwnProperty("response")
? err.response.status +
" : " +
err.response.statusText +
"\nRequest URL: " +
err.response.config.url +
"\nRequest Time: " +
err.response.headers.date
: err) +
"\n/////////////////////////////////////////////////\n\n";
return errStr;
};
@@ -582,7 +582,7 @@ export const getPickLists = (whichForm) => {
};
export const getPersonalAccount = (contactid) => {
//console.log(contactid);
console.log(contactid);
return axios
.get(
BASE_URL +
@@ -667,6 +667,17 @@ export const getMyCases = (loggedInUserId) => {
});
};
export const getMyLPACases = (lpaid) => {
return axios
.get(BASE_URL + "/api/endpoint/getmylpacases_api?lpaid=" + lpaid)
.then((res) => {
return res.data;
})
.catch((error) => {
//console.log("API call error", error);
});
};
export const getMyRepresentations = (loggedInUserId) => {
return axios
.get(
@@ -793,12 +804,47 @@ export const getAwaitingSubmissionFromBlob = (containerName) => {
});
};
export const getRepsFromBlob = (containerName) => {
console.log(
"///////////////////////\ngetRepsFromBlob function: " +
containerName +
"\n///////////////////////\n",
BASE_URL +
"/api/file/getrepsblob?container=" +
containerName +
hashAPIPath("/api/file/getrepsblob?container=" + containerName)
);
return axios
.get(
BASE_URL +
"/api/file/getrepsblob?container=" +
containerName +
hashAPIPath("/api/file/getrepsblob?container=" + containerName)
)
.then((res) => {
return res.data;
})
.catch((error) => {
console.log(
"///////////////////////\ngetRepsFromBlob error response: " +
error +
"\n///////////////////////\n"
);
console.log("API call error", error);
});
};
export const getAwaitingSubmissionFromBlobProxy = (containerName) => {
return axios
.get(
BASE_URL +
"/api/file/getawaitingsubmissionfromblob?container=" +
containerName
containerName +
hashAPIPath(
"/api/file/getawaitingsubmissionfromblob?container=" +
containerName
)
)
.then((res) => {
return res.data;
@@ -974,6 +1020,17 @@ export const createNewCaseBlob = (
contactid +
"&containername=" +
containerName;
//+
// hashAPIPath(
// "/api/file/createcase_api?appealTypeId=" +
// appealTypeId +
// "&lpaID=" +
// lpaID +
// "&contactid=" +
// contactid +
// "&containername=" +
// containerName
// );
var config = {
method: "post",
@@ -1228,7 +1285,7 @@ export const uploadFiles = async (
for (let i = 0; i < files.length; i++) {
for (let j = 0; j < files[i].length; j++) {
console.log(files[i][j].name);
console.log("upload files:", files[i][j].name);
formData.append(files[i][j].name, files[i][j]);
}
}
@@ -1253,7 +1310,96 @@ export const uploadFiles = async (
}
};
export const uploadRepFiles = async (
formValues,
filesObj,
containerID,
casefolderID
) => {
let files = filesObj;
//console.log(formValues);
var formData = new FormData();
formData.append("appealData", JSON.stringify(formValues));
formData.append("containerID", containerID);
formData.append("casefolderID", casefolderID);
formData.append("repOrAppeal", true);
// files.forEach((file) => formData.append("files", file));
for (let i = 0; i < files.length; i++) {
for (let j = 0; j < files[i].length; j++) {
console.log("upload rep files:", files[i][j].name);
formData.append(files[i][j].name, files[i][j]);
}
}
//console.log(formData);
var queryUrl = "/api/file/upload";
const config = {
method: "post",
url: queryUrl,
data: formData,
headers: { "content-type": "multipart/form-data" },
};
//console.log(config);
try {
const res = await axios(config);
return res.data;
} catch (error) {
console.log("this serror", error);
}
};
export const generateRepPDF = async (formValues, containerID, casefolderID) => {
//let files = filesObj;
console.log("generateRepPDF function: " + formValues);
// var formData = new FormData();
// formValues.append("appealData", JSON.stringify(formValues));
// formValues.append("containerID", containerID);
// formValues.append("casefolderID", casefolderID);
// Object.assign(formValues, {
// "containerID": containerID,
// "casefolderID": casefolderID,
// });
var queryUrl = "/api/file/generatepdf";
const config = {
method: "post",
url: queryUrl,
data: formValues,
headers: { "content-type": "multipart/form-data" },
};
//console.log(config);
try {
const res = await axios(config);
return res.data;
} catch (error) {
console.log("this serror", error);
}
};
export const getFilesFromBlob = (containerName, casefolderID) => {
console.log(
" get files from blob",
BASE_URL +
"/api/file/getbloblist?container=" +
containerName +
"&casefolderID=" +
casefolderID +
hashAPIPath(
"/api/file/getbloblist?container=" +
containerName +
"&casefolderID=" +
casefolderID
)
);
return axios
.get(
BASE_URL +
@@ -1350,6 +1496,20 @@ export const downloadBlob = (containerName, blobName) => {
};
export const getProgressFromBlob = async (containerName, casereference) => {
console.log(
/////////////////\ngetProgressFromBlob",
BASE_URL +
"/api/file/getprogressobjblob?container=" +
containerName +
"&casefolderID=" +
casereference +
hashAPIPath(
"/api/file/getprogressobjblob?container=" +
containerName +
"&casefolderID=" +
casereference
)
);
try {
const res = await axios.get(
BASE_URL +
@@ -1383,6 +1543,13 @@ export const sendEmail = async (
"personalisation": personalisation,
};
console.log(
"hwewwew: ",
templateId,
emailAddress,
personalisation,
reference
);
var queryUrl = "/api/email/notify";
var config = {
@@ -1426,3 +1593,91 @@ export const getPortalLogin = (emailAddress) => {
return JSON.stringify(error);
});
};
export const createContainerProxy = (containerName) => {
var queryUrl =
"/api/file/setupcontainer?ident=" +
containerName +
hashAPIPath("/api/file/setupcontainer?ident=" + containerName);
return axios
.get(BASE_URL + queryUrl)
.then((res) => res.data)
.catch((error) => {
//console.log(consoleLogger(error));
console.log("thiserror", error);
return JSON.stringify(error);
});
};
export const sendCaseCompleteMessage = async (containerID, caseReference) => {
var queryUrl =
"/api/file/createappealcompletemessage_api?container=" +
containerID +
"&tempcaseref=" +
caseReference;
var config = {
method: "get",
url: queryUrl,
};
//console.log(data);
return axios(config)
.then((res) => {
return res.data;
})
.catch((error) => {
//console.log("API call error", error);
});
};
export const sendCaseCompleteMessageProxy = async (
containerID,
caseReference
) => {
var queryUrl =
"/api/file/createappealcompletemessageproxy_api?container=" +
containerID +
"&tempcaseref=" +
caseReference;
var config = {
method: "get",
url: queryUrl,
};
//console.log(data);
return axios(config)
.then((res) => {
return res.data;
})
.catch((error) => {
//console.log("API call error", error);
});
};
export const sendRepCompleteMessage = async (containerID, caseReference) => {
var queryUrl =
"/api/file/createrepcompletemessage_api?container=" +
containerID +
"&tempcaseref=" +
caseReference;
var config = {
method: "get",
url: queryUrl,
};
//console.log(data);
return axios(config)
.then((res) => {
return res.data;
})
.catch((error) => {
//console.log("API call error", error);
});
};
actions/selectQueryTypes.js
+7 -1
View File
@@ -48,7 +48,13 @@ export const getSelectQuery = (appealTypeName) => {
return "&$select=_pinswg_appellant_value,pinswg_name,pinswg_siteaddressline1,pinswg_siteaddressline2,pinswg_sitepostcode,pinswg_siteaddresstown,_pinswg_associatedlpa_value,pinswg_casedecisiondate,pinswg_dateeventrequested,pinswg_decision,pinswg_finalcommentsduedate,pinswg_otherpartiesstatement,pinswg_procedure,pinswg_questionnaireduedate,pinswg_startdate,pinswg_statementduedate,statuscode,pinswg_starttimeofevent,pinswg_typeofevent";
break;
case "pinswg_planningappeals78s":
return "&$select=_pinswg_appellant_value,pinswg_name,pinswg_siteaddressline1,pinswg_siteaddressline2,pinswg_siteaddresspostcode,pinswg_siteaddresstown,pinswg_casedecisiondate,pinswg_dicision,pinswg_dateeventrequested,pinswg_finalcommentsduedate,pinswg_procedure,pinswg_questionnaireduedate,pinswg_startdate,pinswg_statementduedate,statuscode,pinswg_startdatetimeiftheevent,pinswg_typeofevent";
// console.log(
// "///////////////\n path:",
// process.env.RELAYPATH == "test-pedw-hc"
// );
return process.env.RELAYPATH == "dev-pedw-hc"
? "&$select=_pinswg_appellant_value,pinswg_name,pinswg_siteaddressline1,pinswg_siteaddressline2,pinswg_siteaddresspostcode,pinswg_siteaddresstown,_pinswg_localplanningauthority_value,pinswg_casedecisiondate,pinswg_dicision,pinswg_dateeventrequested,pinswg_finalcommentsduedate,pinswg_procedure,pinswg_questionnaireduedate,pinswg_startdate,pinswg_statementduedate,statuscode,pinswg_startdatetimeiftheevent,pinswg_representation_period_end_date,pinswg_extend_representation_date,pinswg_typeofevent"
: "&$select=_pinswg_appellant_value,pinswg_name,pinswg_siteaddressline1,pinswg_siteaddressline2,pinswg_siteaddresspostcode,pinswg_siteaddresstown,_pinswg_localplanningauthority_value,pinswg_casedecisiondate,pinswg_dicision,pinswg_dateeventrequested,pinswg_finalcommentsduedate,pinswg_procedure,pinswg_questionnaireduedate,pinswg_startdate,pinswg_statementduedate,statuscode,pinswg_startdatetimeiftheevent,pinswg_typeofevent";
break;
case "pinswg_planningconditionss73s79s":
return "&$select=_pinswg_appellant_value,pinswg_name,pinswg_siteaddressline1,pinswg_siteaddressline2,pinswg_siteaddresspostcode,pinswg_siteaddresstown,_pinswg_associatedlpa_value,pinswg_casedecisiondate,pinswg_dateeventrequested,pinswg_decision,pinswg_finalcommentsduedate,pinswg_otherpartiesstatement,pinswg_procedure,pinswg_questionnaireduedate,pinswg_startdate,pinswg_statementduedate,statuscode,pinswg_startdateofevent,pinswg_typeofevent";
components/account/changepassword.js
+56 -58
View File
@@ -95,65 +95,63 @@ const ChangePassword = (props) => {
const [hasErrors, setHasErrors] = useState("");
return (
<>
{passwordUpdated != true ? (
<form onSubmit={handleSubmit(onHandleSubmit)}>
<fieldset className="govuk-fieldset">
<Field
name="newpassword"
id="newpassword"
component={RenderTextfield}
type="password"
className="govuk-input govuk-input--width-20"
validate={[required, minLength(6)]}
label="New password"
/>
<Field
name="confirmpassword"
id="confirmpassword"
component={RenderTextfield}
type="password"
className="govuk-input govuk-input--width-20"
validate={[required, passwordsMustMatch]}
label="Confirm new password"
/>
</fieldset>
return <>
{passwordUpdated != true ? (
<form onSubmit={handleSubmit(onHandleSubmit)}>
<fieldset className="govuk-fieldset">
<Field
name="newpassword"
id="newpassword"
component={RenderTextfield}
type="password"
className="govuk-input govuk-input--width-20"
validate={[required, minLength(6)]}
label="New password"
/>
<Field
name="confirmpassword"
id="confirmpassword"
component={RenderTextfield}
type="password"
className="govuk-input govuk-input--width-20"
validate={[required, passwordsMustMatch]}
label="Confirm new password"
/>
</fieldset>
<div className="govuk-button-group">
<button
type="submit"
className="govuk-button"
data-module="govuk-button"
>
Continue
</button>
<Link
href={
"/myportal?q=" +
props.accountDetails.loggedinUserId
}
>
<a className="govuk-link">Cancel</a>
</Link>
</div>
</form>
) : (
<>
<p className="govuk-body">
<Link
href={
"/myportal?q=" +
props.accountDetails.loggedinUserId
}
>
<a className="govuk-link">Go to My Portal</a>
</Link>
</p>
</>
)}
</>
);
<div className="govuk-button-group">
<button
type="submit"
className="govuk-button"
data-module="govuk-button"
>
Continue
</button>
<Link
href={
"/myportal?q=" +
props.accountDetails.loggedinUserId
}
className="govuk-link">
Cancel
</Link>
</div>
</form>
) : (
<>
<p className="govuk-body">
<Link
href={
"/myportal?q=" +
props.accountDetails.loggedinUserId
}
className="govuk-link">
Go to My Portal
</Link>
</p>
</>
)}
</>;
};
const mapStateToProps = (state) => {
components/account/personaldetails.js
+315 -161
View File
@@ -63,6 +63,142 @@ const RenderTextfield = ({
);
};
const RenderRadioList = ({
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="govuk-radios govuk-radios--small govuk-radios--inline">
{Object.keys(options).map((key, index) => (
<div
className="govuk-radios__item"
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>
</div>
))}
</div>
</fieldset>
</div>
</>
);
};
const RenderPickList = ({
datafieldname,
name,
label,
input,
optionsArr,
meta: { touched, error },
errorMsg,
}) => {
let { t, lang } = useTranslation();
optionsArr = [
t("account:account-preferred-language-english") + ":846040001",
t("account:account-preferred-language-welsh") + ":846040000",
];
return (
<>
<div
className={
touched && error
? "govuk-form-group govuk-form-group--error"
: "govuk-form-group "
}
>
<label className="govuk-label" htmlFor="sort">
{label}
</label>
{touched && error && (
<span
id="passport-issued-error"
className="govuk-error-message"
>
<span className="govuk-visually-hidden">Error:</span>{" "}
{errorMsg}
</span>
)}
<div>
<select
{...input}
className="govuk-select "
id={name}
name={name}
>
<option>Select...</option>
{Object.keys(optionsArr).map((key, index) => {
return (
<option
key={key}
value={optionsArr[key].split(":")[1]}
>
{optionsArr[key].split(":")[0]}
</option>
);
})}
</select>
</div>
</div>
</>
);
};
let PersonalDetails = (props) => {
const {
handleSubmit,
@@ -101,171 +237,189 @@ let PersonalDetails = (props) => {
setPersonalDetailsComplete(true);
};
return (
<>
{props.accountUpdatedComplete == false ? (
props.personalDetailsComplete == false ? (
<form onSubmit={handleSubmit(onHandleSubmit)}>
<fieldset className="govuk-fieldset">
<legend className="govuk-fieldset__legend govuk-fieldset__legend--m">
<h2 className="govuk-fieldset__heading">
About you
</h2>
</legend>
<div className="govuk-form-group ">
<span className="govuk-label ">
Role:{" "}
{
props.props.accountDetails
.accountDetails[
"pinswg_typeofinvolvement@OData.Community.Display.V1.FormattedValue"
]
}
</span>
</div>
<Field
name="firstname"
id="firstname"
component={RenderTextfield}
type="text"
className="govuk-input govuk-input--width-20"
validate={[required]}
label="First name"
errorMsg="Is required"
/>
<Field
name="lastname"
id="lastname"
component={RenderTextfield}
type="text"
className="govuk-input govuk-input--width-20"
validate={[required]}
label="Last name"
errorMsg="Is required"
/>
<Field
name="emailaddress1"
id="emailaddress1"
component={RenderTextfield}
type="email"
className="govuk-input govuk-input--width-20"
validate={[required, email]}
label="Email address"
disabled
/>
<Field
name="telephone1"
id="telephone1"
component={RenderTextfield}
type="number"
className="govuk-input govuk-input--width-20"
validate={[required, phoneNumber]}
label="Telephone"
/>
<Field
name="company"
id="company"
component={RenderTextfield}
type="text"
className="govuk-input govuk-input--width-20"
label="Company/Group"
errorMsg="Is required"
/>
</fieldset>
<fieldset className="govuk-fieldset">
<legend className="govuk-fieldset__legend govuk-fieldset__legend--m">
<h2 className="govuk-fieldset__heading">
What is your address?
</h2>
</legend>
<Field
name="address1_line1"
id="address1_line1"
component={RenderTextfield}
type="text"
className="govuk-input govuk-input--width-20"
label="Address line 1"
validate={[required]}
errorMsg="Is required"
/>
<Field
name="address1_line2"
id="address1_line2"
component={RenderTextfield}
type="text"
className="govuk-input govuk-input--width-20"
label="Address line 2"
errorMsg="Is required"
/>
<Field
name="address1_city"
id="address1_city"
component={RenderTextfield}
type="text"
className="govuk-input govuk-input--width-10"
label="Town/City"
validate={[required]}
errorMsg="Is required"
/>
<Field
name="address1_county"
id="address1_county"
component={RenderTextfield}
type="text"
className="govuk-input govuk-input--width-10"
label="County"
validate={[required]}
errorMsg="Is required"
/>
<Field
name="address1_postalcode"
id="address1_postalcode"
component={RenderTextfield}
type="text"
className="govuk-input govuk-input--width-5"
label="Postcode"
validate={[required]}
errorMsg="Is required"
/>
</fieldset>
<div className="govuk-button-group">
<button
type="submit"
className="govuk-button"
data-module="govuk-button"
>
Continue
</button>
<Link
href={
"/myportal?q=" +
props.props.accountDetails.loggedinUserId
return <>
{props.accountUpdatedComplete == false ? (
props.personalDetailsComplete == false ? (
<form onSubmit={handleSubmit(onHandleSubmit)}>
<fieldset className="govuk-fieldset">
<legend className="govuk-fieldset__legend govuk-fieldset__legend--m">
<h2 className="govuk-fieldset__heading">
{t("account:account-about-you-label")}
</h2>
</legend>
<div className="govuk-form-group ">
<span className="govuk-label ">
{t("account:account-role-label")}:{" "}
{
props.props.accountDetails
.accountDetails[
"pinswg_typeofinvolvement@OData.Community.Display.V1.FormattedValue"
]
}
>
<a className="govuk-link">Cancel</a>
</Link>
</span>
</div>
</form>
) : (
<>
<BuildCheckPersonalDetails
props={props}
setPersonalDetailsComplete={
setPersonalDetailsComplete
}
setAccountUpdatedComplete={
setAccountUpdatedComplete
}
<Field
name="pinswg_preferredlanguage"
component={RenderPickList}
datafieldname="pinswg_preferredlanguage"
optionsArr={["English", "Welsh"]}
className="govuk-input govuk-input--width-20 govuk-radios--inline"
validate={[required]}
label={t(
"account:account-preferred-language-label"
)}
errorMsg="Is required"
/>
</>
)
<Field
name="firstname"
id="firstname"
component={RenderTextfield}
type="text"
className="govuk-input govuk-input--width-20"
validate={[required]}
label={t("account:account-first-name-label")}
errorMsg="Is required"
/>
<Field
name="lastname"
id="lastname"
component={RenderTextfield}
type="text"
className="govuk-input govuk-input--width-20"
validate={[required]}
label={t("account:account-last-name-label")}
errorMsg="Is required"
/>
<Field
name="emailaddress1"
id="emailaddress1"
component={RenderTextfield}
type="email"
className="govuk-input govuk-input--width-20"
validate={[required, email]}
label={t("account:account-email-address-label")}
disabled
/>
<Field
name="telephone1"
id="telephone1"
component={RenderTextfield}
type="number"
className="govuk-input govuk-input--width-20"
validate={[required, phoneNumber]}
label={t("account:account-telephone-label")}
/>
<Field
name="company"
id="company"
component={RenderTextfield}
type="text"
className="govuk-input govuk-input--width-20"
label={t("account:account-company-group-label")}
errorMsg="Is required"
/>
</fieldset>
<fieldset className="govuk-fieldset">
<legend className="govuk-fieldset__legend govuk-fieldset__legend--m">
<h2 className="govuk-fieldset__heading">
{t("account:account-your-address-label")}
</h2>
</legend>
<Field
name="address1_line1"
id="address1_line1"
component={RenderTextfield}
type="text"
className="govuk-input govuk-input--width-20"
label={t(
"account:account-address-line-1-label"
)}
validate={[required]}
errorMsg="Is required"
/>
<Field
name="address1_line2"
id="address1_line2"
component={RenderTextfield}
type="text"
className="govuk-input govuk-input--width-20"
label={t(
"account:account-address-line-2-label"
)}
errorMsg="Is required"
/>
<Field
name="address1_city"
id="address1_city"
component={RenderTextfield}
type="text"
className="govuk-input govuk-input--width-10"
label={t("account:account-town-city-label")}
validate={[required]}
errorMsg="Is required"
/>
<Field
name="address1_county"
id="address1_county"
component={RenderTextfield}
type="text"
className="govuk-input govuk-input--width-10"
label={t("account:account-county-label")}
validate={[required]}
errorMsg="Is required"
/>
<Field
name="address1_postalcode"
id="address1_postalcode"
component={RenderTextfield}
type="text"
className="govuk-input govuk-input--width-5"
label={t("account:account-postcode-label")}
validate={[required]}
errorMsg="Is required"
/>
</fieldset>
<div className="govuk-button-group">
<button
type="submit"
className="govuk-button"
data-module="govuk-button"
>
{t("common:continue-button")}
</button>
<Link
href={
"/myportal?q=" +
props.props.accountDetails.loggedinUserId
}
className="govuk-link">
{t("common:cancel-link")}
</Link>
</div>
</form>
) : (
<PersonalDetailsComplete props={props} />
)}
</>
);
<>
<BuildCheckPersonalDetails
props={props}
setPersonalDetailsComplete={
setPersonalDetailsComplete
}
setAccountUpdatedComplete={
setAccountUpdatedComplete
}
/>
</>
)
) : (
<PersonalDetailsComplete props={props} />
)}
</>;
};
const mapStateToProps = (state) => {
components/account/personaldetailsCheck.js
+323 -264
View File
@@ -25,272 +25,331 @@ const BuildCheckPersonalDetails = (props) => {
const router = useRouter();
const { locale } = router;
return (
<>
<h2 className="govuk-heading-m">About you</h2>
<dl className="govuk-summary-list govuk-!-margin-bottom-9">
<div className="govuk-summary-list__row">
<dt className="govuk-summary-list__key">First name</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);
}}
>
Change
<span className="govuk-visually-hidden">
first name
</span>
</a>
</dd>
</div>
<div className="govuk-summary-list__row">
<dt className="govuk-summary-list__key">Last name</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);
}}
>
Change
<span className="govuk-visually-hidden">
{" "}
last name
</span>
</a>
</dd>
</div>
<div className="govuk-summary-list__row">
<dt className="govuk-summary-list__key">Email address</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);
}}
>
Change
<span className="govuk-visually-hidden">
{" "}
email address
</span>
</a>
</dd>
</div>
<div className="govuk-summary-list__row">
<dt className="govuk-summary-list__key">Telephone</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);
}}
>
Change
<span className="govuk-visually-hidden">
telephone
</span>
</a>
</dd>
</div>
<div className="govuk-summary-list__row">
<dt className="govuk-summary-list__key">Company/Group</dt>
<dd className="govuk-summary-list__value">
{
props.props.props.form.personalDetailsForm.values
.company
}
</dd>
<dd className="govuk-summary-list__actions">
<a
className="govuk-link"
href="#company"
onClick={() => {
setPersonalDetailsComplete(false);
}}
>
Change
<span className="govuk-visually-hidden">
{" "}
company/group
</span>
</a>
</dd>
</div>
</dl>
<dl className="govuk-summary-list govuk-!-margin-bottom-9">
<h2 className="govuk-heading-m">Your address</h2>
const getPreferredLanguageLabel = (id) => {
return id == 846040001
? t("account:account-preferred-language-english")
: t("account:account-preferred-language-welsh");
};
<div className="govuk-summary-list__row">
<dt className="govuk-summary-list__key">Address Line 1</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);
}}
>
Change
<span className="govuk-visually-hidden">
{" "}
address line 1
</span>
</a>
</dd>
</div>
<div className="govuk-summary-list__row">
<dt className="govuk-summary-list__key">Address line 2</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);
}}
>
Change
<span className="govuk-visually-hidden">
{" "}
address line 2
</span>
</a>
</dd>
</div>
<div className="govuk-summary-list__row">
<dt className="govuk-summary-list__key">Town/City</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);
}}
>
Change
<span className="govuk-visually-hidden">
{" "}
town/city
</span>
</a>
</dd>
</div>
<div className="govuk-summary-list__row">
<dt className="govuk-summary-list__key">County</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);
}}
>
Change
<span className="govuk-visually-hidden">
{" "}
county
</span>
</a>
</dd>
</div>
<div className="govuk-summary-list__row">
<dt className="govuk-summary-list__key">Postcode</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);
}}
>
Change
<span className="govuk-visually-hidden">
{" "}
postcode
</span>
</a>
</dd>
</div>
</dl>
<div className="govuk-button-group">
<button
type="submit"
className="govuk-button"
data-module="govuk-button"
onClick={() => {
setAccountUpdatedComplete(true);
}}
>
Continue
</button>
<Link
href={"/myportal?q=" + props.accountDetails.loggedinUserId}
>
<a className="govuk-link">Cancel</a>
</Link>
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
.company
}
</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) => {
components/account/personaldetailsComplete.js
+14 -17
View File
@@ -40,25 +40,22 @@ const PersonalDetailsComplete = (props) => {
props.props.props.form.personalDetailsForm.values,
]);
return (
<>
<p className="govuk-body">Your details have been updated</p>
return <>
<p className="govuk-body">{t("account:account-complete-para-1")}</p>
<p className="govuk-body">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi a
metus non quam mollis egestas. Integer ac leo cursus, laoreet
nulla sed, tempus tellus. Mauris condimentum erat arcu.
</p>
<p className="govuk-body">{t("account:account-complete-para-2")}</p>
<p className="govuk-body">
<Link
href={"/myportal?q=" + props.accountDetails.loggedinUserId}
>
<a className="govuk-link">Return to My Portal</a>
</Link>
</p>
</>
);
<p className="govuk-body">
<Link
href={"/myportal?q=" + props.accountDetails.loggedinUserId}
className="govuk-link">
{" "}
{t("account:account-complete-return-to-portal-link")}
</Link>
</p>
</>;
};
const mapStateToProps = (state) => {
components/account/registerComplete.js
+25 -16
View File
@@ -78,7 +78,7 @@ const RegisterComplete = (props) => {
var registerBody = "";
switch (props.accountDetails.accCr) {
case "created":
return (registerBody = (
return registerBody = (
<>
<p className="govuk-body">
{t("account:register-new-account-confirmation-email")}
@@ -95,24 +95,33 @@ const RegisterComplete = (props) => {
</p>
<p className="govuk-body">
<Link href="/">
<a
className="govuk-link"
onClick={() => {
setLogout(),
window.localStorage.clear(),
destroyCookie({}, "pinsUser"),
signOut({ callbackUrl: "/logout" });
}}
>
{t(
"account:register-new-account-my-portal-link"
)}
</a>
<Link
href="/"
className="govuk-link"
onClick={() => {
setLogout(),
window.localStorage.clear(),
destroyCookie(
null,
"next-auth.csrf-token"
),
destroyCookie(
null,
"next-auth.callback-url"
),
destroyCookie(null, "pedw_locale"),
destroyCookie(null, "pinsUser"),
signOut({ callbackUrl: "/logout" });
}}>
{t(
"account:register-new-account-my-portal-link"
)}
</Link>
</p>
</>
));
);
break;
components/breadcrumbs.js
+174 -162
View File
@@ -4,7 +4,7 @@ import _ from "lodash";
import { useState } from "react";
import { useRouter } from "next/router";
import useTranslation from "next-translate/useTranslation";
import LoadingOverlay from "react-loading-overlay";
import { getSession, useSession } from "next-auth/react";
const Breadcrumbs = (props) => {
@@ -61,17 +61,18 @@ const Breadcrumbs = (props) => {
<div className="govuk-breadcrumbs ">
<ol className="govuk-breadcrumbs__list">
{/* <li className="govuk-breadcrumbs__list-item">
<Link href={t("common:gov-wales-link")}>
<a className="govuk-breadcrumbs__link">
{t("common:gov-wales-label")}
</a>
</Link>
</li> */}
<Link href={t("common:gov-wales-link")}>
<a className="govuk-breadcrumbs__link">
{t("common:gov-wales-label")}
</a>
</Link>
</li> */}
<li className="govuk-breadcrumbs__list-item">
<Link href={"/"}>
<a className="govuk-breadcrumbs__link">
{t("common:service-name-breadcrumb")}
</a>
<Link
href={"/"}
className="govuk-breadcrumbs__link"
>
{t("common:service-name-breadcrumb")}
</Link>
</li>
{router.pathname == "/myportal" ? (
@@ -84,17 +85,18 @@ const Breadcrumbs = (props) => {
{router.pathname == "/myportal/searchresults" ? (
<>
<li className="govuk-breadcrumbs__list-item">
<Link
<a
href={
router.locale != "en"
? router.locale + "/myportal"
? "/" +
router.locale +
"/fymhorth"
: "/myportal"
}
className="govuk-breadcrumbs__link"
>
<a className="govuk-breadcrumbs__link">
{t("common:breadcrumb-my-portal")}
</a>
</Link>
{t("common:breadcrumb-my-portal")}
</a>
</li>
<li className="govuk-breadcrumbs__list-item">
{t("common:breadcrumb-search-results")}
@@ -127,13 +129,14 @@ const Breadcrumbs = (props) => {
<Link
href={
router.locale != "en"
? router.locale + "/myportal"
? "/" +
router.locale +
"/fymhorth"
: "/myportal"
}
className="govuk-breadcrumbs__link"
>
<a className="govuk-breadcrumbs__link">
{t("common:breadcrumb-my-portal")}
</a>
{t("common:breadcrumb-my-portal")}
</Link>
</li>
<li className="govuk-breadcrumbs__list-item">
@@ -154,12 +157,9 @@ const Breadcrumbs = (props) => {
"/advancedsearch"
: "/advancedsearch"
}
className="govuk-breadcrumbs__link"
>
<a className="govuk-breadcrumbs__link">
{t(
"common:breadcrumb-advanced-search"
)}
</a>
{t("common:breadcrumb-advanced-search")}
</Link>
</li>
<li className="govuk-breadcrumbs__list-item">
@@ -178,13 +178,14 @@ const Breadcrumbs = (props) => {
<Link
href={
router.locale != "en"
? router.locale + "/myportal"
? "/" +
router.locale +
"/fymhorth"
: "/myportal"
}
className="govuk-breadcrumbs__link"
>
<a className="govuk-breadcrumbs__link">
{t("common:breadcrumb-my-portal")}
</a>
{t("common:breadcrumb-my-portal")}
</Link>
</li>
<li className="govuk-breadcrumbs__list-item">
@@ -195,12 +196,9 @@ const Breadcrumbs = (props) => {
"/myportal/advancedsearch"
: "/myportal/advancedsearch"
}
className="govuk-breadcrumbs__link"
>
<a className="govuk-breadcrumbs__link">
{t(
"common:breadcrumb-advanced-search"
)}
</a>
{t("common:breadcrumb-advanced-search")}
</Link>
</li>
<li className="govuk-breadcrumbs__list-item">
@@ -218,13 +216,14 @@ const Breadcrumbs = (props) => {
<Link
href={
router.locale != "en"
? router.locale + "/myportal"
? "/" +
router.locale +
"/fymhorth"
: "/myportal"
}
className="govuk-breadcrumbs__link"
>
<a className="govuk-breadcrumbs__link">
{t("newappeal:parent-page-title")}
</a>
{t("newappeal:parent-page-title")}
</Link>
</li>
<li className="govuk-breadcrumbs__list-item">
@@ -240,13 +239,14 @@ const Breadcrumbs = (props) => {
<Link
href={
router.locale != "en"
? router.locale + "/myportal"
? "/" +
router.locale +
"/fymhorth"
: "/myportal"
}
className="govuk-breadcrumbs__link"
>
<a className="govuk-breadcrumbs__link">
{t("newappeal:parent-page-title")}
</a>
{t("newappeal:parent-page-title")}
</Link>
</li>
<li className="govuk-breadcrumbs__list-item">
@@ -262,13 +262,14 @@ const Breadcrumbs = (props) => {
<Link
href={
router.locale != "en"
? router.locale + "/myportal"
? "/" +
router.locale +
"/fymhorth"
: "/myportal"
}
className="govuk-breadcrumbs__link"
>
<a className="govuk-breadcrumbs__link">
{t("newappeal:parent-page-title")}
</a>
{t("newappeal:parent-page-title")}
</Link>
</li>
<li className="govuk-breadcrumbs__list-item">
@@ -287,26 +288,28 @@ const Breadcrumbs = (props) => {
<Link
href={
router.locale != "en"
? router.locale + "/myportal"
? "/" +
router.locale +
"/fymhorth"
: "/myportal"
}
className="govuk-breadcrumbs__link"
>
<a className="govuk-breadcrumbs__link">
{t("newappeal:parent-page-title")}
</a>
{t("newappeal:parent-page-title")}
</Link>
</li>
<li className="govuk-breadcrumbs__list-item">
<Link
href={
router.locale != "en"
? router.locale + "/myportal"
? "/" +
router.locale +
"/fymhorth"
: "/myportal"
}
className="govuk-breadcrumbs__link"
>
<a className="govuk-breadcrumbs__link">
{t("newappeal:page-title")}
</a>
{t("newappeal:page-title")}
</Link>
</li>
<li className="govuk-breadcrumbs__list-item">
@@ -322,17 +325,18 @@ const Breadcrumbs = (props) => {
<Link
href={
router.locale != "en"
? router.locale + "/myportal"
? "/" +
router.locale +
"/fymhorth"
: "/myportal"
}
className="govuk-breadcrumbs__link"
>
<a className="govuk-breadcrumbs__link">
{t("common:breadcrumb-my-portal")}
</a>
{t("common:breadcrumb-my-portal")}
</Link>
</li>
<li className="govuk-breadcrumbs__list-item">
Your cases
{t("common:breadcrumb-your-cases")}
</li>
</>
) : (
@@ -346,13 +350,12 @@ const Breadcrumbs = (props) => {
router.locale != "en"
? "/" +
router.locale +
"/myportal"
"/fymhorth"
: "/myportal"
}
className="govuk-breadcrumbs__link"
>
<a className="govuk-breadcrumbs__link">
{t("common:breadcrumb-my-portal")}
</a>
{t("common:breadcrumb-my-portal")}
</Link>
</li>
<li className="govuk-breadcrumbs__list-item">
@@ -381,26 +384,28 @@ const Breadcrumbs = (props) => {
<Link
href={
router.locale != "en"
? router.locale + "/myportal"
? "/" +
router.locale +
"/fymhorth"
: "/myportal"
}
className="govuk-breadcrumbs__link"
>
<a className="govuk-breadcrumbs__link">
{t("common:breadcrumb-my-portal")}
</a>
{t("common:breadcrumb-my-portal")}
</Link>
</li>
<li className="govuk-breadcrumbs__list-item">
<Link
href={
router.locale != "en"
? router.locale + "/viewall"
: "/viewall"
? "/" +
router.locale +
"/fymhorth/gweldpopeth"
: "/myportal/viewall"
}
className="govuk-breadcrumbs__link"
>
<a className="govuk-breadcrumbs__link">
Your cases{" "}
</a>
{t("common:breadcrumb-your-cases")}
</Link>
</li>
<li className="govuk-breadcrumbs__list-item">
@@ -422,13 +427,14 @@ const Breadcrumbs = (props) => {
<Link
href={
router.locale != "en"
? router.locale + "/myportal"
? "/" +
router.locale +
"/fymhorth"
: "/myportal"
}
className="govuk-breadcrumbs__link"
>
<a className="govuk-breadcrumbs__link">
{t("common:breadcrumb-my-portal")}
</a>
{t("common:breadcrumb-my-portal")}
</Link>
</li>
<li className="govuk-breadcrumbs__list-item">
@@ -444,20 +450,22 @@ const Breadcrumbs = (props) => {
<Link
href={
router.locale != "en"
? router.locale + "/myportal"
? "/" +
router.locale +
"/fymhorth"
: "/myportal"
}
className="govuk-breadcrumbs__link"
>
<a className="govuk-breadcrumbs__link">
{t("common:breadcrumb-my-portal")}
</a>
{t("common:breadcrumb-my-portal")}
</Link>
</li>
<li className="govuk-breadcrumbs__list-item">
<Link href={"/myportal/dnsapplications"}>
<a className="govuk-breadcrumbs__link">
{t("dnsCommon:service-name")}
</a>
<Link
href={"/myportal/dnsapplications"}
className="govuk-breadcrumbs__link"
>
{t("dnsCommon:service-name")}
</Link>
</li>
<li className="govuk-breadcrumbs__list-item">
@@ -486,18 +494,13 @@ const Breadcrumbs = (props) => {
props.props.search
.searchString
}
onClick={() => {
// spinnerState();
router.back();
}}
className="govuk-breadcrumbs__link"
>
<a
onClick={() => {
// spinnerState();
router.back();
}}
className="govuk-breadcrumbs__link"
>
{t(
"common:breadcrumb-search-results"
)}
</a>
{t("common:breadcrumb-search-results")}
</Link>
</li>
<li className="govuk-breadcrumbs__list-item">
@@ -518,21 +521,36 @@ const Breadcrumbs = (props) => {
<Link
href={
router.locale != "en"
? router.locale +
? "/" +
router.locale +
"/myportal"
: "/myportal"
}
className="govuk-breadcrumbs__link"
>
<a className="govuk-breadcrumbs__link">
{t(
"common:breadcrumb-my-portal"
)}
</a>
{t("common:breadcrumb-my-portal")}
</Link>
</li>
)}
<li className="govuk-breadcrumbs__list-item">
Make representation for:{" "}
<Link
href={
router.locale != "en"
? router.locale + "/case"
: "/case"
}
className="govuk-breadcrumbs__link"
>
{
props.props.currentView
.caseReference.currentReference
}
</Link>
</li>
<li className="govuk-breadcrumbs__list-item">
{t(
"myrepresentations:make-a-representation-for-label"
)}{" "}
{
props.props.currentView.caseReference
.currentReference
@@ -548,17 +566,18 @@ const Breadcrumbs = (props) => {
<Link
href={
router.locale == "cy"
? router.locale + "/myportal"
? "/" +
router.locale +
"/fymhorth"
: "/myportal"
}
className="govuk-breadcrumbs__link"
>
<a className="govuk-breadcrumbs__link">
{t("common:breadcrumb-my-portal")}
</a>
{t("common:breadcrumb-my-portal")}
</Link>
</li>
<li className="govuk-breadcrumbs__list-item">
Your account
{t("account:account-title")}
</li>
</>
) : (
@@ -579,13 +598,14 @@ const Breadcrumbs = (props) => {
<Link
href={
router.locale == "cy"
? router.locale + "/myportal"
? "/" +
router.locale +
"/fymhorth"
: "/myportal"
}
className="govuk-breadcrumbs__link"
>
<a className="govuk-breadcrumbs__link">
{t("common:breadcrumb-my-portal")}
</a>
{t("common:breadcrumb-my-portal")}
</Link>
</li>
<li className="govuk-breadcrumbs__list-item">
@@ -613,10 +633,9 @@ const Breadcrumbs = (props) => {
? router.locale + "/../../dns"
: "/../../dns"
}
className="govuk-breadcrumbs__link"
>
<a className="govuk-breadcrumbs__link">
{t("dnsCommon:service-name")}
</a>
{t("dnsCommon:service-name")}
</Link>
</li>
<li className="govuk-breadcrumbs__list-item">
@@ -649,10 +668,9 @@ const Breadcrumbs = (props) => {
"/dnsapplications"
: "/dnsapplications"
}
className="govuk-breadcrumbs__link"
>
<a className="govuk-breadcrumbs__link">
{t("dnsCommon:service-name")}
</a>
{t("dnsCommon:service-name")}
</Link>
</li>
<li className="govuk-breadcrumbs__list-item">
@@ -712,12 +730,11 @@ const Breadcrumbs = (props) => {
"/dns/applications"
: "/dns/applications"
}
className="govuk-breadcrumbs__link"
>
<a className="govuk-breadcrumbs__link">
{t(
"dnsApplicationView:page-parent-title"
)}
</a>
{t(
"dnsApplicationView:page-parent-title"
)}
</Link>
</li>
<li className="govuk-breadcrumbs__list-item">
@@ -793,50 +810,45 @@ const Breadcrumbs = (props) => {
""
)}
{/* {!_.isEmpty(slug) ? (
<>
<li className="govuk-breadcrumbs__list-item">
<Link
href={
router.locale != "en"
? router.locale + "/myportal"
: "/myportal"
}
>
<a className="govuk-breadcrumbs__link">
{t("common:breadcrumb-my-portal")}
</a>
</Link>
</li>
<li className="govuk-breadcrumbs__list-item">
<Link
href={
router.locale == "cy"
? router.locale + "/apêlnewydd"
: "/newappeal"
}
>
<a className="govuk-breadcrumbs__link">
{t("common:breadcrumb-new-appeal")}
</a>
</Link>
</li>
<li className="govuk-breadcrumbs__list-item">
{props.formTitle}
</li>
</>
) : (
""
)} */}
<>
<li className="govuk-breadcrumbs__list-item">
<Link
href={
router.locale != "en"
? "/" + router.locale +"/fymhorth"
: "/myportal"
}
>
<a className="govuk-breadcrumbs__link">
{t("common:breadcrumb-my-portal")}
</a>
</Link>
</li>
<li className="govuk-breadcrumbs__list-item">
<Link
href={
router.locale == "cy"
? router.locale + "/apêlnewydd"
: "/newappeal"
}
>
<a className="govuk-breadcrumbs__link">
{t("common:breadcrumb-new-appeal")}
</a>
</Link>
</li>
<li className="govuk-breadcrumbs__list-item">
{props.formTitle}
</li>
</>
) : (
""
)} */}
<Breadcrumb />
</ol>
</div>
</nav>
{/* <LoadingOverlay
active={showSpinnerState}
spinner
text={t("common:spinner-searching")}
/> */}
</>
);
};
components/case.js
+1 -1
View File
@@ -45,7 +45,7 @@ const Case = (props) => {
searchDetailsObj={props.searchDetailsObj}
documentDetailsObj={props.documentDetailsObj}
/>
{showRepresentations == "true" && (
{showRepresentations == true && (
<RepresentationList
incidentid={props.incidentid}
caseReference={props.caseReference}
components/case/documents.js
+76 -107
View File
@@ -1,29 +1,21 @@
import jsonpath from "jsonpath";
import useTranslation from "next-translate/useTranslation";
import Link from "next/link";
import { useRouter } from "next/router";
import useTranslation from "next-translate/useTranslation";
import jsonpath from "jsonpath";
import { useState, useEffect, useRef, useCallback } from "react";
import { useDispatch, useSelector, shallowEqual, connect } from "react-redux";
import { useCallback, useEffect, useRef, useState } from "react";
import { connect } from "react-redux";
import transLookup from "../../data/lookuptranslations.json";
import { formatDates } from "../utils";
import PaginationControl from "./pagination";
import LoadingOverlay from "react-loading-overlay";
import CryptoJS from "crypto-js";
import { setCurrentPage } from "../../store/currentView/action";
import {
getBasicSearch,
getBasicSearchDetails,
getSearchDocumentDetails,
getSearchDocumentDetailsPaged,
getSearchDocumentTypes,
} from "../../actions";
import { setCurrentPage } from "../../store/currentView/action";
import {
setSearchResults,
setSearchDetails,
setDocumentDetails,
getSearchResultsObj,
} from "../../store/searchOutput/action";
import { setDocumentDetails } from "../../store/searchOutput/action";
const DocumentDetails = (props) => {
let { t } = useTranslation();
@@ -204,8 +196,8 @@ const DocumentDetails = (props) => {
</button>
</dd>
{/* <dd className="govuk-summary-list__key govuk-!-font-size-16">
{t("case:documents-size-label")}
</dd> */}
{t("case:documents-size-label")}
</dd> */}
</div>
{showSpinnerState == true ? (
<div className="govuk-summary-list__row">
@@ -240,41 +232,33 @@ const DocumentDetails = (props) => {
{showDownloadingState === key && (
<div className="coverLoadingLink downloading">
{/* <img
className="data-loading-icon"
src="/assets/images/loading.gif"
alt={
router.locale ==
"cy"
? "Nôl data"
: "Fetching data"
}
/> */}
className="data-loading-icon"
src="/assets/images/loading.gif"
alt={
router.locale ==
"cy"
? "Nôl data"
: "Fetching data"
}
/> */}
</div>
)}
<Link
scroll={false}
href={detailsObj.pinswg_hashlink}
key={key}
onClick={() => {
toggleDownLoadLink(key);
}}
>
<a
key={key}
onClick={() => {
toggleDownLoadLink(key);
}}
>
<span className="results-visually-hidden">
{t(
"case:documents-name-label"
)}
:
</span>
{_.has(
detailsObj,
"pinswg_name"
)
? detailsObj.pinswg_name
: ""}
</a>
<span className="results-visually-hidden">
{t("case:documents-name-label")}
:
</span>
{_.has(detailsObj, "pinswg_name")
? detailsObj.pinswg_name
: ""}
</Link>
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
@@ -317,11 +301,11 @@ const DocumentDetails = (props) => {
: ""}
</dd>
{/* <dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t("case:documents-size-label")}:
</span>
92
</dd> */}
<span className="results-visually-hidden">
{t("case:documents-size-label")}:
</span>
92
</dd> */}
</div>
);
})
@@ -340,49 +324,6 @@ const DocumentDetails = (props) => {
);
};
useEffect(() => {
getDocumentTypes();
if (selectedOption) {
setShowSpinnerState(true);
getDocumentResults(1, orderByState, fieldSortState);
}
if (selectedDocumentType) {
setShowSpinnerState(true);
getDocumentResults(
1,
orderByState,
fieldSortState,
selectedDocumentType
);
}
const docDetailsObj = async () => {
let docObj = await getSearchDocumentDetails(incidentid).then(
(data) => {
//console.log(data);
setDocumentDetails(data);
setDocumentSearchState(true);
return data;
}
);
return docObj;
};
const searchDocumentResultsObj = docDetailsObj();
}, [
incidentid,
setDocumentDetails,
selectedOption,
selectedDocumentType,
fieldSortState,
orderByState,
getDocumentTypes,
getDocumentResults,
]);
const getDocumentTypes = useCallback(() => {
getSearchDocumentTypes(props.incidentid).then((data) => {
setDocumentTypes(data);
@@ -429,15 +370,6 @@ const DocumentDetails = (props) => {
return docObj;
};
function formatDates(dateObj) {
var dateObj = new Date(dateObj);
var dd = String(dateObj.getDate()).padStart(2, "0");
var mm = String(dateObj.getMonth() + 1).padStart(2, "0"); //January is 0!
var yyyy = dateObj.getFullYear();
return dd + "/" + mm + "/" + yyyy;
}
const pagesCount = Math.ceil(documentDetailsObj["@odata.count"] / 10);
let currentPage = 0;
@@ -504,6 +436,48 @@ const DocumentDetails = (props) => {
setShowSpinnerState(true);
};
useEffect(() => {
getDocumentTypes();
if (selectedOption) {
setShowSpinnerState(true);
getDocumentResults(1, orderByState, fieldSortState);
}
if (selectedDocumentType) {
setShowSpinnerState(true);
getDocumentResults(
1,
orderByState,
fieldSortState,
selectedDocumentType
);
}
const docDetailsObj = async () => {
let docObj = await getSearchDocumentDetails(incidentid).then(
(data) => {
//console.log(data);
setDocumentDetails(data);
setDocumentSearchState(true);
return data;
}
);
return docObj;
};
const searchDocumentResultsObj = docDetailsObj();
}, [
incidentid,
setDocumentDetails,
selectedOption,
selectedDocumentType,
fieldSortState,
orderByState,
getDocumentTypes,
getDocumentResults,
]);
return (
<>
<div>
@@ -528,11 +502,6 @@ const DocumentDetails = (props) => {
</div>
</div>
</div>
{/* <LoadingOverlay
active={showSpinnerState}
spinner
text={t("common:spinner-searching")}
/> */}
</>
);
};
components/case/representation/index copy.js
-212
View File
@@ -1,212 +0,0 @@
import Link from "next/link";
import { useState, useEffect } from "react";
import { useRouter } from "next/router";
import useTranslation from "next-translate/useTranslation";
import jsonpath from "jsonpath";
import _ from "lodash";
import { Field, FieldArray, reduxForm, formValueSelector } from "redux-form";
import { connect } from "react-redux";
import { useDropzone } from "react-dropzone";
import { setRepresentationCapacity } from "../../../store/currentView/action";
import RepCapacitySelection from "./representationCapacitySelection";
import RepDetails from "./representationDetails";
import RepAppellant from "./representationAppellant";
import RepAgent from "./representationAgent";
import RepInterestedPartyPerson from "./representationInterestedPartyPerson";
import RepLandOwner from "./representationLandowner";
import {
RenderPickList,
RenderRadioList,
RenderTextfield,
} from "./representationElements";
let MakeRepresentation = (props) => {
let { t } = useTranslation();
const { acceptedFiles, getRootProps, getInputProps } = useDropzone();
const [clearRepForm, setClearRepForm] = useState(false);
const router = useRouter();
const { locale } = router;
const {
caseReference,
myCases,
myRepresentations,
watchedCases,
awaitingSubmission,
searchResultsObj,
currentType,
currentView,
setRepresentationCapacity,
} = props;
const formObj = props.props.form;
let setCaseQueryObj = props[currentType];
var casesObj = {};
currentType == "searchResultsObj"
? (casesObj = jsonpath.query(
setCaseQueryObj,
'$..[?(@.title=="' + caseReference + '")]'
))
: (casesObj = jsonpath.query(
setCaseQueryObj,
'$..[?(@.reference=="' + caseReference + '")]'
));
casesObj = Object.assign({}, ...casesObj);
const capacityOptionsArr = [
"Appellant",
"Agent",
"Interested Party/Person",
"Land Owner",
];
const appellantApplicantRepresentationArr = [
"Other",
"Statement",
"Statement of common ground",
"Written statement of evidence",
];
const interestedPersonRepresentationArr = [
"Interested Party/Person correspondence",
];
const landOwnerRepresentationArr = [
"Other",
"Statement",
"Written statement of evidence",
];
const repCapacityType = () => {
currentView.representationCapacity == false
? false
: _.isEmpty(formObj["representationForm"])
? false
: _.isEmpty(formObj["representationForm"].values)
? false
: _.isEmpty(
formObj["representationForm"].values.representationCapacity
)
? setRepresentationCapacity(false)
: setRepresentationCapacity(
formObj["representationForm"].values.representationCapacity
.replace(/(\band|[\s\-\+\(\)\,\&])/g, "")
.toLowerCase()
);
return currentView.representationCapacity;
};
const whichControl = () => {
repCapacityType();
switch (currentView.representationCapacity) {
case false:
return (
<RepCapacitySelection
formObj={formObj}
capacityOptionsArr={capacityOptionsArr}
currentType={currentType}
casesObj={casesObj}
setRepresentationCapacity={setRepresentationCapacity}
/>
);
break;
case "appellant":
setRepresentationCapacity("appellant");
return (
<RepAppellant
formObj={formObj}
appellantApplicantRepresentationArr={
appellantApplicantRepresentationArr
}
setRepresentationCapacity={setRepresentationCapacity}
/>
);
break;
case "agent":
setRepresentationCapacity("agent");
return (
<RepAgent
formObj={formObj}
appellantApplicantRepresentationArr={
appellantApplicantRepresentationArr
}
setRepresentationCapacity={setRepresentationCapacity}
/>
);
break;
case "interestedpartyperson":
setRepresentationCapacity("interestedpartyperson");
return (
<RepInterestedPartyPerson
formObj={formObj}
interestedPersonRepresentationArr={
interestedPersonRepresentationArr
}
setRepresentationCapacity={setRepresentationCapacity}
/>
);
break;
case "landowner":
setRepresentationCapacity("landowner");
return (
<RepLandOwner
formObj={formObj}
landOwnerRepresentationArr={landOwnerRepresentationArr}
setRepresentationCapacity={setRepresentationCapacity}
/>
);
break;
default:
return (
<RepCapacitySelection
formObj={formObj}
capacityOptionsArr={capacityOptionsArr}
currentType={currentType}
casesObj={casesObj}
setRepresentationCapacity={setRepresentationCapacity}
/>
);
}
};
return (
<div>
{whichControl()} - {props.firstValue}
</div>
);
};
const mapStateToProps = (state) => {
return {
search: state.search,
searchResultsObj: state.searchResultsObj,
formData: state.formData,
appealType: state.appealType,
currentView: state.currentView,
//form: state.form,
};
};
const mapDispatchToProps = (dispatch) => {
return {
setRepresentationCapacity: (representationCapacity) => {
dispatch(setRepresentationCapacity(representationCapacity));
},
};
};
const selector = formValueSelector("representationForm");
export default connect(
mapStateToProps,
mapDispatchToProps
)(
reduxForm({
form: "representationForm",
destroyOnUnmount: false,
})(MakeRepresentation)
);
components/case/representation/index.js
+1042 -139
View File
File diff suppressed because it is too large Load Diff
components/case/representation/representationAgent.js
+154 -182
View File
@@ -1,4 +1,5 @@
import Link from "next/link";
import { connect } from "react-redux";
import { useRouter } from "next/router";
import useTranslation from "next-translate/useTranslation";
import { Field, reduxForm } from "redux-form";
@@ -7,11 +8,16 @@ import {
RenderTextfield,
RenderRadioList,
RenderMultiline,
RenderRichMultiline,
RenderCondtionalRadioList,
FileUploadField,
} from "./representationElements";
import {
setRepresentationCapacity,
setRepresentationSubmit,
} from "../../../store/currentView/action";
getFormCollectionByID,
getThumbnailIconByExtension,
bytesToSize,
} from "../../utils";
import { useDropzone } from "react-dropzone";
const RepAgent = (props) => {
@@ -32,29 +38,33 @@ const RepAgent = (props) => {
{file.path} - {file.size} bytes
</li>
));
const required = (value) => (value ? undefined : "Required");
return (
<div id="rep-appellant">
<div className="govuk-grid-column-full">
<div className="govuk-grid-row">
<h2 className="govuk-heading-m ">Representation - agent</h2>
<>
<div className="govuk-grid-row">
<h2 className="govuk-heading-m ">
{t(
"myrepresentations:representation-from-an-agent-heading"
)}
</h2>
<div className="govuk-form-group">
<label
className="govuk-label govuk-body-m"
htmlFor="representationType"
>
What kind of representation are you making?
</label>
<Field
name="representationType"
component={RenderPickList}
datafieldname="representationType"
optionsArr={appellantApplicantRepresentationArr}
/>
</div>
<div className="govuk-form-group">
<label
className="govuk-label govuk-body-m"
htmlFor="representationType"
>
{t("myrepresentations:kind-of-rep-label")}
</label>
<Field
name="representationType"
component={RenderPickList}
datafieldname="representationType"
optionsArr={appellantApplicantRepresentationArr}
/>
</div>
<div className="govuk-grid-row">
</div>
{/* <div className="govuk-grid-row">
<div className="govuk-form-group">
<Field
className="govuk-input govuk-!-width-three-quarters"
@@ -67,168 +77,130 @@ const RepAgent = (props) => {
label="Description of representation"
/>
</div>
</div>
<div className="govuk-grid-row">
<div className="govuk-form-group">
<p className="govuk-body">
You can enter your comments in the space provided or
attach a separate document.
</p>
<fieldset
className="govuk-fieldset"
aria-describedby="commentBox-hint"
>
<div id="commentBox-hint" className="govuk-hint">
My comments are set out in:*
</div>
<div
className="govuk-checkboxes"
data-module="govuk-checkboxes"
>
<div className="govuk-checkboxes__item">
<Field
className="govuk-checkboxes__input"
id="commentBox"
name="commentBox"
value="email"
data-aria-controls="commentBox"
type="checkbox"
component={RenderTextfield}
/>
<label
className="govuk-label govuk-checkboxes__label"
htmlFor="commentBox"
>
the box below{" "}
</label>
</div>
<div
className={
_.isEmpty(formObj["representationForm"])
? "govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden rr"
: _.isEmpty(
formObj["representationForm"]
.values
)
? "govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden q11 "
: _.isEmpty(
formObj["representationForm"]
.values.commentBox
)
? formObj["representationForm"]
.values.commentBox == false
? "govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden www"
: "govuk-checkboxes__conditional"
: "govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden wwwaqqqq"
}
id="conditional-commentBox"
>
<div className="govuk-form-group">
<Field
name="representationComments"
id="representationComments"
component={RenderMultiline}
type="text"
rows="5"
className="govuk-textarea govuk-input--width-30"
aria-describedby={
props.name + "-hint"
}
/>
</div>
</div>
<div className="govuk-checkboxes__item">
<Field
className="govuk-checkboxes__input"
id="documentBox"
name="documentBox"
value="email"
data-aria-controls="documentBox"
type="checkbox"
component={RenderTextfield}
/>
<label
className="govuk-label govuk-checkboxes__label"
htmlFor="documentBox"
>
separate documents
</label>
</div>
<div
className={
_.isEmpty(formObj["representationForm"])
? "govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden rr"
: _.isEmpty(
formObj["representationForm"]
.values
)
? "govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden www"
: _.isEmpty(
formObj["representationForm"]
.values.documentBox
)
? formObj["representationForm"]
.values.documentBox == false
? "govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden www"
: "govuk-checkboxes__conditional"
: "govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden"
}
id="conditional-documentBox"
>
<div className="govuk-form-group">
<section className="container">
<div
{...getRootProps({
className: "dropzone",
})}
>
<input {...getInputProps()} />
<p>
Drag and drop files here or
click to select files
</p>
</div>
<aside>
<h4>Files</h4>
<ul>{files}</ul>
</aside>
</section>
</div>
</div>
</div>
</fieldset>
</div>{" "}
</div>
<div className="govuk-grid-row">
<div className="govuk-button-group">
<button
type="submit"
className="govuk-button"
data-module="govuk-button"
>
Continue
</button>
{/* <a
onClick={() => {
setRepresentationSubmit(false);
}}
className="govuk-button"
>
Continue
</a> */}
<a
onClick={() => {
setRepresentationCapacity();
}}
className="govuk-link"
>
Back
</a>
</div>
</div> */}
<div className="govuk-grid-row">
<div className="govuk-form-group">
<Field
name="representationOnBehalfOf"
datafieldname="representationOnBehalfOf"
// label={t("myrepresentations:capacity-select-what-capacity-label")}
options={["Yes", "No"]}
id="representationOnBehalfOf"
className="govuk-radios__input"
errorMsg={t("newappeal:select-an-option-label")}
component={RenderCondtionalRadioList}
validate={[required]}
legend={
"Are you acting on behalf of a company, group or organisation?"
}
/>
</div>
</div>
</div>
<div className="govuk-grid-row">
<div className="govuk-form-group">
<p className="govuk-body">
{t("myrepresentations:enter-comment-label")}
</p>
<fieldset
className="govuk-fieldset"
aria-describedby="commentBox-hint"
>
<div id="commentBox-hint" className="govuk-hint">
{t("myrepresentations:comments-set-out-label")}:
</div>
<div className="govuk-form-group">
<Field
name="representationComments"
id="representationComments"
component={RenderRichMultiline}
type="text"
rows="5"
className="govuk-textarea govuk-input--width-30"
aria-describedby={props.name + "-hint"}
/>
<p className="govuk-hint govuk-!-font-size-14 govuk-!-margin-top-5">
{t("myrepresentations:publish-policy-label")}
<a href="https://gov.wales/planning-and-environment-decisions-wales-publishing-policy-html">
https://gov.wales/planning-and-environment-decisions-wales-publishing-policy-html
</a>
</p>
</div>
<div className="govuk-form-group govuk-!-margin-bottom-9">
<FileUploadField
name={"representationDocuments"}
label={t("myrepresentations:add-files-label")}
ticketnumber={props.props.caseReference}
hint={"sdsd"}
fileList={[]}
setFilesForRepresentation={[]}
containerID={
props.props.props.accountDetails.containerID
}
/>
</div>
{props.currentView.caseReference.hasOwnProperty(
"repDetails"
) &&
props.currentView.caseReference.repDetails.filesList
.length > 0 ? (
<div className="govuk-form-group govuk-!-margin-bottom-9">
{props.currentView.caseReference.repDetails.filesList.map(
(blob, i) => (
<div
key={blob.name + "_" + i}
className="govuk-!-margin-bottom-5 fileThumb "
>
<img
src={getThumbnailIconByExtension(
blob.name
)}
alt={blob.name}
width="50"
/>
<span className="govuk-body govuk-!-font-size-14 govuk-!-padding-left-5">
{blob.name} (
{bytesToSize(blob.size)})
</span>
</div>
)
)}
</div>
) : (
""
)}
</fieldset>
</div>{" "}
</div>
<div className="govuk-grid-row">
<div className="govuk-button-group">
<button
type="submit"
className="govuk-button"
data-module="govuk-button"
>
{t("common:continue-button")}{" "}
</button>
{/* <a
onClick={() => {
setRepresentationSubmit(true);
}}
className="govuk-button"
>
{t("common:continue-button")} ww
</a> */}
<a
onClick={() => {
setRepresentationCapacity();
}}
className="govuk-link"
>
{t("common:back-link")}
</a>
</div>
</div>
</>
);
};
components/case/representation/representationAppellant.js
+128 -166
View File
@@ -10,8 +10,17 @@ import {
RenderTextfield,
RenderRadioList,
RenderMultiline,
RenderRichMultiline,
RenderFileUpload,
FileUploadField,
RepresentationGuidanceText,
} from "./representationElements";
import {
getFormCollectionByID,
getThumbnailIconByExtension,
bytesToSize,
} from "../../utils";
import { useDropzone } from "react-dropzone";
// import {
// setRepresentationCapacity,
@@ -35,25 +44,38 @@ const RepAppellant = (props) => {
// console.log(props);
return (
<div id="rep-appellant">
<div className="govuk-grid-column-full">
<div className="govuk-grid-row">
<div className="govuk-form-group">
<label
className="govuk-label govuk-body-m"
htmlFor="representationType"
>
What kind of representation are you making?
</label>
<>
<div className="govuk-grid-row">
<div className="govuk-form-group">
<h2 className="govuk-heading-m ">
{t(
"myrepresentations:representation-from-an-appellant-heading"
)}
</h2>
<label
className="govuk-label govuk-body-m"
htmlFor="representationType"
>
{t(
"myrepresentations:representation-from-an-agent-heading"
)}
?
</label>
{typeof props.representationType == "undefined" ? (
<Field
name="representationType"
component={RenderPickList}
datafieldname="representationType"
optionsArr={appellantApplicantRepresentationArr}
/>
</div>
) : (
<p>{props.representationType}</p>
)}
</div>
<div className="govuk-grid-row">
</div>
{/* <div className="govuk-grid-row">
<div className="govuk-form-group">
<Field
className="govuk-input govuk-!-width-three-quarters"
@@ -66,169 +88,109 @@ const RepAppellant = (props) => {
label="Description of representation"
/>
</div>
</div>
<div className="govuk-grid-row">
<div className="govuk-form-group">
<p className="govuk-body">
You can enter your comments in the space provided or
attach a separate document.
</p>
<fieldset
className="govuk-fieldset"
aria-describedby="commentBox-hint"
>
<div id="commentBox-hint" className="govuk-hint">
My comments are set out in:*
</div> */}
<div className="govuk-grid-row">
<div className="govuk-form-group">
<p className="govuk-body">
{t("myrepresentations:enter-comment-label")}
</p>
<fieldset
className="govuk-fieldset"
aria-describedby="commentBox-hint"
>
<div id="commentBox-hint" className="govuk-hint">
{t("myrepresentations:comments-set-out-label")}:
</div>
<div className="govuk-form-group">
<Field
name="representationComments"
id="representationComments"
component={RenderRichMultiline}
type="text"
rows="5"
className="govuk-textarea govuk-input--width-30"
aria-describedby={props.name + "-hint"}
/>
{RepresentationGuidanceText(
formObj.representationForm.values.appealType
)}
</div>
<div className="govuk-form-group govuk-!-margin-bottom-9">
<FileUploadField
name={"representationDocuments"}
label={t("myrepresentations:add-files-label")}
ticketnumber={props.props.caseReference}
hint={"sdsd"}
fileList={[]}
setFilesForRepresentation={[]}
containerID={
props.props.props.accountDetails.containerID
}
/>
</div>
{props.currentView.caseReference.hasOwnProperty(
"repDetails"
) &&
props.currentView.caseReference.repDetails.filesList
.length > 0 ? (
<div className="govuk-form-group govuk-!-margin-bottom-9">
{props.currentView.caseReference.repDetails.filesList.map(
(blob, i) => (
<div
key={blob.name + "_" + i}
className="govuk-!-margin-bottom-5 fileThumb "
>
<img
src={getThumbnailIconByExtension(
blob.name
)}
alt={blob.name}
width="50"
/>
<span className="govuk-body govuk-!-font-size-14 govuk-!-padding-left-5">
{blob.name} (
{bytesToSize(blob.size)})
</span>
</div>
)
)}
</div>
<div
className="govuk-checkboxes"
data-module="govuk-checkboxes"
>
<div className="govuk-checkboxes__item">
<Field
className="govuk-checkboxes__input"
id="commentBox"
name="commentBox"
value="email"
data-aria-controls="commentBox"
type="checkbox"
component={RenderTextfield}
/>
<label
className="govuk-label govuk-checkboxes__label"
htmlFor="commentBox"
>
the box below{" "}
</label>
</div>
<div
className={
_.isEmpty(formObj["representationForm"])
? "govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden rr"
: _.isEmpty(
formObj["representationForm"]
.values
)
? "govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden q11 "
: _.isEmpty(
formObj["representationForm"]
.values.commentBox
)
? formObj["representationForm"]
.values.commentBox == false
? "govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden www"
: "govuk-checkboxes__conditional"
: "govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden wwwaqqqq"
}
id="conditional-commentBox"
>
<div className="govuk-form-group">
<Field
name="representationComments"
id="representationComments"
component={RenderMultiline}
type="text"
rows="5"
className="govuk-textarea govuk-input--width-30"
aria-describedby={
props.name + "-hint"
}
/>
</div>
</div>
<div className="govuk-checkboxes__item">
<Field
className="govuk-checkboxes__input"
id="documentBox"
name="documentBox"
data-aria-controls="documentBox"
type="checkbox"
component={RenderTextfield}
/>
<label
className="govuk-label govuk-checkboxes__label"
htmlFor="documentBox"
>
separate documents
</label>
</div>
<div
className={
_.isEmpty(formObj["representationForm"])
? "govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden rr"
: _.isEmpty(
formObj["representationForm"]
.values
)
? "govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden www"
: _.isEmpty(
formObj["representationForm"]
.values.documentBox
)
? formObj["representationForm"]
.values.documentBox == false
? "govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden www"
: "govuk-checkboxes__conditional"
: "govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden"
}
id="conditional-documentBox"
>
<h2 className="govuk-heading-s">
{props.label}{" "}
</h2>
<Field
name="repsFiles"
id="repsFiles"
component={RenderFileUpload}
className="govuk-input govuk-input--width-20"
//validate={[required]}
label={props.label}
errorMsg="Is required"
ticketnumber={props.caseReference}
documentTypeCode={
props.documentTypeCode
}
hint={props.hint}
fileList={props.fileList}
setFilesForAppeal={
props.setFilesForAppeal
}
containerID={props.containerID}
/>
</div>
</div>
</fieldset>
</div>{" "}
</div>
<div className="govuk-grid-row">
<div className="govuk-button-group">
<button
type="submit"
className="govuk-button"
data-module="govuk-button"
>
Continue
</button>
{/* <a
) : (
""
)}
</fieldset>
</div>{" "}
</div>
<div className="govuk-grid-row">
<div className="govuk-button-group">
<button
type="submit"
className="govuk-button"
data-module="govuk-button"
>
{t("common:continue-button")}
</button>
{/* <a
onClick={() => {
setRepresentationSubmit(true);
}}
className="govuk-button"
>
Continue ww
{t("common:continue-button")} ww
</a> */}
<a
onClick={() => {
setRepresentationCapacity();
}}
className="govuk-link"
>
Back
</a>
</div>
<a
onClick={() => {
setRepresentationCapacity();
}}
className="govuk-link"
>
{t("common:back-link")}
</a>
</div>
</div>
</div>
</>
);
};
components/case/representation/representationCapacitySelection.js
+15 -5
View File
@@ -13,6 +13,7 @@ import {
RenderPickList,
RenderTextfield,
RenderRadioList,
RenderRadioListWithText,
RenderMultiline,
} from "./representationElements";
import { useDropzone } from "react-dropzone";
@@ -47,22 +48,31 @@ let RepCapacitySelection = (props) => {
formObj={formObj}
currentType={currentType}
casesObj={casesObj}
caseReference={props.props.caseReference}
searchResultsObj={props.props.searchResultsObj}
myRepresentations={props.props.myRepresentations}
props={props}
/>{" "}
<div id="rep-details" className="vo_hiddens">
<div id="rep-details" className="">
<div className="govuk-grid-column-full">
<div className="govuk-grid-row">
<h2 className="govuk-heading-m ">
Your details - {props.firstValue}
{t(
"myrepresentations:capacity-select-your-details"
)}{" "}
- {props.firstValue}
</h2>
<Field
name="representationCapacity"
datafieldname="representationCapacity"
label="In what capacity do you wish to make representations on this case?"
label={t(
"myrepresentations:capacity-select-what-capacity-label"
)}
options={capacityOptionsArr}
id="representationCapacity"
className="govuk-radios__input"
errorMsg={t("newappeal:select-an-option-label")}
component={RenderRadioList}
component={RenderRadioListWithText}
validate={[required]}
/>
</div>
@@ -75,7 +85,7 @@ let RepCapacitySelection = (props) => {
className="govuk-button"
data-module="govuk-button"
>
Continue
{t("common:continue-button")}
</button>
</div>
</div>
components/case/representation/representationComplete.js
+39 -31
View File
@@ -1,19 +1,11 @@
import useTranslation from "next-translate/useTranslation";
import Link from "next/link";
import { useRouter } from "next/router";
import useTranslation from "next-translate/useTranslation";
import { Field, reduxForm } from "redux-form";
import {
RenderPickList,
RenderTextfield,
RenderRadioList,
RenderMultiline,
} from "./representationElements";
import {
setRepresentationCapacity,
setRepresentationSubmit,
setSubmitBack,
} from "../../../store/currentView/action";
import { useEffect } from "react";
import { useDropzone } from "react-dropzone";
import { sendEmail, sendRepCompleteMessage } from "../../../actions";
import { setRepresentationReset } from "../../../store/currentView/action";
const RepComplete = (props) => {
let { t } = useTranslation();
@@ -28,6 +20,7 @@ const RepComplete = (props) => {
currentView,
setSubmitBack,
setRepresentationSubmitConfirmation,
setRepresentationMessageSent,
} = props;
const { acceptedFiles, getRootProps, getInputProps } = useDropzone();
const files = acceptedFiles.map((file) => (
@@ -36,35 +29,50 @@ const RepComplete = (props) => {
</li>
));
useEffect(() => {
const reference = "PEDW-REPRESENTATION-COMPLETE";
const templateId = "c49785e7-3217-40b6-b33f-dffc4e58d5c1";
const emailAddress =
props.props.props.props.accountDetails.accountDetails.emailaddress1;
const personalisation = {
"caseReference":
props.props.currentView.caseReference.currentReference,
"emailAddress":
props.props.props.props.accountDetails.accountDetails
.emailaddress1,
"linkExpiry": 10 * 60,
};
props.props.currentView.representationMessageSent != true &&
(sendRepCompleteMessage(
props.props.props.props.accountDetails.containerID,
props.props.currentView.caseReference.currentReference
),
sendEmail(templateId, emailAddress, personalisation, reference),
setRepresentationMessageSent(true));
});
return (
<div id="rep-appellant">
<div className="govuk-grid-column-full">
<div className="govuk-grid-row govuk-body">
<h1 className="govuk-heading-m ">
Submission of Representation
{t("myrepresentations:rep-complete-heading")}
</h1>
<p>
Thank you for submitting your representation(s) using
the Appeals Casework Portal.
</p>
<p>{t("myrepresentations:rep-complete-para-one")}</p>
<p>
Please remember that any supporting documentation needs
to be received by us within the appropriate deadline for
the case. Anything you send to us must be clearly marked
with the case reference number and the site address
(including the postcode, where known).
</p>
<p>{t("myrepresentations:rep-complete-para-two")}</p>
<p>
You will shortly receive confirmation to the email
address you have provided.
</p>
<p> {t("myrepresentations:rep-complete-para-three")}</p>
</div>
<div className="govuk-grid-row">
<div className="govuk-button-group">
<Link href="/myportal">
<a className="govuk-button">Continue</a>
<Link
href="/myportal"
onClick={() => setRepresentationReset()}
className="govuk-button">
{t("common:continue-button")}
</Link>
</div>
</div>
components/case/representation/representationCompleteSubmit.js
+282 -36
View File
@@ -1,21 +1,16 @@
import Link from "next/link";
import { useRouter } from "next/router";
import _ from "lodash";
import useTranslation from "next-translate/useTranslation";
import { Field, reduxForm } from "redux-form";
import {
RenderPickList,
RenderTextfield,
RenderRadioList,
RenderMultiline,
} from "./representationElements";
import {
setRepresentationCapacity,
setRepresentationSubmit,
setSubmitBack,
setRepresentationSubmitConfirmation,
} from "../../../store/currentView/action";
import { useRouter } from "next/router";
import { useDropzone } from "react-dropzone";
import RepComplete from "./representationComplete";
import RepLPAQuestionnaireCheck_s78 from "./representationQuestionnairesCheck/representationLPAQuestionnaireCheck_s78";
import RepLPAQuestionnaireCheck_enforcement from "./representationQuestionnairesCheck/representationLPAQuestionnaireCheck_enforcement";
import {
getFormCollectionByID,
getThumbnailIconByExtension,
bytesToSize,
} from "../../utils";
const RepCompleteSubmit = (props) => {
let { t } = useTranslation();
@@ -30,6 +25,8 @@ const RepCompleteSubmit = (props) => {
currentView,
setSubmitBack,
setRepresentationSubmitConfirmation,
setRepresentationMessageSent,
setRepresentationReset,
} = props;
const { acceptedFiles, getRootProps, getInputProps } = useDropzone();
const files = acceptedFiles.map((file) => (
@@ -38,34 +35,279 @@ const RepCompleteSubmit = (props) => {
</li>
));
const repFormData = formObj.representationForm.values;
console.log("///////// formObj:", formObj);
const whichQuestionnaireCheck = () => {
{
console.log("curr");
switch (currentView.caseReference.appealType) {
case 846040000:
return (
<RepLPAQuestionnaireCheck_s78
props={props}
formObj={formObj}
setSubmitBack={setSubmitBack}
/>
);
break;
case 846040005:
return (
<RepLPAQuestionnaireCheck_enforcement
props={props}
formObj={formObj}
setSubmitBack={setSubmitBack}
/>
);
break;
default:
return <>hello</>;
break;
}
}
};
return (
<>
{currentView.representationSubmitConfirmation == true ? (
<RepComplete />
<RepComplete
props={props}
setRepresentationMessageSent={setRepresentationMessageSent}
setRepresentationReset={setRepresentationReset}
/>
) : (
<div id="rep-appellant">
<div className="govuk-grid-column-full">
<div className="govuk-grid-row govuk-body">
<h1 className="govuk-heading-m ">Submit</h1>
<h1 className="govuk-heading-m ">
{" "}
{t(
"myrepresentations:rep-check-submit-heading"
)}
</h1>
<dl className="govuk-summary-list ">
<h2 className="govuk-heading-m govuk-!-margin-top-9">
{t(
"myrepresentations:rep-check-your-rep-heading"
)}
</h2>
<div className="govuk-summary-list__row">
<dt className="govuk-summary-list__key">
{t(
"case:representation-representation-type"
)}
</dt>
<dd className="govuk-summary-list__value">
{repFormData.representationType}
</dd>
<dd className="govuk-summary-list__actions">
<a
className="govuk-link"
href="#"
onClick={() => {
setSubmitBack();
}}
>
{t("newappeal:change-link-label")}
<span className="govuk-visually-hidden">
{" "}
{/* {FieldsTranslations(
rows[0].value
)} */}
</span>
</a>
</dd>
</div>
{_.has(
repFormData,
"representationOnBehalfOf"
) && (
<>
<div className="govuk-summary-list__row">
<dt className="govuk-summary-list__key">
{t(
"case:representation-onbehalfof"
)}
</dt>
<dd className="govuk-summary-list__value">
{
repFormData.representationOnBehalfOf
}
</dd>
<dd className="govuk-summary-list__actions">
<a
className="govuk-link"
href="#"
onClick={() => {
setSubmitBack();
}}
>
{t(
"newappeal:change-link-label"
)}
<span className="govuk-visually-hidden">
{" "}
{/* {FieldsTranslations(
rows[0].value
)} */}
</span>
</a>
</dd>
</div>
{repFormData.representationOnBehalfOf ==
"Yes" && (
<div className="govuk-summary-list__row">
<dt className="govuk-summary-list__key">
{t(
"case:representation-onbehalfof-details"
)}
</dt>
<dd className="govuk-summary-list__value">
{
repFormData.representationOnBehalfOf_details
}
</dd>
<dd className="govuk-summary-list__actions">
<a
className="govuk-link"
href="#"
onClick={() => {
setSubmitBack();
}}
>
{t(
"newappeal:change-link-label"
)}
<span className="govuk-visually-hidden">
{" "}
{/* {FieldsTranslations(
rows[0].value
)} */}
</span>
</a>
</dd>
</div>
)}
</>
)}
<div className="govuk-summary-list__row">
<dt className="govuk-summary-list__key">
{t("case:representation-comments")}
</dt>
<dd className="govuk-summary-list__value">
<span
className="multiline-elipsis"
dangerouslySetInnerHTML={{
__html: repFormData.representationComments,
}}
/>
</dd>
<dd className="govuk-summary-list__actions">
<a
className="govuk-link"
href="#"
onClick={() => {
setSubmitBack();
}}
>
{t("newappeal:change-link-label")}
<span className="govuk-visually-hidden">
{" "}
{/* {FieldsTranslations(
rows[0].value
)} */}
</span>
</a>
</dd>
</div>
<div className="govuk-summary-list__row">
<dt className="govuk-summary-list__key">
{t("case:representation-files")}
</dt>
<dd className="govuk-summary-list__value">
{formObj.representationForm.values.hasOwnProperty(
"representationDocuments"
) &&
formObj.representationForm.values
.representationDocuments.length > 0
? formObj.representationForm.values.representationDocuments.map(
(blob, i) => (
<div
key={
blob.name +
"_" +
i
}
className="govuk-!-margin-bottom-5 fileThumb "
>
<img
src={getThumbnailIconByExtension(
blob.name
)}
alt={blob.name}
width="50"
/>
<span className="govuk-body govuk-!-font-size-14 govuk-!-padding-left-5">
{blob.name} (
{bytesToSize(
blob.size
)}
)
</span>
</div>
)
)
: ""}{" "}
</dd>
<dd className="govuk-summary-list__actions">
<a
className="govuk-link"
href="#"
onClick={() => {
setSubmitBack();
}}
>
{t("newappeal:change-link-label")}
<span className="govuk-visually-hidden">
{" "}
{/* {FieldsTranslations(
rows[0].value
)} */}
</span>
</a>
</dd>
</div>
{whichQuestionnaireCheck()}
</dl>
<p>
The gathering and subsequent processing of the
personal data supplied by you in this form, is
in accordance with the terms of our registration
under the Data Protection Act 2018.
{t(
"myrepresentations:rep-check-tandc-para-one"
)}
</p>
<p>
The Planning Inspectorate takes its data
protection responsibilities for the information
you provide us with very seriously. To find out
more about how we use and manage your personal
data, please go to our privacy notice.
{t(
"myrepresentations:rep-check-tandc-para-two"
)}
</p>
<p>
I confirm that all sections of this form have
been fully completed and that the details are
correct to the best of my knowledge.
{t(
"myrepresentations:rep-check-tandc-para-three"
)}
</p>
<div className="govuk-form-group">
@@ -73,7 +315,10 @@ const RepCompleteSubmit = (props) => {
className="govuk-label govuk-body-m"
htmlFor="representationType"
>
I confirm I have read the above.
{" "}
{t(
"myrepresentations:rep-check-tandc-para-four"
)}
</label>
{/* <Field
name="representationType"
@@ -89,11 +334,12 @@ const RepCompleteSubmit = (props) => {
type="submit"
className="govuk-button"
data-module="govuk-button"
onClick={() =>
setRepresentationSubmitConfirmation()
}
// onClick={() => {
// setRepresentationSubmitConfirmation();
// setRepresentationSubmit(true);
// }}
>
Continue
{t("common:continue-button")}
</button>
{/* <a
onClick={() => {
@@ -101,14 +347,14 @@ const RepCompleteSubmit = (props) => {
}}
className="govuk-button"
>
Continue
{t("common:continue-button")}
</a> */}
<a
onClick={() => setSubmitBack()}
className="govuk-link"
>
Back
{t("case:summary-back-button-label")}
</a>
</div>
</div>
components/case/representation/representationDetails.js
+66 -12
View File
@@ -3,6 +3,7 @@ import { useRouter } from "next/router";
import useTranslation from "next-translate/useTranslation";
import { Field, reduxForm } from "redux-form";
import { RenderPickList, RenderTextfield } from "./representationElements";
import jsonpath from "jsonpath";
const RepDetails = (props) => {
let { t } = useTranslation();
@@ -12,6 +13,31 @@ const RepDetails = (props) => {
const { currentType, casesObj } = props;
let { caseReference } = props;
let setCaseDetailsObj = router.query.hasOwnProperty("state")
? router.query.state == "edit"
? props.myRepresentations.myRepresentations
: props.searchResultsObj.searchDetailsObj
: props.searchResultsObj.searchDetailsObj;
var detailsObj = {};
caseReference = router.query.hasOwnProperty("state")
? router.query.state == "edit"
? router.query.case
: caseReference
: caseReference;
detailsObj = jsonpath.query(
setCaseDetailsObj,
'$..[?(@.pinswg_name=="' + caseReference + '")]'
);
detailsObj = detailsObj[0];
console.log("-----detailsObj:", detailsObj);
return (
<>
{" "}
@@ -24,6 +50,14 @@ const RepDetails = (props) => {
</dt>
<dd className="govuk-summary-list__value">
{casesObj.appellantApplicant || ""}
{
detailsObj[
"_pinswg_appellant_value@OData.Community.Display.V1.FormattedValue"
]
}
{/* {detailsObj.firstName +
" " +
detailsObj.lastName || "not entered"} */}
</dd>
</div>
{/* <div className="govuk-summary-list__row">
@@ -39,26 +73,46 @@ const RepDetails = (props) => {
{t("case:summary-site-address-label")}
</dt>
<dd className="govuk-summary-list__value">
{casesObj.address1 || ""}
<br />
{casesObj.town || ""}
<br />
{casesObj.postcode || ""}
{_.has(detailsObj, "pinswg_siteaddressline1")
? detailsObj.pinswg_siteaddressline1
: ""}
{_.has(detailsObj, "pinswg_siteaddressline1") &&
detailsObj.pinswg_siteaddressline1 !=
null && <br />}
{_.has(detailsObj, "pinswg_siteaddressline2")
? detailsObj.pinswg_siteaddressline2
: ""}
{_.has(detailsObj, "pinswg_siteaddressline2") &&
detailsObj.pinswg_siteaddressline2 !=
null && <br />}
{_.has(detailsObj, "pinswg_siteaddresstown")
? detailsObj.pinswg_siteaddresstown
: ""}
{_.has(detailsObj, "pinswg_siteaddresstown") &&
detailsObj.pinswg_siteaddresstown !=
null && <br />}
{_.has(detailsObj, "pinswg_siteaddresscounty")
? detailsObj.pinswg_siteaddresscounty
: ""}
{_.has(
detailsObj,
"pinswg_siteaddresscounty"
) &&
detailsObj.pinswg_siteaddresscounty !=
null && <br />}
{_.has(detailsObj, "pinswg_siteaddresspostcode")
? detailsObj.pinswg_siteaddresspostcode
: ""}
</dd>
</div>
</dl>
</div>
<div className="govuk-grid-row">
<p className="govuk-body">
This form enables you to submit comments on a case to
Planning and Environment Decisions Wales.{" "}
{t("myrepresentations:capacity-para-one")}
</p>
<p className="govuk-body">
Please note that comments from interested parties need
to be made within the timetable. This can be found on
the previous &lsquo;Case Summary&lsquo; page. Comments
submitted after this date may be considered invalid.
{t("myrepresentations:capacity-para-two")}
</p>
</div>
</div>
components/case/representation/representationElements.js
+674 -78
View File
@@ -8,6 +8,26 @@ import Link from "next/link";
import dynamic from "next/dynamic";
const ReactQuill = dynamic(() => import("react-quill"), { ssr: false });
import "react-quill/dist/quill.snow.css";
import DatePicker, { registerLocale, setDefaultLocale } from "react-datepicker";
import "react-datepicker/dist/react-datepicker.css";
import {
addYears,
addMonths,
addDays,
subYears,
subMonths,
subDays,
parseISO,
} from "date-fns";
import {
getFormCollectionByID,
getThumbnailIconByExtension,
bytesToSize,
} from "../../utils";
import { useRouter } from "next/router";
export const RenderRadioList = ({
datafieldname,
@@ -54,7 +74,13 @@ export const RenderRadioList = ({
{errorMsg}
</span>
)}
<div className="govuk-radios govuk-radios--small">
<div
className={
custom.inline == true
? "govuk-radios govuk-radios--inline govuk-radios--small"
: "govuk-radios govuk-radios--small"
}
>
{Object.keys(options).map((key, index) => (
<div
className="govuk-radios__item"
@@ -84,29 +110,419 @@ 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,
name,
label,
id,
errorMsg,
options,
input: { onChange, value },
meta: { touched, error },
...custom
}) => {
const required = (value) => (value ? undefined : "Required");
let { t } = useTranslation();
return (
<>
<div
className={
touched && error
? "govuk-form-group govuk-form-group--error"
: "govuk-form-group "
}
>
<fieldset
className="govuk-fieldset"
aria-describedby={id + "-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>
)}
<legend className="govuk-fieldset__legend govuk-fieldset__legend--m">
<label
className="govuk-fieldset__heading govuk-body-m"
id="representationCapacity_label"
>
{legend}
</label>
</legend>
<div id={id + "-hint"} className="govuk-hint">
e.g. &lsquo;Owners of Numbers 1-5 High Street&lsquo;, or
&lsquo;Mr and Mrs Smith&lsquo; or &lsquo;The executors
of Mr Evans&lsquo; estate&lsquo;
</div>
<div className="govuk-radios">
{Object.keys(options).map((key, index) => (
<div key={key} className="govuk-!-margin-bottom-3">
<div
className="govuk-radios__item"
data-children-count={key}
key={key}
>
<Field
id={id + "_" + index}
name={id}
component="input"
type="radio"
className="govuk-radios__input"
value={options[key]}
validate={[required]}
/>
<label
className="govuk-label govuk-radios__label"
htmlFor={id + "_" + index}
>
{options[key]}
</label>
</div>
{value ==
t("myrepresentations:questionnaire-yes") &&
options[key] ==
t(
"myrepresentations:questionnaire-yes"
) && (
<div
className="govuk-radios__conditional "
id={"conditional-" + id}
>
<div
className="govuk-form-group"
key={"yes_group_" + key}
>
<label
className="govuk-label"
htmlFor={id + "_details"}
>
Enter the name of the
company/group/organisation *
</label>
<Field
className="govuk-input govuk-!-width-one-half"
id={id + "_details"}
name={id + "_details"}
component="input"
type="text"
/>
</div>
</div>
)}
</div>
))}
</div>
</fieldset>
</div>
</>
);
};
export const RenderLPACondtionalRadioList = ({
datafieldname,
legend,
name,
label,
id,
errorMsg,
options,
input: { onChange, value },
meta: { touched, error },
...custom
}) => {
const required = (value) => (value ? undefined : "Required");
console.log(error);
return (
<>
<div
className={
touched && error
? "govuk-form-group govuk-form-group--error"
: "govuk-form-group "
}
>
<fieldset
className="govuk-fieldset"
aria-describedby={id + "-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>
)}
<legend className="govuk-fieldset__legend govuk-fieldset__legend--m">
<label
className=" govuk-body-m"
id="representationCapacity_label"
>
{legend}
</label>
</legend>
<div id={id + "-hint"} className="govuk-hint"></div>
<div className="govuk-radios govuk-radios--small">
{Object.keys(options).map((key, index) => (
<div key={key} className="govuk-!-margin-bottom-3">
<div
className="govuk-radios__item"
data-children-count={key}
key={key}
>
<Field
id={id + "_" + index}
name={id}
component="input"
type="radio"
className="govuk-radios__input"
value={options[key]}
validate={[eval(required)]}
/>
<label
className="govuk-label govuk-radios__label"
htmlFor={id + "_" + index}
>
{options[key]}
</label>
</div>
{value == custom.optionSelect &&
options[key] == custom.optionSelect && (
<div
className="govuk-radios__conditional "
id={id}
>
<div
className="govuk-form-group"
key={"yes_group_" + key}
>
<label
className="govuk-label"
htmlFor={id + "_details"}
>
{custom.conditionalLabel}
</label>
<Field
className="govuk-input govuk-!-width-one-half"
id={id + "Evidence"}
name={id + "Evidence"}
component={RenderMultiline}
/>
</div>
</div>
)}
</div>
))}
</div>
</fieldset>
</div>
</>
);
};
export const RenderPickList = ({
datafieldname,
name,
label,
input,
optionsArr,
meta: { touched, errorStr },
meta: { touched, error },
errorMsg,
}) => {
return (
<div>
<select {...input} className="govuk-select " id={name} name={name}>
<option>Select...</option>
{Object.keys(optionsArr).map((key, index) => {
return (
<option key={key} value={optionsArr[key]}>
{optionsArr[key]}
</option>
);
})}
</select>
<>
<div
className={
touched && error
? "govuk-form-group govuk-form-group--error"
: "govuk-form-group "
}
>
<label className="govuk-label" htmlFor="sort">
{label}
</label>
{touched && error && (
<span
id="passport-issued-error"
className="govuk-error-message"
>
<span className="govuk-visually-hidden">Error:</span>{" "}
{errorMsg}
</span>
)}
{touched && errorStr && <span>{errorStr}</span>}
</div>
<div>
<select
{...input}
className="govuk-select "
id={name}
name={name}
>
<option>Select...</option>
{Object.keys(optionsArr).map((key, index) => {
return (
<option key={key} value={optionsArr[key]}>
{optionsArr[key]}
</option>
);
})}
</select>
</div>
</div>
</>
);
};
@@ -123,6 +539,8 @@ export const RenderTextfield = ({
meta: { touched, error },
...custom
}) => {
const required = (value) => (value ? undefined : "Required");
return (
<>
<label className="govuk-label " htmlFor={id} id={id + "_label"}>
@@ -145,6 +563,118 @@ export const RenderTextfield = ({
);
};
export const RenderDatePicker = ({
datafieldname,
name,
label,
id,
errorMsg,
input: { onChange, value },
meta: { touched, error },
...custom
}) => {
const router = useRouter();
var startDateArr =
custom.dateStart != "0" ? custom.dateStart.split("") : custom.dateStart;
var endDateArr =
custom.dateEnd != "0" ? custom.dateEnd.split("") : custom.dateEnd;
var minDate =
startDateArr == 0
? new Date()
: startDateArr[0] == "-"
? startDateArr[2] == "y"
? subYears(new Date(), startDateArr[1])
: startDateArr[2] == "m"
? subMonths(new Date(), startDateArr[1])
: subDays(new Date(), startDateArr[1])
: startDateArr[2] == "y"
? addYears(new Date(), startDateArr[1])
: startDateArr[2] == "m"
? addMonths(new Date(), startDateArr[1])
: addDays(new Date(), startDateArr[1]);
var maxDate =
endDateArr == 0
? new Date()
: startDateArr[0] == "-"
? startDateArr[2] == "y"
? subYears(new Date(), startDateArr[1])
: startDateArr[2] == "m"
? subMonths(new Date(), startDateArr[1])
: subDays(new Date(), startDateArr[1])
: startDateArr[2] == "y"
? addYears(new Date(), startDateArr[1])
: startDateArr[2] == "m"
? addMonths(new Date(), startDateArr[1])
: addDays(new Date(), startDateArr[1]);
return (
<>
<div
className={
touched && error
? "govuk-form-group govuk-form-group--error"
: "govuk-form-group "
}
>
<fieldset
className="govuk-fieldset"
role="group"
aria-describedby={id + "_label"}
>
<legend className="govuk-fieldset__legend govuk-fieldset__legend--s govuk-!-font-weight-regular">
<label
className="govuk-fieldset__heading"
id={id + "_label"}
htmlFor={id}
>
{label}
</label>
</legend>
{touched && error && (
<span
id={id + "-error"}
className="govuk-error-message"
>
<span className="govuk-visually-hidden">
Error:
</span>{" "}
{errorMsg}
</span>
)}
{/* {value}
<br />
{moment(value).format("DD/MM/YY")}
<br /> */}
<DatePicker
{...custom}
locale={custom.locale}
autoOk={true}
id={id}
dateFormat="dd/MM/yyyy"
onChange={onChange}
selected={
value
? typeof value != "object"
? parseISO(value)
: value
: null
} //{parseISO(value) || null}
className="govuk-input govuk-input--width-10"
minDate={minDate}
maxDate={maxDate}
//value={!value ? null : moment(value, "DD/MM/yyyy")}
/>
</fieldset>
</div>
</>
);
};
export const RenderMultiline = ({
id,
className,
@@ -165,6 +695,71 @@ export const RenderMultiline = ({
input.onChange(valStr);
};
var modules = {
toolbar: [
[{ "header": [1, 2, false] }],
["bold", "italic", "underline", "blockquote"],
[{ "list": "ordered" }, { "list": "bullet" }, "link"],
["clean"],
],
};
return (
<>
<div className="govuk-form-group ">
<label className="govuk-label" htmlFor={name}>
{label}
</label>
{"hint" in custom}
{"hint" in custom && (
<div
id={name + "-hint"}
className="govuk-hint govuk-!-font-size-14"
>
{custom.hint}
</div>
)}
<ReactQuill
modules={modules}
theme="snow"
value={editValue}
onChange={changeEdit}
/>
<textarea
{...input}
id={id}
name={name}
rows={rows}
className={className}
value={editValue}
style={{ display: "none" }}
></textarea>
</div>
</>
);
};
export const RenderRichMultiline = ({
id,
className,
rows,
datafieldname,
name,
label,
input,
meta: { touched, error },
...custom
}) => {
const [editValue, setEditValue] = useState(
input.value != null ? input.value : ""
);
const changeEdit = (valStr) => {
setEditValue(valStr);
input.onChange(valStr);
};
var modules = {
toolbar: [
[{ "header": [1, 2, false] }],
@@ -176,6 +771,9 @@ export const RenderMultiline = ({
return (
<>
<label className="govuk-label" htmlFor={name}>
{label}
</label>
<ReactQuill
modules={modules}
theme="snow"
@@ -219,6 +817,7 @@ export function MultiLinefield(props) {
component={RenderMultiline}
type="text"
rows="5"
validate={[required]}
className="govuk-textarea govuk-input--width-30"
aria-describedby={props.name + "-hint"}
/>
@@ -277,13 +876,6 @@ export const RenderFileUpload = (field) => {
</div>
));
function bytesToSize(bytes) {
var sizes = ["Bytes", "KB", "MB", "GB", "TB"];
if (bytes == 0) return "0 Byte";
var i = parseInt(Math.floor(Math.log(bytes) / Math.log(1024)));
return Math.round(bytes / Math.pow(1024, i), 2) + " " + sizes[i];
}
const getThumbnailIcon = (fileObj, fileType) => {
switch (fileType) {
case "text/html":
@@ -321,47 +913,6 @@ export const RenderFileUpload = (field) => {
}
};
const getThumbnailIconByExtension = (blobName) => {
let fileType = blobName.slice(blobName.lastIndexOf(".") + 1);
switch (fileType) {
case "html":
return "/assets/images/documenttypes/html.png";
break;
case "txt":
return "/assets/images/documenttypes/txt.png";
break;
case "doc":
return "/assets/images/documenttypes/doc.png";
break;
case "pdf":
return "/assets/images/documenttypes/pdf.png";
break;
case "docx":
return "/assets/images/documenttypes/docx.png";
break;
case "csv":
return "/assets/images/documenttypes/csv.png";
break;
case "xlsx":
return "/assets/images/documenttypes/xlsx.png";
break;
case "zip":
return "/assets/images/documenttypes/zip.png";
break;
case "jpeg":
case "jpg":
return "/assets/images/documenttypes/jpg.png";
case "png":
return "/assets/images/documenttypes/png.png";
break;
default:
return "/assets/images/documenttypes/txt.png";
break;
}
};
const getDocumentType = (docCode) => {
switch (docCode) {
case "000001":
@@ -448,15 +999,9 @@ export const RenderFileUpload = (field) => {
onDrop={(filesToUpload, e) => {
const renamedAcceptedFiles = filesToUpload.map(
(file) =>
new File(
[file],
`${getDocumentType(field.documentTypeCode)}_${
file.name
}`,
{
type: file.type,
}
)
new File([file], `${file.name}`, {
type: file.type,
})
);
field.input.onChange(renamedAcceptedFiles);
}}
@@ -464,9 +1009,9 @@ export const RenderFileUpload = (field) => {
{({ getRootProps, getInputProps }) => (
<>
{/* {field.hint != false && (
<div className="govuk-hint">ss{t(field.hint)}</div>
)}
<div className="govuk-form-group"></div> */}
<div className="govuk-hint">ss{t(field.hint)}</div>
)}
<div className="govuk-form-group"></div> */}
<section className="container">
<div {...getRootProps({ style })}>
{" "}
@@ -551,13 +1096,64 @@ export const RenderFileUpload = (field) => {
blob.name +
blob.hashedfilepath
}
className="govuk-body govuk-!-font-size-14 govuk-!-padding-left-5 govuk-link"
>
<a className="govuk-body govuk-!-font-size-14 govuk-!-padding-left-5 govuk-link">
{blob.name} ({bytesToSize(blob.contentLength)})
</a>
{blob.name}({bytesToSize(blob.contentLength)})
</Link>
</div>
))}{" "}
</>
);
};
export function FileUploadField(props) {
return (
<>
<h2 className="govuk-heading-s">{props.label} </h2>
<Field
name={props.name}
id={props.name}
component={RenderFileUpload}
className="govuk-input govuk-input--width-20"
//validate={[required]}
label={props.label}
errorMsg="Is required"
ticketnumber={props.ticketnumber}
hint={props.hint}
fileList={props.fileList}
setFilesForAppeal={props.setFilesForAppeal}
containerID={props.containerID}
/>
</>
);
}
export const RepresentationGuidanceText = (appealType) => {
let { t } = useTranslation();
console.log(appealType);
switch (appealType) {
case "846040004": //has/cas
return (
<p className="govuk-hint govuk-!-font-size-14 govuk-!-margin-top-5">
{t("myrepresentations:questionnaire-publish-policy-label")}{" "}
<a href="https://gov.wales/planning-and-environment-decisions-wales-publishing-policy-html">
https://gov.wales/planning-and-environment-decisions-wales-publishing-policy-html
</a>
</p>
);
break;
default:
return (
<p className="govuk-hint govuk-!-font-size-14 govuk-!-margin-top-5">
{t("myrepresentations:publish-policy-label")}{" "}
<a href="https://gov.wales/planning-and-environment-decisions-wales-publishing-policy-html">
https://gov.wales/planning-and-environment-decisions-wales-publishing-policy-html
</a>
</p>
);
break;
}
return guidanceString;
};
components/case/representation/representationInterestedPartyPerson.js
+122 -295
View File
@@ -5,8 +5,10 @@ import { Field, reduxForm } from "redux-form";
import {
RenderPickList,
RenderTextfield,
RenderRadioList,
RenderCondtionalRadioList,
RenderMultiline,
RenderRichMultiline,
FileUploadField,
} from "./representationElements";
import { useDropzone } from "react-dropzone";
@@ -21,6 +23,8 @@ const RepInterestedPartyPerson = (props) => {
setRepresentationCapacity,
setRepresentationSubmit,
} = props;
const required = (value) => (value ? undefined : "Required");
const { acceptedFiles, getRootProps, getInputProps } = useDropzone();
const files = acceptedFiles.map((file) => (
<li key={file.path}>
@@ -28,302 +32,125 @@ const RepInterestedPartyPerson = (props) => {
</li>
));
return (
<div id="rep-interested">
<div className="govuk-grid-column-full">
<div className="govuk-grid-row">
<h2 className="govuk-heading-m ">
Representation - interested
</h2>
<div className="govuk-form-group">
<label
className="govuk-label govuk-body-m"
htmlFor="representationType"
>
What kind of representation are you making?
</label>
<Field
name="representationType"
component={RenderPickList}
datafieldname="representationType"
optionsArr={interestedPersonRepresentationArr}
/>
</div>
</div>
<div className="govuk-grid-row">
<div className="govuk-form-group">
<Field
className="govuk-input govuk-!-width-three-quarters"
id="representationDescription"
name="representationDescription"
value="email"
data-aria-controls="representationDescription"
type="text"
component={RenderTextfield}
label="Description of representation"
/>
</div>
<div className="govuk-grid-row">
<div className="govuk-form-group">
<fieldset
className="govuk-fieldset"
aria-describedby="contact-hint"
>
<legend className="govuk-fieldset__legend govuk-fieldset__legend--l">
<label
className="govuk-fieldset__heading govuk-body-m"
id="representationCapacity_label"
>
Are you acting on behalf of a company,
group or organisation?
</label>
</legend>
<div id="contact-hint" className="govuk-hint">
e.g. &lsquo;Owners of Numbers 1-5 High
Street&lsquo;, or &lsquo;Mr and Mrs
Smith&lsquo; or &lsquo;The executors of Mr
Evans&lsquo; estate&lsquo;
</div>
<div
className="govuk-radios govuk-radios--conditional"
data-module="govuk-radios"
>
<div className="govuk-radios__item">
<input
className="govuk-radios__input"
id="contact"
name="contact"
type="radio"
value="email"
data-aria-controls="conditional-contact"
/>
<label
className="govuk-label govuk-radios__label"
htmlFor="contact"
>
Yes
</label>
</div>
<div
className="govuk-radios__conditional govuk-radios__conditional--hidden"
id="conditional-contact"
>
<div className="govuk-form-group">
<label
className="govuk-label"
htmlFor="contact-by-email"
>
Enter the name of the
company/group/organisation *
</label>
<input
className="govuk-input govuk-!-width-one-third"
id="contact-by-email"
name="contact-by-email"
type="email"
spellCheck="false"
autoComplete="email"
/>
</div>
</div>
<div className="govuk-radios__item">
<input
className="govuk-radios__input"
id="contact-2"
name="contact"
type="radio"
value="phone"
data-aria-controls="conditional-contact-2"
/>
<label
className="govuk-label govuk-radios__label"
htmlFor="contact-2"
>
No
</label>
</div>
</div>
</fieldset>
</div>
</div>
<div className="govuk-grid-row">
<div className="govuk-form-group">
<p className="govuk-body">
You can enter your comments in the space
provided or attach a separate document.
</p>
<fieldset
className="govuk-fieldset"
aria-describedby="commentBox-hint"
>
<div
id="commentBox-hint"
className="govuk-hint"
>
My comments are set out in:*
</div>
<div
className="govuk-checkboxes"
data-module="govuk-checkboxes"
>
<div className="govuk-checkboxes__item">
<Field
className="govuk-checkboxes__input"
id="commentBox"
name="commentBox"
value="email"
data-aria-controls="commentBox"
type="checkbox"
component={RenderTextfield}
/>
<label
className="govuk-label govuk-checkboxes__label"
htmlFor="commentBox"
>
the box below{" "}
</label>
</div>
<div
className={
_.isEmpty(
formObj["representationForm"]
)
? "govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden rr"
: _.isEmpty(
formObj[
"representationForm"
].values
)
? "govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden q11 "
: _.isEmpty(
formObj[
"representationForm"
].values.commentBox
)
? formObj["representationForm"]
.values.commentBox ==
false
? "govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden www"
: "govuk-checkboxes__conditional"
: "govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden wwwaqqqq"
}
id="conditional-commentBox"
>
<div className="govuk-form-group">
<Field
name="representationComments"
id="representationComments"
component={RenderMultiline}
type="text"
rows="5"
className="govuk-textarea govuk-input--width-30"
aria-describedby={
props.name + "-hint"
}
/>
</div>
</div>
<div className="govuk-checkboxes__item">
<Field
className="govuk-checkboxes__input"
id="documentBox"
name="documentBox"
value="email"
data-aria-controls="documentBox"
type="checkbox"
component={RenderTextfield}
/>
<label
className="govuk-label govuk-checkboxes__label"
htmlFor="documentBox"
>
separate documents
</label>
</div>
<div
className={
_.isEmpty(
formObj["representationForm"]
)
? "govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden rr"
: _.isEmpty(
formObj[
"representationForm"
].values
)
? "govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden www"
: _.isEmpty(
formObj[
"representationForm"
].values.documentBox
)
? formObj["representationForm"]
.values.documentBox ==
false
? "govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden www"
: "govuk-checkboxes__conditional"
: "govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden"
}
id="conditional-documentBox"
>
<div className="govuk-form-group">
<section className="container">
<div
{...getRootProps({
className: "dropzone",
})}
>
<input
{...getInputProps()}
/>
<p>
Drag and drop files here
or click to select files
</p>
</div>
<aside>
<h4>Files</h4>
<ul>{files}</ul>
</aside>
</section>
</div>
</div>
</div>
</fieldset>
</div>{" "}
</div>
<div className="govuk-grid-row">
<div className="govuk-button-group">
<button
type="submit"
className="govuk-button"
data-module="govuk-button"
>
Continue
</button>
{/* <Link href="/representation">
<a
onClick={() => {
setRepresentationSubmit(true);
}}
className="govuk-button"
>
Continue
</a>
</Link> */}
<a
onClick={() => {
setRepresentationCapacity();
}}
className="govuk-link"
>
Back
</a>
</div>
</div>
<>
<div className="govuk-grid-row">
<h2 className="govuk-heading-m ">
{t(
"myrepresentations:representation-from-an-interested-party-heading"
)}
</h2>
<div className="govuk-form-group">
<label
className="govuk-label govuk-body-m"
htmlFor="representationType"
>
{t(
"myrepresentations:representation-from-an-agent-heading"
)}
?
</label>
<Field
name="representationType"
component={RenderPickList}
datafieldname="representationType"
validate={[required]}
optionsArr={interestedPersonRepresentationArr}
errorMsg={t("newappeal:select-an-option-label")}
/>
</div>
</div>
</div>
<div className="govuk-grid-row">
<div className="govuk-form-group">
<Field
name="representationOnBehalfOf"
datafieldname="representationOnBehalfOf"
// label="In what capacity do you wish to make representations on this case?"
options={["Yes", "No"]}
id="representationOnBehalfOf"
className="govuk-radios__input"
errorMsg={t("newappeal:select-an-option-label")}
component={RenderCondtionalRadioList}
validate={[required]}
legend={
"Are you acting on behalf of a company, group or organisation?"
}
/>
</div>
</div>
<div className="govuk-grid-row">
<div className="govuk-form-group">
<p className="govuk-body">
{t("myrepresentations:enter-comment-label")}
</p>
<fieldset
className="govuk-fieldset"
aria-describedby="commentBox-hint"
>
<div id="commentBox-hint" className="govuk-hint">
{t("myrepresentations:comments-set-out-label")}:
</div>
<div className="govuk-form-group">
<Field
name="representationComments"
id="representationComments"
component={RenderRichMultiline}
type="text"
rows="5"
className="govuk-textarea govuk-input--width-30"
aria-describedby={props.name + "-hint"}
/>
</div>
<div className="govuk-form-group govuk-!-margin-bottom-9">
<FileUploadField
name={"representationDocuments"}
label={t("myrepresentations:add-files-label")}
ticketnumber={props.props.caseReference}
hint={"sdsd"}
fileList={[]}
setFilesForRepresentation={[]}
containerID={
props.props.props.accountDetails.containerID
}
/>
</div>
</fieldset>
</div>{" "}
</div>
<div className="govuk-grid-row">
<div className="govuk-button-group">
<button
type="submit"
className="govuk-button"
data-module="govuk-button"
>
{t("common:continue-button")}
</button>
{/* <Link href="/representation">
<a
onClick={() => {
setRepresentationSubmit(true);
}}
className="govuk-button"
>
{t("common:continue-button")}
</a>
</Link> */}
<a
onClick={() => {
setRepresentationCapacity();
//setRepresentationSubmit(true);
}}
className="govuk-link"
>
{t("case:summary-back-button-label")}
</a>
</div>
</div>
</>
);
};
components/case/representation/representationLPA.js
+425
View File
@@ -0,0 +1,425 @@
import Link from "next/link";
import { useRouter } from "next/router";
import useTranslation from "next-translate/useTranslation";
import { connect } from "react-redux";
import { Field, reduxForm, formValueSelector } from "redux-form";
import {
RenderPickList,
RenderTextfield,
RenderRadioList,
RenderMultiline,
RenderCondtionalRadioList,
RenderLPACondtionalRadioList,
FileUploadField,
RenderRichMultiline,
RenderDatePicker,
} from "./representationElements";
import { getFormCollectionByID, formatDates } from "../../utils";
import {
setRepresentationCapacity,
setRepresentationSubmit,
} from "../../../store/currentView/action";
import { useDropzone } from "react-dropzone";
import { select } from "xpath";
import jsonpath from "jsonpath";
import { useState } from "react";
import Enforcement_Questionnaire from "./representationQuestionnaires/representationLPAQuestionnaire_enforcement";
import S78_Qquestionnaire from "./representationQuestionnaires/representationLPAQuestionnaire_s78";
import RepresentationProgress_s78 from "./representationProgress/representationProgress_s78";
import RepresentationProgress_enforcement from "./representationProgress/representationProgress_enforcement";
import transLookup from "../../../data/lookuptranslations.json";
let RepLPA = (props) => {
let { t } = useTranslation();
const router = useRouter();
const { locale } = router;
const {
formObj,
appellantApplicantRepresentationArr,
setRepresentationCapacity,
setRepresentationSubmit,
currentView,
procedureTypeValue,
onBehalfOfLPA,
setShowQuestionnaireSection,
showQuestionnaireSection,
} = props;
const { acceptedFiles, getRootProps, getInputProps } = useDropzone();
const files = acceptedFiles.map((file) => (
<li key={file.path}>
{file.path} - {file.size} bytes
</li>
));
const required = (value) => (value ? undefined : "Required");
const whichQuestionnaire = () => {
{
console.log("curr");
switch (currentView.caseReference.appealType) {
case 846040000:
case 846040001:
case 846040006:
case 846040025:
case 846040004:
case 846040018:
case 846040003:
case 846040009:
case 846040008:
return (
<S78_Qquestionnaire
props={props}
containerID={
props.props.props.accountDetails.containerID
}
currentView={currentView}
showQuestionnaireSection={showQuestionnaireSection}
setShowQuestionnaireSection={
setShowQuestionnaireSection
}
/>
);
break;
case 846040005:
case 846040006:
case 846040007:
return (
<Enforcement_Questionnaire
props={props}
containerID={
props.props.props.accountDetails.containerID
}
currentView={currentView}
showQuestionnaireSection={showQuestionnaireSection}
setShowQuestionnaireSection={
setShowQuestionnaireSection
}
/>
);
break;
default:
return <>hello</>;
break;
}
}
};
const whichProgress = () => {
{
console.log("curr");
switch (currentView.caseReference.appealType) {
case 846040000:
case 846040001:
case 846040006:
case 846040025:
case 846040004:
case 846040018:
case 846040003:
case 846040009:
case 846040008:
return (
<RepresentationProgress_s78
props={props}
containerID={
props.props.props.accountDetails.containerID
}
currentView={currentView}
showQuestionnaireSection={showQuestionnaireSection}
setShowQuestionnaireSection={
setShowQuestionnaireSection
}
/>
);
break;
case 846040005:
case 846040006:
case 846040007:
return (
<RepresentationProgress_enforcement
props={props}
containerID={
props.props.props.accountDetails.containerID
}
currentView={currentView}
showQuestionnaireSection={showQuestionnaireSection}
setShowQuestionnaireSection={
setShowQuestionnaireSection
}
/>
);
break;
default:
return <>hello</>;
break;
}
}
};
let setCaseDetailsObj = router.query.hasOwnProperty("state")
? router.query.state == "edit"
? props.props.myRepresentations.myRepresentations
: props.props.searchResultsObj.searchDetailsObj
: props.props.searchResultsObj.searchDetailsObj;
var detailsObj = {};
detailsObj = jsonpath.query(
setCaseDetailsObj,
'$..[?(@.pinswg_name=="' +
currentView.caseReference.currentReference +
'")]'
);
let setCaseResultssObj = router.query.hasOwnProperty("state")
? router.query.state == "edit"
? props.props.myRepresentations.myRepresentations
: props.props.searchResultsObj.searchResultsObj
: props.props.searchResultsObj.searchResultsObj;
detailsObj = detailsObj[0];
var resultsObj = {};
resultsObj = jsonpath.query(
setCaseResultssObj,
'$..[?(@.pinswg_name=="' +
currentView.caseReference.currentReference +
'")]'
);
resultsObj = resultsObj[0];
//console.log(resultsObj, detailsObj);
return (
<>
<div className="govuk-grid-row">
<h2 className="govuk-heading-m ">
{typeof props.representationType != "undefined"
? props.representationType == "Questionnaire"
? locale == "cy"
? "Holiadur"
: props.representationType
: props.representationType
: locale == "cy"
? "Cynrychioliadau"
: "Representation"}{" "}
{locale == "cy" ? "o ACLI am a" : "from an LPA for a"}{" "}
{locale == "cy"
? jsonpath.query(
transLookup,
'$..[?(@.attributevalue=="' +
currentView.caseReference.appealType +
'")].value_cy'
)
: getFormCollectionByID(
currentView.caseReference.appealType
).value}
</h2>
{typeof props.representationType == "undefined" && (
<div className="govuk-form-group">
<label
className="govuk-label govuk-body-m"
htmlFor="representationType"
>
{t(
"myrepresentations:representation-from-an-agent-heading"
)}
?
</label>
<Field
id="representationType"
name="representationType"
component={RenderPickList}
datafieldname="representationType"
optionsArr={appellantApplicantRepresentationArr}
/>
</div>
)}
</div>
<div className="govuk-grid-row">
<div className="govuk-form-group">
{typeof props.representationType != "undefined" &&
(props.representationType != "Questionnaire" ? (
<>
<p className="govuk-body">
{t("myrepresentations:enter-comment-label")}
</p>
<fieldset
className="govuk-fieldset"
aria-describedby="commentBox-hint"
>
<div
id="commentBox-hint"
className="govuk-hint"
>
{t(
"myrepresentations:comments-set-out-label"
)}
:
</div>
<div className="govuk-form-group">
<Field
name="representationComments"
id="representationComments"
component={RenderMultiline}
type="text"
rows="5"
className="govuk-textarea govuk-input--width-30"
aria-describedby={
props.name + "-hint"
}
/>
</div>
</fieldset>
<fieldset
className="govuk-fieldset govuk-!-margin-top-9"
aria-describedby="commentBox-hint"
>
{" "}
<div className="govuk-form-group govuk-!-margin-bottom-9">
<FileUploadField
name={"representationDocuments"}
label={t(
"myrepresentations:add-files-label"
)}
ticketnumber={
props.props.caseReference
}
hint={"sdsd"}
fileList={[]}
setFilesForRepresentation={[]}
containerID={
props.props.props.accountDetails
.containerID
}
/>
</div>
</fieldset>
</>
) : (
whichQuestionnaire()
))}
</div>{" "}
</div>
<div className="govuk-grid-row">
<div className="govuk-button-group">
{typeof props.representationType != "undefined" &&
props.representationType == "Questionnaire" && (
<>
{showQuestionnaireSection < 7 && (
<a
href="#"
onClick={() => {
setShowQuestionnaireSection(
showQuestionnaireSection + 1
);
}}
className="govuk-button"
>
Next section
</a>
)}
{showQuestionnaireSection == 9 && (
<button
type="submit"
className="govuk-button"
data-module="govuk-button"
>
{t("common:continue-button")}ww
</button>
)}
{showQuestionnaireSection > 1 && (
<a
onClick={() => {
setShowQuestionnaireSection(
showQuestionnaireSection - 1
);
}}
className="govuk-link"
>
Back
</a>
)}
</>
)}{" "}
{typeof props.representationType != "undefined" &&
props.representationType != "Questionnaire" && (
<>
<button
type="submit"
className="govuk-button"
data-module="govuk-button"
>
{t("common:continue-button")}
</button>
{/* <a
onClick={() => {
setRepresentationSubmit(false);
}}
className="govuk-button"
>
{t("common:continue-button")}
</a> */}
<a
onClick={() => {
//setRepresentationCapacity();
}}
className="govuk-link"
>
{t("common:back-link")}
</a>
</>
)}
</div>
</div>
</>
);
};
const selector = formValueSelector("representationForm"); // <-- same as form name
RepLPA = connect((state) => {
const representationType = selector(state, "representationType");
const procedureType = selector(state, "procedureType");
return {
procedureType,
representationType,
};
})(RepLPA);
const mapStateToProps = (state, props) => {
let initialValuesTemp = Object.assign(
state.currentView.caseReference.hasOwnProperty("repDetails")
? state.currentView.caseReference.repDetails
: state.currentView.caseReference,
{
"onBehalfOfLPA":
props.props.props.accountDetails.accountDetails[
"pinswg_contact_associatedlpa@OData.Community.Display.V1.FormattedValue"
],
}
);
return {
search: state.search,
searchResultsObj: state.searchResultsObj,
formData: state.formData,
appealType: state.appealType,
currentView: state.currentView,
myRepresentations: state.myRepresentations,
initialValues: initialValuesTemp,
};
};
export default connect(mapStateToProps)(
reduxForm({
form: "representationForm",
enableReinitialize: true,
destroyOnUnmount: false,
})(RepLPA)
);
components/case/representation/representationLPACapacitySelection.js
+103
View File
@@ -0,0 +1,103 @@
import Link from "next/link";
import { connect } from "react-redux";
import { useRouter } from "next/router";
import useTranslation from "next-translate/useTranslation";
import {
Field,
reduxForm,
formValueSelector,
handleSubmit,
reset,
} from "redux-form";
import {
RenderPickList,
RenderTextfield,
RenderRadioList,
RenderMultiline,
} from "./representationElements";
import { useDropzone } from "react-dropzone";
import RepDetails from "./representationDetails";
import RepLPADetails from "./representationLPADetails";
import { setRepresentationCapacity } from "../../../store/currentView/action";
let RepLPACapacitySelection = (props) => {
let { t } = useTranslation();
const router = useRouter();
const { locale } = router;
const {
formObj,
capacityOptionsArr,
currentType,
casesObj,
validate,
handleSubmit,
} = props;
const { acceptedFiles, getRootProps, getInputProps } = useDropzone();
const files = acceptedFiles.map((file) => (
<li key={file.path}>
{file.path} - {file.size} bytes
</li>
));
const required = (value) => (value ? undefined : "Required");
return (
<>
<RepLPADetails
formObj={formObj}
currentType={currentType}
casesObj={casesObj}
caseReference={props.props.caseReference}
searchResultsObj={props.props.searchResultsObj}
props={props.props}
/>{" "}
<div id="rep-details" className="vo_hiddens">
<div className="govuk-grid-column-three-quarters">
<div className="govuk-grid-row">
{/* <h2 className="govuk-heading-m ">
Your details - {props.firstValue}
</h2> */}
{/* <div className="">
<label className="govuk-visually-hidden2">
<Field
name="representationCapacity"
datafieldname="representationCapacity"
label={t("myrepresentations:capacity-select-what-capacity-label")}
options={["LPA"]}
id="representationCapacity"
//className="govuk-radios__input "
errorMsg={t(
"newappeal:select-an-option-label"
)}
component="input"
validate={[required]}
value="LPA"
checked={"true"}
type="radio"
/>
LPA
</label>
</div> */}
</div>
</div>
<div className="govuk-grid-row">
<div className="govuk-grid-column-full">
<div className="govuk-button-group">
<button
type="submit"
className="govuk-button"
data-module="govuk-button"
>
{t("common:continue-button")}
</button>
</div>
</div>
</div>
</div>
</>
);
};
export default RepLPACapacitySelection;
components/case/representation/representationLPAComments.js
+78
View File
@@ -0,0 +1,78 @@
import Link from "next/link";
import { useRouter } from "next/router";
import useTranslation from "next-translate/useTranslation";
import { connect } from "react-redux";
import { Field, reduxForm, formValueSelector } from "redux-form";
import {
RenderPickList,
RenderTextfield,
RenderRadioList,
RenderMultiline,
RenderCondtionalRadioList,
RenderLPACondtionalRadioList,
FileUploadField,
RenderRichMultiline,
RenderDatePicker,
} from "./representationElements";
let RepLPAQuestionnaire = (props) => {
return (
<>
<p className="govuk-body">
{t("myrepresentations:enter-comment-label")}
</p>
<fieldset
className="govuk-fieldset"
aria-describedby="commentBox-hint"
>
<div id="commentBox-hint" className="govuk-hint">
{t("myrepresentations:comments-set-out-label")}:
</div>
<div className="govuk-form-group">
<Field
name="representationComments"
id="representationComments"
component={RenderMultiline}
type="text"
rows="5"
className="govuk-textarea govuk-input--width-30"
aria-describedby={props.name + "-hint"}
/>
</div>
</fieldset>
</>
);
};
const selector = formValueSelector("representationForm"); // <-- same as form name
RepLPAQuestionnaire = connect((state) => {
const representationTypeValue = selector(state, "representationType");
const procedureTypeValue = selector(state, "procedureType");
return {
procedureTypeValue,
representationTypeValue,
};
})(RepLPAQuestionnaire);
const mapStateToProps = (state, props) => {
console.log();
return {
search: state.search,
searchResultsObj: state.searchResultsObj,
formData: state.formData,
appealType: state.appealType,
currentView: state.currentView,
myRepresentations: state.myRepresentations,
initialValues: state.currentView.caseReference.repDetails,
};
};
export default connect(mapStateToProps)(
reduxForm({
form: "representationForm",
enableReinitialize: true,
destroyOnUnmount: false,
})(RepLPAQuestionnaire)
);
components/case/representation/representationLPADetails.js
+105
View File
@@ -0,0 +1,105 @@
import Link from "next/link";
import { useRouter } from "next/router";
import useTranslation from "next-translate/useTranslation";
import { Field, reduxForm } from "redux-form";
import { RenderPickList, RenderTextfield } from "./representationElements";
import jsonpath from "jsonpath";
const RepLPADetails = (props) => {
let { t } = useTranslation();
const router = useRouter();
const { locale } = router;
const { currentType, casesObj, caseReference } = props;
let setCaseDetailsObj = router.query.hasOwnProperty("state")
? router.query.state == "edit"
? props.props.myRepresentations.myRepresentations
: props.props.searchResultsObj.searchDetailsObj
: props.props.searchResultsObj.searchDetailsObj;
var detailsObj = {};
detailsObj = jsonpath.query(
setCaseDetailsObj,
'$..[?(@.pinswg_name=="' + caseReference + '")]'
);
detailsObj = detailsObj[0];
return (
<>
{" "}
<div className="govuk-grid-column-full">
<div id="rep-sumamry" className="govuk-grid-row">
<dl className="govuk-summary-list govuk-!-margin-bottom-9">
<div className="govuk-summary-list__row">
<dt className="govuk-summary-list__key">
{t("case:summary-applicant-label")}
</dt>
<dd className="govuk-summary-list__value">
{casesObj.appellantApplicant || ""}
{detailsObj[
"_pinswg_appellant_value@OData.Community.Display.V1.FormattedValue"
] || "not entered"}
</dd>
</div>
{/* <div className="govuk-summary-list__row">
<dt className="govuk-summary-list__key">
{t("case:summary-agent-label")}
</dt>
<dd className="govuk-summary-list__value">
Mr A Agent
</dd>
</div> */}
<div className="govuk-summary-list__row">
<dt className="govuk-summary-list__key">
{t("case:summary-site-address-label")}
</dt>
<dd className="govuk-summary-list__value">
{_.has(detailsObj, "pinswg_siteaddressline1")
? detailsObj.pinswg_siteaddressline1
: ""}
{_.has(detailsObj, "pinswg_siteaddressline1") &&
detailsObj.pinswg_siteaddressline1 !=
null && <br />}
{_.has(detailsObj, "pinswg_siteaddressline2")
? detailsObj.pinswg_siteaddressline2
: ""}
{_.has(detailsObj, "pinswg_siteaddressline2") &&
detailsObj.pinswg_siteaddressline2 !=
null && <br />}
{_.has(detailsObj, "pinswg_siteaddresstown")
? detailsObj.pinswg_siteaddresstown
: ""}
{_.has(detailsObj, "pinswg_siteaddresstown") &&
detailsObj.pinswg_siteaddresstown !=
null && <br />}
{_.has(detailsObj, "pinswg_siteaddresscounty")
? detailsObj.pinswg_siteaddresscounty
: ""}
{_.has(
detailsObj,
"pinswg_siteaddresscounty"
) &&
detailsObj.pinswg_siteaddresscounty !=
null && <br />}
{_.has(detailsObj, "pinswg_siteaddresspostcode")
? detailsObj.pinswg_siteaddresspostcode
: ""}
</dd>
</div>
</dl>
</div>
<div className="govuk-grid-row">
<p className="govuk-body">
{t("myrepresentations:lpa-capacity-para-one")}
</p>
</div>
</div>
</>
);
};
export default RepLPADetails;
components/case/representation/representationLandowner.js
+43 -124
View File
@@ -7,6 +7,8 @@ import {
RenderTextfield,
RenderRadioList,
RenderMultiline,
RenderRichMultiline,
FileUploadField,
} from "./representationElements";
import { useDropzone } from "react-dropzone";
import {
@@ -37,7 +39,7 @@ const RepLandOwner = (props) => {
<div className="govuk-grid-column-full">
<div className="govuk-grid-row">
<h2 className="govuk-heading-m ">
Representation - landowner
Representation for a Land owner
</h2>
<div className="govuk-form-group">
@@ -45,7 +47,10 @@ const RepLandOwner = (props) => {
className="govuk-label govuk-body-m"
htmlFor="representationType"
>
What kind of representation are you making?
{t(
"myrepresentations:representation-from-an-agent-heading"
)}
?
</label>
<Field
name="representationType"
@@ -55,7 +60,7 @@ const RepLandOwner = (props) => {
/>
</div>
</div>
<div className="govuk-grid-row">
{/* <div className="govuk-grid-row">
<div className="govuk-form-group">
<Field
className="govuk-input govuk-!-width-three-quarters"
@@ -68,138 +73,52 @@ const RepLandOwner = (props) => {
label="Description of representation"
/>
</div>
</div>
</div> */}
<div className="govuk-grid-row">
<div className="govuk-form-group">
<p className="govuk-body">
You can enter your comments in the space provided or
attach a separate document.
{t("myrepresentations:enter-comment-label")}
</p>
<fieldset
className="govuk-fieldset"
aria-describedby="commentBox-hint"
>
<div id="commentBox-hint" className="govuk-hint">
My comments are set out in:*
{t("myrepresentations:comments-set-out-label")}:
</div>
<div
className="govuk-checkboxes"
data-module="govuk-checkboxes"
>
<div className="govuk-checkboxes__item">
<Field
className="govuk-checkboxes__input"
id="commentBox"
name="commentBox"
value="email"
data-aria-controls="commentBox"
type="checkbox"
component={RenderTextfield}
/>
<label
className="govuk-label govuk-checkboxes__label"
htmlFor="commentBox"
>
the box below{" "}
</label>
</div>
<div
className={
_.isEmpty(formObj["representationForm"])
? "govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden rr"
: _.isEmpty(
formObj["representationForm"]
.values
)
? "govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden q11 "
: _.isEmpty(
formObj["representationForm"]
.values.commentBox
)
? formObj["representationForm"]
.values.commentBox == false
? "govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden www"
: "govuk-checkboxes__conditional"
: "govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden wwwaqqqq"
<div className="govuk-form-group">
<Field
name="representationComments"
id="representationComments"
component={RenderRichMultiline}
type="text"
rows="5"
className="govuk-textarea govuk-input--width-30"
aria-describedby={props.name + "-hint"}
/>
</div>
<div className="govuk-form-group govuk-!-margin-bottom-9">
<FileUploadField
name={"representationDocuments"}
label={t(
"myrepresentations:add-files-label"
)}
ticketnumber={props.props.caseReference}
hint={"sdsd"}
fileList={[]}
setFilesForRepresentation={[]}
containerID={
props.props.props.accountDetails
.containerID
}
id="conditional-commentBox"
>
<div className="govuk-form-group">
<Field
name="representationComments"
id="representationComments"
component={RenderMultiline}
type="text"
rows="5"
className="govuk-textarea govuk-input--width-30"
aria-describedby={
props.name + "-hint"
}
/>
</div>
</div>
<div className="govuk-checkboxes__item">
<Field
className="govuk-checkboxes__input"
id="documentBox"
name="documentBox"
value="email"
data-aria-controls="documentBox"
type="checkbox"
component={RenderTextfield}
/>
<label
className="govuk-label govuk-checkboxes__label"
htmlFor="documentBox"
>
separate documents
</label>
</div>
<div
className={
_.isEmpty(formObj["representationForm"])
? "govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden rr"
: _.isEmpty(
formObj["representationForm"]
.values
)
? "govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden www"
: _.isEmpty(
formObj["representationForm"]
.values.documentBox
)
? formObj["representationForm"]
.values.documentBox == false
? "govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden www"
: "govuk-checkboxes__conditional"
: "govuk-checkboxes__conditional govuk-checkboxes__conditional--hidden"
}
id="conditional-documentBox"
>
<div className="govuk-form-group">
<section className="container">
<div
{...getRootProps({
className: "dropzone",
})}
>
<input {...getInputProps()} />
<p>
Drag and drop files here or
click to select files
</p>
</div>
<aside>
<h4>Files</h4>
<ul>{files}</ul>
</aside>
</section>
</div>
</div>
/>
</div>
</fieldset>
</div>
</div>{" "}
</div>
<div className="govuk-grid-row">
<div className="govuk-button-group">
<button
@@ -207,7 +126,7 @@ const RepLandOwner = (props) => {
className="govuk-button"
data-module="govuk-button"
>
Continue
{t("common:continue-button")}
</button>
{/* <Link href="/representation">
<a
@@ -216,7 +135,7 @@ const RepLandOwner = (props) => {
}}
className="govuk-button"
>
Continue
{t("common:continue-button")}
</a>
</Link> */}
<a
@@ -225,7 +144,7 @@ const RepLandOwner = (props) => {
}}
className="govuk-link"
>
Back
{t("common:back-link")}
</a>
</div>
</div>
components/case/representation/representationProgress/representationProgress_enforcement.js
+540
View File
@@ -0,0 +1,540 @@
import Link from "next/link";
import { useRouter } from "next/router";
import useTranslation from "next-translate/useTranslation";
import { connect } from "react-redux";
import { Field, reduxForm, formValueSelector } from "redux-form";
import {
RenderPickList,
RenderTextfield,
RenderRadioList,
RenderMultiline,
RenderCondtionalRadioList,
RenderLPACondtionalRadioList,
FileUploadField,
RenderRichMultiline,
RenderDatePicker,
} from "../representationElements";
import {
setRepresentationCapacity,
setRepresentationSubmit,
} from "../../../../store/currentView/action";
import { useDropzone } from "react-dropzone";
import { select } from "xpath";
import jsonpath from "jsonpath";
const RepresentationProgress_enforcement = (props) => {
let { t } = useTranslation();
const router = useRouter();
const {
formObj,
appellantApplicantRepresentationArr,
setRepresentationCapacity,
setRepresentationSubmit,
currentView,
procedureTypeValue,
onBehalfOfLPA,
setShowQuestionnaireSection,
showQuestionnaireSection,
} = props;
return (
<nav
role="navigation"
aria-labelledby="progress-list"
className="at-nav"
>
<div
id="step-by-step-navigation"
data-module="gemstepnav"
className="app-step-nav app-step-nav--active"
data-id="e01e924b-9c7c-4c71-8241-66a575c2f61f"
data-show-text="show"
data-hide-text="hide"
data-show-all-text="Show all"
data-hide-all-text="Hide all"
>
<ol className="app-step-nav__steps">
<li
className={
"app-step-nav__step js-step app-step-nav__step--active" +
(showQuestionnaireSection >= 1
? " sectionComplete"
: " sectionIncomplete")
}
aria-current="step"
data-show=""
id="check-youre-allowed-to-drive"
>
<div
className="app-step-nav__header js-toggle-panel "
data-position="1"
>
<h3 className="app-step-nav__title ">
<span className="app-step-nav__circle app-step-nav__circle--number">
<span className="app-step-nav__circle-inner">
<span className="app-step-nav__circle-background">
<span className="app-step-nav__circle-step-label govuk-visually-hidden">
Step
</span>{" "}
1
<span
className="app-step-nav__circle-step-colon govuk-visually-hidden"
aria-hidden="true"
>
:
</span>
</span>
</span>
</span>
<span className="js-step-title">
<a
href="#"
onClick={() => {
setShowQuestionnaireSection(1);
}}
className="app-step-nav__button app-step-nav__button--title js-step-title-button"
aria-expanded="false"
aria-controls="step-panel-check-youre-allowed-to-drive-1"
>
<span className="js-step-title-text govuk-!-font-size-16">
{t(
"myrepresentations:enf-section-heading-one"
)}
</span>
</a>
</span>
</h3>
</div>
</li>
<li
className={
"app-step-nav__step js-step app-step-nav__step--active" +
(showQuestionnaireSection >= 2
? " sectionComplete"
: " sectionIncomplete")
}
aria-current="step"
data-show=""
id="check-youre-allowed-to-drive"
>
<div
className="app-step-nav__header js-toggle-panel "
data-position="1"
>
<h3 className="app-step-nav__title ">
<span className="app-step-nav__circle app-step-nav__circle--number">
<span className="app-step-nav__circle-inner">
<span className="app-step-nav__circle-background">
<span className="app-step-nav__circle-step-label govuk-visually-hidden">
Step
</span>{" "}
2
<span
className="app-step-nav__circle-step-colon govuk-visually-hidden"
aria-hidden="true"
>
:
</span>
</span>
</span>
</span>
<span className="js-step-title">
<a
href="#"
onClick={() => {
setShowQuestionnaireSection(2);
}}
className="app-step-nav__button app-step-nav__button--title js-step-title-button"
aria-expanded="false"
aria-controls="step-panel-check-youre-allowed-to-drive-1"
>
<span className="js-step-title-text govuk-!-font-size-16">
{t(
"myrepresentations:enf-section-heading-two"
)}
</span>
</a>
</span>
</h3>
</div>
</li>
<li
className={
"app-step-nav__step js-step app-step-nav__step--active" +
(showQuestionnaireSection >= 3
? " sectionComplete"
: " sectionIncomplete")
}
aria-current="step"
data-show=""
id="check-youre-allowed-to-drive"
>
<div
className="app-step-nav__header js-toggle-panel "
data-position="1"
>
<h3 className="app-step-nav__title ">
<span className="app-step-nav__circle app-step-nav__circle--number">
<span className="app-step-nav__circle-inner">
<span className="app-step-nav__circle-background">
<span className="app-step-nav__circle-step-label govuk-visually-hidden">
Step
</span>{" "}
3
<span
className="app-step-nav__circle-step-colon govuk-visually-hidden"
aria-hidden="true"
>
:
</span>
</span>
</span>
</span>
<span className="js-step-title">
<a
href="#"
onClick={() => {
setShowQuestionnaireSection(3);
}}
className="app-step-nav__button app-step-nav__button--title js-step-title-button"
aria-expanded="false"
aria-controls="step-panel-check-youre-allowed-to-drive-1"
>
<span className="js-step-title-text govuk-!-font-size-16">
{t(
"myrepresentations:enf-section-heading-three"
)}
</span>
</a>
</span>
</h3>
</div>
</li>
<li
className={
"app-step-nav__step js-step app-step-nav__step--active" +
(showQuestionnaireSection >= 4
? " sectionComplete"
: " sectionIncomplete")
}
aria-current="step"
data-show=""
id="check-youre-allowed-to-drive"
>
<div
className="app-step-nav__header js-toggle-panel "
data-position="1"
>
<h3 className="app-step-nav__title ">
<span className="app-step-nav__circle app-step-nav__circle--number">
<span className="app-step-nav__circle-inner">
<span className="app-step-nav__circle-background">
<span className="app-step-nav__circle-step-label govuk-visually-hidden">
Step
</span>{" "}
4
<span
className="app-step-nav__circle-step-colon govuk-visually-hidden"
aria-hidden="true"
>
:
</span>
</span>
</span>
</span>
<span className="js-step-title">
<a
href="#"
onClick={() => {
setShowQuestionnaireSection(4);
}}
className="app-step-nav__button app-step-nav__button--title js-step-title-button"
aria-expanded="false"
aria-controls="step-panel-check-youre-allowed-to-drive-1"
>
<span className="js-step-title-text govuk-!-font-size-16">
{t(
"myrepresentations:enf-section-heading-four"
)}
</span>
</a>
</span>
</h3>
</div>
</li>
<li
className={
"app-step-nav__step js-step app-step-nav__step--active" +
(showQuestionnaireSection >= 5
? " sectionComplete"
: " sectionIncomplete")
}
aria-current="step"
data-show=""
id="check-youre-allowed-to-drive"
>
<div
className="app-step-nav__header js-toggle-panel "
data-position="1"
>
<h3 className="app-step-nav__title ">
<span className="app-step-nav__circle app-step-nav__circle--number">
<span className="app-step-nav__circle-inner">
<span className="app-step-nav__circle-background">
<span className="app-step-nav__circle-step-label govuk-visually-hidden">
Step
</span>{" "}
5
<span
className="app-step-nav__circle-step-colon govuk-visually-hidden"
aria-hidden="true"
>
:
</span>
</span>
</span>
</span>
<span className="js-step-title">
<a
href="#"
onClick={() => {
setShowQuestionnaireSection(5);
}}
className="app-step-nav__button app-step-nav__button--title js-step-title-button"
aria-expanded="false"
aria-controls="step-panel-check-youre-allowed-to-drive-1"
>
<span className="js-step-title-text govuk-!-font-size-16">
{t(
"myrepresentations:enf-section-heading-five"
)}
</span>
</a>
</span>
</h3>
</div>
</li>
<li
className={
"app-step-nav__step js-step app-step-nav__step--active" +
(showQuestionnaireSection >= 6
? " sectionComplete"
: " sectionIncomplete")
}
aria-current="step"
data-show=""
id="check-youre-allowed-to-drive"
>
<div
className="app-step-nav__header js-toggle-panel "
data-position="1"
>
<h3 className="app-step-nav__title ">
<span className="app-step-nav__circle app-step-nav__circle--number">
<span className="app-step-nav__circle-inner">
<span className="app-step-nav__circle-background">
<span className="app-step-nav__circle-step-label govuk-visually-hidden">
Step
</span>{" "}
6
<span
className="app-step-nav__circle-step-colon govuk-visually-hidden"
aria-hidden="true"
>
:
</span>
</span>
</span>
</span>
<span className="js-step-title">
<a
href="#"
onClick={() => {
setShowQuestionnaireSection(6);
}}
className="app-step-nav__button app-step-nav__button--title js-step-title-button"
aria-expanded="false"
aria-controls="step-panel-check-youre-allowed-to-drive-1"
>
<span className="js-step-title-text govuk-!-font-size-16">
{t(
"myrepresentations:enf-section-heading-six"
)}
</span>
</a>
</span>
</h3>
</div>
</li>{" "}
<li
className={
"app-step-nav__step js-step app-step-nav__step--active" +
(showQuestionnaireSection >= 7
? " sectionComplete"
: " sectionIncomplete")
}
aria-current="step"
data-show=""
id="check-youre-allowed-to-drive"
>
<div
className="app-step-nav__header js-toggle-panel "
data-position="1"
>
<h3 className="app-step-nav__title ">
<span className="app-step-nav__circle app-step-nav__circle--number">
<span className="app-step-nav__circle-inner">
<span className="app-step-nav__circle-background">
<span className="app-step-nav__circle-step-label govuk-visually-hidden">
Step
</span>{" "}
7
<span
className="app-step-nav__circle-step-colon govuk-visually-hidden"
aria-hidden="true"
>
:
</span>
</span>
</span>
</span>
<span className="js-step-title">
<a
href="#"
onClick={() => {
setShowQuestionnaireSection(7);
}}
className="app-step-nav__button app-step-nav__button--title js-step-title-button"
aria-expanded="false"
aria-controls="step-panel-check-youre-allowed-to-drive-1"
>
<span className="js-step-title-text govuk-!-font-size-16">
{t(
"myrepresentations:enf-section-heading-seven"
)}
</span>
</a>
</span>
</h3>
</div>
</li>
<li
className={
"app-step-nav__step js-step app-step-nav__step--active" +
(showQuestionnaireSection >= 8
? " sectionComplete"
: " sectionIncomplete")
}
aria-current="step"
data-show=""
id="check-youre-allowed-to-drive"
>
<div
className="app-step-nav__header js-toggle-panel "
data-position="1"
>
<h3 className="app-step-nav__title ">
<span className="app-step-nav__circle app-step-nav__circle--number">
<span className="app-step-nav__circle-inner">
<span className="app-step-nav__circle-background">
<span className="app-step-nav__circle-step-label govuk-visually-hidden">
Step
</span>{" "}
8
<span
className="app-step-nav__circle-step-colon govuk-visually-hidden"
aria-hidden="true"
>
:
</span>
</span>
</span>
</span>
<span className="js-step-title">
<a
href="#"
onClick={() => {
setShowQuestionnaireSection(8);
}}
className="app-step-nav__button app-step-nav__button--title js-step-title-button"
aria-expanded="false"
aria-controls="step-panel-check-youre-allowed-to-drive-1"
>
<span className="js-step-title-text govuk-!-font-size-16">
{t(
"myrepresentations:add-files-label"
)}
</span>
</a>
</span>
</h3>
</div>
</li>
<li
className={
"app-step-nav__step js-step app-step-nav__step--active" +
(showQuestionnaireSection >= 9
? " sectionComplete"
: " sectionIncomplete")
}
aria-current="step"
data-show=""
id="check-youre-allowed-to-drive"
>
<div
className="app-step-nav__header js-toggle-panel "
data-position="1"
>
<h3 className="app-step-nav__title ">
<span className="app-step-nav__circle app-step-nav__circle--number">
<span className="app-step-nav__circle-inner">
<span className="app-step-nav__circle-background">
<span className="app-step-nav__circle-step-label govuk-visually-hidden">
Step
</span>{" "}
9
<span
className="app-step-nav__circle-step-colon govuk-visually-hidden"
aria-hidden="true"
>
:
</span>
</span>
</span>
</span>
<span className="js-step-title">
<a
href="#"
onClick={() => {
setShowQuestionnaireSection(9);
}}
className="app-step-nav__button app-step-nav__button--title js-step-title-button"
aria-expanded="false"
aria-controls="step-panel-check-youre-allowed-to-drive-1"
>
<span className="js-step-title-text govuk-!-font-size-16">
{t(
"myrepresentations:enf-section-heading-eight"
)}
</span>
</a>
</span>
</h3>
</div>
</li>
</ol>
</div>
</nav>
);
};
export default RepresentationProgress_enforcement;
components/case/representation/representationProgress/representationProgress_s78.js
+435
View File
@@ -0,0 +1,435 @@
import Link from "next/link";
import { useRouter } from "next/router";
import useTranslation from "next-translate/useTranslation";
import { connect } from "react-redux";
import { Field, reduxForm, formValueSelector } from "redux-form";
import {
RenderPickList,
RenderTextfield,
RenderRadioList,
RenderMultiline,
RenderCondtionalRadioList,
RenderLPACondtionalRadioList,
FileUploadField,
RenderRichMultiline,
RenderDatePicker,
} from "../representationElements";
import {
setRepresentationCapacity,
setRepresentationSubmit,
} from "../../../../store/currentView/action";
import { useDropzone } from "react-dropzone";
import { select } from "xpath";
import jsonpath from "jsonpath";
const RepresentationProgress_s78 = (props) => {
let { t } = useTranslation();
const router = useRouter();
const {
formObj,
appellantApplicantRepresentationArr,
setRepresentationCapacity,
setRepresentationSubmit,
currentView,
procedureTypeValue,
onBehalfOfLPA,
setShowQuestionnaireSection,
showQuestionnaireSection,
} = props;
return (
<nav
role="navigation"
aria-labelledby="progress-list"
className="at-nav"
>
<div
id="step-by-step-navigation"
data-module="gemstepnav"
className="app-step-nav app-step-nav--active"
data-id="e01e924b-9c7c-4c71-8241-66a575c2f61f"
data-show-text="show"
data-hide-text="hide"
data-show-all-text="Show all"
data-hide-all-text="Hide all"
>
<ol className="app-step-nav__steps">
<li
className={
"app-step-nav__step js-step app-step-nav__step--active" +
(showQuestionnaireSection >= 1
? " sectionComplete"
: " sectionIncomplete")
}
aria-current="step"
data-show=""
id="check-youre-allowed-to-drive"
>
<div
className="app-step-nav__header js-toggle-panel "
data-position="1"
>
<h3 className="app-step-nav__title ">
<span className="app-step-nav__circle app-step-nav__circle--number">
<span className="app-step-nav__circle-inner">
<span className="app-step-nav__circle-background">
<span className="app-step-nav__circle-step-label govuk-visually-hidden">
Step
</span>{" "}
1
<span
className="app-step-nav__circle-step-colon govuk-visually-hidden"
aria-hidden="true"
>
:
</span>
</span>
</span>
</span>
<span className="js-step-title">
<a
href="#"
onClick={() => {
setShowQuestionnaireSection(1);
}}
className="app-step-nav__button app-step-nav__button--title js-step-title-button"
aria-expanded="false"
aria-controls="step-panel-check-youre-allowed-to-drive-1"
>
<span className="js-step-title-text govuk-!-font-size-16">
{t(
"myrepresentations:s78-section-heading-one"
)}
</span>
</a>
</span>
</h3>
</div>
</li>
<li
className={
"app-step-nav__step js-step app-step-nav__step--active" +
(showQuestionnaireSection >= 2
? " sectionComplete"
: " sectionIncomplete")
}
aria-current="step"
data-show=""
id="check-youre-allowed-to-drive"
>
<div
className="app-step-nav__header js-toggle-panel "
data-position="1"
>
<h3 className="app-step-nav__title ">
<span className="app-step-nav__circle app-step-nav__circle--number">
<span className="app-step-nav__circle-inner">
<span className="app-step-nav__circle-background">
<span className="app-step-nav__circle-step-label govuk-visually-hidden">
Step
</span>{" "}
2
<span
className="app-step-nav__circle-step-colon govuk-visually-hidden"
aria-hidden="true"
>
:
</span>
</span>
</span>
</span>
<span className="js-step-title">
<a
href="#"
onClick={() => {
setShowQuestionnaireSection(2);
}}
className="app-step-nav__button app-step-nav__button--title js-step-title-button"
aria-expanded="false"
aria-controls="step-panel-check-youre-allowed-to-drive-1"
>
<span className="js-step-title-text govuk-!-font-size-16">
{t(
"myrepresentations:s78-section-heading-two"
)}
</span>
</a>
</span>
</h3>
</div>
</li>
<li
className={
"app-step-nav__step js-step app-step-nav__step--active" +
(showQuestionnaireSection >= 3
? " sectionComplete"
: " sectionIncomplete")
}
aria-current="step"
data-show=""
id="check-youre-allowed-to-drive"
>
<div
className="app-step-nav__header js-toggle-panel "
data-position="1"
>
<h3 className="app-step-nav__title ">
<span className="app-step-nav__circle app-step-nav__circle--number">
<span className="app-step-nav__circle-inner">
<span className="app-step-nav__circle-background">
<span className="app-step-nav__circle-step-label govuk-visually-hidden">
Step
</span>{" "}
3
<span
className="app-step-nav__circle-step-colon govuk-visually-hidden"
aria-hidden="true"
>
:
</span>
</span>
</span>
</span>
<span className="js-step-title">
<a
href="#"
onClick={() => {
setShowQuestionnaireSection(3);
}}
className="app-step-nav__button app-step-nav__button--title js-step-title-button"
aria-expanded="false"
aria-controls="step-panel-check-youre-allowed-to-drive-1"
>
<span className="js-step-title-text govuk-!-font-size-16">
{t(
"myrepresentations:s78-section-heading-three"
)}
</span>
</a>
</span>
</h3>
</div>
</li>
<li
className={
"app-step-nav__step js-step app-step-nav__step--active" +
(showQuestionnaireSection >= 4
? " sectionComplete"
: " sectionIncomplete")
}
aria-current="step"
data-show=""
id="check-youre-allowed-to-drive"
>
<div
className="app-step-nav__header js-toggle-panel "
data-position="1"
>
<h3 className="app-step-nav__title ">
<span className="app-step-nav__circle app-step-nav__circle--number">
<span className="app-step-nav__circle-inner">
<span className="app-step-nav__circle-background">
<span className="app-step-nav__circle-step-label govuk-visually-hidden">
Step
</span>{" "}
4
<span
className="app-step-nav__circle-step-colon govuk-visually-hidden"
aria-hidden="true"
>
:
</span>
</span>
</span>
</span>
<span className="js-step-title">
<a
href="#"
onClick={() => {
setShowQuestionnaireSection(4);
}}
className="app-step-nav__button app-step-nav__button--title js-step-title-button"
aria-expanded="false"
aria-controls="step-panel-check-youre-allowed-to-drive-1"
>
<span className="js-step-title-text govuk-!-font-size-16">
{t(
"myrepresentations:s78-section-heading-four"
)}
</span>
</a>
</span>
</h3>
</div>
</li>
<li
className={
"app-step-nav__step js-step app-step-nav__step--active" +
(showQuestionnaireSection >= 5
? " sectionComplete"
: " sectionIncomplete")
}
aria-current="step"
data-show=""
id="check-youre-allowed-to-drive"
>
<div
className="app-step-nav__header js-toggle-panel "
data-position="1"
>
<h3 className="app-step-nav__title ">
<span className="app-step-nav__circle app-step-nav__circle--number">
<span className="app-step-nav__circle-inner">
<span className="app-step-nav__circle-background">
<span className="app-step-nav__circle-step-label govuk-visually-hidden">
Step
</span>{" "}
5
<span
className="app-step-nav__circle-step-colon govuk-visually-hidden"
aria-hidden="true"
>
:
</span>
</span>
</span>
</span>
<span className="js-step-title">
<a
href="#"
onClick={() => {
setShowQuestionnaireSection(5);
}}
className="app-step-nav__button app-step-nav__button--title js-step-title-button"
aria-expanded="false"
aria-controls="step-panel-check-youre-allowed-to-drive-1"
>
<span className="js-step-title-text govuk-!-font-size-16">
{t(
"myrepresentations:s78-section-heading-five"
)}
</span>
</a>
</span>
</h3>
</div>
</li>{" "}
<li
className={
"app-step-nav__step js-step app-step-nav__step--active" +
(showQuestionnaireSection >= 6
? " sectionComplete"
: " sectionIncomplete")
}
aria-current="step"
data-show=""
id="check-youre-allowed-to-drive"
>
<div
className="app-step-nav__header js-toggle-panel "
data-position="1"
>
<h3 className="app-step-nav__title ">
<span className="app-step-nav__circle app-step-nav__circle--number">
<span className="app-step-nav__circle-inner">
<span className="app-step-nav__circle-background">
<span className="app-step-nav__circle-step-label govuk-visually-hidden">
Step
</span>{" "}
6
<span
className="app-step-nav__circle-step-colon govuk-visually-hidden"
aria-hidden="true"
>
:
</span>
</span>
</span>
</span>
<span className="js-step-title">
<a
href="#"
onClick={() => {
setShowQuestionnaireSection(6);
}}
className="app-step-nav__button app-step-nav__button--title js-step-title-button"
aria-expanded="false"
aria-controls="step-panel-check-youre-allowed-to-drive-1"
>
<span className="js-step-title-text govuk-!-font-size-16">
{t(
"myrepresentations:add-files-label"
)}
</span>
</a>
</span>
</h3>
</div>
</li>
<li
className={
"app-step-nav__step js-step app-step-nav__step--active" +
(showQuestionnaireSection >= 7
? " sectionComplete"
: " sectionIncomplete")
}
aria-current="step"
data-show=""
id="check-youre-allowed-to-drive"
>
<div
className="app-step-nav__header js-toggle-panel "
data-position="1"
>
<h3 className="app-step-nav__title ">
<span className="app-step-nav__circle app-step-nav__circle--number">
<span className="app-step-nav__circle-inner">
<span className="app-step-nav__circle-background">
<span className="app-step-nav__circle-step-label govuk-visually-hidden">
Step
</span>{" "}
7
<span
className="app-step-nav__circle-step-colon govuk-visually-hidden"
aria-hidden="true"
>
:
</span>
</span>
</span>
</span>
<span className="js-step-title">
<a
href="#"
onClick={() => {
setShowQuestionnaireSection(7);
}}
className="app-step-nav__button app-step-nav__button--title js-step-title-button"
aria-expanded="false"
aria-controls="step-panel-check-youre-allowed-to-drive-1"
>
<span className="js-step-title-text govuk-!-font-size-16">
{t(
"myrepresentations:s78-section-heading-seven"
)}
</span>
</a>
</span>
</h3>
</div>
</li>
</ol>
</div>
</nav>
);
};
export default RepresentationProgress_s78;
components/case/representation/representationQuestionnaires/representationLPAQuestionnaire_enforcement.js
+1213
View File
File diff suppressed because it is too large Load Diff
components/case/representation/representationQuestionnaires/representationLPAQuestionnaire_s78.js
+1024
View File
File diff suppressed because it is too large Load Diff
components/case/representation/representationQuestionnairesCheck/representationLPAQuestionnaireCheck_enforcement.js
+1786
View File
File diff suppressed because it is too large Load Diff
components/case/representation/representationQuestionnairesCheck/representationLPAQuestionnaireCheck_s78.js
+1786
View File
File diff suppressed because it is too large Load Diff
components/case/representationList.js
+2 -15
View File
@@ -6,10 +6,11 @@ import useTranslation from "next-translate/useTranslation";
import jsonpath from "jsonpath";
import _ from "lodash";
import transLookup from "../../data/lookuptranslations.json";
import LoadingOverlay from "react-loading-overlay";
import { getRepresentations } from "../../actions";
import { setRepresentations } from "../../store/searchOutput/action";
import PaginationControl from "./pagination";
import { formatDates } from "../utils";
const RepresentationList = (props) => {
const { incidentid, representationsObj, setRepresentations } = props;
@@ -153,15 +154,6 @@ const RepresentationList = (props) => {
const representationResultsObj = representationDetailsObj();
}, [incidentid, setRepresentations]);
function formatDates(dateObj) {
var dateObj = new Date(dateObj);
var dd = String(dateObj.getDate()).padStart(2, "0");
var mm = String(dateObj.getMonth() + 1).padStart(2, "0"); //January is 0!
var yyyy = dateObj.getFullYear();
return dd + "/" + mm + "/" + yyyy;
}
const pagesCount = Math.ceil(representationsObj["@odata.count"] / 10);
let currentPage = 0;
@@ -224,11 +216,6 @@ const RepresentationList = (props) => {
</div>
</div>
</div>
{/* <LoadingOverlay
active={showSpinnerState}
spinner
text={t("common:spinner-searching")}
/> */}
</>
);
};
components/case/summary.js
+315 -21
View File
@@ -6,16 +6,27 @@ import useTranslation from "next-translate/useTranslation";
import jsonpath from "jsonpath";
import _ from "lodash";
import transLookup from "../../data/lookuptranslations.json";
import LoadingOverlay from "react-loading-overlay";
import { getLinkedCases } from "../../actions";
import {
getLinkedCases,
createWatchedCases,
getWatchedCasesProxy,
getPortalModuleDetailsProxy,
deleteWatchedCases,
} from "../../actions";
import {
setCurrentLinkedCases,
setCurrentReference,
} from "../../store/currentView/action";
import {
setWatchedCases,
setWatchedCasesDetails,
} from "../../store/watchedCases/action";
import { getFormCollectionByID } from "../utils";
import { getSession, useSession } from "next-auth/react";
import { getSession, useSession, signIn } from "next-auth/react";
import { parseCookies, setCookie, destroyCookie } from "nookies";
import Pinswg_advertsid from "./summaryTypes/pinswg_advertsid";
import Pinswg_callinss77id from "./summaryTypes/pinswg_callinss77id";
@@ -62,12 +73,92 @@ const CaseSummary = (props) => {
setCurrentLinkedCases,
linkedCasesReference,
setCurrentReference,
setWatchedCases,
setWatchedCasesDetails,
showMap,
showLoginCheck,
} = props;
const { data: session, status } = useSession();
//console.log("session status:", status, session);
const cookies = parseCookies();
const selectWatchedCase = (loggedInUser, incidentID, appealType) => {
let updateBody = {
"pinswg_WatchedCase@odata.bind": "/incidents(" + incidentID + ")",
"pinswg_Contact@odata.bind": "/contacts(" + loggedInUser + ")",
"pinswg_appealcasetype": +appealType,
};
createWatchedCases(updateBody)
.then((data) => data)
.then(() => {
getWatchedCasesProxy(loggedInUser).then((data) => {
setWatchedCases(data),
getDetails(data, "myWatchedCases").then((data) => {
setWatchedCasesDetails(data);
});
});
});
};
const getDetails = (resultsObj, detailsType) => {
console.log(resultsObj);
let detailsArr = [];
resultsObj = resultsObj.value;
const detailsObj = resultsObj.map((searchDetail, index) => {
if (searchDetail.pinswg_appealcasetype == null) {
console.log(
detailsType != "myWatchedCases"
? searchDetail.ticketnumber
: searchDetail[
"_pinswg_watchedcase_value@OData.Community.Display.V1.FormattedValue"
]
);
} else {
detailsArr.push(
getPortalModuleDetailsProxy(
getFormCollectionByID(
searchDetail.pinswg_appealcasetype
).LogicalCollectionName,
detailsType != "myWatchedCases"
? searchDetail.ticketnumber
: searchDetail[
"_pinswg_watchedcase_value@OData.Community.Display.V1.FormattedValue"
]
)
);
}
});
//console.log(detailsArr);
return Promise.all(detailsArr);
};
const isWatchedCase = (whichIncident) => {
let isWatched = jsonpath.query(
watchedCases,
"$..value[?(@._pinswg_watchedcase_value=='" + whichIncident + "')]"
);
return isWatched;
};
const deleteItem = (caseID, topThreeType) => {
let cookies = parseCookies();
topThreeType == "watchedCases" &&
deleteWatchedCases(caseID)
.then((data) => data)
.then(() => {
getWatchedCasesProxy(cookies.pinsUser).then((data) => {
setWatchedCases(data),
getDetails(data, "myWatchedCases").then((data) => {
setWatchedCasesDetails(data);
});
});
});
};
const noRepresentationLink = ["/dnsdetails", "/dns/[developmentName]"];
let setCaseQueryObj = props[currentType];
@@ -113,6 +204,18 @@ const CaseSummary = (props) => {
let showDetails = typeof detailsObj != "undefined" ? true : false;
var timestamp = showDetails
? detailsObj.hasOwnProperty("pinswg_representation_period_end_date")
? Date.parse(detailsObj.pinswg_representation_period_end_date)
: "n/a"
: "n/a";
if (isNaN(timestamp) == false) {
var d = new Date(timestamp);
}
let hasEndDate = typeof d != "undefined";
let showDetailsBlock =
showDetails == true ? (
<div>
@@ -143,7 +246,6 @@ const CaseSummary = (props) => {
] || "not entered"}
</dd>
</div>
{detailsObj.pinswg_agentcontactname != null &&
(_.has(
detailsObj,
@@ -283,6 +385,182 @@ const CaseSummary = (props) => {
</dl>
</div>
</div>
{/* <div className="govuk-grid-row">
<div className="govuk-grid-column-full">
todays date - {formatDates(new Date())}
<br />
pinswg_startdate -{" "}
{formatDates(detailsObj.pinswg_startdate)}
<br />
days between pinswg_startdate & todays date -
{Math.floor(
(new Date(detailsObj.pinswg_startdate) -
new Date()) /
(24 * 3600 * 1000)
)}
<br />
pinswg_statementduedate -{" "}
{formatDates(detailsObj.pinswg_statementduedate)}
<br />
pinswg_finalcommentsduedate -{" "}
{formatDates(detailsObj.pinswg_finalcommentsduedate)}
<br />
pinswg_startdatetimeiftheevent -{" "}
{formatDates(detailsObj.pinswg_startdatetimeiftheevent)}
<br /> <br />
</div>
</div>
*/}
<div className="govuk-grid-row">
<div className="govuk-grid-column-full">
<div className="govuk-button-group">
{_.has(detailsObj, "pinswg_startdate") &&
showReps(
detailsObj.pinswg_startdate,
detailsObj.pinswg_finalcommentsduedate
) && (
<>
<Link
href={{
pathname:
"/myportal/representation",
query: {
case:
currentType ==
"searchResultsObj"
? detailsObj.pinswg_name
: casesObj.reference,
},
}}
className="govuk-button"
>
{t(
"case:summary-make-representation-label"
)}
</Link>
<a
onClick={() => {
//spinnerState();
router.back();
}}
className="govuk-button govuk-button--secondary"
>
{t(
"case:summary-back-button-label"
)}
</a>
</>
)}
<div className="govuk-body">
{session &&
(isWatchedCase(
props.currentView.caseReference
.incidentid
).length >
0 ==
true ? (
<span
className="govuk-link"
onClick={() => {
deleteItem(
isWatchedCase(
props.currentView
.caseReference
.incidentid
)[0].pinswg_watchlistid,
"watchedCases"
);
alert(
t(
"case:you-have-stopped-watching-label"
) +
props.currentView
.caseReference
.currentReference
);
}}
title={t(
"case:stop-watching-case-link"
)}
>
{t("case:stop-watching-case-link")}{" "}
</span>
) : (
<span
className=" govuk-link"
onClick={() => {
selectWatchedCase(
props.accountDetails
.loggedinUserId,
props.currentView
.caseReference
.incidentid,
props.currentView
.caseReference
.appealType
);
alert(
t(
"case:you-are-watching-label"
) +
" " +
props.currentView
.caseReference
.currentReference
);
}}
>
{t("case:watch-this-case-link")}
</span>
))}
{!session && (
<span
className="govuk-link"
onClick={() => {
// signIn("email");
signIn();
// selectWatchedCase(
// cookies.pinsUser,
// item.incidentid,
// item.pinswg_appealcasetype
// );
// alert(
// "Trying to watch case " +
// item.title
// );
}}
title={t("case:watch-this-case-link")}
>
{t("case:watch-this-case-link")}
</span>
)}
</div>
</div>
</div>
</div>
<div className="govuk-grid-row">
<div className="govuk-grid-column-full">
{_.has(detailsObj, "pinswg_startdate") &&
showRepsEnded(
detailsObj.pinswg_startdate,
detailsObj.pinswg_finalcommentsduedate
) && (
<div className="govuk-body">
{t(
"case:representation-period-ended-on-label"
)}
{formatDates(
detailsObj.pinswg_finalcommentsduedate
)}
</div>
)}
</div>
</div>
{/* 1{" "}
{_.has(detailsObj, "pinswg_startdatetimeiftheevent") &&
detailsObj.pinswg_startdatetimeiftheevent}
@@ -345,12 +623,13 @@ const CaseSummary = (props) => {
true ? (
""
) : (
<Link href="/representation">
<a className="govuk-button">
{t(
"case:summary-make-representation-label"
)}
</a>
<Link
href="/representation"
className="govuk-button"
>
{t(
"case:summary-make-representation-label"
)}
</Link>
)}
@@ -717,8 +996,9 @@ const CaseSummary = (props) => {
item.title +
"&lk=1"
}
className=""
>
<a className="">{item.title}</a>
{item.title}
</Link>
</li>
);
@@ -729,16 +1009,24 @@ const CaseSummary = (props) => {
);
}
return (
<>
{showDetailsBlock}
{/* <LoadingOverlay
active={showSpinnerState}
spinner
text={t("common:spinner-searching")}
/> */}
</>
);
function showReps(startDate, endDate) {
let date = new Date();
date = new Date(date.toDateString());
const start = new Date(startDate);
const end = new Date(endDate);
return date >= start && date <= end ? true : false;
}
function showRepsEnded(startDate, endDate) {
let date = new Date();
date = new Date(date.toDateString());
const start = new Date(startDate);
const end = new Date(endDate);
return date > start && date > end ? true : false;
}
return <>{showDetailsBlock}</>;
};
const mapStateToProps = (state) => {
@@ -755,6 +1043,12 @@ const mapDispatchToProps = (dispatch) => {
setCurrentReference: (currentReference) => {
dispatch(setCurrentReference(currentReference));
},
setWatchedCases: (watchedCases) => {
dispatch(setWatchedCases(watchedCases));
},
setWatchedCasesDetails: (watchedCasesDetails) => {
dispatch(setWatchedCasesDetails(watchedCasesDetails));
},
};
};
components/case/summaryTypes/pinswg_dnsid.js
+2 -2
View File
@@ -18,8 +18,8 @@ const Pinswg_dnsid = (props) => {
const router = useRouter();
const { locale } = router;
const point = {};
const siteCoords = {};
let point = {};
let siteCoords = {};
let center = {};
point = new OSPoint(
components/caseresults.js
+10 -10
View File
@@ -25,17 +25,17 @@ export default function Search({ children, pages }) {
<div className="govuk-grid-row">
<div className="govuk-grid-column-full">
<div className="govuk-button-group">
<Link href="/advancedsearch">
<a className="govuk-button">
{t("search:searchresults-search-button-label")}
</a>
<Link href="/advancedsearch" className="govuk-button">
{t("search:searchresults-search-button-label")}
</Link>
<Link href="/advancedsearch">
<a className="govuk-button govuk-button--secondary">
{t(
"search:searchresults-new-search-button-label"
)}
</a>
<Link href="/advancedsearch" className="govuk-button govuk-button--secondary">
{t(
"search:searchresults-new-search-button-label"
)}
</Link>
</div>
</div>
components/checkanswers.js
-1
View File
@@ -19,7 +19,6 @@ const CheckAnswers = (props) => {
id="main-content"
role="main"
>
sss
<BuildCheckSection
formXML={formXML}
sectionCount={sectionCount}
components/cookieBanner.js
+87 -89
View File
@@ -36,104 +36,102 @@ const CookieBanner = () => {
setBannerVisible(false);
};
return (
<>
{bannerVisible ? (
<CookieConsent
style={{
position: "inherit",
background: "#eeeeee",
display: "block",
}}
containerClasses="app-cookie-banner"
buttonClasses="cookies-banner__button"
buttonWrapperClasses="govuk-width-container consentBanner hidden"
declineButtonClasses="cookies-banner__button"
buttonText={t("common:cookie-banner-accept")}
declineButtonText={t("common:cookie-banner-decline")}
disableStyles={true}
enableDeclineButton={true}
flipButtons={true}
hideOnAccept={true}
cookieName="planning_casework"
>
<div className="app-cookie-banner">
<div
id="global-cookie-message"
className="govuk-clearfix"
data-module="cookie-banner"
role="region"
aria-label="cookie banner"
data-nosnippet=""
>
<div className="govuk-width-container">
<div className="govuk-grid-row">
<div className="govuk-grid-column-two-thirds">
<div className="">
<p className="cookies-banner__description">
return <>
{bannerVisible ? (
<CookieConsent
style={{
position: "inherit",
background: "#eeeeee",
display: "block",
}}
containerClasses="app-cookie-banner"
buttonClasses="cookies-banner__button"
buttonWrapperClasses="govuk-width-container consentBanner hidden"
declineButtonClasses="cookies-banner__button"
buttonText={t("common:cookie-banner-accept")}
declineButtonText={t("common:cookie-banner-decline")}
disableStyles={true}
enableDeclineButton={true}
flipButtons={true}
hideOnAccept={true}
cookieName="planning_casework"
>
<div className="app-cookie-banner">
<div
id="global-cookie-message"
className="govuk-clearfix"
data-module="cookie-banner"
role="region"
aria-label="cookie banner"
data-nosnippet=""
>
<div className="govuk-width-container">
<div className="govuk-grid-row">
<div className="govuk-grid-column-two-thirds">
<div className="">
<p className="cookies-banner__description">
{t(
"common:cookie-banner-line-1"
)}
</p>
<ul className="cookies-banner__description">
<li>
{" "}
{t(
"common:cookie-banner-line-1"
"common:cookie-banner-list-item-1"
)}
</p>
<ul className="cookies-banner__description">
<li>
{" "}
{t(
"common:cookie-banner-list-item-1"
)}
</li>
</ul>
<p className="cookies-banner__description">
</li>
</ul>
<p className="cookies-banner__description">
{t(
"common:cookie-banner-line-2"
)}
</p>
<ul className="cookies-banner__description">
<li>
{t(
"common:cookie-banner-line-2"
"common:cookie-banner-list-item-2"
)}
</p>
<ul className="cookies-banner__description">
<li>
{t(
"common:cookie-banner-list-item-2"
)}
</li>
<li>
{t(
"common:cookie-banner-list-item-3"
)}
</li>
</ul>
</div>
</li>
<li>
{t(
"common:cookie-banner-list-item-3"
)}
</li>
</ul>
</div>
</div>
</div>
</div>
<div className="govuk-width-container consentBannerShow">
<button
className="cookies-banner__button"
id="rcc-confirm-button"
aria-label="Accept cookies"
onClick={() => {
accept();
}}
>
{t("common:cookie-banner-accept")}
</button>
<Link href="/help/cookies">
<a
className="cookies-banner__button govuk-link--no-underline"
id="rcc-decline-button"
aria-label="Decline cookies"
>
{t("common:cookie-banner-change-settings")}
</a>
</Link>
</div>
</div>
</CookieConsent>
) : (
""
)}
</>
);
<div className="govuk-width-container consentBannerShow">
<button
className="cookies-banner__button"
id="rcc-confirm-button"
aria-label="Accept cookies"
onClick={() => {
accept();
}}
>
{t("common:cookie-banner-accept")}
</button>
<Link
href="/help/cookies"
className="cookies-banner__button govuk-link--no-underline"
id="rcc-decline-button"
aria-label="Decline cookies">
{t("common:cookie-banner-change-settings")}
</Link>
</div>
</div>
</CookieConsent>
) : (
""
)}
</>;
};
export default CookieBanner;
components/cookiemanager/index.js
+6 -6
View File
@@ -431,12 +431,12 @@ const CookieManagementMain = (props) => {
href={t(
"cookies:cookie-settings-essential-link"
)}
>
<a className="govuk-link govuk-link--no-underline govuk-!-font-weight-bold">
{t(
"cookies:cookie-settings-essential-link-label"
)}
</a>
className="govuk-link govuk-link--no-underline govuk-!-font-weight-bold">
{t(
"cookies:cookie-settings-essential-link-label"
)}
</Link>
</p>
</legend>
components/dns/applications/applicationsIntro.js
+4 -4
View File
@@ -27,10 +27,10 @@ const ApplicationIntro = (props) => {
</ul>
<p className="govuk-body">
{t("dnsApplications:page-intro-paragraph-2")}{" "}
<Link href="/dns/calendar">
<a className="govuk-link">
{t("dnsApplications:page-intro-paragraph-2-link")}
</a>
<Link href="/dns/calendar" className="govuk-link">
{t("dnsApplications:page-intro-paragraph-2-link")}
</Link>
.
</p>
components/dns/applications/applicationsList.js
+445 -463
View File
@@ -9,505 +9,487 @@ const ApplicationList = (props) => {
const router = useRouter();
const { locale } = router;
return (
<>
<div className="govuk-grid-row govuk-!-margin-top-9">
<div className="govuk-grid-column-full">
<div className="govuk-form-group">
<label className="govuk-label-s " htmlFor="sort">
{t("dnsCommon:result-list-show-label")}{" "}
<select
className="govuk-select"
id="showNo"
name="showNo"
>
<option value="1">10</option>
<option value="1">25</option>
<option value="1">50</option>
<option value="1">100</option>
</select>{" "}
{t("dnsCommon:result-list-entries-label")}
</label>
return <>
<div className="govuk-grid-row govuk-!-margin-top-9">
<div className="govuk-grid-column-full">
<div className="govuk-form-group">
<label className="govuk-label-s " htmlFor="sort">
{t("dnsCommon:result-list-show-label")}{" "}
<select
className="govuk-select"
id="showNo"
name="showNo"
>
<option value="1">10</option>
<option value="1">25</option>
<option value="1">50</option>
<option value="1">100</option>
</select>{" "}
{t("dnsCommon:result-list-entries-label")}
</label>
</div>
</div>
</div>
<div className="govuk-grid-row">
<div className="govuk-grid-column-full">
<p className="govuk-body-s">
{t("dnsCommon:result-list-showing-label", {
recordIndex: "1",
pagingIndex: "10",
totalRecords: "55",
})}
</p>
</div>
</div>
<div className="govuk-grid-row ">
<div className="govuk-grid-column-full">
<dl className="govuk-summary-list govuk-!-margin-bottom-0 results">
<div className="govuk-summary-list__row results-headings">
<dd className="govuk-summary-list__key govuk-!-font-size-16 results_wider ">
{t(
"dnsApplications:result-list-heading-label-reference"
)}
</dd>
<dd className="govuk-summary-list__key govuk-!-font-size-16">
{t(
"dnsApplications:result-list-heading-label-application"
)}
</dd>
<dd className="govuk-summary-list__key govuk-!-font-size-16">
{t(
"dnsApplications:result-list-heading-label-developer"
)}
</dd>
<dd className="govuk-summary-list__key govuk-!-font-size-16">
{t(
"dnsApplications:result-list-heading-label-type"
)}
</dd>
<dd className="govuk-summary-list__key govuk-!-font-size-16">
{t(
"dnsApplications:result-list-heading-label-status"
)}
</dd>
</div>
</div>
</div>
<div className="govuk-grid-row">
<div className="govuk-grid-column-full">
<p className="govuk-body-s">
{t("dnsCommon:result-list-showing-label", {
recordIndex: "1",
pagingIndex: "10",
totalRecords: "55",
})}
</p>
</div>
</div>
<div className="govuk-grid-row ">
<div className="govuk-grid-column-full">
<dl className="govuk-summary-list govuk-!-margin-bottom-0 results">
<div className="govuk-summary-list__row results-headings">
<dd className="govuk-summary-list__key govuk-!-font-size-16 results_wider ">
<div className="govuk-summary-list__row">
<dd className="govuk-summary-list__value govuk-!-font-size-16 ">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-reference"
)}
</dd>
<dd className="govuk-summary-list__key govuk-!-font-size-16">
{t(
"dnsApplications:result-list-heading-label-application"
)}
</dd>
<dd className="govuk-summary-list__key govuk-!-font-size-16">
:
</span>
CAS-00009-W8N6W4
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<Link href="/dns/application-view">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-application"
)}
:{" "}
</span>TWA - Morlais Demonstration Zone
</Link>
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-developer"
)}
</dd>
<dd className="govuk-summary-list__key govuk-!-font-size-16">
:
</span>
Menter Mon
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-type"
)}
</dd>
<dd className="govuk-summary-list__key govuk-!-font-size-16">
:
</span>
Energy
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-status"
)}
</dd>
</div>
<div className="govuk-summary-list__row">
<dd className="govuk-summary-list__value govuk-!-font-size-16 ">
:
</span>
Recommendation
</dd>
</div>
<div className="govuk-summary-list__row">
<dd className="govuk-summary-list__value govuk-!-font-size-16 ">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-reference"
)}
:
</span>
CAS-00009-W8N6W4
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<Link href="/dns/application-view">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-reference"
"dnsApplications:result-list-heading-label-application"
)}
:
</span>
CAS-00009-W8N6W4
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<Link href="/dns/application-view">
<a>
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-application"
)}
:{" "}
</span>
TWA - Morlais Demonstration Zone
</a>
</Link>
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
:{" "}
</span>TWA - Morlais Demonstration Zone
</Link>
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-developer"
)}
:
</span>
Menter Mon
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-type"
)}
:
</span>
Energy
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-status"
)}
:
</span>
Recommendation
</dd>
</div>
<div className="govuk-summary-list__row">
<dd className="govuk-summary-list__value govuk-!-font-size-16 ">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-reference"
)}
:
</span>
CAS-00009-W8N6W4
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<Link href="/dns/application-view">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-developer"
"dnsApplications:result-list-heading-label-application"
)}
:
</span>
Menter Mon
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
:{" "}
</span>TWA - Morlais Demonstration Zone
</Link>
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-developer"
)}
:
</span>
Menter Mon
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-type"
)}
:
</span>
Energy
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-status"
)}
:
</span>
Recommendation
</dd>
</div>
<div className="govuk-summary-list__row">
<dd className="govuk-summary-list__value govuk-!-font-size-16 ">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-reference"
)}
:
</span>
CAS-00009-W8N6W4
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<Link href="/dns/application-view">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-type"
"dnsApplications:result-list-heading-label-application"
)}
:
</span>
Energy
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
:{" "}
</span>TWA - Morlais Demonstration Zone
</Link>
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-developer"
)}
:
</span>
Menter Mon
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-type"
)}
:
</span>
Energy
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-status"
)}
:
</span>
Recommendation
</dd>
</div>
<div className="govuk-summary-list__row">
<dd className="govuk-summary-list__value govuk-!-font-size-16 ">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-reference"
)}
:
</span>
CAS-00009-W8N6W4
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<Link href="/dns/application-view">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-status"
"dnsApplications:result-list-heading-label-application"
)}
:
</span>
Recommendation
</dd>
</div>
<div className="govuk-summary-list__row">
<dd className="govuk-summary-list__value govuk-!-font-size-16 ">
:{" "}
</span>TWA - Morlais Demonstration Zone
</Link>
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-developer"
)}
:
</span>
Menter Mon
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-type"
)}
:
</span>
Energy
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-status"
)}
:
</span>
Recommendation
</dd>
</div>
<div className="govuk-summary-list__row">
<dd className="govuk-summary-list__value govuk-!-font-size-16 ">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-reference"
)}
:
</span>
CAS-00009-W8N6W4
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<Link href="/dns/application-view">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-reference"
"dnsApplications:result-list-heading-label-application"
)}
:
</span>
CAS-00009-W8N6W4
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<Link href="/dns/application-view">
<a>
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-application"
)}
:{" "}
</span>
TWA - Morlais Demonstration Zone
</a>
</Link>
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
:{" "}
</span>TWA - Morlais Demonstration Zone
</Link>
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-developer"
)}
:
</span>
Menter Mon
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-type"
)}
:
</span>
Energy
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-status"
)}
:
</span>
Recommendation
</dd>
</div>
<div className="govuk-summary-list__row">
<dd className="govuk-summary-list__value govuk-!-font-size-16 ">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-reference"
)}
:
</span>
CAS-00009-W8N6W4
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<Link href="/dns/application-view">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-developer"
"dnsApplications:result-list-heading-label-application"
)}
:
</span>
Menter Mon
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
:{" "}
</span>TWA - Morlais Demonstration Zone
</Link>
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-developer"
)}
:
</span>
Menter Mon
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-type"
)}
:
</span>
Energy
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-status"
)}
:
</span>
Recommendation
</dd>
</div>
<div className="govuk-summary-list__row">
<dd className="govuk-summary-list__value govuk-!-font-size-16 ">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-reference"
)}
:
</span>
CAS-00009-W8N6W4
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<Link href="/dns/application-view">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-type"
"dnsApplications:result-list-heading-label-application"
)}
:
</span>
Energy
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-status"
)}
:
</span>
Recommendation
</dd>
</div>
<div className="govuk-summary-list__row">
<dd className="govuk-summary-list__value govuk-!-font-size-16 ">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-reference"
)}
:
</span>
CAS-00009-W8N6W4
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<Link href="/dns/application-view">
<a>
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-application"
)}
:{" "}
</span>
TWA - Morlais Demonstration Zone
</a>
</Link>
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-developer"
)}
:
</span>
Menter Mon
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-type"
)}
:
</span>
Energy
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-status"
)}
:
</span>
Recommendation
</dd>
</div>
<div className="govuk-summary-list__row">
<dd className="govuk-summary-list__value govuk-!-font-size-16 ">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-reference"
)}
:
</span>
CAS-00009-W8N6W4
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<Link href="/dns/application-view">
<a>
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-application"
)}
:{" "}
</span>
TWA - Morlais Demonstration Zone
</a>
</Link>
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-developer"
)}
:
</span>
Menter Mon
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-type"
)}
:
</span>
Energy
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-status"
)}
:
</span>
Recommendation
</dd>
</div>
<div className="govuk-summary-list__row">
<dd className="govuk-summary-list__value govuk-!-font-size-16 ">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-reference"
)}
:
</span>
CAS-00009-W8N6W4
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<Link href="/dns/application-view">
<a>
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-application"
)}
:{" "}
</span>
TWA - Morlais Demonstration Zone
</a>
</Link>
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-developer"
)}
:
</span>
Menter Mon
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-type"
)}
:
</span>
Energy
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-status"
)}
:
</span>
Recommendation
</dd>
</div>
<div className="govuk-summary-list__row">
<dd className="govuk-summary-list__value govuk-!-font-size-16 ">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-reference"
)}
:
</span>
CAS-00009-W8N6W4
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<Link href="/dns/application-view">
<a>
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-application"
)}
:{" "}
</span>
TWA - Morlais Demonstration Zone
</a>
</Link>
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-developer"
)}
:
</span>
Menter Mon
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-type"
)}
:
</span>
Energy
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-status"
)}
:
</span>
Recommendation
</dd>
</div>
<div className="govuk-summary-list__row">
<dd className="govuk-summary-list__value govuk-!-font-size-16 ">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-reference"
)}
:
</span>
CAS-00009-W8N6W4
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<Link href="/dns/application-view">
<a>
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-application"
)}
:{" "}
</span>
TWA - Morlais Demonstration Zone
</a>
</Link>
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-developer"
)}
:
</span>
Menter Mon
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-type"
)}
:
</span>
Energy
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-status"
)}
:
</span>
Recommendation
</dd>
</div>
<div className="govuk-summary-list__row">
<dd className="govuk-summary-list__value govuk-!-font-size-16 ">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-reference"
)}
:
</span>
CAS-00009-W8N6W4
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<Link href="/dns/application-view">
<a>
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-application"
)}
:{" "}
</span>
TWA - Morlais Demonstration Zone
</a>
</Link>
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-developer"
)}
:
</span>
Menter Mon
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-type"
)}
:
</span>
Energy
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-status"
)}
:
</span>
Recommendation
</dd>
</div>
</dl>
</div>
:{" "}
</span>TWA - Morlais Demonstration Zone
</Link>
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-developer"
)}
:
</span>
Menter Mon
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-type"
)}
:
</span>
Energy
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t(
"dnsApplications:result-list-heading-label-status"
)}
:
</span>
Recommendation
</dd>
</div>
</dl>
</div>
<div className="govuk-grid-row ">
<div className="govuk-grid-column-full">
<p>
{t("dnsCommon:result-list-previous-label")}{" "}
<span>1</span>{" "}
<span>
<Link href="#">2</Link>
</span>{" "}
<span>
<Link href="#">3</Link>
</span>{" "}
<span>
<Link href="#">4</Link>
</span>{" "}
<span>
<Link href="#">5</Link>
</span>{" "}
<Link href="#">
{t("dnsCommon:result-list-next-label")}
</Link>
</p>
</div>
</div>
<div className="govuk-grid-row ">
<div className="govuk-grid-column-full">
<p>
{t("dnsCommon:result-list-previous-label")}{" "}
<span>1</span>{" "}
<span>
<Link href="#">2</Link>
</span>{" "}
<span>
<Link href="#">3</Link>
</span>{" "}
<span>
<Link href="#">4</Link>
</span>{" "}
<span>
<Link href="#">5</Link>
</span>{" "}
<Link href="#" legacyBehavior>
{t("dnsCommon:result-list-next-label")}
</Link>
</p>
</div>
</>
);
</div>
</>;
};
export default ApplicationList;
components/dns/homepage/applicationsForComment.js
+3 -3
View File
@@ -15,10 +15,10 @@ const ApplicationsForComment = (props) => {
<div className="govuk-panel__body">
<ul className="govuk-list">
<li>
<Link href="/dns/application-view">
<a className="govuk-body-s ">
<Link href="/dns/application-view" className="govuk-body-s ">
Holyhead Harbour Revision Order
</a>
</Link>
</li>
</ul>
components/dns/homepage/dnsLinks.js
+10 -8
View File
@@ -13,10 +13,10 @@ const DNSLinks = (props) => {
<ul className="govuk-list">
<li>
<h3 className="govuk-heading-l govuk-!-font-size-27">
<Link href="/dnsapplications">
<a className="govuk-link govuk-link--no-underline">
{t("dnsHome:links-applications-title")}
</a>
<Link href="/dnsapplications" className="govuk-link govuk-link--no-underline">
{t("dnsHome:links-applications-title")}
</Link>
<p className="govuk-body-s govuk-!-padding-top-2">
{t(
@@ -43,10 +43,12 @@ const DNSLinks = (props) => {
<ul className="govuk-list">
<li>
<h3 className="govuk-heading-l govuk-!-font-size-27">
<Link href="https://gov.wales/developments-national-significance-dns-guidance">
<a className="govuk-link govuk-link--no-underline ">
{t("dnsHome:links-help-title")}
</a>
<Link
href="https://gov.wales/developments-national-significance-dns-guidance"
className="govuk-link govuk-link--no-underline ">
{t("dnsHome:links-help-title")}
</Link>
<p className="govuk-body-s govuk-!-padding-top-2">
{t("dnsHome:links-guidance-intro-paragraph")}
components/dns/homepage/latestApplications.js
+2 -2
View File
@@ -4,7 +4,7 @@ import useTranslation from "next-translate/useTranslation";
const LatestApplications = (props) => {
let { t } = useTranslation();
const { dnsList } = props;
let { dnsList } = props;
dnsList = dnsList.value;
let dnsListArr = dnsList.slice(0, 3);
@@ -33,7 +33,7 @@ const LatestApplications = (props) => {
.join("-"))
}
>
<a>{dnsList[key].title}</a>
{dnsList[key].title}
</Link>
</li>
);
components/dns/homepage/titleContent.js
+4 -4
View File
@@ -72,10 +72,10 @@ const TitleContent = (props) => {
? value.split(" - ")[1].split(" ").join("-")
: value)
}
>
<a className="govuk-button govuk-!-margin-bottom-0 ">
{t("dnsHome:title-application-search-button")}
</a>
className="govuk-button govuk-!-margin-bottom-0 ">
{t("dnsHome:title-application-search-button")}
</Link>
</div>
</div>
components/elements/index.js
+116 -165
View File
@@ -1,8 +1,6 @@
import useSWR from "swr";
import { Field, reduxForm } from "redux-form";
import { useRouter } from "next/router";
import DatePicker, { registerLocale, setDefaultLocale } from "react-datepicker";
import cy from "date-fns/locale/cy";
import React, { useCallback, useEffect, useMemo, useState } from "react";
import "react-datepicker/dist/react-datepicker.css";
import moment from "moment";
@@ -22,6 +20,12 @@ import {
import { setFilesForAppeal } from "../../store/appealType/action";
import Link from "next/link";
import {
getFormCollectionByID,
getThumbnailIconByExtension,
bytesToSize,
} from "../utils";
import {
addYears,
addMonths,
@@ -289,7 +293,6 @@ const RenderDatePicker = ({
...custom
}) => {
const router = useRouter();
registerLocale("cy", cy);
var startDateArr =
custom.dateStart != "0" ? custom.dateStart.split("") : custom.dateStart;
@@ -1312,13 +1315,6 @@ const RenderFileUpload = (field) => {
</div>
));
function bytesToSize(bytes) {
var sizes = ["Bytes", "KB", "MB", "GB", "TB"];
if (bytes == 0) return "0 Byte";
var i = parseInt(Math.floor(Math.log(bytes) / Math.log(1024)));
return Math.round(bytes / Math.pow(1024, i), 2) + " " + sizes[i];
}
const getThumbnailIcon = (fileObj, fileType) => {
switch (fileType) {
case "text/html":
@@ -1356,47 +1352,6 @@ const RenderFileUpload = (field) => {
}
};
const getThumbnailIconByExtension = (blobName) => {
let fileType = blobName.slice(blobName.lastIndexOf(".") + 1);
switch (fileType) {
case "html":
return "/assets/images/documenttypes/html.png";
break;
case "txt":
return "/assets/images/documenttypes/txt.png";
break;
case "doc":
return "/assets/images/documenttypes/doc.png";
break;
case "pdf":
return "/assets/images/documenttypes/pdf.png";
break;
case "docx":
return "/assets/images/documenttypes/docx.png";
break;
case "csv":
return "/assets/images/documenttypes/csv.png";
break;
case "xlsx":
return "/assets/images/documenttypes/xlsx.png";
break;
case "zip":
return "/assets/images/documenttypes/zip.png";
break;
case "jpeg":
case "jpg":
return "/assets/images/documenttypes/jpg.png";
case "png":
return "/assets/images/documenttypes/png.png";
break;
default:
return "/assets/images/documenttypes/txt.png";
break;
}
};
const getDocumentType = (docCode) => {
switch (docCode) {
case "000001":
@@ -1476,125 +1431,121 @@ 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],
`${getDocumentType(field.documentTypeCode)}_${
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"
)}
</div>
<em>
(
{t(
"newappeal:new-appeal-fileupload-file-list-label"
)}
)
</em>
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],
`${getDocumentType(field.documentTypeCode)}_${
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"
)}
</div>
<aside>{thumbs}</aside>
</section>
</>
)}
</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.slice(file.name.indexOf("_") + 1)} (
({bytesToSize(file.size)})
</span>
<em>
(
{t(
"newappeal:new-appeal-fileupload-file-list-label"
)}
)
</em>
</div>
))}
</ul>
<aside>{thumbs}</aside>
</section>
</>
)}
{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;
</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.slice(file.name.indexOf("_") + 1)} ( */}{" "}
{file.name}( ({bytesToSize(file.size)})
</span>
</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
}
))}
</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"
>
<a className="govuk-body govuk-!-font-size-14 govuk-!-padding-left-5 govuk-link">
{blob.name.slice(blob.name.indexOf("_") + 1)} (
{bytesToSize(blob.contentLength)})
</a>
</Link>
&minus;
</span>
</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.slice(blob.name.indexOf("_") + 1)}({bytesToSize(blob.contentLength)})
</Link>
</div>
))}{" "}
</>;
};
components/errorpage.js
+8 -8
View File
@@ -35,15 +35,15 @@ const Errorpage = () => {
Unfortunately something has gone wrong!
</p>
<p className="govuk-body govuk-!-margin-top-9">{dateString}</p>
<Link href="/">
<a
role="button"
draggable="false"
className="govuk-button govuk-button--start govuk-!-margin-top-2 govuk-!-margin-bottom-8"
data-module="govuk-button"
>
<Link
href="/"
role="button"
draggable="false"
className="govuk-button govuk-button--start govuk-!-margin-top-2 govuk-!-margin-bottom-8"
data-module="govuk-button">
Try again
</a>
</Link>
<br />
</div>
components/footer.js
+223 -233
View File
@@ -13,8 +13,8 @@ export default function Footer(props) {
const linksBlock = Object.keys(linksArr).map((key) => (
<li className="govuk-footer__inline-list-item" key={key}>
<Link href={linksArr[key].path || "/"}>
<a className="govuk-footer__link">{linksArr[key].title}</a>
<Link href={linksArr[key].path || "/"} className="govuk-footer__link">
{linksArr[key].title}
</Link>
</li>
));
@@ -34,257 +34,247 @@ export default function Footer(props) {
" " +
t("common:gov-wales-label").toLowerCase();
return (
<>
<div className="sharebar" id="sharebar">
<div className="sharebar__components container-fluid">
<div className="main__sharebar">
<div
return <>
<div className="sharebar" id="sharebar">
<div className="sharebar__components container-fluid">
<div className="main__sharebar">
<div
className={
showShareState
? "block-share active"
: "block-share"
}
>
<button
id="sharePage"
aria-controls="sharePageLinks"
aria-expanded="true"
onClick={() => {
shareState();
}}
>
{t("common:social-bar-share-link")}
</button>
<ul
className={
showShareState
? "block-share active"
: "block-share"
}
id="sharePageLinks"
aria-labelledby="sharePage"
>
<button
id="sharePage"
aria-controls="sharePageLinks"
aria-expanded="true"
onClick={() => {
shareState();
}}
>
{t("common:social-bar-share-link")}
</button>
<ul
className={
showShareState
? "block-share active"
: "block-share"
}
id="sharePageLinks"
aria-labelledby="sharePage"
>
<li>
<li>
<a
href={
"https://twitter.com/intent/tweet?url=" +
shareBodyStr
}
className="twitter"
>
<span className="vo_hidden">
{t(
"common:social-bar-share-via-link"
)}{" "}
</span>
Twitter
</a>
</li>
<li>
<a
href={
"https://www.facebook.com/sharer/sharer.php?u=" +
shareBodyStr
}
className="facebook"
>
<span className="vo_hidden">
Share this page via{" "}
</span>
Facebook
</a>
</li>
<li>
<a
href={
"mailto:?body=" +
shareBodyStr +
"&subject=" +
shareSubjectStr
} //</li>https%3A//gov.wales/&amp;subject=Shared%20from%20gov.wales"
className="email"
>
<span className="vo_hidden">
Share this page via{" "}
</span>
Email
</a>
</li>
</ul>
</div>
<div
id="sharebar__backtotop"
className="btn--outlined btn--arrow-up"
>
<a href="#page_wrapper">
{t("common:back-to-top-link")}
</a>
</div>
</div>
</div>
</div>
<footer className="govuk-footer " role="contentinfo">
<div className="govuk-width-container ">
<div className="govuk-footer__meta">
<div className="govuk-footer__meta-item govuk-footer__meta-item--grow">
<h2 className="govuk-visually-hidden">
Support links
</h2>
<nav
role="navigation"
aria-labelledby="footer_links"
>
<ul className="govuk-footer__inline-list">
<li className="govuk-footer__inline-list-item govuk-!-font-weight-bold govuk-!-margin-right-7">
<a
href={
"https://twitter.com/intent/tweet?url=" +
shareBodyStr
}
className="twitter"
href={t(
"common:footer-guidance-link"
)}
className="nav-link"
>
<span className="vo_hidden">
{t(
"common:social-bar-share-via-link"
)}{" "}
</span>
Twitter
{t(
"common:footer-guidance-link-label"
)}
</a>
</li>
<li>
<li className="govuk-footer__inline-list-item govuk-!-font-weight-bold">
<a
href={
"https://www.facebook.com/sharer/sharer.php?u=" +
shareBodyStr
}
className="facebook"
href={t(
"common:footer-contact-us-link"
)}
className="govuk-footer__link"
id="aContactUs"
>
<span className="vo_hidden">
Share this page via{" "}
</span>
Facebook
</a>
</li>
<li>
<a
href={
"mailto:?body=" +
shareBodyStr +
"&subject=" +
shareSubjectStr
} //</li>https%3A//gov.wales/&amp;subject=Shared%20from%20gov.wales"
className="email"
>
<span className="vo_hidden">
Share this page via{" "}
</span>
Email
{t(
"common:footer-contact-us-link-label"
)}
</a>
</li>
</ul>
</div>
<ul
className="govuk-footer__inline-list"
id="footer_links"
>
<li className="govuk-footer__inline-list-item">
<Link
href={
router.locale == "cy"
? "/hygyrchedd"
: "/accessibility"
}
className="govuk-footer__link"
id="aAccessibility">
{t(
"common:footer-accessibility-link-label"
)}
</Link>
</li>
<li className="govuk-footer__inline-list-item">
<Link
href={
router.locale == "cy"
? "/help/cwcis"
: "/help/cookies"
}
id="aCookies"
className="govuk-footer__link">
{t(
"common:footer-cookies-link"
)}
</Link>
</li>
<li className="govuk-footer__inline-list-item">
<a
href={t(
"common:footer-copyright-link"
)}
className="govuk-footer__link"
id="Access"
>
{t(
"common:footer-copyright-link-label"
)}
</a>
</li>
<li className="govuk-footer__inline-list-item">
<Link
href={t(
"common:footer-privacy-link"
)}
id="aPrivacy"
className="govuk-footer__link">
{t(
"common:footer-privacy-link-label"
)}
</Link>
</li>
<li className="govuk-footer__inline-list-item">
<Link
href={t(
"common:footer-terms-conditions-link"
)}
id="aTermsConds"
className="govuk-footer__link">
{t(
"common:footer-terms-conditions-link-label"
)}
</Link>
</li>
{/* <li className="govuk-footer__inline-list-item">
<a
href={t(
"common:footer-alternative-languages-link"
)}
id="aTermsConds"
className="govuk-footer__link"
target="_blank"
rel="noreferrer"
>
{t(
"common:footer-alternative-languages-link-label"
)}
</a>
</li> */}
</ul>
</nav>
<div
id="sharebar__backtotop"
className="btn--outlined btn--arrow-up"
className="footer_logo container-fluid"
id="footer_logo"
>
<a href="#page_wrapper">
{t("common:back-to-top-link")}
<a
href={t("common:gov-wales-link")}
className="footer__logo"
id="footerlogo"
>
<span className="visually-hidden">
{t("common:gov-wales-label")}
</span>
</a>
</div>
</div>
</div>
</div>
<footer className="govuk-footer " role="contentinfo">
<div className="govuk-width-container ">
<div className="govuk-footer__meta">
<div className="govuk-footer__meta-item govuk-footer__meta-item--grow">
<h2 className="govuk-visually-hidden">
Support links
</h2>
<nav
role="navigation"
aria-labelledby="footer_links"
>
<ul className="govuk-footer__inline-list">
<li className="govuk-footer__inline-list-item govuk-!-font-weight-bold govuk-!-margin-right-7">
<a
href={t(
"common:footer-guidance-link"
)}
className="nav-link"
>
{t(
"common:footer-guidance-link-label"
)}
</a>
</li>
<li className="govuk-footer__inline-list-item govuk-!-font-weight-bold">
<a
href={t(
"common:footer-contact-us-link"
)}
className="govuk-footer__link"
id="aContactUs"
>
{t(
"common:footer-contact-us-link-label"
)}
</a>
</li>
</ul>
<ul
className="govuk-footer__inline-list"
id="footer_links"
>
<li className="govuk-footer__inline-list-item">
<Link
href={
router.locale == "cy"
? "/hygyrchedd"
: "/accessibility"
}
>
<a
className="govuk-footer__link"
id="aAccessibility"
>
{t(
"common:footer-accessibility-link-label"
)}
</a>
</Link>
</li>
<li className="govuk-footer__inline-list-item">
<Link
href={
router.locale == "cy"
? "/help/cwcis"
: "/help/cookies"
}
>
<a
id="aCookies"
className="govuk-footer__link"
>
{t(
"common:footer-cookies-link"
)}
</a>
</Link>
</li>
<li className="govuk-footer__inline-list-item">
<a
href={t(
"common:footer-copyright-link"
)}
className="govuk-footer__link"
id="Access"
>
{t(
"common:footer-copyright-link-label"
)}
</a>
</li>
<li className="govuk-footer__inline-list-item">
<Link
href={t(
"common:footer-privacy-link"
)}
>
<a
id="aPrivacy"
className="govuk-footer__link"
>
{t(
"common:footer-privacy-link-label"
)}
</a>
</Link>
</li>
<li className="govuk-footer__inline-list-item">
<Link
href={t(
"common:footer-terms-conditions-link"
)}
>
<a
id="aTermsConds"
className="govuk-footer__link"
>
{t(
"common:footer-terms-conditions-link-label"
)}
</a>
</Link>
</li>
{/* <li className="govuk-footer__inline-list-item">
<a
href={t(
"common:footer-alternative-languages-link"
)}
id="aTermsConds"
className="govuk-footer__link"
target="_blank"
rel="noreferrer"
>
{t(
"common:footer-alternative-languages-link-label"
)}
</a>
</li> */}
</ul>
</nav>
<div
className="footer_logo container-fluid"
id="footer_logo"
>
<a
href={t("common:gov-wales-link")}
className="footer__logo"
id="footerlogo"
>
<span className="visually-hidden">
{t("common:gov-wales-label")}
</span>
</a>
</div>
</div>
</div>
</div>
</footer>
</>
);
</footer>
</>;
}
components/header.js
+62 -44
View File
@@ -56,6 +56,16 @@ const Header = (props) => {
domainSwitch = process.env.I18N_DOMAIN;
}
const handleLogout = () => {
console.info("////////////\n" + "logout" + "\n////////////");
window.localStorage.clear(),
destroyCookie(null, "next-auth.csrf-token"),
destroyCookie(null, "next-auth.callback-url"),
destroyCookie(null, "pedw_locale"),
destroyCookie(null, "pinsUser"),
signOut({ callbackUrl: "/logout" });
};
return (
<header
className="govuk-header "
@@ -64,15 +74,17 @@ const Header = (props) => {
>
<div className="govuk-header__container govuk-width-container">
<div className="govuk-header__logo govuk-!-width-one-quarter">
<Link href={t("common:gov-wales-link")}>
<a className="govuk-header__link govuk-link--no-underline govuk-header__link--homepage">
<span className="govuk-header__logotype header__logo">
<img
alt="gov.wales"
src="/assets/images/cymru.svg"
/>
</span>
</a>
<Link
href={t("common:gov-wales-link")}
className="govuk-header__link govuk-link--no-underline govuk-header__link--homepage">
<span className="govuk-header__logotype header__logo">
<img
alt="gov.wales"
src="/assets/images/cymru.svg"
/>
</span>
</Link>
</div>
@@ -199,10 +211,12 @@ const Header = (props) => {
</div> */}
<div className="fullNavs">
{hasContactLink.includes(router.pathname) == true ? (
<Link href="/dns/contact-us">
<a className="govuk-header__link govuk-!-margin-right-3">
<Link
href="/dns/contact-us"
className="govuk-header__link govuk-!-margin-right-3">
Contact
</a>
</Link>
) : (
""
@@ -210,24 +224,20 @@ const Header = (props) => {
{noSignoutLink.includes(router.pathname) == true ? (
""
) : (
<Link
(<Link
href={
router.locale == "cy"
? "/allgofnodi"
: "/logout"
}
>
<a
onClick={() => {
window.localStorage.clear(),
destroyCookie({}, "pinsUser"),
signOut({ callbackUrl: "/logout" });
}}
className="govuk-header__link govuk-!-margin-right-3"
>
{t("common:signout-label")}
</a>
</Link>
onClick={() => {
handleLogout();
}}
className="govuk-header__link govuk-!-margin-right-3">
{t("common:signout-label")}
</Link>)
)}
<Link
@@ -257,25 +267,33 @@ const Header = (props) => {
: router.asPath
}
locale={locale == "en" ? "cy" : "en"}
>
<a
className="govuk-header__link "
lang={locale == "en" ? "cy" : "en"}
hrefLang={locale == "en" ? "cy" : "en"}
data-journey-click={
locale == "en"
? "link - click:lang-select:Cymraeg"
: "link - click:lang-select:English"
}
aria-label={
locale == "en"
? "Dewiswch Cymraeg"
: "Select English"
}
>
{" "}
{t("common:available-in")}
</a>
className="govuk-header__link "
lang={locale == "en" ? "cy" : "en"}
hrefLang={locale == "en" ? "cy" : "en"}
data-journey-click={
locale == "en"
? "link - click:lang-select:Cymraeg"
: "link - click:lang-select:English"
}
aria-label={
locale == "en"
? "Dewiswch Cymraeg"
: "Select English"
}
onClick={() => {
setCookie(
null,
"pedw_locale",
locale == "en" ? "cy" : "en",
{
path: "/",
}
);
}}>
{" "}
{t("common:available-in")}
</Link>
</div>
</div>
components/homepage/casesearch.js
+53 -61
View File
@@ -4,7 +4,6 @@ import { useRouter } from "next/router";
import useTranslation from "next-translate/useTranslation";
import { connect } from "react-redux";
import { Field, reduxForm } from "redux-form";
import LoadingOverlay from "react-loading-overlay";
const required = (errorMsg) => (value) =>
value || typeof value === "number" ? undefined : errorMsg;
@@ -95,69 +94,62 @@ let CaseSearch = (props) => {
});
};
return (
<>
<div className="card" id="casesearch-card">
<form onSubmit={handleSubmit(onHandleSubmit)}>
<div className="card-body">
<h3 className="heading-small card-heading">
{t("home:casesearch-card-title")}
</h3>
return <>
<div className="card" id="casesearch-card">
<form onSubmit={handleSubmit(onHandleSubmit)}>
<div className="card-body">
<h3 className="heading-small card-heading">
{t("home:casesearch-card-title")}
</h3>
<Field
validate={[
required(
t(
"home:casesearch-search-validation-required"
)
),
minLength(
t(
"home:casesearch-search-validation-minlength"
)
),
]}
className="govuk-input"
component={RenderTextfield}
id="basicSearch"
name="basicSearch"
type="text"
aria-describedby="basicSearch-hint"
hint1={t("home:casesearch-card-search-hint")}
hint2={t(
"home:casesearch-card-search-example-label-1"
)}
hint3={t(
"home:casesearch-card-search-example-label-2"
)}
/>
<Field
validate={[
required(
t(
"home:casesearch-search-validation-required"
)
),
minLength(
t(
"home:casesearch-search-validation-minlength"
)
),
]}
className="govuk-input"
component={RenderTextfield}
id="basicSearch"
name="basicSearch"
type="text"
aria-describedby="basicSearch-hint"
hint1={t("home:casesearch-card-search-hint")}
hint2={t(
"home:casesearch-card-search-example-label-1"
)}
hint3={t(
"home:casesearch-card-search-example-label-2"
)}
/>
<div className="govuk-form-group">
<button type="submit" className="govuk-button">
{t("home:casesearch-card-button")}
</button>
</div>
<Link
href={
router.locale == "cy"
? "/chwiliouwch"
: "/advancedsearch"
}
>
<a className="govuk-link--no-underline">
{t("home:casesearch-card-advanced-link")}
</a>
</Link>
<div className="govuk-form-group">
<button type="submit" className="govuk-button">
{t("home:casesearch-card-button")}
</button>
</div>
</form>
{/* <LoadingOverlay
active={showSpinnerState}
spinner
text={t("common:spinner-searching")}
/> */}
</div>
</>
);
<Link
href={
router.locale == "cy"
? "/chwiliouwch"
: "/advancedsearch"
}
className="govuk-link--no-underline">
{t("home:casesearch-card-advanced-link")}
</Link>
</div>
</form>
</div>
</>;
};
const mapStateToProps = (state) => {
components/homepage/dns.js
+7 -15
View File
@@ -2,7 +2,6 @@ import Link from "next/link";
import { useState } from "react";
import { useRouter } from "next/router";
import useTranslation from "next-translate/useTranslation";
import LoadingOverlay from "react-loading-overlay";
export default function Dns() {
let { t } = useTranslation();
@@ -34,23 +33,16 @@ export default function Dns() {
? "/ceisiadaudns"
: "/dnsapplications"
}
>
<a
className="govuk-button withChevron govuk-button-cta"
// onClick={() => {
// spinnerState();
// }}
>
{t("home:dns-card-button")}
</a>
// onClick={() => {
// spinnerState();
// }}
className="govuk-button withChevron govuk-button-cta">
{t("home:dns-card-button")}
</Link>
</div>
</div>
{/* <LoadingOverlay
active={showSpinnerState}
spinner
text={t("common:spinner-loading")}
/> */}
</div>
);
}
components/homepage/inspectorate.js
+1 -1
View File
@@ -21,7 +21,7 @@ export default function Inspectorate() {
<p className="govuk-body-s">
{t("home:inspectorate-card-visit-label")}:{" "}
<Link href="/">
<a>{t("home:inspectorate-card-visit-link")}</a>
{t("home:inspectorate-card-visit-link")}
</Link>
</p>
</div>
components/homepage/login.js
+20 -11
View File
@@ -4,7 +4,7 @@ import { useRouter } from "next/router";
import useTranslation from "next-translate/useTranslation";
import { connect } from "react-redux";
import { Field, reduxForm } from "redux-form";
import LoadingOverlay from "react-loading-overlay";
import { getLogin } from "../../actions";
import { setLoggedInUserId } from "../../store/accountDetails/action";
import { parseCookies, setCookie, destroyCookie } from "nookies";
@@ -184,6 +184,16 @@ let Login = (props) => {
</button>
</>;
}
const signInButton = () => {
router.push(
`${
router.locale == "cy" ? "/awd/mewngofnodi" : "/auth/signin"
}?callbackUrl=${encodeURIComponent(
window.location.href
)}&error=EmailSignin`
);
};
return (
<>
<div className="card" id="login-card">
@@ -197,14 +207,19 @@ let Login = (props) => {
{session && "Signed in as " + session.user?.email}
</div>
<br />
{!session && (
<button
className="govuk-button withChevron govuk-button-cta"
type="button"
onClick={() =>
signIn("email", {
callbackUrl: "/",
})
onClick={
() => signInButton()
// signIn("email", {
// callbackUrl:
// (router.locale != "en"
// ? "/cy"
// : "") + "/",
// })
}
>
{t("home:login-via-nextuth-label")}
@@ -371,12 +386,6 @@ let Login = (props) => {
</p>
</div>
</div>
{/* <LoadingOverlay
active={showSpinnerState}
spinner
text="Logging in"
/> */}
</div>
</>
);
components/main.js
+2 -2
View File
@@ -12,7 +12,7 @@ import Dns from "./homepage/dns";
const MainHome = (props) => {
let { t } = useTranslation();
const { showLogin, session } = props;
const { showLogin, session, siteurl } = props;
const router = useRouter();
const { locale } = router;
@@ -34,7 +34,7 @@ const MainHome = (props) => {
{showLogin == "true" && (
<>
<CaseSearch />
<Login session={session} />
<Login session={session} siteurl={siteurl} />
</>
)}{" "}
<CaseComment />
components/myportal.js
+139 -113
View File
@@ -25,126 +25,152 @@ const MyPortal = (props) => {
const handleLogout = () => {
console.info("////////////\n" + "logout" + "\n////////////");
window.localStorage.clear(),
destroyCookie({}, "pinsUser"),
destroyCookie(null, "next-auth.csrf-token"),
destroyCookie(null, "next-auth.callback-url"),
destroyCookie(null, "pedw_locale"),
destroyCookie(null, "pinsUser"),
signOut({ callbackUrl: "/logout" });
};
return (
<>
<main className="" id="main-content" role="main">
<div className="servicebanner myportal govuk-!-margin-bottom-4">
<h1>
<img
src={
router.locale == "cy"
? "/assets/images/planning-casework-cy.svg"
: "/assets/images/planning-casework-en.svg"
}
alt={
router.locale == "cy"
? "Fy mhorth"
: "My Portal"
}
/>
</h1>
const isLPA =
props.accountDetails.accountDetails[
"pinswg_typeofinvolvement@OData.Community.Display.V1.FormattedValue"
] == "LPA"
? true
: false;
<div className="serviceBanner_userDetails">
<img
className="user_logo"
src="/assets/images/user.svg"
alt={router.locale == "cy" ? "Defnyddiwr" : "User"}
/>{" "}
<div className="serviceBanner_userDetails_name">
<Link href="/account/personaldetails">
<a className="govuk-button-secondary">
{
props.accountDetails.accountDetails
.firstname
}{" "}
{
props.accountDetails.accountDetails
.lastname
}
{" - "}
{
props.accountDetails.accountDetails[
"pinswg_typeofinvolvement@OData.Community.Display.V1.FormattedValue"
]
}
</a>
</Link>
</div>
<div>
<Link
href={
router.locale == "cy"
? "/allgofnodi"
: "/logout"
return <>
<main className="" id="main-content" role="main">
<div className="servicebanner myportal govuk-!-margin-bottom-4">
<h1>
<img
src={
router.locale == "cy"
? "/assets/images/planning-casework-cy.svg"
: "/assets/images/planning-casework-en.svg"
}
alt={
router.locale == "cy"
? "Fy mhorth"
: "My Portal"
}
/>
</h1>
<div className="serviceBanner_userDetails">
<img
className="user_logo"
src="/assets/images/user.svg"
alt={router.locale == "cy" ? "Defnyddiwr" : "User"}
/>{" "}
<div className="serviceBanner_userDetails_name">
<Link href="/account/personaldetails" className="govuk-button-secondary">
{
props.accountDetails.accountDetails
.firstname
}{" "}
{
props.accountDetails.accountDetails
.lastname
}
{" - "}
{
props.accountDetails.accountDetails[
"pinswg_typeofinvolvement@OData.Community.Display.V1.FormattedValue"
]
}
</Link>
</div>
<div>
<Link
href={
router.locale == "cy"
? "/allgofnodi"
: "/logout"
}
onClick={() => {
handleLogout();
}}
className="govuk-header__link govuk-!-margin-right-3">
{t("common:signout-label")}
</Link>
</div>
</div>
</div>
{isLPA && (
<div>
<h2 className="heading-small card-heading">
{
props.accountDetails.accountDetails[
"pinswg_contact_associatedlpa@OData.Community.Display.V1.FormattedValue"
]
}{" "}
LPA Portal
</h2>
</div>
)}
<div className="govuk-grid-row">
<div className="govuk-grid-column-full">
<div className="flex-container grid-row govuk-body ">
{!isLPA && <MakeNewAppeal />}
<SearchCases />
{/* {props.awaitingSubmission.awaitingSubmission[
"@odata.count"
] > 0 && (
<AwaitingSubmission
awaitingSubmission={
props.awaitingSubmission
}
>
<a
onClick={() => {
handleLogout();
}}
className="govuk-header__link govuk-!-margin-right-3"
>
{t("common:signout-label")}
</a>
</Link>
</div>
/>
)} */}
{isLPA
? ""
: props.awaitingSubmission
.awaitingSubmissionFromBlob[
"@odata.count"
] > 0 && (
<AwaitingSubmissionFromBlob
containerID={props.containerID}
awaitingSubmissionFromBlob={
props.awaitingSubmission
.awaitingSubmissionFromBlob
}
/>
)}
{props.myCases.myCases["@odata.count"] > 0 && (
<MyCases
myCases={props.myCases}
isLPA={isLPA}
/>
)}
{props.watchedCases.watchedCases["@odata.count"] >
0 && (
<WatchedCases
watchedCases={props.watchedCases}
isLPA={isLPA}
/>
)}
{props.myRepresentations.myRepresentations[
"@odata.count"
] > 0 && (
<MyRepresentations
myRepresentations={props.myRepresentations}
isLPA={isLPA}
/>
)}
{!isLPA && <Dns />}
{/* <YourAccount /> */}
</div>
</div>
<div className="govuk-grid-row">
<div className="govuk-grid-column-full">
<div className="flex-container grid-row govuk-body ">
<MakeNewAppeal />
<SearchCases />
{/* {props.awaitingSubmission.awaitingSubmission[
"@odata.count"
] > 0 && (
<AwaitingSubmission
awaitingSubmission={
props.awaitingSubmission
}
/>
)} */}
{props.awaitingSubmission
.awaitingSubmissionFromBlob["@odata.count"] >
0 && (
<AwaitingSubmissionFromBlob
containerID={props.containerID}
awaitingSubmissionFromBlob={
props.awaitingSubmission
.awaitingSubmissionFromBlob
}
/>
)}
{props.myCases.myCases["@odata.count"] > 0 && (
<MyCases myCases={props.myCases} />
)}
{props.watchedCases.watchedCases["@odata.count"] >
0 && (
<WatchedCases
watchedCases={props.watchedCases}
/>
)}
{props.myRepresentations.myRepresentations[
"@odata.count"
] > 0 && (
<MyRepresentations
myRepresentations={props.myRepresentations}
/>
)}
<Dns />
{/* <YourAccount /> */}
{showFileUpload == "true" && <UploadFile />}
</div>
</div>
</div>
</main>
<TimeOut />
</>
);
</div>
</main>
<TimeOut />
</>;
};
export default MyPortal;
components/myportal/advancedsearch.js
+85 -92
View File
@@ -6,7 +6,7 @@ import { reduxForm, formValueSelector, Field } from "redux-form";
import { useDispatch, useSelector, shallowEqual, connect } from "react-redux";
import jsonpath from "jsonpath";
import data from "../../data/collections.json";
import LoadingOverlay from "react-loading-overlay";
import transLookup from "../../data/lookuptranslations.json";
const required = (errorMsg) => (value) =>
@@ -179,98 +179,96 @@ let AdvancedSearch = (props) => {
label,
errormsg,
}) => {
return (
<>
<div
className={
touched && error
? "govuk-form-group govuk-form-group--error"
: "govuk-form-group "
}
>
<label className="govuk-label" htmlFor={id}>
{label}
{name}
</label>
{touched && error && (
<span
id="passport-issued-error"
className="govuk-error-message"
>
<span className="govuk-visually-hidden">
Error:
</span>{" "}
{errormsg}
</span>
)}
<div>
<select
{...input}
className="govuk-select"
id={id}
name={name}
//onChange={(e) => props.onChangeSelectAppealType(e)}
>
<option value="" disabled defaultValue>
{t("common:drop-down-select")}
</option>
{_.isEmpty(optionsObj)
? ""
: Object.keys(optionsObj).map((key, index) => {
return (
<option
key={key}
value={
_.isEmpty(optionsObj[key])
? ""
: _.isEmpty(
optionsObj[key]
)
? ""
: _.isEmpty(
optionsObj[key]
.value
)
? ""
: optionsObj[key]
.attributevalue +
"," +
optionsObj[key].value
.replace(
/(\band|[\s\-\+\(\)\,\&])/g,
""
)
.toLowerCase()
}
>
{_.isEmpty(optionsObj[key])
? ""
: _.isEmpty(optionsObj[key])
return <>
<div
className={
touched && error
? "govuk-form-group govuk-form-group--error"
: "govuk-form-group "
}
>
<label className="govuk-label" htmlFor={id}>
{label}
{name}
</label>
{touched && error && (
<span
id="passport-issued-error"
className="govuk-error-message"
>
<span className="govuk-visually-hidden">
Error:
</span>{" "}
{errormsg}
</span>
)}
<div>
<select
{...input}
className="govuk-select"
id={id}
name={name}
//onChange={(e) => props.onChangeSelectAppealType(e)}
>
<option value="" disabled defaultValue>
{t("common:drop-down-select")}
</option>
{_.isEmpty(optionsObj)
? ""
: Object.keys(optionsObj).map((key, index) => {
return (
<option
key={key}
value={
_.isEmpty(optionsObj[key])
? ""
: _.isEmpty(
optionsObj[key].value
optionsObj[key]
)
? ""
: router.locale == "cy"
? jsonpath.query(
transLookup,
'$..[?(@.value=="' +
optionsObj[key]
.value +
'")].value_cy'
: _.isEmpty(
optionsObj[key]
.value
)
: optionsObj[key].value ||
t(
"case:summary-no-date-entered-label"
)}
</option>
);
})}
</select>
</div>
? ""
: optionsObj[key]
.attributevalue +
"," +
optionsObj[key].value
.replace(
/(\band|[\s\-\+\(\)\,\&])/g,
""
)
.toLowerCase()
}
>
{_.isEmpty(optionsObj[key])
? ""
: _.isEmpty(optionsObj[key])
? ""
: _.isEmpty(
optionsObj[key].value
)
? ""
: router.locale == "cy"
? jsonpath.query(
transLookup,
'$..[?(@.value=="' +
optionsObj[key]
.value +
'")].value_cy'
)
: optionsObj[key].value ||
t(
"case:summary-no-date-entered-label"
)}
</option>
);
})}
</select>
</div>
</>
);
</div>
</>;
};
// const [showSpinnerState, setShowSpinnerState] = useState(false);
@@ -471,11 +469,6 @@ let AdvancedSearch = (props) => {
</div>
</form>
</div>
{/* <LoadingOverlay
active={showSpinnerState}
spinner
text={t("common:spinner-searching")}
/> */}
</>
);
};
components/myportal/awaitingsubmission.js
+18 -12
View File
@@ -32,18 +32,24 @@ const AwaitingSubmission = (props) => {
{props.awaitingSubmission.awaitingSubmission["@odata.count"] >
3 && (
<div className="cardVieAll">
<Link href="/myportal/viewall">
<a
className="govuk-link--no-underline"
onClick={() => {
setCurrentView({
"viewName": "Awaiting Submission",
"viewKey": "awaitingSubmission",
});
}}
>
{t("myportal:viewall-link")}
</a>
<Link
href={
router.locale != "en"
? "/" +
router.locale +
"/fymhorth/gweldpopeth"
: "/myportal/viewall"
}
className="govuk-link--no-underline"
onClick={() => {
setCurrentView({
"viewName": "Awaiting Submission",
"viewKey": "awaitingSubmission",
});
}}>
{t("myportal:viewall-link")}
</Link>
</div>
)}
components/myportal/awaitingsubmissionfromblob.js
+50 -47
View File
@@ -60,45 +60,42 @@ const AwaitingSubmissionFromBlob = (props) => {
<Link
href={
router.locale == "cy"
? "/fymhorth/parhauigyflwyno"
: "/myportal" +
"/" +
urlname +
"?lpa=" +
showTopThreeArr[key][
"_pinswg_associatedlpa_value"
] +
"&apt=" +
showTopThreeArr[key]
.pinswg_appealcasetype +
"&casereference=" +
showTopThreeArr[key].pinswg_name +
"&inid=" +
showTopThreeArr[key].incidentid
(router.locale == "cy"
? "/fymhorth"
: "/myportal") +
"/" +
urlname +
"?lpa=" +
showTopThreeArr[key][
"_pinswg_associatedlpa_value"
] +
"&apt=" +
showTopThreeArr[key].pinswg_appealcasetype +
"&casereference=" +
showTopThreeArr[key].pinswg_name +
"&inid=" +
showTopThreeArr[key].incidentid
}
>
<a
className="govuk-link--no-underline"
data-id={index}
onClick={() => {
props.setCurrentReference({
"currentReference":
showTopThreeArr[key].ticketnumber,
className="govuk-link--no-underline"
data-id={index}
onClick={() => {
props.setCurrentReference({
"currentReference":
showTopThreeArr[key].ticketnumber,
"currentType": "awaitingSubmission",
"currentType": "awaitingSubmission",
"incidentid":
showTopThreeArr[key].incidentid,
"incidentid":
showTopThreeArr[key].incidentid,
"appealType":
showTopThreeArr[key]
.pinswg_appealcasetype,
});
}}>
{showTopThreeArr[index].pinswg_name}
"appealType":
showTopThreeArr[key]
.pinswg_appealcasetype,
});
}}
>
{showTopThreeArr[index].pinswg_name}
</a>
</Link>
</div>
<div>
@@ -215,18 +212,24 @@ const AwaitingSubmissionFromBlob = (props) => {
</div>
{props.awaitingSubmissionFromBlob["@odata.count"] > 3 && (
<div className="cardVieAll">
<Link href="/myportal/viewall">
<a
className="govuk-link--no-underline"
onClick={() => {
setCurrentView({
"viewName": "Awaiting Submission",
"viewKey": "awaitingSubmissionDetails",
});
}}
>
{t("myportal:viewall-link")}
</a>
<Link
href={
router.locale != "en"
? "/" +
router.locale +
"/fymhorth/gweldpopeth"
: "/myportal/viewall"
}
className="govuk-link--no-underline"
onClick={() => {
setCurrentView({
"viewName": "Awaiting Submission",
"viewKey": "awaitingSubmissionDetails",
});
}}>
{t("myportal:viewall-link")}
</Link>
</div>
)}
components/myportal/dns.js
+7 -15
View File
@@ -2,7 +2,6 @@ import Link from "next/link";
import { useState } from "react";
import { useRouter } from "next/router";
import useTranslation from "next-translate/useTranslation";
import LoadingOverlay from "react-loading-overlay";
export default function Dns() {
let { t } = useTranslation();
@@ -34,23 +33,16 @@ export default function Dns() {
? "/fymhorth/ceisiadaudns"
: "/myportal/dnsapplications"
}
>
<a
className="govuk-button withChevron govuk-button-cta"
// onClick={() => {
// spinnerState();
// }}
>
{t("home:dns-card-button")}
</a>
// onClick={() => {
// spinnerState();
// }}
className="govuk-button withChevron govuk-button-cta">
{t("home:dns-card-button")}
</Link>
</div>
</div>
{/* <LoadingOverlay
active={showSpinnerState}
spinner
text={t("common:spinner-loading")}
/> */}
</div>
);
}
components/myportal/makenewappeal.js
+4 -4
View File
@@ -20,10 +20,10 @@ export default function MakeNewAppeal() {
{t("myportal:makenewappeal-card-paragraph-two")}
</p>
<div>
<Link href={"/newappeal"}>
<a className="govuk-button">
{t("myportal:makenewappeal-card-button-label")}
</a>
<Link href={"/newappeal"} className="govuk-button">
{t("myportal:makenewappeal-card-button-label")}
</Link>
</div>
</div>
components/myportal/mycases.js
+21 -12
View File
@@ -26,18 +26,27 @@ const MyCases = (props) => {
</div>
{props.myCases.myCases["@odata.count"] > 3 && (
<div className="cardVieAll">
<Link href="/myportal/viewall">
<a
className="govuk-link--no-underline"
onClick={() => {
setCurrentView({
"viewName": "My Cases",
"viewKey": "myCases",
});
}}
>
{t("myportal:viewall-link")}
</a>
<Link
href={
router.locale != "en"
? "/" +
router.locale +
"/fymhorth/gweldpopeth"
: "/myportal/viewall"
}
className="govuk-link--no-underline"
onClick={() => {
setCurrentView({
"viewName": "My Cases",
"viewKey": "myCases",
});
}}>
{t("myportal:viewall-link")}{" "}
{props.isLPA &&
props.myCases.myCases["@odata.count"] +
" appeals"}
</Link>
</div>
)}
components/myportal/myrepresentations.js
+20 -13
View File
@@ -1,7 +1,7 @@
import Link from "next/link";
import { useRouter } from "next/router";
import useTranslation from "next-translate/useTranslation";
import TopThree from "./topthree";
import TopThree from "./topthree_reps";
import { connect } from "react-redux";
import { setCurrentView } from "../../store/currentView/action";
@@ -31,18 +31,25 @@ const MyRepresentations = (props) => {
{props.myRepresentations.myRepresentations["@odata.count"] >
3 && (
<div className="cardVieAll">
<Link href="/myportal/viewall" shallow>
<a
className="govuk-link--no-underline"
onClick={() => {
setCurrentView({
"viewName": "My Representations",
"viewKey": "myRepresentations",
});
}}
>
{t("myportal:viewall-link")}
</a>
<Link
href={
router.locale != "en"
? "/" +
router.locale +
"/fymhorth/gweldpopeth"
: "/myportal/viewall"
}
shallow
className="govuk-link--no-underline"
onClick={() => {
setCurrentView({
"viewName": "My Representations",
"viewKey": "myRepresentations",
});
}}>
{t("myportal:viewall-link")}
</Link>
</div>
)}
components/myportal/myrepresentationsfromblob.js
+69
View File
@@ -0,0 +1,69 @@
import Link from "next/link";
import { useRouter } from "next/router";
import useTranslation from "next-translate/useTranslation";
import TopThree from "./topthree_reps";
import { connect } from "react-redux";
import { setCurrentView } from "../../store/currentView/action";
const MyRepresentations = (props) => {
let { t } = useTranslation();
const router = useRouter();
const { locale } = router;
const { setCurrentView } = props;
return (
<div className="card" id="casescomment-card">
<div className="card-body">
<h3 className="heading-small card-heading">
{t("myportal:myrepresentations-card-title")}dd
</h3>
<div className="cardModuleContainer">
<TopThree
showTopThree={props.myRepresentations.myRepresentations}
showDetails={
props.myRepresentations.myRepresentationsDetails
}
topThreeType={"myRepresentations"}
/>
</div>
{props.myRepresentations.myRepresentations["@odata.count"] >
3 && (
<div className="cardVieAll">
<Link
href={
router.locale != "en"
? "/" +
router.locale +
"/fymhorth/gweldpopeth"
: "/myportal/viewall"
}
shallow
className="govuk-link--no-underline"
onClick={() => {
setCurrentView({
"viewName": "My Representations",
"viewKey": "myRepresentations",
});
}}>
{t("myportal:viewall-link")}
</Link>
</div>
)}
</div>
</div>
);
};
const mapDispatchToProps = (dispatch) => {
return {
setCurrentView: (currentView) => {
dispatch(setCurrentView(currentView));
},
};
};
export default connect(null, mapDispatchToProps)(MyRepresentations);
components/myportal/searchcases.js
+53 -61
View File
@@ -4,7 +4,6 @@ import { useRouter } from "next/router";
import useTranslation from "next-translate/useTranslation";
import { connect } from "react-redux";
import { Field, reduxForm } from "redux-form";
import LoadingOverlay from "react-loading-overlay";
const required = (errorMsg) => (value) =>
value || typeof value === "number" ? undefined : errorMsg;
@@ -96,69 +95,62 @@ let CaseSearch = (props) => {
});
};
return (
<>
<div className="card" id="casesearch-card">
<form onSubmit={handleSubmit(onHandleSubmit)}>
<div className="card-body">
<h3 className="heading-small card-heading">
{t("myportal:searchcases-card-title")}
</h3>
return <>
<div className="card" id="casesearch-card">
<form onSubmit={handleSubmit(onHandleSubmit)}>
<div className="card-body">
<h3 className="heading-small card-heading">
{t("myportal:searchcases-card-title")}
</h3>
<Field
validate={[
required(
t(
"myportal:searchcases-validation-required"
)
),
minLength(
t(
"myportal:searchcases-validation-minlength"
)
),
]}
className="govuk-input"
component={RenderTextfield}
id="basicSearch"
name="basicSearch"
type="text"
aria-describedby="basicSearch-hint"
hint1={t("myportal:searchcases-card-search-hint")}
hint2={t(
"myportal:searchcases-card-search-example-label-1"
)}
hint3={t(
"myportal:searchcases-card-search-example-label-2"
)}
/>
<Field
validate={[
required(
t(
"myportal:searchcases-validation-required"
)
),
minLength(
t(
"myportal:searchcases-validation-minlength"
)
),
]}
className="govuk-input"
component={RenderTextfield}
id="basicSearch"
name="basicSearch"
type="text"
aria-describedby="basicSearch-hint"
hint1={t("myportal:searchcases-card-search-hint")}
hint2={t(
"myportal:searchcases-card-search-example-label-1"
)}
hint3={t(
"myportal:searchcases-card-search-example-label-2"
)}
/>
<div className="govuk-form-group">
<button type="submit" className="govuk-button">
{t("myportal:searchcases-card-button")}
</button>
</div>
<Link
href={
router.locale == "cy"
? "/fymhorth/chwiliouwch"
: "/myportal/advancedsearch"
}
>
<a>
{t("myportal:searchcases-card-advanced-link")}
</a>
</Link>
<div className="govuk-form-group">
<button type="submit" className="govuk-button">
{t("myportal:searchcases-card-button")}
</button>
</div>
</form>
{/* <LoadingOverlay
active={showSpinnerState}
spinner
text={t("common:spinner-searching")}
/> */}
</div>
</>
);
<Link
href={
router.locale == "cy"
? "/fymhorth/chwiliouwch"
: "/myportal/advancedsearch"
}
>
{t("myportal:searchcases-card-advanced-link")}
</Link>
</div>
</form>
</div>
</>;
};
const mapStateToProps = (state) => {
components/myportal/topthree.js
+35 -37
View File
@@ -167,47 +167,45 @@ const TopThree = (props) => {
? "/fymhorth/achos"
: "/myportal/case"
}
>
<a
className="govuk-link--no-underline"
data-id={index}
onClick={() => {
setCurrentReference({
"currentReference":
topThreeType != "watchedCases"
? topThreeType !=
"myRepresentations"
? showTopThreeArr[key]
.ticketnumber
: showTopThreeArr[key][
"_pinswg_case_value@OData.Community.Display.V1.FormattedValue"
]
className="govuk-link--no-underline"
data-id={index}
onClick={() => {
setCurrentReference({
"currentReference":
topThreeType != "watchedCases"
? topThreeType !=
"myRepresentations"
? showTopThreeArr[key]
.ticketnumber
: showTopThreeArr[key][
"_pinswg_watchedcase_value@OData.Community.Display.V1.FormattedValue"
],
"currentType": topThreeType,
"_pinswg_case_value@OData.Community.Display.V1.FormattedValue"
]
: showTopThreeArr[key][
"_pinswg_watchedcase_value@OData.Community.Display.V1.FormattedValue"
],
"currentType": topThreeType,
"incidentid": getIncidentId(
topThreeType,
showTopThreeArr[key]
),
"incidentid": getIncidentId(
topThreeType,
showTopThreeArr[key]
),
"appealType":
showTopThreeArr[key]
.pinswg_appealcasetype,
});
}}
>
{topThreeType != "watchedCases"
? topThreeType != "myRepresentations"
? showTopThreeArr[key].ticketnumber
: showTopThreeArr[key][
"_pinswg_case_value@OData.Community.Display.V1.FormattedValue"
]
"appealType":
showTopThreeArr[key]
.pinswg_appealcasetype,
});
}}>
{topThreeType != "watchedCases"
? topThreeType != "myRepresentations"
? showTopThreeArr[key].ticketnumber
: showTopThreeArr[key][
"_pinswg_watchedcase_value@OData.Community.Display.V1.FormattedValue"
]}{" "}
</a>
"_pinswg_case_value@OData.Community.Display.V1.FormattedValue"
]
: showTopThreeArr[key][
"_pinswg_watchedcase_value@OData.Community.Display.V1.FormattedValue"
]}{" "}
</Link>
</div>
{/* {(topThreeType == "awaitingSubmission" ||
components/myportal/topthree_reps.js
+270
View File
@@ -0,0 +1,270 @@
import useTranslation from "next-translate/useTranslation";
import Link from "next/link";
import { useRouter } from "next/router";
import { parseCookies } from "nookies";
import { connect } from "react-redux";
import {
deleteAwaitingSubmissions,
deleteWatchedCases,
getAwaitingSubmissionProxy,
getPortalModuleDetailsProxy,
getWatchedCasesProxy,
} from "../../actions";
import {
setAwaitingSubmission,
setAwaitingSubmissionDetails,
} from "../../store/awaitingSubmission/action";
import { setCurrentReference } from "../../store/currentView/action";
import {
setWatchedCases,
setWatchedCasesDetails,
} from "../../store/watchedCases/action";
import { getFormCollectionByID } from "../utils";
import jsonpath from "jsonpath";
import transLookup from "../../data/lookuptranslations.json";
const TopThree = (props) => {
let { t } = useTranslation();
const {
showTopThree,
showDetails,
setCurrentReference,
topThreeType,
setWatchedCases,
setWatchedCasesDetails,
setAwaitingSubmission,
setAwaitingSubmissionDetails,
} = props;
const router = useRouter();
const { locale } = router;
let topthreeRow = [];
let showTopThreeArr = showTopThree.value;
Object.keys(showTopThreeArr).map((key, index) => {
let createdDate = parseInt(
showTopThreeArr[key].repfile_name.split("-")[3]
);
showTopThreeArr[key].createdDate = createdDate;
});
showTopThreeArr.sort(function compare(a, b) {
console.log(a.createdDate, b.createdDate);
var dateA = new Date(a.createdDate);
var dateB = new Date(b.createdDate);
return dateB - dateA;
});
const deleteItem = (caseID, topThreeType) => {
let cookies = parseCookies();
//console.log("sssss", caseID, topThreeType);
topThreeType == "watchedCases" &&
deleteWatchedCases(caseID)
.then((data) => data)
.then(() => {
getWatchedCasesProxy(cookies.pinsUser).then((data) => {
setWatchedCases(data),
getDetails(data, "myWatchedCases").then((data) => {
setWatchedCasesDetails(data);
});
});
});
topThreeType == "awaitingSubmission" &&
deleteAwaitingSubmissions(caseID)
.then((data) => {
return data;
})
.then(() => {
getAwaitingSubmissionProxy(cookies.pinsUser).then(
(data) => {
setAwaitingSubmission(data),
getDetails(data, "awaitingSubmission").then(
(data) => {
// console.log(
// "submission get details:",
// data
// );
setAwaitingSubmissionDetails(data);
}
);
}
);
});
};
const getDetails = (resultsObj, detailsType) => {
//console.log(resultsObj);
let detailsArr = [];
resultsObj = resultsObj.value;
const detailsObj = resultsObj.map((searchDetail, index) => {
if (searchDetail.pinswg_appealcasetype == null) {
console.log(
detailsType != "myWatchedCases"
? searchDetail.ticketnumber
: searchDetail[
"_pinswg_watchedcase_value@OData.Community.Display.V1.FormattedValue"
]
);
} else {
detailsArr.push(
getPortalModuleDetailsProxy(
getFormCollectionByID(
searchDetail.pinswg_appealcasetype
).LogicalCollectionName,
detailsType != "myWatchedCases"
? searchDetail.ticketnumber
: searchDetail[
"_pinswg_watchedcase_value@OData.Community.Display.V1.FormattedValue"
]
)
);
}
});
//console.log(detailsArr);
return Promise.all(detailsArr);
};
const getIncidentId = (topThreeType, objArr) => {
switch (topThreeType) {
case "myCases":
return objArr.incidentid;
break;
case "watchedCases":
return objArr._pinswg_watchedcase_value;
break;
case "myRepresentations":
return objArr.casereference;
break;
case "awaitingSubmission":
return objArr.ticketnumber;
break;
default:
// code block
}
};
const repRaisedDate = (datePart) => {
var dateObj = new Date(parseInt(datePart.split("-")[3]));
return dateObj.toLocaleString();
};
let topThreeOnlyArr = showTopThreeArr.slice(0, 3);
Object.keys(topThreeOnlyArr).map((key, index) => {
topthreeRow.push(
<div className="cardModuleItem" key={index}>
<div className="cardModuleDetails">
<div className="cardModuleReference">
<b>{t("myportal:case-reference")}:</b>{" "}
<Link
// href="#"
href={{
pathname: "/myportal/representation",
query: {
case: showTopThreeArr[key].caseRef,
state: "edit",
},
}}
className="govuk-link--no-underline"
data-id={index}
onClick={() => {
setCurrentReference({
"currentReference":
showTopThreeArr[key].caseRef,
"currentType": topThreeType,
"incidentid":
showTopThreeArr[key].incidentID,
"appealType":
showTopThreeArr[key].appealType,
"repDetails": showTopThreeArr[key],
});
}}
>
{showTopThreeArr[key].pinswg_name}
</Link>
</div>
<div className="cardModuleReference">
<b>{t("myportal:representation-type")}:</b>
{" "}
{showTopThreeArr[key].representationType}
</div>
<div className="cardModuleReference">
<b>{t("myportal:capacity")}:</b>
{" "}
{showTopThreeArr[key].representationCapacity}
</div>
<div className="cardModuleReference">
<b>{t("myportal:date-raised")}:</b>
{" "}
{repRaisedDate(showTopThreeArr[key].repfile_name)}
</div>{" "}
<div className="cardModuleReference">
<b>LPA:</b>
{" "}
{router.locale == "cy"
? jsonpath.query(
transLookup,
'$..[?(@.value=="' +
showTopThreeArr[key][
"_pinswg_localplanningauthority_value@OData.Community.Display.V1.FormattedValue"
] +
'")].value_cy'
)
: showTopThreeArr[key][
"_pinswg_localplanningauthority_value@OData.Community.Display.V1.FormattedValue"
] || ""}
</div>
</div>
</div>
);
});
let noRecordsLabel = "";
switch (topThreeType) {
case "watchedCases":
noRecordsLabel = t("myportal:norecords-watched-cases");
break;
case "myRepresentations":
noRecordsLabel = t("myportal:norecords-representations");
break;
case "myCases":
noRecordsLabel = t("myportal:norecords-cases");
break;
case "awaitingSubmission":
noRecordsLabel = t("myportal:norecords-awaiting-submissions");
break;
}
return (
<>
{topthreeRow.length == 0 ? (
<div>{noRecordsLabel}</div>
) : (
topthreeRow
)}
</>
);
};
const mapDispatchToProps = (dispatch) => {
return {
setCurrentReference: (currentReference) => {
dispatch(setCurrentReference(currentReference));
},
setWatchedCases: (watchedCases) => {
dispatch(setWatchedCases(watchedCases));
},
setWatchedCasesDetails: (watchedCasesDetails) => {
dispatch(setWatchedCasesDetails(watchedCasesDetails));
},
setAwaitingSubmission: (awaitingSubmission) => {
dispatch(setAwaitingSubmission(awaitingSubmission));
},
setAwaitingSubmissionDetails: (awaitingSubmissionDetails) => {
dispatch(setAwaitingSubmissionDetails(awaitingSubmissionDetails));
},
};
};
export default connect(null, mapDispatchToProps)(TopThree);
components/myportal/uploadFile.js
+6 -8
View File
@@ -2,13 +2,18 @@ import Link from "next/link";
import { useState, useMemo } from "react";
import { useRouter } from "next/router";
import useTranslation from "next-translate/useTranslation";
import LoadingOverlay from "react-loading-overlay";
import DropzoneComponent from "../newappeal/fileupload";
import { Field, reduxForm } from "redux-form";
import { connect } from "react-redux";
import Dropzone, { useDropzone } from "react-dropzone";
import { uploadFiles } from "../../actions";
import { getContainers } from "../../actions/azurestorage";
import {
getFormCollectionByID,
getThumbnailIconByExtension,
bytesToSize,
} from "../utils";
const required = (errorMsg) => (value) =>
value || typeof value === "number" ? undefined : errorMsg;
@@ -119,13 +124,6 @@ const RenderFileUpload = (field) => {
</div>
));
function bytesToSize(bytes) {
var sizes = ["Bytes", "KB", "MB", "GB", "TB"];
if (bytes == 0) return "0 Byte";
var i = parseInt(Math.floor(Math.log(bytes) / Math.log(1024)));
return Math.round(bytes / Math.pow(1024, i), 2) + " " + sizes[i];
}
const getThumbnailIcon = (fileObj, fileType) => {
switch (fileType) {
case "text/html":
components/myportal/viewall.js
+199 -70
View File
@@ -20,7 +20,10 @@ const ViewAllResults = (props) => {
const router = useRouter();
const { locale } = router;
const repRaisedDate = (datePart) => {
var dateObj = new Date(datePart);
return dateObj.toLocaleString();
};
var resultsArr =
currentView.viewKey == "awaitingSubmissionDetails"
? props["awaitingSubmission"].awaitingSubmissionDetails.case
@@ -35,15 +38,11 @@ const ViewAllResults = (props) => {
return dd + "/" + mm + "/" + yyyy;
}
// console.log(
// currentView.viewKey,
// props[currentView.viewKey],
// props[currentView.viewKey][currentView.viewKey].value
// );
var searchDetailsObj =
currentView.viewKey == "awaitingSubmissionDetails"
? props["awaitingSubmission"].awaitingSubmissionDetails.value
: currentView.viewKey == "myRepresentations"
? props["myRepresentations"].myRepresentations.value
: props[currentView.viewKey][currentView.viewKey + "Details"] || [];
let resultsRowArr = [];
@@ -54,12 +53,28 @@ const ViewAllResults = (props) => {
);
detailsObj = detailsObj[0];
//console.log(searchDetailsObj[key]);
// searchDetailsObj[key] =
// currentView.viewKey == "myRepresentations"
// ? searchDetailsObj[key].value[0]
// : searchDetailsObj[key];
resultsRowArr.push(
<div className="govuk-summary-list__row" key={key}>
<dd className="govuk-summary-list__value govuk-!-font-size-16 govuk-!-padding-left-2">
<Link
href={
currentView.viewKey == "awaitingSubmissionDetails"
currentView.viewKey == "myRepresentations"
? {
pathname: "/myportal/representation",
query: {
case: resultsArr[key].caseRef,
state: "edit",
},
}
: currentView.viewKey ==
"awaitingSubmissionDetails"
? router.locale == "cy"
? "/fymhorth/parhauigyflwyno"
: "/myportal" +
@@ -85,40 +100,47 @@ const ViewAllResults = (props) => {
? "/myportal/case"
: "/case"
}
>
<a
onClick={() => {
setCurrentReference({
"currentReference":
currentView.viewKey != "watchedCases"
? resultsArr[key].ticketnumber
: resultsArr[key][
"_pinswg_watchedcase_value@OData.Community.Display.V1.FormattedValue"
],
onClick={() => {
setCurrentReference({
"currentReference":
currentView.viewKey != "watchedCases"
? currentView.viewKey ==
"myRepresentations"
? resultsArr[key].caseRef
: resultsArr[key].ticketnumber
: resultsArr[key][
"_pinswg_watchedcase_value@OData.Community.Display.V1.FormattedValue"
],
"currentType": currentView.viewKey,
"incidentid":
currentView.viewKey != "watchedCases"
? resultsArr[key].incidentid
: resultsArr[key][
"_pinswg_watchedcase_value"
],
"currentType": currentView.viewKey,
"incidentid":
currentView.viewKey != "watchedCases"
? resultsArr[key].incidentid
: resultsArr[key][
"_pinswg_watchedcase_value"
],
"appealType":
resultsArr[key].pinswg_appealcasetype,
});
}}
>
<span className="results-visually-hidden">
Case Reference:
</span>
"appealType":
resultsArr[key].pinswg_appealcasetype,
"repDetails":
currentView.viewKey ==
"myRepresentations" &&
resultsArr[key],
});
}}>
<span className="results-visually-hidden">
{t("search:searchresults-case-reference-label")}
:
</span>
{currentView.viewKey != "watchedCases"
? currentView.viewKey == "myRepresentations"
? resultsArr[key].caseRef
: resultsArr[key].ticketnumber
: resultsArr[key][
"_pinswg_watchedcase_value@OData.Community.Display.V1.FormattedValue"
]}
{currentView.viewKey != "watchedCases"
? resultsArr[key].ticketnumber
: resultsArr[key][
"_pinswg_watchedcase_value@OData.Community.Display.V1.FormattedValue"
]}
</a>
</Link>
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
@@ -139,16 +161,20 @@ const ViewAllResults = (props) => {
)[0]
: ""
: ""} */}
{currentView.viewKey == "awaitingSubmissionDetails" &&
_.has(searchDetailsObj[key], "pinswg_siteaddressline1")
? searchDetailsObj[key].pinswg_siteaddressline1
: ""}
{_.has(detailsObj, "pinswg_siteaddressline1")
? detailsObj.pinswg_siteaddressline1
: ""}
{currentView.viewKey == "myRepresentations" &&
_.has(searchDetailsObj[key].pinswg_siteaddressline1)
? searchDetailsObj[key].value[0].pinswg_siteaddressline1
: ""}
{_.has(detailsObj, "pinswg_siteaddressline1")
? detailsObj.pinswg_siteaddressline1
: ""}
{currentView.viewKey == "awaitingSubmissionDetails" &&
_.has(
searchDetailsObj[key],
@@ -156,15 +182,20 @@ const ViewAllResults = (props) => {
) &&
searchDetailsObj[key].pinswg_siteaddressline1 !=
null && <br />}
{currentView.viewKey == "myRepresentations" &&
_.has(searchDetailsObj[key].pinswg_siteaddressline1) &&
searchDetailsObj[key].value[0]
.pinswg_siteaddressline1 != null && <br />}
{_.has(detailsObj, "pinswg_siteaddressline1") &&
detailsObj.pinswg_siteaddressline1 != null && <br />}
{currentView.viewKey == "awaitingSubmissionDetails" &&
_.has(searchDetailsObj[key], "pinswg_siteaddressline1")
? searchDetailsObj[key].pinswg_siteaddressline2
: ""}
{currentView.viewKey == "myRepresentations" &&
_.has(searchDetailsObj[key].pinswg_siteaddressline1)
? searchDetailsObj[key].pinswg_siteaddressline2
: ""}
{_.has(detailsObj, "pinswg_siteaddressline1")
? detailsObj.pinswg_siteaddressline2
: ""}
@@ -176,18 +207,24 @@ const ViewAllResults = (props) => {
searchDetailsObj[key].pinswg_siteaddressline2 !=
null && <br />}
{currentView.viewKey == "myRepresentations" &&
_.has(searchDetailsObj[key].pinswg_siteaddressline2) &&
searchDetailsObj[key].pinswg_siteaddressline1 !=
null && <br />}
{_.has(detailsObj, "pinswg_siteaddressline2") &&
detailsObj.pinswg_siteaddressline2 != null && <br />}
{currentView.viewKey == "awaitingSubmissionDetails" &&
_.has(searchDetailsObj[key], "pinswg_siteaddresstown")
? searchDetailsObj[key].pinswg_siteaddresstown
: ""}
{currentView.viewKey == "myRepresentations" &&
_.has(searchDetailsObj[key], "pinswg_siteaddresstown")
? searchDetailsObj[key].pinswg_siteaddresstown
: ""}
{_.has(detailsObj, "pinswg_siteaddresstown")
? detailsObj.pinswg_siteaddresstown
: ""}
{currentView.viewKey == "awaitingSubmissionDetails" &&
_.has(
searchDetailsObj[key],
@@ -196,18 +233,27 @@ const ViewAllResults = (props) => {
searchDetailsObj[key].pinswg_siteaddresstown !=
null && <br />}
{currentView.viewKey == "myRepresentations" &&
_.has(
searchDetailsObj[key],
"pinswg_siteaddresstown"
) &&
searchDetailsObj[key].pinswg_siteaddresstown !=
null && <br />}
{_.has(detailsObj, "pinswg_siteaddresstown") &&
detailsObj.pinswg_siteaddresstown != null && <br />}
{currentView.viewKey == "awaitingSubmissionDetails" &&
_.has(searchDetailsObj[key], "pinswg_siteaddresscounty")
? searchDetailsObj[key].pinswg_siteaddresscounty
: ""}
{currentView.viewKey == "myRepresentations" &&
_.has(searchDetailsObj[key], "pinswg_siteaddresscounty")
? searchDetailsObj[key].pinswg_siteaddresscounty
: ""}
{_.has(detailsObj, "pinswg_siteaddresscounty")
? detailsObj.pinswg_siteaddresscounty
: ""}
{currentView.viewKey == "awaitingSubmissionDetails" &&
_.has(
searchDetailsObj[key],
@@ -215,15 +261,12 @@ const ViewAllResults = (props) => {
) &&
searchDetailsObj[key].pinswg_siteaddresscounty !=
null && <br />}
{_.has(detailsObj, "pinswg_siteaddresscounty") &&
detailsObj.pinswg_siteaddresscounty != null && <br />}
{currentView.viewKey == "awaitingSubmissionDetails" &&
_.has(searchDetailsObj[key], "pinswg_siteaddresspostcode")
? searchDetailsObj[key].pinswg_siteaddresspostcode
: ""}
{_.has(detailsObj, "pinswg_siteaddresspostcode")
? detailsObj.pinswg_siteaddresspostcode
: ""}
@@ -234,7 +277,6 @@ const ViewAllResults = (props) => {
? t("search:searchresults-created-on-label")
: t("search:searchresults-applicant-label")}
</span>
{currentView.viewKey == "awaitingSubmissionDetails"
? formatDates(item.createdon)
: _.has(detailsObj, [
@@ -243,6 +285,10 @@ const ViewAllResults = (props) => {
? detailsObj[
"_pinswg_appellant_value@OData.Community.Display.V1.FormattedValue"
]
: currentView.viewKey == "myRepresentations"
? searchDetailsObj[key][
"_pinswg_appellant_value@OData.Community.Display.V1.FormattedValue"
]
: resultsArr[key][
"_customerid_value@OData.Community.Display.V1.FormattedValue"
]}
@@ -251,7 +297,6 @@ const ViewAllResults = (props) => {
<span className="results-visually-hidden">
{t("search:searchresults-authority-label")}:
</span>
{currentView.viewKey == "awaitingSubmissionDetails" &&
_.has(resultsArr[key], "pinswg_lpaname")
? router.locale == "cy"
@@ -263,7 +308,6 @@ const ViewAllResults = (props) => {
)
: resultsArr[key].pinswg_lpaname || "N/A"
: ""}
{_.has(resultsArr[key], [
"_pinswg_associatedlpa_value@OData.Community.Display.V1.FormattedValue",
])
@@ -280,6 +324,52 @@ const ViewAllResults = (props) => {
"_pinswg_associatedlpa_value@OData.Community.Display.V1.FormattedValue"
] || "N/A"
: ""}
{_.has(searchDetailsObj[key], [
"_pinswg_localplanningauthority_value@OData.Community.Display.V1.FormattedValue",
])
? router.locale == "cy"
? jsonpath.query(
transLookup,
'$..[?(@.value=="' +
searchDetailsObj[key].value[0][
"_pinswg_localplanningauthority_value@OData.Community.Display.V1.FormattedValuee"
] +
'")].value_cy'
)
: currentView.viewKey == "myRepresentations"
? searchDetailsObj[key].value
: searchDetailsObj[key].value[0][
"_pinswg_localplanningauthority_value@OData.Community.Display.V1.FormattedValue"
] || "N/A"
: ""}
{_.has(resultsArr[key], [
"_pinswg_localplanningauthority_value@OData.Community.Display.V1.FormattedValue",
])
? router.locale == "cy"
? jsonpath.query(
transLookup,
'$..[?(@.value=="' +
resultsArr[key][
"_pinswg_localplanningauthority_value@OData.Community.Display.V1.FormattedValuee"
] +
'")].value_cy'
)
: resultsArr[key][
"_pinswg_localplanningauthority_value@OData.Community.Display.V1.FormattedValue"
] ||
(currentView.viewKey == "myRepresentations"
? ""
: "N/A")
: currentView.viewKey == "myRepresentations" &&
router.locale == "cy" &&
jsonpath.query(
transLookup,
'$..[?(@.value=="' +
searchDetailsObj[key][
"_pinswg_localplanningauthority_value@OData.Community.Display.V1.FormattedValue"
] +
'")].value_cy'
)}
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
@@ -309,11 +399,35 @@ const ViewAllResults = (props) => {
)
: item[
"pinswg_appealcasetype@OData.Community.Display.V1.FormattedValue"
] || "N/A"}
] ||
(currentView.viewKey == "myRepresentations"
? ""
: "N/A")}
{currentView.viewKey == "myRepresentations" &&
(router.locale == "cy"
? jsonpath.query(
transLookup,
'$..[?(@.value=="' +
getFormCollectionByID(
searchDetailsObj[key].appealType
).value +
'")].value_cy'
)[0]
: getFormCollectionByID(
searchDetailsObj[key].appealType
).value)}
{_.has(
searchDetailsObj[key],
"_pinswg_localplanningauthority_value@OData.Community.Display.V1.FormattedValue"
)}
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
<span className="results-visually-hidden">
{t("search:searchresults-status-label")}:
{currentView.viewKey == "myRepresentations"
? "Created"
: t("search:searchresults-status-label")}
:
</span>
{currentView.viewKey == "awaitingSubmissionDetails"
@@ -330,16 +444,29 @@ const ViewAllResults = (props) => {
item.statuscode +
'")].value'
) || "N/A"
: router.locale == "cy"
? jsonpath.query(
transLookup,
'$..[?(@.value=="' +
item[
"statuscode@OData.Community.Display.V1.FormattedValue"
] +
'")].value_cy'
)
: item[
: currentView.viewKey == "myRepresentations"
? repRaisedDate(item.createdDate) // ? router.locale == "cy"
: // ? jsonpath.query(
// transLookup,
// '$..[?(@.value=="' +
// searchDetailsObj[key].value[0][
// "statuscode@OData.Community.Display.V1.FormattedValue"
// ] +
// '")].value_cy'
// )
// : searchDetailsObj[key].value[0][
// "statuscode@OData.Community.Display.V1.FormattedValue"
// ] || "N/A"
// : router.locale == "cy"
// ? jsonpath.query(
// transLookup,
// '$..[?(@.value=="' +
// item[
// "statuscode@OData.Community.Display.V1.FormattedValue"
// ] +
// '")].value_cy'
// )
item[
"statuscode@OData.Community.Display.V1.FormattedValue"
] || "N/A"}
</dd>
@@ -387,7 +514,9 @@ const ViewAllResults = (props) => {
{t("search:searchresults-case-type-label")}
</dd>
<dd className="govuk-summary-list__key govuk-!-font-size-16">
{t("search:searchresults-status-label")}
{currentView.viewKey == "myRepresentations"
? "Created"
: t("search:searchresults-status-label")}
</dd>
</div>
components/myportal/watchedcases.js
+20 -13
View File
@@ -28,18 +28,25 @@ const WatchedCases = (props) => {
{props.watchedCases.watchedCases["@odata.count"] > 3 && (
<div className="cardVieAll">
<Link href="/myportal/viewall" shallow>
<a
className="govuk-link--no-underline"
onClick={() => {
setCurrentView({
"viewName": "Watched Cases",
"viewKey": "watchedCases",
});
}}
>
{t("myportal:viewall-link")}
</a>
<Link
href={
router.locale != "en"
? "/" +
router.locale +
"/fymhorth/gweldpopeth"
: "/myportal/viewall"
}
shallow
className="govuk-link--no-underline"
onClick={() => {
setCurrentView({
"viewName": "Watched Cases",
"viewKey": "watchedCases",
});
}}>
{t("myportal:viewall-link")}
</Link>
</div>
)}
@@ -51,7 +58,7 @@ const WatchedCases = (props) => {
const mapDispatchToProps = (dispatch) => {
return {
setCurrentView: (currentView) => {
console.log(currentView);
//console.log(currentView);
dispatch(setCurrentView(currentView));
},
};
components/myportal/youraccount.js
+35 -37
View File
@@ -7,44 +7,42 @@ export default function YourAccount() {
const router = useRouter();
const { locale } = router;
return (
<>
<div className="card" id="casescomment-card">
<div className="card-body">
<h3 className="heading-small card-heading">
{t("myportal:yourdetails-card-title")}
</h3>
<p className="govuk-body-s">
{t("myportal:yourdetails-card-paragraph-one")}
</p>
return <>
<div className="card" id="casescomment-card">
<div className="card-body">
<h3 className="heading-small card-heading">
{t("myportal:yourdetails-card-title")}
</h3>
<p className="govuk-body-s">
{t("myportal:yourdetails-card-paragraph-one")}
</p>
<div>
<Link href="/account/personaldetails">
<a className="govuk-button-secondary">
{t("myportal:yourdetails-card-link")}
</a>
</Link>
</div>
<div>
<Link href="/account/personaldetails" className="govuk-button-secondary">
{t("myportal:yourdetails-card-link")}
</Link>
</div>
{/* <div className="card-body">
<h3 className="heading-small card-heading">
{t("myportal:changepassword-card-title")}
</h3>
<p className="govuk-body-s">
{" "}
{t("myportal:changepassword-card-paragraph-one")}
</p>
<div>
<Link href="/account/changepassword">
<a className="govuk-button-secondary">
{t("myportal:changepassword-card-link")}
</a>
</Link>
</div>
</div> */}
</div>
</>
);
{/* <div className="card-body">
<h3 className="heading-small card-heading">
{t("myportal:changepassword-card-title")}
</h3>
<p className="govuk-body-s">
{" "}
{t("myportal:changepassword-card-paragraph-one")}
</p>
<div>
<Link href="/account/changepassword">
<a className="govuk-button-secondary">
{t("myportal:changepassword-card-link")}
</a>
</Link>
</div>
</div> */}
</div>
</>;
}
components/newappeal/aboutyou.js
+1 -1
View File
@@ -731,7 +731,7 @@ let AboutYou = (props) => {
label={t(
"newappeal:about-you-agent-language-preferences-label"
)}
options="[846040000|newappeal:about-you-agent-language-preferences-value-english,846040001|newappeal:about-you-agent-language-preferences-value-welsh]"
options="[846040001|newappeal:about-you-agent-language-preferences-value-welsh,846040000|newappeal:about-you-agent-language-preferences-value-english]"
id={"pinswg_languagepreference"}
className="govuk-radios__input"
validate={[required]}
components/newappeal/buildchecksection.js
+14 -56
View File
@@ -11,6 +11,12 @@ import {
setFormComplete,
} from "../../store/appealType/action";
import {
getFormCollectionByID,
getThumbnailIconByExtension,
bytesToSize,
} from "../utils";
let BuildCheckSection = (props) => {
useEffect(() => {
setFormComplete();
@@ -64,54 +70,6 @@ let BuildCheckSection = (props) => {
alert(1);
};
function bytesToSize(bytes) {
var sizes = ["Bytes", "KB", "MB", "GB", "TB"];
if (bytes == 0) return "0 Byte";
var i = parseInt(Math.floor(Math.log(bytes) / Math.log(1024)));
return Math.round(bytes / Math.pow(1024, i), 2) + " " + sizes[i];
}
const getThumbnailIconByExtension = (blobName) => {
let fileType = blobName.slice(blobName.lastIndexOf(".") + 1);
switch (fileType) {
case "html":
return "/assets/images/documenttypes/html.png";
break;
case "txt":
return "/assets/images/documenttypes/txt.png";
break;
case "doc":
return "/assets/images/documenttypes/doc.png";
break;
case "pdf":
return "/assets/images/documenttypes/pdf.png";
break;
case "docx":
return "/assets/images/documenttypes/docx.png";
break;
case "csv":
return "/assets/images/documenttypes/csv.png";
break;
case "xlsx":
return "/assets/images/documenttypes/xlsx.png";
break;
case "zip":
return "/assets/images/documenttypes/zip.png";
break;
case "jpeg":
case "jpg":
return "/assets/images/documenttypes/jpg.png";
case "png":
return "/assets/images/documenttypes/png.png";
break;
default:
return "/assets/images/documenttypes/txt.png";
break;
}
};
return (
<div className="govuk-grid-row" key={1222}>
<div className="govuk-grid-column-full">
@@ -140,9 +98,9 @@ let BuildCheckSection = (props) => {
<dl className="govuk-summary-list govuk-!-margin-bottom-9 at-summary-list">
<div className="govuk-summary-list__row" key={"9999"}>
<dt className="govuk-summary-list__key">
{props.props.appealType.fileList.files.length >
{props.props.appealType.fileList.value.length >
0
? props.props.appealType.fileList.files.map(
? props.props.appealType.fileList.value.map(
(blob, i) => (
<div
key={blob.name + "_" + i}
@@ -150,10 +108,10 @@ let BuildCheckSection = (props) => {
>
<img
src={getThumbnailIconByExtension(
blob.name
blob[i].name
)}
alt={blob.name.slice(
blob.name.indexOf(
alt={blob[i].name.slice(
blob[i].name.indexOf(
"_"
) + 1
)}
@@ -161,14 +119,14 @@ let BuildCheckSection = (props) => {
/>
<span className="govuk-body govuk-!-font-size-14 govuk-!-padding-left-5">
{blob.name.slice(
blob.name.indexOf(
{blob[i].name.slice(
blob[i].name.indexOf(
"_"
) + 1
)}
(
{bytesToSize(
blob.contentLength
blob[i].contentLength
)}
)
</span>
components/newappeal/buildsection.js
+10 -4
View File
@@ -79,7 +79,7 @@ let BuildSection = (props) => {
);
const isProgressComplete = (progObj) => {
const progressCount = 0;
let progressCount = 0;
for (let key in progObj) {
progObj[key].allFieldsComplete === true && progressCount++;
@@ -175,13 +175,14 @@ let BuildSection = (props) => {
const reference = "PEDW-PARTIAL";
const templateId = "021b0a7b-df00-41f1-b94e-c269bee98c75";
const templateIdCY = "f3c4a56b-bfb8-4d39-97dd-888df3062b0a";
const emailAddress = props.props.accountDetails.loggedinUserEmail;
const personalisation = {
"caseReference": props.appealType.caseReference.ticketnumber,
"emailAddress": props.props.accountDetails.loggedinUserEmail,
"returnLink":
props.props.url +
"/myportal/" +
(router.locale != "en" ? "/cy/fymhorth/" : "/myportal/") +
appTypeCollection.UrlName +
"?lpa=" +
props.appealType.appealLPA +
@@ -195,12 +196,17 @@ let BuildSection = (props) => {
};
sendSavedEmail == true &&
sendEmail(templateId, emailAddress, personalisation, reference);
sendEmail(
router.locale != "en" ? templateIdCY : templateId,
emailAddress,
personalisation,
reference
);
useSaveStatus &&
router.replace(
router.locale != "en"
? router.locale + "/myportal"
? "/" + router.locale + "/myportal"
: "/myportal"
);
};
components/newappeal/complete.js
+13 -13
View File
@@ -1,13 +1,15 @@
import jsonpath from "jsonpath";
import useTranslation from "next-translate/useTranslation";
import Link from "next/link";
import { useRouter } from "next/router";
import { useEffect } from "react";
import { connect } from "react-redux";
import { formValueSelector } from "redux-form";
import xpath from "xpath";
import { updateCase, patchCase, sendEmail } from "../../actions";
import data from "../../data/collections.json";
import {
patchCase,
sendCaseCompleteMessage,
sendEmail,
updateCase,
} from "../../actions";
import { setCurrentSection } from "../../store/appealType/action";
import { getFormCollectionByID } from "../utils";
@@ -60,6 +62,11 @@ let CompleteAppeal = (props) => {
};
sendEmail(templateId, emailAddress, personalisation, reference);
sendCaseCompleteMessage(
props.appealType.caseReference.ticketnumber,
props.props.accountDetails.loggedinUserEmail
);
console.log("patching////////");
patchCase(incidentId);
}, [
@@ -131,17 +138,10 @@ let CompleteAppeal = (props) => {
</p>
<p className="govuk-body">
<Link href="/myportal">
<a className="govuk-link">Back to My Portal</a>
<Link href="/myportal" className="govuk-link">
Back to My Portal
</Link>
</p>
<p className="govuk-body">
<a href="#" className="govuk-link">
What did you think of this service?
</a>
(takes 30 seconds)
</p>
</div>
</div>
);
components/nosession.js
+55
View File
@@ -0,0 +1,55 @@
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 useTranslation from "next-translate/useTranslation";
const NoSessionWarning = (props) => {
let { footerLinks, loading } = props;
let { t, lang } = useTranslation();
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">
<main
className="govuk-main-wrapper--auto-spacing"
id="main-content"
role="main"
>
<div className="govuk-grid-row">
<div className="govuk-grid-column-two-thirds">
<h1>
{
(loading = !true
? "Loading"
: "You are not logged in")
}{" "}
</h1>
</div>
</div>
</main>
</div>
</div>
</div>
<Footer footerLinks={footerLinks} />
</div>
</div>
);
};
export default NoSessionWarning;
components/pdftemplates/appealRow_pdf.js
+348
View File
@@ -0,0 +1,348 @@
import Link from "next/link";
import { useRouter } from "next/router";
import useTranslation from "next-translate/useTranslation";
import xpath from "xpath";
import jsonpath from "jsonpath";
import { useSelector, shallowEqual, connect } from "react-redux";
import fieldLookup from "../../data/crmfieldlookuptranslations.json";
import {
getFormCollectionByID,
getPickListLabel,
getRadioLabel,
} from "../../components/utils";
import ReactPDF, {
Document,
Page,
Text,
View,
Image,
StyleSheet,
PDFViewer,
Font,
} from "@react-pdf/renderer";
import _ from "lodash";
import { DOMParser, XMLSerializer } from "@xmldom/xmldom";
export const AppealRow_pdf = (props) => {
let { t } = useTranslation();
// const router = useRouter();
// console.log(router);
// const { locale } = router;
const {
formXML,
whichSection,
sectionCount,
onSubmit,
updateCurrentSection,
mandatoryFieldsData,
} = props;
const styles = StyleSheet.create({
page: {
backgroundColor: "white",
padding: 20,
fontSize: 16,
paddingBottom: 50,
},
header: {
fontSize: 25,
fontFamily: "Helvetica",
flexDirection: "row",
justifyContent: "space-between",
},
subHeader: {
fontSize: 20,
},
logoImage: { width: "200pt" },
questionBullet: { width: "5%", fontSize: 12 },
questionText: { width: "30%", fontSize: 12 },
questionTextMid: { width: "80%", fontSize: 12 },
questionTextWide: { width: "95%", fontSize: 12, marginBottom: 5 },
questionAnswer: {
color: "#757575",
width: "65%",
fontSize: 12,
padding: 5,
border: 1,
borderColor: "#eee",
paddingLeft: 10,
backgroundColor: "white",
},
questionAnswerMid: {
color: "#757575",
width: "20%",
fontSize: 12,
padding: 5,
border: 1,
borderColor: "#eee",
paddingLeft: 10,
backgroundColor: "white",
},
questionAnswerWide: {
color: "#757575",
width: "95%",
fontSize: 12,
marginLeft: "5%",
border: 1,
borderColor: "#eee",
backgroundColor: "white",
padding: 5,
},
sectionContainer: {
backgroundColor: "#F8F8F8",
padding: 10,
marginTop: 20,
fontSize: 15,
},
pageNumber: {
position: "absolute",
fontSize: 12,
bottom: 20,
left: 0,
right: 0,
textAlign: "center",
color: "grey",
},
richArea: {
fontSize: 12,
color: "red",
flexDirection: "column",
},
});
const parser = new DOMParser();
var doc = parser.parseFromString(formXML, "text/xml");
var rowXML = xpath.select(
"/form/tabs/tab[" +
whichSection +
"]/columns//sections/section/rows/row",
doc
);
//console.log(rowXML);
function formatDate(dateObj) {
var m = new Date(dateObj);
var dateString;
dateObj != null
? (dateString =
("0" + m.getDate()).slice(-2) +
"/" +
("0" + (m.getMonth() + 1)).slice(-2) +
"/" +
m.getFullYear())
: (dateString = "");
return dateString;
}
const FieldsTranslations = (label) => {
// const router = useRouter();
// const { locale } = router;
const { appealtypes } = router.query;
let formObj = jsonpath.query(fieldLookup, "$['" + appealtypes + "']");
// let labelTrans =
// router.locale == "cy"
// ? jsonpath.query(
// formObj,
// "$..[?(@.value=='" + label + "')].value_cy"
// )
// : label;
let labelTrans = label;
return labelTrans;
};
return (
<>
{Object.keys(rowXML).map((key, index) => {
var newRowXML = new XMLSerializer().serializeToString(
rowXML[key]
);
//console.log(newRowXML);
var doc = parser.parseFromString(newRowXML, "text/xml");
var rows = xpath.select("//label/@description", doc);
var fieldtype = xpath.select("//@classid", doc);
var datafieldname = xpath.select("//@datafieldname", doc);
return (
<>
{(() => {
switch (fieldtype[0].value) {
case "{5B773807-9FB2-42db-97C3-7A91EFF8ADFF}":
return (
<View
wrap={false}
style={{
flexDirection: "row",
marginBottom: 10,
}}
>
<Text
style={styles.questionTextWide}
>
{/* {FieldsTranslations(rows[0].value)} */}
{rows[0].value}
</Text>
<Text
style={
styles.questionAnswerWide
}
>
{formatDate(
props.props[
datafieldname[0].value
]
)}{" "}
</Text>
</View>
);
break;
case "{E0DECE4B-6FC8-4a8f-A065-082708572369}":
return (
<View
style={{
flexDirection: "column",
marginBottom: 10,
}}
>
<View
wrap={false}
style={{
flexDirection: "row",
marginBottom: 10,
}}
>
<Text
style={
styles.questionTextMid
}
>
{rows[0].value}
</Text>
</View>
<View
style={
styles.questionAnswerWide
}
>
<Text>
{
props.props[
datafieldname[0]
.value
]
}
</Text>
</View>
</View>
);
break;
case "{07FAC785-CD58-4f9f-ABB3-4B7DDC6ED5ED}":
return (
<View
style={{
flexDirection: "column",
marginBottom: 10,
}}
>
<View
wrap={false}
style={{
flexDirection: "row",
marginBottom: 10,
}}
>
<Text
style={styles.questionText}
>
{rows[0].value}
</Text>
</View>
<View style={styles.questionAnswer}>
<Text>
{
props.props[
datafieldname[0]
.value
]
}
</Text>
</View>
</View>
);
break;
default:
return (
<View
wrap={false}
style={{
flexDirection: "row",
marginBottom: 10,
}}
>
<Text style={styles.questionText}>
{/* {FieldsTranslations(rows[0].value)} */}
{rows[0].value}
</Text>
<Text
style={
styles.questionAnswerWide
}
>
{
props.props[
datafieldname[0].value
]
}
</Text>
</View>
);
break;
}
})()}
{/* <Text className="govuk-summary-list__value">
{fieldtype[0].value ==
"{5B773807-9FB2-42db-97C3-7A91EFF8ADFF}"
? formatDate(
props.props.values[datafieldname[0].value]
)
: fieldtype[0].value ==
"{3EF39988-22BB-4f0b-BBBE-64B5A3748AEE}"
? getPickListLabel(
props.props.formData.pickListData,
datafieldname[0].value,
props.props.values[datafieldname[0].value]
)
: fieldtype[0].value ==
"{07FAC785-CD58-4f9f-ABB3-4B7DDC6ED5ED}"
? getRadioLabel(
props.props.formData.pickListData,
datafieldname[0].value,
props.props.values[datafieldname[0].value]
)
: fieldtype[0].value ==
"{16D63FD6-119B-4353-BDCA-18358721C3FE}"
? "ssss"
: props.props.values[datafieldname[0].value]}
</Text> */}
</>
);
})}
</>
);
};
components/pdftemplates/enforcement_pdf.js
+1599
View File
File diff suppressed because it is too large Load Diff
components/pdftemplates/finalComments_pdf.js
+423
View File
@@ -0,0 +1,423 @@
import ReactPDF, {
Document,
Page,
Text,
View,
Image,
StyleSheet,
PDFViewer,
Font,
} from "@react-pdf/renderer";
import { createElement } from "react";
import Html from "react-pdf-html";
import { getFormCollectionByID } from "../../components/utils";
import renderers, { renderBlock } from "react-pdf-html/dist/renderers";
const styles = StyleSheet.create({
page: {
backgroundColor: "white",
padding: 20,
fontSize: 16,
paddingBottom: 50,
},
header: {
fontSize: 25,
fontFamily: "Helvetica",
flexDirection: "row",
justifyContent: "space-between",
},
subHeader: {
fontSize: 20,
},
logoImage: { width: "200pt" },
questionBullet: { width: "5%", fontSize: 12 },
questionText: { width: "30%", fontSize: 12 },
questionTextMid: { width: "80%", fontSize: 12 },
questionTextWide: { width: "95%", fontSize: 12, marginBottom: 5 },
questionAnswer: {
color: "#757575",
width: "65%",
fontSize: 12,
padding: 5,
border: 1,
borderColor: "#eee",
paddingLeft: 10,
backgroundColor: "white",
},
questionAnswerMid: {
color: "#757575",
width: "20%",
fontSize: 12,
padding: 5,
border: 1,
borderColor: "#eee",
paddingLeft: 10,
backgroundColor: "white",
},
questionAnswerWide: {
color: "#757575",
width: "95%",
fontSize: 12,
marginLeft: "5%",
border: 1,
borderColor: "#eee",
backgroundColor: "white",
padding: 5,
},
sectionContainer: {
backgroundColor: "#F8F8F8",
padding: 10,
marginTop: 20,
fontSize: 15,
},
pageNumber: {
position: "absolute",
fontSize: 12,
bottom: 20,
left: 0,
right: 0,
textAlign: "center",
color: "grey",
},
richArea: {
fontSize: 12,
color: "red",
flexDirection: "column",
},
});
export const finalComments_pdf = ({ docProps }) => {
//console.log("----", docProps);
function formatDates(dateObj) {
var dateObj = new Date(dateObj);
var dd = String(dateObj.getDate()).padStart(2, "0");
var mm = String(dateObj.getMonth() + 1).padStart(2, "0"); //January is 0!
var yyyy = dateObj.getFullYear();
return dd + "/" + mm + "/" + yyyy;
}
let values = docProps;
let datestr = values.repfile_name.split("-");
let signedDate = datestr[2] + "/" + datestr[1] + "/" + datestr[0];
let appealTypeValue = getFormCollectionByID(values.appealType);
return (
<Document>
<Page size="A4" style={styles.page} wrap>
<View style={{ padding: 20 }}>
<View style={styles.header}>
<View>
<Text
style={{
width: "60%",
fontFamily: "Helvetica-Bold",
}}
>
Final Comments
</Text>
<View>
<Text
style={{
width: "60%",
fontSize: 15,
marginTop: 20,
fontFamily: "Helvetica-Bold",
}}
>
For Planning, Conservation area, Listed
Building and Advertisement
applications/appeals
</Text>
</View>
</View>
<Image
style={styles.logoImage}
src="public/assets/images/pedw_logo.png"
alt="PEDW Logo"
/>
</View>
<View style={styles.section}>
<View
style={{
marginTop: 10,
fontFamily: "Helvetica-Bold",
}}
>
<Text style={{ fontSize: 14 }}>Case details</Text>
</View>
<View style={styles.sectionContainer}>
<View
wrap={false}
style={{
flexDirection: "row",
marginBottom: 10,
}}
>
<Text style={styles.questionBullet}>1a.</Text>
<Text style={styles.questionText}>
Case reference :
</Text>
<Text style={styles.questionAnswer}>
{values.caseRef}
</Text>
</View>
<View
wrap={false}
style={{
flexDirection: "row",
marginBottom: 10,
}}
>
<Text style={styles.questionBullet}></Text>
<Text style={styles.questionText}>
Representation capacity:
</Text>
<Text style={styles.questionAnswer}>
{values.representationCapacity}
</Text>
</View>
<View
wrap={false}
style={{
flexDirection: "row",
marginBottom: 10,
}}
>
<Text style={styles.questionBullet}></Text>
<Text style={styles.questionText}>
Representation capacity{"\n"} details:
</Text>
<Text style={styles.questionAnswer}>
<Html style={styles.richArea}>
{
values.conditional_representationCapacity_Comments
}
</Html>
</Text>
</View>
<View
wrap={false}
style={{
flexDirection: "row",
marginBottom: 10,
}}
></View>
<View
wrap={false}
style={{
flexDirection: "row",
marginBottom: 10,
}}
>
<Text style={styles.questionBullet}>3.</Text>
<Text style={styles.questionText}>
Site address/grid ref:
</Text>
<Text style={styles.questionAnswer}>
{values.siteAddress}
</Text>
</View>
<View
wrap={false}
style={{
flexDirection: "row",
marginBottom: 10,
}}
>
<Text style={styles.questionBullet}>4.</Text>
<Text style={styles.questionText}>
Case Type:
</Text>
<Text style={styles.questionAnswer}>
{appealTypeValue.value}
</Text>
</View>
</View>
</View>
<View>
<View
style={{
marginTop: 10,
fontFamily: "Helvetica-Bold",
}}
>
<Text style={{ fontSize: 14 }}>Comments</Text>
</View>
<View style={styles.sectionContainer}>
<View
style={{
flexDirection: "column",
marginBottom: 10,
}}
>
<View
wrap={false}
style={{
flexDirection: "row",
marginBottom: 10,
}}
>
<Text style={styles.questionBullet}>
5.
</Text>
<Text style={styles.questionTextMid}>
Final Comments
</Text>
</View>
<View style={styles.questionAnswerWide}>
<Html style={styles.richArea}>
{values.representationComments}
</Html>
</View>
</View>
</View>
</View>
<View>
<View
style={{
marginTop: 10,
fontFamily: "Helvetica-Bold",
}}
>
<Text style={{ fontSize: 14 }}>
Supporting documents
</Text>
</View>
<View style={styles.sectionContainer}>
<View
wrap={false}
style={{
flexDirection: "row",
marginBottom: 10,
}}
>
<Text style={styles.questionBullet}>11.</Text>
<Text style={styles.questionText}>
List of attached files
</Text>
<View
style={[
styles.questionAnswer,
{ flexDirection: "column" },
]}
>
{values.hasOwnProperty("filesList") &&
values.filesList.map(function (p) {
return (
<View
key={p.name}
style={{
flexDirection: "row",
marginBottom: 4,
}}
>
<Text
styles={
styles.questionTextMid
}
>
{p.name} - {p.size}
</Text>
</View>
);
})}
</View>
</View>
</View>
</View>
<View>
<View
style={{
marginTop: 10,
fontFamily: "Helvetica-Bold",
}}
>
<Text>Declaration</Text>
</View>
<View style={styles.sectionContainer}>
<View
style={{
flexDirection: "row",
marginBottom: 10,
alignItems: "center",
}}
>
<View
style={{
flexDirection: "row",
marginBottom: 10,
alignItems: "center",
}}
>
<Text
style={{ width: "40%", fontSize: 12 }}
>
Signed:
</Text>
<Text style={styles.questionAnswer}>
{values.firstname} {values.lastname}
</Text>
</View>
<View
style={{
flexDirection: "row",
marginBottom: 10,
alignItems: "center",
}}
>
<Text style={styles.questionText}>
Date:
</Text>
<Text style={styles.questionAnswer}>
{signedDate}
</Text>
</View>
</View>
<View
wrap={false}
style={{
flexDirection: "row",
marginBottom: 10,
}}
>
<Text style={{ width: "18%", fontSize: 12 }}>
On behalf of:
</Text>
<Text style={styles.questionAnswerWide}>
{values.representationCapacity}
</Text>
</View>
</View>
</View>
</View>
<Text
style={styles.pageNumber}
render={({ pageNumber, totalPages }) =>
`${pageNumber} / ${totalPages}`
}
fixed
/>
<View
fixed
style={{
position: "absolute",
top: 20,
left: 20,
bottom: 20,
right: 20,
border: 1,
borderColor: "#eee",
padding: 20,
paddingTop: 30,
height: "100%",
}}
></View>
</Page>
</Document>
);
};
components/pdftemplates/lpaQuestionnaire_pdf.js
+1484
View File
File diff suppressed because it is too large Load Diff
components/pdftemplates/other_pdf.js
+403
View File
@@ -0,0 +1,403 @@
import ReactPDF, {
Document,
Page,
Text,
View,
Image,
StyleSheet,
PDFViewer,
Font,
} from "@react-pdf/renderer";
import { createElement } from "react";
import Html from "react-pdf-html";
import { getFormCollectionByID } from "../../components/utils";
import renderers, { renderBlock } from "react-pdf-html/dist/renderers";
const styles = StyleSheet.create({
page: {
backgroundColor: "white",
padding: 20,
fontSize: 16,
paddingBottom: 50,
},
header: {
fontSize: 25,
fontFamily: "Helvetica",
flexDirection: "row",
justifyContent: "space-between",
},
subHeader: {
fontSize: 20,
},
logoImage: { width: "200pt" },
questionBullet: { width: "5%", fontSize: 12 },
questionText: { width: "30%", fontSize: 12 },
questionTextMid: { width: "80%", fontSize: 12 },
questionTextWide: { width: "95%", fontSize: 12, marginBottom: 5 },
questionAnswer: {
color: "#757575",
width: "65%",
fontSize: 12,
padding: 5,
border: 1,
borderColor: "#eee",
paddingLeft: 10,
backgroundColor: "white",
},
questionAnswerMid: {
color: "#757575",
width: "20%",
fontSize: 12,
padding: 5,
border: 1,
borderColor: "#eee",
paddingLeft: 10,
backgroundColor: "white",
},
questionAnswerWide: {
color: "#757575",
width: "95%",
fontSize: 12,
marginLeft: "5%",
border: 1,
borderColor: "#eee",
backgroundColor: "white",
padding: 5,
},
sectionContainer: {
backgroundColor: "#F8F8F8",
padding: 10,
marginTop: 20,
fontSize: 15,
},
pageNumber: {
position: "absolute",
fontSize: 12,
bottom: 20,
left: 0,
right: 0,
textAlign: "center",
color: "grey",
},
richArea: {
fontSize: 12,
color: "red",
flexDirection: "column",
},
});
export const other_pdf = ({ docProps }) => {
//console.log("----", docProps);
function formatDates(dateObj) {
var dateObj = new Date(dateObj);
var dd = String(dateObj.getDate()).padStart(2, "0");
var mm = String(dateObj.getMonth() + 1).padStart(2, "0"); //January is 0!
var yyyy = dateObj.getFullYear();
return dd + "/" + mm + "/" + yyyy;
}
let values = docProps;
let datestr = values.pinswg_name.split("-");
let signedDate = datestr[2] + "/" + datestr[1] + "/" + datestr[0];
const isLPA = values.representationCapacity == "lpa" ? true : false;
return (
<Document>
<Page size="A4" style={styles.page} wrap>
<View style={{ padding: 20 }}>
<View style={styles.header}>
<View>
<Text
style={{
width: "60%",
fontFamily: "Helvetica-Bold",
}}
>
Other
</Text>
<View>
<Text
style={{
width: "60%",
fontSize: 15,
marginTop: 20,
fontFamily: "Helvetica-Bold",
}}
>
For Planning Appeal, Planning Conditions,
Listed Building and Conservation Area
Appeal, Lawful Development Appeal, Planning
Obligations, Community Infrastructure Levy,
Enforcement Notice appeal, Enforcement
Listed Building Appeal, Maintenance of land,
Called in Application applications/appeals
</Text>
</View>
</View>
<Image
style={styles.logoImage}
src="public/assets/images/pedw_logo.png"
alt="PEDW Logo"
/>
</View>
<View style={styles.section}>
<View
style={{
marginTop: 10,
fontFamily: "Helvetica-Bold",
}}
>
<Text style={{ fontSize: 14 }}>Case details</Text>
</View>
<View style={styles.sectionContainer}>
<View
wrap={false}
style={{
flexDirection: "row",
marginBottom: 10,
}}
>
<Text style={styles.questionBullet}>1.</Text>
<Text style={styles.questionText}>
{t(
"myrepresentations:s78-section-question-1"
)}
:
</Text>
<Text style={styles.questionAnswer}>
{values.caseRef}
</Text>
</View>
<View
wrap={false}
style={{
flexDirection: "row",
marginBottom: 10,
}}
></View>
<View
wrap={false}
style={{
flexDirection: "row",
marginBottom: 10,
}}
>
<Text style={styles.questionBullet}>3.</Text>
<Text style={styles.questionText}>
Site address/grid ref:
</Text>
<Text style={styles.questionAnswer}>
{values.siteAddress}
</Text>
</View>
<View
wrap={false}
style={{
flexDirection: "row",
marginBottom: 10,
}}
>
<Text style={styles.questionBullet}>4.</Text>
<Text style={styles.questionText}>
Case Type:
</Text>
<Text style={styles.questionAnswer}>
{
getFormCollectionByID(values.appealType)
.value
}
</Text>
</View>
</View>
</View>
<View>
<View
style={{
marginTop: 10,
fontFamily: "Helvetica-Bold",
}}
>
<Text style={{ fontSize: 14 }}>Comments</Text>
</View>
<View style={styles.sectionContainer}>
<View
style={{
flexDirection: "column",
marginBottom: 10,
}}
>
<View
wrap={false}
style={{
flexDirection: "row",
marginBottom: 10,
}}
>
<Text style={styles.questionBullet}>
5.
</Text>
<Text style={styles.questionTextMid}>
Other Comments
</Text>
</View>
<View style={styles.questionAnswerWide}>
<Html style={styles.richArea}>
{values.representationComments}
</Html>
</View>
</View>
</View>
</View>
<View>
<View
style={{
marginTop: 10,
fontFamily: "Helvetica-Bold",
}}
>
<Text style={{ fontSize: 14 }}>
Supporting documents
</Text>
</View>
<View style={styles.sectionContainer}>
<View
wrap={false}
style={{
flexDirection: "row",
marginBottom: 10,
}}
>
<Text style={styles.questionBullet}>11.</Text>
<Text style={styles.questionText}>
List of attached files
</Text>
<View
style={[
styles.questionAnswer,
{ flexDirection: "column" },
]}
>
{values.hasOwnProperty("filesList") &&
values.filesList.map(function (p) {
return (
<View
key={p.name}
style={{
flexDirection: "row",
marginBottom: 4,
}}
>
<Text
styles={
styles.questionTextMid
}
>
{p.name} - {p.size}
</Text>
</View>
);
})}
</View>
</View>
</View>
</View>
<View>
<View
style={{
marginTop: 10,
fontFamily: "Helvetica-Bold",
}}
>
<Text>Declaration</Text>
</View>
<View style={styles.sectionContainer}>
<View
style={{
flexDirection: "row",
marginBottom: 10,
alignItems: "center",
}}
>
<View
style={{
flexDirection: "row",
marginBottom: 10,
alignItems: "center",
}}
>
<Text
style={{ width: "40%", fontSize: 12 }}
>
Signed:
</Text>
<Text style={styles.questionAnswer}>
{values.firstname} {values.lastname}
</Text>
</View>
<View
style={{
flexDirection: "row",
marginBottom: 10,
alignItems: "center",
}}
>
<Text style={styles.questionText}>
Date:
</Text>
<Text style={styles.questionAnswer}>
{signedDate}
</Text>
</View>
</View>
{isLPA && (
<View
wrap={false}
style={{
flexDirection: "row",
marginBottom: 10,
}}
>
<Text
style={{ width: "18%", fontSize: 12 }}
>
On behalf of:
</Text>
<Text style={styles.questionAnswerWide}>
{values.representationCapacity}
</Text>
</View>
)}
</View>
</View>
</View>
<Text
style={styles.pageNumber}
render={({ pageNumber, totalPages }) =>
`${pageNumber} / ${totalPages}`
}
fixed
/>
<View
fixed
style={{
position: "absolute",
top: 20,
left: 20,
bottom: 20,
right: 20,
border: 1,
borderColor: "#eee",
padding: 20,
paddingTop: 30,
height: "100%",
}}
></View>
</Page>
</Document>
);
};
components/pdftemplates/planningappeals78_pdf.js
+367
View File
@@ -0,0 +1,367 @@
import ReactPDF, {
Document,
Page,
Text,
View,
Image,
StyleSheet,
PDFViewer,
Font,
} from "@react-pdf/renderer";
import { createElement } from "react";
import Html from "react-pdf-html";
import { getFormCollectionByID } from "../utils";
import fs from "fs";
import xpath from "xpath";
import renderers, { renderBlock } from "react-pdf-html/dist/renderers";
import _ from "lodash";
import { DOMParser, XMLSerializer } from "@xmldom/xmldom";
import { AppealRow_pdf } from "./appealRow_pdf";
const styles = StyleSheet.create({
page: {
backgroundColor: "white",
padding: 20,
fontSize: 16,
paddingBottom: 50,
},
header: {
fontSize: 25,
fontFamily: "Helvetica",
flexDirection: "row",
justifyContent: "space-between",
},
subHeader: {
fontSize: 20,
},
logoImage: { width: "200pt" },
questionBullet: { width: "5%", fontSize: 12 },
questionText: { width: "30%", fontSize: 12 },
questionTextMid: { width: "80%", fontSize: 12 },
questionTextWide: { width: "95%", fontSize: 12, marginBottom: 5 },
questionAnswer: {
color: "#757575",
width: "65%",
fontSize: 12,
padding: 5,
border: 1,
borderColor: "#eee",
paddingLeft: 10,
backgroundColor: "white",
},
questionAnswerMid: {
color: "#757575",
width: "20%",
fontSize: 12,
padding: 5,
border: 1,
borderColor: "#eee",
paddingLeft: 10,
backgroundColor: "white",
},
questionAnswerWide: {
color: "#757575",
width: "95%",
fontSize: 12,
marginLeft: "5%",
border: 1,
borderColor: "#eee",
backgroundColor: "white",
padding: 5,
},
sectionContainer: {
backgroundColor: "#F8F8F8",
padding: 10,
marginTop: 20,
fontSize: 15,
},
pageNumber: {
position: "absolute",
fontSize: 12,
bottom: 20,
left: 0,
right: 0,
textAlign: "center",
color: "grey",
},
richArea: {
fontSize: 12,
color: "red",
flexDirection: "column",
},
});
export const planningappeals78_pdf = ({ docProps }) => {
//console.log("----", docProps);
function formatDates(dateObj) {
var dateObj = new Date(dateObj);
var dd = String(dateObj.getDate()).padStart(2, "0");
var mm = String(dateObj.getMonth() + 1).padStart(2, "0"); //January is 0!
var yyyy = dateObj.getFullYear();
return dd + "/" + mm + "/" + yyyy;
}
let values = docProps;
let datestr = values.pinswg_name.split("-");
let signedDate = datestr[2] + "/" + datestr[1] + "/" + datestr[0];
let appealTypeValue = getFormCollectionByID(values.pinswg_appealcasetype);
var path = require("path");
const configDirectory = path.resolve(process.cwd(), "data/formsxml");
var xmlStr = fs.readFileSync(
path.join(configDirectory, "planningappeals78" + ".xml"),
"utf8"
);
xmlStr = xmlStr.replace(/\t/g, "");
xmlStr = xmlStr.replace(/\n/g, "");
xmlStr = xmlStr.replace(/> <"/g, "><");
xmlStr = xmlStr.toString();
console.log(xmlStr);
const parser = new DOMParser();
var doc = parser.parseFromString(xmlStr, "text/xml");
var titles = xpath.select(
"//form/tabs/tab[*]/labels/label/@description",
doc
);
var rowXML = xpath.select(
"/form/tabs/tab[*]/columns//sections/section/rows/row",
doc
);
var titleList = xpath.select(
"//form/tabs/tab[*]/labels/label/@description",
doc
);
//console.log(titles);
return (
<Document>
<Page size="A4" style={styles.page} wrap>
<View style={{ padding: 20 }}>
<View style={styles.header}>
<View>
<Text
style={{
width: "60%",
fontFamily: "Helvetica-Bold",
}}
>
Planning Appeals s78
</Text>
<View>
<Text
style={{
width: "60%",
fontSize: 15,
marginTop: 20,
fontFamily: "Helvetica-Bold",
}}
>
For Planning, Conservation area, Listed
Building and Advertisement
applications/appeals
</Text>
</View>
</View>
<Image
style={styles.logoImage}
src="public/assets/images/pedw_logo.png"
alt="PEDW Logo"
/>
</View>
<View style={styles.section}>
<View
style={{
marginTop: 10,
fontFamily: "Helvetica-Bold",
}}
>
<Text style={{ fontSize: 14 }}>Case details</Text>
</View>
<View style={styles.sectionContainer}>
<View
wrap={false}
style={{
flexDirection: "row",
marginBottom: 10,
}}
>
<Text style={styles.questionBullet}>1.</Text>
<Text style={styles.questionText}>
{t(
"myrepresentations:s78-section-question-1"
)}
:
</Text>
<Text style={styles.questionAnswer}>
{values.caseRef}
</Text>
</View>
<View
wrap={false}
style={{
flexDirection: "row",
marginBottom: 10,
}}
></View>
<View
wrap={false}
style={{
flexDirection: "row",
marginBottom: 10,
}}
>
<Text style={styles.questionBullet}>3.</Text>
<Text style={styles.questionText}>
Site address/grid ref:
</Text>
<Text style={styles.questionAnswer}>
{values.siteAddress}
</Text>
</View>
<View
wrap={false}
style={{
flexDirection: "row",
marginBottom: 10,
}}
>
<Text style={styles.questionBullet}>4.</Text>
<Text style={styles.questionText}>
Case Type:
</Text>
<Text style={styles.questionAnswer}>
{appealTypeValue.value}
</Text>
</View>
</View>
</View>
{Object.keys(titles).map((key) => (
<View key={key}>
<View
style={{
marginTop: 10,
fontFamily: "Helvetica-Bold",
}}
>
<Text style={{ fontSize: 14 }}>
{parseInt(key) + 1} {titles[key].value}
</Text>
<View style={styles.sectionContainer}>
<View
wrap={false}
style={{
flexDirection: "row",
marginBottom: 10,
}}
>
<View
style={{
flexDirection: "column",
marginBottom: 10,
}}
>
<AppealRow_pdf
formXML={xmlStr}
whichSection={parseInt(key) + 1}
sectionCount={key}
props={docProps}
key={key}
mandatoryFieldsData={null}
/>
</View>
</View>
</View>
</View>
</View>
))}
<View>
<View
style={{
marginTop: 10,
fontFamily: "Helvetica-Bold",
}}
>
<Text style={{ fontSize: 14 }}>
Supporting documents
</Text>
</View>
<View style={styles.sectionContainer}>
<View
wrap={false}
style={{
flexDirection: "row",
marginBottom: 10,
}}
>
<Text style={styles.questionBullet}>11.</Text>
<Text style={styles.questionText}>
List of attached files
</Text>
<View
style={[
styles.questionAnswer,
{ flexDirection: "column" },
]}
>
{values.hasOwnProperty("filesList") &&
values.filesList.map(function (p) {
return (
<View
key={p.name}
style={{
flexDirection: "row",
marginBottom: 4,
}}
>
<Text
styles={
styles.questionTextMid
}
>
{p.name} - {p.size}
</Text>
</View>
);
})}
</View>
</View>
</View>
</View>
</View>
<Text
style={styles.pageNumber}
render={({ pageNumber, totalPages }) =>
`${pageNumber} / ${totalPages}`
}
fixed
/>
<View
fixed
style={{
position: "absolute",
top: 20,
left: 20,
bottom: 20,
right: 20,
border: 1,
borderColor: "#eee",
padding: 20,
paddingTop: 30,
height: "100%",
}}
></View>
</Page>
</Document>
);
};
components/pdftemplates/statement_pdf.js
+426
View File
@@ -0,0 +1,426 @@
import ReactPDF, {
Document,
Page,
Text,
View,
Image,
StyleSheet,
PDFViewer,
Font,
} from "@react-pdf/renderer";
import { createElement } from "react";
import Html from "react-pdf-html";
import { getFormCollectionByID } from "../../components/utils";
import renderers, { renderBlock } from "react-pdf-html/dist/renderers";
const styles = StyleSheet.create({
page: {
backgroundColor: "white",
padding: 20,
fontSize: 16,
paddingBottom: 50,
},
header: {
fontSize: 25,
fontFamily: "Helvetica",
flexDirection: "row",
justifyContent: "space-between",
},
subHeader: {
fontSize: 20,
},
logoImage: { width: "200pt" },
questionBullet: { width: "5%", fontSize: 12 },
questionText: { width: "30%", fontSize: 12 },
questionTextMid: { width: "80%", fontSize: 12 },
questionTextWide: { width: "95%", fontSize: 12, marginBottom: 5 },
questionAnswer: {
color: "#757575",
width: "65%",
fontSize: 12,
padding: 5,
border: 1,
borderColor: "#eee",
paddingLeft: 10,
backgroundColor: "white",
},
questionAnswerMid: {
color: "#757575",
width: "20%",
fontSize: 12,
padding: 5,
border: 1,
borderColor: "#eee",
paddingLeft: 10,
backgroundColor: "white",
},
questionAnswerWide: {
color: "#757575",
width: "95%",
fontSize: 12,
marginLeft: "5%",
border: 1,
borderColor: "#eee",
backgroundColor: "white",
padding: 5,
},
sectionContainer: {
backgroundColor: "#F8F8F8",
padding: 10,
marginTop: 20,
fontSize: 15,
},
pageNumber: {
position: "absolute",
fontSize: 12,
bottom: 20,
left: 0,
right: 0,
textAlign: "center",
color: "grey",
},
richArea: {
fontSize: 12,
color: "red",
flexDirection: "column",
},
});
export const statement_pdf = ({ docProps }) => {
//console.log("----", docProps);
function formatDates(dateObj) {
var dateObj = new Date(dateObj);
var dd = String(dateObj.getDate()).padStart(2, "0");
var mm = String(dateObj.getMonth() + 1).padStart(2, "0"); //January is 0!
var yyyy = dateObj.getFullYear();
return dd + "/" + mm + "/" + yyyy;
}
let values = docProps;
let datestr = values.pinswg_name.split("-");
let signedDate = datestr[2] + "/" + datestr[1] + "/" + datestr[0];
let appealTypeValue = getFormCollectionByID(values.appealType);
return (
<Document>
<Page size="A4" style={styles.page} wrap>
<View style={{ padding: 20 }}>
<View style={styles.header}>
<View>
<Text
style={{
width: "60%",
fontFamily: "Helvetica-Bold",
}}
>
Statement
</Text>
<View>
<Text
style={{
width: "60%",
fontSize: 15,
marginTop: 20,
fontFamily: "Helvetica-Bold",
}}
>
For Planning, Conservation area, Listed
Building and Advertisement
applications/appeals
</Text>
</View>
</View>
<Image
style={styles.logoImage}
src="public/assets/images/pedw_logo.png"
alt="PEDW Logo"
/>
</View>
<View style={styles.section}>
<View
style={{
marginTop: 10,
fontFamily: "Helvetica-Bold",
}}
>
<Text style={{ fontSize: 14 }}>Case details</Text>
</View>
<View style={styles.sectionContainer}>
<View
wrap={false}
style={{
flexDirection: "row",
marginBottom: 10,
}}
>
<Text style={styles.questionBullet}>1.</Text>
<Text style={styles.questionText}>
{t(
"myrepresentations:s78-section-question-1"
)}
:
</Text>
<Text style={styles.questionAnswer}>
{values.caseRef}
</Text>
</View>
<View
wrap={false}
style={{
flexDirection: "row",
marginBottom: 10,
}}
>
<Text style={styles.questionBullet}>1a.</Text>
<Text style={styles.questionText}>
Representation capacity:
</Text>
<Text style={styles.questionAnswer}>
{values.representationCapacity}
</Text>
</View>
<View
wrap={false}
style={{
flexDirection: "row",
marginBottom: 10,
}}
>
<Text style={styles.questionBullet}>1c.</Text>
<Text style={styles.questionText}>
Representation capacity details:
</Text>
<Text style={styles.questionAnswer}>
<Html style={styles.richArea}>
{
values.conditional_representationCapacity_Comments
}
</Html>
</Text>
</View>
<View
wrap={false}
style={{
flexDirection: "row",
marginBottom: 10,
}}
></View>
<View
wrap={false}
style={{
flexDirection: "row",
marginBottom: 10,
}}
>
<Text style={styles.questionBullet}>3.</Text>
<Text style={styles.questionText}>
Site address/grid ref:
</Text>
<Text style={styles.questionAnswer}>
{values.siteAddress}
</Text>
</View>
<View
wrap={false}
style={{
flexDirection: "row",
marginBottom: 10,
}}
>
<Text style={styles.questionBullet}>4.</Text>
<Text style={styles.questionText}>
Case Type:
</Text>
<Text style={styles.questionAnswer}>
{appealTypeValue.value}
</Text>
</View>
</View>
</View>
<View>
<View
style={{
marginTop: 10,
fontFamily: "Helvetica-Bold",
}}
>
<Text style={{ fontSize: 14 }}>Comments</Text>
</View>
<View style={styles.sectionContainer}>
<View
style={{
flexDirection: "column",
marginBottom: 10,
}}
>
<View
wrap={false}
style={{
flexDirection: "row",
marginBottom: 10,
}}
>
<Text style={styles.questionBullet}>
5.
</Text>
<Text style={styles.questionTextMid}>
Statement
</Text>
</View>
<View style={styles.questionAnswerWide}>
<Html style={styles.richArea}>
{values.representationComments}
</Html>
</View>
</View>
</View>
</View>
<View>
<View
style={{
marginTop: 10,
fontFamily: "Helvetica-Bold",
}}
>
<Text style={{ fontSize: 14 }}>
Supporting documents
</Text>
</View>
<View style={styles.sectionContainer}>
<View
wrap={false}
style={{
flexDirection: "row",
marginBottom: 10,
}}
>
<Text style={styles.questionBullet}>11.</Text>
<Text style={styles.questionText}>
List of attached files
</Text>
<View
style={[
styles.questionAnswer,
{ flexDirection: "column" },
]}
>
{values.hasOwnProperty("filesList") &&
values.filesList.map(function (p) {
return (
<View
key={p.name}
style={{
flexDirection: "row",
marginBottom: 4,
}}
>
<Text
styles={
styles.questionTextMid
}
>
{p.name} - {p.size}
</Text>
</View>
);
})}
</View>
</View>
</View>
</View>
<View>
<View
style={{
marginTop: 10,
fontFamily: "Helvetica-Bold",
}}
>
<Text>Declaration</Text>
</View>
<View style={styles.sectionContainer}>
<View
style={{
flexDirection: "row",
marginBottom: 10,
alignItems: "center",
}}
>
<View
style={{
flexDirection: "row",
marginBottom: 10,
alignItems: "center",
}}
>
<Text
style={{ width: "40%", fontSize: 12 }}
>
Signed:
</Text>
<Text style={styles.questionAnswer}>
{values.firstname} {values.lastname}
</Text>
</View>
<View
style={{
flexDirection: "row",
marginBottom: 10,
alignItems: "center",
}}
>
<Text style={styles.questionText}>
Date:
</Text>
<Text style={styles.questionAnswer}>
{signedDate}
</Text>
</View>
</View>
<View
wrap={false}
style={{
flexDirection: "row",
marginBottom: 10,
}}
>
<Text style={{ width: "18%", fontSize: 12 }}>
On behalf of:
</Text>
<Text style={styles.questionAnswerWide}>
{values.representationCapacity}
</Text>
</View>
</View>
</View>
</View>
<Text
style={styles.pageNumber}
render={({ pageNumber, totalPages }) =>
`${pageNumber} / ${totalPages}`
}
fixed
/>
<View
fixed
style={{
position: "absolute",
top: 20,
left: 20,
bottom: 20,
right: 20,
border: 1,
borderColor: "#eee",
padding: 20,
paddingTop: 30,
height: "100%",
}}
></View>
</Page>
</Document>
);
};
components/pdftemplates/writtenStatement_pdf.js
+392
View File
@@ -0,0 +1,392 @@
import ReactPDF, {
Document,
Page,
Text,
View,
Image,
StyleSheet,
PDFViewer,
Font,
} from "@react-pdf/renderer";
import { createElement } from "react";
import Html from "react-pdf-html";
import { getFormCollectionByID } from "../../components/utils";
import renderers, { renderBlock } from "react-pdf-html/dist/renderers";
const styles = StyleSheet.create({
page: {
backgroundColor: "white",
padding: 20,
fontSize: 16,
paddingBottom: 50,
},
header: {
fontSize: 25,
fontFamily: "Helvetica",
flexDirection: "row",
justifyContent: "space-between",
},
subHeader: {
fontSize: 20,
},
logoImage: { width: "200pt" },
questionBullet: { width: "5%", fontSize: 12 },
questionText: { width: "30%", fontSize: 12 },
questionTextMid: { width: "80%", fontSize: 12 },
questionTextWide: { width: "95%", fontSize: 12, marginBottom: 5 },
questionAnswer: {
color: "#757575",
width: "65%",
fontSize: 12,
padding: 5,
border: 1,
borderColor: "#eee",
paddingLeft: 10,
backgroundColor: "white",
},
questionAnswerMid: {
color: "#757575",
width: "20%",
fontSize: 12,
padding: 5,
border: 1,
borderColor: "#eee",
paddingLeft: 10,
backgroundColor: "white",
},
questionAnswerWide: {
color: "#757575",
width: "95%",
fontSize: 12,
marginLeft: "5%",
border: 1,
borderColor: "#eee",
backgroundColor: "white",
padding: 5,
},
sectionContainer: {
backgroundColor: "#F8F8F8",
padding: 10,
marginTop: 20,
fontSize: 15,
},
pageNumber: {
position: "absolute",
fontSize: 12,
bottom: 20,
left: 0,
right: 0,
textAlign: "center",
color: "grey",
},
richArea: {
fontSize: 12,
color: "red",
flexDirection: "column",
},
});
export const writtenStatement_pdf = ({ docProps }) => {
//console.log("----", docProps);
function formatDates(dateObj) {
var dateObj = new Date(dateObj);
var dd = String(dateObj.getDate()).padStart(2, "0");
var mm = String(dateObj.getMonth() + 1).padStart(2, "0"); //January is 0!
var yyyy = dateObj.getFullYear();
return dd + "/" + mm + "/" + yyyy;
}
let values = docProps;
let datestr = values.pinswg_name.split("-");
let signedDate = datestr[2] + "/" + datestr[1] + "/" + datestr[0];
let appealTypeValue = getFormCollectionByID(values.appealType);
return (
<Document>
<Page size="A4" style={styles.page} wrap>
<View style={{ padding: 20 }}>
<View style={styles.header}>
<View>
<Text
style={{
width: "60%",
fontFamily: "Helvetica-Bold",
}}
>
Written Statement
</Text>
<View>
<Text
style={{
width: "60%",
fontSize: 15,
marginTop: 20,
fontFamily: "Helvetica-Bold",
}}
>
For Planning, Conservation area, Listed
Building and Advertisement
applications/appeals
</Text>
</View>
</View>
<Image
style={styles.logoImage}
src="public/assets/images/pedw_logo.png"
alt="PEDW Logo"
/>
</View>
<View style={styles.section}>
<View
style={{
marginTop: 10,
fontFamily: "Helvetica-Bold",
}}
>
<Text style={{ fontSize: 14 }}>Case details</Text>
</View>
<View style={styles.sectionContainer}>
<View
wrap={false}
style={{
flexDirection: "row",
marginBottom: 10,
}}
>
<Text style={styles.questionBullet}>1.</Text>
<Text style={styles.questionText}>
{t(
"myrepresentations:s78-section-question-1"
)}
:
</Text>
<Text style={styles.questionAnswer}>
{values.caseRef}
</Text>
</View>
<View
wrap={false}
style={{
flexDirection: "row",
marginBottom: 10,
}}
></View>
<View
wrap={false}
style={{
flexDirection: "row",
marginBottom: 10,
}}
>
<Text style={styles.questionBullet}>3.</Text>
<Text style={styles.questionText}>
Site address/grid ref:
</Text>
<Text style={styles.questionAnswer}>
{values.siteAddress}
</Text>
</View>
<View
wrap={false}
style={{
flexDirection: "row",
marginBottom: 10,
}}
>
<Text style={styles.questionBullet}>4.</Text>
<Text style={styles.questionText}>
Case Type:
</Text>
<Text style={styles.questionAnswer}>
{appealTypeValue.value}
</Text>
</View>
</View>
</View>
<View>
<View
style={{
marginTop: 10,
fontFamily: "Helvetica-Bold",
}}
>
<Text style={{ fontSize: 14 }}>Comments</Text>
</View>
<View style={styles.sectionContainer}>
<View
style={{
flexDirection: "column",
marginBottom: 10,
}}
>
<View
wrap={false}
style={{
flexDirection: "row",
marginBottom: 10,
}}
>
<Text style={styles.questionBullet}>
5.
</Text>
<Text style={styles.questionTextMid}>
Statement
</Text>
</View>
<View style={styles.questionAnswerWide}>
<Html style={styles.richArea}>
{values.representationComments}
</Html>
</View>
</View>
</View>
</View>
<View>
<View
style={{
marginTop: 10,
fontFamily: "Helvetica-Bold",
}}
>
<Text style={{ fontSize: 14 }}>
Supporting documents
</Text>
</View>
<View style={styles.sectionContainer}>
<View
wrap={false}
style={{
flexDirection: "row",
marginBottom: 10,
}}
>
<Text style={styles.questionBullet}>11.</Text>
<Text style={styles.questionText}>
List of attached files
</Text>
<View
style={[
styles.questionAnswer,
{ flexDirection: "column" },
]}
>
{values.hasOwnProperty("filesList") &&
values.filesList.map(function (p) {
return (
<View
key={p.name}
style={{
flexDirection: "row",
marginBottom: 4,
}}
>
<Text
styles={
styles.questionTextMid
}
>
{p.name} - {p.size}
</Text>
</View>
);
})}
</View>
</View>
</View>
</View>
<View>
<View
style={{
marginTop: 10,
fontFamily: "Helvetica-Bold",
}}
>
<Text>Declaration</Text>
</View>
<View style={styles.sectionContainer}>
<View
style={{
flexDirection: "row",
marginBottom: 10,
alignItems: "center",
}}
>
<View
style={{
flexDirection: "row",
marginBottom: 10,
alignItems: "center",
}}
>
<Text
style={{ width: "40%", fontSize: 12 }}
>
Signed:
</Text>
<Text style={styles.questionAnswer}>
{values.firstname} {values.lastname}
</Text>
</View>
<View
style={{
flexDirection: "row",
marginBottom: 10,
alignItems: "center",
}}
>
<Text style={styles.questionText}>
Date:
</Text>
<Text style={styles.questionAnswer}>
{signedDate}
</Text>
</View>
</View>
<View
wrap={false}
style={{
flexDirection: "row",
marginBottom: 10,
}}
>
<Text style={{ width: "18%", fontSize: 12 }}>
On behalf of:
</Text>
<Text style={styles.questionAnswerWide}>
{values.representationCapacity}
</Text>
</View>
</View>
</View>
</View>
<Text
style={styles.pageNumber}
render={({ pageNumber, totalPages }) =>
`${pageNumber} / ${totalPages}`
}
fixed
/>
<View
fixed
style={{
position: "absolute",
top: 20,
left: 20,
bottom: 20,
right: 20,
border: 1,
borderColor: "#eee",
padding: 20,
paddingTop: 30,
height: "100%",
}}
></View>
</Page>
</Document>
);
};
components/search/advancedsearch.js
+88 -93
View File
@@ -6,7 +6,7 @@ import { reduxForm, formValueSelector, Field } from "redux-form";
import { useDispatch, useSelector, shallowEqual, connect } from "react-redux";
import jsonpath from "jsonpath";
import data from "../../data/collections.json";
import LoadingOverlay from "react-loading-overlay";
import transLookup from "../../data/lookuptranslations.json";
const required = (errorMsg) => (value) =>
@@ -275,98 +275,96 @@ let AdvancedSearch = (props) => {
label,
errormsg,
}) => {
return (
<>
<div
className={
touched && error
? "govuk-form-group govuk-form-group--error"
: "govuk-form-group "
}
>
<label className="govuk-label" htmlFor={id}>
{label}
{name}
</label>
{touched && error && (
<span
id="passport-issued-error"
className="govuk-error-message"
>
<span className="govuk-visually-hidden">
Error:
</span>{" "}
{errormsg}
</span>
)}
<div>
<select
{...input}
className="govuk-select"
id={id}
name={name}
//onChange={(e) => props.onChangeSelectAppealType(e)}
>
<option value="" disabled defaultValue>
{t("common:drop-down-select")}
</option>
{_.isEmpty(optionsObj)
? ""
: Object.keys(optionsObj).map((key, index) => {
return (
<option
key={key}
value={
_.isEmpty(optionsObj[key])
? ""
: _.isEmpty(
optionsObj[key]
)
? ""
: _.isEmpty(
optionsObj[key]
.value
)
? ""
: optionsObj[key]
.attributevalue +
"," +
optionsObj[key].value
.replace(
/(\band|[\s\-\+\(\)\,\&])/g,
""
)
.toLowerCase()
}
>
{_.isEmpty(optionsObj[key])
? ""
: _.isEmpty(optionsObj[key])
return <>
<div
className={
touched && error
? "govuk-form-group govuk-form-group--error"
: "govuk-form-group "
}
>
<label className="govuk-label" htmlFor={id}>
{label}
{name}
</label>
{touched && error && (
<span
id="passport-issued-error"
className="govuk-error-message"
>
<span className="govuk-visually-hidden">
Error:
</span>{" "}
{errormsg}
</span>
)}
<div>
<select
{...input}
className="govuk-select"
id={id}
name={name}
//onChange={(e) => props.onChangeSelectAppealType(e)}
>
<option value="" disabled defaultValue>
{t("common:drop-down-select")}
</option>
{_.isEmpty(optionsObj)
? ""
: Object.keys(optionsObj).map((key, index) => {
return (
<option
key={key}
value={
_.isEmpty(optionsObj[key])
? ""
: _.isEmpty(
optionsObj[key].value
optionsObj[key]
)
? ""
: router.locale == "cy"
? jsonpath.query(
transLookup,
'$..[?(@.value=="' +
optionsObj[key]
.value +
'")].value_cy'
: _.isEmpty(
optionsObj[key]
.value
)
: optionsObj[key].value ||
t(
"case:summary-no-date-entered-label"
)}
</option>
);
})}
</select>
</div>
? ""
: optionsObj[key]
.attributevalue +
"," +
optionsObj[key].value
.replace(
/(\band|[\s\-\+\(\)\,\&])/g,
""
)
.toLowerCase()
}
>
{_.isEmpty(optionsObj[key])
? ""
: _.isEmpty(optionsObj[key])
? ""
: _.isEmpty(
optionsObj[key].value
)
? ""
: router.locale == "cy"
? jsonpath.query(
transLookup,
'$..[?(@.value=="' +
optionsObj[key]
.value +
'")].value_cy'
)
: optionsObj[key].value ||
t(
"case:summary-no-date-entered-label"
)}
</option>
);
})}
</select>
</div>
</>
);
</div>
</>;
};
// const [showSpinnerState, setShowSpinnerState] = useState(false);
@@ -512,7 +510,9 @@ let AdvancedSearch = (props) => {
},
]}
//validate={[required]}
label={"Case Status"}
label={t(
"search:case-status-label"
)}
errormsg="Local authority is required"
/>
{/* <fieldset className="govuk-fieldset">
@@ -613,11 +613,6 @@ let AdvancedSearch = (props) => {
</div>
</form>
</div>
{/* <LoadingOverlay
active={showSpinnerState}
spinner
text={t("common:spinner-searching")}
/> */}
</>
);
};
components/search/dnssearchresults.js
+36 -37
View File
@@ -7,7 +7,7 @@ import _ from "lodash";
import transLookup from "../../data/lookuptranslations.json";
import PaginationControl from "./pagination";
import { useState, useEffect, useCallback } from "react";
import LoadingOverlay from "react-loading-overlay";
import {
getBasicDNSSearchPaged,
getBasicSearchDetailsPaged,
@@ -356,31 +356,29 @@ const DNSSearchResults = (props) => {
: "") +
"/dnsdetails"
}
>
<a
className="govuk-link--no-underline"
onClick={() => {
setCurrentReference({
"currentReference":
item.title,
"currentType":
"searchResultsObj",
"incidentid":
item.incidentid,
"appealType":
item.pinswg_appealcasetype,
"showMap": showMap,
});
}}
>
<span className="results-visually-hidden">
{t(
"search:searchresults-case-reference-label"
)}
:
</span>
{item.title}
</a>
className="govuk-link--no-underline"
onClick={() => {
setCurrentReference({
"currentReference":
item.title,
"currentType":
"searchResultsObj",
"incidentid":
item.incidentid,
"appealType":
item.pinswg_appealcasetype,
"showMap": showMap,
});
}}>
<span className="results-visually-hidden">
{t(
"search:searchresults-case-reference-label"
)}
:
</span>
{item.title}
</Link>
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
@@ -542,11 +540,14 @@ const DNSSearchResults = (props) => {
"watchedCases"
);
alert(
"You have stopped watching case " +
item.title
t(
"case:you-have-stopped-watching-label"
) + item.title
);
}}
title="Stop watching this case"
title={t(
"case:stop-watching-case-link"
)}
>
<span className="eye"></span>
</span>
@@ -560,11 +561,14 @@ const DNSSearchResults = (props) => {
item.pinswg_appealcasetype
);
alert(
"You are watching case " +
item.title
t(
"case:you-are-watching-label"
) + item.title
);
}}
title="Watch this case"
title={t(
"case:watch-this-case-link"
)}
>
<span className="eye"></span>
</span>
@@ -768,11 +772,6 @@ const DNSSearchResults = (props) => {
</div>
</div>
)}
{/* <LoadingOverlay
active={showSpinnerState}
spinner
text={t("common:spinner-searching")}
/> */}
</>
);
};
components/search/searchresults.js
+123 -51
View File
@@ -18,12 +18,12 @@ import {
} from "../../actions";
import data from "../../data/collections.json";
import { useCallback, useState } from "react";
import LoadingOverlay from "react-loading-overlay";
import {
setSearchResults,
setSearchDetails,
} from "../../store/searchOutput/action";
import { setLoggedInUserId } from "../../store/accountDetails/action";
import {
setWatchedCases,
setWatchedCasesDetails,
@@ -76,6 +76,7 @@ const SearchResults = (props) => {
const [selectedOption, setSelectedOption] = useState(10);
const [orderByState, setOrderbyState] = useState("createdon");
const [fieldSortState, setfieldSortState] = useState("asc");
const [loginToWatch, setLoginToWatch] = useState("true");
let spinnerState = () => {
showSpinnerState == true
@@ -95,12 +96,14 @@ const SearchResults = (props) => {
createWatchedCases(updateBody)
.then((data) => data)
.then(() => {
getWatchedCasesProxy(cookies.pinsUser).then((data) => {
setWatchedCases(data),
getDetails(data, "myWatchedCases").then((data) => {
setWatchedCasesDetails(data);
});
});
getWatchedCasesProxy(props.accountDetails.loggedinUserId).then(
(data) => {
setWatchedCases(data),
getDetails(data, "myWatchedCases").then((data) => {
setWatchedCasesDetails(data);
});
}
);
});
};
@@ -119,7 +122,9 @@ const SearchResults = (props) => {
deleteWatchedCases(caseID)
.then((data) => data)
.then(() => {
getWatchedCasesProxy(cookies.pinsUser).then((data) => {
getWatchedCasesProxy(
props.accountDetails.loggedinUserId
).then((data) => {
setWatchedCases(data),
getDetails(data, "myWatchedCases").then((data) => {
setWatchedCasesDetails(data);
@@ -129,7 +134,7 @@ const SearchResults = (props) => {
};
const getDetails = (resultsObj, detailsType) => {
//console.log(resultsObj);
console.log(resultsObj);
let detailsArr = [];
resultsObj = resultsObj.value;
const detailsObj = resultsObj.map((searchDetail, index) => {
@@ -293,32 +298,27 @@ const SearchResults = (props) => {
? "/myportal/case"
: "/case"
}
className="govuk-link--no-underline"
onClick={() => {
setCurrentReference({
"currentReference":
item.title,
"currentType":
"searchResultsObj",
"incidentid":
item.incidentid,
"appealType":
item.pinswg_appealcasetype,
});
}}
>
<a
className="govuk-link--no-underline"
onClick={() => {
setCurrentReference({
"currentReference":
item.title,
"currentType":
"searchResultsObj",
"incidentid":
item.incidentid,
"appealType":
item.pinswg_appealcasetype,
"showreps":
props.showLoginCheck,
});
}}
>
<span className="results-visually-hidden">
{t(
"search:searchresults-case-reference-label"
)}
:
</span>
{item.title}
</a>
<span className="results-visually-hidden">
{t(
"search:searchresults-case-reference-label"
)}
:
</span>
{item.title}
</Link>
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
@@ -355,7 +355,7 @@ const SearchResults = (props) => {
: ""}
{/* {detailsObj.pinswg_siteaddressline1 !=
null && <br />} */}
null && <br />} */}
{_.has(
detailsObj,
@@ -507,11 +507,14 @@ const SearchResults = (props) => {
"watchedCases"
);
alert(
"You have stopped watching case " +
item.title
t(
"case:you-have-stopped-watching-label"
) + item.title
);
}}
title="Stop watching this case"
title={t(
"case:stop-watching-case-link"
)}
>
<span className="eye"></span>
</span>
@@ -520,16 +523,20 @@ const SearchResults = (props) => {
className="govuk-summary-list__actionLink watchLink"
onClick={() => {
selectWatchedCase(
cookies.pinsUser,
props.accountDetails
.loggedinUserId,
item.incidentid,
item.pinswg_appealcasetype
);
alert(
"You are watching case " +
item.title
t(
"case:you-are-watching-label"
) + item.title
);
}}
title="Watch this case"
title={t(
"case:watch-this-case-link"
)}
>
<span className="eye"></span>
</span>
@@ -541,9 +548,18 @@ const SearchResults = (props) => {
<span
className="govuk-summary-list__actionLink watchLink"
onClick={() => {
signIn("email");
// signIn("email");
signIn(undefined, {
callbackUrl:
"/myportal/searchresults?q=" +
searchString +
"&toWatch=" +
item.incidentid +
"_" +
item.pinswg_appealcasetype,
});
// selectWatchedCase(
// cookies.pinsUser,
// props.accountDetails.loggedinUserId,
// item.incidentid,
// item.pinswg_appealcasetype
// );
@@ -552,7 +568,9 @@ const SearchResults = (props) => {
item.title
);
}}
title="Watch this case"
title={t(
"case:watch-this-case-link"
)}
>
<span className="eye"></span>
</span>
@@ -666,6 +684,28 @@ const SearchResults = (props) => {
};
useEffect(() => {
const selectWatchedCase = (loggedInUser, incidentID, appealType) => {
let updateBody = {
"pinswg_WatchedCase@odata.bind":
"/incidents(" + incidentID + ")",
"pinswg_Contact@odata.bind": "/contacts(" + loggedInUser + ")",
"pinswg_appealcasetype": +appealType,
};
createWatchedCases(updateBody)
.then((data) => data)
.then(() => {
getWatchedCasesProxy(
props.accountDetails.loggedinUserId
).then((data) => {
setWatchedCases(data),
getDetails(data, "myWatchedCases").then((data) => {
setWatchedCasesDetails(data);
});
});
});
};
if (searchLoaded) {
if (selectedOption) {
setShowSpinnerState(true);
@@ -674,12 +714,41 @@ const SearchResults = (props) => {
} else {
setSearchLoaded(true);
}
if (loginToWatch && router.query.hasOwnProperty("toWatch")) {
console.log("am in here");
let now = new Date();
let expDate = new Date(now);
expDate.setDate(now.getDate() + 1);
setLoggedInUserId(props.accountDetails.loggedinUserId);
setCookie(null, "pinsUser", props.accountDetails.loggedinUserId, {
path: "/",
expires: expDate,
});
selectWatchedCase(
props.accountDetails.loggedinUserId,
router.query.toWatch.split("_")[0],
router.query.toWatch.split("_")[1]
);
getSearchPageResults(1, orderByState, fieldSortState);
setLoginToWatch(false);
} else {
console.log("or am in here");
setLoginToWatch(false);
}
}, [
selectedOption,
fieldSortState,
orderByState,
searchLoaded,
loginToWatch,
setWatchedCases,
getSearchPageResults,
setWatchedCasesDetails,
props.accountDetails.loggedinUserId,
router.query,
]);
// console.log(
// "page is here ",
@@ -766,11 +835,6 @@ const SearchResults = (props) => {
)}
</div>
</div>
{/* <LoadingOverlay
active={showSpinnerState}
spinner
text={t("common:spinner-searching")}
/> */}
</>
);
};
@@ -798,4 +862,12 @@ const mapDispatchToProps = (dispatch) => {
};
};
export default connect(null, mapDispatchToProps)(SearchResults);
const mapStateToProps = (state) => {
return {
// currentView: state.currentView,
accountDetails: state.accountDetails,
// search: state.search,
// searchResultsObj: state.searchResultsObj,
};
};
export default connect(mapStateToProps, mapDispatchToProps)(SearchResults);
components/search/viewall.js
+12 -12
View File
@@ -14,12 +14,12 @@ export default function ViewAllResults(props) {
<div className="govuk-summary-list__row">
<dd className="govuk-summary-list__value govuk-!-font-size-16 govuk-!-padding-left-2">
<Link href={router.locale == "cy" ? "/achos" : "/case"}>
<a>
<span className="results-visually-hidden">
Case Reference:
</span>
{resultsArr[key].title}
</a>
<span className="results-visually-hidden">
Case Reference:
</span>
{resultsArr[key].title}
</Link>
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
@@ -90,12 +90,12 @@ export default function ViewAllResults(props) {
: "/case"
}
>
<a>
<span className="results-visually-hidden">
Case Reference:
</span>
{item.title}
</a>
<span className="results-visually-hidden">
Case Reference:
</span>
{item.title}
</Link>
</dd>
<dd className="govuk-summary-list__value govuk-!-font-size-16">
components/searchresults.js
+6 -6
View File
@@ -58,12 +58,12 @@ export default function Search(props) {
<div className="govuk-grid-row">
<div className="govuk-grid-column-full">
<div className="govuk-button-group">
<Link href="/advancedsearch">
<a className="govuk-button">
{t(
"search:searchresults-search-button-label"
)}
</a>
<Link href="/advancedsearch" className="govuk-button">
{t(
"search:searchresults-search-button-label"
)}
</Link>
{/* <a
onClick={() => router.back()}
components/seo/Page.js
-21
View File
@@ -1,5 +1,4 @@
import Head from "next/head";
import { string } from "prop-types";
// ALl options are conditional apart from title
const PageMeta = ({
@@ -96,24 +95,4 @@ const PageMeta = ({
);
};
PageMeta.propTypes = {
title: string,
createdAt: string,
updatedAt: string,
ogImage: string,
ogUrl: string,
ogTitle: string,
ogType: string,
ogDescription: string,
canonicalURL: string,
description: string,
keywords: string,
createdAt: string,
updatedAt: string,
robots: string,
twitterDescription: string,
twitterTitle: string,
twitterImage: string,
};
export default PageMeta;
components/timeout/index.js
+4 -1
View File
@@ -41,7 +41,10 @@ const TimeOut = (props) => {
const handleLogout = () => {
console.info("////////////\n" + "logout" + "\n////////////");
window.localStorage.clear(),
destroyCookie({}, "pinsUser"),
destroyCookie(null, "next-auth.csrf-token"),
destroyCookie(null, "next-auth.callback-url"),
destroyCookie(null, "pedw_locale"),
destroyCookie(null, "pinsUser"),
signOut({ callbackUrl: "/logout" });
};
components/utils/index.js
+78 -4
View File
@@ -66,7 +66,15 @@ export const getSearchDetails = (searchResultsObj) => {
searchResultsObj = searchResultsObj.value;
const detailsObj = searchResultsObj.map((searchDetail, index) => {
if (searchDetail.pinswg_appealcasetype == null) {
console.log(searchDetail.title);
//console.log(searchDetail.title);
detailsArr.push(
getBasicSearchDetails(
"pinswg_dnses",
searchDetail.title,
"pinswg_dnsid",
searchDetail.incidentid
)
);
} else {
let formMeta = getFormCollectionByID(
searchDetail.pinswg_appealcasetype
@@ -220,8 +228,8 @@ export const getProgressObj = (
"totalFields": formObj[key].fieldsTotal,
"allFieldsComplete":
titleList[key].value == "Upload documents"
? _.has(props.props.appealType.fileList, "files") &&
props.props.appealType.fileList.files.length > 0
? _.has(props.props.appealType.fileList, "value") &&
props.props.appealType.fileList.value.length > 0
: rowCount == formObj[key].fieldsTotal,
};
});
@@ -230,7 +238,7 @@ export const getProgressObj = (
};
const BuildRowObj = (rowXML, titleList) => {
const rowObj = Object.keys(rowXML).map((key, index) => {
let rowObj = Object.keys(rowXML).map((key, index) => {
var doc = parser.parseFromString(rowXML[key].outerHTML, "text/xml");
if (_.isEmpty(rowXML[key].innerHTML)) {
("");
@@ -361,3 +369,69 @@ export const getTempCaseRef = () => {
randomString(6).toUpperCase()
);
};
export const getThumbnailIconByExtension = (blobName) => {
let fileType = blobName.slice(blobName.lastIndexOf(".") + 1);
switch (fileType) {
case "html":
return "/assets/images/documenttypes/html.png";
break;
case "txt":
return "/assets/images/documenttypes/txt.png";
break;
case "doc":
return "/assets/images/documenttypes/doc.png";
break;
case "pdf":
return "/assets/images/documenttypes/pdf.png";
break;
case "docx":
return "/assets/images/documenttypes/docx.png";
break;
case "csv":
return "/assets/images/documenttypes/csv.png";
break;
case "xlsx":
return "/assets/images/documenttypes/xlsx.png";
break;
case "zip":
return "/assets/images/documenttypes/zip.png";
break;
case "jpeg":
case "jpg":
return "/assets/images/documenttypes/jpg.png";
case "png":
return "/assets/images/documenttypes/png.png";
break;
default:
return "/assets/images/documenttypes/txt.png";
break;
}
};
export const bytesToSize = (bytes) => {
var sizes = ["Bytes", "KB", "MB", "GB", "TB"];
if (bytes == 0) return "0 Byte";
var i = parseInt(Math.floor(Math.log(bytes) / Math.log(1024)));
return Math.round(bytes / Math.pow(1024, i), 2) + " " + sizes[i];
};
export const formatDates = (dateObj, showTime) => {
var dateObj = new Date(dateObj);
var dd = String(dateObj.getDate()).padStart(2, "0");
var mm = String(dateObj.getMonth() + 1).padStart(2, "0"); //January is 0!
var yyyy = dateObj.getFullYear();
var hh = dateObj.getHours();
hh = ("0" + hh).slice(-2);
var mins = dateObj.getMinutes();
mins = ("0" + mins).slice(-2);
const dateStr = showTime
? hh == 0 && mins == 0
? ""
: hh + ":" + mins
: dd + "/" + mm + "/" + yyyy + " ";
return dateStr;
};
components/viewall.js
+2 -2
View File
@@ -29,8 +29,8 @@ export default function ViewAll(props) {
<div className="govuk-grid-row">
<div className="govuk-grid-column-full">
<div className="govuk-button-group">
<Link href="/myportal">
<a className="govuk-button">Back</a>
<Link href="/myportal" className="govuk-button">
Back
</Link>
</div>
</div>
i18n.js
+5 -5
View File
@@ -10,13 +10,13 @@ module.exports = {
],
"pages": {
"*": ["common", "newappeal", "search"],
"/": ["common", "home"],
"/": ["common", "home", "case"],
"/error": ["common", "home", "myportal"],
"/myportal": ["myportal", "common", "home"],
"/myportal/viewall": ["search", "myportal"],
"/myportal/advancedsearch": ["search", "myportal"],
"/myportal/advancedsearchresults": ["search", "myportal"],
"/myportal/searchresults": ["search", "myportal"],
"/myportal/searchresults": ["search", "myportal", "case"],
"/myportal/case": ["case"],
"/myportal/dnsapplications": ["search", "dnsCommon", "dnsApplications"],
"/myportal/dnsdetails": [
@@ -27,10 +27,10 @@ module.exports = {
],
"/advancedsearch": ["search", "myportal"],
"/advancedsearchresults": ["search"],
"/searchresults": ["search"],
"/searchresults": ["search", "case"],
"/viewall": ["search"],
"/case": ["case"],
"/myportal/representation": ["case"],
"/myportal/representation": ["case", "myrepresentations", "common"],
"/myportal/error": ["myportal", "common"],
"/newappeal": ["newappeal"],
"/newappeal/*": ["newappeal"],
@@ -44,7 +44,7 @@ module.exports = {
"/dnsdetails": ["case", "search", "dnsCommon", "dnsApplications"],
"/help/cookies": ["common", "cookies"],
"/account/register": ["common", "account"],
"/account/personaldetails": ["common", "search"],
"/account/personaldetails": ["common", "search", "account"],
"/details-about-cookies": ["common", "cookies"],
"/terms-and-conditions": ["common"],
"/account/passwordreset": ["common", "home"],
locales/cy/account.json
+21 -1
View File
@@ -37,5 +37,25 @@
"register-new-account-sub-heading-what-next": "Beth sy'n digwydd nesaf",
"register-new-account-paragraph-what-next": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi a metus non quam mollis egestas. Integer ac leo cursus, laoreet nulla sed, tempus tellus. Mauris condimentum erat arcu.",
"register-new-account-my-portal-link": "Mewngofnodi i'm Porth",
"register-new-account-account-failed": "Rhowch gynnig arall arni gyda chyfeiriad e-bost gwahanol"
"register-new-account-account-failed": "Rhowch gynnig arall arni gyda chyfeiriad e-bost gwahanol",
"account-title": "Eich cyfrif",
"account-about-you-label": "Amdanat ti",
"account-role-label": "Rôl",
"account-preferred-language-label": "Hoff iaith",
"account-preferred-language-english": "Saesneg",
"account-preferred-language-welsh": "Cymraeg",
"account-first-name-label": "Enw cyntaf",
"account-last-name-label": "Enw olaf",
"account-email-address-label": "Cyfeiriad ebost",
"account-telephone-label": "Ffon",
"account-company-group-label": "Cwmni/Grŵp",
"account-your-address-label": "Beth yw eich cyfeiriad?",
"account-address-line-1-label": "Llinell Cyfeiriad 1",
"account-address-line-2-label": "Llinell cyfeiriad 2",
"account-town-city-label": "Tref/Dinas",
"account-county-label": "Sir",
"account-postcode-label": "Côd post",
"account-complete-para-1": "Mae eich manylion wedi'u diweddaru",
"account-complete-para-2": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi a metus non quam mollis egestas. Integer ac leo cursus, laoreet nulla sed, tempus tellus. Mauris condimentum erat arcu.",
"account-complete-return-to-portal-link": "Dychwelyd i Fy mhorth"
}
locales/cy/case.json
+12 -2
View File
@@ -2,7 +2,7 @@
"page-title": "Cyfeirnod",
"case-card-title": "Reference: APP/B1415/W/20/3271702",
"summary-reference-label": "Cyfeirnod",
"summary-applicant-label": "Apelydd/Ymgeisydd",
"summary-applicant-label": "Apelydd",
"summary-applicantonly-label": "Ymgeisydd",
"summary-appellantonly-label": "Apelydd",
"summary-agent-label": "Asiant",
@@ -79,5 +79,15 @@
"summary-case-website-label": "Gwefan",
"summary-case-recommendation-label": "Argymhelliad",
"summary-no-details-label": "Nid oes unrhyw fanylion ar gael ar hyn o bryd",
"summary-case-relevant-authoritylabel": "Awdurdod perthnasol"
"summary-case-relevant-authoritylabel": "Awdurdod perthnasol",
"representation-representation-type": "Pa fath o gynrychiolaeth ydych chi'n ei wneud?",
"representation-onbehalfof": "A ydych yn gweithredu ar ran cwmni, grŵp neu sefydliad",
"representation-onbehalfof-details": "Enw'r cwmni/grŵp/sefydliad",
"representation-comments": "Sylwadau",
"representation-files": "Ffeiliau perthnasol",
"representation-period-ended-on-label": "Daeth y Cyfnod Cynrychiolaeth i ben ar ",
"stop-watching-case-link": "Stopiwch wylio'r achos hwn",
"watch-this-case-link": "Gwyliwch yr achos hwn",
"you-are-watching-label": "Rydych chi'n gwylio achos ",
"you-have-stopped-watching-label": "Rydych chi wedi rhoi'r gorau i wylio'r achos "
}

Some files were not shown because too many files have changed in this diff Show More