From b7aff61b000b938b2e3e79be08aa3b7a2cdfca5b Mon Sep 17 00:00:00 2001 From: Miu Razvan Date: Tue, 1 Sep 2020 15:05:11 +0300 Subject: [PATCH] RedirectView fix; SidebarBlock update; Map update --- .../manage/Blocks/DetailedLink/View.jsx | 40 ++-- .../DiscodataOpenlayersMapBlock/Edit.jsx | 41 ++++ .../DiscodataOpenlayersMapBlock/View.jsx | 179 +++++++++--------- .../manage/Blocks/SidebarBlock/View.jsx | 29 +-- src/components/theme/View/RedirectView.jsx | 2 +- src/helpers/api.jsx | 12 +- theme/site/globals/site.overrides | 6 + 7 files changed, 189 insertions(+), 120 deletions(-) diff --git a/src/components/manage/Blocks/DetailedLink/View.jsx b/src/components/manage/Blocks/DetailedLink/View.jsx index 46679f6..f1bca4f 100644 --- a/src/components/manage/Blocks/DetailedLink/View.jsx +++ b/src/components/manage/Blocks/DetailedLink/View.jsx @@ -2,6 +2,7 @@ import React from 'react'; import { injectIntl } from 'react-intl'; import { Link } from 'react-router-dom'; import { settings } from '~/config'; +import cx from 'classnames'; import './style.css'; const getPath = (url) => { @@ -27,36 +28,45 @@ const View = (props) => { } = props.data; return (
{(detailedLink && ( -
+ <> {!hideTitle ? ( -
+
{title || detailedLink.title || ''}
) : ( '' )} - {!hideDescription ? ( + {!hideDescription && (description || detailedLink.description) ? (

{description || detailedLink.description || ''}

) : ( '' )} - e.preventDefault} - to={getPath(detailedLink.path)} - > - {buttonTitle || detailedLink.title || 'Go'} - -
+
+ e.preventDefault} + to={getPath(detailedLink.path)} + > + {buttonTitle || detailedLink.title || 'Go'} + +
+ )) || (

Select a page from sidebar

)} diff --git a/src/components/manage/Blocks/DiscodataOpenlayersMapBlock/Edit.jsx b/src/components/manage/Blocks/DiscodataOpenlayersMapBlock/Edit.jsx index 4649348..65ab96a 100644 --- a/src/components/manage/Blocks/DiscodataOpenlayersMapBlock/Edit.jsx +++ b/src/components/manage/Blocks/DiscodataOpenlayersMapBlock/Edit.jsx @@ -23,6 +23,47 @@ const getSchema = (props) => { title: 'Has sidebar', defaultValue: false, }, + filterSource: { + type: 'array', + title: 'Filter source', + choices: [ + ['eprtr_filters', 'EPRTR filters'], + ['query_params', 'Query params'], + ], + }, + query: { + title: 'Query parameters', + type: 'schema', + fieldSetTitle: 'Query metadata', + fieldSetId: 'query-metadata', + fieldSetSchema: { + fieldsets: [ + { + id: 'default', + title: 'title', + fields: ['title', 'id', 'param'], + }, + ], + properties: { + title: { + type: 'string', + title: 'Query title', + }, + id: { + type: 'string', + title: 'Query id', + description: 'This will be used as query parameter key', + }, + param: { + type: 'string', + title: 'Query to use', + }, + }, + required: ['id', 'title', 'param'], + }, + editFieldset: false, + deleteFieldset: false, + }, }; }; diff --git a/src/components/manage/Blocks/DiscodataOpenlayersMapBlock/View.jsx b/src/components/manage/Blocks/DiscodataOpenlayersMapBlock/View.jsx index ad0820d..17177da 100644 --- a/src/components/manage/Blocks/DiscodataOpenlayersMapBlock/View.jsx +++ b/src/components/manage/Blocks/DiscodataOpenlayersMapBlock/View.jsx @@ -17,20 +17,10 @@ import { setQueryParam } from 'volto-datablocks/actions'; import { Grid, Header, Loader, Dimmer } from 'semantic-ui-react'; // SVGs import clearSVG from '@plone/volto/icons/clear.svg'; -// import pinSVG from '~/icons/pin.svg'; -// import bluePinSVG from '~/icons/blue_pin.svg'; // STYLES import 'ol/ol.css'; import './style.css'; -const getHtmlAttributes = (obj) => { - return Object.entries(obj) - .map(([key, value]) => { - return `${key}="${value}"`; - }) - .join(' '); -}; - const splitBy = (arr, delimiter) => { if (Array.isArray(arr)) { return ( @@ -43,16 +33,6 @@ const splitBy = (arr, delimiter) => { return ''; }; -// const encodedPinSVG = encodeURIComponent( -// `${pinSVG.content}`, -// ); - -// const encodedBluePinSVG = encodeURIComponent( -// `${ -// bluePinSVG.content -// }`, -// ); - let Map, View, Overlay, @@ -82,6 +62,7 @@ const initialExtent = [ 6199975.99999531, 10421410.9999871, ]; +let renderExtent = []; const OpenlayersMapView = (props) => { const stateRef = useRef({ map: { @@ -115,10 +96,23 @@ const OpenlayersMapView = (props) => { const draggable = !!props.data?.draggable?.value; const hasPopups = !!props.data?.hasPopups?.value; const hasSidebar = !!props.data?.hasSidebar?.value; + const filterSource = props.data?.filterSource?.value || 'query_params'; const zoomSwitch = 6; const currentMapZoom = state.map?.element ? state.map.element.getView().getZoom() : null; + let queryParams; + if (filterSource === 'query_params') { + try { + queryParams = JSON.parse(props.data?.query?.value)?.properties; + Object.entries(queryParams).forEach(([key, value]) => { + queryParams[key].sql = `(${value.param} = ':options')`; + queryParams[key].type = 'string'; + }); + } catch { + queryParams = {}; + } + } if (mapRendered && !firstFilteringUpdate) { updateFilters(); @@ -220,7 +214,6 @@ const OpenlayersMapView = (props) => { updateMapPosition: null, }); } else { - console.log('UPDATE FILTERS', state.map.sitesSourceQuery); state.map.sitesSourceLayer && state.map.sitesSourceLayer.getSource().refresh(); } @@ -231,11 +224,11 @@ const OpenlayersMapView = (props) => { function updateFilters() { const sitesSourceQuery = { ...state.map.sitesSourceQuery }; const locationTerm = props.discodata_query.search.locationTerm || null; - if (hasSidebar) { + if (hasSidebar && filterSource === 'eprtr_filters') { sitesSourceQuery.whereStatements = { ...sitesSourceQuery.whereStatements, siteTerm: { - sql: `(sitename LIKE ':options%')`, + sql: `(siteName LIKE ':options%')`, type: 'string', }, //? Industries @@ -279,19 +272,10 @@ const OpenlayersMapView = (props) => { //! Permit type //! Permit year }; - } else { + } else if (filterSource === 'query_params') { sitesSourceQuery.whereStatements = { ...sitesSourceQuery.whereStatements, - // Country - siteCountry: { - sql: `(country = ':options')`, - type: 'string', - }, - // Site inspire id - siteId: { - sql: `(id = ':options')`, - type: 'string', - }, + ...queryParams, }; } @@ -319,7 +303,7 @@ const OpenlayersMapView = (props) => { let updateMapPosition = null; if ( sitesSourceQuery.whereStatements.siteTerm?.sql || - sitesSourceQuery.whereStatements.siteId?.sql + sitesSourceQuery.whereStatements.siteName?.sql ) { updateMapPosition = 'bySiteTerm'; } else if (locationTerm?.text) { @@ -850,7 +834,7 @@ const OpenlayersMapView = (props) => { <>
{currentMapZoom && currentMapZoom > zoomSwitch ? ( -
{state.popup.properties.sitename}
+
{state.popup.properties.siteName}
) : (
{`${state.popup.properties.NUTS_NAME}, ${state.popup.properties.CNTR_CODE}, ${state.popup.properties.COUNTRY}`}
)} @@ -888,8 +872,8 @@ const OpenlayersMapView = (props) => { <>
- {state.popupDetails.properties.sitename - ? state.popupDetails.properties.sitename + {state.popupDetails.properties.siteName + ? state.popupDetails.properties.siteName : ''}
{ />
- +
{/* SITE CONTENTS */} - -
Site contents
-

- - {state.popupDetails.properties.n_fac || 0} Facilities - -

-

- - {state.popupDetails.properties.n_lcp || 0} Large comustion - plants - -

-

- - {state.popupDetails.properties.n_inst || 0} Installations - -

- - {/* SITE POLLUTANT EMISSIONS */} - -
Pollutant emissions
- {state.popupDetails.properties.pollutants ? ( -

{state.popupDetails.properties.pollutants}

- ) : ( -

There are no data regarding the pollutants

- )} - - {/* REGULATORY INFORMATION */} - -
Regulatory information
- {state.popupDetails.properties.rep_yr ? ( +
+
+
+ Site contents +
+
+

- Inspections in {state.popupDetails.properties.rep_yr}:{' '} - {state.popupDetails.properties.n_inspect || 0} + + {state.popupDetails.properties.nFacilities || 0}{' '} + Facilities +

- ) : ( - '' - )} - - +
+
+

+ + {state.popupDetails.properties.nLCP || 0} Large + comustion plants + +

+
+
+

+ + {state.popupDetails.properties.nInstallations || 0}{' '} + Installations + +

+
+
+ {/* SITE POLLUTANT EMISSIONS */} +
+
+
Pollutant emissions
+
+
+ {state.popupDetails.properties.pollutants ? ( +

{state.popupDetails.properties.pollutants}

+ ) : ( +

There are no data regarding the pollutants

+ )} +
+
+ {/* REGULATORY INFORMATION */} +
+
+
Regulatory information
+
+
+ {state.popupDetails.properties.Site_reporting_year ? ( +

+ Inspections in{' '} + {state.popupDetails.properties.Site_reporting_year}:{' '} + {state.popupDetails.properties.numInspections || 0} +

+ ) : ( + '' + )} +
+
+