@bytebrand/fe-ui-core 4.1.22 → 4.1.24
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +1 -1
- package/source/components/AccordionWidget/AccordionWidget.tsx +1 -1
- package/source/components/Alternative/DealerInfo.tsx +17 -12
- package/source/components/OfferPanel/AboAccordion/AboAccordion.tsx +1 -1
- package/source/components/OfferPanel/OfferCheckboxGroup/CheckboxContainer.tsx +1 -1
- package/source/components/RateSearchWidget/RateSearchWidget.tsx +4 -4
- package/source/components/SearchFilters/common/FilterBlock/FilterBlock.styled.tsx +1 -1
- package/source/components/SearchFilters/common/FilterBlock/FilterBlock.tsx +24 -24
- package/source/components/SearchFilters/common/RangeControlled/RangeControlled.tsx +4 -5
- package/source/components/SearchFilters/filters/Consumption.tsx +2 -2
- package/source/components/SearchFilters/filters/Cost.tsx +44 -57
- package/source/components/SearchFilters/filters/EmissionSticker.tsx +14 -14
- package/source/components/SearchFilters/filters/FirstRegistration.tsx +2 -2
- package/source/components/SearchFilters/filters/ImagesCount.tsx +3 -3
- package/source/components/SearchFilters/filters/InteriorColor.tsx +2 -2
- package/source/components/SearchFilters/filters/InteriorMaterial.tsx +2 -2
- package/source/components/SearchFilters/filters/MakeModel.tsx +1 -2
- package/source/components/SearchFilters/filters/Mileage.tsx +3 -4
- package/source/components/SearchFilters/filters/Owners.tsx +0 -1
- package/source/components/SearchFilters/filters/Power.tsx +3 -6
- package/source/components/SearchFilters/filters/PriceDifference.tsx +4 -5
- package/source/components/SearchPage/ChipFilter/ChipFilter.tsx +1 -1
- package/source/components/SearchPage/Filters/MakeModel/MakeModel.tsx +3 -3
- package/source/components/SearchPageMobile/FiltersDetailed/BodyType.tsx +1 -1
- package/source/components/SearchPageMobile/FiltersDetailed/Consumption.tsx +1 -1
- package/source/components/SearchPageMobile/FiltersDetailed/Doors.tsx +4 -4
- package/source/components/SearchPageMobile/FiltersDetailed/FirstRegistration.tsx +1 -1
- package/source/components/SearchPageMobile/FiltersDetailed/Fuel.tsx +1 -1
- package/source/components/SearchPageMobile/FiltersDetailed/MakeModel.tsx +1 -2
- package/source/components/SearchPageMobile/FiltersDetailed/Mileage.tsx +2 -3
- package/source/components/SearchPageMobile/FiltersDetailed/Power.tsx +4 -4
- package/source/components/SearchPageMobile/FiltersDetailed/Price.tsx +3 -4
- package/source/components/SearchPageMobile/FiltersDetailed/Rate.tsx +2 -2
- package/source/components/SearchPageMobile/FiltersDetailed/Seats.tsx +2 -2
- package/source/components/SearchWidget/ColorWidget/BodyColorWidget.tsx +1 -1
- package/source/components/SearchWidget/EnvironmentWidget/EnvironmentWidget.tsx +3 -3
- package/source/components/SearchWidget/OfferDetalisWidget/OfferDetailsWidgetMobile.tsx +1 -1
- package/source/components/SearchWidget/StateWidget/StateWidget.tsx +10 -7
- package/source/components/SearchWidgetsMobile/BasicDataWidgetMobile/BasicDataWidgetMobile.tsx +7 -7
- package/source/components/SearchWidgetsMobile/EngineTransDriveWidget/EngineTransDriveWidget.tsx +4 -5
- package/source/components/SearchWidgetsMobile/EquipmentsWidget/EquipmentsWidget.styled.tsx +2 -2
- package/source/components/SearchWidgetsMobile/EquipmentsWidget/EquipmentsWidget.tsx +8 -9
- package/source/components/SearchWidgetsMobile/EquipmentsWidget/EquipmentsWidgetCategory.tsx +17 -17
- package/source/components/SearchWidgetsMobile/HighlightsWidgetMobile/HighlightsWidgetMobile.tsx +2 -2
- package/source/components/SearchWidgetsMobile/InteriorWidget/InteriorWidget.tsx +1 -1
- package/source/components/SearchWidgetsMobile/SafetyWidget/SafetyWidget.tsx +5 -5
- package/source/components/SearchWidgetsMobile/StateWidget/StateWidget.tsx +14 -11
- package/source/components/VehicleSmallCard/VehicleSmallCard.tsx +1 -1
- package/source/components/_common/Checkbox/FormCheckbox.tsx +1 -1
- package/source/components/_common/CheckboxMaterial/CheckboxMaterial.tsx +30 -27
- package/source/components/_common/Chip/Chip.tsx +1 -1
- package/source/components/_common/DropDown/DropDown.tsx +1 -2
- package/source/components/_common/ExpansionPanel/ExpansionPanel.styled.tsx +2 -9
- package/source/components/_common/IconSVG/IconSVGConfig.tsx +3 -1
- package/source/components/_common/IconSVG/SVG/settings/RemoveEye.tsx +1 -1
- package/source/components/_common/MaterialAccordion/MaterialAccordion.tsx +56 -56
- package/source/components/_common/MaterialAutocomplete/MaterialAutocomplete.styled.tsx +31 -31
- package/source/components/_common/MaterialAutocomplete/MaterialAutocomplete.tsx +26 -27
- package/source/components/_common/MaterialDatePicker/MaterialDatePicker.styled.tsx +7 -7
- package/source/components/_common/MaterialField/MaterialField.tsx +3 -3
- package/source/components/_common/MaterialSelect/MaterialSelect.styled.tsx +3 -3
- package/source/components/_common/MaterialSelect/MaterialSelect.tsx +34 -32
- package/source/components/_common/OfferRequestButtonWrapper/OfferRequestButtonWrapper.styled.tsx +3 -7
- package/source/components/_common/OfferRequestButtonWrapper/OfferRequestButtonWrapper.tsx +1 -2
- package/source/components/_common/Range/Range.tsx +1 -1
- package/source/components/containers/SearchPage/FiltersContainer/FiltersContainer.tsx +7 -2
- package/source/framework/constants/app.ts +1 -1
- package/source/framework/constants/highlights.ts +1 -1
- package/source/framework/types/types.ts +1 -1
- package/source/framework/utils/CommonUtils.ts +27 -15
- package/source/framework/vehiclesProps/decoratedLightProps.tsx +0 -2
package/package.json
CHANGED
|
@@ -36,7 +36,7 @@ class AccordionWidget extends React.Component<IAccardionSectionProps, IAccardion
|
|
|
36
36
|
|
|
37
37
|
handleChange =
|
|
38
38
|
(panel: string) => (event: React.SyntheticEvent, isExpanded: boolean) => {
|
|
39
|
-
this.setState({ expanded: isExpanded ? panel : false })
|
|
39
|
+
this.setState({ expanded: isExpanded ? panel : false });
|
|
40
40
|
};
|
|
41
41
|
|
|
42
42
|
renderPropsBlock = (data: ICarPropElement[]): React.ReactNode => {
|
|
@@ -23,12 +23,12 @@ const DealerInfo = ({ infoSections, t, dealerPrice, link, linkName, currentSales
|
|
|
23
23
|
setPriceUpdating(false);
|
|
24
24
|
setNewPrice(Math.max(currentSalesPrice, newPrice));
|
|
25
25
|
onCurrentSalesPriceChange(Math.max(currentSalesPrice, newPrice));
|
|
26
|
-
}
|
|
26
|
+
};
|
|
27
27
|
|
|
28
28
|
const onPriceChange = (e: any) => {
|
|
29
29
|
const newPrice = +e.target.value;
|
|
30
30
|
setNewPrice(Math.max(0, newPrice));
|
|
31
|
-
}
|
|
31
|
+
};
|
|
32
32
|
const ourMargin = newPrice - dealerPrice;
|
|
33
33
|
|
|
34
34
|
return (
|
|
@@ -101,11 +101,11 @@ const DealerInfo = ({ infoSections, t, dealerPrice, link, linkName, currentSales
|
|
|
101
101
|
</span>
|
|
102
102
|
{isPriceUpdating
|
|
103
103
|
? <div className={styles.ourPriceBlock}>
|
|
104
|
-
<input
|
|
104
|
+
<input
|
|
105
105
|
className={styles.ourPriceInput}
|
|
106
|
-
type=
|
|
106
|
+
type='number'
|
|
107
107
|
value={newPrice}
|
|
108
|
-
onChange={
|
|
108
|
+
onChange={e => onPriceChange(e)}
|
|
109
109
|
ref={inputRef}
|
|
110
110
|
onBlur={handleSubmit}
|
|
111
111
|
/>
|
|
@@ -113,12 +113,17 @@ const DealerInfo = ({ infoSections, t, dealerPrice, link, linkName, currentSales
|
|
|
113
113
|
<IconSVG className={styles.editIcon} customDimensions name='editIcon'></IconSVG>
|
|
114
114
|
</span>
|
|
115
115
|
</div>
|
|
116
|
-
: <span onClick={
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
116
|
+
: <span onClick={
|
|
117
|
+
() => {
|
|
118
|
+
setPriceUpdating(true);
|
|
119
|
+
setTimeout(
|
|
120
|
+
() => {
|
|
121
|
+
inputRef.current.focus();
|
|
122
|
+
},
|
|
123
|
+
200
|
|
124
|
+
);
|
|
125
|
+
}}
|
|
126
|
+
>
|
|
122
127
|
<VehicleFormattedPrice
|
|
123
128
|
className={classnames(styles.price, styles.ourPrice)}
|
|
124
129
|
numbersAfterDot={0}
|
|
@@ -131,7 +136,7 @@ const DealerInfo = ({ infoSections, t, dealerPrice, link, linkName, currentSales
|
|
|
131
136
|
monthlyClassName={styles.monthly}
|
|
132
137
|
/>
|
|
133
138
|
</span>}
|
|
134
|
-
</span>
|
|
139
|
+
</span>
|
|
135
140
|
</div>
|
|
136
141
|
</div>
|
|
137
142
|
);
|
|
@@ -120,7 +120,7 @@ class CheckboxContainer extends React.Component<ICheckboxProps, {}> {
|
|
|
120
120
|
labelPlacement,
|
|
121
121
|
disabled,
|
|
122
122
|
onChange: this.onChange
|
|
123
|
-
}
|
|
123
|
+
};
|
|
124
124
|
return (
|
|
125
125
|
<div className={containerClasses} tabIndex={1} onFocus={this.props.onFocus} onBlur={this.props.onBlur} onKeyPress={this.onKeyPress}>
|
|
126
126
|
<label className={labelClasses}>
|
|
@@ -44,10 +44,11 @@ class RateSearchWidget extends React.Component<IRateSearchWidgetProps, IRateSear
|
|
|
44
44
|
const { firstInstallment, monthlyInstallmentFrom, monthlyInstallmentTo, paybackPeriod } = props;
|
|
45
45
|
|
|
46
46
|
this.state = {
|
|
47
|
-
monthlyInstallmentFrom: !!monthlyInstallmentFrom ? monthlyInstallmentFrom : 'any',
|
|
48
|
-
monthlyInstallmentTo: !!monthlyInstallmentTo ? monthlyInstallmentTo : 'any',
|
|
49
47
|
firstInstallment,
|
|
50
|
-
paybackPeriod
|
|
48
|
+
paybackPeriod,
|
|
49
|
+
monthlyInstallmentFrom: !!monthlyInstallmentFrom ? monthlyInstallmentFrom : 'any',
|
|
50
|
+
monthlyInstallmentTo: !!monthlyInstallmentTo ? monthlyInstallmentTo : 'any'
|
|
51
|
+
|
|
51
52
|
};
|
|
52
53
|
}
|
|
53
54
|
|
|
@@ -59,7 +60,6 @@ class RateSearchWidget extends React.Component<IRateSearchWidgetProps, IRateSear
|
|
|
59
60
|
return t(`${i18nPrefix}${option}`);
|
|
60
61
|
};
|
|
61
62
|
|
|
62
|
-
|
|
63
63
|
getValue = (value: any, units: string) => {
|
|
64
64
|
if (value === null || value === undefined) return null; // tslint:disable-line
|
|
65
65
|
|
|
@@ -23,31 +23,31 @@ const FilterBlock: React.FC<IFilterBlockProps> = ({
|
|
|
23
23
|
children,
|
|
24
24
|
isAdminPanel
|
|
25
25
|
}: IFilterBlockProps) => {
|
|
26
|
-
|
|
27
|
-
|
|
26
|
+
const contentExpandClass = classNames(styles.contentExpand, { [styles.contentExpandSuper]: isAdminPanel });
|
|
27
|
+
const filterBlockClassName = classNames(styles.filterBlock, styles[className]);
|
|
28
28
|
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
29
|
+
return (
|
|
30
|
+
<div className={filterBlockClassName}>
|
|
31
|
+
<ThemeProvider theme={Theme}>
|
|
32
|
+
<Accordion defaultExpanded={expand}>
|
|
33
|
+
<AccordionSummary
|
|
34
|
+
expandIcon={<IconSVG name={'arrowSelect'} className={styles.addPlusIcon} customDimensions />}
|
|
35
|
+
aria-controls={title}
|
|
36
|
+
id={title}
|
|
37
|
+
sx={isAdminPanel && {
|
|
38
|
+
backgroundColor: 'rgba(0,92,203,0.15)'
|
|
39
|
+
}}
|
|
40
|
+
>
|
|
41
|
+
<h4>{title}</h4>
|
|
42
|
+
</AccordionSummary>
|
|
43
|
+
<AccordionDetails>
|
|
44
|
+
<div className={contentExpandClass}>
|
|
45
|
+
{children}
|
|
46
|
+
</div>
|
|
47
|
+
</AccordionDetails>
|
|
48
|
+
</Accordion>
|
|
49
|
+
</ThemeProvider>
|
|
50
|
+
</div>
|
|
51
51
|
);
|
|
52
52
|
};
|
|
53
53
|
|
|
@@ -2,10 +2,9 @@ import React, { memo } from 'react';
|
|
|
2
2
|
|
|
3
3
|
import Slider from '../../../_common/Slider/Slider';
|
|
4
4
|
import _get from 'lodash/get';
|
|
5
|
-
import { sliceLessThan, sliceMoreThan } from '../../../../framework/utils/CommonUtils';
|
|
5
|
+
import { sliceLessThan, sliceMoreThan, numberWithDot } from '../../../../framework/utils/CommonUtils';
|
|
6
6
|
import { getSearchYears } from '../../../../framework/utils/DateUtils';
|
|
7
7
|
import MaterialAutocomplete from '../../../_common/MaterialAutocomplete/MaterialAutocomplete';
|
|
8
|
-
import { numberWithDot } from '../../../../framework/utils/CommonUtils';
|
|
9
8
|
import {
|
|
10
9
|
RANGE_FILTERS_DEFAULT_CONTROLS,
|
|
11
10
|
PRICE,
|
|
@@ -141,9 +140,9 @@ const RangeControlled = ({
|
|
|
141
140
|
</div>
|
|
142
141
|
</div>
|
|
143
142
|
);
|
|
144
|
-
}
|
|
143
|
+
};
|
|
145
144
|
|
|
146
145
|
export default memo(RangeControlled, (prevProps: any, nextProps: any) => {
|
|
147
146
|
return prevProps.controls.from === nextProps.controls.from &&
|
|
148
|
-
prevProps.controls.to === nextProps.controls.to
|
|
149
|
-
});
|
|
147
|
+
prevProps.controls.to === nextProps.controls.to;
|
|
148
|
+
});
|
|
@@ -45,8 +45,8 @@ const Consumption = ({ values, options, onChange, t }: IConsumptionProps) => {
|
|
|
45
45
|
</div>
|
|
46
46
|
</div>
|
|
47
47
|
);
|
|
48
|
-
}
|
|
48
|
+
};
|
|
49
49
|
|
|
50
50
|
export default memo(Consumption, (prevProps, nextProps) => {
|
|
51
|
-
return prevProps.values === nextProps.values
|
|
51
|
+
return prevProps.values === nextProps.values;
|
|
52
52
|
});
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import
|
|
1
|
+
import React, { useEffect, useState, SyntheticEvent } from 'react';
|
|
2
2
|
import classnames from 'classnames';
|
|
3
3
|
|
|
4
4
|
import RangeControlled from '../common/RangeControlled/RangeControlled';
|
|
@@ -6,7 +6,7 @@ import Rate from './Rate';
|
|
|
6
6
|
import { RadioGroup } from '@mui/material';
|
|
7
7
|
import CheckboxMaterial from '../../_common/CheckboxMaterial/CheckboxMaterial';
|
|
8
8
|
|
|
9
|
-
import { COST_TYPE_OPTIONS
|
|
9
|
+
import { COST_TYPE_OPTIONS } from '../../../framework/constants/Search';
|
|
10
10
|
|
|
11
11
|
import styles from './Cost.styl';
|
|
12
12
|
|
|
@@ -18,48 +18,42 @@ interface ICostProps {
|
|
|
18
18
|
onChangeControls: (name: string, value: any) => void;
|
|
19
19
|
}
|
|
20
20
|
|
|
21
|
-
|
|
22
|
-
costType
|
|
23
|
-
isRateWidgetOpened
|
|
24
|
-
}
|
|
21
|
+
const Cost = ({ t, onChange, onChangeControls, RATE, PRICE }: ICostProps) => {
|
|
22
|
+
const [costType, setCostType] = useState(null);
|
|
23
|
+
const [isRateWidgetOpened, setRateWidgetOpened] = useState(false);
|
|
25
24
|
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
25
|
+
useEffect(
|
|
26
|
+
() => {
|
|
27
|
+
// if rate is not assigned and price is set - choose initial 'price' radio
|
|
28
|
+
if (!costType && (PRICE.controls.to || PRICE.controls.from)) {
|
|
29
|
+
setCostType(
|
|
30
|
+
(!!PRICE.controls.from || !!PRICE.controls.to)
|
|
31
|
+
&& RATE.controls.monthlyInstallmentFrom === 'any'
|
|
32
|
+
&& RATE.controls.monthlyInstallmentTo === 'any'
|
|
33
|
+
? COST_TYPE_OPTIONS[1]
|
|
34
|
+
: COST_TYPE_OPTIONS[0]);
|
|
35
|
+
}
|
|
36
|
+
},
|
|
37
|
+
[PRICE.controls.to, PRICE.controls.from]
|
|
38
|
+
);
|
|
34
39
|
|
|
35
|
-
onTypeChange = (_event:
|
|
36
|
-
this.setState({ costType: value });
|
|
37
|
-
};
|
|
40
|
+
const onTypeChange = (_event: SyntheticEvent, value: string) => { setCostType(value); };
|
|
38
41
|
|
|
39
|
-
onRateWidgetOpen = () => {
|
|
40
|
-
this.setState({ isRateWidgetOpened: true });
|
|
41
|
-
}
|
|
42
|
+
const onRateWidgetOpen = () => { setRateWidgetOpened(true); };
|
|
42
43
|
|
|
43
|
-
onRateWidgetClose = () => {
|
|
44
|
-
this.setState({ isRateWidgetOpened: false });
|
|
45
|
-
}
|
|
46
|
-
|
|
47
|
-
onRateChange = (value: any) => {
|
|
48
|
-
const { onChange } = this.props;
|
|
44
|
+
const onRateWidgetClose = () => { setRateWidgetOpened(false); };
|
|
49
45
|
|
|
46
|
+
const onRateChange = (value: any) => {
|
|
50
47
|
onChange('RATE', value);
|
|
51
|
-
|
|
48
|
+
onRateWidgetClose();
|
|
52
49
|
};
|
|
53
50
|
|
|
54
|
-
renderRadioGroup = () => {
|
|
55
|
-
const { t } = this.props;
|
|
56
|
-
const { costType } = this.state;
|
|
57
|
-
|
|
51
|
+
const renderRadioGroup = () => {
|
|
58
52
|
const radioGroupProps = {
|
|
59
53
|
value: costType,
|
|
60
54
|
name: 'COST_TYPE',
|
|
61
55
|
className: styles.radioGroup,
|
|
62
|
-
onChange:
|
|
56
|
+
onChange: onTypeChange
|
|
63
57
|
};
|
|
64
58
|
|
|
65
59
|
return (
|
|
@@ -71,23 +65,21 @@ class Cost extends React.Component<ICostProps, ICostState> {
|
|
|
71
65
|
);
|
|
72
66
|
};
|
|
73
67
|
|
|
74
|
-
renderRate = () => {
|
|
75
|
-
const { t, RATE } = this.props;
|
|
68
|
+
const renderRate = () => {
|
|
76
69
|
const rateProps = {
|
|
77
70
|
t,
|
|
71
|
+
isRateWidgetOpened,
|
|
72
|
+
onRateWidgetOpen,
|
|
73
|
+
onRateWidgetClose,
|
|
74
|
+
onRateChange,
|
|
78
75
|
values: RATE.values,
|
|
79
|
-
controls: RATE.controls
|
|
80
|
-
isRateWidgetOpened: this.state.isRateWidgetOpened,
|
|
81
|
-
onRateWidgetOpen: this.onRateWidgetOpen,
|
|
82
|
-
onRateWidgetClose: this.onRateWidgetClose,
|
|
83
|
-
onRateChange: this.onRateChange
|
|
76
|
+
controls: RATE.controls
|
|
84
77
|
};
|
|
85
78
|
|
|
86
79
|
return <Rate {...rateProps} />;
|
|
87
80
|
};
|
|
88
81
|
|
|
89
|
-
renderPrice = () => {
|
|
90
|
-
const { t, PRICE, onChange, onChangeControls } = this.props;
|
|
82
|
+
const renderPrice = () => {
|
|
91
83
|
|
|
92
84
|
const priceProps = {
|
|
93
85
|
t,
|
|
@@ -100,26 +92,21 @@ class Cost extends React.Component<ICostProps, ICostState> {
|
|
|
100
92
|
controls: PRICE.controls,
|
|
101
93
|
isNumberWithDot: true
|
|
102
94
|
};
|
|
103
|
-
|
|
104
95
|
return <RangeControlled {...priceProps} />;
|
|
105
96
|
};
|
|
106
97
|
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
const { costType } = this.state;
|
|
110
|
-
const containerClassName = classnames(styles.cost, { [styles.overlay]: this.state.isRateWidgetOpened });
|
|
111
|
-
const title = costType === 'price' ? t('filters.priceTitle', { currency: '€' }) : t('filters.rateTitle');
|
|
98
|
+
const containerClassName = classnames(styles.cost, { [styles.overlay]: isRateWidgetOpened });
|
|
99
|
+
const title = costType === 'price' ? t('filters.priceTitle', { currency: '€' }) : t('filters.rateTitle');
|
|
112
100
|
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
</div>
|
|
119
|
-
{costType === 'price' ? this.renderPrice() : this.renderRate()}
|
|
101
|
+
return (
|
|
102
|
+
<div className={containerClassName}>
|
|
103
|
+
<div className={styles.title}>
|
|
104
|
+
<h3 className={styles.titleText}>{title}</h3>
|
|
105
|
+
{renderRadioGroup()}
|
|
120
106
|
</div>
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
107
|
+
{costType === 'price' ? renderPrice() : renderRate()}
|
|
108
|
+
</div>
|
|
109
|
+
);
|
|
110
|
+
};
|
|
124
111
|
|
|
125
112
|
export default Cost;
|
|
@@ -21,20 +21,20 @@ class EmissionSticker extends React.Component<IEmissionStickerProps, {}> {
|
|
|
21
21
|
<div className={styles.wrapStickers}>
|
|
22
22
|
<h3 className={styles.sectionTitle}>{t('filters.fineDustSticker')}</h3>
|
|
23
23
|
{options.map((sticker: string) => {
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
24
|
+
const isNoSticker = sticker === 'selector_emissionSticker_no';
|
|
25
|
+
const type = isNoSticker ? 'text' : 'sticker';
|
|
26
|
+
const icons = EMISSION_STICKERS_ICONS;
|
|
27
27
|
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
28
|
+
const props = {
|
|
29
|
+
type,
|
|
30
|
+
key: sticker,
|
|
31
|
+
name: sticker,
|
|
32
|
+
value: sticker,
|
|
33
|
+
checked: sticker === value,
|
|
34
|
+
content: isNoSticker ? t('filters.no') : <img src={icons[sticker] || null} className={styles.icon} />,
|
|
35
|
+
onChange: this.onFilterChange
|
|
36
|
+
};
|
|
37
|
+
return <CheckboxMaterial {...props} />;
|
|
38
38
|
})}
|
|
39
39
|
</div>
|
|
40
40
|
);
|
|
@@ -49,4 +49,4 @@ class EmissionSticker extends React.Component<IEmissionStickerProps, {}> {
|
|
|
49
49
|
}
|
|
50
50
|
}
|
|
51
51
|
|
|
52
|
-
export default EmissionSticker;
|
|
52
|
+
export default EmissionSticker;
|
|
@@ -88,10 +88,10 @@ const FirstRegistration = ({ controls, onChange, onChangeControls, values, optio
|
|
|
88
88
|
</div>
|
|
89
89
|
</div>
|
|
90
90
|
);
|
|
91
|
-
}
|
|
91
|
+
};
|
|
92
92
|
|
|
93
93
|
export default memo(FirstRegistration, (prevProps: any, nextProps: any) => {
|
|
94
94
|
return prevProps.controls.from === nextProps.controls.from &&
|
|
95
95
|
prevProps.controls.to === nextProps.controls.to &&
|
|
96
|
-
prevProps.values === nextProps.values
|
|
96
|
+
prevProps.values === nextProps.values;
|
|
97
97
|
});
|
|
@@ -58,9 +58,9 @@ const ImagesCount = ({ controls, onChange, onChangeControls, t, values }: IImage
|
|
|
58
58
|
</div>
|
|
59
59
|
</div>
|
|
60
60
|
);
|
|
61
|
-
}
|
|
61
|
+
};
|
|
62
62
|
|
|
63
63
|
export default memo(ImagesCount, (prevProps: any, nextProps: any) => {
|
|
64
64
|
return prevProps.controls.from === nextProps.controls.from &&
|
|
65
|
-
prevProps.controls.to === nextProps.controls.to
|
|
66
|
-
});
|
|
65
|
+
prevProps.controls.to === nextProps.controls.to;
|
|
66
|
+
});
|
|
@@ -62,10 +62,10 @@ const InteriorColor = ({ onChange, values, options, aggregation, t, className }:
|
|
|
62
62
|
<div className={styles.colors}>{renderColors()}</div>
|
|
63
63
|
</div>
|
|
64
64
|
);
|
|
65
|
-
}
|
|
65
|
+
};
|
|
66
66
|
|
|
67
67
|
export default memo(InteriorColor, (prevProps: IInteriorColorProps, nextProps: IInteriorColorProps) => {
|
|
68
68
|
return prevProps.t === nextProps.t
|
|
69
69
|
&& isEqual(prevProps.values, nextProps.values)
|
|
70
|
-
&& isEqual(prevProps.aggregation, nextProps.aggregation)
|
|
70
|
+
&& isEqual(prevProps.aggregation, nextProps.aggregation);
|
|
71
71
|
});
|
|
@@ -62,10 +62,10 @@ const InteriorMaterial = ({ options, values, aggregation, t, onChange }: IInteri
|
|
|
62
62
|
</div>
|
|
63
63
|
</div>
|
|
64
64
|
);
|
|
65
|
-
}
|
|
65
|
+
};
|
|
66
66
|
|
|
67
67
|
export default memo(InteriorMaterial, (prevProps: IInteriorMaterialProps, nextProps: IInteriorMaterialProps) => {
|
|
68
68
|
return prevProps.t === nextProps.t
|
|
69
69
|
&& isEqual(prevProps.values, nextProps.values)
|
|
70
|
-
&& isEqual(prevProps.aggregation, nextProps.aggregation)
|
|
70
|
+
&& isEqual(prevProps.aggregation, nextProps.aggregation);
|
|
71
71
|
});
|
|
@@ -115,7 +115,7 @@ class MakeModel extends React.Component<IMakeModelProps> {
|
|
|
115
115
|
const manufacturerProps = Object.assign({}, MANUFACTURER, { index, name: 'MANUFACTURER', label: t('filters.manufacturerPlaceholder') });
|
|
116
116
|
const modelProps = Object.assign({}, MODEL, { index, name: 'MODEL', label: t('filters.modelPlaceholder'), values: modelValues });
|
|
117
117
|
const subModelProps = Object.assign({}, SUB_MODEL, { index, name: 'SUB_MODEL', placeholder: t('filters.submodelPlaceholder') });
|
|
118
|
-
|
|
118
|
+
|
|
119
119
|
return (
|
|
120
120
|
<div className={styles.mmsGroup} key={index}>
|
|
121
121
|
{this.renderDropDown(manufacturerProps)}
|
|
@@ -162,4 +162,3 @@ export default MakeModel;
|
|
|
162
162
|
|
|
163
163
|
// return prevManifacturer === nextManifacturer && prevModel === nextModel && prevSeries === nextSeries && prevSubModel === nextSubModel;
|
|
164
164
|
// });
|
|
165
|
-
|
|
@@ -2,10 +2,9 @@ import React, { memo } from 'react';
|
|
|
2
2
|
import _get from 'lodash/get';
|
|
3
3
|
import Slider from '../../_common/Slider/Slider';
|
|
4
4
|
import { MILLAGE_FIX, RANGE_FILTERS_DEFAULT_CONTROLS } from '../../../framework/constants/Search';
|
|
5
|
-
import { sliceLessThan, sliceMoreThan } from '../../../framework/utils/CommonUtils';
|
|
5
|
+
import { sliceLessThan, sliceMoreThan, numberWithDot } from '../../../framework/utils/CommonUtils';
|
|
6
6
|
import styles from './commonFilters.styl';
|
|
7
7
|
import MaterialAutocomplete from '../../_common/MaterialAutocomplete/MaterialAutocomplete';
|
|
8
|
-
import { numberWithDot } from '../../../framework/utils/CommonUtils';
|
|
9
8
|
|
|
10
9
|
interface IMileageProps {
|
|
11
10
|
values: any;
|
|
@@ -95,12 +94,12 @@ const Mileage = ({ controls, onChange, onChangeControls, t, values, options }: I
|
|
|
95
94
|
</div>
|
|
96
95
|
</div>
|
|
97
96
|
);
|
|
98
|
-
}
|
|
97
|
+
};
|
|
99
98
|
|
|
100
99
|
export default memo(Mileage, (prevProps: any, nextProps: any) => {
|
|
101
100
|
return prevProps.controls.from === nextProps.controls.from &&
|
|
102
101
|
prevProps.controls.to === nextProps.controls.to &&
|
|
103
102
|
prevProps.t === nextProps.t &&
|
|
104
|
-
prevProps.values === nextProps.values
|
|
103
|
+
prevProps.values === nextProps.values;
|
|
105
104
|
|
|
106
105
|
});
|
|
@@ -37,16 +37,14 @@ class Power extends React.Component<IPowerProps, {}> {
|
|
|
37
37
|
onChange(this.name, controlsObj);
|
|
38
38
|
};
|
|
39
39
|
|
|
40
|
-
|
|
41
40
|
onTypeChange = (_event: React.SyntheticEvent, value: any) => {
|
|
42
41
|
const { controls, onChange, onChangeControls } = this.props;
|
|
43
42
|
const values = this.tempValues ? this.tempValues : controls;
|
|
44
|
-
|
|
43
|
+
|
|
45
44
|
onChangeControls(this.name, { ...values, type: value });
|
|
46
45
|
onChange(this.name, { ...values, type: value });
|
|
47
46
|
};
|
|
48
47
|
|
|
49
|
-
|
|
50
48
|
getOptions = (options: any) => options.map((option: string) => ({
|
|
51
49
|
value: `${option}`,
|
|
52
50
|
label: `${option}`
|
|
@@ -105,7 +103,6 @@ class Power extends React.Component<IPowerProps, {}> {
|
|
|
105
103
|
);
|
|
106
104
|
};
|
|
107
105
|
|
|
108
|
-
|
|
109
106
|
render(): JSX.Element {
|
|
110
107
|
const { t, controls } = this.props;
|
|
111
108
|
const { from = 0, to = 0, type } = controls;
|
|
@@ -153,5 +150,5 @@ export default memo(Power, (prevProps: any, nextProps: any) => {
|
|
|
153
150
|
return prevProps.controls.from === nextProps.controls.from &&
|
|
154
151
|
prevProps.controls.to === nextProps.controls.to &&
|
|
155
152
|
prevProps.controls.type === nextProps.controls.type &&
|
|
156
|
-
prevProps.values === nextProps.values
|
|
157
|
-
});
|
|
153
|
+
prevProps.values === nextProps.values;
|
|
154
|
+
});
|
|
@@ -1,10 +1,9 @@
|
|
|
1
1
|
import React, { memo } from 'react';
|
|
2
2
|
import _get from 'lodash/get';
|
|
3
|
-
import { sliceLessThan, sliceMoreThan } from '../../../framework/utils/CommonUtils';
|
|
3
|
+
import { sliceLessThan, sliceMoreThan, numberWithDot } from '../../../framework/utils/CommonUtils';
|
|
4
4
|
import { PRICES_FIX } from '../../../framework/constants/Search';
|
|
5
5
|
import styles from './commonFilters.styl';
|
|
6
6
|
import MaterialAutocomplete from '../../_common/MaterialAutocomplete/MaterialAutocomplete';
|
|
7
|
-
import { numberWithDot } from '../../../framework/utils/CommonUtils';
|
|
8
7
|
|
|
9
8
|
interface IPriceDifferenceProps {
|
|
10
9
|
values: any;
|
|
@@ -16,7 +15,7 @@ interface IPriceDifferenceProps {
|
|
|
16
15
|
}
|
|
17
16
|
|
|
18
17
|
const PriceDifference = ({ controls, onChange, onChangeControls, t }: IPriceDifferenceProps) => {
|
|
19
|
-
|
|
18
|
+
|
|
20
19
|
const name = 'PRICE_DIFFERENCE';
|
|
21
20
|
|
|
22
21
|
const onDropDownChange = (controlName: string, value: any) => {
|
|
@@ -60,9 +59,9 @@ const PriceDifference = ({ controls, onChange, onChangeControls, t }: IPriceDiff
|
|
|
60
59
|
</div>
|
|
61
60
|
</div>
|
|
62
61
|
);
|
|
63
|
-
}
|
|
62
|
+
};
|
|
64
63
|
|
|
65
64
|
export default memo(PriceDifference, (prevProps: any, nextProps: any) => {
|
|
66
65
|
return prevProps.controls.from === nextProps.controls.from &&
|
|
67
|
-
prevProps.controls.to === nextProps.controls.to
|
|
66
|
+
prevProps.controls.to === nextProps.controls.to;
|
|
68
67
|
});
|
|
@@ -11,7 +11,7 @@ interface IChipFilterItemProps {
|
|
|
11
11
|
|
|
12
12
|
const ChipFilter: React.FunctionComponent<IChipFilterItemProps> = ({ filterKey, filterValue, onClick, keySpecialFilter, index }) => (
|
|
13
13
|
<Chip
|
|
14
|
-
variant=
|
|
14
|
+
variant='outlined'
|
|
15
15
|
label={filterValue}
|
|
16
16
|
onClick= {() => onClick(filterKey, keySpecialFilter, index)}
|
|
17
17
|
onDelete={() => onClick(filterKey, keySpecialFilter, index)}
|
|
@@ -32,7 +32,7 @@ class MakeModel extends React.Component<IMakeModelProps> {
|
|
|
32
32
|
return {
|
|
33
33
|
value: option,
|
|
34
34
|
label: this.renderLabel(option)
|
|
35
|
-
}
|
|
35
|
+
};
|
|
36
36
|
});
|
|
37
37
|
|
|
38
38
|
renderDropDown = (props: any) => {
|
|
@@ -47,7 +47,7 @@ class MakeModel extends React.Component<IMakeModelProps> {
|
|
|
47
47
|
items: bodyType ? this.getOptions(options) : options,
|
|
48
48
|
onChange: (values: any, isSeries?: boolean) => {
|
|
49
49
|
const resultValue = (Array.isArray(values) && bodyType) ? values.map((value: any) => value) : values;
|
|
50
|
-
this.props.onChange(name, resultValue, index, isSeries)
|
|
50
|
+
this.props.onChange(name, resultValue, index, isSeries);
|
|
51
51
|
}
|
|
52
52
|
};
|
|
53
53
|
|
|
@@ -120,7 +120,7 @@ class MakeModel extends React.Component<IMakeModelProps> {
|
|
|
120
120
|
name: 'BODY_TYPE',
|
|
121
121
|
label: t('filters.bodyTypePlaceholder'),
|
|
122
122
|
multiple: true,
|
|
123
|
-
...BODY_TYPE
|
|
123
|
+
...BODY_TYPE
|
|
124
124
|
};
|
|
125
125
|
|
|
126
126
|
return (
|
|
@@ -19,7 +19,7 @@ class BodyType extends React.Component<IBodyTypeBlock> {
|
|
|
19
19
|
const { BODY_TYPE, t, aggregation } = this.props;
|
|
20
20
|
return BODY_TYPE.values.length !== nextProps.BODY_TYPE.values.length
|
|
21
21
|
|| !_isEqual(aggregation, nextProps.aggregation)
|
|
22
|
-
|| t !== nextProps.t
|
|
22
|
+
|| t !== nextProps.t;
|
|
23
23
|
}
|
|
24
24
|
onBodyTypeCheckboxChange = (option: any) => (_: React.ChangeEvent<HTMLInputElement>, checked: boolean) => this.onFilterChange(checked, option);
|
|
25
25
|
|