build fix and updated myportal layout
This commit is contained in:
@@ -18,12 +18,25 @@ import {
|
||||
setSearchResults,
|
||||
setSearchDetails,
|
||||
} from "../../store/searchOutput/action";
|
||||
import { getSearchDetailsPaged } from "../utils";
|
||||
import { getSearchDetailsPaged, getFormCollectionByID } from "../utils";
|
||||
import {
|
||||
currentViewActionTypes,
|
||||
setCurrentReference,
|
||||
setCurrentPage,
|
||||
} from "../../store/currentView/action";
|
||||
import GoogleMapReact from "google-map-react";
|
||||
import { parseCookies, setCookie, destroyCookie } from "nookies";
|
||||
import {
|
||||
setWatchedCases,
|
||||
setWatchedCasesDetails,
|
||||
} from "../../store/watchedCases/action";
|
||||
import {
|
||||
createWatchedCases,
|
||||
getWatchedCasesProxy,
|
||||
getPortalModuleDetailsProxy,
|
||||
deleteWatchedCases,
|
||||
} from "../../actions";
|
||||
import OSPoint from "ospoint";
|
||||
|
||||
const DNSSearchResults = (props) => {
|
||||
const {
|
||||
@@ -35,6 +48,11 @@ const DNSSearchResults = (props) => {
|
||||
setSearchDetails,
|
||||
advancedSearch,
|
||||
setCurrentPage,
|
||||
dnsCoords,
|
||||
myportal,
|
||||
watchedCases,
|
||||
setWatchedCases,
|
||||
setWatchedCasesDetails,
|
||||
} = props;
|
||||
let { t } = useTranslation();
|
||||
|
||||
@@ -46,6 +64,82 @@ const DNSSearchResults = (props) => {
|
||||
const [searchLoaded, setSearchLoaded] = useState(false);
|
||||
const [showSpinnerState, setShowSpinnerState] = useState(false);
|
||||
|
||||
let dataArray = [];
|
||||
//push your Json Data in the array
|
||||
|
||||
dnsCoords.map((item) => {
|
||||
let point = new OSPoint(
|
||||
item.pinswg_anticipatedgridreferencenorthingtext,
|
||||
item.pinswg_anticipatedgridreferenceeastingtext
|
||||
);
|
||||
let siteCoords = point.toOSGB36();
|
||||
//console.log(siteCoords);
|
||||
//console.log(item);
|
||||
dataArray.push({
|
||||
appellant:
|
||||
item[
|
||||
"_pinswg_appellant_value@OData.Community.Display.V1.FormattedValue"
|
||||
],
|
||||
name: item.pinswg_projectname,
|
||||
lat: parseFloat(siteCoords.latitude),
|
||||
lng: parseFloat(siteCoords.longitude),
|
||||
title: item.pinswg_name,
|
||||
});
|
||||
});
|
||||
|
||||
//console.log(dataArray);
|
||||
|
||||
const ModelsMap = (map, maps) => {
|
||||
//instantiate array that will hold your Json Data
|
||||
//console.log("here");
|
||||
var prev_infowindow = false;
|
||||
//Loop through the dataArray to create a marker per data using the coordinates in the json
|
||||
console.log(dataArray.length);
|
||||
for (let i = 0; i < dataArray.length; i++) {
|
||||
const infowindow = new google.maps.InfoWindow({
|
||||
content:
|
||||
"<div>" +
|
||||
(_.isEmpty(dataArray[i].name)
|
||||
? ""
|
||||
: dataArray[i].name.indexOf(";") > 0
|
||||
? router.locale == "cy"
|
||||
? dataArray[i].name.split(";")[1]
|
||||
: dataArray[i].name.split(";")[0]
|
||||
: dataArray[i].name) +
|
||||
"</div>" +
|
||||
(dataArray[i].appellant != null
|
||||
? "<div>" + dataArray[i].appellant + "</div>"
|
||||
: "") +
|
||||
"<div>" +
|
||||
dataArray[i].title +
|
||||
"</div>",
|
||||
});
|
||||
let marker = new maps.Marker({
|
||||
position: { lat: dataArray[i].lat, lng: dataArray[i].lng },
|
||||
title: _.isEmpty(dataArray[i].name)
|
||||
? ""
|
||||
: dataArray[i].name.indexOf(";") > 0
|
||||
? router.locale == "cy"
|
||||
? dataArray[i].name.split(";")[1]
|
||||
: dataArray[i].name.split(";")[0]
|
||||
: dataArray[i].name,
|
||||
map,
|
||||
});
|
||||
marker.addListener("click", () => {
|
||||
if (prev_infowindow) {
|
||||
prev_infowindow.close();
|
||||
}
|
||||
|
||||
prev_infowindow = infowindow;
|
||||
infowindow.open({
|
||||
anchor: marker,
|
||||
map,
|
||||
shouldFocus: true,
|
||||
});
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
let spinnerState = () => {
|
||||
showSpinnerState == true
|
||||
? setShowSpinnerState(false)
|
||||
@@ -56,6 +150,83 @@ const DNSSearchResults = (props) => {
|
||||
const [fieldSortState, setfieldSortState] = useState("asc");
|
||||
const [selectedOption, setSelectedOption] = useState(10);
|
||||
|
||||
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(cookies.pinsUser).then((data) => {
|
||||
setWatchedCases(data),
|
||||
getDetails(data, "myWatchedCases").then((data) => {
|
||||
setWatchedCasesDetails(data);
|
||||
});
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
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 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 ResultsView = (resultsArr) => {
|
||||
return (
|
||||
<div className="govuk-grid-row govuk-!-margin-top-9">
|
||||
@@ -107,6 +278,9 @@ const DNSSearchResults = (props) => {
|
||||
{t("search:searchresults-status-label")}
|
||||
</button>
|
||||
</dd>
|
||||
{myportal == true && (
|
||||
<dd className="govuk-summary-list__key govuk-!-font-size-16 govuk-summary-list__action"></dd>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{showSpinnerState == true ? (
|
||||
@@ -143,8 +317,14 @@ const DNSSearchResults = (props) => {
|
||||
<Link
|
||||
href={
|
||||
router.locale == "cy"
|
||||
? "/manyliondns"
|
||||
: "/dnsdetails"
|
||||
? (myportal == true
|
||||
? "/fymhorth"
|
||||
: "") +
|
||||
"/manyliondns"
|
||||
: (myportal == true
|
||||
? "/myportal"
|
||||
: "") +
|
||||
"/dnsdetails"
|
||||
}
|
||||
>
|
||||
<a
|
||||
@@ -294,6 +474,53 @@ const DNSSearchResults = (props) => {
|
||||
"statuscode@OData.Community.Display.V1.FormattedValue"
|
||||
] || "N/A"}
|
||||
</dd>
|
||||
{myportal == true && (
|
||||
<dd className="govuk-summary-list__value govuk-!-font-size-14 govuk-summary-list__action">
|
||||
{isWatchedCase(item.incidentid)
|
||||
.length >
|
||||
0 ==
|
||||
true ? (
|
||||
<span
|
||||
className="govuk-summary-list__actionLink watched_link"
|
||||
onClick={() => {
|
||||
deleteItem(
|
||||
isWatchedCase(
|
||||
item.incidentid
|
||||
)[0]
|
||||
.pinswg_watchlistid,
|
||||
|
||||
"watchedCases"
|
||||
);
|
||||
alert(
|
||||
"You have stopped watching case " +
|
||||
item.title
|
||||
);
|
||||
}}
|
||||
title="Stop watching this case"
|
||||
>
|
||||
−
|
||||
</span>
|
||||
) : (
|
||||
<span
|
||||
className="govuk-summary-list__actionLink"
|
||||
onClick={() => {
|
||||
selectWatchedCase(
|
||||
cookies.pinsUser,
|
||||
item.incidentid,
|
||||
item.pinswg_appealcasetype
|
||||
);
|
||||
alert(
|
||||
"You are watching case " +
|
||||
item.title
|
||||
);
|
||||
}}
|
||||
title="Watch this case"
|
||||
>
|
||||
+
|
||||
</span>
|
||||
)}
|
||||
</dd>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
})
|
||||
@@ -391,23 +618,65 @@ const DNSSearchResults = (props) => {
|
||||
return (
|
||||
<>
|
||||
<div className="govuk-grid-row">
|
||||
<div className="govuk-grid-column-two-thirds">
|
||||
<h1 className="govuk-heading-l">
|
||||
{t("dnsApplications:page-title")}
|
||||
</h1>
|
||||
<p className="govuk-body">
|
||||
{t("dnsApplications:page-intro-paragraph-1")}
|
||||
</p>
|
||||
<ul className="govuk-list govuk-list--bullet">
|
||||
<li> {t("dnsApplications:page-intro-list-item-1")}</li>
|
||||
<div className="flex-container grid-row govuk-body case">
|
||||
<div className="govuk-grid-column-one-half">
|
||||
<h1 className="govuk-heading-l">
|
||||
{t("dnsApplications:page-title")}
|
||||
</h1>
|
||||
<p className="govuk-body">
|
||||
{t("dnsApplications:page-intro-paragraph-1")}
|
||||
</p>
|
||||
<ul className="govuk-list govuk-list--bullet">
|
||||
<li>
|
||||
{" "}
|
||||
{t("dnsApplications:page-intro-list-item-1")}
|
||||
</li>
|
||||
|
||||
<li> {t("dnsApplications:page-intro-list-item-2")}</li>
|
||||
<li>
|
||||
{" "}
|
||||
{t("dnsApplications:page-intro-list-item-2")}
|
||||
</li>
|
||||
|
||||
<li> {t("dnsApplications:page-intro-list-item-3")}</li>
|
||||
</ul>
|
||||
<li>
|
||||
{" "}
|
||||
{t("dnsApplications:page-intro-list-item-3")}
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
{/* {process.env.SHOWMAPS == "true" && ( */}
|
||||
<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>
|
||||
</div>
|
||||
{/* )} */}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{searchResultsObj["@odata.count"] > 5 && (
|
||||
<div id="recordCountSelect" className="govuk-grid-row">
|
||||
<div className="govuk-form-group">
|
||||
@@ -463,6 +732,12 @@ const mapDispatchToProps = (dispatch) => {
|
||||
setSearchDetails: (searchDetailsObj) => {
|
||||
dispatch(setSearchDetails(searchDetailsObj));
|
||||
},
|
||||
setWatchedCases: (watchedCases) => {
|
||||
dispatch(setWatchedCases(watchedCases));
|
||||
},
|
||||
setWatchedCasesDetails: (watchedCasesDetails) => {
|
||||
dispatch(setWatchedCasesDetails(watchedCasesDetails));
|
||||
},
|
||||
setCurrentPage: (currentPage) => {
|
||||
dispatch(setCurrentPage(currentPage));
|
||||
},
|
||||
|
||||
Reference in New Issue
Block a user