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

Merged PR 2377: added enlarge map view on dnsapplication list

Browse Source 
added enlarge map view on dnsapplication list

Related work items: #23774
This commit is contained in:
Robert Bond
2026-06-09 10:04:32 +00:00
parent c39e4bcc9a
commit 7e47340326
6 changed files with 72 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/dnssearchresults.js
+2
View File
@@ -11,6 +11,7 @@ export default function Search(props) {
watchedCases,
showMap,
showLoginCheck,
mapTarget
} = props;
let { t } = useTranslation();
@@ -48,6 +49,7 @@ export default function Search(props) {
watchedCases={watchedCases}
showMap={showMap}
showLoginCheck={showLoginCheck}
mapTarget={mapTarget}
/>
</div>
</div>
components/search/dnssearchresults.js
+42 -39
View File
@@ -53,7 +53,8 @@ const DNSSearchResults = (props) => {
setWatchedCases,
setWatchedCasesDetails,
showMap,
showLoginCheck
showLoginCheck,
mapTarget
} = props;
let { t } = useTranslation();
@@ -65,6 +66,7 @@ const DNSSearchResults = (props) => {
const [searchLoaded, setSearchLoaded] = useState(false);
const [showSpinnerState, setShowSpinnerState] = useState(false);
const [isMapExpanded, setIsMapExpanded] = useState(false);
// let dataArray = [];
// //push your Json Data in the array
@@ -907,9 +909,30 @@ const DNSSearchResults = (props) => {
<>
<div className="govuk-grid-row">
<div className="flex-container grid-row govuk-body case">
{showMap == "true" && isMapExpanded && (
<div className="govuk-grid-column-full">
<div className="map-container map-container--expanded">
<iframe
src={`https://datamap.gov.wales/maps/${mapTarget}/embed?center=-3.6553189192727347,52.214962933659415&zoom=2#/`}
width="100%"
height="600"
frameBorder="0"
title="Map"
/>
<button
type="button"
className="govuk-link map-expand-link"
onClick={() => setIsMapExpanded(false)}
>
Reduce map
</button>
</div>
</div>
)}
<div
className={
showMap == "true"
showMap == "true" && !isMapExpanded
? "govuk-grid-column-one-half"
: "govuk-grid-column-two-thirds"
}
@@ -965,50 +988,30 @@ const DNSSearchResults = (props) => {
</p>
</div>
{showMap == "true" && (
{showMap == "true" && !isMapExpanded && (
<div className="govuk-grid-column-one-half">
<div
// style={{
// height: "45vh",
// width: "100%",
// }}
>
{/* <GoogleMapReact
options={function (maps) {
return {
overviewMapControl: true,
mapTypeControl: true,
};
}}
bootstrapURLKeys={{
key: "AIzaSyCzeVrHt544bp_72YCFkw21eDsmI2JEsQo",
}}
defaultCenter={{
id: "",
lat: 52.412272,
lng: -3.437989,
}}
defaultZoom={7}
onGoogleApiLoaded={({ map, maps }) =>
ModelsMap(map, maps)
}
/> */}
<div className="map-container">
<iframe
src={
"https://datamap.gov.wales/maps/pedw-dev/embed?center=-3.6553189192727347,52.214962933659415&zoom=2#/"
}
//src={"https://datamap.gov.wales/maps/pedw-dev/embed#/"}
width={"100%"}
style={{ maxHeight: "400px" }}
height={"500px"}
className={"mappingFrame"}
></iframe>
src={`https://datamap.gov.wales/maps/${mapTarget}/embed?center=-3.6553189192727347,52.214962933659415&zoom=2#/`}
width="100%"
height="500"
frameBorder="0"
title="Map"
/>
</div>
<button
type="button "
className="govuk-link map-expand-link mapSizeButton"
onClick={() => setIsMapExpanded(true)}
>
Enlarge map
</button>
</div>
)}
</div>
</div>
{searchResultsObj["@odata.count"] > 5 && (
<div id="recordCountSelect" className="govuk-grid-row">
<div className="govuk-form-group">
lib/domain/representation-policy/resolveRepresentationWindow.js
+2
View File
@@ -28,6 +28,8 @@ export function isRepresentationWindowClosed(
}
export function resolveRepresentationWindow(caseDetails, DateCtor = Date) {
caseDetails = caseDetails || {};
const hasStartDate =
Object.prototype.hasOwnProperty.call(caseDetails, "pinswg_startdate") ||
Object.prototype.hasOwnProperty.call(
pages/dnsapplications.js
+5 -2
View File
@@ -23,7 +23,7 @@ import { wrapper } from "../store/store";
import ServiceBanner from "../components/servicebanner";
const Home = (props) => {
const { footerLinks, pages, showMap, showLoginCheck } = props;
const { footerLinks, pages, showMap, showLoginCheck, mapTarget } = props;
let { t, lang } = useTranslation();
const router = useRouter();
@@ -109,6 +109,7 @@ const Home = (props) => {
searchString="DNS"
searchResultsObj={props.searchResultsObj}
showLoginCheck={showLoginCheck}
mapTarget={mapTarget}
/>
</div>
<Footer footerLinks={footerLinks} ticketnumber={props} />
@@ -140,6 +141,7 @@ export const getServerSideProps = wrapper.getServerSideProps(
const showLoginCheck = process.env.SHOWLOGIN || false;
const showMapCheck = process.env.SHOWMAPS || false;
const mapTarget = process.env.MAP_TARGET || "pedw-dev";
// if (_.has(searchResultsObj, "status") == true) {
// return {
@@ -166,7 +168,8 @@ export const getServerSideProps = wrapper.getServerSideProps(
return {
props: {
showMap: showMapCheck,
showLoginCheck: showLoginCheck
showLoginCheck: showLoginCheck,
mapTarget: mapTarget
}
};
}
pages/myportal/dnsapplications.js
+4 -2
View File
@@ -40,7 +40,7 @@ import { getSession } from "next-auth/react";
import ServiceBanner from "../../components/myportal/servicebanner";
const Home = (props) => {
const { footerLinks, pages, watchedCases, showMap } = props;
const { footerLinks, pages, watchedCases, showMap, mapTarget } = props;
let { t, lang } = useTranslation();
const router = useRouter();
@@ -127,6 +127,7 @@ const Home = (props) => {
searchResultsObj={props.searchResultsObj}
myportal={true}
watchedCases={watchedCases}
mapTarget={mapTarget}
/>
</div>
<Footer footerLinks={footerLinks} ticketnumber={props} />
@@ -174,6 +175,7 @@ export const getServerSideProps = wrapper.getServerSideProps(
// : searchResultsObj;
const showMapCheck = process.env.SHOWMAPS || false;
const mapTarget = process.env.MAP_TARGET || "pedw-dev";
const watchedCasesDetails = await getDetails(
watchedCases,
@@ -190,7 +192,7 @@ export const getServerSideProps = wrapper.getServerSideProps(
store.dispatch(setAccountDetails(accountDetails));
return {
props: { showMap: showMapCheck }
props: { showMap: showMapCheck, mapTarget: mapTarget }
};
}
}
styles/sass/welshgov/_application.scss
+17
View File
@@ -3543,4 +3543,21 @@ ul.subFieldList {
font-weight: normal;
text-decoration: none;
white-space: nowrap;
}
.map-container {
width: 100%;
}
.map-container--expanded {
margin-bottom: 30px;
}
.map-expand-link {
background: none;
border: 0;
padding: 0;
cursor: pointer;
}