Skip to content

Commit 5edcb04

Browse files
citizen-drorcitizen-dror
committed
add filter by poilice sations (zones)!
1 parent de87a11 commit 5edcb04

7 files changed

Lines changed: 58 additions & 23 deletions

File tree

‎src/components/filter/CardFilterWhere.tsx‎

Lines changed: 16 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,10 @@
1-
import React from 'react';
1+
import React, { ChangeEvent } from 'react';
22
import { useTranslation } from 'react-i18next';
33
import { observer } from 'mobx-react';
44
import { Accordion, Card } from 'react-bootstrap';
55
import GroupCheckbox from './GroupCheckBox';
66
import { useStore } from '../../stores/storeConfig';
7+
import { environment } from '../../utils/env.utils';
78
import { MySelect } from '../common';
89
import CustomToggle from './CustomToggle';
910
import CitySelector from './CitySelector';
@@ -14,15 +15,20 @@ import '../../styles/accordion.css'
1415

1516
const CardFilterWhere = observer(() => {
1617
const { t } = useTranslation();
17-
const { filterStore } = useStore();
18+
const { filterStore , userStore} = useStore();
19+
const hasZonePermission = environment.isLocalMode || (userStore.isAuthenticated && userStore.isHotSpotGrants);
1820
const {
19-
isValidWhere, roadTypes, updateRoadType,
21+
isValidWhere,
22+
cities,
23+
roadTypes, updateRoadType,
24+
zoneName, setZonesName,
2025
locationAccuracy, updateLocationAccuracy,
2126
isMultipleCities,
2227
cityPopSizeRange, setCityPopSizeRange,
2328
setFormCardKey,
2429
} = filterStore;
25-
30+
const cityName = cities.arrValues[0];
31+
const showPoliceStation = hasZonePermission && cities.arrValues.length === 1 && (cityName ==='5000');
2632
return (
2733
<Card>
2834
<Card.Header>
@@ -39,6 +45,12 @@ const CardFilterWhere = observer(() => {
3945
<div>
4046
<CitySelector isMultiple={isMultipleCities} />
4147
<StreetSelector />
48+
{showPoliceStation&& <MySelect
49+
label={'PoliceStation'}
50+
value={String(zoneName.queryValue)}
51+
data={zoneName.arrTypes}
52+
onChange={(e: ChangeEvent<HTMLSelectElement>) => { setZonesName(e.target.value); }}
53+
/>}
4254
<RoadNameSelector />
4355
<RoadSegmentSelector />
4456
<GroupCheckbox

‎src/lng/en/translation.json‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -72,6 +72,12 @@
7272
"20K-50K": "20K-50K",
7373
"10K-20K": "10K-20K",
7474
"0-10K": "0-10K",
75+
"PoliceStation": "Police Station",
76+
"תחנת השכונות": "תחנת השכונות",
77+
"תחנת יפו": "תחנת יפו",
78+
"תחנת לב תל אביב": "תחנת לב תל אביב",
79+
"תחנת שר\"ת": "תחנת שר\"ת",
80+
"תחנת תל אביב צפון": "תחנת תל אביב צפון",
7581
"Street": "Street",
7682
"ChooseCity": "Choose a City...",
7783
"several-cities": "Several Cities",

‎src/lng/he/translation.json‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -74,6 +74,12 @@
7474
"0-10K": "0-10K",
7575
"ChooseCity": "בחרו יישוב...",
7676
"several-cities": "מספר ישובים",
77+
"PoliceStation": "תחנת משטרה",
78+
"תחנת השכונות": "תחנת השכונות",
79+
"תחנת יפו": "תחנת יפו",
80+
"תחנת לב תל אביב": "תחנת לב תל אביב",
81+
"תחנת שר\"ת": "תחנת שר\"ת",
82+
"תחנת תל אביב צפון": "תחנת תל אביב צפון",
7783
"Street": "רחוב",
7884
"Road": "כביש",
7985
"several-roads": "מספר כבישים",

‎src/services/AccidentService.ts‎

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -8,14 +8,14 @@ class AccidentService {
88

99
public fetchInvolvedList = async (
1010
filter: string,
11-
geo?: GeoFilter
11+
geo: GeoFilter|null
1212
): Promise<any | undefined> => {
1313
// Default options are marked with *
1414
let url = `${API_ANYWAY_URL}/involved`;
1515
url += filter;
16-
// console.log(url);
16+
const method = (geo == null)? 'GET' : 'POST';
1717
const response = await fetch(url, {
18-
method: 'post',
18+
method: method,
1919
mode: 'cors', // no-cors, *cors, same-origin
2020
cache: 'no-cache', // *default, no-cache, reload, force-cache, only-if-cached
2121
credentials: 'same-origin', // include, *same-origin, omit
@@ -32,20 +32,22 @@ class AccidentService {
3232
return await response.json(); // parses JSON response into native JavaScript objects
3333
};
3434

35-
public fetchGetGroupBy = async (filter: string): Promise<Array<any> | undefined> => {
35+
public fetchGroupBy = async (filter: string, geo: GeoFilter|null): Promise<Array<any> | undefined> => {
3636
// Default options are marked with *
3737
let url = `${API_ANYWAY_URL}/involved/groupby`;
3838
//let url = `${this.apiUrl}/api/v1/accident/groupby/`;
3939
url += filter;
40+
const method = (geo == null)? 'GET' : 'POST';
4041
// console.log(url);
4142
const response = await fetch(url, {
42-
method: 'GET',
43+
method: method,
4344
mode: 'cors', // no-cors, *cors, same-origin
4445
cache: 'no-cache', // *default, no-cache, reload, force-cache, only-if-cached
4546
credentials: 'same-origin', // include, *same-origin, omit
4647
headers: {
4748
'Content-Type': 'application/json',
4849
},
50+
body: geo ? JSON.stringify(geo) : null,
4951
redirect: 'follow', // manual, *follow, error
5052
referrerPolicy: 'no-referrer', // no-referrer, *client
5153
});

‎src/stores/filter/FilterStore.ts‎

Lines changed: 20 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import {
55
} from 'mobx';
66
import { IColumnFilter } from './ColumnFilterCheckBoxList';
77
import { ColumnFilterArray } from './ColumnFilterArray';
8-
import { ColumnFilterCombo, initStartYear, initEndYear, initCityPopSize } from './columnFilterCombo';
8+
import { ColumnFilterCombo, initStartYear, initEndYear, initCityPopSize, initPoilceStations } from './columnFilterCombo';
99
import * as FC from './ColumnFilterCheckBoxList';
1010
import { IFilterChecker } from './FilterChecker';
1111
import GroupBy, { initGroupMap } from './GroupBy';
@@ -68,9 +68,9 @@ class FilterStore implements IFilterStore {
6868
this.roads = new ColumnFilterArray('Road', 'rd', false);
6969
this.roadSegment = new ColumnFilterArray('RoadSegment', 'rds', false);
7070
this.cities = new ColumnFilterArray('City', 'city', false);
71-
this.zonesNames = new ColumnFilterArray('PoliceStation', 'pStatios', true);
7271
this.streets = new ColumnFilterArray('Street', 'st', false);
7372
this.cityPopSizeRange = initCityPopSize();
73+
this.zoneName = initPoilceStations();
7474
// who
7575
this.genderTypes = FC.initGenderTypes();
7676
this.ageTypes = FC.initAgeTypes();
@@ -205,10 +205,12 @@ class FilterStore implements IFilterStore {
205205
}
206206

207207
@observable
208-
zonesNames: ColumnFilterArray;
209-
setZonesNames = (values: string[]) => {
210-
this.zonesNames.setFilter(values);
208+
zoneName: ColumnFilterCombo;
209+
setZonesName = async (value: string) => {
210+
this.zoneName.setFilter(value);
211+
this.geoFilter = await this.getGeoFilter();
211212
}
213+
212214

213215
@action
214216
updateModerateDisabledState = () => {
@@ -601,7 +603,7 @@ class FilterStore implements IFilterStore {
601603
submitGroupByYears = () => {
602604
const filtermatch = this.getfilterBySeverityAndCity();
603605
const filter = createFilterQureyByGroup(filtermatch, 'year');
604-
AccidentService.fetchGetGroupBy(filter)
606+
AccidentService.fetchGroupBy(filter, this.geoFilter)
605607
.then((data: ItemCount[] | undefined) => {
606608
if (data !== undefined) {
607609
const dataPadded = padDataYearsWith0(data, this.startYear.queryValue, this.endYear.queryValue);
@@ -623,7 +625,7 @@ class FilterStore implements IFilterStore {
623625
const range = JSON.parse(this.cityPopSizeRange.queryValue.toString());
624626
const filtermatch = this.getFilterQueryString(null);
625627
const filter = createFilterQureyByGroup(filtermatch, 'year', range.min, range.max);
626-
AccidentService.fetchGetGroupBy(filter)
628+
AccidentService.fetchGroupBy(filter, this.geoFilter)
627629
.then((data: ItemCount2[] | undefined) => {
628630
if (data !== undefined) {
629631
const dataPadded = padDataYearsWith0(data, this.startYear.queryValue, this.endYear.queryValue);
@@ -643,7 +645,7 @@ class FilterStore implements IFilterStore {
643645
const filtermatch = this.getFilterQueryString(null);
644646
const filter = createFilterQureyByGroup(filtermatch, aGroupBy.value, range.min, range.max, '', limit, this.GroupBySort);
645647
// logger.log(filter);
646-
AccidentService.fetchGetGroupBy(filter)
648+
AccidentService.fetchGroupBy(filter, this.geoFilter)
647649
.then((data: any | undefined) => {
648650
if(aGroupBy.transformFetchResult) {
649651
data = aGroupBy.transformFetchResult(data);
@@ -668,7 +670,7 @@ class FilterStore implements IFilterStore {
668670
const filtermatch = this.getFilterQueryString(null);
669671
const filter = createFilterQureyByGroup(filtermatch, aGroupBy.value, range.min, range.max, groupName2, aGroupBy.limit);
670672
// logger.log(filter)
671-
AccidentService.fetchGetGroupBy(filter)
673+
AccidentService.fetchGroupBy(filter, this.geoFilter)
672674
.then((data: ItemCount2[] | undefined) => {
673675
if (data !== undefined && data.length > 0) {
674676
try {
@@ -759,7 +761,7 @@ class FilterStore implements IFilterStore {
759761
this.setBrowserQueryString();
760762
// logger.log(filter);
761763
this.rootStore.mapStore.updateIsSetBounds(this.cities.arrValues, this.roadSegment.arrValues);
762-
AccidentService.fetchInvolvedList(filter)
764+
AccidentService.fetchInvolvedList(filter, null)
763765
.then((res: any | undefined) => {
764766
if (res && res.data !== null && res.data !== undefined) {
765767
// this.updateAllInjuries(res.data);
@@ -831,9 +833,16 @@ class FilterStore implements IFilterStore {
831833
query += createFilterQureyByCityPop(range.min, range.max)
832834
return query;
833835
}
836+
837+
@observable
838+
geoFilter: GeoFilter | null = null;
834839

835840
getGeoFilter = async () => {
836-
let geoPolygon = await loadAreaPolygon("תחנת תל אביב צפון");
841+
const policeStationName = this.zoneName.queryValue as string;
842+
if (!policeStationName || policeStationName.trim() === '') {
843+
return null;
844+
}
845+
let geoPolygon = await loadAreaPolygon(policeStationName);
837846
let geoFilter: GeoFilter = {geo: geoPolygon };
838847
return geoFilter;
839848
}

‎src/stores/filter/columnFilterCombo/data.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@ export const CITY_POP_SIZE_OPTIONS = [
1313
];
1414

1515
export const POLICE_STATIONS = [
16+
'',
1617
'תחנת השכונות',
1718
'תחנת יפו',
1819
'תחנת לב תל אביב',

‎src/stores/filter/filterThunks.ts‎

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,16 +4,15 @@ import { syncInjuriesAndMobx } from '../casualty/casualtyThunks';
44
import { loadAreaPolygon } from "../../utils"
55
import { setIsLoading } from './filterSlice';
66
import { store as mobxStore } from '../storeConfig';
7-
import { GeoFilter } from "../../types";
87

98
export const fetchFilterData = createAsyncThunk(
109
'filter/fetchFilterData',
1110
async (_, { dispatch }) => {
1211
dispatch(setIsLoading(true));
1312

1413
const filter = mobxStore.filterStore.getFilterQueryString(null); // still using MobX
15-
//const geoFilter = await mobxStore.filterStore.getGeoFilter();
16-
const geoFilter = undefined;
14+
const geoFilter = mobxStore.filterStore.geoFilter;
15+
//const geoFilter = undefined;
1716
try {
1817
const res = await AccidentService.fetchInvolvedList(filter, geoFilter);
1918
if (res?.data) {

0 commit comments

Comments
 (0)